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

/* settings */
:root {
    --color-primary: #0583FF;
}
.eventWrap {font-family: "Pretendard", sans-serif; letter-spacing: normal; font-weight: 400; line-height: normal; color: var(--brand-color-gray-900);}
.evSection {padding: 120px 0;}
.evSection .mini_tit + .con_tit {margin-top: 12px;}
.evSection .con_box {margin-top: 40px;}
.evSection .evt_mark {display: inline-block; border-radius: 30px; background: linear-gradient(90deg, #79CFE4 0%, #4A5DC9 100%); padding: 8px 20px; margin-bottom: 20px;}
.evSection .evt_info {display: flex; flex-direction: column; align-items: flex-start; gap: 8px; width: fit-content; margin: 0 auto;}
.evSection .evt_info dl {display: flex; justify-content: flex-start; align-items: center; gap: 5px;}
.evSection .evt_info dl::before {content: ''; display: block; width: 20px; height: 20px; flex-shrink: 0; background-color: #CCC; mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 20 20' fill='none'%3E%3Crect x='9.33325' y='3.33301' width='1.33333' height='13.3333' rx='0.666667' fill='black'/%3E%3C/svg%3E") center / contain no-repeat; order: 1;}
.evSection .evt_info dt {flex-shrink: 0; color: #CCC; font-weight : 700;}
.evSection .evt_info dd {color: #CCC; order: 1; text-align: left;}
.evSection .evt_info .notice {opacity: 0.5;}
.tx_primary {color: var(--color-primary);}
.tx_gradient {display: inline-block; background: linear-gradient(90deg, #79CFE4 0%, #4A5DC9 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;}

/* evTop */
.evTop {padding: 40px 0 0; background: #111 url(https://image.megagong.net/m/2026/0914_app/top_bg.jpg) 50% 50% / 1920px auto no-repeat;}
.evTop h3 {position: relative; max-width: 738px; margin: 0 auto -22px;}
.evTop .sticker {position: absolute; bottom: -7px; left: 50%; transform: translate(-50%, 100%); width: 15.4%;}
.evTop .tea_wrap {position: relative; z-index: 0;}
.evTop .tea_wrap .tea {margin: 0 auto; width: 76.5%; max-width: 822px;}
.evTop .tea_wrap .mock {position: absolute; z-index: -1;}
.evTop .tea_wrap .mock1 {width: 50%; max-width: 538px; bottom: 143px; left: -114px;}
.evTop .tea_wrap .mock2 {width: 53%; max-width: 575px; bottom: 53px; right: -90px;}
.evTop .tea_wrap .text-caption {position: absolute; left: 0; bottom: 50px; width: 100%; color: #FFF; opacity: 0.4; z-index: 1;}

/* evCon1 */
.evCon1 {padding: 100px 0; background: #FFF url(https://image.megagong.net/m/2026/0914_app/con1_bg.png) 50% 0% / 1195px auto no-repeat; background-position: 50% 0 !important;}
.evCon1 .mini_tit {display: flex; justify-content: center; align-items: center; gap: 20px; letter-spacing: 0.2em;}
.evCon1 .con_tit .bg_gradient {display: inline-block; color: #FFF; border-radius: 4px; background: linear-gradient(90deg, #35C1C1 0%, #2E99E1 100%); padding: 4px 19px 7px; margin-bottom: 12px;}
.evCon1 .video_wrap {display: flex; gap: 60px; justify-content: center;}
.evCon1 .video_wrap .item {flex: 1; max-width: 360px; }
.evCon1 .video_wrap .eventVideo {aspect-ratio: 9/16; border-radius: 5px;}
.evCon1 .video_wrap .item .ds-button {width: 100%; font-weight: 500; margin-top: 17px; justify-content: space-between; text-align: left; padding: 14px 32px;}
.evCon1 .video_wrap .item:nth-child(1) .ds-button {background: linear-gradient(0deg, #2CB1D2 0%, #2CB1D2 100%), linear-gradient(90deg, #49C7E6 0%, #489AA9 100%);}
.evCon1 .video_wrap .item:nth-child(2) .ds-button {background: #4A5DC9;}

/* evCon2 */
.evCon2 {background: #111;}
.evCon2 .con_tit .evt_end {position: absolute; width: 22vw; max-width: 219px; height: 22vw; max-height: 219px; top: -55px; right: -20px; background: url(https://image.megagong.net/m/2026/0904_plower3362/evt_end.svg) no-repeat; background-size: contain;}
.evCon2 .con_box {margin-top: 20px;}
.evCon2 .gift_wrap {display: flex; justify-content: center; gap: 20px; margin: 20px auto 50px;}
.evCon2 .gift_wrap .item {flex: 1; max-width: 330px; border-radius: 12px; border: 1px solid #333; background: rgba(255, 255, 255, 0.02); padding: 16px 30px 20px;}
.evCon2 .gift_wrap .ds-badge {background: #0583FF;}
.evCon2 .gift_wrap .img {max-width: 176px; margin: 12px auto;}
.evCon2 .gift_wrap .item:nth-child(2) .img {max-width: 216px;}
.evCon2 .comment_tit {margin-bottom: 20px;}
.evCon2 .pr-comment {border-radius: 10px;}

/* evtoggleWarning */
.evtoggleWarning {padding: 0 !important;}

@media screen and (max-width: 1200px){
    /* settings */
    .evSection {padding: clamp(50px, 10vw, 120px) 0; background-size: auto 100%;}
    .evSection .mini_tit + .con_tit {margin-top: 10px;}
    .evSection .con_box {margin-top: clamp(28px, 3.333vw, 40px);}

    .evTop {padding: 50px 0;}
    .evTop .tea_wrap .mock1 {bottom: 11.9vw; left: -9.5vw;}
    .evTop .tea_wrap .mock2 {bottom: 4.4vw; right: -7.5vw;}
    .evTop .tea_wrap .text-caption {bottom: -1.8vw;}
}
@media screen and (max-width: 768px){
    .evSection .evt_info dl {align-items: flex-start; gap: 0;}

    .evTop h3 {margin: 0 auto max(87px, 22.308vw);}
    .evTop .tea_wrap .tea {width: 100%;}
    .evTop .tea_wrap .mock1 {width: 58%; bottom: 12.37vw; left: -2vw;}
    .evTop .tea_wrap .mock2 {width: 57%; bottom: 13.411vw; right: -2vw;}

    .evCon1 .con_tit .bg_gradient {margin-bottom: 8px; padding: 6px 17px;}
    .evCon1 .video_wrap {gap: 10px;}
    .evCon1 .video_wrap .item .ds-button {gap: 0; padding: 8px 4vw;}
    .evCon1 .video_wrap .item .ds-button .icon {font-size: 20px;}

    .evCon2 {padding-bottom: 0;}
    .evCon2 .gift_wrap {gap: 10px; margin-bottom: 50px;}
    .evCon2 .gift_wrap .item {padding: 16px 0 20px;}
    .evCon2 .pr-comment {border-radius: 0; margin: 0 -2%;}
}
@media screen and (max-width: 576px){
    .evCon1 .video_wrap .item .ds-button {font-size: var(--font-size-body4); line-height: var(--line-height-body4); margin-top: 9px;}
}