/* 이용권 페이지 스타일 */
/* 로그인 섹션 */
.login-section { margin-bottom: 60px; background-color: #262626; padding: 80px !important; text-align: center; } 
.login-text { font-size: 20px; color: #fff; line-height: 1.6; } 
.date-text { line-height: 2; font-size: 18px; color:#B4B4B4; } 
.link-btn { width: 160px; height: 40px; margin-top: 24px; background-color: #EBEBEB; color: #000; border: none; border-radius: 4px; font-size: 18px; font-family: 'mbcnew-medium'; } 
 
 /* 구매 섹션 */
.purchase-section { background-color: #262626; padding: 60px !important; } 
.purchase-info { margin-bottom: 40px; } 
.purchase-text { font-size: 18px; color: #fff; line-height: 1.8; text-align: center; } 
 
/* 티켓 컨테이너 */
.ticket-container { display: flex; justify-content: center; gap: 80px; margin-bottom: 40px; flex-wrap: wrap; align-items: center; } 
 
/* 티켓 시각적 요소 */
.ticket-visual { flex-shrink: 0; } 
.ticket-visual img { max-width: 100%; height: auto; } 
 
/* 티켓 상세 정보 */
.ticket-container .ticket-details { text-align: left; margin: 30px 0; } 
 
.ticket-container .price { font-size:20px; font-family:'mbcnew-light'; color:#fff; } 
.ticket-container .price span { margin-right: 2px; font-size: 24px; font-family: 'mbcnew-medium'; color: #FF4141; margin-bottom: 16px; letter-spacing: -.05rem; } 
 
.ticket-container .benefits { margin-top: 16px; font-size: 16px; color: #fff; line-height: 1.6; max-width: 280px; } 
.ticket-container .bar { width:1px; height:160px; background:rgba(255, 255, 255, 0.15); } 
.ticket-container .purchase-btn { width: 224px; height: 56px; background: #6706D3; color: #ffffff; border: none; border-radius: 5px; font-size: 20px; font-family: 'mbcnew-medium'; } 
 
/* 구매 안내 */
.purchase-note { text-align: center; font-size: 14px; font-family: 'mbcnew-light'; color: #B4B4B4; } 
 
/* ========================================
이용권 구매 팝업 전용 스타일
======================================== */
 
/* 팝업 전용 스타일 */
.pass-page { overflow-x: hidden; background-color: #262626; margin: 0; padding: 0; font-family: 'mbcnew-light', sans-serif; } 

.popup-container { width: 540px; padding: 40px 30px 60px; box-sizing: border-box; } 

.ticket-section { margin-bottom: 40px; } 

.ticket-section h3 { color: #fff; font-size: 24px; font-family: 'mbcnew-bold'; margin-bottom: 40px; letter-spacing: -1px; } 

.ticket-info { background: #313131; display: flex; align-items: center; padding: 30px; } 

.ticket-image { flex-shrink: 0; height: 60px; } 

.ticket-image img { width: 120px; height: auto; } 

/* 팝업 전용 ticket-details 스타일 */
.popup-container .ticket-details { flex: 1; display: flex; flex-direction: column; justify-content: center; height: 60px; border-left: 1px solid rgba(255, 255, 255, 0.15); margin-left: 30px; padding-left: 24px; } 

.popup-container .ticket-details p { color: #fff; font-size: 16px; margin: 0 0 8px 0; letter-spacing: -0.8px; } 

.popup-container .ticket-details p:last-child { margin-bottom: 0; } 

.terms-section { margin-bottom: 40px; } 

.terms-section h3 { color: #fff; font-size: 20px; font-family: 'mbcnew-medium'; margin-bottom: 20px; letter-spacing: -1px; } 

.terms-section h3 .fc-p {display: inline-block; margin-right: 5px; font-family: 'mbcnew-medium'; color: #8f83ff;}


.terms-content { border: 1px solid #555555; background: #0D0D0D; max-height: 300px; overflow-y: auto; padding: 20px; word-break: keep-all; } 
.terms-content::-webkit-scrollbar {width: 12px; padding: 0 3px;}
.terms-content::-webkit-scrollbar-thumb {background: #787878; background-clip: padding-box; border: 3px solid transparent; border-radius: 8px;}
.terms-content h4, .terms-content strong, .terms-content p {display: block; color: #b4b4b4; font-size: 14px; line-height: 1.4;}
.terms-content h4 {margin-bottom: 15px;}
.terms-content strong {margin-bottom: 10px; text-decoration: underline; text-underline-offset: 2px;}
.terms-content p { color: #b4b4b4; font-size: 14px; line-height: 1.6; margin: 0 0 12px 0; letter-spacing: -0.7px; } 
.terms-content p:not(:last-of-type) {margin-bottom: 25px;}

.checkbox-wrapper { position: relative; margin-top: 20px; } 

.custom-checkbox { position: absolute; opacity: 0; cursor: pointer; height: 0; width: 0; } 

.checkbox-label { position: relative; display: inline-block; width: 16px; height: 16px; border-radius: 2px; border: 1px solid rgba(255, 255, 255, 0.30); background: #0D0D0D; cursor: pointer; vertical-align: middle; box-sizing: border-box; } 

.custom-checkbox:checked + .checkbox-label { border-radius: 2px; background: #D2D2D2 url(../images/ico_checkbox.svg) no-repeat center center; background-size: 12px; } 

.checkbox-text { color: #fff; font-size: 16px; margin-left: 10px; vertical-align: middle; cursor: pointer; } 

/* 2단계: 결제 수단 선택 */
.payment-section { margin-bottom: 40px; } 

.payment-section h3 { color: #fff; font-size: 20px; font-family: 'mbcnew-medium'; margin-bottom: 20px; letter-spacing: -1px; } 

.payment-options { background: #313131; padding: 24px; } 

.radio-item { display: flex; align-items: center; margin-bottom: 16px; } 

.radio-item:last-child { margin-bottom: 0; } 

.radio-item input[type="radio"] { appearance: none; -webkit-appearance: none; -moz-appearance: none; width: 16px; height: 16px; margin-right: 12px; border: 1px solid #666666; border-radius: 50%; background: #000000; cursor: pointer; position: relative; box-sizing: border-box; } 

.radio-item input[type="radio"]:checked { background-color: #D2D2D2; border: none; } 

.radio-item input[type="radio"]:checked::after { content: ''; position: absolute; width: 6px; height: 6px; top: 50%; left: 50%; background: #000000; transform: translate(-50%, -50%); border-radius: 50%; } 

.radio-item label { color: #fff; font-size: 16px; font-family: 'mbcnew-light'; cursor: pointer; } 

.service-info { margin-top: 60px; } 

.service-info h4 { color: #B4B4B4; font-size: 16px; font-family: 'mbcnew-medium'; margin-bottom: 16px; letter-spacing: -0.8px; display: flex; align-items: center; } 

.service-info h4::before { content: ''; display: inline-block; width: 16px; height: 16px; background: url(../images/icon_noti.svg) no-repeat center center; background-size: 16px; color: #000; margin-right: 5px; } 

.service-info ul { list-style: none; padding: 0; margin: 0; } 

.service-info li { color: #B4B4B4; font-size: 14px; line-height: 1.6; margin-bottom: 8px; padding-left: 13px; position: relative; letter-spacing: -0.7px; } 

.service-info li::before { content: '•'; position: absolute; top: 7px; left: 5px; color: #B4B4B4; font-size: 3px; } 

.service-info li:last-child { margin-bottom: 0; } 
.ticket-done { margin-top: 60px; font-size: 18px; color:#fff; line-height: 1.6; text-align: center; margin-bottom: 40px; } 
/* 버튼 그룹 */
.button-group { display: flex; gap: 12px; justify-content: center; } 

.btn { width: 192px; padding: 16px 32px; border: none; border-radius: 6px; font-size: 16px; font-weight: 500; cursor: pointer; transition: all 0.3s; letter-spacing: -0.8px; background-color: #3C3C3C; color: #F0F0F0 } 

.btn-next { background: #3C3C3C; color: #F0F0F0; display: flex; align-items: center; justify-content: center; } 

.btn-next:disabled { color: #666; cursor: not-allowed; } 

.btn-next.active { background: #6706D3; color: #fff; } 

.btn-prev { background: #404040; color: #F0F0F0 } 

/* 스크롤바 스타일 */
.terms-content::-webkit-scrollbar { width: 14px; padding: 0 3px; } 

.terms-content::-webkit-scrollbar-thumb { background: #787878; background-clip: padding-box; border: 3px solid transparent; border-radius: 8px; } 

/* 에러 메시지 스타일 */
.error-message { color: #ff6b6b; font-size: 14px; margin-top: 8px; text-align: center; display: none; } 
.ico-arr-r { margin-left: 5px; width: 6px; height: 12px; display: inline-block; background: url(../images/ico_arr_r_on.svg) no-repeat center center; background-size: 100% 100%; font-weight: 300; } 
.active .ico-arr-r { background: url(../images/ico_arr_r.svg) no-repeat center center; background-size: 100% 100%; }