@charset "uft-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100;300;400;500;700;900&display=swap');

/* 메인, 서브 공통 css */
*{ margin: 0; padding: 0; box-sizing: border-box;}
ol, ul, li{ list-style: none;}
a{ outline: 0; text-decoration: none; color: inherit;}
img{ border: 0; image-rendering: -moz-crisp-edges; image-rendering: -o-crisp-edges; image-rendering: -webkit-optimize-contrast; image-rendering: crisp-edges; -ms-interpolation-mode: nearest-neighbor;}
input, textarea, select{ outline: none; border: 0;} 
input:focus::-webkit-input-placeholder, textarea:focus::-webkit-input-placeholder{ color: transparent;}
input:focus:-moz-placeholder, textarea:focus:-moz-placeholder{ color: transparent;}
input:focus::-moz-placeholder, textarea:focus::-moz-placeholder{ color: transparent;}
input:focus:-ms-input-placeholder, textarea:focus:-ms-input-placeholder{ color: transparent;}
body::-webkit-scrollbar{ width: 4px;}
body::-webkit-scrollbar-track{ background-color: transparent;}
body::-webkit-scrollbar-thumb{ border-radius: 3px; background-color: rgba(0,0,0,0.3);}
body::-webkit-scrollbar-button{ width: 0; height: 0;}

textarea{ font-family: 'Noto Sans KR', sans-serif;}
body{ font-family: 'Noto Sans KR', sans-serif; font-size: 16px; color: #606060; line-height: 1.4; font-weight: 300;}
.container{ padding: 0 2%; max-width: 1200px; margin: 0 auto;}

@media all and (min-width:1280px){
    .container{ padding: 0;}
}

/* 버튼 */
.btn{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; text-align: center; height: 46px; font-size: 17px; border-radius: 23px;}
.btn.blue{ width: 234px; background: #284786; transition: all 0.2s;}
.btn.blue:hover{ background: #fe3b1f;}
.btn.blue.active{ background: #fe3b1f;}
.btn.red{ width: 234px; height: 36px; font-size: 14px; background: #fe3b1f; transition: all 0.2s;}
.btn.red:hover{ background: #284786;}
.btn.red.active{ background: #284786;}

@media all and (min-width:640px){
    .btn.red{ width: 270px; height: 40px; font-size: 17px;}
}
@media all and (min-width:960px){
    .btn.red{ width: 274px; height: 46px;}
}
@media all and (min-width:1080px){
    .btn.blue{ width: 254px;}
    .btn.red{ width: 294px;}
}
@media all and (min-width:1440px){
    .btn{ font-size: 18px;}
}

/* header */
header{ position: fixed; top: 0; left: 0; right: 0; height: 50px; z-index: 100; transition: 0.2s;}
.header_wrap{ margin: 0 auto; padding: 0 2%; max-width: 1200px; height: 100%; position: relative; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
.hd_logo{ width: 150px; height: 100%; background: url(../images/logo_white.png) 3% no-repeat; background-size: contain;}
.hambtn{ width: 25px; height: 100%; background: url(../images/hambtn_white.png) 3% no-repeat; background-size: contain;}

.header_link{display:none;}

/* 메뉴 스크롤시 */
header.scroll{ background: rgba(233, 233, 234, 0.9);}
header.scroll .hd_logo{ width: 150px; height: 100%; background: url(../images/logo.png) 3% no-repeat; background-size: contain;}
header.scroll .hambtn{ width: 25px; height: 100%; background: url(../images/hambtn.png) 3% no-repeat; background-size: contain;}

.blink{-moz-animation-duration:0.6s; -webkit-animation-duration:0.6s; animation-duration:0.6s; animation-delay:0.6s; -moz-animation-name:blink; -webkit-animation-name:blink; animation-name:blink; -moz-animation-iteration-count:infinite; -webkit-animation-iteration-count:infinite; animation-iteration-count:infinite; -moz-animation-direction:alternate; -webkit-animation-direction:alternate; animation-direction:alternate;}
@keyframes blink{
    from{opacity:0;}
    to{opacity:1;}
}   

@media all and (min-width:640px){
    header{ height: 60px;}
    .hd_logo{ width: 210px;}
    .hambtn{ width: 30px;}
    header.scroll{ height: 60px;}
    header.scroll .hd_logo{ width: 210px;}
    header.scroll .hambtn{ width: 30px;}
}
@media all and (min-width:960px){
    header{ height: 80px;}
    .hd_logo{ width: 230px;}
    .hambtn{ width: 35px;}
    header.scroll{ height: 80px;}
    header.scroll .hd_logo{ width: 230px;}
    header.scroll .hambtn{ width: 35px;}
    
    .header_link{position:absolute; right:70px; display:block;}
    .header_link a{padding:0 8px; color:#fff; font-weight:400; transition:0.2s;}
    .header_link a:hover{color:#284786;}
    
    header.scroll .header_link a{color:#284786;}
    header.scroll .header_link a:hover{color:#111;}
}
@media all and (min-width:1080px){
    header{ height: 90px;}
    .header_wrap{ width: 1000px; padding: 0;}
    .hd_logo{ width: 250px;}
    header.scroll{ height: 90px;}
    header.scroll .hd_logo{ width: 250px;}
}
@media all and (min-width:1280px){
    .header_wrap{ padding: 0;}
    .hd_logo{ width: 280px;}
    header.scroll .hd_logo{ width: 280px;}
}
@media all and (min-width:1440px){
   header{ height: 100px;}
   .header_wrap{ width: 1200px;}
   .hd_logo{ width: 290px;}
   .hambtn{ width: 40px;}
   header.scroll{ height: 100px;}
   header.scroll .hd_logo{ width: 290px;}
   header.scroll .hambtn{ width: 40px;}
    
    .header_link{right:80px;}
    .header_link a{font-size:18px;}
}
@media all and (min-width:1680px){ 
    header{ height: 110px;}
    .hd_logo{ width: 305px;}
    header.scroll{ height: 110px;}
    header.scroll .hd_logo{ width: 305px;}
    
    .header_link a{font-size:20px; padding:0 10px;}
}
@media all and (min-width:1920px){
    header{ height: 120px;}
    header.scroll{ height: 120px;}
}

/* nav_wrap */
.nav_bg{ position: fixed; left: 0; right :0; top: 0; bottom: 0; z-index: 1000; background:rgba(0,0,0,0.7); display:none;}
.nav_wrap{ position: fixed; width:70%; right:-1500px; top:0; max-width:900px; height:100%; background:#284786; transition:0.5s; z-index:1100;}
.nav_wrap.move{right:0;}

.nav_inner{padding:30px 0 0 25px; position:absolute; left:0; top:0; bottom:0; width:100%; overflow:auto;}
.nav_logo{width: 150px; margin-bottom:25px;}
.gnb{}
.gnb li{ font-size: 19px; color: #fff; margin-bottom: 14px; transition: all 0.2s;}
.gnb li:hover{color: #ff3a1d;}
.gnb .active{ font-size: 23px; color: #ff3a1d;}
.gnb_num{ font-size: 16px; color: #fff; margin-top: 50%;}
.xbtn{width:25px; height:25px; position:absolute; left:-35px; top:25px;}
.xbtn img{width:100%; display:block;}

@media all and (min-width:640px){
    .nav_inner{ padding:30px 0 20px 30px;}
    .nav_logo{ width: 200px; margin-bottom: 25px;}
    .gnb li{ font-size: 21px; margin-bottom: 18px;}
    .gnb_num{ font-size: 18px; margin-top: 10%;}
    .xbtn{ left: -9%; top: 30px;}
    .gnb li:hover{}
    .gnb .active{ font-size: 25px;}
}
@media all and (min-width:1024px){
    .nav_wrap{width:50%;}
    
    .nav_inner{padding:50px 0 0 60px;}
    .nav_logo{ width: 230px; margin-bottom: 50px;}
    .gnb li{ font-size: 28px;}
    .gnb_num{ font-size: 24px; margin-top:8%;}
    .xbtn{left:-50px; top:45px; width:32px; height:32px;}
    .gnb li:hover{}
    .gnb .active{font-size: 32px;}
}
@media all and (min-width:1280px){
    .nav_inner{padding:60px 0 0 70px;}
    .nav_logo{ width: 270px;}
    .gnb li{ font-size: 35px;}
    .gnb_num{ font-size: 29px;}
    .xbtn{left:-56px; top:60px; width:36px; height:36px;}
    .gnb li:hover{}
    .gnb .active{font-size:36px;}
}
@media all and (min-width:1440px){
    .nav_logo{ width:280px;}
}
@media all and (min-width:1680px){ 
    .nav_inner{padding:70px 0 0 110px;}
    .nav_logo{width:306px; margin-bottom:60px;}
    .gnb li{ font-size: 45px; margin-bottom:20px;}
    .gnb_num{ font-size: 35px; margin-top:90px;}
    .xbtn{width:40px; height:40px; left:-65px; top:70px;}
    .gnb li:hover{}
    .gnb .active{font-size:54px;}
}

/* main_visual */
.main_visual{ position: relative;}
.banner.swiper{ width: 100%; height: 500px;}
.banner .swiper-slide.slide1{ width: 100%; height: 100%; background: url(../images/m_banner_01.png) no-repeat right center; background-size: cover;}
.banner .swiper-slide.slide2{ width: 100%; height: 100%; background: url(../images/m_banner_02.png) no-repeat right center; background-size: cover;}
.banner .swiper-slide.slide3{ width: 100%; height: 100%; background: url(../images/m_banner_03.png) no-repeat right center; background-size: cover;}
.swiper-slide.slide2 .txt_box span{ display: block;}
.banner .swiper-pagination{ margin-bottom: 15px;}
.banner .swiper-pagination-bullet{ width: 15px; height: 15px; background: #fff; opacity: 1;}
.banner .swiper-pagination-bullet-active{ width: 35px; height: 15px; background: #ff3a1d; border-radius: 8px;}

.txt_box{ position: absolute; top: 30%; left: 0; right: 0; color: #fff;}
.txt_box h2{ font-weight: 300; font-size: 24px; line-height: 1.1;}
.red_line{ margin: 15px 0; display: inline-block; width: 24px; height: 2px; background: #ff3a1d; vertical-align: -1px;}

.q_icon{ position: fixed; right: 2%; bottom: 19%; color: #ff3a1d; z-index: 100;}
.q_box{ display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
.qbtn{ display: block; width: 70%; padding-top: 70%; background: url(../images/qbtn.png) no-repeat center; background-size: 100%;}

.q_box:hover .qbtn{ background: url(../images/qbtn_on.png) no-repeat center; background-size: 100%;}
.q_box:hover{ color: #284786}
 
@media all and (min-width:640px){
    .banner.swiper{ height: 360px;}
    .swiper-slide.slide2 .txt_box span{ display: inline-block;}
    .txt_box{ padding: 0 3%;}
    .txt_box h2{ font-size: 30px;}
    .red_line{ margin: 20px 0; width: 26px;}
    .q_icon{ right: 2%; bottom: 6%;}
}
@media all and (min-width:960px){
    .banner.swiper{ height: 450px;}
    .txt_box h2{ font-size: 35px;}
    .txt_box p{ font-size: 18px;}
    .red_line{ margin: 30px 0; width: 31px;}
    .q_icon{ font-size: 17px; right: 3%; bottom: 21%;}
}
@media all and (min-width:1080px){
    .banner.swiper{ height: 550px;}
    .banner .swiper-slide.slide1{  width: 100%; height: 100%; background: url(../images/main_banner_01.png) center center; background-size: cover;}
    .banner .swiper-slide.slide2{ width: 100%; height: 100%; background: url(../images/main_banner_02.png) center center; background-size: cover;}
    .banner .swiper-slide.slide3{ width: 100%; height: 100%; background: url(../images/main_banner_03.png) center center; background-size: cover;}
    .banner .swiper-pagination{ margin-bottom: 50px;}
    .banner .swiper-pagination-bullet{ width: 18px; height: 18px;}
    .banner .swiper-pagination-bullet-active{ width: 38px; height: 18px;}
    .txt_box{ top: 25%;}
    .txt_box h2{ font-size: 40px;}
    .txt_box p{ font-size: 22px;}
    .red_line{ width: 41px;}
    .q_icon{ font-size: 18px; right: 4%; bottom: 10%;}
}
@media all and (min-width:1280px){
    .banner.swiper{ height: 615px;}
    .banner .swiper-pagination{ margin-bottom: 60px;}
    .txt_box{ padding: 0;}
    .txt_box h2{ font-size: 50px;}
    .qbtn{ width: 80%; padding-top: 80%;}
    .q_icon{ right: 3%; bottom: 17%;}
}
@media all and (min-width:1440px){
    .banner.swiper{ height: 690px;}
    .q_icon{ right: 2%; bottom: 15%;}
}
@media all and (min-width:1680px){ 
    .banner.swiper{ height: 810px;}
    .banner .swiper-pagination{ margin-bottom: 80px;}
    .txt_box h2{ font-size: 60px;}
    .qbtn{ width: 90%; padding-top: 90%;}
    .q_icon{ right: 8%; bottom: 15%;}
}
@media all and (min-width:1920px){
    .banner.swiper{ height: 922px;}
    .banner .swiper-pagination{ margin-bottom: 120px;}
    .txt_box{ top: 280px;}
    .txt_box h2{ font-size: 70px;}
    .q_icon{ font-size: 19px; right: auto; left: calc(50% + 700px); bottom: 5%;}
}

/* sub_visual */
.sub_visual{ position: relative;}
.sub_banner.swiper{ width: 100%; height: 500px;}
.sub_banner .swiper-slide{ width: 100%; height: 100%; background: url(../images/sub/m_sub_visual.png) no-repeat 70% center; background-size: cover;}

.sub_txt_box{ position: absolute; top: 50%; left: 0; right: 0; color: #fff;}
.sub_txt_box h2{ font-size: 28px; line-height: 1.1;}
.sub_txt_box span{ font-weight: bold;}
.sub_red_line{ margin: 15px 0; display: inline-block; width: 24px; height: 2px; background: #ff3a1d; vertical-align: -1px;}
 
@media all and (min-width:640px){
    .sub_banner.swiper{ height: 360px;}
    .sub_txt_box{ padding: 0 3%;}
    .sub_txt_box h2{ font-size: 30px;}
    .sub_txt_box p{ line-height: 1.3;}
    .red_line{ margin: 20px 0; width: 26px;}
}
@media all and (min-width:960px){
    .sub_banner.swiper{ height: 400px;}
    .sub_txt_box h2{ font-size: 35px;}
    .sub_txt_box p{ line-height: 1.4;}
    .sub_red_line{ margin: 20px 0; width: 31px;}
}
@media all and (min-width:1080px){
    .sub_banner.swiper{ height: 450px;}
    .sub_banner .swiper-slide{ width: 100%; height: 100%; background: url(../images/sub/sub_visual.png) center center; background-size: cover;}
    .sub_txt_box{ top: 130px;}
    .sub_red_line{ width: 38px;} 
}
@media all and (min-width:1280px){
    .sub_banner.swiper{ height: 500px;}
    .sub_txt_box{ top: 150px; padding: 0;}
    .sub_txt_box h2{ font-size: 40px;}
    .sub_txt_box p{ font-size: 18px;}
}
@media all and (min-width:1440px){
    .sub_banner.swiper{ height: 550px;}
}
@media all and (min-width:1680px){ 
    .sub_banner.swiper{ height: 600px;}
    .sub_txt_box{ top: 170px;}
    .sub_txt_box h2{ font-size: 50px;}
    .sub_txt_box p{ font-size: 22px;}
    .sub_red_line{ margin: 30px 0; width: 41px;} 
}
@media all and (min-width:1920px){
    .sub_banner.swiper{ height: 622px;}
    .sub_txt_box{ top: 224px;}
    .sub_txt_box h2{ font-size: 55px;}
}

/* bg_img */
.bg_img01{ background: url(../images/main_bg_01.png) no-repeat 0 50%; background-size: cover;}
.bg_img02{ background: url(../images/main_bg_02.png) no-repeat 0 50%; background-size: cover;}
.bg_img03{ background: url(../images/main_bg_03.png) no-repeat 0 50%; background-size: cover;}
.bg_img04{ background: url(../images/main_bg_04.png) no-repeat 0 50%; background-size: cover;}
.bg_img05{ background: url(../images/main_bg_05.png) no-repeat 0 50%; background-size: cover;}

/* sub_bg_img */
.sub_bg_img{ background: url(../images/sub/bg_img.png) no-repeat 0 0; background-size: cover;}

/* footer */
footer{ padding: 10% 0%; color: #ccc; background: #284786;}
.footer_wrap{ margin: 0 auto; padding: 0 2%; max-width: 1200px; height: 100%; position: relative;  display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}

.footer_left{ text-align: center;}
.footer_num{ font-size: 24px; font-weight: 400; color: #fff;}
.yellow_line{ display: inline-block; width: 24px; height: 2px; background: #ffd83f; vertical-align: -1px; margin: 20px;}
.gray_line{ margin: 0 5px; display: inline-block; width: 1px; height: 14px; background: #ccc; vertical-align: -1px;}

.footer_site{ width: 100%; line-height: 2; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; text-align: left;}
.footer_site strong{ display: block; color: #fff; width: 155px;}
.site_list{ width: calc(100% - 160px);}
.site_list li{ width: 100%; font-size: 15px;}
.site_list li:hover{ color: #ff3a1d;}

.footer_center{ margin-top: 20px; line-height: 2; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; text-align: left;}
.footer_center strong{ display: block; color: #fff; width: 155px;}
.center_list{ width: calc(100% - 160px);}
.center_list li{ width: 100%; font-size: 15px;}
.center_list li:hover{ color: #ff3a1d;}

.footer_bottom{ font-size: 14px;}
.footer_adress{ display: block;}

/* sns */
/* .footer_right{ width: 100%;}
.footer_sns{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -moz-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; justify-content: flex-end; margin-top: 20px;}
.sns_img{ display: block; width: 40px; height: 40px; margin-left: 10px; transition: all 0.2s;}
.sns_img.one{ background: url(../images/sns_01.png) no-repeat; background-size: 100%;}
.sns_img.two{ background: url(../images/sns_02.png) no-repeat; background-size: 100%;}
.sns_img.three{ background: url(../images/sns_03.png) no-repeat; background-size: 100%;}
.sns_img.one:hover{ background: url(../images/sns_01_on.png) no-repeat; background-size: 100%;}
.sns_img.two:hover{ background: url(../images/sns_02_on.png) no-repeat; background-size: 100%;}
.sns_img.three:hover{ background: url(../images/sns_03_on.png) no-repeat; background-size: 100%;} */

@media all and (min-width:450px){
    .site_list{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: flex-start; flex-wrap: wrap;}
    .site_list li{ width: 50%;}
    .center_list{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: flex-start; flex-wrap: wrap;}
    .center_list li{ width: 50%;}
}
@media all and (min-width:640px){
    footer{ padding: 5% 0%;}
    .footer_num{ font-size: 30px;}
    .yellow_line{ margin: 25px 0; width: 30px; height: 3px;}
    .site_list li{ width: 30%;}
    .center_list li{ width: 30%}
    .footer_bottom{ font-size: 16px;}
    /* .footer_sns{ margin-top: 15px;} */
}
@media all and (min-width:768px){
    .footer_left{ text-align: left;}
}
@media all and (min-width:960px){
    .footer_adress{ display: inline;}
    .footer_site strong{ width: 160px; font-size: 18px;}
    .site_list{ width: calc(100% - 180px); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: flex-start; flex-wrap: wrap;}
    .site_list li{ font-size: 16px; width: 20%;}
    .footer_center{ display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap;}
    .footer_center strong{ width: 160px; font-size: 18px;}
    .center_list{  width: calc(100% - 180px); display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: flex-start; flex-wrap: wrap;}
    .center_list li{ font-size: 16px; width: 20%;}
    /* .footer_sns{ margin-top: 20px;}
    .sns_img{ width: 50px; height: 50px; margin-left: 20px;} */
}
@media all and (min-width:1080px){   
    footer{ padding: 5% 0%; background: url(../images/footer_bg.png) no-repeat 50% 0; background-size: cover;}
    .footer_wrap{ width: 1000px; padding: 0;}
    .footer_num{ font-size: 33px;}
    /* .footer_sns{ margin-top: 25px;} */
}
@media all and (min-width:1280px){
    .footer_wrap{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
    .footer_num{ font-size: 40px;}
    .yellow_line{ width: 35px;}
    .footer_right{ width: 25%;}
    /* .footer_sns{ margin-top: 0;} */
}
@media all and (min-width:1440px){ 
    .footer_wrap{ width: 1200px;}
    .yellow_line{ margin: 30px 0; width: 42px; height: 4px;}
    /* .sns_img{ width: 55px; height: 55px;} */
}
@media all and (min-width:1680px){    
    /* .sns_img{ width: 60px; height: 60px;} */
}
@media all and (min-width:1920px){
    footer{ padding: 127px 0 50px 0;}
    .footer_wrap{ width: 1200px; padding: 0 50px;}
    .footer_num{ font-size: 46px; font-weight: 400; margin-bottom: 15px;}
    .yellow_line{ margin: 29px 0; display: inline-block; width: 41px; height: 4px; background: #ffd83f; vertical-align: -1px;}
    .gray_line{ margin: 0 5px; display: inline-block; width: 1px; height: 14px; background: #ccc; vertical-align: -1px;}
    .footer_bottom{ font-size: 14px;}
    .footer_adress{ display: inline-block; margin-bottom: 15px;}
    /* .sns_img{ width: 64px; height: 64px;} */
} 

/* 메인페이지 */
/* master_wrap */
.master_wrap{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; margin-top: 60px; max-width: 1080px; margin: 60px auto 0 auto;}
.master_img{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 100%; max-width: 422px;}
.master_img img{ display: block; width: 100%;}
.master_area{ padding: 5% 3% 0 3%;}
.master_area .black_tit{ font-weight: 300; font-size: 24px; color: #333; margin-bottom: 15px;}
.master_area .black_tit span{ font-weight: bold;}
.master_txt{ text-align: justify;} 
.master_txt p{ margin-bottom: 15px;}
.master_txt p:last-child{ margin-bottom: 0;}

@media all and (min-width:640px){
    .master_area{ padding: 5% 5% 0 5%;}
    .master_area .black_tit{ font-size: 26px; margin-bottom: 20px;}
}
@media all and (min-width:960px){
    .master_wrap{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; flex-wrap: nowrap; -webkit-flex-wrap: nowrap; flex-wrap: nowrap;}
    .master_img{ width: 50%;}
    .master_area{ padding: 10% 0 0 0; width: 50%;}
    .master_area .black_tit{ font-size: 30px;}
    .master_txt p{ margin-bottom: 20px;}
}
@media all and (min-width:1080px){
    .master_wrap{ margin-top: 70px;}
    .master_area{ padding: 8% 0 0 0;}
    .master_area .black_tit{ font-size: 35px; margin-bottom: 25px;}
    .master_txt p{ margin-bottom: 25px;}
}
@media all and (min-width:1280px){
    .master_area .black_tit{ font-size: 40px;}
}
@media all and (min-width:1440px){
    .master_wrap{ margin-top: 80px;}
    .master_area{ padding: 3% 4% 0 0;}
    .master_area .black_tit{ font-size: 46px; line-height: 1.2; margin-bottom: 28px;}
    .master_area .black_tit span{ display: block;}
    .master_txt p{ font-size: 17px; line-height: 1.6; margin-bottom: 26px;}
}
@media all and (min-width:1680px){ 
    .master_wrap{ margin-top: 100px;}
    .master_area .black_tit{font-size: 46px; margin-bottom: 29px;}
}

/* tree_wrap */
.tree_wrap{ margin-top: 60px;}
.tree_area{ padding: 0 3%;}
.tree_box{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; border-radius: 20px; margin-bottom: 25px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); background: #fff;}
.tree_box:last-child{ margin-bottom: 0;}

.tree_inner{ width: 100%; text-align: center;}
.tree_img{ width: 100%; border-top-left-radius: 20px; border-top-right-radius: 20px;}
.tree_inner h4{ font-weight: 300; font-size: 22px; color: #333; margin: 20px 0 0 0;}
.tree_inner h4 span{ font-weight: bold; color: #284786;}
.tree_inner p{ margin-bottom: 20px;}
.tree_inner strong{ color: #333; display: block; margin-bottom: 20px;}

.tree_dot{ width: 22px; margin: 20px 0;}
.tree_btn{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 30px;}
.tree_btn span{ font-weight: bold; margin-right: 5px;}

@media all and (min-width:640px){
    .tree_inner h4{ font-size: 24px; margin: 25px 0 0 0;}
    .tree_inner h4 span{ display: block;}
    .tree_inner p{ font-size: 17px; margin-bottom: 15px;}
    .tree_inner strong{ margin-bottom: 25px;}
    .tree_dot{ margin: 15px 0;}
    .tree_btn{ margin-bottom: 50px;}
}
@media all and (min-width:960px){
    .tree_area{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
    .tree_box{ width: 32%; border-radius: 20px; margin-bottom: 0;}
    .tree_inner h4{ font-size: 20px;}
    .tree_inner p{ font-size: 16px; margin-bottom: 15px;}
    .tree_inner strong{ font-size: 15px;}
    .tree_btn.height{ padding-top: 23px;}
}
@media all and (min-width:1080px){
    .tree_wrap{ margin-top: 70px;}
    .tree_inner h4{ font-size: 23px; margin: 30px 0 0 0;}
    .tree_inner strong{ margin-bottom: 30px;}
    .tree_dot{ margin: 20px 0;}
}
@media all and (min-width:1280px){
    .tree_area{ padding: 0;}
    .tree_inner h4{ font-size: 25px; margin: 35px 0 0 0;}
    .tree_inner strong{ margin-bottom: 35px;}
}
@media all and (min-width:1440px){
    .tree_wrap{ margin-top: 80px;}
    .tree_inner h4{ font-size: 30px; margin: 50px 0 0 0;}
    .tree_inner p{ margin-bottom: 18px;}
    .tree_inner strong{ font-size: 18px; margin-bottom: 39px;}
    .tree_dot{ margin: 30px 0;}
    .tree_btn{ margin-bottom: 60px;}
}
@media all and (min-width:1680px){ 
    .tree_wrap{ margin-top: 100px;}
}

/* mix_wrap */
.mix_wrap{ margin-top: 60px;}
.mix_area{ max-width: 1100px; margin: 0 auto;}
.pc_mix{ display: none;}
.m_mix{ max-width: 910px; display: block;}
.mix_wrap .black_tit{ font-weight: 300; font-size: 22px; color: #333; text-align: center;}
.mix_wrap .black_tit span{ font-weight: bold; display: inline-block;}

.mix_wrap img{ width: 100%;}
.mix_btn{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin: 10px auto 20px auto; position: relative; z-index: 10;}
.mix_btn span{ font-weight: bold; margin-right: 5px;}
.mix_btn .btn.red{ width: 220px; height: 30px; font-size: 14px;}

@media all and (min-width:640px){
    .mix_wrap .black_tit{ font-size: 26px;}
    .mix_btn{ margin: 20px auto;}
    .mix_btn .btn.red{ width: 274px; height: 40px; font-size: 17px;}
}
@media all and (min-width:960px){
    .mix_wrap .black_tit{ font-size: 30px;}
}
@media all and (min-width:1080px){
    .mix_wrap{ margin-top: 70px;}
    .m_mix{ display: none;}
    .mix_btn{ margin: 40px auto 0 auto;}
    .pc_mix{ display: block; margin-top: -50px;}
    .mix_wrap .black_tit{ font-size: 35px;}
}
@media all and (min-width:1280px){
    .mix_wrap .black_tit{ font-size: 40px;}
    .mix_btn{ margin: 50px auto 0 auto;}
    .pc_mix{ display: block;}
    .mix_btn .btn.red{ width: 300px; height: 46px; font-size: 18px;}
}
@media all and (min-width:1440px){
    .mix_wrap{ margin-top: 80px;}
    .mix_wrap .black_tit{ font-size: 46px;}
    .mix_btn{ margin: 70px auto 0 auto;}
}
@media all and (min-width:1680px){ 
    .mix_wrap{ margin-top: 100px;}
}
@media all and (min-width:1920px){
    .mix_wrap{ margin-top: 150px;}
}

/* teach_wrap */
.teach_bg{ background: url(../images/m_teach_bg.png) 80% no-repeat; background-size: cover; margin-top: 60px;}
.teach_area{ padding: 15% 3%; line-height: 1.2; font-weight: 300; color: #fff;}
.teach_area p{ font-weight: 400; margin-bottom: 25px;}
.teach_area p:last-child{ margin-bottom: 0;}

.teach_area h3{ font-size: 22px; font-weight: 300; margin-bottom: 25px;}
.teach_area span{ font-size: 16px;}

@media all and (min-width:640px){
    .teach_area{ width: 90%; font-size: 20px;}
    .teach_area p{ margin-bottom: 22px;}
    .teach_area h3{ font-size: 30px;}
    .teach_area span p{ display: inline-block;}
}
@media all and (min-width:960px){
    .teach_area{ padding: 10% 5%; width: 100%;}
}
@media all and (min-width:1080px){
    .teach_bg{ background: url(../images/teach_bg.png) no-repeat 0 50%; background-size: cover; margin-top: 70px;}
    .teach_area{ padding: 130px 0; font-size: 22px;}
    .teach_area h3{ font-size: 32px;}
    .teach_area span{ font-size: 18px;}
    .teach_area span p{ display: block; line-height: 1.5; font-size: 18px;}
}
@media all and (min-width:1280px){
    .teach_area{ padding: 150px 0; width: 75%; font-size: 24px;}
    .teach_area p{ margin-bottom: 24px;}
    .teach_area h3{ font-size: 34px;}
    .teach_area span{ font-size: 20px;}
    .teach_area span p{ font-size: 20px;}
}
@media all and (min-width:1440px){
    .teach_bg{ margin-top: 80px;}
    .teach_area{ padding: 13% 0;}
    .teach_area p{ margin-bottom: 26px;}
}
@media all and (min-width:1680px){ 
    .teach_bg{ margin-top: 100px;}
    .teach_area{ padding: 375px 0;}
}
@media all and (min-width:1920px){
   .teach_bg{ margin-top: 96px;}
   .teach_area{ padding: 490px 0 352px 0; font-size: 30px;}
   .teach_area p{ margin-bottom: 24px;}
   .teach_area h3{ font-size: 44px;}
   .teach_area span{ font-size: 20px;}
   .teach_area span p{ font-size: 20px;}
}

/* listening_wrap */
.listening_wrap{ margin-top: 60px;} 
.listening_area{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap;}
.listening_box{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 90%; border-radius: 20px; margin-bottom: 25px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); background: #fff;}
.listening_box:last-child{ margin-bottom: 0;}

.listening_inner{ width: 100%; text-align: center;}
.listening_img{ width: 100%; border-top-left-radius: 20px; border-top-right-radius: 20px;}
.listening_inner h4{ font-weight: 300; font-size: 22px; color: #333; margin: 20px 0 0 0;}
.listening_inner h4 span{ display: block; font-weight: bold; color: #284786;}
.listening_inner p{ margin-bottom: 20px;}
.listening_inner strong{ color: #333; display: block; margin-bottom: 20px;}

.listening_dot{ width: 22px; margin: 20px 0;}
.listening_btn{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 30px;}
.listening_btn span{ display: block; font-weight: bold; margin-right: 5px;}

@media all and (min-width:640px){
    .listening_inner h4{ font-size: 24px; margin: 25px 0 0 0;}
    .listening_inner p{ font-size: 17px; margin-bottom: 15px;}
    .listening_inner strong{ margin-bottom: 25px;}
    .listening_dot{ width: 22px; margin: 15px 0;}
    .listening_btn{ margin-bottom: 50px;}
}
@media all and (min-width:960px){
    .listening_area{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; flex-wrap: nowrap; -webkit-flex-wrap: nowrap; flex-wrap: nowrap;}
    .listening_box{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 49%; border-radius: 20px; margin-bottom: 0;}
    .listening_inner h4{ font-size: 20px;}
    .listening_inner p{ font-size: 16px; margin-bottom: 15px;}
    .listening_inner strong{ font-size: 15px;}
}
@media all and (min-width:1080px){
    .listening_wrap{ margin-top: 70px;} 
    .listening_inner h4{ font-size: 23px; margin: 30px 0 0 0;}
    .listening_inner strong{ margin-bottom: 30px;}
    .listening_dot{ margin: 20px 0;}
}
@media all and (min-width:1280px){
    .listening_inner h4{ font-size: 25px; color: #333; margin: 35px 0 0 0;}
    .listening_inner strong{ margin-bottom: 35px;}
}
@media all and (min-width:1440px){ 
    .listening_wrap{ margin-top: 80px;} 
    .listening_inner h4{ font-size: 30px; margin: 50px 0 0 0;}
    .listening_inner p{ margin-bottom: 30px;}
    .listening_inner strong{ margin-bottom: 39px;}
    .listening_dot{ margin: 30px 0;}
    .listening_btn{ margin-bottom: 60px;}
}
@media all and (min-width:1680px){ 
    .listening_wrap{ margin-top: 100px;} 
}
@media all and (min-width:1920px){
    .listening_wrap{ margin-top: 155px;}
    .listening_inner h4{ font-size: 30px; margin: 50px 0 0 0;}
    .listening_inner p{ margin-bottom: 18px;}
    .listening_inner strong{ font-size: 18px; margin-bottom: 39px;}
    .listening_btn{ margin-bottom: 60px;}
    .listening_btn span{ font-weight: bold; margin-right: 5px;}
}

/* perfect_wrap */
.perfect_bg{ background: url(../images/m_perfect_bg.png) no-repeat; background-size: cover; margin-top: 60px;}
.perfect_area{ padding: 15% 3%; color: #fff;}
.perfect_area h2{ font-size: 22px; color: #fe3b1f; margin-bottom: 10px;}
.perfect_area h3{ font-size: 20px; font-weight: 300; margin-bottom: 20px;}
.perfect_area strong{ display: block;}
.perfect_area p{ font-size: 16px; line-height: 1.2; margin-bottom: 25px;}
.perfect_area p:last-child{ margin-bottom: 0;}
.perfect_area p span{ display: block; font-size: 16px; margin-top: 25px;}

@media all and (min-width:640px){
    .perfect_area{ width: 95%;}
    .perfect_area h2{ font-size: 26px;}
    .perfect_area h3{ font-size: 22px;}
    .perfect_area h3 strong{ display: block;}
}
@media all and (min-width:960px){
    .perfect_wrap{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -moz-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; justify-content: flex-end;}
    .perfect_bg{ background: url(../images/m_perfect_bg.png) no-repeat 10% 50%;}
    .perfect_area{ padding: 10% 5%; width: 70%;}
    .perfect_area h2{ font-size: 34px; margin-bottom: 25px;}
    .perfect_area h3{ margin-bottom: 30px;}
    .perfect_area p{ margin-bottom: 23px;}
    .perfect_area p span{ margin-top: 23px;}
}
@media all and (min-width:1080px){
    .perfect_bg{ background: url(../images/perfect_bg.png) no-repeat 0 50%; background-size: cover; margin-top: 70px;}
    .perfect_area{ padding: 10% 1%; width: 60%;}

}
@media all and (min-width:1280px){
    .perfect_area{ padding: 10% 0; width: 60%;}
    .perfect_area h2{ font-size: 36px;}
    .perfect_area h3{ font-size: 24px;}
    .perfect_area p{ margin-bottom: 25px;}
    .perfect_area p span{ margin-top: 25px;}
}
@media all and (min-width:1440px){ 
    .perfect_bg{ margin-top: 80px;}
    .perfect_area{ padding: 15% 0;}
    .perfect_area h2{ font-size: 40px; margin-bottom: 30px;}
    .perfect_area h3{ font-size: 28px; margin-bottom: 34px;}
    .perfect_area p{ font-size: 18px; margin-bottom: 30px;}
    .perfect_area p span{ font-size: 18px; margin-top: 30px;}
}
@media all and (min-width:1680px){ 
    .perfect_bg{ margin-top: 100px;}
    .perfect_area{ padding: 350px 0;}
}
@media all and (min-width:1920px){
    .perfect_bg{ margin-top: 156px;}
    .perfect_area{ padding: 362px 0 320px 0; width: 55%;}
    .perfect_area h2{ font-size: 50px; margin-bottom: 30px;}
    .perfect_area h3{ font-size: 30px; margin-bottom: 40px;}
    .perfect_area p{ font-size: 20px; margin-bottom: 30px;}
    .perfect_area p span{ font-size: 20px; margin-top: 30px;}
}

/* speack_wrap */
.speack_wrap{ margin-top: 60px;}
.speack_area{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap;}
.speack_box{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 90%; border-radius: 20px; margin-bottom: 25px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); background: #fff;}
.speack_box:last-child{ margin-bottom: 0;}

.speack_inner{ width: 100%; text-align: center;}
.speack_img{ width: 100%; border-top-left-radius: 20px; border-top-right-radius: 20px;}
.speack_inner h4{ font-weight: 300; font-size: 22px; color: #333; margin: 20px 0 0 0;}
.speack_inner h4 span{ display: block; font-weight: bold; color: #284786;}
.speack_inner p{ margin-bottom: 20px;}
.speack_inner strong{ color: #333; display: block; margin-bottom: 20px;}

.speack_dot{ width: 22px; margin: 20px 0;}
.speack_btn{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 30px;}
.speack_btn span{ display: block; font-weight: bold; margin-right: 5px;}

@media all and (min-width:640px){
    .speack_inner h4{ font-size: 24px; margin: 25px 0 0 0;}
    .speack_inner p{ margin-bottom: 15px;}
    .speack_inner strong{ margin-bottom: 25px;}
    .speack_dot{ margin: 15px 0;}
    .speack_btn{ margin-bottom: 50px;}
}
@media all and (min-width:960px){
    .speack_area{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; flex-wrap: nowrap; -webkit-flex-wrap: nowrap; flex-wrap: nowrap;}
    .speack_box{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 49%; border-radius: 20px; margin-bottom: 0;}
    .speack_inner h4{ font-size: 20px;}
    .speack_inner h4 span{ font-weight: bold; color: #284786;}
    .speack_inner strong{ font-size: 15px;}
    .speack_btn.height{ padding-top: 23px;}
}
@media all and (min-width:1080px){
    .speack_wrap{ margin-top: 70px;}
    .speack_inner h4{ font-size: 23px; margin: 30px 0 0 0;}
    .speack_inner strong{ margin-bottom: 30px;}
    .speack_dot{ margin: 20px 0;}
}
@media all and (min-width:1280px){
    .speack_inner h4{ font-size: 25px; margin: 35px 0 0 0;}
    .speack_inner strong{ margin-bottom: 35px;}
}
@media all and (min-width:1440px){ 
    .speack_wrap{ margin-top: 80px;}
    .speack_inner h4{ font-size: 30px; margin: 50px 0 0 0;}
    .speack_inner p{ margin-bottom: 30px;}
    .speack_inner strong{ margin-bottom: 39px;}
    .speack_dot{ margin: 30px 0;}
    .speack_btn{ margin-bottom: 60px;}
}
@media all and (min-width:1680px){ 
    .speack_wrap{ margin-top: 100px;}
}
@media all and (min-width:1920px){
    .speack_wrap{ margin-top: 93px;}
    .speack_inner h4{ font-size: 30px; margin: 50px 0 0 0;}
    .speack_inner p{ margin-bottom: 18px;}
    .speack_inner strong{ font-size: 18px; margin-bottom: 39px;}
    .speack_btn{ margin-bottom: 60px;}
    .speack_btn span{ display: block; font-weight: bold; margin-right: 5px;}
}

/* coach_wrap */
.coach_bg{ background: url(../images/m_coach_bg.png) no-repeat; background-size: cover; margin-top: 60px;}
.coach_area{ padding: 15% 3%; color: #fff;}
.coach_area h2{ font-size: 22px; color: #fe3b1f; margin-bottom: 10px;}
.coach_area h3{ font-size: 20px; font-weight: 300; margin-bottom: 20px;}
.coach_area p{ font-size: 16px; margin-bottom: 25px;}
.coach_area p:last-child{ margin-bottom: 0;}

@media all and (min-width:640px){
    .coach_area{ width: 100%;}
    .coach_area h2{ font-size: 26px;}
    .coach_area h3{ font-size: 22px;}
}
@media all and (min-width:960px){
   .coach_bg{ background: url(../images/m_coach_bg.png) no-repeat 30% 20%;}
   .coach_area{ padding: 10% 5%; width: 78%;}
   .coach_area h2{ font-size: 34px; margin-bottom: 25px;}
   .coach_area h3{ font-size: 22px; margin-bottom: 35px;}
   .coach_area p{ line-height: 1.6; margin-bottom: 25px;}
}
@media all and (min-width:1080px){
    .coach_bg{ background: url(../images/coach_bg.png) no-repeat 0 50%; background-size: cover; margin-top: 70px;}
    .coach_area{ padding: 10% 5%; width: 65%;}
}
@media all and (min-width:1280px){
    .coach_area{ padding: 10% 0; width: 65%;}
    .coach_area h2{ font-size: 36px;}
    .coach_area h3{ font-size: 24px;}
    .coach_area p{ margin-bottom: 25px;}
}
@media all and (min-width:1440px){ 
    .coach_bg{ margin-top: 80px;}
    .coach_area{ padding: 15% 0;}
    .coach_area h2{ font-size: 40px; margin-bottom: 30px;}
    .coach_area h3{ font-size: 28px; margin-bottom: 34px;}
    .coach_area p{ font-size: 18px; margin-bottom: 30px;}
}
@media all and (min-width:1680px){ 
    .coach_bg{ margin-top: 100px;}
    .coach_area{ padding: 400px 0;}
}
@media all and (min-width:1920px){
    .coach_bg{ margin-top: 150px;}
    .coach_area{ padding: 430px 0 435px 0;}
    .coach_area h2{ font-size: 50px; margin-bottom: 30px;}
    .coach_area h3{ font-size: 30px; margin-bottom: 30px;}
    .coach_area p{ font-size: 20px; margin-bottom: 30px;}
    .coach_area p:last-child{ margin-bottom: 0;}
}

/* pyp_wrap */
.pyp_wrap{ margin-top: 60px;}
.pyp_area{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap;}
.pyp_box{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 90%; border-radius: 20px; margin-bottom: 25px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); background: #fff;}
.pyp_box:last-child{ margin-bottom: 0;}

.pyp_box.color{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; color: #fff; background: url(../images/pyp_02.png) no-repeat 100% 0; background-color: #284786;}
.pyp_box.color .pyp_inner{ padding: 8% 0;}
.pyp_box.color .pyp_inner p{ font-size: 16px; line-height: 1.6;}
.pyp_logo{ width: 197px;}
.pyp_box.color h4{ font-size: 22px; color: #fff; margin: 0 0 20px 0;}
.pyp_box.color p{ padding: 0 15%; font-size: 14px; text-align: center;}
.pyp_dot_w{ width: 22px; margin: 20px 0;}

.pyp_inner{ width: 100%; text-align: center;}
.pyp_img{ width: 100%; border-top-left-radius: 20px; border-top-right-radius: 20px;}
.pyp_inner h4{ font-weight: 300; font-size: 22px; color: #333; margin: 20px 0 0 0;}
.pyp_inner h4 span{ display: block; font-weight: bold; color: #284786;}
.pyp_inner p{ margin-bottom: 20px;}
.pyp_inner strong{ color: #333; display: block; margin-bottom: 20px}

.pyp_dot{ width: 22px; margin: 20px 0;}
.pyp_btn{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 30px;}
.pyp_btn span{ display: block; font-weight: bold; margin-right: 5px;}

@media all and (min-width:640px){
    .pyp_box.color h4{ font-size: 24px;}
    .pyp_box.color p{ padding: 0 6%; font-size: 16px; line-height: 1.5;}
    .pyp_dot_w{ margin: 15px 0;}
    .pyp_box.color .pyp_inner{ padding: 10% 0;}
    .pyp_box.color .pyp_inner p{ font-size: 16px; line-height: 2;}
    .pyp_inner h4{ font-size: 24px; margin: 25px 0 0 0;}
    .pyp_inner p{ font-size: 17px; margin-bottom: 15px;}
    .pyp_inner strong{ font-size: 16px; margin-bottom: 25px;}
    .pyp_dot{ margin: 15px 0;}
    .pyp_btn{ margin-bottom: 50px;}
}
@media all and (min-width:960px){
    .pyp_area{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; flex-wrap: nowrap; -webkit-flex-wrap: nowrap; flex-wrap: nowrap;}
    .pyp_box{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 32%; border-radius: 20px; margin-bottom: 0; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); background: #fff;}
    .pyp_btn.height{ padding-top: 23px;}
    .pyp_box.color .pyp_inner{ padding: 10% 4%;}
    .pyp_box.color .pyp_inner p{ line-height: 1.8;}
    .pyp_logo{ width: 197px;}
    .pyp_box.color h4{ font-size: 20px;}
    .pyp_box.color p{ font-size: 14px;}
    .pyp_inner h4{ font-size: 20px;}
    .pyp_inner p{ font-size: 16px;}
    .pyp_inner strong{ font-size: 15px;}
}
@media all and (min-width:1080px){
    .pyp_wrap{ margin-top: 70px;}
    .pyp_box.color h4{ font-size: 23px;}
    .pyp_box.color p{ line-height: 1.4; padding: 0 3%;}
    .pyp_dot_w{ margin: 20px 0;}
    .pyp_inner h4{ font-size: 23px; margin: 30px 0 0 0;}
    .pyp_inner strong{ margin-bottom: 30px;}
    .pyp_dot{ margin: 20px 0;}
}
@media all and (min-width:1280px){
    .pyp_box.color h4{ font-size: 25px;}
    .pyp_inner h4{ font-size: 25px; margin: 35px 0 0 0;}
    .pyp_inner strong{ margin-bottom: 35px;}
}
@media all and (min-width:1440px){ 
    .pyp_wrap{ margin-top: 80px;}
    .pyp_logo{ width: 197px;}
    .pyp_box.color h4{ font-size: 30px;}
    .pyp_box.color p{ padding: 0 12%;}
    .pyp_dot_w{ margin: 30px 0;}
    .pyp_box.color .pyp_inner{ padding: 10% 5%;}
    .pyp_box.color .pyp_inner p{ line-height: 2;}
    .pyp_inner h4{ font-size: 30px; margin: 50px 0 0 0;}
    .pyp_inner p{ margin-bottom: 18px;}
    .pyp_inner strong{ font-size: 18px; margin-bottom: 39px;}
    .pyp_dot{ margin: 30px 0;}
    .pyp_btn{ margin-bottom: 60px;}
}
@media all and (min-width:1680px){ 
    .pyp_wrap{ margin-top: 100px;}
    .pyp_dot_w{ width: 22px; margin: 30px 0;}
}
@media all and (min-width:1920px){
    .pyp_wrap{ margin-top: 150px;}
    .pyp_box.color p{ line-height: 1.3; padding: 0 12%; text-align: center;}
    .pyp_box.color .pyp_inner{ padding: 8% 0;}
    .pyp_box.color .pyp_inner p{ line-height: 1.8; font-size: 16px;}
    .pyp_box.color h4{ font-size: 30px; margin: 0 0 20px 0;}
    .pyp_box.color p{ padding: 0 15%; font-size: 14px; text-align: center;}
    .pyp_dot_w{ margin: 30px 0;}
    .pyp_inner h4{ font-size: 30px; margin: 50px 0 0 0;}
    .pyp_inner p{ margin-bottom: 18px;}
    .pyp_inner strong{ display: block; margin-bottom: 39px}
    .pyp_btn{ margin-bottom: 60px;}
    .pyp_btn span{ display: block; font-weight: bold; margin-right: 5px;}
}

/* space_wrap */
.space_bg{ background: url(../images/space_bg.png) no-repeat 70%; background-size: cover; margin-top: 60px;}
.pc_space{ display: none; max-width: 937px;}
.space_area{ padding: 15% 3%; color: #fff;}
.space_area img{ width: 100%; margin: 20px 0;}
.space_area h2{ font-size: 22px; color: #fe3b1f; margin-bottom: 10px;}
.space_area h3{ font-size: 20px; margin-bottom: 10px;}
.space_area p{ font-size: 16px; margin-bottom: 20px;}
.space_area p:last-child{ margin-bottom: 0;}

@media all and (min-width:640px){
    .space_area{ padding: 15% 1%;}
    .space_area img{ width: 80%; margin: 0 0 30px 0;}
    .space_area h2{ font-size: 26px; margin-bottom: 20px;}
    .space_area h3{ font-size: 22px; margin-bottom: 15px;}
    .space_area p{ font-size: 16px;}
    .space_area p span{ display: block;}
}
@media all and (min-width:960px){
    .space_bg{ background: url(../images/space_bg.png) no-repeat 70% 0;}
    .space_area{ padding: 10% 5%;}
    .space_area h2{ font-size: 34px; margin-bottom: 30px;}
    .space_area h3{ font-size: 22px; margin-bottom: 10px;}
    .space_area p{ margin-bottom: 30px;}
}
@media all and (min-width:1080px){
    .space_bg{ background: url(../images/space_bg.png) no-repeat 0 50%; background-size: cover; margin-top: 70px;}
    .m_space{ display: none;}
    .pc_space{ display: block;}
    .space_area img{ margin: 0 0 50px 0;}
    .space_area h2{ margin-bottom: 40px;}
    .space_area h3{ margin-bottom: 20px;}
    .space_area p{ margin-bottom: 50px;}
}
@media all and (min-width:1280px){
    .space_area{ padding: 10% 0;}
    .space_area h2{ font-size: 36px;}
    .space_area h3{ font-size: 24px;}
    .space_area p{ font-size: 18px;}
    .space_area p span{ display: block;}
}
@media all and (min-width:1440px){ 
    .space_bg{ margin-top: 80px;}
    .space_area{ padding: 300px 0 190px 0;}
    .space_area img{ width: 70%; margin: 0 0 60px 0;}
    .space_area h2{ font-size: 40px; margin-bottom: 60px;}
    .space_area h3{ font-size: 28px; margin-bottom: 20px;}
    .space_area p{ font-size: 18px; margin-bottom: 60px;}
}
@media all and (min-width:1680px){ 
    .space_bg{ margin-top: 100px;}
    .space_area img{ width: 85%; margin: 0 0 74px 0;}
}
@media all and (min-width:1920px){
    .space_bg{ margin-top: 150px;}
    .space_area{ padding: 378px 0 196px 0;}
    .space_area h2{ font-size: 50px; margin-bottom: 66px;}
    .space_area h3{ font-size: 30px; margin-bottom: 28px;}
    .space_area p{ font-size: 20px; margin-bottom: 60px;}
    .space_area p:last-child{ margin-bottom: 0;}
}

/* 서브페이지 01 */
/* curriculum_wrap */
.curriculum_wrap{ margin-top: 60px;}
.curriculum_area .black_tit{ font-weight: 300; text-align: center; font-size: 24px; color: #333; margin-bottom: 15px;}
.curriculum_area .black_tit span{ font-weight: bold;}
.curriculum_inner{ margin-bottom: 15px;}
.curriculum_inner:last-child{ margin-bottom: 0;}

.curriculum_bar{ padding: 0 5%; margin-bottom: 10px; height: 40px; line-height: 40px; border-radius: 11px; color: #fff; background: #284786; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
.curriculum_txt{ padding: 0 5%;  display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}

@media all and (min-width:640px){
    .curriculum_area .black_tit{ font-size: 26px; margin-bottom: 20px;}
    .curriculum_inner{ margin-bottom: 20px;}
    .curriculum_bar,.curriculum_txt{ padding: 0 10px;}
    .curriculum_bar strong{ font-size: 18px;}
    .curriculum_bar.one,.curriculum_txt.one{ width: 300px;}
    .curriculum_bar.two,.curriculum_txt.two{ width: 550px;}
    .curriculum_bar.three,.curriculum_txt.three{ width: 450px;}
}
@media all and (min-width:960px){
    .curriculum_area .black_tit{ font-size: 30px; margin-bottom: 30px;}
    .curriculum_bar{ padding: 0 20px; margin-bottom: 15px; height: 50px; line-height: 50px;}
    .curriculum_bar strong{ font-size: 20px;}
    .curriculum_txt{ padding: 0 20px;}
    .curriculum_bar.one,.curriculum_txt.one{ width: 440px;}
    .curriculum_bar.two,.curriculum_txt.two{ width: 750px;}
    .curriculum_bar.three,.curriculum_txt.three{ width: 550px;}   
}
@media all and (min-width:1080px){
    .curriculum_wrap{ margin-top: 70px;}
    .curriculum_area .black_tit{ font-size: 40px; margin-bottom: 50px;}
    .curriculum_bar{ padding: 0 30px; height: 55px; line-height: 55px;}
    .curriculum_txt{ padding: 0 30px;}
    .curriculum_bar.one,.curriculum_txt.one{ width: 490px;}
    .curriculum_bar.two,.curriculum_txt.two{ width: 800px;}
    .curriculum_bar.three,.curriculum_txt.three{ width: 600px;}
}
@media all and (min-width:1440px){
    .curriculum_wrap{ margin-top: 80px;}
    .curriculum_area .black_tit{ font-size: 46px; margin-bottom: 67px;}
    .curriculum_inner{ margin-bottom: 30px;}
    .curriculum_bar{ padding: 0 40px; margin-bottom: 19px; height: 62px; line-height: 62px;}
    .curriculum_bar strong{ font-size: 23px;}
    .curriculum_bar span{ font-size: 17px;}
    .curriculum_txt{ padding: 0 40px; font-size: 17px;}
    .curriculum_bar.one,.curriculum_txt.one{ width: 585px;}
    .curriculum_bar.two,.curriculum_txt.two{ width: 876px;}
    .curriculum_bar.three,.curriculum_txt.three{ width: 676px;}
}
@media all and (min-width:1920px){
    .curriculum_wrap{ margin-top: 104px;}
}

/* guide_wrap */
.guide_bg{ background: url(../images/sub/m_guide_bg.png) no-repeat 0 50%; background-size: cover;}

.guide_wrap{ margin-top: 60px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
.guide_area{ padding: 15% 3%;}
.guide_area .black_tit{ font-weight: 300; text-align: center; font-size: 24px; color: #fff; margin-bottom: 40px;}
.guide_area .black_tit span{ font-weight: bold; display: block;}
.guide_inner{ margin-bottom: 50px;}
.guide_inner:last-child{ margin-bottom: 0;}

.guide_bar{ padding: 0 6%; height: 80px; border-radius: 18px; background: rgba(255, 255, 255, 0.9); border: 3px solid #284786; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.guide_bar strong{ text-align: center; color: #284786; margin-right: 15px;}
.guide_bar span{ font-size: 15px;}

@media all and (min-width:640px){
    .guide_area .black_tit{ font-size: 25px; margin-bottom: 40px;}
    .guide_area .black_tit span{ display: inline-block;}
    .guide_bar span{ font-size: 14px;}
}
@media all and (min-width:960px){
    .guide_area{ margin-top: 0px; padding: 70px 0;}
    .guide_area .black_tit{ margin-bottom: 45px;}
    .guide_bar{ width: 744px; height: 75px;}
    .guide_bar strong{ font-size: 20px;}
    .guide_bar span{ font-size: 16px;}
}
@media all and (min-width:1080px){
    .guide_bg{ background: url(../images/sub/guide_bg.png) no-repeat 0 50%; background-size: cover;}
    .guide_area{ padding: 70px 0;}
    .guide_area .black_tit{ font-size: 30px; margin-bottom: 50px;}
    .guide_bar{ padding: 0 30px; width: 784px;}
    .guide_bar strong{ margin-right: 25px;}
    .guide_bar strong p{ display: inline-block;}
}
@media all and (min-width:1280px){
    .guide_area{ padding: 100px 0;}
    .guide_inner{ margin-bottom: 60px;}
}
@media all and (min-width:1440px){
    .guide_wrap{ margin-top: 100px;}
    .guide_area{ padding: 150px 0;}
    .guide_area .black_tit{ font-size: 35px;}
    .guide_inner{ margin-bottom: 70px;}
    .guide_bar{ padding: 0 40px; width: 834px; height: 100px;}
    .guide_bar strong{ font-size: 21px; margin-right: 30px;}
    .guide_bar span{ font-size: 17px;}
}
@media all and (min-width:1680px){
    .guide_area{ padding: 200px 0;}
}
@media all and (min-width:1920px){
    .guide_wrap{ margin-top: 125px;}
    .guide_area{ padding: 331px 0;}
    .guide_inner{ margin-bottom: 82px;}
}

/* tier_wrap */
.tier_wrap{ margin: 60px auto;}
.tier_area{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap;}
.tier_box{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; width: 90%; border-radius: 20px; margin-bottom: 25px; box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1); background: #fff;}
.tier_box:last-child{ margin-bottom: 0;}

.tier_inner{ width: 100%; text-align: center;}
.tier_img{ width: 100%; border-top-left-radius: 20px; border-top-right-radius: 20px;}
.tier_inner h4{ font-size: 22px; color: #284786; margin: 20px 0 0 0;}
.tier_dot{ width: 22px; margin: 20px 0;}
.tier_inner strong{ display: block; font-weight: normal; margin-bottom: 20px;}
.tier_inner p:last-child{ margin-bottom: 53px;}
.gray_underline{ margin: 15px 0; display: inline-block; width: 80%; height: 1px; background: #e7e7e7; vertical-align: -1px;}

@media all and (min-width:640px){
    .tier_inner h4{ font-size: 24px; margin: 25px 0 0 0;}
    .tier_dot{ margin: 15px 0;}
    .gray_underline{ margin: 25px 0;}
}
@media all and (min-width:960px){
    .tier_area{ -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; flex-wrap: nowrap; -webkit-flex-wrap: nowrap; flex-wrap: nowrap;}
    .tier_box{ width: 32%; margin-bottom: 0;}
    .tier_inner h4{ font-size: 20px;}
    .gray_underline{ margin: 15px 0;}
    .gray_underline.one{ margin-top: 38px;}
}
@media all and (min-width:1080px){
    .tier_wrap{ margin: 70px auto 90px;}
    .tier_inner h4{ font-size: 23px; margin: 30px 0 0 0;}
    .tier_dot{ width: 22px; margin: 20px 0;}
}
@media all and (min-width:1280px){
    .tier_inner h4{ font-size: 25px; margin: 35px 0 0 0;}
}
@media all and (min-width:1440px){
    .tier_wrap{ margin-top: 80px; margin-bottom: 100px;}
    .tier_inner h4{ font-size: 30px; margin: 50px 0 0 0;}
}
@media all and (min-width:1680px){ 
    .tier_wrap{ margin-top: 100px; margin-bottom: 150px;}
}

/* 서브페이지 02_01 */
.class_wrap{ display: none;}

.class1_wrap{ margin: 60px auto 100px;}
.class1_area .black_tit{ font-weight: 300; text-align: center; font-size: 24px; color: #333; margin-bottom: 30px;}
.class1_area .black_tit span{ font-weight: bold;}

.class1_select{ position: relative; width: 220px; height: 40px; line-height: 40px; font-size: 15px; font-weight: 400; color: #fff; background-color: #284786; border: transparent; border-radius: 12px; cursor: pointer; background-image: url(../images/sub/class_icon.png); background-size: 30px; background-repeat: no-repeat; background-position: 5% 50%; margin: 0 auto;}
.class1_contents{ position: absolute; left: 0; right: 0; top: 40px; text-align: center; color: #333; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; background: #fff; border: 1px solid #e0e0e0; display: none; z-index: 300;}
.class1_tit{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.class1_tit i{ position: absolute; right: 15px; top: 12px;}

.class1_contents li:hover{ border-radius: 5px; background: #e0e0e0;}
.class1_contents .active{ border-radius: 5px; background: #e0e0e0;}

@media all and (min-width:640px){
    .class1_wrap{ margin: 70px auto 100px;}
    .class1_area .black_tit{ font-size: 26px; margin-bottom: 40px;}
}
@media all and (min-width:960px){
    .class1_wrap{ margin: 80px auto 100px;}
    .class1_area .black_tit{ font-size: 28px;}
    .class1_select{ width: 230px; height: 45px; line-height: 45px; font-size: 16px;}
    .class1_contents{ top: 45px;}
}
@media all and (min-width:1080px){
    .class1_wrap{ margin: 90px auto 100px;}
    .class1_area .black_tit{ font-size: 30px; margin-bottom: 60px;}
    .class1_tit i{ position: absolute; right: 17px; top: 15px;}
}
@media all and (min-width:1280px){
    .class1_wrap{ margin: 100px auto;}
    .class1_area .black_tit{ font-size: 40px; margin-bottom: 67px;}
    .class1_select{ width: 250px; height: 50px; line-height: 50px; font-size: 17px; background-size: 35px;}
    .class1_contents{ top: 50px;}
    .class1_tit i{ position: absolute; right: 20px; top: 16px;}
}
@media all and (min-width:1440px){
    .class1_area .black_tit{ margin-bottom: 50px;}
    .class1_select{ font-size: 18px;}
}
@media all and (min-width:1680px){ 
    .class1_wrap{ margin: 104px auto 151px;}
    .class1_area .black_tit{ font-size: 46px;}
    .class1_select{width: 282px; height: 62px; line-height: 62px; font-size: 20px;}
    .class1_contents{ top: 62px;}
    .class1_tit i{ position: absolute; right: 23px; top: 20px;}
}

/* .class1_wrap book_txt */
.class1_wrap .book_txt{ font-size: 18px; color: #333; margin-bottom: 20px;}
.class1_wrap .book_txt h4{ text-align: center; margin-bottom: 5px;}
.class1_wrap .book_txt span{ font-weight: 300;}
.class1_wrap .book_txt p{ font-size: 15px; text-align: center; color: #ff3a1d;}
.class1_wrap .book_img{ width: 100%; height: 100%;}
.class1_wrap .book_img img{ width: 100%; height: 100%;}

@media all and (min-width:640px){
    .class1_wrap .book_txt{ margin: 0 0 25px 0;}
    .class1_wrap .book_txt h4{ font-size: 20px;} 
}
@media all and (min-width:960px){
    .class1_wrap .book_txt{ margin: 0; width: calc(100% - 400px);}
    .class1_wrap .book_txt h4{ font-size: 22px; margin-bottom: 8px;}
    .class1_wrap .book_img{ max-width: 400px;}
}
@media all and (min-width:1080px){
    .class1_wrap .book_txt{ width: calc(100% - 450px);}
    .class1_wrap .book_img{ max-width: 450px;}
}
@media all and (min-width:1280px){
    .class1_wrap .book_txt{ width: calc(100% - 500px);}
    .class1_wrap .book_txt h4{ font-size: 23px; margin-bottom: 10px;}
    .class1_wrap .book_img{ max-width: 500px;}
}
@media all and (min-width:1440px){
    .class1_wrap .book_txt{ width: calc(100% - 550px);}
    .class1_wrap .book_txt h4{ font-size: 24px;}
    .class1_wrap .book_img{ max-width: 550px;}
}
@media all and (min-width:1680px){
    .class1_wrap .book_txt{ width: calc(100% - 594px);}
    .class1_wrap .book_txt h4{ font-size: 25px; margin-bottom: 15px;}
    .class1_wrap .book_img{ max-width: 594px;}
}

/* sound_wrap */
.sound_wrap{ padding: 40px 0 70px 0;}

.sound_tit{ margin-bottom: 30px; height: 40px; line-height: 40px; color: #333; border-radius: 23px; background: #fff; border: 1px solid #36538e; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.sound_tit .tier_left{ width: 40%; font-weight: 400; text-align: center; color: #fff; border-radius: 23px; background: #284786;}
.sound_tit .tier_right{ display: block; width: 60%; text-align: center;}

.sound_txt{ padding: 0 3%; margin-bottom: 22px; font-size: 15px; text-align: justify; line-height: 1.6;}
.sound_book{ border-radius: 8px; padding: 20px; background: #fff; }
.sound_btn{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 15px;}
.sound_btn .btn{ font-size: 15px; font-weight: 400; width: 137px; height: 33px; line-height: 33px;}

@media all and (min-width:640px){
    .sound_tit{ width: 50%; margin: 0 auto 32px;}
    .sound_tit .tier_left{ font-size: 20px;}
    .sound_txt{ margin-bottom: 32px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
    .sound_book{ padding: 31px 30px; background: #f5f5f5;}
    .sound_btn .btn{ font-size: 16px;}
}
@media all and (min-width:960px){
    .sound_wrap{ padding: 80px 0 0 0;}
    .sound_tit{ width: 35%; height: 45px; line-height: 45px;}
    .sound_tit .tier_left{ font-size: 22px;}
    .sound_txt{ margin-bottom: 43px; line-height: 1.7;}
    .sound_book{ padding: 31px 30px 31px 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
   .sound_btn{ margin-bottom: 23px;}
   .sound_btn .btn{ font-size: 18px;}
}
@media all and (min-width:1280px){
    .sound_wrap{ padding: 100px 0 0 0;}
    .sound_tit{ margin: 0 auto 42px;}
    .sound_tit .tier_left{ font-size: 26px;}
    .sound_tit .tier_right{ font-size: 20px;}
    .sound_txt{ padding: 0 10%; margin-bottom: 53px; text-align: center;}
}
@media all and (min-width:1440px){
    .sound_wrap{ padding: 125px 0 0 0;}
    .sound_tit{ margin: 0 auto 52px; height: 47px; line-height: 47px;}
    .sound_tit .tier_left{ font-size: 28px;}
    .sound_tit .tier_right{ font-size: 22px;}
    .sound_txt{ padding: 0 5%; margin: 0 auto 53px; font-size: 17px;}
    .sound_book{ padding: 41px 40px 41px 0;}
    .sound_btn{ margin-bottom: 31px;}
    .sound_btn .btn{ font-size: 19px;}
}
@media all and (min-width:1680px){
    .sound_tit .tier_left{ font-size: 30px;}
    .sound_tit .tier_right{ font-size: 25px;}
    .sound_btn .btn{ font-size: 21px;}
}

/* fluen_wrap */
.fluen_wrap{ padding: 28px 0 70px 0;}

.fluen_tit{ margin-bottom: 30px; height: 40px; line-height: 40px; color: #333; border-radius: 23px; background: #fff; border: 1px solid #36538e; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.fluen_tit .tier_left{ width: 40%; text-align: center; color: #fff; font-weight: 400; border-radius: 23px; background: #284786;}
.fluen_tit .tier_right{ display: block; width: 60%; text-align: center;}

.fluen_txt{ padding: 0 3%; margin-bottom: 22px; font-size: 15px; text-align: justify; line-height: 1.6;}
.fluen_book{ border-radius: 8px; background: #f5f5f5; padding: 20px;}
.fluen_book .book_txt{ margin: 20px 0 0 0;}
.fluen_btn{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 15px;}
.fluen_btn .btn{ font-size: 15px; font-weight: 400; width: 163px; height: 33px; line-height: 33px;}

@media all and (min-width:640px){
    .fluen_tit{ width: 50%; margin: 0 auto 32px;}
    .fluen_tit .tier_left{ font-size: 20px;}
    .fluen_txt{ margin-bottom: 32px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
    .fluen_book{ padding: 31px 30px;}
    .fluen_book .book_txt{ margin: 25px 0 0 0;}
    .fluen_btn .btn{ font-size: 16px;}
}
@media all and (min-width:960px){
    .fluen_wrap{ padding: 80px 0 0 0;}
    .fluen_tit{ width: 35%; height: 45px; line-height: 45px;}
    .fluen_tit .tier_left{ font-size: 22px;}
    .fluen_txt{ padding: 0 3%; margin-bottom: 43px; line-height: 1.7;}
    .fluen_book{ padding: 31px 0 31px 30px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
    .fluen_book .book_txt{ margin: 0;}
    .fluen_btn{ margin-bottom: 23px;}
    .fluen_btn .btn{ font-size: 18px;}
}
@media all and (min-width:1280px){
    .fluen_wrap{ padding: 100px 0 0 0;}
    .fluen_tit{ margin: 0 auto 42px;}
    .fluen_tit .tier_left{ font-size: 26px;}
    .fluen_tit .tier_right{ font-size: 20px;}
    .fluen_txt{ padding: 0 12%; margin-bottom: 53px; text-align: center;}
}
@media all and (min-width:1440px){
    .fluen_wrap{ padding: 125px 0 0 0;}
    .fluen_tit{ margin: 0 auto 52px; height: 47px; line-height: 47px;}
    .fluen_tit .tier_left{ font-size: 28px;}
    .fluen_tit .tier_right{ font-size: 22px;}
    .fluen_txt{ padding: 0 7%; margin: 0 auto 53px; font-size: 17px;}
    .fluen_book{ padding: 41px 0 41px 40px;}
    .fluen_btn{ margin-bottom: 31px;}
    .fluen_btn .btn{ font-size: 19px;}
}
@media all and (min-width:1680px){
    .fluen_tit .tier_left{ font-size: 30px;}
    .fluen_tit .tier_right{ font-size: 25px;}
    .fluen_btn .btn{ font-size: 21px;}
}

/* connec_wrap */
.connec_wrap{ padding: 28px 0 0 0;}

.connec_tit{ margin-bottom: 30px; height: 40px; line-height: 40px; color: #333; border-radius: 23px; background: #fff; border: 1px solid #36538e; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.connec_tit .tier_left{ width: 40%; font-weight: 400; text-align: center; color: #fff; border-radius: 23px; background: #284786;}
.connec_tit .tier_right{ display: block; width: 60%; text-align: center;}

.connec_txt{ padding: 0 3%; margin-bottom: 22px; font-size: 15px; text-align: justify; line-height: 1.6;}
.connec_book{ border-radius: 8px; background: #fff; padding: 20px;}
.connec_btn{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 15px;}
.connec_btn .btn{ font-size: 15px; font-weight: 400; width: 172px; height: 33px; line-height: 33px;}

@media all and (min-width:640px){
    .connec_tit{ width: 50%; margin: 0 auto 32px;}
    .connec_tit .tier_left{ font-size: 20px;}
    .connec_txt{ margin-bottom: 32px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
    .connec_book{ padding: 31px 30px; background: #f5f5f5;}
    .connec_btn .btn{ font-size: 16px;}
}
@media all and (min-width:960px){
    .connec_wrap{ padding: 80px 0 0 0;}
    .connec_tit{ width: 35%; height: 45px; line-height: 45px;}
    .connec_tit .tier_left{ font-size: 22px;}
    .connec_txt{ margin-bottom: 43px; line-height: 1.7;}
    .connec_book{ padding: 31px 30px 31px 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
   .connec_btn{ margin-bottom: 23px;}
   .connec_btn .btn{ font-size: 18px;}
}
@media all and (min-width:1280px){
    .connec_wrap{ padding: 100px 0 0 0;}
    .connec_tit{ margin: 0 auto 42px;}
    .connec_tit .tier_left{ font-size: 26px;}
    .connec_tit .tier_right{ font-size: 20px;}
    .connec_txt{ padding: 0 4%; margin-bottom: 53px; text-align: center;}
}
@media all and (min-width:1440px){
    .connec_wrap{ padding: 125px 0 0 0;}
    .connec_tit{ margin: 0 auto 52px; height: 47px; line-height: 47px;}
    .connec_tit .tier_left{ font-size: 28px;}
    .connec_tit .tier_right{ font-size: 22px;}
    .connec_txt{ padding: 0; margin: 0 auto 53px; font-size: 17px;}
    .connec_book{ padding: 41px 40px 41px 0;}
    .connec_btn{ margin-bottom: 31px;}
    .connec_btn .btn{ font-size: 19px;}
}
@media all and (min-width:1680px){
    .connec_tit .tier_left{ font-size: 30px;}
    .connec_tit .tier_right{ font-size: 25px;}
    .connec_btn .btn{ font-size: 21px;}
}

/* 서브페이지 02_02 */
.class2_txt{ padding: 0 3%; margin: 40px auto; font-size: 15px; text-align: justify; line-height: 1.6;}
.class2_txt strong{ font-size: 20px; margin-bottom: 15px; display: block; text-align: center; color: #333;}

@media all and (min-width:640px){
    .class2_txt{ padding: 0 5%;}
    .class2_txt strong{ font-size: 24px;}
}
@media all and (min-width:960px){
    .class2_txt{ margin: 45px auto; line-height: 1.7;}
    .class2_txt strong{ font-size: 26px; margin-bottom: 20px;}
}
@media all and (min-width:1080px){
    .class2_txt{ margin: 55px auto; font-size: 16px; line-height: 1.8; text-align: center;}
    .class2_txt strong{ font-size: 28px; margin-bottom: 25px;}
}
@media all and (min-width:1280px){
    .class2_txt{ padding: 0 10%;}
}
@media all and (min-width:1440px){
    .class2_txt{ margin: 68px auto;}
    .class2_txt strong{ font-size: 30px; margin-bottom: 30px;}
}
@media all and (min-width:1680px){
    .class2_txt{ padding: 0 5%; font-size: 17px;}
    .class2_txt strong{ font-size: 35px; margin-bottom: 39px;}
}

/* .class2_wrap book_txt */
.class2_wrap .book_txt{ font-size: 18px; color: #333;}
.class2_wrap .book_txt h4{ text-align: center; margin-bottom: 5px;}
.class2_wrap .book_txt span{ font-weight: 300;}
.class2_wrap .book_txt p{ font-size: 15px; text-align: center; color: #ff3a1d;}
.class2_wrap .book_img{ width: 100%; height: 100%; margin-top: 20px;}
.class2_wrap .book_img img{ width: 100%; height: 100%;}

@media all and (min-width:640px){
    .class2_wrap .book_txt h4{ font-size: 20px;}
}
@media all and (min-width:960px){
    .class2_wrap .book_txt{ width: calc(100% - 400px);}
    .class2_wrap .book_txt h4{ font-size: 22px; margin-bottom: 8px;}
    .class2_wrap .book_img{ max-width: 400px; margin-top: 0;}
}
@media all and (min-width:1080px){
    .class2_wrap .book_txt{ width: calc(100% - 450px);}
    .class2_wrap .book_img{ max-width: 450px;}
}
@media all and (min-width:1280px){
    .class2_wrap .book_txt{ width: calc(100% - 500px);}
    .class2_wrap .book_txt h4{ font-size: 23px; margin-bottom: 10px;}
    .class2_wrap .book_img{ max-width: 500px;}
}
@media all and (min-width:1440px){
    .class2_wrap .book_txt{ width: calc(100% - 550px);}
    .class2_wrap .book_txt h4{ font-size: 24px;}
    .class2_wrap .book_img{ max-width: 550px;}
}
@media all and (min-width:1680px){
    .class2_wrap .book_txt{ width: calc(100% - 594px);}
    .class2_wrap .book_txt h4{ font-size: 25px; margin-bottom: 15px;}
    .class2_wrap .book_img{ max-width: 594px;}
}

/* basic_wrap */
.basic_wrap{ padding: 28px 0 70px 0;}

.basic_tit{ margin-bottom: 30px; height: 40px; line-height: 40px; color: #333; border-radius: 23px; background: #fff; border: 1px solid #36538e; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.basic_tit .tier_left{ width: 35%; font-weight: 400; text-align: center; color: #fff; border-radius: 23px; background: #284786;}
.basic_tit .tier_right{ display: block; width: 65%; text-align: center;}
.basic_book{ border-radius: 8px; background: #fff; padding: 20px;}

@media all and (min-width:640px){
    .basic_tit{ width: 50%; margin: 0 auto 32px;}
    .basic_tit .tier_left{ font-size: 20px;}
    .basic_book{ padding: 31px 30px; background: #f5f5f5;}
}
@media all and (min-width:960px){
    .basic_wrap{ padding: 38px 0 80px 0;}
    .basic_tit{ width: 35%; height: 45px; line-height: 45px;}
    .basic_tit .tier_left{ font-size: 22px;}
    .basic_book{ padding: 31px 30px 31px 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
}
@media all and (min-width:1280px){
    .basic_wrap{ padding: 48px 0 90px 0;}
    .basic_tit{ margin: 0 auto 42px; width: 40%;}
    .basic_tit .tier_left{ font-size: 26px;}
    .basic_tit .tier_right{ font-size: 20px;}
}
@media all and (min-width:1440px){
    .basic_wrap{ padding: 58px 0 100px 0;}
    .basic_tit{ margin: 0 auto 52px; width: 45%; height: 47px; line-height: 47px;}
    .class2_area .black_tit{ font-size: 46px; margin-bottom: 69px;}
    .basic_tit .tier_left{ font-size: 28px;}
    .basic_tit .tier_right{ font-size: 22px;}
    .basic_book{ padding: 41px 40px 41px 0;}
}
@media all and (min-width:1680px){
    .basic_tit .tier_left{ font-size: 30px;}
    .basic_tit .tier_right{ font-size: 25px;}
}

/* level_01_wrap */
.level_01_wrap{ padding: 28px 0 70px 0;}

.level_01_tit{ margin-bottom: 30px; height: 40px; line-height: 40px; color: #333; border-radius: 23px; background: #fff; border: 1px solid #36538e; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.level_01_tit .tier_left{ width: 40%; font-weight: 400; text-align: center; color: #fff; border-radius: 23px; background: #284786;}
.level_01_tit .tier_right{ display: block; width: 60%; text-align: center;}
.level_01_book{ border-radius: 8px; padding: 20px; background: #f5f5f5;}

@media all and (min-width:640px){
    .level_01_tit{ width: 50%; margin: 0 auto 32px;}
    .level_01_tit .tier_left{ font-size: 20px;}
    .level_01_book{ padding: 31px 30px;}
}
@media all and (min-width:960px){
    .level_01_wrap{ padding: 38px 0 80px 0;}
    .level_01_tit{ width: 35%; height: 45px; line-height: 45px;}
    .level_01_tit .tier_left{ font-size: 22px;}
    .level_01_book{ padding: 31px 0 31px 30px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
}
@media all and (min-width:1280px){
    .level_01_wrap{ padding: 48px 0 90px 0;}
    .level_01_tit{ margin: 0 auto 42px; width: 40%;}
    .level_01_tit .tier_left{ font-size: 26px;}
    .level_01_tit .tier_right{ font-size: 20px;}
}
@media all and (min-width:1440px){
    .level_01_wrap{ padding: 58px 0 100px 0;}
    .level_01_tit{ margin: 0 auto 52px; width: 45%; height: 47px; line-height: 47px;}
    .level_01_tit .tier_left{ font-size: 28px;}
    .level_01_tit .tier_right{ font-size: 22px;}
    .level_01_book{ padding: 41px 0 41px 40px;}
}
@media all and (min-width:1680px){
    .level_01_tit .tier_left{ font-size: 30px;}
    .level_01_tit .tier_right{ font-size: 25px;}
}

/* level_02_wrap */
.level_02_wrap{ padding: 28px 0 0 0;}

.level_02_tit{ margin-bottom: 30px; height: 40px; line-height: 40px; color: #333; border-radius: 23px; background: #fff; border: 1px solid #36538e; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.level_02_tit .tier_left{ width: 40%; font-weight: 400; text-align: center; color: #fff; border-radius: 23px; background: #284786;}
.level_02_tit .tier_right{ display: block; width: 60%; text-align: center;}
.level_02_book{ border-radius: 8px; background: #f5f5f5; padding: 20px;}

@media all and (min-width:640px){
    .level_02_tit{ width: 50%; margin: 0 auto 32px;}
    .level_02_tit .tier_left{ font-size: 20px;}
    .level_02_book{ padding: 31px 30px;}
}
@media all and (min-width:960px){
    .level_02_wrap{ padding: 38px 0 80px 0;}
    .level_02_tit{ width: 35%; height: 45px; line-height: 45px;}
    .level_02_tit .tier_left{ font-size: 22px;}
    .level_02_book{ padding: 31px 30px 31px 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
}
@media all and (min-width:1280px){
    .level_02_wrap{ padding: 48px 0 90px 0;}
    .level_02_tit{ width: 40%; margin: 0 auto 42px;}
    .level_02_tit .tier_left{ font-size: 26px;}
    .level_02_tit .tier_right{ font-size: 20px;}
}
@media all and (min-width:1440px){
    .level_02_wrap{ padding: 58px 0 100px 0;}
    .level_02_tit{ margin: 0 auto 52px; width: 45%; height: 47px; line-height: 47px;}
    .level_02_tit .tier_left{ font-size: 28px;}
    .level_02_tit .tier_right{ font-size: 22px;}
    .level_02_book{ padding: 41px 40px 41px 0;}
}
@media all and (min-width:1680px){
    .level_02_tit .tier_left{ font-size: 30px;}
    .level_02_tit .tier_right{ font-size: 25px;}
}

/* 서브페이지 02_03 */
/* learning_wrap */
.learning_wrap{ margin: 0 auto 100px;}
.learning_area .black_tit{ font-weight: 300; text-align: center; font-size: 24px; color: #333; margin-bottom: 30px;}
.learning_area .black_tit span{ font-weight: bold;}

.learning_select{ position: relative; width: 170px; height: 40px; line-height: 40px; font-weight: 400; color: #fff; background-color: #284786; border: transparent; border-radius: 12px; cursor: pointer; background-image: url(../images/sub/class_icon.png); background-size: 30px; background-repeat: no-repeat; background-position: 7% 50%; padding-left: 55px; margin: 0 auto;}
.learning_contents{ position: absolute; left: 0; right: 0; top: 40px; text-align: center; color: #333; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; background: #fff; border: 1px solid #e0e0e0; display: none;}
.learning_tit{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.learning_tit i{ margin-left: 10px;}

.learning_contents li:hover{ border-radius: 5px; background: #e0e0e0;}
.learning_contents .active{ border-radius: 5px; background: #e0e0e0;}

@media all and (min-width:640px){
    .learning_wrap{ margin: 0 auto 100px;}
    .learning_area .black_tit{ font-size: 26px; margin-bottom: 40px;}
    .learning_select{ background-position: 10% 50%;}
    .learning_contents{ top: 40px;}
}
@media all and (min-width:960px){
    .learning_area .black_tit{ font-size: 28px;}
    .learning_select{ width: 200px; height: 45px; line-height: 45px; font-size: 16px; padding-left: 70px;}
    .learning_contents{ top: 45px;}
}
@media all and (min-width:1080px){
    .learning_area .black_tit{ font-size: 30px; margin-bottom: 60px;}
}
@media all and (min-width:1280px){
    .learning_area .black_tit{ font-size: 40px; margin-bottom: 67px;}
    .learning_select{ width: 230px; height: 50px; line-height: 50px; font-size: 18px; background-size: 35px; padding-left: 81px;}
    .learning_contents{ top: 50px;}
}
@media all and (min-width:1440px){
    .learning_wrap{ margin: 0 auto 206px;}
    .learning_area .black_tit{ margin-bottom: 50px;}
    .learning_select{ width: 250px; font-size: 20px; padding-left: 85px;}
}
@media all and (min-width:1680px){ 
    .learning_area .black_tit{ font-size: 40px;}
    .learning_select{ width: 280px; height: 60px; line-height: 60px; font-size: 23px; background-size: 38px; padding-left: 95px;}
    .learning_contents{ top: 60px;}
}
@media all and (min-width:1920px){
    .learning_wrap{ margin: 0 auto 250px;}
    .learning_area .black_tit{ font-size: 46px;}
    .learning_select{ width: 282px; height: 62px; line-height: 62px; padding-left: 97px;} 
    .learning_contents{ top: 62px;}
}

/* .learning_wrap .book_img */
.learning_wrap .book_img{ width: 100%; height: 100%; max-width: 921px; margin: 0 auto;}
.learning_wrap .book_img img{ width: 100%; height: 100%;}

/* voca_wrap */
.voca_wrap{ padding: 40px 0 70px 0;}

.voca_tit{ margin-bottom: 30px; height: 40px; line-height: 40px; color: #333; border-radius: 23px; background: #fff; border: 1px solid #36538e; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.voca_tit .track_left{ width: 40%; font-weight: 400; text-align: center; color: #fff; border-radius: 23px; background: #284786;}
.voca_tit .track_right{ display: block; width: 60%; text-align: center;}
.voca_txt{ padding: 0 3%; margin-bottom: 22px; font-size: 15px; text-align: justify; line-height: 1.6; color: #333;}
.voca_txt p{ font-size: 18px; text-align: center; margin-bottom: 15px;}
.voca_txt strong{ display: block;}
.voca_book{ border-radius: 8px; background: #fff; padding: 20px;}

@media all and (min-width:640px){
    .voca_tit{ width: 50%; margin: 0 auto 32px;}
    .voca_tit .track_left{ font-size: 20px;}
    .voca_txt{ padding: 0 5%; margin-bottom: 34px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
    .voca_txt p{ font-size: 20px; margin-bottom: 20px;}
    .voca_txt strong{ display: inline;}
    .voca_book{ padding: 33px 40px; background: #f5f5f5;}
}
@media all and (min-width:960px){
    .voca_wrap{ padding: 80px 0 0 0;}
    .voca_tit{ width: 35%; height: 45px; line-height: 45px;}
    .voca_tit .track_left{ font-size: 22px;}
    .voca_txt{ margin-bottom: 44px; line-height: 1.7;}
    .voca_txt p{ font-size: 25px;}
}
@media all and (min-width:1280px){
    .voca_wrap{ padding: 100px 0 0 0;}
    .voca_tit{ width: 40%; margin: 0 auto 42px;}
    .voca_tit .track_left{ font-size: 26px;}
    .voca_tit .track_right{ font-size: 20px;}
    .voca_txt{ margin-bottom: 54px; text-align: center; padding: 0 9%;}
}
@media all and (min-width:1440px){
    .voca_wrap{ padding: 125px 0 0 0;}
    .voca_tit{ margin: 0 auto 52px; width: 45%; height: 47px; line-height: 47px;}
    .voca_tit .track_left{ font-size: 28px;}
    .voca_tit .track_right{ font-size: 22px;}
    .voca_txt{ margin: 0 auto 54px; font-size: 17px;}
    .voca_txt p{ font-size: 30px; margin-bottom: 35px;}
}
@media all and (min-width:1680px){
    .voca_tit .track_left{ font-size: 30px;}
    .voca_tit .track_right{ font-size: 25px;}
    .voca_txt p{ font-size: 35px; margin-bottom: 40px;}
}

/* wise_wrap */
.wise_wrap{ padding: 28px 0 70px 0;}

.wise_tit{ margin-bottom: 30px; height: 40px; line-height: 40px; color: #333; border-radius: 23px; background: #fff; border: 1px solid #36538e; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.wise_tit .track_left{ width: 40%; text-align: center; color: #fff; font-weight: 400; border-radius: 23px; background: #284786;}
.wise_tit .track_right{ display: block; width: 60%; text-align: center;}
.wise_txt{ padding: 0 3%; margin-bottom: 22px; font-size: 15px; text-align: justify; line-height: 1.6; color: #333;}
.wise_txt p{ font-size: 18px; text-align: center; margin-bottom: 15px;}
.wise_txt strong{ display: block;}
.wise_book{ border-radius: 8px; background: #f5f5f5; padding: 20px;}

@media all and (min-width:640px){
    .wise_tit{ width: 50%; margin: 0 auto 32px;}
    .wise_tit .track_left{ font-size: 20px;}
    .wise_txt{ padding: 0 5%; margin-bottom: 32px; display: -webkit-box; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
    .wise_txt p{ font-size: 20px; margin-bottom: 20px;}
    .wise_txt strong{ display: inline;}
    .wise_book{ padding: 33px 40px;}
}
@media all and (min-width:960px){
    .wise_wrap{ padding: 80px 0 0 0;}
    .wise_tit{ width: 35%; height: 45px; line-height: 45px;}
    .wise_tit .track_left{ font-size: 22px;}
    .wise_txt{ margin-bottom: 43px; line-height: 1.7;}
    .wise_txt p{ font-size: 25px;}
}
@media all and (min-width:1280px){
    .wise_wrap{ padding: 100px 0 0 0;}
    .wise_tit{ width: 40%; margin: 0 auto 42px;}
    .wise_tit .track_left{ font-size: 26px;}
    .wise_tit .track_right{ font-size: 20px;}
    .wise_txt{ margin-bottom: 53px; text-align: center;  padding: 0 9%;}
}
@media all and (min-width:1440px){
    .wise_wrap{ padding: 126px 0 0 0;}
    .wise_tit{ margin: 0 auto 52px; width: 45%; height: 47px; line-height: 47px;}
    .wise_tit .track_left{ font-size: 28px;}
    .wise_tit .track_right{ font-size: 22px;}
    .wise_txt{ padding: 0 10%; margin: 0 auto 54px; font-size: 17px;}
    .wise_txt p{ font-size: 30px; margin-bottom: 35px;}
}
@media all and (min-width:1680px){
    .wise_tit .track_left{ font-size: 30px;}
    .wise_tit .track_right{ font-size: 25px;}
    .wise_txt p{ font-size: 35px; margin-bottom: 40px;}
}

/* unit_wrap */
.unit_wrap{ padding: 28px 0 0 0;}

.unit_tit{ margin-bottom: 30px; height: 40px; line-height: 40px; color: #333; border-radius: 23px; background: #fff; border: 1px solid #36538e; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.unit_tit .track_left{ width: 100%; font-weight: 400; text-align: center; color: #fff; border-radius: 23px; background: #284786;}

/* unit_top */
.unit_top{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; margin-bottom: 30px;}
.top_inner{ width: 639px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-around; flex-wrap: wrap;}

.top_day{ width: 135px; text-align: center; margin-bottom: 20px;}
.top_day .day_txt{ display: block; font-size: 16px; font-weight: bold; color: #333; margin-bottom: 15px;}
.top_day .day_img{ height: 133px; background: #f5f5f5; border-radius: 6px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-repeat: no-repeat; background-size: contain;} 
.top_day .day_img.self{ background-image: url(../images/sub/unit_01.png);}
.top_day .day_img.coach{ background-image: url(../images/sub/unit_02.png);}

/* unit_bottom */
.unit_bottom{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.bottom_inner{ width: 1100px;}

.bottom_day{ text-align: center;}
.bottom_box.one{ margin-bottom: 50px;}
.bottom_day .day_img{ height: 133px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-repeat: no-repeat; background-size: contain;}
.bottom_day .day_img.self{ width: 135px; margin: 0 auto 30px; background-image: url(../images/sub/unit_03.png);}
.bottom_day .day_img.coach{ width: 135px; margin: 0 auto 30px; background-image: url(../images/sub/unit_04.png);}

.bottom_day .day_txt{ position: relative; width: 90%; margin: 0 auto; padding: 30px; display: block; line-height: 1.6; color: #fff; background: #284786; border-radius: 6px; display: flex; justify-content: center; align-items: center;}
.bottom_day .day_txt::after{ position: absolute; left: 45%; top: -20px; content: ''; display: block; width: 30px; height: 30px; background: url(../images/sub/unit_06.png) no-repeat;}

@media all and (min-width:640px){
    .unit_tit{ width: 50%; margin: 0 auto 32px;}
    .unit_tit .track_left{ font-size: 20px;}

    .unit_bottom{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}

    .bottom_inner{ width: 100%; margin: 0 auto; display: flex; justify-content: center; flex-wrap: wrap}
    .bottom_box{ width: 450px; height: 166px; margin-bottom: 0; display: flex; justify-content: space-around;}

    .unit_img{ display: flex; align-items: flex-end}
    .bottom_day .day_img{ height: 130px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-repeat: no-repeat; background-size: contain;}
    .bottom_day .day_img.self{ width: 130px; margin: 0;}
    .bottom_day .day_img.coach{ width: 130px; margin: 0;}

    .bottom_day .day_txt{ position: relative; width: 270px; margin: 0; padding: 0; display: flex; justify-content: center; align-items: center; background: #284786; font-size: 15px; line-height: 1.5;}
    .bottom_day .day_txt::after{ position: absolute; left: -20px; top: 30px; content: ''; display: block; width: 30px; height: 30px; background: url(../images/sub/unit_05.png) no-repeat;}
    .day_txt.one{ height: 100px;}
    .day_txt.two{ height: 130px;}
}
@media all and (min-width:960px){
    .unit_wrap{ padding: 80px 0 0 0;}
    .unit_tit{ width: 35%; height: 45px; line-height: 45px;}
    .unit_tit .track_left{ font-size: 22px;}

    .unit_top{ margin-bottom: 55px;}
    .top_day{ margin-bottom: 0;}

    .unit_bottom{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
    .bottom_inner{ width: 100%; margin: 0 auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}

    .bottom_box{ width: 450px; height: 166px; margin-bottom: 0; display: flex; justify-content: space-around;}
    .bottom_box.one{ margin-bottom: 0;}

    .unit_img{ display: flex; align-items: flex-end}
    .bottom_day .day_img{ height: 130px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; background-repeat: no-repeat; background-size: contain;}
    .bottom_day .day_img.self{ width: 130px; margin: 0;}
    .bottom_day .day_img.coach{ width: 130px; margin: 0;}

    .bottom_day .day_txt{ position: relative; width: 270px; margin: 0; padding: 0; display: flex; justify-content: center; align-items: center; background: #284786; font-size: 15px; line-height: 1.5;}
    .bottom_day .day_txt::after{ position: absolute; left: -20px; top: 30px; content: ''; display: block; width: 30px; height: 30px; background: url(../images/sub/unit_05.png) no-repeat;}
    .day_txt.one{ height: 100px;}
    .day_txt.two{ height: 130px;}
    
}
@media all and (min-width:1280px){
    .unit_wrap{ padding: 100px 0 0 0;}
    .unit_tit{ width: 40%; margin: 0 auto 42px;}
    .unit_tit .track_left{ font-size: 26px;}

    .top_day{ margin-bottom: 0;}
    .top_day .day_txt{ font-size: 18px; margin-bottom: 20px;}

    .bottom_box{ width: 480px;}
    .bottom_day .day_img.self{ width: 140px;}
    .bottom_day .day_img.coach{ width: 140px;;}
    .bottom_day .day_txt{ width: 300px; font-size: 16px;}
    .day_txt.one{ height: 110px;}
    .day_txt.two{ height: 137px;}
}
@media all and (min-width:1440px){
    .unit_wrap{ padding: 126px 0 0 0;}
    .unit_tit{ margin: 0 auto 52px; height: 47px; line-height: 47px;}
    .unit_tit .track_left{ font-size: 28px;}

    .bottom_inner{ width: 1121px;}
    .bottom_box{ width: 490px; }
    .bottom_day .day_img{ height: 148px;}
    .bottom_day .day_img.self{ width: 148px;}
    .bottom_day .day_img.coach{ width: 148px;}
    .bottom_day .day_txt{ width: 300px;}
}
@media all and (min-width:1680px){
    .unit_tit .track_left{ font-size: 30px;}
    .top_day .day_txt{ font-size: 20px; margin-bottom: 23px;}
    .bottom_day .day_txt{ font-size: 17px;}
}

/* 서브페이지 02_04 */
/* intensive_wrap */
.intensive_wrap{ margin: 0 auto 100px;}
.intensive_area .black_tit{ font-weight: 300; text-align: center; font-size: 24px; color: #333; margin-bottom: 30px;}
.intensive_area .black_tit span{ font-weight: bold;}

.intensive_select{ position: relative; width: 230px; height: 40px; line-height: 40px; font-weight: 400; color: #fff; background-color: #284786; border: transparent; border-radius: 12px; cursor: pointer; background-image: url(../images/sub/class_icon.png); background-size: 30px; background-repeat: no-repeat; background-position: 7% 50%; padding-left: 55px; margin: 0 auto;}
.intensive_contents{ position: absolute; left: 0; right: 0; top: 40px; text-align: center; color: #333; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; background: #fff; border: 1px solid #e0e0e0; display: none;}
.intensive_tit{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.intensive_tit i{ margin-left: 10px;}

.intensive_contents li:hover{ border-radius: 5px; background: #e0e0e0;}
.intensive_contents .active{ border-radius: 5px; background: #e0e0e0;}

.intensive_txt{ padding: 0 3%; margin: 38px auto 0; font-size: 15px; text-align: justify; line-height: 1.6;}
.intensive_txt strong{ font-size: 20px; margin-bottom: 15px; display: block; text-align: center; color: #333;}
.intensive_txt span{ font-weight: 300;}

@media all and (min-width:640px){
    .intensive_area .black_tit{ font-size: 26px; margin-bottom: 40px;}
    .intensive_select{ background-position: 10% 50%;}
    .intensive_contents{ top: 40px;}
    .intensive_txt{ padding: 0 5%;}
    .intensive_txt strong{ font-size: 24px;}
}
@media all and (min-width:960px){
    .intensive_area .black_tit{ font-size: 28px;}
    .intensive_select{ width: 250px; height: 45px; line-height: 45px; font-size: 16px; padding-left: 70px;}
    .intensive_contents{ top: 45px;}
    .intensive_txt{ margin: 45px auto 0; line-height: 1.7; text-align: center;}
    .intensive_txt strong{ font-size: 26px; margin-bottom: 20px;}
}
@media all and (min-width:1080px){
    .intensive_area .black_tit{ font-size: 30px; margin-bottom: 60px;}
    .intensive_select{ width: 270px; height: 50px; line-height: 50px; font-size: 18px;}
    .intensive_contents{ top: 50px;}
    .intensive_txt{ margin: 55px auto 0; padding: 0 10%; font-size: 16px; line-height: 1.8; text-align: center;}
    .intensive_txt strong{ font-size: 28px; margin-bottom: 25px;}
}
@media all and (min-width:1280px){
    .intensive_area .black_tit{ font-size: 40px; margin-bottom: 67px;}
    .intensive_select{ background-size: 35px; padding-left: 81px;}
    .intensive_txt strong{ font-size: 28px; margin-bottom: 25px;}
}
@media all and (min-width:1440px){
    .intensive_wrap{ margin: 0 auto 206px;}
    .intensive_area .black_tit{ margin-bottom: 50px;}
    .intensive_select{ width: 280px; font-size: 20px; padding-left: 75px;}
    .intensive_txt{ margin: 69px auto 0; padding: 0; font-size: 16px; width: 700px;}
    .intensive_txt strong{ font-size: 30px; margin-bottom: 30px;}
}
@media all and (min-width:1680px){ 
    .intensive_wrap{ margin: 0 auto 250px;}
    .intensive_area .black_tit{ font-size: 46px; margin-bottom: 60px;}
    .intensive_select .btn_value{ width: 38px; height: 38px;}
    .intensive_txt{ font-size: 17px; padding: 0 5.5%;}
}
@media all and (min-width:1920px){
    .intensive_area .black_tit{ font-size: 40px;}
    .intensive_txt strong{ font-size: 35px; margin-bottom: 39px;}
}

/* .intensive_wrap .book_img */
.intensive_wrap .book_img{ width: 100%; height: 100%; max-width: 583px;}
.intensive_wrap .book_img img{ width: 100%; height: 100%;}

/* sentence_wrap */
.sentence_wrap{ padding: 40px 0 50px 0;}

.sentence_tit{ margin-bottom: 30px; height: 40px; line-height: 40px; color: #333; border-radius: 23px; background: #fff; border: 1px solid #36538e; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.sentence_tit .tier_left{ width: 35%; font-weight: 400; text-align: center; color: #fff; border-radius: 23px; background: #284786;}
.sentence_tit .tier_right{ display: block; width: 65%; text-align: center;}
.sentence_book{ border-radius: 8px; background: #f5f5f5; padding: 20px;}

@media all and (min-width:640px){
    .sentence_tit{ width: 60%; margin: 0 auto 32px;}
    .sentence_tit .tier_left{ font-size: 20px;}
    .sentence_book{ padding: 41px 58px;}
}
@media all and (min-width:960px){
    .sentence_wrap{ padding: 80px 0 0 0;}
    .sentence_tit{ width: 40%; height: 45px; line-height: 45px;}
    .sentence_tit .tier_left{ font-size: 22px;}
    .sentence_book{ width: 700px; margin: 0 auto;}
}
@media all and (min-width:1280px){
    .sentence_wrap{ padding: 100px 0 0 0;}
    .sentence_tit{ width: 45%; margin: 0 auto 42px;}
    .sentence_tit .tier_left{ font-size: 26px;}
    .sentence_tit .tier_right{ font-size: 20px;}
}
@media all and (min-width:1440px){
    .sentence_wrap{ padding: 126px 0 0 0;} 
    .sentence_tit{ margin: 0 auto 52px; width: 502px; height: 47px; line-height: 47px;}
    .sentence_tit .tier_left{ font-size: 28px;}
    .sentence_tit .tier_right{ font-size: 22px;}
} 
@media all and (min-width:1680px){
    .sentence_tit .tier_left{ font-size: 30px;}
    .sentence_tit .tier_right{ font-size: 25px;}
}

/* structural_wrap */
.structural_wrap{ padding: 28px 0 50px 0;}

.structural_tit{ margin-bottom: 30px; height: 40px; line-height: 40px; color: #333; border-radius: 23px; background: #fff; border: 1px solid #36538e; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.structural_tit .tier_left{ width: 35%; font-weight: 400; text-align: center; color: #fff; border-radius: 23px; background: #284786;}
.structural_tit .tier_right{ display: block; width: 65%; text-align: center;}
.structural_book{ border-radius: 8px; background: #f5f5f5; padding: 20px;}

@media all and (min-width:640px){
    .structural_tit{ width: 60%; margin: 0 auto 32px;}
    .structural_tit .tier_left{ font-size: 20px;}
    .structural_book{ padding: 41px 58px;}
}
@media all and (min-width:960px){
    .structural_wrap{ padding: 80px 0 0 0;}
    .structural_tit{ width: 40%; height: 45px; line-height: 45px;}
    .structural_tit .tier_left{ font-size: 22px;}
    .structural_book{ width: 700px; margin: 0 auto;}
}
@media all and (min-width:1280px){
    .structural_wrap{ padding: 100px 0 0 0;}
    .structural_tit{ width: 45%; margin: 0 auto 42px;}
    .structural_tit .tier_left{ font-size: 26px;}
    .structural_tit .tier_right{ font-size: 20px;}
}
@media all and (min-width:1440px){
    .structural_wrap{ padding: 126px 0 0 0;}
    .structural_tit{ margin: 0 auto 52px; width: 502px; height: 47px; line-height: 47px;}
    .structural_tit .tier_left{ font-size: 28px;}
    .structural_tit .tier_right{ font-size: 22px;}
    .structural_book{ padding: 41px 58px;}
}
@media all and (min-width:1680px){
    .structural_tit .tier_left{ font-size: 30px;}
    .structural_tit .tier_right{ font-size: 25px;}
}

/* kind_wrap */
.kind_wrap{ padding: 28px 0 0 0;}

.kind_tit{ margin-bottom: 30px; height: 40px; line-height: 40px; color: #333; border-radius: 23px; background: #fff; border: 1px solid #36538e; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.kind_tit .tier_left{ width: 35%; font-weight: 400; text-align: center; color: #fff; border-radius: 23px; background: #284786;}
.kind_tit .tier_right{ display: block; width: 65%; text-align: center;}
.kind_book{ border-radius: 8px; background: #f5f5f5; padding: 20px;}

@media all and (min-width:640px){
    .kind_tit{ width: 60%; margin: 0 auto 32px;}
    .kind_tit .tier_left{ font-size: 20px;}
    .kind_book{ padding: 41px 58px;}
}
@media all and (min-width:960px){
    .kind_wrap{ padding: 80px 0 0 0;}
    .kind_tit{ width: 40%; height: 45px; line-height: 45px;}
    .kind_tit .tier_left{ font-size: 22px;}
    .kind_book{ width: 700px; margin: 0 auto;}
}
@media all and (min-width:1280px){
    .kind_wrap{ padding: 100px 0 0 0;}
    .kind_tit{ width: 45%; margin: 0 auto 42px;}
    .kind_tit .tier_left{ font-size: 26px;}
    .kind_tit .tier_right{ font-size: 20px;}
}
@media all and (min-width:1440px){
    .kind_wrap{ padding: 126px 0 0 0;}
    .kind_tit{ margin: 0 auto 52px; width: 502px; height: 47px; line-height: 47px;}
    .kind_tit .tier_left{ font-size: 28px;}
    .kind_tit .tier_right{ font-size: 22px;}
}
@media all and (min-width:1680px){
    .kind_tit .tier_left{ font-size: 30px;}
    .kind_tit .tier_right{ font-size: 25px;}
}

/* 서브페이지 03 */
/* contact_wrap */
.contact_wrap{ margin: 60px auto 70px;}
.contact_area .black_tit{ padding-left: 15px; text-align: center; font-weight: 300; font-size: 24px; color: #333; margin-bottom: 20px;}
.contact_area .black_tit span{ font-weight: bold;}
.contact_area p{ font-size: 15px; text-align: center; padding-bottom: 10px;}

@media all and (min-width:640px){
    .contact_wrap{ margin:70px auto;}
    .contact_area .black_tit{ font-size: 26px;}
}
@media all and (min-width:960px){
    .contact_wrap{ margin:80px auto;}
    .contact_area .black_tit{ font-size: 28px; margin-bottom: 22px;}
    .contact_area p{ padding-bottom: 20px;}
}
@media all and (min-width:1080px){
    .contact_wrap{ margin:90px auto;}
    .contact_area .black_tit{ font-size: 30px; margin-bottom: 24px;}
    .contact_area p{ font-size: 16px; padding-bottom: 30px;}
}
@media all and (min-width:1280px){
    .contact_wrap{ margin:100px auto;}
    .contact_area .black_tit{ font-size: 34px; margin-bottom: 26px;}
}
@media all and (min-width:1440px){
    .contact_area .black_tit{ font-size: 38px; margin-bottom: 28px;}
    .contact_area p{ font-size: 17px; padding-bottom: 37px;}
}
@media all and (min-width:1680px){ 
    .contact_wrap{ margin:104px auto;}
    .contact_area .black_tit{ font-size: 42px; margin-bottom: 30px;}
}
@media all and (min-width:1920px){
    .contact_area .black_tit{ font-size: 46px; margin-bottom: 32px;}
}

/* 채용 페이지 */
.black_tit.inquiry{font-size:23px;}
.inquiry_guide{font-size:14px;}

@media all and (min-width:640px){
    .black_tit.inquiry{font-size:26px;}
    .black_tit.inquiry span{display:block;}
}
@media all and (min-width:960px){
    .black_tit.inquiry{ font-size: 30px;}
    .inquiry_guide{font-size:16px; margin-bottom:25px;}
}
@media all and (min-width:1080px){
    .black_tit.inquiry{ font-size: 35px; margin-bottom: 25px;}    
}
@media all and (min-width:1280px){
    .black_tit.inquiry{ font-size: 40px;}
}
@media all and (min-width:1440px){
    .black_tit.inquiry{ font-size: 46px; line-height: 1.2; margin-bottom: 28px;}
}
@media all and (min-width:1680px){ 
    .black_tit.inquiry{font-size: 46px; margin-bottom: 29px;}
}
 
/* 문의하기 */
.inquiry_row{ margin-top:10px;}
.inquiry_left{ display: block; width: 100%; height: 45px; line-height: 45px; text-align: center; color: #fff; font-weight: 400; border-radius: 10px; margin-bottom: 10px; background:#284786;}
.inquiry_right{ border-radius: 10px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -ms-flex-wrap: wrap; -webkit-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; position:relative;}
.inquiry_input{ display: block; width: 100%; height: 45px; font-size: 16px; padding-left: 15px; font-weight: 300; border-radius: 10px; background: #e6e6e6;}
.inquiry_select{ display:block; width: 100%; height: 45px; font-size: 16px; padding-left: 15px; font-weight: 300; border-radius: 10px; background: #e6e6e6;}
.inquiry_select_multi{display:block; width:100%; font-size:15px; padding:10px 15px; border-radius:10px; background:#e6e6e6;}
.inquiry_select_multi optgroup{padding:5px 0;}
.inquiry_select_multi optgroup:first-child{padding-top:0;}
.inquiry_select_multi option{padding:2px 0 0 5px;}
.inquiry_select_multi optgroup option:first-child{padding-top:3px;}

.inquiry_select_multi::-webkit-scrollbar{ width: 4px;}
.inquiry_select_multi::-webkit-scrollbar-track{ background-color: transparent;}
.inquiry_select_multi::-webkit-scrollbar-thumb{ border-radius: 3px; background-color: rgba(0,0,0,0.3);}
.inquiry_select_multi::-webkit-scrollbar-button{ width: 0; height: 0;}

.inquiry_left.small{font-size:15px;}

.inquiry_input.email_1, .inquiry_input.email_2{ width: 47%;}
.inquiry_select.email_3{ margin-top: 5px;}

.inquiry_select.tel_1{ width: 40%;}
.inquiry_input.tel_2{ width: 58%;}

.inquiry_text{ display: block; width: 100%; height: 150px; font-size: 16px; padding: 15px; font-weight: 300; border-radius: 10px; background: #e6e6e6;}

.file_add_input{width:calc(100% - 56px); height:45px; background-color:#e6e6e6; border-radius:12px; border:0; padding:0 15px; font-size:16px;}
.file_add_hidden{position:absolute; right:0; top:0; width:46px; height:45px; opacity:0; cursor:pointer; z-index:20;}
.file_add_btn{position:absolute; right:0; top:0; width:46px; height:45px; border-radius:12px; background:url(../images/plus.png) no-repeat 50%; background-size:26px; background-color:#fc391d; z-index:10;}

.job_position_wrap{margin-bottom:30px;}
.job_position_title{font-weight:500; color:#000; font-size:18px; padding:30px 0 0 5px;}
.job_caption{background-color:#274785; color:#fff; padding:10px 10px; margin-top:10px; font-weight:500; border-radius:10px;}
.job_link{display:-webkit-box; display:-ms-flexbox; display:flex; -webkit-box-align:center; -ms-flex-align:center; align-items:center;}
.job_link img{margin-bottom:-1px;}

.job_content_wrap{display:none;}

.job_content{padding:10px 5px; font-size:14px; line-height:1.6;}
.job_content h5{color:#333; font-size:16px; padding:15px 1px 5px 1px; font-weight:500;}
.job_content h5:first-child{padding-top:0;}

@media all and (min-width:640px){
    .inquiry_input.email_1, .inquiry_input.email_2{ width: 33%;}
    .inquiry_select.email_3{ width: 30%; margin-top: 0;}
    
    .inquiry_left.small{font-size:16px;}
}
@media all and (min-width:768px){
    .inquiry_row{ display:-webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
    .inquiry_left{ width: 190px; margin-bottom: 0; height: auto; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; font-size: 20px;}
    .inquiry_right{ width: calc(100% - 200px);}
    
    .inquiry_input, .inquiry_select{ height: 60px;}
    
    .inquiry_input.email_1, .inquiry_input.email_2{ width: 33%;}
    .inquiry_select.email_3{ width: 27%;}    
    
    .inquiry_select.tel_1{ width: 150px;}
    .inquiry_input.tel_2{ width: calc(100% - 160px);}
    
    .contact_area.job .inquiry_row{display:block;}
    .contact_area.job .inquiry_left, .contact_area.job .inquiry_right{width:100%;}
    .contact_area.job .inquiry_left{margin-bottom:10px; font-size:18px;}
    .contact_area.job .inquiry_input, .contact_area.job .inquiry_select{height:45px;}
}
@media all and (min-width:960px){
    .inquiry_text{ height: 200px;}    
    .contact_area.job .inquiry_row{margin-top:10px;}
}
@media all and (min-width:1024px){
    .contact_area.job .inquiry_row{ display:-webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
    .contact_area.job .inquiry_left{margin-bottom:0; font-size:16px; padding-left:15px; -webkit-box-pack: start; -ms-flex-pack: start; justify-content:flex-start; width:300px; line-height:1.4; text-align:left;}
    .contact_area.job .inquiry_right{width:calc(100% - 310px);}
    
    .job_position_wrap{margin-bottom:50px;}
    .job_position_title{font-size:24px; padding:10px 0 0 5px;}
    .job_caption{padding:12px 15px; margin-top:15px; font-size:18px;}

    .job_content{padding:10px 10px; font-size:16px;}
    .job_content h5{font-size:17px; padding:15px 1px 5px 1px;}
}

/* information_area */
.information_area{padding:15px 20px; color :#777; background: #f7f7f7; border-radius: 10px; margin-top: 20px; line-height: 1.6; font-size:14px; text-align: justify;}
.information_box{ display: block; font-weight: 400; margin-bottom: 10px;}
@media all and (min-width:1024px){
    .information_area{font-size:16px; padding:25px 30px;}
}

/* check_area */
.check_area{ margin: 15px 0 0 0; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -moz-box-pack: end; -ms-flex-pack: end; -webkit-justify-content: flex-end; justify-content: flex-end;}
.check_label{ font-size: 14px; color: #777; cursor: pointer; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}
.check_input{ display: none;}

.check_label .check_btn{ border:2px solid #ddd; border-radius:50%; background-size: 100%; width: 22px; height: 22px; margin-right: 8px;}
.check_input:checked + .check_btn{ background-image: url(../images/sub/check_blue.png); background-size: 100%;}

@media all and (min-width:768px){
    .check_label{ font-size: 16px;}
    .check_label .check_btn{width:24px; height:24px; margin-bottom:-1px;} 
}

/* btn_area */
.cbtn_area{ margin-top: 30px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; }
.cbtn_area .btn{ width: 150px; height: 45px; line-height: 45px; border-radius: 24px; font-size: 16px; font-weight: 400;}

@media all and (min-width:640px){
    .cbtn_area{ margin-top: 35px;}
    .cbtn_area .btn{ width: 180px;}
}
@media all and (min-width:960px){
    .cbtn_area{ margin-top: 40px;}
    .cbtn_area .btn{ width: 204px; height: 48px; line-height: 48px; font-size: 20px;}
}
@media all and (min-width:1080px){
    .cbtn_area{ margin-top: 45px;}
}
@media all and (min-width:1280px){
    .cbtn_area{ margin-top: 50px;}
}
@media all and (min-width:1440px){
    .cbtn_area{ margin-top: 69px;}
}

/* 서브페이지 04 */
/* campus_wrap */
.campus_wrap{ margin: 60px auto 100px;}
.campus_area .black_tit{ font-weight: 300; text-align: center; font-size: 24px; color: #333; margin-bottom: 30px;}
.campus_area .black_tit span{ font-weight: bold;}

.campus_select{ position: relative; width: 170px; height: 40px; line-height: 40px; font-weight: 400; color: #fff; background-color: #284786; border: transparent; border-radius: 12px; cursor: pointer; background-image: url(../images/sub/campus_icon.png); background-size: 30px; background-repeat: no-repeat; background-position: 10% 50%; padding-left: 50px; margin: 0 auto;}
.select_contents{ position: absolute; left: 0; right: 0; top: 40px; text-align: center; color: #333; border-bottom-left-radius: 10px; border-bottom-right-radius: 10px; background: #fff; border: 1px solid #e0e0e0; display: none; z-index: 300;}
.select_tit{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-around;}

.select_contents li:hover{ border-radius: 5px; background: #e0e0e0;}
.select_contents .active{ border-radius: 5px; background: #e0e0e0;}

@media all and (min-width:640px){
    .campus_wrap{ margin: 70px auto 100px;}
    .campus_area .black_tit{ font-size: 26px; margin-bottom: 40px;}
    .select_contents{ top: 40px;}
} 
@media all and (min-width:960px){
    .campus_wrap{ margin: 80px auto 100px;}
    .campus_area .black_tit{ font-size: 28px;}
    .campus_select{ width: 200px; height: 45px; line-height: 45px;}
    .select_contents{ top: 45px;}
}
@media all and (min-width:1080px){
    .campus_wrap{ margin: 90px auto 100px;}
    .campus_area .black_tit{ font-size: 30px; margin-bottom: 60px;}
}
@media all and (min-width:1280px){
    .campus_wrap{ margin: 100px auto;}
    .campus_area .black_tit{ font-size: 40px; margin-bottom: 67px;}
    .campus_select{ width: 230px; height: 50px; line-height: 50px; font-size: 18px; background-size: 35px; padding-left: 57px;}
    .select_contents{ top: 50px;}
}
@media all and (min-width:1440px){
    .campus_wrap{ margin: 100px auto 206px;}
    .campus_select{ width: 250px; font-size: 20px; padding-left: 61px;}
    .select_contents li{ height: 45px; line-height: 45px;}
}
@media all and (min-width:1680px){ 
    .campus_wrap{ margin: 104px auto 250px;}
    .campus_area .black_tit{ font-size: 46px;}
    .campus_select{ width: 280px; height: 60px; line-height: 60px; font-size: 23px; background-size: 38px; padding-left: 68px;}
    .select_contents{ top: 60px;}
    .select_contents li{ font-size: 18px; height: 50px; line-height: 50px;}
}
@media all and (min-width:1920px){
    .campus_select{ width: 282px; height: 62px; line-height: 62px;} 
    .select_contents{ top: 62px;}
}

/* campus_box */
.campus_box{ margin: 50px auto 0;}
.campus_tit{ font-size: 20px; font-weight: bold; color: #333; display: none;}
.blue_line{ display: block; width: 100%; background: #284786;}
.blue_line.top{ height: 3px; margin-top: 10px;}
.blue_line.bottom{ height: 1px;}

.campus_inner{ padding: 20px 0; border-bottom: 1px solid #e0e0e0;}
.campus_inner.bottom{ border-bottom: none;}
.campus_name{ display: block; font-size: 20px; font-weight: 400; text-align: center; margin-bottom: 15px;}
.campus_address{ text-align: center; font-size: 15px; font-weight: 300; line-height: 1.6; margin-bottom: 20px;}
.campus_num{ display: block;}
.gyeonggi_enter,.incheon_enter,.chungcheongdo_enter,.daejeon_enter,.bukdo_enter,.ulsan_enter,.busan_enter{ display: block;}

.campus_btn{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: space-around; -ms-flex-pack: space-around; justify-content: space-around; -webkit-box-align: center; -ms-flex-align: center; align-items: center;}

.btn_border{ padding: 0 10px 0 20px; width: 140px; height: 45px; font-size: 16px; font-weight: 400; color: #284786; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; border: 1px solid #284786; border-radius: 12px; transition: all 0.2s;}
.arrow_right{ background-image: url(../images/sub/arrow_right.png); width: 45px; height: 45px; background-repeat: no-repeat; transition: all 0.2s;}
.btn_border:hover{ color: #fff; background: #284786;}
.btn_border:hover .arrow_right{ background-image: url(../images/sub/arrow_right_on.png);}

.btn_border.none{ border: 1px solid red; padding: 0 10px 0 20px; width: 140px; height: 45px; font-weight: 400; color: #777; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; border-radius: 12px; border: 1px solid #e7e7e7; background: #e7e7e7;}
.arrow_right_none{ background-image: url(../images/sub/arrow_right_gray.png); width: 45px; height: 45px; background-repeat: no-repeat; transition: all 0.2s;}

@media all and (min-width:640px){
    .campus_box{ margin: 60px auto 0;}
    .campus_contents{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: space-between; -ms-flex-pack: space-between; justify-content: space-between; flex-wrap: wrap; -webkit-flex-wrap: wrap;}
    .campus_inner{ padding: 20px 0; width: 50%;}
    .campus_inner.right{ border-right: 1px dashed #e0e0e0;}
    .seoul_enter{ display: block;}
    .jeollado_enter{ display: block;}
    .campus_address.seoul,.gyeonggi,.incheon,.chungcheongdo,.daejeon,.busan,.jeollado{ margin-bottom: 44px;}
} 
@media all and (min-width:960px){
    .campus_box{ margin: 70px auto 0;}
    .campus_tit{ font-size: 22px;}
    .campus_contents{ -webkit-box-pack: space-around; -ms-flex-pack: space-around; justify-content: space-around;}
    .seoul_enter{ display: inline;}
    .campus_inner{ padding: 25px 0; width: 90%;}
    .campus_inner.right{ border-right: 0;}

    .campus_list{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align:  flex-start; -ms-flex-align:  flex-start; align-items: flex-start; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between;}
    .campus_name{ text-align: left; width: 20%; margin-bottom: 0;}
    .campus_address{ text-align: left; width: 40%; margin-bottom: 0;}

    .campus_btn{ width: 35%; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; font-size: 15px;}
}
@media all and (min-width:1080px){
    .campus_box{ margin: 80px auto 0;}
    .campus_tit{ font-size: 24px;}
    .blue_line.top{ margin-top: 15px;}
    .campus_inner{ padding: 35px 0;}
    .campus_address{ font-size: 16px;}
    .campus_btn{ width: 33%;}
}
@media all and (min-width:1280px){
    .campus_box{ margin: 100px auto 0;}
    .campus_tit{ font-size: 30px;}
}
@media all and (min-width:1920px){
    .campus_tit{ font-size: 35px;}
    .blue_line.top{ margin-top: 18px;}
    .campus_inner{ padding: 40px 0;}
} 

/* 팝업페이지 */
.popup_bg{ padding-bottom: 105px;}
.popup_header{ background-image: url(../images/popup_header.png); background-repeat: no-repeat 50% 50%; background-size: cover; padding-top: 17.32%; position: fixed; left: 0; top: 0; width: 100%;}
.header_tit{ color: #fff; font-size: 21px; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: absolute; left: 0; top: 0; width: 100%; height: 100%; padding-bottom: 3%; font-weight: 500;}
.popup_wrap{ padding-top: 22%;}
.popup_wrap .book_txt{ text-align: center;}
.popup_wrap .book_txt h4{ color: #333; font-size: 23px; margin: 25px 0 10px;}
.popup_wrap .book_txt h4 span{ font-weight: 300;}
.popup_wrap .book_txt p{ font-size: 15px; color: #ff3a1d;}
.popup_wrap .book_img{ margin: 25px auto 0; max-width: 598px;}
.popup_wrap .book_img img{ display: block; width: 100%;}

@media all and (min-width:640px){
    .header_tit{ font-size: 30px;}
}
@media all and (min-width:768px){
    .header_tit{ font-size: 36px;}
    .popup_wrap .book_txt h4{ font-size: 25px; margin: 30px 0 15px;}
    .popup_wrap .book_img{ margin: 30px auto 0;}
}

/* 팝업페이지 - SoundTreeCore */
.popsound_txt{ padding: 0 3.5%; margin-bottom: 69px; font-size: 15px; text-align: justify; line-height: 1.5;}
.popsound_btn{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 25px;}
.popsound_btn .btn{ color: #fff; font-size: 18px; font-weight: 400; width: 136px; height: 32px; line-height: 32px;}

@media all and (min-width:640px){ 
    .popsound_txt{ padding: 0 6%; text-align: center;}
}
@media all and (min-width:768px){  
    .popsound_txt{ padding: 0 13%;}
    .popsound_btn{ margin-bottom: 30px;}
    .popsound_btn .btn{ font-size: 20px;}
}

/* 팝업페이지 - FluenTree */
.popfluen_txt{ padding: 0 3%; margin-bottom: 69px; font-size: 15px; text-align: justify; line-height: 1.5;}
.popfluen_btn{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 25px;}
.popfluen_btn .btn{ color: #fff; font-size: 18px; font-weight: 400; width: 154px; height: 32px; line-height: 32px;}

@media all and (min-width:640px){
    .popfluen_txt{ padding: 0 10.5%; text-align: center;}
}
@media all and (min-width:768px){
    .popfluen_txt{ padding: 0 10%;}
    .popfluen_btn{ margin-bottom: 30px;}
    .popfluen_btn .btn{ font-size: 20px;}
}

/* 팝업페이지 - ConnecTree */
.popconnec_txt{ padding: 0 3%; margin-bottom: 69px; font-size: 15px; text-align: justify; line-height: 1.5;}
.popconnec_btn{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; margin-bottom: 25px;}
.popconnec_btn .btn{ color: #fff; font-size: 18px; font-weight: 400; width: 172px; height: 32px; line-height: 32px;}

@media all and (min-width:640px){
    .popconnec_txt{ padding: 0 5.5%; text-align: center;}
}
@media all and (min-width:768px){
    .popconnec_txt{ padding: 0 4%;}
    .popconnec_btn{ margin-bottom: 30px;}
    .popconnec_btn .btn{ font-size: 20px;}
}

/* 팝업페이지 - Unit */
.popunit_txt{ padding: 0 3%; margin-bottom: 72px; font-size: 15px; text-align: justify; line-height: 1.5;}
.popunit_main{ padding: 0 3%; font-size: 15px; text-align: justify; line-height: 1.5; color: #333; text-align: justify;}
.tier_tit.unit{ margin: 0 auto 30px; width: 188px; height: 33px; line-height: 33px;}
.tier_tit.unit strong{ margin-right: 5px;}

@media all and (min-width:640px){
    .popunit_txt{ padding: 0 5%; text-align: center;}
    .popunit_main{ padding: 0 5%;}
}
@media all and (min-width:768px){
    .popunit_main{ padding: 0 2%; text-align: center;}
} 

/* popunit_day */
.popunit_day_wrap{ margin-bottom: 73px;}
.popunit_day{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center;}
.popunit_bg{ height: 140px; border-radius: 35px; background: #ccc; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-around;}
.popunit_bg img{ width: 68px; height: 68px;}
.arrow_gray{ display: block; background-image: url(../images/popup_unit_arrow_gray.png); width: 30px; height: 30px;}
.arrow_white{ background-image: url(../images/popup_unit_arrow_white.png); width: 15px; height: 15px;}
.popteaching_area,.popcoaching_area{ margin-bottom: 38px;}

@media all and (min-width:640px){
    .popunit_bg img{ width: 100px; height: 100px;}
}
@media all and (min-width:768px){
    .arrow_white{ width: 18px; height: 18px;}
}

/* 팝업페이지 - Listening Wise */
.popwise_txt{ padding: 0 3%; margin-bottom: 69px; font-size: 15px; text-align: justify; line-height: 1.5;}

@media all and (min-width:640px){
    .popwise_txt{ padding: 0 6%; text-align: center;}
}
@media all and (min-width:768px){
    .popwise_txt{ padding: 0 13%;}
}

/* 팝업페이지 - OneBite */
.popvoca_txt{ padding: 0 3%; margin-bottom: 69px; font-size: 15px; text-align: justify; line-height: 1.5;}

@media all and (min-width:640px){
    .popvoca_txt{ padding: 0 4%; text-align: center;}
}
@media all and (min-width:768px){
    .popvoca_txt{ padding: 0 8%;}
}

/* 팝업페이지 - Primary */
.popprimary_txt{ padding: 0 3%; margin-bottom: 69px; font-size: 15px; text-align: justify; line-height: 1.5;}
.poptier_left{ width: 40%; color: #fff; border-radius: 16px; background: #284786;}
.poptier_right{ display: block; width: 100%; font-weight: bold; text-align: center;}
.popbasic_tit{ margin: 0 auto 30px;}

/* poplevel_01 */
.poplevel_01_tit{ margin: 73px auto 30px;}

/* poplevel_02 */
.poplevel_02_tit{ margin: 82px auto 30px;}

.popbasic_tit,.poplevel_01_tit,.poplevel_02_tit{ max-width: 327px; height: 32px; line-height: 32px; font-size: 20px; font-weight: 400; text-align: center; color: #284786; border-radius: 16px; background: #fff; border: 1px solid #36538e; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center;} 

@media all and (min-width:640px){
    .popprimary_txt{ padding: 0 8%; text-align: center;}
}
@media all and (min-width:768px){
    .popprimary_txt{ padding: 0 7%;}
    .poptier_left{ width: 99px;}
    .poptier_right{ max-width: 229px;}
} 

/* 팝업페이지 - Habitus */
.popup_wrap.habitus{ padding-top: 30%;}
.popup_header.habitus{ padding-top: 30%;}
.header_txt{ display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; align-items: center; position: absolute; left: 0; top: 10%; width: 100%; height: 20%;}
.header_txt p{ color: #fff; border: 1px solid #fff; font-size: 13px; border-radius: 16px; padding: 5px 10px;}
.header_tit.habitus{ padding-bottom: 0%;}
.tier_tit{ margin: 0 auto 32px; width: 99px; height: 32px; line-height: 32px; color: #fff; border-radius: 16px; background: #284786; font-size: 18px; font-weight: 400; text-align: center; border: 1px solid #36538e; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; justify-content: center;}
.tier_text{ text-align: center; font-size: 22px; font-weight: bold; color: #333;}
.popstructural_wrap,.popkind_wrap{ margin-top: 72px;}

@media all and (min-width:640px){
    .popup_header .header_tit.habitus{ font-size: 30px;}
    .popup_header.habitus{ padding-top: 20%;}
    .popprimary_txt span{ display: inline-block;}
} 
@media all and (min-width:768px){
    .tier_tit{ font-size: 20px;}
    .tier_text{ font-size: 25px;}
}