/*공통*/

.visual {position:relative;z-index: 1;}
.visual .v_bgwrap{position:absolute; top:0;  left:0; width:100%; height:100%;  z-index:1;}
.visual .v_bgwrap>div{position:relative; width:100%; height:100%; overflow:hidden}
.visual .v_bgwrap::after{position:absolute;  top:0; left:0; width:100%; height:100%; background-color:rgba(255,255,255,0.3); z-index:2; content:''}
 
.visual .v_bg>div{position:absolute; top:0; left:0; width:100%; height:100%;}
@media (min-aspect-ratio: 16/9) {
  .visual .v_bg>div {
    height: 300%;
    top: -100%;
  }
}
@media (max-aspect-ratio: 16/9) {
  .visual .v_bg>div {
    width: 300%;
    left: -100%;
  }
}


.visual .inbox{position:relative; z-index:2}
.v_txt{position:relative;}
.v_txt div{position:absolute;left:0;opacity: 0 !important;}
.v_txt div.swiper-slide-active{opacity:1 !important;}
.v_txt a{display:block; opacity:0; -webkit-animation-fill-mode:both;animation-fill-mode:both}
.v_txt h3{background: linear-gradient(to right, #0068b7, #16a693); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-weight:900;}
.v_txt p{color:#201716; font-weight:500}
.v_txt strong{position:relative;display:inline-block;color:#201716;font-weight:500;z-index:1;padding-left: 0.5%;}
.v_txt strong::after{position:absolute;top: -4%;left: 0;width: 102%;height: 108%;background: linear-gradient(to right, #0068b7, #16a693);content:'';z-index:-1;transform-origin: 0 50%;transform:scaleX(0)}

.animated.text_bg{animation-fill-mode: forwards; -webkit-animation-fill-mode: forwards;}
.animated.text_bg::after{-webkit-animation-name:underline;animation-name:underline;   animation-duration: 0.7s;animation-delay: 1.6s; -webkit-animation-fill-mode:both;animation-fill-mode:both}

.tit{font-weight:900; line-height:1.15em}
.tit2{font-weight:900; line-height:1.15em}


.con1 .con_box h3{position:relative; background: linear-gradient(to right, #0068b7, #16a693); -webkit-background-clip: text; -webkit-text-fill-color: transparent; font-weight:900;}
.con1 .con_box h3::after{position:absolute; content:''; background:#0068b7; border-radius:50%;-webkit-transform:translateZ(0);transform:translateZ(0)}
.con1 .con_box h3.animate__animated.animate__bo::after{-webkit-animation-name:bounce;animation-name:bounce;   animation-duration: 1s;animation-delay: 0.5s; -webkit-animation-fill-mode:both;animation-fill-mode:both}
.con1 .con_box span{display:block; color:#201716; font-weight:600;}
.con1 .con_box p{color:#201716; font-weight:400; line-height:1.5em}

.con2 p{color:#9adcdd; line-height:1.4em}

.app_box {text-align:center; font-size:0;}
.app_box img{display:inline-block;}

.con2 .app_box div{text-align:center;}
.con2 .app_box div a{display:inline-block; vertical-align:middle}


.con3{}
/*.con3.fixed{top:50%; left:0; width:100%; height:100%; transform:translate(0, -50%);}*/
.con3 .inbox{position:relative;}
.con3  .study_slide{}
.con3  .study_slide>div{vertical-align:middle;position: relative;top: 50%;transform: translate(0, -50%);}
.con3 .swiper-wrapper{}
.con3  .study_slide li{opacity:0.1;}
.con3  .study_slide li.swiper-slide-active{opacity:1;}
.con3  .study_slide li h5{font-weight:900}
.con3  .study_slide li p{color:#201716; line-height:1.3em}

.con3 .phone{position:absolute;}

.con3 h5 span{line-height:1.2em; font-weight:900;} 
.con3 .phone p{color:#201716; line-height:1.3em} 


.con4{}
.con4 .inbox{position:relative; }
.con4 .inbox>p{position:absolute; color:#9adcdd; line-height:1.2em}



.con4 .comment_box{position:relative;}
 
.con4 .comment_box h5{position: relative;color:#fff;font-weight:900;line-height: 1.1em;word-break: keep-all;letter-spacing: 0;}
.con4 .comment_box h5 span{position: absolute;top: 0;left: 0;color:#26f4d9;font-weight:bold;line-height: 1.1em;}
.con4 .comment_box li p{color:#9adcdd; line-height:1.3em}
.con4 .comment_box li{border-bottom:1px solid #9adcdd;overflow: hidden;}
.con4 .comment_box li.last{border-bottom:0;}





.con5 .inbox>p{color:#201716; line-height:1.3em}

.con5 .maintab{}
.con5 .maintab div{border-top:1px solid #dcdcdc;overflow:hidden;}
.con5 .maintab img{display:block;animation: loop 30s infinite linear 1s both;-webkit-animation: loop 30s infinite linear 1s both;}
.con5 .maintab div:hover img{animation-play-state: paused;}
.con5 .levtest{position:relative;}
.con5 .levtest p{color:#201716;line-height: 1.2em;}
.con5 .levtest .btn{display:block;}
  
.con5 .levtest p span{position:relative;}
.con5 .levtest p span font{position:absolute;top:-1%;display:block;height:102%;left:-1%;width: 101%;background-color:#fff;animation-direction: reverse; transform-origin: 100% 50%;}



.con6{}
.con6 li{background-color:#fff;}
.con6 li div span{color:#201716; font-weight:300;}
.con6 li div span img{}
.con6 li div h5{color:#201716; font-weight:bold; text-align:center; line-height:1.2em}
.con6 li div p{color:#201716; font-weight:300; text-align:center; line-height:1.4em}



.con7 .inbox{display:table;}
.con7 .inbox div{display:table-cell;}



@media (min-width: 649px){
/*p t 공통*/ 

.con1 li{font-size:0;}
.con1 li>div{display:inline-block; vertical-align:middle;}
}

@media (min-width: 1358px){
/*pc*/
.visual video{position:absolute;top: 50%;left: 50%;width: 100%;height: 100%;transform: translate(-50%,-50%);}
.visual .v_bg>div img{width:100%; height:100%;}
 
.visual{}
.visual .v_bgwrap{}
.v_txt{height:870px;}
.v_txt div{top:257px;}
.v_txt a{width:340px; bottom:257px; height:80px; line-height:80px; font-size:23px;}

.v_txt h3{font-size:80px;}
.v_txt p{font-size:23px;margin: 25px 0 60px;}
.v_txt strong{font-size:40px; margin-bottom:30px}


.main_section{padding:190px 0 200px;}






.con1{}
.con1 .con_box{padding-left:50px}
.con1 .con_box h3{font-size:80px;}
.con1 .con_box h3::after{top: -10px;left: 19px;width:12px;height:12px;}
.con1 .con_box span{margin:25px 0 50px;font-size:45px;}
.con1 .con_box p{font-size:23px;}

.con1 .sec {margin:20px 0;}
.con1 .sec .con_box{padding-left:0; padding-right:50px}


.con2 p{margin:50px 0 120px; font-size:23px;}

.app_box img{width:370px; box-shadow: 0 0 30px rgba(0,0,0,0.2) ;border-radius:45px;}
.app_box .sec{margin:0 120px}


.con2 .app_box div{margin-top:120px;}
.con2 .app_box div a{width:340px; height:75px; line-height:75px; font-size:23px; margin:0 5px;}


.con3 .study_slide{ height:870px;}

.con3  .study_slide li {width:945px;}
.con3  .study_slide li h5{font-size:60px; margin-bottom:20px}
.con3  .study_slide li p{font-size:23px;}

.con3 .phone{top: 50%;left:50%;width:475px;height:870px;padding:145px 50px 0;background:url(../images/pc/main/phone.png) no-repeat 50%;box-shadow: 9px 9px 30px rgb(0 0 0 / 20%);border-radius: 53px;transform: translate(-50%,-50%);z-index: 1;}


.con3 h5{margin-bottom:20px;}
.con3 h5 span{font-size:60px;}
.con3 .phone p{font-size:30px; margin-bottom:20px;}
.con3 .phone .swiper-pagination{margin-top:20px;}
.con3 .phone .swiper-pagination-bullet{width:35px; height:7px;}


.con4 .inbox>p{top:170px; right:236px; font-size:40px;}

.con4 .comment_box{margin-top:110px; padding: 0 0 110px 755px;}
.con4 .comment_box img{position:absolute;top:0;left:0;width:auto;border-radius:45px;}
.con4 .comment_box li{padding:45px 0}

.con4 .comment_box h5,.con4 .comment_box h5 span{font-size:60px;}
.con4 .comment_box h5{margin-bottom:25px;padding-left: 95px;}
.con4 .comment_box h5 span{margin-right:5px;}
.con4 .comment_box p{padding-left:95px; font-size:23px;}



.con5 h3{margin-bottom:50px}

.con5 .inbox>p{font-size:23px;}


.con5 .levtest{padding-left:705px;padding-top: 70px;}

.con5 .maintab{position:absolute;top: 65px;left:0;width:602px;height:700px;border-radius:48px;box-shadow: 10px 10px 30px rgb(0 0 0 / 20%);padding-top:83px;background:url(/phone/images/pc/main_level.png) no-repeat 50%;}
.con5 .maintab div{width: 596px;margin:0 auto;height: 615px;border-radius: 0 0 48px 48px;}
.con5 .maintab img{width:573px; margin:0 auto;}

.con5 .levtest p{font-size:50px;}
.con5 .levtest .btn{width:340px; height:80px; line-height:80px; font-size:23px; margin-top:65px;}
 
 
.con6 .inbox{padding:0 55px;}
.con6 h3{margin-bottom:80px;}
.con6 li{width:400px; margin-right:25px;}
.con6 li div{padding:50px 25px 0}
.con6 li div span{font-size:23px;}
.con6 li div span img{width:auto; margin-right:5px;}
.con6 li div h5{font-size:40px; margin:30px 0;}
.con6 li div p{font-size:23px; height:240px}
.con6 .swiper-pagination{margin-top:20px;}
.con6 .swiper-pagination-bullet{width:35px; height:7px;}



.con7{background:url(../images/pc/main/request.png) no-repeat 50%;}
.con7 .inbox p{}
.con7 .inbox a{display:block; width:340px; height:80px; line-height:80px; font-size:23px; margin-top:50px;}

 
}

@media (min-width:650px) and (max-width:1357px){
/*tab*/ 
.visual video{position:absolute;top: 50%;left: 50%;width: 108%;height: 133%;transform: translate(-50%,-50%);}

.visual .v_bg img {
    height: 118%;
    position: relative;
    top: -11%;
    width: 37%;
    left: 32%;
}
.visual{}
.visual .v_bgwrap{}
.v_txt{height:50vw;}
.v_txt div{top:11.5vw;} 
.v_txt a{width:28vw; bottom:11.8vw; height:6vw; line-height:6vw; font-size:2vw;}

.v_txt h3{font-size:5.8vw;}
.v_txt p{font-size: 1.7vw;margin: 1.5vw 0 2vw;}
.v_txt strong{font-size:2.9vw; margin-bottom:2vw}


.main_section{padding:16.8vw 0 16.5vw;}




.con1{}
.con1 .con_box{padding-left:2vw}
.con1 .con_box h3{font-size:5.8vw;}
.con1 .con_box h3::after{top: -1vw;left: 1vw;width:1vw;height:1vw;}
.con1 .con_box span{margin:2.5vw 0 3vw;font-size:3.3vw;}
.con1 .con_box p{font-size:1.6vw;}

.con1 .con1_1 img{width:51.1vw}
.con1 .con1_2 img{width:40.5vw}
.con1 .con1_3 img{width:53.8vw}

.con1 .sec {margin:1.7vw 0;}
.con1 .sec .con_box{padding-left:0; padding-right:2vw}


.con2 p{margin:3.5vw 0 8vw; font-size:1.6vw;}

.app_box img{width:27.4vw; box-shadow: 0 0 2.5vw rgba(0,0,0,0.2) ;border-radius:5vw;}
.app_box .sec{margin:0 4.5vw}


.con2 .app_box div{margin-top:8vw;}
.con2 .app_box div a{width:28.5vw; height:6.5vw; line-height:6.5vw; font-size:2vw; margin:0 0.4vw;}


.con3 .study_slide{ height:72.5vw;}

.con3  .study_slide li {width:67vw;}
.con3  .study_slide li h5{font-size:4.1vw; margin-bottom:3vw}
.con3  .study_slide li p{font-size:1.6vw;}

.con3 .phone{top: 50%;left:50%;width:39.5vw;height:72.5vw;padding:9vw 2.5vw 0;background:url(../images/tab/main/phone.png) no-repeat 50%; background-size:100% auto !important; box-shadow:1vw 1vw 2.5vw rgb(0 0 0 / 20%);border-radius:5vw;transform: translate(-50%,-50%);z-index: 1;}


.con3 h5{margin-bottom:1.5vw;}
.con3 h5 span{font-size:4.1vw;}
.con3 .phone p{font-size:2vw; margin-bottom:2.5vw;}
.con3 .phone .swiper-pagination{margin-top:2.5vw;}
.con3 .phone .swiper-pagination-bullet{width:3vw; height:0.5vw;}


.con4 .inbox>p{top:14.5vw; right:17.4vw; font-size:2.9vw;}

.con4 .comment_box{margin-top:5vw; padding: 0 0 11vw 50vw;}
.con4 .comment_box img{position:absolute;top:0;left:0;width: 49vw;border-radius:5vw;/* box-shadow:0 0 2.5vw rgba(0,0,0,0.2) */}
.con4 .comment_box li{padding:4.5vw 0}

.con4 .comment_box h5,.con4 .comment_box h5 span{font-size:4.1vw;}
.con4 .comment_box h5{margin-bottom:1.5vw;padding-left: 7vw;}
.con4 .comment_box h5 span{margin-right:1vw;}
.con4 .comment_box p{padding-left:7vw; font-size:1.6vw;}



.con5 h3{margin-bottom:3vw}
.con5 .inbox>p{font-size:1.6vw;}

.con5 .maintab{position:absolute;top: 7.2vw;left:0;width: 40vw;border-radius: 4vw;box-shadow: 1vw 1vw 2.5vw rgb(0 0 0 / 20%);padding-top:6.8vw;height:58.3vw;background:url(/phone/images/tab/main_level.png) no-repeat 50%;background-size:100% auto;}
.con5 .maintab div{width: 39.5vw;margin:0 auto;height: 51.25vw;border-radius: 0 0 4vw 4vw;}
.con5 .maintab img{width:38.5vw; margin:0 auto;}


.con5 .levtest{padding-left:43.6vw;padding-top: 11.5vw;}
.con5 .levtest img{}
.con5 .levtest p{font-size:3.7vw;line-height: 1.3em;}
.con5 .levtest p br.pc_line{display:none;}
 
.con5 .levtest .btn{width:28vw; height:6vw; line-height:6vw; font-size:2vw; margin-top:3vw;}
 
 
.con6 h3{margin-bottom:8vw;}
.con6 li{width:28vw;margin-right: 2vw;}
.con6 li div{padding:1.8vw 2vw 0}
.con6 li div span{font-size:1.6vw;}
.con6 li div span img{width:4.1vw; margin-right:1vw;}
.con6 li div h5{font-size:2.9vw; margin:3vw 0;}
.con6 li div p{font-size:1.6vw; height:16vw}
.con6  .swiper-pagination{margin-top:2.5vw;}
.con6  .swiper-pagination-bullet{width:3vw; height:0.5vw;}



.con7{background:url(../images/tab/main/request.png) no-repeat 50%; background-size:cover}
.con7 .inbox p{}
.con7 .inbox a{display:block; width:28vw; height:6.5vw; line-height:6.5vw; font-size:1.9vw; margin-top:4vw;}



}

@media (max-width:649px){
/*mb*/
.visual video{position:absolute;top: 50%;left: 50%;width: 104%;height: 104%;transform: translate(-50%,-50%);}
.visual .v_bg img {
    width: 63%;
    height: 100%;
    left: 23%;
    position: relative;
}
.visual{}
.visual .v_bgwrap{}
.v_txt{height:100vw;}
.v_txt div{top:57.5vw;} 
.v_txt a{width:34vw; bottom:15vw; height:8vw; line-height:8vw; font-size:3vw;}

.v_txt h3{font-size: 7.5vw;}
.v_txt p{font-size:3vw;margin: 1.6vw 0 4vw;}
.v_txt strong{font-size: 4vw;margin-bottom:1.6vw}


.main_section{padding:17.5vw 0 18vw;}





.con1{}
.con1 .con_box img{width:100%}
 
.con1 .con_box h3{font-size: 10vw;}
.con1 .con_box h3::after{top: -1vw;left: 2.6vw;width: 1vw;height: 1vw;}
.con1 .con_box span{margin: 0vw 0 4vw;font-size:6vw;}
.con1 .con_box p{font-size:4vw;}
.con1 .img_box {margin-bottom:7.5vw}
.con1 .sec {margin:9.5vw 0;}

 
 
.con2 p{margin:3.5vw 0 9vw; font-size:3vw;}

.app_box img{display:block; width:55.5vw; box-shadow: 0 0 3vw rgba(0,0,0,0.2) ;border-radius:5vw; margin:9vw auto 0}



.con2 .app_box div{margin-top:9vw;}
.con2 .app_box div a{width:36vw; height:12vw; line-height:12vw; font-size:3.5vw; margin:0 1.8vw;}


.con3 .study_slide{ height:87vw;}

.con3  .study_slide li {width:100%;}
.con3  .study_slide li h5{font-size:7vw; margin-bottom:4vw}
.con3  .study_slide li p{font-size:3vw;}

.con3 .phone{top: 50%;right:0;width:47.5vw;height:87vw;padding:12vw 5vw 0;background:url(../images/mb/main/phone.png) no-repeat 50%;background-size:100% auto !important;box-shadow:1vw 1vw 3vw rgb(0 0 0 / 20%);border-radius:5vw;transform: translate(0,-50%);z-index: 1;}


.con3 h5{margin-bottom:2vw;}
.con3 h5 span{font-size:6vw;}
.con3 .phone p{font-size:3.5vw; margin-bottom:2.5vw;}
.con3 .phone .swiper-pagination{margin-top:2.5vw;}
.con3 .phone .swiper-pagination-bullet{width:7.5vw; height:1.5vw;}


.con4 .inbox>p{top:21vw; right:0vw; font-size:3vw;}

.con4 .comment_box{margin-top:8.5vw; }
.con4 .comment_box img{display:block;width: 100vw;border-radius:5vw;}
.con4 .comment_box ul{padding:0 5vw}
.con4 .comment_box li{padding:7vw 0}

.con4 .comment_box h5,.con4 .comment_box h5 span{font-size:7vw;}
.con4 .comment_box h5{padding-left: 12vw;margin-bottom:1.5vw;}
.con4 .comment_box h5 span{margin-right:1vw;}
.con4 .comment_box p{padding-left:12vw; font-size:3.5vw;}



.con5 h3{margin-bottom:5vw}
.con5 .inbox>p{font-size:3vw;}


.con5 .maintab{display: block;width: 79.6vw;border-radius:5vw;margin:0 auto 6vw;box-shadow: 1vw 1vw 3vw rgb(0 0 0 / 20%);padding-top:10.9vw;height:92.5vw;background:url(/phone/images/mb/main_level.png) no-repeat 50%;background-size:100% auto;}
.con5 .maintab div{width:78.9vw;margin:0 auto;height: 81.1vw;border-radius: 0 0 4vw 4vw;}
.con5 .maintab img{width:74.7vw; margin:0 auto;}


.con5 .levtest{ margin-top:8.5vw;}
.con5 .levtest img{}
.con5 .levtest p{font-size:6vw;line-height: 1.3em;}
.con5 .levtest p br.pc_line{display:none;}
 
.con5 .levtest .btn{width:34vw; height:10vw; line-height:10vw; font-size:3.5vw; margin-top:9vw;}
 
 
.con6 h3{margin-bottom:9vw;}
.con6 li{width:48vw;margin-right: 3vw;}
.con6 li div{padding: 4.5vw 2.6vw 0;}
.con6 li div span{font-size:3vw;}
.con6 li div span img{width:5vw; margin-right:1vw;}
.con6 li div h5{font-size:6vw;margin: 5vw 0;}
.con6 li div p{font-size:3vw; height:26vw}
.con6 .swiper-pagination{margin-top:2.5vw;}
.con6 .swiper-pagination-bullet{width:7.5vw; height:1.5vw;}



.con7{background:url(../images/mb/main/request.png) no-repeat 50%; background-size:cover}
.con7 .inbox p{}
.con7 .inbox a{display:block; width:34vw; height:8vw; line-height:8vw; font-size:3vw; margin-top:7vw;}


 
}