/*
Theme Name: minisite (site006)
Description: site006 千葉県東葛飾 駅前喫煙所＆カフェ（site003 の minisite 1.0.23 を写して作った）
Version: 1.0.4
*/
/* 1.0.4 (2026-11-10): 流鉄流山線の写真（images/line-ryutetsu-line.jpg。本人が渡したもの）を入れた */
/* 1.0.3 (2026-11-10): GA4 の測定 ID（G-43Y9W8LKV1）を入れた */
/* 1.0.2 (2026-11-10): 八柱駅と新八柱駅を「八柱駅・新八柱駅」、新松戸駅と幸谷駅を「新松戸駅・幸谷駅」の1つにまとめた（どちらも複数の路線に出る）。姉妹サイトに site003（埼玉の喫煙所）を足し、見出しを「姉妹サイト」に */
/* 1.0.1 (2026-11-10): ロゴを本人が作った site006 のもの（横長 images/logo-header.png・logo.png、四角 logo2.png。元は logo/）に。使っていない logo3.png（site003 のもの）は外した */
/* 1.0.0 (2026-11-10): site003 の minisite 1.0.23 から作成（本人の指示「003 のデザインで、中身の構成は 005」）。エリアを東葛6市（市章は site005）、駅を6市の57駅、路線を8つに。姉妹サイトを site005 に。ロゴ・トップの写真・GA4 は仮（site003 のまま／空） */
/* 以下は site003 の変更履歴（参考） */
/* 1.0.0 (2026-10-31): base-theme-db から作成。最新ニュースと体験レポートを外し、エリアの下に駅、路線は駅の一覧、こだわりは種類（屋内・屋外・カフェ）に */
/* 1.0.1 (2026-10-31): ロゴを site003 のもの（images/logo-header.png・logo.png、四角の logo2.png）に差し替え */
/* 1.0.2 (2026-10-31): ボタンとバッジの色（--accent）を、オレンジからロゴの青紫 #4651bb に */
/* 1.0.3 (2026-10-31): NO IMAGE の画像（images/noimage.png・noimage2.png）を青紫 #4651bb で作り直した */
/* 1.0.4 (2026-10-31): 種類の3つの写真（images/type-*.jpg。本人が撮影）と、つくばエクスプレスの写真（site005 と同じ）を入れた */
/* 1.0.5 (2026-10-31): トップの写真（images/hero.jpg）を入れた */
/* 1.0.6 (2026-10-31): トップとサイドメニューに「同じエリアの姉妹サイト」（site002 への相互リンク） */
/* 1.0.7 (2026-10-31): 閉館の代わりに「撤去」（タグ closed）。一覧の下の「撤去された施設」にたたむ */
/* 1.0.8 (2026-11-01): GA4 の測定 ID（G-1929W428VM）を入れた */
/* 1.0.9 (2026-11-01): 駅のボタンは言葉の途中で折り返さない。越谷レイクタウン駅は「越谷｜レイクタウン駅」で折り返す */
/* 1.0.10 (2026-11-01): 施設ページの要点の4枠を「使える時間・駅からの場所・吸えるたばこ・喫煙スペース」に */
/* 1.0.11 (2026-11-01): 本文の表の見出しの幅を、パソコンもスマホも 38% に（施設ページの表の <colgroup> と同じ） */
/* 1.0.12 (2026-11-01): 路線のタグを、施設カードのバッジに出さない */
/* 1.0.13 (2026-11-01): パソコンのサイドメニューの路線のボタンを1列に（路線名が言葉の途中で折れないように） */
/* 1.0.14 (2026-11-01): カテゴリの説明文の <!--more--> より後ろを、一覧の下に出す（駅の路上喫煙のルールなど） */
/* 1.0.15 (2026-11-01): ロゴを新しいもの（images/logo-header.png・logo.png）に差し替え */
/* 1.0.16 (2026-11-01): 姉妹サイト（site002）のロゴを、site002 の新しいロゴに差し替え（images/sister-saitama-onsen.png） */
/* 1.0.17 (2026-11-05): 撤去した施設の種類は、表の「施設タイプ」を出す（全席禁煙になったカフェなど） */
/* 1.0.18 (2026-11-05): 撤去のタグの一覧（/tag/closed）では、撤去した施設をカードで並べる（site002 2.1.14 に合わせた） */
/* 1.0.19 (2026-11-05): 南越谷駅と新越谷駅を「南越谷駅・新越谷駅」の1つにまとめた（東武線・武蔵野線の両方に出る） */
/* 1.0.20 (2026-11-05): 種類の一覧と検索結果のカードに、駅名のバッジ（.tagrow .st）を出す */
/* 1.0.21 (2026-11-05): 施設ページの最後に、同じ駅のほかの施設を小さめのカードで並べる（.near、.mini-fac。撤去の記事には出さない） */
/* 1.0.22 (2026-11-06): 「撤去された施設」の右端の「撤去」を、スマホで折り返さない */
/* 1.0.23 (2026-11-07): AdSense の広告（ローカル1〜3、スマホだけの上の横長）を site002 と同じ形で入れた（docs/theme-db.md「広告」。.ad-box〜.ad-top） */

:root {
  --ai: #233a5c;        /* 暖簾の藍。見出しの文字・帯 */
  --ai-soft: #e9eef5;   /* 藍のうすい面 */
  --ink: #1f2933;       /* 本文 */
  --muted: #5c6773;     /* 補足 */
  --line: #dde3e9;      /* 罫線 */
  --bg: #f4f6f8;        /* 地 */
  --card: #ffffff;
  --accent: #4651bb;    /* ロゴの青紫（site003）。押せるものとバッジ */
  --accent-dark: #353f9a;
  --hinoki: #f3ead9;    /* ひのきの面 */
  --closed: #9aa3ab;
  --font-head: "Zen Maru Gothic", "Hiragino Maru Gothic ProN", sans-serif;
  --font-body: "Noto Sans JP", "Hiragino Sans", "Yu Gothic", sans-serif;
  --radius: 12px;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; background: #ffffff; } /* iPhone で画面の一番上（ロゴの上）や引っぱったときに見える色を、ヘッダーと同じ白に */
html, body { overflow-x: clip; } /* どの部品が広がっても、ページ全体が横に動かないように */
body { margin: 0; background: transparent; color: var(--ink); font-family: var(--font-body); font-size: 17px; line-height: 1.85; }
/* iPhone の Safari は、時計の帯の色を body の背景色から取る。body は透明にして（html の白が使われる）、
   ページの地の色（薄い灰青）は、画面に固定した背景の層で敷く（2026-10-31。本人の指示） */
body::before { content: ""; position: fixed; inset: 0; background: var(--bg); z-index: -1; pointer-events: none; }
a { color: var(--ai); }
img { max-width: 100%; height: auto; }
h1, h2, h3, h4 { font-family: var(--font-head); line-height: 1.4; }
/* 見出し・タイトルの改行: 行の長さをそろえる指定（balance）は、日本語だと言葉の途中で折り返すのでやめた。
   対応しているブラウザ（Chrome・Edge）では、文節で折り返す（auto-phrase）。ほかは通常の折り返し */
h1, h2, h3, h4, .news-list a { word-break: auto-phrase; line-break: strict; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
.screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }

/* ヘッダー */
.site-header, .site-header .inner { background: #ffffff; } /* ロゴの背景が白なので、ヘッダーは白で固定 */
.site-header { border-bottom: 1px solid var(--line); }
.site-header .inner { max-width: 1020px; margin: 0 auto; padding: 10px 16px; display: flex; align-items: center; gap: 24px; }
.site-header .logo { margin: 0; line-height: 0; }
.site-header .logo img { height: 80px; width: auto; display: block; } /* 画像は 560×160（2倍の大きさ）なので、くっきり出る */
.gnav { margin-left: auto; }
.gnav ul { list-style: none; margin: 0; padding: 0; display: flex; gap: 4px; flex-wrap: wrap; }
.gnav a { display: block; text-decoration: none; color: var(--ink); font-weight: 500; font-size: 15px; padding: 8px 14px; border-radius: 999px; line-height: 1.5; }
.gnav a:hover { background: var(--ai-soft); color: var(--ai); }

.wrap { max-width: 1020px; margin: 0 auto; padding: 0 16px; }

/* パンくず（All in One SEO と、最新ニュースまわりの自前のもの） */
.crumb { font-size: 13px; color: var(--muted); padding: 14px 0 0; }
.crumb a { color: var(--muted); }
.crumb .aioseo-breadcrumb-separator { margin: 0 2px; }

/* ヒーロー（トップ） */
.hero { position: relative; color: #fff; background: var(--ai) center/cover no-repeat; }
.hero::before { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(20,34,56,.88) 0%, rgba(20,34,56,.55) 55%, rgba(20,34,56,.15) 100%); }
.hero .inner { position: relative; max-width: 1020px; margin: 0 auto; padding: 80px 16px 72px; }
.hero .eyebrow { font-size: 13px; letter-spacing: .12em; opacity: .9; }
.hero h1 { font-size: clamp(26px, 4vw, 48px); margin: 6px 0 10px; }
.hero p { margin: 0 0 20px; max-width: 34em; opacity: .95; }
.search { display: flex; max-width: 600px; background: #fff; border-radius: 999px; padding: 4px; border: 1px solid var(--line); }
.search input[type="text"] { flex: 1; min-width: 0; border: 0; font: inherit; padding: 8px 16px; border-radius: 999px; color: var(--ink); background: transparent; }
.search button { border: 0; background: var(--accent); color: #fff; font: inherit; font-weight: 700; padding: 8px 20px; border-radius: 999px; cursor: pointer; }
.search button:hover { background: var(--accent-dark); }
.area-chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.area-chips a { color: #fff; text-decoration: none; border: 1px solid rgba(255,255,255,.6); border-radius: 999px; padding: 3px 14px; font-size: 14px; }
.area-chips a:hover { background: rgba(255,255,255,.15); }

/* セクション */
.section { margin: 56px 0; }
.sec-head { display: flex; align-items: baseline; gap: 12px; margin-bottom: 14px; }
.sec-head h2 { margin: 0; font-size: 28px; color: var(--ai); }
.sec-head .en { font-size: 12px; letter-spacing: .14em; color: var(--muted); text-transform: uppercase; }
.sec-head .more { margin-left: auto; font-size: 14px; font-weight: 500; text-decoration: none; white-space: nowrap; }
.more-bottom { display: none; text-align: right; margin: 10px 0 0; font-size: 14px; font-weight: 500; }
.more-bottom a { text-decoration: none; }
.panel { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); }
.empty { padding: 22px; color: var(--muted); text-align: center; background: var(--hinoki); border-radius: var(--radius); }

/* 最新ニュースの一覧（functions.php の minisite_news_list の HTML） */
.news-list { list-style: none; margin: 0; padding: 6px 20px; }
.news-list li { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 12px; padding: 12px 0; border-bottom: 1px dashed var(--line); line-height: 1.6; }
.news-list li:last-child { border-bottom: 0; }
.news-list time { color: var(--muted); font-size: 14px; font-variant-numeric: tabular-nums; }
.news-list .news-title { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 4px 10px; min-width: 0; }
.news-list a { color: var(--ink); text-decoration: none; font-weight: 500; }
.news-list a:hover { color: var(--ai); text-decoration: underline; }
/* 施設名のバッジがある一覧（トップ）は「日付：バッジ」で1行、タイトルは次の行に（2026-10-31。本人の指示） */
.news-list li:has(.news-fac) { column-gap: 6px; }
.news-list li:has(.news-fac) .news-title { display: contents; }
.news-list li:has(.news-fac) a { flex-basis: 100%; }
.news-fac { display: inline-block; background: var(--accent); color: #fff; font-size: 12px; font-weight: 700; line-height: 1.6; padding: 1px 10px; border-radius: 999px; white-space: nowrap; }
.news-more { text-align: right; font-size: 14px; margin: 4px 0 0; }

/* エリア */
.areas { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.area { display: flex; align-items: center; gap: 16px; padding: 18px 20px; text-decoration: none; color: var(--ink); transition: border-color .15s, transform .15s; }
.area:hover { border-color: var(--accent); transform: translateY(-2px); }
.area img { width: 64px; height: 64px; object-fit: contain; }
.area b { font-family: var(--font-head); font-size: 20px; display: block; line-height: 1.4; }
.area small { color: var(--muted); font-size: 13px; }

/* 路線 */
.lines { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.line { position: relative; overflow: hidden; border-radius: var(--radius); min-height: 160px; display: flex; align-items: flex-end; color: #fff; text-decoration: none; background: var(--ai) center/cover; }
.line::before { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(20,34,56,.85), rgba(20,34,56,.1)); }
.line span { position: relative; padding: 14px 18px; font-family: var(--font-head); font-size: 20px; font-weight: 700; line-height: 1.4; }
.line small { display: block; font-family: var(--font-body); font-size: 13px; font-weight: 400; opacity: .9; }

/* こだわり */
.kodawari { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.kd { display: grid; grid-template-columns: 88px 1fr; gap: 14px; align-items: center; padding: 12px; text-decoration: none; color: var(--ink); }
.kd:hover { border-color: var(--accent); }
.kd img { width: 88px; height: 88px; object-fit: cover; border-radius: 8px; }
.kd b { font-size: 16px; display: block; line-height: 1.5; }
.kd small { color: var(--muted); font-size: 12px; }
.cols .kodawari, .cols .areas { grid-template-columns: repeat(2, 1fr); }

/* 2カラム（一覧・記事） */
.cols { display: grid; grid-template-columns: minmax(0, 1fr) 300px; gap: 28px; align-items: start; margin: 18px 0 56px; }
.side { display: grid; grid-template-columns: minmax(0, 1fr); gap: 16px; min-width: 0; }
.side > * { min-width: 0; max-width: 100%; }
.side img, .side iframe, .side ins, .side table { max-width: 100% !important; }
.cols > main { min-width: 0; }
/* 本文の一番上の囲み（施設ページの写真、記事、一覧の見出し）は上に余白を付けない。パンくずとの間隔と、サイドメニューの上端をそろえるため */
.cols > main > :first-child { margin-top: 0; }
.cols > main > .page-head:first-child h1 { margin-top: 0; }
.side .panel { padding: 16px; }
.side h4 { margin: 0 0 10px; color: var(--ai); font-size: 16px; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; }
.chips a { text-decoration: none; font-size: 13px; color: var(--ai); background: var(--ai-soft); padding: 3px 10px; border-radius: 999px; line-height: 1.6; }
.chips a:hover { background: var(--accent); color: #fff; }
.side .chips { display: grid; grid-template-columns: repeat(2, 1fr); gap: 8px; }
.side .chips-kodawari { grid-template-columns: 1fr; }
.side .chips-line { grid-template-columns: 1fr; } /* 路線名が長いので、パソコンは1列（スマホは2列のまま） */
.side .chips a { display: flex; align-items: center; justify-content: center; text-align: center; font-size: 14px; font-weight: 500; padding: 9px 8px; border-radius: 10px; min-height: 42px; min-width: 0; line-height: 1.4; overflow-wrap: anywhere; }
.about { background: var(--hinoki); border: 0; font-size: 14px; line-height: 1.75; }
.about img { width: 64px; float: left; margin: 0 12px 4px 0; }
.about::after { content: ""; display: block; clear: both; }
/* となりのエリアの温泉マップ（相互リンク。site005 と同じ部品） */
.sisters { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 14px; }
.sister { display: flex; align-items: center; gap: 18px; padding: 16px 20px; text-decoration: none; color: var(--ink); transition: border-color .15s, transform .15s; }
.sister:hover { border-color: var(--accent); transform: translateY(-2px); }
.sister img { width: 210px; height: auto; flex: none; }
.sister span { font-size: 14px; line-height: 1.7; color: var(--muted); }
.sister-side { display: block; }
.sister-side + .sister-side { margin-top: 10px; }
.sister-side img { display: block; width: 100%; height: auto; }
.sister-side:hover img { opacity: .85; }
.side .search { max-width: none; }

/* 一覧ページ */
.page-head h1 { margin: 6px 0 6px; font-size: 32px; color: var(--ai); }
.page-head .lead, .page-head .lead p { margin: 0 0 16px; color: var(--muted); }
.page-head .count { display: inline-block; background: var(--ai); color: #fff; font-size: 13px; padding: 2px 12px; border-radius: 999px; margin-bottom: 8px; line-height: 1.6; }
.filter { display: flex; flex-wrap: wrap; gap: 6px; margin: 0 0 16px; }
.filter button { font: inherit; font-size: 13px; border: 1px solid var(--line); background: var(--card); color: var(--ink); padding: 4px 12px; border-radius: 999px; cursor: pointer; line-height: 1.6; }
.filter button[aria-pressed="true"] { background: var(--ai); border-color: var(--ai); color: #fff; }
.fac { display: grid; grid-template-columns: 220px minmax(0, 1fr); height: 220px; overflow: hidden; margin-bottom: 14px; text-decoration: none; color: var(--ink); transition: box-shadow .15s; }
.fac:hover { box-shadow: 0 6px 20px rgba(35,58,92,.12); }
.fac .ph { background: var(--ai-soft) center/cover no-repeat; }
.fac .bd { padding: 14px 18px; min-width: 0; display: flex; flex-direction: column; overflow: hidden; }
.fac h3 { margin: 0 0 4px; font-size: 21px; color: var(--ink); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.fac .type { font-size: 12px; color: var(--ai); font-weight: 700; letter-spacing: .04em; }
.fac p { margin: 6px 0 8px; font-size: 15px; color: var(--muted); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
/* 記事のカード（最新ニュースなど）は、こだわりのバッジの段がないので、その分だけ低くする（2026-10-31。本人の指示） */
.fac.post-card { height: 202px; }
/* 記事のタイトルは長めなので2行まで出す */
.fac.post-card h3 { white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
.fac .meta { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; font-size: 14px; color: var(--muted); border-top: 1px solid var(--line); padding-top: 6px; margin-top: 4px; }
.facts { display: flex; flex-wrap: nowrap; gap: 4px 16px; font-size: 13px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.facts span { overflow: hidden; text-overflow: ellipsis; }
.facts span::before { content: attr(data-k); color: var(--muted); margin-right: 6px; }
.tagrow { display: flex; flex-wrap: wrap; align-content: flex-start; gap: 4px; margin-top: auto; padding-top: 6px; height: 58px; overflow: hidden; } /* バッジ用に2行分を確保 */
.tagrow span { flex-shrink: 0; font-size: 12px; font-weight: 700; background: var(--ai); color: #fff; border-radius: 999px; padding: 1px 10px; line-height: 1.6; }
.tagrow span.st { background: var(--accent); } /* 駅名のバッジ（種類の一覧・検索結果） */
details.closed-list { margin-top: 24px; padding: 0 16px; }
details.closed-list summary { cursor: pointer; font-weight: 700; color: var(--muted); padding: 10px 0; }
.closed-item { display: flex; justify-content: space-between; gap: 12px; padding: 10px 0; border-top: 1px solid var(--line); font-size: 14px; color: var(--closed); text-decoration: none; }
.closed-item:hover { color: var(--ai); }
.closed-item span:last-child { flex-shrink: 0; white-space: nowrap; }
.ad-box { margin: 24px 0; min-height: 100px; text-align: center; }
.wrap > .ad-box { margin: 40px 0; }
.wrap > .ad-top-box { margin: 14px 0 0; height: 100px; line-height: 0; background: #d3dcea; border-radius: var(--radius); overflow: hidden; }
.ad-top { display: inline-block !important; width: 320px; height: 100px; }
@media (min-width: 800px) { .wrap > .ad-top-box { display: none; } }
.navi { margin: 20px 0; text-align: center; }

/* 施設ページ・記事 */
.fac-hero { overflow: hidden; }
.fac-hero > img { width: 100%; aspect-ratio: 16/9; object-fit: cover; display: block; }
.fac-hero .bd { padding: 18px 22px 22px; }
.fac-hero .type { font-size: 13px; color: var(--ai); font-weight: 700; }
.fac-hero h1 { margin: 4px 0 8px; font-size: 32px; color: var(--ai); }
.fac-hero .intro p { margin: 0 0 8px; }
/* 同じ駅のほかの施設（施設ページの最後。1.0.21） */
.near h3 { margin-top: 18px; }
.mini-facs { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
.mini-fac { display: grid; grid-template-columns: 84px minmax(0, 1fr); height: 84px; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; text-decoration: none; color: var(--ink); background: var(--card); transition: box-shadow .15s; }
.mini-fac:hover { box-shadow: 0 4px 14px rgba(35,58,92,.12); }
.mini-fac .ph { background: var(--ai-soft) center/cover no-repeat; }
.mini-fac .bd { padding: 7px 10px; min-width: 0; display: flex; flex-direction: column; justify-content: center; gap: 1px; line-height: 1.4; }
.mini-fac .type { font-size: 11px; font-weight: 700; color: var(--ai); }
.mini-fac b { font-size: 14px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.mini-fac .pl { font-size: 12px; color: var(--muted); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.near-more { margin: 12px 0 2px; text-align: right; font-size: 14px; }
.near-more a { color: var(--accent); font-weight: 700; text-decoration: none; }
@media (max-width: 560px) { .mini-facs { grid-template-columns: 1fr; } }
.quick { display: grid; grid-template-columns: repeat(2, 1fr); gap: 1px; background: var(--line); border-radius: 10px; overflow: hidden; margin-top: 14px; }
.quick div { background: var(--ai-soft); padding: 10px 12px; font-size: 14px; line-height: 1.6; }
.quick b { display: block; font-size: 12px; color: var(--muted); font-weight: 500; margin-bottom: 2px; }
.quick span { display: block; font-weight: 700; color: var(--ink); line-height: 1.6; font-variant-numeric: tabular-nums; word-break: auto-phrase; }
.quick .unknown { font-weight: 400; color: var(--muted); }
.article { padding: 6px 22px 22px; margin-top: 18px; overflow-wrap: anywhere; }
.article > h1 { font-size: 32px; color: var(--ai); margin: 14px 0 6px; }
.single_date { font-size: 13px; color: var(--muted); }
.article h2 { font-size: 23px; color: var(--ai); margin: 28px 0 12px; padding-left: 12px; border-left: 5px solid var(--accent); }
.article h3 { font-size: 18px; margin: 22px 0 8px; color: var(--ink); }
.article table { width: 100%; border-collapse: collapse; font-size: 16px; margin-bottom: 8px; }
.article th, .article td { border-bottom: 1px solid var(--line); padding: 10px 12px; text-align: left; vertical-align: top; }
.article th { background: var(--ai-soft); color: var(--ai); font-weight: 700; width: 38%; } /* 本文の表は <colgroup> で 38%・62%（../facility-format.md）。ないときも同じ幅に */
.article col { width: auto !important; }
.article iframe { max-width: 100%; border-radius: 10px; }
.article img { border-radius: 8px; }
.facility-news { background: var(--card); border: 1px solid var(--line); border-radius: var(--radius); padding: 2px 18px 12px; margin: 10px 0 20px; }
.facility-news h2 { margin-top: 14px; }
.facility-news .news-list { padding: 0; }
.news-facility-link { margin: 26px 0 6px; }
.news-facility-link a, .btn-wide { display: block; text-align: center; background: var(--accent); color: #fff; font-weight: 700; text-decoration: none; padding: 14px 16px; border-radius: 999px; line-height: 1.5; }
.news-facility-link a:hover, .btn-wide:hover { background: var(--accent-dark); color: #fff; }
.post-tags { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; } /* 関連キーワードは横いっぱいのボタン。パソコン4列、スマホ2列 */
.post-tags li { min-width: 0; }
.post-tags a { display: flex; align-items: center; justify-content: center; text-align: center; min-height: 44px; text-decoration: none; font-size: 13px; font-weight: 500; line-height: 1.4; color: var(--ai); background: var(--ai-soft); padding: 8px 4px; border-radius: 10px; word-break: auto-phrase; }
.post-tags a:hover { background: var(--accent); color: #fff; }
.prevnext { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 18px; font-size: 14px; }
.prevnext > div { padding: 12px 16px; }
.author { display: flex; gap: 16px; align-items: center; padding: 16px; margin-top: 18px; font-size: 14px; }
.author img { border-radius: 50%; flex-shrink: 0; }
.author b { display: block; font-family: var(--font-head); font-size: 16px; }

/* SNS のシェア（sns.php） */
#snsshare { margin-top: 18px; text-align: center; }
#snsshare .snstxt { font-size: 14px; color: var(--muted); margin-bottom: 8px; }
#snsshare ul { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(4, 1fr); gap: 8px; }
#snsshare a { display: block; color: #fff; text-decoration: none; font-weight: 700; font-size: 14px; padding: 10px 4px; border-radius: 10px; }
#snsshare .btn--twitter { background: #1f2933; }
#snsshare .btn--facebook { background: #3b5998; }
#snsshare .btn--pinterest { background: #bd081c; }
#snsshare .btn--line { background: #06c755; }
@media (max-width: 560px) { #snsshare ul { grid-template-columns: repeat(2, 1fr); } }

/* フッター */
.site-footer { background: var(--ai); color: #dfe6ef; font-size: 13px; padding: 28px 0; margin-top: 40px; }
.site-footer a { color: #fff; }
.site-footer ul { list-style: none; padding: 0; margin: 10px 0; display: flex; gap: 16px; flex-wrap: wrap; }
.site-footer p { margin: 8px 0; }

[hidden] { display: none !important; }

@media (max-width: 860px) {
  .cols { grid-template-columns: minmax(0, 1fr); }
  .areas, .kodawari { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  body { font-size: 15px; }
  .site-header .inner { flex-wrap: wrap; gap: 6px; }
  /* タイトルロゴは、左右の余白なしで画面の横いっぱいに（いまのサイトと同じ） */
  .site-header .logo { display: block; width: calc(100% + 32px); margin: -10px -16px 0; }
  .site-header .logo img { width: 100%; height: auto; }
  /* メニューはスライドさせず、3列2行のボタンで全部見せる */
  .gnav { margin: 8px 0 6px; width: 100%; }
  .gnav ul { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px 6px; }
  .gnav a { text-align: center; background: var(--ai-soft); color: var(--ai); border-radius: 10px; padding: 8px 2px; font-size: 13px; font-weight: 700; white-space: nowrap; }
  .hero .inner { padding: 36px 16px 32px; }
  .sec-head h2 { font-size: 21px; flex: 1 1 100%; }
  .sec-head .en, .sec-head .more { display: none; }
  .sister { flex-direction: column; align-items: flex-start; gap: 10px; padding: 14px; }
  .sister img { width: 100%; } /* スマホでは相互リンクのロゴを横いっぱいに（site005 とそろえた） */
  .more-bottom { display: block; }
  .areas { grid-template-columns: repeat(2, 1fr); }
  .area { padding: 10px; gap: 8px; }
  .area img { width: 40px; height: 40px; }
  .area b { font-size: 17px; }
  .lines, .kodawari, .cols .kodawari { grid-template-columns: 1fr; }
  .fac { grid-template-columns: 1fr; grid-template-rows: 190px 226px; height: auto; }
  /* スマホでは地とカードの境目が見えにくいので、囲みの線を濃く、影も少し付ける */
  .panel { border-color: #c3ccd5; }
  .fac { box-shadow: 0 1px 3px rgba(35,58,92,.10); }
  .fac h3 { white-space: normal; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; font-size: 19px; }
  .fac.post-card { grid-template-rows: 190px 196px; height: auto; }
  .fac.post-card h3 { -webkit-line-clamp: 2; }
  .page-head h1, .fac-hero h1, .article > h1 { font-size: 24px; }
  .article { padding: 4px 16px 18px; }
  .fac-hero .bd { padding: 14px 16px 18px; }
  .article table { font-size: 15px; }
  .prevnext { grid-template-columns: 1fr; }
  .post-tags { grid-template-columns: repeat(2, 1fr); }
  .post-tags a { font-size: 14px; }
  /* 要点はスマホでは1列にし、見出しを左・中身を右に並べる（1行が途中で折り返さないように） */
  .quick { grid-template-columns: 1fr; }
  .quick div { display: grid; grid-template-columns: 6.5em minmax(0, 1fr); gap: 8px; align-items: baseline; }
  .quick b { margin: 0; }
  /* サイドメニューのボタンは、2列・3列で横いっぱいに並べ、押しやすい大きさに */
  .side .chips-area { grid-template-columns: repeat(3, 1fr); }
  .side .chips-kodawari { grid-template-columns: repeat(2, 1fr); }
  .side .chips-line { grid-template-columns: repeat(2, 1fr); }
  .side .chips a { padding: 10px 6px; min-height: 44px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; } }

/* site003: 駅のボタン（エリアの一覧、エリア・路線で探すのページ） */
.stations { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 8px; margin: 10px 0 18px; }
.stations > a, .stations > span { display: flex; align-items: center; justify-content: space-between; gap: 6px; padding: 10px 12px; border-radius: 10px; background: var(--ai-soft); color: var(--ai); font-weight: 700; font-size: 15px; text-decoration: none; line-height: 1.4; }
.stations a:hover { background: var(--accent); color: #fff; }
.stations > span { opacity: .55; }
.stations small { font-weight: 400; font-size: 12px; }
.stations .st-name { word-break: keep-all; overflow-wrap: anywhere; } /* 折り返すのは <wbr> の位置だけ（越谷｜レイクタウン駅） */
.list-sub { font-size: 18px; margin: 4px 0 0; }
.areas-page { grid-template-columns: 1fr; }
.cols .areas-page { grid-template-columns: 1fr; }
.area-block .stations { margin-bottom: 8px; }
.line-block { margin-bottom: 24px; scroll-margin-top: 16px; }
.line-block .line { min-height: 110px; }
@media (max-width: 760px) {
  .stations { grid-template-columns: repeat(2, 1fr); }
}
.term-after { margin-top: 24px; }
.term-after img { max-width: 100%; height: auto; display: block; margin: 8px 0 4px; border-radius: 8px; }