html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
}

.form-floating > .form-control-plaintext::placeholder, .form-floating > .form-control::placeholder {
  color: var(--bs-secondary-color);
  text-align: end;
}

.form-floating > .form-control-plaintext:focus::placeholder, .form-floating > .form-control:focus::placeholder {
  text-align: start;
}

/* =====================================================================
   엔런(NLearn) 공용 디자인 테마 — 흰라벨(테넌트 --brand 자동 반영)
   코어+옵션 조립형 LMS 공통 스킨. 모든 테넌트/화면에 전역 적용.
   ===================================================================== */
:root{
  --brand:#0d6efd;                     /* _Layout이 테넌트별로 덮어씀 */
  --nl-ink:#1b1d22; --nl-muted:#6b7280;
  --nl-bg:#f6f7fb; --nl-card:#fff; --nl-line:#e9eaf0;
  --nl-radius:14px;
  --nl-shadow:0 1px 2px rgba(16,24,40,.05), 0 10px 28px rgba(16,24,40,.06);
  --nl-shadow-sm:0 1px 2px rgba(16,24,40,.06);
  --nl-font:"Pretendard Variable","Pretendard","Segoe UI","Malgun Gothic","Apple SD Gothic Neo",system-ui,-apple-system,sans-serif;
}
/* 브랜드 색의 옅은 톤(테넌트 색 위에 자동 혼합) */
.nl-brand-soft{ background:color-mix(in srgb, var(--brand) 10%, #fff); }

body{
  font-family:var(--nl-font);
  background:var(--nl-bg);
  color:var(--nl-ink);
  -webkit-font-smoothing:antialiased;
}

/* ---- 상단 네비게이션 ---- */
header .navbar{
  background:#fff !important;
  box-shadow:var(--nl-shadow-sm);
  padding-top:.4rem; padding-bottom:.4rem;
}
.navbar .navbar-nav{ flex-wrap:wrap; row-gap:1px; column-gap:1px; }
.navbar .nav-link{
  color:#3a4150 !important;
  font-size:.95rem; font-weight:600; letter-spacing:-.2px;
  padding:.46rem .8rem !important;
  border-radius:10px;
  transition:background .12s, color .12s, box-shadow .12s;
  white-space:nowrap;
}
.navbar .nav-link:hover{
  background:color-mix(in srgb, var(--brand) 13%, #fff);
  color:var(--brand) !important;
}
.navbar .nav-link:active{ transform:translateY(.5px); }
.navbar .nav-link.fw-semibold{ color:var(--brand) !important; }
.navbar .dropdown-toggle::after{ margin-left:.35em; opacity:.6; }
.navbar-brand{ font-weight:800 !important; letter-spacing:-.3px; }
.navbar-brand img{ border-radius:6px; }
.navbar .dropdown-menu{
  border:1px solid var(--nl-line); border-radius:12px;
  box-shadow:var(--nl-shadow); padding:.35rem;
}
.navbar .dropdown-item{ border-radius:8px; font-size:.9rem; padding:.4rem .7rem; }
.navbar .dropdown-item:hover{ background:color-mix(in srgb, var(--brand) 10%, #fff); color:var(--brand); }
.navbar .dropdown-item.active{ background:var(--brand); }

/* ---- 페이지 제목 ---- */
main h1{ font-size:1.6rem; font-weight:800; letter-spacing:-.4px; margin:.4rem 0 1rem; }
main h1 small, main h1 .text-muted{ font-size:.9rem; font-weight:600; }
main h2{ font-size:1.25rem; font-weight:700; }
/* 히어로 밴드가 없는 일반 관리화면의 제목도 일관된 페이지 헤더로(전체폭 브랜드 구분선) */
main > h1,
main > .d-flex:has(> h1){ padding-bottom:.55rem; border-bottom:2px solid color-mix(in srgb, var(--brand) 22%, var(--nl-line)); margin-bottom:1.1rem; }
main > .d-flex:has(> h1) > h1{ margin-bottom:0; border-bottom:0; padding-bottom:0; }
.container > main{ padding-top:.25rem; }

/* ---- 카드 ---- */
.card{
  border:1px solid var(--nl-line);
  border-radius:var(--nl-radius);
  box-shadow:var(--nl-shadow);
  overflow:hidden;
}
.card .card-header{
  background:color-mix(in srgb, var(--brand) 6%, #fff);
  border-bottom:1px solid var(--nl-line);
  font-weight:700;
}
.card .card-footer{ background:#fcfcfe; }
.card.border-primary{ border-color:var(--brand) !important; }
.card.border-success{ border-color:#15a34a !important; }
.card.border-warning{ border-color:#d97706 !important; }

/* ---- 버튼 ---- */
.btn{ border-radius:10px; font-weight:600; }
.btn-primary{
  background:var(--brand); border-color:var(--brand);
  box-shadow:0 6px 14px color-mix(in srgb, var(--brand) 30%, transparent);
}
.btn-primary:hover,.btn-primary:focus{
  background:color-mix(in srgb, var(--brand) 86%, #000);
  border-color:color-mix(in srgb, var(--brand) 86%, #000);
}
.btn-outline-primary{ color:var(--brand); border-color:var(--brand); }
.btn-outline-primary:hover{ background:var(--brand); border-color:var(--brand); }
.btn-sm{ border-radius:8px; }

/* ---- 테이블 ---- */
.table{ --bs-table-bg:transparent; font-size:.925rem; }
.table > thead th{
  background:color-mix(in srgb, var(--brand) 6%, #fff);
  color:#5a5e68; font-weight:600; font-size:.8rem;
  border-bottom:1px solid var(--nl-line); white-space:nowrap;
}
.table > tbody > tr > td{ border-bottom:1px solid var(--nl-line); vertical-align:middle; }
.table-hover > tbody > tr:hover > *{ background:color-mix(in srgb, var(--brand) 4%, #fff); }
/* 테이블을 카드처럼 감싸보이게(제목 바로 아래 쓰는 경우) */
main > .table, main > .table-responsive > .table{ background:#fff; border:1px solid var(--nl-line); border-radius:var(--nl-radius); box-shadow:var(--nl-shadow); overflow:hidden; }
main > .table > thead th, main > .table-responsive > .table > thead th{ padding:.7rem .75rem; }

/* ---- 배지 ---- */
.badge{ font-weight:700; border-radius:999px; padding:.32em .7em; }
.badge.bg-info{ background:#eaf0ff !important; color:#1d4ed8 !important; }
.badge.bg-secondary{ background:var(--nl-bg) !important; color:var(--nl-muted) !important; border:1px solid var(--nl-line); }
.badge.bg-success{ background:#e9f8ef !important; color:#15803d !important; } /* [QA-1013-W7-007] #15a34a 3.0:1 → 4.57:1 */
/* [QA-1013-W7-007] Bootstrap 기본 노랑·하늘 글자는 흰 바탕 1.6~2.0:1 → 같은 색 계열의 진한 톤(≥4.5:1, 페이지 바탕 포함) */
.text-warning{ color:#b45309 !important; }
.text-info{ color:#0e7490 !important; }
.badge.bg-warning{ background:#fff1e8 !important; color:#c2410c !important; }

/* ---- 폼 ---- */
.form-control, .form-select{ border-radius:10px; border-color:var(--nl-line); font-size:.925rem; }
.form-control:focus, .form-select:focus{
  border-color:var(--brand);
  box-shadow:0 0 0 .2rem color-mix(in srgb, var(--brand) 18%, transparent);
}
.form-label{ font-weight:600; font-size:.85rem; color:#4b4f58; margin-bottom:.3rem; }

/* ---- 알림 ---- */
.alert{ border-radius:12px; border:1px solid var(--nl-line); }
.alert-success{ background:#e9f8ef; color:#13713a; border-color:#bfe6cd; }
.alert-warning{ background:#fff6ed; color:#9a4b12; border-color:#f6d8be; }
.alert-secondary{ background:#fff; color:var(--nl-muted); }

/* ---- 푸터 ---- */
footer.footer{ background:transparent; }
.footer{ color:var(--nl-muted); }

/* 작은 화면에서 카드 그리드 간격 */
@media (max-width:575.98px){
  main h1{ font-size:1.35rem; }
}

/* =====================================================================
   납품용 프리미엄 레이어 — 브랜드 식별 · 히어로 · 과정 카드/상세 · 푸터
   ===================================================================== */

/* ---- 상단 브랜드: 마크 / 협회명 / 플랫폼 byline 3분리 ---- */
.nl-brand{ display:inline-flex; align-items:center; gap:.7rem; padding:.1rem 0; }
/* 테넌트 자체 마크 — 로고가 없을 때 기관 이니셜(기관 브랜드색). 로고가 있으면 로고 사용. */
.nl-brand-mark{
  width:42px; height:42px; flex:none; border-radius:12px;
  background:linear-gradient(135deg, var(--brand), color-mix(in srgb, var(--brand) 55%, #000));
  color:#fff; font-weight:800; font-size:1.2rem; letter-spacing:-.5px;
  display:grid; place-items:center;
  box-shadow:0 6px 15px color-mix(in srgb, var(--brand) 32%, transparent);
}
.nl-brand-mark.sm{ width:32px; height:32px; border-radius:9px; font-size:.78rem; }
.nl-brand-logo{ height:40px; width:auto; border-radius:9px; flex:none; }
.nl-brand-logo.sm{ height:30px; }
.nl-brand-text{ display:flex; flex-direction:column; line-height:1.15; }
.nl-brand-name{ font-weight:800; font-size:1.26rem; letter-spacing:-.5px; color:var(--nl-ink); }
.nl-brand-by{ font-size:.82rem; font-weight:600; color:var(--nl-muted); letter-spacing:.1px; margin-top:2px; }
.nl-brand-by b{ color:var(--brand); font-weight:800; }

/* ---- 페이지 히어로(목록 상단 타이틀 영역) ---- */
.page-hero{
  background:
    radial-gradient(1200px 180px at 0% -40%, color-mix(in srgb, var(--brand) 16%, #fff), transparent 70%),
    #fff;
  border:1px solid var(--nl-line);
  border-radius:18px; box-shadow:var(--nl-shadow);
  padding:1.6rem 1.7rem; margin:.25rem 0 1.4rem;
  display:flex; align-items:flex-end; justify-content:space-between; gap:1rem; flex-wrap:wrap;
}
.page-hero .ph-eyebrow{ font-size:.74rem; font-weight:800; letter-spacing:1.2px; text-transform:uppercase; color:var(--brand); }
.page-hero h1{ margin:.35rem 0 .15rem; font-size:1.7rem; }
.page-hero .ph-sub{ color:var(--nl-muted); font-size:.95rem; margin:0; }
.page-hero .ph-count{ font-weight:800; color:var(--brand); }

/* ---- 과정 목록(컴팩트 행) — 다수 과정 카탈로그에 최적화 ---- */
.course-list{ display:flex; flex-direction:column; gap:.6rem; }
.course-row{
  display:flex; align-items:center; gap:1rem;
  background:#fff; border:1px solid var(--nl-line); border-radius:12px;
  box-shadow:var(--nl-shadow-sm);
  padding:.85rem 1.1rem;
  transition:border-color .12s, box-shadow .12s;
}
.course-row:hover{ border-color:color-mix(in srgb, var(--brand) 45%, var(--nl-line)); box-shadow:var(--nl-shadow); }
.course-row .cr-accent{ width:4px; align-self:stretch; min-height:40px; border-radius:4px; background:var(--brand); flex:none; }
.course-row .cr-main{ flex:1; min-width:0; }
.course-row .cr-top{ display:flex; align-items:center; gap:.5rem; margin-bottom:.15rem; }
.course-row .cr-tag{
  font-size:.7rem; font-weight:700; padding:.12em .55em; border-radius:6px;
  background:color-mix(in srgb, var(--brand) 10%, #fff); color:color-mix(in srgb, var(--brand) 80%, #000);
}
.course-row .cr-status{ font-size:.72rem; font-weight:800; padding:.12em .6em; border-radius:999px; }
.course-row .cr-status.open{ background:#e9f8ef; color:#15803d; }
.course-row .cr-status.closed{ background:#fdecea; color:#b42318; }
.course-row .cr-title{
  font-size:1.04rem; font-weight:800; letter-spacing:-.3px; color:var(--nl-ink);
  text-decoration:none; display:inline-block;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:100%;
}
.course-row .cr-title:hover{ color:var(--brand); }
.course-row .cr-meta{ display:flex; gap:.9rem; font-size:.82rem; color:var(--nl-muted); margin-top:.2rem; flex-wrap:wrap; }
.course-row .cr-meta b{ color:#3b4150; font-weight:600; }
.course-row .cr-actions{ display:flex; gap:.45rem; flex:none; }
@media (max-width:640px){
  .course-row{ flex-wrap:wrap; }
  .course-row .cr-actions{ width:100%; }
  .course-row .cr-actions .btn{ flex:1; }
}

/* ---- 빈 상태 ---- */
.empty-state{
  text-align:center; padding:3.2rem 1rem; color:var(--nl-muted);
  background:#fff; border:1px dashed var(--nl-line); border-radius:var(--nl-radius);
}
.empty-state .es-ic{ font-size:2.4rem; opacity:.5; }

/* ---- 과정 상세 ---- */
.cd-breadcrumb{ font-size:.85rem; color:var(--nl-muted); margin:.1rem 0 .9rem; }
.cd-breadcrumb a{ color:var(--nl-muted); text-decoration:none; }
.cd-breadcrumb a:hover{ color:var(--brand); }
.cd-hero{
  position:relative; border-radius:16px; overflow:hidden; margin-bottom:1.2rem;
  background:linear-gradient(135deg, var(--brand), color-mix(in srgb, var(--brand) 48%, #000));
  color:#fff; padding:1.3rem 1.5rem;
}
.cd-hero .cd-badges{ display:flex; gap:.45rem; margin-bottom:.5rem; flex-wrap:wrap; }
.cd-hero .cd-badge{ font-size:.72rem; font-weight:700; padding:.22em .75em; border-radius:999px; background:rgba(255,255,255,.2); }
.cd-hero h1{ color:#fff; font-size:1.45rem; margin:0; letter-spacing:-.5px; line-height:1.3; }
.cd-hero .cd-sub{ color:rgba(255,255,255,.82); font-size:.86rem; margin:.35rem 0 0; }
.cd-grid{ display:grid; grid-template-columns:1fr 320px; gap:1.3rem; align-items:start; }
@media (max-width:767.98px){ .cd-grid{ grid-template-columns:1fr; } }
.cd-section{ background:#fff; border:1px solid var(--nl-line); border-radius:var(--nl-radius); box-shadow:var(--nl-shadow); padding:1.3rem 1.4rem; margin-bottom:1.1rem; }
.cd-section h2{ font-size:1.1rem; margin:0 0 .7rem; }
.cd-section p{ color:#3b4150; margin:0; }
.cd-steps{ margin:0; padding-left:1.15rem; }
.cd-steps li{ font-size:.92rem; color:#3b4150; padding:.28rem 0; }
.cd-steps li b{ color:var(--nl-ink); }
.cd-note{ font-size:.82rem; color:var(--nl-muted); margin:.8rem 0 0; }
.cd-facts{ list-style:none; padding:0; margin:0; }
.cd-facts li{ display:flex; justify-content:space-between; gap:1rem; padding:.6rem 0; border-bottom:1px dashed var(--nl-line); font-size:.92rem; }
.cd-facts li:last-child{ border-bottom:0; }
.cd-facts li .k{ color:var(--nl-muted); }
.cd-facts li .v{ font-weight:700; color:var(--nl-ink); }
.cd-aside{ position:sticky; top:1rem; }
.cd-aside .cd-card{ background:#fff; border:1px solid var(--nl-line); border-radius:var(--nl-radius); box-shadow:var(--nl-shadow); padding:1.3rem; }
.cd-aside .cd-card h3{ font-size:1.02rem; margin:0 0 .2rem; font-weight:800; }
.cd-aside .cd-card .cd-price{ font-size:1.4rem; font-weight:800; color:var(--nl-ink); margin:.1rem 0 .9rem; }
.cd-aside .cd-card .cd-price small{ font-size:.8rem; font-weight:600; color:var(--nl-muted); }
.cd-aside .cd-sum{ list-style:none; padding:0; margin:0 0 1rem; }
.cd-aside .cd-sum li{ display:flex; justify-content:space-between; gap:.6rem; font-size:.86rem; padding:.38rem 0; border-bottom:1px dashed var(--nl-line); }
.cd-aside .cd-sum li:last-child{ border-bottom:0; }
.cd-aside .cd-sum li .k{ color:var(--nl-muted); }
.cd-aside .cd-sum li .v{ font-weight:700; color:var(--nl-ink); }
.cd-aside .cd-cta-note{ font-size:.8rem; color:var(--nl-muted); margin:.7rem 0 0; text-align:center; }

/* ---- 내 학습 / 학습(차시) 화면 ---- */
.prog-hero{
  background:linear-gradient(135deg, var(--brand), color-mix(in srgb, var(--brand) 48%, #000));
  color:#fff; border-radius:16px; padding:1.4rem 1.6rem; margin-bottom:1.3rem;
}
.prog-hero .ph-kick{ font-size:.75rem; font-weight:700; letter-spacing:.3px; color:rgba(255,255,255,.8); }
.prog-hero h1{ color:#fff; font-size:1.4rem; margin:.2rem 0 1rem; letter-spacing:-.4px; }
.prog-hero .pmeta{ display:flex; justify-content:space-between; align-items:flex-end; font-size:.9rem; margin-bottom:.45rem; color:rgba(255,255,255,.9); }
.prog-hero .pmeta b{ font-size:1.3rem; font-weight:800; }
.prog-hero .pbar{ height:12px; background:rgba(255,255,255,.25); border-radius:999px; overflow:hidden; }
.prog-hero .pbar > span{ display:block; height:100%; background:#fff; border-radius:999px; transition:width .3s; }

.lesson-list{ display:flex; flex-direction:column; gap:.5rem; margin-bottom:1.3rem; }
.lesson-row{ display:flex; align-items:center; gap:1rem; background:#fff; border:1px solid var(--nl-line); border-radius:12px; padding:.75rem 1.1rem; box-shadow:var(--nl-shadow-sm); }
.lesson-row .lnum{ width:34px; height:34px; flex:none; border-radius:9px; background:color-mix(in srgb, var(--brand) 10%, #fff); color:color-mix(in srgb, var(--brand) 80%, #000); display:grid; place-items:center; font-weight:800; font-size:.9rem; }
.lesson-row.done .lnum{ background:#e9f8ef; color:#15803d; }
.lesson-row.doing{ border-color:#f5c86b; box-shadow:0 0 0 1px #f7d58a inset, var(--nl-shadow-sm); }
.lesson-row.doing .lnum{ background:#fff4df; color:#9a5a0b; } /* [QA-1013-W7-007] 3.88 → 5.0:1 */

/* 학습 플레이어 진행바 */
.play-prog{ background:var(--nl-card,#fff); border:1px solid var(--nl-line); border-radius:12px; padding:.8rem 1rem; box-shadow:var(--nl-shadow-sm); }
.play-prog.done{ border-color:#86d9a6; background:#f2fcf6; }
.play-prog .pp-head{ display:flex; justify-content:space-between; align-items:center; font-size:.92rem; color:var(--nl-ink); }
.play-prog .pp-head b{ color:var(--brand); font-variant-numeric:tabular-nums; }
.play-prog.done .pp-head b{ color:#15803d; }
.play-prog .pp-bar{ height:9px; border-radius:6px; background:color-mix(in srgb, var(--brand) 12%, #fff); overflow:hidden; margin:.5rem 0 .35rem; }
.play-prog .pp-bar>span{ display:block; height:100%; background:var(--brand); border-radius:6px; transition:width .4s ease; }
.play-prog.done .pp-bar>span{ background:#22a95b; }
.play-prog .pp-note{ font-size:.78rem; color:var(--nl-muted); }
/* 문서(전자책) 리더 */
.doc-reader{ max-height:60vh; overflow:auto; white-space:pre-wrap; line-height:1.85; font-size:1.02rem; color:var(--nl-ink); padding:.5rem .25rem; }
.doc-reader::-webkit-scrollbar{ width:10px; } .doc-reader::-webkit-scrollbar-thumb{ background:var(--nl-line); border-radius:6px; }

/* 학습 플레이어 2단 레이아웃(플레이어 + 목차) */
.watch-layout{ display:grid; grid-template-columns: 1fr 320px; gap:1.1rem; align-items:start; }
@media (max-width: 860px){ .watch-layout{ grid-template-columns:1fr; } }
.watch-toc{ background:var(--nl-card,#fff); border:1px solid var(--nl-line); border-radius:12px; box-shadow:var(--nl-shadow-sm); overflow:hidden; position:sticky; top:1rem; }
.watch-toc .toc-head{ display:flex; justify-content:space-between; align-items:center; padding:.7rem .9rem; border-bottom:1px solid var(--nl-line); font-weight:700; color:var(--nl-ink); }
.watch-toc .toc-head small{ color:var(--nl-muted); font-weight:600; }
.toc-list{ list-style:none; margin:0; padding:.35rem; max-height:70vh; overflow:auto; }
.toc-item>a{ display:flex; align-items:center; gap:.6rem; padding:.55rem .6rem; border-radius:9px; text-decoration:none; color:var(--nl-ink); }
.toc-item>a:hover{ background:color-mix(in srgb, var(--brand) 7%, #fff); }
.toc-item .toc-ic{ width:26px; height:26px; flex:none; border-radius:7px; display:grid; place-items:center; font-weight:800; font-size:.82rem; background:color-mix(in srgb, var(--brand) 10%, #fff); color:color-mix(in srgb, var(--brand) 80%, #000); }
.toc-item.done .toc-ic{ background:#e9f8ef; color:#15803d; }
.toc-item.doing .toc-ic{ background:#fff4df; color:#9a5a0b; }
.toc-item .toc-name{ flex:1; min-width:0; font-size:.9rem; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.toc-item .toc-badge{ flex:none; font-size:.7rem; color:var(--nl-muted); }
.toc-item.current>a{ background:color-mix(in srgb, var(--brand) 12%, #fff); box-shadow:inset 3px 0 0 var(--brand); }
.toc-item.current .toc-name{ color:var(--brand); }
.toc-item.done .toc-badge{ color:#15803d; } .toc-item.doing .toc-badge{ color:#9a5a0b; }

/* 플레이어 토스트(영상 위 알림) */
.play-toast{ position:absolute; top:14px; left:50%; transform:translate(-50%,-8px); z-index:5; background:rgba(20,28,40,.92); color:#fff; padding:.5rem .9rem; border-radius:10px; font-size:.86rem; font-weight:600; opacity:0; pointer-events:none; transition:opacity .25s, transform .25s; max-width:90%; text-align:center; }
.play-toast.show{ opacity:1; transform:translate(-50%,0); }
.play-toast.warn{ background:rgba(180,80,10,.95); }
.play-toast.done{ background:rgba(21,128,61,.96); }
.lesson-row .ltitle{ flex:1; min-width:0; font-weight:600; color:var(--nl-ink); text-decoration:none; }
.lesson-row .ltitle:hover{ color:var(--brand); }
.lesson-row .lstatus{ flex:none; }

/* 내 학습 행의 상태/결제/액션 (course-row 재사용 + 보강) */
.cr-badges{ display:flex; gap:.4rem; align-items:center; flex-wrap:wrap; }
.cr-pay{ font-size:.72rem; font-weight:800; padding:.12em .6em; border-radius:999px; }
.cr-pay.free{ background:var(--bg); color:var(--nl-muted); border:1px solid var(--nl-line); }
.cr-pay.paid{ background:#e9f8ef; color:#15803d; }

/* ---- 테넌트 홈(랜딩) ---- */
.home-hero{
  background:
    radial-gradient(900px 280px at 80% -20%, rgba(255,255,255,.18), transparent 70%),
    linear-gradient(135deg, var(--brand), color-mix(in srgb, var(--brand) 50%, #000));
  color:#fff; border-radius:20px; padding:3rem 2.2rem; margin:.3rem 0 1.8rem; text-align:center;
}
.home-hero h1, .home-hero .hh-title{ color:#fff; font-size:2.2rem; font-weight:900; letter-spacing:-1px; margin:0 0 .7rem; line-height:1.25; }
.home-hero p{ color:rgba(255,255,255,.92); font-size:1.05rem; margin:0 auto 1.5rem; max-width:580px; }
.home-hero .btns{ display:flex; gap:.6rem; justify-content:center; flex-wrap:wrap; }
.home-hero .cta-w{ background:#fff; color:color-mix(in srgb, var(--brand) 82%, #000); padding:.75rem 1.6rem; border-radius:12px; font-weight:800; text-decoration:none; box-shadow:0 10px 24px rgba(0,0,0,.18); }
.home-hero .cta-o{ background:rgba(255,255,255,.14); color:#fff; border:1px solid rgba(255,255,255,.45); padding:.75rem 1.6rem; border-radius:12px; font-weight:800; text-decoration:none; }
.home-pillars{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; margin-bottom:2rem; }
@media(max-width:767.98px){ .home-pillars{ grid-template-columns:1fr; } }
.home-pillar{ background:#fff; border:1px solid var(--nl-line); border-top:3px solid color-mix(in srgb, var(--brand) 55%, var(--nl-line)); border-radius:12px; box-shadow:var(--nl-shadow-sm); padding:1.3rem 1.4rem; }
.home-pillar b{ display:block; margin:0 0 .4rem; font-size:1.1rem; font-weight:800; letter-spacing:-.3px; }
.home-pillar span{ font-size:.9rem; color:var(--nl-muted); line-height:1.6; }
.home-sec-head{ display:flex; justify-content:space-between; align-items:baseline; margin:.4rem 0 .9rem; }
.home-sec-head h2{ margin:0; }
.home-sec-head a{ font-size:.9rem; font-weight:700; text-decoration:none; color:var(--brand); white-space:nowrap; }

/* ---- 운영 대시보드 ---- */
.stat-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:1rem; margin-bottom:1.4rem; }
@media(max-width:767.98px){ .stat-grid{ grid-template-columns:repeat(2,1fr); } }
.stat-card{ background:#fff; border:1px solid var(--nl-line); border-left:3px solid color-mix(in srgb, var(--brand) 55%, var(--nl-line)); border-radius:12px; box-shadow:var(--nl-shadow-sm); padding:1rem 1.2rem; display:flex; flex-direction:column; }
.stat-card .sc-label{ font-size:.82rem; color:var(--nl-muted); letter-spacing:.2px; order:0; }
.stat-card .sc-num{ font-size:2.3rem; font-weight:800; letter-spacing:-1px; line-height:1.1; color:var(--nl-ink); order:1; margin:.1rem 0; }
.stat-card .sc-num.ok{ color:#15803d; }
.stat-card:has(.sc-num.ok){ border-left-color:#22a95b; }
.stat-card .sc-link{ font-size:.8rem; font-weight:700; text-decoration:none; color:var(--brand); order:2; margin-top:.15rem; }
.quick-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:.8rem; }
@media(max-width:767.98px){ .quick-grid{ grid-template-columns:repeat(2,1fr); } }
.quick-card{ background:#fff; border:1px solid var(--nl-line); border-radius:12px; box-shadow:var(--nl-shadow-sm); padding:.95rem 1.1rem; text-decoration:none; color:var(--nl-ink); display:flex; align-items:center; justify-content:space-between; gap:.7rem; font-weight:600; transition:border-color .12s, box-shadow .12s, color .12s; }
.quick-card::after{ content:"→"; color:var(--nl-muted); font-weight:400; }
.quick-card:hover{ border-color:color-mix(in srgb, var(--brand) 45%, var(--nl-line)); box-shadow:var(--nl-shadow); color:var(--brand); }
.quick-card:hover::after{ color:var(--brand); }

/* ---- 운영 현황 카드 그리드 ---- */
.admin-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:1rem; }
@media(max-width:767.98px){ .admin-grid{ grid-template-columns:1fr; } }
.admin-card{ background:#fff; border:1px solid var(--nl-line); border-radius:14px; box-shadow:var(--nl-shadow-sm); padding:1.2rem 1.3rem; text-decoration:none; color:var(--nl-ink); display:block; transition:border-color .12s, box-shadow .12s, transform .12s; }
.admin-card:hover{ border-color:color-mix(in srgb, var(--brand) 45%, var(--nl-line)); box-shadow:var(--nl-shadow); transform:translateY(-2px); }
.admin-card .ac-title{ font-weight:800; font-size:1.02rem; margin-bottom:.3rem; }
.admin-card .ac-desc{ font-size:.85rem; color:var(--nl-muted); line-height:1.5; }

/* ---- 프로페셔널 푸터 ---- */
body{ margin-bottom:0 !important; }
.site-footer{ background:#1e2838; color:#cdd6e3; margin-top:3rem; padding:1.6rem 0; }
.site-footer-in{ display:flex; align-items:center; justify-content:space-between; gap:1rem; flex-wrap:wrap; }
.site-footer-brand{ display:flex; align-items:center; gap:.7rem; }
.site-footer-names strong{ display:block; color:#ffffff; font-size:1rem; font-weight:800; letter-spacing:-.3px; }
.site-footer-names span{ font-size:.78rem; color:#aab6c6; }
.site-footer-cp{ font-size:.8rem; color:#aab6c6; }
/* ===== 운영자 좌측 사이드바(관리자 콘솔 표준) — 600px↑(좁은 노트북 분할 화면 대응), 그 아래는 상단 네비 ===== */
@media (min-width:600px){
  body.nl-admin header .navbar{ position:fixed; top:0; left:0; bottom:0; width:256px; z-index:1030; flex-direction:column; align-items:stretch; overflow-y:auto; padding:0; background:#fff; border-bottom:0 !important; border-right:1px solid var(--nl-line); box-shadow:var(--nl-shadow-sm); margin:0; }
  body.nl-admin header .navbar > .container{ flex-direction:column; align-items:stretch; width:100%; max-width:none; padding:0; }
  body.nl-admin .navbar-brand{ padding:1rem 1.1rem; margin:0; border-bottom:1px solid var(--nl-line); }
  body.nl-admin .navbar-toggler{ display:none; }
  body.nl-admin .navbar-collapse{ display:flex !important; flex-direction:column; align-items:stretch; flex:1 1 auto; }
  body.nl-admin .navbar-collapse > .navbar-nav{ flex-direction:column; width:100%; align-items:stretch; padding:.4rem .5rem; }
  body.nl-admin .navbar-collapse > .navbar-nav:last-child{ display:none; } /* 사용자·로그아웃은 상단 바로 이동 */
  body.nl-admin .navbar-nav > .nav-item{ width:100%; }
  /* 그룹 헤더(=dropdown-toggle) = 섹션 라벨 */
  /* 그룹 헤더 = 섹션 바(연한 띠 + 상단 구분선)로 하위 항목과 블록 구분 */
  body.nl-admin header .navbar .nav-item.dropdown > .dropdown-toggle{ font-size:.72rem; font-weight:800; letter-spacing:.7px; text-transform:uppercase; color:color-mix(in srgb, var(--brand) 45%, var(--nl-muted)) !important; padding:.5rem 1.1rem .45rem; margin-top:.35rem; background:var(--nl-bg); border-top:1px solid var(--nl-line); pointer-events:none; }
  body.nl-admin header .navbar .navbar-nav > .nav-item.dropdown:first-child > .dropdown-toggle{ margin-top:0; border-top:0; }
  body.nl-admin header .navbar .dropdown-toggle::after{ display:none; }
  /* 펼친 메뉴(사이드바 전용 — 상단 바 드롭다운엔 적용 안 함) */
  body.nl-admin header .navbar .dropdown-menu{ display:block !important; position:static !important; float:none; border:0; box-shadow:none; margin:0; padding:0; background:transparent; }
  body.nl-admin header .navbar .dropdown-item, body.nl-admin header .navbar .navbar-nav > .nav-item > .nav-link{ display:block; padding:.44rem 1.1rem; font-size:.9rem; border-radius:0; color:var(--nl-ink); white-space:normal; }
  body.nl-admin header .navbar .dropdown-item:hover, body.nl-admin header .navbar .navbar-nav > .nav-item > .nav-link:hover{ background:color-mix(in srgb, var(--brand) 9%, #fff); color:var(--brand); }
  /* 하위 묶음 소제목(과정 평가·수료·이수·집체 교육·분석·자료 등) — 눌리는 메뉴로 오인하지 않게 청색·굵게 레벨 표시, 커서 기본 */
  body.nl-admin header .navbar .nl-subhead-li{ margin-top:.45rem; }
  body.nl-admin header .navbar .dropdown-header.nl-subhead{ display:block; padding:.32rem 1.1rem .28rem .9rem; font-size:.76rem; font-weight:800; letter-spacing:.2px; color:#1d4ed8; background:color-mix(in srgb, #1d4ed8 7%, #fff); border-left:3px solid #1d4ed8; cursor:default; pointer-events:none; white-space:normal; }
  body.nl-admin header .navbar .nl-subhead-li ~ li > .dropdown-item{ padding-left:1.6rem; }
  body.nl-admin .navbar-collapse > .navbar-nav:last-child .nav-link{ font-size:.85rem; }
  /* 본문·푸터 우측 이동 */
  body.nl-admin > .container{ margin-left:256px; max-width:none; width:auto; padding-left:1.4rem; padding-right:1.4rem; }
  body.nl-admin > footer{ margin-left:256px; }
  body.nl-admin > footer .container{ max-width:none; }
}
/* 사이드바 전용 구역(혼합 기관): '협회 전용 ▸' · '자격 전용 ▸' 접이식(<details>) */
body.nl-admin .nl-tier-box > summary{ list-style:none; cursor:pointer; display:flex; align-items:center; gap:.45rem; padding:.55rem 1.1rem; margin-top:.35rem; font-size:.8rem; font-weight:800; letter-spacing:.3px; color:var(--brand); background:color-mix(in srgb, var(--brand) 8%, #fff); border-top:1px solid var(--nl-line); border-bottom:1px solid var(--nl-line); user-select:none; }
body.nl-admin .nl-tier-box > summary::-webkit-details-marker{ display:none; }
body.nl-admin .nl-tier-box > summary:hover{ background:color-mix(in srgb, var(--brand) 13%, #fff); }
body.nl-admin .nl-tier-chev{ display:inline-block; transition:transform .15s; }
body.nl-admin .nl-tier-box[open] > summary .nl-tier-chev{ transform:rotate(90deg); }
body.nl-admin .nl-tier-n{ margin-left:auto; font-size:.72rem; font-weight:800; padding:0 .45rem; border-radius:999px; background:#fff; border:1px solid color-mix(in srgb, var(--brand) 30%, var(--nl-line)); }
body.nl-admin .nl-tier-list{ list-style:none; margin:0; padding:0; border-left:3px solid color-mix(in srgb, var(--brand) 35%, #fff); }
/* ===== [2026-10-15 대표 결정 36] 왼쪽 메뉴 공통 모양 — 학습자 '나의 강의실'(_MyRoomNav)과 운영자 사이드바가 이 규칙 하나를 같이 쓴다(단일 출처).
   묶음 이름 = 1rem·굵게·기관 색·위 구분선 / 소속 메뉴 = 1.7rem 들여쓰기·둥근 줄 / 지금 화면 = 기관 색 옅은 바탕.
   운영자 쪽 동작(접이식 묶음·메뉴 수·★ 자주 쓰는 메뉴, 결정 34)은 그대로 — 모양만 같게. 사이드바(600px↑)·좁은 화면 메뉴 공통 ===== */
.nl-myroom-side{ margin-bottom:1rem; }
.nl-myroom-nav{ background:var(--nl-card); border:1px solid var(--nl-line); border-radius:var(--nl-radius); box-shadow:var(--nl-shadow-sm); padding:.6rem .5rem; }
.nl-myroom-head{ font-weight:800; font-size:1.05rem; padding:.2rem .6rem .5rem; border-bottom:2px solid color-mix(in srgb, var(--brand) 22%, var(--nl-line)); margin-bottom:.3rem; }
@media (min-width:992px){
  .container.nl-myroom{ display:grid; grid-template-columns:minmax(0,1fr) minmax(0,3fr); gap:1.5rem; align-items:start; }
  .nl-myroom-side{ margin-bottom:0; }
}
/* 묶음 이름(학습자 = 글자, 운영자 = 접고 펴는 버튼 · 자주 쓰는 메뉴 제목) */
.nl-myroom-gt,
body.nl-admin header .navbar .nl-grp-btn,
body.nl-admin header .navbar .nl-fav-head{ font-size:1rem; font-weight:800; letter-spacing:0; color:var(--brand); background:transparent; padding:.7rem .6rem .25rem; margin-top:.2rem; border:0; border-top:1px solid var(--nl-line); }
.nl-myroom-nav .nl-myroom-head + .nl-myroom-gt,
body.nl-admin header .navbar .nl-fav-head,
body.nl-admin header .navbar .navbar-nav > .nl-grp:first-child > .nl-grp-btn,
body.nl-admin header .navbar .nl-fav[hidden] + .nl-grp > .nl-grp-btn{ border-top:0; margin-top:0; }
body.nl-admin header .navbar .nl-grp-btn{ display:flex; align-items:center; gap:.45rem; width:100%; text-align:left; cursor:pointer; }
body.nl-admin header .navbar .nl-grp-btn:hover{ background:color-mix(in srgb, var(--brand) 5%, #fff); }
body.nl-admin header .navbar .nl-grp-btn:focus-visible, body.nl-admin header .navbar .nl-star:focus-visible{ outline:2px solid var(--brand); outline-offset:-2px; }
body.nl-admin .nl-grp-chev{ display:inline-block; font-size:.7rem; transition:transform .15s; }
body.nl-admin .nl-grp-btn[aria-expanded="true"] .nl-grp-chev{ transform:rotate(90deg); }
body.nl-admin .nl-grp-n{ margin-left:auto; font-size:.68rem; font-weight:800; padding:0 .45rem; border-radius:999px; background:#fff; border:1px solid color-mix(in srgb, var(--brand) 30%, var(--nl-line)); }
body.nl-admin .nl-grp-list{ list-style:none; margin:0; padding:0 0 .2rem; }
body.nl-admin .nl-grp-list[hidden]{ display:none; }
/* 소속 메뉴 줄(운영자는 줄 = 링크 + ☆, 바탕·둥근 모서리는 줄 전체에) */
.nl-myroom-nav .nav-link,
body.nl-admin header .navbar .nl-grp-list .nl-mi > a{ color:var(--nl-ink); background:transparent; padding:.3rem .6rem .3rem 1.7rem; border-radius:8px; font-size:.92rem; }
body.nl-admin header .navbar .nl-mi{ display:flex; align-items:stretch; border-radius:8px; }
body.nl-admin header .navbar .nl-mi > a{ flex:1 1 auto; min-width:0; }
body.nl-admin header .navbar .navbar-nav > .nl-mi > .nav-link{ background:transparent; padding:.45rem .6rem; border-radius:8px; font-size:.95rem; font-weight:700; }   /* 묶음 밖 단독 링크(대시보드 등) = 묶음 이름 높이 */
.nl-myroom-nav .nav-link:hover,
body.nl-admin header .navbar .nl-mi:hover{ background:color-mix(in srgb, var(--brand) 8%, #fff); }
.nl-myroom-nav .nav-link:hover,
body.nl-admin header .navbar .nl-grp-list .nl-mi:hover > a{ color:var(--brand); }
.nl-myroom-nav .nav-link.active,
body.nl-admin header .navbar .nl-mi:has(> .active){ background:color-mix(in srgb, var(--brand) 12%, #fff); }   /* 강조를 ☆ 칸까지 한 줄로 */
.nl-myroom-nav .nav-link.active,
body.nl-admin header .navbar .nl-grp-list .nl-mi > a.active{ color:var(--brand); font-weight:700; }   /* 운영자 바탕은 줄(.nl-mi)에 — 링크 자체 바탕은 위 기본 규칙(투명) */
/* 묶음 안 소제목(분석·자료 등) — 들여쓴 자리에서 시작, 그 아래 메뉴는 한 단 더 */
body.nl-admin header .navbar .nl-grp-list .dropdown-header.nl-subhead{ margin-left:1.1rem; border-radius:0 6px 6px 0; }
body.nl-admin header .navbar .nl-grp-list .nl-subhead-li ~ .nl-mi > a{ padding-left:2.3rem; }
body.nl-admin header .navbar .nl-star{ flex:0 0 auto; border:0; background:transparent; color:var(--nl-muted); padding:0 .6rem; font-size:.95rem; line-height:1; cursor:pointer; opacity:0; }
body.nl-admin header .navbar .nl-mi:hover > .nl-star, body.nl-admin header .navbar .nl-star:focus-visible, body.nl-admin header .navbar .nl-star[aria-pressed="true"]{ opacity:1; }
body.nl-admin header .navbar .nl-star[aria-pressed="true"]{ color:#b45309; }
body.nl-admin header .navbar .nl-star:hover{ color:var(--brand); }
@media (hover:none){ body.nl-admin header .navbar .nl-star{ opacity:1; } }
/* [대표 지시 2026-10-15] 관리자 메뉴 이름은 한 줄 — 사이드바 256px(가장 긴 "배리어프리 지원 대상 관리"까지 한 줄), 그래도 넘치면 말줄임(…) */
body.nl-admin header .navbar .nl-mi > a{ white-space:nowrap; overflow:hidden; text-overflow:ellipsis; min-width:0; }
body.nl-admin header .navbar .dropdown-item.active, body.nl-admin header .navbar .nl-mi > .nav-link.active{ color:var(--brand); font-weight:700; }
.nl-toast{ position:fixed; right:1rem; bottom:1rem; z-index:1080; max-width:min(92vw, 360px); padding:.65rem .95rem; border-radius:10px; background:#1e2838; color:#fff; font-size:.88rem; box-shadow:var(--nl-shadow); }
.nl-toast.warn{ background:#92400e; }

/* ===== 운영 대시보드 하단 패널(통계 박스의 실제 내용) ===== */
.dash-cols{ display:grid; grid-template-columns:1fr 1fr; gap:1rem; align-items:start; margin-top:1.4rem; }
.dash-span{ grid-column:1 / -1; }
@media (max-width:820px){ .dash-cols{ grid-template-columns:1fr; } }
.dash-panel{ background:var(--nl-card); border:1px solid var(--nl-line); border-radius:var(--nl-radius); box-shadow:var(--nl-shadow-sm); padding:1.1rem 1.25rem 1.25rem; }
.dash-panel-head{ display:flex; justify-content:space-between; align-items:baseline; margin-bottom:.7rem; }
.dash-panel-head h2{ font-size:1.05rem; font-weight:800; margin:0; color:var(--nl-ink); letter-spacing:-.2px; }
.dash-panel-head .dp-link{ font-size:.82rem; font-weight:700; color:var(--brand); text-decoration:none; white-space:nowrap; }
.dash-panel-head .dp-link:hover{ text-decoration:underline; }
.dash-table{ width:100%; border-collapse:collapse; font-size:.9rem; }
.dash-table th{ text-align:left; font-size:.7rem; font-weight:700; color:var(--nl-muted); text-transform:uppercase; letter-spacing:.4px; padding:.35rem .5rem; border-bottom:1px solid var(--nl-line); }
.dash-table td{ padding:.5rem .5rem; border-bottom:1px solid color-mix(in srgb, var(--nl-line) 60%, #fff); }
.dash-table tr:last-child td{ border-bottom:0; }
.dash-table .text-end{ text-align:right; }
.dash-table .dt-strong{ font-weight:700; color:var(--nl-ink); }
.dash-table .dt-muted{ color:var(--nl-muted); }
.dt-badge{ display:inline-block; font-size:.74rem; font-weight:700; padding:.1rem .5rem; border-radius:999px; border:1px solid var(--nl-line); background:var(--nl-bg); color:var(--nl-muted); }
.dt-badge.ok{ background:color-mix(in srgb, #16a34a 12%, #fff); color:#15803d; border-color:color-mix(in srgb, #16a34a 30%, #fff); }
.dt-badge.warn{ background:color-mix(in srgb, #d97706 14%, #fff); color:#92400e; border-color:color-mix(in srgb, #d97706 30%, #fff); } /* [QA-1013-W7-007] 4.33 → 6.1:1 */
.dt-badge.muted{ background:var(--nl-bg); color:var(--nl-muted); }
.dash-empty{ color:var(--nl-muted); font-size:.9rem; padding:.6rem 0 .2rem; }

/* ===== 목록 상단 탭(역할/구분 필터) ===== */
.nl-tabs{ display:flex; gap:.4rem; flex-wrap:wrap; }
.nl-tab{ display:inline-flex; align-items:center; gap:.4rem; padding:.4rem .9rem; border:1px solid var(--nl-line); border-radius:999px; font-size:.88rem; font-weight:700; color:var(--nl-muted); text-decoration:none; background:#fff; }
.nl-tab:hover{ color:var(--brand); border-color:color-mix(in srgb, var(--brand) 30%, var(--nl-line)); }
.nl-tab.active{ background:var(--brand); border-color:var(--brand); color:#fff; }
.nl-tab-n{ font-size:.78rem; font-weight:800; opacity:.8; }
.nl-tab.active .nl-tab-n{ opacity:.95; }

/* ===== 목록 필터 바 + 페이저 ===== */
.nl-filter{ display:flex; gap:.5rem; align-items:center; flex-wrap:wrap; }
.nl-pager{ display:flex; gap:.3rem; flex-wrap:wrap; }
.nl-page{ min-width:2rem; text-align:center; padding:.35rem .5rem; border:1px solid var(--nl-line); border-radius:8px; text-decoration:none; color:var(--nl-ink); font-size:.88rem; font-weight:700; background:#fff; }
.nl-page:hover{ border-color:var(--brand); color:var(--brand); }
.nl-page.active{ background:var(--brand); border-color:var(--brand); color:#fff; }

/* ===== 결제 통계 막대 ===== */
.pay-bar{ margin:.55rem 0; }
.pay-bar-top{ display:flex; justify-content:space-between; align-items:baseline; font-size:.88rem; margin-bottom:.22rem; gap:.5rem; }
.pay-bar-top span{ color:var(--nl-ink); }
.pay-bar-top b{ white-space:nowrap; font-weight:700; }
.pay-bar-track{ height:.5rem; background:var(--nl-bg); border:1px solid var(--nl-line); border-radius:999px; overflow:hidden; }
.pay-bar-fill{ height:100%; background:var(--brand); border-radius:999px; min-width:2px; }
.pay-bar-fill.alt{ background:color-mix(in srgb, var(--brand) 50%, #16a34a); }

/* ===== 감사 로그 심각도 ===== */
.audit-badge{ display:inline-block; font-size:.74rem; font-weight:700; padding:.12rem .55rem; border-radius:999px; border:1px solid var(--nl-line); white-space:nowrap; }
.audit-sev-danger{ background:color-mix(in srgb,#dc2626 10%,#fff); color:#b91c1c; border-color:color-mix(in srgb,#dc2626 30%,#fff); }
.audit-sev-warn{ background:color-mix(in srgb,#d97706 12%,#fff); color:#92400e; border-color:color-mix(in srgb,#d97706 30%,#fff); }
.audit-sev-info{ background:var(--nl-bg); color:var(--nl-muted); border-color:var(--nl-line); }
.nl-tab.audit-sev-danger{ border-color:color-mix(in srgb,#dc2626 35%,var(--nl-line)); }
.nl-tab.audit-sev-warn{ border-color:color-mix(in srgb,#d97706 35%,var(--nl-line)); }
.nl-tab.audit-sev-danger.active{ background:#dc2626; border-color:#dc2626; }
.nl-tab.audit-sev-warn.active{ background:#d97706; border-color:#d97706; }

/* ===== 운영자 상단 바(topbar) — 전체 폭 헤더 + 그 아래 좌측 사이드바(하나의 헤더) ===== */
.nl-topbar{ display:none; }
@media (min-width:600px){
  body.nl-admin .nl-topbar{ position:fixed; top:0; left:0; right:0; height:56px; z-index:1040; display:flex; align-items:center; justify-content:space-between; background:#fff; border-bottom:1px solid var(--nl-line); box-shadow:var(--nl-shadow-sm); }
  body.nl-admin .nl-topbar-brand{ width:240px; flex:0 0 240px; height:56px; display:flex; align-items:center; gap:.55rem; padding:0 1.1rem; text-decoration:none; color:var(--nl-ink); overflow:hidden; }
  body.nl-admin .nl-tb-title{ font-size:1rem; font-weight:800; letter-spacing:-.3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
  /* [2026-10-22 결함 수정] 로고가 있으면 기관명이 '한빛평생...'으로 잘림 → 로고 폭 상한 + 기관명 두 줄까지(넘치면 … · 전체 이름은 title 툴팁) */
  body.nl-admin .nl-topbar-brand .nl-brand-logo{ max-width:88px; object-fit:contain; object-position:left center; }
  body.nl-admin .nl-topbar-brand .nl-brand-logo ~ .nl-tb-title{ font-size:.95rem; line-height:1.2; white-space:normal; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; min-width:0; }
  body.nl-admin .nl-topbar-user{ display:flex; align-items:center; gap:.9rem; padding:0 1.5rem; }
  /* 사이드바를 헤더 아래로, 사이드바 내부 브랜드는 숨김(중복 제거) */
  body.nl-admin header .navbar{ top:56px; }
  body.nl-admin .navbar-brand{ display:none; }
  /* 본문·푸터를 헤더 아래로 */
  body.nl-admin > .container{ margin-top:56px; padding-top:1.4rem; }
}
.nl-tb-name{ color:var(--nl-muted); font-size:.9rem; white-space:nowrap; }
.nl-tb-userbtn{ background:transparent; border:1px solid var(--nl-line); border-radius:8px; padding:.35rem .85rem; font-size:.9rem; font-weight:600; color:var(--nl-ink); cursor:pointer; white-space:nowrap; }
.nl-tb-userbtn:hover{ background:color-mix(in srgb,var(--brand) 6%,#fff); border-color:color-mix(in srgb,var(--brand) 30%,var(--nl-line)); }
.nl-topbar .dropdown-menu{ z-index:1060; }
.nl-tb-logout{ font-size:.85rem; font-weight:700; color:var(--brand); text-decoration:none; padding:.32rem .85rem; border:1px solid var(--nl-line); border-radius:8px; white-space:nowrap; }
.nl-tb-logout:hover{ background:color-mix(in srgb, var(--brand) 8%, #fff); border-color:color-mix(in srgb, var(--brand) 30%, var(--nl-line)); }

/* ── 법적 고지 페이지(이용약관·개인정보처리방침·환불정책) · NTEST7 서식 호환 ── */
.page-head{max-width:880px;margin:1.6rem auto .4rem;padding:0 16px}
.page-head .eyebrow{display:inline-block;font-size:.78rem;font-weight:700;letter-spacing:.04em;color:var(--nl-primary,#0d6efd);text-transform:uppercase}
.page-head__title{font-size:1.7rem;font-weight:800;margin:.3rem 0 .2rem}
.page-head__lead{color:#6b7280;margin:0}
.prose{max-width:880px;margin:0 auto 3rem;padding:0 16px;line-height:1.75}
.prose h2{font-size:1.12rem;font-weight:700;margin:1.7rem 0 .5rem;padding-top:.6rem;border-top:1px solid #e5e7eb}
.prose ul,.prose ol{padding-left:1.3rem}
.prose li{margin-bottom:.35rem}
.prose table{width:100%;border-collapse:collapse;font-size:.93rem;margin:.6rem 0}
.prose th,.prose td{border:1px solid #e5e7eb;padding:.5rem .6rem;text-align:left;vertical-align:top}
.prose th{background:#f8fafc}
.prose hr{margin:1.6rem 0;border:0;border-top:1px solid #e5e7eb}
.prose .text-muted{color:#6b7280}

/* ===== [QA-1013-W7] 접근성·모바일 보강 (2026-10-13 자체검수) ===== */
/* 본문 바로가기(W7-006): 평소 숨김, 키보드 포커스 시 왼쪽 위에 표시 */
.nl-skip:focus{ position:fixed !important; top:.5rem; left:.5rem; z-index:2000; background:#fff; color:var(--nl-ink); padding:.55rem 1rem; border:2px solid var(--brand); border-radius:10px; font-weight:700; box-shadow:var(--nl-shadow); text-decoration:none; }
#main:focus{ outline:0; }
/* 375px 표(W7-002·003): .table-stack = 좁은 화면에서 행을 카드로 쌓음. td data-label = 열 이름, .ts-action = 버튼 칸(가로 전체) */
@media (max-width:575.98px){
  main .table-stack, main > .table-stack{ background:transparent; border:0; box-shadow:none; border-radius:0; overflow:visible; }
  .table-stack > thead{ display:none; }
  .table-stack, .table-stack > tbody, .table-stack > tbody > tr, .table-stack > tbody > tr > td{ display:block; width:100%; }
  .table-stack > tbody > tr{ background:#fff; border:1px solid var(--nl-line); border-radius:12px; box-shadow:var(--nl-shadow-sm); padding:.55rem .85rem; margin-bottom:.6rem; }
  .table-stack > tbody > tr > td{ border:0 !important; padding:.22rem 0; text-align:left !important; }
  .table-stack > tbody > tr > td[data-label]::before{ content:attr(data-label); display:inline-block; min-width:5.2rem; margin-right:.5rem; font-size:.82rem; font-weight:600; color:#5a5e68; }
  .table-stack > tbody > tr > td.ts-action{ padding-top:.45rem; }
  .table-stack > tbody > tr > td.ts-action .btn{ min-height:38px; }
  .table-stack > tbody > tr > td.ts-action > .btn-primary{ width:100%; }
}
/* 작은 글씨·탭 영역(W7-014): 모바일 최소 글자 보강 + 단독 링크 터치 높이 24px 이상 */
@media (max-width:767.98px){
  .form-label{ font-size:.93rem; }
  .table > thead th{ font-size:.86rem; }
  .site-footer-names span, .site-footer-cp, .site-footer-biz{ font-size:.86rem !important; }
}
.nl-linkrow a, .site-footer-legal a{ display:inline-flex; align-items:center; min-height:24px; padding:.15rem .1rem; }

/* [2차 #76-③ 2026-10-29] 교육 일정 달력 */
.course-cal td.cal-out { background: #f8f9fa; color: #adb5bd; }
.course-cal td.cal-out a { opacity: .6; }
.course-cal td.cal-today { box-shadow: inset 0 0 0 2px var(--brand); }

/* [2차 #76-⑤ 2026-10-29] 서식 편집기(도구 막대 + 편집 칸) */
.rich-ed-bar { display: flex; flex-wrap: wrap; gap: 4px; align-items: center; padding: 6px; border: 1px solid var(--bs-border-color, #dee2e6); border-bottom: 0; border-radius: .375rem .375rem 0 0; background: #f8f9fa; }
.rich-ed-area { min-height: 260px; max-height: 70vh; overflow: auto; border-radius: 0 0 .375rem .375rem; }
.rich-ed-area:focus { outline: 2px solid var(--brand); outline-offset: -2px; }
.rich-ed-area table { width: 100%; border-collapse: collapse; } .rich-ed-area th, .rich-ed-area td { border: 1px solid #ccc; padding: 4px 6px; }
.rich-ed-area blockquote { border-left: 3px solid #ccc; padding-left: 10px; color: #555; }

/* [2차 #77] 좁은 화면 표 가로 스크롤 — 표를 감싸는 칸이 없는 화면 공통(페이지 전체가 옆으로 밀리지 않게) */
@media (max-width:767.98px){ main table.table:not(.table-stack){ display:block; overflow-x:auto; } }