@charset "utf-8";
/* 교육청 상세(/school-district/{슬러그}) 모바일 전용 재배치 — 사이클 11 (mobile 프로젝트)
   확정 목업 「나안」: 짧은 상단(이름·인구·소개 3줄·날씨) · 통계(윗줄 2칸 + 수입 중위값 아래 전폭) · 정보 카드 · 고정 탭 ·
   5개 섹션을 접지 않고 압축(특징 한 줄 목록 · 학교 행 격자 + 처음 6곳 · 학비 항목/금액 줄 · 거주 시설 3칸 타일 · 갤러리 가로 넘김 · 빠른 링크 2×2).
   폭 767px 이하에서만 적용 — PC·태블릿(768px~)은 style.css 그대로. 마크업·링크·데이터·기존 스크립트 무변경.
   app.js 가 인라인 display 로 숨기는 요소(#gallery · #gallery-nav · #div_landing · #div_guardian · #managed-programs · #managed-nav ·
   #programs · #living-cost-section 등)는 display 를 건드리는 규칙을 쓰지 않아 숨은 채로 남는다.
   영상 소개 블록(ige-video-intro*)과 날씨 위젯 안쪽 클래스는 이 파일에서 쓰지 않는다(날씨는 바깥 카드 간격·글자 크기만 압축).
   접힘·더보기 동작은 index.php 의 <script id="mc-detail"> 이 클래스(mc-over · mc-intro-clamp · mc-intro-open)만 붙인다. */

/* 새 단추 2종은 PC·태블릿에서 화면 높이 0 (스크립트가 못 돌아도 안 보임) */
.mc-more, .mc-intro-more { display: none; }

@media (max-width: 767px) {

  :root {
    --mdd-teal: #0b4f54; --mdd-teal2: #0e6a70; --mdd-ink: #13232b; --mdd-sub: #5d6c73; --mdd-line: #e3e9ea;
    --mdd-bg: #f4f8f7; --mdd-mint: #e4f1f0; --mdd-yel: #ffd24a;
  }

  /* 사이트 공통 CSS 가 body 에 overflow-x:hidden 을 줘서 body 가 스크롤 상자가 되고, 그 안의 .nav-bar(position:sticky)가 끝내 붙지 못한다.
     이 화면에서만 clip(잘라 내되 스크롤 상자는 만들지 않음)으로 바꿔 탭 막대가 위에 붙게 한다. clip 을 모르는 브라우저는 지금 그대로다. */
  html body { overflow: clip; }

  /* ── A. 짧은 상단: 지역(작은 글씨) · 이름 · 인구 · 소개 3줄 · 더보기 · 날씨 ── */
  .hero-masthead .hero-fade { display: none; }
  .hero-masthead .hero-inner {
    box-sizing: border-box; display: flex; flex-direction: column; align-items: stretch; max-width: none; padding: 14px 16px 13px;
  }
  .hero-masthead .hero-meta-row { display: contents; }
  .hero-masthead .hero-meta-row .meta-badge {
    display: block; padding: 0; gap: 0; background: none; border: 0; border-radius: 0; backdrop-filter: none; -webkit-backdrop-filter: none;
    font-size: 12.5px; font-weight: 500; color: #d6e8e6; transform: none; box-shadow: none; white-space: normal;
  }
  .hero-masthead .hero-meta-row .meta-badge:hover { background: none; transform: none; box-shadow: none; }
  .hero-masthead .hero-meta-row .meta-badge:first-child {
    order: 1; font-size: 11.5px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: #a9c4e8;
  }
  .hero-masthead .hero-meta-row .meta-badge:first-child .icon { display: none; }
  .hero-masthead .hero-title-group { order: 2; margin: 3px 0 4px; }
  .hero-masthead .hero-title-main {
    margin: 0; font-family: var(--font-body); font-size: 26px; line-height: 1.2; font-weight: 800; letter-spacing: -.02em;
  }
  .hero-masthead .hero-meta-row .meta-badge:last-child { order: 3; margin-bottom: 6px; }
  .hero-masthead .hero-meta-row .meta-badge:last-child .icon { font-size: 12.5px; margin-right: 4px; }
  .hero-masthead .hero-description {
    order: 4; max-width: none; margin: 0; font-size: 12px; line-height: 1.55; color: #d6e8e6;
  }
  /* 3줄 제한은 스크립트가 mc-intro-clamp 를 붙였을 때만 — 스크립트가 없으면 소개가 전부 보인다(실패 상황 SC14d) */
  .hero-masthead .hero-description.mc-intro-clamp { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 3; overflow: hidden; }
  .hero-masthead .hero-description.mc-intro-clamp.mc-intro-open { display: block; -webkit-line-clamp: unset; overflow: visible; }
  .hero-masthead .mc-intro-more:not([hidden]) {
    order: 5; display: inline-block; align-self: flex-start; margin: 3px 0 0; padding: 3px 0; background: none; border: 0;
    font-size: 12px; font-weight: 800; color: var(--mdd-yel); cursor: pointer;
  }
  .hero-masthead #district-weather-widget { order: 6; }
  .hero-masthead .weather-card { margin: 8px 0 0; max-width: none; padding: 8px 11px; border-radius: 12px; }
  .hero-masthead .weather-card:hover { transform: none; box-shadow: none; }
  .hero-masthead .wc-top { gap: 8px; }
  .hero-masthead .wc-icon { width: 28px; height: 28px; border-radius: 9px; }
  .hero-masthead .wc-icon svg { width: 20px; height: 20px; }
  .hero-masthead .wc-temp { font-size: 19px; }
  .hero-masthead .wc-condition, .hero-masthead .wc-time { font-size: 11.5px; }
  .hero-masthead .wc-time { margin-left: auto; }
  .hero-masthead .wc-bottom { margin-top: 6px; padding-top: 6px; gap: 6px; }
  .hero-masthead .aq-mini { font-size: 11.5px; }
  .hero-masthead .aq-ratio-badge { padding: 1px 8px; font-size: 11.5px; }

  /* ── 통계: 영어 모국어 · 고졸이상은 윗줄 2칸, 수입 중위값은 아래 전폭 (DOM 순서 불변 — 격자 배치로만) ── */
  .stats-deck { margin-top: 0; padding: 10px 14px 0; }
  .stats-deck .stats-row { grid-template-columns: 1fr 1fr; gap: 8px; }
  .stats-deck .stat-card {
    padding: 9px 12px; border-radius: 14px; border: 1px solid var(--mdd-line); box-shadow: none; transform: none;
  }
  .stats-deck .stat-card:hover { transform: none; box-shadow: none; }
  .stats-deck .stats-row > .stat-card:nth-child(1) { grid-column: 1; grid-row: 1; }
  .stats-deck .stats-row > .stat-card:nth-child(3) { grid-column: 2; grid-row: 1; }
  .stats-deck .stats-row > .stat-card:nth-child(2) {
    grid-column: 1 / -1; grid-row: 2; display: flex; justify-content: space-between; align-items: center; gap: 8px;
  }
  .stats-deck .stat-label { margin: 0; font-size: 11px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--mdd-sub); }
  .stats-deck .stat-value { margin-top: 1px; font-size: 21px; font-weight: 800; color: var(--mdd-teal); }
  .stats-deck .stats-row > .stat-card:nth-child(2) .stat-value { margin: 0; flex: 0 0 auto; }

  /* ── 정보 카드 · 고정 탭 ── */
  .info-strip { margin: 8px 14px 0; padding: 0; background: none; border: 0; }
  .info-strip .info-strip-inner {
    box-sizing: border-box; gap: 0; padding: 9px 12px; font-size: 12px; line-height: 1.7; color: #33444b;
    background: #fff; border: 1px solid var(--mdd-line); border-radius: 14px;
  }
  .info-strip .info-strip-inner strong { color: var(--mdd-ink); font-weight: 700; }
  .info-strip .info-strip-inner .link-arrow { display: inline-block; margin-top: 2px; color: var(--mdd-teal2); font-weight: 800; }

  .nav-bar { margin-top: 10px; background: var(--mdd-bg); border-bottom: 1px solid var(--mdd-line); backdrop-filter: none; -webkit-backdrop-filter: none; }
  .nav-bar .nav-inner { padding: 0 14px; }
  .nav-bar .nav-links { flex-wrap: nowrap; gap: 4px; padding: 8px 0; }
  .nav-bar .nav-item {
    flex: 0 0 auto; min-height: 36px; padding: 8px 12px; border-radius: 999px; font-size: 13px; font-weight: 700; color: var(--mdd-sub);
  }
  .nav-bar .nav-item.active { color: #fff; background: var(--mdd-teal); }

  /* ── 본문 카드: 섹션마다 한 장, 머리글은 작게 ── */
  .page-body { padding: 0 0 24px; gap: 0; }
  .content-flow { gap: 0; }
  .content-flow > .content-card {
    box-sizing: border-box; margin: 16px 14px 0; padding: 12px; border-radius: 16px; background: #fff; border: 1px solid var(--mdd-line); box-shadow: none;
  }
  /* 탭을 누르면 해당 섹션 윗선이 고정 탭 막대 바로 아래에 오도록(기존 앵커 이동은 막대 밑에 가려졌다) */
  .content-flow > .content-card { scroll-margin-top: 112px; }
  .content-card .card-header {
    flex-direction: row; flex-wrap: wrap; align-items: center; gap: 0 8px; margin: 0 0 10px; padding: 0 0 8px; border-bottom: 1px solid var(--mdd-line);
  }
  .content-card .card-header::before { height: 18px; }
  .content-card .card-header h2 { flex: 1 1 0; width: auto; min-width: 0; margin: 0; font-size: 16px; font-weight: 800; }
  #fees .card-header .fee-term-label { flex: 1 0 100%; margin: 4px 0 0; }

  /* ── B. 소개: 홈스테이 · 정착/가디언 2칸 · 특징 한 줄 목록 ── */
  #homestay_yn { margin-bottom: 0; padding: 9px 11px; border-radius: 10px; font-size: 12px; line-height: 1.55; }
  #homestay_yn .homestay-yn { margin-bottom: 4px !important; font-size: 12px; }
  #homestay_yn .homestay-comment { margin-top: 3px; font-size: 12px; }
  .service-duo { grid-template-columns: 1fr 1fr; gap: 8px; margin: 8px 0 0; }
  .service-duo .service-tile { padding: 8px 6px; border-radius: 12px; }
  .service-duo .service-tile .label { margin: 0; font-size: 11px; font-weight: 800; }
  .service-duo .service-tile .value { font-size: 20px; letter-spacing: .02em; }
  .feature-section { margin-top: 12px; }
  .feature-section h3 { margin: 0 0 6px; font-size: 13.5px; font-weight: 800; color: var(--mdd-teal); }
  .feature-section .feature-grid { display: block; }
  .feature-grid .feature-card {
    align-items: center; gap: 8px; min-height: 36px; padding: 7px 0; background: none; border: 0; border-bottom: 1px solid var(--mdd-line); border-radius: 0; transform: none; box-shadow: none;
  }
  .feature-grid .feature-card:last-child { border-bottom: 0; }
  .feature-grid .feature-card .feature-icon {
    width: 20px; height: 20px; min-width: 20px; margin-top: 1px; border-radius: 6px; background: var(--mdd-teal2); box-shadow: none; font-size: 12px;
  }
  .feature-grid .feature-card .feature-text { font-size: 12.5px; line-height: 1.5; font-weight: 500; }

  /* ── 소속 학교: 안내 한 줄 · 구분 알약 · 검색 40px · 학교 행 격자 ── */
  #schools .card-header .rank-hint {
    flex: 1 0 100%; flex-direction: row; flex-wrap: wrap; align-items: center; gap: 4px 8px; margin: 2px 0 0;
  }
  #schools .card-header .rank-hint-text { font-size: 11.5px; line-height: 1.5; }
  #schools .card-header .rank-hint-btn { padding: 4px 11px; border-radius: 999px; background: var(--mdd-teal2); font-size: 11.5px; font-weight: 800; }
  #schools .card-header .rank-hint-link { font-size: 11.5px; }
  .school-toggle { gap: 0; margin: 10px 0 0; padding: 3px; background: #e6eeed; border-radius: 999px; }
  .school-toggle .toggle-btn { height: 36px; padding: 0; border-radius: 999px; font-size: 12.5px; font-weight: 700; color: var(--mdd-sub); }
  .school-toggle .toggle-btn.active { color: var(--mdd-teal); background: #fff; box-shadow: 0 1px 4px rgba(11, 79, 84, .18); }
  .school-search { margin: 8px 0 0; }
  .school-search .search-input {
    box-sizing: border-box; height: 40px; padding: 0 12px 0 38px; font-size: 13px; color: var(--mdd-ink);
    border: 1px solid var(--mdd-line); border-radius: 12px; background-size: 17px; background-position: 12px center; box-shadow: none;
  }
  .school-table { margin-top: 8px; border: 1px solid var(--mdd-line); border-radius: 14px; background: #fff; }

  .school-table .school-list-item {
    position: relative; display: flex; flex-wrap: wrap; align-items: center; gap: 2px 10px; padding: 8px 88px 8px 12px; border-bottom: 1px solid var(--mdd-line); transform: none; cursor: default;
  }
  .school-table .school-list-item::after { content: ""; order: 8; flex: 0 0 100%; height: 0; }
  .school-table .school-list-item:hover { background: none; transform: none; }
  .school-table li:last-child > .school-list-item { border-bottom: 0; }
  .school-table .school-list-item .school-list-name {
    order: 1; flex: 1 1 100%; min-width: 0; margin: 0; padding: 0; border: 0; font-size: 14px; font-weight: 800; line-height: 1.3;
    overflow-wrap: anywhere;
  }
  .school-table .school-list-item .school-list-name a { color: var(--mdd-ink) !important; }
  .school-table .school-list-item .school-list-favorite {
    order: 2; position: absolute; top: 50%; right: 44px; width: 36px; height: 36px; margin: -18px 0 0; display: flex; align-items: center; justify-content: center; font-size: 19px; color: #aab8bc;
  }
  .school-table .school-list-item .school-list-favorite.active { color: #f59e0b; }
  .school-table .school-list-item .school-list-detail { order: 3; position: absolute; top: 50%; right: 6px; width: 36px; height: 36px; margin: -18px 0 0; display: flex; align-items: center; justify-content: center; }
  .school-table .school-list-item .school-list-detail .detail-btn {
    width: 30px; height: 30px; margin: 0; border-color: var(--mdd-line); font-size: 17px; font-weight: 800; color: var(--mdd-teal2); text-decoration: none;
  }
  .school-table .school-list-item .school-list-rank,
  .school-table .school-list-item .school-list-type,
  .school-table .school-list-item .school-list-academic,
  .school-table .school-list-item .school-list-vac,
  .school-table .school-list-item .school-list-ige,
  .school-table .school-list-item .school-list-acad {
    display: block; flex: 0 0 auto; margin: 0; padding: 0; background: none; border-radius: 0; font-size: 11.5px; font-weight: 500; line-height: 1.4; color: var(--mdd-sub);
  }
  .school-table .school-list-item .school-list-rank { order: 4; }
  .school-table .school-list-item .school-list-type { order: 5; }
  .school-table .school-list-item .school-list-academic { order: 6; }
  .school-table .school-list-item .school-list-vac { order: 7; display: flex; flex-direction: row; flex-wrap: wrap; gap: 2px 4px; max-width: 100%; }
  .school-table .school-list-item .school-list-ige { order: 9; font-size: 11px; color: #8b99a0; }
  .school-table .school-list-item .school-list-acad { order: 10; font-size: 11px; color: #8b99a0; }
  .school-table .school-list-item .school-list-rank::before { content: "전교생 "; margin: 0; font-size: 11.5px; }
  .school-table .school-list-item .school-list-type::before { content: none; }
  .school-table .school-list-item .school-list-academic::before { content: "ESL "; margin: 0; font-size: 11.5px; }
  .school-table .school-list-item .school-list-ige::before { content: "IGE 랭킹 "; margin: 0; font-size: 11px; }
  .school-table .school-list-item .school-list-acad::before { content: "학업랭킹 "; margin: 0; font-size: 11px; }
  .school-table .school-list-item .rank-lock { padding: 0 5px; border-radius: 8px; font-size: 10px; line-height: 1.5; }

  .school-table li.mc-over { display: none !important; }
  .school-table li.load-more-item { margin: 0; padding: 8px; border-top: 1px solid var(--mdd-line); background: none; }
  .school-table li.load-more-item .btn-load-more {
    box-sizing: border-box; display: flex; flex-direction: row; justify-content: center; width: 100%; min-height: 44px; padding: 0 12px;
    border: 1px solid var(--mdd-line); border-radius: 12px; background: #fff; transform: none; box-shadow: none; gap: 8px;
  }
  .school-table li.load-more-item .btn-load-more:hover { background: #fff; transform: none; box-shadow: none; }
  .school-table li.load-more-item .btn-load-more-text, .school-table li.load-more-item .btn-load-more:hover .btn-load-more-text { font-size: 13px; font-weight: 800; color: var(--mdd-teal2); }
  .school-table li.load-more-item .btn-load-more-remaining, .school-table li.load-more-item .btn-load-more:hover .btn-load-more-remaining { font-size: 11.5px; color: var(--mdd-sub); }
  .school-table .mc-more:not([hidden]) {
    box-sizing: border-box; display: block; width: calc(100% - 16px); min-height: 44px; margin: 8px; padding: 0 12px; background: #fff;
    border: 1px solid var(--mdd-line); border-radius: 12px; font-size: 13px; font-weight: 800; color: var(--mdd-teal2); cursor: pointer;
  }

  /* 사립 카드: 한 줄 행 */
  .pri-section .pri-head { gap: 8px; margin: 14px 0 4px; padding-top: 12px; border-top-width: 1px; }
  .pri-section .pri-head .ic { width: 26px; height: 26px; font-size: 13px; }
  .pri-section .pri-head .tt { font-family: var(--font-body); font-size: 13px; font-weight: 800; }
  .pri-section .pri-head .cnt { font-size: 11px; padding: 2px 8px; }
  .pri-section .pri-head .always { display: none; }
  .pri-section .pri-note { margin: 4px 0 8px; font-size: 11px; }
  .pri-section .pgrid { grid-template-columns: 1fr; gap: 8px; }
  .pri-section .pcard {
    display: grid; grid-template-columns: 1fr auto; column-gap: 8px; align-items: center; padding: 9px 10px; border-radius: 12px; transform: none;
  }
  .pri-section .pcard::before { height: 3px; }
  .pri-section .pcard:hover { transform: none; box-shadow: none; }
  .pri-section .pcard .top { gap: 9px; }
  .pri-section .pcard .crest { width: 32px; height: 32px; border-radius: 50%; font-size: 11.5px; }
  .pri-section .pcard .nm a { font-size: 14px; line-height: 1.3; }
  .pri-section .pcard .stats { grid-column: 1; margin: 4px 0 0 41px; padding: 0; border: 0; gap: 10px; }
  .pri-section .pcard .stats .s { display: inline-flex; gap: 4px; align-items: baseline; }
  .pri-section .pcard .stats .k { display: inline; font-size: 11px; }
  .pri-section .pcard .stats .v { font-size: 12px; }
  .pri-section .pcard .cta { grid-column: 2; grid-row: 1 / span 2; flex-direction: column; align-items: flex-end; gap: 2px; }
  .pri-section .pcard .cta a { font-size: 12px; }

  /* ── C. 학비: 항목 왼쪽 · 금액 오른쪽 · 원화 아래 작게 ── */
  #fees > p { margin: 0 0 6px !important; font-size: 11px !important; line-height: 1.5; }
  .content-card .fee-wrap { margin-top: 0; }
  .content-card .fee-wrap .fee-inner { overflow: visible; }
  .content-card .fee-wrap .fee-inner .fee-table { display: block; width: 100%; min-width: 0; }
  .content-card .fee-wrap .fee-inner .fee-table thead { display: none; }
  .content-card .fee-wrap .fee-inner .fee-table tbody { display: block; }
  .content-card .fee-wrap .fee-inner .fee-table tr:hover td { background: none; }
  .content-card .fee-wrap .fee-inner .fee-table td { padding: 0; border: 0; font-size: 12.5px; line-height: 1.4; }
  .content-card .fee-wrap .fee-inner .fee-table tr.type-header { display: block; margin-top: 12px; }
  .content-card .fee-wrap .fee-inner .fee-table tr.type-header:first-child { margin-top: 0; }
  .content-card .fee-wrap .fee-inner .fee-table tr.type-header td { display: block; padding: 0 0 2px; font-size: 11px; letter-spacing: .1em; color: var(--mdd-teal2); }
  .content-card .fee-wrap .fee-inner .fee-table tr:not(.type-header) {
    display: grid; grid-template-columns: 1fr auto; grid-template-areas: "item amt" "item krw"; column-gap: 10px; padding: 8px 0; border-bottom: 1px dashed var(--mdd-line);
  }
  .content-card .fee-wrap .fee-inner .fee-table tr:not(.type-header) > td:nth-child(1):not(.empty) { display: none; }
  .content-card .fee-wrap .fee-inner .fee-table tr:not(.type-header) > td:nth-child(2) { grid-area: item; }
  .content-card .fee-wrap .fee-inner .fee-table tr:not(.type-header) > td:nth-child(3) { grid-area: amt; text-align: right; font-size: 14px; font-weight: 800; }
  .content-card .fee-wrap .fee-inner .fee-table tr:not(.type-header) > td:nth-child(4) { grid-area: krw; text-align: right; font-size: 11px; color: var(--mdd-sub); }
  .content-card .fee-wrap .fee-inner .fee-table tr:not(.type-header) > td:nth-child(5) { display: none; }
  .content-card .fee-wrap .fee-inner .fee-table tr > td.empty { grid-area: auto; grid-column: 1 / -1; display: block; padding: 12px 0; text-align: center; }
  #reference-notes { margin-top: 10px; padding: 8px 10px; font-size: 11px; line-height: 1.6; }
  #reference-notes ul { margin-top: 3px; font-size: 11px; line-height: 1.6; }

  /* ── 거주 환경: 3칸 타일 · 병원/약국 2×2 ── */
  .content-card .livability-grid { grid-template-columns: repeat(3, 1fr); gap: 8px; margin-top: 0; }
  .livability-grid .facility-card {
    padding: 10px 4px 9px; border-radius: 14px; background: #fff; border: 1px solid var(--mdd-line); box-shadow: none; transform: none; min-width: 0;
  }
  .livability-grid .facility-card:hover { transform: none; box-shadow: none; }
  .livability-grid .facility-card .facility-icon { width: 36px; height: 36px; margin: 0 auto 4px; font-size: 18px; box-shadow: none; }
  .livability-grid .facility-card .facility-name { margin: 0; font-size: 11.5px; font-weight: 700; word-break: keep-all; }
  .livability-grid .facility-card .facility-count { margin: 1px 0 0; font-size: 15px; font-weight: 800; color: var(--mdd-teal); }
  .livability-grid .facility-card .facility-link { display: inline-block; margin-top: 2px; font-size: 10.5px; font-weight: 700; color: var(--mdd-teal2); }
  .livability-grid .facility-card .facility-link-locked { display: block; margin-top: 2px; font-size: 9.5px; line-height: 1.3; word-break: keep-all; }
  .health-grid { grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 8px; }
  .health-grid .health-card { border: 1px solid var(--mdd-line); border-radius: 14px; box-shadow: none; transform: none; }
  .health-grid .health-card:hover { transform: none; box-shadow: none; }
  .health-grid .health-head { padding: 9px 11px; font-size: 13px; font-weight: 800; }
  .health-grid .health-head .med-cnt { width: auto; min-width: 24px; height: 22px; padding: 0 8px; border-radius: 999px; font-size: 11.5px; }
  .health-grid .health-body { padding: 6px 11px 9px; font-size: 11px; line-height: 1.45; }
  .health-grid .health-body p { margin: 0 0 4px; }
  .health-grid .health-link { font-size: 11.5px; font-weight: 800; color: var(--mdd-teal2); }

  /* ── 갤러리: 한 줄 가로 넘김 (묶음 상자는 풀어 사진이 한 줄에 놓임, 본문 가로 스크롤 0) ── */
  #gallery-container.image-gallery {
    flex-direction: row; gap: 8px; overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; -webkit-overflow-scrolling: touch;
  }
  #gallery-container.image-gallery::-webkit-scrollbar { display: none; }
  #gallery-container.image-gallery .img-bento,
  #gallery-container.image-gallery .img-bento-set,
  #gallery-container.image-gallery .img-bento.list-type { display: contents; }
  #gallery-container .img-bento-box {
    flex: 0 0 auto; width: 200px; height: 140px; min-height: 0 !important; border-radius: 12px; scroll-snap-align: start; transform: none;
  }
  #gallery-container .img-bento-box:hover { transform: none; box-shadow: none; }
  #gallery-container .img-bento-desc { padding: 8px 10px; }
  #gallery-container .img-bento-desc h3 { font-size: 12px; }
  #gallery-container .img-bento-desc p { max-height: 30px; font-size: 11px; line-height: 15px; }
  #gallery-container .img-type-mov:before { width: 56px; height: 38px; }

  /* ── 빠른 링크 2×2 · 파트너 박스는 본문 맨 아래(글자·링크 불변) ── */
  .page-body .sidebar { gap: 8px; margin: 16px 14px 0; }
  .page-body .sidebar .sidebar-box {
    box-sizing: border-box; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; padding: 12px; border-radius: 16px; border: 1px solid var(--mdd-line); box-shadow: none;
  }
  .page-body .sidebar .sidebar-box h3 { grid-column: 1 / -1; margin: 0; font-family: var(--font-body); font-size: 16px; font-weight: 800; }
  .page-body .sidebar .sidebar-box .sidebar-link {
    box-sizing: border-box; justify-content: space-between; min-height: 48px; margin: 0; padding: 12px 11px; border: 1px solid var(--mdd-line); border-radius: 14px;
    background: #fff; font-size: 12.5px; font-weight: 800; line-height: 1.35; transform: none;
  }
  .page-body .sidebar .sidebar-box .sidebar-link:hover { transform: none; }
}