/* ============================================================
   KANS Concept 1 — "사이언티픽 라이트" (Scientific Light)
   Applies to: renew layout (homepage + login) header/footer,
   and the homepage sections in theme/kans/mobile/index.php.
   Design tokens per the approved Concept 1 token sheet (v0.2).
   ============================================================ */

:root {
  --c1-navy: #0B1D3A;          /* Deep Navy: headings, dark bands, footer */
  --c1-navy-700: #16345E;      /* dark cards */
  --c1-blue: #1C5FD0;          /* Scientific Blue: primary actions */
  --c1-blue-deep: #16418F;     /* hover, links on light bg */
  --c1-cyan: #3FB6DC;          /* graphics only */
  --c1-cyan-300: #7FD2EC;      /* eyebrow/labels on dark bg */
  --c1-cyan-light: #A8DDEF;
  --c1-bg: #FFFFFF;
  --c1-bg-cool: #F4F8FC;
  --c1-bg-tint: #EDF4FB;
  --c1-line: #E2EAF4;
  --c1-line-inner: #EFF4FA;
  --c1-line-page: #E7EEF6;
  --c1-grey-300: #C6D6E8;
  --c1-t-heading: #0B1D3A;
  --c1-t-emph: #33465F;
  --c1-t-body: #4A5C74;
  --c1-t-meta: #5B6B84;         /* 2026-09-23 a11y: 4.6:1 이상(#F4F8FC 위) — 구 #64748B 는 4.3:1 */
  --c1-orange: #E8842B;        /* status dots only */
  --c1-amber-text: #A75B12;
  --c1-green: #15784B;
  --c1-cal-sun: #B4554E;
  --c1-cal-sat: #3D5FB0;
  --c1-font: 'Pretendard', 'Noto Sans KR', -apple-system, sans-serif;
  --c1-mono: 'IBM Plex Mono', monospace;
  --c1-r-btn: 14px;
  --c1-shadow-btn: 0 10px 24px rgba(28, 95, 208, 0.28);
  --c1-shadow-card: 0 14px 34px rgba(11, 29, 58, 0.12);
  --c1-shadow-frame: 0 24px 60px rgba(11, 29, 58, 0.10);
}

/* ---------- base ---------- */
html { font-size: 16px; }
.c1-home *, .c1-home *::before, .c1-home *::after,
#headerWrap *, #headerWrap *::before, #headerWrap *::after,
footer.footer *, footer.footer *::before, footer.footer *::after { box-sizing: border-box; }
body {
  margin: 0;
  font-family: var(--c1-font);
  color: var(--c1-t-heading);
  background: var(--c1-bg);
  -webkit-font-smoothing: antialiased;
  font-size: 16px;
  line-height: 1.6;
  word-break: keep-all;
}
.c1-home a { color: inherit; text-decoration: none; }
/* 본문 텍스트 캐럿(캐럿 브라우징 등으로 생기는 깜빡이는 검은 막대) 숨김 — 입력창은 예외 */
.c1-home, .c1-home * { caret-color: transparent; }
.c1-home input, .c1-home textarea, .c1-home [contenteditable] { caret-color: auto; }
.c1-home img { max-width: 100%; }
.guide { width: 92%; max-width: 1240px; margin: 0 auto; }
/* base.css의 .guide::after 클리어픽스가 flex/grid에서 빈 아이템으로 끼어들어
   space-between 정렬을 깨뜨림 — 컨셉1 레이아웃 영역에서는 제거 */
.c1-home .guide::after, #headerWrap .guide::after, footer.footer .guide::after { content: none; }
.c1-mono { font-family: var(--c1-mono); letter-spacing: 0.14em; }
.c1-eyebrow { font-size: 13px; font-weight: 800; letter-spacing: 0.14em; color: var(--c1-blue); }
.c1-h2 { margin: 14px 0 0; font-size: 40px; font-weight: 900; letter-spacing: -0.02em; line-height: 1.25; color: var(--c1-t-heading); }
.c1-h3 { font-size: 30px; font-weight: 900; letter-spacing: -0.02em; color: var(--c1-t-heading); }
.c1-lead { margin: 14px 0 0; font-size: 16px; line-height: 1.7; color: var(--c1-t-body); }

.c1-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  height: 56px; padding: 0 30px; border-radius: var(--c1-r-btn);
  font-size: 15.5px; font-weight: 700; cursor: pointer; border: 0;
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.c1-btn--primary { background: var(--c1-blue); color: #fff !important; box-shadow: var(--c1-shadow-btn); }
.c1-btn--primary:hover { background: var(--c1-blue-deep); }
.c1-btn--ghost { background: #fff; color: var(--c1-t-heading) !important; border: 1px solid var(--c1-line); }
.c1-btn--ghost:hover { border-color: var(--c1-blue); color: var(--c1-blue-deep) !important; }
.c1-btn--sm { height: 44px; padding: 0 22px; font-size: 14.5px; }

.c1-chip {
  display: inline-flex; align-items: center; height: 30px; padding: 0 13px;
  border-radius: 999px; font-size: 12.5px; font-weight: 700;
  background: rgba(28, 95, 208, 0.08); color: var(--c1-blue-deep);
}
.c1-card {
  background: #fff; border: 1px solid var(--c1-line); border-radius: 20px;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.c1-card:hover { transform: translateY(-2px); box-shadow: var(--c1-shadow-card); }
.c1-arrow-link {
  display: inline-flex; align-items: center; gap: 8px; white-space: nowrap;
  font-size: 15px; font-weight: 700; color: var(--c1-blue) !important;
}
.c1-arrow-link:hover { color: var(--c1-blue-deep) !important; }
.c1-arrow-link svg { flex-shrink: 0; }

@keyframes c1-pulse-ring { 0% { transform: scale(0.9); opacity: 0.55; } 100% { transform: scale(1.25); opacity: 0; } }
@keyframes c1-drift-a { 0% { transform: translate(0, 0); } 50% { transform: translate(10px, -8px); } 100% { transform: translate(0, 0); } }
@keyframes c1-drift-b { 0% { transform: translate(0, 0); } 50% { transform: translate(-8px, 10px); } 100% { transform: translate(0, 0); } }
@keyframes c1-dash-flow { to { stroke-dashoffset: -120; } }
@keyframes c1-dot-blink { 0%, 100% { opacity: 1; } 50% { opacity: 0.25; } }
.c1-anim-ring { transform-box: fill-box; transform-origin: center; animation: c1-pulse-ring 4.5s ease-out infinite; }
.c1-anim-ring2 { transform-box: fill-box; transform-origin: center; animation: c1-pulse-ring 4.5s ease-out 1.5s infinite; }
.c1-anim-ring3 { transform-box: fill-box; transform-origin: center; animation: c1-pulse-ring 4.5s ease-out 3s infinite; }
.c1-drift-a { animation: c1-drift-a 12s ease-in-out infinite; }
.c1-drift-b { animation: c1-drift-b 15s ease-in-out infinite; }
.c1-flow { stroke-dasharray: 4 8; animation: c1-dash-flow 6s linear infinite; }
.c1-blink { animation: c1-dot-blink 2.2s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) {
  .c1-anim-ring, .c1-anim-ring2, .c1-anim-ring3, .c1-drift-a, .c1-drift-b, .c1-flow, .c1-blink,
  .c1-card { animation: none; transition: none; }
}

/* ============================================================
   HEADER  (renew/head.php — homepage + login)
   ============================================================ */
.c1-hairline {
  height: 4px;
  background: linear-gradient(90deg, #0B1D3A 0%, #16418F 30%, #1C5FD0 55%, #3FB6DC 80%, #E8842B 100%);
}
/* 스티키 헤더 (§8.1 S-01): 스크롤 시 축소 + 블러 강화 */
#headerWrap { position: sticky; top: 0; z-index: 100; }
#headerWrap .header {
  background: rgba(255, 255, 255, 0.92);
  backdrop-filter: blur(8px);
  border-bottom: 1px solid var(--c1-line-page);
  transition: background 0.25s ease, box-shadow 0.25s ease;
}
#headerWrap.is-scrolled .header {
  background: rgba(255, 255, 255, 0.86);
  backdrop-filter: blur(14px);
  box-shadow: 0 8px 24px rgba(11, 29, 58, 0.07);
}
.c1-header-row, #headerWrap .header-btn .gnb-menu-list > li > a { transition: height 0.25s ease; }
#headerWrap.is-scrolled .c1-header-row,
#headerWrap.is-scrolled .header-btn .gnb-menu-list > li > a { height: 64px; }
#headerWrap.is-scrolled .header-btn .gnb-menu-list > li > a::after { bottom: 8px; }
@media (prefers-reduced-motion: reduce) {
  #headerWrap .header, .c1-header-row, #headerWrap .header-btn .gnb-menu-list > li > a { transition: none; }
}
.c1-header-row {
  height: 84px; display: flex; align-items: center; justify-content: space-between; gap: 24px;
}
.c1-header-row .logo { margin: 0; flex-shrink: 0; font-size: 0; }
.c1-header-row .logo img { height: 26px; width: auto; display: block; }

/* GNB — class names kept for js/renew/common.js hover binding */
#headerWrap .gnb { flex: 1; display: flex; justify-content: center; }
#headerWrap .header-btn .gnb-menu-list { display: flex; align-items: center; gap: 38px; margin: 0; padding: 0; list-style: none; }
#headerWrap .header-btn .gnb-menu-list > li { position: relative; }
#headerWrap .header-btn .gnb-menu-list > li > a {
  display: inline-flex; align-items: center; height: 84px;
  font-size: 16px; font-weight: 700; color: var(--c1-t-emph); position: relative;
}
#headerWrap .header-btn .gnb-menu-list > li > a:hover { color: var(--c1-blue); }
#headerWrap .header-btn .gnb-menu-list > li > a::after {
  content: ''; position: absolute; left: 50%; bottom: 16px;
  width: 5px; height: 5px; margin-left: -2.5px; border-radius: 50%;
  background: var(--c1-blue); opacity: 0; transition: opacity 0.2s ease;
}
/* hover: 텍스트 deep blue + 흐린 점 · active(현재 카테고리): 텍스트 blue · 800 · 진한 점 — 서로 구분되며 하위 페이지 전체에서 유지 */
#headerWrap .header-btn .gnb-menu-list > li > a:hover { color: var(--c1-blue-deep); }
#headerWrap .header-btn .gnb-menu-list > li > a:hover::after { opacity: 0.35; }
#headerWrap .header-btn .gnb-menu-list > li > a[aria-current] { color: var(--c1-blue); font-weight: 800; }
#headerWrap .header-btn .gnb-menu-list > li > a[aria-current]::after,
#headerWrap .header-btn .gnb-menu-list > li > a[aria-current]:hover::after { opacity: 1; }
/* dropdown — slideDown/slideUp from common.js; display governed by jQuery */
#headerWrap .header-btn .sub-menu {
  display: none; position: absolute; left: 50%; top: 100%; transform: translateX(-50%);
  min-width: 210px; margin: 0; padding: 12px 0; list-style: none;
  background: #fff; border: 1px solid var(--c1-line); border-radius: 16px;
  box-shadow: var(--c1-shadow-frame); z-index: 110;
}
#headerWrap .header-btn .sub-menu li a {
  display: block; padding: 10px 24px; font-size: 15px; font-weight: 500;
  color: var(--c1-t-emph); white-space: nowrap;
}
#headerWrap .header-btn .sub-menu li a:hover {
  color: var(--c1-blue-deep); background: var(--c1-bg-tint);
}
/* header actions */
.c1-header-actions { display: flex; align-items: center; gap: 18px; flex-shrink: 0; }
.c1-header-actions .c1-txt-link { font-size: 16px; font-weight: 500; color: var(--c1-t-emph); }
.c1-header-actions .c1-txt-link:hover { color: var(--c1-blue); }
.c1-header-actions .c1-act-outline {
  display: inline-flex; align-items: center; height: 44px; padding: 0 20px;
  border: 1px solid var(--c1-line); color: var(--c1-t-emph);
  border-radius: var(--c1-r-btn); font-size: 14.5px; font-weight: 700;
}
.c1-header-actions .c1-act-outline:hover { border-color: var(--c1-blue); color: var(--c1-blue-deep); }
.c1-header-actions .c1-act-primary {
  display: inline-flex; align-items: center; height: 44px; padding: 0 22px;
  background: var(--c1-blue); color: #fff; border-radius: var(--c1-r-btn);
  font-size: 14.5px; font-weight: 700;
}
.c1-header-actions .c1-act-primary:hover { background: var(--c1-blue-deep); }
/* legacy common.css와 공존하는 페이지(로그인)에서 헤더 레이아웃 강제 */
#headerWrap .header-btn { position: static; height: auto; background: transparent; border: 0; }
#headerWrap .header-btn .guide.c1-header-row { display: flex !important; position: relative; float: none; }
#headerWrap .c1-header-row .logo { position: static !important; float: none; margin: 0; }
#headerWrap .c1-header-row .logo a { display: inline-flex; align-items: center; }
#headerWrap .gnb { position: static !important; float: none; height: auto; background: transparent; }
#headerWrap .header-btn .gnb-menu-list > li { margin: 0; padding: 0; float: none; width: auto; }
#headerWrap .c1-header-actions { position: static !important; float: none; margin: 0; }

/* 가+/가− 글자 크기 (S-01): 3단계, 브라우저별 기억 */
.c1-fontsize { display: inline-flex; align-items: center; gap: 2px; margin-right: 4px; }
.c1-fontsize button {
  min-width: 34px; height: 34px; padding: 0 6px; border: 1px solid var(--c1-line);
  background: #fff; border-radius: 10px; cursor: pointer;
  font-family: var(--c1-font); font-size: 13px; font-weight: 700; color: var(--c1-t-emph);
}
.c1-fontsize button:hover { border-color: var(--c1-blue); color: var(--c1-blue-deep); }
.c1-fontsize button:disabled { opacity: 0.35; cursor: default; }
.c1-fontsize button:disabled:hover { border-color: var(--c1-line); color: var(--c1-t-emph); }
@media (max-width: 1279px) { .c1-fontsize { display: none; } }

/* 법적 고지 페이지 (privacy.php / terms.php — 리다이렉트 맵 7.6) */
.c1-legal-wrap { background: var(--c1-bg-cool); }
.c1-legal { padding: 72px 0 96px; }
.c1-legal .guide { max-width: 880px; }
.c1-legal__body {
  margin-top: 34px; background: #fff; border: 1px solid var(--c1-line); border-radius: 20px;
  padding: 40px 44px; font-size: 15px; line-height: 1.85; color: var(--c1-t-body);
  white-space: pre-wrap; word-break: keep-all;
}
@media (max-width: 767px) {
  .c1-legal { padding: 40px 0 56px; }
  .c1-legal__body { padding: 22px 20px; font-size: 14px; border-radius: 14px; }
}

/* 헤더 검색 (S-01a): 아이콘 → 인라인 확장 입력 */
.c1-search { position: relative; display: flex; align-items: center; }
.c1-search__btn {
  width: 40px; height: 40px; border: 0; background: none; cursor: pointer;
  display: inline-flex; align-items: center; justify-content: center;
  border-radius: 12px; color: var(--c1-t-emph); padding: 0;
}
.c1-search__btn:hover { background: var(--c1-bg-tint); color: var(--c1-blue); }
.c1-search__form {
  display: flex; align-items: center; gap: 6px;
  background: #fff; border: 1px solid var(--c1-blue); border-radius: var(--c1-r-btn);
  padding: 0 12px; height: 44px; width: 240px;
  animation: c1-search-in 0.2s ease;
}
.c1-search__form[hidden] { display: none; }
@keyframes c1-search-in { from { width: 60px; opacity: 0.4; } to { width: 240px; opacity: 1; } }
@media (prefers-reduced-motion: reduce) { .c1-search__form { animation: none; } }
.c1-search__form input[type="text"] {
  flex: 1; min-width: 0; border: 0; outline: none; background: none;
  font-family: var(--c1-font); font-size: 14.5px; color: var(--c1-t-heading);
}
.c1-search__form input[type="text"]::placeholder { color: var(--c1-t-meta); }
.c1-search__submit {
  border: 0; background: none; cursor: pointer; padding: 4px; display: inline-flex; color: var(--c1-blue);
}
.c1-search__hint {
  position: absolute; top: calc(100% + 6px); left: 0; white-space: nowrap;
  background: var(--c1-navy); color: #fff; font-size: 12px; padding: 6px 10px; border-radius: 8px;
}
.c1-search__hint[hidden] { display: none; }
@media (max-width: 1023px) {
  .c1-search__form {
    position: absolute; right: -56px; top: calc(100% + 10px); width: calc(100vw - 32px); max-width: 420px;
    box-shadow: var(--c1-shadow-frame);
  }
  @keyframes c1-search-in { from { opacity: 0; } to { opacity: 1; } }
}

/* hamburger — .mob_gnb_open class kept for common.js */
.mob-view.mob_gnb_open {
  display: none; width: 44px; height: 44px; border-radius: 12px;
  align-items: center; justify-content: center; cursor: pointer; color: var(--c1-navy);
}
.mob-view.mob_gnb_open:hover { background: var(--c1-bg-tint); }

/* ---------- mobile GNB drawer (classes kept for common.js) ---------- */
.mob-gnb-layer {
  display: none; position: fixed; inset: 0; z-index: 1000;
  background: rgba(11, 29, 58, 0.5);
}
.mob-gnb-layer > .cont-box {
  position: absolute; top: 0; right: -100%; width: min(360px, 88%); height: 100%;
  background: #fff; overflow-y: auto; box-shadow: -24px 0 60px rgba(11, 29, 58, 0.25);
}
.mob-gnb-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 14px 20px; border-bottom: 1px solid var(--c1-line-page);
}
.mob-gnb-head .member-menu .menu-list { display: flex; gap: 14px; margin: 0; padding: 0; list-style: none; }
.mob-gnb-head .member-menu .menu-list a {
  display: inline-flex; align-items: center; gap: 7px;
  font-size: 14px; font-weight: 700; color: var(--c1-t-emph);
}
.mob-gnb-head .mob_gnb_btn { cursor: pointer; width: 40px; height: 40px; display: flex; align-items: center; justify-content: center; border-radius: 10px; }
.mob-gnb-head .mob_gnb_btn:hover { background: var(--c1-bg-tint); }
.mob-gnb-head .mob_gnb_btn img { width: 18px; height: 18px; }
.mob-gnb .left_area { padding: 8px 0 40px; }
.mob-gnb .mob_gnb .gnb-menu-list { display: block; margin: 0; padding: 0; list-style: none; }
.mob-gnb .mob_gnb .gnb-menu-list > li { border-bottom: 1px solid var(--c1-line-inner); }
.mob-gnb .mob_gnb .gnb-menu-list > li > div {
  padding: 16px 22px; font-size: 16.5px; font-weight: 800; color: var(--c1-t-heading);
  cursor: pointer; position: relative;
}
.mob-gnb .mob_gnb .gnb-menu-list > li > div::after {
  content: ''; position: absolute; right: 22px; top: 50%; width: 8px; height: 8px;
  border-right: 2px solid var(--c1-grey-300); border-bottom: 2px solid var(--c1-grey-300);
  transform: translateY(-70%) rotate(45deg); transition: transform 0.2s ease;
}
.mob-gnb .mob_gnb .gnb-menu-list > li.active > div { color: var(--c1-blue); }
.mob-gnb .mob_gnb .gnb-menu-list > li.active > div::after {
  transform: translateY(-30%) rotate(225deg); border-color: var(--c1-blue);
}
.mob-gnb .mob_gnb .gnb-menu-list > li .sub-menu {
  display: none; margin: 0; padding: 4px 0 14px; list-style: none; background: var(--c1-bg-cool);
}
.mob-gnb .mob_gnb .gnb-menu-list > li.active .sub-menu { display: block; }
.mob-gnb .mob_gnb .sub-menu li a {
  display: block; padding: 10px 30px; font-size: 15px; font-weight: 500; color: var(--c1-t-body);
}
.mob-gnb .mob_gnb .sub-menu li a:hover { color: var(--c1-blue-deep); }
.mob-gnb .right_area { display: none; }

/* ---------- quick sidebar (kept from renew, restyled) ---------- */
.quick-sidebar {
  position: fixed; right: 18px; top: 50%; transform: translateY(-50%); z-index: 90;
  width: 96px; background: #fff; border: 1px solid var(--c1-line);
  border-radius: 16px; box-shadow: var(--c1-shadow-frame); padding: 10px 6px;
}
.quick-sidebar .quick-title {
  font-family: var(--c1-font); font-size: 11.5px; font-weight: 800; letter-spacing: 0.04em; text-align: center;
  color: var(--c1-blue); padding: 6px 0 10px; border-bottom: 1px solid var(--c1-line-inner);
}
.quick-sidebar .quick-menu { margin: 0; padding: 0; list-style: none; }
.quick-sidebar .quick-menu > li { border-bottom: 1px solid var(--c1-line-inner); }
.quick-sidebar .quick-menu > li:last-child { border-bottom: 0; }
.quick-sidebar .quick-menu a {
  display: flex; flex-direction: column; align-items: center; gap: 4px;
  padding: 9px 2px; text-align: center;
}
.quick-sidebar .quick-menu a .icon { color: var(--c1-blue); font-size: 16px; }
.quick-sidebar .quick-menu a .title { font-size: 10.5px; line-height: 1.35; color: var(--c1-t-emph); font-weight: 600; }
.quick-sidebar .quick-menu a:hover .title { color: var(--c1-blue-deep); }
.quick-sidebar .bank-info { padding: 9px 4px 4px; text-align: center; }
.quick-sidebar .bank-info h4 { margin: 0 0 4px; font-size: 10.5px; color: var(--c1-blue-deep); }
.quick-sidebar .bank-info { font-size: 10px; color: var(--c1-t-meta); line-height: 1.5; }
.quick-sidebar .bank-info strong { font-size: 10px; color: var(--c1-t-heading); word-break: break-all; }
.quick-sidebar .bank-info p { margin: 2px 0 0; }

/* ============================================================
   HOMEPAGE SECTIONS
   ============================================================ */

/* ---------- hero ---------- */
.c1-hero {
  position: relative; overflow: hidden;
  background: linear-gradient(180deg, #FFFFFF 0%, #F4F8FC 62%, #EDF4FB 100%);
}
.c1-hero__texture {
  position: absolute; inset: 0; width: 100%; height: 100%;
  object-fit: cover; object-position: center 60%; opacity: 0.13;
}
.c1-hero__wash {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(255,255,255,0.86) 0%, rgba(255,255,255,0.3) 55%, rgba(244,248,252,0.08) 100%);
}
.c1-hero__grid { position: absolute; inset: 0; width: 100%; height: 100%; }
/* 시안과 동일한 고정 높이(736px) 히어로 — 하단 여백은 패딩이 아니라 남는 높이로 생김 */
.c1-hero .guide { position: relative; display: flex; padding: 92px 0 0; min-height: 736px; }
.c1-hero__copy { width: 560px; flex-shrink: 0; }
.c1-hero__badge {
  display: inline-flex; align-items: center; gap: 9px;
  border: 1px solid rgba(28, 95, 208, 0.25); background: rgba(255, 255, 255, 0.7);
  border-radius: 999px; padding: 8px 16px;
}
.c1-hero__badge .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--c1-cyan); display: inline-block; }
.c1-hero__badge span:last-child { font-size: 12.5px; font-weight: 800; letter-spacing: 0.06em; color: var(--c1-blue-deep); }
.c1-hero__title {
  margin: 30px 0 0; font-size: 62px; font-weight: 900; line-height: 1.22;
  letter-spacing: -0.025em; color: var(--c1-t-heading);
}
.c1-hero__desc { margin: 26px 0 0; font-size: 17.5px; line-height: 1.75; color: var(--c1-t-body); max-width: 470px; }
.c1-hero__cta { margin-top: 40px; display: flex; gap: 14px; flex-wrap: wrap; }
/* 히어로 프로모 스트립 (7.13 기본안): CTA 아래 한 줄, 활성 게시물 없으면 미출력 */
.c1-promo {
  margin-top: 18px; display: flex; align-items: center; gap: 10px;
  max-width: 470px; min-height: 46px; padding: 0 16px;
  background: #ffffff; border: 1px solid rgba(28, 95, 208, 0.22);
  border-radius: var(--c1-r-btn); overflow: hidden;
  box-shadow: 0 6px 18px rgba(11, 29, 58, 0.06);
  transition: border-color 0.2s ease;
}
.c1-promo:hover { border-color: var(--c1-blue); }
.c1-promo__icon { color: var(--c1-blue); display: inline-flex; flex-shrink: 0; }
.c1-promo__items { flex: 1; min-width: 0; display: flex; }
.c1-promo__item {
  display: none; font-size: 13.5px; font-weight: 700; color: var(--c1-blue-deep);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0;
}
.c1-promo__item.is-active { display: block; }
a.c1-promo__item:hover { text-decoration: underline; }
.c1-promo__count { flex-shrink: 0; font-size: 12px; color: var(--c1-t-meta); }
.c1-promo__nav { flex-shrink: 0; display: inline-flex; gap: 2px; }
.c1-promo__nav button {
  width: 24px; height: 24px; border: 0; background: none; cursor: pointer; border-radius: 8px;
  color: var(--c1-t-emph); line-height: 0; padding: 0;
  display: inline-flex; align-items: center; justify-content: center;
}
.c1-promo__nav button:hover { background: var(--c1-bg-tint); color: var(--c1-blue); }

.c1-hero__points {
  margin-top: 46px; padding-top: 26px; border-top: 1px solid rgba(28, 95, 208, 0.14);
  display: flex; gap: 26px; flex-wrap: wrap;
}
.c1-hero__points span {
  display: inline-flex; align-items: center; gap: 8px;
  font-size: 14px; font-weight: 700; line-height: 1.4; color: var(--c1-t-emph);
}
.c1-hero__viz { position: relative; flex: 1; min-height: 560px; margin-left: 40px; }
.c1-hero__viz > svg { position: absolute; inset: 0; }
.c1-hero__pane {
  position: absolute; left: 438px; top: 130px; width: 58px; height: 330px; border-radius: 20px;
  background: linear-gradient(160deg, rgba(255,255,255,0.75), rgba(168,221,239,0.4));
  border: 1px solid rgba(63, 182, 220, 0.5); backdrop-filter: blur(5px);
  box-shadow: 0 18px 40px rgba(28, 95, 208, 0.16); transform: rotate(3deg);
}
.c1-hero__pane--thin {
  left: 470px; top: 148px; width: 30px; height: 300px; border-radius: 14px;
  background: linear-gradient(160deg, rgba(255,255,255,0.5), rgba(168,221,239,0.25));
  border: 1px solid rgba(63, 182, 220, 0.3); box-shadow: none; backdrop-filter: none;
}
.c1-inst-chip {
  display: inline-flex; align-items: center; gap: 8px;
  background: rgba(255, 255, 255, 0.86); border: 1px solid rgba(28, 95, 208, 0.22);
  border-radius: 10px; padding: 7px 12px; font-family: var(--c1-mono);
  font-size: 12px; font-weight: 700; letter-spacing: 0.05em; color: var(--c1-blue-deep);
  backdrop-filter: blur(6px); box-shadow: 0 6px 18px rgba(11, 29, 58, 0.08);
}
.c1-hero__meter {
  position: absolute; left: 500px; top: 400px;
  background: rgba(255, 255, 255, 0.92); border: 1px solid var(--c1-line);
  border-radius: 14px; padding: 14px 18px; box-shadow: 0 14px 34px rgba(11, 29, 58, 0.1);
  backdrop-filter: blur(6px);
}
.c1-hero__meter .lbl { font-size: 12px; font-weight: 700; letter-spacing: 0.04em; color: var(--c1-t-meta); }
.c1-hero__meter .val { margin-top: 4px; font-family: var(--c1-mono); font-size: 20px; font-weight: 600; color: var(--c1-blue-deep); }
.c1-hero__meter .val span { font-size: 12px; color: var(--c1-t-meta); }
.c1-hero__meter .att { margin-top: 3px; font-size: 12px; font-weight: 700; color: var(--c1-green); }

/* ---------- quick access floating bar ---------- */
.c1-quick { position: relative; background: #fff; }
/* 시안과 동일: relative top 오프셋으로 바만 히어로 위로 겹침 (음수 마진은 섹션 배경까지 끌어올리므로 금지) */
.c1-quick .guide { position: relative; top: -58px; margin-bottom: -58px; z-index: 5; }
.c1-quick { padding-bottom: 58px; }
.c1-quick__bar {
  display: flex; background: #fff; border: 1px solid var(--c1-line);
  border-radius: 26px; box-shadow: var(--c1-shadow-frame); overflow: hidden;
}
.c1-quick__cell {
  flex: 1; display: flex; align-items: center; gap: 14px; padding: 24px 22px;
  position: relative; color: inherit;
}
.c1-quick__cell + .c1-quick__cell::before {
  content: ''; position: absolute; left: 0; top: 20px; bottom: 20px; width: 1px;
  background: var(--c1-line-inner);
}
/* 2026-09-18: 첫 셀(교육신청)이 기본 선택처럼 보이던 --active 배경/아이콘/부제 강조를 데스크톱에서 제거하고, 마우스를 올린 셀(키보드 포커스 포함)에만 적용.
   ≤767 모바일 아트보드의 대표 카드(2열 span) 처리는 아래 모바일 블록에서 그대로 유지. */
.c1-quick__cell { transition: background 0.2s ease; }
@media (min-width: 768px) {
  .c1-quick__cell:hover, .c1-quick__cell:focus-visible { background: linear-gradient(135deg, rgba(28,95,208,0.07), rgba(63,182,220,0.08)); outline: none; }
  .c1-quick__cell:hover .c1-quick__icon, .c1-quick__cell:focus-visible .c1-quick__icon { background: var(--c1-blue); color: #fff; box-shadow: var(--c1-shadow-btn); }
  .c1-quick__cell:hover .c1-quick__sub, .c1-quick__cell:focus-visible .c1-quick__sub { color: var(--c1-blue); font-weight: 600; }
}
.c1-quick__icon {
  width: 52px; height: 52px; border-radius: var(--c1-r-btn); background: var(--c1-bg-tint);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  color: var(--c1-blue); transition: background 0.2s ease, color 0.2s ease;
}
.c1-quick__cell:hover .c1-quick__icon { background: var(--c1-blue); color: #fff; }
.c1-quick__cell > span:last-child { display: flex; flex-direction: column; min-width: 0; }
.c1-quick__title { display: block; font-size: 16px; font-weight: 800; color: var(--c1-t-heading); line-height: 1.3; }
.c1-quick__sub { display: block; margin-top: 3px; font-size: 12.5px; color: var(--c1-t-meta); }

/* ---------- section shell ---------- */
.c1-section { padding: 104px 0 110px; background: #fff; }
.c1-section--cool { background: var(--c1-bg-cool); }
.c1-section__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 24px; }
.c1-section__head .c1-lead { max-width: 520px; }

/* ---------- programs ---------- */
.c1-programs { padding: 52px 0 110px; }
.c1-programs__grid { margin-top: 48px; display: flex; gap: 28px; }
.c1-program-feature {
  width: 45%; flex-shrink: 0; border-radius: 26px;
  background: linear-gradient(165deg, #F4F8FC 0%, #EDF4FB 100%);
  border: 1px solid var(--c1-line); padding: 40px 42px; position: relative; overflow: hidden;
  display: block; color: inherit;
}
.c1-program-feature__orbit { position: absolute; right: -70px; top: -70px; }
.c1-program-feature__top { display: flex; align-items: center; justify-content: space-between; position: relative; }
.c1-program-feature__num { font-family: var(--c1-mono); letter-spacing: 0.14em; font-size: 13px; font-weight: 600; color: var(--c1-t-meta); }
.c1-program-feature__title { margin: 22px 0 0; font-size: 30px; font-weight: 900; letter-spacing: -0.02em; color: var(--c1-t-heading); position: relative; }
.c1-program-feature__desc { margin: 14px 0 0; max-width: 420px; font-size: 16px; line-height: 1.75; color: var(--c1-t-body); position: relative; }
.c1-program-feature__photo {
  position: relative; margin-top: 26px; height: 176px; border-radius: 16px;
  overflow: hidden; box-shadow: var(--c1-shadow-card);
}
.c1-program-feature__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 32%; }
.c1-program-feature__photo::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(11,29,58,0) 55%, rgba(11,29,58,0.35) 100%);
}
.c1-program-feature__steps { margin-top: 30px; position: relative; }
.c1-program-feature__steps svg { width: 100%; height: 64px; display: block; }
.c1-program-feature__labels { display: grid; grid-template-columns: repeat(3, 1fr); margin-top: 2px; }
.c1-program-feature__labels div { font-size: 12.5px; font-weight: 700; color: var(--c1-blue-deep); }
.c1-program-feature__labels div:nth-child(2) { text-align: center; }
.c1-program-feature__labels div:nth-child(3) { text-align: right; }
.c1-program-feature__cta { margin-top: 30px; display: flex; gap: 12px; position: relative; align-items: center; }
.c1-program-rail { flex: 1; position: relative; display: flex; flex-direction: column; gap: 24px; }
/* 갱신 시안: 선이 첫/마지막 도트 중심에서 시작·끝 — (100%-갭48px)/6 = 행 높이의 절반 */
.c1-program-rail__line {
  position: absolute; left: 11px; top: calc((100% - 48px) / 6); bottom: calc((100% - 48px) / 6); width: 2px;
  background: linear-gradient(180deg, #1C5FD0 0%, #3FB6DC 60%, #E2EAF4 100%);
}
.c1-program-row { flex: 1; display: flex; gap: 24px; position: relative; }
.c1-program-row__dot-col { width: 24px; flex-shrink: 0; display: flex; align-items: center; justify-content: center; }
.c1-program-row__dot { width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 3px solid var(--c1-blue); }
.c1-program-row:nth-child(4) .c1-program-row__dot { border-color: var(--c1-cyan); }
.c1-program-card {
  flex: 1; padding: 24px 28px; cursor: pointer; display: flex; flex-direction: column; justify-content: center;
  color: inherit;
}
.c1-program-card:hover, .c1-program-card:focus-visible {
  border-color: var(--c1-blue); box-shadow: 0 18px 40px rgba(28, 95, 208, 0.16); outline: none;
}
.c1-program-card__top { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
.c1-program-card__name { display: flex; align-items: baseline; gap: 14px; }
.c1-program-card__num { font-family: var(--c1-mono); letter-spacing: 0.14em; font-size: 12px; font-weight: 600; color: var(--c1-t-meta); }
.c1-program-card__title { font-size: 20px; font-weight: 800; color: var(--c1-t-heading); }
.c1-program-card__desc { margin: 10px 0 0; font-size: 16px; line-height: 1.65; color: var(--c1-t-body); }
.c1-program-card__more {
  max-height: 0; opacity: 0; overflow: hidden; margin-top: 0; padding-top: 0;
  border-top: 1px dashed transparent; display: flex; justify-content: space-between; align-items: center;
  transition: all 0.35s ease;
}
.c1-program-card:hover .c1-program-card__more, .c1-program-card:focus-visible .c1-program-card__more {
  max-height: 70px; opacity: 1; margin-top: 14px; padding-top: 14px; border-top-color: var(--c1-line);
}
.c1-program-card__more .hint { font-size: 13px; color: var(--c1-t-meta); }
@media (prefers-reduced-motion: reduce) { .c1-program-card__more { transition: none; } }

/* ---------- dashboard: schedule + news ---------- */
.c1-dashboard { padding: 104px 0 110px; background: #fff; position: relative; overflow: hidden; }
/* 시안 S4: 필드 텍스처 6% + 흰색 세로 워시 → 은은한 그레이 톤 */
.c1-dashboard__texture { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.06; }
.c1-dashboard__wash { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(255,255,255,0.55) 0%, rgba(255,255,255,0.92) 70%); }
.c1-dashboard .guide { position: relative; display: flex; gap: 56px; }
.c1-dash-left { width: 56%; flex-shrink: 0; }
.c1-dash-right { flex: 1; min-width: 0; }

/* S-05 다가오는 교육일정 타임라인 (§8.1: 다음 4개 회차, 월 무관) */
.c1-dash-left__head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; }
.c1-timeline { margin-top: 40px; position: relative; }
.c1-timeline__track {
  position: absolute; left: 8px; right: 8px; top: 7px; height: 2px;
  background: linear-gradient(90deg, #1C5FD0, #3FB6DC 70%, #E2EAF4);
}
.c1-timeline__grid { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.c1-timeline__item { display: flex; flex-direction: column; min-width: 0; }
.c1-timeline__dot {
  width: 16px; height: 16px; border-radius: 50%; background: #fff;
  border: 4px solid var(--c1-blue); margin-left: 8px; position: relative; z-index: 1; flex-shrink: 0; box-sizing: border-box;
}
.c1-timeline__dot.is-muted { border-color: var(--c1-grey-300); }
.c1-timeline__card { margin-top: 18px; padding: 20px 20px 18px; flex: 1; display: flex; flex-direction: column; color: inherit; }
.c1-timeline__month { font-size: 12px; font-weight: 700; letter-spacing: 0.06em; color: var(--c1-t-meta); }
.c1-timeline__day { font-size: 26px; font-weight: 900; color: var(--c1-t-heading); margin-top: 2px; }
.c1-timeline__to { font-size: 15px; font-weight: 700; color: var(--c1-t-meta); margin-left: 2px; }
.c1-timeline__card .c1-chip--sm { height: 24px; font-size: 12px; padding: 0 11px; margin-top: 10px; }
.c1-timeline__title {
  margin-top: 10px; font-size: 16px; font-weight: 700; line-height: 1.5; color: var(--c1-t-heading);
  overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
}
.c1-status { margin-top: auto; padding-top: 12px; display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 700; }
.c1-status i { width: 6px; height: 6px; border-radius: 50%; display: inline-block; }
.c1-status--open { color: var(--c1-blue); } .c1-status--open i { background: var(--c1-blue); }
.c1-status--soon { color: var(--c1-amber-text); } .c1-status--soon i { background: var(--c1-orange); }
.c1-status--closed { color: var(--c1-t-meta); } .c1-status--closed i { background: var(--c1-grey-300); }
/* 월 목록이 4건 초과일 때: 줄바꿈 대신 가로 스크롤 — 트랙은 JS가 스크롤 전체 폭으로 확장(연속선 유지) */
.c1-timeline--scroll .c1-timeline__grid {
  display: flex; overflow-x: auto; gap: 18px; padding-bottom: 8px; -webkit-overflow-scrolling: touch;
}
/* 카드 폭 = 4열 그리드와 동일((100% - 갭 3개)/4), 초과분은 스크롤로 */
.c1-timeline--scroll .c1-timeline__item { flex: 0 0 calc((100% - 54px) / 4); position: relative; }
.c1-timeline-empty {
  margin-top: 40px; padding: 34px 20px; text-align: center; border: 1px dashed var(--c1-line);
  border-radius: 16px; font-size: 15px; color: var(--c1-t-meta); background: rgba(255, 255, 255, 0.6);
}
@media (max-width: 767px) {
  .c1-timeline { margin-top: 24px; }
  .c1-timeline__track { display: none; }
  .c1-timeline__grid { display: flex; overflow-x: auto; gap: 12px; padding-bottom: 8px; -webkit-overflow-scrolling: touch; }
  .c1-timeline__item { flex: 0 0 168px; }
  .c1-timeline .c1-timeline__dot, .c1-timeline--scroll .c1-timeline__dot { display: none; }
  .c1-timeline .c1-timeline__track { display: none; }
  .c1-timeline__card { margin-top: 0; padding: 16px 16px 14px; }
  .c1-timeline__day { font-size: 22px; }
}

/* S-10 홍보채널 — 디자인 SECTION 6B 사양 그대로 */
.c1-channels { background: var(--c1-bg-cool); padding: 96px 0 100px; border-top: 1px solid var(--c1-line-page); }
.c1-channels__head { text-align: center; }
.c1-channels__head .c1-lead { margin-left: auto; margin-right: auto; }
.c1-channels__grid { margin-top: 44px; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px; }
.c1-channel-card {
  display: flex; align-items: center; gap: 22px; padding: 30px 32px; color: inherit;
  background: #fff; border: 1px solid var(--c1-line); border-radius: var(--c1-r-btn);
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.c1-channel-card:hover { transform: translateY(-2px); box-shadow: var(--c1-shadow-card); }
.c1-channel-card__icon {
  width: 60px; height: 60px; border-radius: var(--c1-r-btn);
  background: var(--c1-bg-cool); border: 1px solid var(--c1-line-page);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
}
.c1-channel-card__body { min-width: 0; }
.c1-channel-card__name { display: block; font-size: 20px; font-weight: 800; color: var(--c1-t-heading); }
.c1-channel-card__desc { display: block; margin-top: 6px; font-size: 15px; line-height: 1.6; color: var(--c1-t-body); }
.c1-channel-card__link { display: block; margin-top: 10px; font-size: 13px; font-weight: 700; color: var(--c1-blue); }
.c1-channels__note { margin-top: 20px; text-align: center; font-size: 13px; color: var(--c1-t-body); }
@media (prefers-reduced-motion: reduce) { .c1-channel-card { transition: none; } }
@media (max-width: 767px) {
  .c1-channels { padding: 48px 0 52px; }
  .c1-channels__head { text-align: left; }
  .c1-channels__head .c1-lead { margin-left: 0; }
  .c1-channels__grid { grid-template-columns: 1fr; gap: 12px; margin-top: 22px; }
  .c1-channel-card { padding: 20px 20px; gap: 16px; }
  .c1-channel-card__icon { width: 50px; height: 50px; }
  .c1-channel-card__name { font-size: 17px; }
  .c1-channels__note { text-align: left; }
}

/* calendar — legacy class names preserved for index.php JS */
.c1-dash-left .calendar-head { display: flex; justify-content: space-between; align-items: flex-end; gap: 16px; }
.c1-dash-left .calendar-title { margin-top: 12px; font-size: 30px; font-weight: 900; letter-spacing: -0.02em; color: var(--c1-t-heading); }
.c1-dash-left .calendar-title span { display: block; margin-top: 6px; font-size: 14px; font-weight: 600; letter-spacing: 0; color: var(--c1-t-meta); }
.c1-dash-left .calendar-control { display: flex; align-items: center; gap: 12px; }
.c1-dash-left .month-control, .c1-dash-left .calendar-control .calendar-date {
  display: inline-flex; align-items: center; gap: 10px;
  border: 1px solid var(--c1-line); border-radius: var(--c1-r-btn);
  padding: 9px 14px; font-size: 14px; font-weight: 700; color: var(--c1-t-heading); background: #fff;
}
.c1-dash-left .month-control.off, .c1-dash-left .calendar-control .calendar-date.off { display: none; }
.c1-dash-left .month-btn {
  background: none; border: 0; cursor: pointer; padding: 2px 6px;
  font-size: 14px; font-weight: 700; color: var(--c1-t-emph); line-height: 1;
}
.c1-dash-left .month-btn:hover { color: var(--c1-blue); }
.c1-dash-left .date_control { font-family: var(--c1-mono); letter-spacing: 0.08em; font-size: 13.5px; }
.c1-cal-card { margin-top: 28px; padding: 26px 28px 20px; cursor: default; }
.c1-cal-card:hover { transform: none; box-shadow: none; }
.c1-cal-card__head { display: flex; justify-content: space-between; align-items: center; }
.c1-cal-card__title { font-size: 16.5px; font-weight: 800; color: var(--c1-t-heading); }
.c1-cal-card__legend { display: inline-flex; align-items: center; gap: 7px; font-size: 12px; font-weight: 700; color: var(--c1-blue-deep); }
.c1-cal-card__legend i { width: 9px; height: 9px; border-radius: 3px; background: var(--c1-blue); display: inline-block; }
/* 홈 달력 월 이동 로딩 (2026-09-18): index.php 월 버튼 핸들러가 요청 중 .c1-cal-card 에 is-loading 부여 → 요일/날짜 그리드 위 오버레이 + 스피너, 버튼 잠금 */
.c1-cal-card .calendar { position: relative; }
.c1-cal-card__loading {
  display: none; position: absolute; inset: 0; z-index: 3; flex-direction: column; align-items: center; justify-content: center; gap: 10px;
  background: rgba(255, 255, 255, 0.72); border-radius: 12px; font-size: 13px; font-weight: 600; color: var(--c1-navy);
}
.c1-cal-card.is-loading .c1-cal-card__loading { display: flex; }
.c1-cal-card__spin {
  width: 30px; height: 30px; border-radius: 50%; box-sizing: border-box;
  border: 3px solid var(--c1-line); border-top-color: var(--c1-blue); animation: c1-cal-card-spin 0.8s linear infinite;
}
@keyframes c1-cal-card-spin { to { transform: rotate(360deg); } }
.c1-cal-card.is-loading .calendar-date { opacity: 0.5; transition: opacity 0.15s ease; }
.c1-dash-left .month-btn:disabled { opacity: 0.45; cursor: default; }
.c1-dash-left .month-btn:disabled:hover { color: inherit; }
.c1-cal-card__error { grid-column: 1 / -1; padding: 28px 12px; text-align: center; font-size: 13px; color: var(--c1-t-meta); background: var(--c1-bg-cool); border-radius: 12px; }
@media (prefers-reduced-motion: reduce) { .c1-cal-card__spin { animation: none; border-top-color: var(--c1-line); } }
.c1-dash-left .calendar { margin-top: 14px; }
.c1-dash-left .calendar-week { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; }
.c1-dash-left .calendar-week > div {
  height: 30px; display: flex; align-items: center; justify-content: center;
  font-size: 13px; font-weight: 700; color: var(--c1-t-meta);
}
.c1-dash-left .calendar-week > div.sun span { color: var(--c1-cal-sun); }
.c1-dash-left .calendar-week > div.sat span { color: var(--c1-cal-sat); }
.c1-dash-left .calendar > .calendar-date { display: grid; grid-template-columns: repeat(7, 1fr); gap: 3px; }
.c1-dash-left .calendar > .calendar-date > div {
  height: 40px; display: flex; align-items: center; justify-content: center;
}
.c1-dash-left .calendar > .calendar-date > div > span {
  width: 100%; height: 38px; display: flex; align-items: center; justify-content: center;
  font-size: 14px; font-weight: 600; color: var(--c1-t-emph); border-radius: 10px;
}
.c1-dash-left .calendar > .calendar-date > div:nth-child(7n+1) > span { color: var(--c1-cal-sun); }
.c1-dash-left .calendar > .calendar-date > div:nth-child(7n) > span { color: var(--c1-cal-sat); }
.c1-dash-left .calendar > .calendar-date > div.check-schedule > span {
  background: var(--c1-blue); color: #fff !important; font-weight: 800; cursor: pointer;
  box-shadow: 0 6px 14px rgba(28, 95, 208, 0.24);
}
.c1-dash-left .calendar > .calendar-date > div.check-schedule > span:hover,
.c1-dash-left .calendar > .calendar-date > div.check-schedule > span.selected { background: var(--c1-blue-deep); }
/* day schedule list */
.c1-dash-left .calendar-schedule { margin-top: 16px; }
.c1-dash-left .calendar-schedule.off { display: none; }
.c1-dash-left .calendar-schedule ul { margin: 0; padding: 0; list-style: none; }
.c1-dash-left .calendar-schedule ul li {
  display: flex; align-items: center; gap: 12px; padding: 12px 14px;
  border: 1px solid var(--c1-line); border-radius: 12px; margin-bottom: 8px;
  cursor: pointer; background: #fff; transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
.c1-dash-left .calendar-schedule ul li:hover { border-color: var(--c1-blue); box-shadow: 0 10px 24px rgba(28, 95, 208, 0.12); }
.c1-dash-left .calendar-schedule .course-time { margin: 0; flex-shrink: 0; }
.c1-dash-left .calendar-schedule .course-time span {
  font-family: var(--c1-mono); font-size: 12px; font-weight: 600; color: var(--c1-t-meta);
}
.c1-dash-left .calendar-schedule .course-name { margin: 0; font-size: 14.5px; font-weight: 600; color: var(--c1-t-heading); line-height: 1.45; }
.c1-dash-left .calendar-schedule .course-kind {
  display: inline-flex; align-items: center; height: 22px; padding: 0 9px; margin-right: 6px;
  border-radius: 999px; background: rgba(28, 95, 208, 0.08); color: var(--c1-blue-deep);
  font-size: 11.5px; font-weight: 700;
}

/* news */
.c1-news__head { display: flex; justify-content: space-between; align-items: flex-end; }
.c1-news__title { margin-top: 12px; font-size: 30px; font-weight: 900; letter-spacing: -0.02em; color: var(--c1-t-heading); }
/* tabs — ids kept for common.js tab handler */
.c1-dash-right .tabs { margin-top: 0; }
.c1-dash-right #tabs-nav {
  margin: 26px 0 0; padding: 0; list-style: none;
  display: flex; gap: 6px; border-bottom: 1px solid var(--c1-line-page);
}
.c1-dash-right #tabs-nav li a {
  display: block; padding: 10px 16px 12px; font-size: 14.5px; font-weight: 600;
  color: var(--c1-t-meta); border-bottom: 2.5px solid transparent; margin-bottom: -1px;
}
.c1-dash-right #tabs-nav li.active a { font-weight: 800; color: var(--c1-blue); border-bottom-color: var(--c1-blue); }
.c1-dash-right { position: relative; }
.c1-dash-right .tab-content { padding-top: 8px; }
/* 전체보기: 디자인대로 새소식 제목 행 우측 상단 */
.c1-dash-right .board-con .btn-more {
  position: absolute; right: 0; top: 44px; display: inline-flex; align-items: center; gap: 7px;
  font-size: 14px; font-weight: 700; color: var(--c1-blue);
}
.c1-dash-right .board-con .btn-more::after { content: '\2192'; font-size: 15px; }
.c1-dash-right .board-con .btn-more img { display: none; }
.c1-dash-right .board-con ul { margin: 12px 0 0; padding: 0; list-style: none; }
.c1-dash-right .board-con ul li { border-bottom: 1px solid var(--c1-line-inner); }
/* 일반 행: 제목 좌 · 날짜(MM.DD) 우, 한 줄 */
.c1-dash-right .board-con ul li a {
  display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 15px 6px;
}
.c1-dash-right .board-con ul li h5 {
  order: 1; flex: 1; min-width: 0;
  margin: 0; font-size: 16px; font-weight: 500; color: var(--c1-t-emph); line-height: 1.5;
  overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical;
}
.c1-dash-right .board-con ul li a:hover h5 { color: var(--c1-blue-deep); }
.c1-dash-right .board-con ul li .txt { display: none; margin: 0; }
.c1-dash-right .board-con ul li .meta { order: 2; flex-shrink: 0; display: inline-flex; align-items: center; gap: 10px; }
.c1-dash-right .board-con ul li .chip { display: none; }
.c1-dash-right .board-con ul li .date {
  font-family: var(--c1-mono); letter-spacing: 0.08em; font-size: 12px; color: var(--c1-t-meta);
}
.c1-dash-right .board-con ul li .date .y { display: none; }
/* 피처드(첫 항목): [공지 칩 + 전체 날짜] → 제목 → 요약 */
.c1-dash-right .board-con ul li.is-open {
  margin-bottom: 8px; border: 1px solid var(--c1-line); border-radius: 20px;
  background: linear-gradient(135deg, #F4F8FC, #EDF4FB);
}
.c1-dash-right .board-con ul li.is-open a {
  flex-direction: column; align-items: stretch; gap: 0; padding: 22px 24px;
}
.c1-dash-right .board-con ul li.is-open .meta { order: 0; align-self: flex-start; }
.c1-dash-right .board-con ul li.is-open .chip {
  display: inline-flex; align-items: center; height: 24px; padding: 0 11px;
  border-radius: 999px; background: var(--c1-blue); color: #fff;
  font-size: 12px; font-weight: 700; font-style: normal;
}
.c1-dash-right .board-con ul li.is-open .date .y { display: inline; }
.c1-dash-right .board-con ul li.is-open h5 {
  order: 0; margin-top: 12px; flex: none; font-size: 16.5px; font-weight: 800; color: var(--c1-t-heading); -webkit-line-clamp: 2;
}
.c1-dash-right .board-con ul li.is-open .txt { order: 1; }
.c1-dash-right .board-con ul li.is-open .txt {
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
  margin: 8px 0 0; font-size: 15px; line-height: 1.6; color: var(--c1-t-body);
}
.c1-dash-right .board-con ul li.none_li { border: 0; background: none; }
.c1-dash-right .board-con ul li.none_li .meta { display: none; }
/* video card under news */
.c1-video-card {
  margin-top: 24px; position: relative; border-radius: 20px; overflow: hidden;
  background: var(--c1-navy); box-shadow: var(--c1-shadow-card);
}
.c1-video-card iframe { display: block; width: 100%; aspect-ratio: 16 / 9; height: auto; border: 0; }

/* ---------- banner slider (admin slides) ---------- */
.c1-banner-sec { padding: 0 0 110px; background: #fff; }
.c1-banner-sec .main-banner { position: relative; }
.c1-banner-sec .swiper-container {
  overflow: hidden; position: relative; border-radius: 26px;
  box-shadow: var(--c1-shadow-frame); border: 1px solid var(--c1-line);
  max-width: 880px; margin: 0 auto;
}
.c1-banner-sec .swiper-wrapper { display: flex; }
.c1-banner-sec .swiper-slide {
  flex-shrink: 0; width: 100%; position: relative;
  aspect-ratio: 800 / 520; height: auto;
  background-position: center top !important; background-repeat: no-repeat !important;
}
.c1-banner-sec .swiper-slide .txt_box { position: absolute; left: 6%; top: 50%; transform: translateY(-50%); color: #fff; }
.c1-banner-sec .swiper-slide .txt_box .title { font-size: 34px; font-weight: 900; line-height: 1.3; letter-spacing: -0.02em; }
.c1-banner-sec .swiper-slide .txt_box .info { margin-top: 16px; font-size: 16px; line-height: 1.7; opacity: 0.85; }
.c1-banner-sec .main-banner-pagination {
  position: absolute; right: 22px; bottom: 18px; z-index: 10;
  display: flex; align-items: center; gap: 10px;
  background: rgba(11, 29, 58, 0.55); backdrop-filter: blur(6px);
  border-radius: 999px; padding: 7px 14px;
}
.c1-banner-sec .swiper-pagination {
  position: static; display: inline-flex; gap: 4px; font-family: var(--c1-mono);
  font-size: 12px; font-weight: 600; color: rgba(255, 255, 255, 0.85); width: auto;
}
.c1-banner-sec .swiper-util .swiper-control { display: inline-flex; align-items: center; gap: 6px; }
.c1-banner-sec .swiper-button-prev, .c1-banner-sec .swiper-button-next {
  position: static; width: 24px; height: 24px; margin: 0; cursor: pointer;
  color: #fff; background: none; display: flex; align-items: center; justify-content: center;
}
.c1-banner-sec .swiper-button-prev::after, .c1-banner-sec .swiper-button-next::after {
  font-family: inherit; font-size: 14px; font-weight: 900; color: #fff;
}
.c1-banner-sec .swiper-button-prev::after { content: '\2039'; }
.c1-banner-sec .swiper-button-next::after { content: '\203A'; }
.c1-banner-sec .btn-swiper-play, .c1-banner-sec .btn-swiper-stop {
  background: none; border: 0; cursor: pointer; color: #fff; font-size: 14px;
  width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; padding: 0;
}
.c1-banner-sec .btn-swiper-play { display: none; }

/* ---------- contact band ---------- */
.c1-contact { background: var(--c1-navy); position: relative; overflow: hidden; }
.c1-contact__texture { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.12; }
.c1-contact__wash { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(11,29,58,0.92) 0%, rgba(11,29,58,0.78) 100%); }
.c1-contact .guide {
  position: relative; padding: 62px 0 58px;
  display: grid; grid-template-columns: 220px repeat(5, 1fr); gap: 24px; align-items: center;
}
.c1-contact__intro .c1-eyebrow { color: var(--c1-cyan-300); }
.c1-contact__intro h3 { margin: 10px 0 0; font-size: 26px; font-weight: 900; letter-spacing: -0.02em; color: #fff; }
.c1-contact__item { border-left: 1px solid rgba(255, 255, 255, 0.16); padding-left: 20px; }
.c1-contact__item dt { font-size: 13px; font-weight: 700; color: rgba(255, 255, 255, 0.6); }
/* 2026-09-22: 대표번호 라벨도 다른 라벨과 같은 회색 — first-of-type 시안(cyan) 강조 제거 */
.c1-contact__item dd { margin: 8px 0 0; }
.c1-contact__item dd a {
  display: inline-block; padding: 4px 10px; border-radius: 8px;
  font-family: var(--c1-mono); font-size: 19px; font-weight: 600; letter-spacing: 0.02em;
  background: rgba(255, 255, 255, 0.10); color: rgba(255, 255, 255, 0.88);
  transition: background-color 0.2s ease, color 0.2s ease;
}
.c1-contact__item dd a:hover, .c1-contact__item dd a:focus-visible { background: var(--c1-blue); color: #fff; outline: none; }

/* ---------- knowledge hub (안전정보) ---------- */
.c1-knowledge { background: var(--c1-bg-cool); padding: 104px 0 110px; }
.c1-knowledge__grid { margin-top: 46px; display: flex; gap: 28px; }
.c1-know-feature {
  position: relative; width: 56.5%; flex-shrink: 0; min-height: 470px;
  border-radius: 26px; overflow: hidden; box-shadow: var(--c1-shadow-frame); display: block;
}
.c1-know-feature img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.c1-know-feature::after {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(200deg, rgba(11,29,58,0) 30%, rgba(11,29,58,0.78) 82%);
}
.c1-know-feature__body { position: absolute; left: 40px; right: 40px; bottom: 38px; z-index: 1; }
.c1-chip--glass {
  background: rgba(255, 255, 255, 0.16); color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.35); backdrop-filter: blur(4px);
}
.c1-know-feature__title { margin: 16px 0 0; font-size: 30px; font-weight: 900; line-height: 1.4; letter-spacing: -0.02em; color: #fff; }
.c1-know-feature__sub { margin-top: 10px; font-size: 16px; line-height: 1.6; color: rgba(255, 255, 255, 0.78); }
.c1-know-feature__meta { margin-top: 14px; font-size: 12.5px; font-weight: 600; color: rgba(255, 255, 255, 0.7); }
.c1-know-stack { flex: 1; display: flex; flex-direction: column; gap: 24px; min-width: 0; }
.c1-know-dark {
  position: relative; flex: 1; border-radius: 20px; overflow: hidden;
  background: linear-gradient(150deg, #16345E, #0B1D3A); padding: 30px 32px; display: block;
}
.c1-know-dark__orbit { position: absolute; right: -60px; bottom: -60px; }
.c1-know-dark > .c1-chip, .c1-know-dark__title, .c1-know-dark__sub, .c1-know-dark__link { position: relative; z-index: 1; }
.c1-chip--cyan { background: rgba(63, 182, 220, 0.16); color: var(--c1-cyan-300); }
.c1-know-dark__title { margin: 16px 0 0; font-size: 20px; font-weight: 800; line-height: 1.5; color: #fff; }
.c1-know-dark__sub { margin-top: 10px; font-size: 16px; line-height: 1.65; color: rgba(255, 255, 255, 0.62); max-width: 300px; }
.c1-know-dark__link { margin-top: 18px; display: inline-flex; align-items: center; gap: 8px; font-size: 14px; font-weight: 700; color: var(--c1-cyan-300); }
.c1-know-video { position: relative; height: 224px; border-radius: 20px; overflow: hidden; display: block; }
.c1-know-video img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: center 55%; }
.c1-know-video::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,29,58,0.1), rgba(11,29,58,0.66)); }
.c1-know-video__body {
  position: absolute; left: 28px; bottom: 24px; right: 28px; z-index: 1;
  display: flex; justify-content: space-between; align-items: flex-end;
}
.c1-know-video__title { margin-top: 10px; font-size: 20px; font-weight: 800; color: #fff; }
.c1-know-video__play {
  width: 56px; height: 56px; border-radius: 50%; background: rgba(255, 255, 255, 0.92);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0;
  box-shadow: 0 10px 26px rgba(11, 29, 58, 0.3);
}

/* ---------- connected services (연계 서비스 orbit) ---------- */
.c1-services { background: #fff; padding: 104px 0 110px; position: relative; overflow: hidden; }
.c1-services__texture { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.07; }
.c1-services__wash { position: absolute; inset: 0; background: radial-gradient(ellipse at center, rgba(255,255,255,0) 30%, rgba(255,255,255,0.9) 100%); }
.c1-services .guide { position: relative; }
.c1-services__head { text-align: center; }
.c1-services__head .c1-lead { margin-left: auto; margin-right: auto; }
.c1-orbit { position: relative; height: 440px; margin-top: 30px; }
.c1-orbit__svg { position: absolute; inset: 0; width: 100%; height: 100%; }
.c1-orbit__hub {
  position: absolute; left: 50%; top: 222px; transform: translate(-50%, -50%);
  width: 190px; height: 190px; border-radius: 50%;
  background: linear-gradient(150deg, #16418F, #0B1D3A);
  box-shadow: 0 26px 60px rgba(11, 29, 58, 0.32);
  display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center;
}
.c1-orbit__hub-title { font-size: 16.5px; font-weight: 900; color: #fff; }
.c1-orbit__hub-sub { margin-top: 4px; font-size: 12px; color: rgba(255, 255, 255, 0.55); }
.c1-orbit__node { position: absolute; width: 218px; }
.c1-orbit__node--sm { width: 200px; }
.c1-orbit__node > a { display: flex; align-items: center; gap: 13px; padding: 18px 20px; }
.c1-orbit__icon {
  width: 40px; height: 40px; border-radius: var(--c1-r-btn); background: var(--c1-bg-tint);
  display: flex; align-items: center; justify-content: center; flex-shrink: 0; color: var(--c1-blue);
}
.c1-orbit__name { font-size: 16px; font-weight: 800; color: var(--c1-t-heading); }
.c1-orbit__meta { margin-top: 3px; font-size: 12px; color: var(--c1-t-meta); }
.c1-orbit__meta.c1-mono { letter-spacing: 0.03em; }
/* 모바일/좁은 폭: 세로 레일 리스트 (시안 모바일 레이아웃) */
.c1-services__rail { display: none; }
.c1-orgs { margin-top: 26px; display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 12px; }
.c1-orgs__label { font-family: var(--c1-mono); letter-spacing: 0.14em; font-size: 12px; font-weight: 600; color: var(--c1-t-meta); }
.c1-orgs__div { width: 1px; height: 16px; background: var(--c1-line); }
.c1-orgs .c1-chip { background: transparent; border: 1px solid var(--c1-line); color: var(--c1-t-body); font-weight: 600; }
.c1-orgs a.c1-chip:hover { border-color: var(--c1-blue); color: var(--c1-blue-deep); }

/* ---------- facility band (교육시설 안내) ---------- */
.c1-facility { position: relative; min-height: 520px; overflow: hidden; display: flex; align-items: stretch; }
.c1-facility__photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.c1-facility__wash {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(11,29,58,0.93) 0%, rgba(11,29,58,0.55) 52%, rgba(11,29,58,0.2) 100%);
}
.c1-facility .guide { position: relative; padding: 104px 0; }
.c1-facility__eyebrow { font-size: 13px; font-weight: 800; letter-spacing: 0.14em; color: var(--c1-cyan-300); }
.c1-facility__title { margin: 16px 0 0; font-size: 40px; font-weight: 900; line-height: 1.3; letter-spacing: -0.02em; color: #fff; }
.c1-facility__desc { margin: 16px 0 0; font-size: 16px; line-height: 1.7; color: rgba(255, 255, 255, 0.72); max-width: 460px; }
.c1-facility__cta { margin-top: 34px; display: flex; gap: 14px; flex-wrap: wrap; }
.c1-facility__cta .c1-btn--outline-w {
  background: transparent; color: #fff !important; border: 1px solid rgba(255, 255, 255, 0.45);
}
.c1-facility__cta .c1-btn--outline-w:hover { border-color: #fff; }

@media (max-width: 1023px) {
  .c1-knowledge { padding: 52px 0 56px; }
  .c1-knowledge__grid { flex-direction: column; gap: 14px; margin-top: 24px; }
  /* 안전정보 머리글: '콘텐츠 전체 보기'를 제목과 같은 줄 오른쪽에, 헤딩(먹) 색으로
     (링크는 좌측 텍스트 블록의 형제라 display:contents 로 감싸개를 걷어내고 그리드 배치) */
  .c1-knowledge .c1-section__head {
    display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 0 12px;
  }
  .c1-knowledge .c1-section__head > div { display: contents; }
  .c1-knowledge .c1-section__head .c1-eyebrow { grid-area: 1 / 1 / 2 / 3; }
  .c1-knowledge .c1-section__head .c1-h2 { grid-area: 2 / 1 / 3 / 2; }
  .c1-knowledge .c1-section__head .c1-lead { grid-area: 3 / 1 / 4 / 3; }
  .c1-knowledge .c1-section__head .c1-arrow-link {
    grid-area: 2 / 2 / 3 / 3; justify-self: end; white-space: nowrap; font-size: 13px;
  }
  .c1-know-feature { width: 100%; min-height: 250px; border-radius: 18px; }
  .c1-know-feature__body { left: 20px; right: 20px; bottom: 18px; }
  .c1-know-feature__title { font-size: 20px; margin-top: 9px; }
  .c1-know-feature__sub { font-size: 15px; margin-top: 5px; }
  .c1-know-dark { border-radius: 18px; padding: 20px 22px; }
  .c1-know-dark__title { font-size: 17px; margin-top: 10px; }
  .c1-know-video { height: 150px; border-radius: 18px; }
  .c1-know-video__body { left: 18px; right: 16px; bottom: 15px; }
  .c1-know-video__title { font-size: 15.5px; margin-top: 8px; }
  .c1-know-video__play { width: 44px; height: 44px; }
  .c1-orbit { display: none; }
  .c1-services__head { text-align: left; }
  .c1-services__head .c1-lead { margin-left: 0; }
  .c1-services__rail { display: flex; gap: 18px; margin-top: 22px; }
  .c1-services__rail-line { width: 20px; flex-shrink: 0; position: relative; }
  .c1-services__rail-line::before {
    content: ''; position: absolute; left: 9px; top: 10px; bottom: 10px; width: 2px;
    background: linear-gradient(180deg, #1C5FD0 0%, #1C5FD0 40%, #3FB6DC 70%, #7FD2EC 100%);
  }
  .c1-services__rail-cards { flex: 1; display: flex; flex-direction: column; gap: 12px; }
  .c1-services__rail-cards .c1-card { position: relative; }
  /* 도트 중심 = 레일 선 중심(레일 칼럼 20px + gap 18px 기준 left:-34px → 칼럼 내 4px, 중심 10px) */
  .c1-services__rail-cards .c1-card::before {
    content: ''; position: absolute; left: -34px; top: 50%; margin-top: -6px;
    width: 12px; height: 12px; border-radius: 50%; background: #fff; border: 3px solid var(--c1-blue); box-sizing: border-box;
  }
  /* 아트보드 순서대로 도트 색 단계: 1·2번 블루 → 3번 시안 → 4번 라이트 시안 */
  .c1-services__rail-cards .c1-card:nth-child(3)::before { border-color: var(--c1-cyan); }
  .c1-services__rail-cards .c1-card:nth-child(4)::before { border-color: var(--c1-cyan-300); }
  .c1-services__rail-cards .c1-card > a { display: flex; justify-content: space-between; align-items: center; padding: 15px 17px; }
  .c1-orgs { justify-content: flex-start; }
}
@media (max-width: 767px) {
  .c1-services { padding: 52px 0 48px; }
  /* 교육시설 밴드 — 모바일 아트보드: 세로 그라디언트, 설명문 없음, 제목 한 줄, 버튼 화살표 없음 */
  .c1-facility { min-height: 340px; }
  .c1-facility__wash { background: linear-gradient(180deg, rgba(11,29,58,0.5) 0%, rgba(11,29,58,0.9) 100%); }
  .c1-facility .guide { padding: 0; display: flex; flex-direction: column; justify-content: flex-end; padding-bottom: 26px; width: 92%; }
  .c1-facility__eyebrow { font-size: 12px; }
  .c1-facility__title { font-size: 26px; margin-top: 10px; line-height: 1.3; }
  .c1-facility__title br { display: none; }
  .c1-facility__desc { display: none; }
  .c1-facility__cta { margin-top: 16px; gap: 10px; }
  .c1-facility__cta .c1-btn { height: 44px; padding: 0 20px; font-size: 14px; }
  .c1-facility__cta .c1-btn--outline-w { padding: 0 18px; }
  .c1-facility__cta .c1-btn svg { display: none; }
}

/* ============================================================
   FOOTER  (renew/tail.php)
   ============================================================ */
/* overflow:hidden 금지 — 패밀리사이트 드롭다운(위로 열림)이 잘림. 텍스처는 inset:0이라 넘치지 않음 */
footer.footer { background: var(--c1-navy); position: relative; }
.c1-footer__texture { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0.4; }
.c1-footer__wash { position: absolute; inset: 0; background: linear-gradient(180deg, rgba(11,29,58,0.82) 0%, rgba(11,29,58,0.66) 100%); }
.c1-footer__main { position: relative; display: flex; gap: 80px; padding: 72px 0 56px; }
.c1-footer__org { width: 380px; flex-shrink: 0; }
.c1-footer__logo { display: inline-flex; align-items: center; background: #fff; border-radius: 10px; padding: 9px 14px; }
.c1-footer__logo img { height: 24px; width: auto; display: block; }
.c1-footer__addr { margin: 22px 0 0; font-style: normal; font-size: 14px; line-height: 1.8; color: rgba(255, 255, 255, 0.72); }
.c1-footer__addr a { color: rgba(255, 255, 255, 0.72); }
.c1-footer__addr a:hover { color: var(--c1-cyan-300); }
.c1-footer__addr .map-btn {
  display: inline-flex; align-items: center; margin-left: 10px; padding: 2px 10px;
  border: 1px solid rgba(255, 255, 255, 0.25); border-radius: 999px;
  font-size: 12px; font-weight: 700; color: var(--c1-cyan-300);
}
.c1-footer__links { flex: 1; display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; }
.c1-footer__col-title {
  font-family: var(--c1-mono); letter-spacing: 0.14em;
  font-size: 12px; font-weight: 600; color: var(--c1-cyan);
}
.c1-footer__col ul { margin: 18px 0 0; padding: 0; list-style: none; display: flex; flex-direction: column; gap: 12px; }
.c1-footer__col ul a { font-size: 14px; color: rgba(255, 255, 255, 0.65); }
.c1-footer__col ul a:hover { color: #fff; }
.c1-footer__badges { margin-top: 24px; display: flex; gap: 10px; flex-wrap: wrap; }
.c1-footer__badge {
  display: inline-flex; align-items: center; gap: 8px;
  border: 1px solid rgba(255, 255, 255, 0.18); border-radius: 10px;
  padding: 9px 14px; font-size: 12.5px; font-weight: 600; color: rgba(255, 255, 255, 0.72);
}
/* family site dropdown — .familySite mechanics from common.js kept */
.c1-footer .family-site { margin-top: 22px; }
.c1-footer .familySite { position: relative; width: 230px; }
.c1-footer .familySite > a {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  width: 100%; border: 1px solid rgba(255, 255, 255, 0.2); border-radius: 10px;
  padding: 11px 14px; font-size: 13px; color: rgba(255, 255, 255, 0.72); cursor: pointer;
}
.c1-footer .familySite > a:hover { border-color: var(--c1-cyan-300); color: #fff; }
.c1-footer .familySite > div {
  display: none; position: absolute; left: 0; bottom: calc(100% + 8px); z-index: 30;
  width: 100%; background: #fff; border: 1px solid var(--c1-line);
  border-radius: 14px; box-shadow: var(--c1-shadow-frame); padding: 10px 0;
  max-height: min(430px, 70vh); overflow-y: auto;
}
.c1-footer .familySite > div a {
  display: block; padding: 9px 20px; font-size: 13.5px; color: var(--c1-t-emph);
}
.c1-footer .familySite > div a:hover { background: var(--c1-bg-tint); color: var(--c1-blue-deep); }
/* bottom bar */
.c1-footer__bottom { border-top: 1px solid rgba(255, 255, 255, 0.1); position: relative; }
.c1-footer__bottom .guide {
  min-height: 66px; display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 8px; padding-top: 12px; padding-bottom: 12px;
}
.c1-footer__copy { font-size: 12.5px; color: rgba(255, 255, 255, 0.62); }
.c1-footer__policy { display: flex; gap: 24px; margin: 0; padding: 0; list-style: none; }
.c1-footer__policy a { font-size: 12.5px; color: rgba(255, 255, 255, 0.5); cursor: pointer; }
.c1-footer__policy a:hover, .c1-footer__policy a:focus-visible { color: var(--c1-cyan-300); }
.c1-footer__policy a.btn_privacy, .c1-footer__policy a.btn_privacy_page { color: rgba(255, 255, 255, 0.5); font-weight: 600; }   /* 2026-09-22: 기본 회색, 호버 블루(전 링크 동일) */
.c1-footer__policy a.btn_privacy:hover, .c1-footer__policy a.btn_privacy_page:hover { color: var(--c1-cyan-300); }
.c1-footer__col ul a:hover { color: var(--c1-cyan-300); }

/* ============================================================
   RESPONSIVE
   ============================================================ */
@media (max-width: 1279px) {
  .c1-hero__title { font-size: 48px; }
  .c1-hero__viz { display: none; }
  .c1-hero__copy { width: 100%; }
  .c1-hero .guide { padding: 72px 0 100px; min-height: 0; }
  .c1-quick__bar { flex-wrap: wrap; border-radius: 20px; }
  .c1-quick__cell { flex: 1 1 33%; min-width: 200px; }
  .c1-quick__cell + .c1-quick__cell::before { display: none; }
  .c1-quick__cell { border-top: 1px solid var(--c1-line-inner); border-left: 1px solid var(--c1-line-inner); }
  .c1-programs__grid { flex-direction: column; }
  .c1-program-feature { width: auto; }
  .c1-dashboard .guide { flex-direction: column; gap: 64px; }
  .c1-dash-left { width: 100%; }
  .c1-contact .guide { grid-template-columns: 1fr 1fr; }
  .c1-contact__intro { grid-column: span 2; }
  .c1-footer__main { flex-direction: column; gap: 44px; }
}

/* 우측 퀵 사이드바: 콘텐츠와 겹치지 않는 넓은 화면에서만 노출 */
@media (max-width: 1519px) {
  /* 2026-09-18: 사이드바(96px+우측 18px)가 1240px guide 와 겹치지 않는 1480px 이상에서만 노출 — 파일 끝 1479 블록 참조 */
}

@media (max-width: 1023px) {
  #headerWrap .gnb { display: none; }
  .c1-header-actions .c1-txt-link, .c1-header-actions .c1-act-outline { display: none; }
  .mob-view.mob_gnb_open { display: inline-flex; }
  .c1-header-row { height: 68px; }
  .c1-header-row .logo img { height: 22px; }
}

@media (max-width: 767px) {
  .c1-hairline { height: 3px; }
  .c1-header-row { height: 60px; gap: 12px; }
  .c1-header-row .logo img { height: 18px; }
  .c1-header-actions { gap: 10px; }
  .c1-header-actions .c1-act-primary { height: 38px; padding: 0 14px; font-size: 13px; }
  .c1-h2 { font-size: 26px; }
  .c1-h3, .c1-dash-left .calendar-title, .c1-news__title { font-size: 22px; }
  .c1-eyebrow { font-size: 12px; }
  .c1-section, .c1-dashboard { padding: 52px 0 56px; }
  .c1-programs { padding: 36px 0 56px; }
  .c1-hero .guide { padding: 34px 0 40px; }
  .c1-hero__title { font-size: 34px; line-height: 1.28; }
  .c1-hero__desc { font-size: 16px; margin-top: 14px; }
  .c1-hero__cta { margin-top: 24px; flex-direction: column; }
  .c1-hero__cta .c1-btn { width: 100%; height: 52px; }
  .c1-hero__points { margin-top: 22px; padding-top: 18px; gap: 10px 18px; }
  .c1-hero__points span { font-size: 13px; }
  .c1-quick .guide { top: -34px; margin-bottom: -34px; }
  .c1-quick { padding-bottom: 34px; }
  .c1-quick__cell { flex: 1 1 50%; min-width: 0; padding: 16px 14px; gap: 10px; }
  .c1-quick__icon { width: 44px; height: 44px; }
  .c1-quick__icon svg { width: 20px; height: 20px; }
  .c1-quick__title { font-size: 14px; }
  .c1-quick__sub { display: none; }
  .c1-program-feature { padding: 26px 22px; border-radius: 20px; }
  .c1-program-feature__title { font-size: 22px; }
  .c1-program-card { padding: 18px 18px; }
  .c1-program-card__title { font-size: 17px; }
  .c1-program-card__more { max-height: 70px; opacity: 1; margin-top: 12px; padding-top: 12px; border-top-color: var(--c1-line); }
  .c1-dash-left .calendar-head { flex-direction: column; align-items: flex-start; }
  .c1-cal-card { padding: 18px 16px 14px; }
  .c1-dash-right #tabs-nav { flex-wrap: wrap; }
  .c1-dash-right #tabs-nav li a { padding: 9px 11px 11px; font-size: 13.5px; }
  .c1-dash-right .board-con .btn-more { top: 32px; }
  .c1-banner-sec { padding-bottom: 56px; }
  .c1-banner-sec .swiper-slide { height: 240px; }
  .c1-banner-sec .swiper-slide .txt_box .title { font-size: 20px; }
  .c1-banner-sec .swiper-slide .txt_box .info { font-size: 13px; margin-top: 8px; }
  .c1-contact .guide { grid-template-columns: 1fr; gap: 12px; padding: 44px 0 46px; }
  .c1-contact__intro { grid-column: span 1; }
  .c1-contact__item {
    border-left: 0; padding: 14px 16px; border: 1px solid rgba(255, 255, 255, 0.15);
    border-radius: 14px; background: rgba(255, 255, 255, 0.06);
    display: flex; justify-content: space-between; align-items: center;
  }
  .c1-contact__item dd { margin: 0; }
  .c1-contact__item dd a { font-size: 15px; }
  .c1-footer__main { padding: 40px 0 36px; }
  .c1-footer__org { width: 100%; }
  .c1-footer__links { grid-template-columns: 1fr 1fr; gap: 28px; }
  /* 하단 바: 저작권 ↔ 개인정보처리방침 한 줄 (아트보드 — 나머지 링크는 모바일 미표시) */
  /* 우하단 '맨 위로' 버튼(42px + 16px 여백)과 개인정보처리방침 링크가 겹치지 않도록 하단 여백 확보 */
  .c1-footer__bottom .guide { justify-content: space-between; flex-wrap: nowrap; gap: 12px; padding-bottom: 88px; }
  .c1-footer__copy { font-size: 12px; }
  .c1-footer__corp { display: none; }
  .c1-footer__policy li:not(:first-child) { display: none; }
  .c1-footer__policy a { font-size: 12px; white-space: nowrap; }
}

/* ============================================================
   MOBILE ARTBOARD 정합 (Mobile.dc.html 390px) — 데스크톱 영향 없음
   ============================================================ */
/* 기본(데스크톱): 모바일 전용 요소 숨김 */
.c1-hero__mviz { display: none; }
.c1-timeline__hint { display: none; }
.c1-footer__mlinks { display: none; }
.c1-quick__arrow { display: none; }

@media (max-width: 767px) {
  /* 헤더: 모바일 아트보드 = 로고 + 검색 + 햄버거만 (교육신청 CTA는 숨김 → 가로 오버플로 방지) */
  .c1-header-actions .c1-act-primary { display: none; }

  /* 히어로: 텍스처 진하게 + 컴팩트 시각화 노출 */
  .c1-hero__texture { opacity: 0.2; }
  .c1-hero__mviz svg { width: 100%; height: 100%; }
  .c1-hero__mviz { display: block; position: relative; margin-top: 24px; height: 210px; max-width: 350px; }
  .c1-hero__mviz-pane {
    position: absolute; left: 250px; top: 42px; width: 30px; height: 130px; border-radius: 12px;
    background: linear-gradient(160deg, rgba(255,255,255,0.78), rgba(168,221,239,0.42));
    border: 1px solid rgba(63,182,220,0.5); box-shadow: 0 10px 26px rgba(28,95,208,0.16); transform: rotate(3deg);
  }

  /* 퀵 액세스: 하나로 붙은 바 → 아트보드의 개별 카드 2열 그리드(간격 12px), 히어로와 겹치지 않음 */
  .c1-quick { padding: 24px 0 32px; }
  .c1-quick .guide { top: 0; margin-bottom: 0; }
  .c1-quick__bar {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px;
    background: none; border: 0; border-radius: 0; box-shadow: none; overflow: visible;
  }
  .c1-quick__cell {
    flex: none; min-width: 0; gap: 11px; padding: 14px 15px;
    background: #fff; border: 1px solid var(--c1-line); border-radius: 18px;
    box-shadow: 0 14px 34px rgba(11, 29, 58, 0.07);
  }
  .c1-quick__cell--active {
    grid-column: span 2; gap: 13px; padding: 16px 18px;
    background: linear-gradient(135deg, rgba(28, 95, 208, 0.07), rgba(63, 182, 220, 0.08));
    box-shadow: 0 14px 34px rgba(11, 29, 58, 0.1);
  }
  .c1-quick__icon { width: 20px; height: 20px; background: none; border-radius: 0; }
  .c1-quick__cell--active .c1-quick__icon {
    width: 44px; height: 44px; border-radius: 14px; background: var(--c1-blue); color: #fff; box-shadow: var(--c1-shadow-btn);
  }
  .c1-quick__cell:hover .c1-quick__icon { background: none; color: var(--c1-blue); }
  .c1-quick__cell--active:hover .c1-quick__icon { background: var(--c1-blue); color: #fff; }
  .c1-quick__title { font-size: 14px; }
  .c1-quick__cell--active .c1-quick__title { font-size: 15.5px; }
  .c1-quick__cell--active .c1-quick__sub { display: inline-flex; align-items: center; gap: 5px; margin-top: 2px; font-size: 12px; color: var(--c1-blue); font-weight: 600; }
  .c1-quick__arrow { display: inline-block; }

  /* 교육과정: 02–04는 번호+제목+셰브론 슬림 행 */
  .c1-program-rail__line, .c1-program-row__dot-col { display: none; }
  .c1-program-card .c1-chip, .c1-program-card__desc, .c1-program-card__more { display: none !important; }
  .c1-program-card { padding: 17px 18px; }
  .c1-program-card__top::after {
    content: ''; width: 8px; height: 8px; flex-shrink: 0;
    border-right: 2px solid var(--c1-blue); border-top: 2px solid var(--c1-blue); transform: rotate(45deg);
  }
  .c1-program-rail { gap: 12px; }

  /* 타임라인 카드: '02 9월' 한 줄 + 스와이프 힌트 */
  /* 데스크톱 스크롤 모드의 (100%-54px)/4 카드 폭이 모바일까지 적용되던 문제 → 168px 고정 */
  .c1-timeline__item, .c1-timeline--scroll .c1-timeline__item { flex: 0 0 168px; }
  .c1-timeline__date { display: flex; align-items: baseline; gap: 5px; flex-wrap: nowrap; }
  .c1-timeline__date .c1-timeline__day { order: 1; margin-top: 0; white-space: nowrap; }
  .c1-timeline__date .c1-timeline__month { order: 2; flex-shrink: 0; font-size: 11px; letter-spacing: 0; }
  .c1-timeline__to { font-size: 12px; letter-spacing: 0; }
  .c1-timeline__title { word-break: break-all; font-size: 15px; }
  .c1-timeline__hint { display: block; margin-top: 12px; font-size: 12px; color: var(--c1-t-meta); }

  /* 달력 카드 헤더: 제목·월 컨트롤 한 줄 유지 */
  .c1-dash-left .calendar-head.c1-cal-card__head { flex-direction: row; align-items: center; }

  /* 새소식: 모바일 아트보드대로 머리글·전체보기·요약 없이 탭 바로 시작 */
  .c1-news__head, .c1-dash-right .board-con .btn-more { display: none; }
  .c1-dash-right #tabs-nav { margin-top: 0; padding-right: 0; }
  .c1-dash-right .board-con ul li.is-open .txt { display: none; }

  /* 연락처: 대표번호 전폭 + 나머지 4개 2×2 그리드(라벨 위·번호 아래) — 모바일 아트보드 */
  .c1-contact .guide { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
  .c1-contact__intro { grid-column: span 2; margin-bottom: 8px; }
  .c1-contact__item { display: block; padding: 14px 16px; }
  .c1-contact__item dd { margin: 6px 0 0; }
  .c1-contact__item dd a { font-size: 15px; }
  .c1-contact__item:first-of-type {
    grid-column: span 2; display: flex; justify-content: space-between; align-items: center; padding: 16px 18px;
  }
  .c1-contact__item:first-of-type dt { font-size: 14px; }
  .c1-contact__item:first-of-type dd { margin: 0; }
  .c1-contact__item:first-of-type dd a { font-size: 20px; }

  /* 홍보채널: 설명 줄 없이 이름+링크, 아이콘 48 */
  .c1-channel-card__desc { display: none; }
  .c1-channel-card__icon { width: 48px; height: 48px; }
  .c1-channels .c1-h2 { font-size: 24px; }

  /* 푸터: 3열 컬럼 → 인라인 링크, 로고 흰색 반전, WA 배지 + 패밀리사이트 한 줄(아트보드)
     배지(좌측 org)와 패밀리사이트(우측 협회 칼럼)는 부모가 달라 같은 행에 올 수 없으므로
     모바일에서만 래퍼를 display:contents 로 걷어내 한 플렉스 행으로 합친다. */
  .c1-footer__main { display: flex; flex-flow: row wrap; align-items: flex-start; padding-top: 40px; gap: 0 10px; }
  .c1-footer__org, .c1-footer__links { display: contents; }
  .c1-footer__links .c1-footer__col { display: none; }
  .c1-footer__links .c1-footer__col:last-child { display: contents; }
  .c1-footer__links .c1-footer__col:last-child .c1-footer__col-title,
  .c1-footer__links .c1-footer__col:last-child ul { display: none; }
  .c1-footer__logo, .c1-footer__addr, .c1-footer__mlinks { flex: 0 0 100%; }
  .c1-footer__badges, .c1-footer .family-site { flex: 0 0 auto; margin-top: 18px; }
  .c1-footer__badge { padding: 8px 12px; font-size: 12px; }
  .c1-footer__badge svg { display: none; }
  .c1-footer .familySite { width: auto; }
  .c1-footer .familySite > a { padding: 8px 12px; font-size: 12px; min-width: 0; }
  /* 드롭다운 패널도 버튼 크기에 맞춰 축소 */
  .c1-footer .familySite > div { min-width: 188px; padding: 6px 0; border-radius: 12px; }
  .c1-footer .familySite > div a { padding: 6px 14px; font-size: 12px; }
  .c1-footer__mlinks { display: flex; flex-wrap: wrap; gap: 8px 18px; margin-top: 18px; font-size: 12.5px; font-weight: 600; }
  .c1-footer__mlinks a { color: rgba(255, 255, 255, 0.68); }
  .c1-footer__mlinks a:hover { color: #fff; }
  .c1-footer__logo { background: none; padding: 0; }
  .c1-footer__logo img { filter: brightness(0) invert(1); opacity: 0.78; height: 21px; }
}

/* ============================================================
   SHARED-LAYOUT HARDENING (Day 2, 2026-09-17)
   헤더/푸터 파셜이 레거시(2021) theme CSS 및 renew common.css 와 같은 문서에 놓일 때
   프레임을 강제. base.css 가 없는 페이지를 위해 유틸리티(.sound-only/.hidden)도 제공.
   ============================================================ */
#headerWrap .header { position: static; height: auto; width: auto; margin: 0; box-shadow: none; }
#headerWrap .header::before, #headerWrap .header::after { content: none; display: none; }
#headerWrap .gnb { margin: 0; }
#headerWrap .header-btn .gnb-menu-list > li::after { content: none; display: none; }
#headerWrap .header-btn .gnb-menu-list > li > a { line-height: 1; }
#headerWrap a, footer.footer a { vertical-align: baseline; }
.c1-footer__addr a:not(.map-btn) { display: inline; }
.c1-footer__mlinks a { display: inline-block; }
#headerWrap .sound-only, footer.footer .sound-only, .sound-only { overflow: hidden; position: absolute; width: 0; height: 0; padding: 0; margin: 0; font-size: 0; line-height: 0; text-indent: -9999em; outline: none; z-index: -1; }
#skipNav.hidden { overflow: hidden; position: absolute; width: 1px; height: 1px; margin: 0; padding: 0; border: none; clip: rect(1px, 1px, 1px, 1px); }
.c1-legacy-tree, .c1-legacy-tree[hidden] { display: none !important; }
/* 드롭다운(데스크톱)·드로어(모바일) 현재 페이지 항목 */
#headerWrap .header-btn .sub-menu li a[aria-current],
.mob-gnb .mob_gnb .sub-menu li a[aria-current] { color: var(--c1-blue-deep); background: var(--c1-bg-tint); font-weight: 700; }
#headerWrap .header-btn .sub-menu li a:focus-visible,
#headerWrap .header-btn .gnb-menu-list > li > a:focus-visible,
.c1-header-actions a:focus-visible, .c1-header-actions button:focus-visible,
footer.footer a:focus-visible { outline: 2px solid var(--c1-cyan); outline-offset: 2px; border-radius: 6px; }
/* 레거시 body{letter-spacing:-0.03em !important} 상속 차단 — 홈과 동일한 자간 */
#headerWrap, footer.footer, .mob-gnb-layer { letter-spacing: normal; }

/* ---------- 맨 위로 버튼 (footer.inc.php) ---------- */
.c1-totop {
  position: fixed; right: 28px; bottom: 28px; z-index: 95;
  width: 48px; height: 48px; border-radius: var(--c1-r-btn);
  background: #fff; border: 1px solid var(--c1-line); box-shadow: var(--c1-shadow-frame);
  color: var(--c1-blue); display: inline-flex; align-items: center; justify-content: center; cursor: pointer; padding: 0;
  opacity: 0; visibility: hidden; transform: translateY(8px);
  transition: opacity 0.25s ease, transform 0.25s ease, visibility 0.25s, border-color 0.2s ease, background 0.2s ease;
}
.c1-totop.is-visible { opacity: 1; visibility: visible; transform: none; }
.c1-totop:hover { border-color: var(--c1-blue); background: var(--c1-bg-tint); }
.c1-totop:focus-visible { outline: 2px solid var(--c1-cyan); outline-offset: 2px; }
/* 1440px 미만에서는 1240 컨테이너가 화면을 거의 채워 푸터 하단바 마지막 링크와 버튼(우 28px·48px)이 겹침 → 하단바 아래 공간 확보 */
@media (max-width: 1439px) { .c1-footer__bottom .guide { padding-bottom: 88px; } }
@media (max-width: 767px) { .c1-totop { right: 16px; bottom: 16px; width: 42px; height: 42px; border-radius: 12px; } }
@media (prefers-reduced-motion: reduce) { .c1-totop { transition: none; } }

/* 모바일 드로어 아코디언: 기본 모두 접힘(2026-09-17). 현재 섹션은 .is-current 로 색만 표시하고 펼치지 않는다 */
.mob-gnb .mob_gnb .gnb-menu-list > li.is-current > div { color: var(--c1-blue); }
.mob-gnb .mob_gnb .gnb-menu-list > li.is-current > div::after { border-color: var(--c1-blue); }

/* 모바일 드로어 회원 버튼 행 (.mob-auth, 2026-09-17): 헤드 아래 · 아코디언 위. 규격은 .c1-btn(44px · 라운드 12) */
.mob-gnb-head .member-menu .member-guest { display: inline-flex; align-items: center; gap: 6px; font-size: 14px; font-weight: 600; color: var(--c1-t-meta); }
.mob-gnb-head .member-menu .member-guest i { font-size: 15px; }
.mob-auth { display: flex; gap: 8px; margin-top: auto; padding: 16px 20px 22px; border-top: 1px solid var(--c1-line-inner); background: #fff; }
.mob-gnb-layer > .cont-box { display: flex; flex-direction: column; }   /* .mob-auth 를 드로어 하단에 고정(내용이 짧을 때) */
.mob-gnb-layer > .cont-box > .mob-gnb { flex: 1 0 auto; }
.mob-gnb .left_area { padding-bottom: 16px; }
.mob-auth .c1-mob-btn {
  flex: 1 1 0; display: inline-flex; align-items: center; justify-content: center; box-sizing: border-box;
  height: 44px; padding: 0 12px; border-radius: 12px; font-size: 14px; font-weight: 700; letter-spacing: -0.01em; text-decoration: none;
  transition: background-color 0.15s ease, border-color 0.15s ease, color 0.15s ease;
}
.mob-auth .c1-mob-btn--primary { background: var(--c1-blue); color: #fff; border: 1px solid var(--c1-blue); }
.mob-auth .c1-mob-btn--primary:hover, .mob-auth .c1-mob-btn--primary:focus-visible { background: var(--c1-blue-deep); border-color: var(--c1-blue-deep); outline: none; }
.mob-auth .c1-mob-btn--outline { background: #fff; color: var(--c1-blue-deep); border: 1px solid var(--c1-blue); }
.mob-auth .c1-mob-btn--outline:hover, .mob-auth .c1-mob-btn--outline:focus-visible { background: var(--c1-bg-tint); outline: none; }
.mob-auth .c1-mob-btn--ghost { background: var(--c1-bg-cool); color: var(--c1-t-body); border: 1px solid var(--c1-line); }
.mob-auth .c1-mob-btn--ghost:hover, .mob-auth .c1-mob-btn--ghost:focus-visible { border-color: var(--c1-grey-300); color: var(--c1-t-heading); outline: none; }
.mob-auth .c1-mob-btn:active { transform: translateY(1px); }

/* 드로어 링크형 항목(하위 메뉴 없음): 아코디언 화살표 대신 → 표시 (2026-09-17) */
.mob-gnb .mob_gnb .gnb-menu-list > li.is-link > div::after { border-color: var(--c1-grey-300); transform: translateY(-50%) rotate(-45deg); }
.mob-gnb .mob_gnb .gnb-menu-list > li.is-link.active > div { color: var(--c1-navy); }
.mob-gnb .mob_gnb .gnb-menu-list > li.is-link.active > div::after { transform: translateY(-50%) rotate(-45deg); border-color: var(--c1-grey-300); }

/* 로그인 카드 입력란: 레거시 0.3em 라운드·#ddd 라인 → 사이트 공통 규격(라운드 10 · --c1-grey-300 · 블루 포커스 링) (2026-09-17) */
.login-box .input-style { border: 1px solid var(--c1-grey-300); border-radius: 10px; font-family: var(--c1-font); font-size: 15px; color: var(--c1-t-heading); transition: border-color 0.15s ease, box-shadow 0.15s ease; }
.login-box .input-style::placeholder { color: var(--c1-t-meta); }
.login-box .input-style:hover { border-color: var(--c1-blue); }
.login-box .input-style:focus { border: 1px solid var(--c1-blue); box-shadow: 0 0 0 3px rgba(28, 95, 208, 0.15); outline: none; }

/* 인라인 SVG 아이콘 (2026-09-18: Font Awesome 6 CDN 의존 제거 — 서버에서 cdnjs 를 못 받아 아이콘이 안 보이던 문제) */
.c1-ico { display: block; width: 22px; height: 22px; }
.quick-sidebar .icon .c1-ico { margin: 0 auto; }
.mob-gnb-head .member-menu .c1-ico, .c1-ico--sm { width: 15px; height: 15px; flex: 0 0 auto; }
.mob-gnb-head .member-menu .menu-list a, .mob-gnb-head .member-menu .member-guest { display: inline-flex; align-items: center; gap: 7px; }

/* 패밀리사이트 드롭다운 화살표 (2026-09-18: FA 글리프 → 인라인 SVG, 열림 시 180도 회전) */
.c1-footer .familySite .fs-arrow { display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; transition: transform 0.2s ease; }
.c1-footer .familySite .fs-arrow svg { display: block; width: 14px; height: 14px; }
.c1-footer .familySite.is-open .fs-arrow { transform: rotate(180deg); }

/* ============================================================
   2026-09-18 디자인 시안 정합 (사용자 스크린샷 4장): 데스크톱 Shortcut 사이드바 · 모바일 유관기관/교육시설/푸터
   ============================================================ */
/* Shortcut 사이드바 노출 규칙 (2026-09-18 재조정: 서버에서 안 보인다는 리포트 — 1480 미만 데스크톱이 숨김이었음)
   ≥1480: 기본 96px 레일 · 1280~1479: 콘텐츠 여백(guide 1240 기준 20~120px) 안에 들어가는 62px 컴팩트 레일(아이콘 + 소형 라벨) · <1280: 숨김(드로어 메뉴 사용) */
/* 2026-09-18: 768 이상 모든 데스크톱/태블릿 폭에서 노출 — 1479 이하 컴팩트 레일; 767 이하는 숨김 */
@media (max-width: 1479px) {
  .quick-sidebar { display: block; width: 62px; right: 8px; padding: 8px 3px; border-radius: 14px; }   /* display:block — common.css(≤1180 숨김) 무력화 */
  .quick-sidebar .quick-title { font-size: 8.5px; letter-spacing: 0.06em; padding: 4px 0 7px; }
  .quick-sidebar .quick-menu a { gap: 3px; padding: 8px 1px; }
  .quick-sidebar .quick-menu a .icon .c1-ico { width: 18px; height: 18px; }
  .quick-sidebar .quick-menu a .title { font-size: 9.5px; line-height: 1.3; word-break: keep-all; }
}
@media (max-width: 767px) { .quick-sidebar { display: none !important; } }   /* 2026-09-18 사용자 요청: 모바일에서는 숨김(드로어 메뉴 사용) */

@media (max-width: 767px) {
  /* 유관기관: 라벨 가운데 → 칩 가운데 줄바꿈 (시안) */
  .c1-orgs { justify-content: center; gap: 10px 8px; }
  .c1-orgs__label { flex: 0 0 100%; text-align: center; letter-spacing: 0.3em; font-family: var(--c1-font); font-size: 13px; font-weight: 600; margin-bottom: 4px; }
  .c1-orgs__div { display: none; }
  .c1-orgs .c1-chip { border-color: var(--c1-grey-300); }

  /* 교육시설: 설명문 노출(2줄) + 필 버튼 (시안) */
  .c1-facility__desc { display: block; margin-top: 12px; font-size: 15px; line-height: 1.6; color: rgba(255, 255, 255, 0.82); max-width: none; word-break: keep-all; }
  .c1-facility .guide { padding-bottom: 30px; }
  .c1-facility__cta { margin-top: 22px; }
  .c1-facility__cta .c1-btn { border-radius: 999px; padding: 0 22px; }
  .c1-facility__cta .c1-btn--outline-w { padding: 0 22px; border-width: 1.5px; }

  /* 푸터: 로고 → 주소 3줄 → 5그룹 아코디언 → 패밀리사이트(전폭) → WA 배지 → 정책 링크 3개 → © */
  .c1-footer__addr-line--desk { display: none; }
  .c1-footer__addr { margin-top: 18px; font-size: 13.5px; line-height: 1.75; color: rgba(255, 255, 255, 0.78); }
  .c1-footer__addr .map-btn { display: none; }
  .c1-footer__mlinks { display: none !important; }
  .c1-footer__main { flex-direction: column; flex-wrap: nowrap; gap: 0; }
  .c1-footer__logo { order: 1; }
  .c1-footer__addr { order: 2; }
  .c1-footer__acc { order: 3; display: block; width: 100%; margin-top: 26px; border-top: 1px solid rgba(255, 255, 255, 0.12); }
  .c1-footer .family-site { order: 4; width: 100%; margin-top: 22px; }
  .c1-footer__badges { order: 5; margin-top: 14px; }
  .c1-footer__acc > ul, .c1-footer__acc-panel { list-style: none; margin: 0; padding: 0; }
  .c1-footer__acc > ul > li { border-bottom: 1px solid rgba(255, 255, 255, 0.12); }
  .c1-footer__acc-btn {
    display: flex; align-items: center; justify-content: space-between; width: 100%; padding: 17px 2px; margin: 0;
    background: none; border: 0; color: #fff; font-family: var(--c1-font); font-size: 15px; font-weight: 700; text-align: left; cursor: pointer;
  }
  .c1-footer__acc-ico { flex: 0 0 auto; color: rgba(255, 255, 255, 0.7); transition: transform 0.2s ease; }
  .c1-footer__acc > ul > li.is-open .c1-footer__acc-ico { transform: rotate(180deg); color: var(--c1-cyan-300); }
  .c1-footer__acc-panel { display: none; grid-template-columns: 1fr 1fr; gap: 14px 16px; padding: 2px 2px 20px; }
  .c1-footer__acc > ul > li.is-open .c1-footer__acc-panel { display: grid; }
  .c1-footer__acc-panel a { font-size: 14px; color: rgba(255, 255, 255, 0.78); }
  .c1-footer__acc-panel a:hover { color: #fff; }
  .c1-footer .familySite { width: 100%; }
  .c1-footer .familySite > a {
    display: flex; align-items: center; justify-content: space-between; width: 100%; height: 50px; padding: 0 16px;
    border: 1px solid rgba(255, 255, 255, 0.35); border-radius: 12px; font-size: 14px; font-weight: 600; color: #fff;
  }
  .c1-footer .familySite > div { min-width: 0; width: 100%; }
  .c1-footer__badge { display: inline-flex; align-items: center; gap: 8px; padding: 10px 14px; border-radius: 999px; font-size: 13px; }
  .c1-footer__badge svg { display: block; }
  .c1-footer__bottom .guide { flex-direction: column-reverse; align-items: flex-start; gap: 14px; padding-top: 22px; }
  .c1-footer__policy { gap: 16px; flex-wrap: wrap; }
  .c1-footer__policy li:not(:first-child) { display: list-item; }
  .c1-footer__policy a { font-size: 12.5px; white-space: nowrap; color: rgba(255, 255, 255, 0.6); }
  .c1-footer__copy { font-size: 12.5px; }
}
@media (min-width: 768px) { .c1-footer__acc { display: none; } }

/* ---------- Shortcut 바 (모바일 전용, 2026-09-18 디자인 시안 → 사용자 요청: 화면 하단 플로팅) ----------
   3칸 · 아이콘 위 라벨 · 세로 구분선. position:fixed 하단, 드로어/헤더(z 100) 아래 · 맨 위로 버튼(z 95)보다 아래.
   본문(body)에 바 높이만큼 하단 여백을 주어 푸터 © 줄이 가려지지 않게 하고, 맨 위로 버튼은 바 위로 올림. 마크업은 index.php .c1-shortcut-strip(항목은 header.inc.php 배열 공유). */
.c1-shortcut-strip { display: none; }
@media (max-width: 767px) {
  .c1-shortcut-strip {
    display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 94;
    background: #fff; border-top: 1px solid var(--c1-line); box-shadow: 0 -8px 24px rgba(11, 29, 58, 0.10);
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }
  .c1-shortcut-strip__item {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 6px; min-height: 64px; padding: 9px 6px;
    color: var(--c1-t-heading); font-size: 12px; font-weight: 700; line-height: 1.2; text-align: center; word-break: keep-all; text-decoration: none;
    transition: background-color 0.15s ease;
  }
  .c1-shortcut-strip__item + .c1-shortcut-strip__item { border-left: 1px solid var(--c1-line); }
  .c1-shortcut-strip__item .c1-ico { width: 22px; height: 22px; color: var(--c1-blue); }
  .c1-shortcut-strip__item:active, .c1-shortcut-strip__item:hover { background: var(--c1-bg-cool); }
  .c1-shortcut-strip__item:focus-visible { outline: 2px solid var(--c1-cyan); outline-offset: -2px; }
  /* 바가 있는 페이지(홈)만: 본문 하단 여백 + 맨 위로 버튼 올림 */
  body:has(.c1-shortcut-strip) { padding-bottom: calc(64px + env(safe-area-inset-bottom, 0px)); }
  body:has(.c1-shortcut-strip) .c1-totop { bottom: calc(64px + 12px + env(safe-area-inset-bottom, 0px)); }
}

/* ============================================================
   2026-09-22 사용자 리포트 7건 중 CSS 항목
   ============================================================ */
/* (2) 안전정보 허브 카드 — 웹 호버 = 모바일 탭(.is-pressed, index.php JS 가 터치 시 부여·이동까지 유지) 동일 룩 (2026-09-22 재수정):
   세 카드 공통: 4px 떠오름 + 깊은 그림자 + 1.5px 시안 링(inset), 사진 카드 이미지 1.04 확대, 다크 카드 링크 흰색, 영상 카드 재생 버튼 블루/흰 삼각형 */
.c1-know-feature, .c1-know-dark, .c1-know-video { transition: transform 0.25s ease, box-shadow 0.25s ease, outline-color 0.25s ease; outline: 1.5px solid transparent; outline-offset: -1.5px; -webkit-tap-highlight-color: transparent; }
.c1-know-feature img, .c1-know-video img { transition: transform 0.5s ease; }
.c1-know-video__play svg path { transition: fill 0.2s ease; }
.c1-know-feature.is-pressed, .c1-know-dark.is-pressed, .c1-know-video.is-pressed {
  transform: translateY(-4px); box-shadow: 0 22px 44px rgba(11, 29, 58, 0.18); outline: 1.5px solid rgba(127, 210, 236, 0.75); outline-offset: -1.5px;   /* 링은 outline — inset box-shadow 는 사진/오버레이(자식) 아래에 그려져 이미지 카드에서 안 보였음 */
}
.c1-know-feature.is-pressed img, .c1-know-video.is-pressed img { transform: scale(1.04); }
.c1-know-dark.is-pressed .c1-know-dark__link { color: #fff; }
.c1-know-video.is-pressed .c1-know-video__play { background: var(--c1-blue); color: #fff; }
.c1-know-video.is-pressed .c1-know-video__play svg path { fill: #fff; }
@media (hover: hover) {
  .c1-know-feature:hover, .c1-know-dark:hover, .c1-know-video:hover {
    transform: translateY(-4px); box-shadow: 0 22px 44px rgba(11, 29, 58, 0.18); outline: 1.5px solid rgba(127, 210, 236, 0.75); outline-offset: -1.5px;   /* 링은 outline — inset box-shadow 는 사진/오버레이(자식) 아래에 그려져 이미지 카드에서 안 보였음 */
  }
  .c1-know-feature:hover img, .c1-know-video:hover img { transform: scale(1.04); }
  .c1-know-dark:hover .c1-know-dark__link { color: #fff; }
  .c1-know-video:hover .c1-know-video__play { background: var(--c1-blue); color: #fff; }
  .c1-know-video:hover .c1-know-video__play svg path { fill: #fff; }
}

@media (max-width: 767px) {
  /* (5) 섹션 머리글(교육과정 등) 모바일: 화살표 링크를 제목 오른쪽 같은 줄로, 설명문은 전폭 — 안전정보 섹션과 동일 패턴을 공통 적용 */
  .c1-section__head { display: grid; grid-template-columns: 1fr auto; align-items: baseline; gap: 0 12px; }
  .c1-section__head > div { display: contents; }
  .c1-section__head .c1-eyebrow { grid-area: 1 / 1 / 2 / 3; }
  .c1-section__head .c1-h2 { grid-area: 2 / 1 / 3 / 2; }
  .c1-section__head .c1-lead { grid-area: 3 / 1 / 4 / 3; max-width: none; }
  .c1-section__head .c1-arrow-link { grid-area: 2 / 2 / 3 / 3; justify-self: end; white-space: nowrap; font-size: 13px; }

  /* (6) 퀵 액세스 모바일 (2026-09-22 재수정): 첫 셀(교육신청)도 다른 셀과 동일 — 아이콘 박스 없음(20px 맨 아이콘), 부제 회색.
     탭 시 '선택됨' 느낌: 터치 시작에 JS 가 .is-pressed 를 붙여(index.php) 페이지 이동까지 유지 — 틴트 배경 + 블루 테두리 + 블루 아이콘/제목. :active 도 동일 스타일. */
  .c1-quick__cell--active { background: #fff; box-shadow: 0 14px 34px rgba(11, 29, 58, 0.07); }
  .c1-quick__cell--active .c1-quick__icon { width: 20px; height: 20px; border-radius: 0; background: none; color: var(--c1-blue); box-shadow: none; }
  .c1-quick__cell--active:hover .c1-quick__icon { background: none; color: var(--c1-blue); }
  .c1-quick__cell--active .c1-quick__title { font-size: 14px; }
  .c1-quick__cell--active .c1-quick__sub { color: var(--c1-t-meta); font-weight: 500; }
  /* 탭 선택 상태 = 아트보드 대표 카드 룩 (2026-09-22 재수정): 연한 그라데이션 배경 · 테두리는 라인색 유지 · 아이콘은 파란 라운드 박스(흰 글리프) · 제목 먹색 · 부제 블루+화살표 */
  .c1-quick__cell { transition: background 0.15s ease, box-shadow 0.15s ease; -webkit-tap-highlight-color: transparent; }
  .c1-quick__icon { transition: background 0.15s ease, color 0.15s ease, width 0.15s ease, height 0.15s ease; }
  .c1-quick__cell:active, .c1-quick__cell.is-pressed {
    background: linear-gradient(135deg, rgba(28, 95, 208, 0.07), rgba(63, 182, 220, 0.08)); border-color: var(--c1-line);
    box-shadow: 0 14px 34px rgba(11, 29, 58, 0.10);
  }
  .c1-quick__cell:active .c1-quick__icon, .c1-quick__cell.is-pressed .c1-quick__icon {
    width: 32px; height: 32px; border-radius: 10px; background: var(--c1-blue); color: #fff; box-shadow: var(--c1-shadow-btn);
  }
  .c1-quick__cell--active:active .c1-quick__icon, .c1-quick__cell--active.is-pressed .c1-quick__icon { width: 44px; height: 44px; border-radius: 14px; }
  .c1-quick__cell:active .c1-quick__title, .c1-quick__cell.is-pressed .c1-quick__title { color: var(--c1-t-heading); }
  .c1-quick__cell--active:active .c1-quick__title, .c1-quick__cell--active.is-pressed .c1-quick__title { font-size: 15.5px; }
  .c1-quick__cell:active .c1-quick__sub, .c1-quick__cell.is-pressed .c1-quick__sub { color: var(--c1-blue); font-weight: 600; }
}

/* ---------- 안전정보 다크 카드(원자력 전문인력 양성): 기본 사진 → 호버/탭 시 네이비 표현 (2026-09-22) ---------- */
.c1-know-dark__photo { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: 0; opacity: 1; transition: opacity 0.35s ease, transform 0.5s ease; }
.c1-know-dark::before {
  content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background: linear-gradient(180deg, rgba(11, 29, 58, 0.12) 0%, rgba(11, 29, 58, 0.82) 100%); transition: opacity 0.35s ease;
}
.c1-know-dark__orbit { opacity: 0; transition: opacity 0.35s ease; }
.c1-know-dark__sub, .c1-know-dark__link { opacity: 0; transform: translateY(6px); transition: opacity 0.3s ease, transform 0.3s ease; }
.c1-know-dark.is-pressed .c1-know-dark__photo { opacity: 0; transform: scale(1.04); }
.c1-know-dark.is-pressed::before { opacity: 0; }
.c1-know-dark.is-pressed .c1-know-dark__orbit { opacity: 1; }
.c1-know-dark.is-pressed .c1-know-dark__sub, .c1-know-dark.is-pressed .c1-know-dark__link { opacity: 1; transform: none; }
@media (hover: hover) {
  .c1-know-dark:hover .c1-know-dark__photo { opacity: 0; transform: scale(1.04); }
  .c1-know-dark:hover::before { opacity: 0; }
  .c1-know-dark:hover .c1-know-dark__orbit { opacity: 1; }
  .c1-know-dark:hover .c1-know-dark__sub, .c1-know-dark:hover .c1-know-dark__link { opacity: 1; transform: none; }
}
@media (prefers-reduced-motion: reduce) {
  .c1-know-dark__photo, .c1-know-dark::before, .c1-know-dark__orbit, .c1-know-dark__sub, .c1-know-dark__link { transition: none; }
}

/* ---------- 안전정보 대표 카드(생활 속 방사선 이야기): 다크 카드와 동일 — 기본 사진, 호버/탭 시 네이비 표현 (2026-09-22) ---------- */
.c1-know-feature { background: linear-gradient(150deg, #16345E, #0B1D3A); }
.c1-know-feature img { transition: opacity 0.35s ease, transform 0.5s ease; }
.c1-know-feature::after { transition: opacity 0.35s ease; }
.c1-know-feature__orbit { position: absolute; right: -80px; bottom: -80px; opacity: 0; transition: opacity 0.35s ease; pointer-events: none; }
.c1-know-feature__link {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 16px; font-size: 14px; font-weight: 700; color: var(--c1-cyan-300);
  opacity: 0; transform: translateY(6px); transition: opacity 0.3s ease, transform 0.3s ease, color 0.2s ease;
}
.c1-know-feature.is-pressed img { opacity: 0; transform: scale(1.04); }
.c1-know-feature.is-pressed::after { opacity: 0; }
.c1-know-feature.is-pressed .c1-know-feature__orbit { opacity: 1; }
.c1-know-feature.is-pressed .c1-know-feature__link { opacity: 1; transform: none; color: #fff; }
@media (hover: hover) {
  .c1-know-feature:hover img { opacity: 0; transform: scale(1.04); }
  .c1-know-feature:hover::after { opacity: 0; }
  .c1-know-feature:hover .c1-know-feature__orbit { opacity: 1; }
  .c1-know-feature:hover .c1-know-feature__link { opacity: 1; transform: none; color: #fff; }
}
@media (max-width: 767px) {
  .c1-know-feature__link { margin-top: 10px; font-size: 13px; }
  .c1-know-feature__orbit { width: 240px; height: 240px; right: -60px; bottom: -60px; }
}
@media (prefers-reduced-motion: reduce) {
  .c1-know-feature img, .c1-know-feature::after, .c1-know-feature__orbit, .c1-know-feature__link { transition: none; }
}

/* ---------- 안전정보 영상 카드(방사선안전 영상): 동일 — 기본 사진, 호버/탭 시 네이비 표현 (2026-09-22) ---------- */
.c1-know-video { background: linear-gradient(150deg, #16345E, #0B1D3A); }
.c1-know-video img { transition: opacity 0.35s ease, transform 0.5s ease; }
.c1-know-video::after { transition: opacity 0.35s ease; }
.c1-know-video__orbit { position: absolute; left: -70px; top: -70px; opacity: 0; transition: opacity 0.35s ease; pointer-events: none; }
.c1-know-video__link {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 10px; font-size: 14px; font-weight: 700; color: var(--c1-cyan-300);
  opacity: 0; transform: translateY(6px); transition: opacity 0.3s ease, transform 0.3s ease, color 0.2s ease;
}
.c1-know-video.is-pressed img { opacity: 0; transform: scale(1.04); }
.c1-know-video.is-pressed::after { opacity: 0; }
.c1-know-video.is-pressed .c1-know-video__orbit { opacity: 1; }
.c1-know-video.is-pressed .c1-know-video__link { opacity: 1; transform: none; color: #fff; }
@media (hover: hover) {
  .c1-know-video:hover img { opacity: 0; transform: scale(1.04); }
  .c1-know-video:hover::after { opacity: 0; }
  .c1-know-video:hover .c1-know-video__orbit { opacity: 1; }
  .c1-know-video:hover .c1-know-video__link { opacity: 1; transform: none; color: #fff; }
}
@media (max-width: 767px) {
  .c1-know-video__link { margin-top: 6px; font-size: 13px; }
  .c1-know-video__orbit { width: 160px; height: 160px; left: -50px; top: -50px; }
}
@media (prefers-reduced-motion: reduce) {
  .c1-know-video img, .c1-know-video::after, .c1-know-video__orbit, .c1-know-video__link { transition: none; }
}