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

/* settings */
:root {
    --color-primary: #F93;
}
.eventWrap {font-family: "Pretendard", sans-serif; letter-spacing: normal; font-weight: 400; line-height: normal; color: var(--brand-color-gray-900);}
.evSection {padding: 150px 0;}
.evSection .con_tit + .mini_tit {margin-top: 15px;}
.evSection .mini_tit + .con_tit {margin-top: 12px;}
.evSection .con_box {margin-top: 80px;}
.evSection .evt_mark {display: inline-block; border-radius: 30px; background: linear-gradient(90deg, #FFCA9B 0%, #D8954A 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;}
.evSection .lec_wrap {padding: 40px; border-radius: 10px; background: #FFF; box-shadow: 0 0 20px 0 rgba(55, 90, 112, 0.10);}
.evSection .lec_wrap .vodchr_banner {margin: 0;}
.tx_primary {color: var(--color-primary);}
.tx_gradient {display: inline-block; background: linear-gradient(90deg, #FFD2A2 0%, #FFF 100%); background-clip: text; -webkit-background-clip: text; -webkit-text-fill-color: transparent;}

.con_tit .end::after {background: #111;} /* À̺¥Æ®Á¾·á ¾ÆÀÌÄÜ »ö»óº¯°æ */

/* evTop */
.evTop {padding: 40px 0 54px; background: url(https://image.megagong.net/m/2026/0910_tmddk4521/top_bg.jpg) 50% 50% / 1920px auto no-repeat, linear-gradient(180deg, #220B0D 0%, #12152C 100%) 50% 50% / cover no-repeat;}
.evTop .top_slogan {display: block; width: 50%; max-width: 261.5px; margin: 0 auto 17px;}
.evTop .top_txt {display: block; width: 73%; max-width: 424px; margin: 0 auto 148px;}
.evTop .title_wrap {position: relative; max-width: 1023px; margin-left: 40px;}
.evTop .title_wrap .teacher_home {position: absolute; top: 63px; right: 0; max-width: fit-content; font-size: 13px; line-height: 1; font-weight: 500; color: #FFF; border-radius: 5px; border: 1px solid rgba(255, 255, 255, 0.20); background: rgba(255, 255, 255, 0.10); padding: 5px 10px; display: flex; justify-content: center; align-items: center; gap: 5px;}
.evTop .title_wrap .teacher_home i {background-color: #FFF; margin: 0;}
.evTop .title_wrap .text-caption {color: #FFF; text-align: left; opacity: 0.3; margin-top: 8px;}
.evTop .top_bnr {display: flex; align-items: center; gap: 17px; text-align: left; padding: 13px 40px 14px; border-radius: 10px; border: 1px solid #5C422B; background: radial-gradient(123.78% 50.46% at 21.76% 0%, #422A0E 0%, #000 100%); margin-top: 56px;}
.evTop .top_bnr .txt {display: flex; flex-direction: column; gap: 4px; line-height: 1.3; letter-spacing: -0.02em;}
.evTop .top_bnr .txt .sm_txt {font-size: 15px; font-weight: 500;}
.evTop .top_bnr .txt .lg_txt {font-size: 18px; font-weight: 700;}
.evTop .top_bnr .txt .tx_gradient {background-image: linear-gradient(90deg, #FFCA9B 0%, #D8954A 100%);}
.evTop .top_bnr .img {max-width: 96.5px;}
.evTop .top_bnr .ds-button {flex-shrink: 0; margin-left: auto; color: #1A1A1A; background: linear-gradient(90deg, #FFCA9B 0%, #D8954A 100%);}

/* evCon1 */
.evCon1 {background: #080808;}
.evCon1 .mini_tit {margin: 80px auto 0;}
.evCon1 .mini_tit1 {max-width: 495px; width: 80%;}
.evCon1 .graph_wrap {position: relative; max-width: 780px; margin: 0 auto;}
.evCon1 .graph_wrap .txt {position: absolute; top: 72px; left: 90px; text-align: left;}
.evCon1 .graph_wrap .txt .ds-badge {background: linear-gradient(90deg, #FFCA9B 0%, #D8954A 100%); color: #1A1A1A; font-weight: 700; margin-bottom: 7px;}
.evCon1 .graph_wrap .txt sup {font-size: 0.5em; font-weight: 300;}
.evCon1 .graph_wrap .graph {max-width: 546px; margin-left: auto;}
.evCon1 .mini_tit2 {max-width: 429px; width: 66%;}
.evCon1 .teacher_wrap {position: relative; margin: 30px auto 0; min-height: 650px;}
.evCon1 .teacher_wrap .con {position: absolute; bottom: 11px; left: 0; width: 100%;}
.evCon1 .teacher_wrap .con .tit sup {font-size: 0.5em; font-weight: 300;}
.evCon1 .teacher_wrap .con .tit .slogan {display: inline-block; margin: 0 auto 10px;}
.evCon1 .teacher_wrap .con .tit1 .slogan {max-width: 157px;}
.evCon1 .teacher_wrap .con .tit2 {margin-top: 27px;}
.evCon1 .teacher_wrap .con .tit2 .slogan {max-width: 150px;}
.evCon1 .teacher_wrap .con .book {max-width: 670px; margin: 0 auto;}
.evCon1 .review_wrap {margin: 80px auto 0;}
.evCon1 .review_wrap .swiper-wrapper {align-items: stretch; height: inherit; margin: 0 auto;}
.evCon1 .review_wrap .swiper-slide {width: 360px;}

/* evCon2 */
.evCon2 {padding: 120px 0; background: #FFF;}
.evCon2 .mini_tit {max-width: 542px; margin: 0 auto 16px;}
.evCon2 .con_box {margin-top: 60px;}
.evCon2 .point_wrap {margin-top: 60px;}
.evCon2 .point_wrap .num {background: #F93; padding: 5px 20px; font-weight: 700; margin-bottom: 12px;}
.evCon2 .point_wrap .mini_tit {max-width: none; margin-bottom: 20px;}
.evCon2 .point_box {border-radius: 10px; border: 1px solid #FFE9CC; background: #FFFBF5; padding: 50px 40px;}
.evCon2 .point1 .main_tit {margin-bottom: 8px;}
.evCon2 .point1 .graph {max-width: 947px; padding-right: 33px; margin: 0 auto 30px;}
.evCon2 .point2 .point_con {display: flex; border-radius: 10px; overflow: hidden;}
.evCon2 .point2 .img {width: 60%; max-width: 640px; aspect-ratio: 16 / 9;}
.evCon2 .point2 .img video {border: 0 none; vertical-align: middle; max-width: 100%;}
.evCon2 .point2 .point_box {width: 40%; max-width: 440px; position: relative; display: flex; flex-direction: column; justify-content: center; align-items: center; padding: 0;}
.evCon2 .point2 .point_box::before,
.evCon2 .point2 .point_box::after {content: ''; display: block; width: 27px; height: 19px; background: url(https://image.megagong.net/m/2026/0910_tmddk4521/con2_quotes.svg) top center / contain no-repeat; margin: 0 auto; padding-bottom: 30px;}
.evCon2 .point2 .point_box::after {transform: rotateZ(180deg);}
.evCon2 .point2 .txt {max-width: 321px; margin: 0 20px;}
.evCon2 .point2 .point_box .ref {color: #555; margin-top: 16px;}
.evCon2 .video_wrap {position: relative;}
.evCon2 .video_swiper {position: relative; overflow: hidden;}
.evCon2 .video_swiper .swiper-slide a {display: block;}
.evCon2 .video_swiper .swiper-slide .video_img {max-width: 346px; margin: 0 auto;}
.evCon2 .video_swiper .swiper-slide .tit {color: #111; font-weight: 400; font-size: 16px; margin-top: 15px;}
.evCon2 .video_wrap .button-prev,
.evCon2 .video_wrap .button-next {position: absolute; top: 40%; left: -66px;}
.evCon2 .video_wrap .button-next {left: auto; right: -66px;}

/* evCon3 */
.evCon3 {background: #FFFBF5;}
.evCon3 .con_box .mini_tit {margin-bottom: 40px;}
.evCon3 .method_box {border-radius: 10px; border: 1px solid #FFE9CC; background: #FFF2E0; padding: 30px 40px 40px; margin-bottom: 80px;}
.evCon3 .method_box .ds-badge {max-width: 164px; background: #F93; padding: 7px 19.5px 5px; margin-bottom: 5px;}
.evCon3 .method {display: flex; flex-wrap: wrap; gap: 10px; margin: 20px auto; text-align: left;}
.evCon3 .method li {width: calc(50% - 5px); padding: 20px 30px; border-radius: 3px; border: 1px solid #FFE9CC; background: #FFFDFA;}
.evCon3 .method .tit {display: flex; align-items: center; gap: 8px; margin-bottom: 10px;}
.evCon3 .method .txt {color: var(--brand-color-gray-600);}
.evCon3 .eventVideo {max-width: 860px; aspect-ratio: 215/121; border-radius: 10px; background: none; margin: 0 auto 40px;}
.evCon3 .lec_tit {margin: 40px auto 20px;}

/* evCon4 */
.evCon4 {background: #1A1A1A;}
.evCon4 .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;}
.evCon4 .con_box {margin-top: 30px;}
.evCon4 .gift_wrap {display: flex; justify-content: center; gap: 20px; margin: 70px auto 86px;}
.evCon4 .gift_wrap .item {flex: 1; max-width: 330px; position: relative; border-radius: 12px; border: 1px solid #333; background: rgba(255, 255, 255, 0.02); padding: 16px 30px 20px;}
.evCon4 .gift_wrap .item .bubble {visibility: visible; opacity: 1; top: 16px; right: 17px; background: linear-gradient(90deg, #FFCA9B 0%, #D8954A 100%);}
.evCon4 .gift_wrap .item .bubble::after {background-color: #DA984E;}
.evCon4 .gift_wrap .img {max-width: 176px; margin: 12px auto;}
.evCon4 .comment_tit {margin-bottom: 20px;}
.evCon4 .video_wrap {display: flex; flex-wrap: wrap; gap: 20px; justify-content: center; margin-bottom: 50px;}
.evCon4 .video_box {max-width: 320px; aspect-ratio: 16 / 9; margin: 4px auto; border-radius: 10px; overflow: hidden;}
.evCon4 .video_wrap .ds-control {flex-direction: column; align-items: center;}
.evCon4 .video_wrap .ds-control-label {color: #FFF; font-size: var(--text-body2-size); line-height: var(--text-body2-line-height);}
.evCon4 .video_wrap .ds-control-description {font-size: var(--text-body3-size); line-height: var(--text-body3-line-height);}
/* .evCon4 .video_wrap input:checked ~ .ds-control-content .ds-control-description {color: #F00;} */
.evCon4 .pr-comment {border-radius: 10px;}
.evCon4 .pr-comment-item.is-notice {background-color: var(--brand-tertiary-orange);}
.evCon4 .pr-comment-info .ds-badge,
.evCon4 .pr-comment-mine.is-active {background-color: var(--brand-primary-orange);}

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

@media screen and (max-width: 1200px){
    /* settings */
    .evSection {padding: clamp(70px, 15.625vw, 120px) 0;}
    .evSection .con_tit + .mini_tit,
    .evSection .mini_tit + .con_tit {margin-top: 2%;}
    .evSection .con_box {margin-top: 7.813vw;}

    /* evTop */
    .evTop {padding: clamp(24px, 3.333vw, 40px) 0 clamp(24px, 4.5vw, 54px); background-size: auto 100%;}
    .evTop .title_wrap {margin-left: 0;}
}
@media screen and (max-width: 992px){
    .evTop .title_wrap .teacher_home {position: static; margin: 12px 0;}
}
@media screen and (max-width: 768px){
    .evSection .evt_info dl {align-items: flex-start;}
    .evSection .lec_wrap {padding: 20px 10px;}

    .evTop {background-image: url(https://image.megagong.net/m/2026/0910_tmddk4521/top_bg_mo.jpg), linear-gradient(180deg, #220B0D 0%, #12152C 100%); background-size: 100% auto; background-position: 50% 0 !important;}
    .evTop .top_slogan {margin: 0 auto 10px;}
    .evTop .top_txt {margin-bottom: 55.128vw;}
    .evTop .top_bnr {flex-wrap: wrap; gap: 10px; padding: 20px 10px; margin-top: clamp(30px, 7.292vw, 56px);}
    .evTop .top_bnr .img {margin-left: auto; width: 18%;}
    .evTop .top_bnr .ds-button {width: 100%; margin: 0;}

    .evCon1 .mini_tit {margin-top: 40px;}
    .evCon1 .graph_wrap .txt {top: 30px; left: 30px;}
    .evCon1 .graph_wrap .graph {margin-right: -10%;}
    .evCon1 .teacher_wrap {min-height: auto;}
    .evCon1 .teacher_wrap > img {max-width: 104%; margin: 0 -2%;}

    .evCon2 .mini_tit {max-width: none; width: 73%; margin: 0 auto;}
    .evCon2 .point_wrap {margin-top: 40px;}
    .evCon2 .point_box {padding: 40px 2.051vw;}
    .evCon2 .point1 .graph {padding-right: 0; margin: 0 auto;}
    .evCon2 .point2 .point_con {flex-direction: column; align-items: center; padding: 30px 0; border-radius: 10px; border: 1px solid #FFE9CC; background: #FFFBF5;}
    .evCon2 .point2 .img {max-width: none; width: 80%;}
    .evCon2 .point2 .point_box {max-width: none; width: 70%; border: none; margin-top: 25px;}
    .evCon2 .point2 .point_box::before,
    .evCon2 .point2 .point_box::after {position: absolute; top: 0; left: 0; padding: 0;}
    .evCon2 .point2 .point_box::after {bottom: auto; left: auto; right: 0;}
    .evCon2 .point2 .txt {margin: 0;}

    .evCon3 .method_box {padding: 30px 20px; margin-bottom: 40px;}
    .evCon3 .method {flex-wrap: nowrap; flex-direction: column;}
    .evCon3 .method li {width: 100%;}

    .evCon4 .con_tit .evt_end {top: -30vw; right: 0;}
    .evCon4 .gift_wrap {gap: 10px; margin-bottom: 60px;}
    .evCon4 .gift_wrap .item {padding: 20px;}
    .evCon4 .gift_wrap .item .bubble {top: 10px; right: 10px;}
}
@media screen and (max-width: 576px){
    .evCon1 .graph_wrap .graph {width: 100%; margin-right: -15%;}

    .evCon2 .point2 .point_box::before,
    .evCon2 .point2 .point_box::after {width: 17px; height: 13px;}
}