@charset "euc-kr";
/* setting */
/*{padding:0; margin:0}*/
.blindw {position:absolute;clip:rect(0 0 0 0);width:1px;height:1px;margin:-1px;overflow:hidden}
.eventWrap{width:100%;text-align:center;position:relative;font-size:18px;line-height:1.4;letter-spacing:-0.03em;overflow:hidden;}
.eventWrap{font-family :'NotoSans KR';}
.eventWrap *{box-sizing:border-box}
.eventWrap .inner {position:relative;width: 1000px;margin:0 auto;}
.eventWrap .inner2 {position:relative;width: 1080px;margin:0 auto;}
.eventWrap .inner3 {position:relative;margin:0 auto;}
.eventWrap .inner::after{content:"";display:block;clear:both;}
.eventWrap .inner2::after{content:"";display:block;clear:both;}
.eventWrap img{border:0 none;vertical-align:middle;max-width:100%;}
.eventWrap .con_tit{position:relative;margin-bottom:60px;text-align:center;text-align:left;}
.eventWrap .con_subtit{margin-bottom:35px;position:relative;padding:0 0%;}
.eventWrap .img_mb{display:none}
.eventWrap .con_box{position:relative}
.eventWrap .con_box::after{content:"";display:block;clear:both}
.eventWrap .flow::after{content:"";display:block;clear:both}
.eventWrap .video_box{position: relative;z-index: 1;cursor:pointer;padding-bottom: 56%;background: #222;overflow: hidden;border-radius: 3px;}
.eventWrap .video_box .play_area{z-index:3;width: 100% !important;height: 100% !important;position: absolute;width: 100%;height: 100%;}
.eventWrap .video_box iframe{position: absolute;top:0;left:0;width:100%;height:100%;}
/*.eventWrap .video_box img{position:absolute;top:0;left:0;bottom:0;right:0; width:100%; }*/
.eventWrap .video_box.ytb{padding: 0;}
.lecture {padding-bottom:0!important;background:#fff;text-align: left;}
.vodchr_banner {margin-bottom:0!important;}

/* flo */
.flt_inner {position: absolute;text-align: center;top: 100px;left: 50%;margin-left: 750px;z-index: 2;width: 140px;}
.flt_inner a {display:block;position:relative;margin-bottom: 5px;}

/* common */
.eventWrap h3{margin-bottom: 100px;}

/* conTop */
.conTop {position:relative;background: #010103 url(https://img.megagong.net/m/2022/0510_local/top_bg.jpg) no-repeat center;padding: 90px 0 0;background-size: auto 100%;}
.conTop span{display: block; margin: 0 0 65px;}
.conTop h2{display: block; margin: 0 -1200px;padding-bottom: 515px;}
.conTop strong{display: block;position: absolute;left: 50%;bottom: 0;margin: 0 -1200px;}

.conTop .hm_go{position: absolute;width: 1080px;height: 6%;left: 50%;bottom: 13%;transform: translateX(-50%);/* background: #ff00006b; */}
.conTop .hm_go li{position: absolute;left: 0;width: 15%;height: 100%;/* background: #0000ff6e; */}
.conTop .hm_go li + li{right: 0;left: auto;}
.conTop .hm_go li a{font-size: 0;display: block;width: 100%;height: 100%;}
.conTop .tiny{position: absolute;bottom: 20px;left: 50%;transform: translateX(-50%); color: #5d5d5d;font-size: 14px;font-style: normal;}

.conTop span{-webkit-animation:upShow .5s linear 0s both;animation:upShow .5s linear 0s both;}
.conTop h2{-webkit-animation:upShow .8s linear .5s both;animation:upShow .8s linear .5s both;}
/* .conTop strong{-webkit-animation:upShow .8s linear 0s both;animation:upShow .8s linear 0s both;} */
@-webkit-keyframes upShow{0% {opacity: 0;transform: translate3d(0, 100%, 0);}to {opacity: 1;transform: translateZ(0);}}
@keyframes upShow{0% {opacity: 0;transform: translate3d(0, 100%, 0);}to {opacity: 1;transform: translateZ(0);}}


/* con1 */
.con1 {position:relative; background: #e0e0ec; padding: 140px 0 0;}
.bubbleBox{width: 800px; margin: 0 auto;}
.bubbleBox li{float: left; margin: 50px 40px 0 0;position: relative;padding-bottom: 205px;}
.bubbleBox li + li{margin: 0;padding-bottom: 285px;}
.bubbleBox li::before{content: '';display: block;position: absolute;bottom: 0;right: 0;background: url(https://img.megagong.net/m/2022/0510_local/con1_img1_ic.png) no-repeat center;width: 380px;height: 195px;}
.bubbleBox li + li::before{content: '';display: block;position: absolute;bottom: 0;right: 0;background: url(https://img.megagong.net/m/2022/0510_local/con2_img2_ic.png) no-repeat center;width: 380px;height: 240px;}
.bubbleBox li div{background: #000;padding: 27px 0; border-radius: 15px; position: relative;width: 380px;}
.bubbleBox li div::before{content: '';display: block;position: absolute;bottom: -15px;right: 40px;background: url(https://img.megagong.net/m/2022/0510_local/con1_img1_bg.jpg) no-repeat center;width: 22px;height: 15px;}
.bubbleBox li + li div::before{content: '';display: block;position: absolute;bottom: -15px;left: 40px;background: url(https://img.megagong.net/m/2022/0510_local/con1_img2_bg.jpg) no-repeat center;width: 22px;height: 15px;}
.bubbleBox li img{margin: 0 auto;}
.bubbleBox li img{display: none;}
.bubbleBox li img.on{display: block;}

/* con2 */
.con2 {position:relative; background: #f2f2f9; padding: 140px 0;}
.btit{display: block; margin: 125px auto 0;}
.btit img{display: none;}
.btit img.on{display: block;}

/* con3 */
.con3 {position:relative; background: #fff; padding: 140px 0 100px;}
.mo_tab{display: none;}
.tab_list{margin:0 0 50px;width: 100%;} 
.tab_list li{background: #e0e0ec;float: left;width: 50%;position: relative;} 
.tab_list li strong{display: block;padding: 20px 0; }
.tab_list li img{margin: 0 auto;}
.tab_list li img.on{display: none;} 
.tab_list li img.off{display: block;} 
.tab_list li.on{background: #0042ff;}
.tab_list li.on::before{content: '';display: block; position: absolute; left: 50%; bottom:-22px; transform: translateX(-50%); border-top: 11px solid #0042ff; border-bottom:  11px solid transparent; border-right: 11px solid transparent; border-left: 11px solid transparent;}
.tab_list li.on img.on{display: block;} 
.tab_list li.on img.off{display: none;} 
.tab_cont{display: none; position: relative;} 
.tab_cont.on{display: block;}

.vdinfoBox{margin: 20px auto 0;}
.vdinfoBox li{float: left;margin-right: 5px;padding: 31px 0;background: #ebebec;width: 330px;font-size: 16px;}
.vdinfoBox li:last-child{margin-right: 0;}
.vdinfoBox li b{font-size: 22px;color: #0042ff;margin: 0 0 20px;font-weight: 900;display: block;}

.bk_tit{margin: 100px auto 80px;}
.bkBox{position: relative;}
.bkBox strong{display: block;text-align: left;margin-left: 130px;}
.bkBox .btns{position: absolute;right: 100px;bottom: 80px;}
.bkBox .btns a{display: block;}
.bkBox .btns li + li{margin: 15px 0 0;}

/* event */
.event {position:relative; background: #1a3a98; padding: 140px 0;}
.event .evt_end{position: absolute;right: -4%;top: 40%;width: 19%;}
.event h3{margin-bottom: 70px;}
.event .info{margin: 0 24% 40px;}
.event .info li{border: 2px solid #fff; border-radius: 30px;padding: 10px 0;font-size: 21px;color: #fff;}
.event .info li strong{padding: 0 18px; margin-right: 18px;position: relative;}
.event .info li strong::before{content: '';display: block;position: absolute;left: 0;top: 50%;transform: translateY(-50%);width: 5px;height: 5px;border-radius: 50%;background: #fff;}
.event .info li strong::after{content: '';display: block;position: absolute;right: 0;top: 50%;transform: translateY(-50%);width: 2px;height: 50%;background: #5f75b7;}

/* evt_cautn */
.evt_cautn {text-align: left; background: #fff; padding: 75px 0;}
.evt_cautn h4{font-size: 16px;padding-bottom: 20px;}
.evt_cautn dd{font-size: 14px;line-height: 1.8;position: relative;padding-left: 8px;}
.evt_cautn dd::before{content: '-';display: block;position: absolute;top: 0;left: 0;}

@media (max-width: 1200px){
    .eventWrap{font-size: 13px;}
    .flt_inner{display: none;}
    .eventWrap .inner {width: 96%;}
    .eventWrap .inner2 {width: 96%;}
    .eventWrap .inner3 {width: 96%;}
    .eventWrap img {width:100%;}
    .eventWrap h3{margin-bottom: 10%;}
    .con1 {padding: 15% 0 0;}
    .con2,.event {padding: 15% 0;}
    .con3 {padding: 15% 0 10%;}
    .evt_cautn {padding: 8% 0;}

    .conTop{padding: 10% 0 0;}
    .conTop img{width: auto;}
    .conTop span{margin: 0 7% 6%;}
    .conTop h2{margin: 0;padding-bottom: 58%;}
    .conTop .hm_go{width: 46%;}

    .bubbleBox li img{width: auto;}
    .btit{margin:10% 5% 0;}
    .tab_list li strong{padding: 2%;}
    .vdinfoBox{margin: 5% auto 0;}
    .vdinfoBox li{margin-right: 2%;width: 32%;height: 170px;padding: 2% 0;font-size: 15px;}
    .bkBox img{width: auto;}
    .bkBox strong{margin: 0 0 5% 30%;width: 45%;}
    .bkBox .btns{position: relative;right: auto;bottom: auto;width: 85%;margin: 0 auto;}
    .bkBox .btns li{float: left;width: 49%;}
    .bkBox .btns li + li{margin: 0 0 0 2%;}

    .event h3{margin: 0 -12% 8%;}
    .event .info{margin: 0 12% 5%;}
}
@media (max-width:992px){
    .conTop strong{position: relative;left: auto;bottom: auto;margin: -90% -65% 0;}

    .bubbleBox{width: 100%;}
    .bubbleBox li{width: 49%;margin: 5.5% 2% 0 0;padding-bottom: 28%;}
    .bubbleBox li div{padding: 4% 3%;width: 100%;}
    .bubbleBox li + li{margin: 0;padding-bottom: 37%;}
}
@media (max-width: 768px){
    .conTop .tiny{font-size: 10px;width: 100%;bottom: 5px;}
    .con1{padding: 15% 0;}
    .bubbleBox li{width: 100%;margin: 0 0 8%;float: none;padding: 0 33% 0 0;}
    .bubbleBox li div{padding: 4% 3%;width: 100%;}
    .bubbleBox li + li{padding: 0 0 0 33%;}
    .bubbleBox li div::before{right: -18px;bottom: 75px;transform: rotate(270deg);}
    .bubbleBox li + li div::before{left: -18px;bottom: 45px;transform: rotate(90deg);}
    .bubbleBox li::before{bottom: 0;right: 0;width: 40%;height: 100%;background-size: contain;}
    .bubbleBox li + li::before{width: 40%;height: 155%;background-size: contain;right: auto;left: 0;}
    .vdinfoBox li{margin-bottom: 2%;padding: 2%;width: 100%;font-size: 14px;height: auto;margin-right: 0;}
    .vdinfoBox li br{display: none;}
    .vdinfoBox li b{font-size: 18px;margin: 0 0 1.5%;}

    .mo_tab{display: block;background: #0042ff;position: relative;margin: 12% auto 5%;padding: 2% 0;}
    .mo_tab::before{content: '';display: block; position: absolute; left: 50%; bottom:-22px; transform: translateX(-50%); border-top: 11px solid #0042ff; border-bottom:  11px solid transparent; border-right: 11px solid transparent; border-left: 11px solid transparent;}
    .tab_cont{display: block;}
    .mo_none{display: none;}
    .tab_list{margin: 0 0 5%;} 
    .tab_list li{width: 100%;}
    .tab_list li img,.mo_tab img{width: 50%;display: block;margin: 0 auto;}
    .bk_tit{margin: 15% -23% 10%;}
    .event .info{margin: 0 5% 5%;}
    .event .info li{font-size: 16px;padding: 5px 0;}
    .event .info li strong{padding: 0 15px; margin-right: 15px;}
    .evt_cautn h4{font-size: 14px;}
    .evt_cautn dd{font-size: 12px;}
    /* 
    .tab_list li strong{padding:2% 0; overflow: hidden;}
    .tab_list li strong img{margin: 0 0 0 -22%;}
    .tab_list li.on::before{bottom:-16px;border-top: 8px solid #0042ff; border-bottom:  8px solid transparent; border-right: 8px solid transparent; border-left: 8px solid transparent;}
    */
}
@media (max-width: 576px){
    .bubbleBox li div{padding: 4% 20%;}
    .bubbleBox li div::before{background-size: contain;width: 5%;bottom: 50%;right: -3.7%;}
    .bubbleBox li + li div::before{background-size: contain;width: 5%;bottom: 50%;left: -3.7%;}
    .vdinfoBox li{font-size: 12px;}
    .vdinfoBox li b{font-size: 14px;}
    .event .info li{font-size: 14px;border-width: 1px;}
}
