@charset "utf-8";


.section {  }
.section .tit h3 { color:#212121; font-weight: 700; font-family: 'S-CoreDream'; }
.section .tit p {  }

#mVisual .mvWrap .mv_slider { width: 100vw; height: 100vh; display: flex; align-items: center; text-align: center; }
#mVisual .mvWrap .mv_slider img { max-width: 100%; object-fit: cover; display: inline-block; vertical-align: bottom; }
#mVisual .mvWrap .mv_slider img.mo { display: none; }

#mVisual .mvWrap .mv_slider .img { width: 60%; position: relative; }
#mVisual .mvWrap .mv_slider .img .BG { position: absolute; left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: -1; }
#mVisual .mvWrap .mv_slider .txt { width: 40%; padding-top: 5%;  }
#mVisual .mvWrap .mv_slider2{}
#mVisual .mvWrap .mv_slider2 .img{width: 100%; height: 100%;}
#mVisual .mvWrap .mv_slider2 .img.pc{display: block;}
#mVisual .mvWrap .mv_slider2 .img.mo{display: none;}
#mVisual .mvWrap .mv_slider2 .img img{max-width: inherit; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%)}
#mVisual .mvWrap .mv_slider2 .txt{position: absolute; right: calc(80px + 3%); top: 50%; transform: translateY(-50%); width: auto;}
#fp-nav.fp-left{top: 43%;}

@media all and (max-width:976px) {
  /* #mVisual .mvWrap .mv_slider img { max-height: 100%; } */
  #mVisual .mvWrap .mv_slider img.mo { display: inline-block;  }
  #mVisual .mvWrap .mv_slider img.pc { display: none; }

  #mVisual .mvWrap .mv_slider { flex-wrap: wrap;  }
  #mVisual .mvWrap .mv_slider > div { display: flex; justify-content: center;  }
/*  #mVisual .mvWrap .mv_slider .img { width: 100%; height: 55vh; align-items: flex-end; }*/
  #mVisual .mvWrap .mv_slider .img { width: 100%; height: 100vh; align-items: flex-end; }
  #mVisual .mvWrap .mv_slider .txt { width: 100%; height: 45vh; align-items: flex-start; padding-top:0;  }

  #mVisual .mvWrap .mv_slider .img .BG { left:0; transform: translate(0,-40%);  }

  #mVisual .mvWrap .mv_slider img { max-height: 100%; }
  #mVisual .mvWrap .mv_slider .txt img { margin-top: -5vh; }
	#mVisual .mvWrap .mv_slider2 .img.pc{display: none;}
	#mVisual .mvWrap .mv_slider2 .img.mo{display: block;}
	#mVisual .mvWrap .mv_slider2 .img.mo img{width: 100%;}
}


@media all and (max-width:767px) {
  #mVisual .mvWrap .mv_slider .txt img { margin-top: -2vh; }
}


#mPoster { background: #deedff; }
#mPoster .s-inner { display: flex; flex-wrap: wrap; align-items: stretch; justify-content: space-between; }
#mPoster .s-inner .mainPoster { position: relative; width: 44%; text-align: center; }
#mPoster .s-inner .mainPoster::before { content:''; width: 177px; height: 307px; background: url("/images/main/poster_img1.png") no-repeat center bottom;
                                                          position: absolute; left: -5%; bottom: -10%; }
#mPoster .s-inner .mainPoster img { max-width: 90%; box-shadow: 8px 8px 18px 3px rgba(25,87,113, 0.2); }
#mPoster .s-inner .cont { width: 53%; display: flex; flex-wrap: wrap; gap: 20px; }
#mPoster .s-inner .cont #mBoard { width: 100%; height: 62%; background: #fff; padding: 2.5em; }
#mPoster .s-inner .cont #mBoard .tabs li { width: 120px; line-height: 2.6em; font-size: 1.7rem; font-weight: 800; text-align: center;
                                                               display: inline-block; vertical-align: middle; margin-right: 1px;  }
#mPoster .s-inner .cont #mBoard .tabs li a { display: block; width: 100%; color:#fff; background: #8ea4b8; border-radius: 1.3em;}
#mPoster .s-inner .cont #mBoard .tabs li.active a { background: #1947ba; }
#mPoster .s-inner .cont #mBoard .more { position: absolute; top: 3.4em; right: 2.5em; width: 21px; height: 21px;   }
#mPoster .s-inner .cont #mBoard .more span { background: #9fb4c8; display: inline-block; position: absolute; }
#mPoster .s-inner .cont #mBoard .more span.w { width: 100%; height: 3px; left:0; top: 50%; margin-top: -1.5px;  }
#mPoster .s-inner .cont #mBoard .more span.v { height: 100%; width: 3px; left: 50%; top:0; margin-left: -1.5px; }
#mPoster .s-inner .cont #mBoard .bdList { margin-top: 2em; border-top: 2px solid #8ea4b8; }
#mPoster .s-inner .cont #mBoard .bdList li a { display: flex; justify-content: space-between; padding: 1em 0; border-bottom: 1px solid #e9eff5; }
#mPoster .s-inner .cont #mBoard .bdList li p { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#mPoster .s-inner .cont #mBoard .bdList li p.bd_txt { max-width: 85%;  }
#mPoster .s-inner .cont #mBoard .bdList li p.date { max-width: 15%; }

#mPoster .s-inner .cont .boxWrap { width: 100%; height: calc(38% - 20px); display: flex; align-items: center; justify-content: space-between;}
#mPoster .s-inner .cont .box { width: calc(50% - 10px); height: 100%;  }
#mPoster .s-inner .cont .box1 { background: #009cff url("/images/main/poster_img2.png") no-repeat right bottom; }
#mPoster .s-inner .cont .box2 { background: #2847aa url("/images/main/poster_img3.png") no-repeat right bottom; }
#mPoster .s-inner .cont .box a { display: block; color:#fff; padding: 2em; }
#mPoster .s-inner .cont .box a h4 { font-size: 2.4rem; font-weight: 700; font-family: 'S-CoreDream'; }
#mPoster .s-inner .cont .box a p { font-size: 1.5rem; margin-top: 0.7em; }
#mPoster .s-inner .cont .box a span { font-size: 1.3rem; padding: 0.7em 1em; display: inline-block; border-radius: 30px; margin-top: 4em; }
#mPoster .s-inner .cont .box1 span { background: #003e66; }
#mPoster .s-inner .cont .box2 span { background: #182b66; }


@media all and (max-width:1480px) {
  #mPoster .s-inner .mainPoster::before { max-width: 20%; background-size: 100% auto; }
  #mPoster .s-inner .mainPoster { width: 45%; }
  #mPoster .s-inner .cont { width: 54%;  }
  #mPoster .s-inner .cont .box { background-size: 50% auto; }
}

@media all and (max-width:1280px) {
  #mPoster .s-inner { align-items: center; }
  #mPoster .s-inner .mainPoster { text-align:  left; }
  #mPoster .s-inner .mainPoster img { max-width: 95%; }
  #mPoster .s-inner .cont #mBoard .tabs li { font-size: 1.6rem; }
  #mPoster .s-inner .cont #mBoard .more { width: 17px; height: 17px; }
  #mPoster .s-inner .cont #mBoard .bdList { font-size: 1.5rem; }
  #mPoster .s-inner .cont .box a { padding: 1.5em; }
  #mPoster .s-inner .cont .box a h4 { font-size: 2.2rem; }
  #mPoster .s-inner .cont .box a span { font-size: 1.2rem;}
}

@media all and (max-width:1080px) {
  #mPoster .s-inner .cont #mBoard .tabs li { width: auto; line-height: 2.3em; }
  #mPoster .s-inner .cont #mBoard .tabs li a { padding: 0 1em; }
  #mPoster .s-inner .cont .box a h4 { font-size: 2rem; }
  #mPoster .s-inner .cont .box a p { margin-top: 0.3em; }
  #mPoster .s-inner .cont .box a span { margin-top: 3em; }
}

@media all and (max-width:1080px) {
  #mPoster .s-inner .cont { gap: 10px; }
  #mPoster .s-inner .cont #mBoard .bdList { margin-top: 1em; }
   #mPoster .s-inner .cont .box { width: calc(50% - 5px); height: calc(38% - 10px); }
}

@media all and (max-width:767px) {
  #mPoster .s-inner .mainPoster { width: 100%; text-align:  center; margin-bottom: 2em; }
  #mPoster .s-inner .mainPoster img { max-width:40%; }
  #mPoster .s-inner .mainPoster::before { bottom:0; left: 16%; max-width: 15%;  }
  #mPoster .s-inner .cont { width: 100%; align-items: stretch;  }
  #mPoster .s-inner .cont #mBoard { width: 60%; padding: 2em; }
  #mPoster .s-inner .cont .boxWrap { flex-wrap: wrap; width: calc(40% - 10px); height: 100%; gap: 10px;   }
  #mPoster .s-inner .cont .box { width: 100%; height: 50%;  }
}

@media all and (max-width:568px) {
    #mPoster .s-inner .cont #mBoard { width: 100%; }
    #mPoster .s-inner .cont #mBoard .tabs li { font-size: 1.5rem; }
    #mPoster .s-inner .cont #mBoard .bdList li a { padding: 0.7em 0; }
    #mPoster .s-inner .cont .boxWrap { width: 100%; }
    #mPoster .s-inner .cont .box { width: calc(50% - 5px); height: auto; }
}

@media all and (max-width:380px) {
  #mPoster .s-inner { padding-top: 5%; }
  #mPoster .s-inner .mainPoster img { max-width:45%; }
  #mPoster .s-inner .cont #mBoard { padding: 1.5em; }
  #mPoster .s-inner .cont #mBoard .bdList li p.bd_txt { max-width: 80%;  }
  #mPoster .s-inner .cont #mBoard .bdList li p.date { max-width: 20%;  }

  #mPoster .s-inner .cont .box a h4 { font-size: 1.8rem; }
  #mPoster .s-inner .cont .box a p { display: none; }
  #mPoster .s-inner .cont .box a span { margin-top: 2em; }
}


#mProgram { text-align: center; background: url("/images/main/programBG.png") no-repeat 105% top; }
#mProgram .tit { position: relative; }
#mProgram .tit::before { content:''; width: 158px; height: 223px; background: url("/images/main/program_ch1.png") no-repeat center; background-size: 100% auto;
                                    position: absolute; left: 25%; top: -5%; }
#mProgram .tit h3 { font-size: 5.5rem; }
#mProgram .tit p { color:#727a80; margin-top: 1em; }
#mProgram ul { position: relative; width: calc(100% + 40px); margin-left: -20px;}
#mProgram ul li { margin: 0 20px; border-radius: 15px; background: #fff; box-shadow: 5px 8px 15px 2px rgba(51,51,51,0.1); overflow: hidden; }
#mProgram ul li img { width: 100%;  }
#mProgram ul li > a { display: block; width: 100%; }
/* #mProgram ul li:nth-child(even) { margin-top: 3em; } */
#mProgram ul li:nth-child(2),#mProgram ul li:nth-child(3) { margin-top: 6em;  }
#mProgram .slick-list { overflow: visible; }

#mProgram ul li .txt { position: relative; width: 100%; display: block; padding: 1.5em; }
#mProgram ul li .txt h4 { font-size: 2.3rem; font-weight: 800; color:#212121; margin-bottom: 1em; }
#mProgram ul li .txt dl {  display: flex; flex-wrap: wrap; text-align: left; width: 90%; margin: 0 auto; color:#727a80; font-size: 1.5rem;  }
#mProgram ul li .txt dl dt { width: 50px; font-weight: 800; }
#mProgram ul li .txt dl dd { width: calc(100% - 50px); }
#mProgram ul li .txt dl dt, #mProgram ul li .txt dl dd { margin: 0.2em 0; }
#mProgram ul li .txt .btn { position: relative; padding: 1em 0 0.5em; text-align: center; }
#mProgram ul li .txt .btn a { display: inline-block; vertical-align: middle; font-size: 1.4rem; font-weight: 800; color:#fff; line-height: 2em; padding: 0 1em;
                                          border-radius: 1em; }
#mProgram ul li .txt .btn a.btn1 { background: #009cff; }
#mProgram ul li .txt .btn a.btn2 { background: #2847aa; margin-left: 5px;  }


@media all and (max-width:1580px) {
  #mProgram ul { width: calc(100% + 20px); margin-left: -10px;}
  #mProgram ul li { margin: 0 10px; }
  #mProgram ul li .txt .btn a { font-size: 1.3rem; }
  #mProgram ul li .txt .btn a.btn2 { margin-left: 1px; }
}

@media all and (max-width:1480px) {
  #mProgram .tit::before { max-width: 10%; background-size: 100% auto; left: 23%;  }
  #mProgram ul li .txt h4 { font-size: 2rem; margin-bottom: 0.7em;  }
  #mProgram ul li .txt dl { width: 100%; font-size: 1.4rem; }
  #mProgram ul li .txt .btn a { font-size: 1.2rem; }
}

@media all and (max-width:1380px) {
    #mProgram ul li .txt h4 { font-size: 1.8rem; }
    #mProgram ul li .txt dl dt { width: 40px; }
    #mProgram ul li .txt dl dd { width: calc(100% - 40px); }
    #mProgram ul li .txt .btn { width: 120%; margin-left: -10%; }
}

@media all and (max-width:1280px) {
  #mProgram .s-inner { padding: 0 5%; }
  #mProgram .tit::before { max-width: 12%; left: 22%;  }
  #mProgram .tit h3 { font-size: 4.5rem; }
  #mProgram ul {  margin: 3em auto 0; }
  #mProgram ul li .txt h4 { font-size: 2rem; }
}

@media all and (max-width:1080px) {
  #mProgram { background-size: 40% auto; }
  #mProgram .tit::before { left: 12%;  }
}

@media all and (max-width:880px) {
  #mProgram .tit::before { max-width: 16%; left: 8%; top: -3%;  }
}

@media all and (max-width:568px) {
  #mProgram .tit::before { max-width: 18vw; left: 4%; top: -3%;  }
  #mProgram .tit h3 { font-size: 4rem; }
  #mProgram .tit p { max-width: 60%; margin: 0.7em auto;  }
  #mProgram ul li:nth-child(2),
  #mProgram ul li:nth-child(3) { margin-top: 0;  }
  /* #mProgram ul li:nth-child(even) { margin-top: 2.5em; } */
}

@media all and (max-width:480px) {
  #mProgram .tit::before { max-width: 23vw; top: -6vw; left:-4%; }
  #mProgram ul { max-width: 250px; }
  #mProgram ul li .txt h4 { font-size: 2.4rem; }
  /* #mProgram ul li:nth-child(even) { margin-top: 0; } */
  #mProgram ul li.slick-active { margin-top: 2em; }
}


#mPhoto { position: relative; background: #f2f6fa; }
#mPhoto::before { content: ''; position: absolute; left:0; bottom:0; width: 35%; height: 100%; background: #2a40e5; }
#mPhoto .tit { width: 35%; padding: 0 1.5% 120px; }
#mPhoto .tit h3 { font-size: 4.5rem; line-height: 1.1em; }
#mPhoto .tit p { margin-top: 1.5em; line-height: 1.5em; }


#mPromotion { position: relative;  display: flex; align-items: center; flex-direction: row-reverse; }
#mPromotion .tit { text-align: right; }
#mPromotion .tit p { color: #212121;  }
#mPromotion .promotionSlide { width: calc(75% + 30px); margin-left: -15px; text-align: center; }
#mPromotion .promotionSlide .item { margin: 0 15px; box-shadow: 5px 8px 15px 2px rgba(51,51,51,0.1); }
#mPromotion .promotionSlide .item img { max-width: 100%; }
#mPromotion .promotionSlide .item dl { padding: 1.5em; background: #fff; }
#mPromotion .promotionSlide .item dl dt { font-size: 2rem; font-weight: 800; color:#212121; margin-bottom: 0.3em; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
#mPromotion .promotionSlide .item dl dd { font-size: 1.5rem; color:#727a80; width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}



.coverOn { display: none; position: fixed; left:0; top: 0; background: rgba(0,0,0,0.8); width: 100%; height: 100%;
                              z-index:20; cursor: pointer; }

#mPromotion .popupVod { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: none; z-index: 30; }
#mPromotion .popupVod .close { position: absolute; right:0; top: -50px; width: 50px; height: 50px; background: #f7b92a; }
#mPromotion .popupVod span { background: #fff; width:26px; height:2px; position:absolute; left:50%; top: 50%; transition:all 0.5s; }
#mPromotion .popupVod span.bar1 { transform:translate(-50%, -50%) rotate(45deg); }
#mPromotion .popupVod span.bar2 { transform:translate(-50%, -50%) rotate(-45deg); }



#mHistory { position: relative; display: flex; align-items: center; margin-top: 4%; }
#mHistory .tit { position: relative; }
#mHistory .tit::before { content:''; width: 297px; height: 168px; position: absolute; right:-10%; bottom:-10%; max-width: 60%;
                                  background: url("/images/main/history_ch1.png") no-repeat center; background-size: 100% auto; }
#mHistory .tit h3,
#mHistory .tit p { color:#fff; }
#mHistory .historySlide {  width: 88%; margin-right: -12%; }
#mHistory .historySlide .item { margin: 0 15px; box-shadow: 5px 8px 15px 2px rgba(51,51,51,0.1);  }
#mHistory .historySlide .item img { max-width: 100%; }


@media all and (max-width:1480px) {
  #mPhoto .tit h3 { font-size: 4rem; }

  #mPhoto .slick-list .item { box-shadow: none; }

  #mPromotion .promotionSlide { width: calc(75% + 20px); margin-left: -10px; }
  #mPromotion .promotionSlide .item { margin: 0 10px; }

  #mHistory .historySlide .item { margin: 0 10px; }
}

@media all and (max-width:1280px) {
  #mPhoto .tit { padding: 0 1.5% 100px; }
  #mPhoto .tit h3 { font-size: 3.4rem; }
  #mPhoto .tit p { font-size: 1.4rem; }
}

@media all and (max-width:767px) {
  #mPhoto::before { width: 45%; }
  #mPhoto .tit h3 { font-size: 3rem; }
  #mPhoto .tit p { display: none;}

  #mPromotion .promotionSlide { width: calc(75% + 10px); margin-left: -5px; }
  #mPromotion .promotionSlide .item { margin: 0 5px; }

  #mHistory .historySlide .item { margin: 0 5px; }
}

@media all and (max-width:640px) {
  #mPhoto .tit { padding-left:0; padding-right:0; }
}

@media all and (max-width:480px) {
  #mPhoto::before { width: 100%; height: 60%;  }
  #mPhoto .tit { width: 100%; padding: 0; margin-bottom: 1em;  }
  #mPhoto .tit h3 br { display: none; }

  #mPromotion,
  #mHistory { flex-wrap: wrap; }
  #mPromotion .promotionSlide { width: calc(100% + 10px); }
  #mHistory .historySlide {  width: 120%; }

  #mHistory { margin-top: 4em; }
  #mHistory .tit::before { max-width: 28%; height: 15vw; bottom:-10%; right: 20%;  }

  #mPromotion .promotionSlide .item dl { padding: 1.5em 1em; }
}





/*모달팝업*/
.overlay {
    background-color: rgba(0, 0, 0, 0.9);
    display: none;
    bottom: 0;
    left: 0;
    opacity: 0;
    position: fixed;
    right: 0;
    top: 0;
   cursor: default;
    visibility: hidden;
    z-index: 999991;
    -webkit-transition: opacity .5s; -moz-transition: opacity .5s; -ms-transition: opacity .5s; -o-transition: opacity .5s;
    transition: opacity .5s;
}


.overlay:target {
    visibility: visible; opacity: 1; display: block;
}

.popup {
    background-color: #fff;
    display: inline-block;
    left: 50%;
    opacity: 0;
    padding: 0;
    position: fixed;
/*    position: absolute;*/
    /*text-align: justify;*/
    top: 0;
    visibility: hidden;
    z-index: 999999;


    -webkit-transform: translate(-50%, -50%);  -moz-transform: translate(-50%, -50%);  -ms-transform: translate(-50%, -50%); -o-transform: translate(-50%,-50%);
    transform: translate(-50%, -50%);

    -webkit-transition: opacity .5s, top .5s; -moz-transition: opacity .5s, top .5s; -ms-transition: opacity .5s, top .5s;-o-transition: opacity .5s, top .5s;
    transition: opacity .5s, top .5s;

}
.overlay:target+.popup {
/*    top: 0; */
    top: 50%;
    opacity: 1; visibility: visible;
}
.popup .close {
    background-color:#009cff ;
    width: 60px;
    height: 60px;
    line-height: 60px;
    position: absolute;
    right: 0;
    text-align: center;
    text-decoration: none;
    top: 0;
}
.popup .close:before {
    color: #fff;
    content: '\e870';
    font-size: 40px; font-family:'Linearicons-Free';
    line-height: 60px;
}
.popup .close:hover {
    background-color:#444;
}



.popVod { width: 800px; height: 500px; max-width: 80vw; max-height: 50vw; }

@media all and (max-width:976px) {
  .popup .close { width: 50px; height: 50px; line-height: 50px; }
  .popup .close:before { line-height: 50px; font-size: 30px;}
}

@media all and (max-width:568px) {
  .popup .close { width: 40px; height: 40px; line-height: 40px; }
  .popup .close:before { line-height: 40px; font-size: 24px;}
}
