/* ===== 사용자(app) 전용 스타일 =====
   공통: common.css / font.css 참고, 중복 선언 금지
   사용 범위: views/app
   ============================================= */
:root {
    --fs-scale: 1.25; /* 사용자(app) 전체 폰트 크기 배율 */
}

body {
    line-height: 1.5;
}

/* AOS 이동 거리 축소 */
[data-aos="fade-up"]    { transform: translate3d(0, 150px, 0); }
[data-aos="fade-down"]  { transform: translate3d(0, -150px, 0); }
[data-aos="fade-right"] { transform: translate3d(-150px, 0, 0); }
[data-aos="fade-left"]  { transform: translate3d(150px, 0, 0); }

/* hidden 속성이 CSS display 선언에 덮어쓰이지 않도록 보장 */
[hidden] { display: none !important; }

/* ===== 레이아웃 기본 ===== */
body { background: var(--bg); color: var(--fg1); display: flex; flex-direction: column; min-height: 100vh; }
body:has(#main-intro) { overflow: hidden; }
@media (max-width: 768px) { body { overflow: auto; } }

.mi-deco {position: absolute;right: -40px;bottom: -30px;width: 440px;height: 330px;opacity: 0.9;pointer-events: none;}
.mi-pane { cursor: pointer; }
.mi-pane:hover .mi-deco { opacity: 1; transition: opacity 0.3s; }
main { flex: 1; }

/* 사용자 inner — 좁게 */
.inner {
    max-width: var(--inner-user);
    width: 100%;
    margin: 0 auto;
    padding: 0 var(--gutter-desktop);
    box-sizing: border-box;
}

/* ===== TOP BAR ===== */
.top-bar {
    background: var(--gray-50);
    border-bottom: 1px solid var(--border);
    height: 36px;
    display: flex;
    align-items: center;
}
.top-bar .inner {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 16px;
}
.top-bar span:not(.sep) {
    font-size: calc(12px * var(--fs-scale));
}
.top-bar a {
    font-size: calc(12px * var(--fs-scale));
    color: var(--fg3);
    display: flex;
    align-items: center;
    gap: 5px;
    transition: color var(--dur-base) var(--ease-std);
}
.top-bar a:hover { color: var(--brand-primary); text-decoration: none; }
.top-bar .sep { width: 1px; height: 10px; background: var(--border-strong); }

/* ===== 사이트 헤더 ===== */
header {
    background: #fff;
    border-bottom: 1px solid var(--border);
    position: sticky;
    top: 0;
    z-index: var(--z-nav);
    transition: box-shadow var(--dur-base) var(--ease-std);
    padding-top: env(safe-area-inset-top);
}
header.scrolled { box-shadow: var(--shadow-sm); }
header .inner {
    height: 68px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
header h1 { margin: 0; line-height: 1; }
header h1 img { height: 40px; width: auto; display: block; }

/* GNB */
#gnb { display: flex; align-items: center; }
#gnb .depth1 {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    align-items: center;
    gap: 4px;
}
#gnb .depth1 > li { position: relative; }
#gnb .depth1 > li > a {
    display: flex;
    align-items: center;
    height: 68px;
    padding: 0 18px;
    font-size: calc(15px * var(--fs-scale));
    font-weight: 600;
    color: var(--fg2);
    letter-spacing: -0.01em;
    text-decoration: none;
    transition: color var(--dur-base) var(--ease-std);
    position: relative;
}
#gnb .depth1 > li > a::after {
    content: "";
    position: absolute;
    bottom: 0;
    left: 18px;
    right: 18px;
    height: 2px;
    background: var(--brand-primary);
    transform: scaleX(0);
    transition: transform var(--dur-base) var(--ease-std);
}
#gnb .depth1 > li > a:hover { color: var(--brand-primary); }
#gnb .depth1 > li > a:hover::after,
#gnb .depth1 > li.active > a::after { transform: scaleX(1); }
#gnb .depth1 > li.active > a { color: var(--brand-primary); }

/* depth2 드롭다운 */
#gnb .depth2-wrapper {
    display: none;
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    z-index: var(--z-nav);
    padding-top: 8px;
}
/* hover가 아니라 클릭으로 열고 닫음 (app_header.php 스크립트가 .open 토글) */
#gnb .depth1 > li.open .depth2-wrapper { display: block; }
#gnb .depth2 {
    list-style: none;
    margin: 0;
    padding: 0;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    overflow: hidden;
    box-shadow: var(--shadow-md);
    width: max-content;
    min-width: 140px;
}
#gnb .depth2 li a {
    display: block;
    padding: 11px 20px;
    font-size: calc(14px * var(--fs-scale));
    color: var(--fg2);
    white-space: nowrap;
    text-align: center;
    transition: background var(--dur-base) var(--ease-std), color var(--dur-base) var(--ease-std);
}
#gnb .depth2 li:not(:last-child) a { border-bottom: 1px dashed var(--border); }
#gnb .depth2 li a:hover { background: var(--brand-primary-50); color: var(--brand-primary); font-weight: 600; }

/* TNB — 오른쪽 버튼 영역 */
.tnb { display: flex; align-items: center; gap: 8px; }
.tnb > ul { display: flex; align-items: center; gap: 4px; margin: 0; }
.tnb .btn-tnb {
    height: 36px;
    padding: 0 14px;
    border-radius: var(--radius-md);
    font-size: calc(13px * var(--fs-scale));
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    cursor: pointer;
    transition: all var(--dur-base) var(--ease-std);
    border: 1px solid transparent;
    text-decoration: none;
}
.tnb .btn-tnb.outline {
    border-color: var(--border-strong);
    color: var(--fg2);
    background: #fff;
}
.tnb .btn-tnb.outline:hover { border-color: var(--brand-primary); color: var(--brand-primary); }
.tnb .btn-tnb.primary {
    background: var(--brand-primary);
    color: #fff;
}
.tnb .btn-tnb.primary:hover { background: var(--brand-primary-700); }

/* 모바일 전용 요소 — PC에서 숨김 */
.mobile_my { display: none; }

/* ── 모바일 GNB 상단 유저 영역 ── */
.mm-head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 0 16px;
    border-bottom: 1px solid var(--border);
    margin-bottom: 4px;
}
.mm-user {
    display: flex;
    align-items: center;
    gap: 12px;
}
.mm-avatar {
    width: 42px;
    height: 42px;
    border-radius: 50%;
    background: var(--brand-primary-50, #e8f0ff);
    color: var(--brand-primary, #003087);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: calc(18px * var(--fs-scale));
    flex-shrink: 0;
}
.mm-user-info {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.mm-name {
    font-size: calc(15px * var(--fs-scale));
    font-weight: 700;
    color: var(--fg1);
    line-height: 1.2;
}
.mm-role {
    font-size: calc(11px * var(--fs-scale));
    color: var(--fg3);
}
.mm-close {
    width: 36px;
    height: 36px;
    border-radius: 8px;
    background: var(--gray-50, #f8f8f8);
    border: 1px solid var(--border);
    color: var(--fg2);
    font-size: calc(18px * var(--fs-scale));
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: background 0.15s;
}
.mm-close:hover { background: var(--gray-100); }
.mm-actions {
    display: flex;
    gap: 8px;
    padding: 12px 0 4px;
}
.mm-btn {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    height: 38px;
    border-radius: 8px;
    font-size: calc(13px * var(--fs-scale));
    font-weight: 600;
    text-decoration: none;
    transition: background 0.15s, color 0.15s;
    white-space: nowrap;
}
.mm-btn--primary {
    background: var(--brand-primary, #003087);
    color: #fff !important; /* a 태그 전역 색상 규칙에 밀려 남색으로 나오던 것 고정 */
    border: 1px solid var(--brand-primary, #003087);
}
.mm-btn--primary:hover { background: var(--brand-primary-700, #002266); color: #fff !important; }
.mm-btn--outline {
    background: #fff;
    color: var(--brand-primary, #003087);
    border: 1px solid var(--brand-primary, #003087);
}
.mm-btn--outline:hover { background: var(--brand-primary-50, #e8f0ff); color: var(--brand-primary); }
.mm-btn--ghost {
    background: var(--gray-50, #f8f8f8);
    color: var(--fg2);
    border: 1px solid var(--border);
}
.mm-btn--ghost:hover { background: var(--gray-100); color: var(--fg1); }

/* 모바일 햄버거 */
.mobile_menu {
    display: none;
    background: none;
    border: none;
    width: 36px;
    height: 36px;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--fg1);
    font-size: calc(20px * var(--fs-scale));
}

/* ===== 사이트 푸터 ===== */
footer {
    background: var(--brand-primary-800);
    color: rgba(255,255,255,0.7);
    padding: 48px 0 max(32px, calc(32px + env(safe-area-inset-bottom)));
    margin-top: auto;
}
footer .inner { display: grid; grid-template-columns: auto 1fr; gap: 60px; align-items: start; }
footer .ft-logo img { height: 36px; filter: brightness(0) invert(1); opacity: 0.9; }
footer .ft-logo p { font-size: calc(12px * var(--fs-scale)); color: rgba(255,255,255,0.5); margin-top: 10px; line-height: 1.7; }
footer .ft-info h5 { color: #fff; font-size: calc(14px * var(--fs-scale)); font-weight: 700; margin: 0 0 10px; }
footer .ft-info-list { display: flex; flex-wrap: wrap; gap: 4px 20px; font-size: calc(12px * var(--fs-scale)); margin-bottom: 12px; }
footer .ft-links { display: flex; gap: 16px; margin-bottom: 12px; }
footer .ft-links a { font-size: calc(12px * var(--fs-scale)); color: rgba(255,255,255,0.6); }
footer .ft-links a:hover { color: #fff; }
footer .ft-copy { font-size: calc(11px * var(--fs-scale)); color: rgba(255,255,255,0.4); }

/* ===== 페이지 헤더 (서브페이지 상단) ===== */
.page-head {
    background: var(--gray-50);
    border-bottom: 1px solid var(--border);
    padding: 32px 0 24px;
}
.page-head .crumbs {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: calc(12px * var(--fs-scale));
    color: var(--fg3);
    margin-bottom: 10px;
}
.page-head .crumbs .active { color: var(--brand-primary); font-weight: 600; }
.page-head h2 {
    font-size: calc(24px * var(--fs-scale));
    font-weight: 700;
    color: var(--fg1);
    letter-spacing: -0.02em;
    margin: 0 0 4px;
}
.page-head p { font-size: calc(14px * var(--fs-scale)); color: var(--fg3); margin: 0; }

/* ===== 컨텐츠 영역 ===== */
.content-wrap { padding: 48px 0 80px; }

/* ===== 스텝 인디케이터 ===== */
.step-bar {
    display: flex;
    align-items: flex-start;
    margin: 0 0 48px;
    padding: 32px 0 0;
}
.step-bar .step-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: relative;
}
.step-bar .step-item:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 17px;
    left: calc(50% + 17px);
    right: calc(-50% + 17px);
    height: 2px;
    background: var(--border);
}
.step-bar .step-item.done::after,
.step-bar .step-item.active::after { background: var(--brand-primary); }
.step-bar .step-circle {
    width: 34px;
    height: 34px;
    border-radius: 50%;
    border: 2px solid var(--border-strong);
    background: #fff;
    color: var(--fg3);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: calc(13px * var(--fs-scale));
    font-weight: 700;
    margin-bottom: 10px;
    position: relative;
    z-index: 1;
    transition: all var(--dur-base) var(--ease-std);
}
.step-bar .step-item.done .step-circle,
.step-bar .step-item.active .step-circle {
    background: var(--brand-primary);
    border-color: var(--brand-primary);
    color: #fff;
}
@keyframes step-pop {
    0%   { transform: scale(0.45); opacity: 0; }
    65%  { transform: scale(1.14); opacity: 1; }
    100% { transform: scale(1); }
}
@keyframes step-ripple {
    0%   { box-shadow: 0 0 0 0 rgba(0,63,142,0.45); }
    100% { box-shadow: 0 0 0 10px rgba(0,63,142,0); }
}
.step-bar .step-item.active .step-circle {
    animation:
        step-pop    0.48s cubic-bezier(0.34, 1.56, 0.64, 1) 0.2s both,
        step-ripple 0.72s ease-out 0.55s both;
}
.step-bar .step-label {
    font-size: calc(12px * var(--fs-scale));
    font-weight: 500;
    color: var(--fg3);
    text-align: center;
    white-space: nowrap;
}
.step-bar .step-item.active .step-label { color: var(--brand-primary); font-weight: 700; }
.step-bar .step-item.done .step-label { color: var(--fg1); }

/* ===== 칩 / 상태 뱃지 ===== */
.chip {
    display: inline-flex;
    align-items: center;
    padding: 3px 10px;
    border-radius: var(--radius-pill);
    font-size: calc(11px * var(--fs-scale));
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: -0.01em;
    /* 좁은 칸에서 글자가 접혀 알약 모양이 찌그러지는 것 방지 */
    white-space: nowrap;
}
.chip-primary  { background: var(--brand-primary-100); color: var(--brand-primary); }
.chip-accent   { background: var(--brand-accent-100);  color: var(--brand-accent-700); }
.chip-success  { background: var(--success-bg);  color: var(--success); }
.chip-warning  { background: var(--warning-bg);  color: var(--warning); }
.chip-danger   { background: var(--danger-bg);   color: var(--danger); }
.chip-gray     { background: var(--gray-100);    color: var(--gray-600); }
/* BEM 변형 (-- 표기) */
.chip--ok     { background: var(--success-bg);         color: var(--success); }
.chip--info   { background: var(--brand-primary-100);  color: var(--brand-primary); }
.chip--pend   { background: var(--warning-bg);         color: var(--warning); }
.chip--reject { background: var(--danger-bg);          color: var(--danger); }
.chip--accent { background: var(--brand-accent-100);   color: var(--brand-accent-700); }
.chip--gray   { background: var(--gray-100);           color: var(--gray-600); }

/* ===== 버튼 — 브랜드 컬러 ===== */

.btn-accent {
    background: var(--brand-accent);
    color: #fff!important;
    border: none;
    border-radius: var(--radius-md);
    padding: 12px 24px;
    font-weight: 700;
    font-size: calc(14px * var(--fs-scale));
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    transition: background var(--dur-base) var(--ease-std);
    text-decoration: none;
    box-shadow: 0 6px 16px rgba(172,42,94,0.3);
}
.btn-accent:hover { background: var(--brand-accent-700); color: #fff; }
/* 히어로 CTA — 어두운 배너 위에서 가장 먼저 읽히도록 흰 버튼 + 큰 글자
   .btn-accent(color)·.btn-lg(padding/font-size)가 !important라 같은 강도로 덮어씀 */
/* CTA 공통 크기 — 히어로·하단 배너에서 같은 크기·아이콘을 쓰도록 분리 */
.btn-cta-lg {
    gap: 14px;
    min-width: 340px;
    max-width: 100%;
    justify-content: center;
    font-size: calc(23px * var(--fs-scale)) !important;
    padding: 24px 56px !important;
    border-radius: var(--radius-lg);
}
.btn-cta-lg i { font-size: 1.2em; line-height: 1; }

/* 히어로 전용 — 어두운 배너 위라 흰 버튼 (크기는 .btn-cta-lg가 담당) */
.btn-cta-hero {
    background: #fff;
    color: var(--brand-primary) !important;
    box-shadow: 0 10px 26px rgba(0, 0, 0, 0.24);
}
.btn-cta-hero:hover { background: var(--brand-primary-50); color: var(--brand-primary) !important; }

@media (max-width: 640px) {
    /* 좁은 화면에서는 가로로 꽉 채워 터치 영역 확보 */
    .btn-cta-lg { width: 100%; min-width: 0; font-size: calc(19px * var(--fs-scale)) !important; padding: 20px 24px !important; }
}

.btn-outline-primary {
    background: #fff;
    color: var(--brand-primary);
    border: 1px solid var(--brand-primary);
    border-radius: var(--radius-md);
    padding: 12px 24px;
    font-weight: 600;
    font-size: calc(14px * var(--fs-scale));
    display: inline-flex;
    align-items: center;
    gap: 8px;
    cursor: pointer;
    transition: all var(--dur-base) var(--ease-std);
    text-decoration: none;
}
.btn-outline-primary:hover { background: var(--brand-primary-50); }


/* ===== SNS 로그인 버튼 ===== */
.btn-naver {
    background: #03C75A;
    color: #fff;
    border: none;
    border-radius: var(--radius-md);
    padding: 12px 0px;
    font-weight: 700;
    font-size: calc(14px * var(--fs-scale));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    cursor: pointer;
    transition: filter var(--dur-base);
}
.btn-naver:hover { filter: brightness(0.95); }
.btn-kakao {
    background: #FEE500;
    color: #191919;
    border: none;
    border-radius: var(--radius-md);
    padding: 12px 0px;
    font-weight: 700;
    font-size: calc(14px * var(--fs-scale));
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 100%;
    cursor: pointer;
    transition: filter var(--dur-base);
}
.btn-kakao:hover { filter: brightness(0.97); }

/* ===== 폼 스타일 (오버라이드) ===== */
.form-group { margin-bottom: 16px; }
.form-group label {
    display: block;
    font-size: calc(13px * var(--fs-scale));
    font-weight: 600;
    color: var(--fg2);
    margin-bottom: 6px;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus {
    border-color: var(--brand-primary);
    background: #fff;
    box-shadow: 0 0 0 3px var(--brand-primary-100);
}

/* ===== OCR 로딩 오버레이 ===== */
.ocr-loading {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,0.92);
    z-index: 9000;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 20px;
}
.ocr-loading .ocr-spinner {
    width: 48px;
    height: 48px;
    border: 4px solid var(--brand-primary-100);
    border-top-color: var(--brand-primary);
    border-radius: 50%;
    animation: spin 0.8s linear infinite;
}
.ocr-loading p { font-size: calc(15px * var(--fs-scale)); font-weight: 600; color: var(--fg1); }
.ocr-loading .ocr-bar-wrap {
    width: 240px;
    height: 4px;
    background: var(--gray-100);
    border-radius: var(--radius-pill);
    overflow: hidden;
}
.ocr-loading .ocr-bar {
    height: 100%;
    background: var(--brand-primary);
    border-radius: var(--radius-pill);
    animation: ocrBar 3s ease-out forwards;
}
@keyframes spin    { to { transform: rotate(360deg); } }
@keyframes ocrBar  { from { width: 0; } to { width: 90%; } }

/* ===== 메인 인트로 ===== */
/* 움직임 줄이기 설정 사용자 — 흐르는 배너 정지 */
@media (prefers-reduced-motion: reduce) { #main-intro .mi-banner-track { animation: none !important; } }
#main-intro {
    height: 100vh;
    min-height: 600px;
    display: flex;
    flex-direction: column;
}
/* 메인 최상단 스트립 */
#main-intro .mi-top {
    height: calc(56px + env(safe-area-inset-top));
    flex-shrink: 0;
    padding: env(safe-area-inset-top) 48px 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--border);
    background: #fff;
}
#main-intro .mi-top h1 img { height: 34px; width: auto; }
#main-intro .mi-top-links { display: flex; align-items: center; gap: 16px; }
#main-intro .mi-top-links b { font-size: calc(13px * var(--fs-scale)); color: var(--fg2); }
#main-intro .mi-top-links a { font-size: calc(13px * var(--fs-scale)); color: var(--fg2); }
#main-intro .mi-top-links a:hover { color: var(--brand-primary); }
#main-intro .mi-top-links .sep { width: 1px; height: 10px; background: var(--border-strong); }

/* 2그리드 메인 */
#main-intro .mi-grid {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    min-height: 0;
}
/* 하단 배너 — 두 패널 하단에 걸친 흰 박스 안에 한 줄로 (배너 수만큼 균등, 최대 350px · 5개부터는 흐름) */
#main-intro .mi-grid { position: relative; }
/*#main-intro .mi-grid--banner .mi-pane { padding-bottom: 180px; } 배너오픈숨김*/
#main-intro .mi-banner {
    position: absolute; left: 50%; bottom: 36px; transform: translateX(-50%); z-index: 5;
    width: min(1840px, calc(100% - 96px));
    padding: 24px 32px;
    background: #fff; border-radius: 16px;
    box-shadow: 0 10px 30px rgba(17, 19, 24, 0.12);
    overflow: hidden; display:none!important; /*배너오픈 숨김*/
}
#main-intro .mi-banner-track { display: flex; justify-content: center; gap: 18px; }
#main-intro .mi-banner-item {
    flex: 0 1 350px; min-width: 0;
    display: block; border-radius: 6px; overflow: hidden;
    transition: transform var(--dur-base) var(--ease-std), box-shadow var(--dur-base);
}
/* 흐르는 배너용 복제본 — 한 줄 고정(PC 4개 이하)일 때는 숨김 */
#main-intro .mi-banner-item--clone { display: none; }
#main-intro a.mi-banner-item:hover { transform: translateY(-2px); box-shadow: 0 4px 12px rgba(17, 19, 24, 0.15); }
#main-intro .mi-banner-item img { display: block; width: 100%; height: auto; }
/* 모바일 흐르는 배너 — 트랙 절반(원본 1벌)만큼 이동 후 처음으로 (복제본이 이어 붙어 끊김 없음) */
@keyframes miBannerFlow { from { transform: translateX(0); } to { transform: translateX(-50%); } }
/* PC 5개 이상 — 고정 폭으로 흐름 (간격은 gap 대신 오른쪽 여백 — 원본·복제본 폭이 같아야 이음새가 안 보임) */
#main-intro .mi-banner--flow .mi-banner-track {
    justify-content: flex-start; gap: 0; width: max-content;
    animation: miBannerFlow var(--mi-flow-dur, 25s) linear infinite;
}
#main-intro .mi-banner--flow:hover .mi-banner-track { animation-play-state: paused; }
#main-intro .mi-banner--flow .mi-banner-item { flex: 0 0 350px; margin-right: 18px; }
#main-intro .mi-banner--flow .mi-banner-item--clone { display: block; }
#main-intro .mi-pane {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    overflow: hidden;
    transition: all 0.35s var(--ease-std);
    padding: 0 48px;
}
#main-intro .mi-pane:hover { transform: none; }
#main-intro .mi-pane:hover .mi-pane-inner { transform: translateY(-4px); }
/* 배경 이미지 — hover 시 확대 */
#main-intro .mi-pane-bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    opacity: 0.13;
    transform: scale(1.06);
    transition: transform 0.55s var(--ease-std), opacity 0.4s;
    z-index: 0;
    pointer-events: none;
}
#main-intro .mi-pane:hover .mi-pane-bg {
    transform: scale(1.14);
    opacity: 0.22;
}

/* 왼쪽: 교육신청 */
#main-intro .mi-pane-left {
    background: linear-gradient(135deg, rgb(0,63,142) 0%, rgb(0,36,82) 100%);
    color: #fff;
    border-right: none;
}
#main-intro .mi-pane-left::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 70% 60%, rgba(172,42,94,0.22), transparent 55%);
    pointer-events: none;
}
/* 오른쪽: 신청확인 */
#main-intro .mi-pane-right {
    background: var(--gray-50);
    border-left: 1px solid var(--border);
    color: var(--fg1);
}
#main-intro .mi-pane-right::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 30% 60%, rgba(172,42,94,0.04), transparent 60%);
    pointer-events: none;
}
#main-intro .mi-pane-inner {
    position: relative;
    z-index: 2;
    max-width: 420px;
    width: 100%;
    transition: transform 0.35s var(--ease-std);
}
#main-intro .mi-overline {
    font-size: calc(11px * var(--fs-scale));
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    margin-bottom: 18px;
}
.mi-pane-left .mi-overline { color: rgba(255,255,255,0.65); }
.mi-pane-right .mi-overline { color: var(--brand-primary); }

#main-intro .mi-title {
    font-size: calc(40px * var(--fs-scale));
    font-weight: 800;
    line-height: 1.22;
    letter-spacing: -0.025em;
    margin: 0 0 20px;
}
.mi-pane-left .mi-title { color: #fff; }
.mi-pane-right .mi-title { color: var(--fg1); }
.mi-pane-left .mi-title .accent { color: #FFD4E2; }
.mi-pane-right .mi-title .accent { color: var(--brand-primary); }

#main-intro .mi-desc {
    font-size: calc(15px * var(--fs-scale));
    line-height: 1.75;
    margin: 0 0 32px;
}
.mi-pane-left .mi-desc { color: rgba(255,255,255,0.8); }
.mi-pane-right .mi-desc { color: var(--fg2); }

#main-intro .mi-cta {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 26px;
    border-radius: var(--radius-md);
    font-size: calc(15px * var(--fs-scale));
    font-weight: 700;
    letter-spacing: -0.01em;
    transition: all var(--dur-base) var(--ease-std);
    text-decoration: none;
}
.mi-pane-left .mi-cta {
    background: var(--brand-accent);
    color: #fff;
    box-shadow: 0 8px 20px rgba(172,42,94,0.35);
}
.mi-pane-left .mi-cta:hover { background: var(--brand-accent-700); color: #fff; }
.mi-pane-right .mi-cta {
    background: var(--brand-primary);
    color: #fff;
    box-shadow: var(--shadow-brand);
}
.mi-pane-right .mi-cta:hover { background: var(--brand-primary-700); color: #fff; }

/* 관리자 하단 스트립 */
#main-intro .mi-admin-strip {
    flex-shrink: 0;
    height: calc(52px + env(safe-area-inset-bottom));
    background: #fff;
    border-top: 1px solid var(--border);
    padding: 0 48px env(safe-area-inset-bottom);
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    transition: background var(--dur-base);
    text-decoration: none;
}
#main-intro .mi-admin-strip:hover { background: var(--gray-50); }
#main-intro .mi-admin-strip .left { display: flex; align-items: center; gap: 10px; }
#main-intro .mi-admin-strip .left i { color: var(--brand-primary); }
#main-intro .mi-admin-strip .left span { font-size: calc(13px * var(--fs-scale)); font-weight: 600; color: var(--fg1); }
#main-intro .mi-admin-strip .right { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); display: flex; align-items: center; gap: 5px; }

/* ===== 신청확인 공통 카드 ===== */
.info-card {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 24px;
    box-shadow: var(--shadow-sm);
}
.info-card + .info-card { margin-top: 16px; }
.info-card .card-title {
    font-size: calc(15px * var(--fs-scale));
    font-weight: 700;
    color: var(--fg1);
    margin-bottom: 16px;
    padding-bottom: 12px;
    border-bottom: 1px solid var(--border);
    display: flex;
    align-items: center;
    gap: 8px;
}
.info-card .card-title i { color: var(--brand-primary); }

/* ===== 캘린더 ===== */
.edu-calendar { margin-top: 32px; }
.edu-calendar .cal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 16px;
}
.edu-calendar .cal-header h4 {
    font-size: calc(18px * var(--fs-scale));
    font-weight: 700;
    color: var(--fg1);
    margin: 0;
}
.edu-calendar .cal-nav {
    width: 34px;
    height: 34px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    color: var(--fg2);
    transition: all var(--dur-base);
}
.edu-calendar .cal-nav:hover { border-color: var(--brand-primary); color: var(--brand-primary); }
.edu-calendar .cal-grid { display: grid; grid-template-columns: repeat(7, 1fr); gap: 4px; }
.edu-calendar .cal-dow {
    text-align: center;
    font-size: calc(11px * var(--fs-scale));
    font-weight: 700;
    color: var(--fg3);
    padding: 6px 0;
    letter-spacing: 0.05em;
}
.edu-calendar .cal-day {
    min-height: 80px;
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: 6px;
    background: #fff;
    position: relative;
    transition: box-shadow var(--dur-base);
}
.edu-calendar .cal-day:hover { box-shadow: var(--shadow-sm); }
.edu-calendar .cal-day.other-month { background: var(--gray-50); }
.edu-calendar .cal-day.today .day-num { color: var(--brand-primary); font-weight: 700; }
.edu-calendar .day-num { font-size: calc(12px * var(--fs-scale)); font-weight: 600; color: var(--fg2); }
.edu-calendar .cal-event {
    margin-top: 4px;
    padding: 3px 6px;
    border-radius: var(--radius-sm);
    font-size: calc(10px * var(--fs-scale));
    font-weight: 600;
    line-height: 1.4;
    cursor: pointer;
}
.edu-calendar .cal-event.available { background: var(--brand-primary-100); color: var(--brand-primary); }
.edu-calendar .cal-event.closed    { background: var(--gray-100); color: var(--gray-500); }
.edu-calendar .cal-event .event-name { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.edu-calendar .cal-event .event-time { display: block; font-size: calc(9px * var(--fs-scale)); opacity: 0.75; }

/* ===== 마이페이지 LNB ===== */
.lnb_wrapper { display: grid; grid-template-columns: 220px 1fr; gap: 48px; }
.lnb { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 24px 0; height: fit-content; }
.lnb .lnb-user { text-align: center; padding: 20px 20px 24px; border-bottom: 1px solid var(--border); margin-bottom: 8px; }
.lnb .lnb-user .avatar { width: 56px; height: 56px; background: var(--brand-primary-100); border-radius: 50%; display: flex; align-items: center; justify-content: center; margin: 0 auto 10px; color: var(--brand-primary); font-size: calc(22px * var(--fs-scale)); }
.lnb .lnb-user strong { display: block; font-size: calc(15px * var(--fs-scale)); font-weight: 700; }
.lnb .lnb-user span { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); }
.lnb > ul { padding: 0 12px; }
.lnb a {
    font-size: calc(14px * var(--fs-scale));
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 10px 12px;
    border-radius: var(--radius-md);
    color: var(--fg2);
    transition: all var(--dur-base);
}
.lnb a:hover { background: var(--brand-primary-50); color: var(--brand-primary); }
.lnb a.active { background: var(--brand-primary-50); color: var(--brand-primary); font-weight: 700; }
.lnb a::after { content: "\f054"; font-family: "Font Awesome 6 Pro"; font-size: calc(11px * var(--fs-scale)); opacity: 0.5; }
.lnb a.active::after { opacity: 1; }

/* ===== 로그인 ===== */
.login-wrap {
    min-height: 100vh;
    background: var(--gray-50);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 48px 16px;
}
.login-card {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    padding: 40px;
    width: 420px;
    max-width: 100%;
    box-shadow: var(--shadow-md);
}
.login-logo { text-align: center; margin-bottom: 32px; }
.login-logo img { height: 40px; }
.login-logo h2 { font-size: calc(22px * var(--fs-scale)); font-weight: 700; letter-spacing: -0.02em; margin: 16px 0 0; color: var(--fg1); }
.login-logo p { font-size: calc(13px * var(--fs-scale)); color: var(--fg3); margin: 8px 0 0; }
.login-field { margin-bottom: 12px; }
.login-field label { display: block; font-size: calc(13px * var(--fs-scale)); font-weight: 600; color: var(--fg2); margin-bottom: 6px; }
.login-field input {
    width: 100%;
    height: 44px;
    padding: 0 14px;
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-md);
    background: #fff;
    font-size: calc(14px * var(--fs-scale));
    color: var(--fg1);
    box-sizing: border-box;
    transition: border-color var(--dur-base), box-shadow var(--dur-base);
}
.login-field input:focus { border-color: var(--brand-primary); box-shadow: 0 0 0 3px var(--brand-primary-100); outline: none; }
.login-remember { display: flex; align-items: center; gap: 8px; font-size: calc(13px * var(--fs-scale)); color: var(--fg2); margin: 8px 0 16px; cursor: pointer; }
.login-btn-primary {
    width: 100%;
    height: 48px;
    background: var(--brand-primary);
    color: #fff;
    border: none;
    border-radius: var(--radius-md);
    font-size: calc(15px * var(--fs-scale));
    font-weight: 700;
    cursor: pointer;
    transition: background var(--dur-base);
}
.login-btn-primary:hover { background: var(--brand-primary-700); }
.login-btn-secondary {
    width: 100%;
    height: 44px;
    background: var(--gray-50);
    color: var(--fg2);
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-md);
    font-size: calc(14px * var(--fs-scale));
    font-weight: 600;
    cursor: pointer;
    margin-top: 8px;
    transition: all var(--dur-base);
}
.login-btn-secondary:hover { background: var(--gray-100); }
.login-nonmember { display: flex; flex-direction: column; gap: 12px; padding-top: 4px; }
.login-links { display: flex; align-items: center; justify-content: center; gap: 12px; margin-top: 14px; font-size: calc(13px * var(--fs-scale)); color: var(--fg3); }
.login-links a { cursor: pointer; transition: color var(--dur-base); }
.login-links a:hover { color: var(--brand-primary); text-decoration: none; }
.cursor-pointer { cursor: pointer; }

/* 아이디·비밀번호 찾기 모달 콘텐츠 */
.find-modal-desc { font-size: calc(13px * var(--fs-scale)); color: var(--fg2); margin: 0 0 20px; line-height: 1.6; }
.find-modal-field    { display: flex; flex-direction: column; gap: 6px; margin-bottom: 14px; }
.find-modal-field label { font-size: calc(13px * var(--fs-scale)); font-weight: 600; color: var(--fg2); }
.find-modal-input {
    height: 44px;
    padding: 0 14px;
    border: 1px solid var(--border-strong);
    border-radius: 8px;
    font-family: inherit;
    font-size: calc(14px * var(--fs-scale));
    color: var(--fg1);
    transition: border-color var(--dur-base);
}
.find-modal-input:focus { outline: none; border-color: var(--brand-primary); }
.find-modal-btn-primary {
    width: 100%;
    height: 46px;
    margin-top: 6px;
    background: var(--brand-primary);
    color: #fff;
    border: none;
    border-radius: 8px;
    font-family: inherit;
    font-size: calc(15px * var(--fs-scale));
    font-weight: 700;
    cursor: pointer;
    transition: background var(--dur-base);
}
.find-modal-btn-primary:hover { background: var(--brand-primary-700, #004aaa); }
.find-modal-btn-ghost {
    width: 100%;
    height: 42px;
    margin-top: 8px;
    background: transparent;
    color: var(--fg3);
    border: 1px solid var(--border-strong);
    border-radius: 8px;
    font-family: inherit;
    font-size: calc(14px * var(--fs-scale));
    font-weight: 600;
    cursor: pointer;
    transition: background var(--dur-base), color var(--dur-base);
}
.find-modal-btn-ghost:hover { background: var(--gray-50); color: var(--fg1); }
.find-result-box {
    text-align: center;
    padding: 28px 20px;
    background: var(--gray-50);
    border-radius: 10px;
    margin-bottom: 20px;
}
.find-result-box--success { background: var(--brand-primary-50); }
.find-result-icon  { font-size: calc(36px * var(--fs-scale)); color: var(--brand-primary); margin-bottom: 12px; }
.find-result-label { font-size: calc(13px * var(--fs-scale)); color: var(--fg3); font-weight: 600; margin-bottom: 8px; }
.find-result-value { font-size: calc(22px * var(--fs-scale)); font-weight: 800; color: var(--fg1); letter-spacing: 0.04em; }
.find-result-sub   { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); margin-top: 8px; line-height: 1.7; }
.login-links a:hover { color: var(--brand-primary); }
.login-links a.signup { color: var(--brand-primary); font-weight: 600; }
.login-links .sep { color: var(--border-strong); }
.login-divider { display: flex; align-items: center; gap: 12px; margin: 24px 0 16px; font-size: calc(12px * var(--fs-scale)); color: var(--fg3); font-weight: 500; }
.login-divider::before,
.login-divider::after { content: ""; flex: 1; height: 1px; background: var(--border); }
.login-sns-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.login-back { text-align: center; margin-top: 20px; font-size: calc(13px * var(--fs-scale)); color: var(--fg3); }
.login-back a { color: var(--brand-primary); font-weight: 600; cursor: pointer; }

/* ===== 회원가입 ===== */
.signup-wrap {
    min-height: 100vh;
    background: var(--gray-50);
    padding: 48px 16px 72px;
}
.signup-inner { max-width: 640px; margin: 0 auto; }
.signup-head { text-align: center; margin-bottom: 28px; }
.signup-head a { display: inline-block; margin-bottom: 16px; }
.signup-head a img { height: 36px; }
.signup-head h2 { font-size: calc(28px * var(--fs-scale)); font-weight: 800; letter-spacing: -0.025em; margin: 0 0 6px; color: var(--fg1); }
.signup-head p { font-size: calc(14px * var(--fs-scale)); color: var(--fg3); margin: 0; }
.signup-sns-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-bottom: 20px; }
.signup-divider { display: flex; align-items: center; gap: 12px; margin: 0 0 20px; font-size: calc(12px * var(--fs-scale)); color: var(--fg3); font-weight: 500; }
.signup-divider::before,
.signup-divider::after { content: ""; flex: 1; height: 1px; background: var(--border); }
.signup-card {
    background: #fff; 
    border: 1px solid var(--border);
    border-radius: var(--radius-xl);
    padding: 32px 40px;
    box-shadow: var(--shadow-sm);
}
.signup-row {
    display: grid;
    grid-template-columns: 120px 1fr;
    gap: 16px;
    align-items: start;
    padding: 14px 0;
    border-bottom: 1px solid var(--border);
}
.signup-row:last-of-type { border-bottom: none; }
.signup-label { font-size: calc(13px * var(--fs-scale)); font-weight: 600; color: var(--fg1); padding-top: 11px; letter-spacing: -0.01em; }
.signup-label .req { color: var(--brand-accent); margin-left: 3px; }
.signup-field { display: flex; flex-direction: column; gap: 6px; }
.signup-field input,
.signup-field select {
    height: 44px;
    padding: 0 14px;
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-md);
    background: #fff;
    font-size: calc(14px * var(--fs-scale));
    color: var(--fg1);
    width: 100%;
    box-sizing: border-box;
    transition: border-color var(--dur-base), box-shadow var(--dur-base);
}
.signup-field input:focus,
.signup-field select:focus { border-color: var(--brand-primary); box-shadow: 0 0 0 3px var(--brand-primary-100); outline: none; }
.signup-field input[readonly] { background: var(--gray-50); cursor: default; }
.signup-field .row { display: flex; gap: 8px; margin:0!important; position: relative; }
.signup-field .row i {position: absolute; right: 15px; top: 50%; transform: translateY(-50%); }
.signup-field .row i.txt-gray {opacity: 0;}
.signup-field .row:before{display: none}
.signup-field .row:after{display: none}
.signup-field .row input { flex: 1; }
.signup-field .btn-field {
    height: 44px;
    padding: 0 16px;
    border: 1px solid var(--border-strong);
    border-radius: var(--radius-md);
    background: var(--gray-50);
    font-size: calc(13px * var(--fs-scale));
    font-weight: 600;
    color: var(--fg2);
    white-space: nowrap;
    cursor: pointer;
    transition: all var(--dur-base);
    flex-shrink: 0;
}
.signup-field .btn-field:hover { border-color: var(--brand-primary); color: var(--brand-primary); }
.signup-hint { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); }
.signup-terms {
    margin-top: 24px;
    padding: 16px;
    background: var(--gray-50);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
}
.signup-terms-all { display: flex; align-items: center; gap: 8px; padding-bottom: 12px; border-bottom: 1px solid var(--border); margin-bottom: 10px; font-size: calc(14px * var(--fs-scale)); font-weight: 700; cursor: pointer; }
.signup-terms-row { display: flex; align-items: center; gap: 8px; font-size: calc(13px * var(--fs-scale)); color: var(--fg2); padding: 5px 0; cursor: pointer; }
.signup-terms-row a { margin-left: auto; font-size: calc(12px * var(--fs-scale)); color: var(--fg3); text-decoration: underline; cursor: pointer; flex-shrink: 0; }
.signup-terms-row a:hover { color: var(--brand-primary); }
.signup-submit {
    width: 100%;
    height: 52px;
    background: var(--brand-primary);
    color: #fff;
    border: none;
    border-radius: var(--radius-md);
    font-size: calc(16px * var(--fs-scale));
    font-weight: 700;
    cursor: pointer;
    margin-top: 24px;
    transition: background var(--dur-base);
}
.signup-submit:hover { background: var(--brand-primary-700); }
.signup-login { text-align: center; margin-top: 16px; font-size: calc(13px * var(--fs-scale)); color: var(--fg3); }
.signup-login a { color: var(--brand-primary); font-weight: 600; }

/* ===== 교육신청 랜딩 ===== */
.edu-landing-hero {
    background: linear-gradient(135deg, rgb(0,63,142) 0%, rgb(0,36,82) 100%);
    padding: 72px 0 80px;
    position: relative;
    overflow: hidden;
}
.edu-landing-hero::after {
    content: "";
    position: absolute;
    inset: 0;
    background-image: url('../img/main/main.jpg');
    background-size: cover;
    background-position: center;
    opacity: 0.1;
    pointer-events: none;
    z-index: 0;
}
.edu-landing-hero::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at 80% 50%, rgba(172,42,94,0.25), transparent 55%);
    pointer-events: none;
    z-index: 1;
}
.edu-landing-hero .inner { position: relative; z-index: 2; text-align: center }
.edu-landing-hero .hero-overline {
    font-size: calc(12px * var(--fs-scale));
    font-weight: 700;
    letter-spacing: 0.14em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.6);
    margin-bottom: 16px;
}
.edu-landing-hero h2 {
    font-size: calc(42px * var(--fs-scale));
    font-weight: 800;
    color: #fff;
    letter-spacing: -0.025em;
    line-height: 1.2;
    margin: 0 0 16px;
}
.edu-landing-hero h2 em { color: #FFD4E2; font-style: normal; }
.edu-landing-hero p {
    font-size: calc(16px * var(--fs-scale));
    color: rgba(255,255,255,0.78);
    line-height: 1.75;
    margin: 0 0 36px;
}
.edu-landing-hero .hero-actions { display: flex; gap: 12px; flex-wrap: wrap; justify-content: center}
.edu-landing-hero .hero-badge {display: inline-flex;align-items: center;gap: 8px;background: rgba(255,255,255,0.12);border: 1px solid rgba(255,255,255,0.25);border-radius: var(--radius-pill);padding: 6px 14px;font-size: calc(10px * var(--fs-scale));font-weight: 600;color: rgba(255,255,255,0.85);margin-bottom: 20px; text-transform: uppercase;}

/* 이번 주 일정 */
.landing-section { padding: 56px 0; }
.landing-section + .landing-section { border-top: 1px solid var(--border); }
.landing-section-head { margin-bottom: 32px; }
.landing-section-head .overline { font-size: calc(12px * var(--fs-scale)); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase; color: var(--brand-primary); margin-bottom: 8px; }
.landing-section-head h3 { font-size: calc(24px * var(--fs-scale)); font-weight: 800; color: var(--fg1); letter-spacing: -0.02em; margin: 0 0 6px; }
.landing-section-head p { font-size: calc(14px * var(--fs-scale)); color: var(--fg3); margin: 0; }

/* 이번 주 일정 카드 리스트 */
.week-schedule-list { display: flex; flex-direction: column; gap: 12px; }
.week-schedule-item {
    display: grid;
    grid-template-columns: 100px 1fr auto;
    gap: 20px;
    align-items: center;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 20px 24px;
    box-shadow: var(--shadow-sm);
    transition: box-shadow var(--dur-base), border-color var(--dur-base);
    cursor: pointer;
    text-decoration: none;
    color: inherit;
}
.week-schedule-item:hover { box-shadow: var(--shadow-md); border-color: var(--brand-primary-200); }
.week-schedule-item .sch-date { text-align: center; }
.week-schedule-item .sch-date .date-mon { font-size: calc(11px * var(--fs-scale)); font-weight: 700; color: var(--brand-primary); letter-spacing: 0.05em; }
.week-schedule-item .sch-date .date-day { font-size: calc(32px * var(--fs-scale)); font-weight: 800; color: var(--fg1); line-height: 1.1; letter-spacing: -0.02em; }
.week-schedule-item .sch-date .date-dow { font-size: calc(11px * var(--fs-scale)); color: var(--fg3); }
.week-schedule-item .sch-info h4 { font-size: calc(16px * var(--fs-scale)); font-weight: 700; color: var(--fg1); margin: 0 0 6px; }
.week-schedule-item .sch-info .sch-meta { display: flex; gap: 16px; flex-wrap: wrap; }
.week-schedule-item .sch-info .sch-meta span { font-size: calc(13px * var(--fs-scale)); color: var(--fg3); display: flex; align-items: center; gap: 5px; }
.week-schedule-item .sch-info .sch-meta i { color: var(--brand-primary); font-size: calc(12px * var(--fs-scale)); }
.week-schedule-item .sch-apply { text-align: right; flex-shrink: 0; }
.week-schedule-item .sch-apply .seats { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); margin-bottom: 8px; }
.week-schedule-item .sch-apply .seats strong { color: var(--brand-accent); }

/* 안내 정보 섹션 */
.info-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}
.info-box {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 28px 24px;
    box-shadow: var(--shadow-sm);
}
.info-box .info-icon {
    width: 48px;
    height: 48px;
    border-radius: var(--radius-md);
    background: var(--brand-primary-50);
    color: var(--brand-primary);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: calc(20px * var(--fs-scale));
    margin-bottom: 16px;
}
.info-box .info-icon.accent { background: var(--brand-accent-100); color: var(--brand-accent); }
.info-box .info-icon.success { background: var(--success-bg); color: var(--success); }
.info-box h4 { font-size: calc(16px * var(--fs-scale)); font-weight: 700; color: var(--fg1); margin: 0 0 10px; }
.info-box p { font-size: calc(13px * var(--fs-scale)); color: var(--fg2); line-height: 1.75; margin: 0; }
.info-box ul { margin: 0; padding: 0 0 0 16px; }
.info-box ul li { font-size: calc(13px * var(--fs-scale)); color: var(--fg2); line-height: 2; }
.info-box .price-tag { font-size: calc(28px * var(--fs-scale)); font-weight: 800; color: var(--brand-primary); letter-spacing: -0.02em; margin-top: 8px; }
.info-box .price-tag span { font-size: calc(14px * var(--fs-scale)); font-weight: 500; color: var(--fg3); }

/* 랜딩 하단 CTA */
.landing-cta {
    background: var(--gray-50);
    border-top: 1px solid var(--border);
    padding: 56px 0;
    text-align: center;
}
.landing-cta h3 { font-size: calc(28px * var(--fs-scale)); font-weight: 800; color: var(--fg1); letter-spacing: -0.02em; margin: 0 0 8px; }
.landing-cta p { font-size: calc(15px * var(--fs-scale)); color: var(--fg3); margin: 0 0 28px; }
.landing-cta .cta-actions { display: flex; gap: 12px; justify-content: center; flex-wrap: wrap; }

/* ===== 버튼 추가 ===== */
.btn-disabled { opacity: 0.4; pointer-events: none; }

/* ===== 공통: sum-row ===== */
.sum-row { display: flex; justify-content: space-between; align-items: center; }
.sum-key { color: var(--fg3); font-size: calc(13px * var(--fs-scale)); }
.sum-val { color: var(--fg1); font-weight: 600; font-size: calc(13px * var(--fs-scale)); }

/* ===== 랜딩: 이번주 일정 ===== */
.week-sched-section { background: #fff; padding: 60px 0 24px; }
.week-sched-section .inner{ margin-top: -100px;background: #fff;padding-top: 50px;z-index: 1;position: relative;border-radius: 20px}
.week-sched-head {
    display: flex;
    justify-content: space-between;
    align-items: flex-end;
    margin-bottom: 24px;
    border-bottom: 1.5px solid var(--gray-900);
    padding-bottom: 14px;
}
.week-sched-overline { font-size: calc(13px * var(--fs-scale)); color: var(--brand-accent); font-weight: 700; letter-spacing: 0.08em; margin-bottom: 6px; }
.week-sched-title { font-size: calc(28px * var(--fs-scale)); font-weight: 800; letter-spacing: -0.02em; margin: 0; color: var(--fg1); }
.week-sched-all-link { font-size: calc(13px * var(--fs-scale)); color: var(--fg2); font-weight: 600; text-decoration: none; flex-shrink: 0; }
.week-sched-all-link:hover { color: var(--brand-primary); }

/* 요일 칩 */
.week-days { display: grid; grid-template-columns: repeat(7, 1fr); gap: 8px; margin-bottom: 18px; }
.week-day-chip {
    padding: 14px 0;
    border: 1px solid var(--border);
    background: #fff;
    border-radius: var(--radius-lg);
    cursor: pointer;
    font-family: inherit;
    transition: all var(--dur-base) var(--ease-std);
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
    color: var(--fg1);
}
.week-day-chip.active { background: var(--brand-primary); border-color: var(--brand-primary); color: #fff; }
.week-day-chip:first-child { color: var(--brand-accent); }
.week-day-chip:last-child  { color: var(--brand-primary); }
.week-day-chip.active { color: #fff; }
.wdc-n { font-size: calc(20px * var(--fs-scale)); font-weight: 800; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.wdc-d { font-size: calc(11px * var(--fs-scale)); font-weight: 600; opacity: 0.7; }
.week-day-chip.active .wdc-d { opacity: 0.9; }
.wdc-dot { width: 4px; height: 4px; border-radius: 50%; background: transparent; }
.wdc-dot--on { background: var(--brand-accent); }
.week-day-chip.active .wdc-dot--on { background: #fff; }

/* 메타 행 */
.week-day-meta {
    display: flex;
    align-items: center;
    gap: 20px;
    padding: 14px 18px;
    background: var(--gray-50);
    border-radius: var(--radius-md);
    margin-bottom: 20px;
}
.week-day-badge {
    background: var(--brand-primary);
    color: #fff;
    padding: 6px 14px;
    border-radius: var(--radius-pill);
    font-size: calc(12px * var(--fs-scale));
    font-weight: 700;
    flex-shrink: 0;
}
.week-meta-txt { font-size: calc(13px * var(--fs-scale)); color: var(--fg3); }
.week-meta-txt strong { color: var(--fg1); }
.week-meta-accent { color: var(--brand-accent) !important; }
.week-meta-arrows { margin-left: auto; display: flex; gap: 6px; }

/* arrow-btn (공통) */
.arrow-btn {
    width: 32px; height: 32px; border-radius: var(--radius-md);
    border: 1px solid var(--border); background: #fff;
    cursor: pointer; color: var(--fg2);
    display: inline-flex; align-items: center; justify-content: center;
    transition: all var(--dur-base) var(--ease-std);
}
.arrow-btn:hover { background: var(--gray-50); border-color: var(--border-strong); }

/* 과정 카드 3개 그리드 */
.week-cards { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; }
.week-card {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 20px;
    transition: box-shadow var(--dur-base) var(--ease-std);
}
.week-card:hover { box-shadow: var(--shadow-md); }
.week-card-chips { display: flex; align-items: center; gap: 8px; margin-bottom: 14px; }
.week-card-avail { font-size: calc(11px * var(--fs-scale)); color: var(--brand-primary); font-weight: 700; }
.week-card-title { font-size: calc(17px * var(--fs-scale)); font-weight: 700; margin: 0 0 14px; letter-spacing: -0.01em; min-height: 46px; color: var(--fg1); }
.week-card-meta { display: flex; flex-direction: column; gap: 6px; font-size: calc(13px * var(--fs-scale)); color: var(--fg2); margin-bottom: 16px; }
.week-card-meta div { display: flex; gap: 8px; align-items: flex-start; }
.week-card-meta i { color: var(--fg3); font-size: calc(12px * var(--fs-scale)); margin-top: 2px; }
.week-bar { height: 4px; background: var(--gray-100); border-radius: var(--radius-pill); overflow: hidden; }
.week-bar-fill { height: 100%; background: var(--brand-primary); border-radius: var(--radius-pill); width: 0; transition: width 0.4s var(--ease-std); }
.week-bar-fill--closed { background: var(--gray-400); }
.week-empty { text-align: center; font-size: calc(15px * var(--fs-scale)); color: var(--fg3); background: var(--gray-50); border-radius: var(--radius-md); padding: 44px 16px;}

/* ===== 랜딩: 안내 섹션 4개 ===== */
.info-sections-section { padding: 40px 0 80px; }
.info-sections { display: flex; flex-direction: column; gap: 20px; }
.info-section-item {
    display: grid;
    grid-template-columns: 80px 56px 1fr;
    gap: 28px;
    align-items: center;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 28px 32px;
}
.info-section-num {
    font-size: calc(28px * var(--fs-scale));
    font-weight: 800;
    color: var(--brand-primary);
    font-variant-numeric: tabular-nums;
    letter-spacing: -0.02em;
}
.info-section-icon {
    width: 48px; height: 48px; border-radius: var(--radius-md);
    background: var(--brand-primary-50); color: var(--brand-primary);
    display: flex; align-items: center; justify-content: center;
    font-size: calc(20px * var(--fs-scale));
}
.info-section-body h3 { font-size: calc(18px * var(--fs-scale)); font-weight: 700; margin: 0 0 6px; letter-spacing: -0.01em; color: var(--fg1); }
.info-section-body p  { margin: 0; font-size: calc(14px * var(--fs-scale)); color: var(--fg2); line-height: 1.7; }

/* 랜딩 하단 CTA (info-sections 내부) */
.info-sections-cta { text-align: center; margin-top: 56px; }
.info-sections-cta-desc { font-size: calc(13px * var(--fs-scale)); color: var(--fg3); margin-top: 12px; }

/* ===== 교육신청 스텝 공통 ===== */
.apply-content { padding: 24px 0 64px; flex: 1; }

/* 2열 레이아웃 */
.apply-two-col { display: grid; grid-template-columns: 1.4fr 1fr; gap: 24px; margin-top: 20px; }

/* 하단 버튼 행 */
.apply-foot { margin-top: 32px; display: flex; justify-content: space-between; align-items: center; gap: 10px; }

/* 우측 요약 패널 */
.apply-summary {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 24px;
    box-shadow: var(--shadow-sm);
    height: fit-content;
}
.apply-summary--sticky { position: sticky; top: 90px; }
.apply-summary-label {
    font-size: calc(13px * var(--fs-scale)); font-weight: 700; color: var(--fg3);
    text-transform: uppercase; letter-spacing: 0.08em; margin: 0 0 14px;
}
.apply-summary-name { font-size: calc(16px * var(--fs-scale)); font-weight: 700; margin: 0 0 4px; letter-spacing: -0.01em; color: var(--fg1); }
.apply-summary-course { font-size: calc(13px * var(--fs-scale)); color: var(--fg3); margin-bottom: 18px; }
.apply-sum-rows { display: flex; flex-direction: column; gap: 10px; margin-bottom: 18px; }
.apply-sum-price {
    display: flex; justify-content: space-between; align-items: center;
    padding-top: 16px; border-top: 2px solid var(--gray-900); margin-bottom: 18px;
}
.apply-sum-price-label { font-size: calc(13px * var(--fs-scale)); color: var(--fg2); }
.apply-sum-price-value {
    font-size: calc(24px * var(--fs-scale)); color: var(--brand-accent); font-weight: 800;
    letter-spacing: -0.02em; font-variant-numeric: tabular-nums;
}
.apply-sum-price-value span { font-size: calc(14px * var(--fs-scale)); font-weight: 600; margin-left: 2px; }
/* 신청 단계 주요 버튼 (개인·단체 신청 / 제출 / 결제) — 4050 이용자 기준으로 키움
   .btn-full의 padding !important를 같은 강도로 덮음 */
.apply-sum-btn {
    margin-bottom: 10px;
    gap: 8px;
    font-size: calc(17px * var(--fs-scale)) !important;
    padding: 18px 24px !important;
    border-radius: var(--radius-md);
}
/* .btn 유무로 line-height가 달라져 버튼 높이가 어긋나던 것 통일
   (common.css의 .btn이 같은 강도라 한 단계 높은 선택자로 지정) */
.apply-summary .apply-sum-btn { line-height: 1.2; border: 1px solid transparent; }
.apply-sum-btn i { font-size: 1.15em; }
/* 같은 자리의 보조 버튼(이전·뒤로 가기)도 함께 키워 균형 유지 */
.apply-summary .btn-ghost.btn-full { font-size: calc(15px * var(--fs-scale)) !important; padding: 14px 24px !important; line-height: 1.2; }
/* 신청 불가 안내 (신청 버튼 자리 — 마감·모집예정·정원마감) */
.apply-sum-closed {
    display: flex; align-items: center; justify-content: center; gap: 8px;
    background: var(--gray-50); border: 1px solid var(--border); border-radius: var(--radius-md);
    padding: 14px 16px; margin-bottom: 8px;
    font-size: calc(14px * var(--fs-scale)); font-weight: 700; color: var(--fg3);
}
.apply-sum-closed i { color: var(--fg3); }

/* ===== 스텝1: 과정 탭 ===== */
.apply-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-bottom: 18px; }
/* 회색 테두리로는 그냥 카드처럼 읽혀 고를 수 있다는 게 드러나지 않음 — 파란 테두리로 선택지임을 표시
   두께는 active와 같게 둬서 전환 시 박스 크기가 흔들리지 않도록 함 */
.apply-tab {
    position: relative; overflow: hidden;
    padding: 18px 22px; border: 2px solid var(--brand-primary-300); border-radius: var(--radius-lg);
    background: #fff; text-align: left; cursor: pointer; font-family: inherit;
    transition: all var(--dur-base) var(--ease-std); color: var(--fg1);
}
.apply-tab:hover:not(.active) { border-color: var(--brand-primary); background: var(--brand-primary-50); }
.apply-tab.active { background: var(--brand-primary); border-color: var(--brand-primary); color: #fff; }
.apply-tab.active::after {
    content: "\f00c";
    font-family: "Font Awesome 6 Pro", "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    right: -8px; bottom: -14px;
    font-size: calc(80px * var(--fs-scale));
    color: rgba(255,255,255,0.09);
    pointer-events: none;
    line-height: 1;
}
.apply-tab-title { font-size: calc(14px * var(--fs-scale)); font-weight: 700; }
.apply-tab-desc { font-size: calc(12px * var(--fs-scale)); font-weight: 500; color: var(--fg3); margin-top: 4px; }
.apply-tab.active .apply-tab-desc { color: rgba(255,255,255,0.8); }

/* ===== 면허증 아님 안내 팝업 — 잘못 올리기 쉬운 서류 예시 (Swal html 내부) ===== */
/* minmax(0,1fr) — 1fr의 기본 min-width:auto 때문에 라벨이 긴 칸만 넓어지던 문제 방지 */
.nl-samples {
    display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px;
    margin: 18px 0; padding: 14px 10px;
    background: var(--gray-50); border-radius: var(--radius-md);
}
.nl-sample { margin: 0; min-width: 0; }
.nl-sample-thumb { position: relative; display: block; }
/* 이미지마다 여백이 달라 보이지 않도록 정사각 칸을 꽉 채움 (원본은 여백을 잘라 둔 상태) */
.nl-sample-thumb img {
    width: 100%; aspect-ratio: 1 / 1; object-fit: cover; display: block;
    background: #e8eef4; border: 1px solid var(--border); border-radius: 15px;
}
/* X 표시 — 붉은 원 + 흰 사선 두 개 (이미지에 포함하지 않고 CSS로 그림) */
.nl-sample-thumb::after {
    content: ""; position: absolute; right: -7px; bottom: -7px;
    width: 26px; height: 26px; border-radius: 50%;
    border: 2px solid #fff; box-sizing: border-box;
    background-color: var(--danger);
    background-image:
        linear-gradient(45deg, transparent 43%, #fff 43%, #fff 57%, transparent 57%),
        linear-gradient(-45deg, transparent 43%, #fff 43%, #fff 57%, transparent 57%);
    background-size: 13px 13px; background-position: center; background-repeat: no-repeat;
}
.nl-sample-label {
    margin-top: 10px; text-align: center; line-height: 1.3;
    font-size: calc(11px * var(--fs-scale)); font-weight: 600; color: var(--fg2); word-break: keep-all;
    /* 칸보다 긴 라벨(국가기술자격증)이 칸을 밀어내지 않고 줄바꿈되도록 */
    overflow-wrap: anywhere;
}
/* 예시 4칸이 너무 좁아지지 않도록 이 안내 팝업만 폭 확대 (공용 .swal2-popup은 max-width 400px) */
.swal2-popup.swal-license-guide { max-width: 520px; }

@media (max-width: 480px) {
    .nl-samples { grid-template-columns: repeat(2, 1fr); gap: 14px 10px; }
}

/* ===== 스텝1: 소지면허 선택 → 교육과정 자동 안내 (2패널) ===== */
.pick-grid { display: grid; grid-template-columns: 1.35fr 1fr; gap: 16px; margin-bottom: 28px; align-items: start; }
.pick-panel { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); overflow: hidden; }
.pick-panel-head {
    display: flex; align-items: center; gap: 10px; margin: 0;
    padding: 14px 20px; background: var(--brand-primary);
    font-size: calc(15px * var(--fs-scale)); font-weight: 700; color: #fff;
}
.pick-panel--result .pick-panel-head { background: var(--gray-700); }
.pick-panel-no {
    display: inline-flex; align-items: center; justify-content: center;
    width: 24px; height: 24px; border-radius: var(--radius-sm);
    background: rgba(255,255,255,0.22); font-size: calc(13px * var(--fs-scale)); font-weight: 800;
}
.pick-panel-body { padding: 20px; }
.pick-lead { margin: 0 0 4px; font-size: calc(17px * var(--fs-scale)); font-weight: 800; color: var(--fg1); letter-spacing: -0.02em; }
.pick-lead-sub { margin: 0 0 16px; font-size: calc(13px * var(--fs-scale)); color: var(--fg3); }

/* 면허 타일 — 톤수 변형 제외한 부모 면허만 */
.pick-license-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; }
.pick-license {
    position: relative; min-height: 68px; padding: 10px 8px; gap: 2px;
    display: flex; flex-direction: column; align-items: center; justify-content: center;
    border: 1px solid var(--border-strong); border-radius: var(--radius-md);
    background: #fff; cursor: pointer; font-family: inherit;
    transition: border-color var(--dur-base), background var(--dur-base), color var(--dur-base);
}
.pick-license:hover { border-color: var(--brand-primary); background: var(--brand-primary-50); }
.pick-license-name { font-size: calc(14px * var(--fs-scale)); font-weight: 700; color: var(--fg1); word-break: keep-all; line-height: 1.35; }
/* 톤수 변형 포함 표기 (예: 3톤 미만 포함) */
.pick-license-note { font-size: calc(11px * var(--fs-scale)); font-weight: 500; color: var(--fg3); line-height: 1.3; word-break: keep-all; }
.pick-license--on .pick-license-note { color: var(--brand-primary); }
.pick-license-check { position: absolute; top: -7px; right: -7px; font-size: calc(17px * var(--fs-scale)); color: var(--brand-primary); display: none; }
.pick-license--on { border-color: var(--brand-primary); border-width: 2px; background: var(--brand-primary-50); }
.pick-license--on .pick-license-name { color: var(--brand-primary); }
.pick-license--on .pick-license-check { display: block; }

/* 선택 안내 */
.pick-note { margin-top: 16px; padding: 14px 16px; background: var(--brand-primary-50); border-radius: var(--radius-md); }
.pick-note-title { margin: 0 0 6px; font-size: calc(13px * var(--fs-scale)); font-weight: 700; color: var(--brand-primary); }
/* common.css의 ul{list-style:none} 리셋 때문에 불릿을 직접 그림 */
.pick-note-list { margin: 0; padding-left: 12px; font-size: calc(12px * var(--fs-scale)); color: var(--fg2); line-height: 1.7; }
.pick-note-list li { position: relative; padding-left: 10px; }
.pick-note-list li::before {
    content: ""; position: absolute; left: 0; top: 0.72em;
    width: 3px; height: 3px; border-radius: 50%; background: var(--fg3);
}

/* 결과 패널 */
.pick-empty {
    padding: 48px 16px; text-align: center; color: var(--fg3);
    font-size: calc(13px * var(--fs-scale)); background: var(--gray-50); border-radius: var(--radius-md);
}
.pick-empty i { display: block; font-size: calc(24px * var(--fs-scale)); margin-bottom: 10px; color: var(--gray-400); }
.pick-result-box { padding: 14px 16px; background: var(--gray-50); border-radius: var(--radius-md); }
.pick-result-label { font-size: calc(12px * var(--fs-scale)); font-weight: 600; color: var(--fg3); margin-bottom: 4px; }
.pick-result-license { font-size: calc(18px * var(--fs-scale)); font-weight: 800; color: var(--fg1); }
.pick-arrow { text-align: center; padding: 8px 0; color: var(--brand-primary-300); }
.pick-result-course { padding: 16px; border: 1px solid var(--brand-primary-100); border-radius: var(--radius-md); background: #fff; }
.pick-result-course .pick-result-label { color: var(--brand-primary); }
.pick-course-name {
    margin: 6px 0 12px; padding: 12px; text-align: center;
    background: var(--brand-primary-50); border-radius: var(--radius-md);
    font-size: calc(15px * var(--fs-scale)); font-weight: 800; color: var(--brand-primary); word-break: keep-all;
}
.pick-course-warn {
    margin: 0 0 14px; padding: 9px 12px; background: var(--warning-bg); border-radius: var(--radius-sm);
    font-size: calc(12px * var(--fs-scale)); font-weight: 600; color: var(--warning); line-height: 1.5;
}
.pick-course-list { margin: 0; padding-left: 4px; font-size: calc(13px * var(--fs-scale)); color: var(--fg2); line-height: 1.8; }
.pick-course-list li { position: relative; padding-left: 12px; }
.pick-course-list li::before {
    content: ""; position: absolute; left: 0; top: 0.76em;
    width: 4px; height: 4px; border-radius: 50%; background: var(--brand-primary);
}
.pick-search-btn { width: 100%; height: 48px; margin-top: 16px; justify-content: center; gap: 8px; font-size: calc(15px * var(--fs-scale)); }

/* 안내 문구 방향 — 기본(2열)은 '왼쪽에서' */
.pick-empty-mo { display: none; }

@media (max-width: 1024px) {
    .pick-grid { grid-template-columns: 1fr; }
    /* 패널이 세로로 쌓이므로 '위에서'로 전환 */
    .pick-empty-pc { display: none; }
    .pick-empty-mo { display: inline; }
}
@media (max-width: 640px) {
    .pick-license-grid { grid-template-columns: repeat(2, 1fr); }
    .pick-panel-body { padding: 16px; }
    .pick-lead { font-size: calc(15px * var(--fs-scale)); }
}

/* 탭 상세 통계 */
.apply-tab-detail {
    background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); margin-bottom: 28px;
}
.apply-tab-stat-cell { padding: 20px 24px; }
.apply-tab-stat-label { font-size: calc(12px * var(--fs-scale)); font-weight: 600; color: var(--fg3); margin-bottom: 6px; letter-spacing: -0.01em; }
.apply-tab-stat-value { font-size: calc(15px * var(--fs-scale)); font-weight: 700; color: var(--fg1); letter-spacing: -0.01em; margin-bottom: 6px }

/* ===== 스텝1: 달력 ===== */
.apply-cal { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 20px; }
.apply-cal-scroll-hint { display: none; }
.apply-cal-head { display: flex; align-items: center; gap: 14px; margin-bottom: 14px; flex-wrap: wrap; }
.apply-cal-month { font-size: calc(22px * var(--fs-scale)); font-weight: 800; letter-spacing: -0.02em; color: var(--fg1); }
.apply-cal-legend { margin-left: auto; display: flex; align-items: center; gap: 16px; font-size: calc(12px * var(--fs-scale)); color: var(--fg2); }
.cal-legend-dot {
    display: inline-block; width: 8px; height: 8px; border-radius: 999px;
    margin-right: 4px; vertical-align: middle;
}
.cal-legend-dot--open     { background: var(--brand-primary); }
.cal-legend-dot--closing  { background: var(--warning); }
.cal-legend-dot--upcoming { background: #fff; box-shadow: inset 0 0 0 1px #333333; }
.cal-legend-dot--closed   { background: var(--gray-300); }

/* 달력 그리드 */
.apply-cal-grid {
    display: grid; grid-template-columns: repeat(7, 1fr);
    border-top: 1px solid var(--border); border-left: 1px solid var(--border);
}
.apply-cal-day-head {
    padding: 10px 0; font-size: calc(12px * var(--fs-scale)); font-weight: 600; text-align: center;
    background: var(--gray-50); color: var(--fg2);
    border-right: 1px solid var(--border); border-bottom: 1px solid var(--border);
}
.apply-cal-day-head--sun { color: var(--brand-accent); }
.apply-cal-day-head--sat { color: var(--brand-primary); }
.apply-cal-cell {
    min-height: 96px; padding: 8px;
    border-right: 1px solid var(--border); border-bottom: 1px solid var(--border);
    display: flex; flex-direction: column; gap: 3px;
}
.apply-cal-cell--prev .cal-num,
.apply-cal-cell--next .cal-num { color: var(--gray-300); }
.apply-cal-cell--sun .cal-num { color: var(--brand-accent); }
.apply-cal-cell--sat .cal-num { color: var(--brand-primary); }
.cal-num { font-size: calc(13px * var(--fs-scale)); font-weight: 600; color: var(--fg1); }

/* 달력 과정 알 */
.apply-cal-pill {
    font-size: calc(12px * var(--fs-scale)); padding: 7px 7px 5px; border-radius: var(--radius-sm);
    font-weight: 600; word-break: break-word; line-height: 1.25;
    /*overflow: hidden; text-overflow: ellipsis; white-space: nowrap;*/
    letter-spacing: -0.01em; cursor: pointer; border: none; text-align: left;
    font-family: inherit; transition: all var(--dur-base) var(--ease-std);
}
/* 온라인·장소 배지 — 알 좌상단에 같은 모양으로 붙음 */
.apply-cal-pill-online,
.apply-cal-pill-place {font-size: 0.85em;margin-left: -7px;margin-top: -7px;padding: 5px 6px;border-top-left-radius: 5px;border-bottom-right-radius: 5px;background: #000000;text-decoration: unset;width: fit-content;margin-bottom: 7px;color: #fff;}
/* 오프라인(장소) 배지는 온라인과 색으로 구분 */
.apply-cal-pill-place { background: var(--brand-accent); }
.apply-cal-pill--open    { background: var(--brand-primary-100); color: var(--brand-primary); }
.apply-cal-pill--closing { background: var(--warning-bg); color: var(--warning); }
/* 모집예정 — 접수 전이지만 상세 확인은 가능 (테두리형으로 모집중과 구분) */
.apply-cal-pill--upcoming { background: #fff; color:#333333; box-shadow: inset 0 0 0 1px #333333; }
.apply-cal-pill--closed  { background: var(--gray-100); color: var(--gray-500); cursor: default; }
.apply-cal-pill--closed span { text-decoration: line-through; }
.apply-cal-pill--active  { background: var(--brand-primary); color: #fff; outline: 2px solid var(--brand-primary); outline-offset: 1px; }

/* ===== 스텝2: 교육 상세 ===== */
.apply-course-head {
    background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg);
    padding: 28px 28px 24px; margin-bottom: 16px;
}
.apply-course-chips { display: flex; gap: 8px; margin-bottom: 14px; }
.apply-course-title { font-size: calc(28px * var(--fs-scale)); font-weight: 800; letter-spacing: -0.025em; margin: 0 0 10px; color: var(--fg1); }
.apply-course-desc { color: var(--fg2); font-size: calc(14px * var(--fs-scale)); margin: 0; line-height: 1.7; }
.apply-detail-grid {
    display: grid; grid-template-columns: 1fr 1fr;
    background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg);
    margin-bottom: 20px; overflow: hidden;
}
.apply-kv {
    padding: 18px 24px;
    border-bottom: 1px solid var(--border);
    border-right: 1px solid var(--border);
}
.apply-kv:nth-child(even) { border-right: none; }
.apply-detail-grid--3col { grid-template-columns: repeat(3, 1fr); }
.apply-detail-grid--3col .apply-kv { border-right: 1px solid var(--border); }
.apply-detail-grid--3col .apply-kv:nth-child(3n) { border-right: none; }
.apply-kv-label { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); font-weight: 600; margin-bottom: 4px; letter-spacing: -0.01em; }
.apply-kv-value { font-size: calc(14px * var(--fs-scale)); font-weight: 600; color: var(--fg1); }
.apply-kv-price { color: var(--brand-accent); font-size: calc(17px * var(--fs-scale)); }
.apply-detail-h3 {
    font-size: calc(17px * var(--fs-scale)); font-weight: 700; margin: 24px 0 14px; letter-spacing: -0.01em;
    padding-bottom: 10px; border-bottom: 2px solid var(--fg1); color: var(--fg1);
}
.apply-subject-list {
    background: #fff; border: 1px solid var(--border); border-radius: var(--radius-md);
    padding: 16px 24px; margin: 0; list-style: none;
    display: flex; flex-direction: column; gap: 8px;
    font-size: calc(14px * var(--fs-scale)); color: var(--fg2); line-height: 1.7;
}
/* 에디터 상세내용 (교육 내용) */
.apply-subject-html { overflow-x: auto; }
.apply-subject-html img { max-width: 100%; height: auto; }
.apply-map {
    height: 260px; background: #E8EEF4; border: 1px solid var(--border);
    border-radius: var(--radius-md); overflow: hidden;
}
.apply-map-svg { width: 100%; height: 100%; display: block; }
.apply-map-meta { display: flex; gap: 14px; margin-top: 10px; font-size: calc(13px * var(--fs-scale)); color: var(--fg2); flex-wrap: wrap; }
.apply-map-meta i { color: var(--brand-primary); }
.apply-map-addr { margin-top: 10px; font-size: calc(14px * var(--fs-scale)); color: var(--fg1); font-weight: 600; }
.apply-map-addr i { color: var(--brand-primary); margin-right: 6px; }
/* 온라인 교육·장소 미정 안내 (지도 자리) */
.apply-map-online {
    display: flex; gap: 14px; align-items: flex-start;
    background: #fff; border: 1px solid var(--border); border-radius: var(--radius-md);
    padding: 20px 24px;
}
.apply-map-online > i { font-size: calc(22px * var(--fs-scale)); color: var(--brand-primary); margin-top: 2px; }
.apply-map-online strong { display: block; font-size: calc(15px * var(--fs-scale)); color: var(--fg1); margin-bottom: 6px; }
.apply-map-online p { margin: 0; font-size: calc(13px * var(--fs-scale)); color: var(--fg2); line-height: 1.7; }

/* ===== 스텝3: 신청 요약 스트립 ===== */
.apply-strip {
    background: linear-gradient(135deg, rgb(0,63,142) 0%, rgb(0,48,110) 100%);
    border-radius: var(--radius-lg); padding: 22px 28px;
    display: flex; justify-content: space-between; align-items: center;
    margin-bottom: 24px; margin-top: 20px; gap: 24px; flex-wrap: wrap;
}
.apply-strip-overline { font-size: calc(11px * var(--fs-scale)); color: rgba(255,255,255,0.65); font-weight: 600; margin-bottom: 4px; letter-spacing: 0.08em; }
.apply-strip-name { font-size: calc(18px * var(--fs-scale)); font-weight: 800; color: #fff; }
.apply-strip-right { display: flex; gap: 32px; flex-wrap: wrap; }
.apply-strip-item {}
.apply-strip-key { font-size: calc(11px * var(--fs-scale)); color: rgba(255,255,255,0.65); font-weight: 600; margin-bottom: 4px; }
.apply-strip-val { font-size: calc(15px * var(--fs-scale)); font-weight: 700; color: #fff; }
.apply-strip-price { color: #FFD4E2; }

/* ===== 스텝3: 섹션 카드 ===== */
.apply-form-col { display: flex; flex-direction: column; gap: 20px; }
.apply-section { background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 24px 28px; }
.apply-section-head { font-size: calc(17px * var(--fs-scale)); font-weight: 700; margin: 0 0 18px; letter-spacing: -0.01em; padding-bottom: 10px; border-bottom: 1px solid var(--border); color: var(--fg1); }
.apply-required { color: var(--brand-accent); margin-left: 4px; font-size: calc(14px * var(--fs-scale)); }

/* 업로드 박스 */
.apply-upload-box {
    border: 2px dashed var(--brand-primary-300);
    background: var(--brand-primary-50); border-radius: var(--radius-lg);
    padding: 32px 20px; text-align: center;
}
.apply-upload-icon {
    width: 56px; height: 56px; border-radius: var(--radius-lg);
    background: #fff; color: var(--brand-primary);
    display: inline-flex; align-items: center; justify-content: center;
    font-size: calc(26px * var(--fs-scale)); margin-bottom: 14px;
}
.apply-upload-title { font-size: calc(15px * var(--fs-scale)); font-weight: 700; margin-bottom: 4px; color: var(--fg1); }
.apply-upload-desc { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); margin-bottom: 14px; }
.apply-upload-done {
    background: #fff; border: 1px solid var(--success);
    border-radius: var(--radius-md); padding: 14px 18px;
    display: flex; align-items: center; gap: 14px;
}
.apply-upload-done-icon { color: var(--success); font-size: calc(20px * var(--fs-scale)); flex-shrink: 0; }
/* 업로드된 면허증 미리보기 (썸네일) */
.apply-upload-thumb {
    width: 72px; height: 54px; border-radius: 6px; object-fit: cover; flex-shrink: 0;
    background: var(--gray-100); border: 1px solid var(--border);
}
.apply-upload-done-info { flex: 1; }
.apply-upload-done-name { font-size: calc(14px * var(--fs-scale)); font-weight: 700; color: var(--fg1); }
.apply-upload-done-desc { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); }
.apply-upload-box button {margin: 0 auto;}
/* 폼 필드 */
.apply-field-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.apply-field-grid--2col { grid-template-columns: 1fr 1fr; }
/* 그리드 한 줄 전체를 쓰는 필드 (예: 신청 정보의 연락처) */
.apply-field-grid > .apply-field--full { grid-column: 1 / -1; }
.apply-field { display: flex; flex-direction: column; gap: 6px; }
.apply-label { font-size: calc(12px * var(--fs-scale)); font-weight: 600; color: var(--fg3); letter-spacing: -0.01em; }
.apply-input {
    width: 100%; border: 1px solid var(--border-strong) !important; border-radius: var(--radius-md)!important;
    padding: 10px 14px; font-size: calc(14px * var(--fs-scale)) !important; font-family: inherit; height: fit-content!important;
    outline: none; background: #fff; color: var(--fg1); box-sizing: border-box;
    transition: border-color var(--dur-base) var(--ease-std);
}
.apply-input:focus { border-color: var(--brand-primary); box-shadow: 0 0 0 3px var(--brand-primary-100); }
.apply-input--sm { max-width: 180px; }
.apply-addr-wrap { margin-top: 14px; gap: 8px; }
.apply-addr-row { display: flex; gap: 8px; align-items: center; }
.apply-addr-zip { max-width: 180px; }

/* 안내 박스 */
.apply-info-box {
    background: var(--gray-50); border: 1px solid var(--border); border-radius: var(--radius-md);
    padding: 16px 20px; font-size: calc(13px * var(--fs-scale)); color: var(--fg2); line-height: 1.7;
}
.apply-info-p { margin: 0 0 8px; }
.apply-info-p:last-child { margin-bottom: 0; }

/* 신청인 정보 경고 안내문 */
.apply-warn-box {
    display: flex; gap: 12px; align-items: flex-start;
    background: #fff8f0; border: 1px solid #f97316; border-radius: var(--radius-md);
    padding: 14px 16px; margin-bottom: 18px;
}
.apply-warn-icon { color: #f97316; font-size: calc(16px * var(--fs-scale)); margin-top: 2px; flex-shrink: 0; }
.apply-warn-box.ver2 {
    background: #ba0c0c10; border: 1px solid #ba0c0c; border-radius: var(--radius-md);
}
.apply-warn-box.ver2 .apply-warn-icon { color: #ba0c0c; }
.apply-warn-list { margin: 0; padding: 0; list-style: none; font-size: calc(13px * var(--fs-scale)); color: var(--fg1); line-height: 1.7; }
.apply-warn-list li { padding-left: 0; }
.apply-warn-list li + li { margin-top: 2px; }

/* 첨부파일 다운로드 */
.apply-file-row { margin-top: 12px; }
.apply-file-dl {
    display: inline-flex; align-items: center; gap: 7px;
    font-size: calc(13px * var(--fs-scale)); color: var(--brand-primary); font-weight: 500;
    padding: 7px 14px; border: 1px solid var(--brand-primary);
    border-radius: 6px; text-decoration: none;
}
.apply-file-dl:hover { background: var(--brand-primary-50); }
.apply-file-dl-icon { margin-left: 2px; font-size: calc(12px * var(--fs-scale)); }

/* 동의 약관 */
.apply-terms { display: flex; flex-direction: column; gap: 10px; }
.apply-terms-all { display: flex; align-items: center; gap: 8px; font-size: calc(14px * var(--fs-scale)); cursor: pointer; }
.apply-terms-row { display: flex; align-items: center; gap: 8px; font-size: calc(13px * var(--fs-scale)); color: var(--fg2); cursor: pointer; flex-wrap: wrap; }
.apply-terms-view { margin-left: auto; font-size: calc(12px * var(--fs-scale)); color: var(--brand-primary); text-decoration: underline; }

/* 면허증 업로드 안내문 */
.apply-upload-notice {
    margin: 10px 0 0;
    padding: 12px 16px 12px 32px;
    background: #f4f6fb;
    border-left: 3px solid var(--brand-primary, #003087);
    border-radius: 0 8px 8px 0;
    font-size: calc(12px * var(--fs-scale));
    color: var(--fg2);
    line-height: 1.7;
    list-style: disc;
}
.apply-upload-notice li + li { margin-top: 4px; }

/* 약관 모달 */
.terms-modal-overlay {
    display: none;
    position: fixed; inset: 0;
    background: rgba(17,19,24,0.5);
    backdrop-filter: blur(3px);
    align-items: center; justify-content: center;
    z-index: 1100;
}
.terms-modal-overlay.is-open { display: flex; }
.terms-modal {
    background: #fff;
    border-radius: 16px;
    width: min(560px, 92vw);
    max-height: 80vh;
    display: flex; flex-direction: column;
    box-shadow: 0 16px 48px rgba(0,0,0,0.22);
}
.terms-modal-head {
    display: flex; align-items: center; justify-content: space-between;
    padding: 20px 24px 16px;
    border-bottom: 1px solid var(--border, #e5e8ed);
    flex-shrink: 0;
}
.terms-modal-title { font-size: calc(16px * var(--fs-scale)); font-weight: 700; color: var(--fg1); margin: 0; }
.terms-modal-close {
    background: none; border: none; cursor: pointer;
    font-size: calc(20px * var(--fs-scale)); color: var(--fg3); line-height: 1;
    padding: 4px; display: flex; align-items: center; justify-content: center;
}
.terms-modal-body {
    padding: 20px 24px 24px;
    overflow-y: auto; font-size: calc(13px * var(--fs-scale)); line-height: 1.8; color: var(--fg2);
}
.terms-modal-body h4 {
    font-size: calc(13px * var(--fs-scale)); font-weight: 700; color: var(--fg1);
    margin: 18px 0 6px;
}
.terms-modal-body h4:first-child { margin-top: 0; }
.terms-modal-body ul { padding-left: 18px; margin: 6px 0; }
.terms-modal-body li { margin-bottom: 4px; }
.terms-modal-foot {
    padding: 12px 24px 20px; flex-shrink: 0;
    border-top: 1px solid var(--border, #e5e8ed);
    display: flex; justify-content: flex-end;
}
.terms-modal-btn-close {
    padding: 9px 28px; border-radius: 8px;
    background: var(--brand-primary, #003087); color: #fff;
    font-size: calc(14px * var(--fs-scale)); font-weight: 600; border: none; cursor: pointer;
}
.terms-modal-btn-close:hover { background: var(--brand-primary-700, #002266); }

/* 면허정보 불러오기 모달 */
.license-load-desc { margin: 0 0 14px; font-size: calc(13px * var(--fs-scale)); color: var(--fg2); }
.license-load-list { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.license-load-item {
    display: flex; align-items: center; gap: 12px;
    border: 1px solid var(--border); border-radius: 10px; padding: 10px;
    cursor: pointer; transition: border-color var(--dur-base), background var(--dur-base);
}
.license-load-item:hover { border-color: var(--brand-primary); background: var(--brand-primary-100); }
.license-load-thumb {
    width: 64px; height: 48px; border-radius: 6px; object-fit: cover; flex-shrink: 0;
    background: var(--gray-100);
}
.license-load-thumb--empty {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px;
    color: var(--fg3); font-size: calc(18px * var(--fs-scale));
    align-self: stretch; height: auto;
}
.license-load-thumb--empty span { font-size: calc(9px * var(--fs-scale)); }
.license-load-info { min-width: 0; }
.license-load-title { font-size: calc(14px * var(--fs-scale)); font-weight: 700; color: var(--fg1); display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.license-load-main-badge {
    font-size: calc(10px * var(--fs-scale)); font-weight: 700; color: var(--brand-accent-700, #9a3412);
    background: var(--brand-accent-100, #ffedd5); border-radius: 3px; padding: 1px 6px;
}
.license-load-sub { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); margin-top: 2px; }
/* 출처 신청건 — 마지막에 신청한 교육임을 라벨 + 박스로 구분 */
.license-load-sub--from {
    display: inline-flex; align-items: flex-start; gap: 6px;
    margin-top: 6px; padding: 3px 9px 3px 4px;
    background: var(--gray-50); border: 1px solid var(--border);
    border-radius: var(--radius-md); color: var(--fg2);
}
.license-load-sub--from > span:last-child { min-width: 0; }
.license-load-sub-tag {
    font-size: calc(10px * var(--fs-scale)); font-weight: 700; line-height: 1.6;
    color: var(--brand-primary-700); background: var(--brand-primary-100);
    border-radius: var(--radius-sm); padding: 1px 6px; white-space: nowrap;
    flex-shrink: 0; margin-top: 1px;
}
/* 면허 소속 과정 배지 — 대상(브랜드) / 대상 외(회색) */
.license-load-badge {
    font-size: calc(10px * var(--fs-scale)); font-weight: 700;
    border-radius: 3px; padding: 2px 7px; flex-shrink: 0;
}
.license-load-badge--match { color: var(--brand-primary-700); background: var(--brand-primary-100); }
.license-load-badge--other { color: var(--fg3); background: var(--gray-100); }
/* 대상 외 안내 문구 */
.license-load-nosel {
    font-size: calc(11px * var(--fs-scale)); font-weight: 600;
    color: var(--fg3); white-space: nowrap;
}
/* 대상 외 면허 카드 — 선택 불가 · 연하게 · 목록 하단으로 이동 */
.license-load-item--off {
    order: 1;
    background: var(--gray-50); border-style: dashed;
    opacity: 0.6; cursor: default; pointer-events: none;
}

@media (max-width: 480px) {
    .license-load-list { gap: 8px; }
    .license-load-item { gap: 10px; padding: 9px; align-items: flex-start; }
    .license-load-title { gap: 4px 6px; }
    /* 대상 외 안내 — 줄이 바뀌므로 배지 형태로 구분 */
    .license-load-nosel {
        background: var(--gray-100); border-radius: var(--radius-sm); padding: 1px 6px;
        font-size: calc(10px * var(--fs-scale));
    }
    /* 출처 신청건 — 폭이 좁아 라벨을 윗줄로 분리 */
    .license-load-sub--from {
        display: flex; flex-direction: column; align-items: flex-start; gap: 4px;
        width: 100%; padding: 6px 9px;
    }
    .license-load-sub-tag { margin-top: 0; }
}

/* ===== 스텝4: 결제 수단 ===== */
.apply-pay-methods { display: grid; grid-template-columns: repeat(4, 1fr); gap: 10px; margin-bottom: 20px; }
.apply-pay-method {
    padding: 22px 10px; border: 1px solid var(--border); background: #fff;
    border-radius: var(--radius-lg); cursor: pointer; font-family: inherit;
    font-size: calc(13px * var(--fs-scale)); font-weight: 600; color: var(--fg2);
    display: flex; flex-direction: column; gap: 10px; align-items: center;
    transition: all var(--dur-base) var(--ease-std);
}
.apply-pay-method.active {
    border-color: var(--brand-primary); border-width: 2px;
    background: var(--brand-primary-50); color: var(--brand-primary);
}
.apply-pay-method i { font-size: calc(20px * var(--fs-scale)); margin-top: 5px }
.apply-card-form { display: flex; flex-direction: column; gap: 14px; }
.apply-receipt-opts { display: flex; gap: 10px; font-size: calc(14px * var(--fs-scale)); color: var(--fg2); flex-wrap: wrap; }
.apply-receipt-opts label {
    display: flex; align-items: center; gap: 7px; cursor: pointer;
    padding: 9px 16px; border: 1px solid var(--border-strong); border-radius: var(--radius-pill);
    background: #fff; transition: border-color var(--dur-base), background var(--dur-base), color var(--dur-base);
}
.apply-receipt-opts label:hover { border-color: var(--brand-primary-300); }
.apply-receipt-opts label:has(input:checked) {
    border-color: var(--brand-primary); background: var(--brand-primary-50);
    color: var(--brand-primary); font-weight: 700;
}
.apply-receipt-opts input[type="radio"] { display: none; }
.apply-receipt-form { margin-top: 16px; display: flex; flex-direction: column; gap: 14px; }
.apply-receipt-form .apply-field { gap: 8px; }
.apply-receipt-form + .apply-info-box { margin-top: 16px; }
/* ===== OCR 오버레이 ===== */
.ocr-overlay {
    position: fixed; inset: 0;
    background: rgba(17,19,24,0.45);
    backdrop-filter: blur(3px);
    display: flex; align-items: center; justify-content: center;
    z-index: var(--z-modal);
}
.ocr-card {
    background: #fff; border-radius: var(--radius-xl);
    padding: 40px 48px 32px; text-align: center;
    box-shadow: var(--shadow-lg); max-width: 360px; width: 90%;
}
.ocr-spinner-wrap {
    width: 72px; height: 72px; margin: 0 auto;
    display: inline-flex; align-items: center; justify-content: center;
    position: relative;
}
.ocr-spin-ring {
    position: absolute; inset: 0;
    border: 3px solid var(--brand-primary-100);
    border-top-color: var(--brand-primary);
    border-radius: 50%;
    animation: spin 0.9s linear infinite;
}
.ocr-spinner-icon { position: relative; color: var(--brand-primary); font-size: calc(22px * var(--fs-scale)); }
.ocr-card-title { margin: 24px 0 8px; font-size: calc(18px * var(--fs-scale)); font-weight: 700; color: var(--fg1); }
.ocr-card-desc { font-size: calc(13px * var(--fs-scale)); color: var(--fg2); margin: 0; line-height: 1.7; }
.ocr-progress {
    height: 4px; background: var(--gray-100); border-radius: var(--radius-pill);
    overflow: hidden; margin-top: 22px;
}
.ocr-progress-bar {
    width: 0; height: 100%; background: var(--brand-primary);
    border-radius: var(--radius-pill); animation: ocrBar 2.6s ease-out forwards;
}

/* ===== 완료 페이지 ===== */
.apply-complete {
    flex: 1; display: flex; align-items: center; justify-content: center;
    padding: 64px 32px; background: var(--gray-50);
}
.apply-complete-card {
    background: #fff; border: 1px solid var(--border); border-radius: var(--radius-xl);
    padding: 48px 48px 36px; width: 520px; max-width: 100%; text-align: center;
    box-shadow: var(--shadow-sm);
}
.apply-complete-icon {
    width: 88px; height: 88px; border-radius: 50%;
    background: var(--success-bg); color: var(--success); font-size: calc(48px * var(--fs-scale));
    display: inline-flex; align-items: center; justify-content: center;
}
/* 카드 결제 후 신청 실패 (payment/result) — 실패: 빨강 · 결과 확인 불가: 주황 */
.apply-complete-icon--fail { background: var(--danger-bg); color: var(--danger); }
.apply-complete-icon--pend { background: var(--warning-bg); color: var(--warning); }
.apply-complete-title { font-size: calc(30px * var(--fs-scale)); margin: 20px 0 8px; letter-spacing: -0.025em; font-weight: 800; color: var(--fg1); }
.apply-complete-desc { color: var(--fg2); font-size: calc(14px * var(--fs-scale)); margin: 0 0 32px; }
.apply-complete-summary {
    background: var(--gray-50); border-radius: var(--radius-lg);
    padding: 20px 24px; display: flex; flex-direction: column; gap: 12px; text-align: left;
}
.apply-complete-price { color: var(--brand-accent); }
.apply-complete-actions { display: flex; gap: 10px; margin-top: 28px; }

/* ===== 반응형 ===== */
@media screen and (max-width: 1400px) {
    .inner { padding: 0 var(--gutter-tablet); }
    #main-intro .mi-title { font-size: calc(34px * var(--fs-scale)); }
    .week-sched-title { font-size: calc(24px * var(--fs-scale)); }
}

@media screen and (max-width: 1024px) {
    .inner { padding: 0 var(--gutter-tablet); }
    #main-intro .mi-title { font-size: calc(28px * var(--fs-scale)); }
    #main-intro .mi-pane { padding: 0 32px; }
    #main-intro .mi-cta { padding: 12px 20px; font-size: calc(14px * var(--fs-scale)); }
    .lnb_wrapper { grid-template-columns: 200px 1fr; gap: 32px; }

    /* 랜딩 */
    .week-cards { grid-template-columns: 1fr 1fr; }
    .info-section-item { grid-template-columns: 60px 48px 1fr; gap: 20px; padding: 22px 24px; }
    .info-section-num { font-size: calc(22px * var(--fs-scale)); }

    /* 신청 스텝 */
    .apply-two-col { grid-template-columns: 1fr; }
    .apply-summary--sticky { position: static; }
    .apply-tabs { grid-template-columns: 1fr; }
    .apply-pay-methods { grid-template-columns: repeat(2, 1fr); }
    .apply-course-title { font-size: calc(22px * var(--fs-scale)); }
    .apply-strip { flex-direction: column; align-items: flex-start; gap: 16px; }
    .apply-strip-right { gap: 20px; }
    .apply-complete-card { padding: 32px 28px 24px; }
}

@media screen and (max-width: 768px) {
    .inner { padding: 0 max(var(--gutter-mobile), env(safe-area-inset-left)) 0 max(var(--gutter-mobile), env(safe-area-inset-right)); }

    /* 헤더 모바일 — 항상 화면 상단에 고정
       top-bar가 위에 남아 있으면 스크롤 0에서 헤더가 그걸 덮으므로 함께 숨김
       (top-bar의 로그인·회원가입·마이페이지·관리자 링크는 모바일 사이드바 .mobile_my에 모두 있음) */
    .top-bar { display: none; }
    header {
        position: fixed; top: 0; left: 0; right: 0;
    }
    header .inner { height: 56px; }
    header h1 img { height: 30px; }
    /* 고정된 헤더가 차지한 높이만큼 본문을 내림 (헤더 56px + 하단 보더 1px) */
    main { padding-top: calc(57px + env(safe-area-inset-top)); }
    #gnb {
        position: fixed;
        top: 0; right: -100%;
        width: 85%; max-width: 360px;
        height: 100%;
        background: #fff;
        z-index: 9999;
        transition: right 0.3s ease;
        padding: max(20px, calc(20px + env(safe-area-inset-top))) 20px max(20px, calc(20px + env(safe-area-inset-bottom))) max(20px, calc(20px + env(safe-area-inset-left)));
        overflow-y: auto;
        box-shadow: -4px 0 20px rgba(0,0,0,0.12);
        flex-direction: column;
        align-items: flex-start;
    }
    #gnb.open { right: 0; }
    .overlay { display: none; position: fixed; inset: 0; background: rgba(0,0,0,0.5); z-index: 9998; }
    .overlay.show { display: block; }
    #gnb .depth1 { flex-direction: column; width: 100%; gap: 0; }
    #gnb .depth1 > li { width: 100%; }
    #gnb .depth1 > li > a {
        height: auto;
        padding: 14px 0;
        border-bottom: 1px solid var(--border);
        font-size: calc(16px * var(--fs-scale));
    }
    #gnb .depth1 > li > a::after { display: none; }
    #gnb .depth2-wrapper { display: block !important; position: static; transform: none; padding: 0 0 8px; }
    /* PC 드롭다운용 width:max-content를 풀어 사이드바 폭을 꽉 채움 */
    #gnb .depth2 { border: none; box-shadow: none; border-radius: 0; background: none; width: 100%; min-width: 0; }
    #gnb .depth2 li a { padding: 8px 0; text-align: left; border: none; font-size: calc(14px * var(--fs-scale)); }
    .mobile_menu { display: inline-flex; }
    .mobile_my { display: block; width: 100%; }
    .tnb > ul { display: none; }

    /* 메인 인트로 모바일 */
    #main-intro .mi-pane-inner {text-align: center}
    #main-intro .mi-grid { grid-template-columns: 1fr; grid-template-rows: 1fr 1fr; }
    #main-intro .mi-pane { padding: 32px 24px; }
    #main-intro .mi-pane-right { border-left: none; border-top: 1px solid var(--border); }
    #main-intro .mi-title { font-size: calc(24px * var(--fs-scale)); }
    /* 모바일은 화면이 좁아 설명글 숨김 (제목·버튼만) */
    #main-intro .mi-desc { display: none; }
    #main-intro .mi-top { padding: 0 20px; }
    #main-intro .mi-admin-strip { padding: 0 20px; }
    #main-intro .mi-top-links {gap: 5px; font-size: 0.85em}
    /* 배너 — 1단 배치라 겹치지 않고 그리드 아래 한 줄로 흐름 (누르고 있으면 멈춤) */
    #main-intro .mi-grid--banner .mi-pane { padding-bottom: 32px; }
    #main-intro .mi-banner {
        position: static; transform: none; width: auto;
        padding: 12px 0; border-radius: 0; box-shadow: none; border-top: 1px solid var(--border);
    }
    #main-intro .mi-banner-track {
        justify-content: flex-start; gap: 0; width: max-content;
        animation: miBannerFlow var(--mi-flow-dur, 22s) linear infinite;
    }
    #main-intro .mi-banner:hover .mi-banner-track,
    #main-intro .mi-banner:active .mi-banner-track { animation-play-state: paused; }
    /* 간격은 gap 대신 오른쪽 여백 — 원본·복제본 폭이 정확히 같아야 이음새가 안 보임 */
    #main-intro .mi-banner-item,
    #main-intro .mi-banner--flow .mi-banner-item { flex: 0 0 160px; margin-right: 10px; }
    #main-intro .mi-banner-item--clone { display: block; }
    /* 푸터 */
    footer .inner { grid-template-columns: 1fr; gap: 28px; }

    /* LNB */
    .lnb_wrapper { grid-template-columns: 1fr; }
    .lnb { display: none; }

    /* 스텝바 */
    .step-bar { padding-top: 20px; margin-bottom: 28px; }
    .step-bar .step-item { min-width: 0; }
    .step-bar .step-label { font-size: calc(10px * var(--fs-scale)); white-space: normal; word-break: keep-all; }

    /* 회원가입 */
    .signup-card { padding: 24px 20px; }
    .signup-row { grid-template-columns: 1fr; gap: 6px; }
    .signup-label { padding-top: 0; }
    .signup-sns-grid { grid-template-columns: 1fr; }
    .login-sns-grid { grid-template-columns: 1fr; }

    /* 로그인 — 좁은 화면에서는 카드 테두리 없이 화면을 꽉 채움 */
    .login-wrap { padding: 0; background: #fff; justify-content: flex-start; }
    .login-card {
        width: 100%; min-height: 100vh;
        padding: 32px 20px max(32px, calc(32px + env(safe-area-inset-bottom)));
        border: none; border-radius: 0; box-shadow: none;
    }

    /* 교육신청 랜딩 (기존) */
    .edu-landing-hero {padding-bottom: 120px}
    .edu-landing-hero h2 { font-size: calc(28px * var(--fs-scale)); }
    .edu-landing-hero p { font-size: calc(14px * var(--fs-scale)); }
    .info-grid { grid-template-columns: 1fr; }
    .week-schedule-item { grid-template-columns: 80px 1fr; grid-template-rows: auto auto; }
    .week-schedule-item .sch-apply { grid-column: 2; grid-row: 2; }
    .week-schedule-item .sch-date .date-day { font-size: calc(26px * var(--fs-scale)); }

    /* 랜딩 신규 */
    .week-sched-section { padding: 40px 0 16px; }
    .week-sched-head { flex-wrap: wrap; gap: 10px; }
    .week-sched-title { font-size: calc(22px * var(--fs-scale)); }
    .week-days { grid-template-columns: repeat(7, 1fr); gap: 4px; }
    .week-day-chip { padding: 10px 0; }
    .wdc-n { font-size: calc(16px * var(--fs-scale)); }
    .wdc-d { font-size: calc(9px * var(--fs-scale)); }
    .week-day-chip { padding: 10px 0; }
    .week-day-meta { flex-wrap: wrap; gap: 10px; }
    .week-cards { grid-template-columns: 1fr; }
    .week-card-title { min-height: auto; }

    .info-sections-section { padding: 28px 0 56px; }
    .info-section-item { grid-template-columns: 1fr; grid-template-rows: auto; gap: 12px; padding: 20px; }
    .info-section-num { font-size: calc(20px * var(--fs-scale)); }

    /* 신청 스텝 */
    .apply-content { padding: 16px 0 48px; }
    .apply-two-col { grid-template-columns: 1fr; gap: 16px; }
    .apply-summary--sticky { position: static; }
    .apply-foot { flex-direction: column-reverse; }
    .apply-foot .btn-ghost, .apply-foot .btn-blue { width: 100%; justify-content: center; }

    .apply-tabs { grid-template-columns: 1fr; gap: 8px; }
    .apply-cal-scroll-hint { display: flex; align-items: center; gap: 5px; font-size: calc(11px * var(--fs-scale)); color: var(--fg3); margin-bottom: 6px; justify-content: center; }
    .apply-cal-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .apply-cal-grid { min-width: 480px; }
    .apply-cal-cell { min-height: 64px; padding: 4px; }
    .apply-cal-cell:not(:has(.apply-cal-pill)) { background: var(--gray-50); }
    .apply-cal-cell:not(:has(.apply-cal-pill)) .cal-num { color: var(--gray-300); }
    .apply-cal-pill { min-width: 72px; }
    .apply-cal-day-head { padding: 6px 0; font-size: calc(11px * var(--fs-scale)); }

    .apply-course-title { font-size: calc(20px * var(--fs-scale)); }
    .apply-detail-grid { grid-template-columns: 1fr; }
    .apply-kv:nth-child(even) { border-right: 1px solid var(--border); }
    .apply-kv { border-right: none; }

    .apply-field-grid { grid-template-columns: 1fr; }
    .apply-field-grid--2col { grid-template-columns: 1fr; }
    .apply-strip { padding: 16px 20px; }
    .apply-strip-right { gap: 16px; }
    .apply-section { padding: 20px 16px; }

    .apply-pay-methods { grid-template-columns: repeat(2, 1fr); }

    .apply-complete { padding: 40px 16px; }
    .apply-complete-card { padding: 28px 20px 20px; }
    .apply-complete-title { font-size: calc(22px * var(--fs-scale)); }
    .apply-complete-actions { flex-direction: column; }
}

/* ==========================================================================
   마이페이지 공통 (cf-* / mp-* / cert-* / dl-table)
   ========================================================================== */

/* ── 래퍼 & 공통 패널 ── */
.cf-wrap  { padding: 32px 32px 80px; flex: 1; }
.mp-wrap  { padding: 24px 32px 80px; flex: 1; }

.cf-panel {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
}
.cf-panel-head {
    padding: 18px 24px;
    border-bottom: 1px solid var(--border);
    display: flex;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
    gap: 8px;
}
.cf-panel-title { font-size: calc(15px * var(--fs-scale)); font-weight: 700; margin: 0; }
.cf-panel-filters { display: flex; gap: 8px; }
.cf-panel-note   { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); }
/* 패널 빈 상태 — 표가 아닌 카드·그리드 영역 (표 안은 .nt-td-empty) */
.cf-empty {
    margin: 0; padding: 48px 16px; text-align: center;
    font-size: calc(14px * var(--fs-scale)); color: var(--fg3);
    background: var(--gray-50); border-radius: var(--radius-md);
}

/* 기간 검색 필터 바 */
.cf-filter-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    flex-wrap: wrap;
    padding: 12px 20px;
    background: var(--gray-50);
    border-bottom: 1px solid var(--border);
}
.cf-filter-date-range { display: flex; align-items: center; gap: 6px; }
/* input 태그 선택자로 common.css 전역 input 스타일 무력화 (select 규격과 통일) */
input.cf-filter-date {
    height: 34px;
    flex: none;
    padding: 0 10px;
    border: 1px solid var(--border-strong);
    border-radius: 6px;
    font-family: inherit;
    font-size: calc(12px * var(--fs-scale)) !important;
    color: var(--fg1);
    background: #fff;
    width: 140px;
}
input.cf-filter-date:focus { border-color: var(--brand-primary); outline: none; box-shadow: 0 0 0 3px var(--brand-primary-100); }
.cf-filter-date-sep { font-size: calc(13px * var(--fs-scale)); color: var(--fg3); }

/* 필터 바 내부 그룹 행 (선택 그룹 / 검색+버튼 그룹을 각각 한 줄로 고정) */
.cf-filter-row { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; width: 100%; }
.cf-filter-row--search .cf-search-input { flex: 1 1 220px; }

/* ── 탭 네비게이션 ── */
.cf-tabs {
    display: flex;
    gap: 2px;
    margin-bottom: 20px;
    border-bottom: 1px solid var(--border);
    overflow-y: hidden;
}
.cf-tab {
    padding: 14px 24px;
    background: transparent;
    border: none;
    border-bottom: 3px solid transparent;
    font-family: inherit;
    font-size: calc(15px * var(--fs-scale));
    font-weight: 600;
    color: var(--fg3);
    cursor: pointer;
    margin-bottom: -1px;
    text-decoration: none;
    transition: color var(--dur-base) var(--ease-std), border-color var(--dur-base) var(--ease-std);
}
.cf-tab:hover { color: var(--fg1); text-decoration: none; }
.cf-tab--active {
    color: var(--brand-primary);
    border-bottom-color: var(--brand-primary);
}

/* ── select 필터 ── */
.cf-select {
    height: 34px;
    padding: 0 10px;
    border: 1px solid var(--border-strong);
    border-radius: 6px;
    font-family: inherit;
    font-size: calc(12px * var(--fs-scale));
    background: #fff;
    cursor: pointer;
}

/* ── 텍스트 검색어 필터 ── */
/* input 태그 선택자로 common.css 전역 input(width:100%, radius:0, font-size!important) 무력화 */
input.cf-search-input {
    height: 34px;
    flex: 0 1 220px;
    min-width: 160px;
    padding: 0 10px;
    border: 1px solid var(--border-strong);
    border-radius: 6px;
    font-family: inherit;
    font-size: calc(12px * var(--fs-scale)) !important;
    background: #fff;
}
input.cf-search-input:focus { border-color: var(--brand-primary); outline: none; box-shadow: 0 0 0 3px var(--brand-primary-100); }

/* ── 테이블 ── */
.cf-table-wrap { overflow-x: auto; }
.cf-table {
    width: 100%;
    border-collapse: collapse;
    font-size: calc(13px * var(--fs-scale));
}
.cf-table thead tr { border-bottom: 2px solid var(--border); }
.cf-table th {
    padding: 12px 16px;
    text-align: left;
    font-size: calc(12px * var(--fs-scale));
    font-weight: 700;
    color: var(--fg3);
    white-space: nowrap;
}
.cf-table tbody tr {
    border-bottom: 1px solid var(--border);
    transition: background var(--dur-base);
}
.cf-table tbody tr:last-child { border-bottom: none; }
.cf-table tbody tr:hover { background: var(--gray-50); }
.cf-tr-clickable { cursor: pointer; }
.cf-table td { padding: 14px 16px; font-size: calc(13px * var(--fs-scale)); vertical-align: middle; }
.cf-td-num  { font-variant-numeric: tabular-nums; }
/* 결제 금액 칸 — 금액과 [결제정보] 버튼을 한 줄로 */
.cf-pay-line { display: inline-flex; align-items: center; gap: 8px; white-space: nowrap; }
.cf-td-bold { font-weight: 600; }
.cf-td-muted { color: var(--fg3); }
.cf-td-link       { color: inherit; text-decoration: none; }
.cf-td-link:hover { color: var(--brand-primary); text-decoration: underline; }

/* ── 작은 버튼 ── */
.cf-tiny-btn {
    padding: 6px 12px;
    border: 1px solid var(--border-strong);
    background: #fff;
    border-radius: 4px;
    font-family: inherit;
    font-size: calc(12px * var(--fs-scale));
    font-weight: 600;
    color: var(--fg2);
    cursor: pointer;
    transition: background var(--dur-base), color var(--dur-base);
    white-space: nowrap;
}
.cf-tiny-btn:hover { background: var(--gray-50); color: var(--fg1); }
/* 링크로 쓰는 경우 (접수확인증 등 새 창 출력) — 버튼과 같은 모양 유지 */
a.cf-tiny-btn { display: inline-flex; align-items: center; text-decoration: none; }
a.cf-tiny-btn:hover { text-decoration: none; }
/* 작업 칸 — 버튼이 줄바꿈되지 않도록 폭 확보 */
.cf-th-act { width: 210px; }
.cf-td-act .cf-act-btns { display: flex; gap: 6px; flex-wrap: nowrap; }
/* 교육 일시 · 장소 통합 칸 — 장소는 아래 줄에 보조 표기 */
.cf-td-place { margin-top: 2px; color: var(--fg3); font-size: calc(12px * var(--fs-scale)); }
.cf-tiny-btn--danger { color: var(--danger) !important; border-color: var(--danger); }
.cf-tiny-btn--danger:hover { background: var(--danger); color: #fff!important; }

/* 환불 행 */
.cf-tr-refund td { opacity: 0.65; }
.cf-td-refund-amt { color: var(--danger, #d9534f); }
.cf-td-refund-amt s { text-decoration-color: var(--danger, #d9534f); }
.cf-refund-info { display: flex; flex-direction: column; align-items: flex-start; gap: 3px; }
.cf-refund-date { font-size: calc(11px * var(--fs-scale)); color: var(--fg3); }


/* ── 이수증 카드 그리드 ── */
.cert-grid {
    padding: 20px;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
}
.cert-card {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 10px;
    overflow: hidden;
    box-shadow: var(--shadow-xs);
}
.cert-card-header {
    background: linear-gradient(135deg, rgb(0, 63, 142), rgb(0, 36, 82));
    padding: 18px 24px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.cert-card-label {
    font-size: calc(11px * var(--fs-scale));
    font-weight: 700;
    letter-spacing: 0.12em;
    color: rgba(255, 255, 255, 0.7);
}
.cert-card-icon { height: 26px; filter: brightness(0) invert(1); opacity: 0.9; }
.cert-card-body { padding: 22px 24px; }
.cert-card-id   { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); margin-bottom: 4px; }
.cert-card-name {
    font-size: calc(18px * var(--fs-scale));
    font-weight: 700;
    margin: 0 0 6px;
    letter-spacing: -0.01em;
}
.cert-card-meta { font-size: calc(13px * var(--fs-scale)); color: var(--fg2); margin-bottom: 20px; }
.cert-card-info {
    display: flex;
    flex-direction: column;
    gap: 8px;
    padding: 14px 16px;
    background: var(--gray-50);
    border-radius: 6px;
    font-size: calc(13px * var(--fs-scale));
}
.cert-card-info-row { display: flex; align-items: center; gap: 8px; }
.cert-card-key { color: var(--fg3); font-size: calc(12px * var(--fs-scale)); min-width: 64px; }
.cert-card-val { color: var(--fg1); font-weight: 600; }
.cert-card-btns {
    display: flex;
    gap: 8px;
    margin-top: 18px;
}
.cert-card-btn-preview { flex: 1; }
.cert-card-btn-dl      { flex: 1; }

/* 미발급·발송완료 상태 카드 */
.cert-card--dimmed .cert-card-header {
    background: linear-gradient(135deg, #6b7280, #4b5563);
}
.cert-sent-badge {
    display: flex;
    align-items: center;
    gap: 5px;
    font-size: calc(11px * var(--fs-scale));
    font-weight: 600;
    color: rgba(255,255,255,0.9);
    letter-spacing: 0.01em;
}
.cert-sent-badge i { font-size: calc(13px * var(--fs-scale)); color: #86efac; }
.cert-card-notice {
    display: flex;
    align-items: center;
    gap: 8px;
    margin-top: 18px;
    padding: 10px 14px;
    background: var(--gray-50);
    border-radius: 6px;
    font-size: calc(12px * var(--fs-scale));
    color: var(--fg3);
}
.cert-card-notice + .cert-card-notice { margin-top: 8px; }
.cert-card-notice--sent { color: var(--brand-primary); background: var(--brand-primary-50); display: flex;  }
.cert-card-notice--sent i { color: var(--brand-primary); }
.cert-card-reissue { margin-left: auto }

/* 이수증 미리보기 모달 (modal/cert_detail.php) */
.cert-wrap { padding: 24px 20px; border: 1px solid var(--gray-900); background: #fff; }
.cert-sheet-header { text-align: center; margin-bottom: 16px; }
.cert-sheet-title { font-size: calc(18px * var(--fs-scale)); font-weight: 800; color: var(--fg1); }
.cert-sheet-table { width: 100%; border-collapse: collapse; margin-bottom: 20px; }
.cert-sheet-table td { border: 1px solid var(--gray-300); padding: 8px 10px; font-size: calc(13px * var(--fs-scale)); }
.cert-sheet-section { width: 70px; background: var(--gray-50); font-weight: 700; color: var(--fg2); text-align: center; }
.cert-sheet-key { width: 84px; background: var(--gray-50); font-weight: 700; color: var(--fg2); }
.cert-sheet-val { color: var(--fg1); }
.cert-sheet-body-text { text-align: center; font-size: calc(12px * var(--fs-scale)); line-height: 1.8; margin: 0 0 20px; color: var(--fg2); }
.cert-sheet-issue-date { text-align: center; font-size: calc(13px * var(--fs-scale)); margin-bottom: 22px; }
.cert-sheet-sign { text-align: center; }
.cert-sheet-sign img { max-width: 260px; width: 100%; }

/* 재발급 모달 */
.reissue-course-info {
    padding: 20px 24px;
    background: var(--gray-50);
    border-bottom: 1px solid var(--border);
}
.reissue-course-label { font-size: calc(11px * var(--fs-scale)); font-weight: 600; color: var(--fg3); margin-bottom: 4px; }
.reissue-course-name  { font-size: calc(16px * var(--fs-scale)); font-weight: 700; color: var(--fg1); margin-bottom: 2px; }
.reissue-course-id    { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); }

/* ── definition list 테이블 (모달 공통) ── */
.dl-table {
    width: 100%;
    border-collapse: collapse;
    font-size: calc(13px * var(--fs-scale));
    border: 1px solid var(--border);
    border-radius: 6px;
    overflow: hidden;
}
.dl-key {
    width: 120px;
    padding: 12px 16px;
    background: var(--gray-50);
    border-bottom: 1px solid var(--border);
    border-right: 1px solid var(--border);
    color: var(--fg3);
    font-weight: 600;
    font-size: calc(12px * var(--fs-scale));
    vertical-align: middle;
}
.dl-val {
    padding: 12px 16px;
    border-bottom: 1px solid var(--border);
    color: var(--fg1);
    font-weight: 500;
    vertical-align: middle;
}
.dl-val--amount { font-weight: 700; font-variant-numeric: tabular-nums; }
.dl-val--num    { font-variant-numeric: tabular-nums; }

/* ── 모달 내부 콘텐츠 공통 ── */
.modal-head {
    padding: 20px 24px;
    background: var(--gray-50);
    border-bottom: 1px solid var(--border);
}
.modal-sub-id      { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); margin-bottom: 6px; font-variant-numeric: tabular-nums; }
.modal-course-name { font-size: calc(18px * var(--fs-scale)); font-weight: 700; margin: 0; letter-spacing: -0.01em; }
.modal-status-wrap { margin-top: 10px; }
.modal-section     { padding: 24px; }
.modal-section-title {
    font-size: calc(13px * var(--fs-scale));
    font-weight: 700;
    color: var(--fg2);
    margin-bottom: 10px;
}
.modal-section-title--gap { margin-top: 24px; }

/* ── 영수증 모달 ── */
.receipt-top {
    padding: 28px 28px 22px;
    text-align: center;
    border-bottom: 1px dashed var(--border-strong);
}
.receipt-top-label { font-size: calc(11px * var(--fs-scale)); letter-spacing: 0.2em; color: var(--fg3); font-weight: 700; }
.receipt-top-title { font-size: calc(22px * var(--fs-scale)); font-weight: 800; color: var(--fg1); margin: 8px 0 4px; letter-spacing: -0.01em; }
.receipt-top-meta  { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); font-variant-numeric: tabular-nums; }
.receipt-body      { padding: 22px 28px; }
.receipt-price-row {
    margin-top: 18px;
    padding: 16px 18px;
    background: var(--gray-50);
    border-radius: 8px;
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.receipt-price-item   { text-align: center; }
.receipt-price-label  { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); margin-bottom: 2px; }
.receipt-price-val    { font-size: calc(13px * var(--fs-scale)); font-variant-numeric: tabular-nums; color: var(--fg2); }
.receipt-total-row {
    margin-top: 12px;
    padding: 18px;
    background: var(--brand-primary-50);
    border-radius: 8px;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.receipt-total-label { font-size: calc(13px * var(--fs-scale)); font-weight: 700; color: var(--fg1); }
.receipt-total-amt   { font-size: calc(22px * var(--fs-scale)); font-weight: 800; color: var(--brand-primary); font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.receipt-note        { margin-top: 18px; text-align: center; font-size: calc(11px * var(--fs-scale)); color: var(--fg3); line-height: 1.7; }
/* 안내문 내 강조 박스 (처리 소요기간 등) */
.receipt-note-em {
    display: block; margin-top: 10px; padding: 9px 12px;
    background: var(--brand-primary-50); border: 1px solid var(--brand-primary-100);
    border-radius: 6px; color: var(--brand-primary); font-weight: 700;
    font-size: calc(12px * var(--fs-scale)); line-height: 1.6;
}

/* ── 마이페이지 좌측 nav 레이아웃 ── */
.mp-layout {
    display: grid;
    grid-template-columns: 220px 1fr;
    gap: 24px;
    max-width: var(--inner-user);
    margin: 0 auto;
}
.mp-nav {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 8px;
    height: fit-content;
    overflow: hidden;
}
.mp-profile {
    padding: 24px 16px;
    background: var(--brand-primary-50);
    border-bottom: 1px solid var(--border);
    text-align: center;
}
.mp-avatar {
    width: 54px;
    height: 54px;
    border-radius: 999px;
    background: var(--brand-primary);
    color: #fff;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-weight: 800;
    font-size: calc(20px * var(--fs-scale));
}
.mp-profile-name { font-size: calc(15px * var(--fs-scale)); font-weight: 700; margin-top: 10px; }
.mp-profile-sub  { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); margin-top: 2px; }
.mp-nav-list     { padding: 8px; }
.mp-nav-item {
    display: block;
    padding: 11px 14px;
    border-radius: 6px;
    font-size: calc(14px * var(--fs-scale));
    color: var(--fg2);
    font-weight: 500;
    text-decoration: none;
    transition: background var(--dur-base), color var(--dur-base);
}
.mp-nav-item:hover { background: var(--gray-50); color: var(--fg1); text-decoration: none; }
.mp-nav-item--active {
    background: var(--brand-primary-50);
    color: var(--brand-primary);
    font-weight: 700;
}
.mp-nav-item--group { cursor: default; }
.mp-nav-item--group:hover { background: var(--brand-primary-50); }

/* 사이드 서브탭 (정보수정 하위) */
.mp-nav-sub {
    display: block;
    width: 100%;
    text-align: left;
    padding: 10px 14px;
    border: none;
    background: none;
    border-radius: 6px;
    font-size: calc(13px * var(--fs-scale));
    color: var(--fg2);
    cursor: pointer;
    transition: background var(--dur-base), color var(--dur-base);
}
.mp-nav-sub:hover { background: var(--gray-50); color: var(--fg1); }
.mp-nav-sub--active { color: var(--brand-primary); font-weight: 600; background: var(--brand-primary-50); }

/* ── 정보수정 폼 ── */
/* 정보수정 탭 메뉴 */
.mp-tab-nav {
    display: flex;
    gap: 0;
    border-bottom: 2px solid var(--border);
    margin-bottom: 20px;
    overflow-x: auto;
}
.mp-tab-btn {
    padding: 10px 18px;
    font-size: calc(14px * var(--fs-scale));
    font-weight: 500;
    color: var(--fg2);
    background: none;
    border: none;
    border-bottom: 2px solid transparent;
    margin-bottom: -2px;
    cursor: pointer;
    white-space: nowrap;
    transition: color var(--dur-base), border-color var(--dur-base);
}
.mp-tab-btn:hover { color: var(--fg1); }
.mp-tab-btn--active { color: var(--brand-primary); border-bottom-color: var(--brand-primary); font-weight: 700; }
.mp-tab-panel { display: none; }
.mp-tab-panel--active { display: block; }
.mp-info-divider { border: none; border-top: 1px solid var(--border); margin: 20px 0; grid-column: span 2; }

.mp-info-form { padding: 24px; }
.mp-info-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px;
}
.mp-info-grid--3col { grid-template-columns: 1fr 1fr 1fr; }
.mp-info-field        { display: flex; flex-direction: column; gap: 6px; }
.mp-info-field--full  { grid-column: span 2; }
.mp-field-label       { font-size: calc(13px * var(--fs-scale)); font-weight: 600; color: var(--fg2); }
.mp-field-input {
    height: fit-content!important;
    border: 1px solid var(--border-strong)!important;
    border-radius: 6px!important;
    font-family: inherit;
    font-size: calc(14px * var(--fs-scale)) !important;
    color: var(--fg1);
    background: #fff;
    transition: border-color var(--dur-base);
}
.mp-field-input:focus { outline: none; border-color: var(--brand-primary)!important; }
select.mp-field-input { height: 44px; }
.mp-info-actions { margin-top: 20px; display: flex; gap: 8px; }

/* 면허정보 등록 — 면허별 카드 */
.mp-license-item      { border: 1px solid var(--border); border-radius: 8px; padding: 16px; margin-bottom: 16px; }
.mp-license-item-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.mp-license-item-title{ font-size: calc(14px * var(--fs-scale)); font-weight: 700; color: var(--fg1); }
.mp-license-main-label{ display: flex; align-items: center; gap: 8px; }
.mp-license-main-hint { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); font-weight: 400; }
.mp-license-img-opt   { font-size: calc(12px * var(--fs-scale)); color: var(--fg3); font-weight: 400; }
.mp-license-img-area {
    border: 1px dashed var(--border-strong); border-radius: 8px;
    min-height: 130px; display: flex; align-items: center; justify-content: center;
    cursor: pointer; overflow: hidden; transition: border-color var(--dur-base);
}
.mp-license-img-area:hover { border-color: var(--brand-primary); background: var(--brand-primary-100); }
.mp-license-img-placeholder {
    display: flex; flex-direction: column; align-items: center; gap: 6px;
    color: var(--fg3); font-size: calc(13px * var(--fs-scale)); pointer-events: none;
}
.mp-license-img-placeholder i { font-size: calc(26px * var(--fs-scale)); color: var(--fg3); }
.mp-license-img-hint { font-size: calc(11px * var(--fs-scale)); color: var(--fg3); }
.mp-license-img-preview { width: 100%; max-height: 220px; object-fit: contain; display: block; pointer-events: none; }
.mp-license-img-remove {
    margin-top: 6px; font-size: calc(12px * var(--fs-scale)); color: var(--fg3);
    background: none; border: none; cursor: pointer; padding: 0;
    display: flex; align-items: center; gap: 4px;
}
.mp-license-img-remove:hover { color: var(--danger); }
.mp-license-img-placeholder[hidden],
.mp-license-img-preview[hidden],
.mp-license-img-remove[hidden] { display: none; }
input.mp-license-img-input[hidden] { display: none; }
.mp-license-img-field { margin-bottom: 18px; }

/* ── 면허 종류 엔트리 (사진 1장에 여러 면허 종류가 있을 수 있어 카드 내부에 반복) ── */
.mp-license-entries { margin-top: 10px; }
.mp-license-entry {
    border: 1px solid var(--border); border-radius: 8px;
    padding: 14px; margin-bottom:6px; background: var(--gray-50);
}
.mp-license-entry:last-of-type { margin-bottom: 16px; }
.mp-license-entry-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.mp-license-entry-add-btn { width: 100%; border-style: dashed; margin-bottom: 16px; }
.btn-h44 { height: 44px; padding: 0 24px; }

/* ── cf-wrap inner max-width ── */
.cf-wrap .inner,
.mp-wrap .inner { max-width: var(--inner-user); margin: 0 auto; }

/* ==========================================================================
   마이페이지 반응형
   ========================================================================== */

/* 1400px */
@media (max-width: 1400px) {
    .cert-grid { grid-template-columns: repeat(2, 1fr); }
}

/* 1024px (태블릿) */
@media (max-width: 1024px) {
    .cf-wrap  { padding: 24px 24px 60px; }
    .mp-wrap  { padding: 20px 24px 60px; }

    .cf-tabs  { overflow-x: auto; white-space: nowrap; gap: 0; }
    .cf-tab   { padding: 12px 18px; font-size: calc(14px * var(--fs-scale)); }

    .cf-table th,
    .cf-table td { padding: 10px 12px; }

    .cert-grid { grid-template-columns: repeat(2, 1fr); gap: 12px; }
    .cert-card-name { font-size: calc(15px * var(--fs-scale)); }

    .mp-layout { grid-template-columns: 180px 1fr; gap: 16px; }
    .mp-info-grid { grid-template-columns: 1fr 1fr; gap: 12px; }
}

/* 768px (모바일) */
@media (max-width: 768px) {
    .cf-wrap  { padding: 16px 0px 48px; }
    .mp-wrap  { padding: 16px 16px 48px; }

    .cf-tabs  { gap: 0; }
    .cf-tab   { padding: 10px 14px; font-size: calc(13px * var(--fs-scale)); }

    .cf-panel-head { flex-direction: column; align-items: flex-start; }
    .cf-panel-filters { width: 100%; }
    .cf-select { flex: 1; }
    input.cf-search-input { min-width: 0; flex: 1 1 160px; }
    .cf-filter-bar { gap: 6px; }
    .cf-filter-date-range { width: 100%; }
    input.cf-filter-date { flex: 1; width: auto; }

    /* 테이블 → 카드형 */
    .cf-table-wrap { overflow-x: visible; border-bottom: none; padding: 16px }
    .cf-table,
    .cf-table tbody,
    .cf-table tbody tr,
    .cf-table tbody td { display: block; }
    .cf-table thead { display: none; }
    .cf-table tbody tr {
        background: #fff;
        border: 1px solid var(--border);
        border-radius: 10px;
        padding: 6px 16px;
        margin-bottom: 10px;
    }
    .cf-table tbody tr:hover { background: #fff; }
    .cf-table tbody tr:last-child { border-bottom: 1px solid var(--border); }
    .cf-table tbody td {
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 9px 0;
        border-bottom: 1px solid var(--border);
        font-size: calc(13px * var(--fs-scale));
    }
    .cf-table tbody td:last-child { border-bottom: none; }
    .cf-table tbody td::before {
        content: attr(data-label);
        font-size: calc(11px * var(--fs-scale));
        font-weight: 600;
        color: var(--fg3);
        flex-shrink: 0;
        margin-right: 8px;
    }
    .cf-td-course { text-align: right; }

    /* 이수증 카드 — 1열 */
    .cert-grid { grid-template-columns: 1fr; padding: 16px; }
    .cert-card-btn-preview,
    .cert-card-btn-dl { flex: 1 1 calc(50% - 4px); }

    /* 마이페이지 — 세로 스택 */
    .mp-layout { grid-template-columns: 1fr; }
    .mp-nav    { position: static; }
    .mp-profile { padding: 16px; }
    .mp-nav-list { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; padding: 10px; }
    .mp-nav-item { flex: 1 1 auto; text-align: center; padding: 9px 10px; font-size: calc(13px * var(--fs-scale)); }

    .mp-info-grid { grid-template-columns: 1fr; }
    .mp-info-field--full { grid-column: span 1; }

    /* 모달 */
    .modal-section  { padding: 16px; }
}

/* ── 정책 페이지 (개인정보처리방침·이용약관) ── */
.policy-wrap { padding: 48px 0 80px; }

.policy-doc {
    max-width: 800px;
    margin: 0 auto;
    background: #fff;
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    padding: 48px;
}

.policy-updated {
    font-size: calc(13px * var(--fs-scale));
    color: var(--fg3);
    margin-bottom: 32px;
    padding-bottom: 20px;
    border-bottom: 1px solid var(--border);
}

.policy-section { margin-bottom: 36px; }
.policy-section:last-child { margin-bottom: 0; }

.policy-section-title {
    font-size: calc(15px * var(--fs-scale));
    font-weight: 700;
    color: var(--fg1);
    margin-bottom: 12px;
    padding-left: 10px;
    border-left: 3px solid var(--brand-primary);
}

.policy-section p {
    font-size: calc(13px * var(--fs-scale));
    color: var(--fg2);
    line-height: 1.9;
    margin-bottom: 10px;
}
.policy-section p:last-child { margin-bottom: 0; }

.policy-list {
    list-style: none;
    padding: 0;
    margin: 8px 0 10px;
}
.policy-list li {
    font-size: calc(13px * var(--fs-scale));
    color: var(--fg2);
    line-height: 1.9;
    padding-left: 14px;
    position: relative;
}
.policy-list li::before {
    content: "·";
    position: absolute;
    left: 4px;
    color: var(--fg3);
}

.policy-table-wrap { overflow-x: auto; margin: 12px 0; }
.policy-table {
    width: 100%;
    border-collapse: collapse;
    font-size: calc(13px * var(--fs-scale));
}
.policy-table th,
.policy-table td {
    padding: 10px 14px;
    border: 1px solid var(--border);
    text-align: left;
    line-height: 1.6;
}
.policy-table th {
    background: var(--gray-50);
    font-weight: 600;
    color: var(--fg2);
}
.policy-table td { color: var(--fg2); }

.policy-contact-box {
    background: var(--gray-50);
    border: 1px solid var(--border);
    border-radius: var(--radius-md);
    padding: 16px 20px;
    margin-top: 12px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.policy-contact-row { display: flex; gap: 16px; font-size: calc(13px * var(--fs-scale)); }
.policy-contact-key { min-width: 140px; color: var(--fg3); font-weight: 600; }
.policy-contact-val { color: var(--fg2); }

@media (max-width: 768px) {
    .policy-doc { padding: 24px 20px; }
    .policy-contact-key { min-width: 100px; }
}

/* ── 크럼스 구분자 ── */
.page-head .crumbs a { color: var(--fg3); }
.page-head .crumbs a:hover { color: var(--brand-primary); }
.crumbs-sep { color: var(--fg3); opacity: 0.5; font-size: calc(11px * var(--fs-scale)); }

/* ── 공지사항 게시판 ── */
.nt-wrap { padding: 32px 0 80px; }

.nt-panel {
    background: #fff;
    border: 1px solid var(--border);
    border-radius: 8px;
    overflow: hidden;
}

/* 패널 헤더 */
.nt-panel-head {
    padding: 18px 24px;
    border-bottom: 1px solid var(--border);
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 12px;
    flex-wrap: wrap;
}
.nt-panel-title { font-size: calc(15px * var(--fs-scale)); font-weight: 700; margin: 0; color: var(--fg1); }
.nt-panel-title-sub { font-size: calc(12px * var(--fs-scale)); font-weight: 500; color: var(--fg3); margin-left: 8px; }

/* 검색폼 */
.nt-search-form { display: flex; gap: 6px; align-items: center; flex-wrap: wrap; }
.nt-search-form select.nt-select {
    height: 36px;
    padding: 0 10px;
    border: 1px solid var(--border-strong);
    border-radius: 6px;
    font-size: calc(13px * var(--fs-scale));
    background: #fff;
    width: auto;
}
.nt-search-input {
    height: 36px !important;
    padding: 0 12px !important;
    border: 1px solid var(--border-strong) !important;
    border-radius: 6px !important;
    font-size: calc(13px * var(--fs-scale)) !important;
    width: 220px;
    background: #fff !important;
}
.nt-search-input:hover { border-bottom: 1px solid var(--border-strong) !important; }
.nt-search-btn {
    height: 36px;
    padding: 0 16px;
    border: none;
    background: var(--brand-primary);
    color: #fff;
    border-radius: 6px;
    font-size: calc(13px * var(--fs-scale));
    font-weight: 600;
    cursor: pointer;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    white-space: nowrap;
}
.nt-search-btn:hover { background: var(--brand-primary-700); }

/* 테이블 */
.nt-table { width: 100%; border-collapse: collapse; font-size: calc(13px * var(--fs-scale)); }
.nt-table th {
    padding: 10px 12px;
    background: var(--gray-50);
    border-bottom: 1px solid var(--border);
    font-weight: 600;
    color: var(--fg2);
    text-align: left;
    white-space: nowrap;
}
.nt-table td {
    padding: 13px 12px;
    border-bottom: 1px solid var(--border);
    color: var(--fg2);
    vertical-align: middle;
}
.nt-table tbody tr:last-child td { border-bottom: none; }
.nt-tr { cursor: pointer; }
.nt-tr:hover td { background: var(--gray-50); }

.nt-col-no    { width: 70px; }
.nt-col-type  { width: 80px; }
.nt-col-author { width: 120px; }
.nt-col-date  { width: 110px; }
.nt-col-views { width: 80px; }

.nt-th-center { text-align: center !important; }
.nt-th-right  { text-align: right !important; padding-right: 20px !important; }

.nt-td-center       { text-align: center; }
.nt-td-right        { text-align: right; padding-right: 20px; }
.nt-td-muted        { color: var(--fg3); }
.nt-td-title        { font-weight: 500; }
.nt-td-title-pinned { font-weight: 700; }
.nt-td-empty        { text-align: center !important; padding: 60px 16px !important; color: var(--fg3); }

.nt-pin-icon  { color: var(--brand-accent); font-size: calc(11px * var(--fs-scale)); }
.nt-new-badge {display: inline-block;margin-left: 8px;padding: 1px 6px!important;font-size: calc(8px * var(--fs-scale));font-weight: 800;background: var(--brand-accent);color: #fff;border-radius: 3px;vertical-align: middle;letter-spacing: 0;}

/* 상세 뷰 */
.nt-view-head { padding: 28px 32px 22px; border-bottom: 1px solid var(--border); }
.nt-view-head-type { margin-bottom: 12px; }
.nt-view-title {
    font-size: calc(22px * var(--fs-scale));
    font-weight: 700;
    margin: 0 0 14px;
    letter-spacing: -0.01em;
    line-height: 1.4;
    color: var(--fg1);
}
.nt-view-meta { display: flex; gap: 20px; font-size: calc(12px * var(--fs-scale)); color: var(--fg3); flex-wrap: wrap; }
.nt-view-meta span { display: inline-flex; align-items: center; gap: 4px; }
.nt-view-body {
    padding: 36px 32px 48px;
    font-size: calc(14px * var(--fs-scale));
    line-height: 1.85;
    color: var(--fg1);
    min-height: 240px;
}
.nt-view-body img { max-width: 100%; }
.nt-view-body table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.nt-view-body table tbody { display: table; width: 100%; }

/* 첨부파일 */
.nt-attach-wrap { padding: 0 32px 24px; }
.nt-attach-box {
    padding: 14px 18px;
    background: var(--gray-50);
    border: 1px solid var(--border);
    border-radius: 6px;
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.nt-attach-label { font-size: calc(12px * var(--fs-scale)); font-weight: 700; color: var(--fg3); letter-spacing: 0.04em; }
.nt-attach-link {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    font-size: calc(13px * var(--fs-scale));
    color: var(--brand-primary);
    font-weight: 500;
}
.nt-attach-link:hover { text-decoration: underline; color: var(--brand-primary); }

/* 이전/다음 */
.nt-prev-next { border-top: 1px solid var(--border); }
.nt-pn-row {
    display: grid;
    grid-template-columns: 110px 1fr 120px;
    align-items: center;
    padding: 16px 32px;
    font-size: calc(13px * var(--fs-scale));
    gap: 16px;
    border-bottom: 1px solid var(--border);
    cursor: pointer;
    transition: background var(--dur-base);
}
.nt-pn-row:last-child { border-bottom: none; }
.nt-pn-row:hover:not(.nt-pn-row--disabled) { background: var(--gray-50); }
.nt-pn-row--disabled { cursor: default; }
.nt-pn-label { font-size: calc(12px * var(--fs-scale)); font-weight: 700; color: var(--fg3); letter-spacing: 0.02em; white-space: nowrap; }
.nt-pn-title { color: var(--fg1); font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nt-pn-title--empty { color: var(--fg3); }
.nt-pn-date { color: var(--fg3); font-size: calc(12px * var(--fs-scale)); text-align: right; white-space: nowrap; }

/* 목록으로 버튼 */
.nt-actions { display: flex; justify-content: flex-end; margin-top: 16px; gap: 8px; }

/* ── 공지사항 반응형 ── */
@media (max-width: 1024px) {
    .nt-search-input { width: 160px; }
    .nt-col-author { width: 90px; }
}

@media (max-width: 768px) {
    .nt-wrap { padding: 20px 0 60px; }
    .nt-panel-head { flex-direction: column; align-items: flex-start; }
    .nt-search-form { width: 100%; }
    .nt-search-input { flex: 1; width: auto; min-width: 0; }

    /* 테이블 — 작성자·날짜 숨김 */
    .nt-col-author, .nt-col-date, .nt-col-views { width: auto; }
    .nt-table .nt-td-muted:nth-child(4),
    .nt-table .nt-td-muted:nth-child(5),
    .nt-table th:nth-child(4),
    .nt-table th:nth-child(5) { display: none; }
    .nt-col-views { display: none; }
    .nt-table th:last-child,
    .nt-table .nt-td-right { display: none; }

    /* 상세 뷰 */
    .nt-view-head { padding: 20px 20px 16px; }
    .nt-view-title { font-size: calc(17px * var(--fs-scale)); }
    .nt-view-meta { gap: 12px; }
    .nt-view-body { padding: 24px 20px 36px; }
    .nt-attach-wrap { padding: 0 20px 20px; }
    .nt-pn-row { grid-template-columns: 80px 1fr; padding: 14px 20px; }
    .nt-pn-date { display: none; }
}

/* ==========================================================================
   모집예정 / 관심예정
   ========================================================================== */

.upcoming-cards {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    margin-top: 32px;
}
.upcoming-cards--panel {
    margin-top: 0;
    padding: 24px;
}
.upcoming-card-foot {
    margin-top: 16px;
    padding-top: 14px;
    border-top: 1px solid var(--border);
}
.btn-interest {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    font-size: calc(13px * var(--fs-scale));
    font-weight: 600;
    color: var(--brand-accent);
    background: #fff0f4;
    border: 1px solid var(--brand-accent);
    border-radius: var(--radius-pill);
    padding: 6px 16px;
    cursor: pointer;
    font-family: inherit;
    transition: background 0.2s, color 0.2s;
    width: 100%;
}
.btn-interest:hover,
.btn-interest.active {
    background: var(--brand-accent);
    color: #fff;
}

/* 패널 헤더 내 알림 토글 */
.interest-notify-toggle-wrap {
    display: flex; align-items: center; gap: 10px;
}
.interest-notify-label {
    display: flex; align-items: center; gap: 6px;
    font-size: calc(13px * var(--fs-scale)); color: var(--fg2); white-space: nowrap;
}
.interest-notify-label i { color: var(--fg3); }

/* 카드 하단 버튼 영역 */
.interest-card-foot {
    display: flex; gap: 8px;
}

/* 관심해제 버튼 */
.btn-interest-cancel {
    flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 5px;
    font-size: calc(13px * var(--fs-scale)); font-weight: 600; color: var(--fg3);
    background: var(--gray-50); border: 1px solid var(--border-strong);
    border-radius: var(--radius-md); padding: 8px 0;
    cursor: pointer; font-family: inherit; transition: all 0.2s;
}
.btn-interest-cancel:hover { color: var(--danger); border-color: var(--danger); background: var(--danger-bg); }

/* 신청하기 버튼 */
.btn-interest-apply {
    flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 5px;
    font-size: calc(13px * var(--fs-scale)); border-radius: var(--radius-md); padding: 8px 0; text-decoration: none;
}

/* 신청마감 버튼 */
.btn-interest-closed {
    flex: 1; display: inline-flex; align-items: center; justify-content: center; gap: 5px;
    font-size: calc(13px * var(--fs-scale)); font-weight: 600; color: var(--fg3);
    background: var(--gray-100); border: 1px solid var(--border);
    border-radius: var(--radius-md); padding: 8px 0;
    cursor: not-allowed; font-family: inherit;
}

/* 알림 토글 행 */
.upcoming-notify-row {
    display: flex; align-items: center; justify-content: space-between; gap: 8px;
}
.upcoming-notify-label {
    display: flex; align-items: center; gap: 6px;
    font-size: calc(13px * var(--fs-scale)); color: var(--fg2); cursor: default; flex: 1;
}
.upcoming-notify-label i { color: var(--fg3); }

/* 토글 스위치 */
.upcoming-toggle {
    position: relative; width: 44px; height: 24px; flex-shrink: 0;
    background: var(--gray-200); border: none; border-radius: 99px;
    cursor: pointer; transition: background 0.2s; padding: 0;
}
.upcoming-toggle.on { background: var(--brand-primary); }
.upcoming-toggle-thumb {
    position: absolute; top: 3px; left: 3px;
    width: 18px; height: 18px; background: #fff;
    border-radius: 50%; transition: left 0.2s;
    box-shadow: 0 1px 3px rgba(0,0,0,0.2);
}
.upcoming-toggle.on .upcoming-toggle-thumb { left: 23px; }

/* 모집중 행 */
.upcoming-open-row {
    display: flex; flex-direction: column; gap: 10px;
}
.upcoming-open-badge {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: calc(13px * var(--fs-scale)); font-weight: 600; color: var(--brand-primary);
}
.btn-upcoming-apply {
    display: flex; align-items: center; justify-content: center; gap: 6px;
    width: 100%; padding: 10px 0; font-size: calc(14px * var(--fs-scale)); border-radius: var(--radius-md);
    text-decoration: none;
}

/* 마감 행 */
.upcoming-closed-row {
    display: flex; align-items: center; gap: 6px;
    font-size: calc(13px * var(--fs-scale)); font-weight: 600; color: var(--fg3);
    padding: 6px 0;
}

@media (max-width: 1024px) {
    .upcoming-cards { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 640px) {
    .upcoming-cards { grid-template-columns: 1fr; }
}

/* ==========================================================================
   플로팅 버튼 그룹 (건사협홈 + 카카오톡 상담)
   ========================================================================== */

/* 고정 래퍼 — 두 버튼을 세로로 묶어 위치 관리 */
.float-group {
    position: fixed;
    left: 24px;
    bottom: 40px;
    z-index: 900;
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
}

/* 건사협홈 바로가기 버튼 */
.assoc-home-float {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    width: 60px;
    padding: 12px 0 10px;
    background: #003087;
    border-radius: 16px;
    color: #fff!important;
    font-size: calc(10px * var(--fs-scale));
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
    box-shadow: 0 4px 16px rgba(0,0,0,0.18);
    transition: transform 0.2s, box-shadow 0.2s;
}
.assoc-home-float:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(0,0,0,0.22);
    color: #fff;
    text-decoration: none;
}
.assoc-home-float img {
    width: 28px;
    height: auto;
}

/* 카카오톡 상담 버튼 */
.kakao-float {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 5px;
    width: 60px;
    padding: 12px 0 10px;
    background: #FEE500;
    border-radius: 16px;
    color: #3A1D1D;
    font-size: calc(10px * var(--fs-scale));
    font-weight: 700;
    line-height: 1.4;
    text-align: center;
    text-decoration: none;
    box-shadow: 0 4px 16px rgba(0,0,0,0.18);
    transition: transform 0.2s, box-shadow 0.2s;
}
.kakao-float:hover {
    transform: translateY(-3px);
    box-shadow: 0 8px 24px rgba(0,0,0,0.22);
    color: #3A1D1D;
    text-decoration: none;
}
.kakao-float i {
    font-size: calc(24px * var(--fs-scale));
    color: #3A1D1D;
}

@media (max-width: 768px) {
    .float-group {
        left: 16px;
        bottom: max(72px, calc(72px + env(safe-area-inset-bottom)));
        gap: 10px;
    }
    .assoc-home-float {
        width: 52px;
        padding: 10px 0 8px;
    }
    .assoc-home-float img { width: 24px; }
    .kakao-float {
        width: 52px;
        padding: 10px 0 8px;
    }
    .kakao-float i { font-size: calc(20px * var(--fs-scale)); }
}

/* ==========================================================================
   사이트 팝업 (Swiper)
   ========================================================================== */

.site-popup-overlay {
    display: none;
    position: fixed;
    inset: 0;
    background: rgba(0,0,0,0.55);
    z-index: 1100;
}
.site-popup-overlay.open { display: block; }

/* 팝업 컨테이너 */
.site-popup {
    display: none;
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    z-index: 1101;
    width: min(480px, calc(100vw - 32px));
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 12px 48px rgba(0,0,0,0.32);
}
.site-popup.open { display: block; }

/* X 닫기 버튼 */
.site-popup-x {
    position: absolute;
    top: 10px;
    right: 10px;
    z-index: 10;
    width: 32px;
    height: 32px;
    border-radius: 50%;
    background: rgba(0,0,0,0.45);
    color: #fff;
    border: none;
    font-size: calc(16px * var(--fs-scale));
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s;
}
.site-popup-x:hover { background: rgba(0,0,0,0.7); }

/* 슬라이드 이미지 */
.site-popup-swiper { width: 100%; background: #f0f0f0; }
.site-popup-swiper img {
    width: 100%;
    height: auto;
    display: block;
}
.site-popup-swiper a { display: block; }

/* 좌우 네비게이션 바 */
.site-popup-nav {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 8px 14px;
    background: #222;
}
.site-popup-nav-btn {
    width: 32px;
    height: 32px;
    border: none;
    background: rgba(255,255,255,0.12);
    color: #fff;
    border-radius: 6px;
    font-size: calc(14px * var(--fs-scale));
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background 0.15s;
    flex-shrink: 0;
}
.site-popup-nav-btn:hover { background: rgba(255,255,255,0.28); }
.site-popup-nav-count {
    font-size: calc(13px * var(--fs-scale));
    color: rgba(255,255,255,0.75);
    letter-spacing: 0.03em;
}

/* 하단 푸터 */
.site-popup-foot {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 11px 16px;
    background: #f8f8f8;
    border-top: 1px solid #e8e8e8;
}

/* 오늘 하루 보지 않기 — 커스텀 체크박스 */
.site-popup-skip {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: calc(13px * var(--fs-scale));
    color: #555;
    cursor: pointer;
    user-select: none;
}
.site-popup-chk { position: relative; display: inline-flex; }
.site-popup-chk input[type="checkbox"] {
    position: absolute;
    opacity: 0;
    width: 0;
    height: 0;
}
.site-popup-chk-box {
    width: 17px;
    height: 17px;
    border: 1.5px solid #bbb;
    border-radius: 4px;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: border-color 0.15s, background 0.15s;
    flex-shrink: 0;
}
.site-popup-chk-box::after {
    content: '';
    display: none;
    width: 5px;
    height: 9px;
    border: 2px solid #fff;
    border-top: none;
    border-left: none;
    transform: rotate(45deg) translateY(-1px);
}
.site-popup-chk input[type="checkbox"]:checked ~ .site-popup-chk-box {
    background: var(--brand-primary, #003087);
    border-color: var(--brand-primary, #003087);
}
.site-popup-chk input[type="checkbox"]:checked ~ .site-popup-chk-box::after {
    display: block;
}

/* 닫기 텍스트 버튼 */
.site-popup-dismiss {
    font-size: calc(13px * var(--fs-scale));
    color: #888;
    background: none;
    border: none;
    cursor: pointer;
    padding: 4px 2px;
    text-decoration: underline;
    text-underline-offset: 2px;
    transition: color 0.15s;
}
.site-popup-dismiss:hover { color: #333; }

@media (max-width: 480px) {
    .site-popup { border-radius: 8px; }
    .site-popup-foot { padding: 9px 14px; }
    .site-popup-skip { font-size: calc(12px * var(--fs-scale)); }
    .site-popup-dismiss { font-size: calc(12px * var(--fs-scale)); }
}

/* ===== 스텝1: 교육지역 검색 ===== */
.apply-section-title {
    display: flex; align-items: center; gap: 8px;
    font-size: calc(18px * var(--fs-scale)); font-weight: 800; letter-spacing: -0.01em;
    color: var(--fg1); margin: 28px 0 12px;
}
.apply-section-title::before {
    content: ""; width: 10px; height: 10px;
    background: var(--brand-primary);
}
.apply-section-title-sub { font-size: calc(13px * var(--fs-scale)); font-weight: 600; color: var(--fg3); }

/* 지역 검색 카드 (지도 + 검색 패널) */
.region-search {
    display: grid; grid-template-columns: 1fr 550px; gap: 32px; align-items: stretch;
    background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg);
    padding: 28px; margin-bottom: 8px;
}
.region-search-map {
    position: relative;
    display: flex; flex-direction: column;
    background: var(--gray-50); border: 1px solid var(--border);
    border-radius: var(--radius-lg); padding: 16px 18px;
}

/* 지도 상단 헤더 (뒤로가기/타이틀/단계 뱃지) */
.region-map-header { display: flex; align-items: center; gap: 8px; margin-bottom: 8px; }
.region-map-back {
    display: inline-flex; align-items: center; gap: 4px;
    background: var(--gray-50); border: 1px solid var(--border);
    border-radius: var(--radius-md); padding: 4px 10px;
    font-size: calc(12px * var(--fs-scale)); font-weight: 600; color: var(--fg2);
    font-family: inherit; cursor: pointer;
    transition: background var(--dur-base) var(--ease-std);
}
.region-map-back:hover { background: var(--gray-100); }
.region-map-title { font-size: calc(15px * var(--fs-scale)); font-weight: 700; color: var(--fg1); }
.region-map-depth {
    margin-left: auto; font-size: calc(11px * var(--fs-scale)); font-weight: 700;
    padding: 3px 10px; border-radius: var(--radius-pill);
    background: var(--brand-primary-100); color: var(--brand-primary);
}

/* 브레드크럼 (전국 > 시·도) */
/* 지도 아래에 위치 — 구분선을 위쪽에 둬서 지도와 칩 목록을 가름 */
.region-map-breadcrumb {
    display: flex; align-items: center; gap: 6px; flex-wrap: wrap;
    font-size: calc(12px * var(--fs-scale)); color: var(--fg3); min-height: 18px;
    margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); margin-bottom: 10px;
}
.region-map-breadcrumb .crumb { color: var(--brand-primary-500); font-weight: 600; cursor: pointer; }
.region-map-breadcrumb .crumb:hover { text-decoration: underline; }
.region-map-breadcrumb .now { color: var(--fg1); font-weight: 700; }
.region-map-breadcrumb .sep { color: var(--gray-300); }

/* D3 지도 렌더링 영역 */
.region-map-container {
    min-height: 300px; flex: 1;
    display: flex; flex-direction: column; justify-content: center;
}
.region-map-svg { width: 100%; height: auto; display: block; }

/* 시·도 / 시·군·구 path */
/* 지도 배경이 --gray-50이라 100·50단계는 배경과 구분되지 않음 — 한 단계씩 진하게 */
.rm-sido {
    fill: var(--brand-primary-300); stroke: #fff; stroke-width: 1.2;
    cursor: pointer; transition: fill var(--dur-base) var(--ease-std);
}
.rm-sido:hover,
.rm-sido.hl { fill: var(--brand-primary-500); } /* .hl = 칩에 마우스를 올렸을 때 */
.rm-sido.sel { fill: var(--brand-primary); }
.rm-sigungu {
    fill: var(--brand-primary-100); stroke: #fff; stroke-width: 0.8;
    cursor: pointer; transition: fill var(--dur-base) var(--ease-std);
}
.rm-sigungu:hover,
.rm-sigungu.hl { fill: var(--brand-primary-300); }
/* 활성(act) = 클릭으로 고른 상태, 확정 전 — 확정(sel)과 구분되게 테두리로 표시 */
.rm-sido.act, .rm-sigungu.act {
    fill: var(--brand-primary-300); stroke: var(--brand-primary); stroke-width: 2;
}
.rm-sigungu.sel { fill: var(--brand-primary-500); }

/* 선택 확정 말풍선 — 활성 지역 위에 떠서 [선택하기]를 받음 */
.region-map-pick {
    /* 헤더(--z-nav)보다 낮게 — 같은 값이면 DOM 순서상 말풍선이 헤더를 덮음 */
    position: absolute; z-index: 10;
    transform: translate(-50%, calc(-100% - 8px));
    display: flex; align-items: center; gap: 8px;
    padding: 6px 8px 6px 12px;
    background: #fff; border: 1px solid var(--brand-primary);
    border-radius: var(--radius-pill); box-shadow: var(--shadow-md);
    white-space: nowrap;
}
.region-map-pick::after { /* 말풍선 꼬리 */
    content: ''; position: absolute; top: 100%; left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent; border-top-color: var(--brand-primary);
}
.region-map-pick-name { font-size: calc(13px * var(--fs-scale)); font-weight: 700; color: var(--fg1); }
.region-map-pick-btn {
    height: 30px; padding: 0 12px; border: none; border-radius: var(--radius-pill);
    background: var(--brand-primary); color: #fff;
    font-family: inherit; font-size: calc(13px * var(--fs-scale)); font-weight: 700; cursor: pointer;
}
.region-map-pick-btn:hover { background: var(--brand-primary-700); }

/* 지역 칩 — 지도에 다 못 넣는 이름을 크게 노출하고 선택까지 담당 (지도와 양방향 강조) */
.region-chip-list {
    display: flex; flex-wrap: wrap; gap: 5px;
    /* 구분선은 바로 위 브레드크럼이 담당 */
}
.region-chip {
    height: 30px; padding: 0 11px;
    border: 1px solid var(--border-strong); border-radius: var(--radius-pill);
    background: #fff; color: var(--fg1);
    font-family: inherit; font-size: calc(13px * var(--fs-scale)); font-weight: 600;
    white-space: nowrap; cursor: pointer;
    transition: background var(--dur-base) var(--ease-std),
                border-color var(--dur-base) var(--ease-std),
                color var(--dur-base) var(--ease-std);
}
.region-chip:hover,
.region-chip.hl { border-color: var(--brand-primary); background: var(--brand-primary-50); color: var(--brand-primary); }
/* 활성 = 확정 전 (말풍선 [선택하기] 대기) */
.region-chip.act { border-color: var(--brand-primary); background: var(--brand-primary-100); color: var(--brand-primary); }
.region-chip.sel { background: var(--brand-primary); border-color: var(--brand-primary); color: #fff; }

/* 지역명 라벨 */
/* 배경색이 진해져 선택·호버 상태에서 글자가 묻히므로 흰 테두리로 바탕과 분리 */
.region-map-label {
    font-size: calc(9px * var(--fs-scale)); fill: var(--fg1);
    text-anchor: middle; dominant-baseline: middle;
    pointer-events: none; user-select: none;
    font-family: var(--font-sans);
    paint-order: stroke; stroke: #fff; stroke-width: 2.5px; stroke-linejoin: round;
}
/* 지도 로딩 / 오류 */
.region-map-loading {
    display: flex; align-items: center; justify-content: center; gap: 10px;
    height: 300px; color: var(--fg3); font-size: calc(13px * var(--fs-scale));
}
.region-map-spinner {
    width: 18px; height: 18px; border-radius: 50%;
    border: 2px solid var(--gray-200); border-top-color: var(--brand-primary);
    animation: region-map-spin 0.7s linear infinite;
}
@keyframes region-map-spin { to { transform: rotate(360deg); } }
.region-map-error {
    display: flex; align-items: center; justify-content: center; text-align: center;
    height: 300px; color: var(--fg3); font-size: calc(13px * var(--fs-scale)); line-height: 1.7;
}

/* 지역명 툴팁 */
.region-map-tooltip {
    position: fixed; display: none; z-index: var(--z-toast);
    background: rgba(17, 19, 24, 0.85); color: #fff;
    padding: 5px 11px; border-radius: var(--radius-md);
    font-size: calc(12px * var(--fs-scale)); white-space: nowrap; pointer-events: none;
}

/* 검색 패널 */
/* 우측 지도·칩이 길어 스크롤하면 검색 조건이 화면에서 사라짐 — PC에서는 따라오게 고정
   온라인·지역 두 패널을 감싼 묶음 하나를 고정 (패널마다 따로 붙으면 서로 겹침)
   align-self: start가 없으면 그리드가 높이를 늘려(stretch) 붙을 여유가 사라짐 */
.region-search-side { position: sticky; top: 90px; align-self: start; }
.region-search-panel {
    display: flex; flex-direction: column; justify-content: center; gap: 14px;
}
/* 온라인 교육 년·월 — 짧은 값이라 폭을 줄임 */
.region-select.region-select--ym { flex: 0 0 auto; width: 130px; }
.region-search-panel h3 {
    font-size: calc(21px * var(--fs-scale)); font-weight: 800; letter-spacing: -0.02em;
    color: var(--brand-primary); margin: 0;
}
/* 제목 바로 아래 설명은 붙여서 한 덩어리로 (패널 gap 14px 상쇄) */
.region-search-panel h3 + p { margin-top: -10px; }
/* 온라인(남색) / 교육지역(밝은 파랑) — 제목·검색 버튼 색으로 두 검색을 구분 */
.region-search-panel--offline h3 { color: var(--brand-primary-500); }
.region-search-panel--offline .btn-blue { background-color: var(--brand-primary-500); }
.region-search-panel--offline .btn-blue:hover { background-color: var(--brand-primary-700); }
.region-search-panel p { margin: 0 0 8px; font-size: calc(14px * var(--fs-scale)); color: var(--fg2); line-height: 1.7; }
.region-search-field { display: flex; align-items: center; gap: 14px; }
.region-search-field label { width: 60px; font-size: calc(14px * var(--fs-scale)); font-weight: 700; color: var(--fg1); flex: none; }
.region-select {
    flex: 1; max-width: 300px; height: 42px; padding: 0 12px;
    border: 1px solid var(--border-strong); border-radius: var(--radius-md)!important;
    font-family: inherit; font-size: calc(14px * var(--fs-scale)) !important; background: #fff; cursor: pointer;
}
.region-select:focus { border-color: var(--brand-primary); box-shadow: 0 0 0 3px var(--brand-primary-100); outline: none; }
/* 검색 버튼: 셀렉트 컬럼(라벨 60px + 간격 14px)에 맞춰 정렬 */
.region-search-btn {
    align-self: flex-start; margin-left: 74px;
    width: 100%; max-width: 300px;
}
/* 파란 검색 버튼은 한 단계 크게 (전체 지역 보기 등 보조 버튼은 그대로) */
.region-search-btn.btn-blue { height: 50px; font-size: calc(16px * var(--fs-scale)); font-weight: 700; }

/* 교육 개설 요청 안내 링크 */
.region-request-hint {
    margin: auto 0 0!important; font-size: calc(12px * var(--fs-scale)); color: var(--fg3);
}
.region-request-link {
    display: inline-flex; align-items: center; gap: 4px;
    background: none; border: none; padding: 0; margin-left: 2px;
    font-family: inherit; font-size: calc(12px * var(--fs-scale)); font-weight: 700;
    color: var(--brand-primary); text-decoration: underline; cursor: pointer;
}

/* 교육장 목록 */
.region-result { margin-bottom: 8px; }
.region-center-list { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.region-center-card {
    background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg);
    padding: 18px 20px;
}
.region-center-card-head { display: flex; align-items: center; gap: 8px; margin-bottom: 6px; }
.region-center-name { font-size: calc(15px * var(--fs-scale)); font-weight: 700; color: var(--fg1); }
.region-center-count {
    font-size: calc(11px * var(--fs-scale)); font-weight: 700; color: var(--brand-primary);
    background: var(--brand-primary-100); border-radius: var(--radius-pill);
    padding: 2px 9px;
}
.region-center-addr { font-size: calc(13px * var(--fs-scale)); color: var(--fg3); margin-bottom: 10px; }
.region-center-next {
    display: flex; align-items: center; gap: 6px;
    font-size: calc(13px * var(--fs-scale)); color: var(--fg2);
    border-top: 1px dashed var(--border); padding-top: 10px;
}
.region-center-next i { color: var(--brand-primary); }

/* 인근 지역 교육 */
.region-nearby { margin-top: 14px; }
.region-nearby-head {
    display: flex; align-items: center; gap: 8px; flex-wrap: wrap;
    background: var(--warning-bg); color: var(--warning);
    font-size: calc(13px * var(--fs-scale)); font-weight: 600;
    border-radius: var(--radius-md); padding: 12px 16px; margin-bottom: 12px;
}
.region-nearby-request-btn {
    margin-left: auto;
    display: inline-flex; align-items: center; gap: 6px;
    background: #fff; border: 1px solid var(--warning); border-radius: var(--radius-md);
    padding: 6px 12px; font-family: inherit; font-size: calc(12px * var(--fs-scale)); font-weight: 700;
    color: var(--warning); cursor: pointer; flex: none;
    transition: background var(--dur-base) var(--ease-std);
}
.region-nearby-request-btn:hover { background: var(--warning-bg); }
.region-nearby .region-center-card { border-style: dashed; }

/* 교육 개설 요청 모달 */
.region-request-desc { margin: 0 0 16px; font-size: calc(13px * var(--fs-scale)); color: var(--fg2); line-height: 1.7; }
.region-request-select-pair { display: flex; gap: 8px; }
.region-request-select-pair .apply-input { flex: 1; min-width: 0; }
.region-request-agree { margin-top: 16px; }

/* 달력 지역 필터 결과 없음 */
.apply-cal-empty {
    text-align: center; font-size: calc(14px * var(--fs-scale)); color: var(--fg3);
    background: var(--gray-50); border-radius: var(--radius-md);
    padding: 28px 16px; margin-bottom: 14px;
}

@media screen and (max-width: 1024px) {
    .region-search { grid-template-columns: 340px 1fr; gap: 24px; padding: 24px; }
}

@media screen and (max-width: 768px) {
    .region-search { grid-template-columns: 1fr; gap: 20px; padding: 18px; }
    .region-search-map {margin: 0 auto; width: 100%; }
    /* 1단 배치라 붙일 대상이 없음 — 고정 해제 */
    .region-search-side { position: static; align-self: auto; }
    /* 좁은 화면에서는 년·월이 한 줄을 나눠 씀 */
    .region-select.region-select--ym { flex: 1; width: auto; min-width: 0; }
    .region-search-panel h3 { font-size: calc(20px * var(--fs-scale)); }
    .region-search-btn { align-self: stretch; width: 100%; max-width: none; margin-left: 0; }
    .region-select { max-width: none; }
    .region-request-hint { margin-left: 0; }
    .region-center-list { grid-template-columns: 1fr; }
    .region-request-select-pair { flex-direction: column; }
    .apply-section-title { font-size: calc(16px * var(--fs-scale)); margin-top: 24px; }
}

/* ===== 단체 교육신청 ===== */

/* 히어로 아웃라인 버튼 (단체신청 진입) */
.btn-hero-outline {
    display: inline-flex; align-items: center; gap: 8px;
    background: rgba(255,255,255,0.08); color: #fff;
    border: 1px solid rgba(255,255,255,0.45);
    border-radius: var(--radius-md); font-weight: 700;
    transition: all var(--dur-base) var(--ease-std);
}
.btn-hero-outline:hover { background: rgba(255,255,255,0.18); border-color: #fff; color: #fff; text-decoration: none; }

/* 개인/단체 전환 배너 */
.apply-switch-banner {
    display: flex; align-items: center; gap: 8px;
    background: var(--brand-primary-50); border: 1px solid var(--brand-primary-100);
    border-radius: var(--radius-md); padding: 12px 16px; margin-bottom: 16px;
    font-size: calc(13px * var(--fs-scale)); color: var(--fg2);
}
.apply-switch-banner i { color: var(--brand-primary); }
.apply-switch-link { margin-left: auto; font-size: calc(13px * var(--fs-scale)); font-weight: 700; color: var(--brand-primary); white-space: nowrap; }
.apply-switch-link:hover { text-decoration: underline; }

/* 면허증 문자전송 선택 토글 (체크시 강조) */
.apply-sms-toggle {
    display: flex; align-items: center; gap: 10px;
    border: 1px solid var(--border-strong); border-radius: var(--radius-md);
    padding: 12px 16px; background: #fff; cursor: pointer;
    font-size: calc(13px * var(--fs-scale)); color: var(--fg2);
    transition: border-color var(--dur-base), background var(--dur-base);
}
.apply-sms-toggle:hover { border-color: var(--brand-primary-300); }
.apply-sms-toggle-check { width: 18px; height: 18px; flex-shrink: 0; accent-color: var(--brand-primary); }
.apply-sms-toggle-icon { font-size: calc(16px * var(--fs-scale)); color: var(--fg3); flex-shrink: 0; }
.apply-sms-toggle--active {
    border-color: var(--brand-primary); background: var(--brand-primary-50);
}
.apply-sms-toggle--active .apply-sms-toggle-icon { color: var(--brand-primary); }
.apply-sms-toggle--active .apply-sms-toggle-text { color: var(--fg1); }

/* 대면/비대면 라디오 */
.apply-radio-row { display: flex; align-items: center; gap: 18px; min-height: 42px; }
.apply-radio {
    display: inline-flex; align-items: center; gap: 6px;
    font-size: calc(14px * var(--fs-scale)); color: var(--fg1); cursor: pointer;
}
.apply-radio input { accent-color: var(--brand-primary); }

/* 명단 일괄 업로드 */
.group-upload-row {
    background: var(--gray-50); border: 1px dashed var(--border-strong);
    border-radius: var(--radius-md); padding: 16px 18px;
}
.group-upload-desc { margin: 0 0 12px; font-size: calc(13px * var(--fs-scale)); color: var(--fg2); line-height: 1.7; }

/* 신청 인원 명단 테이블 */
.group-roster-wrap { overflow-x: auto; }
.group-roster { width: 100%; border-collapse: collapse; min-width: 760px; }
.group-roster th {
    background: var(--gray-50); font-size: calc(12px * var(--fs-scale)); font-weight: 700; color: var(--fg2);
    padding: 9px 6px; text-align: center;
    border-top: 1px solid var(--border-strong); border-bottom: 1px solid var(--border);
    white-space: nowrap;
}
.group-roster td { padding: 5px 3px; border-bottom: 1px solid var(--border); vertical-align: middle; }
.group-roster .gr-col-no { width: 44px; }
.group-roster .gr-col-del { width: 40px; }
.group-roster .gr-no { text-align: center; font-size: calc(13px * var(--fs-scale)); font-weight: 600; color: var(--fg3); }
.gr-input { height: 36px; padding: 8px; font-size: calc(13px * var(--fs-scale)); width: 100%; }
.gr-select { cursor: pointer; }
.gr-del-cell { text-align: center; }
.gr-del-btn {
    width: 26px; height: 26px; border: none; border-radius: var(--radius-sm);
    background: none; color: var(--gray-400); cursor: pointer; font-size: calc(13px * var(--fs-scale));
    transition: all var(--dur-base) var(--ease-std);
}
.gr-del-btn:hover { background: var(--danger-bg); color: var(--danger); }
.group-add-btn { margin-top: 10px; width: 100%; border-style: dashed; }
.gr-person tr:nth-child(2) td { border-bottom: 2px solid var(--border-strong); }
.gr-error-row .gr-error-cell {
    background: var(--danger-bg); color: var(--danger);
    font-size: calc(12px * var(--fs-scale)); padding: 7px 10px; text-align: left;
}
.gr-error-cell i { margin-right: 3px; }
.gr-error-cell i:not(:first-child) { margin-left: 10px; }

/* ===== 마이페이지: 단체 관리 ===== */

/* 페이지 헤더 단체대표 뱃지 */
.gp-head-badge {
    display: inline-flex; align-items: center; gap: 5px; vertical-align: middle;
    margin-left: 8px; padding: 4px 12px; border-radius: var(--radius-pill);
    background: var(--brand-primary-100); color: var(--brand-primary);
    font-size: calc(12px * var(--fs-scale)); font-weight: 700;
}

/* 성과 요약 카드 */
.gp-stats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 20px; }
.gp-stat {
    background: #fff; border: 1px solid var(--border); border-radius: var(--radius-lg);
    padding: 18px 20px;
}
.gp-stat--accent { border-color: var(--brand-primary-300); background: var(--brand-primary-50); }
.gp-stat-label { font-size: calc(12px * var(--fs-scale)); font-weight: 600; color: var(--fg3); margin-bottom: 6px; }
.gp-stat-value {
    font-size: calc(26px * var(--fs-scale)); font-weight: 800; color: var(--fg1);
    letter-spacing: -0.02em; font-variant-numeric: tabular-nums;
}
.gp-stat--accent .gp-stat-value { color: var(--brand-primary); }
.gp-stat-value span { font-size: calc(14px * var(--fs-scale)); font-weight: 600; color: var(--fg3); margin-left: 2px; }
.gp-stat-bar { height: 6px; background: var(--brand-primary-100); border-radius: var(--radius-pill); margin-top: 10px; overflow: hidden; }
.gp-stat-bar-fill { height: 100%; background: var(--brand-primary); border-radius: var(--radius-pill); }


@media screen and (max-width: 768px) {
    .gp-stats { grid-template-columns: 1fr 1fr; gap: 8px; }
    .gp-stat { padding: 14px 16px; }
    .gp-stat-value { font-size: calc(22px * var(--fs-scale)); }
    .apply-switch-banner { flex-wrap: wrap; }
    .apply-switch-link { margin-left: 0; }
}

/* ===== 발행 요청 (마이페이지) ===== */

/* 발행 종류 선택 라디오 */
.issue-type-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; margin-bottom: 18px; }
/* 실제 라디오는 숨기고 카드(issue-type-box)로 표시
   common.css의 [type="radio"]:disabled{opacity:.7}가 이겨 선택 불가 카드에 회색 네모가 드러나던 문제 — 비활성까지 같이 숨김 */
.issue-type input[type="radio"],
.issue-type input[type="radio"]:disabled { position: absolute; opacity: 0; width: 0; height: 0; margin: 0; pointer-events: none; }
.issue-type-box {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px;
    padding: 12px 6px; border: 1px solid var(--border); border-radius: var(--radius-md);
    font-size: calc(12px * var(--fs-scale)); font-weight: 600; color: var(--fg2); text-align: center;
    cursor: pointer; transition: all var(--dur-base) var(--ease-std);
}
.issue-type-box i { font-size: calc(16px * var(--fs-scale)); color: var(--fg3); }
.issue-type input:checked + .issue-type-box {
    border-color: var(--brand-primary); background: var(--brand-primary-50);
    color: var(--brand-primary); font-weight: 700;
}
.issue-type input:checked + .issue-type-box i { color: var(--brand-primary); }

/* 발행 입력 폼 */
.issue-input { font-size: calc(13px * var(--fs-scale)); width: 100%; }
.issue-textarea { height: auto; padding: 8px 10px; resize: vertical; }
.issue-account-row { display: flex; flex-direction: column; gap: 6px; }
.issue-radio-row { display: flex; align-items: center; gap: 16px; }

/* ===== 인쇄용 페이지 (영수증·환불요구서) ===== */
.prt-wrap{
    min-height: 100vh; background: var(--gray-100);
    padding: 24px 16px 48px;
}

/* 인쇄 툴바 */
.prt-wrap .toolbar {
    max-width: 720px; margin: 0 auto 16px;
    display: flex; align-items: center; justify-content: space-between; gap: 10px;
}
.prt-wrap .toolbar-title { font-size: calc(16px * var(--fs-scale)); font-weight: 700; color: var(--fg1); }
.prt-wrap .toolbar-title i { color: var(--brand-primary); margin-right: 4px; }
.prt-wrap .toolbar-actions { display: flex; gap: 8px; }

/* 인쇄 시트 공통 */
.prt-wrap .sheet {
    max-width: 720px; margin: 0 auto;
    background: #fff; border: 1px solid var(--gray-900);
    padding: 56px 48px; box-shadow: var(--shadow-md);
    color: #111; line-height: 1.6;
}
.prt-wrap .stamp-img, .cert-preview-wrap .stamp-img {
    width: 52px; height: 52px; object-fit: contain;
    margin-left: -14px; vertical-align: middle;
    mix-blend-mode: multiply;
}

/* ── 영수증 ── */
/* 인쇄 오류 화면 — 문장형 타이틀이라 receipt-title의 자간 스타일과 별도 */
.prt-wrap .error-icon { display: block; text-align: center; font-size: calc(36px * var(--fs-scale)); color: var(--warning); margin-bottom: 12px; }
.prt-wrap .error-title { text-align: center; font-size: calc(22px * var(--fs-scale)); font-weight: 800; color: var(--fg1); margin: 0 0 16px; }

.prt-wrap .receipt-title {
    text-align: center; font-size: calc(30px * var(--fs-scale)); font-weight: 800;
    letter-spacing: 0.5em; text-indent: 0.5em; margin: 0 0 18px;
}
.prt-wrap .receipt-to { text-align: right; font-size: calc(15px * var(--fs-scale)); margin-bottom: 32px; }
.prt-wrap .receipt-table { width: 100%; border-collapse: collapse; margin-bottom: 36px; }
.prt-wrap .receipt-table th {
    width: 110px; padding: 16px 14px; font-size: calc(15px * var(--fs-scale)); font-weight: 700;
    background: var(--gray-50); border: 1px solid var(--gray-300); text-align: center;
}
.prt-wrap .receipt-table td { padding: 16px 18px; font-size: calc(15px * var(--fs-scale)); border: 1px solid var(--gray-300); }
.prt-wrap .receipt-table td.ta-c { text-align: center; }
.prt-wrap .receipt-confirm { text-align: center; font-size: calc(15px * var(--fs-scale)); margin: 0 0 28px; }
.prt-wrap .receipt-date { text-align: center; font-size: calc(15px * var(--fs-scale)); margin-bottom: 36px; }
.prt-wrap .receipt-org, .cert-preview-wrap .receipt-org {
    display: flex; align-items: center; justify-content: center; gap: 10px;
    font-size: calc(16px * var(--fs-scale)); font-weight: 700; margin-bottom: 8px;
}
.prt-wrap .org-logo, .cert-preview-wrap .org-logo { width: 34px; height: 34px; object-fit: contain; }
/* 접수확인증 — 협회명 아래 고유번호 한 줄 */
.prt-wrap .org-bizno { display: block; font-size: calc(13px * var(--fs-scale)); font-weight: 600; color: var(--fg2); }
.prt-wrap .receipt-regno { text-align: center; font-size: calc(14px * var(--fs-scale)); }

/* ── 환불요구서 ── */
.prt-wrap .refund-title {
    text-align: center; font-size: calc(22px * var(--fs-scale)); font-weight: 800;
    margin: 0 0 32px; letter-spacing: -0.01em;
}
.prt-wrap .refund-fields { list-style: none; margin: 0; padding: 0; }
.prt-wrap .refund-fields li { font-size: calc(14px * var(--fs-scale)); padding: 5px 0; }
.prt-wrap .rf-key { font-weight: 700; }
.prt-wrap .rf-half { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.prt-wrap .refund-reason { font-size: calc(14px * var(--fs-scale)); padding: 14px 0 22px; }
.prt-wrap .refund-body { font-size: calc(14px * var(--fs-scale)); margin: 0 0 26px; }
.prt-wrap .refund-proxy { border-top: 1px dashed var(--gray-300); padding-top: 18px; margin-bottom: 30px; }
.prt-wrap .refund-proxy-agree { font-size: calc(14px * var(--fs-scale)); font-weight: 700; margin: 0 0 10px; }
.prt-wrap .blank { border-bottom: 1px solid #111; }
.prt-wrap .chkbox { font-size: calc(16px * var(--fs-scale)); }
.prt-wrap .refund-date { text-align: center; font-size: calc(15px * var(--fs-scale)); margin-bottom: 24px; }
.prt-wrap .refund-org {
    text-align: center; font-size: calc(17px * var(--fs-scale)); font-weight: 800; margin-bottom: 36px;
}
.prt-wrap .refund-transfer { border: 1px solid var(--gray-900); padding: 20px 24px; margin-bottom: 14px; }
.prt-wrap .transfer-title {
    text-align: center; font-size: calc(18px * var(--fs-scale)); font-weight: 800;
    text-decoration: underline; text-underline-offset: 4px; margin: 0 0 14px;
}
.prt-wrap .refund-notice { font-size: calc(13px * var(--fs-scale)); font-weight: 700; margin: 0; }

/* 현금영수증 — 항목이 13행이라 영수증보다 글자를 한 단계 줄이고, 항목명(th)은 가장 긴 글자(총 거래금액)에 맞춰 한 줄 고정 */
.prt-wrap .sheet--cash .receipt-title { font-size: calc(24px * var(--fs-scale)); }
.prt-wrap .sheet--cash .receipt-to,
.prt-wrap .sheet--cash .receipt-confirm,
.prt-wrap .sheet--cash .receipt-date { font-size: calc(13px * var(--fs-scale)); }
.prt-wrap .sheet--cash .receipt-table th,
.prt-wrap .sheet--cash .receipt-table td { font-size: calc(13px * var(--fs-scale)); }
.prt-wrap .sheet--cash .receipt-table th { width: 1%; white-space: nowrap; }
.prt-wrap .sheet--cash .receipt-org { font-size: calc(14px * var(--fs-scale)); }


@media screen and (max-width: 768px) {
    .issue-type-grid { grid-template-columns: repeat(2, 1fr); }
    .prt-wrap .sheet { padding: 32px 20px; }
    .prt-wrap .toolbar { flex-direction: column; align-items: stretch; }
    .prt-wrap .toolbar-actions .btn { flex: 1; }
}

/* ===== 인쇄용: 세금계산서 (별지 제11호 서식) ===== */
.prt-wrap .toolbar--wide { max-width: 900px; }
.prt-wrap .tax-outer { max-width: 900px; margin: 0 auto; }
.prt-wrap .tax-form-label { font-size: calc(12px * var(--fs-scale)); color: #333; margin-bottom: 4px; }
.prt-wrap .tax-sheet {
    --tax-blue: #1b46a0;
    background: #fff; border: 2px solid var(--tax-blue);
    padding: 2px; box-shadow: var(--shadow-md);
    color: var(--tax-blue);
}
.prt-wrap .tax-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.prt-wrap .tax-table th, .prt-wrap .tax-table td {
    border: 1px solid var(--tax-blue); padding: 4px 6px;
    font-size: calc(12px * var(--fs-scale)); color: var(--tax-blue); text-align: center;
    word-break: keep-all; overflow: hidden;
}
.prt-wrap .tax-table th { font-weight: 700; }
.prt-wrap .tax-table .ta-l { text-align: left; }
.prt-wrap .tax-table .ta-r { text-align: right; }
.prt-wrap .tax-table .w40 { width: 40px; }
.prt-wrap .tax-table .w60 { width: 60px; }
.prt-wrap .tax-table .w70 { width: 70px; }
.prt-wrap .tax-table .w80 { width: 80px; }
.prt-wrap .tax-table .w90 { width: 90px; }
.prt-wrap .tax-table .w100 { width: 100px; }

/* 제목 행 */
.prt-wrap .tax-title {
    width: 34%; font-size: calc(30px * var(--fs-scale)); font-weight: 800;
    letter-spacing: 0.12em; text-align: left; padding-left: 14px;
}
.prt-wrap .tax-keep { width: 16%; font-size: calc(12px * var(--fs-scale)); }
.prt-wrap .tax-vol { display: inline-block; padding: 0 4px; }

/* 공급자/공급받는자 */
.prt-wrap .tax-side { width: 26px; padding: 2px; }
.prt-wrap .tax-side span { display: inline-block; font-size: calc(12px * var(--fs-scale)); line-height: 1.5; }
.prt-wrap .tax-party th { font-size: calc(11px * var(--fs-scale)); }
.prt-wrap .tax-party td { font-size: calc(11px * var(--fs-scale)); }
.prt-wrap .tax-regno { font-size: calc(14px * var(--fs-scale)); font-weight: 700; letter-spacing: 0.2em; }
.prt-wrap .tax-name { position: relative; }
.prt-wrap .tax-in {
    display: inline-block; width: 18px; height: 18px; line-height: 16px;
    border: 1px solid var(--tax-blue); border-radius: 50%;
    font-size: calc(9px * var(--fs-scale)); margin-left: 4px; opacity: 0.7;
}
.prt-wrap .tax-stamp {
    width: 30px; height: 30px; object-fit: contain;
    margin-left: 2px; vertical-align: middle;
    mix-blend-mode: multiply;
}

/* 작성/공급가액/세액 자릿수 */
.prt-wrap .tax-digit-head th { padding: 2px 1px; font-size: calc(10px * var(--fs-scale)); }
.prt-wrap .tax-digit-row td { padding: 4px 1px; font-size: calc(12px * var(--fs-scale)); font-weight: 600; }
.prt-wrap .tax-bigo-head { width: 68px; }

/* 품목 행 */
.prt-wrap .tax-items th { padding: 5px 4px; }
.prt-wrap .tax-items td { height: 30px; font-size: calc(12px * var(--fs-scale)); }

/* 합계 행 */
.prt-wrap .tax-foot th { padding: 5px 4px; }
.prt-wrap .tax-foot td { height: 28px; font-size: calc(12px * var(--fs-scale)); }
.prt-wrap .tax-receive { width: 22%; font-size: calc(13px * var(--fs-scale)); }
.prt-wrap .tax-receive strong { font-size: calc(14px * var(--fs-scale)); letter-spacing: 0.2em; }

@media print {
    .prt-wrap .tax-sheet { box-shadow: none; }
    .prt-wrap .tax-outer { max-width: none; }
}

@media screen and (max-width: 768px) {
    .prt-wrap .tax-outer { overflow-x: auto; }
    .prt-wrap .tax-sheet { min-width: 720px; }
}

/* ===== 인쇄용: 출석명부 (가로모드 인쇄) ===== */
.prt-wrap .toolbar--at { max-width: 1200px; }
/* 출력 화면 정렬 안내 — 화면 전용 (인쇄 블록에서 숨김) */
.prt-wrap .at-print-guide {
    max-width: 1200px; margin: 0 auto 12px; padding: 10px 14px;
    background: #fff; border: 1px solid var(--brand-primary-100); border-left: 3px solid var(--brand-primary);
    border-radius: 6px; font-size: calc(12px * var(--fs-scale)); color: var(--fg2);
}
.prt-wrap .at-print-guide i { color: var(--brand-primary); margin-right: 4px; }
.prt-wrap .at-print-guide b { color: var(--fg1); }
.prt-wrap .at-outer { max-width: 1200px; margin: 0 auto; }
.prt-wrap .at-sheet {
    page: prt-at-landscape;
    background: #fff; border: 1px solid var(--gray-900);
    padding: 32px 28px; box-shadow: var(--shadow-md);
    color: #111;
}
@page prt-at-landscape { size: landscape; margin: 10mm; }
.prt-wrap .at-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.prt-wrap .at-table th, .prt-wrap .at-table td {
    border: 1px solid var(--gray-400); padding: 5px 0;
    font-size: calc(11px * var(--fs-scale)); text-align: center; word-break: keep-all; vertical-align: middle;
    line-height: 1;
}
.prt-wrap .at-table th { background: var(--gray-100); font-weight: 700; }
/* 문서 헤더 — 엑셀 양식처럼 교육일시·강사·현장교육담당자 서명란과 특이사항 범례 칸(at-box)에만 테두리 */
.prt-wrap .at-table--head th, .prt-wrap .at-table--head td { border: none; }
.prt-wrap .at-table--head .at-box { border: 1px solid var(--gray-400); }
.prt-wrap .at-table td.ta-l, .prt-wrap .at-table th.ta-l { text-align: left; padding-left: 6px; }
.prt-wrap .at-table td.ta-nowrap { white-space: nowrap; }
.prt-wrap .at-table td p { margin: 3px 0; }
/* 상단 정보 2열 배치 — 과정명|장소 / 출석인원|특이사항 */
.prt-wrap .at-info-grid { display: grid; grid-template-columns: 1fr 1fr; column-gap: 16px; }
.prt-wrap .at-info-grid p { margin: 3px 0; min-width: 0; }
/* 명단 칸 글자 — 교육자명 칸과 같은 크기로 통일 (긴 주소·날짜가 덜 접히도록) */
.prt-wrap .at-table tr.at-data-row td { height: 56px; font-size: calc(10px * var(--fs-scale)); line-height: 1.2; }
/* 서명란 자필 안내(성 명 / 서 명) — 인쇄해도 거슬리지 않게 아주 흐리게 · 이름이 입력된 칸은 진하게 */
.prt-wrap .at-table .at-ghost { background: #fff; color: var(--gray-300); font-weight: 500; }
.prt-wrap .at-table td.at-sign-name { font-weight: 700; }
.prt-wrap .at-table td.at-name-cell {
    text-align: center; background: var(--gray-50);
    /* 영문 성명이 길어 칸을 넘치던 문제 — 줄바꿈 허용 + 한 단계 작은 글자 */
    word-break: break-word; overflow-wrap: anywhere; line-height: 1.2;
    font-size: calc(10px * var(--fs-scale));
}
/* 제목 — 엑셀 양식처럼 흰 배경 · 한 단계 작게 */
.prt-wrap .at-table td.at-title-cell { font-size: calc(22px * var(--fs-scale)); font-weight: 800; text-align: center; letter-spacing: -0.01em; padding: 10px 0; background: #fff; }
.prt-wrap .at-table td.at-org-cell { text-align: right; font-size: calc(12px * var(--fs-scale)); font-weight: 700; padding: 2px 8px 2px 0; }
/* 하단 안내 2줄 — 엑셀 양식처럼 빨간색 굵게 · 가운데 정렬 */
.prt-wrap .at-table td.at-notice-cell { font-size: calc(11px * var(--fs-scale)); color: var(--danger); font-weight: 700; text-align: center; }
/* 문서 헤더 표 — 9열 고정 (정보블록 + 서명란 8칸). 명단 표와 열 구조가 달라 별도 관리 */
/* 엑셀 양식과 같은 7칸 — 정보블록 65% | 강사 | 강사명 | 서명 | 현장교육담당자 | 성명 | 서명 (나머지 35%) */
.prt-wrap .at-table--head col:nth-child(1) { width: 65%; }
.prt-wrap .at-table--head col:nth-child(2) { width: 5.5%; }
.prt-wrap .at-table--head col:nth-child(3) { width: 7%; }
.prt-wrap .at-table--head col:nth-child(4) { width: 5.5%; }
.prt-wrap .at-table--head col:nth-child(5) { width: 6%; }
.prt-wrap .at-table--head col:nth-child(6) { width: 5.5%; }
.prt-wrap .at-table--head col:nth-child(7) { width: 5.5%; }
/* 표가 둘로 나뉘며 경계에 테두리가 겹쳐 2px로 보이는 것을 방지 */
.prt-wrap .at-table--body { margin-top: -1px; }

.prt-wrap .at-w-no { width: 30px; }
.prt-wrap .at-w-name { width: 84px; }
.prt-wrap .at-w-dob { width: 80px; }
.prt-wrap .at-w-addr { width: 140px; }
/* 연락처는 한 줄 고정 (010-0000-0000) — 주소 칸에서 폭을 가져옴 */
.prt-wrap .at-w-phone { width: 102px; }
.prt-wrap .at-w-lic { width: 60px; }
.prt-wrap .at-w-licno { width: 124px; }
/* 면허발급일자 — 교시·특이사항과 폭을 따로 둠 (날짜 한 줄 표기) */
.prt-wrap .at-w-licdate { width: 82px; }
.prt-wrap .at-w-wide { width: 68px; }
/* 대면 양식 서명란 — 교시 칸보다 넓게 (시작·종료 2칸) */
.prt-wrap .at-w-sign { width: 120px; }

@media print {
    .prt-wrap .at-sheet { box-shadow: none; border: none; padding: 32px 8px; }
    .prt-wrap .at-outer { max-width: none; }
    .prt-wrap .at-sheet, .prt-wrap .at-table th, .prt-wrap .at-table td {
        -webkit-print-color-adjust: exact;
        print-color-adjust: exact;
        color-adjust: exact;
    }
    /* bootstrap.min.css의 @media print{*{background:0 0!important;color:#000!important}} 리셋을 덮어씀 */
    .prt-wrap .at-table th { background: var(--gray-100) !important; }
    .prt-wrap .at-table td.at-name-cell { background: var(--gray-50) !important; }
    .prt-wrap .at-table td.at-title-cell { background: #fff !important; }
    .prt-wrap .at-table .at-ghost { background: #fff !important; color: var(--gray-300) !important; }
    .prt-wrap .at-table td.at-notice-cell { color: var(--danger) !important; }
}

@media screen and (max-width: 900px) {
    .prt-wrap .at-outer { overflow-x: auto; }
    .prt-wrap .at-sheet { min-width: 1180px; }
}

/* ===== 이수증 확인·출력: 재발급/실물거절/이수확인증 서브 버튼 ===== */
.cert-card-btns-sub {
    display: flex; gap: 6px; flex-wrap: wrap;
    margin-top: 10px; padding-top: 10px; border-top: 1px dashed var(--border);
}
.cert-card-btns-sub .cf-tiny-btn { flex: 1; text-align: center; }
.js-refuse-btn.is-refused {
    background: var(--gray-100); color: var(--fg3); border-color: var(--gray-200);
    cursor: default; pointer-events: none;
}

/* ===== 인쇄용: 계산서 (면세 · 흑백) ===== */
.prt-wrap .bill-sheet {
    page: prt-bill-landscape; /* 인쇄 시 가로 용지 */
    max-width: 900px; margin: 0 auto;
    background: #fff; border: 1px solid var(--gray-900);
    padding: 32px 32px 36px; box-shadow: var(--shadow-md);
    color: #111;
}
@page prt-bill-landscape { size: A4 landscape; margin: 10mm; }
/* 제목 줄 — 좌 문서번호 · 가운데 제목 · 우 발행일자 */
.prt-wrap .bill-head {
    display: grid; grid-template-columns: 1fr auto 1fr; align-items: end;
    margin-bottom: 14px;
}
.prt-wrap .bill-no, .prt-wrap .bill-date { font-size: calc(12px * var(--fs-scale)); color: #333; }
.prt-wrap .bill-date { text-align: right; }
.prt-wrap .bill-title {
    margin: 0; font-size: calc(30px * var(--fs-scale)); font-weight: 800;
    letter-spacing: 0.6em; text-indent: 0.6em; text-align: center;
}
.prt-wrap .bill-table { width: 100%; border-collapse: collapse; table-layout: fixed; }
.prt-wrap .bill-table + .bill-table { margin-top: 10px; }
.prt-wrap .bill-table th, .prt-wrap .bill-table td {
    border: 1px solid #555; padding: 7px 8px;
    font-size: calc(12px * var(--fs-scale)); line-height: 1.35; vertical-align: middle; word-break: keep-all;
}
.prt-wrap .bill-table th { background: #f2f2f2; font-weight: 700; text-align: center; }
.prt-wrap .bill-table td { text-align: left; }
.prt-wrap .bill-table td.ta-r { text-align: right; }
.prt-wrap .bill-table td.ta-l { text-align: left; }
.prt-wrap .bill-items td { text-align: center; }
/* 공급자·공급받는자 좌측 세로 머리칸 · 항목명 칸 폭 */
.prt-wrap .bill-side { width: 36px; }
.prt-wrap .bill-key { width: 88px; }
.prt-wrap .bill-key-sm { width: 52px; }
.prt-wrap .bill-table th.bill-side-cell { line-height: 1.5; letter-spacing: 0.1em; }
/* 대표자 옆 직인 — 칸 높이를 늘리지 않도록 글자 위에 겹쳐 둠 */
.prt-wrap .bill-ceo { position: relative; }
.prt-wrap .bill-stamp {
    position: absolute; top: 50%; left: 50%; transform: translateY(-50%);
    width: 46px; height: 46px; object-fit: contain; mix-blend-mode: multiply;
}
/* 합계금액(공급가액) 줄 */
.prt-wrap .bill-sum-key { width: 170px; }
.prt-wrap .bill-sum-key-sm { width: 70px; }
.prt-wrap .bill-table td.bill-sum-val { text-align: right; font-size: calc(15px * var(--fs-scale)); font-weight: 800; }
/* 품목 표 열 폭 */
.prt-wrap .bill-w-no { width: 40px; }
.prt-wrap .bill-w-date { width: 110px; }
.prt-wrap .bill-items tbody td:nth-child(2) { white-space: nowrap; }
.prt-wrap .bill-w-spec { width: 70px; }
.prt-wrap .bill-w-qty { width: 56px; }
.prt-wrap .bill-w-price { width: 90px; }
.prt-wrap .bill-w-amt { width: 110px; }
.prt-wrap .bill-w-note { width: 90px; }
.prt-wrap .bill-items tbody td { height: 30px; }
.prt-wrap .bill-items tfoot th { letter-spacing: 0.3em; }
.prt-wrap .bill-table td.bill-total { font-size: calc(15px * var(--fs-scale)); font-weight: 800; }
/* 하단 — 좌 문구 · 우 공급자 서명 */
.prt-wrap .bill-foot {
    display: flex; justify-content: space-between; align-items: center;
    margin-top: 14px; font-size: calc(13px * var(--fs-scale));
}
.prt-wrap .bill-sign { font-weight: 700; }
/* 서명 (인) 자리 직인 — 줄 높이를 늘리지 않게 글자 위에 겹침 */
.prt-wrap .bill-seal { position: relative; display: inline-block; }
.prt-wrap .bill-seal-img {
    position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
    width: 46px; height: 46px; object-fit: contain; mix-blend-mode: multiply; pointer-events: none;
    /* bootstrap 인쇄 리셋(img{max-width:100%!important})이 부모 폭('(인)' 글자 폭)으로 줄여버려 해제 */
    max-width: none !important;
}

@media screen and (max-width: 768px) {
    .prt-wrap .bill-sheet { padding: 20px 12px; overflow-x: auto; }
    .prt-wrap .bill-sheet > * { min-width: 700px; }
}

/* ===== 인쇄용: 이수확인증 ===== */
.prt-wrap .cc-sheet {
    max-width: 640px; margin: 0 auto;
    background: #fff; border: 1px solid var(--gray-900);
    padding: 40px 40px 56px; box-shadow: var(--shadow-md);
    color: #111;
}
.prt-wrap .cc-table { width: 100%; border-collapse: collapse; margin-bottom: 32px; }
.prt-wrap .cc-table th, .prt-wrap .cc-table td {
    border: 1px solid var(--gray-400); padding: 12px 14px;
    font-size: calc(14px * var(--fs-scale)); text-align: center; vertical-align: middle;
}
.prt-wrap .cc-table th { background: var(--gray-50); font-weight: 700; }
.prt-wrap .cc-table .ta-l { text-align: left; }
.prt-wrap .cc-table .w80 { width: 90px; }
.prt-wrap .cc-title { font-size: calc(20px * var(--fs-scale)); font-weight: 800; padding: 16px; letter-spacing: -0.01em; }
.prt-wrap .cc-main { width: 100px; }
.prt-wrap .cc-body { text-align: center; font-size: calc(15px * var(--fs-scale)); line-height: 1.9; margin: 0 0 28px; }
.prt-wrap .cc-date { text-align: center; font-size: calc(15px * var(--fs-scale)); margin-bottom: 32px; }

@media screen and (max-width: 768px) {
    .prt-wrap .cc-sheet { padding: 28px 20px 40px; }
    .prt-wrap .cc-table th, .prt-wrap .cc-table td { padding: 9px 6px; font-size: calc(12px * var(--fs-scale)); }
    .prt-wrap .cc-title { font-size: calc(16px * var(--fs-scale)); padding: 10px; }
}

/* ===== 인쇄용: 이수증 이미지 (실물 카드 양식) ===== */
.prt-wrap .ci-card, .cert-preview-wrap .ci-card {
    max-width: 480px; margin: 0 auto;
    background: #fff; border: 1px solid var(--gray-900);
    border-radius: var(--radius-md);
    padding: 28px 28px 32px; box-shadow: var(--shadow-md);
    color: #111;
}
.prt-wrap .ci-title, .cert-preview-wrap .ci-title {
    text-align: center; font-size: calc(18px * var(--fs-scale)); font-weight: 800;
    letter-spacing: -0.01em; margin: 0 0 16px;
    padding-bottom: 14px; border-bottom: 2px solid var(--gray-900);
}
.prt-wrap .ci-table, .cert-preview-wrap .ci-table { width: 100%; border-collapse: collapse; margin-bottom: 20px; }
.prt-wrap .ci-table th, .cert-preview-wrap .ci-table th, .prt-wrap .ci-table td, .cert-preview-wrap .ci-table td {
    border: 1px solid var(--gray-300); padding: 9px 10px;
    font-size: calc(13px * var(--fs-scale)); text-align: center; vertical-align: middle;
}
.prt-wrap .ci-table th, .cert-preview-wrap .ci-table th { background: var(--gray-50); font-weight: 700; color: var(--fg2); }
.prt-wrap .ci-table .w90, .cert-preview-wrap .ci-table .w90 { width: 90px; }
.prt-wrap .ci-body, .cert-preview-wrap .ci-body { text-align: center; font-size: calc(12px * var(--fs-scale)); line-height: 1.8; margin: 0 0 20px; color: var(--fg2); }
.prt-wrap .ci-date, .cert-preview-wrap .ci-date { text-align: center; font-size: calc(13px * var(--fs-scale)); margin-bottom: 22px; }
.prt-wrap .ci-org, .cert-preview-wrap .ci-org { justify-content: center; }

/* 미리보기 전용 워터마크 (본인확인 전 열람용 표시) */
.cert-preview-wrap { position: relative; overflow: hidden; }
.cert-preview-watermark {
    position: absolute; top: 50%; left: 50%; z-index: 5;
    transform: translate(-50%, -50%) rotate(-28deg);
    font-size: calc(72px * var(--fs-scale)); font-weight: 900; letter-spacing: 0.15em;
    color: rgba(185, 28, 28, 0.16);
    white-space: nowrap; pointer-events: none;
}

@media screen and (max-width: 768px) {
    .prt-wrap .ci-card, .cert-preview-wrap .ci-card { padding: 20px 18px 24px; }
    .prt-wrap .ci-table th, .cert-preview-wrap .ci-table th, .prt-wrap .ci-table td, .cert-preview-wrap .ci-table td { font-size: calc(11px * var(--fs-scale)); padding: 6px 6px; }
    .cert-wrap { padding: 20px 14px; }
    .cert-sheet-table td { font-size: calc(11px * var(--fs-scale)); padding: 6px 6px; }
    .cert-sheet-section, .cert-sheet-key { width: 56px; }
    .cert-preview-watermark { font-size: calc(40px * var(--fs-scale)); }
}

/* 인쇄 최적화 — 화면용 정의보다 뒤에 두어 같은 우선순위(.prt-wrap .클래스)에서 인쇄 규칙이 이기도록 파일 끝에 둠 */
@media print {
    .prt-wrap .toolbar, .prt-wrap .at-print-guide, #loading { display: none !important; }
    .prt-wrap { background: #fff; padding: 0; min-height: auto; }
    /* 종이 출력 공통 — 접수확인증과 같은 크기감 (폭 640px · 표 글자 14px) · 바깥 테두리 없음
       (영수증·환불요구서·현금영수증 · zoom은 크롬 인쇄 시 쪽 나눔이 축소 전 높이로 계산돼 쓰지 않음) */
    .prt-wrap .sheet { max-width: 640px; box-shadow: none; border: none; padding: 32px 40px 40px; break-inside: avoid; page-break-inside: avoid; }
    /* 접수·이수확인증 시트, 이수증 카드 — 인쇄 시 바깥 테두리 없음 */
    .prt-wrap .cc-sheet,
    .prt-wrap .ci-card { box-shadow: none; border: none; }
    /* 계산서 — 가로 용지(prt-bill-landscape) · 종이 폭의 80%로 가운데 정렬 · 바깥 테두리 없음 */
    .prt-wrap .bill-sheet { width: 80%; max-width: none; margin: 0 auto; box-shadow: none; border: none; padding: 0; }
    .prt-wrap .receipt-title { font-size: calc(24px * var(--fs-scale)); margin-bottom: 14px; }
    .prt-wrap .receipt-to { font-size: calc(14px * var(--fs-scale)); margin-bottom: 18px; }
    .prt-wrap .receipt-table { margin-bottom: 24px; }
    .prt-wrap .receipt-table th { width: 100px; padding: 12px 14px; font-size: calc(14px * var(--fs-scale)); }
    .prt-wrap .receipt-table td { padding: 12px 14px; font-size: calc(14px * var(--fs-scale)); }
    .prt-wrap .receipt-confirm { margin-bottom: 18px; }
    .prt-wrap .receipt-date { margin-bottom: 24px; }
    /* 현금영수증 — 표가 13행이라 행 간격만 좁혀 한 장에 맞춤 */
    .prt-wrap .sheet--cash .receipt-table th,
    .prt-wrap .sheet--cash .receipt-table td { padding: 6px 14px; }
    /* 환불요구서 — 입금 의뢰서까지 한 장에 담기면 약 25px 넘침 → 글자는 두고 블록 사이 여백만 줄임 */
    .prt-wrap .sheet--refund { padding: 28px 32px; break-inside: avoid; page-break-inside: avoid; }
    .prt-wrap .sheet--refund .refund-reason { padding: 10px 0 14px; }
    .prt-wrap .sheet--refund .refund-body { margin-bottom: 16px; }
    .prt-wrap .sheet--refund .refund-proxy { padding-top: 12px; margin-bottom: 18px; }
    .prt-wrap .sheet--refund .refund-date { margin-bottom: 16px; }
    .prt-wrap .sheet--refund .refund-transfer { padding: 14px 20px; margin-bottom: 10px; }
    @page { margin: 12mm; }
}
