@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200;300;400;500;600;700&display=swap');
/*font-family: 'Oswald', sans-serif;*/
.mVisualArea{width:100%;}
.mVisualArea .mVisual{position:relative;max-width:2560px;height:937px;margin: 0 auto 0 3rem;border-radius: 0 0 0 10rem;}
.mVisual .item{position:relative;overflow:hidden;}
.mVisual .item .txtBox{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;max-width:1920px;margin:0 auto;padding:0 140px;z-index:2;}
.mVisual .item .txtBox .line1{font-size:90px;font-weight:500;line-height:104px;color:#fff;margin-bottom:13px;font-family: 'Oswald', sans-serif;letter-spacing:2px;word-break:keep-all;}
.mVisual .item .txtBox .line2{font-size:22px;font-weight:300;line-height:38px;color:#fff;word-break:keep-all;}
.mVisual .item .txtBox span{font-size:inherit;line-height:inherit;font-weight:inherit;}
.mVisual .item .bgImgBox{position:absolute;width:2560px;left:50%;top:0;z-index:0;transform:translate(-50%,0); background:rgba(0,0,0,1);}
.mVisual .item .bgImgBox>img{width:100%;object-fit: cover;}
.mVisual .item .mBg{display:none;}

.mVisual .item .iframe_area{position:absolute;left:50%;top:0;width:2560px;height:100%;top:0;z-index:1;transform:translate(-50%,0) scale(1.15);}
.mVisual .item .videoDim{position:absolute;width:2560px;left:50%;height:100%;top:0;z-index:10;transform:translate(-50%,0);background-color:rgba(0,0,0,0.3);}

.mVisual .mVisualControl{position:absolute;left:50%;transform:translate(-50%,0%);bottom:150px;z-index:2;white-space:nowrap;width:100%;max-width:1920px;margin:0 auto;padding:0 140px;}
.mVisual .numberIndex{display:inline-block;vertical-align:middle;width:auto;}
.mVisual .numberIndex .index,
.mVisual .numberIndex .total{font-size:16px;line-height:1em;color:#fff;display:inline-block;vertical-align:middle;font-weight:600;width:20px;}
.mVisual .numberIndex .total{opacity:0.5}
.mVisual .numberIndex .bar{width:85px;height:2px;background-color:rgba(255,255,255,0);margin:0 20px 0 10px;display:inline-block;vertical-align:middle;}
.mVisual .numberIndex .bar>i{width:0;height:2px;background-color:#fff;;}
.mVisual .mVisualControl>button.stop{display:inline-block;width:12px;height:12px;background-repeat:no-repeat;background-position:center center;background-image:url(../img/main/icon_mVisualControlStop.png);background-size:auto 12px;vertical-align:middle;margin-left:5px;margin-top:1px;} 
.mVisual .mVisualControl>button.stop.play{background-image:url(../img/main/icon_mVisualControlPlay.png);background-size:auto 12px;}

.mLinkArea{width:100%;padding:75px 0 100px 0;}
.mLinkArea .swiper-wrapper{font-size:0;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
    justify-content: flex-start;
}
.mLink{font-size:0;}
.mLink .item{width:20%;display:inline-block;vertical-align:top;padding-right:20px;}
.mLink .item>a{position:relative;display:block; padding-top:70px;}
/*.mLink .item>a>img{position:absolute;left:0;top:0;}*/

.mLink .item>a>img{position:absolute;left:0;top:.5rem; transition: transform 0.3s ease; }
.mLink .item>a:hover>img{transform: translateY(-.5rem);}

.mLink .item>a>p{font-size:26px;font-weight:bold;line-height:34px;color:#000;margin-bottom:16px;}
.mLink .item>a>span{display:block;font-size:16px;font-weight:300;line-height:24px;color:#666;}

.mLink .control{display:none;} 

.mMultiArea{width:100%;max-width:1920px;margin:0 auto 100px auto;font-size:0; }
.mMultiArea .imgBox{position:relative;width:50%;display:inline-block;vertical-align:top;/*height:946px;*/background-size:cover;background-position:center center; border-radius: 0 0 0 100px;}
.mMultiArea .imgBox::before{content:"";display:block;padding-top:98.5%;width:100%}
.mMultiArea .rightBanner{width:50%;display:inline-block;vertical-align:top;/*height:946px;*/font-size:0;}
.mMultiArea .rightBanner .item{position:relative;width:50%;/*height:473px;*/display:inline-block;vertical-align:top;background-size:cover;background-position:center center;background-repeat:no-repeat;}
.mMultiArea .rightBanner .item::before{content:"";display:block;padding-top:98.5%;width:100%}
.mMultiArea .rightBanner .item a{position:absolute;display:block;width:100%;height:100%;padding:55px 60px 80px 60px;font-size:0;left:0;top:0;}
.mMultiArea .rightBanner .item .lv1{font-size:32px;font-weight:bold;line-height:44px;color:#000;margin-bottom:34px;word-break:keep-all;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;max-height:132px;}
.mMultiArea .rightBanner .item .lv2{display:block;font-size:16px;font-weight:300;line-height:28px;color:#666;word-break:keep-all;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;max-height:132px;max-height:84px;}
.mMultiArea .rightBanner .item .mDay{position:absolute;left:60px;bottom:55px;display:inline-block;font-family: 'Oswald', sans-serif;font-size:16px;line-height:24px;color:#666}
.mMultiArea .rightBanner .item.blue{background:#0092DD url(../img/main/icon_mMultiArrow.png) no-repeat left 60px bottom 60px/85px auto}
.mMultiArea .rightBanner .item.blue .lv1,
.mMultiArea .rightBanner .item.blue .lv2{color:#fff;}
.mMultiArea .rightBanner .item.blue01{background: linear-gradient(45deg, #0084ff, #00c3ff,#0084ff,#00c3ff); background-repeat: no-repeat; background-size: 300% 100%; animation: gradientflow 10s linear infinite;}
/*.mMultiArea .rightBanner .item.blue01{background: linear-gradient(45deg, #0092DD, #8ed8fe,#0092DD,#3fbbfb); background-repeat: no-repeat; background-size: 300% 100%; animation: gradientflow 10s linear infinite;}*/
.mMultiArea .rightBanner .item.blue01::after{content:"";position: absolute;display:block;width: 85px;height: 20px;background: url(../img/main/icon_mMultiArrow.png) no-repeat;bottom: 60px;left: 60px;
 background-size: 85px auto; transition: all 0.3s ease 0s;}
.mMultiArea .rightBanner .item.blue01:hover::after{left:80px;}
.mMultiArea .rightBanner .item.blue01 .lv1,
.mMultiArea .rightBanner .item.blue01 .lv2{color:#fff;}

/* key frames */
@keyframes gradientflow {
    0% {
        background-position: 100% 0%;
    }

    100% {
        background-position: 0% 0%;
    }
}

@keyframes keyword_left {
	0% { transform: translateX(-25%); }
	100% { transform: translateX(-75%); }
}

.mMultiArea .rightBanner .item.fullImg{border-radius:0 100px 0 0;}
.mMultiArea .rightBanner .item.white{background-color:#fbfbfb;}
.mMultiArea .rightBanner .item.gray{background-color:#F4F5F9;}
.mMultiArea .rightBanner .no_article {height:473px;padding-top:290px;background-position: left 50% top 180px;}

.mark_text{display:flex; position:relative;height:180px}
.mark_text .text {font-weight:600; font-size:150px; color:#F4F4F4;white-space:nowrap;line-height:150%;letter-spacing:5px; font-family: 'Oswald', sans-serif;}
.mark_text.on .text {animation:keyword_left 500s linear infinite;}
.mark_text .text span{unicode-bidi: isolate; }

/*한국어교육원 롤링배너 숨김*/
.mEtcBannerArea{display:none;}
.mEtcBannerArea{width:100%;max-width:1920px;margin:0 auto;font-size:0;}
.mEtcBannerArea .mEtcBanner{position:relative;width:50%;display:inline-block;vertical-align:top;/*height:946px;*/}
.mEtcBannerArea .mEtcBanner::before{content:"";display:block;padding-top:98.5%;width:100%}
.mEtcBannerArea .mEtcBanner .swiper-wrapper{position:absolute;left:0;top:0;}
.mEtcBannerArea .mEtcBanner .item{padding:150px 100px 50px 140px;background-color:#fff;;}
.mEtcBannerArea .mEtcBanner .item .cagDv{display:block;font-size:27px;line-height:40px;font-family: 'Oswald', sans-serif;color:#333333;margin-bottom:33px;}
.mEtcBannerArea .mEtcBanner .item .line1{display:block;font-size:66px;line-height:86px;font-weight:bold;color:#000;margin-bottom:50px;word-break:keep-all;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;max-height:172px;}
.mEtcBannerArea .mEtcBanner .item .line2{display:block;font-size:17px;line-height:32px;font-weight:300;color:#666;word-break:keep-all;display: -webkit-box;-webkit-line-clamp: 4;-webkit-box-orient: vertical;overflow: hidden;max-height:128px;}

.mEtcBannerArea .Control{position:absolute;left:50%;transform:translate(-50%,0%);bottom:150px;z-index:2;white-space:nowrap;width:100%;max-width:1920px;margin:0 auto;padding:0 140px;}
.mEtcBannerArea .numberIndex{display:inline-block;vertical-align:middle;width:auto;}

.mEtcBannerArea .numberIndex .index,
.mEtcBannerArea .numberIndex .total,
.mEtcBannerArea .numberIndex .div{font-family: 'Oswald', sans-serif;font-size:16px;line-height:1em;color:#000;display:inline-block;vertical-align:middle;font-weight:600;width:20px;text-align:center;}
.mEtcBannerArea .numberIndex .total,
.mEtcBannerArea .numberIndex .div{opacity:0.5}
.mEtcBannerArea .numberIndex .bar{width:250px;height:3px;background-color:#BFC2C4;margin:0 20px 0 0px;display:inline-block;vertical-align:middle;}
.mEtcBannerArea .numberIndex .bar>i{width:0;height:3px;background-color:#0092DD;}
.mEtcBannerArea .barPage{width:250px;height:3px;margin:0 20px 0 0px;display:inline-block;vertical-align:middle;}
.mEtcBannerArea .swiper-pagination{position:relative;width:100%;height:3px;background-color:#BFC2C4;display:-webkit-box;display: -ms-flexbox;display:flex;vertical-align:middle;}
.mEtcBannerArea .swiper-pagination-bullet{flex:1;opacity:1;background-color:#BFC2C4;border-radius:0;height:3px;transition:all 0.2s;}
.mEtcBannerArea .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color:#0092DD;}

.mEtcBannerArea .changeImage{width:50%;display:inline-block;/*height:946px;*/vertical-align:top;background-size:cover;background-position:center center;transition:background-image 0.5s;}
.mEtcBannerArea .changeImage::before{content:"";display:block;padding-top:98.5%;width:100%}
.mEtcBannerArea .changeImage .swiper-wrapper{position:absolute;left:0;top:0;}
.mEtcBannerArea .changeImage .item{position:relative;overflow:hidden;background-size:cover;background-position:center center;}
.mEtcBannerArea .Control>button.stop{display:inline-block;width:15px;height:15px;background-repeat:no-repeat;background-position:center center;background-image:url(../img/main/icon_etcBnrStop.png);vertical-align:middle;margin-left:7px;margin-top:1px;} 
.mEtcBannerArea .Control>button.stop.play{background-image:url(../img/main/icon_etcBnrPlay.png);}


.mProfessorArea{width:100%;padding:80px 0 100px 0;background-color:#F4F5F9;}
.mProfessorArea .mTit{text-align:center;margin-bottom:45px;}
.mProfessorArea .mProfessor{max-width:1920px;margin:0 auto;font-size:0;height:600px;}
.mProfessorArea .mProfessor .swiper-wrapper{align-items:center;}
.mProfessorArea .mProfessor .item{position:relative;width:370px;height:480px;margin:0 60px;transition:all 0.3s;vertical-align:middle;transition-delay:0.1s;}
.mProfessorArea .mProfessor .item::before{content:"";position:absolute;right:40px;bottom:50px;display:block;width:85px;height:20px;background:url(../img/main/icon_mMultiArrow.png) no-repeat center center/100% auto;opacity:0;transition:all 0.3s;}
.mProfessorArea .mProfessor .item a{position:relative;display:block;width:100%;height:100%;background-size:cover;background-position:center center;}
.mProfessorArea .mProfessor .item a:before {content:'';display:block;width:100%;height:300px;bottom:0;left:0;position:absolute;background:url(../img/main/mProfessor_dim.png) no-repeat;background-size: cover; }
.mProfessorArea .mProfessor .item span{display:block;font-size:16px;line-height:1em;color:#fff;margin-bottom:15px;transition:all 0.3s;}
.mProfessorArea .mProfessor .item p{display:block;font-size:32px;font-weight:bold;line-height:1em;color:#fff;transition:all 0.3s;}
.mProfessorArea .mProfessor .item .info{position:absolute;width:100%;left:0;bottom:0;font-size:0;padding:0 40px 40px 40px;}
.mProfessorArea .mProfessor .item.swiper-slide-active{transform:scale(1.25);}
.mProfessorArea .mProfessor .item.swiper-slide-active::before{opacity:1;}
.mProfessorArea .mProfessor .item.swiper-slide-active span{font-size:18px;}
.mProfessorArea .mProfessor .item.swiper-slide-active p{font-size:40px;}
.mProfessorArea .swiper-pagination{position:relative;width:462px;margin:0 auto;margin-top:50px;height:3px;background-color:#BFC2C4;display:-webkit-box;display: -ms-flexbox;display:flex;}
.mProfessorArea .swiper-pagination-bullet{flex:1;opacity:1;background-color:#BFC2C4;border-radius:0;height:3px;transition:all 0.2s;}
.mProfessorArea .swiper-pagination-bullet.swiper-pagination-bullet-active{background-color:#0092DD;}
.mProfessorArea .numberIndex{display:none;}

.mTit{font-family: 'Oswald', sans-serif;font-size:60px;font-weight:500;line-height:70px;color:#000;margin-bottom:45px;}
.mInnerBox{max-width:1920px;margin:0 auto;padding:0 140px;}

@media all and (max-width:1700px){
    .mMultiArea .rightBanner .item a{padding:30px 30px 80px 30px;}
    .mMultiArea .rightBanner .item.blue{background-position:left 30px bottom 30px;}
    .mMultiArea .rightBanner .item .mDay{left:30px;bottom:30px;}

    .mEtcBannerArea .mEtcBanner .item{padding:100px 50px 50px 50px;}
    .mEtcBannerArea .Control{bottom:50px;padding-left:50px;}
}
@media all and (max-width:1400px){
	.mVisualArea .mVisual{width:100%; margin-left:0;}
    .mMultiArea .rightBanner .item .lv1{-webkit-line-clamp:2;max-height:88px;}
}
@media all and (max-width:1300px){
    .mVisual .item .txtBox{padding:0 50px}
    .mVisual .mVisualControl{padding-left:50px;}
    .mInnerBox{padding:0 50px;}
    .mEtcBannerArea .mEtcBanner .item{padding:50px;}
    .mEtcBannerArea .mEtcBanner .item .line1{margin-bottom:40px;}
    .mEtcBannerArea .mEtcBanner .item .line2{-webkit-line-clamp:3;max-height:84px;}
    .mMultiArea .rightBanner .no_article {height:auto;padding-top:220px;background-position:left 50% top 90px;}
}

@media all and (max-width:1200px){
    .mMultiArea .imgBox{display:none;}
    .mMultiArea .rightBanner .item a{padding:40px 40px 80px 40px;}
    .mMultiArea .rightBanner .item .lv1{-webkit-line-clamp:3;max-height:132px;}
    .mMultiArea .rightBanner .item.blue{background-position:left 40px bottom 50px;}
    .mMultiArea .rightBanner .item .mDay{left:40px;bottom:40px;}
    .mMultiArea .rightBanner{width:100%;}

    .mEtcBannerArea{overflow:hidden;}
    
    .mEtcBannerArea .mEtcBanner{float:right;}
    .mEtcBannerArea .changeImage{float:left;}
}

@media all and (max-width:1040px){
    .mVisualArea .mVisual{height:800px; max-width:1040px; width:100%; margin-left:0;}
    .mVisual .item .txtBox{top:53%;}
    .mVisual .item .bgImgBox{height:800px;}
    .mVisual .item .bgImgBox>img{height:800px;}
    .mVisual .mVisualControl{bottom:100px;}

    /* .mMultiArea .rightBanner{height:1008px;} */
    

    /* .mEtcBannerArea .mEtcBanner{height:504px;} */
    .mEtcBannerArea .mEtcBanner .item{padding:40px 40px 60px 40px;}
    .mEtcBannerArea .mEtcBanner .item .cagDv{font-size:20px;line-height:1em;margin-bottom:20px;}
    .mEtcBannerArea .mEtcBanner .item .line1{font-size:32px;line-height:44px;margin-bottom:34px;}
    .mEtcBannerArea .mEtcBanner .item .line2{font-size:16px;line-height:28px;}
    .mEtcBannerArea .Control{bottom:20px;padding-left:40px;}
    /* .mEtcBannerArea .changeImage{height:504px;} */
    .mEtcBannerArea .numberIndex .index, 
    .mEtcBannerArea .numberIndex .total, 
    .mEtcBannerArea .numberIndex .div{font-weight:normal;}
    
    .mProfessorArea{position:relative;}
    .mProfessorArea .numberIndex{display:block;position:absolute;right:50px;width:auto;top:112px;}
    .mProfessorArea .numberIndex .index,
    .mProfessorArea .numberIndex .total,
    .mProfessorArea .numberIndex .div{font-family: 'Oswald', sans-serif;font-size:16px;line-height:1em;color:#000;display:inline-block;vertical-align:middle;font-weight:600;width:20px;text-align:center;}
    .mProfessorArea .numberIndex .total,
    .mProfessorArea .numberIndex .div{opacity:0.5}
}

@media all and (max-width:900px){ 
    .mEtcBannerArea .barPage {width:200px;}
}

@media all and (max-width:768px){ 
    .typeMain #contents br{display:none;}

    .mVisualArea .mVisual{height:auto;}
    .mVisual .item{min-height:700px;;}
    .mVisual .item .bgImgBox>img{display:none;}
    .mVisual .item .bgImgBox{height:100%;width:100%;}
    .mVisual .item .mBg{display:block;width:100%;height:100%;position:absolute;left:0;top:0;background-size:cover;background-position:center center;}
    .mVisual .item .txtBox{padding:80px 20px;}
    .mVisual .item .txtBox .line1{font-size:54px;line-height:68px;margin-bottom:22px; word-break: break-word;/* 긴 단어도 강제 줄바꿈 */white-space: normal;/* nowrap 되어있지 않도록 */ overflow-wrap: break-word;    /* 최신 브라우저 호환용 */}
    .mVisual .item .txtBox .line2{font-size:18px;line-height:30px;}
    .mVisual .mVisualControl{bottom:50px;padding-left:20px;}
    .mVisual .numberIndex .index, 
    .mVisual .numberIndex .total{font-weight:normal;}

    .mLinkArea{position:relative;padding:40px 0 38px 0px;}
    .mLink .item{width:auto;}
    .mLink .item>a{padding-top:60px;}
    .mLink .item>a>img{height:40px;}
	.mLink .item>a:hover>img{transform: translateY(0);}
    .mLink .item>a>p{font-size:21px;}
    .mLink .item>a>span{display:none;}
    .mLinkArea .control{position:absolute;right:20px;top:48px;width:auto;margin-left:50px;display:inline-block;vertical-align:middle;}
    .mLinkArea .control button{display:inline-block;width:15px;height:28px;font-size:0;vertical-align:middle;}
    .mLinkArea .control button.prev{background:url(../img/main/icon_mNewsPrev.png) no-repeat center center/auto 13px;}
    .mLinkArea .control button.next{background:url(../img/main/icon_mNewsNext.png) no-repeat center center/auto 13px;margin-left:20px;}

    .mMultiArea{overflow:hidden; margin-bottom:0;}
    .mMultiArea .rightBanner{height:auto;}
    .mMultiArea .rightBanner .item{width:100%;height:auto;}
    .mMultiArea .rightBanner .item::before{display:none;}
    .mMultiArea .rightBanner .item.fullImg{height:375px; border-radius: 0 0 0 0;}
    .mMultiArea .rightBanner .item a{position:relative;padding:40px 20px 80px 20px;min-height:380px;}
    .mMultiArea .rightBanner .item.blue{background-position:left 20px bottom 50px;}
    .mMultiArea .rightBanner .item .mDay{left:20px;bottom:45px;}
    

    .mEtcBannerArea{position:relative;padding-top:370px;}
    .mEtcBannerArea .mEtcBanner{width:100%;height:auto;}
    .mEtcBannerArea .mEtcBanner::before{display:none;}
    .mEtcBannerArea .mEtcBanner .swiper-wrapper{position:relative;}
    .mEtcBannerArea .mEtcBanner .item{padding:38px 20px 78px 20px;min-height:430px;}
    .mEtcBannerArea .mEtcBanner .item .line1{max-height:132px;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;overflow: hidden;}
    .mEtcBannerArea .mEtcBanner .item .line2{max-height:140px;display: -webkit-box;-webkit-line-clamp: 5;-webkit-box-orient: vertical;overflow: hidden;}

    .mEtcBannerArea .changeImage{position:absolute;top:0;left:0;width:100%;height:370px;}
    .mEtcBannerArea .numberIndex{bottom:35px;}
    .mEtcBannerArea .Control{padding:0 20px;left:0;width:100%;transform:translate(0,0);}
    .mEtcBannerArea .numberIndex .bar{width:calc(100% - 115px);}
    .mEtcBannerArea .barPage{width:calc(100% - 115px);}

    .mProfessorArea{padding:40px 0 40px 20px;}

    .mProfessorArea .mTit{text-align:left;padding-left:0px;margin-bottom:25px;}
    .mProfessorArea .mProfessor{height:auto;}
    .mProfessorArea .mProfessor .item{margin:0 20px 0 0;width:242px;height:311px;}
    .mProfessorArea .mProfessor .item.swiper-slide-active{transform:scale(1);}
    .mProfessorArea .mProfessor .item .info{padding:0 24px 24px 24px;}
    .mProfessorArea .mProfessor .item span{font-size:12px !important;margin-bottom:10px;}
    .mProfessorArea .mProfessor .item p{font-size:28px !important;}
    .mProfessorArea .mProfessor .item::before{display:none;}
    .mProfessorArea .mProfessor .item a:before {height:250px;}

    .mProfessorArea .numberIndex{top:auto;bottom:34px;right:20px;}
    .mProfessorArea .swiper-pagination{width:calc(100% - 100px);margin:33px 0 0 0;}
    .mProfessorArea .numberIndex .index, 
    .mProfessorArea .numberIndex .total, 
    .mProfessorArea .numberIndex .div{font-weight:normal;}


	.mark_text{height:120px;}
	.mark_text .text {font-size:100px;}

    .mInnerBox{padding:0 20px;}
    .mTit{font-size:28px;line-height:30px;}
}
@media all and (max-width:400px){
    
}