@charset "utf-8";
/* ===========================================================
   2026 공주 국가유산 야행 — 사이트 공통 (메인 + 서브페이지)

   · 헤더 / 푸터 / TOP 버튼 / 서브 히어로 / 본문 공통 컴포넌트
   · 메인 전용 연출(히어로 아치, 족자 초대장 등)은 main-2026.css
   · 단위는 px/clamp/vw 만 사용 (main-reset.css 의 html font-size:62.5% 영향 배제)

   ⚠ 이 파일은 레거시 css/common.css · css/main.css 보다 뒤에 로드된다.
     서브페이지의 옛 스킨이 아직 살아 있으므로, 여기서 전역 요소 셀렉터를
     함부로 건드리지 말 것 (반드시 .y26-* 로 스코프).
   =========================================================== */

/* ⚠ 루트 글자크기 복구
   main_layout.css(헤더/푸터)는 main-reset.css 의 `html { font-size: 62.5% }`
   (= 1rem 10px) 를 전제로 rem 으로 짜여 있다. 그런데 서브페이지에서 함께 로드되는
   레거시 css/default.css 가 `html,body { font-size: 17px }` 로 되돌려 놓아
   모든 rem 값이 1.7 배가 됐다 → PC 드롭다운(.lnb) 글자가 거대해지고 위치가 겹침.
   루트만 되돌리고 body 글자크기는 레거시 값을 유지해 기존 스킨 본문은 그대로 둔다. */
html { font-size: 62.5%; }                       /* 메인은 원래 이 값이라 영향 없음 */
body.y26-sub { font-size: 17px; }
@media screen and (max-width: 767px) {
  body.y26-sub { font-size: 14px; }
}

:root {
  --y26-paper: #EFE5CC;
  --y26-paper-deep: #E6D8B8;
  --y26-ink: #3B2F22;
  --y26-ink-soft: #6E5D45;
  --y26-rule: #CBB88E;
  --y26-brick: #A8593E;
  --y26-gold: #E3A94F;
  --y26-night: #14121F;
  --y26-cream: #EDE3CB;
  --y26-cream-dim: #B7AA8E;

  /* 버튼 색은 포스터의 '1926 공주 낭만연회' 띠에서 그대로 뽑았다.
     (images/2026/obj/subtitle-box.png 실측 — 대비 5.94:1, WCAG AA 통과) */
  --y26-btn-bg: #DAAE6F;
  --y26-btn-ink: #552A14;
}

/* ══════════════════════════════════════════════════════════
   헤더
   히어로 위(메인 최상단) : 투명 · 밝은 로고/메뉴
   그 외                  : 양피지 바 · 어두운 로고/메뉴(.bk)
   기존 테마 헤더가 과하게 커서(PC 181px / MO 70px) 전체적으로 축소한다.
   ══════════════════════════════════════════════════════════ */
.header-wrap {
  min-height: 0;
  transition: background-color .35s ease, box-shadow .35s ease, backdrop-filter .35s ease;
}
.header-wrap::before { top: 78px; }

/* 레거시 css/layout.css 의 `header { position:fixed; z-index:999999; min-height:100px }`
   가 새 헤더를 덮어써서, 서브페이지에서만 .header 가 흐름에서 빠지고
   .header-wrap 높이가 30px 로 찌그러졌다(→ 스킵네비가 화면에 노출).
   레거시 CSS 를 아직 걷어낼 수 없으므로 여기서 되돌린다. */
.header-wrap > .header {
  position: relative;
  top: auto;
  z-index: auto;
}
/* 같은 이유로 레거시 `#header { padding: 15px 0 }` 가 새 래퍼(id="header")에 걸린다 */
.header-wrap#header { padding: 0; }
/* 같은 규칙이 본문 안의 <header>(글 제목 영역 등)에도 걸려 화면 맨 위에 고정돼 버린다 */
.y26-sub-main header {
  position: static;
  top: auto;
  width: auto;
  min-height: 0;
  z-index: auto;
}

.header {
  padding: 22px 40px;
  min-height: 0;
  align-items: center;
}
.header .logo-wrap { gap: 7px; }
.header .logo { height: 40px; width: auto; min-width: 0; margin-top: 0; }
.header .logo > a { height: 100%; }
.header .logo img { display: block; height: 100%; width: auto; }
.header .under-logo { height: 24px; }
.header .under-logo img { display: block; height: 100%; width: auto; }
.header .nav { margin-right: 0; }
/* 화면이 넓어져도 로고와 메뉴가 양 끝으로 벌어지지 않도록 본문 열과 같은 폭으로.
   (1320 - 40*2 = 1240 = .y26-inner 폭) */
.header { max-width: 1320px; margin: 0 auto; }
/* 넓은 화면에서는 메뉴 사이를 넉넉히 — 하위 메뉴가 서로 겹치지 않게도 한다 */
.header .gnb { gap: clamp(26px, 2.8vw, 52px); }
.header .gnb > li { font-size: 16px; }
.header .gnb > li > a { padding: 9px 0; }

/* 하위 메뉴(드롭다운) : 줄 간격이 답답해 보여 여유를 준다 */
.header .lnb { top: 44px; padding: 14px 10px 24px; }
.header .lnb > li > a {
  padding: 8px 6px;
  font-size: 15px;
  line-height: 1.45;
  border-radius: 2px;
  transition: color .2s ease, background-color .2s ease;
}
.header .lnb > li > a:hover,
.header .lnb > li > a:focus {
  color: var(--y26-gold);
  background: rgba(255, 255, 255, .07);
}

/* 현재 위치 표시 — .active 는 header.js 가 드롭다운 열림에 쓰므로 .on 을 따로 쓴다 */
.header .gnb > li.on > a { color: var(--y26-gold); }
.header-wrap.bk .header .gnb > li.on > a { color: var(--y26-brick); }
.header .lnb > li.on > a { color: var(--y26-brick); font-weight: 700; }

/* 태블릿 이하 : 모바일 메뉴 패널 위치도 축소한 헤더에 맞춘다 */
@media all and (max-width: 85.375rem) {
  .header-wrap { min-height: 64px; }
  .header { padding: 14px 32px; min-height: 64px; }
  .header .logo { height: 36px; }
  .header .under-logo { height: 20px; }
  /* 햄버거 : 기존 30×30(막대 29×3)은 축소한 헤더에 비해 과하다.
     탭 영역은 36×36 으로 넉넉히 두고 막대만 줄인다. */
  .header .mobile-btn { margin-top: 0; width: 36px; height: 36px; }
  .header .mobile-btn span { left: 7px; width: 22px; height: 2px; border-radius: 2px; }
  .header .mobile-btn span:nth-of-type(1) { top: 10px; }
  .header .mobile-btn span:nth-of-type(2) { top: 17px; }
  .header .mobile-btn span:nth-of-type(3) { top: 24px; }
  /* 닫기(X) : 원본은 막대의 '오른쪽 끝'을 축으로 회전해서 X 가 오른쪽으로 치우친다.
     두 막대를 버튼 중앙선으로 모은 뒤 각자의 중심에서 회전시켜 정확히 가운데 X 를 만든다. */
  .header .mobile-btn span:nth-of-type(1),
  .header .mobile-btn span:nth-of-type(3) { transform-origin: center center; }
  .header .mobile-btn.active span:nth-of-type(1) { top: 17px; transform: rotate(-45deg); }
  .header .mobile-btn.active span:nth-of-type(3) { top: 17px; transform: rotate(45deg); }
  .header .nav { top: 64px; height: calc(100% - 64px); }
  .header .nav .gnb { padding-top: 6%; }
}
@media all and (max-width: 63.9375rem) {
  .header-wrap { min-height: 58px; }
  .header { padding: 11px 24px; min-height: 58px; }
  .header .logo { height: 32px; width: auto; min-width: 0; }
  .header .under-logo { height: 18px; }
  .header .nav { top: 58px; height: calc(100% - 58px); }
}
@media all and (max-width: 47.9375rem) {
  .header-wrap::before { top: 54px; }
  .header-wrap { min-height: 54px; }
  .header { padding: 10px 18px; min-height: 54px; }
  .header .logo { height: 28px; }
  .header .logo-wrap { gap: 4px; }
  .header .under-logo { height: 15px; }
  .header .nav { top: 54px; height: calc(100% - 54px); }
}

/* ── 모바일/태블릿 전체메뉴 (햄버거 열림) ──
   기존 테마는 .nav/.gnb/.lnb 가 각각 absolute + translate 로 잡혀 있어
   헤더 높이를 바꾸면 위치가 어긋난다. 열림 상태 레이아웃을 통째로 재정의한다.
   (.lnb 는 header.js 가 slideUp/Down 으로 inline display 를 넣으므로 !important) */
@media all and (max-width: 85.375rem) {
  .header-wrap.active {
    height: 100%;
    background-color: rgba(12, 10, 20, .95);
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    overflow: hidden;
  }
  /* .header 를 positioned 로 만들면 .right-wrap 의 % 높이 기준이 헤더 행이 되어
     패널 높이가 0 이 된다. 위치 기준은 .header-wrap(fixed) 으로 유지한다. */
  .header-wrap.active .header {
    position: static;
    height: auto;
    display: flex;
    align-items: center;
  }
  .header-wrap.active .header .logo-wrap { position: relative; z-index: 3; }
  .header-wrap.active .header .mobile-btn { z-index: 3; }
  .header-wrap.active .header .under-logo { opacity: 1; }

  .header-wrap.active .header .right-wrap {
    position: absolute;
    left: 0;
    top: 64px;
    width: 100%;
    height: calc(100% - 64px);
    display: block;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }
  .header-wrap.active .header .nav {
    position: static;
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
    padding: 18px 24px 72px;
    transform: none;
    overflow: visible;
  }
  .header-wrap.active .header .nav .gnb,
  .header-wrap.active .header .gnb {
    position: static;
    display: block;
    width: 100%;
    max-width: 620px;
    margin: 0 auto;
    padding: 0;
    gap: 0;
    text-align: left;
    transform: none;
    top: auto;
    left: auto;
  }
  .header-wrap.active .header .gnb > li {
    display: block;
    width: 100% !important;
    height: auto;
    border-bottom: 1px solid rgba(227, 169, 79, .22);
    text-align: left;
  }
  .header-wrap.active .header .gnb > li > a {
    display: block;
    width: auto;
    margin: 0;
    padding: 18px 2px 10px;
    text-align: left;
    font-family: "Noto Serif KR", serif;
    font-weight: 700;
    font-size: 19px;
    line-height: 1.35;
    color: #F4EBD8;
  }
  .header-wrap.active .header .gnb > li.on > a { color: var(--y26-gold); }
  .header-wrap.active .header .gnb > li > a::before,
  .header-wrap.active .header .gnb > li.active::after { display: none; }

  .header-wrap.active .header .lnb {
    display: flex !important;
    position: static;
    flex-wrap: wrap;
    gap: 2px 20px;
    width: auto;
    max-width: none;
    min-width: 0;
    height: auto;
    margin: 0;
    padding: 0 2px 16px;
    top: auto;
    left: auto;
    background-color: transparent;
    box-shadow: none;
    transform: none;
  }
  .header-wrap.active .header .lnb > li {
    width: auto;
    min-width: 0;
    height: auto;
    text-align: left;
    border: 0;
  }
  .header-wrap.active .header .lnb > li > a {
    display: inline-block;
    padding: 7px 0;
    font-size: 14.5px;
    line-height: 1.4;
    letter-spacing: -.01em;
    color: #C9BCA0;
    white-space: nowrap;
  }
  .header-wrap.active .header .lnb > li.on > a { color: var(--y26-gold); font-weight: 700; }
  .header-wrap.active .header .lnb > li > a:hover,
  .header-wrap.active .header .lnb > li > a:focus { color: var(--y26-gold); }
}
@media all and (max-width: 63.9375rem) {
  .header-wrap.active .header .right-wrap { top: 58px; height: calc(100% - 58px); }
  .header-wrap.active .header .nav { padding: 14px 20px 72px; }
  .header-wrap.active .header .gnb > li > a { font-size: 18px; padding: 16px 2px 9px; }
}
@media all and (max-width: 47.9375rem) {
  .header-wrap.active .header .right-wrap { top: 54px; height: calc(100% - 54px); }
  .header-wrap.active .header .nav { padding: 10px 18px 72px; }
  .header-wrap.active .header .gnb > li > a { font-size: 17px; padding: 15px 2px 8px; }
  .header-wrap.active .header .lnb { gap: 0 16px; }
  .header-wrap.active .header .lnb > li > a { font-size: 13.5px; padding: 6px 0; }
}

/* ── 양피지 바 : 상단 비주얼을 벗어나면 (메인/서브 동일) ── */
body.y26-scrolled .header-wrap:not(.active) {
  background-color: rgba(239, 229, 204, .94);
  -webkit-backdrop-filter: blur(6px);
  backdrop-filter: blur(6px);
  box-shadow: 0 1px 0 rgba(203, 184, 142, .9), 0 6px 24px rgba(59, 47, 34, .1);
}
body.y26-scrolled .header-wrap:not(.active)::before { background-color: transparent; }

/* 본문 구간에서는 한 단계 더 축소 (와WOW 로고는 자리까지 접는다) */
body.y26-scrolled .header-wrap:not(.active) .header {
  padding-top: 15px;
  padding-bottom: 15px;
}
body.y26-scrolled .header-wrap:not(.active) .header .logo { height: 36px; }
body.y26-scrolled .header-wrap:not(.active) .header .logo-wrap { gap: 0; }
body.y26-scrolled .header-wrap:not(.active) .header .under-logo {
  height: 0; overflow: hidden; transition: height .35s ease, opacity .3s ease;
}
@media all and (max-width: 63.9375rem) {
  body.y26-scrolled .header-wrap:not(.active) .header { padding-top: 10px; padding-bottom: 10px; }
  body.y26-scrolled .header-wrap:not(.active) .header .logo { height: 30px; }
}

/* ══════════════════════════════════════════════════════════
   TOP 버튼
   ══════════════════════════════════════════════════════════ */
.page-top {
  width: 54px; height: 54px; right: 28px; bottom: 28px;
  opacity: 0; pointer-events: none; transition: opacity .4s ease;
}
.page-top img { width: 100%; height: 100%; }
body.y26-scrolled .page-top { opacity: 1; pointer-events: auto; }

/* ══════════════════════════════════════════════════════════
   푸터
   기존 테마 푸터가 과도하게 큼 (PC 상단 여백 190px · 블록 간격 137px ·
   하단 구분 200px → 전체 840px). 정보 밀도에 맞게 압축한다.
   ══════════════════════════════════════════════════════════ */
.footer { padding: 62px 0 26px; background: #14121F; }
/* 본문(.y26-sec 좌우 40px + .y26-inner 1240px)과 좌우 끝이 정확히 맞도록.
   1320 - 40*2 = 1240 이라 넓은 화면에서 본문 열과 같은 자리에서 시작한다. */
.footer .inner { max-width: 1320px; padding: 0 40px; }
.footer .flex-wrap { align-items: flex-start; gap: 32px; }

.footer .left { gap: 28px; margin-top: 0; }
.footer .list-wrap { gap: 11px; }
.footer .list-wrap .list { gap: 34px; }
.footer .list-wrap .list li { font-size: 16px; font-weight: 600; }
.footer .list-wrap .list li::before {
  height: 13px; right: -17px; background: rgba(255, 255, 255, .34);
}
/* 레거시 css/default.css 의 `a { color: … }` 가 상속을 끊어 서브페이지에서만
   푸터 링크가 파란색으로 나온다. 색을 명시한다. */
.footer .list-wrap .list li a { color: #fff; transition: color .25s ease; }
.footer .list-wrap .list li a:hover,
.footer .list-wrap .list li a:focus { color: #E3A94F; }

.footer .info-wrap { display: flex; flex-direction: column; gap: 11px; }
.footer .info { gap: 16px; }
.footer .info span {
  font-size: 13px; font-weight: 600; letter-spacing: .16em;
  color: #C9BCA0; min-width: 30px;
}
.footer .info .img img { display: block; height: 26px; width: auto; }

.footer .logo { width: 230px; flex: none; }
.footer .logo img { display: block; width: 100%; height: auto; }

.footer .under {
  margin-top: 40px; padding-top: 18px;
  border-top: 1px solid rgba(255, 255, 255, .12);
}
.footer .under p { font-size: 12.5px; line-height: 1.75; color: #9A937F; }

@media all and (max-width: 85.375rem) {
  .footer { padding: 54px 0 24px; }
  .footer .left { gap: 24px; }
  .footer .logo { width: 200px; }
  .footer .list-wrap .list li { font-size: 15.5px; }
  .footer .under { margin-top: 34px; }
  .page-top { width: 48px; height: 48px; right: 22px; bottom: 22px; }
}
@media all and (max-width: 63.9375rem) {
  .footer { padding: 46px 0 22px; }
  .footer .inner { max-width: 1296px; padding: 0 28px; }  /* 본문 .y26-sec 28px 와 정렬 */
  .footer .left { gap: 22px; }
  .footer .logo { width: 178px; }
  .footer .info span { font-size: 12.5px; min-width: 28px; }
  .footer .info .img img { height: 22px; }
  .footer .under { flex-direction: column; gap: 4px; margin-top: 28px; }
}
@media all and (max-width: 47.9375rem) {
  .footer { padding: 40px 0 22px; }
  .footer .inner { max-width: 1280px; padding: 0 20px; }  /* 본문 .y26-sec 20px 와 정렬 */
  .footer .flex-wrap { flex-direction: column-reverse; gap: 24px; }
  .footer .left { gap: 20px; }
  .footer .logo { width: 158px; }
  .footer .list-wrap { gap: 8px; }
  .footer .list-wrap .list { gap: 26px; }
  .footer .list-wrap .list li { font-size: 14.5px; }
  .footer .list-wrap .list li::before { height: 12px; right: -13px; }
  .footer .info .img img { height: 20px; }
  .footer .under { margin-top: 24px; padding-top: 14px; }
  .footer .under p { font-size: 11.5px; line-height: 1.7; }
  .page-top { width: 42px; height: 42px; right: 16px; bottom: 18px; }
}

/* ══════════════════════════════════════════════════════════
   서브페이지 — 공통 골격
   ══════════════════════════════════════════════════════════ */
body.y26-sub { background: var(--y26-paper); }

.y26-sub-main {
  display: block;
  background: var(--y26-paper);
  color: var(--y26-ink);
  font-family: "Pretendard Variable", "Pretendard", "SUIT", sans-serif;
  font-size: 16px;
  line-height: 1.6;
  letter-spacing: -.01em;
  /* 한글이 단어 중간에서 잘리지 않도록 */
  word-break: keep-all;
  overflow-wrap: break-word;
}
.y26-sub-main img { max-width: 100%; }
/* 서브페이지에는 레거시 CSS 가 함께 로드된다. 링크 색은 각 컴포넌트가 정하도록
   기본값을 상속으로 되돌려 둔다 (안 그러면 브라우저 기본 파란 링크가 남는다).
   :not(.y26-btn) — 이 규칙(0,1,1)이 .y26-btn(0,1,0)보다 우선순위가 높아
   버튼 글자가 배경색을 상속해 안 보이던 문제가 있었다. */
.y26-sub-main a:not(.y26-btn) { color: inherit; text-decoration: none; }
.y26-sub-main a.y26-btn { text-decoration: none; }
.y26-sub-main .serif { font-family: "Noto Serif KR", serif; }
.y26-sub-main :focus-visible { outline: 2px solid var(--y26-brick); outline-offset: 3px; }

/* ── 서브 히어로 ── */
.y26-subhero {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: 340px;
  padding: 150px 40px 46px;
  overflow: hidden;
  background: var(--y26-night);
  isolation: isolate;
}
.y26-subhero .sh-bg { position: absolute; inset: 0; z-index: -2; }
.y26-subhero .sh-bg img {
  width: 100%; height: 100%;
  object-fit: cover; object-position: 50% 62%;
  opacity: .5;
}
/* 아래로 갈수록 짙어져 글자 대비를 확보하고, 양피지 본문과 자연스럽게 잇는다 */
.y26-subhero::after {
  content: ''; position: absolute; inset: 0; z-index: -1;
  background: linear-gradient(180deg,
    rgba(20, 18, 31, .82) 0%,
    rgba(20, 18, 31, .58) 42%,
    rgba(20, 18, 31, .88) 100%);
}
/* min-width:0 : flex 자식의 기본 min-width:auto 는 최소 콘텐츠 폭 아래로 못 줄어들어
   좁은 화면에서 문단이 컨테이너 밖으로 삐져나간다. */
.y26-subhero .sh-in { width: 100%; min-width: 0; max-width: 1240px; margin: 0 auto; }
.y26-subhero .sh-eyebrow {
  font-size: 14px; font-weight: 600; letter-spacing: .22em;
  color: var(--y26-gold); margin-bottom: 12px;
}
.y26-subhero .sh-title {
  font-size: clamp(28px, 3.4vw, 44px); font-weight: 900; line-height: 1.25;
  color: var(--y26-cream);
}
.y26-subhero .sh-lead {
  margin-top: 14px; max-width: 720px;
  font-size: 16px; line-height: 1.75; color: rgba(237, 227, 203, .8);
}
.y26-subhero .sh-crumb {
  display: flex; flex-wrap: wrap; align-items: center; gap: 8px;
  margin-top: 22px; font-size: 13.5px; color: var(--y26-cream-dim);
}
.y26-subhero .sh-crumb a { color: var(--y26-cream-dim); transition: color .25s ease; }
.y26-subhero .sh-crumb a:hover,
.y26-subhero .sh-crumb a:focus { color: var(--y26-gold); }
.y26-subhero .sh-crumb i { font-style: normal; opacity: .55; }
.y26-subhero .sh-crumb span { color: var(--y26-cream); font-weight: 600; }

/* ── 형제 메뉴 탭 ──
   고정 헤더 바로 아래에 붙는다. top 값은 스크롤 후(축소된) 헤더 높이. */
.y26-subtabs {
  position: sticky; top: 66px; z-index: 40;
  background: var(--y26-paper-deep);
  border-bottom: 1px solid var(--y26-rule);
}
.y26-subtabs .st-in {
  max-width: 1240px; margin: 0 auto; padding: 0 40px;
  overflow-x: auto; -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}
.y26-subtabs .st-in::-webkit-scrollbar { display: none; }
.y26-subtabs ul { display: flex; gap: 4px; list-style: none; margin: 0; padding: 0; }
.y26-subtabs li { flex: none; }
.y26-subtabs a {
  display: block; padding: 15px 18px;
  font-size: 15px; font-weight: 600; white-space: nowrap;
  color: var(--y26-ink-soft);
  border-bottom: 2px solid transparent;
  transition: color .25s ease, border-color .25s ease;
}
.y26-subtabs a:hover, .y26-subtabs a:focus { color: var(--y26-ink); }
.y26-subtabs li.on a { color: var(--y26-brick); border-bottom-color: var(--y26-brick); }

@media all and (max-width: 63.9375rem) {
  .y26-subhero { min-height: 280px; padding: 118px 28px 36px; }
  .y26-subhero .sh-lead { font-size: 15px; margin-top: 12px; }
  .y26-subhero .sh-crumb { margin-top: 18px; font-size: 13px; }
  .y26-subtabs { top: 58px; }
  .y26-subtabs .st-in { padding: 0 28px; }
  .y26-subtabs a { padding: 13px 15px; font-size: 14.5px; }
}
@media all and (max-width: 47.9375rem) {
  .y26-subhero { min-height: 230px; padding: 96px 20px 28px; }
  .y26-subhero .sh-eyebrow { font-size: 12px; letter-spacing: .18em; margin-bottom: 9px; }
  .y26-subhero .sh-lead { font-size: 14.5px; }
  .y26-sub-main .pc-br { display: none; }   /* PC 에서만 줄바꿈 */
  .y26-subhero .sh-crumb { margin-top: 15px; font-size: 12.5px; gap: 6px; }
  .y26-subtabs { top: 54px; }
  .y26-subtabs .st-in { padding: 0 20px; }
  .y26-subtabs a { padding: 12px 13px; font-size: 14px; }
}

/* ══════════════════════════════════════════════════════════
   서브페이지 — 본문 공통 컴포넌트
   ══════════════════════════════════════════════════════════ */
.y26-sec { padding: 84px 40px; }
.y26-sec.tight { padding-top: 56px; }
.y26-sec.dark { background: var(--y26-night); color: var(--y26-cream); }
.y26-inner { max-width: 1240px; margin: 0 auto; }
.y26-inner.narrow { max-width: 900px; }

/* 섹션 제목 : 한자 표제 + 국문 제목 */
.y26-h {
  display: flex; align-items: baseline; gap: 14px; flex-wrap: wrap;
  margin-bottom: 30px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--y26-rule);
}
.y26-h .th {
  font-family: "Noto Serif KR", serif; font-weight: 900;
  font-size: 15px; letter-spacing: .1em;
  color: var(--y26-brick);
}
.y26-h h3 {
  font-family: "Noto Serif KR", serif; font-weight: 900;
  font-size: clamp(21px, 2.2vw, 28px); line-height: 1.3;
  color: var(--y26-ink);
}
.y26-h .sub { font-size: 14.5px; color: var(--y26-ink-soft); }
.y26-sec.dark .y26-h { border-bottom-color: rgba(227, 169, 79, .3); }
.y26-sec.dark .y26-h h3 { color: var(--y26-cream); }
.y26-sec.dark .y26-h .th { color: var(--y26-gold); }
.y26-sec.dark .y26-h .sub { color: var(--y26-cream-dim); }

/* 본문 텍스트 */
.y26-p { font-size: 16px; line-height: 1.85; color: var(--y26-ink-soft); }
.y26-p + .y26-p { margin-top: 14px; }
.y26-p strong { color: var(--y26-ink); font-weight: 700; }

/* 불릿 목록 */
.y26-list { list-style: none; margin: 0; padding: 0; }
.y26-list > li {
  position: relative; padding-left: 18px; margin-top: 12px;
  font-size: 16px; line-height: 1.8; color: var(--y26-ink-soft);
}
.y26-list > li:first-child { margin-top: 0; }
.y26-list > li::before {
  content: ''; position: absolute; left: 2px; top: .72em;
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--y26-brick);
}
.y26-list > li strong { color: var(--y26-ink); font-weight: 700; }
.y26-sec.dark .y26-list > li { color: rgba(237, 227, 203, .82); }
.y26-sec.dark .y26-list > li::before { background: var(--y26-gold); }
.y26-sec.dark .y26-list > li strong { color: var(--y26-cream); }
.y26-sec.dark .y26-p { color: rgba(237, 227, 203, .82); }
.y26-sec.dark .y26-p strong { color: var(--y26-cream); }

/* 정보 표 (일시/장소/주최…) — 좁아지면 자동으로 2줄 카드가 된다 */
.y26-dl { border-top: 2px solid var(--y26-ink); }
.y26-dl .row {
  display: grid; grid-template-columns: 132px 1fr;
  border-bottom: 1px solid var(--y26-rule);
}
.y26-dl .row > dt {
  padding: 17px 18px;
  font-family: "Noto Serif KR", serif; font-weight: 700; font-size: 15.5px;
  color: var(--y26-ink);
  background: rgba(203, 184, 142, .22);
}
.y26-dl .row > dd {
  padding: 17px 20px;
  font-size: 16px; line-height: 1.7; color: var(--y26-ink-soft);
}
@media all and (max-width: 47.9375rem) {
  .y26-dl .row { grid-template-columns: 1fr; }
  .y26-dl .row > dt { padding: 11px 14px; font-size: 14.5px; }
  .y26-dl .row > dd { padding: 13px 14px 16px; font-size: 15px; }
}

/* 카드 */
.y26-card {
  background: #FBF5E6;
  border: 1px solid var(--y26-rule);
  border-radius: 3px;
  box-shadow: 0 10px 30px rgba(59, 47, 34, .07);
}

/* 안내 문구 */
.y26-note {
  margin-top: 18px; padding: 14px 18px;
  border-left: 3px solid var(--y26-brick);
  background: rgba(168, 89, 62, .06);
  font-size: 14.5px; line-height: 1.7; color: var(--y26-ink-soft);
}

/* 버튼 — 포스터 부제 띠와 같은 조합 (황토 바탕 + 진갈색 글자).
   hover 는 그 조합을 뒤집는다. 어두운 바탕에 어두운 글자는 쓰지 않는다. */
.y26-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  padding: 14px 26px;
  font-size: 15.5px; font-weight: 700; letter-spacing: -.01em;
  color: var(--y26-btn-ink); background: var(--y26-btn-bg);
  border: 1px solid var(--y26-btn-bg); border-radius: 2px;
  box-shadow: 0 6px 18px rgba(85, 42, 20, .18);
  transition: background-color .25s ease, color .25s ease, border-color .25s ease, box-shadow .25s ease;
}
.y26-btn:hover, .y26-btn:focus {
  color: var(--y26-btn-bg); background: var(--y26-btn-ink); border-color: var(--y26-btn-ink);
  box-shadow: 0 8px 22px rgba(85, 42, 20, .3);
}
/* 보조 : 테두리만. hover 시 기본 버튼 색으로 채워진다 */
.y26-btn.ghost {
  color: var(--y26-btn-ink); background: transparent;
  border-color: var(--y26-rule); box-shadow: none;
}
.y26-btn.ghost:hover, .y26-btn.ghost:focus {
  color: var(--y26-btn-ink); background: var(--y26-btn-bg); border-color: var(--y26-btn-bg);
  box-shadow: 0 6px 18px rgba(85, 42, 20, .18);
}
/* 어두운 섹션 위 — 기본 버튼은 그대로 쓰고, 보조 버튼만 밝은 테두리로 */
.y26-sec.dark .y26-btn.ghost {
  color: var(--y26-cream); background: transparent; border-color: rgba(237, 227, 203, .5);
}
.y26-sec.dark .y26-btn.ghost:hover, .y26-sec.dark .y26-btn.ghost:focus {
  color: var(--y26-btn-ink); background: var(--y26-btn-bg); border-color: var(--y26-btn-bg);
}

/* 준비중 안내 — 올해 내용이 확정되기 전 자리를 지키는 패널.
   8夜 · 사전예약 · 연계행사 · 행사지도 · 사전신청확인이 함께 쓴다. */
.y26-pending {
  position: relative;
  padding: 58px 40px 52px;
  text-align: center;
  background:
    radial-gradient(120% 100% at 50% 0%, rgba(227, 169, 79, .16), transparent 62%),
    #FBF5E6;
  border: 1px solid var(--y26-rule);
  box-shadow: 0 12px 34px rgba(59, 47, 34, .08);
}
/* 네 귀퉁이 낙관 느낌의 모서리 선 */
.y26-pending::before, .y26-pending::after {
  content: ''; position: absolute; width: 26px; height: 26px; pointer-events: none;
  border-color: var(--y26-btn-bg); border-style: solid;
}
.y26-pending::before { left: 12px; top: 12px; border-width: 2px 0 0 2px; }
.y26-pending::after { right: 12px; bottom: 12px; border-width: 0 2px 2px 0; }

.y26-pending .pd-mark {
  display: block; margin-bottom: 18px;
  font-size: 13px; letter-spacing: .42em; text-indent: .42em;
  color: var(--y26-brick);
}
.y26-pending .pd-tit {
  font-size: clamp(21px, 2.2vw, 28px); font-weight: 900; line-height: 1.4; color: var(--y26-ink);
}
/* 제목 아래 얇은 구분선 + 가운데 마름모 */
.y26-pending .pd-tit::after {
  content: '✦'; display: block; margin: 16px auto 0;
  font-size: 12px; color: var(--y26-btn-bg);
}
.y26-pending .pd-txt {
  margin: 14px auto 28px; max-width: 34em;
  font-size: 15.5px; line-height: 1.85; color: var(--y26-ink-soft);
}
.y26-pending .pd-btns {
  display: flex; justify-content: center; gap: 12px; flex-wrap: wrap;
}
.y26-pending .pd-btns .y26-btn { min-width: 190px; }

@media all and (max-width: 47.9375rem) {
  .y26-pending { padding: 40px 22px 36px; }
  .y26-pending::before, .y26-pending::after { width: 18px; height: 18px; }
  .y26-pending .pd-mark { font-size: 11.5px; margin-bottom: 14px; }
  .y26-pending .pd-txt { margin-bottom: 24px; font-size: 15px; }
  .y26-pending .pd-btns { flex-direction: column; }
  .y26-pending .pd-btns .y26-btn { min-width: 0; width: 100%; }
}

/* 분류 칩 (그누보드 $category_option 이 <li><a> 를 뱉는다) */
.y26-cate {
  display: flex; flex-wrap: wrap; gap: 8px;
  list-style: none; margin: 0 0 28px; padding: 0;
}
.y26-cate li a {
  display: inline-block; padding: 9px 18px;
  font-size: 14.5px; font-weight: 600; color: var(--y26-ink-soft);
  background: rgba(203, 184, 142, .26); border: 1px solid var(--y26-rule);
  transition: color .25s ease, background-color .25s ease, border-color .25s ease;
}
.y26-cate li a:hover, .y26-cate li a:focus { color: var(--y26-ink); border-color: var(--y26-brick); }
.y26-cate li.on a, .y26-cate li a#bo_cate_on {
  color: var(--y26-btn-ink); background: var(--y26-btn-bg); border-color: var(--y26-btn-bg);
}

@media all and (max-width: 63.9375rem) {
  .y26-sec { padding: 64px 28px; }
  .y26-sec.tight { padding-top: 44px; }
  .y26-h { margin-bottom: 24px; padding-bottom: 14px; gap: 10px; }
  .y26-p, .y26-list > li { font-size: 15.5px; }
}
@media all and (max-width: 47.9375rem) {
  .y26-sec { padding: 48px 20px; }
  .y26-sec.tight { padding-top: 34px; }
  .y26-h { margin-bottom: 20px; padding-bottom: 12px; }
  .y26-p, .y26-list > li { font-size: 15px; line-height: 1.78; }
  .y26-btn { width: 100%; padding: 13px 20px; font-size: 15px; }
}

/* ══════════════════════════════════════════════════════════
   게시판 공통 (공지사항 · 행사사진 · 행사영상 · 이전 야행 …)
   ══════════════════════════════════════════════════════════ */

/* 검색 + 건수 */
.y26-boardtop {
  display: flex; align-items: center; justify-content: space-between;
  flex-wrap: wrap; gap: 14px;
  margin-bottom: 22px;
}
.y26-boardtop .cnt { font-size: 14.5px; color: var(--y26-ink-soft); }
.y26-boardtop .cnt b { color: var(--y26-brick); font-weight: 700; }
.y26-boardtop .sch { display: flex; gap: 6px; }
.y26-boardtop .sch select,
.y26-boardtop .sch input[type="text"] {
  height: 42px; padding: 0 12px;
  font-family: inherit; font-size: 14.5px; color: var(--y26-ink);
  background: #FBF5E6; border: 1px solid var(--y26-rule); border-radius: 0;
}
.y26-boardtop .sch input[type="text"] { width: 200px; }
.y26-boardtop .sch button {
  height: 42px; padding: 0 20px;
  font-family: inherit; font-size: 14.5px; font-weight: 700;
  color: var(--y26-btn-ink); background: var(--y26-btn-bg);
  border: 1px solid var(--y26-btn-bg); cursor: pointer;
  transition: background-color .25s ease, color .25s ease;
}
.y26-boardtop .sch button:hover, .y26-boardtop .sch button:focus {
  color: var(--y26-btn-bg); background: var(--y26-btn-ink);
}

/* 글 목록 (표) — 좁은 화면에서는 카드로 접힌다 */
.y26-tlist { border-top: 2px solid var(--y26-ink); }
.y26-tlist .hd,
.y26-tlist .row {
  display: grid; grid-template-columns: 88px 1fr 120px 130px;
  align-items: center;
  border-bottom: 1px solid var(--y26-rule);
}
.y26-tlist .hd {
  background: rgba(203, 184, 142, .22);
  font-family: "Noto Serif KR", serif; font-weight: 700; font-size: 14.5px; color: var(--y26-ink);
}
.y26-tlist .hd > span,
.y26-tlist .row > span { padding: 15px 12px; text-align: center; font-size: 15px; color: var(--y26-ink-soft); }
.y26-tlist .hd > span.subj,
.y26-tlist .row > span.subj { text-align: left; padding-left: 18px; }
.y26-tlist .row > span.subj a { color: var(--y26-ink); font-weight: 600; }
.y26-tlist .row:hover { background: rgba(203, 184, 142, .13); }
.y26-tlist .row > span.subj a:hover,
.y26-tlist .row > span.subj a:focus { color: var(--y26-brick); text-decoration: underline; }
.y26-tlist .row.is-notice { background: rgba(227, 169, 79, .12); }
.y26-tlist .no-badge {
  display: inline-block; padding: 3px 9px;
  font-size: 12px; font-weight: 700; letter-spacing: .04em;
  color: var(--y26-cream); background: var(--y26-brick);
}
.y26-tlist .empty { padding: 60px 20px; text-align: center; color: var(--y26-ink-soft); border-bottom: 1px solid var(--y26-rule); }

/* 썸네일 목록 */
.y26-gallery {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 26px; list-style: none; margin: 0; padding: 0;
}
.y26-gallery > li { min-width: 0; }
.y26-gallery a {
  display: block; height: 100%;
  background: #FBF5E6; border: 1px solid var(--y26-rule);
  box-shadow: 0 8px 22px rgba(59, 47, 34, .06);
  transition: transform .3s ease, box-shadow .3s ease, border-color .3s ease;
}
.y26-gallery a:hover, .y26-gallery a:focus {
  transform: translateY(-4px); border-color: var(--y26-brick);
  box-shadow: 0 16px 34px rgba(59, 47, 34, .14);
}
.y26-gallery .thumb {
  position: relative; display: block;
  aspect-ratio: 4 / 3; overflow: hidden; background: var(--y26-paper-deep);
}
.y26-gallery .thumb img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .5s ease; }
.y26-gallery a:hover .thumb img { transform: scale(1.05); }
.y26-gallery .no_image {
  display: flex; align-items: center; justify-content: center; height: 100%;
  font-size: 13px; color: var(--y26-ink-soft);
}
/* 영상 : 재생 표시 */
.y26-gallery.is-video .thumb::after {
  content: ''; position: absolute; left: 50%; top: 50%;
  width: 0; height: 0; margin: -13px 0 0 -8px;
  border: 13px solid transparent; border-left: 21px solid rgba(255, 255, 255, .92);
  filter: drop-shadow(0 2px 6px rgba(0, 0, 0, .45));
}
.y26-gallery .txt { display: block; padding: 16px 16px 18px; }
.y26-gallery .txt .tit {
  display: block;
  font-family: "Noto Serif KR", serif; font-weight: 700;
  font-size: 17px; line-height: 1.4; color: var(--y26-ink);
}
.y26-gallery .txt .sub {
  display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 9px;
  font-size: 13px; color: var(--y26-ink-soft);
}
.y26-gallery .txt .sub b { font-weight: 600; color: var(--y26-brick); }

/* 페이지 넘김 (그누보드 $write_pages) */
.y26-pager { margin-top: 40px; text-align: center; }
.y26-pager .pg { display: inline-flex; flex-wrap: wrap; justify-content: center; gap: 6px; }
.y26-pager .pg_page,
.y26-pager .pg_current {
  display: inline-flex; align-items: center; justify-content: center;
  min-width: 40px; height: 40px; padding: 0 12px;
  font-size: 14.5px; font-weight: 600;
  border: 1px solid var(--y26-rule); background: #FBF5E6; color: var(--y26-ink-soft);
  transition: color .25s ease, background-color .25s ease, border-color .25s ease;
}
.y26-pager .pg_page:hover,
.y26-pager .pg_page:focus { color: var(--y26-brick); border-color: var(--y26-brick); }
.y26-pager .pg_current {
  color: var(--y26-cream); background: var(--y26-brick); border-color: var(--y26-brick);
}

/* 관리자 글쓰기 */
.y26-boardfoot { display: flex; justify-content: flex-end; margin-top: 24px; }
.y26-boardfoot .y26-btn { width: auto; }

@media all and (max-width: 63.9375rem) {
  .y26-gallery { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
}
@media all and (max-width: 47.9375rem) {
  .y26-boardtop { flex-direction: column-reverse; align-items: stretch; }
  .y26-boardtop .sch { width: 100%; }
  .y26-boardtop .sch input[type="text"] { flex: 1 1 auto; width: auto; min-width: 0; }
  /* 표를 카드로 : 제목 한 줄 + 그 아래 번호·작성자·날짜 한 줄 */
  .y26-tlist .hd { display: none; }
  .y26-tlist .row { display: block; padding: 14px 4px 15px; }
  .y26-tlist .row > span { display: inline; padding: 0; text-align: left; font-size: 13px; }
  .y26-tlist .row > span.subj { display: block; margin-bottom: 7px; font-size: 15.5px; }
  /* 번호는 제목(블록) 바로 앞 줄에 홀로 오므로 구분점을 붙이지 않는다 */
  .y26-tlist .row > span.name::after { content: '·'; margin: 0 7px; color: var(--y26-rule); }
  .y26-gallery { grid-template-columns: minmax(0, 1fr); gap: 16px; }
  .y26-pager .pg_page, .y26-pager .pg_current { min-width: 36px; height: 36px; padding: 0 9px; font-size: 13.5px; }
  .y26-boardfoot .y26-btn { width: 100%; }
}

/* ══════════════════════════════════════════════════════════
   대화상자 (사전신청 확인 결과 등)
   부트스트랩 모달을 걷어내고 쓰는 최소 구현.
   ══════════════════════════════════════════════════════════ */
.y26-dialog { position: fixed; inset: 0; z-index: 6000; display: flex; align-items: center; justify-content: center; padding: 20px; }
.y26-dialog[hidden] { display: none; }
.y26-dialog .dlg-bd { position: absolute; inset: 0; background: rgba(20, 18, 31, .62); }
.y26-dialog .dlg {
  position: relative; width: 100%; max-width: 460px;
  padding: 30px 28px 26px; text-align: center;
  background: #FBF5E6; border: 1px solid var(--y26-rule);
  box-shadow: 0 24px 60px rgba(20, 18, 31, .4);
}
.y26-dialog .dlg-tit { font-size: 21px; font-weight: 900; color: var(--y26-ink); }
.y26-dialog .dlg-body { margin: 18px 0 24px; font-size: 15px; line-height: 1.75; color: var(--y26-ink-soft); text-align: left; }
.y26-dialog .dlg-body.y26-dl .row > dt { padding: 12px 14px; font-size: 14.5px; }
.y26-dialog .dlg-body.y26-dl .row > dd { padding: 12px 14px; font-size: 15px; }
.y26-dialog .y26-btn { min-width: 140px; }

/* ══════════════════════════════════════════════════════════
   오시는길
   ══════════════════════════════════════════════════════════ */
.y26-loc .loc-map {
  width: 100%; height: 520px;
  border: 1px solid var(--y26-rule); background: var(--y26-paper-deep);
}
.y26-loc .loc-info { margin-top: 28px; overflow: hidden; }
.y26-loc .loc-info a { color: var(--y26-brick); font-weight: 600; }

.y26-loc-bus { background: var(--y26-paper-deep); }
.y26-loc-bus .loc-cards {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px; list-style: none; margin: 0; padding: 0;
}
.y26-loc-bus .loc-cards > li { min-width: 0; padding: 22px 24px; }
.y26-loc-bus .loc-cards > li.wide { grid-column: 1 / -1; }
.y26-loc-bus .loc-cards .tit { display: block; font-size: 17px; font-weight: 900; color: var(--y26-ink); }
.y26-loc-bus .loc-cards .step { margin-top: 10px; font-size: 15px; line-height: 1.7; color: var(--y26-ink-soft); }
.y26-loc-bus .loc-cards .y26-list { margin-top: 12px; }
.y26-loc-bus .loc-cards .more {
  display: inline-block; margin-top: 14px;
  font-size: 14px; font-weight: 700; color: var(--y26-brick);
}
.y26-loc-bus .loc-cards .more:hover, .y26-loc-bus .loc-cards .more:focus { text-decoration: underline; }

/* ══════════════════════════════════════════════════════════
   행사지도 · 야간개방 시설 지도 · 연계행사 안내문 (큰 이미지 한 장)
   ══════════════════════════════════════════════════════════ */
/* 행사지도 : 전달받은 지도·리플렛 이미지를 보여 준다 */
.y26-maps-note { padding-top: 56px; padding-bottom: 0; }
.y26-maps-note .y26-note { margin-top: 0; }
.y26-maps-note .y26-note b { color: var(--y26-brick); font-weight: 700; }
.y26-maps.alt { background: var(--y26-paper-deep); }
.y26-maps .map-shot { position: relative; display: block; overflow: hidden; }
.y26-maps .map-shot .zoom {
  position: absolute; right: 14px; bottom: 14px;
  padding: 8px 16px;
  font-size: 13.5px; font-weight: 700; letter-spacing: -.01em;
  color: var(--y26-btn-ink); background: var(--y26-btn-bg);
  opacity: 0; transform: translateY(6px);
  transition: opacity .25s ease, transform .25s ease;
}
.y26-maps .map-shot:hover .zoom,
.y26-maps .map-shot:focus .zoom { opacity: 1; transform: translateY(0); }

.y26-maps .map-fig, .y26-fac .fac-map, .y26-ev .ev-map { margin: 0; text-align: center; }
.y26-maps .map-fig img, .y26-fac .fac-map img, .y26-ev .ev-map img {
  display: block; width: 100%; height: auto;
  border: 1px solid var(--y26-rule);
  box-shadow: 0 14px 40px rgba(59, 47, 34, .12);
}
.y26-maps .map-fig figcaption, .y26-fac .fac-map figcaption, .y26-ev .ev-map figcaption { margin-top: 18px; }

/* ══════════════════════════════════════════════════════════
   야간개방 시설
   ══════════════════════════════════════════════════════════ */
.y26-fac-list { background: var(--y26-paper-deep); }
.y26-fac-list .fac-grid {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 20px; list-style: none; margin: 0; padding: 0;
}
.y26-fac-list .fac-card { min-width: 0; display: flex; flex-direction: column; padding: 24px 22px; }
.y26-fac-list .fac-card .hd { display: flex; align-items: center; gap: 11px; }
.y26-fac-list .fac-card .no {
  flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 28px; height: 28px; border-radius: 50%;
  font-size: 13px; font-weight: 700;
  color: var(--y26-btn-ink); background: var(--y26-btn-bg);
}
.y26-fac-list .fac-card .nm { font-size: 18px; font-weight: 900; line-height: 1.3; color: var(--y26-ink); }
.y26-fac-list .fac-card .time {
  margin-top: 12px; font-size: 14px; color: var(--y26-brick);
}
.y26-fac-list .fac-card .time b { font-weight: 700; }
.y26-fac-list .fac-card .desc {
  margin-top: 12px; font-size: 14.5px; line-height: 1.7; color: var(--y26-ink-soft);
}
.y26-fac-list .fac-card .notice {
  margin-top: 14px; padding: 12px 14px;
  border-left: 3px solid var(--y26-brick); background: rgba(168, 89, 62, .07);
  font-size: 13.5px; line-height: 1.65; color: var(--y26-ink-soft);
}
.y26-fac-list .fac-card .notice b { display: block; margin-bottom: 4px; color: var(--y26-ink); }
.y26-fac-list .fac-card .addr {
  margin-top: auto; padding-top: 16px;
  font-size: 13.5px; color: var(--y26-ink-soft);
}
.y26-fac-list .fac-card .addr::before { content: '주소  '; color: var(--y26-brick); font-weight: 700; }
.y26-fac-list .fac-card .site {
  margin-top: 8px; font-size: 13.5px; font-weight: 700; color: var(--y26-brick);
  overflow-wrap: anywhere;
}
.y26-fac-list .fac-card .site:hover, .y26-fac-list .fac-card .site:focus { text-decoration: underline; }

/* ══════════════════════════════════════════════════════════
   연계행사
   ══════════════════════════════════════════════════════════ */
.y26-ev-list { background: var(--y26-paper-deep); }
.y26-ev-list .ev-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px; list-style: none; margin: 0; padding: 0;
}
.y26-ev-list .ev-card { min-width: 0; overflow: hidden; }
.y26-ev-list .ev-card .hd { padding: 22px 24px; background: var(--y26-night); }
.y26-ev-list .ev-card .nm { font-size: 20px; font-weight: 900; color: var(--y26-cream); }
.y26-ev-list .ev-card .hd .sub { margin-top: 7px; font-size: 14px; line-height: 1.6; color: var(--y26-gold); }
.y26-ev-list .ev-card .bd { padding: 22px 24px 24px; }
.y26-ev-list .ev-card .sec { margin-top: 22px; }
.y26-ev-list .ev-card .sec-tit {
  display: block; margin-bottom: 10px;
  font-size: 15.5px; font-weight: 900; color: var(--y26-brick);
}
.y26-ev-list .ev-card .people { list-style: none; margin: 0; padding: 0; }
.y26-ev-list .ev-card .people li {
  padding: 10px 0; border-top: 1px solid rgba(203, 184, 142, .6);
  font-size: 14.5px; color: var(--y26-ink-soft);
}
.y26-ev-list .ev-card .people li b { display: block; font-size: 13px; color: var(--y26-brick); }

/* ══════════════════════════════════════════════════════════
   주차장 안내
   ══════════════════════════════════════════════════════════ */
.y26-park .pk-map {
  width: 100%; height: 560px;
  border: 1px solid var(--y26-rule); background: var(--y26-paper-deep);
}
.y26-park .y26-h { margin-top: 46px; }
.y26-park .pk-list {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px; list-style: none; margin: 0; padding: 0; counter-reset: none;
}
.y26-park .pk-item { display: flex; gap: 14px; align-items: flex-start; padding: 18px 20px; min-width: 0; }
.y26-park .pk-item .no {
  flex: none; display: inline-flex; align-items: center; justify-content: center;
  width: 30px; height: 30px; border-radius: 50%;
  font-size: 14px; font-weight: 700;
  color: var(--y26-btn-ink); background: var(--y26-btn-bg);
}
.y26-park .pk-item .txt { min-width: 0; }
.y26-park .pk-item .nm { display: block; font-size: 16.5px; font-weight: 900; color: var(--y26-ink); }
.y26-park .pk-item .nm .rec {
  display: inline-block; margin-left: 7px; padding: 2px 8px;
  font-style: normal; font-size: 11.5px; font-weight: 700; letter-spacing: .04em;
  color: var(--y26-cream); background: var(--y26-brick);
}
.y26-park .pk-item .addr, .y26-park .pk-item .cap {
  display: block; margin-top: 5px; font-size: 14px; color: var(--y26-ink-soft);
}
.y26-park .pk-item .cap { color: var(--y26-brick); }

/* ══════════════════════════════════════════════════════════
   사전신청 확인 폼
   ══════════════════════════════════════════════════════════ */
.y26-rsv .rsv-lead { margin-bottom: 24px; }
.y26-rsv .rsv-form { padding: 30px 28px; }
.y26-rsv .fld + .fld { margin-top: 20px; }
.y26-rsv .fld > label {
  display: block; margin-bottom: 8px;
  font-family: "Noto Serif KR", serif; font-weight: 700; font-size: 15px; color: var(--y26-ink);
}
.y26-rsv input[type="text"], .y26-rsv input[type="tel"], .y26-rsv select {
  height: 46px; padding: 0 12px;
  font-family: inherit; font-size: 15px; color: var(--y26-ink);
  background: #fff; border: 1px solid var(--y26-rule); border-radius: 0;
}
.y26-rsv .fld > input[type="text"], .y26-rsv .fld > select { width: 100%; }
.y26-rsv .tel { display: flex; align-items: center; gap: 8px; }
.y26-rsv .tel select { flex: none; width: 92px; }
.y26-rsv .tel input { flex: 1 1 0; min-width: 0; }
.y26-rsv .btns { display: flex; gap: 12px; margin-top: 28px; }
.y26-rsv .btns .y26-btn { flex: 1 1 0; cursor: pointer; }

@media all and (max-width: 85.375rem) {
  .y26-fac-list .fac-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media all and (max-width: 63.9375rem) {
  .y26-loc .loc-map { height: 420px; }
  .y26-park .pk-map { height: 460px; }
  .y26-loc-bus .loc-cards { grid-template-columns: minmax(0, 1fr); }
  .y26-ev-list .ev-grid { grid-template-columns: minmax(0, 1fr); }
}
@media all and (max-width: 47.9375rem) {
  .y26-loc .loc-map { height: 340px; }
  .y26-park .pk-map { height: 360px; }
  .y26-park .y26-h { margin-top: 34px; }
  .y26-park .pk-list { grid-template-columns: minmax(0, 1fr); }
  .y26-fac-list .fac-grid { grid-template-columns: minmax(0, 1fr); gap: 14px; }
  .y26-fac-list .fac-card { padding: 20px 18px; }
  .y26-ev-list .ev-card .hd, .y26-ev-list .ev-card .bd { padding-left: 18px; padding-right: 18px; }
  .y26-rsv .rsv-form { padding: 24px 20px; }
  .y26-rsv .btns { flex-direction: column; }
}

/* ══════════════════════════════════════════════════════════
   게시글 상세 (parts/boardview-2026.php)
   ══════════════════════════════════════════════════════════ */
.y26-view .vw-hd { padding-bottom: 22px; border-bottom: 2px solid var(--y26-ink); }
.y26-view .vw-tit {
  font-size: clamp(22px, 2.6vw, 32px); font-weight: 900; line-height: 1.35; color: var(--y26-ink);
}
.y26-view .vw-meta {
  display: flex; flex-wrap: wrap; gap: 6px 22px; margin-top: 16px;
}
.y26-view .vw-meta > div { display: flex; align-items: baseline; gap: 7px; }
.y26-view .vw-meta dt {
  font-family: "Noto Serif KR", serif; font-weight: 700; font-size: 13px; color: var(--y26-brick);
}
.y26-view .vw-meta dd { margin: 0; font-size: 14px; color: var(--y26-ink-soft); }

.y26-view .vw-body {
  padding: 34px 0 40px;
  font-size: 16px; line-height: 1.9; color: var(--y26-ink-soft);
}
.y26-view .vw-body img { max-width: 100%; height: auto; }
.y26-view .vw-body p { margin-bottom: 1em; }
.y26-view .vw-body a { color: var(--y26-brick); text-decoration: underline; }
.y26-view .vw-body h1, .y26-view .vw-body h2, .y26-view .vw-body h3,
.y26-view .vw-body h4, .y26-view .vw-body strong, .y26-view .vw-body b { color: var(--y26-ink); }
.y26-view .vw-body table { width: 100%; border-collapse: collapse; }
.y26-view .vw-body td, .y26-view .vw-body th {
  padding: 10px 12px; border: 1px solid var(--y26-rule);
}

.y26-view .vw-files {
  padding: 18px 20px; background: rgba(203, 184, 142, .22); border: 1px solid var(--y26-rule);
}
.y26-view .vw-files .ttl { display: block; margin-bottom: 10px; font-size: 14.5px; font-weight: 700; color: var(--y26-ink); }
.y26-view .vw-files ul { list-style: none; margin: 0; padding: 0; }
.y26-view .vw-files li + li { margin-top: 6px; }
.y26-view .vw-files a { display: flex; gap: 10px; align-items: baseline; font-size: 14.5px; color: var(--y26-brick); }
.y26-view .vw-files a:hover, .y26-view .vw-files a:focus { text-decoration: underline; }
.y26-view .vw-files .sz { font-size: 12.5px; color: var(--y26-ink-soft); }

.y26-view .vw-nav { margin-top: 34px; border-top: 1px solid var(--y26-rule); }
.y26-view .vw-nav .row {
  display: flex; gap: 16px; align-items: baseline;
  padding: 15px 4px; border-bottom: 1px solid var(--y26-rule);
}
.y26-view .vw-nav .row b {
  flex: none; width: 56px;
  font-family: "Noto Serif KR", serif; font-weight: 700; font-size: 13.5px; color: var(--y26-brick);
}
.y26-view .vw-nav .row span {
  min-width: 0; font-size: 15px; color: var(--y26-ink-soft);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.y26-view .vw-nav .row:hover span, .y26-view .vw-nav .row:focus span { color: var(--y26-brick); }

.y26-view .vw-btns { display: flex; justify-content: center; gap: 10px; margin-top: 40px; }
.y26-view .vw-btns .y26-btn { min-width: 150px; }

/* ── 상세에서 자주 쓰는 블록 ── */
/* 사진 여러 장 */
.y26-view .vw-gallery {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px; list-style: none; margin: 30px 0 0; padding: 0;
}
.y26-view .vw-gallery > li { min-width: 0; }
.y26-view .vw-gallery img {
  display: block; width: 100%; height: auto;
  border: 1px solid var(--y26-rule);
}
.y26-view .vw-gallery.one { grid-template-columns: minmax(0, 1fr); }

/* 영상 (16:9) */
.y26-view .vw-embed {
  position: relative; margin-top: 30px; padding-top: 56.25%;
  background: var(--y26-night); border: 1px solid var(--y26-rule);
}
.y26-view .vw-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }

/* 정보 표(주소·연락처·일시 등) + 지도 */
.y26-view .vw-info { margin-top: 30px; }
.y26-view .vw-map {
  width: 100%; height: 420px; margin-top: 30px;
  border: 1px solid var(--y26-rule); background: var(--y26-paper-deep);
}
.y26-view .vw-link { margin-top: 18px; }

@media all and (max-width: 47.9375rem) {
  .y26-view .vw-meta { gap: 4px 16px; }
  .y26-view .vw-body { padding: 26px 0 30px; font-size: 15.5px; line-height: 1.85; }
  .y26-view .vw-nav .row { gap: 12px; padding: 13px 2px; }
  .y26-view .vw-nav .row b { width: 48px; font-size: 13px; }
  .y26-view .vw-nav .row span { font-size: 14.5px; }
  .y26-view .vw-btns { flex-direction: column; margin-top: 32px; }
  .y26-view .vw-btns .y26-btn { width: 100%; }
  .y26-view .vw-gallery { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .y26-view .vw-map { height: 300px; }
}
