@charset "euc-kr"; :root {--point: #3e89ff; --evt_point: #0524ff;}

/* settings */
.eventWrap .evSection {background-size: auto 100%;}
.eventWrap .evSection .lecture {max-width:1000px; margin:0 auto; color: #000;}
.eventWrap .evSection.fff, .eventWrap .evSection .fff {color: #fff !important;}
.eventWrap .evSection .f00 {color: #f00 !important;}
.eventWrap .evSection b {font-weight:700}
.eventWrap .evSection strong {font-weight:900}
.eventWrap .tiny_noti {opacity: 0.6;}
.evSection:not(.evtoggleWarning,.evCon1) {padding: 140px 0;}
/* .eventWrap .evSection .whs-pre {white-space: pre-wrap;}*/

.flt_inner.renewal li{position:relative}
.flt_inner.renewal .end {position: absolute;top: 3px;left: 3px;} 
.eventVideo.video_renewal .video_box {overflow:hidden}


/* text style */ 
.line_tit {display: flex; justify-content: center; align-items: center; margin: 0 0 20px; position: relative;}
.line_tit i {height: 1px; background: #000; flex: 1;}
.line_tit i:last-child {right: unset; left:100%;}
.line_tit span {position: relative; padding: 0 40px; display: inline-block; line-height: 1.4;}
.line_tit.circle span {background: #000; color: #fff; padding: 10px 60px 12px; border-radius: 40px; position: relative; z-index: 2;}
.evCon3 .line_tit img {position: absolute;left: 50%;margin-left: -380px;z-index: 2;bottom: -15px;}
p.tiny {opacity: .7;font-weight: 300;}




.con_tit {margin: 0 -75px 50px;}
.con_tit span {color: var(--point);}
.point {color:var(--point)}
.event .con_tit span {color: var(--evt_point);}
.event .eventStep-base .item p span {color: var(--evt_point);}
.event .container_info .info .noti {opacity: 1; color: var(--evt_point); font-weight: normal; margin-left: 5px;}

/* contents */
.evCon1 {background: #080658 url(https://image.megagong.net/m/2024/1113_shin242/con1_bg.jpg) no-repeat center;padding: 50px 0 80px;} 
.evCon1 .mini_tit {color: var(--point); letter-spacing: 1rem;}
.evCon1 h3 {margin: 610px -100px 0; position: relative;}
.evCon1 h3 .home {font-size: 0; position: absolute; top: 73px; right: 328px; width: 22px; height: 22px;}

.evCon2 {background: linear-gradient(180deg, #02150c, #001e53);}
.evCon2 .eventVideo{margin-left: 40px;margin-right: 40px;}
.evCon2 .line_tit i {background: #eee}
.evCon2 .line_tit span {background: #eee; color:#000}
.evCon2 .desc_txt .tiny {margin-top: 20px;}
.evCon2 .graph {justify-content: space-between; margin-top: 40px; position: relative;}
.evCon2 .graph::before {content: ''; display: block; position: absolute; background: url('https://image.megagong.net/m/2024/1113_shin242/arrow_small.png') no-repeat center; width: 45px; height: 98px; background-size: contain; z-index: 1; transform: translateX(-50%); top: 50%; left: 50%;}
.evCon2 .graph li p {background: #181818; padding: 25px 0; font-weight: normal;}
.evCon2 .graph li span {padding: 50px 20px;display: block;}
.evCon2 .graph li {border-radius: 15px;overflow: hidden;border: 2px solid #181818;background: #001941;}
.evCon2 .graph li.before p b {color:var(--point)}
.evCon2 .graph li.after {border-color: var(--point);}
.evCon2 .graph li.after p {background: var(--point);}

.evCon3 {background-color: #fff;}
.evCon3 .arrow_wrap.before {padding-bottom: 100px; margin-bottom: 60px; position: relative;}
.evCon3 .arrow_wrap.before::before {content: ''; display: block; position: absolute; bottom: 0; background: url('https://image.megagong.net/m/2024/1113_shin242/arrow_big.png') no-repeat center; width: 306px; height: 100px; background-size: contain; z-index: 1; left: 50%; transform: translateX(-50%);}
.evCon3 .line_tit i {background: #eee}
.evCon3 .line_tit span {background: #eee; color:#000}
.evCon3 .arrow_box {border: 2px solid #eee;padding: 35px 20px;} 
.evCon3 .arrow_txt {background: #eee; height: 100px; display: flex; align-items: center; justify-content: center;}
.evCon3 .arrow_txt a {position: absolute; right: 40px; background: #cacaca; border-radius: 30px; padding: 14px 25px;}
.evCon3 .arrow_wrap.after .line_tit i {background: var(--point);}
.evCon3 .arrow_wrap.after .line_tit span {background: var(--point); color:#fff}
.evCon3 .arrow_wrap.after .arrow_box {border: 2px solid var(--point);} 
.evCon3 .arrow_wrap.after .arrow_txt {background: var(--point);color: #fff;}

.evCon4 {background-color: #edf5ff;}
.evCon4 .line_tit {margin: 50px auto 30px;}
.evCon4 .repeat {position: relative; gap: 15px; justify-content: center;}
.evCon4 .repeat:before {content: ''; display: block; position: absolute; top: 50%; transform: translate(-50%,-50%); left: 50%; background: url('https://image.megagong.net/m/2024/1113_shin242/arrow_long.png') no-repeat center; width: 100%; height: 82px; background-size: contain; z-index: 1;}
.evCon4 .repeat li {width: 280px;border: 2px solid var(--point);border-radius: 15px;overflow: hidden;position: relative;z-index: 2;background: #fff;}
.evCon4 .repeat li p {color: #fff; background: var(--point); line-height: 50px;}
.evCon4 .repeat li div {height: 210px;}

.evCon4 .todo {padding-top: 45px;margin-bottom: 80px;position: relative;gap: 10px;justify-content: center;}
.evCon4 .todo:before {content: ''; display: block; position: absolute; top: 0; background: url('https://image.megagong.net/m/2024/1113_shin242/con4_shadow.png') no-repeat center; width: 100%; height: 112px; background-size: contain; z-index: 1;}
.evCon4 .todo li {display: flex; background: var(--point); color: #fff; padding: 15px; border-radius: 100px; width: 340px; gap: 10px; align-items: center; position: relative; z-index: 2;}
.evCon4 .todo li i {color: #000; background: #fff; font-style: normal; width: 84px; height: 84px; border-radius: 50%; display: flex; align-items: center; justify-content: center; position: relative; padding-top: 15px;}
.evCon4 .todo li i + p{flex: 1;}
.evCon4 .todo li i:before {content: ''; display: block; position: absolute; top: 15px; background: url('https://image.megagong.net/m/2024/1113_shin242/con4_check.png') no-repeat center; width: 13px; height: 11px; background-size: contain; z-index: 1;}

.evCon5 {background-color: #f5f5f5;}
.evCon5 .inner {width: 1310px;}
.evCon5 .btn-base-wrap a {min-width: 200px; padding: 20px 0;}
.evCon5 .book_slider_wrap {align-items: center; justify-content: space-between;}
.evCon5 .book_wrap {margin-top: 10px;}
.evCon5 .book_wrap .tiny {margin: 20px auto 40px;text-align: right;}
.evCon5 .slider_wrap {width: 795px; overflow: hidden; margin: 0 -30px 0 0;}

.evCon5 .swiper_common_wrap {position: relative; /* margin-bottom: 50px; *//* margin: 0 -80px; */}
.evCon5 .swiper_common.swiper-initialized {position: relative; overflow: hidden; max-width: 1080px; margin: 0 auto;}
.evCon5 .swiper-pagination {position: relative; display: flex; justify-content: center; top: auto; bottom: auto; margin-top: 15px; z-index: 2;}
.evCon5 .swiper-pagination-bullet {background: #ccc; opacity: 1; width: 12px; height: 12px; transition: all .5s ease;}
.evCon5 .swiper-pagination-bullet-active {background: var(--point);}
.evCon5 [class*="swiper-button-"]:after {font-size: 0;}
.evCon5 [class*="swiper-button-"].swiper-button-disabled {opacity: 1;}
.evCon5 .arrow {position: absolute; top: 41%; transform: translate(0, calc(-50%)); left: 0; z-index: 2; background: url('https://image.megagong.net/m/2024/1113_shin242/arrow.png') no-repeat center; width: 45px; height: 45px; background-size: contain;}
.evCon5 .arrow.swiper-button-next {transform: rotate(180deg) translate(0, calc(50%)); left: auto; right: 0;}

.evCon6 {background-color:#888;}

/* .event common*/
.event .event_tag {background: #000; color: #fff;}
.event .line_tit {margin-top: 60px;}
.event .gallery_lst ul li.none {color:#000}
.event .type_lst ul li a {font-weight: normal;}
.event .type_lst ul li.on a {font-weight: bold;}

.event .container_info.ver_circle {position: relative; padding: 50px 0 !important; max-width: 700px; margin: 0 auto 60px;}
.event .container_info.ver_circle:before {content: ''; display: block; position: absolute; width: 3000px; left: 50%; height: 100%; background: inherit; transform: translateX(-50%);}
.event .container_info.ver_circle .info .info_title {background: #111; width: 165px;}

.event .container_info_wrap {flex-direction: row;}
.event .container_info_wrap .container_info.ver_circle {max-width: 625px; margin: 0;}
.event .container_info_wrap .gift {z-index: 2; /* */}
[class*=mg_popup_wrap].popupCertified dl.mg_s_info {line-height: 1.4;}
[class*=mg_popup_wrap].popupCertified dl.mg_s_info dt, dl.mg_s_info a {font-weight: bold; color: #000;}
[class*=mg_popup_wrap].popupCertified dl.mg_s_info dd {color: #999; padding-left: 10px; text-indent: -10px;}
[class*=mg_popup_wrap].popupCertified .b_tit {line-height: 1.2;}

.eventStep-base {display:flex; flex-direction: row; flex-wrap: wrap; align-items: stretch; gap: 10px; margin: 0 0 45px; position: relative;}
.eventStep-base .item {position: relative; flex:1; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; background: #fff; border-radius: 15px; height: 370px; padding-top: 40px;}
.eventStep-base .item::before {content: ""; position: absolute; top: 50%; right: -25px; transform: translateY(-50%); width: 36px; height: 36px; background: url(https://image.megagong.net/m/2024/0416_promo/event1_step_arrow.png) center no-repeat; z-index: 1;}
.eventStep-base .item:last-child:before {display: none;}
.eventStep-base .item .step {line-height: 1; font-weight: bold;}
.eventStep-base .item .preimg-pop {color: #ff0000; border: 1px solid; border-radius: 30px; line-height: 38px; max-width: 180px; margin-top: 18px; width: 100%;}
.gallery_lst ul li .txt{font-weight: normal;}

.container_info.ver_circle .info .info_date{padding-top: 5px}
/* event1 */
.event1 {background-color: #5fff94;}
.event1 .container_info {background-color: #4cf083;}

/* event2 */
.event2 {background-color: #a1d2ff; overflow-y: visible !important; overflow-x: clip !important;}
.event2 .container_info {background-color: #8cc4f8;}
.event2.ver2 {background-color: #82fbff;}
.event2.ver2 .container_info.ver_circle {background-color: #bdfdff;}

.preimg-pop-wrap {display: none; position: absolute; top: calc(100% - 70px); left: 50%; z-index: 2; margin-left: 100px; max-width: 450px; width: 100%;}
.preimg-pop-wrap .button-wrap {display: flex; justify-content: flex-end;}
.preimg-pop-wrap .content {background: #fff; padding: 40px; display: flex; flex-direction: column; align-items: flex-start; gap: 15px; border: 1px solid;}

/* evtoggleWarning */
.evtoggleWarning .warningList li ul li a {color:var(--point); padding: 0 0 2px; border-bottom: 1px solid;}
@media screen and (max-width: 1600px){
    .preimg-pop-wrap {margin: 0; right: 0; left: auto;}
    .preimg-pop-wrap .content {padding: 5%; gap: 2vmin;}
    .preimg-pop-wrap .content img {width:100%}
}
@media screen and (max-width: 1200px){
    .eventWrap {font-size: clamp(13px,1.6vmin,16px);}
    .eventWrap .tiny_noti {font-size: clamp(10px,1.3vmin,13px);}
    .evSection:not(.evtoggleWarning,.evCon1) {padding: 15% 0;}

    .con_tit {margin:0 auto 7%;}
    .line_tit.circle span{padding: clamp(3px,1vmin,10px) clamp(10px,6vmin,60px);}

    /* contents */
    .evCon1 {padding: 5% 0 0%;background-size: 200% !important;background-position: center 100% !important} 
    .evCon1 .mini_tit {letter-spacing: .3rem;} 
    .evCon1 h3 {margin: 60% auto 0;} 
    .evCon1 h3 .home {right: 24%;top: 30%;width: 3%;height: 13%;} 

    .evCon3 .arrow_wrap.before .arrow_txt a {right: 1%; padding: 7px 10px;}
    .evCon2 .graph::before {max-width: 5%;}
    .evCon2 .eventVideo{margin-left: 0;margin-right: 0;}


    .evCon4 .todo {padding-top: 3%;margin-bottom: 7%;}
    .evCon4 .todo:before {top: -12px;}

    .evCon5 .inner {width: 97%;}
    .evCon5 .btn-base-wrap {gap: 1vmin;}
    .evCon5 .btn-base-wrap a {font-size: initial}
    .evCon5 .book_slider_wrap {gap: 2vmin;}
    .evCon5 .book_wrap {margin: 0}
    .evCon5 .book_wrap .tiny {font-size: clamp(11px,1.8vmin,13px); margin: 5% auto;}
    .evCon5 .slider_wrap {width: 90%; margin: 0 -2px 0 0; max-width: 600px;}

    .event .container_info.ver_circle{padding: clamp(20px,5vmin,50px) 0 !important; margin-bottom: 10%;}
    .event .container_info.ver_circle .info .info_title {width: clamp(90px,19vmin,165px);height: 30px;}
    .event2 .container_info_wrap .gift {width: min(308px,40%); margin: 0; min-width: 212px;}
    .event2.ver2 .container_info_wrap .gift {width: min(282px,35%);}
 }
@media screen and (max-width: 768px) {
    [class*=mg_popup_wrap].popupCertified .mg_popup_close {width: clamp(25px, 4vmin,36px); height: clamp(25px, 4vmin,36px); top: min(-30px,-5.1vmin); background-size: contain;}

    .evCon2 .graph {flex-direction: column; gap: 10vmin;}
    .evCon2 .graph li {max-width: 450px; margin: 0 auto;}
    .evCon2 .graph::before {transform: rotate(90deg); top: 43%;}
    .evCon2 .graph li span {padding: clamp(15px,3vmin,30px);}
    .evCon2 .graph li p {padding: clamp(5px,3vmin,25px);}

    .evCon3 .line_tit img {margin: 0;left: 0;z-index: 3;max-width: 20%;bottom: -2vmin;}
    .evCon3 .line_tit span {padding: 10px 20px 12px;}
    .evCon3 .arrow_wrap.before {padding-bottom: clamp(50px,10vmin,100px); margin-bottom: 10%;}
    .evCon3 .arrow_wrap.before::before {width: clamp(150px,30vmin,306px); height: clamp(50px,10vmin,100px);}
    .evCon3 .arrow_box {padding: 4%;}
    .evCon3 .arrow_txt {flex-direction: column; gap: 2vmin 0; height: auto; padding: 3% 0;}
    .evCon3 .arrow_txt a {position: relative; right: auto;}

    .evCon4 .repeat {padding: 0 5% 0 0;}
    .evCon4 .repeat li p {line-height: clamp(35px,5vmin,50px);}
    .evCon4 .repeat li div {height: auto; padding: 0 4% 15%;}
    .evCon4 .repeat li div span {overflow: hidden; display: block;}
    .evCon4 .repeat li div span img {max-width: 170%; margin: 0 -35%;}
    .evCon4 .todo:before {display: none;}
    .evCon4 .todo li {flex-direction: column;border-radius: 5px;width: auto;flex: 1;padding: 20px 5px;gap: 10px;}
    .evCon4 .todo li i {width: 100%; height: auto; border-radius: 5px; padding: 20px 6px 6px; max-width: 150px;}
    .evCon4 .todo li i:before {top: 5px;}

    .evCon5 .book_wrap .tiny {margin-bottom: 0;}
    .evCon5 .btn-base-wrap {position: absolute; bottom: 0; left: 50%; transform: translateX(-50%);}
    .evCon5 .book_slider_wrap {flex-direction: column; gap: 30px; padding-bottom: 80px;}
    .evCon5 .slider_wrap {width: 99%; margin: 0;}
    .evCon5 .swiper-slide img + span {display: block; overflow: hidden; border: 1px solid; border-width: 0 1px;}
    .evCon5 .swiper-slide img + span img {margin: 0 -25%; max-width: 150%;}

    .event .container_info_wrap {flex-direction: column;}
    .eventStep-base {flex-direction: column;}
    .eventStep-base .item {height: auto; padding: clamp(20px,4vmin, 40px) 0; max-width: 500px; margin: 0 auto; width: 100%;}
    .eventStep-base .item::before {transform: rotate(90deg) translateX(-50%); top: auto; bottom: -15%; right: auto; left: 45%;}
    .eventStep-base .item .preimg-pop {width: 80%; line-height: clamp(25px,4vmin,38px);}

    .event2 .container_info_wrap .gift {min-width: 190px;}
    .event2.ver2 .container_info_wrap .gift {min-width: 175px;}
    .preimg-pop-wrap { width: 80%; top: calc(100% - 40px);}
 }