@charset "euc-kr"; 

/* settings */
.eventWrap .evSection { background-size: auto 100%; } 
.eventWrap .evSection .lecture { max-width:1000px; margin:0 auto; color: #000; } 
.eventWrap .evSection.fff, .eventWrap .evSection .fff, .fff { color: #fff !important; } 
.eventWrap .evSection .f00 { color: #f00 !important; } 
.eventWrap .tiny_noti { opacity: 0.6; } 
.evSection:not(.evtoggleWarning,.evCon1) { padding: 160px 0; } 

.flt_inner.renewal li { margin-top: 2px; } 
.flt_inner.renewal li img{ box-shadow: 3px 5px 10px #00000026;}
.evSection:not(.event1) .con_tit { margin-bottom: 70px; } 

/* fix_menu */
.fix_menu { background: #222; z-index: 3; position: relative; width: 100%; bottom: 0; } 
.fix_menu.fixed { position: fixed; } 
.fix_menu a { height: 100px; display: flex; justify-content: center; align-items: center; } 
.fix_menu .circle_red { background: red; border-radius: 30px; padding: 7px 0; width: 150px; } 
.fix_menu .circle_btn { border-radius: 30px; border: 1px solid; padding: 11px 0; width: 200px; } 
.fix_menu strong { flex: 1; } 
.fix_menu strong span { color: #c1b2ff; } 

.fix_menu .ver1224{width: 1170px;}
.fix_menu .ver1224 .circle_btn{width: 235px;}
.fix_menu .ver1224 .circle_red{width: 255px;}



/* button box */
.btn_box { display:flex; justify-content: center; gap: clamp(10px, 2vmin, 20px); margin: 0 auto; } 
.btn_box a { display: block; } 

/* swiper */
.swiper_common_wrap { position: relative; } 
.swiper_common_wrap .swiper_common.swiper-initialized { position: relative; overflow: hidden; margin: 0 auto; } 
.swiper_common_wrap .swiper-wrapper { justify-content: space-between; } 
.swiper_common_wrap .swiper-slide { position: relative; width: 32%; } 
.swiper_common_wrap .swiper-slide a { position: absolute; bottom: 0; width: 100%; height: 16%; z-index: 2; left: 50%; transform: translateX(-50%); font-size: 0; /* background: #ff00007d; */} 
.evCon4 .swiper_common_wrap .swiper-slide a { height: 12%; } 

/* swiper - pagination */
.swiper_common_wrap .swiper-pagination { position: relative; display: flex; justify-content: center; top: auto; bottom: auto; margin-top: 15px; z-index: 2; } 
.swiper_common_wrap .swiper-pagination-bullet { background: #ccc; opacity: 1; width: 12px; height: 12px; transition: all .5s ease; } 
.swiper_common_wrap .swiper-pagination-bullet-active { background: #a7ebff; width: 20px; border-radius: 30px; } 

/* contents */
.evCon1 { background: #161730 url(https://image.megagong.net/m/2024/1128_geek2991/con1_bg.jpg) no-repeat center; } 
.evCon1 h3 { position: relative; } 
.evCon1 h3::before { content: ''; display: block; position: absolute; background: url(https://image.megagong.net/m/2024/1128_geek2991/con1_line.png) repeat-x center; top: 0; left: -3000px; width: 3000px; height: 100%; } 
.evCon1 .inner { width: 1300px; } 
.evCon1 .tiny_text { position: absolute; bottom: 35px; right: 110px; opacity: .7; color: #c1b2ff; z-index: 2; font-weight: normal; } 
.evCon1 .home { position: absolute; left: 50%; top: 350px; margin-left: -535px; z-index: 2; } 

.evCon2 { background-color: #e9e8ff; } 
.evCon2 .bubble b { color: #d2d4ff; } 
.evCon2 .bubble { position: absolute; background: #292929; color: #fff; border-radius: 70px; width: 425px; padding: 25px 0; } 
.evCon2 .bubble::before { content: ''; display: block; position: absolute; background: url(https://image.megagong.net/m/2024/1128_geek2991/con2_bubble_l.png) no-repeat center; width: 100%; height: 13px; bottom: -13px; } 
.evCon2 .bubble:nth-child(1) { top: 180px; } 
.evCon2 .bubble:nth-child(2) { top: 110px; right: 0; } 
.evCon2 .bubble:nth-child(2)::before { background: url(https://image.megagong.net/m/2024/1128_geek2991/con2_bubble_r.png) no-repeat center; } 
.evCon2 .con_text { display: flex; flex-direction: column; margin: 100px auto 60px; } 
.evCon2 .bg_text { margin: 20px auto 30px; color: #fff; } 
.evCon2 .bg_text strong { background: #494783; display: block; width: fit-content; margin: 5px auto; padding: 0 10px; } 
.evCon2 .bg_text span { color: #a7ebff; } 
.evCon2 .mini_btext { font-weight: normal; } 
.evCon2 .process_box { display: flex; gap: 19px; margin: 0 -90px; justify-content: center; position: relative; } 
.evCon2 .process_box::before { content: ''; display: block; position: absolute; background: url(https://image.megagong.net/m/2024/1128_geek2991/con2_arrow.png) no-repeat; top: 50%; right: 0; width: 100%; height: 100%; transform: translateY(-50%); background-position: 100% center; background-size: contain; } 
.evCon2 .process_box li { position: relative; } 
.evCon2 .process_box li a {position: absolute;bottom: 0;width: 100%;font-size: 0;/* background: #ff00007d; */height: 24%;z-index: 2;left: 0;} 

.evCon3 { background-color: #ffffff; } 
.evCon3 .eventVideo.with_shadow{z-index: 1;}
.evCon3 .con_tit strong span { color:#503d8f } 

.evCon4 { background-color: #494783; } 
.evCon4 .mini_tit.round { background-color: #a9ecff; display: block; width: 180px; color: #000; border-radius: 30px; margin: 0 auto 35px; padding: 13px 0; } 
.evCon4 .mini_tit { color:#fff } 
.evCon4 .con_tit strong { display:block; color: #fff; margin-top: 25px; } 
.evCon4 .con_tit strong span { color:#a9ecff; } 

.evCon5 { background: #323157  url(https://image.megagong.net/m/2024/1128_geek2991/con5_bg.jpg) no-repeat center;; } 
.evCon5 .mini_tit { margin-bottom: 25px; display: block; } 

.event1 { background-color: #a0d1ff; } 
.event1 .con_tit .mini_tit { color:#547ba0 } 
.event1 .con_tit .mini_tit b { color:#000 } 
.event1 .gift_result_base { right: 60px; top: -15px; } 

.event1.ver1224 {background-color: #ffd9e3;}
.event1.ver1224 .con_tit .mini_tit{margin: 0 0 20px; font-weight: 700; color: #c98d9d;}
.event1.ver1224 .con_tit .mini_tit strong{color: #000;}
.event1.ver1224 .con_tit .mini_tit span{border-bottom: 1px solid #ffd9e3; text-decoration : underline; text-underline-offset : 5px;}
.event1 .click_base_wrap .click_wrap{margin: 70px auto 30px;}
.event1 .result_wrap .tiny_noti{text-align: left; margin: 10px 0 0;}

.mg_popup_wrap {text-align: center;}
.mg_popup_wrap .g1{color: #333;}
.mg_popup_wrap .desc{margin: 15px 0 20px; line-height: 1.6; font-weight: 400;}
.mg_popup_wrap .bg_gray{padding: 25px 10px; position: relative; z-index: 1; width: 100%;line-height: 1.6; text-align: left; font-weight: 400;}
.mg_popup_wrap .bg_gray::before{position: absolute; content: ''; left: 50%; transform: translateX(-50%); width: calc(100% + 40px); top: 0; background: #f8f8f8; height: 100%; z-index: -1;}
.mg_popup_wrap .container_info_wrap{margin: 0 0 40px;}

.warningList li{font-weight: 400;}

.event1 .click_base_wrap .result_wrap .info{text-align: center;}


@media screen and (max-width: 1200px) { 
    .fix_menu .ver1224{width: 96%;}
    .evSection:not(.event1) .con_tit { margin-bottom: 8%; } 

    .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; } 

    .evCon1 .inner { width: 100%; } 
    .evCon1 .tiny_text { bottom: 1%; right: 3%; } 
    .evCon1 .home { margin-left: 0; max-width: 20%; min-width: 135px; top: 37%; left: 3vw; } 
    .evCon1 h3 img { max-width: 114%; margin: 0 -7%; } 
    .evCon2 .bubble_box li:not(.bubble) img { margin: 0 auto; } 
    .evCon2 .bubble { position: relative; } 
    .evCon2 .bubble:nth-child(1) { top: auto; } 
    .evCon2 .bubble:nth-child(2) { top: auto; right: auto; float: right; margin: 10px 0; } 
    .evCon2 .bubble:nth-child(2)::before { clear: both; content: ''; display: block; } 
    .evCon2 .con_text { margin: 10% auto; } 
    .evCon2 .process_box { margin: 0 5% 0 0; gap: 1vmin; } 
    .evCon2 .process_box::before { right: -7%; } 
    .evCon4 .mini_tit.round {margin-bottom: 3%; padding: clamp(5px,1vmin,13px); width: clamp(120px,20vmin,180px); } 
    .evCon4 .con_tit strong { margin-top: 3%; } 
    .evCon5 .mini_tit { margin-bottom: 3%; } 
    
    .event1 .click_base_wrap .click_wrap{margin: 7% auto 3%;}
    .event1 .click_base_wrap .result_list li{flex: 1;}
    
}
@media screen and (max-width: 768px) { 
    .swiper_common_wrap .swiper_common.swiper-initialized { position: relative; overflow: hidden; } 
    .swiper_common_wrap .swiper-wrapper { justify-content: flex-start; } 
    .swiper_common_wrap .swiper-slide { flex: 1 0 100%; width: auto; } 
    .swiper_common_wrap .swiper-slide img { width: 70%; max-width: 320px; } 
    .swiper_common_wrap .swiper-slide a,
    .evCon4 .swiper_common_wrap .swiper-slide a { width: 70%; max-width: 320px; } 

    .evCon1 { padding-top: 5%; background-image: url(https://image.megagong.net/m/2024/1128_geek2991/con1_bg_mo.jpg); background-position: 50% 100% !important;; background-size: 320% !important; } 
    .evCon1 .top_text { margin: 0 0 5% 5%; text-align: left; } 
    .evCon1 .top_text span { color: #c1b2ff; } 
    .evCon1 .tiny_text { font-size: 10px; } 
    .evCon1 .home { top: auto; left: auto; position: relative; display: block; } 
    .evCon1 h3 img { max-width: 100%; margin: 0 0 0 2%; } 

    .evCon2 .bubble { width: 50%; padding: clamp(15px, 3vmin, 25px) 0; min-width: 280px; } 
    .evCon2 .bubble:nth-child(2) { margin: 30px 0; } 
    .evCon2 .bg_text strong { font-size: clamp(17px,5.1vmin,46px); } 
    .evCon2 .process_box { flex-wrap: wrap; margin: 0; gap: 2vmin; } 
    .evCon2 .process_box::before { display: none; } 
    .evCon2 .process_box .mo-arrow::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: 2; } 
    .evCon2 .process_box .mo-arrow:nth-of-type(2)::before { right: auto; top: auto; transform: rotate(90deg) translateX(-50%); bottom: -40px; left: 40%; } 
    .evCon2 .process_box .mo-arrow:nth-of-type(3)::before { transform: rotate(180deg); top: 40%; } 
    .evCon2 .process_box li { width: calc(50% - 1vmin); max-width: 257px; } 

    .fix_menu a { flex-direction: column; height: auto; padding: 3% 0; gap: 1vmin 0; } 
    .fix_menu .circle_red { padding: clamp(1px,.7vmin,7px) 0; } 

    .evCon5 .book_wrap{margin: 10% auto 0;margin-left: 5%;}
    .event1 .gift_item_wrap{width: 100%;}
    .event1 .gift_result_base{right: 0px;} 
}
@media screen and (max-width: 576px){
    .fix_menu.fixed { bottom: 55px; } 
}