@charset "UTF-8";

/* =========================================================
   一般社団法人 全国燃料協会 — トップページ
   Figma: JCAFA / ホーム (Desktop 1280 / Mobile 375)
   ========================================================= */

:root {
  --color-accent:  #ffaf81;   /* オレンジ */
  --color-yellow:  #ffff81;   /* イエロー */
  --color-hero:    #d9d9d9;   /* ヒーロー背景グレー */
  --color-panel:   #fbfbf1;   /* パネル背景クリーム */
  --color-text:    #000000;
  --site-width:    1280px;    /* PC デザイン幅 */
  --content-width: 908px;     /* コンテンツカラム幅 */
}

* { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }

body {
  margin: 0;
  background: #ffffff;
  color: var(--color-text);
  font-family: "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  font-size: 16px;
  line-height: 1.875;          /* 30px / 16px */
  font-weight: 100;
}

img { display: block; max-width: 100%; height: auto; }
a   { color: inherit; text-decoration: none; }

.site {
  position: relative;
  width: var(--site-width);    /* PCは固定幅。狭めても縮小せず横スクロールで対応（SPでは100%に切替） */
  margin: 0 auto;
  background: #ffffff;
  overflow: hidden;            /* ヒーロー幅のはみ出し抑止 */
}

/* =========================================================
   ヒーロー
   ========================================================= */
.hero {
  position: relative;
  z-index: 0;                /* 重なりコンテキストを生成（動画を背面に固定） */
  height: 572px;
  overflow: hidden;
  background: var(--color-hero);
}

/* 背景ループ動画（コンテンツより確実に背面へ） */
.hero__video {
  position: absolute;
  inset: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  pointer-events: none;
}

/* PC グローバルナビ（元デザイン=Figma実測の位置：先頭「全国燃料協会について」の左端 x=350／各項目を元デザインの左端に合わせる） */
.gnav {
  position: absolute;
  top: 32px;
  left: 350px;
  display: flex;
  align-items: flex-start;
}
/* Figma の各項目左端に合わせる（直前項目右端→次項目左端の差分） */
.gnav__item:nth-child(2) { margin-left: 44.7px; }   /* 薪炭について x=570.5 */
.gnav__item:nth-child(3) { margin-left: 49.4px; }   /* 交通／アクセス x=722.2 */
.gnav__item:nth-child(4) { margin-left: 47.8px; }   /* 関連団体／リンク x=887.8 */
.gnav__item { position: relative; display: flex; align-items: center; }
/* SVGは Figma の実寸書き出し（175.78×15.64 等）。自然サイズで配置＝元デザインと画素一致 */
.gnav__item img { height: auto; width: auto; }
/* テキストの「ホーム」リンク（画像ラベルに合わせて白・中太・字間） */
.gnav__item--text {
  color: #ffffff;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: .08em;
  line-height: 16px;
  white-space: nowrap;
}

/* オンマウス時のみ表示するオレンジのドット（レイアウトに影響しない絶対配置） */
.gnav__dot {
  position: absolute;
  left: -23px;
  top: 50%;
  transform: translateY(-50%);
  width: 11px;
  height: 11px;
  border-radius: 50%;
  background: var(--color-accent);
  opacity: 0;
  transition: opacity .2s;
  pointer-events: none;
}
.gnav__item:hover .gnav__dot,
.gnav__item:focus-visible .gnav__dot { opacity: 1; }

/* 会員専用ボタン（PC：ヒーロー右上に絶対配置） */
.actions {
  position: absolute;
  top: 27px;
  right: 30px;
  z-index: 2;
  display: flex;
  flex-direction: column;
  gap: 15px;
}
.actions__btn { position: relative; transition: opacity .2s; }
.actions__btn:hover { opacity: .8; }
.actions__btn img { width: 166px; height: auto; display: block; }
/* 薪炭環境部会ボタンの外部リンクアイコン（Figma実測：上22px・右14px・2行目の高さ） */
.actions__btn--ext::after { content: ""; position: absolute; top: 22px; right: 14px; width: 14px; height: 14px;
  background: url("../images/icon_external.svg") center / contain no-repeat; }

/* ハンバーガー（PC では非表示） */
.hamburger {
  display: none;
  position: absolute;
  top: 16px;
  right: 19px;
  z-index: 30;
  width: 51px;
  height: 51px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.hamburger img { width: 100%; height: 100%; }

/* 展開時：同じ位置に×（閉じる）。フルスクリーンナビより前面に固定表示 */
.hamburger.is-open {
  position: fixed;
  z-index: 50;
  background: #ffffff;
  border-radius: 50%;
}
.hamburger.is-open img { display: none; }
.hamburger.is-open::before,
.hamburger.is-open::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  width: 26px;
  height: 3px;
  background: #3a3a3a;
  border-radius: 2px;
}
.hamburger.is-open::before { transform: translate(-50%, -50%) rotate(45deg); }
.hamburger.is-open::after  { transform: translate(-50%, -50%) rotate(-45deg); }

/* ロゴ */
.hero__logo {
  position: absolute;
  top: 247px;
  left: 758px;
  margin: 0;
}
.hero__logo img { width: 481px; height: auto; filter: brightness(0) invert(1); }  /* 濃色SVGロゴを白化（ヒーロー用） */

/* =========================================================
   メイン / コンテンツ
   ========================================================= */
.content {
  display: flex;
  flex-direction: column;
  padding: 26px 16px 0;   /* ヒーロー(572)下端→リード文(598) = 26px */
}

/* デスクトップでの並び順（intro → カード → ニュース → 予定） */
.intro            { order: 1; }
.cards            { order: 2; }
.block--news      { order: 3; }
.block--schedule  { order: 4; }
.mnav             { display: none; }   /* PC ではセクションナビ非表示 */

/* リード文 */
.intro {
  width: 611px;
  max-width: 100%;
  margin: 0 auto;
  text-align: center;
}
/* SP専用の改行（PCでは無効化） */
.br-sp { display: none; }

/* =========================================================
   バナーカード
   ========================================================= */
.cards {
  width: var(--content-width);
  max-width: 100%;
  margin: 17px auto 0;   /* リード文下端→カード(735) */
}
.cards__row {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 12px;
}
.cards__item { flex: 1 1 0; min-width: 0; transition: opacity .2s; }   /* 4枚を等幅。高さは画像比率で自動（下端が切れない） */
.cards__item:hover { opacity: .85; }
.cards__item img { display: block; width: 100%; height: auto; }

.cards__note {
  margin-top: -3px;                   /* Figma実測：相談室カード下端→注釈(826, ≈+8px)。バナー画像下の影余白ぶんを相殺 */
  margin-left: calc(100% - 214px);    /* 4枚目カード(相談室)の左端 x=880 に合わせる */
  width: max-content;
  font-size: 12px;
  line-height: 18px;
}
.cards__note p { margin: 0; }

/* =========================================================
   見出しパネル（ニュース / 今後の予定）
   ========================================================= */
.block {
  width: var(--content-width);
  max-width: 100%;
  margin: 13px auto 0;   /* カード/注釈下端→ニュースタイトル(911) */
}
.block--schedule { margin-top: 28px; }   /* ニュースボックス下端→予定タイトル(1395) */

.block__title {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 34px;
  margin: 0;
  border: 3px solid var(--color-accent);
  border-radius: 17px;
  background: #ffffff;
  font-size: 16px;
  font-weight: 500;
  letter-spacing: .04em;
}
/* 見出しSVG（ニュース/今後の予定）＝Figma書き出しの実寸で表示。
   ニュースはカタカナで字面が低く、同フォントサイズでも高さが小さい（だから2つは別サイズ）。 */
.block__title--img img { display: block; width: auto; }
.block--news     .block__title--img img { height: 12.14px; }   /* Figma実測（Desktop） */
.block--schedule .block__title--img img { height: 15.53px; }   /* Figma実測（Desktop） */

.panel {
  position: relative;
  width: 874px;
  max-width: 100%;
  height: 410px;         /* 2026-09 FIX版実測（874×410。旧399） */
  margin: 23px auto 0;   /* ニュースタイトル下端→ボックス(968) */
  background: var(--color-panel);
  border-radius: 8px;
  overflow: hidden;
}
.panel--schedule {
  height: 463px;             /* 2026-09 FIX版実測（874×463。旧296）。予定一覧は内部スクロール */
  margin-top: 30px;          /* 予定タイトル下端→ボックス(1459) */
}

/* スクロール領域（ネイティブのバーは隠し、カスタムバーで表示） */
.panel__viewport {
  height: 100%;
  overflow-y: auto;
  padding: 24px 56px 24px 27px;   /* 本文幅を元デザイン(約791px)に / 右はスクロールバー分 */
  scrollbar-width: none;          /* Firefox: ネイティブ非表示 */
}
.panel__viewport::-webkit-scrollbar { width: 0; height: 0; }   /* WebKit: ネイティブ非表示 */
.panel--schedule .panel__viewport { padding: 22px 56px 28px 40px; }   /* FIX版実測：年見出し上22 / 日付列 左40 */

/* カスタムスクロールバー（白トラック＋グレーつまみ＝iframe風・常時表示） */
.panel__bar {
  position: absolute;
  top: 2px;
  bottom: 2px;
  right: 2px;
  width: 16px;
  background: #ffffff;
  border: 1px solid #d6d6d7;
  border-radius: 2px;          /* 元デザイン：上端はほぼ四角 */
}
.panel__thumb {
  position: absolute;
  top: 2px;
  left: 50%;
  width: 10px;
  height: 16px;
  background: #d6d6d7;
  border-radius: 2px;          /* 元デザイン：角丸の小さい四角つまみ */
  transform: translateX(-50%);
  cursor: pointer;
}

.panel__text { margin: 0 0 48px; }   /* 段落間（元デザイン: 1段落目下端→2段落目 ≈48px） */
.panel__text:last-child { margin-bottom: 0; }
.panel__link { color: inherit; text-decoration: none; word-break: break-all; }
.panel__link:hover { text-decoration: underline; }

/* 今後の予定（2026-09 FIX版：年見出し＋「日付｜内容｜場所」3列。列位置はFigma実測 日付x302 / 内容x446 / 場所x809） */
.schedule__year { margin: 0 0 18px; font-size: 16px; line-height: 30px; }   /* 年見出し→1行目(48px) */
.schedule__list + .schedule__year { margin-top: 40px; }                    /* 前年の最終行→翌年見出し */
.schedule__list { margin: 0; }
.schedule__row {
  display: grid;
  grid-template-columns: 144px 363px 1fr;   /* 262+40=302 / 446 / 809 に一致 */
  column-gap: 0;
  padding: 12px 0;                          /* 1行の行ピッチ ≈54px（Figma 56〜58） */
  margin: 0;
  font-size: 16px;
  line-height: 30px;
}
.schedule__date  { padding-right: 12px; }
/* 内容・場所はFigma実測で行間25px（日付・年見出しは30px）。改行位置はHTMLの<br>でFIXの折り返しを再現 */
.schedule__event { padding-right: 16px; min-width: 0; line-height: 25px; }
.schedule__place { min-width: 0; line-height: 25px; }
.br-pc { display: inline; }                 /* PC専用の改行（SPでは無効化） */

/* =========================================================
   フッター
   ========================================================= */
.site-footer {
  margin-top: 60px;       /* Figma実測：予定パネル下端→フッター(58〜) */
  padding: 0 16px 40px;
  text-align: center;
}
/* フッター文字サイズ＝Figma実測（団体名14 / 住所12 / Copyright10、行送りは上端間隔24・28に一致） */
.site-footer__org  { margin: 0; font-size: 14px; line-height: 24px; }
.site-footer__addr { margin: 0; font-size: 12px; line-height: 28px; }
.site-footer__copy { margin: 4px 0 0; font-size: 10px; line-height: 20px; }   /* Copyright上の間隔をFigmaに合わせる */

/* =========================================================
   SP 用ドロワー / セクションナビ（PC では非表示）
   ========================================================= */
.drawer { display: none; }
.drawer__dot, .mnav__dot {
  width: 14px;
  height: 14px;
  margin-right: 10px;
  border-radius: 50%;
  background: var(--color-accent);
  flex: 0 0 auto;
}

/* =========================================================
   レスポンシブ（〜820px：スマートフォン）
   ========================================================= */
@media (max-width: 820px) {

  /* 本文は元デザイン同様 16px / 行間30px（ベースを継承） */

  .site { width: 100%; }

  /* SP：万一の横はみ出しで左右にドラッグできてしまうのを防止（保険）。
     PC（>820px）の 1280px 固定キャンバス＝意図的な横スクロールには影響しない。 */
  html, body { overflow-x: hidden; }

  /* --- ヒーロー（元デザイン@375準拠：ロゴ上99/下20、ボタンも動画背景の内側） --- */
  .hero {
    height: auto;
    padding: 99px 16px 20px;
    background: var(--color-hero);
    text-align: center;
  }
  .gnav { display: none; }
  .hamburger { display: block; }

  .hero__logo {
    position: relative;
    top: auto;            /* PC用の top:247px / left:758px をリセット（画面外飛び防止） */
    left: auto;
    z-index: 1;           /* 動画(z-index:-1)より確実に前面へ */
    display: flex;
    justify-content: center;
  }
  /* 元デザインの原寸。ただし狭い端末（〜342px）でロゴが画面外へ溢れないよう上限100% */
  .hero__logo img { width: 311px; max-width: 100%; }

  /* --- 会員専用ボタン（ヒーロー内＝背景動画の上に横並び） --- */
  .actions {
    position: relative;   /* PC用 top:27/right:30 をリセットしつつ動画より前面へ */
    top: auto;
    right: auto;
    left: auto;
    z-index: 1;
    flex-direction: row;
    justify-content: center;
    gap: 11px;            /* ボタン間 (Figma@375: 11px) */
    margin-top: 58px;     /* ロゴ下端→ボタン (Figma@375: 353-295=58) */
    padding: 0;
  }
  .actions__btn img { width: 160px; }

  /* --- フルスクリーンナビ（ハンバーガー展開） --- */
  .drawer {
    display: none;
    position: fixed;
    inset: 0;
    z-index: 40;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;
    padding: 24px;
    background: rgba(36, 31, 29, .985);
    overflow-y: auto;
  }
  .drawer.is-open { display: flex; }
  .drawer__item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 340px;
    padding: 22px 16px;
    color: #fff;
    font-size: 19px;
    font-weight: 700;
    border-bottom: 1px solid rgba(255, 255, 255, .15);
  }

  /* --- コンテンツ並び順（intro → ナビ → ニュース → 予定 → カード） --- */
  .content { padding: 0 16px; }
  .intro           { order: 1; width: 100%; margin: 27px auto 0; text-align: center; }  /* ヒーロー→リード(Figma@375: 454-427=27) */
  .br-sp { display: inline; }   /* SPでは改行を有効化（元デザインの9行） */
  .mnav            { order: 2; display: flex; }
  .block--news     { order: 3; margin-top: 24px; }   /* mnav→ニュース見出し(Figma@375 可視枠: 1013-989=24) */
  .block--schedule { order: 4; }
  .cards           { order: 5; }

  /* --- SP セクションナビ（縦並びリスト） --- */
  .mnav {
    flex-direction: column;
    width: 100%;
    margin: 32px 0 0;     /* リード→mnav (Figma@375: 763-731=32) */
    border-top: 1.4px solid var(--color-accent);
  }
  .mnav__item {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 21px 8px;    /* 行高 ≈56px (Figma@375: 区切り線間隔 56.3px) */
    border-bottom: 1.4px solid var(--color-accent);
  }
  .mnav__item img { height: 14px; width: auto; }
  .mnav__label { filter: brightness(0); }   /* 白SVGラベルをSP本文用に濃色化 */
  /* テキストの「ホーム」リンク（画像ラベルに合わせて濃色・中太・字間） */
  .mnav__item--text { font-size: 16px; font-weight: 500; letter-spacing: .08em; color: #1a1a1a; }

  /* --- カード（タブレットは SPバナーを 2列×2段） --- */
  .cards { width: 100%; margin: 33px auto 0; }   /* 予定パネル→カード (Figma@375: 1633-1600=33) */
  .cards__row {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-auto-rows: 1fr;       /* 2段の行高さを揃える（マージンのガタつき防止） */
    align-items: end;          /* 下揃え：角丸rectの下辺（=上辺）を揃える */
    gap: 24px;
  }
  .cards__item img { width: 100%; }
  /* 注釈は最後のバナー（右下＝右カラム）の左端に揃えて左寄せ・16px / 行間30px
     右カラム左端 = 50% + gap(24px)の半分 */
  .cards__note { margin-left: calc(50% + 12px); margin-top: 10px; font-size: 16px; line-height: 30px; }

  /* --- パネル --- */
  .block { width: 100%; }
  .block__title { border-width: 4px; }   /* SPは枠線をやや太く（元デザイン準拠） */
  .block--news     .block__title--img img { height: 10.12px; }   /* 見出しSVG：Figma@375実測 */
  .block--schedule .block__title--img img { height: 14px; }      /* 見出しSVG：Figma@375実測 */
  .block--schedule { margin-top: 28px; }   /* ニュースパネル→予定見出し(Figma@375 可視枠: 1320-1292=28) */
  .panel { width: 100%; height: 456px; margin-top: 22px; }   /* 見出し→パネル(Figma@375 可視枠: 1068-1046=22)・パネル高456（2026-09 FIX版実測。旧224） */
  .panel--schedule { height: 507px; margin-top: 24px; }      /* 予定見出し→パネル(Figma@375 可視枠: 1376-1352=24)・パネル高507（FIX版実測。旧224） */
  .panel__viewport { padding: 15px 30px 15px 17px; }          /* FIX版実測：本文 上15・左17 */
  .panel__text { line-height: 25px; }                          /* FIX版SPニュース本文＝16px/行間25 */
  .panel--schedule .panel__viewport { padding: 11px 26px 12px 10px; }   /* FIX版実測：年見出し上11・日付列 左10 */
  /* SPの予定：「日付(15px)｜内容＋［場所］」の2列。場所は内容の下行に［ ］付きで表示（Figma@375準拠） */
  .br-pc { display: none; }
  .schedule__year { margin: 0 0 5px; }
  .schedule__list + .schedule__year { margin-top: 24px; }
  .schedule__row {
    grid-template-columns: 117px 1fr;      /* 日付x1437→内容x1554 = 117px */
    grid-template-areas: "date event" "date place";
    padding: 11px 0;                        /* 行ピッチ：内容2行+場所1行(66)+22 = 88（Figma実測） */
    font-size: 16px;
    line-height: 22px;
  }
  .schedule__date  { grid-area: date; font-size: 15px; padding-right: 10px; }
  .schedule__event { grid-area: event; padding-right: 0; line-height: 22px; }
  .schedule__place { grid-area: place; line-height: 22px; }
  .schedule__place::before { content: "［"; }
  .schedule__place::after  { content: "］"; }

  .site-footer { margin-top: 39px; padding-bottom: 32px; }   /* Figma@375：注釈下端→フッター(51) */
  /* SPフッター文字サイズ＝Figma実測（団体名14 / 住所12 / Copyright8、上端間隔25・28） */
  .site-footer__org  { font-size: 14px; line-height: 25px; }
  .site-footer__addr { font-size: 12px; line-height: 28px; }
  .site-footer__copy { font-size: 8px;  line-height: 20px; }
}

/* スマートフォン（≤600px）：1列（縦積み）。タブレット帯(601〜820px)は2列×2段 */
@media (max-width: 600px) {
  .cards__row {
    grid-template-columns: 1fr;     /* 1列 */
    grid-auto-rows: auto;           /* タブレットの行高さ揃えを解除（各カード自然な高さ） */
    align-items: stretch;
    gap: 0;                         /* バナー毎に個別マージン（下記）で間隔を指定 */
    justify-items: center;
  }
  .cards__item { width: 100%; max-width: 335px; }   /* SPバナー原寸幅で中央（引き伸ばし防止） */
  /* 注釈：Figma@375＝18px/行送り30、左端 x≈28（バナー左端+8）。バナー(335幅中央)に揃える */
  .cards__note { width: 335px; max-width: 100%; margin-left: auto; margin-right: auto; padding-left: 8px;
                 font-size: 18px; line-height: 30px; text-align: left; }
  /* Figma実測のカード矩形間隔(27/28/32px)に一致させる個別マージン。
     SPバナー画像は建物/人物/影が枠外にはみ出すため、はみ出し分を見込んで調整。 */
  /* バナー画像は上下に余白統一済み（カードは各画像の同じ位置）。負マージンで余白を詰めカード間隔を 27/28/32 に */
  .cards__item:nth-child(2) { margin-top: -11px; }   /* 会館→沿革 */
  .cards__item:nth-child(3) { margin-top: -9px; }    /* 沿革→FAQ */
  .cards__item:nth-child(4) { margin-top: -5px; }    /* FAQ→相談室 */
  .cards__item:last-child { margin-bottom: -24px; }  /* 末尾バナー下の余白(影用)ぶんを相殺 */
}

/* タブレット限定（601〜820px）：バナー画像は上下余白統一済みなのでカードは自動で揃う。
   余白ぶん行間が開くため、下段を負マージンで詰めて縦の隙間を整える（沿革の影は隙間に収まる）。 */
@media (min-width: 601px) and (max-width: 820px) {
  .cards__row { row-gap: 0; }
  .cards__item:nth-child(3), .cards__item:nth-child(4) { margin-top: -10px; }
}

/* ごく小さい画面の微調整 */
@media (max-width: 400px) {
  .actions { flex-wrap: wrap; }
  /* 予定は日付列＋本文列の横並び（ぶら下げ）を維持。縦積みにすると本文が年月の下に回り込むため指定しない */
}

/* =========================================================
   第2階層（コンテンツページ）共通レイアウト
   ========================================================= */
.site--page { background: #ffffff; }

/* --- ヘッダー（白背景・濃色ロゴ） --- */
/* Figma実測(Desktop 1280基準)：ロゴ top41・幅462中央 / 会員ボタン top63・right73・幅166・gap15 */
.phead { position: relative; padding: 41px 0 0; }
.phead__logo { margin: 0; text-align: center; line-height: 0; }
.phead__logo img { display: inline-block; width: 462px; max-width: 90%; height: auto; }
.phead__actions { position: absolute; top: 63px; right: 73px; display: flex; flex-direction: column; gap: 15px; }
.phead__actions img { width: 166px; height: auto; }
.phead__actions a { transition: opacity .2s; }
.phead__actions a:hover { opacity: .8; }

/* 上部グローバルナビ（Figma準拠：固定4枠・18px黒字。現在セクション＝黒字＋オレンジ#ffaf81塗りボックス）
   枠位置：全国燃料協会について=サイドバー列(x83) / 薪炭=x366 / 交通=x573 / 関連=x780。
   列幅 283(=サイドバー225+gap58)/207/207/1fr で Figma実測 x369・573・784 に一致。 */
.gnav2 {
  display: grid;
  grid-template-columns: 283px 207px 207px 1fr;
  align-items: center;
  margin: 45px 0 0; padding: 0 73px 0 83px;
  font-size: 18px; font-weight: 500; line-height: 1.2; letter-spacing: .02em;
}
.gnav2 a { justify-self: start; color: #1a1a1a; white-space: nowrap; }
.gnav2 a:hover { color: var(--color-accent); }
.gnav2 .is-current,
.gnav2 .is-current:hover {
  color: #000; background: var(--color-accent);
  padding: 3px 8px; border-radius: 2px;
}

/* --- 2カラム（左サイドバー＋本文） --- */
.page { display: grid; grid-template-columns: 225px 1fr; gap: 58px; padding: 34px 73px 0 83px; }

/* サイドバー（ローカルナビ）：Figmaでは見出しボックスは無く、グロナビ左枠が見出しを兼ねる。
   現在ページ項目＝黒字＋オレンジ#ffaf81塗りボックス（テキスト幅にフィット）。他項目＝黒字＋灰下線。 */
.side { min-width: 0; }
.side__title { display: none; }                 /* PCではグロナビ左枠が見出し。SPでのみ表示 */
.side__nav { list-style: none; margin: 0; padding: 0; }
.side__nav li + li { margin-top: 15px; }        /* 行ピッチ ≈47px（Figma実測：230/277/325…） */
.side__nav a { display: inline-block; padding: 4px 0; color: #1a1a1a; font-size: 16px; line-height: 1.5;
  text-decoration: underline; text-decoration-color: #606060; text-decoration-thickness: 1px; text-underline-offset: 3px; }
.side__nav a::before { content: "・"; }
.side__nav a:hover { color: var(--color-accent); }
/* 現在項目＝黒字＋オレンジ塗りボックス。Figma同様、通常ウェイト＋濃灰下線（下線はベース .side__nav a を継承） */
.side__nav .is-current a {
  padding: 4px 6px; background: var(--color-accent); color: #000;
  font-weight: 400; border-radius: 2px;
}

/* 本文 */
.pmain { min-width: 0; }
/* ページタイトル（ピル）：高さ34px・完全なピル形（角丸=高さの半分）。文字間隔はFigma実測(約0.07em)に合わせ広げる。
   line-height継承(1.875)で背が伸びると角丸が浅く見えるため抑える */
.block__title--page { width: 100%; height: auto; min-height: 34px; margin: 0; padding: 3px 16px; font-size: 17px; line-height: 1.3; letter-spacing: .07em; border-radius: 999px; }

/* ピル直後の最初のコンテンツとの余白（Figma実測に合わせる）。
   FigmaはテキストBOXの行間が広く見出しが下に沈むため、詰まって見えるページを広げる。
   ※隣接セレクタで「ピル直下の最初の要素」だけを対象にし、ページ内の以降の同種要素は不変。 */
.pmain > .block__title--page + .deflist  { margin-top: 40px; }   /* 事業概要 */
.pmain > .block__title--page + .roster   { margin-top: 40px; }   /* 役員 */
.pmain > .block__title--page + .htime    { margin-top: 40px; }   /* 沿革 */
.pmain > .block__title--page + .shead    { margin-top: 40px; }   /* 交通/アクセス・FAQ索引・新用途/オガ炭 */
.pmain > .block__title--page + section    { margin-top: 40px; }   /* 種類/規格・木炭のおはなし・木酢/竹酢（section包み） */
.pmain > .block__title--page + .kk-sec   { margin-top: 40px; }   /* 会館のご案内（.kk-sec:first-child を上書き） */
.pmain > .block__title--page + .org-sec  { margin-top: 30px; }   /* 関連団体（Figma実測＝他より浅め） */
.pmain > .block__title--page + .faq-acat { margin-top: 40px; }   /* FAQ回答ページ（.faq-acat:first-child を上書き） */
.block__title--page + .lead              { margin-top: 18px; }   /* 会員専用（pillが.memo-sec内のため.pmain>を付けない） */

.deflist { margin: 26px 0 0; }
.deflist dt { margin: 26px 0 0; font-size: 18px; font-weight: 500; line-height: 1.5; }
.deflist dt:first-child { margin-top: 0; }
.deflist dt::before { content: "● "; }
.deflist dd { margin: 6px 0 0; font-size: 16px; line-height: 30px; }
.deflist + .block__title--page { margin-top: 44px; }

/* 組織図（ピル見出しは画像に内包・655px幅） */
.orgchart { margin: 44px 0 0; text-align: left; }
.orgchart img { width: 655px; max-width: 100%; height: auto; }

.site--page .site-footer { margin-top: 64px; }

/* 本文テキスト（会長挨拶・社員一覧 等） */
.prose { margin: 30px 0 0; }
.prose p { margin: 0; font-size: 16px; line-height: 30px; }
.prose p + p { margin-top: 22px; }
.prose__sub { font-weight: 500; }            /* ●で始まる小見出し行 */
.prose__sub::before { content: ""; }

/* 画像枠（汎用） */
.imgbox { margin: 34px 0 0; display: block; }
.imgbox img { display: block; max-width: 100%; height: auto; }

/* 会長ご挨拶（2026-09 FIX版実測：本文17px/行間38px・841px幅、ピル→本文33px、写真428×321は本文下50px、署名17px/32px は写真下16px） */
.prose--greeting { margin-top: 33px; max-width: 841px; }
.prose--greeting p { font-size: 17px; line-height: 38px; }
.greeting__photo { margin: 50px 0 0; }
.greeting__photo img { display: block; width: 428px; max-width: 100%; height: auto; }
.greeting__sign { margin: 16px 0 0; font-size: 17px; line-height: 32px; }

/* 役員リスト（●区分見出し ＋ 氏名／都道府県） */
.roster { margin: 24px 0 0; }
.roster__group { margin-top: 32px; }
.roster__group:first-child { margin-top: 0; }
.roster__head { margin: 0; font-size: 18px; font-weight: 500; line-height: 1.5; }
.roster__head::before { content: "● "; }
.roster__list { margin: 10px 0 0; padding: 0; list-style: none; }
.roster__row { font-size: 16px; line-height: 30px; }
.roster__name { display: inline-block; width: 140px; vertical-align: top; }
.roster__name .mei { margin-left: 1em; }
.roster__pref { display: inline-block; margin-left: 14px; }
/* 沿革タイムライン（●和暦・西暦 ＋ 説明 ＋ 会館写真＋キャプション） */
.htime { margin: 24px 0 0; }
.htime__item { margin-top: 30px; }
.htime__item:first-child { margin-top: 0; }
.htime__year { margin: 0; font-size: 18px; font-weight: 500; line-height: 1.5; }
.htime__year::before { content: "● "; }
.htime__text { margin: 8px 0 0; font-size: 16px; line-height: 30px; }
.htime__figure { margin: 22px 0 0; }
.htime__figure img { display: block; max-width: 100%; height: auto; }
.htime__cap { margin: 12px 0 0; font-size: 16px; line-height: 30px; }

/* 会館のご案内（建物概要・設備概要・貸駐車場 等） */
.kk-sec { margin-top: 42px; }
.kk-sec:first-child { margin-top: 26px; }
.kk-head { margin: 0; font-size: 18px; font-weight: 500; line-height: 1.5; }
.kk-head::before { content: "● "; }
.kk-list { margin: 16px 0 0; padding: 0; list-style: none; }
.kk-list li { font-size: 16px; line-height: 30px; }
.kk-list + .kk-list { margin-top: 14px; }
.kk-sub { margin: 24px 0 0; font-size: 16px; font-weight: 700; }
.kk-detail { margin: 6px 0 0; padding-left: 1em; }
.kk-detail p { margin: 0; font-size: 16px; line-height: 30px; }
.kk-note { margin: 16px 0 0; font-size: 16px; line-height: 30px; }

/* 店舗ご紹介（テナント：フロア＋名称＋ロゴ＋内装写真） Figma実測準拠 */
.shoplist { margin: 10px 0 0; }
.shop { display: flex; align-items: flex-start; width: 715px; padding: 27px 0 38px;
  border-top: 1px solid #7f7f7f; }
.shop:last-child { border-bottom: 1px solid #7f7f7f; }
.shop__label { width: 335px; flex: none; }
.shop__head { display: flex; align-items: flex-start; }
.shop__floor { width: 78px; flex: none; margin: 0; font-size: 30px; font-weight: 400; line-height: 30px; color: #000; }
.shop__name { margin: 0; font-size: 16px; font-weight: 500; line-height: 30px; color: #000; }
.shop__name a { color: #000; text-decoration: underline; text-underline-position: from-font; }
.shop__cuisine { display: block; font-weight: 400; }     /* 業態：下線なし */
.shop__logo { margin: 20px 0 0; }
.shop__logo img { display: block; height: auto; }
.shop--sante  .shop__logo img { width: 303px; }
.shop--inaba  .shop__logo img { width: 130px; }
.shop--hirano .shop__logo img { width: 86px; }
.shop--ichi   .shop__logo img { width: 84px; }
.shop--jisaku .shop__logo img { width: 219px; }
.shop--inaba  .shop__logo, .shop--hirano .shop__logo, .shop--ichi .shop__logo { margin-left: 78px; } /* ロゴを店名列に揃える */
.shop__media { flex: none; width: 380px; min-width: 0; }
.shop__media img { display: block; width: 100%; height: auto; }

/* 貸駐車場：写真は右寄せ（Figma実測 x758・幅321px・右端1080で店舗写真と揃え） */
.kk-parking { margin: 32px 0 0; width: 715px; max-width: 100%; text-align: right; }
.kk-parking img { display: inline-block; width: 321px; max-width: 100%; height: auto; }

/* ===== 薪炭について（PDFカード・相談室 等） ===== */
.shead { margin: 0; font-size: 18px; font-weight: 700; line-height: 1.5; }
.shead::before { content: "●"; margin-right: 6px; }
.shead--gap { margin-top: 50px; }
.lead { margin: 14px 0 0; font-size: 16px; line-height: 30px; }
.sdiv { margin: 44px 0 30px; border: none; border-top: 2px solid #f0c9a8; }

/* PDF アイコン（書類型 SVG・共通）Figma実測：viewBox 35×39（34.69×38.12） */
.pdf-ico { display: inline-block; width: 26px; height: 29px; flex: none;
  background: url(../images/icon_pdf.svg) center / contain no-repeat; }

/* カードグリッド */
.pdfgrid { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 32px 57px; margin: 22px 0 0; }
.pdfcell { width: 119px; display: flex; flex-direction: column; }

/* オレンジカード（種類/規格・使い方）Figma：アイコン右上角・本文は中央 */
.pdfcard { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: center;
  width: 119px; min-height: 167px; padding: 14px 10px; box-sizing: border-box;
  background: #fce7d8; border-radius: 2px; color: #1a1a1a;
  text-align: center; font-size: 14px; line-height: 1.55; transition: background .2s; }
.pdfcard:hover { background: #fbd9c2; }
.pdfcard .pdf-ico { position: absolute; top: 7px; right: 6px; margin: 0; }
.pdfcard__cap-ext { width: 119px; margin: 10px 0 0; font-size: 12px; line-height: 1.6; color: #333; }

/* サムネカード（おはなし・木酢液） */
.pdfcard--thumb { display: block; width: 120px; min-height: 0; padding: 0; background: none; }
.pdfcard--thumb:hover { background: none; }
.pdfcard__thumb { position: relative; display: block; width: 120px; height: 170px; border: 1px solid #d0d0d0; box-sizing: border-box; }
.pdfcard__thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.pdfcard__thumb .pdf-ico { position: absolute; top: 8px; right: 8px; width: 24px; height: 27px; }
.pdfcard__cap { margin: 12px 0 0; font-size: 13px; line-height: 1.7; color: #1a1a1a; text-align: left; display: block; }

/* Adobe Reader 注記 */
.adobe-note { display: flex; gap: 16px; align-items: flex-start; margin: 40px 0 0; padding-top: 28px; border-top: 2px solid #f0c9a8; }
.adobe-note .pdf-ico { width: 35px; height: 39px; margin-top: 2px; }   /* Figma実測 34.69×38.12（フルサイズ） */
.adobe-note__txt { margin: 0; font-size: 14px; line-height: 1.85; }
.adobe-note__btn { display: inline-block; margin-top: 16px; }
.adobe-note__btn img { display: block; width: 128px; height: auto; }

/* 相談室（炭と木酢 相談室） */
.counsel { margin: 26px 0 0; font-size: 16px; line-height: 30px; }
.counsel a { color: #1a1a1a; text-decoration: underline; text-underline-position: from-font; }
.counsel__lead { margin: 0; }
.counsel__dl { margin: 28px 0 0; }
.counsel__row { display: flex; gap: 14px; }
.counsel__row + .counsel__row { margin-top: 8px; }
.counsel__key { flex: none; }
.counsel__price { margin: 26px 0 0; }
.counsel__price .indent { display: inline-block; padding-left: 1em; }
.counsel__sub { margin: 30px 0 0; font-size: 18px; font-weight: 500; }
.counsel__sub::before { content: "● "; }

/* ===== FAQ（質問インデックス＋回答ページ・クリックで回答へジャンプ） ===== */
.faq-intro { margin: 22px 0 0; padding: 26px 30px; background: #fbcfa8; border-radius: 14px; }
.faq-intro__txt { margin: 0; font-size: 17px; font-weight: 700; line-height: 1.9; }
/* マスコット／トリビアのバブル画像 */
.faq-bubble { margin: 30px 0 0; }
.faq-bubble--intro { margin: 22px 0 0; }
.faq-bubble img { display: block; width: 643px; max-width: 100%; height: auto; }
/* 質問インデックス */
.faq-cat { margin: 48px 0 0; font-size: 17px; font-weight: 700; line-height: 1.5; }
.faq-cat__rule { margin: 12px 0 0; border: none; border-top: 1px solid #f0c9a8; }
.faq-qlist { margin: 16px 0 0; padding: 0; list-style: none; }
.faq-qlist li + li { margin-top: 2px; }
.faq-qlist a { display: flex; gap: 14px; padding: 5px 0; color: #1a1a1a; text-decoration: none; }
.faq-qlist a:hover { color: var(--color-accent); }
.faq-qlist .qn { flex: none; color: var(--color-accent); font-weight: 700; }
.faq-qlist .qt { text-decoration: underline; }
.faq-qlist a:hover .qt { text-decoration: none; }
/* 回答ページ */
.faq-acat { margin: 46px 0 0; font-size: 18px; font-weight: 700; line-height: 1.5; }
.faq-acat:first-child { margin-top: 26px; }
.faq-acat__rule { margin: 12px 0 0; border: none; border-top: 1.5px solid var(--color-accent); }
.faq-ans { margin: 26px 0 0; scroll-margin-top: 16px; }
.faq-ans__q { margin: 0; font-size: 16px; font-weight: 700; line-height: 28px; }
.faq-ans__q .qn { color: var(--color-accent); margin-right: 10px; }
.faq-ans__a { margin: 8px 0 0; font-size: 16px; line-height: 30px; }
.faq-ans__a .am { font-weight: 700; margin-right: 8px; }
.faq-ans__a a { color: #1a1a1a; text-decoration: underline; text-underline-position: from-font; word-break: break-all; }   /* 回答内の資料URLリンク（Q23） */
.faq-ans__a a:hover { color: var(--color-accent); }
.faq-back { display: inline-block; margin: 48px 0 0; font-size: 16px; color: #1a1a1a; text-decoration: underline; }
.faq-back::before { content: "▲ "; color: var(--color-accent); text-decoration: none; }

/* ===== 関連団体／リンク ===== */
.org-sec + .org-sec { margin-top: 46px; }
/* 関連団体（団体名｜設立 の2列表） */
.orgtable { border-collapse: collapse; width: 100%; max-width: 830px; margin: 20px 0 0; }
.orgtable th { position: relative; width: 50%; text-align: left; font-size: 16px; font-weight: 500; padding: 0 24px 8px 0; }
.orgtable th::before { content: "・"; }
/* 下線は列ごとに引き、列間(右パディング24px)を空けて2本の線に見せる */
.orgtable th::after { content: ""; position: absolute; left: 0; right: 24px; bottom: 0; border-bottom: 1px solid #bbb; }
.orgtable td { font-size: 16px; line-height: 1.7; padding: 11px 24px 0 0; vertical-align: top; }
.orgtable a { color: #1a1a1a; text-decoration: underline; }
.orgtable a:hover { color: var(--color-accent); }
/* リンク一覧 */
.linklist { margin: 16px 0 0; padding: 0; list-style: none; }
.linklist li { font-size: 16px; line-height: 1.4; }
.linklist a { display: inline-block; padding: 7px 0; color: #1a1a1a; text-decoration: underline; }
.linklist a::before { content: "・"; text-decoration: none; }
.linklist a:hover { color: var(--color-accent); }
/* 会員/社員一覧テーブル（shinyouto/ogatan＝地区｜法人名｜住所｜電話番号、members＝区分.kbn｜会社名.nm｜住所｜電話番号.tel） */
.memtable { border-collapse: collapse; width: 100%; margin: 20px 0 0; font-size: 15px; }
.memtable th { text-align: left; font-weight: 700; padding: 2px 16px 10px 0; border-bottom: 2px solid #999; white-space: nowrap; }
.memtable td { padding: 11px 16px 11px 0; border-bottom: 1px solid #e5e5e5; vertical-align: top; line-height: 1.6; }
.memtable .reg { font-weight: 700; white-space: nowrap; }
.memtable .kbn { white-space: nowrap; font-weight: 500; }
.memtable .nm { min-width: 9em; }
.memtable .nm a { color: #1a1a1a; text-decoration: underline; }
.memtable .nm a:hover { color: var(--color-accent); }
.memtable .tel { white-space: nowrap; }
/* PC：地区グループの境目を濃い線で区切る（地区内の各社は薄い線・Figma準拠）。.reg(地区rowspan)を持つ表＝shinyoutoのみ対象 */
@media (min-width: 821px) {
  /* 2px＝既存の薄い1px(#e5e5e5)とのborder-collapse衝突に勝たせる（同太さだと上セル側が優先され薄いまま残るため） */
  .memtable:has(.reg) tbody tr:has(.reg) > td { border-top: 2px solid #999; }
  .memtable:has(.reg) tbody tr:last-child > td { border-bottom: 2px solid #999; }
}

/* ===== 交通／アクセス ===== */
.access__info { margin: 22px 0 0; }
.access__info p { margin: 0; font-size: 16px; line-height: 32px; }
.access__info .lbl { display: inline-block; width: 3.2em; }
.access__map { margin: 30px 0 0; }
.access__map iframe { display: block; width: 828px; max-width: 100%; aspect-ratio: 828 / 466; height: auto; border: 0; border-radius: 2px; }
.access__maplink { display: inline-block; margin: 12px 0 0; font-size: 15px; color: #1a1a1a; text-decoration: underline; }
.access__train { margin: 32px 0 0; padding: 0; list-style: none; }
.access__train li { font-size: 16px; line-height: 1.9; }
.access__train li::before { content: "●"; color: var(--color-accent); margin-right: 10px; }
.access__train .line { display: inline-block; min-width: 15em; }
.access__note { margin: 32px 0 0; }
.access__note p { margin: 0; font-size: 16px; line-height: 30px; }
.access__note p + p { margin-top: 8px; }
.access__note p::before { content: "・"; }
/* 問い合わせフォーム（仮・仕様は任意） */
.iform { margin: 28px 0 0; max-width: 760px; }
.iform__row { margin-top: 20px; }
.iform__label { display: block; font-size: 15px; font-weight: 500; margin: 0 0 7px; }
.iform .req { margin-left: 8px; font-size: 12px; color: #fff; background: #d24b3e; border-radius: 3px; padding: 1px 6px; vertical-align: 1px; }
.iform input, .iform textarea { width: 100%; box-sizing: border-box; padding: 11px 13px; border: 1px solid #c8c8c8; border-radius: 4px; font: inherit; font-size: 15px; background: #fcfcfc; }
.iform input:focus, .iform textarea:focus { outline: 2px solid var(--color-accent); border-color: var(--color-accent); }
.iform textarea { min-height: 150px; resize: vertical; }
.iform__submit { margin-top: 28px; text-align: center; }
.iform__btn { display: inline-block; min-width: 220px; padding: 14px 36px; background: var(--color-accent); color: #fff; border: none; border-radius: 6px; font: inherit; font-size: 16px; font-weight: 700; cursor: pointer; transition: opacity .2s; text-decoration: none; text-align: center; }
.iform__btn:hover { opacity: .85; }
.iform__btn--back { background: #8a8a8a; min-width: 180px; }

/* ハニーポット（bot対策）：画面外に退避して人には見せない（display:none だと一部botが除外するため位置で隠す） */
.iform__hp { position: absolute; left: -9999px; top: auto; width: 1px; height: 1px; overflow: hidden; }
.iform__hp input { width: 1px; height: 1px; padding: 0; border: 0; }

/* 同意チェック */
.iform__agree { margin: 26px 0 0; text-align: center; font-size: 15px; line-height: 1.8; }
.iform__agree input { width: auto; margin-right: 8px; vertical-align: -2px; }
.iform__agree a { color: var(--color-accent); text-decoration: underline; }

/* バリデーションエラー */
.iform__errors { margin: 0 0 20px; padding: 14px 18px; background: #fdecea; border: 1px solid #d24b3e; border-radius: 4px; color: #b3261e; font-size: 14px; line-height: 1.9; }
.iform__errors ul { margin: 0; padding-left: 1.3em; }

/* 会員専用ページ ログインフォーム */
.iform--login { max-width: 420px; margin-left: auto; margin-right: auto; }
.iform--login .iform__row { margin-top: 0; }
.memo-logout { margin: 40px 0 0; text-align: right; font-size: 14px; }
.memo-logout a { color: #888; text-decoration: underline; }

/* 複数ボタン（確認画面の「修正する／送信する」） */
.iform__submit { margin-top: 30px; text-align: center; }
.iform__submit--multi { display: flex; gap: 16px; justify-content: center; align-items: center; flex-wrap: wrap; }

/* 確認画面（入力内容の表示） */
.iconf { margin: 26px 0 0; max-width: 760px; border-top: 1px solid #e4e4e4; }
.iconf__row { display: flex; gap: 16px; padding: 16px 6px; border-bottom: 1px solid #e4e4e4; }
.iconf__label { flex: none; width: 190px; font-weight: 500; font-size: 15px; }
.iconf__val { flex: 1; min-width: 0; font-size: 15px; line-height: 1.85; white-space: pre-wrap; word-break: break-word; }
.iconf__lead { margin: 0 0 6px; font-size: 16px; line-height: 30px; }

/* 完了画面 */
.icomp { margin: 28px 0 0; max-width: 760px; font-size: 16px; line-height: 1.9; }
.icomp__lead { margin: 0 0 12px; font-size: 18px; font-weight: 700; }
.icomp__home { margin-top: 30px; text-align: center; }

/* 個人情報保護方針（単一カラムの utility ページ） */
.page--single { grid-template-columns: minmax(0, 1fr); }
.policy { margin: 8px 0 0; max-width: 860px; font-size: 16px; line-height: 30px; color: #1a1a1a; }
.policy > * { margin: 14px 0 0; }
.policy > :first-child { margin-top: 0; }
.policy__h { margin-top: 32px; font-size: 17px; font-weight: 700; line-height: 1.5; }
.policy__list { padding-left: 1.5em; }
.policy__rev { margin-top: 34px; }

/* ===== 会員専用ページ ===== */
.memo-sec { scroll-margin-top: 16px; }
.memo-sec + .memo-sec { margin-top: 48px; }
.memo-doc { margin: 16px 0 0; padding: 0; list-style: none; }
.memo-doc li { font-size: 16px; line-height: 2; }
.memo-doc a { color: #1a1a1a; text-decoration: underline; }
.memo-doc a::before { content: "・"; text-decoration: none; }
.memo-doc a:hover { color: var(--color-accent); }
.kaiho { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 28px 62px; margin: 18px 0 0; }
.kaiho__item { flex: none; }
.kaiho__no { margin: 0 0 12px; font-size: 16px; line-height: 1.6; }
.kaiho__cover { display: inline-block; position: relative; }
.kaiho__cover img { display: block; height: 170px; width: auto; border: 1px solid #d0d0d0; box-sizing: border-box; }

/* --- 第2階層 レスポンシブ（≤820px） --- */

/* --- 第2階層 レスポンシブ（≤820px） --- */
@media (max-width: 820px) {
  /* 第2階層ヘッダー（SP）＝ロゴ左寄せ＋メニュー画像(右上)。Figma実測(Mobile)：ロゴ left27/top21・幅213px、ハンバーガー right16/top15・51px */
  .phead { padding: 21px 16px 0; }
  .phead__logo { text-align: left; padding-left: 11px; }   /* 中央寄せを解除しFigma同様に左寄せ(left=16+11=27) */
  .phead__logo img { width: 213px; max-width: 72%; }
  .phead__actions { display: none; }   /* SP はハンバーガー側に集約 */
  .gnav2 { display: none; }
  /* SPハンバーガー＝共有メニュー画像(menu.png＝オレンジ丸＋三本線)。開時は既存の白丸×へ */
  .site--page .hamburger:not(.is-open) { background: url("../images/sp/menu.png") center / 51px 51px no-repeat; }
  .site--page .hamburger:not(.is-open) img { display: none; }   /* 画像にオレンジ丸＋三本線が含まれるため内側の三本線imgは非表示 */
  .page { grid-template-columns: 1fr; gap: 0; padding: 26px 16px 0; }
  .side { margin-bottom: 26px; }
  /* SP：見出し（現在セクション名）を黒字中央で表示。グロナビ左枠はSPでは出ないため復活させる */
  .side__title { display: block; text-align: center; background: none; color: #1a1a1a; font-weight: 700; font-size: 16px; padding: 12px 8px; }
  .side__nav { border-top: 1.4px solid var(--color-accent); }
  .side__nav li { border-bottom: 1.4px solid var(--color-accent); }
  .side__nav li + li { margin-top: 0; }                 /* PCの行間をリセット（SPは区切り線で表現） */
  .side__nav a { display: block; text-align: center; text-decoration: none; padding: 16px 8px; font-size: 16px; font-weight: 400; }
  .side__nav a::before { content: "● "; color: var(--color-accent); }
  /* SP現在ページ項目＝淡橙塗り＋黒字（全幅行） */
  .side__nav .is-current a { background: #fdeee3; color: #000; font-weight: 400; padding: 16px 8px; border-radius: 0; }
  .block__title--page { border-width: 4px; }
  .orgchart img { width: 100%; }
  .roster__name { width: 140px; }
  /* SP：沿革写真は中央寄せ・キャプションは左寄せのまま */
  .htime__figure img { max-width: 100%; margin-left: auto; margin-right: auto; }
  /* SP：会長ご挨拶（FIX@375実測：本文17px/行間32px・改行は文末のみ、写真は幅いっぱい(320)で本文下49px、署名は中央・写真下10px） */
  .prose--greeting p { line-height: 32px; }
  .greeting__photo { margin-top: 49px; }
  .greeting__photo img { width: 100%; }
  .greeting__sign { margin-top: 10px; text-align: center; }
  /* SP：会館ページ本文を Figma実測の左右26px に合わせる（.page 16px ＋ 10px）。サイドバーは対象外 */
  .pmain--kaikan { padding-left: 10px; padding-right: 10px; }
  .shop { flex-direction: column; width: auto; padding: 22px 0 26px; }
  .shop__label { width: 100%; }   /* SP：ラベルを全幅にしてロゴの margin:auto を全幅基準で効かせる */
  /* SP：Figma375準拠の floor/店名レイアウト（floor「1F」を内容左端から約11px右・店名を列揃え x≈108）
     Figmaでは floor と店名は上端（キャップトップ）揃え＝大きいfloorが下へ伸びる。baselineではなくtop揃え */
  .shop__head { flex-wrap: wrap; align-items: flex-start; padding-left: 11px; }
  .shop__floor { width: 59px; margin-right: 12px; }
  .shop__name { margin: 0; font-size: 20px; font-weight: 400; }   /* SP：店舗名は20px・太字なし */
  .shop__cuisine { font-size: 16px; }   /* 業態名は従来サイズ維持 */
  .shop__logo { margin: 12px 0 0; }
  .shop--inaba .shop__logo, .shop--hirano .shop__logo, .shop--ichi .shop__logo { margin-left: 0; }
  .shop__logo img { margin-left: auto; margin-right: auto; }   /* SP：ロゴを中央寄せ */
  /* SP：ロゴごとの上下余白調整（スマホのみ） */
  .shop--sante  .shop__logo img { padding: 15px 0; }
  .shop--inaba  .shop__logo img { padding-bottom: 12px; }
  .shop--hirano .shop__logo img { padding-bottom: 1px; }
  .shop--ichi   .shop__logo img { padding: 30px 0; }
  .shop--jisaku .shop__logo img { padding: 20px 0 30px; }
  .shop__media { width: 100%; }
  .kk-parking { width: auto; text-align: left; }
  .kk-parking img { width: 100%; }
  .pdfgrid { gap: 22px 24px; justify-content: flex-start; }
  .counsel__row { flex-wrap: wrap; gap: 4px 14px; }
  /* 関連団体：表をモバイルで縦積みに */
  .orgtable, .orgtable tbody, .orgtable tr, .orgtable th, .orgtable td { display: block; width: auto; }
  .orgtable thead { display: none; }
  .orgtable tr { padding: 12px 0; border-bottom: 1px solid #e5e5e5; }
  .orgtable td { padding: 2px 0; }
  .orgtable td:first-child { font-weight: 500; }
  .memtable, .memtable tbody, .memtable tr, .memtable td { display: block; width: auto; }
  .memtable thead { display: none; }
  .memtable tr { padding: 12px 0; border-bottom: 1px solid #ddd; }
  .memtable td { border: none; padding: 2px 0; }
  .memtable .reg { color: var(--color-accent); }
  .memtable .kbn { color: var(--color-accent); font-weight: 700; }
  .memtable .nm { font-weight: 700; }
  /* SP：●を行名と同じ行に。li::beforeのままだと block化した.lineが改行され●が孤立するため.line内へ移す */
  .access__train li::before { content: none; }
  .access__train .line { display: block; min-width: 0; font-weight: 500; }
  .access__train .line::before { content: "●"; color: var(--color-accent); margin-right: 10px; }
  .iconf__row { flex-direction: column; gap: 4px; }
  .iconf__label { width: auto; }
  .iform__submit--multi { flex-direction: column-reverse; }
  .iform__submit--multi .iform__btn { width: 100%; box-sizing: border-box; }
}
@media (max-width: 600px) {
  /* SP：PDFカードを常に2列で均等配置（3列化・両端寄り・左寄りを防ぐ）。
     grid で2列固定し、space-evenly で左右＋中央の余白を等しくする（行gapは22px維持）。 */
  .pdfgrid { display: grid; grid-template-columns: repeat(2, auto);
    justify-content: space-evenly; column-gap: 0; }
}