@charset "euc-kr"; 

.t_pass .lec_mark{display:inline-block;padding:20px 30px;background-color: #000;font-size:18px;font-weight:700;color:#fff;line-height:1;border-radius:100px;margin-bottom:30px;}
.t_pass .lec_mark strong{color:#FFF600;}
.t_pass .lec_mark strong.wht{color:#fff;}
.t_pass .con_tit{font-size:46px;line-height:1.2;}
.t_pass .chk_area input[type="checkbox"]{width:22px;height:22px;display:inline-block;
    appearance: none;
    border: 2px solid #bbb;
    border-radius: 4px;
    cursor: pointer;
}
.t_pass .chk_area input[type="checkbox"]:checked {
    background-color: #111;
    border-color: #111;
}
.t_pass .chk_area input[type="checkbox"]:checked::after {
    content: "";
    position: absolute;
    top: 0;
    left: 5px;
    width: 6px;
    height: 12px;
    border: solid white;
    border-width: 0 2px 2px 0;
    transform: rotate(45deg);
}
.t_pass .chk_area .badge-area{display:block;margin-top:10px;}
.t_pass .chk_area label{font-size:18px;color:#111;display:block;margin-top:10px;}
.t_pass .chk_area .badge-area + label{margin-top:5px;}

.tec_chk_list_wrap{margin-top:30px;/*overflow-x:auto;*/padding:2px;}
.tec_chk_list{display:flex;gap:20px;}
.tec_chk_list li{width:20%;padding:30px 25px;border:1px solid #ddd;border-radius:10px;box-sizing: border-box;background: #fff;cursor: pointer;position: relative;min-width:142px;}
.tec_chk_list li .tec_promy{display:block;width:120px;margin:15px auto 0;position: relative;}
.tec_chk_list li .tec_promy .badge-base.type-4 {position: absolute;right: 0; top: 0;z-indeX:1;}
.tec_chk_list li .badge-base.type-5 {position: absolute;left: 50%;transform: translateX(-50%); top: -45px;z-indeX:1;}
.tec_chk_list li.on{background-color:#FFF6FC;}
.tec_chk_list li.on::before {
    content: "";
    position: absolute;
    top: -3px;
    left: -3px;
    right: -3px;
    bottom: -3px;
    border: 3px solid #ff16a2;
    border-radius: 10px;
    pointer-events: none;
    z-index: 1;
}


.tec_reload_area{display:flex;justify-content: flex-end;margin-top:10px;}
.tec_reload_area .tec_reload a{display:inline-block;font-size:13px;color:#111;position: relative;padding:5px 0 5px 18px;}
.tec_reload_area .tec_reload a::before{content:'';display:block;width:13px;height:16px;background:url(https://image.megagong.net/m/2025/0513_tpass/ic_reload.svg) 50% 50% no-repeat;position: absolute;left:0;top:50%;margin-top:-8px;}


.tec_lec_list{text-align:left;margin-top:30px;}
.tec_lec_list > li{padding:30px 40px;border:1px solid #ddd;border-radius:10px;margin-top:10px;display:flex;align-items: center;justify-content: space-between;cursor: pointer;position: relative;}
/* .tec_lec_list > li.on{box-shadow: 0 0 0 3px #ff16a2;background-color:#FFF6FC;} */
.tec_lec_list > li.on{background-color:#FFF6FC;}
.tec_lec_list > li.on::before {
    content: "";
    position: absolute;
    top: -3px;
    left: -3px;
    right: -3px;
    bottom: -3px;
    border: 3px solid #ff16a2;
    border-radius: 10px;
    pointer-events: none;
    z-index: 1;
}
.tec_lec_list > li:first-child{margin-top:0;}
.tec_lec_list > li .lec_left{display:flex;align-items: center;gap:0 20px;}
.tec_lec_list > li .lec_left .lec_title span{display:block;color:#000;}
.tec_lec_list > li .lec_left .lec_title .c_name{font-size:24px;font-weight:700;}
.tec_lec_list > li .lec_left .lec_title .c_date{margin-top:5px;font-size:16px;font-weight:400;}
.tec_lec_list > li .lec_left .lec_title .c_info{font-size:13px;font-weight:700;color:#ff16a2;}
.tec_lec_list > li .lec_left .lec_title .c_info + .c_name{margin-top:5px;}
.tec_lec_list > li .lec_right{display:flex;align-items: flex-end;gap:0 15px;color:#000;}
.tec_lec_list > li .lec_right .p_type{font-size:16px;font-weight:400;line-height:42px;}
.tec_lec_list > li .lec_right .p_detail span{display:block;text-align:right;}
.tec_lec_list > li .lec_right .p_detail .before{font-size:16px;text-decoration:line-through;color:#999;font-weight:400;}
.tec_lec_list > li .lec_right .p_detail .current{font-size:30px;font-weight:700;}

/* setting */
/* common */
/* t_pass */
.t_pass {background: #fff;padding: 140px 0}
.t_pass .con_tit {position: relative;margin-bottom: 55px}
.t_pass .con_tit .evt_end {position: absolute;top: 27%;right: -4%;max-width: 21%}
.t_pass .con_tit strong {display: block}
.t_pass .date {margin-top: 60px;font-size: 22px;border: 1px solid #000;border-radius: 40px;margin: 0 305px 36px;padding: 10px 0;position: relative}
.t_pass .date .tag {position: absolute;top: 50%;left: -80px;transform: translateY(-50%);font-style: normal;font-size: 16px;font-weight: bold;color: #222;background: url(https://image.megagong.net/m/2023/0418_tpass/gong/tpass_tag.png) no-repeat center;width: 118px;height: 118px;background-size: contain}
.t_pass .date .tag > span {padding: 35px 0 0;display: block}
.t_pass .date > span {padding: 0 0 0 15px;position: relative;display: inline-block;font-weight: 700}
.t_pass .date > span::before {content: '';position: absolute;top: 50%;left: 0;width: 5px;height: 5px;background: #000;border-radius: 100%;margin: -2px 0 0}
.t_pass .date > span > i {font-style: normal;font-size: 0;display: inline-block;width: 2px;height: 14px;background: #000;margin: -3px 17px 0;vertical-align: middle}
.t_pass .date {font-weight: bold}
.t_pass .info {margin-top: 40px}
.t_pass .btns {margin: 20px 0 0;text-align: right;display: flex;flex-wrap: wrap;justify-content: flex-end;font-family: '?? ??','Malgun Gothic','??','Dotum',sans-serif;}
.t_pass .btns .tiny_noti {margin: 0 5px 15px 548px;color: #000;width: 100%;text-align: left;}
.t_pass .btns a {display: inline-block;width: 150px;height: 26px;border: 1px solid #000;font-size: 14px;line-height: 22px;text-align: center;box-sizing: border-box;font-weight: bold;border-radius: 15px}

.lecTab_wrap {border: 1px solid #ccc}
.lecTab_wrap .lecTab .tit, .lecTab_wrap .teaTab .tit {background: #ebebeb;width: 160px}
.lecTab_wrap .lecTab .tit span, .lecTab_wrap .teaTab .tit span {font-size: 18px}
.lecTab_wrap .lecTab .lec_list {width: calc(100% - 160px);margin-left: 160px;padding: 22px 0 22px 16px}
.lecTab_wrap .teaTab .tea_list {width: calc(100% - 160px);padding: 22px 0 22px 16px;border-top: 1px solid #ccc;margin-left: 160px;}
.lecTab_wrap .teaTab .tit {border-top: 1px solid #fff;/* border-bottom-left-radius: 15px; */}
.lecTab_wrap > div ul li button span, .teaTab_wrap > div ul li button span {font-size: 14px;color: #444}
.lecTab_wrap > div ul li button.on, .teaTab_wrap > div ul li button.on {font-weight: 900;color: #000}
.lecTab_wrap > div ul li button .new {margin: 0 0 -3px -3px;}

.t_pass .pre_info {margin-top: 30px;border-radius: 10px}
.t_pass .pre_info .select_box {line-height: 66px;vertical-align: middle;padding: 30px 0 30px 190px;position: relative;border: 1px solid #222;min-height: 100px;text-align: left}
.t_pass .pre_info .select_box .tit {position: absolute;top: 0;bottom: 0;left: 0;margin: auto 0;line-height: 1.6;width: 160px;height: 100%;background: #222;text-align: center}
.t_pass .pre_info .select_box .tit::before {content: '';display: inline-block;vertical-align: middle;width: 1px;height: 100%}
.t_pass .pre_info .select_box .tit span {display: inline-block;vertical-align: middle;line-height: 1.2;font-weight: normal;font-size: 18px;color: #fff}
.t_pass .pre_info .select_box .select_list {display: inline-block;vertical-align: middle}
.t_pass .pre_info .select_box .select_list li {position: relative;line-height: normal;color: #888;font-size: 16px}
.t_pass .pre_info .select_box .select_list li strong {color: #000;font-size: 19px;font-weight: normal}
.t_pass .pre_info .select_box .select_list li+li {margin-top: 6px}
.t_pass .pre_info .select_box .select_list li span {color: #888;font-size: 16px;display: inline-block;margin: 0 10px 0 8px}
.t_pass .pre_info .select_box .select_list li button {position: relative;display: inline-block;margin: 0 0 0 8px;width: 21px;height: 21px;border-radius: 2px;border: 1px solid var(--gong-pink-color);vertical-align: middle}
.t_pass .pre_info .select_box .select_list li button img {display: none}
.t_pass .pre_info .select_box .select_list li button::before {content: '';position: absolute;top: 9px;left: 1px;width: 17px;height: 1px;background-color: var(--gong-pink-color);transform: rotate(45deg)}
.t_pass .pre_info .select_box .select_list li button::after {content: '';position: absolute;top: 9px;left: 1px;width: 17px;height: 1px;background-color: var(--gong-pink-color);transform: rotate(135deg)}
.t_pass .pre_info .pre_box {margin-top: 20px;border: 1px solid #000;box-sizing: border-box}
.t_pass .pre_info .pre_box ul {display: flex;width: 100%;flex-direction: row;flex-wrap: wrap;} 
.t_pass .pre_info .pre_box ul li { position: relative; flex: 1; padding: 12px 0 0;height: 90px } 
.t_pass .pre_info .pre_box ul li:nth-child(2) {border: 1px solid #222;border-width: 0 1px}
.t_pass .pre_info .pre_box ul li:nth-child(2):before {content: '-';position: absolute;top: 0;bottom: 0;left: 0;font-size: 0;transform: translateX(-50%);margin: auto 0;width: 40px;height: 40px;border-radius: 50%;background: #9955c4 url(https://image.megagong.net/m/2022/0426_sbtpass/icon_minus.png) no-repeat center;background-size: 100% auto}
.t_pass .pre_info .pre_box ul li:nth-child(3):before {content: '=';position: absolute;top: 0;bottom: 0;left: 0;font-size: 0;transform: translateX(-50%);margin: auto 0;width: 40px;height: 40px;border-radius: 50%;background: #9955c4 url(https://image.megagong.net/m/2022/0426_sbtpass/icon_equals.png) no-repeat center;background-size: 100% auto}
.t_pass .pre_info .pre_box ul li:nth-child(3) {background: var(--gong-pinkwh-color);width: 33.4%}
.t_pass .pre_info .pre_box ul li strong {display: inline-block;font-size: 16px;font-weight: 400;margin: 0 0 3px}
.t_pass .pre_info .pre_box ul li span {display: block;font-weight: bold;font-size: 27px}
.t_pass .pre_info .buy_btn {display: inline-block;margin-top: 25px}

.t_pass .agree_wrap {text-align: left;}
.t_pass .agree_wrap label {display: block;padding: 6px 20px 0 0;color: #7c7c7c;font-size: 13px;line-height: 1;}
.t_pass .agree_wrap input[type=checkbox] {margin: -3px 8px 0 0;}

/* 240627 */
.fix_ban .date.d_day_ver .d_day_sub {color: #fff;font-weight: 600;display: block;font-size: 20px;width: 100%;}
.fix_ban .date.d_day_ver strong {color: #000;font-size: 24px;display: block;width: 100%;}
.fix_ban .date.d_day_ver strong .toggle_text.on {color: #fff;}

/* 2024-08-22 */
.t_pass .cir_bnr {margin:40px 0 0;padding: 14px 0;display:flex;align-items: center;justify-content: center;background-color: #ff629a;border-radius: 25px;width:100%;}
.t_pass .cir_bnr p {color: #fff; font-size: 20px; line-height: 1; font-weight: bold;}
.t_pass .cir_bnr p span {color: #000;}

#eventWrap.sobang .t_pass .cir_bnr{background-color: #fe5e3c;}
#eventWrap.sobang .lecTab_wrap {border: 0}
#eventWrap.sobang .lecTab_wrap > div .tit,
#eventWrap.sobang .teaTab_wrap > div .tit, .stepTab_wrap > div .tit {display: none}
#eventWrap.sobang .lecTab_wrap .lecTab .lec_list{width: 100%;padding:0;margin-left:0;}
#eventWrap.sobang .lecTab_wrap .teaTab .tea_list{margin-left:0;}
#eventWrap.sobang .lecTab_wrap > div .lec_list {display: block;margin: 0;padding: 0;border-bottom: 1px solid #000;}
#eventWrap.sobang .lecTab_wrap > div .lec_list::after {content: '';display: block;clear: both}
#eventWrap.sobang .lecTab_wrap > div .lec_list li {float: left;width: 33.3%;}
#eventWrap.sobang .lecTab_wrap > div .lec_list li button {background: #f0f0f0;color: #c6c6c6;display: block;height: 80px;width: 100%;font-size: 21px;font-weight: bold;font-family: 'Noto Sans KR';}
#eventWrap.sobang .lecTab_wrap > div .lec_list li button.on {background: #000;color: #fff}
#eventWrap.sobang .lecTab_wrap > div ul {display: block;margin: 0 0 0 -12px;padding: 5px 0 0;}
#eventWrap.sobang .lecTab_wrap > div ul {display: flex;flex-direction: row;align-items: center;justify-content: center;margin: 0 0 0 0;}
#eventWrap.sobang .lecTab_wrap > div ul li button {font-size: 15px;font-family: 'Noto Sans KR';}
#eventWrap.sobang .lecTab_wrap > div ul li button.on {font-weight: bold;}
#eventWrap.sobang .lecTab_wrap > div ul li button span{font-size:inherit;color: inherit;}
#eventWrap.sobang .lecTab_wrap .teaTab .tea_list{width: 100%;border-top: 0;padding: 5px 0;}

@media (max-width: 1200px) {
    /* t_pass */ 
    .t_pass .chk_area label{font-size:16px;margin-top:10px;}

    .t_pass {padding: 15% 0}
    .t_pass .con_tit {margin-bottom: 5%;font-size:clamp(20px,5.1vmin,46px);}
    .t_pass .date .tag {width: 27%;left: -25%}
    .t_pass .date {margin: 0 25% 6%;font-size: 20px}
    .t_pass .info {margin-top: 4%}
    .t_pass .pre_info {margin: 5% auto 0;}
    .t_pass .pre_info .select_box .select_list li,.t_pass .pre_info .select_box .select_list li strong {font-size: 14px;display: flex;flex-wrap: wrap;align-items: center;}
    .lecture_whtwrp .lecture {padding: 30px 0 185px!important}
    .t_pass .btns .tiny_noti {text-align: right;margin: 10px 0 30px;}
    .t_pass .lec_mark{font-size:clamp(14px,2.3vmin,18px);}

    #eventWrap .pocket_pop {top: 65%}

    .fix_ban .date.d_day_ver {display: flex;justify-content: center;align-items: center;gap: 2%;}
    .fix_ban .date.d_day_ver .d_day_sub {font-size: clamp(16px,2vmin,16px);width: auto;display: block;}
    .fix_ban .date.d_day_ver strong {font-size: clamp(16px,2vmin,16px);line-height: 1.2;width: auto;display: block;}
    .t_pass .cir_bnr p {font-size: clamp(15px,2vmin,20px);}

    .tec_chk_list_wrap{padding:3px;}
    .tec_chk_list{left:0;width:100%;}
    .tec_chk_list li .tec_promy{width:90px;}
    
    .tec_lec_list > li{padding:20px 30px;}
    .tec_lec_list > li .lec_left .lec_title .c_name{font-size:clamp(15px,2.9vmin,24px);}
    .tec_lec_list > li .lec_left .lec_title .c_date, .tec_lec_list > li .lec_right .p_detail .before, .tec_lec_list > li .lec_right .p_type{font-size:clamp(13px,2.1vmin,16px);}
    .tec_lec_list > li .lec_right .p_detail .current{font-size:clamp(17px,3.5vmin,30px);}
    
}

@media (max-width: 992px) {
    .tec_lec_list > li{display: block;padding:10px 15px;}
    .tec_lec_list > li .lec_right{justify-content: flex-end;margin-top:10px;}

    /* S: 2¿­ ±¸Á¶ */
    .tec_chk_list{flex-wrap:wrap;gap:10px;}
    .tec_chk_list li{width:calc(50% - 5px);display:flex;justify-content:center;align-items:center;gap:0 30px;}
    .tec_chk_list li .tec_promy{margin:0;}
    /* E: 2¿­ ±¸Á¶ */
}

@media (max-width: 768px) {
    /* t_pass */
    .t_pass .date {font-size: 18px;margin: 0 18% 6%}
    .lecTab_wrap .lecTab .tit, .lecTab_wrap .teaTab .tit {width: 100px}
    .lecTab_wrap .lecTab .lec_list, .lecTab_wrap .teaTab .tea_list {width: calc(100% - 100px);margin-left: 100px}
    .t_pass .btns a {width: 142px;height: 26px;font-size: 13px;line-height: 22px}
    .t_pass .pre_info .select_box {padding: 10px 0 10px 80px}
    .t_pass .pre_info .select_box .tit {width: 70px}
    .t_pass .pre_info .select_box .tit span {font-size: clamp(14px,2vmin,16px);}
    .t_pass .pre_info .select_box .select_list li {font-size: clamp(13px,2vmin,16px);line-height: 25px}
    .t_pass .pre_info .select_box .select_list li span {font-size: 11px;margin: 0 5px}
    .t_pass .pre_info .select_box .select_list li strong {font-size: clamp(14px,2vmin,16px);display: block}
    .t_pass .agree_wrap {width: 100%;margin: 0 0 12px;}
    .t_pass .agree_wrap label {font-size: 12px;padding: 0;}
    .t_pass .agree_wrap input[type=checkbox] {width: 12px;height: 12px;min-width: 12px;min-height: 12px;margin: -3px 5px 0 0;}
    .t_pass .btns a {font-size: 12px;height: 20px;line-height: 18px}
    .t_pass .btns .tiny_noti {margin: 10px 0;letter-spacing: -0.1em;}
    .t_pass .pre_info .select_box .select_list li button {width: 17px;height: 17px;margin-right: clamp(5px,1vmin,8px);}
    .t_pass .pre_info .select_box .select_list li button img {width: 5%;}
    .t_pass .pre_info .select_box .select_list li button::before {width: 13px;top: 7px}
    .t_pass .pre_info .select_box .select_list li button::after {width: 13px;top: 7px}
    .t_pass .pre_info .select_box .select_list li button img {width: 60%}
    .t_pass .pre_info .pre_box ul li {height: 70px;width: calc(33% - 1.5px)}
    .t_pass .pre_info .pre_box ul li:nth-child(2):before {width: 30px;height: 30px}
    .t_pass .pre_info .pre_box ul li:nth-child(3):before {width: 30px;height: 30px}
    .t_pass .pre_info .pre_box ul li strong {font-size: 14px}
    .t_pass .pre_info .pre_box ul li span {font-size: 20px}
    .t_pass .pre_info .buy_btn {margin: 25px 6% 0}
    .t_pass .cir_bnr {border-radius: 50px;}
    .t_pass .cir_bnr p {line-height: 1.3;}
    .t_pass .cir_bnr p span {display: block;}


    #eventWrap.sobang .lecTab_wrap > div .lec_list li button {font-size: 14px;padding: 0;height: 53px;}
    .tec_chk_list li .badge-base.type-5 {top: -20px;}
    .tec_chk_list li{gap: 10px;}
    .tec_chk_list li .tec_promy .badge-base.type-4 {right: unset;left:80%;width: 34px;height: 34px;}

}

@media (max-width: 576px) {
    .t_pass .ttit img {max-width: 170%;width: 160%;margin: 0 0 0 -30%}
    .t_pass .con_tit > img {width: 45%}
    .t_pass .date .tag {height: 17vw;font-size: 12px;left: -14%}
    .t_pass .date .tag > span {padding-top: 5.5vw}
    .t_pass .date {font-size: 13px;margin: 0 10% 6%;padding: 5px 0}
    .t_pass .date > span > i {margin: -3px 5px 0;height: 12px}
    .lecTab_wrap .lecTab .tit span, .lecTab_wrap .teaTab .tit span {font-size: 15px}
    .lecTab_wrap > div ul li button span, .teaTab_wrap > div ul li button span {font-size: 12px}
    .lecTab_wrap .lecTab .tit, .lecTab_wrap .teaTab .tit {width: 70px}
    .lecTab_wrap .lecTab .lec_list, .lecTab_wrap .teaTab .tea_list {width: calc(100% - 70px);margin-left: 70px;padding: 10px 0 10px 10px}
    .t_pass .pre_info .select_box .tit {position: relative;top: auto;left: auto;bottom: auto;line-height: normal;height: auto;width: 100%;padding: 7px 0;display: block}
    .t_pass .pre_info .select_box .tit br {display: none}
    .t_pass .pre_info .select_box {padding: 0}
    .t_pass .pre_info .select_box .select_list li {line-height: 20px;padding: 15px 12px;}
    .t_pass .pre_info .select_box .select_list li+li {margin: 0;padding-top: 0}
    .t_pass .pre_info .pre_box ul li {height: 65px}
    .t_pass .pre_info .pre_box ul li:nth-child(2){border-right: 0;}
    .t_pass .pre_info .pre_box ul li:nth-child(2):before {width: 20px;height: 20px}
    .t_pass .pre_info .pre_box ul li:nth-child(3):before {display:none}
    .t_pass .pre_info .pre_box ul li strong {position: relative;font-size: 13px;}
    .t_pass .pre_info .pre_box ul li:nth-child(3) strong:before {content: '=';position: absolute;top: 0;bottom: 0;left: -27px;font-size: 0;margin: auto 0;width: 40px;height: 40px;border-radius: 50%;background: #9955c4 url(https://image.megagong.net/m/2022/0426_sbtpass/icon_equals.png) no-repeat center;background-size: 100% auto;width: 20px;height: 20px;}
    
    .t_pass .pre_info .pre_box ul li span {font-size: 17px;}
    .t_pass .pre_info .pre_box ul li {height: 70px;width: calc(33% - 1.8px)}
    .mg_info_wrap .info_list li {font-size: 12px}
    .t_pass .date .tag {font-size: 10px}
    .t_pass .date .tag > span {padding-top: 4.5vw}
    .t_pass .pre_info .pre_box ul li:nth-child(3){flex:none;width: 100%;border-top: 1px solid #222;}
}