
.section{}

.section.one{width: 100vw;height: 100vh;}
.section.one .topvideo{width: 100vw;height: 100vh;position: relative;overflow: hidden;}
/* .section.one .videoCont{width: 100vw;height: 100vh;} */
.section.one .topvideo video{width: 100vw;height: 100vh; object-fit: cover;}
.section.one.active .topvideo{position: fixed;top: 0;}
.section.one .topvideo #video-gray{position: absolute;width: 100vw;height: 100vh;background-color: #000;top: 0;opacity: 0.8;}
.section.one.active .topvideo #video-gray{position: fixed;width: 100vw;height: 100vh;background-color: #000;top: 0;opacity: 0;}

@media only screen and (max-width:1870px) {
 /*    .section.one .topvideo video{width: auto;height:100vh;} */
	}
.section.one .topvideo p{margin: 0;position: absolute;width: 100%;max-width: 1280px;top: 50%;left:50%;transform:translate(-50%, -60%);font-family:MaruBuri;font-size: 4.8rem;font-weight: 300;color: #fefefe;word-break:keep-all;z-index:1}
.section.one .topvideo p>strong{display:block;padding-top:25px;font-size: 10rem; font-weight: 500;color:#b1df0a;/*text-shadow:-1px 0 #fff, 0 1px #fff, 1px 0 #fff, 0 -1px #fff;*/}
.section.one .topvideo p>strong>span{display:block;}

@media only screen and (max-width:1280px){
    .section.one .topvideo p br{display:none; }
}
@media only screen and (max-width:1024px){
    .section.one .topvideo p { width: 90%; }
}   
@media only screen and (max-width:768px){
    .section.one .topvideo p {  font-size: 2rem !important; }
    .section.one .topvideo p>strong { padding-top: 0; font-size: 5rem; }
}
.section.two{max-width: 1280px;margin: 0 auto;overflow: hidden;padding: 15rem 0;}
.section.two .inner{}
.section.two .contentsbox{padding-bottom: 7rem;display: inline-block;}
.section.two .contentsbox .tit{width: auto;padding-right: 50px;float: left;opacity:0}
.section.two .contentsbox .tit span:first-child{font-size: 2.3rem;font-weight: bold;color:#484848}
.section.two .contentsbox .tit span:last-child{font-size: 1.8rem;display: inline-block;margin-top: 10px;color:#484848}
.section.two .contentsbox .cont{width: auto;float: left;font-size: 20px;margin: 0;padding-top: 27px;color:#484848;opacity:0}
.section.two .videobox{width: 100%;position:relative}
.section.two .videobox video{width: 100%;/* box-shadow: 0px 0px 10px black; */}
.section.two .videobox .controlBtn{position: absolute;top: 50%;left: 50%;transform: translate(-50%, -50%);width: 300px;height: 300px;border: none;background: none;background-size: cover;opacity: 0.5;background-image: url('/expo/course/images/common/play.png');cursor: pointer;}
.section.two .videobox .controlBtn[data-play='1']{background-image: url('/expo/course/images/common/pause.png');opacity:0}
.section.two .videobox:hover .controlBtn{opacity: 0.8;}
.section.two.active .videobox:hover .controlBtn{opacity: 0.8;}
.section.two.active .videobox .controlBtn{}

.section.two .inner .rec .tit{font-size: 2.5rem;padding: 5px 15px;background-color: #ddd;}
.section.two .inner .rec .cont{/*border: 1px solid #ddd; padding: 0 0 70px;*/}
.section.two .inner .rec .cont .stit{font-family: S-CoreDream-4Regular;font-size: 3.6rem;color:#1ca64c;line-height: 4.2rem;}
.section.two .inner .rec .cont .stit br{ display: none; }
.section.two .inner .rec .cont .conts{margin: 6rem 0;font-family: S-CoreDream-4Regular;font-size: 2.4rem;color:#000;line-height: 3.2rem;}
.section.two .inner .rec .cont .conts>span{display: block; margin-bottom: 3.5rem;}
.section.two .inner .rec.active{opacity: 0;-webki©t-transform: translate3d(50%, 0, 0);transform: translate3d(50%, 0, 0)}
.section.two.active .inner .rec.animate {-webkit-animation-duration: 2s;animation-duration: 2s;-webkit-animation-fill-mode: both;animation-fill-mode: both;/* -webkit-animation-delay: 0.3s;-moz-animation-delay: 0.3s;animation-delay: 0.3s; */}
@-webkit-keyframes fadeInRight {from {opacity: 0;-webkit-transform: translate3d(50%, 0, 0);transform: translate3d(50%, 0, 0);}to {opacity: 1;-webkit-transform: none;transform: none;}}
@keyframes fadeInRight {from {opacity: 0;-webkit-transform: translate3d(50%, 0, 0);transform: translate3d(50%, 0, 0);}to {opacity: 1;-webkit-transform: none;transform: none;}}
.section.two.active .inner .rec.fadeInRight {-webkit-animation-name: fadeInRight;animation-name: fadeInRight;}

@media only screen and (max-width:1024px){
     .section.two { padding: 10rem 0; }
    .section.two .inner { margin: 0 auto; width: calc(100% - 5rem); }
}
@media only screen and (max-width:768px){
    .section.two .inner .rec .cont { padding: 0; }
    .section.two .inner .rec .cont .stit{ font-size: 3rem; }
    .section.two .inner .rec .cont .stit br { display: block; }
    .section.two .inner .rec .cont .conts{ font-size: 2rem; }
    .section.two .inner .rec .cont .conts>span { margin-bottom: 2.5rem; }
}

.section.three{min-height:100vh}
.section.three .three-01{width: 100vw;height: auto;display:inline-block;padding:15rem 0}
.section.three .three-01.course01 {background: center / cover url('/expo/course/images/03/courseViewBg.png');}
.section.three .three-01.course02 {background: center / cover url('/expo/course/images/04/courseViewBg.png');}
.section.three .three-01.course03 {background: center / cover url('/expo/course/images/05/courseViewBg.png');}
.section.three .three-01.course04 {background: center / cover url('/expo/course/images/06/courseViewBg.png');}
.section.three .three-01.course05 {background: center / cover url('/expo/course/images/07/courseViewBg.png');}
.section.three .three-01 .tit{margin-bottom: 80px; text-align: center;font-family: S-CoreDream-6Bold;font-size: 6rem;color:#fff;line-height: 1;}
.section.three .three-01 .tit a{ color:#1d1d1f;text-decoration: none;/* display: inline-block;padding: 10px 25px;text-decoration: none;color: #484848;background-color: #fff;margin: 15px;font-size: 25px;font-weight: bold;position: absolute;border: 3px solid #ff7c7c;border-radius: 50px;box-shadow: 0 0 5px #333;opacity: 0.5;z-index:1 */}
.section.three .three-01 .tit a:hover{opacity:1}
.section.three .three-01 div.slideItem{max-width: 1280px; width: 100%;white-space: nowrap;overflow-x: none;background-color: rgba(255, 255, 255, 0.9);padding: 30px 0;margin: 0 auto;-ms-overflow-style: none;text-align: center;}
.section.three .three-01 div.slideItem::-webkit-scrollbar {
  width: 10px;
}
.section.three .three-01 div.slideItem::-webkit-scrollbar-thumb {
  background-color: #2f3542;
  border-radius: 10px;
  background-clip: padding-box;
  border: 2px solid transparent;
}
.section.three .three-01 div.slideItem::-webkit-scrollbar-track {
  background-color: #eee;
  border-radius: 10px;
  box-shadow: inset 0px 0px 5px white;
}
.section.three .three-01 div.slideItem[data-mouse=in]{box-shadow: 0px 0px 16px #000;}
.section.three .three-01 div.slideItem > ul{ /* display: inline-block; width: 2434px; */ width: 100%; white-space: normal;list-style: none;padding: 0;margin-bottom: 0;display: flex;flex-wrap: wrap; justify-content: center;}
/* .section.three .three-01 div.slideItem > ul li{float: left;display: inline-block;width: 250px;height: 278px;margin-right: 48px;}
.section.three .three-01 div.slideItem > ul li img{width: 250px;height: 170px;margin-bottom: 10px;cursor:pointer} */
/* .section.three .three-01 div.slideItem > ul.slideUl07 { flex-wrap:nowrap; } */
.section.three .three-01 div.slideItem > ul li{float: left;display: inline-block;width: 19.53125%; margin: 1rem 1.875%;}
.section.three .three-01 div.slideItem > ul li img{width: 100%;height:150px; margin-bottom: 10px;cursor:pointer}
.section.three .three-01 div.slideItem > ul li img:hover{transform: scale(1.05); transition: all 400ms ease-in-out;}
.section.three .three-01 div.slideItem > ul li span.nm{display: inline-block;width: 100%;text-align: center;color: #484848;font-weight: bold;}
.section.three .three-01 div.slideItem > ul li p.marker{background: url('/expo/course/images/common/flag_blue.png') no-repeat;height: 41px;width: 34px;margin: 0 auto;text-align: center;}
.section.three .three-01 div.slideItem > ul li p.marker span{font-size: 14px;margin-top: 7px;width: 20px;height: 20px;border-radius: 50%;background-color: #fff;font-weight: bold;color: #7250dd;display:inline-block}
.section.three .three-01 div.slideItem > ul li p.distance{border-top: 1px solid #484848;width: 120%;position: relative;margin:7px 0}
.section.three .three-01 div.slideItem > ul li p.distance span.dot{width: 9px;height: 9px;background-color: #484848;border-radius: 50%;position: absolute;top: -5px;left: 40.2%;}
.section.three .three-01 div.slideItem > ul li.lastItem{margin:0;overflow: hidden;}
.section.three .three-01 div.slideItem > ul li:first-child{margin-left:20px !important}
.section.three .three-01 div.slideItem > ul li.arrowbox{width: auto;margin: 0;position: relative;width: 39px;}
.section.three .three-01 div.slideItem > ul li.arrowbox p{position: absolute;bottom: 9px;margin:0}
.section.three .three-01 div.slideItem > ul li.arrowbox p span{position: relative;float:left;border: 1px solid #484848;border-radius: 50%;width: 60px;height: 60px;margin-right:5px;background-color: #fff;z-index: 1;}
.section.three .three-01 div.slideItem > ul li.arrowbox p span.arrow-prev::after{position:absolute;left: 21px;top: 16px;content: '';width: 25px;height: 25px;border-top: 5px solid #767676;border-right: 5px solid #767676;transform: rotate(225deg);}
.section.three .three-01 div.slideItem > ul li.arrowbox p span.arrow-next{left: -31px;}
.section.three .three-01 div.slideItem > ul li.arrowbox p span.arrow-next::after{position:absolute;left: 11px;top: 15px; content: '';width: 25px;height: 25px;border-top: 5px solid #767676;border-right: 5px solid #767676;transform: rotate(45deg);}


.section.three .three-02{padding:15rem 0; width: 100vw;height: auto; background: #ededed;}
.section.three .three-02 .tit{margin-bottom: 80px; text-align: center;font-family: S-CoreDream-6Bold;font-size: 6rem;color:#1d1d1f;line-height: 1;}
.section.three .three-02 .mapbox{max-width: 1280px;margin: 0 auto; /* margin-bottom: 80px !important; */overflow:hidden}
.section.three .three-02 .mapbox .map{width: 100%;height: 650px;display: inline-block;}

@media only screen and (max-width:1280px){
	.section.three .three-01 div.slideItem { overflow-x: scroll; }
	.section.three .three-01 div.slideItem > ul{ flex-wrap: nowrap; }
     .section.three .three-01 div.slideItem > ul li{ float: left;display: inline-block;width: 250px;height: 278px;margin: 0 46px 0 0; }
     .section.three .three-01 div.slideItem > ul li img{ width: 250px;height: 170px;margin-bottom: 10px;cursor:pointer; }
     .section.three .three-01 div.slideItem > ul li.arrowbox p{ bottom: 19px; }
    
    .slideUl03{ width: 3356px !important;}
    .slideUl04{ width: 4846px !important;}
    .slideUl05{ width: 2838px !important;}
    .slideUl06{ width: 1866px !important;}
    .slideUl07{ width: 1280px !important;}
    
}

@media only screen and (max-width:1250px){
/* .section.three .three-02 .tit{width:800px}
.section.three .three-02 .mapbox{width:800px}
.section.three .three-02 .mapbox .map{width:800px;height:500px} */
}
@media only screen and (max-width:1024px){
    .section.three .three-01,
    .section.three .three-02 { padding: 10rem 0; }
}   
@media only screen and (max-width:850px){
/* .section.three .three-02 .tit{width:400px}
.section.three .three-02 .mapbox{width:400px}
.section.three .three-02 .mapbox .map{width:400px;height:500px} */
}
@media only screen and (max-width:768px){
    .section.three .three-01 .tit,
    .section.three .three-02 .tit { font-size: 5rem; line-height: 6rem; word-break: keep-all; }
    .section.three .three-02 .tit > span { display:block; }
}

#mTouchPlz{width:100%; height:350px; z-index:300; background:rgba(0, 0, 0, 0.3); position:absolute;display:none;}
.mTouchTxt{color:#fff; text-align:center; line-height:340px; font-size:5rem;}

@media only screen and (max-width:1024px){
    #mTouchPlz{display:block;}
}
@media only screen and (max-width:768px){
.mTouchTxt{ font-size:4rem;}
}

/*레이어팝업*/
.more-spot-wrap{}
.more-spot{position:relative}
.layer-popup-bg{width:100%;height:100%;background:#282828;opacity:0.5;left:0;top:0;position:fixed;z-index:9;border-radius:10px}
.layerPopup{position:absolute;z-index:100;border:1px solid #ebebeb;background:#fff!important;width:500px;padding:30px}
.layerPopup .close-popup-btn{position:absolute;right:20px;}
.layerPopup #nameWrap{font-size:3rem;color:#000;margin-bottom:10px;font-family:'GmarketSans'}
.layerPopup #imgWrap{width:440px; height:300px}
@media all and (max-width: 500px){
    .layerPopup{width:100%;left:0!important;}
    .layerPopup #imgWrap{width:100%}
}

/* swiper전용 S */
.swiper {width: 100%;height: 100%;}
.swiper-slide {text-align: center;font-size: 18px;background: #fff;/* Center slide text vertically */display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}
.swiper-slide img {display: block;width: 100%;height: 100%;object-fit: cover;}
.swiper {width: 100%;height: 300px;margin-left: auto;margin-right: auto;}
.swiper-slide {background-size: cover;background-position: center;}
.mySwiper2 {height: 80%;width: 100%;}
.mySwiper {height: 20%;box-sizing: border-box;padding: 10px 0;}
.mySwiper .swiper-slide {width: 25%;height: 100%;opacity: 0.4;}
.mySwiper .swiper-slide-thumb-active {opacity: 1;}
.swiper-slide img {display: block;width: 100%;height: 100%;object-fit: cover;}
#scene {    display: flex;  justify-content: center;}


/* 레이어 영상 팝업 부분 S*/
#section-two .inner{ position:relative; }
.innerWrap > p { padding: 0 0 1.5rem; color: #ff0000; font-size: 1.8rem; letter-spacing: -.5px; }
.videoWrap { display: flex; justify-content: space-between; height: 360px;}
.videoWrap > div { position: relative; width: calc(50% - 1rem); background: rgba(0, 0, 0, .1); /* z-index: -1;  */}
.videoWrap .openVideoWrap.course1_1 { background: url('/expo/course/images/03/sec02_01.png') no-repeat center; background-size: cover;}
.videoWrap .openVideoWrap.course1_2  { background: url('/expo/course/images/03/sec02_02.png') no-repeat center; background-size: cover;}
.videoWrap .openVideoWrap.course2_1 { background: url('/expo/course/images/04/sec02_01.png') no-repeat center; background-size: cover;}
.videoWrap .openVideoWrap.course2_2  { background: url('/expo/course/images/04/sec02_02.png') no-repeat center; background-size: cover;}
.videoWrap .openVideoWrap.course3_1 { background: url('/expo/course/images/05/sec02_01.png') no-repeat center; background-size: cover;}
.videoWrap .openVideoWrap.course3_2  { background: url('/expo/course/images/05/sec02_02.png') no-repeat center; background-size: cover;}
.videoWrap .openVideoWrap.course4_1 { background: url('/expo/course/images/06/sec02_01.png') no-repeat center; background-size: cover;}
.videoWrap .openVideoWrap.course4_2  { background: url('/expo/course/images/06/sec02_02.png') no-repeat center; background-size: cover;}
.videoWrap .openVideoWrap.course5_1 { background: url('/expo/course/images/07/sec02_01.png') no-repeat center; background-size: cover;}
.videoWrap .openVideoWrap.course5_2  { background: url('/expo/course/images/07/sec02_02.png') no-repeat center; background-size: cover;}
.videoWrap > div > div:first-child { position:relative; padding: 2.5rem 2.5rem; z-index: 3;}
.videoWrap > div > div:first-child > p { padding-bottom: .5rem; font-family: S-CoreDream-4Regular; font-size: 3.6rem; color: #fff;}
.videoWrap a { position: relative;padding:1rem 1.5rem;border-radius: 40px;overflow: hidden;display: inline-block;text-align:center;word-break:keep-all;background:rgba(255, 255, 255, 0); border: 1px solid rgba(255, 255, 255, 1);}
.videoWrap a:hover { background: rgba(255, 255, 255, .1); border:1px solid #b1df0a;}
.videoWrap a > span {font-size:1.6rem;color:#fff;position:relative;z-index:1;}
.videoWrap a:hover > span {color:#b1df0a;}
.videoWrap > div > div:last-child { position: absolute; top:0; width: 100%; height: 100%; background: rgb(255,255,255); background: radial-gradient(circle, rgba(255, 255, 255, .1) 5%, rgba(0, 0, 0, .5) 96%);}

@media all and (max-width: 768px){
    .inner .videoWrap { flex-direction: column; height: auto;}
    .videoWrap > div { width:100%; height: 360px;}
    .videoWrap > div:nth-child(1) { margin-bottom: 1rem;}
}
/* .openVideoWrap{
    border:1px solid black;
} */

.mainVideoPopup{display:none;position:fixed;/* border:1px solid black; */margin:auto;width:800px;height:550px;z-index:100;left:calc(50% - 400px);}
.subVideoPopup{display:none;position:fixed;/* border:1px solid black; */margin:auto; padding-top: 50px;width:800px;height:550px;z-index:100;left:calc(50% - 400px);}
#mainVideo{ width:100%; height:100% }
#video-sub{ width:100%; height:100% }
.closeVideoBtn{ position:absolute; top:0; right:0; width: 4rem; height: 4rem; border-radius: 50%;  background-color:rgba(0, 0, 0, .2); display: inline-flex; justify-content: center; align-items: center; outline: none; cursor: pointer; }
.closeVideoBtn::before {display: block; content: ""; text-decoration: none; font-weight: 300; min-width: 16px; text-align: center; width: 16px; height: 16px; background-size: cover; background-repeat: no-repeat; background-position: 50%; background-image: url('/expo/course/images/common/popupClose.svg'); }
@media all and (max-width: 769px){
    .mainVideoPopup { width: calc(100% - 3rem); height: auto; max-height: 550px; left: 50%; transform: translateX(-50%); }
    .subVideoPopup { width: calc(100% - 3rem); height: 400px; left: 50%; transform: translateX(-50%); }
}

.video-js { background-color: rgba(0, 0, 0, 0); } 
.video-js .vjs-big-play-button { font-size: 5rem; line-height: 10rem; height: 10rem; width: 10rem; /* display: inline-flex; */ position: absolute; top: 50%; left: 50%; padding: 0; cursor: pointer; opacity: 1; border: 1px solid #fff; background-color: #2b333f; background-color: rgba(43,51,63,.7); border-radius: 50%; transition: all .4s; transform: translate(-50%, -50%);}
/* 레이어 영상 팝업 부분 E*/

.labelName{position:relative;top:-50px;border:2px solid #f33b3b;border-radius:5px;background:#fff;color:#000000;padding: 0 3px;}

.intro_mov_img {width: 100%;}  

.slideUl03 li a, .slideUl04 li a, .slideUl05 li a, .slideUl06 li a, .slideUl07 li a {display: block;height: 150px;margin-bottom: 10px;}


 .tit.aos-init.aos-animate div {text-align: center;font-family: S-CoreDream-6Bold;font-size: 6rem;color: #1d1d1f;line-height: 1;}







