@charset "utf-8";
.clear:after {content:'';display: block;clear:both;}
.point {color:#05ffea;font-weight: 700;}
.eng, .num {font-family: "Montserrat", sans-serif;}
header {width: 100%;padding:0 100px;height: 100px;background-color: #fff;display: flex;flex-wrap: nowrap;justify-content: space-between;align-items: center;position: fixed;top:0;left:0;z-index: 99;border-bottom: 1px solid #e9e9e9;background-color: #111;}
header h1.logo {color:#ff6825;font-weight: 900;font-size:3.2vh;line-height: 1;}
header h1.logo span {font-style: italic;}
.gnb_m {display: none;}
.gnb li {padding-left:50px;float:left;}
.gnb li a {line-height: 100px;font-size:1.8vh;font-weight: 700;color:#fff;transition: all 0.25s ease;}
.gnb li a:hover {color:#ff6825;}
.main_visual {overflow: hidden;margin-top: 100px;background-color: #141414;padding-bottom: 150px;}
.swiper-pagination {bottom: -50px !important;}
.main_visual .text {position: relative;margin-top:100px;color:#fff;text-align: center;}
.main_visual .text h2:first-child {margin-bottom: 30px;}
.main_visual .text h2:first-child:after {content:'';display: block;width: 5px;height: 5px;border-radius: 5px;background-color: #fff;position: absolute;bottom:-20px;left:50%;transform: translateX(-50%);;}
.main_visual .text span {display: block;font-size:2.3vh;margin-top:30px;}
.main_visual .text h2, .section01 h2 {font-size:7.5vh;font-weight: 700;}
.main_visual .text button {margin-top:50px;border:2px solid #ff6825;background-color:transparent;border-radius: 100px;padding:15px 30px;font-weight: 700;}
.main_visual .text button a {font-size:2vh;color:#ff6825;}
.main_visual .swiper-backface-hidden .swiper-slide {transform: translateZ(0) scale(0.8);border-radius: 20px;overflow: hidden;filter: drop-shadow(2px 4px 6px black);
border: 1px solid #333;}
.main_visual .swiper-backface-hidden .swiper-slide-active {transform: translateZ(0) scale(1.1);}
.main_visual .swiper-slide img {width: 100%;}
.main_visual .text button i.xi-telegram {margin-right: 5px;}
.main_visual .text button i.xi-angle-right {margin-left: 15px;}
.roll {margin-top:80px;}
.roll .swiper-wrapper {align-items:center;}
.swiper-pagination-bullet-active {background:#fff;}
.swiper-pagination-bullet {background:#fff;margin:0 7px !important;}
.swiper-pagination-bullet:after {content:'';display: block;border:1px solid #fff;width: 13px;height: 13px;border-radius: 13px;position:absolute;left:50%;top:50%;transform: translate(-50%, -50%);}
main > .section01 {background-color: #ff6825;padding:150px 100px;text-align: center;}
main > .section01 ul {max-width: 1200px;margin: 200px auto 100px auto;}
main > .section01 ul li {width: 30%;float: left;}
main > .section01 ul li .txt {z-index: 1;padding: 0 50px;}
main > .section01 ul li:after {content:'';display:block;position:absolute;left:50%;top:50%;transform:translate(-50%, -50%);background-color: #fff;border:2px solid #111;border-radius: 100%;width: 100%;height: 0;padding-bottom: 100%;z-index: 0;}
main > .section01 ul li:nth-child(2) {margin:0 5%;}
main > .section01 h2, main > .section01 p {color:#Fff;}
main > .section01 h2 {font-size:4.8vh;margin-bottom: 50px;}
main > .section01 > p {font-size:2.7vh;}
main > .section01 .num {color:#ff6825;font-weight: 600;font-size: 2vh;}
main > .section01 .txt p {color:#111;margin:15px 0 30px 0;font-weight: 900;font-size: 2.7vh;}
main > .section01 .txt span {font-size:2vh;}
main > .section01 .img {margin-right: 5px;}

main > .section02 {background-image: url('/images/sec02_bg.jpg');background-repeat: no-repeat;background-size: cover;background-position: center;height: 780px;display: flex;flex-wrap: wrap;justify-content: center;align-items: center;color:#fff;text-align: center;}
main > .section02 h1 {font-size:6vh;margin-bottom: 50px;line-height: 1.5;font-weight: 900;}
main > .section02 h1 span {color:#ff6825}
main > .section02 p {font-size: 2.2vh;}
main > .section02 p strong {font-weight: 800;line-height: 1.5;}

main > .section03 {background-color: #111;color:#fff;padding:50px 100px;}
main > .section03 ul {max-width: 1200px;width: 100%;margin:0 auto;}
main > .section03 ul li {float:left;width:calc(50% - 30px);border:1px solid #fff;padding:40px 40px 22% 40px;height: 0;}
main > .section03 ul li:nth-child(odd) {margin-right: 60px;}
main > .section03 ul li p {font-size:2.7vh;font-weight: 700;margin:20px 0 30px 0;}
main > .section03 ul li span {font-size:2.2vh;line-height: 1.5;}
main > .section03 ul li:nth-child(1), main > .section03 ul li:nth-child(2) {margin-bottom: 60px;}
main > .section04 {padding:150px 100px;display: flex;flex-wrap: wrap;justify-content: center;}
main > .section04 h2 {font-size:7vh;font-weight: 900;color:#3e3e3e;margin-bottom:150px;width: 100%;text-align: center;}
main > .section04 h2 span {color:#ff6825;}
main > .section04 li {float:left;width: 400px;text-align: center;}
main > .section04 li img {display: inline-block;}
main > .section04 li > span {display: block;font-size:2.1vh;margin-top:20px;font-weight: 500;color:#3e3e3e;}
main > .section04 li p {font-size:10vh;font-weight: 900;color:#3e3e3e;margin-top:40px;}
main > .section04 li p span {font-size:5.5vh;font-weight: 700;}

main > .section05 {margin-top:75px;display: flex;justify-content: center;flex-wrap: wrap;padding: 75px 100px;}
    main > .section05 h1 {font-size:7vh;font-weight: 900;width: 100%;color:#fff;}
    main > .section05 p {height:120px;border-radius: 20px;filter: drop-shadow(0,0,5px,0.3);background-color: #fff;margin-top:50px;margin-bottom: 15px;font-size: 4vh;width:100%;font-weight: 900;display: flex;flex-wrap: nowrap;justify-content: center;align-items: center;background-image: url("/images/sec05_logo.jpg");background-repeat: no-repeat;background-position: 50px;background-size: 130px;}
    main > .section05 > span {margin-left:20px;display: block;width: 100%;}
    main > .section05 > span strong {font-weight: 700;}
    main > .section05 ul {margin-top:70px;}
    main > .section05 ul li {float:left;width: 24%;margin-right:calc(4% /3);display: none;margin-bottom: 50px;}
    main > .section05 ul li img {width: 100%;}
    main > .section05 ul li:nth-child(4n) {margin-right:0;}
    main > .section05 button {margin-top:40px;background: linear-gradient(180deg, #ff6825 0%, #ff4c00 50%, #ff9566 100%);color:#fff;border-radius: 100px;font-size:2vh;padding:15px 70px;border:none;cursor: pointer;}
    main > .section05:after {content:'';display: block;width: 100%;height: 650px;background: linear-gradient(180deg, #ff6825 0%, #ff4c00 50%, #ff9566 100%);;position: absolute;left:0;top:0;z-index: -1;}

main > .contact {background-position: center;background-repeat: no-repeat;background-attachment: fixed;background-image: url("/images/contact_bg.jpg");background-size: cover;height: 400px;}

main > .section03 li {width: 25%;float:left;}
main > .contact .text {position: absolute;left:50%;top:50%;transform:translate(-50%, -50%);z-index: 9;color:#fff;text-align: center;width: 80%;}
main > .contact .text span {display: block;font-size:3.2vh;margin-bottom:10px;}
main > .contact .text span.type {font-size:2vh;}
main > .contact .text h2 {font-size:5.5vh;font-weight: 700;}
main > .contact .text button {margin-top:20px;background: linear-gradient(180deg, #a529ff 0%, #8237fe 100%);border-radius: 100px;padding:15px 30px;border:none;}
main > .contact .text button a {color:#fff;font-size:2vh;}
main > .contact .text button i {margin-right: 5px;}
main > .contact .text button i.xi-angle-right {margin-left:15px;}
footer {padding:30px 0;display: flex;flex-wrap: wrap;justify-content: center;text-align: center;}
footer span {width: 100%;font-size:1.2vh;}
footer .logo {filter: grayscale(1);opacity: 0.5;margin-bottom: 10px;}

    @keyframes neon {
      0% {
        filter: drop-shadow(0px 0px 3px #fe0000);
      }  100% {
        filter: drop-shadow(0px 0px 0px #fe0000);
      }
    }

    @media screen and (max-width:1024px) {
        header {padding: 0 30px;height: 70px;}
        .main_visual {margin-top: 70px;}
        main > .section01 h2 {margin-bottom: 30px;}
        main > .section01, main > .section04 {padding: 100px 50px;}
        main > .section01 ul {margin: 150px auto 50px auto;}
        main > .section02 {height: 80vh;}
        main > .section03 {padding:50px 50px;}
        main > .section03 ul li:nth-child(1), main > .section03 ul li:nth-child(2) {margin-bottom: 30px;}
        main > .section03 ul li:nth-child(odd) {margin-right: 30px;}
        main > .section03 ul li {width: calc(50% - 15px);padding: 40px 40px 28% 40px;}
        main > .section04 h2 {margin-bottom: 100px;}
        main > .section05 {margin-top: 0;padding: 75px 50px;}
        main > .section05 p {font-size:3vh;background-size: 100px;background-position: 30px;}
        main > .section05:after {height: 550px;}
        main > .section05 ul {margin-top: 50px;}
        
    }
    @media screen and (max-width:768px) {        
        .gnb_m .close {display: none;}
        .gnb_m {display: block;color:#fff;}
        .gnb {display: none;}
        .gnb_m ul {display: none;position: fixed;top:70px;left:0;background-color: #111;width: 100%;justify-content: center;border-bottom: 1px solid #e9e9e9;}
        .gnb_m ul li {float:left;line-height: 50px;padding:0 30px;color:#fff;}
        .gnb_m ul li, main > .section05 > span {font-size:2.5vw}
        .gnb_m ul li a {color:#fff;}
        .gnb_m h2 {font-size:4vw;}
        .swiper-pagination {bottom:-85px}
        .main_visual .text h2, .section01 h2, main > .section02 h1, main > .section05 h1 {font-size:9vw;}
        .main_visual .text span, main > .section01 > p, main > .section01 .num, main > .section02 p strong, header h1.logo, main > .section05 p, main > .contact .text span {font-size: 3vw;}        
        main > .contact .text span.type {font-size:1.5vw;} 
        .main_visual .text button a, main > .section01 .txt span, main > .section03 ul li span, main > .section04 li > span, main > .contact .text button a, main > .section05 button {font-size: 2.7vw;}
        main > .section01 .txt p, main > .section03 ul li p {font-size: 3.2vw;}
        main > .section01 h2, main > .section05 h1, main > .contact .text h2 {font-size:7vw;}
        main > .section01 ul li {width: 45%;}
        main > .section01 ul li:first-child {margin: auto calc(55% / 2)}
        main > .section01 ul li:nth-child(2), main > .section01 ul li:nth-child(3) {margin:120px 2% 0 2%;}
        main > .section01 ul {margin: 120px auto 50px auto;}
        main > .section02 {height: 60vh;}
        main > .section03 ul li {width: 100%;margin-right: 0 !important;margin-bottom: 30px !important;padding-bottom: 30px;height: auto;}
        main > .section04 li {width: 50%;}
        main > .section04 ul {width: 100%;}
        main > .section04 li p, main > .section04 h2 {font-size: 9vw;}
        main > .section04 li p span {font-size: 5vw;}
        main > .section05 p {height: 150px;background-position: center 20px;text-align: center;padding:20px;align-items: self-end;margin-top: 30px;}
        main > .section05 ul li {width: 48%;margin-right: 2%;margin-bottom: 30px;}
        main > .section05 ul li:nth-child(2n) {margin-right: 0;}
        main > .contact {height: 300px;}
        footer span {font-size:1.8vw}
    }
    @media screen and (max-width:550px) {
        header {padding: 0 15px;height: 50px;}
        .gnb_m ul {top: 50px;}
        .gnb_m h2 i {font-size:7vw;}        
        .main_visual {margin-top: 50px;padding-bottom: 100px;} 
        .main_visual .text h2:first-child {margin-bottom: 15px;}
        .main_visual .text h2:first-child:after {bottom: -13px;}
        .main_visual .text {margin-top: 70px;padding:0 10px;}
        .main_visual .text h2, .section01 h2, main > .section02 h1, main > .section05 h1 {font-size:10vw;}
        .main_visual .text span, main > .section01 > p, main > .section01 .num, main > .section02 p strong, header h1.logo, main > .section05 p, main > .contact .text span {font-size:4vw;}
        main > .contact .text span.type {font-size:2vw;}
        .main_visual .text button a, main > .section01 .txt span, main > .section03 ul li span, main > .section04 li > span, main > .contact .text button a, main > .section05 button {font-size:4vw;}
        .roll {margin-top: 50px;}
        main > .section01, main > .section04 {padding: 50px 30px;}
        main > .section01 ul {display: flex;justify-content: center;flex-wrap: wrap;}
        main > .section01 ul li:first-child {margin:0 0 ;}
        main > .section01 ul li {width:80%;margin:0 auto;}
        .main_visual .text span, main > .section01 > p, main > .section01 .num, main > .section02 p strong, header h1.logo, main > .section05 p, main > .contact .text span {font-size:5vw;}
        main > .contact .text span.type {font-size:2.5vw;}
        main > .section01 .txt p, main > .section03 ul li p {font-size:5vw;}
        main > .section01 ul li:nth-child(2), main > .section01 ul li:nth-child(3) {margin: 95px 2% 0 2%;}
        main > .section01 ul li .txt {padding: 0 40px;}
        main > .section01 .txt p {margin: 10px 0 20px 0;}
        main > .section01 ul {margin: 120px auto 100px auto;}
        main > .section02 {height: 50vh;}
        main > .section02 .txt {padding:0 10px;}
        main > .section02 h1 {line-height: 1.2;}
        main > .section03 {padding: 50px 10px;}
        main > .section03 ul li {padding:20px 20px 20px 20px;}
        main > .section03 ul li p {margin: 10px 0 20px 0;}
        main > .section04 li p, main > .section04 h2 {font-size: 10vw;}
        main > .section04 h2 {margin-bottom: 50px;}
        main > .section04 li p span {font-size: 6vw;}
        main > .section05 {padding: 50px 10px;}
        main > .section05 p {background-position: center 15px;background-size: 85px;}
        .gnb_m ul li, main > .section05 > span {font-size: 3.5vw;} 
        main > .section05 ul {margin-top: 30px;}
        main > .section05:after {height: 470px;}
        main > .section05 button {margin-top: 30px;}
        main > .contact {background-position: bottom;background-size: auto;height: 250px;}
        footer span {font-size: 2.8vw;}
        .gnb_m ul li {line-height: 40px;padding:0 20px;}
    }
    @media screen and (max-width:320px) {
        .gnb_m ul li {font-size: 4vw;padding: 0 10px;}    
        .main_visual .text span {margin-top:10px;}    
        main > .section01 ul li:nth-child(2), main > .section01 ul li:nth-child(3) {margin: 80px 2% 0 2%;}
        main > .section01 ul li {width: 80%;}
        main > .section01 ul {margin: 100px auto 70px auto;}
        main > .section01, main > .section04 {padding:50px 10px;}
        main > .section02 h1 {margin-bottom: 10px;}
        main > .section03 ul li {margin-bottom: 10px !important;}
        main > .section04 h2 {margin-bottom: 20px;}
        main > .section04 li > span {margin-top: 10px;}
        main > .section04 li p {margin-top: 10px;}
        main > .section04 li {width: 100%;}
        main > .section04 li:first-child {margin-bottom: 20px;}
        main > .section05 ul {margin-top: 20px;}
        main > .section05:after {height: 430px;}
        main > .section05 ul li {margin-bottom: 10px;}
        main > .section05 button {margin-top: 10px;}
        main > .contact {height: 200px;}
        footer {padding: 10px 0;}
    }