/* ==========================================================================
   やなぎまち商店街 公式サイト - style.css
   将来的にWordPressテーマ化する前提の静的プロトタイプ。
   セクションごとに [WP: ...] コメントで、後々の切り出し先を示しています。
   ========================================================================== */

:root{
  /* --- カラーパレット（配色案参照） --- */
  --kinari:#FFFFFF;       /* 生成り→白に変更（ページ背景） */
  --kinari-2:#F4F4F2;     /* セクション区切り用の淡いグレー */
  --ai:#2E6DA4;           /* 藍色→明るい青に変更 */
  --ai-2:#1F4E78;
  --hi:#C63D2C;           /* 緋色 */
  --hi-dark:#9C2E20;
  --ao:#2C5F72;           /* 浅葱（御金魚帖あを版） */
  --yamabuki:#D9A441;     /* 山吹色 */
  --sumi:#2B2924;         /* 墨（本文） */
  --sumi-soft:#5B564C;
  --hakuji:#FCFBF6;       /* 白磁（カード背景） */
  --line:#E0E0E0;

  /* --- 新デザイン（エディトリアル案）トークン。まずヘッダー/フッター/TOPページに適用 --- */
  --ink:#23211D;
  --red:#E03127;
  --red-dark:#B4241C;
  --cyan:#00A8CC;
  --yellow:#FFDC3D;
  --cyan-light:#8FE3F5;
  --text-mid:#55504A;
  --text-soft:#8A857C;
  --text-softer:#6B6660;
  --border-warm:#EDEAE2;
  --photo-bg:#F1EEE7;
  --bg-cyan-soft:#F4FBFD;
  --bg-yellow-soft:#FFF9E0;

  --font-mincho:"Shippori Mincho", "Noto Serif CJK JP", serif;
  --font-sans:"Zen Kaku Gothic New", "Noto Sans CJK JP", sans-serif;

  --container-max:1180px;
}

/* --- Reset --- */
*{box-sizing:border-box; margin:0; padding:0;}
html{scroll-behavior:smooth;}
body{
  font-family:var(--font-sans);
  background:var(--kinari);
  color:var(--sumi);
  line-height:1.8;
  -webkit-font-smoothing:antialiased;
}
a{color:inherit; text-decoration:none;}
img{max-width:100%; display:block;}
ul{list-style:none;}
button{font:inherit; cursor:pointer;}
.mincho{font-family:var(--font-mincho);}
.wrap{max-width:var(--container-max); margin:0 auto; padding:0 32px;}
.visually-hidden{
  position:absolute; width:1px; height:1px; overflow:hidden;
  clip:rect(0 0 0 0); white-space:nowrap;
}
.skip-link{
  position:absolute; left:-999px; top:0; background:var(--ai); color:var(--kinari);
  padding:12px 20px; z-index:100;
}
.skip-link:focus{left:0;}

/* ==========================================================================
   [WP: header.php] サイトヘッダー / グローバルナビ
   ========================================================================== */
.site-header{background:#FFFFFF; color:var(--ink); border-bottom:1px solid var(--border-warm); position:sticky; top:0; z-index:50;}
.site-header .header-inner{display:flex; align-items:center; justify-content:space-between; padding:16px 32px;}
.brand{display:flex; align-items:center; gap:14px;}
.brand .mark{width:44px; height:44px; flex-shrink:0;}
.brand .mark img{width:100%; height:100%; object-fit:contain; display:block;}
.brand .name{font-family:var(--font-mincho); letter-spacing:.06em; color:var(--ink); display:flex; flex-direction:column;}
.brand .name .brand-primary{font-size:20px; font-weight:600; order:1; letter-spacing:.04em; line-height:1.2;}
.brand .name .brand-org{font-family:var(--font-sans); font-size:11.5px; font-weight:500; color:var(--text-soft); letter-spacing:.05em; margin-top:2px; order:2; line-height:1.2;}
.brand .name small{display:block; font-family:var(--font-sans); font-size:9px; letter-spacing:.1em; color:var(--text-soft); margin-top:1px; order:3; line-height:1.2;}

.global-nav{display:flex; gap:28px; font-size:13px; letter-spacing:.02em; font-weight:500;}
.global-nav a{position:relative; padding-bottom:4px; opacity:.92; color:var(--ink); transition:color .15s;}
.global-nav a:hover{color:var(--red); opacity:1;}
.global-nav a[aria-current="page"]{opacity:1; font-weight:700; color:var(--red);}
.global-nav a:after{content:""; position:absolute; left:0; bottom:0; width:0; height:1px; background:var(--red); transition:width .25s;}
.global-nav a:hover:after, .global-nav a[aria-current="page"]:after{width:100%;}
.header-cta{background:var(--red); color:#fff; font-size:13px; font-weight:700; padding:12px 24px; border-radius:4px; white-space:nowrap; flex-shrink:0;}
.header-cta:hover{background:var(--red-dark);}

.nav-toggle{display:none; background:none; border:none; color:var(--ink); font-size:24px;}

/* ==========================================================================
   ボタン / 共通パーツ
   ========================================================================== */
.btn{display:inline-flex; align-items:center; gap:8px; font-size:13px; padding:14px 26px; border-radius:10px; letter-spacing:.03em; border:1px solid transparent;}
.btn-primary{background:var(--hi); color:var(--hakuji);}
.btn-primary:hover{background:var(--hi-dark);}
.btn-ghost{border-color:rgba(255,255,255,.4); color:var(--kinari);}
.btn-outline{border-color:var(--sumi-soft); color:var(--sumi);}

.section-head{display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:44px; flex-wrap:wrap; gap:12px;}
.section-head .eyebrow{font-size:11px; letter-spacing:.2em; color:var(--hi); margin-bottom:10px; display:block;}
.section-head h2{font-size:26px; font-weight:600;}
.section-head .more{font-size:12px; color:var(--sumi-soft); border-bottom:1px solid var(--sumi-soft); padding-bottom:2px;}

section{padding:88px 0;}

/* ==========================================================================
   [WP: front-page.php > hero block] ヒーロー
   ========================================================================== */
.hero{position:relative; background:linear-gradient(180deg,var(--ai) 0%, var(--ai) 62%, var(--kinari) 62%); overflow:hidden;}
.hero-inner{max-width:var(--container-max); margin:0 auto; padding:64px 32px 0; display:grid; grid-template-columns:1.1fr .9fr; gap:40px; align-items:end;}
.eyebrow-tag{display:inline-flex; align-items:center; gap:8px; font-size:12px; letter-spacing:.18em; color:var(--yamabuki); margin-bottom:22px;}
.eyebrow-tag .dot{width:5px; height:5px; background:var(--yamabuki); border-radius:50%;}
.hero h1{color:var(--kinari); font-size:44px; line-height:1.55; font-weight:600; margin-bottom:22px;}
.hero h1 em{font-style:normal; color:var(--yamabuki);}
.hero p{color:#CBD3D6; font-size:14.5px; max-width:440px; margin-bottom:34px;}
.cta-row{display:flex; gap:14px; margin-bottom:56px; flex-wrap:wrap;}
.hero-visual{position:relative; height:420px; border-radius:16px; overflow:hidden;
  background:radial-gradient(circle at 30% 20%, rgba(217,164,65,.18), transparent 45%), linear-gradient(160deg,#2A4C60,#123040 70%);
}
.hero-visual .cap{position:absolute; left:18px; bottom:16px; color:#DCE4E6; font-size:11px; letter-spacing:.08em;}
.hero-visual svg{position:absolute; inset:0; width:100%; height:100%;}

.fish{ animation:swim 9s ease-in-out infinite; }
.fish.f2{ animation-duration:11s; animation-delay:-3s; }
.fish.f3{ animation-duration:7.5s; animation-delay:-1.2s; }
@keyframes swim{
  0%{ transform:translateX(-8%) translateY(0px); }
  50%{ transform:translateX(8%) translateY(-10px); }
  100%{ transform:translateX(-8%) translateY(0px); }
}

/* 泳ぐ金魚の帯（セクション区切りの共通モチーフ） */
.tank-strip{position:relative; background:var(--kinari-2); border-top:1px solid var(--line); border-bottom:1px solid var(--line); height:64px; overflow:hidden;}
.tank-strip .row{position:absolute; inset:0; display:flex; align-items:center;}
.tank-strip .swimmer{ animation:driftX linear infinite; opacity:.55; }
@keyframes driftX{ from{ transform:translateX(-10%);} to{ transform:translateX(110vw);} }

@media (prefers-reduced-motion: reduce){
  .fish, .tank-strip .swimmer{ animation:none; }
}

/* ==========================================================================
   お知らせティッカー [WP: 投稿タイプ "news" の最新3件をループ出力]
   ========================================================================== */
.news-ticker{background:var(--hakuji); border-bottom:1px solid var(--line);}
.news-ticker .wrap{display:flex; align-items:center; gap:20px; padding:14px 32px; font-size:12.5px; flex-wrap:wrap;}
.news-ticker .tag{background:var(--hi); color:#fff; font-size:10.5px; padding:4px 10px; letter-spacing:.05em; flex-shrink:0;}
.news-ticker ul{display:flex; gap:36px; flex-wrap:wrap; color:var(--sumi-soft);}
.news-ticker li{white-space:nowrap;}
.news-ticker li b{color:var(--sumi); font-weight:500; margin-right:8px;}

/* ==========================================================================
   4つの入口（コンテンツピラー） [WP: 固定ページ or ACFリピーターで管理]
   ========================================================================== */
.pillars{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:14px; overflow:hidden;}
.pillar-card{background:var(--hakuji); padding:34px 26px; position:relative; transition:background .2s;}
.pillar-card:hover, .pillar-card:focus-within{background:#fff;}
.pillar-card .seal{width:30px; height:30px; border-radius:50%; border:1.5px solid var(--hi); color:var(--hi); font-family:var(--font-mincho); font-size:13px; display:flex; align-items:center; justify-content:center; margin-bottom:22px;}
.pillar-card h3{font-size:19px; margin-bottom:10px; font-weight:600;}
.pillar-card p{font-size:12.5px; color:var(--sumi-soft); margin-bottom:18px; min-height:56px;}
.pillar-card .go{font-size:14px; color:var(--hi); letter-spacing:.03em; font-weight:500;}

/* ==========================================================================
   店舗ピックアップ [WP: 投稿タイプ "shop" から抜粋をクエリ]
   ========================================================================== */
.shops-scroll{display:flex; gap:18px; overflow-x:auto; padding-bottom:8px; scrollbar-width:none;}
.shops-scroll::-webkit-scrollbar{display:none;}
.shop-card{flex:0 0 220px; background:#fff; border:1px solid var(--border-warm); overflow:hidden;}
.shop-card .thumb{height:140px; background:var(--photo-bg); position:relative;}
.shop-card .badge{position:absolute; top:10px; left:10px; background:var(--ink); color:#fff; font-size:9.5px; padding:3px 8px; letter-spacing:.04em;}
.shop-card .body{padding:16px 16px 20px;}
.shop-card .body .name{font-size:14px; font-weight:500; margin-bottom:6px;}
.shop-card .body .desc{font-size:11.5px; color:var(--sumi-soft);}

/* ==========================================================================
   豊臣好みバナー [WP: 固定ページ抜粋 or ウィジェット]
   ========================================================================== */
.toyotomi-band{background:var(--ai-2); color:var(--kinari); position:relative; overflow:hidden;}
.toyotomi-band .wrap{display:grid; grid-template-columns:1fr 1fr; gap:48px; align-items:center; padding:70px 32px;}
.toyotomi-band .tagline{font-size:11px; letter-spacing:.2em; color:var(--yamabuki); margin-bottom:16px;}
.toyotomi-band h2{font-size:28px; line-height:1.7; margin-bottom:18px; font-weight:600;}
.toyotomi-band p{font-size:13px; color:#C9D1D5; max-width:440px; margin-bottom:26px;}
.toyotomi-band .visual{height:260px; border:1px solid rgba(217,164,65,.35); border-radius:14px; position:relative; background:radial-gradient(circle at 70% 30%, rgba(217,164,65,.12), transparent 55%);}
.toyotomi-band .visual .kamon{position:absolute; right:26px; top:26px; width:56px; height:56px; border:1px solid var(--yamabuki); border-radius:50%; display:flex; align-items:center; justify-content:center; color:var(--yamabuki); font-family:var(--font-mincho); font-size:11px; letter-spacing:.1em;}

/* ==========================================================================
   イベント / アクセス 2カラム [WP: newsループ + 固定コンテンツ]
   ========================================================================== */
.two-col{display:grid; grid-template-columns:1.1fr .9fr; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:14px; overflow:hidden;}
.events-panel, .access-panel{background:var(--hakuji); padding:40px;}
.event-item{display:flex; gap:16px; padding:16px 0; border-bottom:1px dashed var(--line);}
.event-item:last-child{border-bottom:none;}
.event-item time{font-family:var(--font-mincho); font-size:13px; color:var(--hi); flex-shrink:0; width:78px;}
.event-item .cat{font-size:10px; color:var(--sumi-soft); letter-spacing:.05em; margin-bottom:4px;}
.event-item .title{font-size:13.5px;}
.access-panel p{font-size:12px; color:var(--sumi-soft); margin-bottom:16px;}

/* ==========================================================================
   デジタルマップ（実座標ベース／JR郡山駅は省略タブ表示）
   ========================================================================== */
.digimap{display:flex; gap:0; background:var(--hakuji); border:1px solid var(--line); border-radius:14px; overflow:hidden;}
.dm-canvas{flex:0 0 380px; padding:20px 10px; border-right:1px solid var(--line);}
.dm-canvas svg{width:100%; height:auto; display:block;}
.dm-side{flex:1; padding:28px 34px;}
.dm-side .dm-block{margin-bottom:20px;}
.dm-side .dm-block:last-child{margin-bottom:0;}
.dm-side h4{font-size:11.5px; letter-spacing:.06em; color:var(--sumi-soft); margin-bottom:10px;}
.dm-legend-row{display:flex; align-items:center; gap:8px; font-size:12px; margin-bottom:7px;}
.dm-legend-row .sw{width:10px; height:10px; border-radius:50%; flex-shrink:0;}
.dm-legend-row .sw.landmark{background:var(--ai); border-radius:2px;}
.dm-legend-row .sw.shop{background:var(--hakuji); border:2px solid var(--ao);}
.dm-legend-row .sw.station{background:var(--sumi);}
.dm-note{font-size:11px; color:var(--sumi-soft); line-height:1.9;}

/* ==========================================================================
   [WP: footer.php] フッター
   ========================================================================== */
.site-footer{background:#fff; color:var(--text-mid); border-top:1px solid var(--border-warm);}
.footer-top{display:grid; grid-template-columns:1.4fr repeat(3,1fr); gap:40px; padding:64px 32px 40px; max-width:var(--container-max); margin:0 auto;}
.site-footer h4{color:var(--ink); font-size:12px; letter-spacing:.1em; margin-bottom:18px; font-weight:700;}
.site-footer ul{font-size:12.5px; display:flex; flex-direction:column; gap:10px;}
.site-footer ul a:hover{color:var(--red);}
.footer-brand .mincho{color:var(--ink); font-size:14px; font-weight:700; white-space:nowrap; margin-bottom:14px;}
.footer-brand p{font-size:11.5px; max-width:260px; margin-bottom:18px; color:var(--text-soft);}
.qr-note{border:1px solid var(--border-warm); background:var(--bg-yellow-soft); padding:12px 14px; border-radius:8px; font-size:11px; display:flex; gap:12px; align-items:center; color:var(--text-mid);}
.qr-note .sq{width:34px; height:34px; background:#fff; border:1px solid var(--border-warm); flex-shrink:0; border-radius:6px;}
.footer-bottom{border-top:1px solid var(--border-warm); padding:20px 32px; font-size:11px; display:flex; justify-content:space-between; flex-wrap:wrap; gap:8px; color:var(--text-soft); max-width:var(--container-max); margin:0 auto;}

/* ==========================================================================
   レスポンシブ
   ========================================================================== */
@media (max-width:920px){
  .global-nav{
    display:none; position:absolute; top:100%; left:0; right:0; background:#FFFFFF;
    flex-direction:column; gap:0; padding:8px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line);
  }
  .global-nav.is-open{display:flex;}
  .global-nav a{padding:14px 32px; width:100%;}
  .nav-toggle{display:block;}
  .header-cta{display:none;}

  .hero-inner{grid-template-columns:1fr;}
  .pillars{grid-template-columns:repeat(2,1fr);}
  .two-col, .toyotomi-band .wrap{grid-template-columns:1fr;}
  .footer-top{grid-template-columns:1fr 1fr;}
  .digimap{flex-direction:column;}
  .dm-canvas{flex:none; border-right:none; border-bottom:1px solid var(--line);}
  section{padding:56px 0;}
}

@media (max-width:600px){
  .hero h1{font-size:32px;}
  .footer-top{grid-template-columns:1fr;}
  .wrap{padding:0 20px;}
}

/* ==========================================================================
   [WP: page.php 共通] 下層ページ用ページヒーロー / パンくず
   ========================================================================== */
.breadcrumb{background:var(--kinari-2); border-bottom:1px solid var(--line);}
.breadcrumb .wrap{padding:14px 32px; font-size:11.5px; color:var(--sumi-soft); display:flex; gap:8px; flex-wrap:wrap;}
.breadcrumb a{color:var(--sumi-soft); border-bottom:1px dotted var(--sumi-soft);}
.breadcrumb a:hover{color:var(--hi); border-color:var(--hi);}
.breadcrumb .sep{opacity:.5;}
.breadcrumb [aria-current="page"]{color:var(--sumi);}

.page-hero{background:var(--ai); color:var(--kinari); padding:56px 0 48px;}
.page-hero .eyebrow-tag{margin-bottom:16px;}
.page-hero h1{font-size:34px; font-weight:600; line-height:1.5; margin-bottom:16px;}
.page-hero p{font-size:14px; color:#CBD3D6; max-width:640px;}

.lead-block{max-width:760px;}
.lead-block p{font-size:14px; line-height:2; color:var(--sumi); margin-bottom:18px;}

/* ==========================================================================
   金魚図鑑グリッド [WP: カスタムフィールドで種類を管理]
   ========================================================================== */
.fish-grid{display:grid; grid-template-columns:repeat(5,1fr); gap:14px;}
.fish-card{background:var(--hakuji); border:1px solid var(--line); padding:12px; text-align:center; border-radius:10px;}
.fish-card .swatch{width:100%; height:64px; border-radius:2px; margin-bottom:10px; display:flex; align-items:center; justify-content:center;}
.fish-card .swatch svg{width:56px; height:32px;}
.fish-card .name{font-size:12px; font-weight:500;}
.fish-card .kana{font-size:10px; color:var(--sumi-soft); margin-top:2px;}

/* ==========================================================================
   水槽設置店舗リスト（マップのテキスト版・切替表示）
   ========================================================================== */
.view-toggle{display:inline-flex; border:1px solid var(--line); border-radius:10px; overflow:hidden; margin-bottom:32px;}
.view-toggle button{background:var(--hakuji); border:none; padding:10px 22px; font-size:12.5px; color:var(--sumi-soft); border-right:1px solid var(--line);}
.view-toggle button:last-child{border-right:none;}
.view-toggle button[aria-selected="true"]{background:var(--ai); color:var(--kinari);}

.tank-list{display:grid; grid-template-columns:repeat(2,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:14px; overflow:hidden;}
.tank-list .tank-item{background:var(--hakuji); padding:20px 24px; display:flex; justify-content:space-between; align-items:center; gap:12px;}
.tank-list .tank-item .name{font-size:13.5px; font-weight:500;}
.tank-list .tank-item .chome{font-size:11px; color:var(--hi); margin-top:3px;}
.tank-list .tank-item a{font-size:11.5px; color:var(--sumi-soft); border-bottom:1px solid var(--sumi-soft); flex-shrink:0;}

@media (max-width:920px){
  .fish-grid{grid-template-columns:repeat(3,1fr);}
  .tank-list{grid-template-columns:1fr;}
}
@media (max-width:600px){
  .fish-grid{grid-template-columns:repeat(2,1fr);}
  .page-hero h1{font-size:26px;}
}

/* ==========================================================================
   参加方法ステップ [WP: 固定コンテンツ、ACFリピーター可]
   ========================================================================== */
.steps-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.step-card{background:var(--hakuji); border:1px solid var(--line); padding:28px 24px; position:relative; border-radius:12px;}
.step-card .num{font-family:var(--font-mincho); font-size:13px; color:var(--hi); letter-spacing:.1em; margin-bottom:14px;}
.step-card .icon{width:100%; height:88px; background:var(--kinari-2); border-radius:2px; display:flex; align-items:center; justify-content:center; margin-bottom:16px;}
.step-card h3{font-size:15px; font-weight:600; margin-bottom:8px;}
.step-card p{font-size:12.5px; color:var(--sumi-soft); line-height:1.8;}

/* ==========================================================================
   対象店舗スタンプグリッド [WP: 投稿タイプ "shop" の gokingyo=true 抽出]
   ========================================================================== */
.stamp-grid{display:grid; grid-template-columns:repeat(6,1fr); gap:12px;}
.stamp-card{background:var(--hakuji); border:1px solid var(--line); padding:14px 10px; text-align:center; border-radius:10px;}
.stamp-card .stamp{width:44px; height:44px; margin:0 auto 8px; border-radius:50%; border:1.5px dashed var(--hi); color:var(--hi); display:flex; align-items:center; justify-content:center; font-family:var(--font-mincho); font-size:13px;}
.stamp-card .name{font-size:11px; line-height:1.5;}

/* ==========================================================================
   限定版カード
   ========================================================================== */
.edition-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.edition-card{border:1px solid var(--line); background:var(--hakuji); overflow:hidden; border-radius:12px;}
.edition-card .band{height:10px;}
.edition-card .body{padding:22px;}
.edition-card h3{font-size:15px; font-weight:600; margin-bottom:8px;}
.edition-card p{font-size:12px; color:var(--sumi-soft); line-height:1.8;}
.edition-card .tag{display:inline-block; font-size:10px; letter-spacing:.05em; padding:3px 9px; margin-bottom:10px; color:#fff;}

/* ==========================================================================
   FAQ（ネイティブ details/summary、JS不要）
   ========================================================================== */
.faq-list{border-top:1px solid var(--line);}
.faq-item{border-bottom:1px solid var(--line);}
.faq-item summary{
  padding:20px 4px; font-size:13.5px; font-weight:500; cursor:pointer;
  display:flex; justify-content:space-between; align-items:center; gap:16px; list-style:none;
}
.faq-item summary::-webkit-details-marker{display:none;}
.faq-item summary:before{content:"Q"; color:var(--hi); font-family:var(--font-mincho); margin-right:10px; flex-shrink:0;}
.faq-item summary .chevron{margin-left:auto; color:var(--sumi-soft); transition:transform .2s;}
.faq-item[open] summary .chevron{transform:rotate(180deg);}
.faq-item .answer{padding:0 4px 22px 26px; font-size:12.5px; color:var(--sumi-soft); line-height:1.9;}

@media (max-width:920px){
  .steps-grid{grid-template-columns:1fr;}
  .stamp-grid{grid-template-columns:repeat(3,1fr);}
  .edition-grid{grid-template-columns:1fr;}
}
@media (max-width:600px){
  .stamp-grid{grid-template-columns:repeat(2,1fr);}
}

/* ==========================================================================
   外部リンクカード
   ========================================================================== */
.link-card-grid{display:grid; grid-template-columns:repeat(2,1fr); gap:20px;}
.link-card{display:block; background:var(--hakuji); border:1px solid var(--line); padding:24px; transition:border-color .2s; border-radius:12px;}
.link-card:hover{border-color:var(--hi);}
.link-card .site{font-size:10.5px; color:var(--sumi-soft); letter-spacing:.05em; margin-bottom:8px;}
.link-card h3{font-size:15px; font-weight:600; margin-bottom:8px; display:flex; align-items:center; gap:6px;}
.link-card h3 .ext{font-size:11px; color:var(--hi);}
.link-card p{font-size:12px; color:var(--sumi-soft); line-height:1.8;}

.info-note{background:var(--kinari-2); border-left:3px solid var(--yamabuki); padding:16px 20px; font-size:12px; color:var(--sumi-soft); line-height:1.9; border-radius:0 10px 10px 0;}

@media (max-width:920px){
  .link-card-grid{grid-template-columns:1fr;}
}

/* ==========================================================================
   街歩き特集 入口カード（2択の大型リンク）
   ========================================================================== */
.feature-split{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); border-radius:14px; overflow:hidden;}
.feature-card{background:var(--hakuji); display:block; padding:0;}
.feature-card .feature-visual{height:220px; position:relative; overflow:hidden;}
.feature-card .feature-body{padding:32px;}
.feature-card .feature-tag{font-size:10.5px; letter-spacing:.15em; color:var(--hi); margin-bottom:10px; display:block;}
.feature-card h3{font-size:20px; font-weight:600; margin-bottom:12px;}
.feature-card p{font-size:13px; color:var(--sumi-soft); line-height:1.9; margin-bottom:18px;}
.feature-card .go{font-size:12.5px; color:var(--hi);}

@media (max-width:920px){
  .feature-split{grid-template-columns:1fr;}
}

/* ==========================================================================
   街歩きスポットカード（看板建築さんぽ／転用石さんぽ共通）
   ========================================================================== */
.spot-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.spot-card{background:var(--hakuji); border:1px solid var(--line); border-radius:12px; overflow:hidden;}
.spot-card .thumb{height:150px; position:relative;}
.spot-card .thumb .no{position:absolute; top:10px; left:10px; background:var(--ai); color:var(--kinari); font-family:var(--font-mincho); font-size:12px; width:26px; height:26px; border-radius:50%; display:flex; align-items:center; justify-content:center;}
.spot-card .body{padding:18px 20px 22px;}
.spot-card .name{font-size:14px; font-weight:600; margin-bottom:6px;}
.spot-card .addr{font-size:10.5px; color:var(--hi); margin-bottom:10px;}
.spot-card .desc{font-size:12px; color:var(--sumi-soft); line-height:1.8;}

@media (max-width:920px){
  .spot-grid{grid-template-columns:repeat(2,1fr);}
}
@media (max-width:600px){
  .spot-grid{grid-template-columns:1fr;}
}

/* ==========================================================================
   店舗ガイド：検索・フィルター
   ========================================================================== */
/* お店を探す：業種で選ぶアイコンボタン */
.cat-icon-row{display:grid; grid-template-columns:repeat(5,1fr); gap:14px; margin-bottom:28px;}
.cat-icon-btn{display:flex; flex-direction:column; align-items:center; gap:10px; padding:20px 10px; border:1.5px solid var(--border-warm); background:#fff; color:var(--ink); cursor:pointer; font-family:inherit;}
.cat-icon-btn svg{width:34px; height:34px;}
.cat-icon-btn span{font-size:13px; font-weight:700;}
.cat-icon-btn:hover{border-color:var(--red);}
.cat-icon-btn[aria-pressed="true"]{background:var(--red); border-color:var(--red); color:#fff;}
@media (max-width:820px){ .cat-icon-row{grid-template-columns:repeat(3,1fr);} }
@media (max-width:480px){ .cat-icon-row{grid-template-columns:repeat(2,1fr);} }

.filter-bar{background:#fff; border:1px solid var(--border-warm); padding:22px 24px; margin-bottom:28px; border-radius:0;}
.filter-row{display:flex; gap:14px; flex-wrap:wrap; align-items:center;}
.filter-search{flex:1 1 240px; position:relative;}
.filter-search input{
  width:100%; padding:11px 16px; border:1px solid var(--line); background:var(--kinari); font-size:13px;
  font-family:inherit; color:var(--sumi); border-radius:8px;
}
.filter-search input:focus{outline:2px solid var(--red); outline-offset:-1px;}
.filter-select{padding:11px 14px; border:1px solid var(--border-warm); background:#fff; font-size:12.5px; font-family:inherit; color:var(--ink); border-radius:0;}
.filter-tags{display:flex; gap:8px; flex-wrap:wrap;}
.filter-tag{
  border:1px solid var(--line); background:var(--kinari); padding:9px 16px; font-size:12px; color:var(--sumi-soft);
  border-radius:20px; display:inline-flex; align-items:center; gap:6px;
}
.filter-tag input{margin:0;}
.filter-tag:has(input:checked){background:var(--ai); border-color:var(--ai); color:var(--kinari);}
.filter-count{font-size:12px; color:var(--text-soft); margin-bottom:20px;}

/* ==========================================================================
   店舗ガイド：カードグリッド
   ========================================================================== */
.guide-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:#fff;}
.guide-card{background:#fff; display:block; border:1px solid var(--border-warm);}
.guide-card .thumb{aspect-ratio:1 / 1; height:auto; position:relative; background:#fff; overflow:hidden;}
.guide-card .thumb img{width:100%; height:100%; object-fit:cover; display:block;}
.guide-card .thumb .badges{position:absolute; top:8px; left:8px; display:flex; gap:4px; flex-wrap:wrap;}
.guide-card .thumb .badges span{background:var(--ink); color:#fff; font-size:8.5px; padding:2px 7px; letter-spacing:.03em;}
.guide-card .body{padding:14px 16px 18px;}
.guide-card .cat{font-size:10px; color:var(--hi); margin-bottom:4px;}
.guide-card .name{font-size:13.5px; font-weight:600; margin-bottom:4px;}
.guide-card .chome{font-size:10.5px; color:var(--sumi-soft);}
.guide-card[hidden]{display:none;}

.no-results{padding:60px 20px; text-align:center; color:var(--text-soft); font-size:13px;}

@media (max-width:1100px){ .guide-grid{grid-template-columns:repeat(3,1fr);} }
@media (max-width:768px){ .guide-grid{grid-template-columns:repeat(2,1fr);} }

/* ==========================================================================
   店舗個別ページ（テンプレート） [WP: single-shop.php]
   ========================================================================== */
.shop-layout{display:grid; grid-template-columns:1.7fr 1fr; gap:40px; align-items:start;}
@media (max-width:820px){ .shop-layout{grid-template-columns:1fr;} }

.shop-gallery{display:grid; grid-template-columns:2fr 1fr 1fr; grid-template-rows:auto auto; gap:6px; margin-bottom:24px;}
.shop-gallery .g-main{grid-row:1 / 3; height:100%; min-height:280px; background:var(--photo-bg);}
.shop-gallery .g-sub{height:137px; background:var(--photo-bg);}

/* [2a デザイン] 店舗個別ページ：アイキャッチ画像とSHOP INFOを50/50、本文は下段いっぱいに使う構成 */
.shop-top-row{display:grid; grid-template-columns:1fr 1fr; gap:40px; align-items:start; max-width:var(--container-max); margin:0 auto; padding:48px 32px 0; box-sizing:border-box;}
.shop-top-row .shop-hero-img{aspect-ratio:1 / 1; height:auto; width:100%; background:none; display:flex; align-items:center; justify-content:center; padding:4px 16px; box-sizing:border-box;}
.shop-top-row .shop-hero-img img{max-width:100%; max-height:100%; width:auto; height:auto; object-fit:contain;}
.shop-body-full{max-width:var(--container-max); margin:0 auto; padding:48px 32px 0; box-sizing:border-box;}
@media (max-width:820px){
  .shop-top-row{grid-template-columns:1fr; gap:28px;}
}
@media (max-width:600px){
  .shop-top-row, .shop-body-full{padding-left:20px; padding-right:20px;}
}
.shop-title-2a{font-size:56px; line-height:1.3; font-weight:600; letter-spacing:.02em; color:var(--ink);}
@media (max-width:600px){ .shop-title-2a{font-size:34px;} }
.nearby-grid-2a{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
@media (max-width:820px){ .nearby-grid-2a{grid-template-columns:1fr 1fr;} }
@media (max-width:600px){ .nearby-grid-2a{grid-template-columns:1fr;} }

/* デジタルマップ：まちなか水族館 参加店舗の強調表示トグル */
.dm-filter-toggles{margin-bottom:14px; display:flex; flex-wrap:wrap; gap:8px 20px; font-size:12.5px; color:var(--text-mid);}
.dm-filter-toggles label{display:inline-flex; align-items:center; gap:8px; cursor:pointer; white-space:nowrap;}
.dm-filter-toggles input[type="checkbox"]{width:16px; height:16px; accent-color:var(--red); cursor:pointer;}
svg.show-kingyo circle[data-kingyo="1"]{fill:var(--red); stroke:var(--red);}
svg.show-tabearuki circle[data-groups~="tabearuki"]{fill:var(--red); stroke:var(--red);}
svg.show-okaimono circle[data-groups~="okaimono"]{fill:var(--red); stroke:var(--red);}
svg.show-shuri circle[data-groups~="shuri"]{fill:var(--red); stroke:var(--red);}
svg.show-taiken circle[data-groups~="taiken"]{fill:var(--red); stroke:var(--red);}
svg.show-sonota circle[data-groups~="sonota"]{fill:var(--red); stroke:var(--red);}

/* デジタルマップ：店名リンクのホバー時の見た目 */
.dm-shop-link{cursor:pointer;}
.dm-shop-link:hover circle{fill:var(--cyan-light);}
.dm-shop-link:hover text{fill:var(--cyan); font-weight:700;}

/* [2a デザイン] SHOP INFO：外枠は残しつつコンパクトに、ラベル部分に少し装飾 */
.shop-info-2a-box{border:1px solid var(--border-warm); padding:22px 22px;}
.shop-info-2a-label{font-size:11px; letter-spacing:.2em; color:var(--text-soft); font-weight:700; margin-bottom:10px;}
.shop-info-2a-category{font-size:11.5px; color:var(--red); font-weight:700; letter-spacing:.04em; margin-bottom:6px;}
.shop-info-2a-name{font-size:20px; font-weight:600; padding-bottom:10px; margin-bottom:12px; border-bottom:1px solid var(--border-warm);}
.shop-info-2a-list p{font-size:13.5px; line-height:1.95; margin:0; color:var(--ink);}
.shop-info-2a-list p span{color:var(--text-soft); font-weight:700; letter-spacing:.03em;}
.shop-info-2a-sns{margin-top:12px; display:flex; gap:8px; flex-wrap:wrap;}
.shop-info-2a-sns a{border:1px solid #DAD6CC; color:var(--ink); font-size:12px; font-weight:700; padding:7px 12px;}
.shop-info-2a-map{margin-top:16px; height:180px; background:var(--photo-bg); border:1px solid var(--border-warm); display:flex; align-items:center; justify-content:center; font-size:12px; color:var(--text-soft);}

.shop-badges{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:20px;}
.shop-badges span{background:var(--ink); color:#fff; font-size:10.5px; padding:5px 12px; letter-spacing:.04em;}

.shop-title{font-size:32px; font-weight:900; margin-bottom:8px; color:var(--ink);}
.shop-chome{font-size:12px; color:var(--red); font-weight:700; margin-bottom:20px;}

.shop-intro p{font-size:14px; line-height:2; color:var(--text-mid); margin-bottom:16px;}

.owner-comment{background:var(--bg-cyan-soft); border-left:3px solid var(--cyan); padding:20px 24px; margin:28px 0;}
.owner-comment .role{font-size:10.5px; color:var(--text-soft); letter-spacing:.05em; margin-bottom:8px;}
.owner-comment p{font-size:13px; line-height:1.95; color:var(--text-mid); font-style:normal;}

.qr-section{border:1px solid var(--red); background:var(--bg-yellow-soft); padding:22px 24px; margin-top:28px;}
.qr-section .label{display:flex; align-items:center; gap:8px; font-size:11px; color:var(--red); font-weight:700; letter-spacing:.05em; margin-bottom:10px;}
.qr-section .label .qricon{width:16px; height:16px; border:1.5px solid var(--red); flex-shrink:0;}
.qr-section p{font-size:12.5px; color:var(--text-mid); line-height:1.9;}

.nearby-list{display:grid; grid-template-columns:repeat(3,1fr); gap:16px; margin-top:16px;}

/* --- sidebar --- */
.info-card{background:#fff; border:1px solid var(--border-warm); padding:24px;}
.info-card dl{font-size:12.5px;}
.info-card dt{color:var(--text-soft); font-size:10.5px; letter-spacing:.04em; margin-top:14px; font-weight:700;}
.info-card dt:first-child{margin-top:0;}
.info-card dd{color:var(--ink); margin-top:3px; line-height:1.7;}
.info-card .sns-row{display:flex; gap:10px; margin-top:4px;}
.info-card .sns-row a{font-size:11.5px; color:var(--cyan); border-bottom:1px solid var(--cyan);}

.mini-map-box{margin-top:16px; border:1px solid var(--border-warm); background:var(--photo-bg); height:150px; display:flex; align-items:center; justify-content:center; font-size:11px; color:var(--text-soft);}

@media (max-width:920px){
  .shop-layout{grid-template-columns:1fr;}
  .shop-gallery{grid-template-columns:1fr 1fr;}
  .shop-gallery .g-main{grid-row:auto; grid-column:1 / 3; min-height:220px;}
  .nearby-list{grid-template-columns:1fr 1fr;}
}
@media (max-width:600px){
  .nearby-list{grid-template-columns:1fr;}
}

/* ==========================================================================
   マップ・アクセス：交通案内カード
   ========================================================================== */
.transport-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.transport-card{background:var(--hakuji); border:1px solid var(--line); padding:24px; border-radius:12px;}
.transport-card .icon{width:36px; height:36px; margin-bottom:14px;}
.transport-card h3{font-size:14px; font-weight:600; margin-bottom:10px;}
.transport-card p{font-size:12px; color:var(--sumi-soft); line-height:1.85;}

.route-course{display:flex; flex-direction:column; gap:0; border-left:2px solid var(--line); margin-left:6px; padding-left:24px;}
.route-stop{position:relative; padding-bottom:28px;}
.route-stop:last-child{padding-bottom:0;}
.route-stop:before{content:""; position:absolute; left:-29px; top:4px; width:10px; height:10px; border-radius:50%; background:var(--hi); border:2px solid var(--hakuji); box-shadow:0 0 0 1px var(--hi);}
.route-stop .time{font-size:10.5px; color:var(--hi); margin-bottom:3px;}
.route-stop .place{font-size:13.5px; font-weight:600;}
.route-stop .note{font-size:12px; color:var(--sumi-soft); margin-top:3px;}

@media (max-width:920px){
  .transport-grid{grid-template-columns:1fr;}
}

/* ==========================================================================
   イベント・お知らせ 一覧 [WP: 投稿タイプ "news" のアーカイブ]
   ========================================================================== */
.category-tabs{display:flex; gap:8px; flex-wrap:wrap; margin-bottom:28px;}
.category-tabs button{
  border:1px solid var(--border-warm); background:#fff; padding:9px 18px; font-size:12px; color:var(--text-mid);
  border-radius:20px; font-family:inherit;
}
.category-tabs button[aria-pressed="true"]{background:var(--ink); border-color:var(--ink); color:#fff;}

.news-list{display:flex; flex-direction:column; gap:1px; background:var(--border-warm); border:1px solid var(--border-warm);}
.news-list-item{background:#fff; display:flex; gap:20px; padding:20px 22px; align-items:center;}
.news-list-item .thumb{width:120px; height:80px; flex-shrink:0; background:var(--photo-bg);}
.news-list-item .meta{display:flex; align-items:center; gap:10px; font-size:11px; color:var(--text-soft); margin-bottom:6px;}
.news-list-item .meta .cat-tag{color:var(--red); font-weight:700;}
.news-list-item .title{font-size:14px; font-weight:500;}
.news-list-item[hidden]{display:none;}

/* ==========================================================================
   イベント・お知らせ 詳細 [WP: single-news.php]
   ========================================================================== */
.article-header{max-width:760px; margin:0 auto 32px;}
.article-header .meta{display:flex; gap:12px; align-items:center; font-size:11.5px; color:var(--text-soft); margin-bottom:14px;}
.article-header .meta .cat-tag{background:var(--red); color:#fff; padding:3px 10px; font-size:10.5px;}
.article-header h1{font-size:32px; font-weight:900; line-height:1.4; color:var(--ink);}
.article-hero{max-width:900px; margin:0 auto 40px; height:340px; background:var(--photo-bg); overflow:hidden;}
.article-hero img{width:100%; height:100%; object-fit:cover;}
.article-body{max-width:760px; margin:0 auto;}
.article-body a{color:var(--red); text-decoration:underline;}
.article-body a:hover{color:var(--red-dark);}
.article-body p{font-size:15px; line-height:2.1; color:var(--text-mid); margin-bottom:20px;}
.article-body h2{font-size:20px; font-weight:900; margin:32px 0 14px; color:var(--ink);}
.article-flyer{max-width:760px; margin:32px auto; border:1px solid var(--border-warm); background:var(--bg-yellow-soft); padding:20px 24px; display:flex; align-items:center; gap:16px;}
.article-flyer .picto{width:40px; height:40px; flex-shrink:0; border:1.5px solid var(--text-soft);}
.article-flyer .txt{font-size:12.5px; color:var(--text-mid);}
.article-flyer .txt strong{display:block; font-size:13.5px; color:var(--ink); margin-bottom:4px;}
.article-nav{max-width:760px; margin:48px auto 0; display:flex; justify-content:space-between; border-top:1px solid var(--border-warm); padding-top:24px; flex-wrap:wrap; gap:12px;}

/* ==========================================================================
   メディア・組合情報 [WP: 固定ページ]
   ========================================================================== */
.org-timeline{border-left:2px solid var(--line); margin-left:6px; padding-left:24px;}
.org-timeline .t-item{position:relative; padding-bottom:24px;}
.org-timeline .t-item:last-child{padding-bottom:0;}
.org-timeline .t-item:before{content:""; position:absolute; left:-30px; top:4px; width:9px; height:9px; border-radius:50%; background:var(--red); border:2px solid #fff; box-shadow:0 0 0 1px var(--red);}
.org-timeline .t-year{font-family:var(--font-mincho); font-size:13px; color:var(--red); margin-bottom:4px;}
.org-timeline .t-desc{font-size:13px; color:var(--text-mid); line-height:1.8;}

.org-stats{display:grid; grid-template-columns:repeat(3,1fr); gap:1px; background:var(--border-warm); border:1px solid var(--border-warm); margin:28px 0;}
.org-stats .stat{background:#fff; padding:22px; text-align:center;}
.org-stats .stat .num{font-family:var(--font-mincho); font-size:26px; color:var(--ink);}
.org-stats .stat .label{font-size:11px; color:var(--text-soft); margin-top:6px;}

.press-list{border-top:1px solid var(--border-warm);}
.press-item{display:flex; gap:20px; align-items:baseline; padding:16px 0; border-bottom:1px solid var(--border-warm); font-size:13px;}
.press-item time{color:var(--text-soft); font-size:11.5px; flex-shrink:0; width:90px;}
.press-item .media{color:var(--red); font-weight:700; flex-shrink:0; width:160px;}
.press-item .desc{color:var(--text-soft);}

.download-row{display:flex; gap:14px; flex-wrap:wrap;}
.download-btn{display:flex; align-items:center; gap:10px; border:1px solid var(--border-warm); background:#fff; padding:14px 22px; font-size:13px; color:var(--ink); border-radius:0;}
.download-btn .picto{width:22px; height:22px; border:1.5px solid var(--text-soft); flex-shrink:0;}

.contact-form{max-width:640px;}
.form-row{margin-bottom:22px;}
.form-row label{display:block; font-size:12.5px; font-weight:500; margin-bottom:8px;}
.form-row label .req{color:var(--red); font-size:10.5px; margin-left:6px;}
.form-row input[type="text"], .form-row input[type="email"], .form-row textarea, .form-row select{
  width:100%; padding:12px 14px; border:1px solid var(--border-warm); background:#fff; font-size:13px; font-family:inherit; color:var(--ink); border-radius:0;
}
.form-row input:focus, .form-row textarea:focus, .form-row select:focus{outline:2px solid var(--red); outline-offset:-1px;}
.form-row textarea{min-height:140px; resize:vertical;}
.radio-group{display:flex; gap:20px; flex-wrap:wrap;}
.radio-group label{display:flex; align-items:center; gap:6px; font-size:13px; font-weight:400;}

@media (max-width:920px){
  .org-stats{grid-template-columns:1fr;}
  .press-item{flex-direction:column; gap:2px;}
  .press-item .media, .press-item time{width:auto;}
}

/* ==========================================================================
   [NEW EDITORIAL DESIGN — 2a案] 下層ページ共通パーツ
   TOPページに続き、内側ページもこの見た目に統一していく。
   ========================================================================== */
@keyframes swimx{ from{ transform:translateX(-14%);} to{ transform:translateX(114%);} }
@media (prefers-reduced-motion:reduce){ .fish-divider svg{ animation:none !important; } }

.breadcrumb2{padding:18px 32px; font-size:12px; color:var(--text-soft); display:flex; gap:10px; align-items:center; border-bottom:1px solid #F4F2EC; max-width:var(--container-max); margin:0 auto;}
.breadcrumb2 a{color:var(--text-soft);}
.breadcrumb2 a:hover{color:var(--red);}
.breadcrumb2 [aria-current="page"]{color:var(--ink);}

.ph2{padding:80px 32px 0; max-width:var(--container-max); margin:0 auto; box-sizing:border-box;}
.ph2-eyebrow{font-size:12px; letter-spacing:.24em; color:var(--red); font-weight:700; margin-bottom:28px; display:block;}
.ph2-title{font-size:56px; line-height:1.3; font-weight:900; letter-spacing:-.02em; max-width:820px; color:var(--ink);}
.ph2-title mark{background:linear-gradient(transparent 62%, var(--yellow) 62%); color:inherit;}
.ph2-title mark.cyan{background:linear-gradient(transparent 64%, var(--cyan-light) 64%);}
.ph2-row{display:flex; justify-content:space-between; align-items:flex-end; gap:48px; margin-top:36px; flex-wrap:wrap;}
.ph2-lead{font-size:15px; color:var(--text-mid); max-width:540px; line-height:2;}
.ph2-cta{display:flex; gap:14px; flex-shrink:0; flex-wrap:wrap;}

.btn2{font-size:14px; font-weight:700; padding:18px 34px; border-radius:4px; display:inline-block;}
.btn2-solid{background:var(--red); color:#fff;}
.btn2-solid:hover{background:var(--red-dark); color:#fff;}
.btn2-outline{border:1.5px solid var(--ink); color:var(--ink);}
.btn2-outline-white{border:1.5px solid #fff; color:#fff;}
.btn2-dark{background:var(--ink); color:#fff;}

.ph2-photo-wrap{padding:64px 32px 0;}
.ph2-photo{height:400px; overflow:hidden; background:var(--photo-bg); max-width:var(--container-max); margin:0 auto;}
.ph2-photo img{width:100%; height:100%; object-fit:cover;}
.ph2-photo-cap{display:flex; justify-content:space-between; margin-top:12px; font-size:11.5px; color:var(--text-soft); max-width:var(--container-max); margin-left:auto; margin-right:auto; flex-wrap:wrap; gap:6px; padding:0 32px;}

.fish-divider{position:relative; height:56px; overflow:hidden; margin-top:48px; background:var(--bg-cyan-soft);}
.fish-divider svg{position:absolute;}

.section2{padding:88px 32px 0; max-width:var(--container-max); margin:0 auto; box-sizing:border-box;}
.section2-head{display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:40px; flex-wrap:wrap; gap:12px;}
.section2-head h2{font-size:32px; font-weight:900; letter-spacing:-.01em; color:var(--ink);}
.section2-eyebrow-r{font-size:11px; letter-spacing:.2em; color:var(--text-soft); white-space:nowrap;}
.section2-more{font-size:12.5px; font-weight:700; color:var(--ink); border-bottom:2px solid var(--yellow); padding-bottom:3px;}

.lead2-grid{display:grid; grid-template-columns:1fr 1fr; gap:56px;}
.lead2-grid p{font-size:15px; color:var(--text-mid); line-height:1.95;}

.steps2-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:40px;}
.steps2-grid.cols-4{grid-template-columns:repeat(4,1fr);}
.step2{border-top:2px solid var(--ink); padding-top:24px;}
.step2-label{font-size:11px; font-weight:900; color:var(--red); letter-spacing:.1em; margin-bottom:18px;}
.step2 svg{margin-bottom:16px;}
.step2 h3{font-size:20px; font-weight:900; margin-bottom:8px; color:var(--ink);}
.step2 p{font-size:13.5px; color:var(--text-mid);}

.stamp2-grid{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--border-warm); border:1px solid var(--border-warm);}
.stamp2-item{background:#fff; padding:22px 20px; display:flex; align-items:center; gap:14px; color:var(--ink);}
.stamp2-badge{width:44px; height:44px; border-radius:50%; border:2px solid var(--red); color:var(--red); font-family:var(--font-mincho); font-size:18px; display:flex; align-items:center; justify-content:center; flex-shrink:0; overflow:hidden;}
.stamp2-badge img{width:100%; height:100%; object-fit:cover;}
.stamp2-item .name{font-size:13.5px; font-weight:700;}

.edition2-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:24px;}
.edition2-band{height:9px;}
.edition2-cover{aspect-ratio:3 / 4; overflow:hidden; background:var(--photo-bg); max-width:45%; margin:20px auto 0;}
.edition2-cover img{width:100%; height:100%; object-fit:cover; display:block;}
.edition2-body{border:1px solid var(--border-warm); padding:26px 24px 28px;}
.edition2-tag{display:inline-block; color:#fff; font-size:11px; font-weight:700; padding:4px 11px; margin-bottom:14px;}
.edition2-body h3{font-size:20px; font-weight:900; margin-bottom:8px; color:var(--ink);}
.edition2-body p{font-size:13.5px; color:var(--text-mid);}

.faq2-item{border-top:1px solid var(--border-warm);}
.faq2-item:last-of-type{border-bottom:1px solid var(--border-warm);}
.faq2-item summary{display:flex; justify-content:space-between; align-items:center; gap:20px; padding:22px 0; font-size:15px; font-weight:700; cursor:pointer; list-style:none; color:var(--ink);}
.faq2-item summary::-webkit-details-marker{display:none;}
.faq2-item summary .plus{color:var(--red); font-size:14px; flex-shrink:0;}
.faq2-item .answer{font-size:13.5px; color:var(--text-mid); padding:0 0 22px; line-height:1.9;}

.related2{position:relative; margin-top:96px; color:#fff; padding:72px 32px; display:flex; align-items:center; justify-content:space-between; gap:48px; overflow:hidden; background:var(--ink); flex-wrap:wrap;}
.related2 .bgphoto{position:absolute; inset:0; width:100%; height:100%; object-fit:cover;}
.related2 .overlay{position:absolute; inset:0; background:linear-gradient(90deg, rgba(20,18,15,.84) 0%, rgba(20,18,15,.64) 46%, rgba(20,18,15,.2) 100%);}
.related2 .content{position:relative; max-width:580px;}
.related2 .tag{font-size:11px; letter-spacing:.2em; font-weight:700; color:var(--yellow); margin-bottom:16px;}
.related2 h2{font-family:var(--font-mincho); font-size:32px; font-weight:600; line-height:1.5; margin-bottom:18px;}
.related2 p{font-size:14px; color:#D8D3C9; margin-bottom:26px; line-height:1.9;}
.related2-emblem{position:relative; width:140px; height:140px; border:1px solid rgba(255,255,255,.45); display:flex; align-items:center; justify-content:center; flex-shrink:0;}
.related2-emblem span{font-family:var(--font-mincho); font-size:30px; letter-spacing:.1em; color:var(--yellow);}

.stats2-grid{display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--border-warm); border:1px solid var(--border-warm);}
.stats2-item{background:#fff; padding:24px 22px;}
.stats2-item .num{font-size:30px; font-weight:900; line-height:1.1; color:var(--ink);}
.stats2-item .num span{font-size:13px;}
.stats2-item .label{font-size:11px; color:var(--text-softer); margin-top:4px;}

.photo2-grid{display:grid; grid-template-columns:repeat(3,1fr); gap:20px;}
.photo2-grid figure img{width:100%; height:180px; object-fit:cover;}
.photo2-grid figcaption{font-size:10.5px; color:var(--text-soft); margin-top:7px;}

@media (max-width:920px){
  .ph2-title{font-size:38px;}
  .lead2-grid, .stamp2-grid, .steps2-grid, .edition2-grid, .stats2-grid, .photo2-grid{grid-template-columns:1fr 1fr;}
  .steps2-grid.cols-4{grid-template-columns:1fr 1fr;}
  .related2{flex-direction:column; text-align:left;}
}
@media (max-width:600px){
  .lead2-grid, .stamp2-grid, .steps2-grid, .edition2-grid, .stats2-grid, .photo2-grid{grid-template-columns:1fr;}
  .steps2-grid.cols-4{grid-template-columns:1fr;}
  .ph2-title{font-size:30px;}
  .ph2{padding-left:20px; padding-right:20px;}
  .section2{padding-left:20px; padding-right:20px;}
}

/* TOPページ：ヒーロー写真スライダー */
.hero-slider{position:relative; height:440px; overflow:hidden; background:var(--photo-bg);}
.hero-slide{position:absolute; inset:0; opacity:0; visibility:hidden; transition:opacity .6s ease;}
.hero-slide.is-active{opacity:1; visibility:visible;}
.hero-slide img{width:100%; height:100%; object-fit:cover; display:block;}
.hero-slide-cap{position:absolute; left:24px; bottom:20px; max-width:70%; background:rgba(35,33,29,.62); color:#fff; font-size:12.5px; line-height:1.6; padding:10px 16px;}
.hero-slider-arrow{position:absolute; top:50%; transform:translateY(-50%); width:48px; height:48px; border:none; background:none; color:#fff; font-size:44px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center; opacity:.7; text-shadow:0 1px 6px rgba(0,0,0,.5); transition:opacity .2s;}
.hero-slider-arrow:hover{opacity:1;}
.hero-slider-arrow.prev{left:16px;}
.hero-slider-arrow.next{right:16px;}
.hero-slider-dots{position:absolute; left:0; right:0; bottom:14px; display:flex; justify-content:center; gap:8px;}
.hero-slider-dots .dot{width:9px; height:9px; border-radius:50%; border:1.5px solid #fff; background:rgba(255,255,255,.35); padding:0; cursor:pointer;}
.hero-slider-dots .dot.is-active{background:#fff;}
@media (max-width:600px){
  .hero-slider{height:260px;}
  .hero-slide-cap{max-width:85%; font-size:11px;}
}

/* TOPページ：ヒーロー見出し（スマホ幅では他ページの見出しサイズに揃える） */
.fp-hero-title{font-size:64px; line-height:1.3; font-weight:900; letter-spacing:-.02em;}
.fp-pad-x{padding-left:32px; padding-right:32px;}
@media (max-width:920px){
  .fp-hero-title{font-size:38px;}
}
@media (max-width:600px){
  .fp-hero-title{font-size:30px;}
  .fp-pad-x{padding-left:20px; padding-right:20px;}
}

/* TOPページ：グリッドセクション（スマホ幅ではできるだけ1カラムに） */
.fp-grid{display:grid;}
.fp-grid-pillars{grid-template-columns:1fr 1fr;}
.fp-grid-photos{grid-template-columns:1fr 1fr 1fr;}
.fp-grid-kingyo{grid-template-columns:1fr 1fr;}
.fp-grid-stats{grid-template-columns:1fr 1fr;}
.fp-grid-gokingyo{grid-template-columns:.9fr 1.1fr;}
.fp-grid-icons{grid-template-columns:repeat(3,1fr);}
.fp-grid-machiaruki{grid-template-columns:1fr 1fr;}
.fp-grid-events{grid-template-columns:1fr 1fr;}

@media (max-width:820px){
  .fp-grid-photos{grid-template-columns:1fr 1fr;}
}
.pillars-break{display:none;}

@media (max-width:600px){
  .fp-grid-pillars,
  .fp-grid-photos,
  .fp-grid-kingyo,
  .fp-grid-gokingyo,
  .fp-grid-machiaruki,
  .fp-grid-events{grid-template-columns:1fr;}
  .pillars-break{display:inline;}
  .fp-grid-icons{grid-template-columns:repeat(3,1fr); gap:8px !important;}
}

/* マップ・アクセスページ：マップ拡大表示用ライトボックス */
.map-lightbox{position:fixed; inset:0; z-index:1000; background:rgba(20,18,15,.88); display:flex; align-items:center; justify-content:center; padding:32px; cursor:zoom-out;}
.map-lightbox[hidden]{display:none;}
.map-lightbox img{max-width:100%; max-height:100%; object-fit:contain; box-shadow:0 10px 40px rgba(0,0,0,.4);}
.map-lightbox-close{position:absolute; top:20px; right:24px; width:44px; height:44px; border:none; background:rgba(255,255,255,.15); color:#fff; font-size:26px; line-height:1; cursor:pointer; display:flex; align-items:center; justify-content:center;}
.map-lightbox-close:hover{background:rgba(255,255,255,.3);}