@charset "euc-kr";
/* bg url: https://image.megagong.net/m/2024/ */

/* settings */
:root {
    --color-primary: #00b5ff;
}
.evSection {padding: 150px 0;}
.evSection .con_tit {margin-bottom: 80px;}
.evSection .con_tit span {color: var(--color-primary);}

.con_tit .end {top: 20%; right: 2%;}
.con_tit .end::after {background: #f00;} /* À̺¥Æ®Á¾·á ¾ÆÀÌÄÜ »ö»óº¯°æ */
.con_tit .evt_mark{font-size:28px;font-weight:900;box-shadow:none;margin-bottom:30px;min-width:140px;border-radius:35px;padding:6px 20px;}
.con_tit .evt_mark::after{border-left:0;border-right-width:12px;margin-left:0;border-top-width:6px;bottom:-6px;} 

.evSection .eventVideo {max-width: 1000px;}
.evSection .swiper-pagination {display: none; position: static; margin-top: 1%;}
.evSection .swiper-pagination-bullet-active {background: var(--color-primary);}

.flt_inner.renewal li {margin-top: 0;}
.flt_inner ul {box-shadow: 15px 15px 24px rgba(0, 0, 0, 0.26); border-radius: 6px;}

/* evCon1 */
.evCon1 {padding: 0; background: #000 url(https://image.megagong.net/m/2024/1122_nojoony1/con1_bg.jpg) no-repeat;}
.evCon1 h3 {margin: 0 -85px;}
.evCon1 .s_tit {position: absolute; top: 315px; left: -5px;}
.evCon1 .home {position: absolute; bottom: 140px; right: -20px;}

/* evCon2 */
.evCon2 {background: #1e1e1e;}
.evCon2 .con_tit {color: #fff;}
.evCon2 .curr_wrap {gap: 25px; margin-bottom: 80px;}
.evCon2 .curr_wrap li {flex: 1; position: relative; height: 325px; border: 2px solid #fff; transform: skew(-8deg); box-shadow: 14px 14px 40px rgba(0, 0, 0, 0.3); border-radius: 10px;}
.evCon2 .curr_wrap li > div {height: 100%; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 25px; background: #151515; border-radius: inherit;}
.evCon2 .curr_wrap li + li::after {content: ''; position: absolute; top: 50%; left: -12.5px; transform: skew(8deg) translate(-50%, -50%); width: 64px; height: 62px; border-radius: 50%; box-shadow: 5px 5px 7px rgba(0, 0, 0, 0.1); background: url(https://image.megagong.net/m/2024/1122_nojoony1/ico_arr.png) no-repeat; background-size: contain;}
.evCon2 .curr_wrap li .tit {font-weight: 700; color: #fff;}
.evCon2 .curr_wrap li:last-child .tit {line-height: 2.8;}
.evCon2 .curr_wrap li p {color: #ccc;}
.evCon2 .curr_wrap li.on {z-index: 0;}
.evCon2 .curr_wrap li.on > div {background: #fff;}
.evCon2 .curr_wrap li.on::before {content: ''; position: absolute; top: -8px; left: -8px; width: calc(100% + 16px); height: calc(100% + 16px); background: linear-gradient(90deg, #00d8fa, #009bda); border-radius: 18px; z-index: -1;}
.evCon2 .curr_wrap li.on .tit {color: var(--color-primary);}
.evCon2 .curr_wrap li.on p {color: #000;}
.evCon2 .msg {font-weight: 700; color: #fff;}

/* evCon3 */
.evCon3 {background: #f5f5f5;}
.evCon3 .con_tit {margin-bottom: 90px;}
.evCon3 .msg_box {justify-content: flex-start; align-items: center; gap: 7px; border-color: #111; border-width: 1px 0; border-style: solid; margin-bottom: 100px;}
.evCon3 .msg_box .img {align-self: flex-end; margin-top: -70px; margin-left: -33px;}
.evCon3 .point_list {flex-wrap: wrap; gap: 30px; margin: 50px auto 80px;}
.evCon3 .point_list li {width: calc(33.333% - 20px); height: 264px; display: flex; justify-content: center; align-items: center; border: 2px solid #dcdcdc; border-radius: 10px; background: url(https://image.megagong.net/m/2024/1122_nojoony1/con3_point_bg.png) no-repeat; background-position: 100% 100%; background-size: cover;}
.evCon3 .point_list li p {font-weight: 400; color: #505050; margin-bottom: 25px;}
.evCon3 .point_list li b {font-weight: 700; color: #000;}
.evCon3 .eventVideo {margin: 0 auto 100px;}
.evCon3 .point_wrap {align-items: center; gap: 60px; margin-top: 60px;}
.evCon3 .point_wrap .img {flex-shrink: 0; margin-left: -106px; margin-top: 25px;}
.evCon3 .point_wrap .point_roll {flex-grow: 1; position: relative;}
.evCon3 .point_wrap .point_roll .swiper-wrapper {gap: 14px; flex-direction: column;}
.evCon3 .point_wrap .point_roll .swiper-slide {display: flex; align-items: center; gap: 30px; height: 162px; background: #fff; border-radius: 10px; padding: 0 45px; box-shadow: 5px 5px 18px rgba(0, 0, 0, 0.1);}
.evCon3 .point_wrap .point_roll .swiper-slide .txt {font-weight: 400; text-align: left;}
.evCon3 .point_wrap .point_roll .swiper-slide .txt .part {font-weight: 700; color: var(--color-primary); margin-bottom: 5px;}

/* evCon4 */
.evCon4 {padding: 150px 0 50px; background: #fff;}
.evCon4 .tab_base {margin-bottom: 80px;}
.evCon4 .tab_base li a {background: #f2f2f2; border-color: #f2f2f2; color: rgba(0, 0, 0, 0.4); padding: 24px 5px 20px;}
.evCon4 .tab_base li a span {display: block; line-height: 1.2;}
.evCon4 .tab_base li a b {display: block; font-weight: 700; margin-top: 3px;}
.evCon4 .eventVideo {margin: 0 auto 60px;}
.evCon4 .feature_roll {position: relative; overflow: hidden;}
.evCon4 .feature_roll .swiper-wrapper {gap: 29px;}
.evCon4 .feature_roll .swiper-slide {flex: 1 1 auto; height: 204px; border: 2px solid #dcdcdc; border-radius: 10px; padding: 20px 0;}
.evCon4 .feature_roll .swiper-slide::before {content: ''; display: block; width: 34px; height: 34px; margin: 0 auto 10px; background: url(https://image.megagong.net/m/2024/1122_nojoony1/ico_chk.png) no-repeat; background-size: contain;}
.evCon4 .feature_roll .swiper-slide .tiny {font-weight: 400; color: #505050; margin-top: 10px;}

/* evCon5 */
.evCon5 {padding: 50px 0 150px; background: #fff;}
.evCon5 .con_tit {margin-bottom: 60px;}

/* evCon6 */
.evCon6 {background: #00bdff;}
.evCon6 .con_tit {margin-bottom: 20px;}
.evCon6 .con_tit .mini_tit {font-weight: 700; color: #fff; margin-bottom: 10px;}
.evCon6 .con_tit + .mini_tit {color: #fff; opacity: 0.8; margin-bottom: 60px;}
.evCon6 .container_info_wrap {border-style: solid; border-color: #fff; border-width: 2px 0; padding: 52px 30px 58px 58px; margin-bottom: 60px;}
.evCon6 .container_info.ver_column {gap: 20px;}
.evCon6 .container_info_wrap .info .info_date {font-size: 18px;}
.evCon6 .container_info_wrap .info .info_date dt {font-weight: 400; font-size: 16px;}
.evCon6 .container_info_wrap .info .info_date dd + dt {margin-top: 10px;}
.evCon6 .evt_btn {display: inline-block; font-weight: 700; color: #fff; background: #000; width: 100%; max-width: 426px; border-radius: 42px;}
.evCon6 .evt_btn a {display: block; padding: 25px 0;}

/* evtoggleWarning */
.evtoggleWarning {padding: 0 !important;}
.warningList li ul li a {font-weight: 400; font-size: 10px; color: #f05a63; border: 1px solid; border-radius: 8px; padding: 2px 8px;}

@media screen and (max-width: 1200px){
    /* settings */
    .evSection {padding: 14% 0;}
    .evSection .con_tit {margin-bottom: 8%;}

    .con_tit .evt_mark {font-size: clamp(17px,3.3vmin,28px);margin-bottom:4%;}

    /* evCon1 */
    .evCon1 {padding: 0;}
    .evCon1 h3 {margin: 0 -2vmin 0 -30vmin;}
    .evCon1 .s_tit {top: 30vmin; left: auto; right: 0; max-width: 58%;}
    .evCon1 .home {bottom: 10vmin; right: 0; max-width: 40%;}

    /* evCon3 */
    .evCon3 .msg_box p {margin: auto;}
    .evCon3 .point_wrap {gap: 2vmin;}
    .evCon3 .point_wrap .img {margin-left: -8%; margin-top: 2vmin; width: 44%;}
    .evCon3 .point_wrap .point_roll .swiper-slide {padding: 0 30px;}

    /* evCon4 */
    .evCon4 {padding: 14% 0 7%;}
    .evCon4 .feature_roll .swiper-wrapper {gap: 1vmin;}
    
    /* evCon5 */
    .evCon5 {padding: 7% 0 14%;}

    /* evCon6 */
    .evCon6 .con_tit {margin-bottom: 2%;}
    .evCon6 .con_tit .mini_tit {margin-bottom: 1%;}
    .evCon6 .con_tit + .mini_tit {margin-bottom: 6%;}
    .evCon6 .container_info_wrap {padding: 5vmin 2%; margin-bottom: 6%; gap: 2vmin;}
    .evCon6 .container_info_wrap .gift {width: 42%;}
}
@media screen and (max-width: 992px){
    .evSection .con_tit {letter-spacing: -0.05em;}
    .evSection .swiper-pagination {display: block;}

    .evCon2 .curr_wrap {flex-direction: column; margin: 0 3% 8%;}
    .evCon2 .curr_wrap li {height: auto;}
    .evCon2 .curr_wrap li > div {gap: 1vmin; padding: 2vmin 0 3vmin;}
    .evCon2 .curr_wrap li + li::after {top: -12.5px; left: 50%; width: 32px; height: 31px; transform: skew(8deg) translate(-50%, -50%) rotate(90deg);}
    
    .evCon3 .msg_box {margin-bottom: 10%;}
    .evCon3 .msg_box .img {margin-top: -2vmin; margin-left: -10%; width: 38%;}
    .evCon3 .msg_box p {width: 73%; padding-right: 2%; margin: 2vmin auto;}
    .evCon3 .point_list {gap: 2vmin; margin: 5% auto 8%;}
    .evCon3 .point_list li {width: calc(50% - 1vmin); height: clamp(150px, 25vmin, 210px);}
    .evCon3 .point_list li p {margin-bottom: 2%;}
    .evCon3 .eventVideo {margin: 0 auto 10%;}
    .evCon3 .point_wrap {flex-direction: column; gap: 2vmin; margin-top: 4%;}
    .evCon3 .point_wrap .point_roll {width: 100%; box-shadow: 5px 5px 18px rgba(0, 0, 0, 0.1); border-radius: 10px; overflow: hidden;}
    .evCon3 .point_wrap .point_roll .swiper-wrapper {flex-direction: initial; gap: 0;}
    .evCon3 .point_wrap .point_roll .swiper-slide {flex: 1 0 auto; box-shadow: none; justify-content: center;}

    .evCon4 .tab_base {margin-bottom: 8%;}
    .evCon4 .feature_roll .swiper-wrapper {gap: 0;}
    .evCon4 .feature_roll .swiper-slide {flex: 1 0 100%; height: clamp(160px, 30vmin, 200px);}
}
@media screen and (max-width: 768px){
    .evCon6 .container_info_wrap {gap: 5vmin;}
    .evCon6 .container_info_wrap .gift {width: 80%;}
    .evCon6 .container_info.ver_column {flex-direction: column;}
    .evCon6 .container_info_wrap .info .info_date {font-size:clamp(14px,2.3vmin,18px);}
    .evCon6 .container_info_wrap .info .info_date dt {font-size:clamp(13px,2.1vmin,16px);}
}
@media screen and (max-width: 576px){
    .evCon3 .point_wrap .point_roll .swiper-slide {flex-direction: column; gap: 4vmin;}
    .evCon3 .point_wrap .point_roll .swiper-slide .ico {width: 48px;}
    .evCon3 .point_wrap .point_roll .swiper-slide .txt {text-align: center;}

    .evCon4 .tab_base li a {padding: 3vmin 3px;}
    .evCon4 .tab_base li:first-child a b {line-height: 2.8;}
    .evCon4 .feature_roll .swiper-slide::before {width: 17px; height: 17px;}

    .evCon6 .evt_btn a {padding: 5vmin 0;}
}
@media screen and (max-width: 460px){
    .evSection .con_tit {font-size: 21px;}

    .evCon3 .msg_box {flex-direction: column-reverse;}
    .evCon3 .msg_box .img {align-self: center; margin-top: -5vmin;}
    .evCon3 .msg_box p {width: 90%;}
}