/* ==========================================================================
 * main.css - FLOCSS Entry Point
 * @import による統合エントリポイント（コード直書き禁止）
 * ========================================================================== */

/* --- Foundation --- */

/* === foundation/_tokens.css === */

/* ==========================================================================
 * Design Tokens - 木古内町国保病院
 * CSS Custom Properties (デザイントークン)
 *
 * 設計方針:
 *   - 函館医療センターの美学（オフホワイト基調・余白重視）
 *   - 北海道医療大学のアクセントカラー活用
 *   - WCAG 2.2 AA コントラスト比準拠
 *   - 8px グリッドベースのスペーシング
 * ========================================================================== */
:root {
  /* ライトモード固定 */
  color-scheme: light;

  /* =======================================================================
   * Colors
   * ======================================================================= */

  /* メインブランドカラー — 信頼性・メインアクション（ボタン・リンク・ヘッダー） */
  --color-primary: #114FA1;

  /* プライマリホバー — ボタン・リンクのホバー状態 */
  --color-primary-hover: #0D3A75;

  /* プライマリ淡色 — バッジ背景・選択状態の薄い背景 */
  --color-primary-light: #E8F0FA;

  /* ブランドアクセント — 清潔感・先進性（差別化ポイント・装飾） */
  --color-brand-accent: #2E6BC3;

  /* アクセントホバー */
  --color-brand-accent-hover: #1D5AAF;

  /* アクセント淡色 — バッジ背景・診療案内カテゴリ */
  --color-brand-accent-light: #E8F0FA;

  /* アクセントダーク — バッジテキスト */
  --color-brand-accent-dark: #0D3A75;

  /* ページ背景 — オフホワイト（函館医療センター美学） */
  --color-background: #f8f7f6;

  /* 純白 — ヒーローテキスト・テーブルヘッダー等 */
  --color-white: #ffffff;

  /* カード・タブ・モーダル等の表面背景 */
  --color-surface: #ffffff;

  /* surface半透明バリアント（ヘッダー・フッターボーダー/ホバー用） */
  --color-surface-alpha-40: rgba(255, 255, 255, 0.4);
  --color-surface-alpha-20: rgba(255, 255, 255, 0.2);
  --color-surface-alpha-15: rgba(255, 255, 255, 0.15);

  /* 本文テキスト — 高コントラスト（on #f8f7f6 → 15.4:1） */
  --color-text-main: #23221e;

  /* サブテキスト — 補助情報・日付・キャプション（on #fff → 5.7:1） */
  --color-text-sub: #6b6560;

  /* プレースホルダー・無効テキスト */
  --color-text-muted: #9e9a95;

  /* リンクテキスト — プライマリと同系 */
  --color-link: #114FA1;

  /* リンクホバー */
  --color-link-hover: #0D3A75;

  /* 区切り線・ボーダー */
  --color-border: #d6d3d0;

  /* 薄いボーダー — テーブル内罫線等 */
  --color-border-light: #eae8e6;

  /* エラー — フォームバリデーション・警告（on #fff → 5.0:1） */
  --color-error: #c62828;

  /* エラー背景 */
  --color-error-light: #fdecea;

  /* 成功 — 完了通知・ステータス（on #fff → 4.6:1） */
  --color-success: #2e7d32;

  /* 成功背景 */
  --color-success-light: #e8f5e9;

  /* 警告 — 注意喚起（on #fff → 装飾用、テキストには --color-text-main を使用） */
  --color-warning: #f9a825;

  /* 警告背景 */
  --color-warning-light: #fff8e1;

  /* 採用CTA — リクルート専用アクセント（目立つオレンジ系） */
  --color-recruit-cta: #e65100;

  /* 採用CTAホバー */
  --color-recruit-cta-hover: #bf4400;

  /* 採用CTA淡色 — バッジ背景・採用カテゴリ */
  --color-recruit-cta-light: #fff3e0;

  /* 予約CTA — 診療予約ボタン（ヘッダー青と区別するティール系） */
  --color-reservation-cta: #00897B;
  --color-reservation-cta-hover: #00695C;

  /* オーバーレイ背景 — モーダル・ダイアログ背面 */
  --color-overlay: rgba(0, 0, 0, 0.5);

  /* オーバーレイグラデーション — ヒーロー画像上 */
  --color-overlay-light: hsl(0 0% 0% / 0.3);
  --color-overlay-dark: hsl(0 0% 0% / 0.5);

  /* テキストシャドウ — on image */
  --shadow-text: 0 2px 8px hsl(0 0% 0% / 0.4);
  --shadow-text-sm: 0 1px 4px hsl(0 0% 0% / 0.3);

  /* =======================================================================
   * Typography
   * ======================================================================= */

  /* ベースフォントファミリー */
  --font-family-base: "Noto Sans JP", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;

  /* 等幅フォント — コード表示等 */
  --font-family-mono: "Source Code Pro", "Consolas", monospace;

  /* フォントサイズ — Fluid Typography (clamp) */
  --font-size-xs: clamp(0.625rem, 0.575rem + 0.2vw, 0.6875rem);     /* ~10px〜11px */
  --font-size-sm: clamp(0.75rem, 0.7rem + 0.2vw, 0.8125rem);        /* ~12px〜13px */
  --font-size-base: clamp(0.875rem, 0.8rem + 0.25vw, 1rem);         /* ~14px〜16px */
  --font-size-md: clamp(1rem, 0.925rem + 0.3vw, 1.125rem);          /* ~16px〜18px */
  --font-size-lg: clamp(1.125rem, 1rem + 0.5vw, 1.25rem);           /* ~18px〜20px */
  --font-size-xl: clamp(1.25rem, 1.1rem + 0.75vw, 1.5rem);          /* ~20px〜24px */
  --font-size-xxl: clamp(1.5rem, 1.2rem + 1.5vw, 2rem);             /* ~24px〜32px */

  /* フォントウェイト */
  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-bold: 700;

  /* 行間 */
  --line-height-tight: 1.3;    /* 見出し */
  --line-height-normal: 1.7;   /* 本文 */
  --line-height-relaxed: 2.0;  /* ゆったり（医療情報等の可読性重視） */

  /* 字間 */
  --letter-spacing-tight: -0.01em;
  --letter-spacing-normal: 0.04em;

  /* =======================================================================
   * Spacing（8px グリッド）
   * ======================================================================= */

  --spacing-unit: 8px;                       /* 基準単位 */
  --spacing-xs: calc(var(--spacing-unit) * 0.5);  /*  4px */
  --spacing-sm: var(--spacing-unit);              /*  8px */
  --spacing-md: calc(var(--spacing-unit) * 2);    /* 16px */
  --spacing-lg: calc(var(--spacing-unit) * 3);    /* 24px */
  --spacing-xl: calc(var(--spacing-unit) * 4);    /* 32px */
  --spacing-xxl: calc(var(--spacing-unit) * 6);   /* 48px */
  --spacing-xxxl: calc(var(--spacing-unit) * 8);  /* 64px */

  /* =======================================================================
   * Border
   * ======================================================================= */

  --border-width: 1px;
  --border-width-thick: 2px;

  --radius-sm: 4px;   /* バッジ・小パーツ */
  --radius-md: 8px;   /* カード・入力フィールド */
  --radius-lg: 16px;  /* ダイアログ・大パネル */
  --radius-full: 9999px; /* FAB・アバター（完全円形） */

  /* =======================================================================
   * Shadow
   * ======================================================================= */

  /* カード — 軽い浮遊感 */
  --shadow-card: 0 2px 8px rgba(0, 0, 0, 0.08);

  /* カードホバー — インタラクション時 */
  --shadow-card-hover: 0 4px 16px rgba(0, 0, 0, 0.12);

  /* ダイアログ・モーダル */
  --shadow-dialog: 0 8px 32px rgba(0, 0, 0, 0.16);

  /* 音声FABボタン */
  --shadow-fab: 0 4px 12px rgba(0, 0, 0, 0.2);

  /* ヘッダー固定時 */
  --shadow-header: 0 2px 4px rgba(0, 0, 0, 0.06);

  /* =======================================================================
   * Transition
   * ======================================================================= */

  --transition-fast: 150ms ease;    /* ホバー・フォーカス */
  --transition-normal: 250ms ease;  /* パネル開閉・フェード */
  --transition-slow: 400ms ease;    /* モーダル・ページ遷移 */

  /* =======================================================================
   * Breakpoints（参考値 — メディアクエリで直接使用）
   * CSS custom properties は @media では使用不可のため、
   * ここではドキュメント目的で定義。実際のメディアクエリには
   * 直値を使用すること。
   *   --bp-sm:  576px   スマホ横 / 小タブレット
   *   --bp-md:  768px   タブレット
   *   --bp-lg:  1024px  小デスクトップ
   *   --bp-xl:  1280px  デスクトップ
   * ======================================================================= */

  /* =======================================================================
   * Z-index
   * ======================================================================= */

  --z-dropdown: 100;    /* ドロップダウンメニュー */
  --z-header: 200;      /* 固定ヘッダー */
  --z-overlay: 300;     /* オーバーレイ背景 */
  --z-dialog: 400;      /* ダイアログ・モーダル */
  --z-fab: 500;         /* 音声FABボタン（最前面付近） */
  --z-toast: 600;       /* トースト通知（最前面） */

  /* =======================================================================
   * Component-specific tokens
   * ======================================================================= */

  /* タッチターゲット最小サイズ — WCAG 2.2 AA (44px以上) */
  --touch-target-min: 44px;

  /* コンテンツ最大幅 */
  --content-max-width: 1200px;

  /* ヘッダー高さ (saikazo-header.css と同期) */
  --header-utility-height: 36px;
  --header-main-height: 70px;
  --header-height: calc(var(--header-utility-height) + var(--header-main-height));

  /* サイドバー幅 */
  --sidebar-width: 280px;

  /* =======================================================================
   * Saikazoスタイル互換変数 (--sz-* プレフィックス)
   * saikazo-header-kazo.css / saikazo-style.css 参照用
   * ======================================================================= */

  /* プライマリカラー */
  --sz-primary: #114FA1;
  --sz-primary-dark: #0D3A75;
  --sz-primary-light: #2E6BC3;
  --sz-primary-50: #E8F0FA;

  /* スペーシング (Saikazo用) */
  --sz-space-2xs: 0.25rem;  /*  4px */
  --sz-space-xs: 0.5rem;    /*  8px */
  --sz-space-sm: 0.75rem;   /* 12px */
  --sz-space-md: 1rem;      /* 16px */
  --sz-space-lg: 1.5rem;    /* 24px */
  --sz-space-xl: 2rem;      /* 32px */
  --sz-space-2xl: 3rem;     /* 48px */

  /* アクセントカラー */
  --sz-accent: #c84a00;
  --sz-accent-light: #FF8A50;
  --sz-orange: #e67e22;

  /* ベースカラー */
  --sz-white: #ffffff;
  --sz-text: #222222;
  --sz-text-light: #666666;

  /* グレースケール */
  --sz-gray-50: #f9fafb;
  --sz-gray-100: #f5f5f5;
  --sz-gray-200: #eeeeee;
  --sz-gray-300: #e0e0e0;
  --sz-gray-400: #9ca3af;
  --sz-gray-500: #6b7280;
  --sz-border: #e0e0e0;

  /* シャドウ */
  --sz-shadow: 0 4px 20px rgba(17, 79, 161, 0.12);
  --sz-shadow-lg: 0 10px 40px rgba(17, 79, 161, 0.18);

  /* フォント */
  --sz-font-en: 'Inter', 'Noto Sans JP', sans-serif;
  --sz-font-jp: 'Noto Sans JP', sans-serif;

  /* トランジション */
  --sz-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --sz-duration: 0.3s;

  /* Z-Index (Saikazo用) */
  --sz-z-header: 1000;
  --sz-z-subnav: 100;
  --sz-z-dropdown: 999;
  --sz-z-modal: 10000;
  --sz-z-mobile-menu: 9999;
  --sz-z-overlay: 1001;

  /* =======================================================================
   * Saikazo-Style互換変数 (--saikazo-* プレフィックス)
   * saikazo-style.css / saikazo-home.css 参照用
   * ======================================================================= */

  /* プライマリカラー（濃い青） */
  --saikazo-primary: #114FA1;
  --saikazo-primary-dark: #0D3A75;
  --saikazo-primary-light: #2E6BC3;
  --saikazo-primary-50: #E8F0FA;
  --saikazo-primary-100: #C5D9F2;
  --saikazo-primary-rgb: 17, 79, 161;

  /* セカンダリカラー */
  --saikazo-secondary: #698cc8;
  --saikazo-secondary-light: #8aa8d8;
  --saikazo-secondary-dark: #4a6da8;

  /* アクセントカラー */
  --saikazo-accent: #ff1f54;
  --saikazo-accent-light: #ff5a7d;
  --saikazo-accent-dark: #d91a47;
  --saikazo-accent-orange: #c84a00;
  --saikazo-accent-orange-light: #FF8A50;

  /* グレースケール */
  --saikazo-gray-50: #fafafa;
  --saikazo-gray-100: #f5f5f5;
  --saikazo-gray-200: #eeeeee;
  --saikazo-gray-300: #e0e0e0;
  --saikazo-gray-400: #bdbdbd;
  --saikazo-gray-500: #9e9e9e;
  --saikazo-gray-600: #757575;
  --saikazo-gray-700: #616161;
  --saikazo-gray-800: #424242;
  --saikazo-gray-900: #212121;

  /* テキスト */
  --saikazo-text: #333333;
  --saikazo-text-light: #666666;
  --saikazo-text-muted: #767676;

  /* 背景 */
  --saikazo-bg: #f8f9fa;
  --saikazo-bg-white: #ffffff;
  --saikazo-bg-light: #fafafa;

  /* シャドウ */
  --saikazo-shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.04);
  --saikazo-shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
  --saikazo-shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12);
  --saikazo-shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.16);

  /* ボーダー */
  --saikazo-border: #e0e0e0;
  --saikazo-border-light: #f0f0f0;

  /* フォント */
  --saikazo-font-en: 'Inter', 'Noto Sans JP', sans-serif;
  --saikazo-font-jp: 'Noto Sans JP', sans-serif;

  /* アニメーション */
  --saikazo-ease: cubic-bezier(0.4, 0, 0.2, 1);
  --saikazo-ease-out: cubic-bezier(0, 0, 0.2, 1);
  --saikazo-duration: 0.3s;
  --saikazo-duration-slow: 0.5s;
}

/* Dark Mode — 無効化済み（ライトモード固定） */

/* ==========================================================================
 * High Contrast Mode — data-colormode="high-contrast"
 * WCAG AAA 7:1 コントラスト比を確保
 * ========================================================================== */
:root[data-colormode="high-contrast"] {
  --color-primary: #0055cc;
  --color-primary-hover: #003d99;
  --color-primary-light: #e6f0ff;
  --color-brand-accent: #006666;
  --color-brand-accent-hover: #004d4d;
  --color-brand-accent-light: #e0f5f5;
  --color-brand-accent-dark: #004d4d;

  --color-background: #ffffff;
  --color-white: #ffffff;
  --color-surface: #f0f0f0;
  --color-surface-alpha-40: rgba(240, 240, 240, 0.95);
  --color-surface-alpha-20: rgba(240, 240, 240, 0.6);
  --color-surface-alpha-15: rgba(240, 240, 240, 0.45);
  --color-text-main: #000000;
  --color-text-sub: #1a1a1a;
  --color-text-muted: #333333;
  --color-link: #0033aa;
  --color-link-hover: #001a66;

  --color-border: #333333;
  --color-border-light: #666666;

  --color-error: #cc0000;
  --color-error-light: #ffe6e6;
  --color-success: #006600;
  --color-success-light: #e6ffe6;
  --color-warning: #996600;
  --color-warning-light: #fff5cc;

  --color-recruit-cta: #cc3300;
  --color-recruit-cta-hover: #992200;
  --color-recruit-cta-light: #ffe6d9;

  --color-overlay: rgba(0, 0, 0, 0.8);
  --color-overlay-light: hsl(0 0% 0% / 0.5);
  --color-overlay-dark: hsl(0 0% 0% / 0.7);

  --shadow-card: 0 0 0 2px var(--color-border);
  --shadow-card-hover: 0 0 0 3px var(--color-primary);
  --shadow-dialog: 0 0 0 3px var(--color-border);
  --shadow-text: none;
  --shadow-text-sm: none;

  color-scheme: light;
}

/* === foundation/_reset.css === */

/* ==========================================================================
 * Foundation: Reset CSS
 * ブラウザデフォルトスタイルの正規化
 * Modern CSS Reset (based on Andy Bell's reset)
 * ========================================================================== */

/* --- Box Model --- */
*,
*::before,
*::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

/* --- Document --- */
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  tab-size: 4;
}

body {
  min-height: 100vh;
  min-height: 100dvh;
}

/* --- Media --- */
img,
picture,
video,
canvas,
svg {
  display: block;
  max-width: 100%;
}

/* --- Forms --- */
input,
button,
textarea,
select {
  font: inherit;
  color: inherit;
}

button {
  cursor: pointer;
  background: none;
  border: none;
}

textarea {
  resize: vertical;
}

fieldset {
  border: none;
}

/* --- Links --- */
a {
  color: inherit;
  text-decoration: none;
}

/* --- Lists --- */
ul,
ol {
  list-style: none;
}

/* --- Tables --- */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* --- Misc --- */
abbr[title] {
  text-decoration: underline dotted;
}

summary {
  cursor: pointer;
}

[hidden] {
  display: none !important;
}

/* スクリーンリーダー専用（視覚的に非表示、SRからは読み上げ可能） */
.sr-only,
.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* === foundation/_base.css === */

/* ==========================================================================
 * Foundation: Base Styles
 * body / a / img 等のHTML要素に対するデフォルトスタイル
 * 全プロパティでデザイントークンを使用
 * ========================================================================== */

/* --- Document --- */
html {
  font-size: 100%; /* 16px = 1rem 基準 */
  scroll-behavior: smooth;
  overflow-x: hidden;
}

body {
  font-family: var(--font-family-base);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-normal);
  color: var(--color-text-main);
  background-color: var(--color-background);
  line-height: var(--line-height-normal);
  letter-spacing: var(--letter-spacing-normal);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}

/* --- Links --- */
a {
  color: var(--color-link);
  transition: color var(--transition-fast);
}

a:hover {
  color: var(--color-link-hover);
}

/* --- Focus --- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
[tabindex]:focus-visible {
  outline: var(--border-width-thick) solid var(--color-primary);
  outline-offset: 2px;
}

/* --- Headings --- */
h1, h2, h3, h4, h5, h6 {
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  letter-spacing: var(--letter-spacing-tight);
  text-wrap: balance;
  word-break: auto-phrase;
}

h1 { font-size: var(--font-size-xxl); }
h2 { font-size: var(--font-size-xl); }
h3 { font-size: var(--font-size-lg); }
h4 { font-size: var(--font-size-md); }
h5 { font-size: var(--font-size-base); }
h6 { font-size: var(--font-size-sm); }

/* --- Images --- */
img {
  height: auto;
}

/* --- Selection --- */
::selection {
  background-color: var(--color-primary-light);
  color: var(--color-text-main);
}

/* --- Reduced Motion --- */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* --- Skip Link (WCAG 2.2) --- */
.c-skip-link {
  position: absolute;
  top: calc(var(--spacing-unit) * -10);
  left: var(--spacing-md);
  z-index: calc(var(--z-toast) + 1);
  padding: var(--spacing-sm) var(--spacing-md);
  background-color: var(--color-primary);
  color: var(--color-surface);
  font-weight: var(--font-weight-bold);
  border-radius: var(--radius-md);
  transition: top var(--transition-fast);
}

.c-skip-link:focus {
  position: absolute;
  top: var(--spacing-sm);
  clip: auto;
  width: auto;
  height: auto;
  margin: 0;
  overflow: visible;
  white-space: normal;
}

/* === foundation/_a11y.css === */

/* ==========================================================================
 * Accessibility Utilities
 * WCAG 2.2 AA 準拠 — フォーカスリング・モーション制御・高コントラスト
 * ========================================================================== */

/* =======================================================================
 * フォーカスインジケーター（全インタラクティブ要素共通）
 * ======================================================================= */
:focus-visible {
  outline: 3px solid var(--color-primary, #0077c7);
  outline-offset: 2px;
  border-radius: var(--radius-sm, 4px);
}

:focus:not(:focus-visible) {
  outline: none;
}

/* =======================================================================
 * スキップリンク（キーボードフォーカス時のみ表示）
 * ======================================================================= */
.c-skip-link:focus {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  display: block;
  padding: 12px 24px;
  background: var(--color-primary, #0077c7);
  color: var(--color-white, #fff);
  font-size: var(--font-size-md, 1rem);
  font-weight: 700;
  text-decoration: none;
  clip: auto;
  clip-path: none;
  width: auto;
  height: auto;
  overflow: visible;
}

/* =======================================================================
 * 縮小モーション（prefers-reduced-motion）
 * ======================================================================= */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* =======================================================================
 * 高コントラストモード対応
 * ======================================================================= */
@media (forced-colors: active) {
  :focus-visible {
    outline: 3px solid LinkText;
  }

  .c-button,
  .c-button--primary {
    border: 2px solid ButtonText;
  }
}

/* =======================================================================
 * ARIA状態ベースのスタイル
 * ======================================================================= */
[aria-current="page"] {
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 4px;
}

[aria-expanded="true"] > .c-icon--rotate {
  transform: rotate(180deg);
}

[aria-busy="true"] {
  cursor: wait;
  opacity: 0.6;
}

/* =======================================================================
 * タッチターゲット最小サイズ保証
 * ======================================================================= */
a,
button,
input,
select,
textarea,
[role="button"],
[role="tab"],
[role="menuitem"] {
  min-height: 44px;
  min-width: 44px;
}

/* ヘッダーユーティリティバー: タッチターゲットの上書き（コンパクト表示） */
.sz-header__upper a,
.sz-header__upper button {
  min-height: 0;
  min-width: 0;
}

/* =======================================================================
 * 文字サイズ変更（data-fontsize on <html>）
 * ======================================================================= */
html[data-fontsize="large"] {
  font-size: 112.5%;  /* 18px ベース */
}

html[data-fontsize="x-large"] {
  font-size: 125%;    /* 20px ベース */
}

/* =======================================================================
 * 配色変更（data-colormode on <html>）
 * ======================================================================= */

/* ── ハイコントラスト ── */
html[data-colormode="high-contrast"] {
  --color-background: #fff;
  --color-surface: #fff;
  --color-text-main: #000;
  --color-text-sub: #111;
  --color-text-muted: #333;
  --color-link: #0000ee;
  --color-link-hover: #0000cc;
  --color-border: #000;
  --color-border-light: #333;
  --color-primary: #0000cc;
  --color-primary-hover: #000099;
  --color-primary-light: #e0e0ff;
}

html[data-colormode="high-contrast"] body {
  background: #fff;
  color: #000;
}

html[data-colormode="high-contrast"] a {
  color: #0000ee;
  text-decoration: underline;
}

html[data-colormode="high-contrast"] img {
  filter: contrast(1.2);
}

/* ── ダークモード ── */
html[data-colormode="dark"] {
  --color-background: #1a1a2e;
  --color-surface: #252542;
  --color-text-main: #e8e8e8;
  --color-text-sub: #b0b0b0;
  --color-text-muted: #808080;
  --color-link: #6eb5ff;
  --color-link-hover: #9ccfff;
  --color-border: #444;
  --color-border-light: #333;
  --color-primary: #4d9fff;
  --color-primary-hover: #6eb5ff;
  --color-primary-light: #1a2a4a;
  --color-error: #ff6b6b;
  --color-error-light: #3a1a1a;
  --color-success: #6bcf6b;
  --color-success-light: #1a3a1a;
}

html[data-colormode="dark"] body {
  background: #1a1a2e;
  color: #e8e8e8;
}

html[data-colormode="dark"] .sz-header,
html[data-colormode="dark"] .sz-header__upper,
html[data-colormode="dark"] .sz-header__lower,
html[data-colormode="dark"] .sz-header__logo-link {
  background: #252542;
  border-color: #444;
}

html[data-colormode="dark"] .sz-header__util-link,
html[data-colormode="dark"] .sz-header__tel,
html[data-colormode="dark"] .sz-mainnav__link,
html[data-colormode="dark"] .sz-header__logo-name {
  color: #e8e8e8;
}

html[data-colormode="dark"] .sz-header__a11y-btn {
  color: #b0b0b0;
}

html[data-colormode="dark"] .sz-header__a11y-btn:hover {
  color: #fff;
  background: #3a3a5c;
}

html[data-colormode="dark"] .c-card,
html[data-colormode="dark"] .sz-mega__container,
html[data-colormode="dark"] .sz-mega__guide-card {
  background: #252542;
  border-color: #444;
  color: #e8e8e8;
}

html[data-colormode="dark"] .sz-mega__guide-txt {
  color: #e8e8e8;
}

html[data-colormode="dark"] .saikazo-footer {
  background: #0f0f23;
}

html[data-colormode="dark"] img {
  filter: brightness(0.85);
}

/* テキスト入力はmin-heightのみ（幅は要件次第） */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="number"],
input[type="date"],
input[type="password"],
textarea,
select {
  min-width: auto;
}

/* インラインリンクは高さ制約除外 */
p a,
li a,
td a,
span a {
  min-height: auto;
  min-width: auto;
}

/* === foundation/_print.css === */

/* ==========================================================================
 * Print Styles — @media print
 *
 * 印刷時の最適化：
 *   - ナビゲーション・FAB・ダイアログ等のインタラクティブ要素を非表示
 *   - 背景色・影を除去してインク節約
 *   - リンクURLを括弧内に表示
 *   - 余白・フォントサイズを紙面向けに調整
 *   - ページ送り制御（orphans / widows / break-inside）
 * ========================================================================== */
@media print {

  /* -------------------------------------------------------------------
   * 1. トークンオーバーライド — 印刷向け白黒ベース
   * ------------------------------------------------------------------- */
  :root {
    --color-background: #fff;
    --color-surface: #fff;
    --color-text-main: #000;
    --color-text-sub: #333;
    --color-text-muted: #666;
    --color-border: #999;
    --color-border-light: #ccc;
    --shadow-card: none;
    --shadow-card-hover: none;
    --shadow-dialog: none;
    --shadow-fab: none;
    --shadow-header: none;
  }

  /* -------------------------------------------------------------------
   * 2. グローバルリセット — 背景・影・遷移の除去
   * ------------------------------------------------------------------- */
  *,
  *::before,
  *::after {
    background: transparent !important;
    color: #000 !important;
    box-shadow: none !important;
    text-shadow: none !important;
    transition: none !important;
    animation: none !important;
  }

  body {
    font-size: 12pt;
    line-height: 1.6;
  }

  /* -------------------------------------------------------------------
   * 3. 非表示要素 — 印刷不要なUI部品
   * ------------------------------------------------------------------- */
  .l-header,
  .l-footer__back-to-top,
  .l-sidebar,
  .sp-fab,
  .sp-dialog,
  .sp-visualizer,
  .sp-chips,
  .c-skip-link,
  .c-button,
  .c-tab,
  .c-pagination,
  .c-breadcrumbs,
  nav,
  [aria-hidden="true"] {
    display: none !important;
  }

  /* -------------------------------------------------------------------
   * 4. レイアウト調整 — 全幅・余白最適化
   * ------------------------------------------------------------------- */
  .l-main {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .l-main__container {
    max-width: none !important;
    padding: 0 !important;
  }

  /* ヒーローは画像不要・テキストのみ残す */
  .p-hero {
    min-height: auto !important;
    padding: 1em 0 !important;
  }

  .p-hero__image {
    display: none !important;
  }

  /* -------------------------------------------------------------------
   * 5. リンクURL表示 — href を括弧内に出力
   * ------------------------------------------------------------------- */
  a[href]::after {
    content: " (" attr(href) ")";
    font-size: 0.8em;
    font-weight: normal;
    word-break: break-all;
  }

  /* 内部アンカー・JavaScript・tel リンクはURL非表示 */
  a[href^="#"]::after,
  a[href^="javascript:"]::after,
  a[href^="tel:"]::after,
  a[href^="mailto:"]::after {
    content: "";
  }

  /* -------------------------------------------------------------------
   * 6. 画像 — 印刷向け最適化
   * ------------------------------------------------------------------- */
  img {
    max-width: 100% !important;
    page-break-inside: avoid;
  }

  /* -------------------------------------------------------------------
   * 7. テーブル — 行の途中で改ページしない
   * ------------------------------------------------------------------- */
  table {
    border-collapse: collapse;
  }

  thead {
    display: table-header-group;
  }

  tr {
    page-break-inside: avoid;
  }

  /* -------------------------------------------------------------------
   * 8. タイポグラフィ — ページ送り制御
   * ------------------------------------------------------------------- */
  h1, h2, h3, h4, h5, h6 {
    page-break-after: avoid;
    orphans: 3;
    widows: 3;
  }

  p {
    orphans: 3;
    widows: 3;
  }

  /* セクション見出し直後でのページ送り防止 */
  .p-section__title {
    page-break-after: avoid;
  }

  /* カードは途中で切らない */
  .c-card {
    page-break-inside: avoid;
    border: var(--border-width) solid #ccc !important;
  }

  /* -------------------------------------------------------------------
   * 9. フッター — 病院情報だけ残す（ナビ部分は非表示）
   * ------------------------------------------------------------------- */
  .l-footer {
    border-top: 1px solid #000 !important;
    padding-top: 1em !important;
  }

  .l-footer__grid {
    display: block !important;
  }

  /* ナビゲーションカラムを非表示（カラム1の病院情報だけ残す） */
  .l-footer__col:nth-child(n+2) {
    display: none !important;
  }

  .l-footer__bottom {
    display: none !important;
  }

  /* -------------------------------------------------------------------
   * 10. ページマージン
   * ------------------------------------------------------------------- */
  @page {
    margin: 2cm;
  }
}

/* === foundation/_responsive-enhanced.css === */

/**
 * Enhanced Responsive Design System
 * 拡張レスポンシブデザインシステム（16ブレイクポイント対応）
 *
 * ブレイクポイント（16段階）:
 * - watch:   <= 279px  - スマートウォッチ・ウェアラブル
 * - 2xs:     280px     - 極小端末
 * - xs:      320px     - 小型スマートフォン
 * - xs-lg:   360px     - 標準スマートフォン小
 * - sm:      390px     - iPhone標準
 * - sm-lg:   414px     - iPhone Pro Max
 * - md:      480px     - 大型スマートフォン
 * - md-lg:   600px     - 小型タブレット縦
 * - lg:      768px     - タブレット (iPad mini)
 * - lg-xl:   900px     - タブレット横
 * - xl:      1024px    - 大型タブレット (iPad Pro)
 * - xl-xxl:  1200px    - 小型デスクトップ
 * - xxl:     1280px    - デスクトップ
 * - 3xl:     1440px    - 大型デスクトップ
 * - 4xl:     1600px    - ワイドデスクトップ
 * - 5xl:     1920px    - フルHD以上
 */

:root {
  /* 16段階ブレイクポイント */
  --bp-watch: 279px;
  --bp-2xs: 280px;
  --bp-xs: 320px;
  --bp-xs-lg: 360px;
  --bp-sm: 390px;
  --bp-sm-lg: 414px;
  --bp-md: 480px;
  --bp-md-lg: 600px;
  --bp-lg: 768px;
  --bp-lg-xl: 900px;
  --bp-xl: 1024px;
  --bp-xl-xxl: 1200px;
  --bp-xxl: 1280px;
  --bp-3xl: 1440px;
  --bp-4xl: 1600px;
  --bp-5xl: 1920px;

  /* コンテナ最大幅 */
  --container-watch: 100%;
  --container-2xs: 100%;
  --container-xs: 100%;
  --container-xs-lg: 100%;
  --container-sm: 100%;
  --container-sm-lg: 100%;
  --container-md: 100%;
  --container-md-lg: 100%;
  --container-lg: 720px;
  --container-lg-xl: 840px;
  --container-xl: 960px;
  --container-xl-xxl: 1080px;
  --container-xxl: 1140px;
  --container-3xl: 1320px;
  --container-4xl: 1480px;
  --container-5xl: 1600px;

  /* スペーシング基準値 */
  --space-unit: 4px;
  --space-xs: calc(var(--space-unit) * 1);  /* 4px */
  --space-sm: calc(var(--space-unit) * 2);  /* 8px */
  --space-md: calc(var(--space-unit) * 4);  /* 16px */
  --space-lg: calc(var(--space-unit) * 6);  /* 24px */
  --space-xl: calc(var(--space-unit) * 8);  /* 32px */
  --space-xxl: calc(var(--space-unit) * 12); /* 48px */

  /* フォントサイズ基準値 — clamp() による Fluid Typography に移行済み */
  --font-size-base: clamp(0.875rem, 0.8rem + 0.25vw, 1rem);
  --font-size-scale: 1;
}

/* ========================================
   Typography Scale (Fluid — clamp tokens)
   ======================================== */

html {
  font-size: var(--font-size-base);
}

h1, .h1 { font-size: var(--font-size-xxl); }
h2, .h2 { font-size: var(--font-size-xl); }
h3, .h3 { font-size: var(--font-size-lg); }
h4, .h4 { font-size: var(--font-size-md); }
h5, .h5 { font-size: var(--font-size-base); }
h6, .h6 { font-size: var(--font-size-sm); }

.lead { font-size: var(--font-size-md); }
.small, small { font-size: 0.875em; }

/* ========================================
   Container System
   ======================================== */

.container-fluid {
  width: 100%;
  padding-right: var(--space-md);
  padding-left: var(--space-md);
  margin-right: auto;
  margin-left: auto;
}

.container {
  width: 100%;
  padding-right: var(--space-md);
  padding-left: var(--space-md);
  margin-right: auto;
  margin-left: auto;
}

/* ========================================
   Grid System (12 Column)
   ======================================== */

.row {
  display: flex;
  flex-wrap: wrap;
  margin-right: calc(var(--space-sm) * -1);
  margin-left: calc(var(--space-sm) * -1);
}

.row > * {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
  padding-right: var(--space-sm);
  padding-left: var(--space-sm);
}

/* Gap variants */
.row.g-0 { margin: 0; }
.row.g-0 > * { padding: 0; }
.row.g-1 > * { padding: var(--space-xs); }
.row.g-2 > * { padding: var(--space-sm); }
.row.g-3 > * { padding: var(--space-md); }
.row.g-4 > * { padding: var(--space-lg); }
.row.g-5 > * { padding: var(--space-xl); }

/* Column classes - Mobile First (XS) */
.col { flex: 1 0 0%; }
.col-auto { flex: 0 0 auto; width: auto; }
.col-1 { flex: 0 0 auto; width: 8.333333%; }
.col-2 { flex: 0 0 auto; width: 16.666667%; }
.col-3 { flex: 0 0 auto; width: 25%; }
.col-4 { flex: 0 0 auto; width: 33.333333%; }
.col-5 { flex: 0 0 auto; width: 41.666667%; }
.col-6 { flex: 0 0 auto; width: 50%; }
.col-7 { flex: 0 0 auto; width: 58.333333%; }
.col-8 { flex: 0 0 auto; width: 66.666667%; }
.col-9 { flex: 0 0 auto; width: 75%; }
.col-10 { flex: 0 0 auto; width: 83.333333%; }
.col-11 { flex: 0 0 auto; width: 91.666667%; }
.col-12 { flex: 0 0 auto; width: 100%; }

/* ========================================
   Visibility Utilities
   ======================================== */

/* Default (Mobile) - show/hide */
.d-none { display: none !important; }
.d-block { display: block !important; }
.d-flex { display: flex !important; }
.d-grid { display: grid !important; }
.d-inline { display: inline !important; }
.d-inline-block { display: inline-block !important; }

/* ========================================
   Typography Scale
   ======================================== */

html {
  font-size: var(--font-size-base);
}

h1, .h1 { font-size: calc(1.625rem * var(--font-size-scale)); }
h2, .h2 { font-size: calc(1.375rem * var(--font-size-scale)); }
h3, .h3 { font-size: calc(1.125rem * var(--font-size-scale)); }
h4, .h4 { font-size: calc(1rem * var(--font-size-scale)); }
h5, .h5 { font-size: calc(0.9375rem * var(--font-size-scale)); }
h6, .h6 { font-size: calc(0.875rem * var(--font-size-scale)); }

.lead { font-size: calc(1.125rem * var(--font-size-scale)); }
.small, small { font-size: 0.875em; }

/* ========================================
   SM Breakpoint (480px+)
   ======================================== */

@media (min-width: 480px) {
  .container { max-width: var(--container-sm); }

  .col-sm { flex: 1 0 0%; }
  .col-sm-auto { flex: 0 0 auto; width: auto; }
  .col-sm-1 { flex: 0 0 auto; width: 8.333333%; }
  .col-sm-2 { flex: 0 0 auto; width: 16.666667%; }
  .col-sm-3 { flex: 0 0 auto; width: 25%; }
  .col-sm-4 { flex: 0 0 auto; width: 33.333333%; }
  .col-sm-5 { flex: 0 0 auto; width: 41.666667%; }
  .col-sm-6 { flex: 0 0 auto; width: 50%; }
  .col-sm-7 { flex: 0 0 auto; width: 58.333333%; }
  .col-sm-8 { flex: 0 0 auto; width: 66.666667%; }
  .col-sm-9 { flex: 0 0 auto; width: 75%; }
  .col-sm-10 { flex: 0 0 auto; width: 83.333333%; }
  .col-sm-11 { flex: 0 0 auto; width: 91.666667%; }
  .col-sm-12 { flex: 0 0 auto; width: 100%; }

  .d-sm-none { display: none !important; }
  .d-sm-block { display: block !important; }
  .d-sm-flex { display: flex !important; }
  .d-sm-grid { display: grid !important; }
}

/* ========================================
   MD Breakpoint (640px+)
   ======================================== */

@media (min-width: 640px) {
  .container { max-width: var(--container-md); }

  .col-md { flex: 1 0 0%; }
  .col-md-auto { flex: 0 0 auto; width: auto; }
  .col-md-1 { flex: 0 0 auto; width: 8.333333%; }
  .col-md-2 { flex: 0 0 auto; width: 16.666667%; }
  .col-md-3 { flex: 0 0 auto; width: 25%; }
  .col-md-4 { flex: 0 0 auto; width: 33.333333%; }
  .col-md-5 { flex: 0 0 auto; width: 41.666667%; }
  .col-md-6 { flex: 0 0 auto; width: 50%; }
  .col-md-7 { flex: 0 0 auto; width: 58.333333%; }
  .col-md-8 { flex: 0 0 auto; width: 66.666667%; }
  .col-md-9 { flex: 0 0 auto; width: 75%; }
  .col-md-10 { flex: 0 0 auto; width: 83.333333%; }
  .col-md-11 { flex: 0 0 auto; width: 91.666667%; }
  .col-md-12 { flex: 0 0 auto; width: 100%; }

  .d-md-none { display: none !important; }
  .d-md-block { display: block !important; }
  .d-md-flex { display: flex !important; }
  .d-md-grid { display: grid !important; }
}

/* ========================================
   LG Breakpoint (768px+)
   ======================================== */

@media (min-width: 768px) {
  .container { max-width: var(--container-lg); }

  .col-lg { flex: 1 0 0%; }
  .col-lg-auto { flex: 0 0 auto; width: auto; }
  .col-lg-1 { flex: 0 0 auto; width: 8.333333%; }
  .col-lg-2 { flex: 0 0 auto; width: 16.666667%; }
  .col-lg-3 { flex: 0 0 auto; width: 25%; }
  .col-lg-4 { flex: 0 0 auto; width: 33.333333%; }
  .col-lg-5 { flex: 0 0 auto; width: 41.666667%; }
  .col-lg-6 { flex: 0 0 auto; width: 50%; }
  .col-lg-7 { flex: 0 0 auto; width: 58.333333%; }
  .col-lg-8 { flex: 0 0 auto; width: 66.666667%; }
  .col-lg-9 { flex: 0 0 auto; width: 75%; }
  .col-lg-10 { flex: 0 0 auto; width: 83.333333%; }
  .col-lg-11 { flex: 0 0 auto; width: 91.666667%; }
  .col-lg-12 { flex: 0 0 auto; width: 100%; }

  .d-lg-none { display: none !important; }
  .d-lg-block { display: block !important; }
  .d-lg-flex { display: flex !important; }
  .d-lg-grid { display: grid !important; }
}

/* ========================================
   XL Breakpoint (1024px+)
   ======================================== */

@media (min-width: 1024px) {
  .container { max-width: var(--container-xl); }

  .col-xl { flex: 1 0 0%; }
  .col-xl-auto { flex: 0 0 auto; width: auto; }
  .col-xl-1 { flex: 0 0 auto; width: 8.333333%; }
  .col-xl-2 { flex: 0 0 auto; width: 16.666667%; }
  .col-xl-3 { flex: 0 0 auto; width: 25%; }
  .col-xl-4 { flex: 0 0 auto; width: 33.333333%; }
  .col-xl-5 { flex: 0 0 auto; width: 41.666667%; }
  .col-xl-6 { flex: 0 0 auto; width: 50%; }
  .col-xl-7 { flex: 0 0 auto; width: 58.333333%; }
  .col-xl-8 { flex: 0 0 auto; width: 66.666667%; }
  .col-xl-9 { flex: 0 0 auto; width: 75%; }
  .col-xl-10 { flex: 0 0 auto; width: 83.333333%; }
  .col-xl-11 { flex: 0 0 auto; width: 91.666667%; }
  .col-xl-12 { flex: 0 0 auto; width: 100%; }

  .d-xl-none { display: none !important; }
  .d-xl-block { display: block !important; }
  .d-xl-flex { display: flex !important; }
  .d-xl-grid { display: grid !important; }
}

/* ========================================
   XXL Breakpoint (1280px+)
   ======================================== */

@media (min-width: 1280px) {
  .container { max-width: var(--container-xxl); }

  .col-xxl { flex: 1 0 0%; }
  .col-xxl-auto { flex: 0 0 auto; width: auto; }
  .col-xxl-1 { flex: 0 0 auto; width: 8.333333%; }
  .col-xxl-2 { flex: 0 0 auto; width: 16.666667%; }
  .col-xxl-3 { flex: 0 0 auto; width: 25%; }
  .col-xxl-4 { flex: 0 0 auto; width: 33.333333%; }
  .col-xxl-5 { flex: 0 0 auto; width: 41.666667%; }
  .col-xxl-6 { flex: 0 0 auto; width: 50%; }
  .col-xxl-7 { flex: 0 0 auto; width: 58.333333%; }
  .col-xxl-8 { flex: 0 0 auto; width: 66.666667%; }
  .col-xxl-9 { flex: 0 0 auto; width: 75%; }
  .col-xxl-10 { flex: 0 0 auto; width: 83.333333%; }
  .col-xxl-11 { flex: 0 0 auto; width: 91.666667%; }
  .col-xxl-12 { flex: 0 0 auto; width: 100%; }

  .d-xxl-none { display: none !important; }
  .d-xxl-block { display: block !important; }
  .d-xxl-flex { display: flex !important; }
  .d-xxl-grid { display: grid !important; }
}

/* ========================================
   3XL Breakpoint (1440px+)
   ======================================== */

@media (min-width: 1440px) {
  .container { max-width: var(--container-3xl); }

  .col-3xl { flex: 1 0 0%; }
  .col-3xl-auto { flex: 0 0 auto; width: auto; }
  .col-3xl-1 { flex: 0 0 auto; width: 8.333333%; }
  .col-3xl-2 { flex: 0 0 auto; width: 16.666667%; }
  .col-3xl-3 { flex: 0 0 auto; width: 25%; }
  .col-3xl-4 { flex: 0 0 auto; width: 33.333333%; }
  .col-3xl-5 { flex: 0 0 auto; width: 41.666667%; }
  .col-3xl-6 { flex: 0 0 auto; width: 50%; }
  .col-3xl-7 { flex: 0 0 auto; width: 58.333333%; }
  .col-3xl-8 { flex: 0 0 auto; width: 66.666667%; }
  .col-3xl-9 { flex: 0 0 auto; width: 75%; }
  .col-3xl-10 { flex: 0 0 auto; width: 83.333333%; }
  .col-3xl-11 { flex: 0 0 auto; width: 91.666667%; }
  .col-3xl-12 { flex: 0 0 auto; width: 100%; }

  .d-3xl-none { display: none !important; }
  .d-3xl-block { display: block !important; }
  .d-3xl-flex { display: flex !important; }
  .d-3xl-grid { display: grid !important; }
}

/* ========================================
   4XL Breakpoint (1920px+ / Full HD+)
   ======================================== */

@media (min-width: 1920px) {
  .container { max-width: var(--container-4xl); }

  .col-4xl { flex: 1 0 0%; }
  .col-4xl-auto { flex: 0 0 auto; width: auto; }
  .col-4xl-1 { flex: 0 0 auto; width: 8.333333%; }
  .col-4xl-2 { flex: 0 0 auto; width: 16.666667%; }
  .col-4xl-3 { flex: 0 0 auto; width: 25%; }
  .col-4xl-4 { flex: 0 0 auto; width: 33.333333%; }
  .col-4xl-5 { flex: 0 0 auto; width: 41.666667%; }
  .col-4xl-6 { flex: 0 0 auto; width: 50%; }
  .col-4xl-7 { flex: 0 0 auto; width: 58.333333%; }
  .col-4xl-8 { flex: 0 0 auto; width: 66.666667%; }
  .col-4xl-9 { flex: 0 0 auto; width: 75%; }
  .col-4xl-10 { flex: 0 0 auto; width: 83.333333%; }
  .col-4xl-11 { flex: 0 0 auto; width: 91.666667%; }
  .col-4xl-12 { flex: 0 0 auto; width: 100%; }

  .d-4xl-none { display: none !important; }
  .d-4xl-block { display: block !important; }
  .d-4xl-flex { display: flex !important; }
  .d-4xl-grid { display: grid !important; }
}

/* ========================================
   Print Media Query
   ======================================== */

@media print {
  .d-print-none { display: none !important; }
  .d-print-block { display: block !important; }
  .d-print-inline { display: inline !important; }

  .container {
    max-width: 100%;
  }

  .row {
    page-break-inside: avoid;
  }
}

/* ========================================
   Accessibility Enhancements
   ======================================== */

/* Reduced Motion */
@media (prefers-reduced-motion: reduce) {
  *,
  *::before,
  *::after {
    animation-duration: 0.01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.01ms !important;
    scroll-behavior: auto !important;
  }
}

/* High Contrast Mode */
@media (prefers-contrast: more) {
  :root {
    --color-border: #000;
  }

  .card {
    border-width: 2px;
  }

  .btn {
    border-width: 2px;
  }
}

/* Dark Mode Support — 無効化済み（ライトモード固定） */

/* ========================================
   Touch Device Optimizations
   ======================================== */

@media (hover: none) and (pointer: coarse) {
  /* Larger tap targets for touch */
  .btn {
    min-height: 44px;
    min-width: 44px;
  }

  .nav-menu a {
    min-height: 48px;
    padding: 12px 16px;
  }

  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="password"],
  textarea,
  select {
    min-height: 44px;
    font-size: 1rem; /* Prevent iOS zoom */
  }
}

/* ========================================
   Landscape/Portrait Orientation
   ======================================== */

@media (orientation: landscape) and (max-height: 500px) {
  /* Compact header for landscape phones */
  .site-header {
    padding: 8px 0;
  }

  .hero-section {
    min-height: 80vh;
  }
}

@media (orientation: portrait) {
  /* Full height hero for portrait */
  .hero-section {
    min-height: 60vh;
  }
}

/* ========================================
   ウェアラブル・スマートウォッチ対応 (<=279px)
   ======================================== */

@media (max-width: 279px) {
  :root {
    --font-size-base: 10px;
    --font-size-scale: 0.7;
    --space-unit: 2px;
  }

  /* 最小限の表示に最適化 */
  body {
    font-size: 0.625rem;
    line-height: 1.3;
  }

  /* ヘッダー非表示・最小化 */
  .site-header {
    padding: 2px;
    position: static;
  }

  .site-header .logo {
    max-width: 60px;
    height: auto;
  }

  .nav-menu,
  .mega-menu,
  .site-header nav {
    display: none !important;
  }

  /* シンプルなハンバーガーのみ表示 */
  .mobile-menu-toggle {
    width: 32px;
    height: 32px;
    padding: 4px;
  }

  /* コンテンツ最適化 */
  .container,
  .container-fluid {
    padding-left: 4px;
    padding-right: 4px;
  }

  .row {
    margin-left: -2px;
    margin-right: -2px;
  }

  [class*="col-"] {
    padding-left: 2px;
    padding-right: 2px;
  }

  /* 全カラムを100%幅に */
  .col-watch-12,
  [class*="col-"] {
    flex: 0 0 100%;
    max-width: 100%;
  }

  /* カード最適化 */
  .card {
    border-radius: 4px;
    margin-bottom: 4px;
  }

  .card-body {
    padding: 4px;
  }

  /* ボタン最適化 */
  .btn {
    padding: 4px 8px;
    font-size: 0.625rem;
    min-height: 28px;
    border-radius: 4px;
  }

  /* フッター最小化 */
  .site-footer {
    padding: 4px;
    font-size: 0.5rem;
  }

  .site-footer nav,
  .site-footer .footer-links {
    display: none;
  }

  /* 画像を縮小 */
  img {
    max-width: 100%;
    height: auto;
  }

  /* 横スクロール防止 */
  html, body {
    overflow-x: hidden;
    max-width: 100vw;
  }

  /* ヒーロー最小化 */
  .hero-section {
    min-height: 100px;
    padding: 8px;
  }

  .hero-section h1 {
    font-size: 0.875rem;
  }

  .hero-section p {
    font-size: 0.625rem;
  }

  /* テーブル縦積み */
  table {
    display: block;
    overflow-x: auto;
  }

  table thead {
    display: none;
  }

  table tr {
    display: block;
    margin-bottom: 4px;
    border: 1px solid var(--color-border);
  }

  table td {
    display: block;
    padding: 2px 4px;
    font-size: 0.5625rem;
  }

  table td::before {
    content: attr(data-label) ": ";
    font-weight: bold;
  }
}

/* ========================================
   極小端末対応 (280px - 319px)
   ======================================== */

@media (min-width: 280px) and (max-width: 319px) {
  :root {
    --font-size-base: 11px;
    --font-size-scale: 0.8;
  }

  body {
    font-size: 0.6875rem;
  }

  .container {
    padding-left: 6px;
    padding-right: 6px;
  }

  .col-2xs-12 {
    flex: 0 0 100%;
    max-width: 100%;
  }

  .col-2xs-6 {
    flex: 0 0 50%;
    max-width: 50%;
  }

  .btn {
    padding: 6px 10px;
    font-size: 0.6875rem;
  }
}

/* ========================================
   追加ブレイクポイント: 360px (xs-lg)
   ======================================== */

@media (min-width: 360px) {
  .col-xs-lg-12 { flex: 0 0 100%; max-width: 100%; }
  .col-xs-lg-6 { flex: 0 0 50%; max-width: 50%; }
  .col-xs-lg-4 { flex: 0 0 33.333333%; max-width: 33.333333%; }
  .col-xs-lg-3 { flex: 0 0 25%; max-width: 25%; }

  .d-xs-lg-none { display: none !important; }
  .d-xs-lg-block { display: block !important; }
  .d-xs-lg-flex { display: flex !important; }
}

/* ========================================
   追加ブレイクポイント: 390px (sm - iPhone標準)
   ======================================== */

@media (min-width: 390px) {
  .col-sm-12 { flex: 0 0 100%; max-width: 100%; }
  .col-sm-6 { flex: 0 0 50%; max-width: 50%; }
  .col-sm-4 { flex: 0 0 33.333333%; max-width: 33.333333%; }
  .col-sm-3 { flex: 0 0 25%; max-width: 25%; }

  .d-sm-none { display: none !important; }
  .d-sm-block { display: block !important; }
  .d-sm-flex { display: flex !important; }
}

/* ========================================
   追加ブレイクポイント: 414px (sm-lg - iPhone Pro Max)
   ======================================== */

@media (min-width: 414px) {
  .col-sm-lg-12 { flex: 0 0 100%; max-width: 100%; }
  .col-sm-lg-6 { flex: 0 0 50%; max-width: 50%; }
  .col-sm-lg-4 { flex: 0 0 33.333333%; max-width: 33.333333%; }
  .col-sm-lg-3 { flex: 0 0 25%; max-width: 25%; }

  .d-sm-lg-none { display: none !important; }
  .d-sm-lg-block { display: block !important; }
  .d-sm-lg-flex { display: flex !important; }
}

/* ========================================
   追加ブレイクポイント: 600px (md-lg)
   ======================================== */

@media (min-width: 600px) {
  .container {
    max-width: 100%;
  }

  .col-md-lg-12 { flex: 0 0 100%; max-width: 100%; }
  .col-md-lg-6 { flex: 0 0 50%; max-width: 50%; }
  .col-md-lg-4 { flex: 0 0 33.333333%; max-width: 33.333333%; }
  .col-md-lg-3 { flex: 0 0 25%; max-width: 25%; }
  .col-md-lg-2 { flex: 0 0 16.666667%; max-width: 16.666667%; }

  .d-md-lg-none { display: none !important; }
  .d-md-lg-block { display: block !important; }
  .d-md-lg-flex { display: flex !important; }
}

/* ========================================
   追加ブレイクポイント: 900px (lg-xl)
   ======================================== */

@media (min-width: 900px) {
  .container {
    max-width: 840px;
  }

  .col-lg-xl-12 { flex: 0 0 100%; max-width: 100%; }
  .col-lg-xl-6 { flex: 0 0 50%; max-width: 50%; }
  .col-lg-xl-4 { flex: 0 0 33.333333%; max-width: 33.333333%; }
  .col-lg-xl-3 { flex: 0 0 25%; max-width: 25%; }
  .col-lg-xl-2 { flex: 0 0 16.666667%; max-width: 16.666667%; }

  .d-lg-xl-none { display: none !important; }
  .d-lg-xl-block { display: block !important; }
  .d-lg-xl-flex { display: flex !important; }
}

/* ========================================
   追加ブレイクポイント: 1200px (xl-xxl)
   ======================================== */

@media (min-width: 1200px) {
  .container {
    max-width: 1080px;
  }

  .col-xl-xxl-12 { flex: 0 0 100%; max-width: 100%; }
  .col-xl-xxl-6 { flex: 0 0 50%; max-width: 50%; }
  .col-xl-xxl-4 { flex: 0 0 33.333333%; max-width: 33.333333%; }
  .col-xl-xxl-3 { flex: 0 0 25%; max-width: 25%; }
  .col-xl-xxl-2 { flex: 0 0 16.666667%; max-width: 16.666667%; }

  .d-xl-xxl-none { display: none !important; }
  .d-xl-xxl-block { display: block !important; }
  .d-xl-xxl-flex { display: flex !important; }
}

/* ========================================
   追加ブレイクポイント: 1600px (4xl)
   ======================================== */

@media (min-width: 1600px) {
  .container {
    max-width: 1480px;
  }

  .col-4xl-12 { flex: 0 0 100%; max-width: 100%; }
  .col-4xl-6 { flex: 0 0 50%; max-width: 50%; }
  .col-4xl-4 { flex: 0 0 33.333333%; max-width: 33.333333%; }
  .col-4xl-3 { flex: 0 0 25%; max-width: 25%; }
  .col-4xl-2 { flex: 0 0 16.666667%; max-width: 16.666667%; }

  .d-4xl-none { display: none !important; }
  .d-4xl-block { display: block !important; }
  .d-4xl-flex { display: flex !important; }
}

/* ========================================
   追加ブレイクポイント: 1920px (5xl - フルHD+)
   ======================================== */

@media (min-width: 1920px) {
  .container {
    max-width: 1600px;
  }

  :root {
    --font-size-base: 16px;
    --font-size-scale: 1.1;
  }

  .col-5xl-12 { flex: 0 0 100%; max-width: 100%; }
  .col-5xl-6 { flex: 0 0 50%; max-width: 50%; }
  .col-5xl-4 { flex: 0 0 33.333333%; max-width: 33.333333%; }
  .col-5xl-3 { flex: 0 0 25%; max-width: 25%; }
  .col-5xl-2 { flex: 0 0 16.666667%; max-width: 16.666667%; }

  .d-5xl-none { display: none !important; }
  .d-5xl-block { display: block !important; }
  .d-5xl-flex { display: flex !important; }
}

/* ========================================
   Print Styles Enhancement
   ======================================== */

@media print {
  /* 印刷時の最適化 */
  .site-header,
  .site-footer,
  .nav-menu,
  .mobile-menu-toggle,
  .btn-print-hide {
    display: none !important;
  }

  body {
    font-size: 12pt;
    line-height: 1.5;
    color: #000;
    background: #fff;
  }

  .container {
    max-width: 100%;
    padding: 0;
  }

  a {
    color: #000;
    text-decoration: underline;
  }

  a[href]::after {
    content: " (" attr(href) ")";
    font-size: 90%;
  }

  img {
    max-width: 100% !important;
    page-break-inside: avoid;
  }

  h1, h2, h3, h4, h5, h6 {
    page-break-after: avoid;
  }

  table {
    border-collapse: collapse;
  }

  table, th, td {
    border: 1px solid #000;
  }
}

/* === foundation/_mobile-utilities.css === */

/* ==========================================================================
 * _mobile-utilities.css
 * Phase 1: モバイル・タブレット リデザイン 共通ユーティリティ
 *
 * スマホファースト（min-width のみ）。max-width / !important 禁止。
 * カラーは _tokens.css 変数のみ使用。フォントサイズは rem / clamp() のみ。
 * ========================================================================== */

/* --------------------------------------------------------------------------
 * 1. 表示切替
 * -------------------------------------------------------------------------- */

/* sp-only: スマホのみ表示 → md(480px)以上で非表示 */
.sp-only {
  display: block;
}

@media (min-width: 480px) {
  .sp-only {
    display: none;
  }
}

/* tb-only: タブレットのみ表示 */
.tb-only {
  display: none;
}

@media (min-width: 480px) {
  .tb-only {
    display: block;
  }
}

@media (min-width: 1024px) {
  .tb-only {
    display: none;
  }
}

/* pc-only: PCのみ表示 → xl(1024px)以上で表示 */
.pc-only {
  display: none;
}

@media (min-width: 1024px) {
  .pc-only {
    display: block;
  }
}

/* --------------------------------------------------------------------------
 * 2. 横スクロール .scroll-container
 * -------------------------------------------------------------------------- */

.scroll-container {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  gap: 0.5rem;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none; /* Firefox */
}

.scroll-container::-webkit-scrollbar {
  display: none; /* Chrome / Safari */
}

.scroll-container > * {
  scroll-snap-align: start;
  flex-shrink: 0;
}

/* 右端フェード（次カードの覗き見を示唆） */
.scroll-fade-right {
  mask-image: linear-gradient(
    to right,
    #000 0%,
    #000 85%,
    transparent 100%
  );
  -webkit-mask-image: linear-gradient(
    to right,
    #000 0%,
    #000 85%,
    transparent 100%
  );
}

/* lg(768px)以上: 横スクロール → 通常フロー */
@media (min-width: 768px) {
  .scroll-container {
    overflow: visible;
    scroll-snap-type: none;
    flex-wrap: wrap;
  }

  .scroll-container > * {
    scroll-snap-align: unset;
    flex-shrink: 1;
  }

  .scroll-fade-right {
    mask-image: none;
    -webkit-mask-image: none;
  }
}

/* --------------------------------------------------------------------------
 * 3. 4列グリッド .grid-4col
 * -------------------------------------------------------------------------- */

.grid-4col {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0.5rem;
}

.grid-4col > * {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  border-radius: var(--radius-sm, 0.5rem);
  min-height: 3rem;
}

/* lg(768px)以上: 5列 */
@media (min-width: 768px) {
  .grid-4col {
    grid-template-columns: repeat(5, 1fr);
  }
}

/* xl(1024px)以上: 6列 */
@media (min-width: 1024px) {
  .grid-4col {
    grid-template-columns: repeat(6, 1fr);
  }
}

/* --------------------------------------------------------------------------
 * 4. アコーディオン details.mobile-accordion
 *    ネイティブ <details>/<summary> のみ使用。JS不要。
 * -------------------------------------------------------------------------- */

details.mobile-accordion > summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: 0.75rem;
  padding-inline: 1rem;
  font-weight: var(--font-weight-bold, 700);
  background-color: var(--color-background);
  border-radius: var(--radius-md);
  cursor: pointer;
  color: var(--color-text-main);
  list-style: none;
  transition: background-color var(--transition-fast);
}

/* デフォルトの三角マーカーを非表示 */
details.mobile-accordion > summary::-webkit-details-marker {
  display: none;
}

details.mobile-accordion > summary::marker {
  content: "";
}

/* 展開アイコン（Material Symbols の expand_more） */
details.mobile-accordion > summary::after {
  font-family: "Material Symbols Outlined";
  content: "expand_more";
  font-size: 1.5rem;
  line-height: 1;
  color: var(--color-text-sub);
  transition: transform var(--transition-normal);
}

/* 開いた状態: アイコン回転 */
details.mobile-accordion[open] > summary::after {
  transform: rotate(180deg);
}

/* アコーディオン内容 */
details.mobile-accordion .accordion-content {
  padding-block-start: 0.75rem;
}

/* lg(768px)以上: アコーディオン強制展開（summaryを非表示、中身は常時表示） */
@media (min-width: 768px) {
  details.mobile-accordion {
    display: contents;
  }

  details.mobile-accordion > summary {
    display: none;
  }

  details.mobile-accordion .accordion-content {
    display: block;
    padding-block-start: 0;
  }
}

/* --------------------------------------------------------------------------
 * 5. ユーティリティ
 * -------------------------------------------------------------------------- */

/* タップターゲット: WCAG推奨 44px / 本プロジェクト最低 3rem (48px) */
.tap-target {
  min-height: 3rem;
  min-width: 3rem;
  -webkit-tap-highlight-color: transparent;
}

.tap-target:active {
  transform: scale(0.97);
}

/* 全ボタン・リンクのタップフィードバック (Phase 6) */
a,
button,
[role="button"],
summary {
  -webkit-tap-highlight-color: transparent;
}

a:active,
button:active,
[role="button"]:active,
summary:active {
  opacity: 0.85;
}

@media (prefers-reduced-motion: reduce) {
  .tap-target:active,
  a:active,
  button:active {
    transform: none;
    opacity: 1;
  }
}
.line-clamp-2 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.line-clamp-3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}

/* ボトムバー分の余白確保 */
.bottom-safe {
  padding-block-end: calc(3.5rem + env(safe-area-inset-bottom, 0px) + 1rem);
}

/* iOS自動ズーム防止: 全 input/select/textarea の font-size を 1rem 以上に保証 (Phase 6) */
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="search"],
input[type="number"],
input[type="date"],
input[type="password"],
input[type="url"],
textarea,
select {
  font-size: max(1rem, var(--font-size-base));
}

/* --- Layout --- */

/* === layout/_sidebar.css === */

/* ==========================================================================
 * Layout: Sidebar (.l-sidebar)
 * モバイル：アコーディオン / デスクトップ：常時展開
 * スマホファースト（min-width メディアクエリ）
 * ========================================================================== */

/* ---------- 全体 ---------- */
.l-sidebar {
  width: 100%;
  margin-block-end: var(--spacing-lg);
}

@media (min-width: 1024px) {
  .l-sidebar {
    width: var(--sidebar-width);
    flex-shrink: 0;
    margin-block-end: 0;
    position: sticky;
    top: calc(var(--header-height) + var(--spacing-md));
    align-self: flex-start;
  }
}

/* ==========================================================================
 * アコーディオン開閉ボタン（モバイル）
 * ========================================================================== */
.l-sidebar__toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: var(--touch-target-min);
  padding: var(--spacing-md);
  background-color: var(--color-surface);
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--radius-md);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

@media (min-width: 1024px) {
  .l-sidebar__toggle {
    display: none;
  }
}

.l-sidebar__toggle-title {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-main);
}

.l-sidebar__toggle-icon {
  transition: transform var(--transition-normal);
  color: var(--color-text-sub);
}

.l-sidebar__toggle[aria-expanded="true"] .l-sidebar__toggle-icon {
  transform: rotate(180deg);
}

/* ==========================================================================
 * ナビゲーション本体
 * ========================================================================== */
.l-sidebar__nav {
  display: none;
  margin-block-start: var(--spacing-sm);
  background-color: var(--color-surface);
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--radius-md);
  padding: var(--spacing-md);
}

.l-sidebar__nav--open {
  display: block;
}

@media (min-width: 1024px) {
  .l-sidebar__nav {
    display: block;
    margin-block-start: 0;
  }
}

/* ---------- 見出し（デスクトップ表示） ---------- */
.l-sidebar__heading {
  display: none;
}

@media (min-width: 1024px) {
  .l-sidebar__heading {
    display: block;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    color: var(--color-text-main);
    padding-block-end: var(--spacing-sm);
    margin-block-end: var(--spacing-sm);
    border-block-end: var(--border-width-thick) solid var(--color-primary);
  }
}

/* ---------- メニューリスト ---------- */
.l-sidebar__menu {
  display: flex;
  flex-direction: column;
}

.l-sidebar__link {
  display: flex;
  align-items: center;
  padding: var(--spacing-sm) var(--spacing-md);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-main);
  min-height: var(--touch-target-min);
  border-radius: var(--radius-sm);
  transition: background-color var(--transition-fast), color var(--transition-fast);
}

.l-sidebar__link:hover {
  background-color: var(--color-primary-light);
  color: var(--color-primary);
}

/* 現在ページ */
.l-sidebar__link--current {
  background-color: var(--color-primary-light);
  color: var(--color-primary);
  font-weight: var(--font-weight-bold);
  border-inline-start: var(--border-width-thick) solid var(--color-primary);
}

/* ==========================================================================
 * Reduced Motion
 * ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  .l-sidebar__toggle-icon {
    transition: none;
  }
}

/* === layout/_main.css === */

/* ==========================================================================
 * Layout: Main (.l-main)
 * メインコンテンツエリア
 * ========================================================================== */
.l-main {
  max-width: var(--content-max-width);
  margin-inline: auto;
  padding-inline: var(--spacing-md);
  padding-block: var(--spacing-xl);
}

/* === layout/_grid.css === */

/* ==========================================================================
 * Layout: Grid (.l-grid)
 * グリッドシステム（メイン + サイドバー等）
 * スマホファースト：単カラム → min-width: 1024px で2カラム
 * ========================================================================== */
.l-grid {
  display: grid;
  gap: var(--spacing-xl);
  grid-template-columns: 1fr;
}

/* Desktop: 1024px以上でサイドバー付き2カラム */
@media (min-width: 1024px) {
  .l-grid--with-sidebar {
    grid-template-columns: 1fr var(--sidebar-width);
  }
}

/* === layout/_saikazo-header.css === */

/* ================================================================
   加須病院スタイル ヘッダー CSS
   木古内スタイル 2段ヘッダー（2026-01-12 リファクタリング）
   ================================================================ */

/* ================================================================
   CSS変数
   ================================================================ */
:root {
  --header-utility-height: 48px;
  --header-main-height: 50px;
  --header-height: calc(var(--header-utility-height) + var(--header-main-height));
  --header-mobile-height: 3.5rem;
  --header-bg: var(--color-surface);
  --header-nav-bg: var(--sz-primary-dark);
  --header-text: var(--color-text-main);
  --header-accent: var(--color-reservation-cta, #00897B);
  --header-accent-light: rgba(0, 137, 123, 0.08);
  --header-utility-bg: var(--color-surface);
  --header-utility-text: var(--color-text-main);
  --header-utility-border: var(--color-border-light);
  --header-transition: all var(--sz-duration) var(--sz-ease);
}

/* ================================================================
   PC ヘッダー（ロゴ左2段 + 右2段 加須病院スタイル）
   ================================================================ */
.sz-header {
  position: fixed;
  top: 0;
  inset-inline: 0;
  z-index: var(--sz-z-header);
  background: var(--header-bg);
  box-shadow: var(--shadow-header);
  overflow: visible;
  transition: var(--header-transition);
}

/* ================================================================
   ラッパー: ロゴ左 + 右2段
   ================================================================ */
.sz-header__wrapper {
  display: flex;
  align-items: stretch;
}

/* ================================================================
   左: ロゴ（2段分の高さ）
   ================================================================ */
.sz-header__logo {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  min-width: 200px;
  padding-inline: clamp(0.75rem, 1.5vw, var(--spacing-lg));
  border-inline-end: 1px solid var(--header-utility-border);
  background: var(--header-bg);
}

.sz-header__logo-link {
  display: flex;
  align-items: center;
  gap: 10px;
  text-decoration: none;
  flex-shrink: 0;
}

.sz-header__logo-img {
  height: 36px;
  width: auto;
  object-fit: contain;
}

.sz-header__logo-name {
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-bold);
  color: var(--header-accent);
  letter-spacing: 0.02em;
  white-space: nowrap;
}

/* ================================================================
   右: 2段エリア
   ================================================================ */
.sz-header__right {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
}

/* ================================================================
   上段: ユーティリティエリア
   ================================================================ */
.sz-header__upper {
  height: var(--header-utility-height);
  background: var(--header-bg);
  border-bottom: none;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-inline: clamp(0.5rem, 1vw, var(--spacing-lg));
  transition: height var(--transition-normal), opacity var(--transition-normal);
  overflow: visible;
}

/* ================================================================
   ユーティリティ機能群（上段右）
   ================================================================ */
.sz-header__utility {
  display: flex;
  align-items: center;
  gap: clamp(0.25rem, 0.6vw, var(--spacing-md));
  flex-wrap: nowrap;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.sz-header__utility::-webkit-scrollbar {
  display: none;
}

/* 区切り線 */
.sz-header__divider {
  width: 1px;
  height: 16px;
  background: var(--color-border);
  flex-shrink: 0;
}

/* ================================================================
   アクセシビリティアイコン群
   ================================================================ */
.sz-header__a11y-icons {
  display: flex;
  align-items: center;
  gap: 4px;
}

.sz-header__a11y-item {
  position: relative;
}

.sz-header__a11y-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: var(--touch-target-min);
  min-width: var(--touch-target-min);
  width: var(--touch-target-min);
  height: var(--touch-target-min);
  padding: 0;
  border: 1px solid var(--color-border);
  border-radius: 50%;
  background: transparent;
  color: var(--color-text-sub);
  cursor: pointer;
  transition: all var(--transition-fast);
}

.sz-header__a11y-btn .material-symbols-outlined {
  font-size: 1.125rem;
}

.sz-header__a11y-btn:hover {
  color: var(--header-accent);
  background: var(--header-accent-light);
  border-color: var(--header-accent);
}

.sz-header__a11y-btn:focus-visible {
  outline: 2px solid var(--header-accent);
  outline-offset: 2px;
}

.sz-header__a11y-btn.is-active {
  color: #fff;
  background: var(--header-accent);
  border-color: var(--header-accent);
}

/* ツールチップ */
.sz-header__a11y-tooltip {
  position: absolute;
  top: calc(100% + 6px);
  left: 50%;
  transform: translateX(-50%);
  padding: 5px 10px;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-surface);
  background: var(--color-text-main);
  border-radius: var(--radius-sm);
  white-space: nowrap;
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--transition-fast), visibility var(--transition-fast);
  z-index: 1001;
}

.sz-header__a11y-tooltip::before {
  content: '';
  position: absolute;
  bottom: 100%;
  left: 50%;
  transform: translateX(-50%);
  border: 5px solid transparent;
  border-bottom-color: var(--color-text-main);
}

.sz-header__a11y-item:hover .sz-header__a11y-tooltip,
.sz-header__a11y-btn:focus + .sz-header__a11y-tooltip {
  opacity: 1;
  visibility: visible;
}

/* ================================================================
   ユーティリティリンク
   ================================================================ */
.sz-header__util-link {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xs);
  padding: var(--spacing-xs) 10px;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-normal);
  color: var(--color-text-sub);
  text-decoration: none;
  background: none;
  border: none;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: all var(--transition-fast);
  white-space: nowrap;
}

.sz-header__util-link .material-symbols-outlined {
  font-size: 1.125rem;
}

.sz-header__util-link:hover {
  color: var(--header-accent);
  background: var(--header-accent-light);
}

/* ================================================================
   電話番号（上段右端・大きめ太字）
   ================================================================ */
.sz-header__tel {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--header-text);
  text-decoration: none;
  letter-spacing: 0.5px;
  transition: opacity var(--transition-fast);
  white-space: nowrap;
}

.sz-header__tel .material-symbols-outlined {
  font-size: 1.375rem;
  color: var(--header-accent);
}

.sz-header__tel:hover {
  opacity: 0.8;
}

/* ================================================================
   下段: グローバルナビゲーション
   ================================================================ */
.sz-header__lower {
  height: var(--header-main-height);
  background: var(--header-bg);
  display: flex;
  align-items: center;
  justify-content: flex-end;
  padding-inline: var(--spacing-lg);
  gap: var(--spacing-md);
}

.sz-header__lower .sz-header__container {
  justify-content: flex-end;
}

/* CTAボタングループ */
.sz-header__cta-group {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

/* ================================================================
   検索ドロップダウン
   ================================================================ */
.sz-header__search-dropdown {
  position: absolute;
  top: var(--header-height);
  inset-inline: 0;
  background: var(--header-bg);
  border-bottom: 1px solid var(--header-utility-border);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  padding: 12px var(--spacing-lg);
  z-index: var(--z-dropdown);
}

.sz-header__search-dropdown[hidden] {
  display: none;
}

.sz-header__search-dropdown .sz-header__search-form {
  display: flex;
  align-items: center;
  max-width: 600px;
  margin: 0 auto;
}

.sz-header__search-dropdown .sz-header__search-input {
  flex: 1;
  padding: var(--spacing-sm) var(--spacing-md);
  font-size: var(--font-size-base);
  border: 1px solid var(--color-border);
  border-radius: 24px 0 0 24px;
  outline: none;
}

.sz-header__search-dropdown .sz-header__search-input:focus {
  border-color: var(--header-accent);
}

.sz-header__search-submit {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: var(--spacing-sm) var(--spacing-md);
  background: var(--header-accent);
  color: var(--color-surface);
  border: 2px solid var(--header-accent);
  border-left: none;
  border-radius: 0 24px 24px 0;
  cursor: pointer;
  transition: background var(--transition-fast),
              color var(--transition-fast);
}

.sz-header__search-submit:hover {
  background: var(--color-surface);
  color: var(--header-accent);
}

/* ================================================================
   言語切替ドロップダウン
   ================================================================ */
.sz-header__lang-dropdown {
  position: absolute;
  top: var(--header-height);
  right: var(--spacing-lg);
  background: var(--header-bg);
  border: 1px solid var(--header-utility-border);
  border-radius: var(--radius-md);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  padding: var(--spacing-sm);
  z-index: var(--z-dropdown);
}

.sz-header__lang-dropdown[hidden] {
  display: none;
}

.sz-header__lang-dropdown .sz-header__lang-form {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.sz-header__lang-btn {
  padding: var(--spacing-sm) var(--spacing-lg);
  font-size: var(--font-size-sm);
  border: none;
  border-radius: var(--radius-sm);
  background: transparent;
  cursor: pointer;
  text-align: left;
  transition: background var(--transition-fast);
}

.sz-header__lang-btn:hover {
  background: var(--header-accent-light);
}

.sz-header__lang-btn.is-active {
  font-weight: 700;
  color: var(--header-accent);
  background: var(--header-accent-light);
}

/* ================================================================
   CTAボタン
   ================================================================ */
.sz-header__cta-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 10px 20px;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  text-decoration: none;
  border-radius: var(--radius-full);
  transition: all var(--transition-fast);
  white-space: nowrap;
}

.sz-header__cta-btn .material-symbols-outlined {
  font-size: 1.125rem;
}

.sz-header__cta-btn--access {
  background: var(--color-success);
  color: var(--color-surface);
}

.sz-header__cta-btn--access:hover {
  background: #059669;
}

.sz-header__cta-btn--schedule {
  background: #5ebb8f;
  color: var(--color-surface);
}

.sz-header__cta-btn--schedule:hover {
  background: #4da87d;
}

.sz-header__cta-btn--ai {
  background: #e8a458;
  color: var(--color-surface);
}

.sz-header__cta-btn--ai:hover {
  background: #c9833a;
  color: var(--color-surface);
}

.sz-header__cta-btn--reservation {
  background: var(--color-reservation-cta);
  color: var(--color-surface);
}

.sz-header__cta-btn--reservation:hover {
  background: var(--color-reservation-cta-hover);
  color: var(--color-surface);
}

/* ================================================================
   ホームページ ヘッダー（加須病院スタイル - 白背景固定）
   body.home-page で有効化
   ================================================================ */
body.home-page .sz-header {
  background: var(--header-bg);
  box-shadow: var(--shadow-header);
}

body.home-page .sz-header__upper {
  background: var(--header-bg);
  border-bottom-color: var(--header-utility-border);
}

body.home-page .sz-header__util-link {
  color: var(--header-utility-text);
}

body.home-page .sz-header__tel {
  color: var(--header-text);
}

body.home-page .sz-header__util-link:hover {
  color: var(--header-accent);
  background: var(--header-accent-light);
}

body.home-page .sz-header__lower {
  background: var(--header-bg);
}

body.home-page .sz-mainnav__link,
body.home-page .sz-header__logo-name {
  color: var(--header-text);
}

/* ホームページ通常時のホバー */
body.home-page .sz-mainnav__link:hover {
  color: var(--header-accent, #00897B);
}

body.home-page .sz-mainnav__link:hover::after {
  width: 60%;
  background: var(--header-accent, #00897B);
}

/* スクロール後のヘッダー */
body.home-page .sz-header.is-scrolled {
  box-shadow: var(--shadow-header);
}

/* ================================================================
   メインナビ（右下エリア内）
   ================================================================ */
.sz-header__mainnav {
  display: flex;
  align-items: center;
}

.sz-mainnav {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 4px;
}

.sz-mainnav__item {
  position: relative;
}

.sz-mainnav__link {
  display: flex;
  align-items: center;
  padding: var(--spacing-sm) 14px;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  color: var(--header-text);
  text-decoration: none;
  border-radius: 0;
  transition: color var(--transition-fast);
  white-space: nowrap;
  position: relative;
}

/* ホバー時: 下線が出現（済生会加須スタイル） */
.sz-mainnav__link::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 0;
  height: 3px;
  background: var(--header-accent, #00897B);
  border-radius: 2px 2px 0 0;
  transition: width 0.25s ease;
}

.sz-mainnav__link:hover {
  color: var(--header-accent, #00897B);
}

.sz-mainnav__link:hover::after {
  width: 60%;
}

.sz-mainnav__item.is-active .sz-mainnav__link {
  color: var(--header-accent, #00897B);
}

.sz-mainnav__item.is-active .sz-mainnav__link::after {
  width: 60%;
}

/* ナビ矢印アイコン */
.sz-mainnav__arrow {
  font-size: 1.125rem;
  transition: transform 0.2s ease;
}

.sz-mainnav__item.is-active .sz-mainnav__arrow {
  transform: rotate(180deg);
}

/* ================================================================
   PC ナビゲーション（1行統合・白背景・黒文字）
   ================================================================ */
.sz-header__nav {
  background: transparent;
}

.sz-header__nav-inner {
  width: 100%;
  max-width: none;
  margin: 0 auto;
  padding-inline: 40px;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}

.sz-nav {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
}

.sz-nav__item {
  position: relative;
}

.sz-nav__link {
  display: flex;
  align-items: center;
  padding: 10px 12px;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  color: var(--sz-primary-dark);
  text-decoration: none;
  transition: color var(--transition-fast);
  white-space: nowrap;
}

.sz-nav__link:hover,
.sz-nav__item.is-active .sz-nav__link {
  color: var(--header-accent);
}

/* アクティブ時の下線 */
.sz-nav__item.is-active .sz-nav__link::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: 40px;
  height: 3px;
  background: var(--header-accent);
  border-radius: 2px 2px 0 0;
}

/* ナビボタン */
.sz-nav__btns {
  display: flex;
  gap: 6px;
  flex-shrink: 0;
}

.sz-nav__btn {
  display: flex;
  align-items: center;
  gap: 3px;
  padding: var(--spacing-sm) 12px;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  text-decoration: none;
  border-radius: var(--radius-sm);
  transition: all var(--transition-fast);
  white-space: nowrap;
}

.sz-nav__btn .material-symbols-outlined {
  font-size: 1rem;
}

.sz-nav__btn--access {
  background: var(--color-success);
  color: var(--color-surface);
}

.sz-nav__btn--access:hover {
  background: #059669;
}

.sz-nav__btn--schedule {
  background: #a5500f;
  color: var(--color-surface);
}

.sz-nav__btn--schedule:hover {
  background: #ea580c;
}

/* ================================================================
   メガメニュー（木古内スタイル - ヘッダー直下展開）

   【設計】
   - 済生会加須スタイル: ご利用案内 → カードグリッド
   - 浅香山スタイル: 当院について/診療科/地域医療 → 写真 + リンク
   ================================================================ */

.sz-mega {
  position: fixed;
  top: var(--header-height);
  inset-inline: 0;
  width: 100%;
  z-index: var(--sz-z-dropdown);
  pointer-events: none;
  opacity: 0;
  visibility: hidden;
  transform: translateY(-8px);
  transition: opacity var(--transition-normal), visibility var(--transition-normal), transform var(--transition-normal);
}

.sz-mega.is-open {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}

.sz-mega__overlay {
  position: fixed;
  inset: 0;
  background: var(--color-overlay);
  z-index: -1;
  opacity: 0;
  visibility: hidden;
  transition: opacity var(--transition-normal);
}

.sz-mega.is-open .sz-mega__overlay {
  opacity: 1;
  visibility: visible;
}

.sz-mega__container {
  position: relative;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 0;
  background: var(--color-surface);
  border-radius: 0;
  box-shadow: var(--shadow-dialog);
  overflow: hidden;
}

.sz-mega__panel {
  display: none;
}

.sz-mega__panel.is-active {
  display: block;
}

/* ================================================================
   ご利用案内パネル（済生会加須スタイル: カードグリッド）
   ================================================================ */
.sz-mega__inner--cards {
  max-width: 960px;
  margin: 0 auto;
  padding: 36px 48px 40px;
}

.sz-mega__cards-header {
  margin-bottom: var(--spacing-lg);
  padding-bottom: var(--spacing-md);
  border-bottom: var(--border-width-thick) solid var(--color-border-light);
}

.sz-mega__cards-title {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  color: var(--sz-primary-dark);
  margin: 0 0 var(--spacing-xs);
}

.sz-mega__cards-en {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--sz-gray-400);
  text-transform: uppercase;
  letter-spacing: 0.1em;
}

.sz-mega__cards-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

/* カード単体 */
.sz-mega__guide-card {
  position: relative;
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
  padding: 22px 20px;
  padding-inline-end: 56px;
  background: var(--color-surface);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-lg);
  text-decoration: none;
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
  min-height: 80px;
}

.sz-mega__guide-card:hover {
  border-color: #c0d0e4;
  box-shadow: 0 4px 16px rgba(26, 54, 93, 0.08);
}

/* アイコン（丸背景） */
.sz-mega__guide-icon {
  width: 52px;
  height: 52px;
  min-width: 52px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  flex-shrink: 0;
}

.sz-mega__guide-icon .material-symbols-outlined {
  font-size: 1.625rem;
}

.sz-mega__guide-icon--blue {
  background: #e0f2fe;
}
.sz-mega__guide-icon--blue .material-symbols-outlined { color: #0284c7; }

.sz-mega__guide-icon--green {
  background: #d1fae5;
}
.sz-mega__guide-icon--green .material-symbols-outlined { color: #059669; }

.sz-mega__guide-icon--teal {
  background: #ccfbf1;
}
.sz-mega__guide-icon--teal .material-symbols-outlined { color: #0d9488; }

.sz-mega__guide-icon--red {
  background: #fee2e2;
}
.sz-mega__guide-icon--red .material-symbols-outlined { color: #dc2626; }

/* テキスト */
.sz-mega__guide-txt {
  flex: 1;
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-bold);
  color: var(--sz-primary-dark);
  line-height: var(--line-height-normal);
}

/* 矢印ボタン（右下） */
.sz-mega__guide-arrow {
  position: absolute;
  right: 12px;
  bottom: 12px;
  width: 30px;
  height: 30px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  color: #fff;
  transition: transform 0.2s ease;
}

.sz-mega__guide-arrow .material-symbols-outlined {
  font-size: 1rem;
}

.sz-mega__guide-card:hover .sz-mega__guide-arrow {
  transform: translateX(2px);
}

.sz-mega__guide-arrow--blue { background: #0284c7; }
.sz-mega__guide-arrow--green { background: #059669; }
.sz-mega__guide-arrow--teal { background: #0d9488; }
.sz-mega__guide-arrow--red { background: #dc2626; }

/* ================================================================
   当院について/診療科/地域医療パネル（浅香山スタイル: 写真 + リンク）
   ================================================================ */
.sz-mega__inner--photo {
  display: flex;
  max-width: 960px;
  margin: 0 auto;
  min-height: 0;
}

/* 左：写真パネル */
.sz-mega__photo-left {
  width: 340px;
  min-width: 340px;
  flex-shrink: 0;
  position: relative;
  overflow: hidden;
}

.sz-mega__photo-left img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  min-height: 280px;
}

/* 右：タイトル + リンクグリッド */
.sz-mega__photo-right {
  flex: 1;
  padding: 32px 40px;
  display: flex;
  flex-direction: column;
}

.sz-mega__photo-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--sz-primary-dark);
  margin: 0 0 var(--spacing-lg);
  padding-bottom: var(--spacing-md);
  border-bottom: 1px solid var(--color-border-light);
}

.sz-mega__photo-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #48bb8f;
  flex-shrink: 0;
}

/* リンクグリッド（2カラム） */
.sz-mega__photo-links {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0 32px;
}

.sz-mega__photo-links a {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  padding: 12px 0;
  font-size: var(--font-size-base);
  color: var(--header-text);
  text-decoration: none;
  border-bottom: 1px solid var(--sz-gray-100);
  transition: color var(--transition-fast), padding-left var(--transition-fast);
  line-height: var(--line-height-normal);
}

.sz-mega__photo-links a:hover {
  color: var(--header-accent, #114FA1);
  padding-left: 4px;
}

/* 矢印記号 */
.sz-mega__arrow {
  font-size: 0.75rem;
  color: var(--header-accent, #114FA1);
  font-weight: 700;
  flex-shrink: 0;
  transition: transform 0.2s ease;
}

.sz-mega__photo-links a:hover .sz-mega__arrow {
  transform: translateX(3px);
}

/* メガメニュー中間レスポンシブ（狭いPC画面対応） */
@media (min-width: 1025px) and (max-width: 1200px) {
  .sz-mega__inner--cards {
    padding: 28px 24px 32px;
  }
  .sz-mega__cards-grid {
    gap: 12px;
  }
  .sz-mega__guide-card {
    padding: 16px 14px;
    padding-right: 48px;
  }
  .sz-mega__inner--photo {
    max-width: 100%;
  }
  .sz-mega__photo-left {
    width: 260px;
    min-width: 260px;
  }
  .sz-mega__photo-right {
    padding: 24px 28px;
  }
}

/* ================================================================
   SP ヘッダー
   ================================================================ */
.sz-header-sp {
  display: none;
  position: fixed;
  top: 0;
  inset-inline: 0;
  z-index: var(--sz-z-header);
  background: var(--header-bg);
  box-shadow: var(--shadow-header);
}

.sz-header-sp__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 16px;
}

.sz-header-sp__logo {
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
}

.sz-header-sp__logo img {
  height: 28px;
}

.sz-header-sp__logo span {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  color: var(--header-accent);
}

.sz-header-sp__btns {
  display: flex;
  gap: 8px;
}

.sz-header-sp__btn {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 50%;
  background: transparent;
  cursor: pointer;
}

.sz-header-sp__btn--tel {
  background: var(--header-accent);
  color: var(--color-surface);
}

.sz-header-sp__btn--menu {
  background: var(--header-nav-bg);
}

/* ハンバーガー */
.hamburger {
  width: 20px;
  height: 14px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.hamburger__line {
  width: 100%;
  height: 2px;
  background: var(--color-surface);
  transition: all var(--transition-normal);
}

.sz-header-sp__btn--menu[aria-expanded="true"] .hamburger__line:nth-child(1) {
  transform: translateY(6px) rotate(45deg);
}

.sz-header-sp__btn--menu[aria-expanded="true"] .hamburger__line:nth-child(2) {
  opacity: 0;
}

.sz-header-sp__btn--menu[aria-expanded="true"] .hamburger__line:nth-child(3) {
  transform: translateY(-6px) rotate(-45deg);
}

/* ================================================================
   SP メニューパネル（中央展開）
   ================================================================ */
.sz-sp-menu {
  position: fixed;
  inset: 0;
  z-index: 1001;
  pointer-events: none;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.sz-sp-menu.is-open {
  opacity: 1;
  pointer-events: auto;
}

.sz-sp-menu__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.5);
}

.sz-sp-menu__panel {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) scale(0.9);
  width: 92%;
  max-width: 600px;
  max-height: 85vh;
  overflow-y: auto;
  background: var(--color-surface);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-dialog);
  transition: transform var(--transition-normal);
}

.sz-sp-menu.is-open .sz-sp-menu__panel {
  transform: translate(-50%, -50%) scale(1);
}

/* メニューヘッダー */
.sz-sp-menu__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--spacing-sm) var(--spacing-md);
  border-bottom: 1px solid var(--color-border-light);
  position: sticky;
  top: 0;
  background: var(--color-surface);
  z-index: 1;
}

.sz-sp-menu__logo {
  display: flex;
  align-items: center;
  gap: 8px;
  text-decoration: none;
}

.sz-sp-menu__logo img {
  height: 28px;
}

.sz-sp-menu__logo span {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  color: var(--header-accent);
}

.sz-sp-menu__close {
  width: var(--touch-target-min);
  height: var(--touch-target-min);
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  border-radius: 50%;
  background: var(--sz-gray-100);
  cursor: pointer;
  margin-inline-start: auto;
  flex-shrink: 0;
}

.sz-sp-menu__close .material-symbols-outlined {
  font-size: 1.5rem;
  color: var(--color-text-main);
}

/* クイックカード */
.sz-sp-menu__quick {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--spacing-sm);
  padding: 20px;
  background: var(--sz-gray-50);
}

.sz-sp-menu__quick-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: var(--spacing-md) var(--spacing-sm);
  background: var(--color-surface);
  border: 1px solid var(--color-border-light);
  border-left: 4px solid var(--header-accent);
  border-radius: 12px;
  text-decoration: none;
  transition: all var(--transition-fast);
}

.sz-sp-menu__quick-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.sz-sp-menu__quick-icon {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin-bottom: 8px;
}

.sz-sp-menu__quick-icon--blue { background: #dbeafe; }
.sz-sp-menu__quick-icon--blue .material-symbols-outlined { color: #1d4ed8; }
.sz-sp-menu__quick-icon--green { background: #dcfce7; }
.sz-sp-menu__quick-icon--green .material-symbols-outlined { color: #16a34a; }
.sz-sp-menu__quick-icon--teal { background: #ccfbf1; }
.sz-sp-menu__quick-icon--teal .material-symbols-outlined { color: #0d9488; }
.sz-sp-menu__quick-icon--orange { background: #ffedd5; }
.sz-sp-menu__quick-icon--orange .material-symbols-outlined { color: #ea580c; }
.sz-sp-menu__quick-icon--purple { background: #f3e8ff; }
.sz-sp-menu__quick-icon--purple .material-symbols-outlined { color: #7c3aed; }

.sz-sp-menu__quick-txt {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--header-text);
  text-align: center;
  line-height: var(--line-height-tight);
}

.sz-sp-menu__quick-arrow {
  margin-top: 8px;
  color: var(--header-accent);
}

.sz-sp-menu__quick-arrow .material-symbols-outlined {
  font-size: 1rem;
}

/* ナビゲーションセクション */
.sz-sp-menu__nav {
  padding: 20px;
}

.sz-sp-menu__section {
  margin-bottom: 24px;
}

.sz-sp-menu__section-title {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-bold);
  color: var(--header-accent);
  text-decoration: none;
  margin-bottom: 12px;
  padding-bottom: 12px;
  border-bottom: var(--border-width-thick) solid var(--header-accent);
}

.sz-sp-menu__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sz-sp-menu__list--grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px 16px;
}

.sz-sp-menu__list li a {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  padding: var(--spacing-sm) 0;
  font-size: var(--font-size-sm);
  color: var(--header-text);
  text-decoration: none;
}

.sz-sp-menu__list li a:hover {
  color: var(--header-accent);
}

.sz-sp-menu__list li a .material-symbols-outlined {
  font-size: 0.875rem;
  color: var(--header-accent);
}

.sz-sp-menu__featured {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-sm);
  margin-top: 12px;
  padding: 12px var(--spacing-lg);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  color: var(--header-text);
  background: #f5f0e6;
  border-radius: var(--radius-full);
  text-decoration: none;
}

/* 分割レイアウト（地域医療連携） */
.sz-sp-menu__split {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

.sz-sp-menu__column-img {
  width: 60px;
  height: 60px;
  border-radius: 50%;
  overflow: hidden;
  margin-bottom: 12px;
}

.sz-sp-menu__column-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sz-sp-menu__column-title {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-bold);
  color: var(--header-accent);
  text-decoration: none;
  margin-bottom: var(--spacing-sm);
}

.sz-sp-menu__column-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sz-sp-menu__column-list li a {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  padding: 6px 0;
  font-size: var(--font-size-xs);
  color: var(--header-text);
  text-decoration: none;
}

.sz-sp-menu__column-list li a .material-symbols-outlined {
  font-size: 0.75rem;
  color: var(--header-accent);
}

/* ================================================================
   検索パネル
   ================================================================ */
.sz-search {
  position: fixed;
  inset: 0;
  z-index: 1002;
  pointer-events: none;
  opacity: 0;
  transition: opacity var(--transition-normal);
}

.sz-search.is-open {
  opacity: 1;
  pointer-events: auto;
}

.sz-search__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.6);
}

.sz-search__inner {
  position: absolute;
  top: 30%;
  left: 50%;
  transform: translateX(-50%);
  width: 90%;
  max-width: 600px;
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
}

.sz-search__form {
  flex: 1;
  display: flex;
  background: var(--color-surface);
  border-radius: var(--radius-full);
  overflow: hidden;
  box-shadow: var(--sz-shadow-lg);
}

.sz-search__input {
  flex: 1;
  padding: var(--spacing-md) var(--spacing-lg);
  font-size: var(--font-size-base);
  border: none;
  outline: none;
}

.sz-search__submit {
  padding: var(--spacing-md) var(--spacing-lg);
  background: var(--header-accent);
  color: var(--color-surface);
  border: none;
  cursor: pointer;
}

.sz-search__close {
  width: 50px;
  height: 50px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--color-surface);
  border: none;
  border-radius: 50%;
  cursor: pointer;
}

.sz-search__close .material-symbols-outlined {
  font-size: 1.75rem;
  color: var(--color-text-sub);
}

/* ================================================================
   レスポンシブ (Mobile First)
   ================================================================ */

/* Mobile base: SPヘッダー表示、PCヘッダー非表示 */
.sz-header__wrapper,
.sz-mega {
  display: none;
}

.sz-header-sp {
  display: block;
}

/* Desktop (1025px+): PCヘッダー表示、SPヘッダー非表示 */
@media (min-width: 1025px) {
  .sz-header__wrapper {
    display: flex;
    align-items: stretch;
  }

  .sz-mega {
    display: block;
  }

  .sz-header-sp,
  .sz-sp-menu {
    display: none;
  }
}

/* メインコンテンツのパディング */
.saikazo-main {
  padding-top: var(--header-mobile-height, 3.5rem);
}

@media (min-width: 1025px) {
  .saikazo-main {
    padding-top: var(--header-height);
  }
}
/* ================================================================
   スクロール時のヘッダー表示/非表示（木古内スタイル）
   ================================================================ */
.sz-header {
  transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}

/* スクロール時にコンパクト化: Tier 1 を畳む */
.sz-header.is-scrolled {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.sz-header.is-scrolled .sz-header__upper {
  height: 0;
  opacity: 0;
  padding: 0;
  border-bottom: none;
  overflow: hidden;
}

.sz-header.is-scrolled .sz-header__logo-img {
  height: 36px;
}

.sz-header.is-scrolled .sz-header__logo-name {
  font-size: var(--font-size-base);
}

/* 下スクロールで隠れる */
.sz-header.is-hidden {
  transform: translateY(-100%);
}

/* 上スクロールで表示 */
.sz-header.is-visible {
  transform: translateY(0);
}

/* SPヘッダーのスクロール対応 */
.sz-header-sp {
  transition: transform var(--transition-normal), box-shadow var(--transition-normal);
}

.sz-header-sp.is-hidden {
  transform: translateY(-100%);
}

.sz-header-sp.is-visible {
  transform: translateY(0);
}

.sz-header-sp.is-scrolled {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

/* ================================================================
   小画面対応 (Mobile First ベース): SPヘッダー・SPメニュー
   ================================================================ */
.sz-header-sp__inner {
  padding: var(--spacing-sm) 10px;
}

.sz-header-sp__logo img {
  height: 22px;
}

.sz-header-sp__logo span {
  font-size: var(--font-size-xs);
}

.sz-header-sp__btns {
  gap: var(--spacing-xs);
}

/* タッチターゲット44px最低保証 */
.sz-header-sp__btn {
  width: var(--touch-target-min);
  height: var(--touch-target-min);
}

.sz-sp-menu__panel {
  width: 100%;
}

.sz-sp-menu__header {
  padding: 12px 10px;
}

.sz-sp-menu__section-title {
  font-size: var(--font-size-xs);
}

.sz-sp-menu__link {
  padding: 10px 12px;
  font-size: var(--font-size-sm);
}

.sz-sp-menu__cta {
  padding: 12px 10px;
  gap: 6px;
}

/* 390px+: 少し余裕を持たせる */
@media (min-width: 390px) {
  .sz-header-sp__inner {
    padding: var(--spacing-sm) var(--spacing-md);
  }

  .sz-header-sp__logo img {
    height: 28px;
  }

  .sz-header-sp__logo span {
    font-size: var(--font-size-sm);
  }

  .sz-header-sp__btns {
    gap: var(--spacing-sm);
  }

  .sz-sp-menu__panel {
    width: 85%;
    max-width: 400px;
  }

  .sz-sp-menu__header {
    padding: 16px 20px;
  }

  .sz-sp-menu__link {
    padding: 14px 20px;
    font-size: var(--font-size-base);
  }

  .sz-sp-menu__cta {
    padding: 16px 20px;
    gap: 8px;
  }
}

/* ================================================================
   Phase 2: モバイルヘッダー・ナビゲーション リデザイン
   スマホファースト。min-width のみ。_tokens.css 変数のみ。
   ================================================================ */

/* ---- SP ヘッダーバー ---- */
.sz-header-sp {
  height: 3.5rem;
}

.sz-header-sp__inner {
  height: 100%;
  padding-block: 0;
  padding-inline: var(--spacing-sm);
}

.sz-header-sp__logo img {
  height: 2rem;
  width: auto;
}

/* ベース: 病院名テキスト非表示 */
.sz-header-sp__logo span {
  display: none;
}

/* ---- SP メニューパネル: 右スライドイン ---- */
.sz-sp-menu__panel {
  top: 0;
  right: 0;
  bottom: 0;
  left: auto;
  width: 100%;
  max-width: none;
  max-height: none;
  border-radius: 0;
  transform: translateX(100%);
  transition: transform var(--transition-normal);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.sz-sp-menu.is-open .sz-sp-menu__panel {
  transform: translateX(0);
}

/* ---- 3カラム トップグリッド（診療科/施設/アクセス） ---- */
.sz-sp-menu__top-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--spacing-sm);
  padding-block: var(--spacing-md);
  padding-inline: var(--spacing-md);
  background-color: var(--color-background);
}

.sz-sp-menu__top-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-xs);
  padding-block: var(--spacing-md);
  padding-inline: var(--spacing-sm);
  background-color: var(--color-surface);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-md);
  text-decoration: none;
  transition: background-color var(--transition-fast);
  min-height: 3rem;
}

.sz-sp-menu__top-card:active {
  background-color: var(--color-primary-light);
}

.sz-sp-menu__top-icon {
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: var(--color-primary-light);
}

.sz-sp-menu__top-icon .material-symbols-outlined {
  font-size: 1.25rem;
  color: var(--color-primary);
}

.sz-sp-menu__top-txt {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-main);
  text-align: center;
  line-height: var(--line-height-tight);
}

/* ---- クイックリンク4つ ---- */
.sz-sp-menu__quick-links {
  display: flex;
  flex-direction: column;
  border-block-end: 1px solid var(--color-border-light);
}

.sz-sp-menu__quick-link {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  padding-block: 0.875rem;
  padding-inline: var(--spacing-md);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-main);
  text-decoration: none;
  border-block-start: 1px solid var(--color-border-light);
  min-height: 3rem;
  transition: background-color var(--transition-fast);
}

.sz-sp-menu__quick-link:active {
  background-color: var(--color-background);
}

.sz-sp-menu__quick-link > .material-symbols-outlined:first-child {
  font-size: 1.25rem;
  color: var(--color-primary);
  flex-shrink: 0;
}

.sz-sp-menu__link-arrow {
  margin-inline-start: auto;
  font-size: 1.125rem;
  color: var(--color-text-muted);
  flex-shrink: 0;
}

/* ---- アコーディオンナビ ---- */
.sz-sp-menu__accordion {
  border-block-end: 1px solid var(--color-border-light);
}

.sz-sp-menu__accordion > summary {
  padding-block: 0.875rem;
  padding-inline: var(--spacing-md);
  background-color: var(--color-surface);
  border-radius: 0;
  font-size: var(--font-size-sm);
  color: var(--color-primary);
}

.sz-sp-menu__accordion .accordion-content {
  padding-block-start: 0;
  padding-block-end: var(--spacing-sm);
  padding-inline: var(--spacing-md);
}

.sz-sp-menu__accordion .sz-sp-menu__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sz-sp-menu__accordion .sz-sp-menu__list li a {
  display: flex;
  align-items: center;
  padding-block: var(--spacing-sm);
  padding-inline-start: var(--spacing-md);
  font-size: var(--font-size-sm);
  color: var(--color-text-main);
  text-decoration: none;
  transition: color var(--transition-fast);
  min-height: 2.75rem;
}

.sz-sp-menu__accordion .sz-sp-menu__list li a:active {
  color: var(--color-primary);
}

/* ---- フッターリンク ---- */
.sz-sp-menu__footer {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-xs);
  padding-block: var(--spacing-md);
  padding-inline: var(--spacing-md);
  border-block-start: 1px solid var(--color-border-light);
}

.sz-sp-menu__footer-link {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xs);
  padding-block: var(--spacing-sm);
  padding-inline: var(--spacing-md);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-main);
  text-decoration: none;
  background-color: var(--color-background);
  border-radius: var(--radius-full);
  min-height: 2.5rem;
  transition: background-color var(--transition-fast);
}

.sz-sp-menu__footer-link:active {
  background-color: var(--color-primary-light);
}

.sz-sp-menu__footer-link .material-symbols-outlined {
  font-size: 1rem;
  color: var(--color-primary);
}

/* ---- アクセシビリティ設定 ---- */
.sz-sp-menu__a11y {
  padding-block: var(--spacing-md);
  padding-inline: var(--spacing-md);
  border-block-start: 1px solid var(--color-border-light);
  background-color: var(--color-background);
}

.sz-sp-menu__a11y-title {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-sub);
  margin: 0 0 var(--spacing-sm);
}

.sz-sp-menu__a11y-title .material-symbols-outlined {
  font-size: 1.25rem;
}

.sz-sp-menu__a11y-btns {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: var(--spacing-xs);
}

.sz-sp-menu__a11y-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  padding-block: var(--spacing-sm);
  padding-inline: var(--spacing-xs);
  background-color: var(--color-surface);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-sm);
  cursor: pointer;
  min-height: 3rem;
  transition: background-color var(--transition-fast);
}

.sz-sp-menu__a11y-btn:active {
  background-color: var(--color-primary-light);
}

.sz-sp-menu__a11y-btn .material-symbols-outlined {
  font-size: 1.25rem;
  color: var(--color-primary);
}

.sz-sp-menu__a11y-btn span:last-child {
  font-size: clamp(0.625rem, 0.575rem + 0.2vw, 0.6875rem);
  color: var(--color-text-sub);
  line-height: var(--line-height-tight);
}

/* ================================================================
   Phase 2 レスポンシブ: lg(768px) — タブレット
   ================================================================ */
@media (min-width: 768px) {
  /* ヘッダーバー: 4rem、病院名表示 */
  .sz-header-sp {
    height: 4rem;
  }

  .sz-header-sp__inner {
    padding-inline: var(--spacing-md);
  }

  .sz-header-sp__logo img {
    height: 2.5rem;
  }

  .sz-header-sp__logo span {
    display: inline;
    font-size: var(--font-size-sm);
    font-weight: var(--font-weight-bold);
    color: var(--color-primary);
  }

  /* メニューパネル: 右60%オーバーレイ */
  .sz-sp-menu__panel {
    width: 60%;
    max-width: 25rem;
    box-shadow: var(--shadow-dialog);
  }

  /* クイックリンク: フォントサイズ拡大 */
  .sz-sp-menu__quick-link {
    font-size: var(--font-size-base);
  }

  /* アコーディオン: タブレットでは展開表示 */
  .sz-sp-menu__accordion {
    display: contents;
  }

  .sz-sp-menu__accordion > summary {
    display: none;
  }

  .sz-sp-menu__accordion .accordion-content {
    display: block;
    padding-block-start: var(--spacing-sm);
    padding-block-end: var(--spacing-md);
    padding-inline: var(--spacing-md);
    border-block-end: 1px solid var(--color-border-light);
  }

  .sz-sp-menu__accordion .sz-sp-menu__list {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 0 var(--spacing-md);
  }
}

/* ================================================================
   Phase V2: New mobile/desktop header structure
   .sz-header__mobile + .sz-header__desktop switching
   ================================================================ */

/* ---- Base: Mobile visible, Desktop hidden ---- */
.sz-header__mobile {
  display: block;
  position: sticky;
  top: 0;
  z-index: var(--sz-z-header, 1000);
  background: var(--color-surface);
  box-shadow: var(--shadow-header, 0 2px 8px rgba(0,0,0,0.08));
}

.sz-header__desktop {
  display: none;
}

/* ---- Mobile inner: flex row ---- */
.sz-header__mobile-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  height: 3.5rem;
  padding-inline: var(--spacing-sm);
  gap: var(--spacing-xs);
}

/* ---- Hamburger ---- */
.sz-header__hamburger {
  order: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--touch-target-min);
  height: var(--touch-target-min);
  padding: 0;
  border: 2px solid var(--color-primary);
  border-radius: var(--radius-sm);
  background: var(--color-primary);
  color: var(--color-surface);
  cursor: pointer;
  flex-shrink: 0;
  transition: background var(--transition-fast),
              color var(--transition-fast),
              border-color var(--transition-fast);
}

.sz-header__hamburger:hover {
  background: var(--color-surface);
  color: var(--color-primary);
  border-color: var(--color-primary);
}

.sz-header__hamburger:active {
  background: var(--color-primary-light);
  color: var(--color-primary);
  transform: scale(0.95);
}

.sz-header__hamburger:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* ---- Mobile Logo ---- */
.sz-header__mobile-logo {
  order: 1;
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  text-decoration: none;
  flex: 1;
  justify-content: flex-start;
  min-width: 0;
}

.sz-header__mobile-logo-img {
  height: 1.75rem;
  width: auto;
  flex-shrink: 0;
}

.sz-header__mobile-logo-name {
  display: inline;
  font-size: clamp(0.6875rem, 0.5rem + 0.8vw, 0.875rem);
  font-weight: var(--font-weight-bold);
  color: var(--color-primary);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* ---- Mobile Tel button ---- */
.sz-header__mobile-tel {
  order: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--touch-target-min);
  height: var(--touch-target-min);
  border-radius: 50%;
  border: 2px solid var(--color-primary);
  background: var(--color-primary);
  color: var(--color-surface);
  text-decoration: none;
  flex-shrink: 0;
  transition: background var(--transition-fast),
              color var(--transition-fast),
              border-color var(--transition-fast);
}

.sz-header__mobile-tel:hover {
  background: var(--color-surface);
  color: var(--color-primary);
  border-color: var(--color-primary);
}

.sz-header__mobile-tel:active {
  background: var(--color-primary-light);
  color: var(--color-primary);
  transform: scale(0.95);
}

.sz-header__mobile-tel .material-symbols-outlined {
  font-size: 1.25rem;
}

/* ---- Mobile Actions (tablet only, hidden on SP) ---- */
.sz-header__mobile-actions {
  display: none;
}

.sz-header__mobile-search {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--touch-target-min);
  height: var(--touch-target-min);
  padding: 0;
  border: 1px solid var(--color-border-light);
  border-radius: 50%;
  background: transparent;
  color: var(--color-text-main);
  cursor: pointer;
  transition: background var(--transition-fast);
}

.sz-header__mobile-search:hover {
  background: var(--color-background, #f8f7f6);
}

.sz-header__mobile-action-link {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: var(--spacing-xs) var(--spacing-sm);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  color: var(--color-surface);
  text-decoration: none;
  border-radius: var(--radius-full);
  white-space: nowrap;
  transition: opacity var(--transition-fast);
}

.sz-header__mobile-action-link .material-symbols-outlined {
  font-size: 1.125rem;
}

.sz-header__mobile-action-link--ai {
  background: #e8a458;
}

.sz-header__mobile-action-link--ai:hover {
  background: #c9833a;
  color: var(--color-surface);
}

.sz-header__mobile-action-link--reserve {
  background: var(--color-reservation-cta);
}

.sz-header__mobile-action-link--reserve:hover {
  background: var(--color-reservation-cta-hover);
  color: var(--color-surface);
}

/* ---- SP Menu panel additions ---- */
.sz-sp-menu__divider {
  border: none;
  border-top: 1px solid var(--color-border-light);
  margin: 0;
}

.sz-sp-menu__cta-group {
  display: flex;
  gap: var(--spacing-sm);
  padding: var(--spacing-md);
}

.sz-sp-menu__cta-btn {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-xs);
  padding: var(--spacing-sm) var(--spacing-md);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  color: var(--color-surface);
  text-decoration: none;
  border-radius: var(--radius-full);
  min-height: var(--touch-target-min);
  transition: opacity var(--transition-fast);
}

.sz-sp-menu__cta-btn .material-symbols-outlined {
  font-size: 1.25rem;
}

.sz-sp-menu__cta-btn--ai {
  background: #e8a458;
}

.sz-sp-menu__cta-btn--ai:hover {
  background: #c9833a;
}

.sz-sp-menu__cta-btn--reserve {
  background: var(--color-reservation-cta);
}

.sz-sp-menu__cta-btn--reserve:hover {
  background: var(--color-reservation-cta-hover);
}

/* ---- SP Menu SNS icons ---- */
.sz-sp-menu__sns {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-sm);
  padding: var(--spacing-md);
}

.sz-sp-menu__sns-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  text-decoration: none;
  color: var(--color-surface);
  font-size: 0;
  transition: opacity var(--transition-fast);
}

.sz-sp-menu__sns-link--line {
  background: #06c755;
}

.sz-sp-menu__sns-link--instagram {
  background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
}

.sz-sp-menu__sns-link--x {
  background: var(--color-text-main);
}

.sz-sp-menu__sns-link--youtube {
  background: #ff0000;
}

.sz-sp-menu__sns-icon {
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  color: var(--color-surface);
  line-height: 1;
}

/* ================================================================
   Phase V2 Responsive: Tablet (768px+)
   ================================================================ */
@media (min-width: 768px) {
  .sz-header__mobile-inner {
    height: 4rem;
    padding-inline: var(--spacing-md);
  }

  /* Tablet: Logo left (order:1), actions center-right (order:3), hamburger far-right (order:4) */
  .sz-header__hamburger {
    order: 4;
  }

  .sz-header__mobile-logo {
    order: 1;
    justify-content: flex-start;
    flex: 0 1 auto;
  }

  .sz-header__mobile-logo-img {
    height: 2rem;
  }

  .sz-header__mobile-logo-name {
    display: inline;
  }

  /* Hide tel, show actions */
  .sz-header__mobile-tel {
    display: none;
  }

  .sz-header__mobile-actions {
    order: 3;
    display: flex;
    align-items: center;
    gap: var(--spacing-sm);
    margin-inline-start: auto;
  }
}

/* ================================================================
   Phase V2 Responsive: Desktop (1024px+)
   ================================================================ */
@media (min-width: 1024px) {
  .sz-header__mobile {
    display: none;
  }

  .sz-header__desktop {
    display: block;
  }

  /* Ensure mega menu & sp-menu switching */
  .sz-sp-menu {
    display: none;
  }
}

/* ================================================================
   P2: 下段ナビ — ダークティール背景 + 白テキスト（函館五稜郭スタイル）
   ================================================================ */
@media (min-width: 1024px) {
  .sz-header__lower {
    background: var(--sz-primary-dark, #0d3a75);
    padding-block: 0;
  }

  .sz-mainnav__link {
    color: var(--color-surface, #fff);
    flex-direction: column;
    align-items: center;
    gap: 0.125rem;
    padding: 0.625rem clamp(0.5rem, 1.2vw, 1.25rem);
    border-inline-end: 1px solid rgba(255, 255, 255, 0.2);
  }

  .sz-mainnav__item:last-child .sz-mainnav__link {
    border-inline-end: none;
  }

  .sz-mainnav__link:hover {
    color: var(--color-surface, #fff);
    background: rgba(255, 255, 255, 0.1);
  }

  .sz-mainnav__link::after {
    background: var(--color-surface, #fff);
  }

  .sz-mainnav__link:hover::after {
    background: var(--color-surface, #fff);
  }

  /* ホームページ上書き */
  body.home-page .sz-header__lower {
    background: var(--sz-primary-dark, #0d3a75);
  }

  body.home-page .sz-mainnav__link {
    color: var(--color-surface, #fff);
  }

  body.home-page .sz-mainnav__link:hover {
    color: var(--color-surface, #fff);
    background: rgba(255, 255, 255, 0.1);
  }

  body.home-page .sz-mainnav__link:hover::after {
    background: var(--color-surface, #fff);
  }

}


/* ================================================================
   P2: ナビ英語サブテキスト
   ================================================================ */
.sz-mainnav__text-ja {
  display: block;
  line-height: 1.3;
}

.sz-mainnav__text-en {
  display: block;
  font-size: clamp(0.5625rem, 0.5rem + 0.25vw, 0.6875rem);
  font-weight: 400;
  opacity: 0.7;
  letter-spacing: 0.04em;
  line-height: 1.2;
}

/* ================================================================
   P2: PC上段 SNSアイコン（小型）
   ================================================================ */
.sz-header__sns {
  display: none;
}

@media (min-width: 1024px) {
  .sz-header__sns {
    display: flex;
    align-items: center;
    gap: 0.375rem;
  }

  .sz-header__sns-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.5rem;
    height: 1.5rem;
    color: var(--header-utility-text, #6b7280);
    transition: color var(--transition-fast);
  }

  .sz-header__sns-link:hover {
    color: var(--header-accent, #114fa1);
  }

  .sz-header__sns-link svg {
    width: 1.125rem;
    height: 1.125rem;
  }
}

/* === layout/_saikazo-footer.css === */

/* ================================================================
   saikazo-footer.css
   木古内町国民健康保険病院 — 浅香山スタイル フッター
   ================================================================ */

/* ================================================================
   CSS Variables
   ================================================================ */
.l-footer {
  --ft-green: var(--color-primary);
  --ft-green-dark: var(--color-primary-hover);
  --ft-green-light: var(--color-primary-light);
  --ft-white: var(--color-surface);
  --ft-gray-50: var(--sz-gray-50);
  --ft-gray-100: var(--sz-gray-100);
  --ft-gray-200: var(--color-border-light);
  --ft-gray-300: var(--color-border);
  --ft-gray-500: var(--color-text-sub);
  --ft-gray-700: var(--color-text-main);
  --ft-text: var(--color-text-main);
  --ft-text-light: var(--color-text-sub);
}

/* ================================================================
   Footer Base
   ================================================================ */
.l-footer {
  position: relative;
}

/* ================================================================
   サイトマップ トグルバー（浅香山完全再現）
   ================================================================ */
.footer-sitemap-toggle {
  background: var(--ft-green);
}

.footer-sitemap-toggle__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-md);
  width: 100%;
  padding: 14px 20px;
  border: none;
  background: transparent;
  color: var(--ft-white);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-bold);
  letter-spacing: 0.05em;
  cursor: pointer;
  transition: background var(--transition-fast);
}

.footer-sitemap-toggle__btn:hover {
  background: var(--color-surface-alpha-20);
}

.footer-sitemap-toggle__btn:focus-visible {
  outline: 2px solid var(--ft-white);
  outline-offset: -4px;
}

/* 丸いアイコン（浅香山と同じ） */
.footer-sitemap-toggle__circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border: 2px solid var(--ft-white);
  border-radius: 50%;
  transition: transform 0.3s ease;
}

.footer-sitemap-toggle__circle .material-symbols-outlined {
  font-size: 1.125rem;
  line-height: 1;
}

.footer-sitemap-toggle.is-open .footer-sitemap-toggle__circle {
  transform: rotate(180deg);
}

/* ================================================================
   サイトマップパネル（浅香山完全再現）
   ================================================================ */
.footer-sitemap {
  background: var(--ft-white);
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.4s ease;
}

.footer-sitemap__in {
  max-inline-size: var(--content-max-width);
  margin-inline: auto;
  padding-inline: 40px;
}

.footer-sitemap.is-open .footer-sitemap__in {
  padding-top: 48px;
  padding-bottom: 48px;
}

.footer-sitemap__nav {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 40px 48px;
}

/* カテゴリ見出し（浅香山スタイル：緑テキスト＋下線＋→矢印を右端に） */
.footer-sitemap__heading {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-bold);
  color: var(--ft-green);
  margin: 0 0 var(--spacing-md);
  padding-bottom: 12px;
  border-bottom: var(--border-width-thick) solid var(--ft-green);
}

.footer-sitemap__heading a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--ft-green);
  text-decoration: none;
  transition: color 0.2s ease;
}

.footer-sitemap__heading a:hover {
  color: var(--ft-green-dark);
}

.footer-sitemap__heading-txt {
  flex: 1;
}

.footer-sitemap__arrow {
  font-size: 1.125rem;
  flex-shrink: 0;
}

.footer-sitemap__ext {
  font-size: 1rem;
  flex-shrink: 0;
}

/* リンクリスト */
.footer-sitemap__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.footer-sitemap__list li {
  margin-bottom: 10px;
}

.footer-sitemap__list a {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xs);
  font-size: var(--font-size-sm);
  color: var(--ft-text);
  text-decoration: none;
  line-height: 1.6;
  transition: color var(--transition-fast);
}

.footer-sitemap__list a:hover {
  color: var(--ft-green);
}

.footer-sitemap__ext-sm {
  font-size: 0.875rem;
  color: var(--ft-gray-500);
}

/* ================================================================
   メインフッター（函館五稜郭病院スタイル：ダークグリーン全幅）
   ================================================================ */
.footer-main {
  background: var(--ft-white, #fff);
  padding: clamp(2rem, 5vw, 3rem) 0;
  border-top: 1px solid var(--ft-gray-200);
  color: var(--ft-text);
}

.footer-main__in {
  max-inline-size: var(--content-max-width);
  margin-inline: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(1.25rem, 3vw, 2rem);
  padding-inline: clamp(1rem, 4vw, 2rem);
}

@media (min-width: 768px) {
  .footer-main {
    padding: clamp(1.5rem, 4vw, var(--spacing-xxl)) clamp(1rem, 3vw, 40px);
  }

  .footer-main__in {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: start;
    gap: clamp(1.5rem, 3vw, 3rem);
  }

  .footer-info {
    min-width: 0;
  }
}

/* 病院情報 */
.footer-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(1rem, 2.5vw, 1.25rem);
  text-align: center;
  width: 100%;
}

@media (min-width: 768px) {
  .footer-info {
    align-items: flex-start;
    text-align: left;
  }
}

/* ロゴ（モバイル：マーク上+名前下 中央寄せ / PC：横並び） */
.footer-logo {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
}

.footer-logo__link {
  display: inline-flex;
  align-items: center;
  text-decoration: none;
}

.footer-logo__mark {
  width: clamp(3rem, 8vw, 3.5rem);
  height: clamp(3rem, 8vw, 3.5rem);
  object-fit: contain;
  flex-shrink: 0;
}

@media (min-width: 768px) {
  .footer-logo {
    flex-direction: row;
    gap: 16px;
  }

  .footer-logo__link {
    gap: 16px;
  }

  .footer-logo__mark {
    width: 56px;
    height: 56px;
  }
}

.footer-logo-text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
}

@media (min-width: 768px) {
  .footer-logo-text {
    align-items: flex-start;
  }
}

.footer-logo-text__ja {
  font-size: clamp(1.125rem, 3.5vw, 1.5rem);
  font-weight: 800;
  color: var(--ft-text);
  letter-spacing: 0.04em;
  white-space: nowrap;
}

.footer-logo-text__en {
  font-size: clamp(0.6rem, 1.8vw, 0.7rem);
  color: var(--ft-gray-500);
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

/* ===== 電話番号 CTA（函館五稜郭スタイル：大きいアイコン付き） ===== */
.footer-tel {
  margin-top: var(--spacing-xs);
}

.footer-tel__link {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  text-decoration: none;
  color: var(--ft-text);
  transition: opacity 0.2s ease;
}

.footer-tel__link:hover {
  opacity: 0.8;
}

.footer-tel__icon {
  font-size: 1.75rem;
}

.footer-tel__number {
  font-size: clamp(1.5rem, 5vw, 2rem);
  font-weight: 800;
  letter-spacing: 0.03em;
  white-space: nowrap;
}



/* 住所（函館五稜郭スタイル：ロケーションアイコン付き） */
.footer-address {
  display: flex;
  align-items: flex-start;
  gap: 0.375rem;
  font-style: normal;
  font-size: var(--font-size-sm);
  color: var(--ft-text-light);
  line-height: 1.8;
}

.footer-address__icon {
  font-size: 1.25rem;
  flex-shrink: 0;
  margin-top: 0.125rem;
  color: var(--ft-green);
}

.footer-address__text {
  display: flex;
  flex-direction: column;
}



/* 交通アクセスボタン（PC用：アウトライン、モバイル非表示→ボトムバー集約） */
.footer-access__btn {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-md);
  padding: 10px 10px 10px 28px;
  background: var(--ft-white, #fff);
  color: var(--ft-green);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-bold);
  text-decoration: none;
  border: var(--border-width-thick) solid var(--ft-green);
  border-radius: var(--radius-full);
  transition: all var(--transition-fast);
  white-space: nowrap;
  flex-shrink: 0;
}

.footer-access__btn:hover {
  background: var(--ft-green);
  color: var(--ft-white);
}

.footer-access__circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  background: var(--ft-green);
  border-radius: 50%;
  color: var(--ft-white);
  transition: background 0.2s ease;
}

.footer-access__circle .material-symbols-outlined {
  font-size: 1.125rem;
}

.footer-access__btn:hover .footer-access__circle {
  background: var(--ft-white);
  color: var(--ft-green);
}

/* SNSリンクアイコン（函館五稜郭病院スタイル：大きい丸型ブランドカラー） */
.footer-sns {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: clamp(0.75rem, 3vw, 1.25rem);
  margin-top: var(--spacing-sm);
}

.footer-sns__link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(3rem, 10vw, 3.5rem);
  height: clamp(3rem, 10vw, 3.5rem);
  border-radius: 50%;
  background: var(--ft-gray-100, #f3f4f6);
  color: var(--ft-gray-700);
  text-decoration: none;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.footer-sns__link:hover {
  transform: translateY(-3px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
}

/* ブランドカラーSNSアイコン（丸背景＋カラーアイコン） */
.footer-sns--brand .footer-sns__link {
  background: var(--ft-gray-100, #f3f4f6);
  border-radius: 50%;
}

.footer-sns--brand .footer-sns__link--line {
  color: #06c755;
}

.footer-sns--brand .footer-sns__link--instagram {
  color: #e1306c;
}

.footer-sns--brand .footer-sns__link--x {
  color: #1d1d1f;
}

.footer-sns--brand .footer-sns__link--youtube {
  color: #ff0000;
}

.footer-sns__icon {
  width: 60%;
  height: 60%;
  fill: currentColor;
}

.footer-sns__link .material-symbols-outlined {
  font-size: 1.5rem;
}

@media (min-width: 768px) {
  .footer-sns__link {
    width: 44px;
    height: 44px;
    background: transparent;
    border-radius: var(--radius-md);
  }

  .footer-sns--brand .footer-sns__link {
    background: transparent;
    border-radius: var(--radius-md);
  }

  .footer-sns__icon {
    width: 100%;
    height: 100%;
  }
}

/* ===== 右カラム: SNS+バナーエリア（PC 2カラム用） ===== */
.footer-side {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: clamp(1rem, 2.5vw, 1.25rem);
  flex-shrink: 0;
  flex-grow: 0;
}

@media (min-width: 768px) {
  .footer-side {
    align-items: flex-end;
    flex-shrink: 0;
    min-width: 14rem;
    gap: var(--spacing-md);
  }
}

.footer-side .footer-banner--recruit {
  border-radius: 8px;
  width: 100%;
  flex: 0 0 auto;
}

.footer-side .footer-banner__inner {
  padding: 10px var(--spacing-md);
  justify-content: center;
}

/* 右側：バナーエリア */
.footer-banners {
  display: flex;
  flex-direction: column;
  gap: 12px;
  flex-shrink: 0;
  width: 100%;
  max-width: 18rem;
}

.footer-banner {
  display: block;
  border-radius: 8px;
  overflow: visible;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.footer-banner:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
  transform: translateY(-2px);
}

.footer-banner img {
  display: block;
  max-width: 300px;
  height: auto;
}

/* 採用バナー */
.footer-banner--recruit {
  background: var(--sz-primary-dark);
  border: 2px solid var(--sz-primary-dark);
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease;
}

.footer-banner--recruit:hover {
  background: var(--color-surface);
  transform: translateY(-2px);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.footer-banner--recruit:hover .footer-banner__inner {
  color: var(--sz-primary-dark);
}

.footer-banner--recruit:active {
  background: var(--color-primary-light);
  transform: scale(0.98);
}

.footer-banner__inner {
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
  padding: 18px var(--spacing-lg);
  color: var(--color-surface);
}

.footer-banner__label {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-bold);
}

.footer-banner__sub {
  font-size: var(--font-size-xs);
  letter-spacing: 0.1em;
  opacity: 0.8;
}

.footer-banner__arrow {
  margin-left: auto;
  font-size: 1.125rem;
}

/* バナーカード型（広報誌・認定病院） */
.footer-banner--card {
  background: var(--ft-white);
  border: 1px solid var(--ft-gray-200);
  text-decoration: none;
}

.footer-banner--card .footer-banner__inner {
  color: var(--ft-text);
  padding: 14px 20px;
  gap: 14px;
}

.footer-banner--card .footer-banner__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--spacing-xs) 10px;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  color: var(--ft-white);
  background: var(--ft-green);
  border-radius: var(--radius-sm);
  white-space: nowrap;
  flex-shrink: 0;
}

.footer-banner--card .footer-banner__text {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.footer-banner--card .footer-banner__title {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-bold);
  color: var(--ft-text);
}

.footer-banner--card .footer-banner__desc {
  font-size: var(--font-size-xs);
  color: var(--ft-gray-500);
}

/* ================================================================
   フッターボトム（函館五稜郭スタイル：ダークグリーン統一）
   ================================================================ */
.footer-bottom {
  background: var(--ft-white, #fff);
  padding: var(--spacing-md) clamp(1rem, 3vw, 40px);
  border-top: 1px solid var(--ft-gray-200);
}

@media (min-width: 768px) {
  .footer-bottom {
    border-top: 1px solid var(--ft-gray-200);
  }
}

.footer-bottom__in {
  max-inline-size: var(--content-max-width);
  margin-inline: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: var(--spacing-sm) var(--spacing-md);
}

.footer-copyright {
  margin: 0;
}

.footer-copyright small {
  font-size: var(--font-size-xs);
  color: var(--ft-gray-500);
}

.footer-policy {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  align-items: center;
  gap: 0;
}

.footer-policy li {
  display: flex;
  align-items: center;
}

/* 縦線区切り */
.footer-policy li + li::before {
  content: '';
  display: inline-block;
  width: 1px;
  height: 14px;
  background: var(--ft-gray-300);
  margin: 0 20px;
}

.footer-policy a {
  font-size: var(--font-size-xs);
  color: var(--ft-gray-700);
  text-decoration: none;
  transition: color var(--transition-fast);
}

.footer-policy a:hover {
  color: var(--ft-green);
}

/* ================================================================
   関連施設・リンクセクション（函館五稜郭病院スタイル）
   ================================================================ */
.footer-partners {
  background: var(--ft-white, #fff);
  padding: var(--spacing-lg) clamp(1rem, 3vw, 40px);
  border-top: 1px solid var(--ft-gray-200);
}

.footer-partners__in {
  max-inline-size: var(--content-max-width);
  margin-inline: auto;
}

.footer-partners__title {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  color: var(--ft-text);
  text-align: center;
  margin: 0 0 var(--spacing-md);
  letter-spacing: 0.05em;
}

.footer-partners__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--spacing-sm);
  justify-items: stretch;
}

.footer-partners__list li {
  display: flex;
}

.footer-partners__list a {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  width: 100%;
  padding: var(--spacing-sm) var(--spacing-md);
  font-size: var(--font-size-xs);
  color: var(--ft-text);
  text-decoration: none;
  background: var(--ft-gray-100, #f3f4f6);
  border-radius: var(--radius-sm);
  border: 1px solid var(--ft-gray-200);
  transition: background var(--transition-fast), border-color var(--transition-fast);
}

.footer-partners__list a::after {
  content: '';
  display: inline-block;
  width: 14px;
  height: 14px;
  margin-inline-start: auto;
  flex-shrink: 0;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b6560' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E") no-repeat center / contain;
  opacity: 0.5;
}

.footer-partners__list a:hover {
  background: var(--color-primary-light, #E8F0FA);
  border-color: var(--color-primary, #114FA1);
  color: var(--color-primary, #114FA1);
}

@media (min-width: 768px) {
  .footer-partners {
    background: var(--ft-white);
    border-top: 1px solid var(--ft-gray-200);
    padding: var(--spacing-lg) clamp(1rem, 3vw, 40px);
  }

  .footer-partners__title {
    color: var(--ft-gray-500);
  }

  .footer-partners__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: var(--spacing-sm);
  }

  .footer-partners__list li {
    flex: 0 0 auto;
  }

  .footer-partners__list a {
    color: var(--ft-gray-700);
    background: var(--sz-gray-50, #f9fafb);
    border-color: var(--ft-gray-200);
    padding: var(--spacing-xs) var(--spacing-md);
    border-radius: var(--radius-full);
  }

  .footer-partners__list a::after {
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%236b6560' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6'/%3E%3Cpolyline points='15 3 21 3 21 9'/%3E%3Cline x1='10' y1='14' x2='21' y2='3'/%3E%3C/svg%3E") no-repeat center / contain;
    opacity: 0.5;
  }

  .footer-partners__list a:hover {
    background: var(--color-primary-light, #E8F0FA);
    border-color: var(--color-primary, #114FA1);
    color: var(--color-primary, #114FA1);
  }

  .footer-partners__list a:hover::after {
    opacity: 0.8;
  }
}

/* ================================================================
   ページトップボタン（浅香山完全再現：緑丸＋↑矢印のみ）
   ================================================================ */
.footer-pagetop {
  position: fixed;
  /* FAB(56px) bottom:4.5rem → FABの上端=128px, 12px間隔で配置 */
  inset-block-end: calc(4.5rem + 56px + 0.75rem);
  inset-inline-end: 36px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background: var(--ft-green);
  color: var(--ft-white);
  border-radius: 50%;
  text-decoration: none;
  box-shadow: 0 4px 16px rgba(17, 79, 161, 0.35);
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  transition: all 0.3s ease;
  z-index: 100;
}

.footer-pagetop.is-visible {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

.footer-pagetop:hover {
  background: var(--color-surface);
  color: var(--ft-green);
  border: 2px solid var(--ft-green);
  transform: translateY(-4px);
}

.footer-pagetop:active {
  background: var(--color-primary-light);
  color: var(--ft-green);
  transform: scale(0.95);
}

.footer-pagetop .material-symbols-outlined {
  font-size: 1.375rem;
}

/* ================================================================
   Responsive - Mobile First
   ================================================================ */

/* Mobile base (default) */
.footer-sitemap-toggle__btn {
  font-size: var(--font-size-sm);
  padding: 12px var(--spacing-md);
}

.footer-sitemap__in {
  padding-inline: var(--spacing-md);
}

.footer-sitemap.is-open .footer-sitemap__in {
  padding-top: 28px;
  padding-bottom: 28px;
}

.footer-sitemap__nav {
  grid-template-columns: 1fr;
  gap: 20px;
}

.footer-main {
  padding: clamp(2rem, 5vw, 3rem) 0;
}

.footer-main__in {
  flex-direction: column;
  align-items: center;
  gap: clamp(1.25rem, 3vw, 2rem);
}

.footer-logo__mark {
  width: clamp(3rem, 8vw, 3.5rem);
  height: clamp(3rem, 8vw, 3.5rem);
}

.footer-logo-text__ja {
  font-size: clamp(1.125rem, 3.5vw, 1.5rem);
}

.footer-banners {
  flex-direction: row;
  flex-wrap: wrap;
}

.footer-banner img {
  max-width: clamp(12.5rem, 40vw, 18.75rem);
}

.footer-bottom {
  padding: clamp(0.75rem, 2vw, 0.875rem) clamp(0.75rem, 3vw, 1.5rem);
}

.footer-bottom__in {
  flex-direction: column;
  text-align: center;
  gap: 8px;
}

.footer-policy {
  justify-content: center;
}

.footer-pagetop {
  width: var(--touch-target-min);
  height: var(--touch-target-min);
  inset-block-end: calc(4.5rem + 0.75rem);
  inset-inline-end: clamp(1rem, 3vw, 1.5rem);
}

@supports (bottom: env(safe-area-inset-bottom, 0px)) {
  .footer-pagetop {
    inset-block-end: calc(4.5rem + 0.75rem + env(safe-area-inset-bottom, 0px));
  }
}

.footer-pagetop .material-symbols-outlined {
  font-size: 1.25rem;
}

/* Tablet (768px+) */
@media (min-width: 768px) {
  .footer-sitemap__nav {
    grid-template-columns: 1fr 1fr;
    gap: 24px 20px;
  }

  .footer-bottom__in {
    flex-direction: row;
    text-align: left;
    gap: 16px;
  }

  .footer-policy {
    justify-content: flex-start;
  }
}

/* Desktop (1024px+) */
@media (min-width: 1024px) {
  .footer-sitemap__in {
    padding-inline: var(--spacing-lg);
  }

  .footer-sitemap__nav {
    grid-template-columns: repeat(3, 1fr);
    gap: 28px 32px;
  }

  .footer-main {
    padding: 40px 24px;
  }

  .footer-main__in {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: start;
    gap: clamp(1.5rem, 3vw, 3rem);
  }

  .footer-info {
    flex-direction: column;
    min-width: 0;
  }

  .footer-logo__mark {
    width: 56px;
    height: 56px;
  }

  .footer-banner img {
    max-width: 300px;
  }

  .footer-bottom {
    padding: 14px 24px;
  }

  .footer-pagetop {
    inset-block-end: 104px;
    inset-inline-end: 40px;
  }

  .footer-pagetop .material-symbols-outlined {
    font-size: 1.375rem;
  }
}

/* ================================================================
   Phase 5: モバイルフッター アコーディオン & コンパクト info
   ================================================================ */

/* --- モバイル病院情報コンパクトブロック (SP only) --- */
.footer-mobile-info {
  background: var(--ft-green);
  color: var(--ft-white);
  padding-block: var(--spacing-lg);
  padding-inline: var(--spacing-md);
}

.footer-mobile-info__in {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-sm);
  text-align: center;
}

.footer-mobile-info__logo {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  color: var(--ft-white);
  text-decoration: none;
}

.footer-mobile-info__logo-img {
  width: 2.5rem;
  height: 2.5rem;
  border-radius: var(--radius-full);
}

.footer-mobile-info__name {
  font-size: clamp(0.875rem, 0.75rem + 0.5vw, 1rem);
  font-weight: var(--font-weight-bold);
}

.footer-mobile-info__address {
  font-style: normal;
  font-size: var(--font-size-sm);
  line-height: 1.6;
  opacity: 0.9;
}

.footer-mobile-info__address a {
  color: var(--ft-white);
}

.footer-mobile-info__access-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xxs);
  margin-block-start: var(--spacing-xs);
  padding: var(--spacing-xs) var(--spacing-md);
  background: var(--ft-white);
  color: var(--ft-green);
  border-radius: var(--radius-full);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  text-decoration: none;
  min-height: var(--touch-target-min);
}

.footer-mobile-info__access-btn .material-symbols-outlined {
  font-size: 1.125rem;
}

/* --- フッター アコーディオンナビ (SP) --- */
.footer-accordion-nav {
  background: var(--ft-gray-50);
  padding-block: var(--spacing-sm);
  padding-inline: var(--spacing-md);
}

.footer-accordion-nav__item {
  border-block-end: 1px solid var(--ft-gray-200);
}

.footer-accordion-nav__item:last-child {
  border-block-end: none;
}

.footer-accordion-nav__item > summary {
  padding-block: var(--spacing-sm);
  padding-inline: var(--spacing-xs);
  background: transparent;
  font-size: var(--font-size-sm);
}

.footer-accordion-nav__list {
  list-style: none;
  margin: 0;
  padding: 0 0 var(--spacing-sm) var(--spacing-md);
}

.footer-accordion-nav__list li {
  padding-block: var(--spacing-xxs);
}

.footer-accordion-nav__list a {
  color: var(--ft-text);
  text-decoration: none;
  font-size: var(--font-size-xs);
  line-height: 1.6;
}

.footer-accordion-nav__list a:hover {
  text-decoration: underline;
}

/* ボトムバー分パディング確保 */
.l-footer {
  padding-block-end: calc(3.5rem + env(safe-area-inset-bottom, 0px));
}

/* SP: 病院情報を縦積み表示 */
.footer-info {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

/* SP: バナーを横スクロールでコンパクト表示 */
.footer-main {
  padding: var(--spacing-md) var(--spacing-sm);
}

.footer-banners {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  gap: var(--spacing-sm);
  padding-block-end: var(--spacing-xs);
}

.footer-banners::-webkit-scrollbar {
  display: none;
}

.footer-banner {
  flex: 0 0 75vw;
  max-width: 18rem;
  scroll-snap-align: start;
}

/* lg(768px)以上: モバイル専用要素を非表示 */
@media (min-width: 768px) {
  .footer-mobile-info {
    display: none;
  }

  .footer-accordion-nav {
    display: none;
  }

  .l-footer {
    padding-block-end: 0;
  }

  /* footer-info: PC時は縦積みのまま（gridで左右分割） */
  .footer-info {
    flex-direction: column;
  }

  /* バナーをスタック表示に戻す */
  .footer-banners {
    display: flex;
    flex-direction: column;
    overflow-x: visible;
    scroll-snap-type: none;
    scrollbar-width: auto;
  }

  .footer-banner {
    flex: auto;
    max-width: none;
  }
}

/* lg未満: PC用サイトマップを非表示（pc-onlyでも制御しているが安全策） */
.footer-sitemap-toggle.pc-only,
.footer-sitemap.pc-only {
  display: none;
}

@media (min-width: 1024px) {
  .footer-sitemap-toggle.pc-only {
    display: block;
  }

  .footer-sitemap.pc-only {
    display: block;
  }
}

/* ================================================================
   Phase V2: New .sz-footer structure
   Light theme footer with SNS bar, accordion sitemap, hospital info
   ================================================================ */

/* ---- Footer Base ---- */
.sz-footer {
  background: var(--color-surface);
  color: var(--color-text-main);
  padding-block-end: calc(3.5rem + env(safe-area-inset-bottom, 0px));
  border-top: 1px solid var(--color-border-light);
}

/* ---- SNS Icon Bar ---- */
.sz-footer__sns {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-md);
  padding: var(--spacing-lg) var(--spacing-md);
  border-bottom: 1px solid var(--color-border-light);
}

.sz-footer__sns-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  background: var(--sz-gray-100);
  color: var(--color-text-sub);
  text-decoration: none;
  transition: background var(--transition-fast), transform var(--transition-fast), color var(--transition-fast);
}

.sz-footer__sns-link:hover {
  transform: translateY(-2px);
  color: var(--color-surface);
}

.sz-footer__sns-link[aria-label="LINE公式アカウント"]:hover {
  background: #06c755;
}

.sz-footer__sns-link[aria-label="Instagram"]:hover {
  background: #e1306c;
}

.sz-footer__sns-link[aria-label="X（旧Twitter）"]:hover {
  background: #1d1d1f;
}

.sz-footer__sns-link[aria-label="YouTube"]:hover {
  background: #ff0000;
}

.sz-footer__sns-icon {
  width: 1.25rem;
  height: 1.25rem;
  fill: currentColor;
}

/* ---- Sitemap Accordion (SP) / Grid (PC) ---- */
.sz-footer__sitemap {
  padding: var(--spacing-md);
}

.sz-footer__category {
  border-bottom: 1px solid var(--color-border-light);
}

.sz-footer__category:last-child {
  border-bottom: none;
}

.sz-footer__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--spacing-md) var(--spacing-sm);
  cursor: pointer;
  list-style: none;
  user-select: none;
  min-height: var(--touch-target-min);
}

.sz-footer__summary::-webkit-details-marker {
  display: none;
}

.sz-footer__summary-text {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-main);
}

.sz-footer__summary-icon {
  font-size: 1.5rem;
  color: var(--color-text-sub);
  transition: transform 0.3s ease;
}

.sz-footer__category[open] .sz-footer__summary-icon {
  transform: rotate(180deg);
}

.sz-footer__detail {
  padding: 0 var(--spacing-sm) var(--spacing-md);
}

.sz-footer__parent-link {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  padding: var(--spacing-sm) 0;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-main);
  text-decoration: none;
  border-bottom: 1px solid var(--color-border-light);
  margin-bottom: var(--spacing-sm);
  transition: color var(--transition-fast);
}

.sz-footer__parent-link:hover {
  color: var(--color-primary);
}

.sz-footer__parent-arrow {
  font-size: 1rem;
  margin-inline-start: auto;
}

.sz-footer__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sz-footer__list li {
  padding: var(--spacing-xs) 0;
}

.sz-footer__list a {
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
  text-decoration: none;
  transition: color var(--transition-fast);
  line-height: 1.6;
}

.sz-footer__list a:hover {
  color: var(--color-primary);
}

/* ---- Hospital Info ---- */
.sz-footer__info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-md);
  padding: var(--spacing-lg) var(--spacing-md);
  border-top: 1px solid var(--color-border-light);
  text-align: center;
}

.sz-footer__logo-link {
  display: inline-block;
}

.sz-footer__logo {
  border-radius: var(--radius-sm);
}

.sz-footer__info-body {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}

.sz-footer__hospital-name {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-main);
  margin: 0;
}

.sz-footer__address {
  font-style: normal;
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
  line-height: 1.8;
}

.sz-footer__address a {
  color: var(--color-text-main);
  text-decoration: none;
}

.sz-footer__address a:hover {
  text-decoration: underline;
}

.sz-footer__map-link {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xs);
  margin-block-start: var(--spacing-xs);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  color: var(--color-primary);
  text-decoration: none;
  transition: opacity var(--transition-fast);
}

.sz-footer__map-link:hover {
  opacity: 0.8;
}

.sz-footer__map-arrow {
  font-size: 1rem;
}

/* ---- Copyright ---- */
.sz-footer__copy {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-sm);
  padding: var(--spacing-md);
  border-top: 1px solid var(--color-border-light);
  text-align: center;
}

.sz-footer__copy small {
  font-size: var(--font-size-xs);
  color: var(--color-text-sub);
}

.sz-footer__hospital-link {
  display: inline-flex;
  align-items: center;
  gap: 0.4rem;
  padding: 0.6rem 1.6rem;
  font-size: var(--font-size-sm);
  font-weight: 600;
  color: var(--color-primary);
  text-decoration: none;
  border: 1px solid var(--color-primary);
  border-radius: 50px;
  transition: background var(--transition-fast), color var(--transition-fast);
}

.sz-footer__hospital-link:hover {
  background: var(--color-primary);
  color: #fff;
}

.sz-footer__hospital-link .material-symbols-outlined {
  font-size: 1.6rem;
}

.sz-footer__legal {
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
}

.sz-footer__legal a {
  font-size: var(--font-size-xs);
  color: var(--color-text-sub);
  text-decoration: none;
  transition: color var(--transition-fast);
}

.sz-footer__legal a:hover {
  color: var(--color-primary);
}

/* ================================================================
   Phase V2 Footer Responsive
   ================================================================ */

/* Tablet (768px+) */
@media (min-width: 768px) {
  .sz-footer__sitemap {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-md);
    padding: var(--spacing-lg);
    max-width: 960px;
    margin-inline: auto;
  }

  .sz-footer__category {
    border-bottom: none;
  }

  .sz-footer__category::details-content {
    display: block;
    content-visibility: visible;
  }

  .sz-footer__category > .sz-footer__summary {
    pointer-events: none;
    padding: 0 0 var(--spacing-xs);
    min-height: auto;
    border-bottom: 2px solid var(--color-border);
    margin-bottom: var(--spacing-xs);
  }

  .sz-footer__category > .sz-footer__summary .sz-footer__summary-icon {
    display: none;
  }

  .sz-footer__category > .sz-footer__detail {
    display: block;
    padding: var(--spacing-xs) 0 0;
  }

  .sz-footer__info {
    flex-direction: row;
    text-align: left;
    padding: var(--spacing-lg);
  }

  .sz-footer__copy {
    flex-direction: row;
    justify-content: space-between;
    text-align: left;
    padding: var(--spacing-md) var(--spacing-lg);
  }
}

/* Desktop (1024px+) */
@media (min-width: 1024px) {
  .sz-footer__sns {
    gap: var(--spacing-lg);
    padding: var(--spacing-xl) var(--spacing-lg);
  }

  /* Sitemap: wider gaps on desktop */
  .sz-footer__sitemap {
    gap: var(--spacing-lg);
    padding: var(--spacing-xl) var(--spacing-lg);
  }

  .sz-footer__category > .sz-footer__summary {
    padding: 0 0 var(--spacing-sm);
    margin-bottom: var(--spacing-sm);
  }

  .sz-footer__category > .sz-footer__detail {
    padding: var(--spacing-sm) 0 0;
  }

  /* Hospital info wider */
  .sz-footer__info {
    max-width: 960px;
    margin-inline: auto;
    padding: var(--spacing-xl) var(--spacing-lg);
    gap: var(--spacing-lg);
  }

  .sz-footer__copy {
    max-width: 960px;
    margin-inline: auto;
  }

  /* Bottom bar no longer needed on desktop */
  .sz-footer {
    padding-block-end: 0;
  }
}

/* --- Object: Component --- */

/* === object/component/_button.css === */

/* ==========================================================================
 * Component: Button (.c-button)
 * ボタンデザインシステム
 * バリエーション: primary / secondary / outline / ghost / icon / recruit
 * サイズ: sm / md(default) / lg
 * ========================================================================== */

/* ---------- ベーススタイル ---------- */
.c-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-sm);
  min-height: var(--touch-target-min);
  padding: var(--spacing-sm) var(--spacing-lg);
  font-family: var(--font-family-base);
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  line-height: var(--line-height-tight);
  text-align: center;
  text-decoration: none;
  white-space: nowrap;
  border: var(--border-width-thick) solid transparent;
  border-radius: var(--radius-md);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background-color var(--transition-fast),
              color var(--transition-fast),
              border-color var(--transition-fast),
              box-shadow var(--transition-fast),
              transform var(--transition-fast);
}

/* ---------- フォーカスリング（キーボード専用） ---------- */
.c-button:focus-visible {
  outline: var(--border-width-thick) solid var(--color-primary);
  outline-offset: 2px;
}

/* ---------- 無効状態 ---------- */
.c-button:disabled,
.c-button[aria-disabled="true"] {
  opacity: 0.5;
  cursor: not-allowed;
  pointer-events: none;
}

/* ==========================================================================
 * バリエーション
 * ========================================================================== */

/* --- Primary（メインアクション） --- */
.c-button--primary {
  background-color: var(--color-primary);
  color: var(--color-surface);
  border-color: var(--color-primary);
}

.c-button--primary:hover {
  background-color: var(--color-surface);
  color: var(--color-primary);
  border-color: var(--color-primary);
}

.c-button--primary:active {
  background-color: var(--color-primary-light);
  color: var(--color-primary);
  border-color: var(--color-primary);
  transform: scale(0.98);
}

/* --- Secondary（サブアクション） --- */
.c-button--secondary {
  background-color: var(--color-border-light);
  color: var(--color-text-main);
}

.c-button--secondary:hover {
  background-color: var(--color-border);
}

.c-button--secondary:active {
  background-color: var(--color-border);
  transform: scale(0.98);
}

/* --- Outline（枠線のみ） --- */
.c-button--outline {
  background-color: transparent;
  color: var(--color-primary);
  border-color: var(--color-primary);
}

.c-button--outline:hover {
  background-color: var(--color-primary-light);
}

.c-button--outline:active {
  background-color: var(--color-primary-light);
  transform: scale(0.98);
}

/* --- Ghost（テキストのみ） --- */
.c-button--ghost {
  background-color: transparent;
  color: var(--color-primary);
  padding-inline: var(--spacing-sm);
}

.c-button--ghost:hover {
  background-color: var(--color-primary-light);
}

.c-button--ghost:active {
  background-color: var(--color-primary-light);
  transform: scale(0.98);
}

/* --- Icon（アイコンボタン / FAB用ベース） --- */
.c-button--icon {
  padding: var(--spacing-sm);
  border-radius: var(--radius-full);
  background-color: var(--color-surface);
  color: var(--color-text-main);
  min-width: var(--touch-target-min);
}

.c-button--icon:hover {
  background-color: var(--color-primary-light);
  color: var(--color-primary);
}

.c-button--icon:active {
  transform: scale(0.95);
}

/* --- Recruit CTA（採用専用） --- */
.c-button--recruit {
  background-color: var(--color-recruit-cta);
  color: var(--color-surface);
}

.c-button--recruit:hover {
  background-color: var(--color-recruit-cta-hover);
}

.c-button--recruit:active {
  background-color: var(--color-recruit-cta-hover);
  transform: scale(0.98);
}

/* ==========================================================================
 * サイズバリエーション
 * ========================================================================== */

/* Small */
.c-button--sm {
  min-height: 36px;
  padding: var(--spacing-xs) var(--spacing-md);
  font-size: var(--font-size-sm);
}

/* Large */
.c-button--lg {
  min-height: 56px;
  padding: var(--spacing-md) var(--spacing-xl);
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-bold);
}

/* Full width */
.c-button--full {
  width: 100%;
}

/* ==========================================================================
 * Reduced Motion
 * ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  .c-button {
    transition: none;
  }

  .c-button:active {
    transform: none;
  }
}

/* === object/component/_card.css === */

/* ==========================================================================
 * Component: Card (.c-card)
 * 汎用カード（ニュース・病院情報・リンクカード等）
 *
 * バリエーション:
 *   .c-card--news   ニュースピックアップ（サムネイル＋タイトル＋日付）
 *   .c-card--info   病院情報（アイコン＋テキスト＋値）
 *   .c-card--link   リンクカード（hover時に浮き上がる）
 *
 * グリッドラッパー:
 *   .c-card-grid    auto-fit レスポンシブグリッド
 * ========================================================================== */

/* --- Grid Wrapper --- */
.c-card-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: var(--spacing-lg);
}

/* --- Base --- */
.c-card {
  display: flex;
  flex-direction: column;
  background-color: var(--color-surface);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-card);
  overflow: hidden;
  transition: box-shadow var(--transition-fast), transform var(--transition-fast);
}

/* --- Image --- */
.c-card__image {
  aspect-ratio: 16 / 9;
  overflow: hidden;
}

.c-card__image img {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}

/* --- Body --- */
.c-card__body {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
  padding: var(--spacing-md);
  flex: 1;
}

/* --- Title --- */
.c-card__title {
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  color: var(--color-text-main);
}

.c-card__title a {
  color: inherit;
  text-decoration: none;
}

.c-card__title a:hover {
  text-decoration: underline;
}

.c-card__title a:focus-visible {
  outline: var(--border-width-thick) solid var(--color-primary);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/* --- Meta (date, category) --- */
.c-card__meta {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
}

/* --- Date --- */
.c-card__date {
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
}

/* ==========================================================================
 * Variant: News (.c-card--news)
 * ========================================================================== */
.c-card--news .c-card__body {
  gap: var(--spacing-sm);
}

/* ==========================================================================
 * Variant: Info (.c-card--info)
 * ========================================================================== */
.c-card--info {
  border-inline-start: 3px solid var(--color-primary);
}

.c-card--info .c-card__body {
  gap: var(--spacing-md);
}

.c-card--info .c-card__header {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
}

.c-card--info .c-card__icon {
  flex-shrink: 0;
  inline-size: 24px;
  block-size: 24px;
  color: var(--color-primary);
}

.c-card--info .c-card__title {
  font-size: var(--font-size-base);
}

/* Info list (dl) */
.c-card__info-list {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
}

.c-card__info-row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: var(--spacing-sm);
  padding-block-end: var(--spacing-xs);
  border-block-end: var(--border-width) solid var(--color-border-light);
}

.c-card__info-row:last-child {
  border-block-end: none;
  padding-block-end: 0;
}

.c-card__info-label {
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
  white-space: nowrap;
}

.c-card__info-value {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-main);
  text-align: end;
}

/* ==========================================================================
 * Variant: Link (.c-card--link)
 * ========================================================================== */
.c-card--link {
  text-decoration: none;
  color: inherit;
  cursor: pointer;
}

.c-card--link:hover {
  box-shadow: var(--shadow-card-hover);
  transform: translateY(-2px);
}

.c-card--link:focus-visible {
  outline: var(--border-width-thick) solid var(--color-primary);
  outline-offset: 2px;
}

.c-card--link:active {
  transform: translateY(0);
  box-shadow: var(--shadow-card);
}

/* ==========================================================================
 * Responsive
 * ========================================================================== */
@media (min-width: 768px) {
  .c-card__title {
    font-size: var(--font-size-lg);
  }

  .c-card--info .c-card__title {
    font-size: var(--font-size-md);
  }
}

/* ==========================================================================
 * prefers-reduced-motion
 * ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  .c-card,
  .c-card--link {
    transition: none;
  }
}

/* === object/component/_tab.css === */

/* ==========================================================================
 * Component: Tab (.c-tab)
 * タブ切替UI（ニュースカテゴリ等）
 * 北海道医療大学参考：タブ型ニュースUI
 *
 * WAI-ARIA:
 *   role="tablist" → .c-tab
 *   role="tab"     → .c-tab__button
 *   role="tabpanel"→ .c-tab__panel
 * ========================================================================== */

/* --- Tab list --- */
.c-tab {
  display: flex;
  gap: 0;
  border-block-end: var(--border-width) solid var(--color-border);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

/* --- Tab button --- */
.c-tab__button {
  flex-shrink: 0;
  min-block-size: var(--touch-target-min);
  padding: var(--spacing-sm) var(--spacing-md);
  font-family: var(--font-family-base);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-sub);
  background: none;
  border: none;
  border-block-end: var(--border-width-thick) solid transparent;
  cursor: pointer;
  white-space: nowrap;
  transition: color var(--transition-fast),
              border-color var(--transition-fast);
}

.c-tab__button:hover {
  color: var(--color-primary);
}

.c-tab__button:focus-visible {
  outline: var(--border-width-thick) solid var(--color-primary);
  outline-offset: -2px;
  border-radius: var(--radius-sm);
}

/* Active state */
.c-tab__button[aria-selected="true"] {
  color: var(--color-primary);
  border-block-end-color: var(--color-primary);
  font-weight: var(--font-weight-bold);
}

/* --- Tab panel --- */
.c-tab__panel {
  padding-block-start: var(--spacing-lg);
}

/* [hidden] は _reset.css のグローバルルールで処理 */

/* ==========================================================================
 * Responsive
 * ========================================================================== */
@media (min-width: 768px) {
  .c-tab__button {
    font-size: var(--font-size-base);
    padding: var(--spacing-sm) var(--spacing-lg);
  }
}

/* ==========================================================================
 * prefers-reduced-motion
 * ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  .c-tab__button {
    transition: none;
  }
}

/* === object/component/_news-list.css === */

/* ==========================================================================
 * Component: News List (.c-news-list)
 * ニュース一覧（日付 + カテゴリラベル + タイトル）
 * 函館医療センター参考：薄いボーダーの整然としたリスト
 * ========================================================================== */

.c-news-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* --- List item --- */
.c-news-list__item {
  border-block-end: var(--border-width) solid var(--color-border-light);
}

.c-news-list__item:last-child {
  border-block-end: none;
}

/* --- Link (wraps entire row for larger tap target) --- */
.c-news-list__link {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--spacing-sm);
  padding-block: var(--spacing-md);
  color: var(--color-text-main);
  text-decoration: none;
  transition: background-color var(--transition-fast);
}

.c-news-list__link:hover {
  background-color: var(--color-background);
}

.c-news-list__link:focus-visible {
  outline: var(--border-width-thick) solid var(--color-primary);
  outline-offset: -2px;
  border-radius: var(--radius-sm);
}

/* --- Date --- */
.c-news-list__date {
  flex-shrink: 0;
  inline-size: 5.5em;
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
  white-space: nowrap;
}

/* --- Title --- */
.c-news-list__title {
  flex: 1;
  flex-basis: 100%;
  min-inline-size: 0;
}

.c-news-list__link:hover .c-news-list__title {
  color: var(--color-primary);
}

/* ==========================================================================
 * Responsive: title inline from 576px
 * ========================================================================== */
@media (min-width: 576px) {
  .c-news-list__title {
    flex-basis: auto;
  }
}

/* ==========================================================================
 * prefers-reduced-motion
 * ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  .c-news-list__link {
    transition: none;
  }
}

/* === object/component/_badge.css === */

/* ==========================================================================
 * Component: Badge (.c-badge)
 * カテゴリラベル・ステータス表示
 *
 * セマンティックバリエーション:
 *   .c-badge--primary   メインカテゴリ（デフォルト）
 *   .c-badge--accent    アクセント（差別化ポイント）
 *   .c-badge--error     エラー・重要
 *   .c-badge--success   成功・完了
 *   .c-badge--warning   注意・警告
 *   .c-badge--recruit   採用関連
 *
 * ニュースカテゴリ:
 *   .c-badge--cat-info       お知らせ（primary系）
 *   .c-badge--cat-medical    診療案内（accent系）
 *   .c-badge--cat-event      イベント（success系）
 *   .c-badge--cat-important  重要（error系）
 *   .c-badge--cat-recruit    採用情報（recruit系）
 * ========================================================================== */

/* --- Base --- */
.c-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xs);
  padding: var(--spacing-xs) var(--spacing-sm);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  line-height: 1;
  border-radius: var(--radius-sm);
  white-space: nowrap;
  vertical-align: middle;
  /* デフォルト: primary-light */
  background-color: var(--color-primary-light);
  color: var(--color-primary);
}

/* ==========================================================================
 * Semantic variants
 * ========================================================================== */
.c-badge--primary {
  background-color: var(--color-primary-light);
  color: var(--color-primary);
}

.c-badge--accent {
  background-color: var(--color-brand-accent-light);
  color: var(--color-brand-accent-dark);
}

.c-badge--error {
  background-color: var(--color-error-light);
  color: var(--color-error);
}

.c-badge--success {
  background-color: var(--color-success-light);
  color: var(--color-success);
}

.c-badge--warning {
  background-color: var(--color-warning-light);
  color: var(--color-text-main);
}

.c-badge--recruit {
  background-color: var(--color-recruit-cta-light);
  color: var(--color-recruit-cta);
}

/* ==========================================================================
 * News category variants
 *
 * カテゴリ−色マッピング:
 *   お知らせ     → primary-light  / primary       (青系)
 *   診療案内     → accent淡色    / accent-dark    (シアン系)
 *   イベント     → success-light / success        (緑系)
 *   重要         → error-light   / error          (赤系)
 *   採用情報     → recruit淡色   / recruit-cta    (オレンジ系)
 * ========================================================================== */
.c-badge--cat-info {
  background-color: var(--color-primary-light);
  color: var(--color-primary);
}

.c-badge--cat-medical {
  background-color: var(--color-brand-accent-light);
  color: var(--color-brand-accent-dark);
}

.c-badge--cat-event {
  background-color: var(--color-success-light);
  color: var(--color-success);
}

.c-badge--cat-important {
  background-color: var(--color-error-light);
  color: var(--color-error);
}

.c-badge--cat-recruit {
  background-color: var(--color-recruit-cta-light);
  color: var(--color-recruit-cta);
}

/* ==========================================================================
 * Size variant
 * ========================================================================== */
.c-badge--lg {
  padding: var(--spacing-xs) var(--spacing-md);
  font-size: var(--font-size-sm);
}

/* ==========================================================================
 * With dot indicator
 * ========================================================================== */
.c-badge__dot {
  display: inline-block;
  inline-size: 6px;
  block-size: 6px;
  border-radius: var(--radius-full);
  background-color: currentColor;
  flex-shrink: 0;
}

/* === object/component/_form.css === */

/* ==========================================================================
 * Component: Form (.c-form)
 * フォーム入力要素の統一設計
 *
 * 対象:
 *   .c-form              フォームラッパー
 *   .c-form__group        フィールドグループ（label + input + error）
 *   .c-form__label        ラベル
 *   .c-form__required     必須マーク
 *   .c-form__input        テキスト入力 / textarea / select
 *   .c-form__select       セレクトボックス（カスタム矢印）
 *   .c-form__radio-group  ラジオ / チェックボックスグループ
 *   .c-form__radio        個別ラジオ / チェック
 *   .c-form__error        バリデーションエラー
 *   .c-form__help         ヘルプテキスト
 *   .c-form__actions      送信ボタン等のアクション行
 * ========================================================================== */

/* --- Form wrapper --- */
.c-form {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-lg);
}

/* --- Field group --- */
.c-form__group {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs);
}

/* --- Label --- */
.c-form__label {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-main);
}

/* --- Required mark --- */
.c-form__required {
  display: inline-flex;
  align-items: center;
  padding: 1px var(--spacing-xs);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  color: var(--color-error);
  background-color: var(--color-error-light);
  border-radius: var(--radius-sm);
  line-height: 1.4;
}

/* ==========================================================================
 * Text input / Textarea
 * ========================================================================== */
.c-form__input {
  display: block;
  inline-size: 100%;
  min-block-size: var(--touch-target-min);
  padding: var(--spacing-sm) var(--spacing-md);
  font-family: var(--font-family-base);
  font-size: var(--font-size-base);
  line-height: var(--line-height-normal);
  color: var(--color-text-main);
  background-color: var(--color-surface);
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--radius-md);
  transition: border-color var(--transition-fast),
              box-shadow var(--transition-fast);
}

.c-form__input::placeholder {
  color: var(--color-text-muted);
}

.c-form__input:focus-visible {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--color-primary-light);
  outline: none;
}

/* Textarea */
textarea.c-form__input {
  min-block-size: 160px;
  resize: vertical;
}

/* ==========================================================================
 * Select
 * ========================================================================== */
.c-form__select {
  display: block;
  inline-size: 100%;
  min-block-size: var(--touch-target-min);
  padding: var(--spacing-sm) var(--spacing-xl) var(--spacing-sm) var(--spacing-md);
  font-family: var(--font-family-base);
  font-size: var(--font-size-base);
  color: var(--color-text-main);
  background-color: var(--color-surface);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' fill='none'%3E%3Cpath d='M1 1.5l5 5 5-5' stroke='%236b6560' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right var(--spacing-md) center;
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--radius-md);
  appearance: none;
  cursor: pointer;
  transition: border-color var(--transition-fast),
              box-shadow var(--transition-fast);
}

.c-form__select:focus-visible {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--color-primary-light);
  outline: none;
}

/* ==========================================================================
 * Radio / Checkbox group
 * ========================================================================== */
.c-form__radio-group {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-md);
}

.c-form__radio {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xs);
  min-block-size: var(--touch-target-min);
  padding: var(--spacing-xs) var(--spacing-sm);
  font-size: var(--font-size-base);
  color: var(--color-text-main);
  cursor: pointer;
}

.c-form__radio input[type="radio"],
.c-form__radio input[type="checkbox"] {
  inline-size: 20px;
  block-size: 20px;
  margin: 0;
  accent-color: var(--color-primary);
  cursor: pointer;
}

.c-form__radio input[type="radio"]:focus-visible,
.c-form__radio input[type="checkbox"]:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* ==========================================================================
 * Validation states
 * ========================================================================== */

/* Error state on inputs */
.c-form__group--error .c-form__input,
.c-form__group--error .c-form__select {
  border-color: var(--color-error);
}

.c-form__group--error .c-form__input:focus-visible,
.c-form__group--error .c-form__select:focus-visible {
  box-shadow: 0 0 0 3px var(--color-error-light);
}

/* Error message */
.c-form__error {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  font-size: var(--font-size-sm);
  color: var(--color-error);
  line-height: var(--line-height-tight);
}

/* Error icon (optional SVG before text) */
.c-form__error::before {
  content: "";
  display: inline-block;
  flex-shrink: 0;
  inline-size: 16px;
  block-size: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23c62828' viewBox='0 0 16 16'%3E%3Cpath d='M8 1a7 7 0 100 14A7 7 0 008 1zm0 10.5a.75.75 0 110-1.5.75.75 0 010 1.5zM8.75 4.5v4a.75.75 0 01-1.5 0v-4a.75.75 0 011.5 0z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-size: contain;
}

/* ==========================================================================
 * Help text
 * ========================================================================== */
.c-form__help {
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
  line-height: var(--line-height-normal);
}

/* ==========================================================================
 * Disabled state
 * ========================================================================== */
.c-form__input:disabled,
.c-form__select:disabled {
  opacity: 0.5;
  cursor: not-allowed;
  background-color: var(--color-background);
}

/* ==========================================================================
 * Actions (submit button row)
 * ========================================================================== */
.c-form__actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-md);
  padding-block-start: var(--spacing-md);
}

/* ==========================================================================
 * Responsive
 * ========================================================================== */
@media (min-width: 768px) {
  .c-form__group--horizontal {
    flex-direction: row;
    align-items: center;
    gap: var(--spacing-md);
  }

  .c-form__group--horizontal .c-form__label {
    flex-shrink: 0;
    inline-size: 160px;
  }

  .c-form__group--horizontal .c-form__input,
  .c-form__group--horizontal .c-form__select {
    flex: 1;
  }
}

/* ==========================================================================
 * prefers-reduced-motion
 * ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  .c-form__input,
  .c-form__select {
    transition: none;
  }
}

/* ==========================================================================
 * Django auto-generated form elements
 * .c-form 内の input / textarea / select に自動適用
 * ========================================================================== */
.c-form input[type="text"],
.c-form input[type="email"],
.c-form input[type="tel"],
.c-form input[type="url"],
.c-form input[type="number"],
.c-form input[type="password"],
.c-form input[type="search"],
.c-form input[type="date"],
.c-form textarea {
  display: block;
  inline-size: 100%;
  min-block-size: var(--touch-target-min);
  padding: var(--spacing-sm) var(--spacing-md);
  font-family: var(--font-family-base);
  font-size: var(--font-size-base);
  line-height: var(--line-height-normal);
  color: var(--color-text-main);
  background-color: var(--color-surface);
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--radius-md);
  transition: border-color var(--transition-fast),
              box-shadow var(--transition-fast);
}

.c-form textarea {
  min-block-size: 160px;
  resize: vertical;
}

.c-form select {
  display: block;
  inline-size: 100%;
  min-block-size: var(--touch-target-min);
  padding: var(--spacing-sm) var(--spacing-xl) var(--spacing-sm) var(--spacing-md);
  font-family: var(--font-family-base);
  font-size: var(--font-size-base);
  color: var(--color-text-main);
  background-color: var(--color-surface);
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--radius-md);
  appearance: none;
  cursor: pointer;
  transition: border-color var(--transition-fast),
              box-shadow var(--transition-fast);
}

.c-form input[type="text"]:focus-visible,
.c-form input[type="email"]:focus-visible,
.c-form input[type="tel"]:focus-visible,
.c-form input[type="url"]:focus-visible,
.c-form input[type="number"]:focus-visible,
.c-form input[type="password"]:focus-visible,
.c-form input[type="search"]:focus-visible,
.c-form input[type="date"]:focus-visible,
.c-form textarea:focus-visible,
.c-form select:focus-visible {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--color-primary-light);
  outline: none;
}

.c-form__group--error input,
.c-form__group--error textarea,
.c-form__group--error select {
  border-color: var(--color-error);
}

.c-form__group--error input:focus-visible,
.c-form__group--error textarea:focus-visible,
.c-form__group--error select:focus-visible {
  box-shadow: 0 0 0 3px var(--color-error-light);
}

/* === object/component/_breadcrumbs.css === */

/* ==========================================================================
 * Component: Breadcrumbs
 * パンくずリスト（JSON-LD構造化データ対応）
 * ========================================================================== */

.c-breadcrumbs {
  padding-block: var(--spacing-sm);
  padding-inline: var(--spacing-md);
  max-width: var(--content-max-width);
  margin-inline: auto;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.c-breadcrumbs__list {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  font-size: var(--font-size-xs);
  white-space: nowrap;
}

.c-breadcrumbs__item {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  color: var(--color-text-sub);
}

.c-breadcrumbs__item:not(:last-child)::after {
  content: ">";
  color: var(--color-text-muted);
  font-size: var(--font-size-xs);
}

.c-breadcrumbs__link {
  color: var(--color-link);
  padding-block: var(--spacing-xs);
  transition: color var(--transition-fast);
}

.c-breadcrumbs__link:hover {
  color: var(--color-link-hover);
}

.c-breadcrumbs__current {
  color: var(--color-text-main);
  font-weight: var(--font-weight-medium);
  padding-block: var(--spacing-xs);
}

@media (min-width: 768px) {
  .c-breadcrumbs__list {
    font-size: var(--font-size-sm);
  }
}

/* === object/component/_pagination.css === */

/* ==========================================================================
 * Component: Pagination
 * ページネーション
 * ========================================================================== */

.c-pagination {
  display: flex;
  justify-content: center;
  padding-block: var(--spacing-lg);
}

.c-pagination__list {
  display: flex;
  gap: var(--spacing-xs);
}

.c-pagination__link {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: var(--touch-target-min);
  min-height: var(--touch-target-min);
  padding-inline: var(--spacing-sm);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-link);
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--radius-md);
  transition: background-color var(--transition-fast), color var(--transition-fast);
}

.c-pagination__link:hover {
  background-color: var(--color-primary-light);
  color: var(--color-primary);
}

.c-pagination__link--current {
  background-color: var(--color-primary);
  color: var(--color-surface);
  border-color: var(--color-primary);
}

/* === object/component/_schedule.css === */

/* ==========================================================================
 * Component: Schedule Table (.c-schedule)
 * 外来スケジュール表（曜日×診療科マトリクス）
 * ========================================================================== */

.c-schedule {
  inline-size: 100%;
  border-collapse: collapse;
  font-size: var(--font-size-sm);
}

.c-schedule caption {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-main);
  text-align: start;
  margin-block-end: var(--spacing-sm);
}

.c-schedule th,
.c-schedule td {
  padding: var(--spacing-sm) var(--spacing-md);
  border: var(--border-width) solid var(--color-border);
  text-align: center;
  vertical-align: middle;
}

.c-schedule thead th {
  background-color: var(--color-primary);
  color: var(--color-white);
  font-weight: var(--font-weight-medium);
  white-space: nowrap;
}

.c-schedule tbody th {
  background-color: var(--color-background);
  font-weight: var(--font-weight-medium);
  text-align: start;
  white-space: nowrap;
}

.c-schedule tbody td {
  min-inline-size: 3em;
}

/* Available / Unavailable markers */
.c-schedule__available {
  color: var(--color-primary);
  font-weight: var(--font-weight-bold);
}

.c-schedule__unavailable {
  color: var(--color-text-sub);
}

/* ==========================================================================
 * Responsive: horizontal scroll on mobile
 * ========================================================================== */
.c-schedule-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

@media (min-width: 768px) {
  .c-schedule {
    font-size: var(--font-size-base);
  }
}

/* ==========================================================================
 * Calendar Actions (.c-calendar-actions)
 * カレンダー追加ボタン群
 * ========================================================================== */
.c-calendar-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-sm);
}

/* === object/component/_search.css === */

/* ==========================================================================
 * Component: Search Form (.c-search-form)
 * サイト内検索フォーム
 * ========================================================================== */

.c-search-form {
  display: flex;
  gap: var(--spacing-sm);
  max-inline-size: 600px;
}

.c-search-form__input {
  flex: 1;
  min-inline-size: 0;
}

.c-search-form__button {
  flex-shrink: 0;
  min-block-size: var(--touch-target-min);
}

/* --- ヘッダー内の検索（デスクトップ） --- */
.c-search-header {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
}

.c-search-header__input {
  inline-size: 180px;
  min-block-size: 36px;
  padding: var(--spacing-xs) var(--spacing-sm);
  font-family: var(--font-family-base);
  font-size: var(--font-size-sm);
  color: var(--color-text-main);
  background-color: var(--color-surface);
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--radius-md);
  transition: border-color var(--transition-fast),
              box-shadow var(--transition-fast);
}

.c-search-header__input::placeholder {
  color: var(--color-text-muted);
}

.c-search-header__input:focus-visible {
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--color-primary-light);
  outline: none;
}

.c-search-header__button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-block-size: 36px;
  min-inline-size: 36px;
  padding: 0;
  background: none;
  border: none;
  color: var(--color-text-sub);
  cursor: pointer;
  border-radius: var(--radius-md);
  transition: color var(--transition-fast),
              background-color var(--transition-fast);
}

.c-search-header__button:hover {
  color: var(--color-primary);
  background-color: var(--color-bg-sub);
}

.c-search-header__button:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* === object/component/_sns.css === */

/* ==========================================================================
 * Component: SNS Card (.c-sns-card)
 * SNSアカウントカード + SNSグリッド
 * ========================================================================== */

/* --- Grid --- */
.c-sns-grid {
  display: grid;
  gap: var(--spacing-lg);
}

@media (min-width: 576px) {
  .c-sns-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .c-sns-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* --- Card --- */
.c-sns-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: var(--spacing-xl) var(--spacing-lg);
  background-color: var(--color-surface);
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--radius-lg);
  transition: box-shadow var(--transition-fast);
}

.c-sns-card:hover {
  box-shadow: var(--shadow-card);
}

.c-sns-card__icon {
  margin-block-end: var(--spacing-md);
}

.c-sns-card--line .c-sns-card__icon {
  color: #06c755;
}

.c-sns-card--instagram .c-sns-card__icon {
  color: #e4405f;
}

.c-sns-card--youtube .c-sns-card__icon {
  color: #ff0000;
}

.c-sns-card--x .c-sns-card__icon {
  color: var(--color-text-main);
}

.c-sns-card__title {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  margin-block-end: var(--spacing-sm);
}

.c-sns-card__desc {
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
  margin-block-end: var(--spacing-lg);
  flex-grow: 1;
}

.c-sns-card__feature-list {
  list-style: none;
  padding: 0;
  text-align: left;
}

.c-sns-card__feature-list li {
  margin-block-end: var(--spacing-sm);
  font-size: var(--font-size-sm);
}

/* --- LINE Button Variant --- */
.c-button--line {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xs);
  background-color: #06c755;
  color: var(--color-white);
  border: none;
}

.c-button--line:hover {
  background-color: #05b04c;
}

.c-button__icon {
  flex-shrink: 0;
}

/* ==========================================================================
 * Footer SNS Icons (.sz-footer__sns)
 * ========================================================================== */
.sz-footer__sns {
  display: flex;
  gap: var(--spacing-md);
  margin-block-start: var(--spacing-lg);
}

.sz-footer__sns-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--touch-target-min);
  height: var(--touch-target-min);
  color: var(--color-text-sub);
  border-radius: var(--radius-full);
  transition: opacity var(--transition-fast),
              background-color var(--transition-fast);
}

.sz-footer__sns-link:hover {
  opacity: 0.8;
}

.sz-footer__sns-link:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

/* --- SNS Brand Colors --- */
.sz-footer__sns-link--line {
  background-color: #06c755;
  color: var(--color-white);
}

.sz-footer__sns-link--line .sz-footer__sns-icon {
  fill: var(--color-white);
}

.sz-footer__sns-link--instagram {
  background: linear-gradient(135deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
  color: var(--color-white);
}

.sz-footer__sns-link--instagram .sz-footer__sns-icon {
  fill: var(--color-white);
}

.sz-footer__sns-link--x {
  background-color: #000;
  color: var(--color-white);
}

.sz-footer__sns-link--x .sz-footer__sns-icon {
  fill: var(--color-white);
}

.sz-footer__sns-link--youtube {
  background-color: #ff0000;
  color: var(--color-white);
}

.sz-footer__sns-link--youtube .sz-footer__sns-icon {
  fill: var(--color-white);
}

.sz-footer__sns-link--facebook {
  background-color: #1877f2;
  color: var(--color-white);
}

.sz-footer__sns-link--facebook .sz-footer__sns-icon {
  fill: var(--color-white);
}

/* === object/component/_embed.css === */

/* ==========================================================================
 * Component: Embed (.c-embed)
 * 外部サービス埋め込み（Instagram / YouTube）
 * プライバシー配慮: 同意ボタン → ロード
 * ========================================================================== */

/* --- 共通 --- */
.c-embed {
  max-inline-size: 540px;
  margin-inline: auto;
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background-color: var(--color-bg-sub);
}

/* --- 同意ボタン（外部読み込み前） --- */
.c-embed__consent {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-sm);
  width: 100%;
  min-block-size: 280px;
  padding: var(--spacing-xl);
  background: none;
  border: none;
  cursor: pointer;
  color: var(--color-text-sub);
  transition: background-color var(--transition-fast);
}

.c-embed__consent:hover {
  background-color: var(--color-surface);
}

.c-embed__consent:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: -2px;
}

.c-embed__consent-icon {
  opacity: 0.5;
}

.c-embed__consent-text {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-medium);
}

.c-embed__consent-note {
  font-size: var(--font-size-xs);
  color: var(--color-text-muted);
}

/* --- YouTube レスポンシブ 16:9 --- */
.c-embed--youtube {
  max-inline-size: 100%;
}

.c-embed__responsive {
  position: relative;
  padding-block-start: 56.25%; /* 16:9 */
  block-size: 0;
  overflow: hidden;
}

.c-embed__iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: none;
}

/* --- Instagram loaded state --- */
.c-embed--loaded .c-embed__consent {
  display: none;
}

/* === object/component/_map.css === */

/* ==========================================================================
 * Component: Map (.c-map)
 * Google Maps レスポンシブ埋め込み
 * ========================================================================== */

.c-map {
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--radius-lg);
  overflow: hidden;
  background-color: var(--color-bg-sub);
}

.c-map__responsive {
  position: relative;
  padding-block-start: 56.25%; /* 16:9 */
  block-size: 0;
  overflow: hidden;
}

@media (min-width: 768px) {
  .c-map__responsive {
    padding-block-start: 45%; /* デスクトップはやや低め */
  }
}

.c-map__iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: none;
}

/* === object/component/_bottom-bar.css === */

/* ==========================================================================
 * Component: Bottom Bar (.c-bottom-bar)
 * スマホ固定下部バー: 電話 / アクセス / 採用 / 音声
 * 1024px以上で非表示
 * ========================================================================== */

.c-bottom-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: var(--z-header, 90);
  display: flex;
  background: var(--color-surface);
  border-block-start: 1px solid var(--color-border-light);
  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.08);
  padding-block-end: env(safe-area-inset-bottom, 0px);
  transition: transform var(--transition-normal);
}

.c-bottom-bar__btn {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  padding: var(--spacing-sm) 0;
  min-height: 3.5rem;
  text-decoration: none;
  color: var(--color-text-sub);
  font-size: 0;
  border: none;
  background: none;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.c-bottom-bar__btn:hover {
  color: var(--color-primary);
}

.c-bottom-bar__btn:active {
  background: var(--color-background);
}

.c-bottom-bar__btn--recruit {
  color: var(--color-recruit-cta, var(--color-primary));
}

.c-bottom-bar__btn--voice {
  color: var(--color-primary);
}

.c-bottom-bar__icon {
  font-size: 1.5rem;
}

.c-bottom-bar__label {
  font-size: var(--font-size-xs);
  line-height: 1;
}

/* ボトムバー表示時のbody余白 */
body {
  padding-block-end: 56px;
}

/* input フォーカス時にボトムバー非表示 */
.c-bottom-bar.is-hidden {
  transform: translateY(100%);
}

/* 1024px以上で非表示 */
@media (min-width: 1024px) {
  .c-bottom-bar {
    display: none;
  }

  body {
    padding-block-end: 0;
  }
}

/* === object/component/_voice-sheet.css === */

/* ==========================================================================
 * Component: Voice Bottom Sheet (.c-voice-sheet)
 * Phase 5: 音声ナビ ボトムシート（モバイル用）
 * ボトムバーの🎤ボタンからスライドアップ表示
 * ========================================================================== */

.c-voice-sheet {
  position: fixed;
  inset: 0;
  z-index: var(--z-modal, 1000);
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
}

.c-voice-sheet[hidden] {
  display: none;
}

/* オーバーレイ */
.c-voice-sheet__overlay {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.4);
  animation: voiceSheetFadeIn var(--transition-normal) ease-out;
}

/* パネル本体 */
.c-voice-sheet__panel {
  position: relative;
  background: var(--color-surface);
  border-radius: var(--radius-lg, 1rem) var(--radius-lg, 1rem) 0 0;
  padding-block-end: calc(3.5rem + env(safe-area-inset-bottom, 0px) + var(--spacing-md));
  animation: voiceSheetSlideUp var(--transition-normal) ease-out;
}

/* ドラッグハンドル */
.c-voice-sheet__handle {
  width: 2.5rem;
  height: 0.25rem;
  background: var(--color-border-light);
  border-radius: var(--radius-full);
  margin: var(--spacing-sm) auto var(--spacing-xs);
}

/* ヘッダー */
.c-voice-sheet__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-inline: var(--spacing-md);
  padding-block-end: var(--spacing-xs);
}

.c-voice-sheet__title {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-main);
  margin: 0;
}

.c-voice-sheet__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--touch-target-min);
  height: var(--touch-target-min);
  background: none;
  border: none;
  cursor: pointer;
  color: var(--color-text-sub);
  border-radius: var(--radius-full);
}

.c-voice-sheet__close:hover {
  background: var(--color-background);
}

/* ボディ */
.c-voice-sheet__body {
  padding-inline: var(--spacing-md);
}

.c-voice-sheet__desc {
  font-size: var(--font-size-xs);
  color: var(--color-text-sub);
  margin-block-end: var(--spacing-md);
  text-align: center;
}

/* グリッドチップ */
.c-voice-sheet__chip {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-xxs);
  padding: var(--spacing-sm);
  background: var(--color-background);
  border: 1px solid var(--color-border-light);
  border-radius: var(--radius-md);
  cursor: pointer;
  min-height: var(--touch-target-recommended);
  transition: background-color var(--transition-fast);
}

.c-voice-sheet__chip:hover {
  background: var(--color-primary-light);
}

.c-voice-sheet__chip-icon {
  font-size: 1.5rem;
  color: var(--color-primary);
}

.c-voice-sheet__chip-label {
  font-size: var(--font-size-xxs, 0.625rem);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-main);
  line-height: 1.2;
}

/* マイクボタン（大） */
.c-voice-sheet__mic {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-xs);
  width: 100%;
  margin-block-start: var(--spacing-md);
  padding: var(--spacing-sm) var(--spacing-md);
  background: var(--color-success);
  color: var(--color-surface);
  border: none;
  border-radius: var(--radius-full);
  cursor: pointer;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  min-height: var(--touch-target-recommended);
  transition: background-color var(--transition-fast);
}

.c-voice-sheet__mic:hover {
  background: var(--color-success-dark, #1b5e20);
}

.c-voice-sheet__mic-icon {
  width: 1.25rem;
  height: 1.25rem;
}

.c-voice-sheet__mic-text {
  line-height: 1;
}

/* PC (768px+): 非表示 */
@media (min-width: 768px) {
  .c-voice-sheet {
    display: none;
  }
}

/* アニメーション */
@keyframes voiceSheetSlideUp {
  from {
    transform: translateY(100%);
  }
  to {
    transform: translateY(0);
  }
}

@keyframes voiceSheetFadeIn {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

/* === object/component/_sakura-common.css === */

/**
 * sakura-common-components.css
 * 木古内スタイル共通コンポーネント
 * 全ページで使用される共通スタイルを統合
 */

/* ===== Material Icons ===== */
.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 1.5rem;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  font-feature-settings: 'liga';
  -webkit-font-smoothing: antialiased;
}

/* ===== セクション共通 ===== */
.sakura-section {
  margin-bottom: 3rem;
}

.sakura-section__title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--color-primary, #c8102e);
  border-bottom: 2px solid var(--color-primary, #c8102e);
  padding-bottom: 0.5rem;
  margin-bottom: 1.5rem;
}

.sakura-section__title .material-symbols-outlined {
  font-size: 1.5rem;
}

.sakura-section__lead {
  color: #666;
  margin-bottom: 2rem;
  line-height: 1.8;
}

/* ===== リード文 ===== */
.sakura-lead {
  text-align: center;
  margin-bottom: 2rem;
  font-size: 1.05rem;
  color: #555;
  line-height: 1.8;
}

/* ===== ボタン ===== */
.sakura-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.875rem 2rem;
  border-radius: 50px;
  font-weight: 600;
  font-size: 1rem;
  text-decoration: none;
  cursor: pointer;
  border: none;
  transition: all 0.3s ease;
}

.sakura-btn--primary {
  background: var(--color-primary, #c8102e);
  color: #fff;
}

.sakura-btn--primary:hover {
  background: #a00d25;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(200, 16, 46, 0.3);
}

.sakura-btn--white {
  background: #fff;
  color: var(--color-primary, #c8102e);
  border: 2px solid var(--color-primary, #c8102e);
}

.sakura-btn--white:hover {
  background: var(--color-primary, #c8102e);
  color: #fff;
}

.sakura-btn--ghost {
  background: transparent;
  color: var(--color-primary, #c8102e);
  border: 2px solid var(--color-primary, #c8102e);
}

.sakura-btn--ghost:hover {
  background: var(--color-primary, #c8102e);
  color: #fff;
}

/* ===== 関連リンクグリッド ===== */
.sakura-related-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 1rem;
}

.sakura-related-card {
  background: #f5f5f5;
  border-radius: 12px;
  padding: 1.5rem;
  text-align: center;
  text-decoration: none;
  color: #333;
  transition: all 0.3s ease;
}

.sakura-related-card:hover {
  background: #e8e8e8;
  transform: translateY(-3px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.sakura-related-card__icon {
  width: 48px;
  height: 48px;
  background: var(--color-primary, #114FA1);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1rem;
  color: #fff;
}

.sakura-related-card__title {
  font-weight: 600;
  font-size: 0.95rem;
}

/* ===== フロー（ステップ） ===== */
.sakura-flow {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.sakura-flow-step {
  display: flex;
  gap: 1.5rem;
  align-items: flex-start;
}

.sakura-flow__number {
  width: 40px;
  height: 40px;
  background: var(--color-primary, #c8102e);
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 1.25rem;
  flex-shrink: 0;
}

.sakura-flow-step__content {
  flex: 1;
}

.sakura-flow-step__title {
  font-weight: 700;
  font-size: 1.1rem;
  margin-bottom: 0.5rem;
  color: #333;
}

.sakura-flow-step__text {
  color: #666;
  line-height: 1.7;
}

/* ===== FAQ ===== */
.sakura-faq-list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.sakura-faq-item {
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 12px;
  overflow: hidden;
}

.sakura-faq-item__toggle {
  width: 100%;
  background: none;
  border: none;
  padding: 1.25rem 1.5rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
  font-size: 1rem;
  font-weight: 600;
  color: #333;
  text-align: left;
}

.sakura-faq-item__answer {
  padding: 0 1.5rem 1.5rem;
  color: #666;
  line-height: 1.8;
  display: none;
}

.sakura-faq-item.is-active .sakura-faq-item__answer {
  display: block;
}

/* ===== インフォボックス ===== */
.sakura-info-box {
  background: #f5f5f5;
  border-radius: 12px;
  padding: 1.5rem;
  margin-bottom: 1.5rem;
}

.sakura-note-box {
  background: #fff3e0;
  border-left: 4px solid #ff9800;
  border-radius: 8px;
  padding: 1rem 1.5rem;
  margin-bottom: 1.5rem;
}

.sakura-intro-box {
  background: linear-gradient(135deg, #fff5f5 0%, #fff 100%);
  border-radius: 16px;
  padding: 2rem;
  margin-bottom: 2rem;
}

.sakura-content-box {
  background: #fff;
  border-radius: 12px;
  padding: 2rem;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

/* ===== コンタクト ===== */
.sakura-contact-box {
  background: #fff;
  border-radius: 16px;
  padding: 2rem;
  text-align: center;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.sakura-contact-phone {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}

.sakura-contact-phone__number {
  font-size: 2rem;
  font-weight: 900;
  color: var(--color-primary, #c8102e);
  display: flex;
  align-items: center;
  gap: 0.5rem;
  text-decoration: none;
}

.sakura-contact-phone__hours {
  font-size: 0.9rem;
  color: #666;
}

/* ===== 空状態 ===== */
.sakura-empty {
  text-align: center;
  padding: 3rem;
  color: #999;
}

.sakura-empty__icon {
  font-size: 4rem;
  margin-bottom: 1rem;
  opacity: 0.5;
}

.sakura-empty__text {
  font-size: 1.1rem;
}

/* ===== アクティブ状態 ===== */
/* .is-active は各コンポーネントで定義 */

/* ===== 確認ステップ ===== */

/* ===== 医師プロフィールカード ===== */
.sakura-doctor-profile {
  display: flex;
  flex-direction: row;
  gap: var(--spacing-md, 1rem);
  align-items: flex-start;
}

.sakura-doctor-profile__photo {
  flex-shrink: 0;
  width: 5rem;
  aspect-ratio: 1;
  border-radius: var(--radius-full, 50%);
  overflow: hidden;
  background: var(--color-border-light, #e5e7eb);
}

.sakura-doctor-profile__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.sakura-doctor-profile__info {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: var(--spacing-xs, 0.5rem);
}

.sakura-doctor-profile__name {
  font-size: clamp(1.125rem, 1rem + 0.5vw, 1.375rem);
  font-weight: var(--font-weight-bold, 700);
  color: var(--color-text-main, #1a1a1a);
  margin: 0;
  line-height: var(--line-height-tight, 1.3);
}

.sakura-doctor-profile__title {
  font-size: clamp(0.8125rem, 0.75rem + 0.25vw, 0.9375rem);
  color: var(--color-primary, #114fa1);
  font-weight: var(--font-weight-medium, 500);
  margin: 0;
}

.sakura-doctor-profile__specialty {
  font-size: clamp(0.8125rem, 0.75rem + 0.25vw, 0.9375rem);
  color: var(--color-text-sub, #4b5563);
  margin: 0;
}

.sakura-doctor-profile__qualifications,
.sakura-doctor-profile__career {
  font-size: clamp(0.8125rem, 0.75rem + 0.25vw, 0.875rem);
  color: var(--color-text-sub, #4b5563);
}

.sakura-doctor-profile__qualifications p,
.sakura-doctor-profile__career p {
  margin: 0 0 var(--spacing-2xs, 0.25rem);
  font-weight: var(--font-weight-bold, 700);
  color: var(--color-text-main, #1a1a1a);
}

.sakura-doctor-profile__comment {
  font-size: clamp(0.8125rem, 0.75rem + 0.25vw, 0.9375rem);
  color: var(--color-text-sub, #4b5563);
  line-height: var(--line-height-relaxed, 1.8);
  margin: 0;
  padding-block-start: var(--spacing-xs, 0.5rem);
  border-block-start: 1px solid var(--color-border-light, #e5e7eb);
}

/* 768px+: 写真を大きくして横並び維持 */
@media (min-width: 768px) {
  .sakura-doctor-profile__photo {
    width: 7rem;
  }
}

/* ===== 医師カードリスト ===== */
.sakura-doctor-list {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-lg, 1.5rem);
}

.sakura-doctor-card {
  background: var(--color-surface, #fff);
  border-radius: var(--radius-md, 0.5rem);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  padding: var(--spacing-md, 1rem);
  border: 1px solid var(--color-border-light, #e5e7eb);
}

@media (min-width: 768px) {
  .sakura-doctor-card {
    padding: var(--spacing-lg, 1.5rem);
  }
}
.sakura-confirm-step__number {
  width: 32px;
  height: 32px;
  background: var(--color-primary, #c8102e);
  color: #fff;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 1rem;
}

/* ===== レスポンシブ ===== */
@media (max-width: 768px) {
  .sakura-section__title {
    font-size: 1.25rem;
  }
  
  .sakura-lead {
    font-size: 1rem;
    text-align: left;
  }
  
  .sakura-btn {
    padding: 0.75rem 1.5rem;
    font-size: 0.9rem;
  }
  
  .sakura-related-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
  }
  
  .sakura-flow-step {
    flex-direction: column;
    gap: 1rem;
  }
  
  .sakura-contact-phone__number {
    font-size: 1.5rem;
  }
}

/* === object/component/_pwa.css === */

/* =================================================================
   PWA UI コンポーネント
   - インストールバナー
   - オフラインインジケーター
   - SW更新バナー
   - プッシュ通知トグル
   ================================================================= */

/* ── インストールバナー ── */
.c-pwa-banner {
  position: fixed;
  bottom: calc(3.5rem + 0.5rem);
  left: var(--space-md, 16px);
  right: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-sm, 8px);
  padding: var(--space-sm, 12px) var(--space-md, 16px);
  background: var(--surface, #ffffff);
  border: 1px solid var(--border, #ddd);
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  z-index: 1000;
  max-width: calc(100vw - 56px - 3rem - 1rem);
  margin: 0;
}

.c-pwa-banner[hidden] {
  display: none;
}

.c-pwa-banner__text {
  display: flex;
  align-items: center;
  gap: var(--space-xs, 4px);
  font-size: 0.875rem;
  font-weight: 500;
  margin: 0;
  color: var(--text, #333);
}

.c-pwa-banner__actions {
  display: flex;
  align-items: center;
  gap: var(--space-xs, 4px);
  flex-shrink: 0;
}

.c-pwa-banner--update {
  background: var(--primary, #114FA1);
  color: white;
  bottom: auto;
  top: var(--space-sm, 8px);
}

.c-pwa-banner--update .c-pwa-banner__text {
  color: white;
}

/* ── オフラインインジケーター ── */
.c-offline-indicator {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-xs, 4px);
  padding: 6px;
  background: var(--warning, #f0ad4e);
  color: #333;
  font-size: 0.8rem;
  font-weight: 600;
  z-index: 10001;
  text-align: center;
}

.c-offline-indicator[hidden] {
  display: none;
}

/* ── プッシュ通知トグル ── */
.c-push-toggle {
  display: flex;
  align-items: center;
  gap: var(--space-xs, 4px);
  min-height: 44px;
  cursor: pointer;
  background: none;
  border: 1px solid var(--border, #ddd);
  border-radius: 8px;
  padding: 8px 12px;
  font-size: 0.875rem;
}

.c-push-toggle[hidden] {
  display: none;
}

.c-push-toggle[aria-pressed="true"] {
  background: var(--primary, #114FA1);
  color: white;
  border-color: var(--primary, #114FA1);
}

/* ── ウェアラブル小画面でバナー調整 ── */
@media screen and (max-width: 360px) {
  .c-pwa-banner {
    bottom: 0;
    left: 0;
    right: 0;
    border-radius: 0;
    flex-direction: column;
    text-align: center;
  }
}

@media screen and (max-width: 280px) {
  .c-pwa-banner {
    display: none;
  }
}

/* --- Object: Project --- */

/* === object/project/_section.css === */

/* ==========================================================================
 * Project: Section (.p-section)
 * 各ページの汎用セクションラッパー
 * ========================================================================== */

.p-section {
  padding-block: var(--spacing-xl);
}

.p-section + .p-section {
  border-block-start: var(--border-width) solid var(--color-border-light);
}

/* --- Heading --- */
.p-section__heading {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-main);
  margin-block-end: var(--spacing-lg);
}

/* --- Lead text --- */
.p-section__lead {
  font-size: var(--font-size-md);
  color: var(--color-text-sub);
  margin-block-end: var(--spacing-lg);
  max-inline-size: 640px;
}

/* --- Meta (date + category in detail pages) --- */
.p-section__meta {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
  margin-block-end: var(--spacing-md);
}

/* --- Body content --- */
.p-section__body {
  line-height: var(--line-height-relaxed);
}

/* ==========================================================================
 * Responsive
 * ========================================================================== */
@media (min-width: 768px) {
  .p-section {
    padding-block: var(--spacing-xxl);
  }

  .p-section__heading {
    font-size: var(--font-size-xxl);
  }
}

/* === object/project/_hero.css === */

/* ==========================================================================
 * Project: Hero (.p-hero)
 * トップページヒーローセクション（メインビジュアル）
 * ========================================================================== */

.p-hero {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-block-size: 60vh;
  padding-block: var(--spacing-xxxl);
  text-align: center;
  overflow: hidden;
}

/* --- Background image --- */
.p-hero__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.p-hero__bg img {
  display: block;
  inline-size: 100%;
  block-size: 100%;
  object-fit: cover;
}

/* --- Overlay for contrast --- */
.p-hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  background: linear-gradient(
    to bottom,
    var(--color-overlay-light),
    var(--color-overlay-dark)
  );
}

/* --- Content (above overlay) --- */
.p-hero__content {
  position: relative;
  z-index: 2;
  max-inline-size: 640px;
  padding-inline: var(--spacing-md);
}

.p-hero__title {
  font-size: var(--font-size-xxl);
  font-weight: var(--font-weight-bold);
  color: var(--color-white);
  margin-block-end: var(--spacing-md);
  text-shadow: var(--shadow-text);
}

.p-hero__lead {
  font-size: var(--font-size-md);
  color: var(--color-white);
  margin-block-end: var(--spacing-lg);
  text-shadow: var(--shadow-text-sm);
}

/* --- CTA buttons --- */
.p-hero__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: var(--spacing-md);
}

/* ==========================================================================
 * Responsive
 * ========================================================================== */
@media (min-width: 768px) {
  .p-hero {
    min-block-size: 70vh;
  }

  .p-hero__title {
    font-size: var(--font-size-xxxl);
  }

  .p-hero__lead {
    font-size: var(--font-size-lg);
  }

  .p-hero__content {
    max-inline-size: 800px;
  }
}

/* === object/project/_news-section.css === */

/* ==========================================================================
 * Project: News Section (.p-news-section)
 * トップページのニュースセクション（タブ + リスト + ピックアップカード）
 * ========================================================================== */

.p-news-section {
  background-color: var(--color-surface);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-card);
  padding: var(--spacing-lg);
}

/* --- Header (title + more link) --- */
.p-news-section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--spacing-md);
  margin-block-end: var(--spacing-md);
}

.p-news-section__title {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-main);
}

.p-news-section__more {
  flex-shrink: 0;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  color: var(--color-primary);
  text-decoration: none;
  transition: color var(--transition-fast);
}

.p-news-section__more:hover {
  color: var(--color-primary-hover);
  text-decoration: underline;
}

.p-news-section__more:focus-visible {
  outline: var(--border-width-thick) solid var(--color-primary);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/* --- Pickup cards area --- */
.p-news-section__pickup {
  margin-block-start: var(--spacing-xl);
}

.p-news-section__pickup-title {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-main);
  margin-block-end: var(--spacing-md);
}

.p-news-section__pickup-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-md);
}

/* ==========================================================================
 * Responsive
 * ========================================================================== */
@media (min-width: 576px) {
  .p-news-section__pickup-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .p-news-section {
    padding: var(--spacing-xl);
  }
}

@media (min-width: 1024px) {
  .p-news-section__pickup-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ==========================================================================
 * prefers-reduced-motion
 * ========================================================================== */
@media (prefers-reduced-motion: reduce) {
  .p-news-section__more {
    transition: none;
  }
}

/* === object/project/_access-info.css === */

/* ==========================================================================
 * Project: Access Info (.p-access-info)
 * アクセス・外来案内セクション
 * 函館医療センター参考：独立カプセル表示
 * ========================================================================== */
.p-access-info {
  background-color: var(--color-surface);
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-card);
  padding: var(--spacing-xl);
}

.p-access-info__title {
  font-size: var(--font-size-lg);
  margin-block-end: var(--spacing-md);
}

.p-access-info__row {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-md);
  padding-block: var(--spacing-sm);
  border-bottom: var(--border-width) solid var(--color-border-light);
}

.p-access-info__label {
  font-weight: var(--font-weight-medium);
  min-width: 120px;
  color: var(--color-text-sub);
  font-size: var(--font-size-sm);
}

.p-access-info__value {
  flex: 1;
}

/* === object/project/_hospital-info.css === */

/* ==========================================================================
 * Project: Hospital Info (.p-hospital-info)
 * 病院基本情報カプセル（外来受付時間・面会時間・電話番号等）
 * ========================================================================== */

.p-hospital-info {
  padding: var(--spacing-lg);
}

/* --- Section header --- */
.p-hospital-info__header {
  margin-block-end: var(--spacing-md);
}

.p-hospital-info__title {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-main);
}

/* --- Card grid (2-column for capsules) --- */
.p-hospital-info__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-md);
}

/* --- Phone block --- */
.p-hospital-info__phone {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-primary);
  letter-spacing: var(--letter-spacing-tight);
}

.p-hospital-info__phone a {
  color: inherit;
  text-decoration: none;
}

.p-hospital-info__phone a:focus-visible {
  outline: var(--border-width-thick) solid var(--color-primary);
  outline-offset: 2px;
  border-radius: var(--radius-sm);
}

/* ==========================================================================
 * Responsive
 * ========================================================================== */
@media (min-width: 576px) {
  .p-hospital-info__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .p-hospital-info {
    padding: var(--spacing-xl);
  }
}

/* === object/project/_subpage.css === */

/* ==========================================================================
 * Project: Subpage (.p-subpage-hero, .p-subnav, .l-subpage)
 * サブページ共通レイアウト
 * スマホファースト（min-width メディアクエリ）
 * ========================================================================== */

/* ---------- ページヒーロー ---------- */
.p-subpage-hero {
  background: linear-gradient(135deg, var(--color-primary), var(--color-brand-accent));
  color: var(--color-white);
  padding-block: var(--spacing-xl) var(--spacing-lg);
  padding-inline: var(--spacing-md);
  text-align: center;
}

@media (min-width: 768px) {
  .p-subpage-hero {
    padding-block: var(--spacing-xxl) var(--spacing-xl);
  }
}

.p-subpage-hero__inner {
  max-width: var(--content-max-width);
  margin-inline: auto;
}

.p-subpage-hero__en {
  display: block;
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  opacity: 0.8;
  margin-block-end: var(--spacing-xs);
}

.p-subpage-hero__title {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  margin: 0;
}

@media (min-width: 768px) {
  .p-subpage-hero__title {
    font-size: var(--font-size-xxl);
  }
}

/* ---------- ページ内サブナビ ---------- */
.p-subnav {
  margin-block: var(--spacing-lg);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.p-subnav__list {
  display: flex;
  gap: var(--spacing-sm);
  list-style: none;
  margin: 0;
  padding: 0;
  white-space: nowrap;
}

.p-subnav__link {
  display: inline-flex;
  align-items: center;
  padding: var(--spacing-sm) var(--spacing-md);
  border: var(--border-width) solid var(--color-primary);
  border-radius: var(--radius-full);
  color: var(--color-primary);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-medium);
  text-decoration: none;
  transition: background-color var(--transition-fast), color var(--transition-fast);
  min-height: var(--touch-target-min);
}

.p-subnav__link:hover,
.p-subnav__link:focus-visible {
  background-color: var(--color-primary);
  color: var(--color-white);
}

/* ---------- 2カラムレイアウト ---------- */
.l-subpage {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-lg);
  padding-block-end: var(--spacing-xxl);
}

@media (min-width: 1024px) {
  .l-subpage--with-sidebar {
    flex-direction: row;
  }

  .l-subpage__main {
    flex: 1;
    min-width: 0;
  }
}

/* ---------- メインコンテンツ内の共通パターン ---------- */
.l-subpage__main > section {
  margin-block-end: var(--spacing-xxl);
}

.l-subpage__main > section:last-child {
  margin-block-end: 0;
}

/* ---------- コンテンツ内の見出し ---------- */
.p-subpage-section__heading {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-main);
  padding-block-end: var(--spacing-sm);
  border-block-end: var(--border-width-thick) solid var(--color-primary);
  margin-block-end: var(--spacing-lg);
}

/* ---------- 情報リスト（定義リスト） ---------- */
.p-subpage-dl {
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: var(--spacing-sm) var(--spacing-md);
  margin: 0;
}

.p-subpage-dl dt {
  font-weight: var(--font-weight-bold);
  color: var(--color-text-main);
}

.p-subpage-dl dd {
  margin: 0;
  color: var(--color-text-main);
}

/* Mobile base */
.p-subpage-dl {
  grid-template-columns: 1fr;
}

@media (min-width: 576px) {
  .p-subpage-dl {
    grid-template-columns: auto 1fr;
  }
}

/* ---------- Error Pages ---------- */
.p-error-page {
  min-height: 60vh;
  min-height: 60svh;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* === object/project/_saikazo-style.css === */

/* ================================================================
   木古内町国民健康保険病院スタイル
   saikazo-style.css

   サイドバー構成は維持しつつ、ヘッダー・メイン・フッターを調整
   ================================================================ */

/* ================================================================
   1. CSS変数（variables.cssで一元管理）

   :root変数は variables.css に統合済み
   Section 16: Saikazo-Style互換変数 を参照
   ================================================================ */

/* ================================================================
   ヘッダー固定時のメインコンテンツのパディング
   PCヘッダー: ユーティリティ(48px) + メインナビ(50px) = 98px
   SPヘッダー: 3.5rem (モバイルヘッダー高さ)
   ================================================================ */
.saikazo-main {
  padding-top: var(--header-height, 98px);
}

body.home-page .saikazo-main {
  padding-top: 0;
}

@media (max-width: 1024px) {
  .saikazo-main {
    padding-top: var(--header-mobile-height, 3.5rem);
  }

  body.home-page .saikazo-main {
    padding-top: 0;
  }
}

/* ================================================================
   アクセシビリティ - フォーカススタイル
   ================================================================ */

/* 基本フォーカススタイル */
*:focus-visible {
  outline: 3px solid var(--saikazo-accent);
  outline-offset: 2px;
}

*:focus:not(:focus-visible) {
  outline: none;
}

/* ボタン・リンクフォーカス */
.btn-saikazo:focus-visible,
.btn-saikazo-outline:focus-visible,
.quick-access-item:focus-visible,
.news-tab-saikazo:focus-visible,
.feature-card-saikazo:focus-visible,
.department-card-saikazo:focus-visible,
.staff-card-saikazo:focus-visible,
.download-item-saikazo:focus-visible {
  outline: 3px solid var(--saikazo-accent);
  outline-offset: 2px;
  box-shadow: 0 0 0 6px rgba(255, 111, 0, 0.2);
}

/* スキップリンク */
.skip-link {
  position: absolute;
  top: -100px;
  left: 50%;
  transform: translateX(-50%);
  background: var(--saikazo-primary);
  color: #fff;
  padding: 0.75rem 1.5rem;
  border-radius: 0 0 8px 8px;
  font-weight: 600;
  z-index: 10000;
  transition: top var(--saikazo-duration) var(--saikazo-ease);
}

.skip-link:focus {
  top: 0;
  color: #fff;
}

/* スクリーンリーダー専用テキスト */
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* ================================================================
   2. ヘッダー（木古内スタイル）
   ================================================================ */

/* ヘッダートップバー - 木古内スタイル */
.site-header .header-top-bar {
  background: var(--saikazo-primary);
  color: #fff;
  font-size: 0.8125rem;
  height: 40px;
  position: relative;
  overflow: hidden;
}

.site-header .header-top-bar::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(90deg,
    var(--saikazo-primary-dark) 0%,
    var(--saikazo-primary) 50%,
    var(--saikazo-primary-light) 100%);
  opacity: 0.9;
}

.site-header .header-top-inner {
  position: relative;
  z-index: 1;
}

.site-header .header-top-link {
  color: #fff;
  opacity: 0.9;
  transition: opacity var(--saikazo-duration) var(--saikazo-ease);
}

.site-header .header-top-link:hover {
  opacity: 1;
  color: #fff;
}

/* メインヘッダー - 木古内スタイル */
.site-header .header-main {
  background: var(--saikazo-bg-white);
  box-shadow: var(--saikazo-shadow-md);
  position: relative;
}

/* ロゴエリア */
.site-header .header-logo img {
  transition: transform var(--saikazo-duration) var(--saikazo-ease);
}

.site-header .header-logo:hover img {
  transform: scale(1.02);
}

/* 電話番号エリア - 木古内スタイル */
.site-header .header-tel-number {
  color: var(--saikazo-primary);
  font-weight: 700;
  font-size: 1.5rem;
  letter-spacing: 0.02em;
}

.site-header .header-tel-label {
  color: var(--saikazo-text-light);
  font-size: 0.75rem;
}

/* アクセスボタン - 木古内スタイル */
.site-header .header-access-btn {
  background: linear-gradient(135deg, var(--saikazo-accent) 0%, var(--saikazo-accent-dark) 100%);
  color: #fff;
  padding: 0.75rem 1.5rem;
  border-radius: 50px;
  font-weight: 600;
  font-size: 0.875rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  box-shadow: 0 4px 15px rgba(255, 111, 0, 0.3);
  transition: all var(--saikazo-duration) var(--saikazo-ease);
  text-decoration: none;
}

.site-header .header-access-btn:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(255, 111, 0, 0.4);
  color: #fff;
}

/* ================================================================
   3. ヒーローセクション（木古内スタイル）
   ================================================================ */

/* メインビジュアル - フルスクリーン風 */
.hero-slider {
  position: relative;
  width: 100%;
  height: 70vh;
  min-height: 500px;
  max-height: 700px;
  overflow: hidden;
}

.hero-slide {
  position: relative;
  height: 100%;
}

.hero-slide-image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* 木古内スタイル オーバーレイ - 濃い青ベース */
.hero-slide-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to right,
    rgba(17, 79, 161, 0.85) 0%,
    rgba(17, 79, 161, 0.5) 50%,
    rgba(0, 0, 0, 0.2) 100%
  );
}

/* ヒーローコンテンツ */
.hero-slide-content {
  position: absolute;
  left: 8%;
  top: 50%;
  transform: translateY(-50%);
  max-width: 600px;
  color: #fff;
  z-index: 10;
}

.hero-en-title {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.875rem;
  font-weight: 400;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  opacity: 0.9;
  margin-bottom: 1rem;
  display: block;
}

.hero-main-title {
  font-size: clamp(2rem, 4vw, 3rem);
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 1.5rem;
  text-shadow: 0 2px 20px rgba(0, 0, 0, 0.2);
}

.hero-subtitle {
  font-size: 1rem;
  line-height: 1.8;
  opacity: 0.95;
  max-width: 500px;
}

/* スクロールインジケーター - 木古内スタイル */
.hero-scroll-indicator {
  position: absolute;
  bottom: 30px;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  color: #fff;
  font-size: 0.75rem;
  letter-spacing: 0.1em;
  z-index: 10;
}

.hero-scroll-indicator::after {
  content: '';
  width: 1px;
  height: 40px;
  background: linear-gradient(to bottom, #fff, transparent);
  margin-top: 0.5rem;
  animation: scrollBounce 2s infinite;
}

@keyframes scrollBounce {
  0%, 100% { transform: translateY(0); opacity: 1; }
  50% { transform: translateY(10px); opacity: 0.5; }
}

/* Swiper ナビゲーション - 木古内スタイル */
.hero-swiper .swiper-button-next,
.hero-swiper .swiper-button-prev {
  width: 50px;
  height: 50px;
  background: rgba(255, 255, 255, 0.15);
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 50%;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  transition: all var(--saikazo-duration) var(--saikazo-ease);
}

.hero-swiper .swiper-button-next::after,
.hero-swiper .swiper-button-prev::after {
  font-size: 1rem;
  color: #fff;
  font-weight: 600;
}

.hero-swiper .swiper-button-next:hover,
.hero-swiper .swiper-button-prev:hover {
  background: rgba(255, 255, 255, 0.25);
  border-color: rgba(255, 255, 255, 0.5);
  transform: scale(1.05);
}

.hero-swiper .swiper-pagination-bullet {
  width: 12px;
  height: 12px;
  background: rgba(255, 255, 255, 0.4);
  opacity: 1;
  transition: all var(--saikazo-duration) var(--saikazo-ease);
}

.hero-swiper .swiper-pagination-bullet-active {
  background: #fff;
  width: 36px;
  border-radius: 6px;
}

/* スライド番号表示 - 木古内スタイル */
.hero-slide-counter {
  position: absolute;
  right: 8%;
  bottom: 30px;
  color: #fff;
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 1.5rem;
  z-index: 10;
}

.hero-slide-counter .current {
  font-size: 2.5rem;
  font-weight: 600;
}

.hero-slide-counter .divider {
  margin: 0 0.5rem;
  opacity: 0.5;
}

.hero-slide-counter .total {
  opacity: 0.7;
}

/* ================================================================
   4. 重要なお知らせバー（木古内スタイル）
   ================================================================ */

.important-notice-bar {
  background: linear-gradient(90deg, #d32f2f, #c62828);
  color: #fff;
  padding: 0.75rem 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  font-size: 0.875rem;
  box-shadow: 0 2px 10px rgba(211, 47, 47, 0.3);
}

.important-notice-bar .notice-label {
  background: rgba(255, 255, 255, 0.2);
  padding: 0.25rem 0.75rem;
  border-radius: 4px;
  font-weight: 600;
  font-size: 0.75rem;
}

.important-notice-bar a {
  color: #fff;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.important-notice-bar a:hover {
  text-decoration-thickness: 2px;
}

/* ================================================================
   5. クイックアクセスカード（木古内スタイル）
   ================================================================ */

.quick-access-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  gap: 0;
  background: var(--saikazo-bg-white);
  box-shadow: var(--saikazo-shadow-lg);
  margin: -60px auto 0;
  position: relative;
  z-index: 20;
  max-width: 1440px;
  border-radius: 16px;
  overflow: hidden;
}

@media (max-width: 1024px) {
  .quick-access-grid {
    grid-template-columns: repeat(3, 1fr);
    margin-top: -40px;
  }
}

@media (max-width: 640px) {
  .quick-access-grid {
    grid-template-columns: repeat(2, 1fr);
    margin-top: -30px;
    border-radius: 12px;
  }
}

.quick-access-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 2rem 1rem;
  text-decoration: none;
  color: var(--saikazo-text);
  border-right: 1px solid var(--saikazo-border-light);
  border-bottom: 1px solid var(--saikazo-border-light);
  transition: all var(--saikazo-duration) var(--saikazo-ease);
  position: relative;
  overflow: hidden;
}

.quick-access-item:last-child {
  border-right: none;
}

.quick-access-item::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, var(--saikazo-primary-50), transparent);
  opacity: 0;
  transition: opacity var(--saikazo-duration) var(--saikazo-ease);
}

.quick-access-item:hover {
  background: var(--saikazo-primary-50);
}

.quick-access-item:hover::before {
  opacity: 1;
}

.quick-access-item:hover .quick-access-icon {
  transform: scale(1.1);
  color: var(--saikazo-primary);
}

.quick-access-icon {
  font-size: 2.5rem;
  color: var(--saikazo-primary);
  margin-bottom: 0.75rem;
  transition: all var(--saikazo-duration) var(--saikazo-ease);
}

.quick-access-label {
  font-size: 0.875rem;
  font-weight: 500;
  text-align: center;
  line-height: 1.4;
}

.quick-access-sublabel {
  font-size: 0.75rem;
  color: var(--saikazo-text-muted);
  margin-top: 0.25rem;
}

/* ================================================================
   6. 診療時間セクション（木古内スタイル）
   ================================================================ */

.reception-info-section {
  background: var(--saikazo-bg-white);
  padding: 4rem 0;
}

.reception-info-grid {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr 1fr;
  gap: 2rem;
  max-width: 1440px;
  margin: 0 auto;
}

@media (max-width: 1024px) {
  .reception-info-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 640px) {
  .reception-info-grid {
    grid-template-columns: 1fr;
  }
}

.reception-info-card {
  background: var(--saikazo-gray-50);
  border-radius: 12px;
  padding: 2rem;
  text-align: center;
  border: 1px solid var(--saikazo-border-light);
  transition: all var(--saikazo-duration) var(--saikazo-ease);
}

.reception-info-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--saikazo-shadow-md);
  border-color: var(--saikazo-primary-100);
}

.reception-info-card h3 {
  font-size: 1rem;
  font-weight: 600;
  color: var(--saikazo-primary);
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
}

.reception-info-card .time-value {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--saikazo-text);
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
}

.reception-info-card .time-note {
  font-size: 0.75rem;
  color: var(--saikazo-text-muted);
  margin-top: 0.5rem;
}

/* ================================================================
   7. セクション共通スタイル（木古内スタイル）
   ================================================================ */

.section-saikazo {
  padding: 5rem 0;
}

.section-saikazo--bg {
  background: var(--saikazo-gray-50);
}

.section-header-saikazo {
  text-align: center;
  margin-bottom: 3rem;
}

.section-en-title-saikazo {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.875rem;
  font-weight: 400;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--saikazo-primary);
  margin-bottom: 0.5rem;
  display: block;
}

.section-title-saikazo {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--saikazo-text);
  position: relative;
  display: inline-block;
}

.section-title-saikazo::after {
  content: '';
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  width: 60px;
  height: 3px;
  background: linear-gradient(90deg, var(--saikazo-primary), var(--saikazo-primary-light));
  border-radius: 2px;
}

/* ================================================================
   8. 当院の特徴セクション（木古内スタイル）
   ================================================================ */

.features-section-saikazo {
  background: linear-gradient(135deg, var(--saikazo-primary) 0%, var(--saikazo-primary-dark) 100%);
  padding: 5rem 0;
  color: #fff;
  position: relative;
  overflow: hidden;
}

.features-section-saikazo::before {
  content: '';
  position: absolute;
  top: -50%;
  right: -20%;
  width: 600px;
  height: 600px;
  background: radial-gradient(circle, rgba(255,255,255,0.1) 0%, transparent 70%);
  border-radius: 50%;
}

.features-slider-wrapper {
  position: relative;
  max-width: 1440px;
  margin: 0 auto;
}

.feature-slide {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: center;
}

@media (max-width: 768px) {
  .feature-slide {
    grid-template-columns: 1fr;
    gap: 2rem;
  }
}

.feature-slide-image {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--saikazo-shadow-xl);
}

.feature-slide-image img {
  width: 100%;
  height: auto;
  transition: transform var(--saikazo-duration-slow) var(--saikazo-ease);
}

.feature-slide-image:hover img {
  transform: scale(1.05);
}

.feature-slide-content {
  padding: 2rem;
}

.feature-slide-number {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 4rem;
  font-weight: 600;
  opacity: 0.3;
  line-height: 1;
  margin-bottom: 1rem;
}

.feature-slide-title {
  font-size: 1.5rem;
  font-weight: 700;
  margin-bottom: 1rem;
  line-height: 1.4;
}

.feature-slide-text {
  font-size: 0.9375rem;
  line-height: 1.8;
  opacity: 0.9;
  margin-bottom: 1.5rem;
}

.feature-slide-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  background: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.4);
  border-radius: 50px;
  color: #fff;
  font-weight: 500;
  font-size: 0.875rem;
  transition: all var(--saikazo-duration) var(--saikazo-ease);
  text-decoration: none;
}

.feature-slide-btn:hover {
  background: rgba(255, 255, 255, 0.3);
  border-color: rgba(255, 255, 255, 0.6);
  transform: translateX(4px);
  color: #fff;
}

/* ================================================================
   9. ニュースセクション（木古内スタイル）
   ================================================================ */

.news-section-saikazo {
  padding: 5rem 0;
  background: var(--saikazo-bg-white);
}

.news-tabs-saikazo {
  display: flex;
  justify-content: center;
  gap: 0.5rem;
  margin-bottom: 2rem;
  flex-wrap: wrap;
}

.news-tab-saikazo {
  padding: 0.75rem 1.5rem;
  border: 1px solid var(--saikazo-border);
  border-radius: 50px;
  background: var(--saikazo-bg-white);
  color: var(--saikazo-text-light);
  font-size: 0.875rem;
  font-weight: 500;
  cursor: pointer;
  transition: all var(--saikazo-duration) var(--saikazo-ease);
}

.news-tab-saikazo:hover {
  border-color: var(--saikazo-primary);
  color: var(--saikazo-primary);
}

.news-tab-saikazo.active {
  background: var(--saikazo-primary);
  border-color: var(--saikazo-primary);
  color: #fff;
}

.news-list-saikazo {
  max-width: 900px;
  margin: 0 auto;
}

.news-item-saikazo {
  display: flex;
  align-items: flex-start;
  gap: 1.5rem;
  padding: 1.5rem 0;
  border-bottom: 1px solid var(--saikazo-border-light);
  text-decoration: none;
  color: inherit;
  transition: all var(--saikazo-duration) var(--saikazo-ease);
}

.news-item-saikazo:hover {
  background: var(--saikazo-gray-50);
  padding-left: 1rem;
  padding-right: 1rem;
  margin-left: -1rem;
  margin-right: -1rem;
  border-radius: 8px;
}

.news-item-saikazo:hover .news-title-saikazo {
  color: var(--saikazo-primary);
}

.news-date-saikazo {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.9375rem;
  color: var(--saikazo-text-muted);
  flex-shrink: 0;
  min-width: 90px;
}

.news-category-saikazo {
  font-size: 0.6875rem;
  font-weight: 600;
  padding: 0.25rem 0.75rem;
  border-radius: 4px;
  flex-shrink: 0;
}

.news-category-saikazo--important {
  background: #ffebee;
  color: #c62828;
}

.news-category-saikazo--news {
  background: var(--saikazo-primary-50);
  color: var(--saikazo-primary-dark);
}

.news-category-saikazo--event {
  background: #fff3e0;
  color: #e65100;
}

.news-category-saikazo--recruit {
  background: #e8f5e9;
  color: #2e7d32;
}

.news-title-saikazo {
  flex: 1;
  font-size: 0.9375rem;
  line-height: 1.6;
  color: var(--saikazo-text);
  transition: color var(--saikazo-duration) var(--saikazo-ease);
}

.news-new-badge {
  display: inline-block;
  background: var(--saikazo-accent);
  color: #fff;
  font-size: 0.625rem;
  font-weight: 700;
  padding: 0.125rem 0.5rem;
  border-radius: 3px;
  margin-right: 0.5rem;
  vertical-align: middle;
}

/* ================================================================
   10. フッター（木古内スタイル）
   ================================================================ */

.site-footer-saikazo {
  background: var(--saikazo-gray-900);
  color: #fff;
  padding: 4rem 0 2rem;
}

.footer-main-saikazo {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 3rem;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 2rem;
}

@media (max-width: 1024px) {
  .footer-main-saikazo {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 640px) {
  .footer-main-saikazo {
    grid-template-columns: 1fr;
    text-align: center;
  }
}

.footer-info-saikazo {
  color: rgba(255, 255, 255, 0.8);
}

.footer-logo-saikazo {
  margin-bottom: 1.5rem;
}

.footer-logo-saikazo img {
  height: 50px;
  width: auto;
}

.footer-address-saikazo {
  font-size: 0.875rem;
  line-height: 1.8;
  margin-bottom: 1rem;
}

.footer-tel-saikazo {
  font-size: 1.5rem;
  font-weight: 700;
  color: #fff;
  margin-bottom: 1rem;
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

@media (max-width: 640px) {
  .footer-tel-saikazo {
    justify-content: center;
  }
}

.footer-nav-saikazo h4 {
  font-size: 0.9375rem;
  font-weight: 600;
  margin-bottom: 1rem;
  color: #fff;
}

.footer-nav-saikazo ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.footer-nav-saikazo li {
  margin-bottom: 0.5rem;
}

.footer-nav-saikazo a {
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.875rem;
  text-decoration: none;
  transition: color var(--saikazo-duration) var(--saikazo-ease);
}

.footer-nav-saikazo a:hover {
  color: #fff;
}

.footer-bottom-saikazo {
  border-top: 1px solid rgba(255, 255, 255, 0.1);
  margin-top: 3rem;
  padding-top: 2rem;
  text-align: center;
}

.footer-links-saikazo {
  display: flex;
  justify-content: center;
  gap: 2rem;
  margin-bottom: 1rem;
  flex-wrap: wrap;
}

.footer-links-saikazo a {
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.75rem;
  text-decoration: none;
}

.footer-links-saikazo a:hover {
  color: #fff;
}

.footer-copyright-saikazo {
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.5);
}

/* ================================================================
   11. スクロールアニメーション
   ================================================================ */

.fade-in-up {
  opacity: 0;
  transform: translateY(30px);
  transition: all 0.6s var(--saikazo-ease-out);
}

.fade-in-up.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.fade-in-left {
  opacity: 0;
  transform: translateX(-30px);
  transition: all 0.6s var(--saikazo-ease-out);
}

.fade-in-left.is-visible {
  opacity: 1;
  transform: translateX(0);
}

.fade-in-right {
  opacity: 0;
  transform: translateX(30px);
  transition: all 0.6s var(--saikazo-ease-out);
}

.fade-in-right.is-visible {
  opacity: 1;
  transform: translateX(0);
}

.scale-in {
  opacity: 0;
  transform: scale(0.9);
  transition: all 0.6s var(--saikazo-ease-out);
}

.scale-in.is-visible {
  opacity: 1;
  transform: scale(1);
}

/* スタガードアニメーション */
.stagger-item {
  opacity: 0;
  transform: translateY(20px);
  transition: all 0.5s var(--saikazo-ease-out);
}

.stagger-item.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ================================================================
   12. ボタンスタイル（木古内スタイル）
   ================================================================ */

.btn-saikazo {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 1rem 2rem;
  font-size: 0.9375rem;
  font-weight: 600;
  border-radius: 50px;
  text-decoration: none;
  transition: all var(--saikazo-duration) var(--saikazo-ease);
  cursor: pointer;
  border: none;
}

.btn-saikazo--primary {
  background: linear-gradient(135deg, var(--saikazo-primary) 0%, var(--saikazo-primary-dark) 100%);
  color: #fff;
  box-shadow: 0 4px 15px rgba(0, 131, 143, 0.3);
}

.btn-saikazo--primary:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(0, 131, 143, 0.4);
  color: #fff;
}

.btn-saikazo--accent {
  background: linear-gradient(135deg, var(--saikazo-accent) 0%, var(--saikazo-accent-dark) 100%);
  color: #fff;
  box-shadow: 0 4px 15px rgba(255, 111, 0, 0.3);
}

.btn-saikazo--accent:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(255, 111, 0, 0.4);
  color: #fff;
}

.btn-saikazo--outline {
  background: transparent;
  border: 2px solid var(--saikazo-primary);
  color: var(--saikazo-primary);
}

.btn-saikazo--outline:hover {
  background: var(--saikazo-primary);
  color: #fff;
}

.btn-saikazo--white {
  background: #fff;
  color: var(--saikazo-primary);
  box-shadow: var(--saikazo-shadow-md);
}

.btn-saikazo--white:hover {
  transform: translateY(-2px);
  box-shadow: var(--saikazo-shadow-lg);
  color: var(--saikazo-primary-dark);
}

/* ================================================================
   13. カード共通スタイル（木古内スタイル）
   ================================================================ */

.card-saikazo {
  background: var(--saikazo-bg-white);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--saikazo-shadow-sm);
  border: 1px solid var(--saikazo-border-light);
  transition: all var(--saikazo-duration) var(--saikazo-ease);
}

.card-saikazo:hover {
  transform: translateY(-8px);
  box-shadow: var(--saikazo-shadow-lg);
  border-color: var(--saikazo-primary-100);
}

.card-saikazo-image {
  aspect-ratio: 16 / 10;
  overflow: hidden;
}

.card-saikazo-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--saikazo-duration-slow) var(--saikazo-ease);
}

.card-saikazo:hover .card-saikazo-image img {
  transform: scale(1.08);
}

.card-saikazo-body {
  padding: 1.5rem;
}

.card-saikazo-label {
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--saikazo-primary);
  margin-bottom: 0.5rem;
  display: block;
}

.card-saikazo-title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--saikazo-text);
  line-height: 1.4;
  margin-bottom: 0.5rem;
}

.card-saikazo-text {
  font-size: 0.875rem;
  color: var(--saikazo-text-light);
  line-height: 1.7;
}

/* ================================================================
   14. ヘッダートップバー（木古内スタイル追加）
   ================================================================ */

.header-top-bar-saikazo {
  background-color: var(--saikazo-primary);
  background: linear-gradient(90deg,
    var(--saikazo-primary-dark) 0%,
    var(--saikazo-primary) 50%,
    var(--saikazo-primary-light) 100%);
  padding: 0.5rem 0;
}

.header-top-inner {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 1rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.header-utility-nav {
  display: flex;
  gap: 1rem;
}

.header-utility-link {
  color: rgba(255, 255, 255, 0.9);
  font-size: 0.75rem;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  background: none;
  border: none;
  cursor: pointer;
  transition: color var(--saikazo-duration) var(--saikazo-ease);
}

.header-utility-link .material-symbols-outlined {
  font-size: 1rem;
}

.header-utility-link:hover {
  color: #fff;
}

.header-contact-info {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.header-tel-label {
  color: rgba(255, 255, 255, 0.8);
  font-size: 0.6875rem;
}

.header-tel-number {
  color: #fff;
  font-weight: 600;
  font-size: 0.875rem;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

.header-tel-number .material-symbols-outlined {
  font-size: 1rem;
}

.header-main-saikazo {
  background: var(--saikazo-bg-white);
  box-shadow: var(--saikazo-shadow-sm);
}

@media (max-width: 768px) {
  .header-top-bar-saikazo {
    display: none;
  }
}

/* ================================================================
   15. フッター追加スタイル（木古内スタイル）
   ================================================================ */

.footer-grid-saikazo {
  display: grid;
  grid-template-columns: 1.5fr 1fr 1fr 1fr;
  gap: 3rem;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 2rem;
}

@media (max-width: 1024px) {
  .footer-grid-saikazo {
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }
}

@media (max-width: 640px) {
  .footer-grid-saikazo {
    grid-template-columns: 1fr;
    text-align: center;
  }
}

.footer-column-saikazo {
  color: rgba(255, 255, 255, 0.8);
}

.footer-column-title-saikazo {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #fff;
  margin-bottom: 1rem;
  padding-bottom: 0.5rem;
  border-bottom: 2px solid var(--saikazo-accent);
  display: inline-block;
}

.footer-hours-saikazo {
  font-size: 0.8125rem;
  line-height: 1.8;
  margin-bottom: 1rem;
}

.footer-hours-saikazo strong {
  color: var(--saikazo-accent);
}

.btn-white-saikazo {
  background: transparent;
  color: #fff;
  border: 1px solid rgba(255, 255, 255, 0.3);
  padding: 0.5rem 1rem;
  font-size: 0.8125rem;
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  text-decoration: none;
  transition: all var(--saikazo-duration) var(--saikazo-ease);
}

.btn-white-saikazo:hover {
  background: rgba(255, 255, 255, 0.1);
  border-color: rgba(255, 255, 255, 0.5);
}

.copyright-saikazo {
  text-align: center;
  font-size: 0.75rem;
  color: rgba(255, 255, 255, 0.5);
  padding: 1.5rem 0;
  margin: 0;
}

/* ================================================================
   16. 診療時間・休診日セクション（木古内スタイル）
   ================================================================ */

.reception-info-section {
  padding: 2rem 0;
  background: var(--saikazo-bg-light);
}

.reception-info-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 1rem;
}

@media (max-width: 1024px) {
  .reception-info-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .reception-info-grid {
    grid-template-columns: 1fr;
  }
}

.reception-info-card {
  background: var(--saikazo-bg-white);
  padding: 1.5rem;
  border-radius: 12px;
  text-align: center;
  box-shadow: var(--saikazo-shadow-sm);
  border: 1px solid var(--saikazo-border-light);
  transition: all var(--saikazo-duration) var(--saikazo-ease);
  text-decoration: none;
  color: inherit;
  display: block;
}

.reception-info-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--saikazo-shadow-md);
  border-color: var(--saikazo-primary-100);
}

.reception-info-card h3 {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--saikazo-text-light);
  margin-bottom: 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
}

.reception-info-card h3 .material-symbols-outlined {
  font-size: 1.25rem;
  color: var(--saikazo-primary);
}

.reception-info-card .time-value {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--saikazo-primary);
  margin: 0.5rem 0;
}

.reception-info-card .time-note {
  font-size: 0.75rem;
  color: var(--saikazo-text-muted);
  margin: 0;
}

a.reception-info-card .time-value {
  color: var(--saikazo-accent);
}

/* ================================================================
   17. 診療科セクション（木古内スタイル）
   ================================================================ */

.departments-section-saikazo {
  padding: 4rem 0;
  background: var(--saikazo-bg-white);
}

.department-grid-saikazo {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 1rem;
}

@media (max-width: 1024px) {
  .department-grid-saikazo {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .department-grid-saikazo {
    grid-template-columns: 1fr;
  }
}

.department-card-saikazo {
  background: var(--saikazo-bg-white);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--saikazo-shadow-sm);
  border: 1px solid var(--saikazo-border-light);
  text-decoration: none;
  color: inherit;
  transition: all var(--saikazo-duration) var(--saikazo-ease);
}

.department-card-saikazo:hover {
  transform: translateY(-8px);
  box-shadow: var(--saikazo-shadow-lg);
  border-color: var(--saikazo-primary-100);
}

.department-card-image-saikazo {
  aspect-ratio: 16 / 10;
  overflow: hidden;
}

.department-card-image-saikazo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--saikazo-duration-slow) var(--saikazo-ease);
}

.department-card-saikazo:hover .department-card-image-saikazo img {
  transform: scale(1.08);
}

.department-card-content-saikazo {
  padding: 1.25rem;
}

.department-card-label-saikazo {
  font-family: var(--saikazo-font-en);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--saikazo-primary);
  margin-bottom: 0.25rem;
  display: block;
}

.department-card-content-saikazo h3 {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--saikazo-text);
  margin-bottom: 0.25rem;
}

.department-card-content-saikazo p {
  font-size: 0.8125rem;
  color: var(--saikazo-text-light);
  margin: 0;
}

/* ================================================================
   18. 当院の特徴セクション（木古内スタイル）
   ================================================================ */

.about-section-saikazo {
  padding: 4rem 0;
  background: linear-gradient(135deg, var(--saikazo-primary-50) 0%, var(--saikazo-bg-white) 100%);
}

.about-grid-saikazo {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 2rem;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 1rem;
}

@media (max-width: 768px) {
  .about-grid-saikazo {
    grid-template-columns: 1fr;
  }
}

.about-card-saikazo {
  background: var(--saikazo-bg-white);
  border-radius: 16px;
  padding: 2rem;
  text-align: center;
  box-shadow: var(--saikazo-shadow-sm);
  border: 1px solid var(--saikazo-border-light);
  transition: all var(--saikazo-duration) var(--saikazo-ease);
}

.about-card-saikazo:hover {
  transform: translateY(-8px);
  box-shadow: var(--saikazo-shadow-lg);
}

.about-card-icon-saikazo {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: linear-gradient(135deg, var(--saikazo-primary) 0%, var(--saikazo-primary-light) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 1.5rem;
}

.about-card-icon-saikazo .material-symbols-outlined {
  font-size: 2.5rem;
  color: #fff;
}

.about-card-saikazo h3 {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--saikazo-text);
  margin-bottom: 0.75rem;
}

.about-card-saikazo p {
  font-size: 0.9375rem;
  color: var(--saikazo-text-light);
  line-height: 1.8;
  margin: 0;
}

/* ================================================================
   19. 統計セクション（木古内スタイル）
   ================================================================ */

.stats-section-saikazo {
  padding: 0;
}

.stats-background-saikazo {
  background: linear-gradient(135deg, var(--saikazo-primary-dark) 0%, var(--saikazo-primary) 50%, var(--saikazo-primary-light) 100%);
  padding: 4rem 0;
}

.stats-inner-saikazo {
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 1rem;
}

.stats-header-saikazo {
  text-align: center;
  margin-bottom: 3rem;
}

.stats-title-saikazo {
  font-size: 2rem;
  font-weight: 700;
  color: #fff;
  margin: 0;
}

.stats-grid-saikazo {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 2rem;
}

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

.stats-item-saikazo {
  text-align: center;
  color: #fff;
}

.stats-number-saikazo {
  font-family: var(--saikazo-font-en);
  font-size: 3.5rem;
  font-weight: 700;
  line-height: 1;
  display: block;
  margin-bottom: 0.25rem;
}

.stats-unit-saikazo {
  font-size: 1rem;
  font-weight: 500;
  opacity: 0.9;
  display: block;
  margin-bottom: 0.5rem;
}

.stats-label-saikazo {
  font-size: 0.875rem;
  opacity: 0.8;
  display: block;
}

/* ================================================================
   20. スタッフセクション（木古内スタイル）
   ================================================================ */

.staff-section-saikazo {
  padding: 4rem 0;
  background: var(--saikazo-bg-white);
}

.staff-grid-saikazo {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 1rem;
}

@media (max-width: 1024px) {
  .staff-grid-saikazo {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .staff-grid-saikazo {
    grid-template-columns: 1fr;
  }
}

.staff-card-saikazo {
  background: var(--saikazo-bg-white);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--saikazo-shadow-sm);
  border: 1px solid var(--saikazo-border-light);
  text-decoration: none;
  color: inherit;
  transition: all var(--saikazo-duration) var(--saikazo-ease);
}

.staff-card-saikazo:hover {
  transform: translateY(-8px);
  box-shadow: var(--saikazo-shadow-lg);
}

.staff-card-image-saikazo {
  width: 100%;
  aspect-ratio: 1;
  object-fit: cover;
}

.staff-card-content-saikazo {
  padding: 1.25rem;
  text-align: center;
}

.staff-card-role-saikazo {
  font-family: var(--saikazo-font-en);
  font-size: 0.6875rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  color: var(--saikazo-primary);
  margin-bottom: 0.25rem;
  display: block;
}

.staff-card-content-saikazo h3 {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--saikazo-text);
  margin-bottom: 0.25rem;
}

.staff-card-content-saikazo p {
  font-size: 0.875rem;
  color: var(--saikazo-text-light);
  margin: 0;
}

/* ================================================================
   21. 施設ギャラリー（木古内スタイル）
   ================================================================ */

.facility-section-saikazo {
  padding: 4rem 0;
  background: var(--saikazo-bg);
}

.facility-gallery-saikazo {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 1rem;
}

@media (max-width: 768px) {
  .facility-gallery-saikazo {
    grid-template-columns: 1fr;
  }
}

.facility-item-saikazo {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  aspect-ratio: 16 / 10;
}

.facility-item-saikazo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--saikazo-duration-slow) var(--saikazo-ease);
}

.facility-item-saikazo:hover img {
  transform: scale(1.08);
}

.facility-item-label-saikazo {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 1rem;
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.7));
  color: #fff;
  font-size: 0.9375rem;
  font-weight: 600;
}

/* ================================================================
   22. ダウンロードセクション（木古内スタイル）
   ================================================================ */

.download-section-saikazo {
  padding: 4rem 0;
  background: var(--saikazo-bg-white);
}

.download-grid-saikazo {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 1rem;
}

@media (max-width: 1024px) {
  .download-grid-saikazo {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 640px) {
  .download-grid-saikazo {
    grid-template-columns: 1fr;
  }
}

.download-item-saikazo {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 1.25rem;
  background: var(--saikazo-bg);
  border-radius: 12px;
  text-decoration: none;
  color: var(--saikazo-text);
  transition: all var(--saikazo-duration) var(--saikazo-ease);
  border: 1px solid var(--saikazo-border-light);
}

.download-item-saikazo:hover {
  background: var(--saikazo-primary-50);
  border-color: var(--saikazo-primary-100);
  transform: translateY(-2px);
}

.download-item-saikazo .material-symbols-outlined {
  font-size: 1.5rem;
  color: var(--saikazo-primary);
}

.download-item-text-saikazo {
  font-size: 0.9375rem;
  font-weight: 500;
}

/* ================================================================
   23. アクセスセクション（木古内スタイル）
   ================================================================ */

.access-section-saikazo {
  padding: 4rem 0;
  background: var(--saikazo-bg);
}

.access-grid-saikazo {
  display: grid;
  grid-template-columns: 1.5fr 1fr;
  gap: 2rem;
  max-width: 1440px;
  margin: 0 auto;
  padding: 0 1rem;
}

@media (max-width: 768px) {
  .access-grid-saikazo {
    grid-template-columns: 1fr;
  }
}

.access-map-container-saikazo {
  border-radius: 16px;
  overflow: hidden;
  box-shadow: var(--saikazo-shadow-md);
}

.access-map-container-saikazo iframe {
  width: 100%;
  height: 100%;
  min-height: 350px;
  border: 0;
}

.access-info-card-saikazo {
  background: var(--saikazo-bg-white);
  border-radius: 16px;
  padding: 2rem;
  box-shadow: var(--saikazo-shadow-sm);
}

.access-info-card-saikazo dl {
  margin: 0 0 1.5rem;
}

.access-info-card-saikazo dt {
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--saikazo-primary);
  margin-bottom: 0.25rem;
}

.access-info-card-saikazo dd {
  font-size: 0.9375rem;
  color: var(--saikazo-text);
  margin: 0 0 1rem;
  line-height: 1.6;
}

.access-info-card-saikazo dd a {
  color: var(--saikazo-primary);
  text-decoration: none;
  font-weight: 600;
}

.access-buttons-saikazo {
  display: flex;
  gap: 0.75rem;
  flex-wrap: wrap;
}

/* ================================================================
   24. グローバル レスポンシブ補完（木古内スタイル）
   ================================================================ */

/* ----------------------------------------------------------------
   サイドバー 木古内スタイル適用
   ---------------------------------------------------------------- */
.sidebar {
  background: linear-gradient(180deg,
    var(--saikazo-bg-white) 0%,
    var(--saikazo-gray-50) 100%);
  border-right: 1px solid var(--saikazo-border-light);
}

.sidebar-inner {
  border-right: 3px solid var(--saikazo-primary);
}

/* メガメニュートリガー - 木古内スタイル */
.mega-menu-trigger {
  font-family: var(--saikazo-font-jp);
  border-left: 3px solid transparent;
  transition: all var(--saikazo-duration) var(--saikazo-ease);
}

.mega-menu-trigger:hover,
.mega-menu-item.is-active .mega-menu-trigger {
  background: linear-gradient(90deg,
    var(--saikazo-primary-50) 0%,
    transparent 100%);
  border-left-color: var(--saikazo-primary);
  color: var(--saikazo-primary);
}

.mega-menu-trigger .material-symbols-outlined {
  color: var(--saikazo-primary);
  transition: transform var(--saikazo-duration) var(--saikazo-ease);
}

.mega-menu-trigger:hover .material-symbols-outlined {
  transform: scale(1.1);
}

/* メガパネル - 木古内スタイル */
.mega-panel {
  background: var(--saikazo-bg-white);
  box-shadow: 0 4px 30px rgba(0, 131, 143, 0.12);
  border-left: 3px solid var(--saikazo-primary);
}

.mega-panel-title {
  color: var(--saikazo-primary);
  font-weight: 700;
  border-bottom: 2px solid var(--saikazo-primary);
  position: relative;
  padding-left: 0.75rem;
}

.mega-panel-title::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 4px;
  height: 70%;
  background: var(--saikazo-accent);
  border-radius: 2px;
}

.mega-panel-link {
  transition: all var(--saikazo-duration) var(--saikazo-ease);
  border-radius: 8px;
}

.mega-panel-link:hover {
  background: var(--saikazo-primary-50);
  color: var(--saikazo-primary);
  padding-left: 1.25rem;
}

.mega-panel-link::before {
  background-color: var(--saikazo-primary-200);
  transition: all var(--saikazo-duration) var(--saikazo-ease);
}

.mega-panel-link:hover::before {
  background-color: var(--saikazo-accent);
  width: 6px;
  height: 6px;
}

/* サイドバー リンク - 木古内スタイル */
.sidebar-nav-link {
  font-family: var(--saikazo-font-jp);
  transition: all var(--saikazo-duration) var(--saikazo-ease);
}

.sidebar-nav-link:hover {
  background: linear-gradient(90deg,
    var(--saikazo-primary-50) 0%,
    transparent 100%);
  border-left-color: var(--saikazo-primary);
  color: var(--saikazo-primary);
}

.sidebar-nav-link .material-symbols-outlined {
  color: var(--saikazo-primary);
}

/* サイドバー セクションタイトル */
.sidebar-section-title {
  color: var(--saikazo-primary);
  font-weight: 700;
  letter-spacing: 0.15em;
  text-transform: uppercase;
}

/* サイドバー SNSリンク - 木古内スタイル */
.sidebar-sns-link {
  background: var(--saikazo-gray-100);
  color: var(--saikazo-text-light);
  transition: all var(--saikazo-duration) var(--saikazo-ease);
}

.sidebar-sns-link:hover {
  background: var(--saikazo-primary);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 131, 143, 0.3);
}

/* サイドバー 緊急リンク */
.sidebar-emergency {
  color: var(--saikazo-accent);
}

.sidebar-emergency .material-symbols-outlined {
  color: var(--saikazo-accent);
}

.sidebar-emergency:hover {
  background: linear-gradient(90deg,
    rgba(255, 111, 0, 0.1) 0%,
    transparent 100%);
  border-left-color: var(--saikazo-accent);
}

/* サイドバー ボーダー */
.sidebar-quick-links,
.sidebar-sns,
.sidebar-nav-list {
  border-color: var(--saikazo-border-light);
}

/* ヒーロー モバイル対応 */
@media (max-width: 768px) {
  .hero-slide-content {
    left: 5%;
    right: 5%;
    max-width: none;
    padding: 0 1rem;
    text-align: center;
  }

  .hero-main-title {
    font-size: clamp(1.5rem, 5vw, 2rem);
  }

  .hero-subtitle {
    font-size: 0.875rem;
    line-height: 1.7;
  }

  .hero-en-title {
    font-size: 0.75rem;
    letter-spacing: 0.2em;
  }

  .hero-scroll-indicator {
    bottom: 20px;
    font-size: 0.625rem;
  }

  .hero-swiper .swiper-button-next,
  .hero-swiper .swiper-button-prev {
    width: 40px;
    height: 40px;
  }

  .hero-swiper .swiper-button-next::after,
  .hero-swiper .swiper-button-prev::after {
    font-size: 0.875rem;
  }
}

/* ヘッダー モバイル対応 */
@media (max-width: 1024px) {
  .site-header .header-top-bar-saikazo {
    padding: 0.35rem 0;
  }

  .site-header .header-top-bar-saikazo .header-top-link {
    font-size: 0.75rem;
  }

  .site-header .header-tel-number {
    font-size: 1.25rem;
  }

  .site-header .header-access-btn {
    padding: 0.5rem 1rem;
    font-size: 0.75rem;
  }
}

@media (max-width: 768px) {
  .site-header .header-top-bar-saikazo {
    display: none;
  }

  .site-header .header-main {
    padding: 0.5rem 0;
  }

  .site-header .header-tel-area {
    display: none;
  }

  .site-header .header-access-btn {
    padding: 0.5rem 0.75rem;
    font-size: 0.6875rem;
    gap: 0.25rem;
  }

  .site-header .header-access-btn .material-symbols-outlined {
    font-size: 1rem;
  }
}

/* セクションタイトル モバイル対応 */
@media (max-width: 640px) {
  .section-title-saikazo {
    margin-bottom: 2rem;
  }

  .section-en-title-saikazo {
    font-size: 0.625rem;
    letter-spacing: 0.15em;
  }

  .section-title-saikazo h2 {
    font-size: 1.5rem;
  }
}

/* スタッフセクション モバイル対応 */
@media (max-width: 640px) {
  .staff-grid-saikazo {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.75rem;
  }

  .staff-card-saikazo {
    padding: 1rem;
  }

  .staff-card-saikazo .staff-name {
    font-size: 0.875rem;
  }

  .staff-card-saikazo .staff-position {
    font-size: 0.6875rem;
  }
}

/* 施設セクション モバイル対応 */
@media (max-width: 640px) {
  .facility-gallery-saikazo {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.5rem;
  }

  .facility-item-saikazo {
    border-radius: 8px;
  }

  .facility-item-saikazo figcaption {
    font-size: 0.75rem;
    padding: 0.75rem;
  }
}

/* フッター モバイル対応 */
@media (max-width: 1024px) {
  .footer-grid-saikazo {
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
  }
}

@media (max-width: 640px) {
  .footer-grid-saikazo {
    grid-template-columns: 1fr;
    gap: 2rem;
    text-align: center;
  }

  .footer-col-saikazo h3 {
    justify-content: center;
  }

  .footer-col-saikazo ul {
    align-items: center;
  }

  .footer-hospital-name-saikazo {
    font-size: 1rem;
  }

  .footer-tel-saikazo {
    font-size: 1.25rem;
  }

  .footer-social-saikazo {
    justify-content: center;
  }

  .footer-bottom-saikazo {
    flex-direction: column;
    gap: 1rem;
    text-align: center;
  }

  .footer-links-saikazo {
    justify-content: center;
  }
}

/* アクセスボタン モバイル対応 */
@media (max-width: 640px) {
  .access-buttons-saikazo {
    flex-direction: column;
  }

  .access-buttons-saikazo .btn-saikazo {
    width: 100%;
    justify-content: center;
  }
}

/* 統計セクション モバイル対応 */
@media (max-width: 768px) {
  .stats-section-saikazo {
    padding: 3rem 0;
  }

  .stats-grid-saikazo {
    grid-template-columns: repeat(2, 1fr);
  }

  .stats-number-saikazo {
    font-size: 2rem;
  }

  .stats-unit-saikazo {
    font-size: 0.75rem;
  }

  .stats-label-saikazo {
    font-size: 0.75rem;
  }
}

@media (max-width: 480px) {
  .stats-grid-saikazo {
    grid-template-columns: 1fr;
    gap: 1.5rem;
  }
}

/* ================================================================
   モバイル専用ボトムアクションバー（木古内スタイル）
   ================================================================ */
.bottom-action-bar {
  display: none; /* PC時は非表示 */
}

@media (max-width: 768px) {
  .bottom-action-bar {
    display: flex;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    height: 64px;
    background: var(--sz-primary, #114FA1);
    box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.15);
    z-index: 999;
  }

  .bottom-action-bar__btn {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    color: #fff;
    text-decoration: none;
    font-size: 0.6875rem;
    font-weight: 500;
    transition: background 0.2s ease;
    border-right: 1px solid rgba(255, 255, 255, 0.15);
  }

  .bottom-action-bar__btn:last-child {
    border-right: none;
  }

  .bottom-action-bar__btn:active {
    background: rgba(255, 255, 255, 0.1);
  }

  .bottom-action-bar__btn .material-symbols-outlined {
    font-size: 1.5rem;
  }

  .bottom-action-bar__label {
    letter-spacing: 0.02em;
  }

  /* 電話ボタン強調 */
  .bottom-action-bar__btn--tel {
    background: #22c55e;
    border-right-color: rgba(255, 255, 255, 0.2);
  }

  .bottom-action-bar__btn--tel:active {
    background: #16a34a;
  }

  /* ボトムバー分のbody余白 */
  body {
    padding-bottom: 64px;
  }

  /* フッターの余白調整 */
  .footer-saikazo,
  .sz-footer {
    padding-bottom: 80px;
  }
}

/* ================================================================
   END OF SAIKAZO STYLE
   ================================================================ */

/* === object/project/_saikazo-home.css === */

/* ================================================================
   saikazo-home.css

   木古内町国民健康保険病院ホームページスタイル
   濃い青（#114FA1）ベース
   ================================================================ */

/* visually-hidden 強化（スライド切替時の表示防止） */
.hero .visually-hidden,
h1.visually-hidden {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0;
  opacity: 0;
  pointer-events: none !important;
}

/* ================================================================
   ヒーローセクション
   ================================================================ */
.hero {
  position: relative;
  width: 100%;
  height: 100vh;
  min-height: 600px;
  max-height: 900px;
  overflow: hidden;
  margin-top: -90px; /* ヘッダー1行分を相殺してフルスクリーン */
  padding-top: 90px; /* コンテンツをヘッダー下に配置 */
}

/* Mobile base */
.hero {
  margin-top: -60px;
  padding-top: 60px;
  min-height: 500px;
}

@media (min-width: 1024px) {
  .hero {
    margin-top: -90px;
    padding-top: 90px;
    min-height: 600px;
  }
}

.hero-swiper {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.hero-swiper .swiper-wrapper {
  height: 100%;
}

.hero-swiper .swiper-slide {
  height: 100%;
}

.hero__slide {
  position: relative;
  width: 100%;
  height: 100%;
}

.hero__bg {
  position: absolute;
  inset: 0;
  z-index: 1;
}

.hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

/* 濃い青オーバーレイ */
.hero__overlay {
  position: absolute;
  inset: 0;
  z-index: 2;
  background: linear-gradient(
    to right,
    rgba(17, 79, 161, 0.88) 0%,
    rgba(17, 79, 161, 0.6) 40%,
    rgba(17, 79, 161, 0.3) 100%
  );
}

.hero__content {
  position: absolute;
  left: 8%;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  max-width: 600px;
}

.hero__txt-main {
  display: block;
  max-width: 500px;
  margin-bottom: 20px;
  filter: drop-shadow(0 4px 20px rgba(0, 0, 0, 0.3));
}

.hero__txt-main-text {
  font-size: clamp(2.5rem, 5vw, 4rem);
  font-weight: 700;
  color: var(--color-white);
  text-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
  margin-bottom: 20px;
}

.hero__txt-sub {
  color: var(--color-white);
  font-size: 1rem;
  line-height: 2;
  letter-spacing: 0.1em;
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

.hero__hospital-name {
  position: absolute;
  right: 8%;
  bottom: 30%;
  z-index: 10;
  pointer-events: none;
}

.hero__name-en {
  display: block;
  max-width: 280px;
  filter: drop-shadow(0 4px 20px rgba(0, 0, 0, 0.3));
  /* テキスト用スタイル */
  font-family: "Inter", "Noto Sans JP", sans-serif;
  font-size: clamp(1.5rem, 3vw, 2.5rem);
  font-weight: 600;
  color: var(--color-white);
  text-shadow: 0 4px 20px rgba(0, 0, 0, 0.3);
  letter-spacing: 0.2em;
  writing-mode: horizontal-tb;
}

/* スクロールインジケーター */
.hero__scroll {
  position: absolute;
  bottom: 40px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  display: flex;
  flex-direction: column;
  align-items: center;
  color: var(--color-white);
}

.hero__scroll-txt {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.75rem;
  letter-spacing: 0.2em;
  margin-bottom: 10px;
}

.hero__scroll-line {
  width: 1px;
  height: 50px;
  background: linear-gradient(to bottom, var(--color-white) 50%, transparent);
  animation: scrollLine 2s ease-in-out infinite;
}

@keyframes scrollLine {
  0% { transform: scaleY(0); transform-origin: top; }
  50% { transform: scaleY(1); transform-origin: top; }
  51% { transform-origin: bottom; }
  100% { transform: scaleY(0); transform-origin: bottom; }
}

/* 採用バナー */
.hero__recruit-banner {
  position: absolute;
  right: 0;
  bottom: 20%;
  z-index: 20;
  background: #bf360c;
  color: var(--color-white);
  padding: 20px 30px;
  text-decoration: none;
  border-radius: 50px 0 0 50px;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 4px;
  box-shadow: -4px 4px 20px rgba(0, 0, 0, 0.2);
  transition: all 0.3s ease;
}

.hero__recruit-banner:hover {
  padding-right: 40px;
  background: #d84315;
}

.hero__recruit-en {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.6875rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  font-weight: 600;
}

.hero__recruit-jp {
  font-size: 0.875rem;
  font-weight: 700;
}

.hero__recruit-banner .material-symbols-outlined {
  position: absolute;
  right: 15px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 1.25rem;
}

/* ヒーローレスポンシブ対応 - Mobile First */

/* Mobile base */
.hero__content {
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  max-width: 90%;
  text-align: center;
}

.hero__txt-main-text {
  font-size: clamp(1.8rem, 6vw, 2.5rem);
  margin-bottom: 16px;
}

.hero__txt-sub {
  font-size: 0.9rem;
  line-height: 1.8;
}

.hero__hospital-name {
  position: absolute;
  right: auto;
  left: 50%;
  transform: translateX(-50%);
  bottom: 15%;
  text-align: center;
}

.hero__name-en {
  font-size: 1rem;
  max-width: none;
  letter-spacing: 0.15em;
}

.hero__recruit-banner {
  padding: 12px 20px;
  bottom: 15%;
}

.hero__recruit-en {
  font-size: 0.625rem;
}

.hero__recruit-jp {
  font-size: 0.75rem;
}

.hero__scroll {
  bottom: 20px;
}

/* Tablet (768px+) */
@media (min-width: 768px) {
  .hero__content {
    left: 5%;
    top: auto;
    transform: none;
    max-width: 50%;
    text-align: left;
  }

  .hero__txt-main-text {
    font-size: clamp(2rem, 3.5vw, 3rem);
    margin-bottom: 20px;
  }

  .hero__txt-sub {
    font-size: 1rem;
    line-height: 2;
  }

  .hero__hospital-name {
    right: 5%;
    left: auto;
    transform: none;
    bottom: 25%;
    text-align: right;
  }

  .hero__name-en {
    font-size: clamp(1.2rem, 2.5vw, 2rem);
    max-width: 220px;
  }

  .hero__recruit-banner {
    padding: 16px 24px;
    bottom: 20%;
  }

  .hero__recruit-en {
    font-size: 0.75rem;
  }

  .hero__recruit-jp {
    font-size: 0.875rem;
  }

  .hero__scroll {
    bottom: 30px;
  }
}

/* ================================================================
   重要なお知らせ
   ================================================================ */

/* ================================================================
   木古内スタイル ヒーローセクション（加須病院風 角丸）
   ================================================================ */
.sz-hero {
  position: relative;
  width: 100%;
  padding: calc(var(--header-height, 106px) + 12px) 20px 0;
  margin-top: 0;
  background: transparent;
  overflow: visible;
}

/* お知らせバー（ヒーロー下部 横長帯） */
.sz-hero__notice {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 20px;
  margin-block-start: 12px;
  background: rgba(255, 255, 255, 0.95);
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
  text-decoration: none;
  color: var(--sz-text, #222);
  transition: box-shadow 0.2s ease, transform 0.2s ease;
  writing-mode: horizontal-tb;
}

.sz-hero__notice:hover {
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.14);
  transform: translateY(-1px);
}

.sz-hero__notice-icon {
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #fef3c7;
  border-radius: 50%;
  flex-shrink: 0;
}

.sz-hero__notice-icon .material-symbols-outlined {
  font-size: 1.375rem;
  color: #f97316;
}

.sz-hero__notice-content {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
  writing-mode: horizontal-tb;
}

.sz-hero__notice-label {
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.08em;
  color: #fff;
  background: #dc2626;
  padding: 3px 10px;
  border-radius: 4px;
  white-space: nowrap;
  flex-shrink: 0;
}

.sz-hero__notice-text {
  font-size: 0.8125rem;
  font-weight: 600;
  line-height: 1.5;
  color: var(--sz-text, #222);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex: 1;
  min-width: 0;
}

.sz-hero__notice-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  writing-mode: horizontal-tb;
}

.sz-hero__notice-arrow .material-symbols-outlined {
  font-size: 1.125rem;
  color: var(--sz-primary, #114FA1);
  transform: none;
}

/* メイン画像エリア - 角丸コンテナ */
.sz-hero__main {
  position: relative;
  width: 100%;
  height: calc(67vh - var(--header-height, 106px) - 12px);
  min-height: 340px;
  max-height: 540px;
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
}

.sz-hero-swiper {
  width: 100%;
  height: 100%;
}

.sz-hero-swiper .swiper-wrapper {
  height: 100%;
}

.sz-hero-swiper .swiper-slide {
  height: 100%;
}

.sz-hero__slide {
  width: 100%;
  height: 100%;
}

.sz-hero__slide picture {
  display: block;
  width: 100%;
  height: 100%;
}

.sz-hero__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center 30%;
  /* 画像をシャープに表示 */
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
  /* ぼやけ防止 */
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  transform: translateZ(0);
}

/* テキストオーバーレイ（中央やや左・縦書き） */
.sz-hero__content {
  position: absolute;
  left: 80px;
  top: 60px;
  right: auto;
  bottom: auto;
  transform: none;
  z-index: 10;
  padding: 0;
  background: transparent;
  max-width: none;
}

.sz-hero__txt {
  display: flex;
  flex-direction: row-reverse;
  gap: 12px;
  align-items: flex-start;
}

.sz-hero__txt-main {
  display: flex;
  flex-direction: row-reverse;
  gap: 12px;
  margin-bottom: 0;
}

.sz-hero__txt-main img {
  max-width: 760px;
  height: auto;
  filter: none;
}

/* テキストスタイル - 縦書き（白文字） */
.sz-hero__txt-main-text {
  display: block;
  writing-mode: vertical-rl;
  font-size: clamp(1.4rem, 2vw, 1.8rem);
  font-weight: 700;
  color: #fff;
  line-height: 1.8;
  margin: 0;
  text-shadow: 0 2px 12px rgba(0, 0, 0, 0.4);
  letter-spacing: 0.1em;
}

.sz-hero__txt-sub {
  position: absolute;
  right: 0;
  bottom: -50px;
  writing-mode: horizontal-tb;
}

.sz-hero__txt-sub img {
  max-width: 360px;
  height: auto;
  filter: none;
}

.sz-hero__txt-sub-text {
  display: block;
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.6875rem;
  font-weight: 500;
  color: #fff;
  letter-spacing: 0.2em;
  margin-top: 0;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  opacity: 0.8;
}

/* スライドカウンター（左下） */
.sz-hero__counter {
  position: absolute;
  left: 30px;
  bottom: 30px;
  z-index: 15;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  font-family: 'Inter', sans-serif;
}

.sz-hero__counter-current {
  font-size: 1rem;
  font-weight: 700;
  color: #e8713a;
  line-height: 1;
}

.sz-hero__counter-progress {
  width: 40px;
  height: 2px;
  background: rgba(255,255,255,0.4);
  border-radius: 2px;
  overflow: hidden;
  position: relative;
}

.sz-hero__counter-bar {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  width: 20%;
  background: #e8713a;
  border-radius: 2px;
  transition: width 0.3s ease;
}

.sz-hero__counter-total {
  font-size: 0.875rem;
  font-weight: 600;
  color: rgba(255,255,255,0.7);
  line-height: 1;
}

/* スクロールインジケーター（非表示） */
.sz-hero__scroll {
  display: none;
}

.sz-hero__scroll-txt {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.6875rem;
  letter-spacing: 0.2em;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}

.sz-hero__scroll-line {
  width: 50px;
  height: 1px;
  background: linear-gradient(to right, #fff 50%, transparent);
  animation: scrollLineHorizontal 2s ease-in-out infinite;
}

@keyframes scrollLineHorizontal {
  0%, 100% { transform: translateX(0); opacity: 1; }
  50% { transform: translateX(10px); opacity: 0.5; }
}

/* ================================================================
   ヒーロー内ミニお知らせパネル（左下 - 重要情報バッジ付き）
   ================================================================ */
.sz-hero__news-panel {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: 25;
  display: flex;
  align-items: stretch;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 4px -4px 20px rgba(0, 0, 0, 0.1);
  width: 480px;
  border-radius: 0 16px 0 0;
  overflow: hidden;
}

.sz-hero__news-panel-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 16px;
  background: #dc2626;
  color: #fff;
  font-size: 0.8rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  white-space: nowrap;
  min-width: 80px;
  flex-shrink: 0;
}

.sz-hero__news-panel-inner {
  flex: 1;
  position: relative;
  height: 70px; /* 1件分の高さ */
  overflow: hidden;
}

.sz-hero__news-panel-item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 20px;
  text-decoration: none;
  color: var(--sz-text, #222);
  transition: all 0.2s ease;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  height: 100%;
  opacity: 0;
  transform: translateY(100%);
}

/* 最初のアイテムはデフォルトで表示（JSがまだロードされていない場合のみ） */
.sz-hero__news-panel-inner:not(.js-initialized) .sz-hero__news-panel-item:first-child {
  opacity: 1;
  transform: translateY(0);
}

.sz-hero__news-panel-item.is-active {
  opacity: 1;
  transform: translateY(0);
  transition: opacity 0.5s ease, transform 0.5s ease;
}

.sz-hero__news-panel-item.is-exiting {
  opacity: 0;
  transform: translateY(-100%);
  transition: opacity 0.5s ease, transform 0.5s ease;
}

.sz-hero__news-panel-item:hover {
  background: rgba(17, 79, 161, 0.05);
}

.sz-hero__news-panel-date {
  display: flex;
  align-items: center;
  min-width: auto;
  padding-right: 12px;
  border-right: 2px solid var(--sz-primary, #114FA1);
  flex-shrink: 0;
}

.sz-hero__news-panel-year {
  display: none;
}

.sz-hero__news-panel-day {
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--sz-text, #222);
  line-height: 1;
  white-space: nowrap;
}

.sz-hero__news-panel-title {
  flex: 1;
  font-size: 0.9rem;
  line-height: 1.5;
  color: var(--sz-text, #222);
}

.sz-hero__news-panel-arrow {
  font-size: 1.25rem;
  color: var(--sz-primary, #114FA1);
  opacity: 0;
  transition: opacity 0.2s ease;
}

.sz-hero__news-panel-item:hover .sz-hero__news-panel-arrow {
  opacity: 1;
}

.sz-hero__news-panel-nav {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #f8f8f8;
  border-left: 1px solid rgba(0, 0, 0, 0.08);
  min-height: 70px;
}

.sz-hero__news-panel-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 35px;
  background: transparent;
  border: none;
  cursor: pointer;
  color: #666;
  transition: all 0.2s ease;
}

.sz-hero__news-panel-btn:hover {
  color: var(--sz-primary, #114FA1);
  background: rgba(17, 79, 161, 0.1);
}

/* 採用バナー（右サイドから飛び出す半円型） */
.sz-hero__recruit {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  bottom: auto;
  z-index: 30;
  width: 120px;
  height: 120px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding-inline-end: 10px;
  background: #fff;
  background-size: cover;
  background-position: center;
  color: #1a365d;
  text-decoration: none;
  border-radius: 50% 0 0 50%;
  box-shadow: -4px 4px 20px rgba(0, 0, 0, 0.15);
  transition: all 0.3s ease;
  overflow: hidden;
  flex-shrink: 0;
}

.sz-hero__recruit--with-image {
  background-color: transparent;
}

.sz-hero__recruit--with-image .sz-hero__recruit-label,
.sz-hero__recruit--with-image .sz-hero__recruit-title {
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.5);
  color: #fff;
}

.sz-hero__recruit:hover {
  transform: translateY(-50%) translateX(-8px);
  box-shadow: -6px 6px 28px rgba(0, 0, 0, 0.2);
}

.sz-hero__recruit-label {
  font-size: 0.6875rem;
  font-weight: 600;
  color: #666;
  letter-spacing: 0.1em;
  margin-bottom: 6px;
}

.sz-hero__recruit-title {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.875rem;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  color: #1a365d;
  letter-spacing: 0.05em;
}

/* 矢印は非表示 */
.sz-hero__recruit-arrow {
  display: none;
}

/* ================================================================
   sz-hero レスポンシブ（浅香山スタイル: Mobile First min-width）
   ================================================================ */

/* --- Mobile Base (< 480px) --- */
.sz-hero {
  padding: calc(64px + 6px) clamp(0.5rem, 2vw, 1rem) 0;
  margin-top: 0;
}

.sz-hero__main {
  height: calc(44dvh - 64px);
  height: calc(44vh - 64px);
  min-height: 200px;
  max-height: 300px;
  border-radius: clamp(0.75rem, 2vw, 1.25rem);
}

.sz-hero-swiper,
.sz-hero-swiper .swiper-wrapper,
.sz-hero-swiper .swiper-slide,
.sz-hero__slide {
  height: 100%;
}

.sz-hero__slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sz-hero__content {
  left: clamp(1rem, 4vw, 1.5rem);
  top: clamp(1rem, 4vw, 1.5rem);
  right: auto;
  bottom: auto;
  transform: none;
  padding: 0;
  max-width: none;
  width: auto;
}

.sz-hero__txt-main-text {
  font-size: clamp(1rem, 3vw, 1.1rem);
  line-height: 1.6;
}

.sz-hero__txt-sub-text {
  font-size: clamp(0.5625rem, 1.5vw, 0.625rem);
}

.sz-hero__notice {
  gap: 8px;
  padding: 10px 14px;
  margin-block-start: 8px;
  border-radius: 10px;
}

.sz-hero__recruit {
  right: 0;
  bottom: auto;
  top: 50%;
  transform: translateY(-50%);
  width: clamp(5rem, 15vw, 5.625rem);
  height: clamp(5rem, 15vw, 5.625rem);
}

.sz-hero__recruit-label {
  font-size: clamp(0.5rem, 1.2vw, 0.5625rem);
  margin-bottom: 2px;
}

.sz-hero__recruit-title {
  font-size: clamp(0.625rem, 1.5vw, 0.6875rem);
}

.sz-hero__scroll {
  display: none;
}

.sz-hero__news-panel {
  display: none;
}

/* --- Wearable (≤279px) --- */
@media (max-width: 279px) {
  .sz-hero {
    padding: calc(48px + 4px) 6px 0;
  }

  .sz-hero__main {
    min-height: 140px;
    max-height: 180px;
    border-radius: 8px;
  }

  .sz-hero__content {
    left: 8px;
    top: 8px;
  }

  .sz-hero__txt-main-text {
    font-size: 0.75rem;
    line-height: 1.4;
    gap: 4px;
  }

  .sz-hero__notice {
    gap: 4px;
    padding: 6px 8px;
    margin-block-start: 6px;
    border-radius: 6px;
  }

  .sz-hero__notice-icon {
    width: 28px;
    height: 28px;
  }

  .sz-hero__notice-icon .material-symbols-outlined {
    font-size: 1rem;
  }

  .sz-hero__notice-label {
    font-size: 0.5625rem;
    padding: 2px 6px;
  }

  .sz-hero__notice-text {
    font-size: 0.625rem;
  }

  .sz-hero__notice-arrow .material-symbols-outlined {
    font-size: 0.875rem;
  }

  .sz-hero__recruit {
    width: 3.5rem;
    height: 3.5rem;
    right: 0;
    top: 50%;
    transform: translateY(-50%);
  }

  .sz-hero__recruit-label {
    font-size: 0.4375rem;
  }

  .sz-hero__recruit-title {
    font-size: 0.5rem;
  }
}

/* --- Small Mobile (480px+) --- */
@media (min-width: 480px) {
  .sz-hero {
    padding: calc(64px + 0.5rem) clamp(0.75rem, 2vw, 1rem) 0;
  }

  .sz-hero__main {
    height: calc(50dvh - 64px);
    height: calc(50vh - 64px);
    min-height: 240px;
    max-height: 370px;
    border-radius: clamp(0.875rem, 2vw, 1rem);
  }

  .sz-hero__news-panel {
    display: flex;
    position: static;
    width: 100%;
    border-radius: 0 0 var(--asa-radius-card, 1rem) var(--asa-radius-card, 1rem);
    margin-block-start: -1px;
  }

  .sz-hero__recruit {
    width: clamp(5rem, 14vw, 5.625rem);
    height: clamp(5rem, 14vw, 5.625rem);
    right: 0;
  }
}

/* --- Tablet (768px+) --- */
@media (min-width: 768px) {
  .sz-hero {
    padding: calc(64px + 0.5rem) clamp(0.75rem, 2vw, 1rem) 0;
  }

  .sz-hero__main {
    height: calc(50dvh - 64px);
    height: calc(50vh - 64px);
    min-height: 280px;
    max-height: 470px;
  }

  .sz-hero__content {
    left: clamp(1.5rem, 4vw, 1.875rem);
    top: clamp(1.5rem, 4vw, 1.875rem);
  }

  .sz-hero__txt-main-text {
    font-size: clamp(1.1rem, 2vw, 1.4rem);
  }

  .sz-hero__txt-sub-text {
    font-size: clamp(0.625rem, 1vw, 0.6875rem);
  }

  .sz-hero__news-panel {
    position: absolute;
    inset-inline-start: 0;
    inset-block-end: 0;
    width: 480px;
    border-radius: 0 1rem 0 0;
    margin-block-start: 0;
  }

  .sz-hero__recruit {
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: clamp(6.5rem, 12vw, 7.5rem);
    height: clamp(6.5rem, 12vw, 7.5rem);
  }

  .sz-hero__recruit-label {
    font-size: clamp(0.5625rem, 1vw, 0.6875rem);
    margin-bottom: 4px;
  }

  .sz-hero__recruit-title {
    font-size: clamp(0.6875rem, 1.2vw, 0.875rem);
  }
}

/* --- Desktop (1024px+) --- */
@media (min-width: 1024px) {
  .sz-hero {
    padding: calc(var(--header-height, 106px) + 0.75rem) clamp(1rem, 2vw, 1.25rem) 0;
  }

  .sz-hero__main {
    height: calc(67dvh - var(--header-height, 106px) - 0.75rem);
    height: calc(67vh - var(--header-height, 106px) - 0.75rem);
    min-height: 340px;
    max-height: 540px;
    border-radius: 1.25rem;
  }

  .sz-hero__content {
    left: 80px;
    top: 60px;
  }

  .sz-hero__txt-main-text {
    font-size: clamp(1.4rem, 2vw, 1.8rem);
  }

  .sz-hero__notice {
    margin-block-start: 16px;
    padding: 14px 24px;
  }

  .sz-hero__recruit {
    right: 0;
    top: 50%;
    transform: translateY(-50%);
    width: 130px;
    height: 130px;
  }

  .sz-hero__recruit-label {
    font-size: 0.6875rem;
    margin-bottom: 6px;
  }

  .sz-hero__recruit-title {
    font-size: 0.875rem;
  }
}
.important-notice {
  background: linear-gradient(90deg, #fff9c4, #fff59d);
  border-bottom: 3px solid #f9a825;
}

.important-notice__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: stretch;
}

.important-notice__label {
  background: #f9a825;
  color: var(--color-white);
  padding: 16px 30px;
  display: flex;
  align-items: center;
  gap: 10px;
  font-weight: 600;
  font-size: 0.9375rem;
  white-space: nowrap;
}

.important-notice__label .material-symbols-outlined {
  font-size: 1.375rem;
}

.important-notice__content {
  flex: 1;
  display: flex;
  align-items: center;
  padding: 0 30px;
}

.important-notice__link {
  display: flex;
  align-items: center;
  gap: 20px;
  text-decoration: none;
  color: var(--sz-text, #222);
  font-size: 0.9375rem;
  width: 100%;
  transition: opacity 0.3s ease;
}

.important-notice__link:hover {
  opacity: 0.7;
}

.important-notice__link time {
  color: var(--sz-text-light, var(--color-text-secondary));
  font-size: 0.875rem;
}

.important-notice__text {
  flex: 1;
}

.important-notice__link .material-symbols-outlined {
  color: var(--sz-primary, #114FA1);
  font-size: 1.25rem;
}

/* ================================================================
   クイックアクセス
   ================================================================ */
.quick-guide {
  background: var(--color-white);
  padding: 0;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
  position: relative;
  z-index: 10;
  margin-top: -60px;
  max-width: 1200px;
  margin-left: auto;
  margin-right: auto;
  border-radius: 16px;
  overflow: hidden;
}

.quick-guide__list {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  list-style: none;
  margin: 0;
  padding: 0;
}

.quick-guide__item {
  border-right: 1px solid #eee;
}

.quick-guide__item:last-child {
  border-right: none;
}

.quick-guide__link {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 40px 16px;
  text-decoration: none;
  color: var(--sz-text, #222);
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.quick-guide__link::before {
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 4px;
  background: var(--sz-primary, #114FA1);
  transform: scaleX(0);
  transition: transform 0.3s ease;
}

.quick-guide__link:hover {
  background: var(--sz-primary-50, #E8F0FA);
}

.quick-guide__link:hover::before {
  transform: scaleX(1);
}

.quick-guide__icon {
  width: 80px;
  height: 80px;
  border-radius: 50%;
  background: var(--sz-primary-50, #E8F0FA);
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
  transition: all 0.3s ease;
}

.quick-guide__link:hover .quick-guide__icon {
  background: var(--sz-primary, #114FA1);
}

.quick-guide__icon .material-symbols-outlined {
  font-size: 2.25rem;
  color: var(--sz-primary, #114FA1);
  transition: color 0.3s ease;
}

.quick-guide__link:hover .quick-guide__icon .material-symbols-outlined {
  color: var(--color-white);
}

.quick-guide__txt {
  font-size: 0.875rem;
  font-weight: 500;
  text-align: center;
  line-height: 1.6;
}

/* ================================================================
   クイックアクセス レスポンシブ (Mobile First)
   ================================================================ */

/* Mobile Base: 2列 */
.quick-guide {
  margin-top: clamp(-1.875rem, -4vw, -2.5rem);
  border-radius: clamp(0.75rem, 2vw, 1rem);
}

.quick-guide__list {
  grid-template-columns: repeat(2, 1fr);
}

.quick-guide__item:nth-child(odd) {
  border-inline-end: 1px solid #eee;
}

.quick-guide__item:nth-child(even) {
  border-inline-end: none;
}

.quick-guide__item:nth-child(n+3) {
  border-block-start: 1px solid #eee;
}

.quick-guide__link {
  padding: clamp(1.25rem, 3vw, 1.5rem) clamp(0.75rem, 2vw, 1rem);
}

.quick-guide__icon {
  width: clamp(3.5rem, 8vw, 4rem);
  height: clamp(3.5rem, 8vw, 4rem);
}

.quick-guide__icon .material-symbols-outlined {
  font-size: clamp(1.5rem, 4vw, 1.75rem);
}

.quick-guide__txt {
  font-size: clamp(0.6875rem, 2vw, 0.8125rem);
}

/* Tablet: 3列 */
@media (min-width: 768px) {
  .quick-guide {
    margin-top: clamp(-2.5rem, -5vw, -3.75rem);
  }

  .quick-guide__list {
    grid-template-columns: repeat(3, 1fr);
  }

  .quick-guide__item {
    border-inline-end: 1px solid #eee;
  }

  .quick-guide__item:nth-child(3n) {
    border-inline-end: none;
  }

  .quick-guide__item:nth-child(n+4) {
    border-block-start: 1px solid #eee;
  }

  .quick-guide__link {
    padding: clamp(1.5rem, 3vw, 2rem) clamp(0.75rem, 2vw, 1rem);
  }

  .quick-guide__icon {
    width: clamp(3.75rem, 6vw, 5rem);
    height: clamp(3.75rem, 6vw, 5rem);
  }

  .quick-guide__icon .material-symbols-outlined {
    font-size: clamp(1.75rem, 3vw, 2.25rem);
  }
}

/* Desktop: 6列 */
@media (min-width: 1024px) {
  .quick-guide {
    margin-top: -60px;
  }

  .quick-guide__list {
    grid-template-columns: repeat(6, 1fr);
  }

  .quick-guide__item {
    border-inline-end: 1px solid #eee;
    border-block-start: none;
  }

  .quick-guide__item:last-child {
    border-inline-end: none;
  }

  .quick-guide__link {
    padding: 40px 16px;
  }

  .quick-guide__txt {
    font-size: 0.875rem;
  }
}

/* ================================================================
   [DEPRECATED] 新着情報セクション - 削除済（news-v2を使用）
   ================================================================ */

/* ================================================================
   重要なお知らせセクション（木古内スタイル - カード形式）
   ================================================================ */
.important-news {
  padding: 30px 40px;
  background: transparent;
}

.important-news__inner {
  max-width: 900px;
  margin: 0 auto;
  background: linear-gradient(135deg, #fff5f5 0%, #ffe8e8 100%);
  border-radius: 16px;
  padding: 24px 40px;
  box-shadow: 0 4px 20px rgba(220, 38, 38, 0.08);
}

.important-news__list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.important-news__item {
  border-bottom: 1px solid rgba(220, 38, 38, 0.15);
}

.important-news__item:last-child {
  border-bottom: none;
}

.important-news__link {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 20px;
  text-decoration: none;
  color: #dc2626;
  transition: background 0.2s ease;
  border-radius: 8px;
}

.important-news__link:hover {
  background: rgba(220, 38, 38, 0.08);
}

.important-news__icon {
  font-size: 1.375rem;
  color: #dc2626;
  flex-shrink: 0;
}

.important-news__date {
  font-size: 0.95rem;
  font-weight: 600;
  color: #dc2626;
  letter-spacing: 0.03em;
  flex-shrink: 0;
  min-width: 95px;
}

.important-news__separator {
  width: 40px;
  height: 2px;
  background: rgba(220, 38, 38, 0.4);
  flex-shrink: 0;
}

.important-news__title {
  flex: 1;
  font-size: 0.95rem;
  font-weight: 600;
  color: #dc2626;
  line-height: 1.5;
}

.important-news__arrow {
  font-size: 1.25rem;
  color: rgba(220, 38, 38, 0.6);
  flex-shrink: 0;
  transition: transform 0.2s ease, color 0.2s ease;
}

.important-news__link:hover .important-news__arrow {
  transform: translateX(4px);
  color: #dc2626;
}

/* important-news Mobile First */
.important-news {
  padding: clamp(1.25rem, 3vw, 1.875rem) clamp(1rem, 3vw, 2rem);
}

.important-news__inner {
  padding: clamp(1rem, 2vw, 1.5rem) clamp(1.25rem, 3vw, 2rem);
  border-radius: clamp(0.75rem, 2vw, 1rem);
}

.important-news__link {
  flex-wrap: wrap;
  gap: clamp(0.5rem, 1.5vw, 0.75rem);
  padding: clamp(0.75rem, 2vw, 1rem);
}

.important-news__icon {
  font-size: clamp(1.125rem, 2.5vw, 1.5rem);
}

.important-news__date {
  font-size: clamp(0.8125rem, 1.5vw, 0.9375rem);
  min-width: auto;
}

.important-news__separator {
  width: clamp(1.25rem, 3vw, 2rem);
}

.important-news__title {
  flex-basis: 100%;
  padding-inline-start: 2.375rem;
  font-size: clamp(0.875rem, 2vw, 1rem);
}

.important-news__arrow {
  display: none;
}

@media (min-width: 768px) {
  .important-news__title {
    flex-basis: auto;
    padding-inline-start: 0;
  }

  .important-news__arrow {
    display: block;
  }
}

/* ================================================================
   重要なお知らせバー - 非表示（木古内スタイルでは使用しない）
   ================================================================ */
.important-notice-bar {
  display: none;
}

.important-notice-bar__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  background: var(--color-white);
  border: 1px solid var(--color-gray-300);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.important-notice-bar__label {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 24px 32px;
  background: #d4e4f7;
  flex-shrink: 0;
}

.important-notice-bar__icon {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background: var(--color-white);
  display: flex;
  align-items: center;
  justify-content: center;
}

.important-notice-bar__icon .material-symbols-outlined {
  font-size: 1.5rem;
  color: #2E7D32;
}

.important-notice-bar__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--sz-primary);
}

.important-notice-bar__content {
  flex: 1;
  padding: 0 32px;
}

.important-notice-bar__link {
  display: flex;
  align-items: center;
  gap: 24px;
  text-decoration: none;
  color: var(--sz-text);
  transition: color 0.3s ease;
}

.important-notice-bar__link:hover {
  color: var(--sz-primary);
}

.important-notice-bar__link:hover .important-notice-bar__text {
  text-decoration: underline;
}

.important-notice-bar__date {
  font-size: 0.875rem;
  color: var(--sz-text-light);
  flex-shrink: 0;
}

.important-notice-bar__text {
  font-size: 0.9375rem;
  flex: 1;
  color: var(--sz-primary);
}

.important-notice-bar__arrow {
  flex-shrink: 0;
}

.important-notice-bar__arrow .material-symbols-outlined {
  font-size: 1.25rem;
  color: var(--sz-text-light);
}

/* important-notice-bar Mobile First */
.important-notice-bar {
  padding: clamp(0.5rem, 2vw, 0.9375rem);
  margin-top: clamp(-0.3125rem, -1vw, -0.625rem);
}

.important-notice-bar__inner {
  flex-direction: column;
  align-items: stretch;
}

.important-notice-bar__label {
  padding: clamp(0.625rem, 2vw, 0.75rem) clamp(0.75rem, 2vw, 1rem);
  justify-content: center;
}

.important-notice-bar__icon {
  width: clamp(2rem, 5vw, 2.5rem);
  height: clamp(2rem, 5vw, 2.5rem);
}

.important-notice-bar__icon .material-symbols-outlined {
  font-size: clamp(1.125rem, 3vw, 1.5rem);
}

.important-notice-bar__title {
  font-size: clamp(0.8125rem, 2vw, 1rem);
}

.important-notice-bar__content {
  padding: clamp(0.625rem, 2vw, 0.75rem) clamp(0.75rem, 2vw, 1rem);
}

.important-notice-bar__date {
  font-size: clamp(0.75rem, 1.5vw, 0.875rem);
}

.important-notice-bar__text {
  font-size: clamp(0.8125rem, 2vw, 0.9375rem);
}

.important-notice-bar__link {
  gap: 0.75rem;
}

@media (min-width: 768px) {
  .important-notice-bar {
    padding: 20px 30px;
    margin-top: -20px;
  }

  .important-notice-bar__inner {
    flex-direction: row;
    align-items: center;
  }

  .important-notice-bar__label {
    padding: 24px 32px;
    justify-content: flex-start;
  }

  .important-notice-bar__icon {
    width: 40px;
    height: 40px;
  }

  .important-notice-bar__content {
    padding: 20px 24px;
  }
}

/* ================================================================
   クイックアクセス＋診療情報セクション
   ================================================================ */
.guide-section {
  padding: 40px 40px;
  background: var(--color-white);
}

/* guide-section統一ヘッダー対応 */
.guide-section .sz-section-header {
  grid-column: 1 / -1;
  margin-bottom: 2.5rem;
}

.guide-section__inner {
  max-width: 1440px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  align-items: start;
}

/* 左側: クイックアクセスカード */
.guide-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.guide-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 30px 20px;
  background: var(--color-bg-secondary);
  border-radius: 12px;
  text-decoration: none;
  color: var(--sz-text);
  position: relative;
  transition: all 0.3s ease;
  border: 1px solid #e8e8e8;
}

.guide-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
}

.guide-card__icon {
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background: #e8f4f8;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 16px;
}

.guide-card__icon img {
  width: 40px;
  height: 40px;
  object-fit: contain;
}

.guide-card__icon-fallback {
  display: none;
  font-size: 2rem;
}

/* カードカラーバリエーション */
.guide-card--green .guide-card__icon { background: #e0f2f1; }
.guide-card--green .guide-card__icon-fallback { color: #00897b; }
.guide-card--teal .guide-card__icon { background: #e0f7fa; }
.guide-card--teal .guide-card__icon-fallback { color: #00acc1; }
.guide-card--blue .guide-card__icon { background: #e3f2fd; }
.guide-card--blue .guide-card__icon-fallback { color: #1976d2; }
.guide-card--red .guide-card__icon { background: #fce4ec; }
.guide-card--red .guide-card__icon-fallback { color: #e53935; }
.guide-card--navy .guide-card__icon { background: #e8eaf6; }
.guide-card--navy .guide-card__icon-fallback { color: #3f51b5; }
.guide-card--purple .guide-card__icon { background: #f3e5f5; }
.guide-card--purple .guide-card__icon-fallback { color: #8e24aa; }

.guide-card__txt {
  font-size: 0.9375rem;
  font-weight: 600;
  text-align: center;
  line-height: 1.6;
  color: var(--sz-text);
}

/* カードテキストカラー（WCAG AA準拠） */
.guide-card--green .guide-card__txt { color: #00695c; }
.guide-card--teal .guide-card__txt { color: #006064; }
.guide-card--blue .guide-card__txt { color: #1565c0; }
.guide-card--red .guide-card__txt { color: #c62828; }
.guide-card--navy .guide-card__txt { color: #303f9f; }
.guide-card--purple .guide-card__txt { color: #6a1b9a; }

.guide-card__arrow {
  position: absolute;
  right: 12px;
  bottom: 12px;
  font-size: 1.125rem;
  color: var(--sz-text-light);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.guide-card:hover .guide-card__arrow {
  opacity: 1;
}

/* 右側: 診療受付時間・休診日 */
.guide-info {
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.guide-info__block {
  padding: 0;
}

.guide-info__ttl {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--sz-text);
  margin-bottom: 16px;
}

.guide-info__dot {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--sz-primary);
  flex-shrink: 0;
}

.guide-info__time-row {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 12px;
}

.guide-info__badge {
  display: inline-block;
  padding: 6px 16px;
  background: var(--sz-primary);
  color: var(--color-white);
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: 20px;
}

.guide-info__time {
  font-size: 1.125rem;
  color: var(--sz-text);
}

.guide-info__time strong {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--sz-primary);
  font-family: var(--sz-font-en);
}

.guide-info__note {
  font-size: 0.8125rem;
  color: var(--sz-text-light);
  line-height: 1.6;
  margin-bottom: 8px;
}

.guide-info__note--highlight {
  color: var(--sz-primary);
  font-weight: 600;
}

.guide-info__note--red {
  color: #c62828;
}

.guide-info__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background: var(--color-white);
  border: 1px solid var(--color-gray-300);
  border-radius: 4px;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--sz-text);
  text-decoration: none;
  transition: all 0.3s ease;
  margin-top: 8px;
}

.guide-info__link:hover {
  border-color: var(--sz-primary);
  color: var(--sz-primary);
}

.guide-info__link .material-symbols-outlined {
  font-size: 1.125rem;
}

.guide-info__main {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-text);
  margin-bottom: 8px;
}

/* [DEPRECATED] guide-buttons - 削除済 */

/* [MIGRATED to _asakayama-mobile.css §27] mobile-first min-width overrides */
/* max-width queries removed per project mobile-first rule */

/* ================================================================
   診療受付時間・休診日（旧スタイル - 残置）
   ================================================================ */
.reception-info {
  padding: 40px 40px;
  background: var(--color-white);
}

.reception-info__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 40px;
  align-items: start;
}

.reception-info__block {
  padding: 30px;
  border-radius: 12px;
}

.reception-info__block--time {
  background: var(--sz-primary-50, #E8F0FA);
  border: 2px solid var(--sz-primary, #114FA1);
}

.reception-info__block--holiday {
  background: #fff3e0;
  border: 2px solid var(--sz-accent, #E65100);
}

.reception-info__ttl {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--sz-primary, #114FA1);
  margin-bottom: 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.reception-info__block--holiday .reception-info__ttl {
  color: var(--sz-accent, #E65100);
}

.reception-info__main {
  font-size: 0.9375rem;
  margin-bottom: 8px;
}

.reception-info__time {
  font-size: 0.875rem;
  color: var(--sz-text-light, var(--color-text-secondary));
}

.reception-info__time-num {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 1.75rem;
  font-weight: 600;
  color: var(--sz-primary, #114FA1);
}

.reception-info__note {
  font-size: 0.75rem;
  color: var(--sz-text-light, var(--color-text-secondary));
  margin-top: 12px;
  line-height: 1.6;
}

.reception-info__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--sz-primary, #114FA1);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 600;
  margin-top: 16px;
  transition: opacity 0.3s ease;
}

.reception-info__link:hover {
  opacity: 0.7;
}

.reception-info__links {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.reception-info__btn {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 24px;
  background: var(--sz-primary, #114FA1);
  color: var(--color-white);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: 8px;
  transition: all 0.3s ease;
}

.reception-info__btn:hover {
  background: var(--sz-primary-dark, #0D3A75);
  transform: translateX(4px);
}

.reception-info__btn .material-symbols-outlined {
  font-size: 1.25rem;
}

/* [MIGRATED to _asakayama-mobile.css §28] mobile-first min-width overrides */
/* max-width queries removed per project mobile-first rule */

/* ================================================================
   当院の特徴 v2（左テキスト+右カードスライダー）
   ================================================================ */
.feature-v2 {
  padding: 40px 40px;
  background: #f8f6f2;
}

.feature-v2__inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 40px;
  display: grid;
  grid-template-columns: 350px 1fr; /* 左カラム幅縮小 */
  gap: 50px;
  align-items: start;
}

/* 左側: テキスト + ナビゲーション */
.feature-v2__left {
  padding-top: 25px; /* 上部パディング縮小 */
}

.feature-v2__en {
  display: block;
  font-family: 'Palatino Linotype', Palatino, serif;
  font-size: 0.75rem;
  font-weight: 400;
  letter-spacing: 0.15em;
  color: var(--sz-primary, #114FA1);
  text-transform: none; /* 大文字変換無効 - Featuresスタイル */
  margin-top: 0.5rem;
  margin-bottom: 1rem;
}

.feature-v2__label {
  display: block;
  font-size: 0.8125rem;
  color: var(--sz-text-light);
  margin-bottom: 15px;
  letter-spacing: 0.1em;
}

.feature-v2__ttl {
  font-size: 1.75rem; /* 統一フォントサイズ */
  font-weight: 700;
  line-height: 1.4;
  color: var(--sz-text);
  margin-bottom: 0; /* 英語ラベルが下に来るため削除 */
}

.feature-v2__accent {
  color: var(--sz-accent);
}

.feature-v2__nav {
  display: flex;
  flex-direction: column;
  gap: 20px; /* ギャップ縮小 */
}

.feature-v2__counter {
  display: flex;
  align-items: baseline;
  gap: 12px;
  font-family: var(--sz-font-en);
}

.feature-v2__current {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--sz-primary);
}

.feature-v2__sep {
  font-size: 0.875rem;
  color: var(--sz-text-light);
}

.feature-v2__total {
  font-size: 0.875rem;
  color: var(--sz-text-light);
}

.feature-v2__btns {
  display: flex;
  gap: 12px;
}

.feature-v2__btn {
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 1px solid var(--sz-gray-300);
  background: var(--color-white);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
}

.feature-v2__btn:hover {
  border-color: var(--sz-primary);
  color: var(--sz-primary);
}

.feature-v2__btn .material-symbols-outlined {
  font-size: 1.5rem;
}

/* 右側: カードスライダー */
.feature-v2__right {
  overflow: hidden;
}

/* Swiperデフォルト(overflow:hidden)を高詳細度で上書き */
.feature-v2__right .feature-v2-swiper.swiper {
  overflow: visible;
}

.feature-v2-swiper .swiper-wrapper {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
}

.feature-v2-swiper .swiper-slide {
  width: 340px;
  flex-shrink: 0;
}

.feature-v2__card {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  background: var(--color-white);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
  transition: transform 0.3s ease;
}

.feature-v2__card:hover {
  transform: translateY(-4px);
}

.feature-v2__card-img {
  position: relative;
  height: 240px; /* 高さ縮小 280px → 240px */
  overflow: hidden;
}

.feature-v2__card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.feature-v2__card-num {
  position: absolute;
  top: 16px;
  right: 16px;
  font-family: var(--sz-font-en);
  font-size: 3rem;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.8);
  text-shadow: 0 2px 10px rgba(0, 0, 0, 0.3);
}

.feature-v2__card-body {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: 24px;
  background: linear-gradient(to top, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 100%);
  color: var(--color-white);
}

.feature-v2__card-label {
  display: block;
  font-size: 0.75rem;
  opacity: 0.8;
  margin-bottom: 8px;
}

.feature-v2__card-ttl {
  font-size: 1.375rem;
  font-weight: 700;
  line-height: 1.4;
  margin-bottom: 16px;
}

.feature-v2__card-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background: var(--color-white);
  color: var(--sz-text);
  font-size: 0.875rem;
  font-weight: 500;
  text-decoration: none;
  border-radius: 30px;
  transition: all 0.3s ease;
}

.feature-v2__card-btn:hover {
  background: var(--sz-primary);
  color: var(--color-white);
}

.feature-v2__card-btn .material-symbols-outlined {
  font-size: 1.125rem;
}

/* 下部リンク */
.feature-v2__links {
  max-width: 800px;
  margin: 20px auto 0; /* マージン縮小 30px → 20px */
  display: flex;
  justify-content: center;
  gap: 20px;
}

.feature-v2__link {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
  gap: 32px;
  min-width: 260px;
  padding: 16px 24px; /* パディング縮小 */
  background: var(--color-white);
  border: 1px solid var(--sz-gray-300);
  border-radius: 4px;
  font-size: 0.9375rem;
  font-weight: 600;
  color: var(--sz-text);
  text-decoration: none;
  transition: all 0.3s ease;
}

.feature-v2__link:hover {
  border-color: var(--sz-primary);
  color: var(--sz-primary);
}

.feature-v2__link .material-symbols-outlined {
  font-size: 1.25rem;
  color: var(--sz-text-light);
}

.feature-v2__link:hover .material-symbols-outlined {
  color: var(--sz-primary);
}

/* feature-v2 レスポンシブ (Mobile First) */

/* Mobile Base */
.feature-v2 {
  padding: clamp(2.5rem, 6vw, 3.75rem) 0;
}

.feature-v2__inner {
  grid-template-columns: 1fr;
  gap: clamp(1.5rem, 4vw, 2.5rem);
  padding: 0 clamp(1rem, 4vw, 2.5rem);
}

.feature-v2__left {
  padding-top: 0;
  text-align: center;
}

.feature-v2__ttl {
  font-size: clamp(1.5rem, 4vw, 1.75rem);
}

.feature-v2__nav {
  flex-direction: row;
  justify-content: center;
  align-items: center;
  gap: clamp(1.5rem, 4vw, 2.5rem);
}

.feature-v2-swiper .swiper-slide {
  width: clamp(260px, 65vw, 280px);
}

.feature-v2__card-img {
  height: clamp(180px, 40vw, 220px);
}

.feature-v2__card-ttl {
  font-size: clamp(1rem, 3vw, 1.125rem);
}

.feature-v2__links {
  flex-direction: column;
  align-items: center;
}

.feature-v2__link {
  width: 100%;
  max-width: 400px;
}

/* Desktop (1024px+) */
@media (min-width: 1024px) {
  .feature-v2 {
    padding: 40px 40px;
  }

  .feature-v2__inner {
    grid-template-columns: 350px 1fr;
    gap: 50px;
    padding: 0 40px;
  }

  .feature-v2__left {
    padding-top: 25px;
    text-align: start;
  }

  .feature-v2__ttl {
    font-size: 1.75rem;
  }

  .feature-v2__nav {
    flex-direction: column;
    gap: 20px;
  }

  .feature-v2-swiper .swiper-slide {
    width: 340px;
  }

  .feature-v2__card-img {
    height: 240px;
  }

  .feature-v2__card-ttl {
    font-size: 1.375rem;
  }

  .feature-v2__links {
    flex-direction: row;
  }

  .feature-v2__link {
    width: auto;
    max-width: none;
  }
}

/* ================================================================
   当院について＋アクセス（緑テーマ - 浅香山風）
   ================================================================ */
.sz-about {
  position: relative;
  padding: 48px 0;
  background: #f5f8f6;
  overflow: hidden;
}

.sz-about__bg {
  position: absolute;
  top: 0;
  right: 0;
  width: 60%;
  height: 100%;
  pointer-events: none;
}

.sz-about__map-silhouette {
  width: 100%;
  height: 100%;
}

.sz-about__inner {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 40px;
}

/* 左側: テキスト */
.sz-about__en {
  display: block;
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.875rem;
  font-weight: 600;
  color: #48bb8f;
  letter-spacing: 0.15em;
  margin-bottom: 16px;
}

.sz-about__ttl {
  font-size: 1.75rem;
  font-weight: 700;
  line-height: 1.7;
  color: #222;
  margin-bottom: 20px;
}

.sz-about__desc {
  font-size: 0.875rem;
  line-height: 1.9;
  color: #555;
  margin-bottom: 32px;
}

.sz-about__br-pc {
  display: inline;
}

.sz-about__btns {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-width: 320px;
}

.sz-about__btn {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 20px;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 50px;
  text-decoration: none;
  color: #333;
  font-size: 0.9375rem;
  font-weight: 500;
  transition: all 0.25s ease;
}

.sz-about__btn:hover {
  border-color: #48bb8f;
  box-shadow: 0 2px 12px rgba(72, 187, 143, 0.15);
}

.sz-about__btn-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  background: #48bb8f;
  border-radius: 50%;
  color: #fff;
  flex-shrink: 0;
  transition: background 0.25s ease;
}

.sz-about__btn:hover .sz-about__btn-icon {
  background: #3da87d;
}

.sz-about__btn-icon .material-symbols-outlined {
  font-size: 1.25rem;
}

/* 右側: マップ＋アクセス */
.sz-about__map {
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.sz-about__map-visual {
  position: relative;
  border-radius: 16px;
  overflow: hidden;
  aspect-ratio: 4 / 3;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08);
}

.sz-about__map-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sz-about__marker {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  animation: sz-about-bounce 2s ease infinite;
}

@keyframes sz-about-bounce {
  0%, 100% { transform: translate(-50%, -100%); }
  50% { transform: translate(-50%, -108%); }
}

.sz-about__marker-icon {
  font-size: 2.5rem;
  color: #e74c3c;
  filter: drop-shadow(0 2px 4px rgba(0,0,0,0.3));
}

.sz-about__marker-label {
  background: #fff;
  color: #333;
  font-size: 0.8125rem;
  font-weight: 700;
  padding: 3px 10px;
  border-radius: 4px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.15);
  white-space: nowrap;
}

/* アクセス情報 */
.sz-about__access {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.sz-about__access-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 14px;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.06);
}

.sz-about__access-icon {
  font-size: 1.375rem;
  color: #48bb8f;
  flex-shrink: 0;
}

.sz-about__access-body {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.sz-about__access-from {
  font-size: 0.6875rem;
  color: #888;
  font-weight: 500;
}

.sz-about__access-time {
  font-size: 0.8125rem;
  color: #333;
  font-weight: 500;
}

.sz-about__access-time strong {
  font-size: 1.125rem;
  font-weight: 700;
  color: #48bb8f;
}

.sz-about__access-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #48bb8f;
  text-decoration: none;
  align-self: flex-end;
  transition: opacity 0.2s ease;
}

.sz-about__access-link:hover {
  opacity: 0.7;
}

.sz-about__access-link .material-symbols-outlined {
  font-size: 1.125rem;
}

/* タブレット */
@media (min-width: 768px) {
  .sz-about__inner {
    grid-template-columns: 1fr;
    gap: 40px;
  }

  .sz-about__bg {
    width: 100%;
    opacity: 0.4;
  }

  .sz-about__btns {
    max-width: 100%;
  }
}

/* デスクトップ */
@media (min-width: 1024px) {
  .sz-about__inner {
    grid-template-columns: 1fr 1fr;
    gap: 60px;
  }

  .sz-about__bg {
    width: 60%;
    opacity: 1;
  }

  .sz-about__btns {
    max-width: 320px;
  }
}

/* モバイル */
.sz-about {
  padding: clamp(2.5rem, 6vw, 3rem) 0;
}

.sz-about__inner {
  padding: 0 clamp(1rem, 4vw, 2.5rem);
  grid-template-columns: 1fr;
  gap: clamp(1.5rem, 4vw, 2.5rem);
}

.sz-about__ttl {
  font-size: clamp(1.25rem, 3vw, 1.75rem);
}

.sz-about__br-pc {
  display: none;
}

.sz-about__access {
  grid-template-columns: 1fr;
}

.sz-about__btn {
  max-width: 100%;
}

@media (min-width: 480px) {
  .sz-about__access {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1024px) {
  .sz-about__br-pc {
    display: inline;
  }

  .sz-about__ttl {
    font-size: 1.75rem;
  }
}

/* ================================================================
   当院の特徴（旧スライダー - 残置）
   ================================================================ */
.feature {
  padding: 100px 40px;
  background: linear-gradient(180deg, var(--color-bg-secondary) 0%, var(--color-white) 100%);
}

.feature__header {
  text-align: center;
  margin-bottom: 60px;
}

.feature__en {
  display: block;
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.875rem;
  color: var(--sz-primary, #114FA1);
  letter-spacing: 0.2em;
  margin-bottom: 10px;
}

.feature__ttl {
  font-size: 2rem;
  font-weight: 700;
  color: var(--sz-text, #222);
  margin-bottom: 16px;
}

.feature__lead {
  font-size: 1.125rem;
  color: var(--sz-text-light, var(--color-text-secondary));
}

.feature__slider {
  max-width: 1000px;
  margin: 0 auto;
  position: relative;
}

.feature__slide {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 60px;
  align-items: center;
  background: var(--color-white);
  border-radius: 20px;
  overflow: hidden;
  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.1);
}

.feature__slide-img {
  height: 400px;
  overflow: hidden;
}

.feature__slide-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.feature__slide-content {
  padding: 40px 40px 40px 0;
}

.feature__slide-num {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 3.75rem;
  font-weight: 600;
  color: var(--sz-primary-50, #E8F0FA);
  line-height: 1;
  margin-bottom: 16px;
}

.feature__slide-ttl {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--sz-text, #222);
  margin-bottom: 16px;
}

.feature__slide-txt {
  font-size: 0.9375rem;
  line-height: 1.8;
  color: var(--sz-text-light, var(--color-text-secondary));
  margin-bottom: 24px;
}

.feature__slide-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background: var(--sz-primary, #114FA1);
  color: var(--color-white);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: 50px;
  transition: all 0.3s ease;
}

.feature__slide-btn:hover {
  background: var(--sz-primary-dark, #0D3A75);
  transform: translateX(4px);
}

.feature__slider-nav {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 30px;
  margin-top: 40px;
}

.feature__slider-counter {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 1.5rem;
  color: var(--sz-text, #222);
}

.feature__slider-current {
  font-size: 2.25rem;
  font-weight: 600;
  color: var(--sz-primary, #114FA1);
}

.feature__slider-sep {
  margin: 0 8px;
  color: #ccc;
}

.feature__slider-btns {
  display: flex;
  gap: 10px;
}

.feature__slider-btn {
  width: 50px;
  height: 50px;
  border-radius: 50%;
  border: 2px solid var(--sz-primary, #114FA1);
  background: var(--color-white);
  color: var(--sz-primary, #114FA1);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

.feature__slider-btn:hover {
  background: var(--sz-primary, #114FA1);
  color: var(--color-white);
}

.feature__links {
  display: flex;
  justify-content: center;
  gap: 20px;
  margin-top: 60px;
}

.feature__link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 32px;
  border: 2px solid var(--sz-primary, #114FA1);
  color: var(--sz-primary, #114FA1);
  text-decoration: none;
  font-size: 0.9375rem;
  font-weight: 600;
  border-radius: 50px;
  transition: all 0.3s ease;
}

.feature__link:hover {
  background: var(--sz-primary, #114FA1);
  color: var(--color-white);
}

/* [MIGRATED to _asakayama-mobile.css §36] mobile-first min-width overrides */
/* max-width queries removed per project mobile-first rule */

/* ================================================================
   診療科・部門（画像3風 - フォトカード＋アイコングリッド）
   ================================================================ */
.sz-dept-home {
  padding: 40px 0;
  background: #f5f7f9;
}

.sz-dept-home__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}

.sz-dept-home__label {
  display: inline-block;
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  color: #48bb8f;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  margin-bottom: 8px;
}

/* ---- 主要診療科フォトカード ---- */
.sz-dept-home__featured {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
  margin-top: 40px;
}

.sz-dept-home__photo-card {
  position: relative;
  display: block;
  border-radius: 10px;
  overflow: hidden;
  aspect-ratio: 3 / 4;
  text-decoration: none;
  color: #fff;
}

.sz-dept-home__photo-card::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(0,0,0,0.10) 0%, rgba(0,0,0,0.55) 100%);
  transition: background 0.3s ease;
}

.sz-dept-home__photo-card:hover::after {
  background: linear-gradient(180deg, rgba(0,0,0,0.15) 0%, rgba(0,0,0,0.65) 100%);
}

.sz-dept-home__photo-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.sz-dept-home__photo-card:hover .sz-dept-home__photo-img {
  transform: scale(1.05);
}

.sz-dept-home__photo-placeholder {
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #3a7ca5 0%, #5a9fbf 100%);
}

.sz-dept-home__photo-overlay {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding: 24px 20px;
}

.sz-dept-home__photo-label {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.6875rem;
  font-weight: 500;
  letter-spacing: 0.12em;
  opacity: 0.85;
  margin-bottom: 4px;
}

.sz-dept-home__photo-name {
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1.35;
  margin-bottom: 14px;
  text-shadow: 0 1px 4px rgba(0,0,0,0.3);
}

.sz-dept-home__photo-btn {
  display: inline-block;
  padding: 6px 20px;
  border: 1px solid rgba(255,255,255,0.7);
  border-radius: 4px;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.03em;
  text-align: center;
  transition: all 0.3s ease;
  align-self: flex-start;
}

.sz-dept-home__photo-card:hover .sz-dept-home__photo-btn {
  background: rgba(255,255,255,0.2);
  border-color: #fff;
}

/* ---- アイコングリッド ---- */
.sz-dept-home__icon-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin-top: 32px;
}

.sz-dept-home__icon-item {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #fff;
  border-radius: 8px;
  padding: 16px 18px;
  text-decoration: none;
  color: #333;
  border: 1px solid #e8edf2;
  transition: all 0.25s ease;
}

.sz-dept-home__icon-item:hover {
  box-shadow: 0 4px 16px rgba(0,0,0,0.08);
  border-color: #48bb8f;
  color: #333;
}

.sz-dept-home__icon-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.sz-dept-home__icon-wrap .material-symbols-outlined {
  font-size: 1.5rem;
  color: #48bb8f;
}

.sz-dept-home__icon-name {
  flex: 1;
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.3;
}

.sz-dept-home__icon-arrow {
  font-size: 1.125rem;
  color: #aaa;
  flex-shrink: 0;
  transition: color 0.2s ease;
}

.sz-dept-home__icon-item:hover .sz-dept-home__icon-arrow {
  color: #48bb8f;
}

/* ---- フッター（説明＋ボタン） ---- */
.sz-dept-home__bottom {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 40px;
  margin-top: 48px;
}

.sz-dept-home__desc {
  font-size: 1.0625rem;
  font-weight: 600;
  line-height: 1.8;
  color: #1a365d;
  margin: 0;
}

.sz-dept-home__btn-all {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  background: #fff;
  color: #1a365d;
  font-size: 0.9375rem;
  font-weight: 600;
  padding: 14px 32px;
  border-radius: 50px;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  white-space: nowrap;
  transition: all 0.3s ease;
}

.sz-dept-home__btn-all:hover {
  background: #48bb8f;
  color: #fff;
  box-shadow: 0 4px 16px rgba(72, 187, 143, 0.3);
}

.sz-dept-home__btn-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #48bb8f;
  transition: background 0.3s ease;
}

.sz-dept-home__btn-arrow .material-symbols-outlined {
  font-size: 1rem;
  color: #fff;
}

.sz-dept-home__btn-all:hover .sz-dept-home__btn-arrow {
  background: #fff;
}

.sz-dept-home__btn-all:hover .sz-dept-home__btn-arrow .material-symbols-outlined {
  color: #48bb8f;
}

/* ---- レスポンシブ (Mobile First) ---- */

/* Mobile Base: 2列 */
.sz-dept-home {
  padding: clamp(2.5rem, 6vw, 3.75rem) 0;
}

.sz-dept-home__inner {
  padding: 0 clamp(1rem, 4vw, 1.5rem);
}

.sz-dept-home__featured {
  grid-template-columns: 1fr 1fr;
  gap: clamp(0.625rem, 1.5vw, 0.75rem);
}

.sz-dept-home__photo-overlay {
  padding: clamp(1rem, 3vw, 1.5rem) clamp(0.875rem, 2vw, 1rem);
}

.sz-dept-home__photo-name {
  font-size: clamp(0.875rem, 2.5vw, 1rem);
  margin-bottom: clamp(0.625rem, 2vw, 0.875rem);
}

.sz-dept-home__icon-grid {
  grid-template-columns: 1fr 1fr;
  gap: clamp(0.5rem, 1.5vw, 0.625rem);
}

.sz-dept-home__icon-item {
  padding: clamp(0.75rem, 2vw, 1rem) clamp(0.875rem, 2vw, 1.125rem);
  gap: clamp(0.5rem, 1.5vw, 0.75rem);
}

.sz-dept-home__icon-name {
  font-size: clamp(0.75rem, 2vw, 0.8125rem);
}

.sz-dept-home__bottom {
  flex-direction: column;
  text-align: center;
  gap: clamp(1.25rem, 3vw, 1.5rem);
}

/* Tablet (768px+) */
@media (min-width: 768px) {
  .sz-dept-home__featured {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  .sz-dept-home__icon-grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .sz-dept-home__bottom {
    flex-direction: row;
    justify-content: space-between;
    text-align: start;
    gap: 40px;
  }
}

/* Desktop (1024px+) */
@media (min-width: 1024px) {
  .sz-dept-home {
    padding: 40px 0;
  }

  .sz-dept-home__inner {
    padding: 0 24px;
  }

  .sz-dept-home__featured {
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
  }

  .sz-dept-home__icon-grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 12px;
  }
}

/* ================================================================
   地域医療連携（旧スタイル - 保持）
   ================================================================ */
.community {
  padding: 100px 40px;
  background: var(--sz-primary, #114FA1);
  color: var(--color-white);
}

.community__header {
  text-align: center;
  margin-bottom: 60px;
}

.community__en {
  display: block;
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.875rem;
  color: rgba(255, 255, 255, 0.7);
  letter-spacing: 0.2em;
  margin-bottom: 10px;
}

.community__ttl {
  font-size: 2rem;
  font-weight: 700;
  margin-bottom: 16px;
}

.community__lead {
  font-size: 1.125rem;
  opacity: 0.9;
}

.community__grid {
  max-width: 1000px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
}

.community__card {
  background: rgba(255, 255, 255, 0.1);
  -webkit-backdrop-filter: blur(10px); /* Safari互換 */
  backdrop-filter: blur(10px);
  border-radius: 16px;
  padding: 40px;
}

.community__card-ttl {
  font-size: 1.25rem;
  font-weight: 700;
  margin-bottom: 24px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

.community__card-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.community__card-list li {
  margin-bottom: 12px;
}

.community__card-list a {
  display: flex;
  align-items: center;
  justify-content: space-between;
  color: var(--color-white);
  text-decoration: none;
  font-size: 0.9375rem;
  padding: 12px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
  transition: all 0.3s ease;
}

.community__card-list a:hover {
  padding-left: 10px;
  background: rgba(255, 255, 255, 0.05);
}

.community__card-list a .material-symbols-outlined {
  font-size: 1.125rem;
  opacity: 0.7;
}

/* Community レスポンシブ (Mobile First) */
.community {
  padding: clamp(2.5rem, 6vw, 3.75rem) clamp(1rem, 4vw, 2.5rem);
}

.community__grid {
  grid-template-columns: 1fr;
}

.community__card {
  padding: clamp(1.5rem, 4vw, 1.875rem);
}

@media (min-width: 768px) {
  .community__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .community {
    padding: 100px 40px;
  }

  .community__card {
    padding: 40px;
  }
}

/* ================================================================
   お知らせ V2（済生会加須/浅香山スタイル - 左右分割＋タブフィルター）
   ================================================================ */
.news-v2 {
  padding: 80px 40px;
  background: var(--color-white, #fff);
}

.news-v2__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 48px;
}

/* 左側 — 縦書きタイトル + サイドボタン */
.news-v2__left {
  padding-top: 10px;
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.news-v2__title-block {
  display: flex;
  gap: 12px;
  align-items: flex-start;
}

.news-v2__ttl-vertical {
  writing-mode: vertical-rl;
  font-size: 1.75rem;
  font-weight: 700;
  letter-spacing: 0.15em;
  color: var(--sz-text, #222);
  line-height: 1;
  margin: 0;
}

.news-v2__en-vertical {
  writing-mode: vertical-rl;
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.8rem;
  font-weight: 600;
  color: #48bb8f;
  letter-spacing: 0.1em;
  line-height: 1;
}

.news-v2__en {
  display: block;
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #c62828;
  letter-spacing: 0.15em;
  margin-bottom: 4px;
}

.news-v2__ttl {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--sz-text, #222);
  margin-bottom: 20px;
}

.news-v2__side-links {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.news-v2__side-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 16px;
  border: 1.5px solid #ddd;
  border-radius: 50px;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--sz-text, #333);
  text-decoration: none;
  transition: all 0.25s ease;
  white-space: nowrap;
}

.news-v2__side-btn:hover {
  border-color: #48bb8f;
  color: #48bb8f;
}

.news-v2__side-btn .material-symbols-outlined {
  font-size: 1rem;
}

.news-v2__side-btn--important {
  border-color: #ef5350;
  color: #ef5350;
}

.news-v2__side-btn--important:hover {
  background: #ef5350;
  color: #fff;
}

.news-v2__more {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--sz-text, #333);
  text-decoration: underline;
  text-underline-offset: 3px;
  font-size: 0.875rem;
  transition: opacity 0.3s ease;
}

.news-v2__more:hover {
  opacity: 0.7;
}

.news-v2__more .material-symbols-outlined {
  font-size: 1rem;
  text-decoration: none;
}

/* 右側 */
.news-v2__right {
  flex: 1;
}

/* タブ — 浅香山スタイル（ピル型＋枠線カラー） */
.news-v2__tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 0;
  flex-wrap: wrap;
  padding-bottom: 20px;
}

.news-v2__tab {
  padding: 10px 22px;
  background: transparent;
  border: 1.5px solid #ddd;
  border-radius: 50px;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--sz-text-light, #666);
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  white-space: nowrap;
}

.news-v2__tab:hover {
  border-color: #999;
  color: var(--sz-text, #333);
}

.news-v2__tab.active {
  background: #333;
  border-color: #333;
  color: #fff;
}

/* カテゴリ別カラー（inactive状態 — 枠線＋テキスト色） */
.news-v2__tab[data-category="important"] { color: #c62828; border-color: #c62828; }
.news-v2__tab[data-category="news"],
.news-v2__tab[data-category="info"] { color: #1565c0; border-color: #1565c0; }
.news-v2__tab[data-category="event"] { color: #2e7d32; border-color: #2e7d32; }
.news-v2__tab[data-category="recruit"] { color: #e65100; border-color: #e65100; }
.news-v2__tab[data-category="bid"] { color: #6a1b9a; border-color: #6a1b9a; }
.news-v2__tab[data-category="nurse"],
.news-v2__tab[data-category="nursing"] { color: #ad1457; border-color: #ad1457; }
.news-v2__tab[data-category="closed"],
.news-v2__tab[data-category="schedule-change"] { color: #ef6c00; border-color: #ef6c00; }

.news-v2__tab.active[data-category="important"],
.news-v2__tab.active[data-category="news"],
.news-v2__tab.active[data-category="info"],
.news-v2__tab.active[data-category="event"],
.news-v2__tab.active[data-category="recruit"],
.news-v2__tab.active[data-category="bid"],
.news-v2__tab.active[data-category="nurse"],
.news-v2__tab.active[data-category="nursing"],
.news-v2__tab.active[data-category="closed"],
.news-v2__tab.active[data-category="schedule-change"],
.news-v2__tab.active[data-category="all"] {
  color: #fff;
}

/* ニュースリスト — 浅香山スタイル */
.news-v2__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.news-v2__item {
  border-bottom: 1px solid #eee;
}

.news-v2__item[data-hidden="true"] {
  display: none;
}

.news-v2__link {
  display: grid;
  grid-template-columns: auto 1fr auto;
  grid-template-rows: auto auto;
  gap: 4px 16px;
  padding: 20px 8px;
  text-decoration: none;
  color: var(--sz-text, #222);
  transition: all 0.25s ease;
}

.news-v2__link:hover {
  background: #f7f8fa;
}

/* NEWバッジ（丸型） */
.news-v2__new {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border: 2px solid #c62828;
  border-radius: 50%;
  color: #c62828;
  font-size: 0.6875rem;
  font-weight: 700;
  letter-spacing: 0.05em;
  flex-shrink: 0;
}

/* 日付 — 2行目 */
.news-v2__date {
  grid-column: 1 / -1;
  grid-row: 2;
  font-size: 0.8125rem;
  color: #999;
  flex-shrink: 0;
}

/* カテゴリバッジ（枠線ピル型） — 1行目左 */
.news-v2__category {
  grid-row: 1;
  grid-column: 1;
  display: inline-block;
  padding: 3px 14px;
  font-size: 0.75rem;
  font-weight: 500;
  border-radius: 3px;
  border: 1px solid currentColor;
  white-space: nowrap;
  flex-shrink: 0;
  align-self: center;
}

.news-v2__category--important { color: #c62828; border-color: #c62828; }
.news-v2__category--news,
.news-v2__category--info,
.news-v2__category--cat-1201 { color: #1565c0; border-color: #1565c0; }
.news-v2__category--event { color: #2e7d32; border-color: #2e7d32; }
.news-v2__category--recruit { color: #e65100; border-color: #e65100; }
.news-v2__category--bid { color: #6a1b9a; border-color: #6a1b9a; }
.news-v2__category--nurse,
.news-v2__category--nursing { color: #ad1457; border-color: #ad1457; }
.news-v2__category--closed,
.news-v2__category--schedule-change { color: #ef6c00; border-color: #ef6c00; }

/* タイトル — 1行目中央 */
.news-v2__title {
  grid-row: 1;
  grid-column: 2;
  flex: 1;
  font-size: 0.9375rem;
  line-height: 1.5;
  align-self: center;
}

/* 矢印 — 1行目右 */
.news-v2__arrow {
  grid-row: 1;
  grid-column: 3;
  font-size: 1.125rem;
  color: #999;
  flex-shrink: 0;
  transition: color 0.2s ease;
  align-self: center;
}

.news-v2__link:hover .news-v2__arrow {
  color: var(--sz-primary, #114FA1);
}

/* レスポンシブ (Mobile First) */

/* Mobile Base: 1列 */
.news-v2 {
  padding: clamp(2.5rem, 6vw, 5rem) clamp(1rem, 4vw, 2.5rem);
}

.news-v2__inner {
  grid-template-columns: 1fr;
  gap: clamp(1rem, 3vw, 1.5rem);
}

.news-v2__left {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: clamp(0.75rem, 2vw, 1.25rem);
}

.news-v2__title-block {
  flex-direction: row;
}

.news-v2__ttl-vertical {
  writing-mode: horizontal-tb;
  font-size: clamp(1.25rem, 3vw, 1.5rem);
  letter-spacing: 0;
}

.news-v2__en-vertical {
  writing-mode: horizontal-tb;
}

.news-v2__ttl {
  margin-bottom: 0;
  font-size: clamp(1.25rem, 3vw, 1.5rem);
}

.news-v2__side-links {
  flex-direction: row;
  flex-wrap: wrap;
}

.news-v2__tabs {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.news-v2__tab {
  padding: clamp(0.375rem, 1vw, 0.5rem) clamp(0.75rem, 2vw, 1rem);
  font-size: clamp(0.75rem, 2vw, 0.8125rem);
}

.news-v2__link {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(0.375rem, 1vw, 0.5rem);
  padding: clamp(0.75rem, 2vw, 1rem) clamp(0.25rem, 0.5vw, 0.375rem);
}

.news-v2__category {
  grid-row: unset;
  grid-column: unset;
}

.news-v2__title {
  grid-row: unset;
  grid-column: unset;
  flex-basis: 100%;
  padding-inline-start: 0;
}

.news-v2__date {
  grid-row: unset;
  grid-column: unset;
}

.news-v2__new {
  width: clamp(2.25rem, 6vw, 2.5rem);
  height: clamp(2.25rem, 6vw, 2.5rem);
  font-size: clamp(0.5625rem, 1.5vw, 0.625rem);
}

.news-v2__arrow {
  grid-row: unset;
  grid-column: unset;
  display: none;
}

/* Tablet (768px+) */
@media (min-width: 768px) {
  .news-v2__link {
    display: grid;
    grid-template-columns: auto 1fr auto;
    grid-template-rows: auto auto;
    gap: 4px 16px;
    padding: 20px 8px;
  }

  .news-v2__category {
    grid-row: 1;
    grid-column: 1;
  }

  .news-v2__title {
    grid-row: 1;
    grid-column: 2;
    flex-basis: auto;
  }

  .news-v2__date {
    grid-column: 1 / -1;
    grid-row: 2;
  }

  .news-v2__arrow {
    grid-row: 1;
    grid-column: 3;
    display: block;
  }

  .news-v2__new {
    width: 46px;
    height: 46px;
    font-size: 0.6875rem;
  }

  .news-v2__tab {
    padding: 10px 22px;
    font-size: 0.875rem;
  }
}

/* Desktop (1024px+) */
@media (min-width: 1024px) {
  .news-v2 {
    padding: 80px 40px;
  }

  .news-v2__inner {
    grid-template-columns: 200px 1fr;
    gap: 48px;
  }

  .news-v2__left {
    flex-direction: column;
    gap: 32px;
  }

  .news-v2__ttl-vertical {
    writing-mode: vertical-rl;
    font-size: 1.75rem;
    letter-spacing: 0.15em;
  }

  .news-v2__en-vertical {
    writing-mode: vertical-rl;
  }

  .news-v2__ttl {
    font-size: 1.75rem;
    margin-bottom: 20px;
  }

  .news-v2__side-links {
    flex-direction: column;
  }

  .news-v2__date {
    grid-row: unset;
    grid-column: unset;
  }

  .news-v2__new {
    width: 38px;
    height: 38px;
    font-size: 0.625rem;
  }

  .news-v2__arrow {
    grid-row: unset;
    grid-column: unset;
    display: none;
  }
}

/* ================================================================
   専門外来
   ================================================================ */
.specialty-clinic {
  padding: 100px 40px;
  background: linear-gradient(180deg, #f5f8fa 0%, #fff 100%);
}

.specialty-clinic__inner {
  max-width: 1200px;
  margin: 0 auto;
}

.specialty-clinic__header {
  text-align: center;
  margin-bottom: 48px;
}

.specialty-clinic__label {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #48bb8f;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.specialty-clinic__ttl {
  font-size: 1.75rem;
  font-weight: 700;
  color: #1a365d;
  margin: 0 0 12px;
  line-height: 1.4;
}

.specialty-clinic__ttl .accent {
  color: #1a365d;
}

.specialty-clinic__sub {
  font-size: 0.9375rem;
  color: #666;
  margin: 0;
  line-height: 1.6;
}

/* ---- カードグリッド ---- */
.specialty-clinic__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 16px;
}

.specialty-clinic__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  background: #fff;
  border: 1px solid #e8edf2;
  border-radius: 12px;
  padding: 32px 20px 24px;
  text-decoration: none;
  color: #333;
  transition: all 0.3s ease;
  position: relative;
}

.specialty-clinic__card:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  border-color: #48bb8f;
  transform: translateY(-3px);
}

.specialty-clinic__card-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: linear-gradient(135deg, #e8f5ee 0%, #d4eddf 100%);
  margin-bottom: 16px;
}

.specialty-clinic__card-icon .material-symbols-outlined {
  font-size: 1.75rem;
  color: #48bb8f;
}

.specialty-clinic__card-ttl {
  font-size: 1rem;
  font-weight: 700;
  color: #1a365d;
  margin: 0 0 8px;
  line-height: 1.4;
}

.specialty-clinic__card-schedule {
  font-size: 0.8125rem;
  color: #888;
  margin: 0;
  line-height: 1.5;
}

.specialty-clinic__card-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #48bb8f;
  margin-top: 16px;
  transition: background 0.2s ease;
}

.specialty-clinic__card-arrow .material-symbols-outlined {
  font-size: 1rem;
  color: #fff;
}

.specialty-clinic__card:hover .specialty-clinic__card-arrow {
  background: #3aa87d;
}

/* ---- 下部ボタン ---- */
.specialty-clinic__bottom {
  display: flex;
  justify-content: center;
  margin-top: 40px;
}

.specialty-clinic__btn-all {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 0.9375rem;
  font-weight: 600;
  color: #1a365d;
  text-decoration: none;
  padding: 14px 32px;
  border: 2px solid #1a365d;
  border-radius: 50px;
  transition: all 0.3s ease;
}

.specialty-clinic__btn-all:hover {
  background: #1a365d;
  color: #fff;
}

.specialty-clinic__btn-circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #48bb8f;
  transition: background 0.2s ease;
}

.specialty-clinic__btn-circle .material-symbols-outlined {
  font-size: 1rem;
  color: #fff;
}

.specialty-clinic__btn-all:hover .specialty-clinic__btn-circle {
  background: #fff;
}

.specialty-clinic__btn-all:hover .specialty-clinic__btn-circle .material-symbols-outlined {
  color: #48bb8f;
}

/* ---- レスポンシブ (Mobile First) ---- */

/* Mobile Base: 1列 */
.specialty-clinic {
  padding: clamp(2.5rem, 6vw, 3.75rem) clamp(1rem, 4vw, 2.5rem);
}

.specialty-clinic__header {
  margin-bottom: clamp(1.5rem, 4vw, 3rem);
}

.specialty-clinic__ttl {
  font-size: clamp(1.25rem, 3vw, 1.375rem);
}

.specialty-clinic__grid {
  grid-template-columns: 1fr;
  gap: clamp(0.625rem, 1.5vw, 0.75rem);
}

.specialty-clinic__card {
  flex-direction: row;
  text-align: start;
  padding: clamp(0.875rem, 2vw, 1rem) clamp(1rem, 2vw, 1.125rem);
  gap: clamp(0.75rem, 2vw, 0.875rem);
}

.specialty-clinic__card-icon {
  width: clamp(2.5rem, 7vw, 2.75rem);
  height: clamp(2.5rem, 7vw, 2.75rem);
  margin-bottom: 0;
}

.specialty-clinic__card-icon .material-symbols-outlined {
  font-size: clamp(1.25rem, 3vw, 1.375rem);
}

.specialty-clinic__card-arrow {
  margin-top: 0;
  margin-inline-start: auto;
  width: clamp(1.375rem, 4vw, 1.5rem);
  height: clamp(1.375rem, 4vw, 1.5rem);
}

.specialty-clinic__card-arrow .material-symbols-outlined {
  font-size: clamp(0.8125rem, 2vw, 0.875rem);
}

.specialty-clinic__btn-all {
  font-size: clamp(0.8125rem, 2vw, 0.875rem);
  padding: clamp(0.625rem, 2vw, 0.75rem) clamp(1.25rem, 3vw, 1.5rem);
}

/* Tablet: 2列 */
@media (min-width: 480px) {
  .specialty-clinic__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* Tablet+: 3列 */
@media (min-width: 768px) {
  .specialty-clinic__grid {
    grid-template-columns: repeat(3, 1fr);
  }

  .specialty-clinic__card {
    flex-direction: column;
    text-align: center;
    padding: clamp(1.5rem, 3vw, 2rem) clamp(1rem, 2vw, 1.25rem) clamp(1.25rem, 3vw, 1.5rem);
    gap: 0;
  }

  .specialty-clinic__card-icon {
    margin-bottom: 1rem;
  }

  .specialty-clinic__card-arrow {
    margin-top: 1rem;
    margin-inline-start: 0;
  }
}

/* Desktop: 4列 */
@media (min-width: 1024px) {
  .specialty-clinic {
    padding: 100px 40px;
  }

  .specialty-clinic__grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 16px;
  }

  .specialty-clinic__card {
    padding: 32px 20px 24px;
  }

  .specialty-clinic__card-icon {
    width: 56px;
    height: 56px;
  }

  .specialty-clinic__card-icon .material-symbols-outlined {
    font-size: 1.75rem;
  }

  .specialty-clinic__ttl {
    font-size: 1.75rem;
  }

  .specialty-clinic__btn-all {
    font-size: 0.9375rem;
    padding: 14px 32px;
  }
}

/* ================================================================
   お知らせ（旧スタイル - 保持）
   ================================================================ */
.news {
  padding: 100px 40px;
  background: var(--color-white);
}

.news__header {
  max-width: 1200px;
  margin: 0 auto 40px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
}

.news__en {
  display: block;
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.875rem;
  color: var(--sz-primary, #114FA1);
  letter-spacing: 0.2em;
  margin-bottom: 8px;
}

.news__ttl {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--sz-text, #222);
}

.news__more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--sz-primary, #114FA1);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 600;
  transition: opacity 0.3s ease;
}

.news__more:hover {
  opacity: 0.7;
}

.news__tabs {
  max-width: 1200px;
  margin: 0 auto 30px;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
}

.news__tab {
  padding: 10px 24px;
  background: var(--color-gray-100);
  border: none;
  border-radius: 50px;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--sz-text-light, var(--color-text-secondary));
  cursor: pointer;
  transition: all 0.3s ease;
}

.news__tab:hover {
  background: #eee;
}

.news__tab.active {
  background: var(--sz-primary, #114FA1);
  color: var(--color-white);
}

.news__list {
  max-width: 1200px;
  margin: 0 auto;
  list-style: none;
  padding: 0;
}

.news__item {
  border-bottom: 1px solid #eee;
}

.news__link {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 20px 0;
  text-decoration: none;
  color: var(--sz-text, #222);
  transition: all 0.3s ease;
}

.news__link:hover {
  background: #f9f9f9;
  padding-left: 16px;
  padding-right: 16px;
  margin-left: -16px;
  margin-right: -16px;
}

.news__new {
  background: #e53935;
  color: var(--color-white);
  padding: 4px 10px;
  font-size: 0.625rem;
  font-weight: 700;
  border-radius: 4px;
}

.news__date {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.9375rem;
  color: var(--sz-text-light, var(--color-text-secondary));
  min-width: 90px;
}

.news__category {
  padding: 4px 12px;
  font-size: 0.6875rem;
  font-weight: 600;
  border-radius: 4px;
  white-space: nowrap;
}

.news__category--important {
  background: #ffebee;
  color: #c62828;
}

.news__category--news {
  background: #e3f2fd;
  color: #1565c0;
}

.news__category--event {
  background: #e8f5e9;
  color: #2e7d32;
}

.news__category--recruit {
  background: #fff3e0;
  color: #e65100;
}

.news__title {
  flex: 1;
  font-size: 0.9375rem;
  line-height: 1.5;
}

/* [MIGRATED to _asakayama-mobile.css §37] mobile-first min-width overrides */
/* max-width queries removed per project mobile-first rule */

/* ================================================================
   [DEPRECATED] icon-links - 削除済（sz-pickupに統合）
   ================================================================ */

/* ================================================================
   バナーエリア（非表示 - アイコンリンクに置き換え）
   ================================================================ */
.banners {
  display: none;
}

.banners__grid {
  max-width: 1200px;
  margin: 0 auto 30px;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 30px;
}

.banners__item {
  position: relative;
  display: block;
  height: 200px;
  border-radius: 16px;
  overflow: hidden;
  text-decoration: none;
  color: var(--color-white);
}

.banners__item img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.banners__item:hover img {
  transform: scale(1.05);
}

.banners__item::before {
  content: '';
  position: absolute;
  inset: 0;
  z-index: 1;
}

.banners__item--recruit::before {
  background: linear-gradient(135deg, rgba(230, 81, 0, 0.9), rgba(230, 81, 0, 0.6));
}

.banners__item--dialysis::before {
  background: linear-gradient(135deg, rgba(17, 79, 161, 0.9), rgba(17, 79, 161, 0.6));
}

.banners__content {
  position: relative;
  z-index: 2;
  padding: 30px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.banners__en {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.75rem;
  letter-spacing: 0.2em;
  opacity: 0.8;
}

.banners__ttl {
  font-size: 1.5rem;
  font-weight: 700;
  margin-top: 8px;
}

.banners__sub {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  justify-content: center;
  gap: 20px;
  flex-wrap: wrap;
}

.banners__sub-item {
  padding: 12px 24px;
  background: var(--color-white);
  border: 1px solid #ddd;
  border-radius: 8px;
  text-decoration: none;
  color: var(--sz-text, #222);
  font-size: 0.875rem;
  transition: all 0.3s ease;
}

.banners__sub-item:hover {
  background: var(--sz-primary-50, #E8F0FA);
  border-color: var(--sz-primary, #114FA1);
  color: var(--sz-primary, #114FA1);
}

/* [MIGRATED to _asakayama-mobile.css §38] mobile-first min-width overrides */
/* max-width queries removed per project mobile-first rule */

/* ================================================================
   外部リンク（非表示 - 新しいバナーに置き換え）
   ================================================================ */
.external-links {
  display: none;
}

/* ================================================================
   関連施設紹介（浅香山Group完全再現 - CMS管理）
   ================================================================ */
.sz-facilities {
  padding: 80px 0 60px;
  background: linear-gradient(180deg, #edf5f0 0%, #f6faf8 40%, #fff 100%);
}

.sz-facilities__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 40px;
}

/* --- ヒーロー：メイン施設（左写真 + 右テキスト） --- */
.sz-facilities__hero {
  display: flex;
  gap: 48px;
  align-items: flex-start;
  margin-bottom: 48px;
}

.sz-facilities__hero-photo {
  flex: 0 0 55%;
  max-width: 55%;
}

.sz-facilities__hero-photo img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  display: block;
}

.sz-facilities__hero-placeholder {
  width: 100%;
  aspect-ratio: 4/3;
  background: linear-gradient(145deg, #e8f5ef, #f0f8f4);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sz-facilities__hero-placeholder .material-symbols-outlined {
  font-size: 4rem;
  color: rgba(72, 187, 143, 0.5);
}

.sz-facilities__hero-caption {
  margin-top: 12px;
  font-size: 0.875rem;
  color: #4a5568;
  font-weight: 500;
}

.sz-facilities__hero-info {
  flex: 1;
  padding-top: 40px;
}

.sz-facilities__hero-desc {
  margin-top: 24px;
  font-size: 0.9375rem;
  color: #4a5568;
  line-height: 2;
}

/* --- ヘッダー（メイン施設がない場合のフォールバック） --- */
.sz-facilities__header {
  text-align: center;
  margin-bottom: 48px;
}

.sz-facilities__label {
  display: block;
  font-family: var(--sz-font-en, 'Inter', sans-serif);
  font-size: 0.8125rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  color: #48bb8f;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.sz-facilities__ttl {
  font-size: 1.75rem;
  font-weight: 700;
  color: #1a365d;
  letter-spacing: 0.05em;
  margin-bottom: 0;
}

.sz-facilities__desc {
  font-size: 0.9375rem;
  color: #64748b;
  line-height: 1.8;
  max-width: 600px;
  margin: 12px auto 0;
}

/* --- カードグリッド（4列×2行） --- */
.sz-facilities__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.25rem;
}

.sz-facilities__card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  text-decoration: none;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  transition: all 0.35s ease;
  position: relative;
}

a.sz-facilities__card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(72, 187, 143, 0.18);
}

.sz-facilities__card-img {
  aspect-ratio: 3/2;
  overflow: hidden;
  background: #e8eef3;
}

.sz-facilities__card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

a.sz-facilities__card:hover .sz-facilities__card-img img {
  transform: scale(1.05);
}

.sz-facilities__card-img .material-symbols-outlined {
  display: flex;
  width: 100%;
  height: 100%;
  align-items: center;
  justify-content: center;
  font-size: 3rem;
  color: rgba(72, 187, 143, 0.6);
  background: linear-gradient(145deg, #e8f5ef 0%, #f0f8f4 100%);
}

.sz-facilities__card-body {
  padding: 0.875rem 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.125rem;
  flex: 1;
}

.sz-facilities__card-sub {
  display: block;
  font-size: 0.6875rem;
  font-weight: 600;
  color: #48bb8f;
  letter-spacing: 0.04em;
}

.sz-facilities__card-name {
  display: block;
  font-size: 0.9375rem;
  font-weight: 700;
  color: #1a365d;
  line-height: 1.4;
}

a.sz-facilities__card:hover .sz-facilities__card-name {
  color: #48bb8f;
}

.sz-facilities__card-arrow {
  position: absolute;
  bottom: 0.875rem;
  right: 0.875rem;
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #48bb8f;
  color: #fff;
  font-size: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.3s ease;
}

a.sz-facilities__card:hover .sz-facilities__card-arrow {
  background: #3a9e78;
  transform: translateX(2px);
}

/* --- 「関連施設一覧をみる」ボタン --- */
.sz-facilities__action {
  display: flex;
  justify-content: center;
  margin-top: 48px;
}

.sz-facilities__btn {
  display: inline-flex;
  align-items: center;
  gap: 16px;
  padding: 14px 40px 14px 48px;
  border: 2px solid #48bb8f;
  border-radius: 50px;
  background: #fff;
  text-decoration: none;
  color: #1a365d;
  font-size: 0.9375rem;
  font-weight: 600;
  letter-spacing: 0.05em;
  transition: all 0.3s ease;
}

.sz-facilities__btn:hover {
  background: #48bb8f;
  color: #fff;
}

.sz-facilities__btn-circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: #48bb8f;
  color: #fff;
  transition: all 0.3s ease;
}

.sz-facilities__btn-circle .material-symbols-outlined {
  font-size: 1.125rem;
}

.sz-facilities__btn:hover .sz-facilities__btn-circle {
  background: #fff;
  color: #48bb8f;
}

/* [MIGRATED to _asakayama-mobile.css §39] mobile-first min-width overrides */
/* max-width queries removed per project mobile-first rule */

/* ================================================================
   外部バナーリンク（CMS管理）
   ================================================================ */
.sz-banners {
  padding: 40px 0 60px;
  background: #fff;
}

.sz-banners__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 40px;
}

.sz-banners__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1rem;
}

.sz-banners__item {
  display: block;
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #e0e0e0;
  transition: all 0.3s ease;
}

.sz-banners__item:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  transform: translateY(-2px);
}

.sz-banners__item img {
  width: 100%;
  height: auto;
  display: block;
}

.sz-banners__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 80px;
  padding: 16px;
  font-size: 0.8125rem;
  font-weight: 600;
  color: #4a5568;
  background: #f7fafc;
  text-align: center;
  line-height: 1.4;
}

/* [MIGRATED to _asakayama-mobile.css] mobile-first min-width overrides */
/* sz-banners max-width queries removed per project mobile-first rule */

/* ================================================================
   リンクカード（5つ横並び）
   ================================================================ */
.link-cards {
  padding: 60px 40px;
  background: var(--color-white);
}

.link-cards__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 20px;
}

.link-cards__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 30px 20px;
  background: var(--color-white);
  border: 2px solid var(--sz-primary, #114FA1);
  border-radius: 12px;
  text-decoration: none;
  color: var(--sz-text, #222);
  min-height: 120px;
  transition: all 0.3s ease;
}

.link-cards__item:hover {
  background: rgba(17, 79, 161, 0.05);
  transform: translateY(-3px);
  box-shadow: 0 6px 20px rgba(17, 79, 161, 0.15);
}

.link-cards__text {
  font-size: 0.9375rem;
  font-weight: 600;
  line-height: 1.5;
  margin-bottom: 12px;
}

.link-cards__arrow {
  font-size: 1.25rem;
  color: var(--sz-primary, #114FA1);
}

/* [MIGRATED to _asakayama-mobile.css] mobile-first min-width overrides */
/* link-cards max-width queries removed per project mobile-first rule */

/* ================================================================
   採用・健診バナー
   ================================================================ */
/* ================================================================
   採用情報（浅香山スタイル - 5カードバナー横並び）
   各カードはフルサイズ写真風バナー。画像差し替えだけでデザイン更新可能。
   ================================================================ */
.sz-recruit {
  padding: 40px 0;
  background: #fff;
}

.sz-recruit__inner {
  max-width: 1400px;
  margin: 0 auto;
  padding: 0 40px;
}

.sz-recruit__header {
  text-align: left;
  margin-bottom: 32px;
}

.sz-recruit__label {
  display: block;
  font-family: var(--sz-font-en, 'Inter', sans-serif);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  color: #48bb8f;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.sz-recruit__ttl {
  font-size: 1.75rem;
  font-weight: 700;
  color: #1a365d;
  letter-spacing: 0.05em;
}

.sz-recruit__grid {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 1rem;
}

/* カード共通 */
.sz-recruit__card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 12px;
  overflow: hidden;
  text-decoration: none;
  color: #fff;
  aspect-ratio: 3 / 4;
  transition: all 0.35s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  background-size: cover;
  background-position: center;
}

.sz-recruit__card:hover {
  transform: translateY(-6px);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.18);
}

/* グラデーションオーバーレイ */
.sz-recruit__card-overlay {
  position: absolute;
  inset: 0;
  opacity: 0.85;
  transition: opacity 0.35s ease;
  z-index: 1;
}

.sz-recruit__card:hover .sz-recruit__card-overlay {
  opacity: 0.75;
}

/* バリエーション別 → 統一淡色メインカラー */
.sz-recruit__card--main .sz-recruit__card-overlay,
.sz-recruit__card--doctor .sz-recruit__card-overlay,
.sz-recruit__card--nurse .sz-recruit__card-overlay,
.sz-recruit__card--comedical .sz-recruit__card-overlay,
.sz-recruit__card--office .sz-recruit__card-overlay {
  background: var(--sz-primary, #114FA1);
}

/* アイコン */
.sz-recruit__card-icon {
  position: relative;
  z-index: 2;
  font-size: 2.5rem;
  margin-bottom: 16px;
  opacity: 0.7;
}

/* テキストブロック */
.sz-recruit__card-body {
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 6px;
  text-align: center;
}

.sz-recruit__card-title {
  font-size: 1.15rem;
  font-weight: 700;
  letter-spacing: 0.05em;
}

.sz-recruit__card-sub {
  font-size: 0.7rem;
  font-weight: 500;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  opacity: 0.75;
}

/* もっと見る矢印 */
.sz-recruit__card-more {
  position: absolute;
  bottom: 16px;
  right: 16px;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border: 2px solid rgba(255, 255, 255, 0.6);
  border-radius: 50%;
  transition: all 0.3s ease;
}

.sz-recruit__card-more .material-symbols-outlined {
  font-size: 1.125rem;
}

.sz-recruit__card:hover .sz-recruit__card-more {
  border-color: #fff;
  background: rgba(255, 255, 255, 0.2);
}

/* [MIGRATED to _asakayama-mobile.css] mobile-first min-width overrides */
/* sz-recruit max-width queries removed per project mobile-first rule */

/* ================================================================
   採用情報 画像バナーカード（浅香山風 — 管理画面から画像差替可能）
   ================================================================ */
.sz-recruit__banner-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(0.75rem, 2vw, 1.25rem);
}

.sz-recruit__banner-card {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 12px;
  text-decoration: none;
  color: #fff;
  aspect-ratio: 4 / 3;
  transition: transform 0.35s ease, box-shadow 0.35s ease;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.sz-recruit__banner-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.16);
}

.sz-recruit__banner-img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.sz-recruit__banner-card:hover .sz-recruit__banner-img {
  transform: scale(1.04);
}

.sz-recruit__banner-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, var(--color-primary, #114FA1) 0%, var(--color-primary-hover, #0D3A75) 100%);
}

.sz-recruit__banner-placeholder .material-symbols-outlined {
  font-size: 3rem;
  color: rgba(255, 255, 255, 0.3);
}

.sz-recruit__banner-card--default:nth-child(1) .sz-recruit__banner-placeholder {
  background: linear-gradient(135deg, var(--color-primary, #114FA1) 0%, var(--color-primary-hover, #0D3A75) 100%);
}

.sz-recruit__banner-card--default:nth-child(2) .sz-recruit__banner-placeholder {
  background: linear-gradient(135deg, var(--color-brand-accent, #2E6BC3) 0%, var(--color-primary, #114FA1) 100%);
}

.sz-recruit__banner-card--default:nth-child(3) .sz-recruit__banner-placeholder {
  background: linear-gradient(135deg, var(--color-primary-light, #E8F0FA) 0%, var(--color-brand-accent, #2E6BC3) 100%);
}

.sz-recruit__banner-card--default:nth-child(4) .sz-recruit__banner-placeholder {
  background: linear-gradient(135deg, var(--color-primary, #114FA1) 0%, var(--color-brand-accent-hover, #1D5AAF) 100%);
}

.sz-recruit__banner-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.55) 0%,
    rgba(0, 0, 0, 0.1) 50%,
    rgba(0, 0, 0, 0) 100%
  );
  z-index: 1;
  transition: opacity 0.35s ease;
}

.sz-recruit__banner-card:hover .sz-recruit__banner-overlay {
  opacity: 0.8;
}

.sz-recruit__banner-body {
  position: absolute;
  inset-block-end: 0;
  inset-inline: 0;
  z-index: 2;
  padding: clamp(1rem, 3vw, 1.5rem);
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.sz-recruit__banner-sub {
  font-family: var(--sz-font-en, 'Inter', sans-serif);
  font-size: clamp(0.625rem, 1.5vw, 0.75rem);
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  opacity: 0.8;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}

.sz-recruit__banner-title {
  font-size: clamp(1.125rem, 2.5vw, 1.5rem);
  font-weight: 700;
  letter-spacing: 0.04em;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
  text-wrap: balance;
  word-break: auto-phrase;
}

.sz-recruit__banner-desc {
  font-size: clamp(0.75rem, 1.5vw, 0.875rem);
  opacity: 0.85;
  line-height: 1.5;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}

/* Banner grid responsive */
@media (min-width: 480px) {
  .sz-recruit__banner-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .sz-recruit__banner-card {
    aspect-ratio: 3 / 4;
  }
}

@media (min-width: 768px) {
  .sz-recruit__banner-grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .sz-recruit__banner-card {
    aspect-ratio: 3 / 4;
  }
}

@media (min-width: 1024px) {
  .sz-recruit__banner-grid {
    gap: 1.25rem;
  }

  .sz-recruit__banner-card {
    aspect-ratio: 3 / 4;
    border-radius: 16px;
  }
}

/* Wearable banner */
@media (max-width: 279px) {
  .sz-recruit__banner-card {
    aspect-ratio: 16 / 9;
    border-radius: 8px;
  }

  .sz-recruit__banner-body {
    padding: 8px;
  }

  .sz-recruit__banner-title {
    font-size: 0.875rem;
  }

  .sz-recruit__banner-sub {
    font-size: 0.5625rem;
  }
}

/* ================================================================
   [DEPRECATED] action-buttons - 削除済（sz-download-v2に統合）
   ================================================================ */

/* ================================================================
   ヒーロースライド画像（インラインスタイル排除）
   ================================================================ */
.hero-slide-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hero-slide-img--1 {
  background-color: #f0f0f0;
}

.hero-slide-img--2 {
  background-color: #e0e0e0;
}

.hero-slide-img--3 {
  background-color: #d0d0d0;
}

/* ================================================================
   よくアクセスされるページのご案内（木古内スタイル - 第二フッター）
   - 左にタイトル、右にグリッドレイアウト
   - シンプルで上品なデザイン
   ================================================================ */
.sz-popular-footer {
  padding: 60px 40px;
  background: #fff;
  border-top: 1px solid #e5e7eb;
}

.sz-popular-footer__inner {
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 60px;
  align-items: start;
}

/* 左側ヘッダー */
.sz-popular-footer__header {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.sz-popular-footer__icon {
  font-size: 1.75rem;
  color: #9ca3af;
  margin-bottom: 0.5rem;
}

.sz-popular-footer__ttl {
  font-size: 1rem;
  font-weight: 600;
  color: #1f2937;
  line-height: 1.6;
  margin: 0;
}

.sz-popular-footer__en {
  font-size: 0.75rem;
  color: #9ca3af;
  letter-spacing: 0.05em;
}

/* 右側グリッド */
.sz-popular-footer__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
}

.sz-popular-footer__item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 1.25rem 1rem;
  text-decoration: none;
  transition: background 0.2s ease;
  border-radius: 4px;
}

.sz-popular-footer__item:hover {
  background: #f9fafb;
}

.sz-popular-footer__item-icon {
  font-size: 1.5rem;
  color: #6b7280;
  margin-bottom: 0.75rem;
}

.sz-popular-footer__item-title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #1f2937;
  line-height: 1.4;
  margin-bottom: 0.25rem;
}

.sz-popular-footer__item:hover .sz-popular-footer__item-title {
  color: var(--sz-primary, #114FA1);
}

.sz-popular-footer__item-en {
  font-size: 0.6875rem;
  color: #9ca3af;
  letter-spacing: 0.02em;
}

/* [MIGRATED to _asakayama-mobile.css] mobile-first min-width overrides */
/* sz-popular-footer max-width queries removed per project mobile-first rule */

/* ================================================================
   オンラインサービス（AI問診・診療予約）
   ================================================================ */
.sz-online {
  padding: 80px 40px 60px;
  background: linear-gradient(135deg, #f0f7ff 0%, #e8f4f8 100%);
}

.sz-online__inner {
  max-width: 1100px;
  margin: 0 auto;
}

.sz-online__header {
  text-align: center;
  margin-bottom: 40px;
}

.sz-online__label {
  display: block;
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--color-accent, #114FA1);
  margin-bottom: 8px;
}

.sz-online__ttl {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--color-text, #1a1a1a);
}

.sz-online__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.sz-online__card {
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 28px 32px;
  background: #fff;
  border-radius: var(--radius-lg, 12px);
  border: 1px solid rgba(17, 79, 161, 0.1);
  text-decoration: none;
  color: inherit;
  transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}

.sz-online__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(17, 79, 161, 0.12);
  border-color: rgba(17, 79, 161, 0.25);
}

.sz-online__card-icon {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  font-size: 1.75rem;
  transition: transform 0.25s ease;
}

.sz-online__card:hover .sz-online__card-icon {
  transform: scale(1.08);
}

.sz-online__card--ai .sz-online__card-icon {
  background: linear-gradient(135deg, #6366f1 0%, #818cf8 100%);
  color: #fff;
}

.sz-online__card--reserve .sz-online__card-icon {
  background: linear-gradient(135deg, #059669 0%, #34d399 100%);
  color: #fff;
}

.sz-online__card-body {
  flex: 1;
  min-width: 0;
}

.sz-online__card-title {
  font-size: 1.15rem;
  font-weight: 700;
  color: var(--color-text, #1a1a1a);
  margin: 0 0 6px;
}

.sz-online__card-desc {
  font-size: 0.85rem;
  line-height: 1.6;
  color: #555;
  margin: 0;
}

.sz-online__card-arrow {
  flex-shrink: 0;
  font-size: 1.375rem;
  color: #bbb;
  transition: color 0.25s ease, transform 0.25s ease;
}

.sz-online__card:hover .sz-online__card-arrow {
  color: var(--color-accent, #114FA1);
  transform: translateX(3px);
}

/* [MIGRATED to _asakayama-mobile.css] mobile-first min-width overrides */
/* sz-online max-width queries removed per project mobile-first rule */

/* ================================================================
   よくアクセスされるページ v2（浅香山スタイル - 緑テーマ）
   ================================================================ */
.sz-popular-v2 {
  padding: 40px 40px;
  background: #f5f8fa;
}

.sz-popular-v2::before {
  display: none;
}

.sz-popular-v2__inner {
  max-width: 1200px;
  margin: 0 auto;
}

.sz-popular-v2__header {
  text-align: left;
  margin-bottom: 32px;
}

.sz-popular-v2__label {
  display: block;
  font-family: var(--sz-font-en, 'Inter', sans-serif);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.2em;
  color: #48bb8f;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.sz-popular-v2__ttl {
  font-size: 1.75rem;
  font-weight: 700;
  color: #1a365d;
  letter-spacing: 0.05em;
}

.sz-popular-v2__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem;
}

.sz-popular-v2__card {
  display: flex;
  align-items: center;
  gap: 1.25rem;
  padding: 1.5rem 2rem;
  background: #fff;
  border-radius: 12px;
  text-decoration: none;
  transition: all 0.35s ease;
  border: 1px solid #e8eef3;
}

.sz-popular-v2__card:hover {
  transform: translateY(-3px);
  box-shadow: 0 8px 24px rgba(72, 187, 143, 0.15);
  border-color: #48bb8f;
}

.sz-popular-v2__card-icon {
  font-size: 1.375rem;
  color: #48bb8f;
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(72, 187, 143, 0.1);
  border-radius: 50%;
  transition: all 0.25s ease;
}

.sz-popular-v2__card:hover .sz-popular-v2__card-icon {
  background: #48bb8f;
  color: #fff;
}

.sz-popular-v2__card-text {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
  flex: 1;
}

.sz-popular-v2__card-en {
  display: block;
  font-size: 0.65rem;
  font-weight: 700;
  color: #48bb8f;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.sz-popular-v2__card-title {
  font-size: 1rem;
  font-weight: 700;
  color: #1a365d;
  line-height: 1.4;
  transition: color 0.3s ease;
}

.sz-popular-v2__card:hover .sz-popular-v2__card-title {
  color: #48bb8f;
}

.sz-popular-v2__card-arrow {
  font-size: 1.125rem;
  color: #c0c8d0;
  transition: color 0.3s ease;
}

.sz-popular-v2__card:hover .sz-popular-v2__card-arrow {
  color: #48bb8f;
}

/* [MIGRATED to _asakayama-mobile.css §35] mobile-first min-width overrides */
/* sz-download-v2 / sz-popular-v2 max-width queries removed per project mobile-first rule */
/* ================================================================
   ウェアラブル・超小型スマホ対応 (320px以下)
   Apple Watch, Galaxy Watch, 小型スマートフォン
   ================================================================ */
@media (max-width: 320px) {
  /* ----------------------------------------------------------------
     基本設定
     ---------------------------------------------------------------- */
  body {
    font-size: max(12px, 1rem);
  }

  /* タッチターゲット最小サイズ確保 */
  a, button {
    min-height: 44px;
  }

  /* ----------------------------------------------------------------
     ヒーローセクション
     ---------------------------------------------------------------- */
  .sz-hero {
    min-height: 250px;
    padding-top: calc(64px + 6px);
  }

  .sz-hero__main {
    height: 180px;
    top: 10px;
    left: 10px;
    right: 10px;
    bottom: 10px;
    border-radius: 12px;
  }

  .sz-hero__content {
    padding: 0;
    top: 20px;
    left: 15px;
    bottom: auto;
    width: auto;
    max-width: none;
  }

  .sz-hero__txt-main-text {
    font-size: 0.85rem;
    line-height: 1.4;
  }

  .sz-hero__txt-sub-text {
    font-size: 0.625rem;
    margin-top: 4px;
  }

  .sz-hero__recruit {
    width: 55px;
    height: 55px;
    right: 6px;
    top: calc(64px + 6px);
  }

  .sz-hero__recruit-label {
    font-size: 0.4375rem;
    margin-bottom: 1px;
  }

  .sz-hero__recruit-title {
    font-size: 0.5rem;
    line-height: 1.2;
  }

  /* ----------------------------------------------------------------
     重要なお知らせ
     ---------------------------------------------------------------- */
  .important-news {
    padding: 12px 8px;
  }

  .important-news__inner {
    padding: 12px;
    border-radius: 8px;
  }

  .important-news__link {
    padding: 10px 8px;
    gap: 6px;
  }

  .important-news__icon {
    font-size: 1rem;
  }

  .important-news__date {
    font-size: 0.75rem;
    min-width: auto;
  }

  .important-news__separator {
    width: 12px;
  }

  .important-news__title {
    flex-basis: 100%;
    padding-left: 0;
    font-size: 0.8rem;
    margin-top: 4px;
  }

  /* ----------------------------------------------------------------
     ガイドセクション
     ---------------------------------------------------------------- */
  .guide-section {
    padding: 30px 10px;
  }

  .guide-cards {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .guide-card {
    flex-direction: row;
    padding: 14px 12px;
    gap: 12px;
    align-items: center;
  }

  .guide-card__icon {
    width: 44px;
    height: 44px;
    margin-bottom: 0;
    flex-shrink: 0;
  }

  .guide-card__icon img,
  .guide-card__icon .material-symbols-outlined {
    font-size: 1.375rem;
    width: 22px;
    height: 22px;
  }

  .guide-card__txt {
    font-size: 0.85rem;
    text-align: left;
  }

  .guide-card__txt br {
    display: none;
  }

  .guide-card__arrow {
    font-size: 1.125rem;
    margin-left: auto;
  }

  .guide-info {
    padding: 16px 12px;
    margin-top: 16px;
  }

  .guide-info__ttl {
    font-size: 0.9rem;
  }

  .guide-info__time strong {
    font-size: 1.125rem;
  }

  .guide-info__link {
    padding: 10px 16px;
    font-size: 0.8rem;
  }

  /* ----------------------------------------------------------------
     当院の特徴
     ---------------------------------------------------------------- */
  .feature-v2 {
    padding: 30px 10px;
  }

  .feature-v2__inner {
    flex-direction: column;
  }

  .feature-v2__left {
    padding: 0 0 20px;
    text-align: center;
  }

  .feature-v2__en {
    font-size: 0.65rem;
  }

  .feature-v2__label {
    font-size: 0.7rem;
    margin-bottom: 8px;
  }

  .feature-v2__ttl {
    font-size: 1.3rem;
    margin-bottom: 16px;
  }

  .feature-v2__nav {
    flex-direction: row;
    justify-content: center;
  }

  .feature-v2__right {
    width: 100%;
  }

  .feature-v2__card {
    border-radius: 12px;
  }

  .feature-v2__card-body {
    padding: 16px;
  }

  .feature-v2__card-ttl {
    font-size: 1rem;
  }

  /* ----------------------------------------------------------------
     地域医療連携
     ---------------------------------------------------------------- */
  .community-v2 {
    padding: 30px 10px;
  }

  .community-v2__header {
    margin-bottom: 24px;
  }

  .community-v2__en {
    font-size: 0.65rem;
  }

  .community-v2__label {
    font-size: 0.7rem;
  }

  .community-v2__ttl {
    font-size: 1.2rem;
    line-height: 1.4;
  }

  .community-v2__cards {
    gap: 16px;
  }

  .community-v2__card {
    width: 100%;
    border-radius: 12px;
  }

  .community-v2__card-body {
    padding: 16px;
  }

  .community-v2__card-ttl {
    font-size: 1rem;
    margin-bottom: 12px;
  }

  .community-v2__card-list li a {
    font-size: 0.8rem;
    padding: 10px 0;
  }

  /* ----------------------------------------------------------------
     専門外来 (320px)
     ---------------------------------------------------------------- */
  .specialty-clinic {
    padding: 24px 10px;
  }

  .specialty-clinic__header {
    margin-bottom: 16px;
  }

  .specialty-clinic__ttl {
    font-size: 1.1rem;
  }

  .specialty-clinic__sub {
    font-size: 0.75rem;
  }

  .specialty-clinic__grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .specialty-clinic__card {
    flex-direction: row;
    text-align: left;
    padding: 12px 14px;
    border-radius: 8px;
    gap: 10px;
  }

  .specialty-clinic__card-icon {
    width: 40px;
    height: 40px;
    margin-bottom: 0;
  }

  .specialty-clinic__card-icon .material-symbols-outlined {
    font-size: 1.25rem;
  }

  .specialty-clinic__card-ttl {
    font-size: 0.875rem;
  }

  .specialty-clinic__card-schedule {
    font-size: 0.6875rem;
  }

  .specialty-clinic__card-arrow {
    margin-top: 0;
    margin-left: auto;
    width: 22px;
    height: 22px;
  }

  .specialty-clinic__card-arrow .material-symbols-outlined {
    font-size: 0.75rem;
  }

  .specialty-clinic__btn-all {
    font-size: 0.8125rem;
    padding: 10px 20px;
  }

  /* ----------------------------------------------------------------
     お知らせ
     ---------------------------------------------------------------- */
  .news-v2 {
    padding: 30px 10px;
  }

  .news-v2__inner {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .news-v2__left {
    text-align: center;
    padding-bottom: 16px;
    border-bottom: 1px solid #eee;
  }

  .news-v2__en {
    font-size: 0.65rem;
  }

  .news-v2__ttl {
    font-size: 1.3rem;
  }

  .news-v2__more {
    margin-top: 12px;
  }

  .news-v2__tabs {
    flex-wrap: wrap;
    gap: 6px;
    justify-content: center;
    margin-bottom: 16px;
  }

  .news-v2__tab {
    padding: 8px 12px;
    font-size: 0.7rem;
  }

  .news-v2__item {
    padding: 10px 0;
  }

  .news-v2__link {
    flex-wrap: wrap;
    gap: 6px;
  }

  .news-v2__date {
    font-size: 0.7rem;
  }

  .news-v2__category {
    font-size: 0.6rem;
    padding: 2px 6px;
  }

  .news-v2__title {
    flex-basis: 100%;
    font-size: 0.85rem;
    padding-left: 0;
    margin-top: 4px;
  }

  .news-v2__new {
    font-size: 0.6rem;
    padding: 2px 4px;
  }

  /* ----------------------------------------------------------------
     ピックアップ
     ---------------------------------------------------------------- */
  .sz-pickup {
    padding: 30px 10px;
  }

  .sz-pickup__header {
    margin-bottom: 24px;
  }

  .sz-pickup__en {
    font-size: 0.65rem;
  }

  .sz-pickup__ttl {
    font-size: 1.3rem;
  }

  .sz-pickup__grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .sz-pickup__card {
    display: flex;
    flex-direction: row;
    border-radius: 8px;
  }

  .sz-pickup__card-img {
    width: 80px;
    aspect-ratio: 1/1;
    flex-shrink: 0;
  }

  .sz-pickup__card-img--icon {
    width: 80px;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sz-pickup__card-img--icon .material-symbols-outlined {
    font-size: 2rem;
  }

  .sz-pickup__card-txt {
    flex: 1;
    display: flex;
    align-items: center;
    padding: 12px 16px;
    font-size: 0.85rem;
  }

  /* ----------------------------------------------------------------
     ダウンロード
     ---------------------------------------------------------------- */
  .sz-download-v2 {
    padding: 30px 10px;
  }

  .sz-download-v2__header {
    margin-bottom: 24px;
  }

  .sz-download-v2__en {
    font-size: 0.65rem;
  }

  .sz-download-v2__ttl {
    font-size: 1.3rem;
  }

  .sz-download-v2__grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .sz-download-v2__card {
    display: flex;
    flex-direction: row;
    border-radius: 8px;
  }

  .sz-download-v2__card-img {
    width: 80px;
    aspect-ratio: 1/1;
    flex-shrink: 0;
  }

  .sz-download-v2__card-body {
    flex: 1;
    padding: 12px 16px;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .sz-download-v2__card-en {
    font-size: 0.6rem;
  }

  .sz-download-v2__card-title {
    font-size: 0.85rem;
  }

  /* ----------------------------------------------------------------
     よくアクセスされるページ
     ---------------------------------------------------------------- */
  .sz-popular-v2 {
    padding: 30px 10px;
  }

  .sz-popular-v2__header {
    margin-bottom: 24px;
  }

  .sz-popular-v2__en {
    font-size: 0.65rem;
  }

  .sz-popular-v2__ttl {
    font-size: 1.2rem;
  }

  .sz-popular-v2__grid {
    grid-template-columns: 1fr;
    gap: 8px;
  }

  .sz-popular-v2__card {
    flex-direction: row;
    padding: 14px 16px;
    gap: 12px;
    align-items: center;
  }

  .sz-popular-v2__card-icon {
    font-size: 1.75rem;
    margin-bottom: 0;
  }

  .sz-popular-v2__card-en {
    font-size: 0.6rem;
    margin-bottom: 2px;
  }

  .sz-popular-v2__card-title {
    font-size: 0.85rem;
  }

  /* ----------------------------------------------------------------
     採用バナー
     ---------------------------------------------------------------- */
  .recruit-banners {
    padding: 30px 10px;
  }

  .recruit-banners__top {
    flex-direction: column;
    gap: 12px;
  }

  .recruit-banners__main {
    min-height: 120px;
    border-radius: 12px;
  }

  .recruit-banners__main-en {
    font-size: 0.9rem;
  }

  .recruit-banners__main-label {
    font-size: 0.7rem;
  }

  .recruit-banners__tag {
    font-size: 0.6rem;
    padding: 3px 8px;
  }

  .recruit-banners__bottom {
    flex-direction: column;
    gap: 8px;
  }

  .recruit-banners__sub {
    height: 80px;
    border-radius: 8px;
  }

  .recruit-banners__sub-label {
    font-size: 0.75rem;
  }

  /* ----------------------------------------------------------------
     外部バナー
     ---------------------------------------------------------------- */
  .external-banners {
    padding: 20px 10px;
  }

  .external-banners__inner {
    flex-direction: column;
    gap: 10px;
  }

  .external-banners__item {
    height: 50px;
    border-radius: 6px;
  }

  .external-banners__item img {
    max-height: 100%;
    width: auto;
  }
}

/* ================================================================
   フローティングCTAボタン（ヒーロー内右サイド固定 - 淡色デザイン）
   ================================================================ */
.sz-floating-cta {
  position: absolute;
  right: 20px;
  top: auto;
  bottom: 20px;
  transform: none;
  z-index: 20;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.sz-floating-cta__btn {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 18px;
  text-decoration: none;
  font-size: 0.85rem;
  font-weight: 700;
  line-height: 1.3;
  border-radius: 50px;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  writing-mode: horizontal-tb;
  white-space: nowrap;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

.sz-floating-cta__btn:hover {
  transform: translateX(-4px);
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.15);
}

.sz-floating-cta__btn--schedule {
  background: #5ebb8f;
  color: #fff;
}

.sz-floating-cta__btn--cooperation {
  background: #e8a458;
  color: #fff;
}

.sz-floating-cta__btn--access {
  background: #6ba3d6;
  color: #fff;
}

.sz-floating-cta__icon {
  font-size: 1.375rem;
  flex-shrink: 0;
  background: rgba(255,255,255,0.3);
  width: 34px;
  height: 34px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}

.sz-floating-cta__label {
  line-height: 1.4;
  flex: 1;
}

.sz-floating-cta__label small {
  font-size: 0.7rem;
  font-weight: 500;
  opacity: 0.9;
}

.sz-floating-cta__arrow {
  font-size: 1.125rem;
  opacity: 0.8;
  margin-left: auto;
}

/* [MIGRATED to _asakayama-mobile.css §29] mobile-first min-width overrides */
/* sz-floating-cta max-width queries removed per project mobile-first rule */

/* ================================================================
   当院の特徴セクション（加須参考）
   ================================================================ */
.sz-features__label {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  color: var(--color-primary, #0077c7);
  margin-bottom: 8px;
}

.sz-features__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 40px;
}

.sz-features__card {
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--color-border, #e5e5e5);
  border-radius: 12px;
  padding: 32px 28px;
  text-decoration: none;
  color: var(--color-text-main, #23221e);
  transition: box-shadow 0.2s, transform 0.2s;
  position: relative;
}

.sz-features__card:hover {
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.08);
  transform: translateY(-2px);
}

.sz-features__card-num {
  font-family: 'Inter', sans-serif;
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--color-primary, #0077c7);
  opacity: 0.2;
  line-height: 1;
  margin-bottom: 16px;
}

.sz-features__card-title {
  font-size: 1.15rem;
  font-weight: 700;
  margin-bottom: 12px;
  color: var(--color-text-main, #23221e);
}

.sz-features__card-desc {
  font-size: 0.9rem;
  line-height: 1.8;
  color: var(--color-text-sub, #6b6560);
  flex: 1;
}

.sz-features__card-arrow {
  align-self: flex-end;
  font-size: 1.25rem;
  color: var(--color-primary, #0077c7);
  margin-top: 16px;
  opacity: 0;
  transition: opacity 0.2s;
}

.sz-features__card:hover .sz-features__card-arrow {
  opacity: 1;
}

.sz-features__bottom {
  text-align: center;
  margin-top: 32px;
}

.sz-features__btn-all {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--color-primary, #0077c7);
  font-weight: 600;
  font-size: 0.95rem;
  text-decoration: none;
  padding: 12px 24px;
  border: 2px solid var(--color-primary, #0077c7);
  border-radius: 8px;
  transition: all 0.2s;
}

.sz-features__btn-all:hover {
  background: var(--color-primary, #0077c7);
  color: #fff;
}

/* [MIGRATED to _asakayama-mobile.css §31] mobile-first min-width overrides */
/* sz-features max-width queries removed per project mobile-first rule */

/* ================================================================
   地域医療連携セクション（浅香山グループ施設スタイル）
   ================================================================ */
.sz-community {
  padding: 40px 0;
  background: linear-gradient(180deg, #e8f5ee 0%, #f0f7f3 100%);
}

.sz-community__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}

/* ---- ヒーローエリア（写真左 + テキスト右） ---- */
.sz-community__hero {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 48px;
  align-items: center;
  margin-bottom: 48px;
}

.sz-community__hero-img {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.10);
}

.sz-community__hero-img img {
  width: 100%;
  height: auto;
  display: block;
  aspect-ratio: 4 / 3;
  object-fit: cover;
}

.sz-community__label {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.15em;
  color: #48bb8f;
  margin-bottom: 8px;
}

.sz-community__ttl {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--color-text-main, #23221e);
  margin-bottom: 20px;
  line-height: 1.4;
}

.sz-community__desc {
  font-size: 0.95rem;
  line-height: 2;
  color: var(--color-text-sub, #555);
}

/* ---- フォトカードグリッド ---- */
.sz-community__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
}

.sz-community__card {
  display: block;
  background: #fff;
  border-radius: 10px;
  overflow: hidden;
  text-decoration: none;
  color: var(--color-text-main, #23221e);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  transition: box-shadow 0.3s, transform 0.3s;
}

.sz-community__card:hover {
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.12);
  transform: translateY(-3px);
}

.sz-community__card-img {
  aspect-ratio: 16 / 10;
  overflow: hidden;
}

.sz-community__card-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.4s ease;
}

.sz-community__card:hover .sz-community__card-img img {
  transform: scale(1.05);
}

.sz-community__card-body {
  padding: 14px 16px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.sz-community__card-sub {
  font-size: 0.75rem;
  color: var(--color-text-sub, #888);
  font-weight: 500;
}

.sz-community__card-title {
  font-size: 0.95rem;
  font-weight: 700;
  line-height: 1.4;
}

.sz-community__card-arrow {
  align-self: flex-end;
  font-size: 1.25rem;
  color: #48bb8f;
  margin-top: 4px;
}

/* [MIGRATED to _asakayama-mobile.css §33] mobile-first min-width overrides */
/* sz-community max-width queries removed per project mobile-first rule */

/* ================================================================
   Phase 3: ヒーロー + クイックアクセス モバイル・タブレット対応
   ================================================================ */

/* --- Hero: モバイルベース --- */
.sz-hero {
  display: flex;
  flex-direction: column;
}

.sz-hero__main {
  order: 0;
  height: min(56vh, 22.5rem);
  height: min(56svh, 22.5rem);
  min-height: auto;
  max-height: none;
}

/* 下部グラデーションオーバーレイ */
.sz-hero__main::after {
  content: "";
  position: absolute;
  inset-inline: 0;
  inset-block-end: 0;
  height: 50%;
  background: linear-gradient(to top, var(--color-overlay-dark), transparent);
  z-index: 5;
  pointer-events: none;
}

/* テキスト: 下部配置（グラデーション上） */
.sz-hero__content {
  left: auto;
  top: auto;
  right: auto;
  bottom: auto;
  inset-inline-start: 1rem;
  inset-block-end: 1rem;
}

/* 重要情報バナー: ヒーロー直下（1行コンパクト） */
.sz-hero__notice {
  order: 1;
}

/* 採用バッジ: モバイルでは非表示（クイックアクセスに移動済み） */
.sz-hero__recruit {
  display: none;
}

/* --- クイックアクセス: 2×2グリッド --- */
.sz-floating-cta {
  order: 2;
  position: static;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.5rem;
  padding: 0.75rem 1rem;
  right: auto;
  bottom: auto;
  transform: none;
  z-index: auto;
}

.sz-floating-cta__btn {
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  gap: 0.375rem;
  padding: 0.875rem 0.625rem;
  border-radius: var(--radius-md);
  white-space: normal;
  box-shadow: var(--shadow-card);
}

.sz-floating-cta__btn:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-card-hover);
}

.sz-floating-cta__btn--schedule {
  background: var(--color-success-light);
  color: var(--color-success);
}

.sz-floating-cta__btn--cooperation {
  background: var(--color-warning-light);
  color: var(--color-text-main);
}

.sz-floating-cta__btn--access {
  background: var(--color-primary-light);
  color: var(--color-primary);
}

.sz-floating-cta__btn--recruit {
  background: var(--color-recruit-cta-light);
  color: var(--color-recruit-cta);
}

.sz-floating-cta__icon {
  background: transparent;
  width: auto;
  height: auto;
  font-size: 1.5rem;
  border-radius: 0;
}

.sz-floating-cta__label {
  font-size: clamp(0.6875rem, 0.625rem + 0.25vw, 0.8125rem);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
}

.sz-floating-cta__arrow {
  display: none;
}

/* --- Tablet (768px+) --- */
@media (min-width: 768px) {
  .sz-hero__main {
    height: min(50vh, 31.25rem);
    height: min(50svh, 31.25rem);
    min-height: auto;
    max-height: none;
  }

  .sz-hero__content {
    inset-inline-start: 1.5rem;
    inset-block-end: 1.5rem;
  }

  .sz-hero__txt-main-text {
    font-size: clamp(1.5rem, 1rem + 2vw, 2.5rem);
  }

  .sz-floating-cta {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* --- Desktop (1024px+): 既存PC版復元 --- */
@media (min-width: 1024px) {
  .sz-hero {
    display: block;
  }

  .sz-hero__main {
    height: calc(67vh - var(--header-height, 106px) - 0.75rem);
    height: calc(67dvh - var(--header-height, 106px) - 0.75rem);
    min-height: 340px;
    max-height: 540px;
  }

  .sz-hero__main::after {
    display: none;
  }

  .sz-hero__content {
    left: 80px;
    top: 60px;
    right: auto;
    bottom: auto;
    inset-inline-start: unset;
    inset-block-end: unset;
  }

  .sz-hero__notice {
    order: unset;
  }

  .sz-hero__recruit {
    display: flex;
  }

  .sz-floating-cta {
    order: unset;
    position: absolute;
    display: flex;
    flex-direction: column;
    right: 20px;
    bottom: 20px;
    gap: 10px;
    padding: 0;
    z-index: 20;
  }

  .sz-floating-cta__btn {
    flex-direction: row;
    align-items: center;
    text-align: start;
    gap: 10px;
    padding: 14px 18px;
    border-radius: 50px;
    white-space: nowrap;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  }

  .sz-floating-cta__btn:hover {
    transform: translateX(-4px);
    box-shadow: 0 6px 24px rgba(0, 0, 0, 0.15);
  }

  /* 既存PCカラー復元 */
  .sz-floating-cta__btn--schedule {
    background: var(--color-success);
    color: var(--color-white);
  }

  .sz-floating-cta__btn--cooperation {
    background: var(--color-warning);
    color: var(--color-white);
  }

  .sz-floating-cta__btn--access {
    background: var(--color-primary);
    color: var(--color-white);
  }

  .sz-floating-cta__btn--recruit {
    display: none;
  }

  .sz-floating-cta__icon {
    font-size: 1.375rem;
    background: var(--color-surface-alpha-40);
    width: 34px;
    height: 34px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .sz-floating-cta__label {
    font-size: clamp(0.8125rem, 0.75rem + 0.25vw, 0.9375rem);
    font-weight: var(--font-weight-bold);
    line-height: 1.4;
  }

  .sz-floating-cta__arrow {
    display: block;
    font-size: 1.125rem;
    opacity: 0.8;
    margin-inline-start: auto;
  }
}

/* ============================================================
 * Phase 4: セクション別モバイル・タブレット最適化
 * ============================================================ */

/* ── 4a: guide-section (受付時間) ─────────────── */

/* モバイル: guide-cardsを非表示（Phase 2でSPナビへ移動済） */
.guide-section .guide-cards {
  display: none;
}

.guide-section__inner {
  grid-template-columns: 1fr;
  gap: var(--spacing-md);
}

.guide-section {
  padding: clamp(1.5rem, 4vw, 2.5rem) clamp(1rem, 3vw, 2.5rem);
}

/* アコーディオン: 詳しい診療日程リンク */
.guide-info__accordion-content {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  padding-block-start: var(--spacing-sm);
}

.guide-info__accordion-content .guide-info__link {
  display: flex;
  align-items: center;
  gap: 0.5em;
  color: var(--color-primary);
  font-weight: var(--font-weight-medium);
  font-size: var(--font-size-sm);
  text-decoration: none;
  padding: var(--spacing-sm) var(--spacing-md);
  background: var(--color-primary-light);
  border-radius: var(--radius-sm);
  min-height: 3rem;
}

.guide-info__accordion-content .guide-info__link .material-symbols-outlined {
  font-size: 1.25rem;
  margin-inline-start: auto;
}

/* lg(768px): guide-cards復活 & 2カラムレイアウト */
@media (min-width: 768px) {
  .guide-section .guide-cards {
    display: grid;
  }

  .guide-section__inner {
    grid-template-columns: 1fr 1fr;
    gap: 40px;
  }

  .guide-section {
    padding: 40px;
  }

  .guide-info__accordion-content {
    flex-direction: row;
    gap: var(--spacing-md);
  }

  .guide-info__accordion-content .guide-info__link {
    flex: 1;
  }
}

/* ── 4b: sz-about (アコーディオン) ────────────── */

.sz-about__accordion .sz-about__access {
  padding-block-start: var(--spacing-sm);
}

/* lg(768px)以上: .mobile-accordion → display:contents で自然展開 */

/* ── 4c: sz-features (丸UIコンパクト横スクロール) ───────────── */

.sz-features__grid {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  gap: var(--spacing-sm);
  scrollbar-width: none;
  padding-block-end: var(--spacing-xs);
  -webkit-mask-image: linear-gradient(to right, #000 0%, #000 85%, transparent 100%);
  mask-image: linear-gradient(to right, #000 0%, #000 85%, transparent 100%);
}

.sz-features__grid::-webkit-scrollbar {
  display: none;
}

.sz-features__card {
  flex: 0 0 auto;
  min-width: 0;
  width: auto;
  max-width: none;
  scroll-snap-align: start;
  flex-direction: row;
  align-items: center;
  gap: var(--spacing-xs);
  padding: var(--spacing-xs) var(--spacing-md);
  border-radius: var(--radius-full);
  border-inline-start: none;
  white-space: nowrap;
}

.sz-features__card-num {
  font-size: 0.75rem;
  font-weight: 700;
  opacity: 1;
  margin-bottom: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border-radius: 50%;
  background: var(--color-primary, #0077c7);
  color: var(--color-surface, #fff);
  flex-shrink: 0;
}

.sz-features__card-title {
  font-size: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  margin-bottom: 0;
}

.sz-features__card-desc {
  display: none;
}

.sz-features__card-arrow {
  display: none;
}

/* lg(768px): グリッド復元 */
@media (min-width: 768px) {
  .sz-features__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    overflow-x: visible;
    scroll-snap-type: none;
    scrollbar-width: auto;
    -webkit-mask-image: none;
    mask-image: none;
  }

  .sz-features__card {
    flex: auto;
    width: auto;
    max-width: none;
    flex-direction: column;
    align-items: stretch;
    gap: 0;
    padding: 32px 28px;
    border-radius: 12px;
    border-inline-start: none;
    white-space: normal;
  }

  .sz-features__card-num {
    font-size: 2.5rem;
    opacity: 0.2;
    margin-bottom: 16px;
    display: block;
    width: auto;
    height: auto;
    border-radius: 0;
    background: transparent;
    color: var(--color-primary, #0077c7);
  }

  .sz-features__card-title {
    font-size: 1.15rem;
    margin-bottom: 12px;
  }

  .sz-features__card-desc {
    display: block;
    -webkit-line-clamp: unset;
    overflow: visible;
  }

  .sz-features__card-arrow {
    display: block;
  }
}

/* ── 4f: sz-dept-home (診療科コンパクト化) ────── */

.sz-dept-home__featured {
  display: none;
}

.sz-dept-home__icon-grid {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  gap: var(--spacing-sm);
  padding-block-end: var(--spacing-xs);
  -webkit-mask-image: linear-gradient(to right, #000 0%, #000 85%, transparent 100%);
  mask-image: linear-gradient(to right, #000 0%, #000 85%, transparent 100%);
}

.sz-dept-home__icon-grid::-webkit-scrollbar {
  display: none;
}

.sz-dept-home__icon-item {
  flex: 0 0 auto;
  min-width: 5rem;
  flex-direction: column;
  text-align: center;
  gap: 0.25rem;
  padding: var(--spacing-sm);
  scroll-snap-align: start;
}

.sz-dept-home__icon-arrow {
  display: none;
}

/* lg(768px): featured横スクロール復活 & アイコン行レイアウト */
@media (min-width: 768px) {
  .sz-dept-home__featured {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    gap: var(--spacing-md);
  }

  .sz-dept-home__featured::-webkit-scrollbar {
    display: none;
  }

  .sz-dept-home__photo-card {
    flex: 0 0 40vw;
    max-width: 14rem;
    scroll-snap-align: start;
  }

  .sz-dept-home__icon-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    overflow-x: visible;
    scroll-snap-type: none;
    -webkit-mask-image: none;
    mask-image: none;
  }

  .sz-dept-home__icon-item {
    flex: auto;
    min-width: auto;
    flex-direction: row;
    text-align: start;
    gap: 12px;
    padding: 16px 18px;
  }

  .sz-dept-home__icon-arrow {
    display: block;
  }
}

/* xl(1024px): featured グリッド復元 */
@media (min-width: 1024px) {
  .sz-dept-home__featured {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    overflow-x: visible;
    scroll-snap-type: none;
  }

  .sz-dept-home__photo-card {
    flex: auto;
    max-width: none;
  }
}

/* ── 4g: sz-community (地域医療連携) ──────────── */

.sz-community__hero {
  grid-template-columns: 1fr;
  gap: var(--spacing-lg);
}

.sz-community__grid {
  grid-template-columns: 1fr;
  gap: var(--spacing-md);
}

.sz-community__accordion-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--spacing-md);
  padding-block-start: var(--spacing-md);
}

/* lg(768px): 2カラム + アコーディオン展開 */
@media (min-width: 768px) {
  .sz-community__hero {
    grid-template-columns: 1fr 1fr;
    gap: 48px;
  }

  .sz-community__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }

  .sz-community__accordion-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}

/* xl(1024px): 全4カード1行 */
@media (min-width: 1024px) {
  .sz-community__grid,
  .sz-community__accordion-grid {
    display: contents;
  }

  .sz-community__inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 20px;
  }

  .sz-community__hero {
    grid-column: 1 / -1;
  }
}

/* ── 4h: news-v2 (タブスクロール + リスト制限) ── */

.news-v2__tabs {
  flex-wrap: nowrap;
  gap: 0.375rem;
}

.news-v2__list {
  max-height: 22rem;
  overflow-y: auto;
}

/* lg(768px): 全件表示 */
@media (min-width: 768px) {
  .news-v2__tabs {
    flex-wrap: wrap;
  }

  .news-v2__list {
    max-height: none;
    overflow-y: visible;
  }
}

/* ── 4i: sz-popular-v2 (2列コンパクト) ────────── */

.sz-popular-v2__grid {
  grid-template-columns: repeat(2, 1fr);
  gap: 0.625rem;
}

.sz-popular-v2__card {
  flex-direction: column;
  gap: 0.5rem;
  padding: var(--spacing-md);
  text-align: center;
}

.sz-popular-v2__card-en {
  display: none;
}

.sz-popular-v2__card-icon {
  margin-inline: auto;
}

.sz-popular-v2__card-arrow {
  display: none;
}

/* lg(768px): 3列 & 横並びカード復元 */
@media (min-width: 768px) {
  .sz-popular-v2__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
  }

  .sz-popular-v2__card {
    flex-direction: row;
    gap: 1.25rem;
    padding: 1.5rem 2rem;
    text-align: start;
  }

  .sz-popular-v2__card-en {
    display: block;
  }

  .sz-popular-v2__card-icon {
    margin-inline: 0;
  }

  .sz-popular-v2__card-arrow {
    display: block;
  }
}

/* ── 4j: sz-recruit (横スクロールバナー) ──────── */

.sz-recruit__banner-grid {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  -webkit-mask-image: linear-gradient(to right, #000 0%, #000 85%, transparent 100%);
  mask-image: linear-gradient(to right, #000 0%, #000 85%, transparent 100%);
}

.sz-recruit__banner-grid::-webkit-scrollbar {
  display: none;
}

.sz-recruit__banner-card {
  flex: 0 0 60vw;
  max-width: 16.25rem;
  scroll-snap-align: start;
}

/* md(480px): 引き続き横スクロール（カード幅を縮小） */
@media (min-width: 480px) {
  .sz-recruit__banner-card {
    flex: 0 0 45vw;
    max-width: 14rem;
  }
}

/* lg(768px): 4列グリッド */
@media (min-width: 768px) {
  .sz-recruit__banner-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    overflow-x: visible;
    scroll-snap-type: none;
    -webkit-mask-image: none;
    mask-image: none;
  }

  .sz-recruit__banner-card {
    flex: auto;
    max-width: none;
  }
}

/* ================================================================
   リデザインV2 — 新セクション CSS
   ================================================================ */

/* ----------------------------------------------------------------
   ヒーロー V2（スライダー + 受付パネル + ティッカー）
   ---------------------------------------------------------------- */
.sz-hero-v2 {
  position: relative;
  margin-block-end: 0;
  margin-top: var(--header-mobile-height, 3.5rem); /* SP固定ヘッダー分 */
}

/* --- スライダー --- */
.sz-hero-v2__slider {
  position: relative;
  overflow: hidden;
  width: 100%;
  aspect-ratio: 2 / 1;
  max-height: calc(100svh - var(--header-mobile-height, 3.5rem));
  max-height: calc(100vh - var(--header-mobile-height, 3.5rem)); /* fallback */
}

.sz-hero-v2__track {
  display: flex;
  width: 100%;
  height: 100%;
  transition: transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}

.sz-hero-v2__slide {
  flex: 0 0 100%;
  width: 100%;
  height: 100%;
  position: relative;
  opacity: 0;
  transition: opacity 0.6s ease;
  position: absolute;
  inset: 0;
}

.sz-hero-v2__slide.is-active {
  opacity: 1;
  z-index: 1;
}

.sz-hero-v2__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.sz-hero-v2__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to top,
    rgba(0, 0, 0, 0.55) 0%,
    rgba(0, 0, 0, 0.15) 40%,
    transparent 70%
  );
  pointer-events: none;
  z-index: 2;
}

/* --- キャッチコピー --- */
.sz-hero-v2__content {
  position: absolute;
  bottom: var(--spacing-xl, 2rem);
  left: var(--spacing-lg, 1.5rem);
  z-index: 3;
}

.sz-hero-v2__catch {
  color: var(--color-white, #fff);
  font-size: clamp(1.5rem, 1rem + 2vw, 2.5rem);
  font-weight: var(--font-weight-bold, 700);
  line-height: var(--line-height-tight, 1.3);
  margin: 0;
  text-shadow: 0 2px 8px rgba(0, 0, 0, 0.4);
}

.sz-hero-v2__sub {
  color: rgba(255, 255, 255, 0.8);
  font-size: var(--font-size-sm, 0.875rem);
  letter-spacing: 0.15em;
  margin: var(--spacing-xs, 0.5rem) 0 0;
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
}

/* --- ドットインジケーター --- */
.sz-hero-v2__dots {
  position: absolute;
  bottom: var(--spacing-md, 1rem);
  left: 50%;
  transform: translateX(-50%);
  z-index: 5;
  display: flex;
  gap: var(--spacing-xs, 0.5rem);
}

.sz-hero-v2__dot {
  width: 0.625rem;
  height: 0.625rem;
  border-radius: 50%;
  border: 2px solid var(--color-white, #fff);
  background: transparent;
  padding: 0;
  cursor: pointer;
  transition: background 0.25s ease;
  min-width: 44px;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sz-hero-v2__dot::after {
  content: "";
  display: block;
  width: 0.625rem;
  height: 0.625rem;
  border-radius: 50%;
  border: 2px solid var(--color-white, #fff);
  background: transparent;
  transition: background 0.25s ease;
}

/* Reset actual button appearance */
.sz-hero-v2__dot {
  border: none;
  background: none;
}

.sz-hero-v2__dot.is-active::after {
  background: var(--color-white, #fff);
}

/* --- 受付パネル（SP: ヒーロー下帯） --- */
.sz-hero-v2__schedule {
  background: rgba(255, 255, 255, 0.97);
  padding: var(--spacing-md, 1rem) var(--spacing-lg, 1.5rem);
  position: relative;
  z-index: 4;
}

.sz-hero-v2__schedule-title {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs, 0.5rem);
  font-size: var(--font-size-base, 1rem);
  font-weight: var(--font-weight-bold, 700);
  color: var(--sz-primary, var(--color-primary, #114fa1));
  margin: 0 0 var(--spacing-sm, 0.75rem);
}

.sz-hero-v2__schedule-title .material-symbols-outlined {
  font-size: 1.25rem;
  color: var(--sz-primary, var(--color-primary, #114fa1));
}

.sz-hero-v2__schedule-table {
  width: 100%;
  border-collapse: collapse;
  font-size: var(--font-size-sm, 0.875rem);
  margin-block-end: var(--spacing-sm, 0.75rem);
}

.sz-hero-v2__schedule-table th,
.sz-hero-v2__schedule-table td {
  padding: var(--spacing-xs, 0.5rem) var(--spacing-sm, 0.75rem);
  text-align: center;
  border-bottom: 1px solid var(--color-border, #e5e7eb);
}

.sz-hero-v2__schedule-table th {
  background: var(--color-bg-subtle, #f8fafc);
  font-weight: var(--font-weight-semibold, 600);
  color: var(--sz-primary, var(--color-primary, #114fa1));
  font-size: var(--font-size-xs, 0.75rem);
  text-transform: uppercase;
}

.sz-hero-v2__schedule-table td:first-child {
  font-weight: var(--font-weight-semibold, 600);
  text-align: start;
}

.sz-hero-v2__schedule-link {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xs, 0.5rem);
  color: var(--sz-primary, var(--color-primary, #114fa1));
  font-size: var(--font-size-sm, 0.875rem);
  font-weight: var(--font-weight-semibold, 600);
  text-decoration: none;
  transition: color 0.2s ease;
}

.sz-hero-v2__schedule-link:hover {
  color: var(--sz-primary-dark, var(--color-primary-hover, #0d3a75));
  text-decoration: underline;
}

.sz-hero-v2__schedule-link .material-symbols-outlined {
  font-size: 1.125rem;
}

/* --- 重要情報バー（赤アクセント） --- */
.sz-hero-v2__important {
  display: flex;
  align-items: center;
  gap: 0;
  background: var(--color-surface, #fff);
  border-block-start: 1px solid var(--color-border-light, #eae8e6);
  position: relative;
  min-height: 3.5rem;
}

.sz-hero-v2__important-badge {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  padding: var(--spacing-xs, 0.5rem) var(--spacing-sm, 0.75rem);
  border: 2px solid var(--color-error, #c62828);
  border-radius: var(--radius-sm, 0.25rem);
  color: var(--color-error, #c62828);
  font-size: var(--font-size-xs, 0.75rem);
  font-weight: var(--font-weight-bold, 700);
  line-height: 1.3;
  text-align: center;
  white-space: nowrap;
  margin-inline-start: var(--spacing-md, 1rem);
  align-self: center;
}

.sz-hero-v2__important-body {
  flex: 1;
  display: flex;
  align-items: center;
  gap: var(--spacing-sm, 0.75rem);
  padding: var(--spacing-sm, 0.75rem) var(--spacing-md, 1rem);
  min-width: 0;
  overflow: hidden;
}

.sz-hero-v2__important-date {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
  line-height: 1.2;
  color: var(--color-text-main, #23221e);
}

.sz-hero-v2__important-year {
  font-size: var(--font-size-xs, 0.75rem);
  color: var(--color-text-sub, #6b6560);
}

.sz-hero-v2__important-md {
  font-size: var(--font-size-base, 1rem);
  font-weight: var(--font-weight-bold, 700);
}

.sz-hero-v2__important-text {
  color: var(--color-error, #c62828);
  text-decoration: none;
  font-size: var(--font-size-sm, 0.875rem);
  font-weight: var(--font-weight-medium, 500);
  line-height: 1.5;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

a.sz-hero-v2__important-text:hover {
  text-decoration: underline;
}

.sz-hero-v2__important-nav {
  display: flex;
  flex-direction: column;
  flex-shrink: 0;
  margin-inline-end: var(--spacing-sm, 0.75rem);
}

.sz-hero-v2__important-nav-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2rem;
  height: 2rem;
  border: none;
  border-radius: 50%;
  background: var(--color-border-light, #eae8e6);
  color: var(--color-text-sub, #6b6560);
  cursor: pointer;
  padding: 0;
  transition: background-color 0.2s ease, color 0.2s ease;
}

.sz-hero-v2__important-nav-btn .material-symbols-outlined {
  font-size: 1.25rem;
}

.sz-hero-v2__important-nav-btn:hover:not(:disabled) {
  background: var(--color-text-sub, #6b6560);
  color: var(--color-white, #fff);
}

.sz-hero-v2__important-nav-btn--next {
  background: var(--color-error, #c62828);
  color: var(--color-white, #fff);
}

.sz-hero-v2__important-nav-btn--next:hover:not(:disabled) {
  background: #a51e1e;
}

.sz-hero-v2__important-nav-btn:disabled {
  opacity: 0.4;
  cursor: default;
}

/* --- 旧ティッカー（後方互換のため残置） --- */
.sz-hero-v2__ticker {
  display: none;
}

/* --- Wearable (≤279px) --- */
@media (max-width: 279px) {
  .sz-hero-v2__important {
    gap: 0;
  }

  .sz-hero-v2__important-badge {
    padding: var(--spacing-2xs, 0.25rem) var(--spacing-xs, 0.5rem);
    font-size: 0.625rem;
    min-height: 2rem;
    margin-inline-start: var(--spacing-xs, 0.5rem);
  }

  .sz-hero-v2__important-date {
    display: none;
  }

  .sz-hero-v2__important-body {
    padding: var(--spacing-xs, 0.5rem);
    gap: var(--spacing-xs, 0.5rem);
  }

  .sz-hero-v2__important-text {
    font-size: 0.6875rem;
  }

  .sz-hero-v2__important-nav {
    margin-inline-end: var(--spacing-xs, 0.5rem);
  }

  .sz-hero-v2__important-nav-btn {
    width: 1.5rem;
    height: 1.5rem;
  }

  .sz-hero-v2__important-nav-btn .material-symbols-outlined {
    font-size: 1rem;
  }
}

/* --- Tablet (768px+) --- */
@media (min-width: 768px) {
  .sz-hero-v2__important-text {
    font-size: var(--font-size-base, 1rem);
    white-space: normal;
  }

  .sz-hero-v2__slider {
    aspect-ratio: 8 / 3;
    max-height: calc(100svh - var(--header-mobile-height, 3.5rem));
    max-height: calc(100vh - var(--header-mobile-height, 3.5rem));
  }

  .sz-hero-v2__schedule {
    padding: var(--spacing-lg, 1.5rem) var(--spacing-xl, 2rem);
  }
}

/* --- PC (1024px+) --- */
@media (min-width: 1024px) {
  .sz-hero-v2 {
    margin-top: var(--header-height, 98px); /* PC固定ヘッダー分（utility 48px + main 50px） */
  }

  .sz-hero-v2__slider {
    width: 100%;
    aspect-ratio: 7 / 2;
    max-height: calc(100svh - var(--header-height, 98px));
    max-height: calc(100vh - var(--header-height, 98px)); /* fallback */
  }

  .sz-hero-v2__content {
    bottom: auto;
    left: var(--spacing-xl, 2rem);
    top: 50%;
    transform: translateY(-50%);
  }

  /* PC縦書きキャッチ */
  .sz-hero-v2__catch {
    writing-mode: vertical-rl;
    font-size: clamp(1.75rem, 1.25rem + 1.5vw, 2.75rem);
    letter-spacing: 0.1em;
    line-height: 1.6;
  }

  .sz-hero-v2__sub {
    writing-mode: vertical-rl;
    margin: 0 var(--spacing-sm, 0.75rem) 0 0;
  }

  /* PC: 受付パネルをヒーロー右下にフロート */
  .sz-hero-v2__schedule {
    position: absolute;
    right: var(--spacing-xl, 2rem);
    bottom: var(--spacing-xl, 2rem);
    z-index: 6;
    width: clamp(260px, 22vw, 320px);
    border-radius: var(--radius-lg, 0.75rem);
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.2);
    padding: var(--spacing-lg, 1.5rem);
  }

  .sz-hero-v2__dots {
    bottom: var(--spacing-lg, 1.5rem);
    left: var(--spacing-xl, 2rem);
    transform: none;
  }
}

/* --- prefers-reduced-motion --- */
@media (prefers-reduced-motion: reduce) {
  .sz-hero-v2__slide {
    transition: none;
  }

  .sz-hero-v2__track {
    transition: none;
  }

  .sz-hero-v2__ticker-text {
    animation: none;
    transform: none;
  }
}

/* ----------------------------------------------------------------
   クイックナビ（4項目・縦線区切り・シンプルアイコン）
   ---------------------------------------------------------------- */
.sz-quick {
  padding-block: 0;
  background: var(--color-white);
  border-bottom: 1px solid var(--color-border, #e5e7eb);
}

.sz-quick__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0;
}

.sz-quick__btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-xs);
  padding: var(--spacing-md) var(--spacing-sm);
  min-height: 5rem;
  background: var(--color-white);
  border-radius: 0;
  box-shadow: none;
  text-decoration: none;
  color: var(--color-text-main);
  transition: background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
  position: relative;
}

/* 縦線（右ボーダー）*/
.sz-quick__btn:nth-child(odd)::after {
  content: "";
  position: absolute;
  inset-inline-end: 0;
  top: 15%;
  bottom: 15%;
  width: 1px;
  background: var(--color-border, #e5e7eb);
}

/* 横線（下ボーダー: 上の2つだけ）*/
.sz-quick__btn:nth-child(-n+2)::before {
  content: "";
  position: absolute;
  inset-block-end: 0;
  left: 10%;
  right: 10%;
  height: 1px;
  background: var(--color-border, #e5e7eb);
}

.sz-quick__btn:hover {
  background: var(--color-reservation-cta, #00897B);
  color: var(--color-white);
  box-shadow: inset 0 0 0 0 transparent;
}

.sz-quick__btn:hover .sz-quick__icon-wrap {
  border-color: var(--color-white);
  color: var(--color-white);
  background: rgba(255, 255, 255, 0.15);
}

.sz-quick__btn:hover .sz-quick__label {
  color: var(--color-white);
}

.sz-quick__btn:hover .sz-quick__sub {
  color: rgba(255, 255, 255, 0.8);
}

.sz-quick__icon-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.5rem;
  height: 3.5rem;
  aspect-ratio: 1;
  border-radius: 50%;
  border: 2px solid var(--color-reservation-cta, #00897B);
  color: var(--color-reservation-cta, #00897B);
  flex-shrink: 0;
  transition: border-color 0.3s ease, color 0.3s ease, background-color 0.3s ease;
}

.sz-quick__icon-wrap .material-symbols-outlined {
  font-size: 1.5rem;
}

.sz-quick__text {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
}

.sz-quick__label {
  font-size: var(--font-size-sm, 0.875rem);
  font-weight: var(--font-weight-bold);
  text-align: center;
  line-height: 1.4;
}

.sz-quick__sub {
  font-size: var(--font-size-xs, 0.75rem);
  color: var(--color-text-light, #6b7280);
  text-align: center;
  line-height: 1.4;
}

@media (min-width: 768px) {
  .sz-quick__grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .sz-quick__btn {
    flex-direction: row;
    gap: var(--spacing-md);
    padding: var(--spacing-lg) var(--spacing-xl);
  }

  /* 768px+: 1列なので縦線のみ（最終項目以外） */
  .sz-quick__btn:nth-child(odd)::after,
  .sz-quick__btn:nth-child(-n+2)::before {
    display: none;
  }

  .sz-quick__btn:not(:last-child)::after {
    content: "";
    display: block;
    position: absolute;
    inset-inline-end: 0;
    top: 20%;
    bottom: 20%;
    width: 1px;
    background: var(--color-border, #e5e7eb);
  }

  .sz-quick__text {
    align-items: flex-start;
  }

  .sz-quick__icon-wrap {
    width: 4rem;
    height: 4rem;
    aspect-ratio: 1;
  }

  .sz-quick__icon-wrap .material-symbols-outlined {
    font-size: 1.75rem;
  }
}

@media (min-width: 1024px) {
  .sz-quick__grid {
    max-width: 72rem;
    margin-inline: auto;
  }

  .sz-quick__label {
    font-size: var(--font-size-base, 1rem);
  }

  .sz-quick__sub {
    font-size: var(--font-size-sm, 0.875rem);
  }
}

/* --- Wearable (≤279px) --- */
@media (max-width: 279px) {
  .sz-quick__grid {
    display: flex;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
  }

  .sz-quick__grid::-webkit-scrollbar {
    display: none;
  }

  .sz-quick__btn {
    flex: 0 0 42%;
    scroll-snap-align: start;
    min-height: 3.5rem;
    padding: var(--spacing-xs, 0.5rem);
  }

  /* ウェアラブルでは区切り線を非表示 */
  .sz-quick__btn::after,
  .sz-quick__btn::before {
    display: none;
  }

  .sz-quick__icon-wrap {
    width: 2.5rem;
    height: 2.5rem;
  }

  .sz-quick__icon-wrap .material-symbols-outlined {
    font-size: 1.125rem;
  }

  .sz-quick__label {
    font-size: 0.6875rem;
  }

  .sz-quick__sub {
    display: none;
  }
}

/* ----------------------------------------------------------------
   写真カード型リンク（4枚グリッド）
   ---------------------------------------------------------------- */
.sz-cards {
  padding-block: 0;
  background: var(--color-white, #fff);
}

.sz-cards__grid {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  gap: clamp(0.5rem, 1vw, 0.75rem);
  padding: clamp(0.5rem, 1vw, 0.75rem);
}

.sz-cards__grid::-webkit-scrollbar {
  display: none;
}

.sz-cards__card {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-md, 0.5rem);
  text-decoration: none;
  color: var(--color-white, #fff);
  flex: 0 0 75%;
  scroll-snap-align: start;
}

.sz-cards__img-wrap {
  position: relative;
  aspect-ratio: 2 / 1;
  overflow: hidden;
}

.sz-cards__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.sz-cards__card:hover .sz-cards__img {
  transform: scale(1.05);
}

.sz-cards__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(transparent 30%, rgba(0, 0, 0, 0.6));
  transition: background 0.3s ease;
}

.sz-cards__card:hover .sz-cards__overlay {
  background: linear-gradient(transparent 20%, rgba(0, 0, 0, 0.7));
}

.sz-cards__body {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: var(--spacing-sm, 0.75rem) var(--spacing-md, 1rem);
  z-index: 1;
}

.sz-cards__title {
  margin: 0;
  font-size: var(--font-size-base, 1rem);
  font-weight: var(--font-weight-bold, 700);
  color: var(--color-white, #fff);
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}

.sz-cards__en {
  display: block;
  margin: 0;
  font-size: var(--font-size-xs, 0.75rem);
  letter-spacing: 0.1em;
  opacity: 0.8;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

.sz-cards__arrow {
  position: absolute;
  bottom: var(--spacing-sm, 0.75rem);
  right: var(--spacing-md, 1rem);
  font-size: 1.25rem;
  color: var(--color-white, #fff);
  opacity: 0.8;
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.sz-cards__card:hover .sz-cards__arrow {
  transform: translateX(4px);
  opacity: 1;
}

/* md(480px): 2列グリッドに切替 */
@media (min-width: 480px) {
  .sz-cards__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    overflow-x: visible;
    scroll-snap-type: none;
  }

  .sz-cards__card {
    flex: none;
  }
}

/* lg(768px): 2×2 */
@media (min-width: 768px) {
  .sz-cards__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: clamp(0.5rem, 1vw, 1rem);
    padding: clamp(0.5rem, 1vw, 1rem);
  }

  .sz-cards__img-wrap {
    aspect-ratio: 16 / 9;
  }

  .sz-cards__title {
    font-size: clamp(1rem, 0.875rem + 0.5vw, 1.25rem);
  }
}

/* xl(1024px) */
@media (min-width: 1024px) {
  .sz-cards__grid {
    max-width: 72rem;
    margin-inline: auto;
  }

  .sz-cards__body {
    padding: var(--spacing-md, 1rem) var(--spacing-lg, 1.5rem);
  }
}

/* ----------------------------------------------------------------
   お知らせ + サイドバー ラッパー
   ---------------------------------------------------------------- */
.sz-news-sns-wrap {
  padding-block: var(--spacing-xl);
}

.sz-news-sns-wrap__inner {
  display: grid;
  gap: var(--spacing-xl);
}

/* PC縦書きタイトル: SPでは非表示 */
.sz-news-sns-wrap__title-vert {
  display: none;
}

@media (min-width: 1024px) {
  .sz-news-sns-wrap__inner {
    grid-template-columns: auto 3fr 2fr;
    align-items: start;
  }

  .sz-news-sns-wrap__title-vert {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: var(--spacing-sm, 0.75rem);
    writing-mode: vertical-rl;
    padding-inline-end: var(--spacing-lg, 1.5rem);
    border-inline-end: 3px solid var(--sz-primary, var(--color-primary, #114fa1));
  }

  .sz-news-sns-wrap__vert-ja {
    font-size: clamp(1.25rem, 1rem + 0.5vw, 1.5rem);
    font-weight: var(--font-weight-bold, 700);
    color: var(--color-text-main, #1a1a1a);
    letter-spacing: 0.2em;
  }

  .sz-news-sns-wrap__vert-en {
    font-size: var(--font-size-xs, 0.75rem);
    color: var(--color-text-sub, #6b7280);
    letter-spacing: 0.1em;
    writing-mode: horizontal-tb;
  }

  /* PC: ニュースヘッダーのタイトル非表示（縦書きで表示済み） */
  .sz-news-v3__header .sz-news-v3__ttl,
  .sz-news-v3__header .sz-news-v3__en {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
  }
}

/* --- CTA ボタン --- */
.sz-news-v3__cta {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xs, 0.5rem);
  margin-block-start: var(--spacing-md, 1rem);
  padding: var(--spacing-sm, 0.75rem) var(--spacing-lg, 1.5rem);
  background: var(--sz-primary, var(--color-primary, #114fa1));
  color: var(--color-white, #fff);
  text-decoration: none;
  font-size: var(--font-size-sm, 0.875rem);
  font-weight: var(--font-weight-bold, 700);
  border-radius: var(--radius-md, 0.5rem);
  border: var(--border-width-thick, 2px) solid var(--sz-primary, var(--color-primary, #114fa1));
  transition: background 0.2s ease, color 0.2s ease, border-color 0.2s ease, transform 0.2s ease;
  min-height: 44px;
}

.sz-news-v3__cta:hover {
  background: var(--color-surface, #fff);
  color: var(--sz-primary, var(--color-primary, #114fa1));
  border-color: var(--sz-primary, var(--color-primary, #114fa1));
  transform: translateX(2px);
}

.sz-news-v3__cta:active {
  background: var(--color-primary-light, #E8F0FA);
  color: var(--sz-primary, var(--color-primary, #114fa1));
  transform: scale(0.98);
}

.sz-news-v3__cta .material-symbols-outlined {
  font-size: 1.125rem;
  transition: transform 0.2s ease;
}

.sz-news-v3__cta:hover .material-symbols-outlined {
  transform: translateX(4px);
}

/* ----------------------------------------------------------------
   ニュースサイドカラム（バナー + SNS）
   ---------------------------------------------------------------- */
.sz-news-side__banner {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-md, 0.5rem);
  text-decoration: none;
  color: var(--color-white, #fff);
}

.sz-news-side__banner-img {
  width: 100%;
  height: auto;
  aspect-ratio: 2 / 1;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.sz-news-side__banner:hover .sz-news-side__banner-img {
  transform: scale(1.05);
}

.sz-news-side__banner-overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(transparent 30%, rgba(0, 0, 0, 0.6));
  transition: background 0.3s ease;
}

.sz-news-side__banner:hover .sz-news-side__banner-overlay {
  background: linear-gradient(transparent 20%, rgba(0, 0, 0, 0.7));
}

.sz-news-side__banner-body {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: var(--spacing-md, 1rem);
  z-index: 1;
}

.sz-news-side__banner-title {
  margin: 0;
  font-size: var(--font-size-base, 1rem);
  font-weight: var(--font-weight-bold, 700);
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}

.sz-news-side__banner-en {
  margin: 0;
  font-size: var(--font-size-xs, 0.75rem);
  opacity: 0.8;
  letter-spacing: 0.1em;
}

.sz-news-side__banner-body .material-symbols-outlined {
  position: absolute;
  right: var(--spacing-md, 1rem);
  bottom: var(--spacing-md, 1rem);
  font-size: 1.25rem;
  opacity: 0.8;
}

.sz-news-side__sns {
  margin-block-start: var(--spacing-lg, 1.5rem);
}

.sz-news-side__sns-label {
  font-size: var(--font-size-sm, 0.875rem);
  font-weight: var(--font-weight-bold, 700);
  color: var(--color-text-sub, #6b7280);
  letter-spacing: 0.1em;
  margin: 0 0 var(--spacing-sm, 0.75rem);
}

.sz-news-side__sns-links {
  display: flex;
  gap: var(--spacing-sm, 0.75rem);
  flex-wrap: wrap;
}

.sz-news-side__sns-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--spacing-xs, 0.5rem) var(--spacing-md, 1rem);
  min-height: 44px;
  border-radius: var(--radius-md, 0.5rem);
  text-decoration: none;
  font-size: var(--font-size-sm, 0.875rem);
  font-weight: var(--font-weight-bold, 700);
  color: var(--color-white, #fff);
  transition: opacity 0.2s ease, transform 0.2s ease;
}

.sz-news-side__sns-link[aria-label="LINE"] {
  background: #06c755;
}

.sz-news-side__sns-link[aria-label="Instagram"] {
  background: linear-gradient(45deg, #f09433, #e6683c, #dc2743, #cc2366, #bc1888);
}

.sz-news-side__sns-link[aria-label="X"] {
  background: #1d1d1f;
}

.sz-news-side__sns-link[aria-label="YouTube"] {
  background: #ff0000;
}

.sz-news-side__sns-link:hover {
  opacity: 0.85;
  transform: translateY(-2px);
}

/* ----------------------------------------------------------------
   お知らせ V3
   ---------------------------------------------------------------- */
.sz-news-v3__header {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  margin-bottom: var(--spacing-md);
}

.sz-news-v3__ttl {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  margin: 0;
  color: var(--color-text-main);
}

.sz-news-v3__en {
  font-size: var(--font-size-xs);
  color: var(--color-text-sub);
  letter-spacing: 0.1em;
}

.sz-news-v3__all-link {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xs);
  font-size: var(--font-size-sm);
  color: var(--color-primary);
  text-decoration: none;
  font-weight: var(--font-weight-bold);
}

.sz-news-v3__all-link:hover {
  text-decoration: underline;
}

.sz-news-v3__tabs {
  display: flex;
  gap: var(--spacing-sm);
  overflow-x: auto;
  margin-bottom: var(--spacing-md);
  padding-bottom: var(--spacing-xs);
  -webkit-overflow-scrolling: touch;
}

.sz-news-v3__tab {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: var(--spacing-sm) var(--spacing-lg);
  min-height: var(--touch-target-min, 44px);
  background: var(--color-white, #fff);
  border: 2px solid var(--color-border);
  border-radius: 2rem;
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
  cursor: pointer;
  white-space: nowrap;
  transition: color 0.2s, background-color 0.2s, border-color 0.2s;
}

.sz-news-v3__tab:hover {
  color: var(--color-text-main);
  border-color: var(--color-text-main);
}

.sz-news-v3__tab.active {
  background: var(--color-text-main);
  border-color: var(--color-text-main);
  color: var(--color-white, #fff);
  font-weight: var(--font-weight-bold);
}

.sz-news-v3__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-news-v3__item {
  border-bottom: 1px solid var(--color-border-light);
}

.sz-news-v3__link {
  display: grid;
  grid-template-columns: auto auto 1fr auto;
  gap: var(--spacing-sm);
  align-items: center;
  padding: var(--spacing-md) var(--spacing-xs);
  text-decoration: none;
  color: var(--color-text-main);
  border-radius: var(--radius-sm, 0.25rem);
  transition: background-color 0.2s ease, padding-left 0.2s ease;
}

.sz-news-v3__link:hover {
  background: var(--color-background);
  padding-inline-start: var(--spacing-sm);
}

.sz-news-v3__date {
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
  white-space: nowrap;
  min-width: 6em;
}

.sz-news-v3__badge {
  display: inline-flex;
  align-items: center;
  padding: 0.125rem 0.625rem;
  font-size: 0.6875rem;
  font-weight: var(--font-weight-bold);
  border-radius: 1rem;
  border: 1.5px solid var(--color-primary);
  background: transparent;
  color: var(--color-primary);
  white-space: nowrap;
}

/* カテゴリ別カラー */
.sz-news-v3__badge--oshirase,
.sz-news-v3__badge--notice {
  border-color: #e67e22;
  color: #e67e22;
}

.sz-news-v3__badge--shinryo,
.sz-news-v3__badge--medical {
  border-color: var(--color-primary);
  color: var(--color-primary);
}

.sz-news-v3__badge--saiyo,
.sz-news-v3__badge--recruit {
  border-color: #27ae60;
  color: #27ae60;
}

.sz-news-v3__badge--event {
  border-color: #16a085;
  color: #16a085;
}

.sz-news-v3__badge--important {
  border-color: #e74c3c;
  color: #e74c3c;
}

.sz-news-v3__badge--closed,
.sz-news-v3__badge--ishi-henkou {
  border-color: #3498db;
  color: #3498db;
}

.sz-news-v3__badge--kango {
  border-color: #e84393;
  color: #e84393;
}

.sz-news-v3__title {
  font-size: var(--font-size-sm);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.sz-news-v3__arrow {
  font-size: 1.125rem;
  color: var(--color-text-muted);
}

.sz-news-v3__more {
  margin-top: var(--spacing-sm);
}

.sz-news-v3__more-btn {
  display: block;
  width: 100%;
  padding: var(--spacing-sm);
  text-align: center;
  font-size: var(--font-size-sm);
  color: var(--color-primary);
  cursor: pointer;
  border-radius: var(--radius-md, 0.5rem);
  transition: background 0.2s;
}

.sz-news-v3__more-btn:hover {
  background: var(--color-primary-light);
}

/* ----------------------------------------------------------------
   SNSフィード
   ---------------------------------------------------------------- */
.sz-sns-feed__header {
  margin-bottom: var(--spacing-md);
}

.sz-sns-feed__ttl {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  margin: 0;
  color: var(--color-text-main);
}

.sz-sns-feed__en {
  font-size: var(--font-size-xs);
  color: var(--color-text-sub);
  letter-spacing: 0.1em;
}

.sz-sns-feed__links {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--spacing-sm);
  margin-bottom: var(--spacing-lg);
}

.sz-sns-feed__link {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  border-radius: var(--radius-md, 0.5rem);
  text-decoration: none;
  color: var(--color-white);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  transition: opacity 0.3s ease, transform 0.3s ease, box-shadow 0.3s ease;
}

.sz-sns-feed__link:hover {
  opacity: 0.9;
  transform: translateY(-3px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.sz-sns-feed__link--line {
  background: #06c755;
}

.sz-sns-feed__link--instagram {
  background: linear-gradient(135deg, #f9ce34, #ee2a7b, #6228d7);
}

.sz-sns-feed__link--x {
  background: #000;
}

.sz-sns-feed__link--youtube {
  background: #ff0000;
}

@media (min-width: 1024px) {
  .sz-sns-feed__links {
    grid-template-columns: repeat(2, 1fr);
  }
}

.sz-sns-feed__instagram {
  border-radius: var(--radius-md, 0.5rem);
  background: var(--color-background);
  min-height: 10rem;
}

.sz-sns-feed__ig-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-sm);
  padding: var(--spacing-xl);
  color: var(--color-text-muted);
  font-size: var(--font-size-sm);
}

.sz-sns-feed__ig-placeholder .material-symbols-outlined {
  font-size: 2rem;
}

/* ----------------------------------------------------------------
   サービスカード（5列・写真+アイコン+グラデーション下端）
   ---------------------------------------------------------------- */
.sz-service-cards {
  padding-block: var(--spacing-lg, 1.5rem) var(--spacing-xl, 2rem);
  background: var(--color-background, #f8f7f6);
}

.sz-service-cards__inner {
  max-width: 80rem;
  margin-inline: auto;
  padding-inline: var(--spacing-md, 1rem);
}

/* ---- モバイル: 横並びボタン（スクロールなし） ---- */
.sz-service-cards__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--spacing-sm, 0.5rem);
}

.sz-service-cards__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.25rem;
  border-radius: var(--radius-md, 0.5rem);
  background: var(--color-surface, #fff);
  text-decoration: none;
  color: var(--color-text-main, #23221e);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
  padding: var(--spacing-sm, 0.5rem) var(--spacing-xs, 0.25rem);
  min-height: 3.5rem;
  position: relative;
  border-inline-start: 3px solid var(--_card-accent, var(--color-border, #e5e7eb));
  transition: background 0.2s ease, box-shadow 0.2s ease;
}

.sz-service-cards__card:hover {
  background: var(--color-primary-light, #e8f0fa);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.sz-service-cards__card::after {
  display: none;
}

.sz-service-cards__card:focus-visible {
  outline: 3px solid var(--color-focus, #2563eb);
  outline-offset: 2px;
}

/* カラーバリエーション */
.sz-service-cards__card--green  { --_card-accent: #66bb6a; }
.sz-service-cards__card--yellow { --_card-accent: #ffca28; }
.sz-service-cards__card--blue   { --_card-accent: #42a5f5; }
.sz-service-cards__card--pink   { --_card-accent: #ef5350; }
.sz-service-cards__card--purple { --_card-accent: #ab47bc; }

/* 写真エリア: モバイルでは非表示 */
.sz-service-cards__photo {
  display: none;
}

.sz-service-cards__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.5s ease;
}

.sz-service-cards__card:hover .sz-service-cards__img {
  transform: scale(1.06);
}

/* コンテンツエリア: モバイルではコンパクト */
.sz-service-cards__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 0;
  flex: 1;
}

.sz-service-cards__icon {
  font-size: 1.5rem;
  color: var(--_card-accent, var(--color-text-sub, #6b6560));
  opacity: 0.8;
  margin: 0;
  font-variation-settings: 'FILL' 0, 'wght' 300, 'GRAD' 0, 'opsz' 24;
}

.sz-service-cards__title {
  margin: 0;
  font-size: clamp(0.6875rem, 0.6rem + 0.4vw, 0.8125rem);
  font-weight: var(--font-weight-bold, 700);
  letter-spacing: 0.02em;
  line-height: 1.3;
}

/* モバイルでは英語表記・説明文・矢印を非表示 */
.sz-service-cards__en,
.sz-service-cards__desc,
.sz-service-cards__link {
  display: none;
}

/* md(480px): カード表示に復元 */
@media (min-width: 480px) {
  .sz-service-cards {
    padding-block: var(--spacing-xl, 2rem) var(--spacing-2xl, 3rem);
  }

  .sz-service-cards__grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: var(--spacing-md, 1rem);
  }

  .sz-service-cards__card {
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    gap: 0;
    border-radius: var(--radius-lg, 0.75rem);
    padding: 0;
    min-height: auto;
    border-inline-start: none;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
    transition: transform 0.35s ease, box-shadow 0.35s ease;
  }

  .sz-service-cards__card::after {
    display: block;
    content: "";
    position: absolute;
    inset-inline: 0;
    bottom: 0;
    height: 4px;
    background: var(--_card-accent, var(--color-border, #e5e7eb));
    transition: height 0.35s ease;
  }

  .sz-service-cards__card:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
    background: var(--color-surface, #fff);
  }

  .sz-service-cards__card:hover::after {
    height: 6px;
  }

  .sz-service-cards__photo {
    display: block;
    position: relative;
    aspect-ratio: 3 / 2;
    overflow: hidden;
  }

  .sz-service-cards__content {
    padding: var(--spacing-lg, 1.5rem) var(--spacing-md, 1rem) var(--spacing-xl, 2rem);
  }

  .sz-service-cards__icon {
    font-size: 2.5rem;
    color: var(--color-text-sub, #6b6560);
    opacity: 0.5;
    margin-block-end: var(--spacing-sm, 0.75rem);
    font-variation-settings: 'FILL' 0, 'wght' 200, 'GRAD' 0, 'opsz' 48;
  }

  .sz-service-cards__title {
    font-size: clamp(1rem, 0.875rem + 0.5vw, 1.25rem);
    letter-spacing: 0.05em;
    line-height: 1.4;
  }

  .sz-service-cards__en {
    display: block;
    margin: var(--spacing-2xs, 0.25rem) 0 0;
    font-size: var(--font-size-xs, 0.75rem);
    color: var(--color-text-sub, #6b6560);
    letter-spacing: 0.1em;
  }

  .sz-service-cards__desc {
    display: block;
    margin: var(--spacing-md, 1rem) 0 0;
    font-size: var(--font-size-sm, 0.875rem);
    color: var(--color-text-sub, #6b6560);
    line-height: 1.7;
  }

  .sz-service-cards__link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 2.5rem;
    height: 2.5rem;
    border-radius: 50%;
    border: 1px solid var(--color-border, #d6d3d0);
    margin-block-start: auto;
    padding-block-start: var(--spacing-sm, 0.75rem);
    color: var(--color-text-sub, #6b6560);
    transition: border-color 0.3s ease, color 0.3s ease, background-color 0.3s ease;
  }

  .sz-service-cards__link .material-symbols-outlined {
    font-size: 1.25rem;
  }

  .sz-service-cards__card:hover .sz-service-cards__link {
    border-color: var(--_card-accent, var(--color-primary));
    color: var(--color-surface, #fff);
    background: var(--_card-accent, var(--color-primary));
  }
}

/* lg(768px): 3列 */
@media (min-width: 768px) {
  .sz-service-cards__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-lg, 1.5rem);
  }
}

/* xl(1024px): 5列 */
@media (min-width: 1024px) {
  .sz-service-cards__grid {
    grid-template-columns: repeat(5, 1fr);
    gap: var(--spacing-lg, 1.5rem);
  }

  .sz-service-cards__photo {
    aspect-ratio: 4 / 3;
  }
}

/* --- Wearable (≤279px) --- */
@media (max-width: 279px) {
  .sz-service-cards {
    padding-block: var(--spacing-sm, 0.5rem) var(--spacing-md, 1rem);
  }

  .sz-service-cards__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 0.25rem;
  }

  .sz-service-cards__card {
    padding: 0.25rem;
    min-height: 2.5rem;
    border-inline-start-width: 2px;
  }

  .sz-service-cards__icon {
    font-size: 1.125rem;
  }

  .sz-service-cards__title {
    font-size: 0.5625rem;
  }
}

/* ----------------------------------------------------------------
   リンクバナー 3列（レガシー）
   ---------------------------------------------------------------- */
.sz-link-banners {
  padding-block: var(--spacing-lg, 1.5rem);
  background: var(--color-bg-subtle, #f8fafc);
}

.sz-link-banners__grid {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  gap: var(--spacing-md, 1rem);
  padding-inline: var(--spacing-md, 1rem);
}

.sz-link-banners__grid::-webkit-scrollbar {
  display: none;
}

.sz-link-banners__item {
  display: block;
  position: relative;
  overflow: hidden;
  border-radius: var(--radius-md, 0.5rem);
  text-decoration: none;
  color: var(--color-white, #fff);
  aspect-ratio: 16 / 9;
  flex: 0 0 75%;
  scroll-snap-align: start;
}

.sz-link-banners__item:focus-visible {
  outline: 3px solid var(--color-focus, #2563eb);
  outline-offset: 2px;
}

.sz-link-banners__img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  transition: transform 0.4s ease;
}

.sz-link-banners__item:hover .sz-link-banners__img {
  transform: scale(1.05);
}

.sz-link-banners__overlay {
  position: absolute;
  inset: 0;
  background: linear-gradient(transparent 30%, rgba(0, 0, 0, 0.6));
  transition: background 0.3s ease;
}

.sz-link-banners__item:hover .sz-link-banners__overlay {
  background: linear-gradient(transparent 20%, rgba(0, 0, 0, 0.7));
}

.sz-link-banners__body {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  padding: var(--spacing-md, 1rem) var(--spacing-lg, 1.5rem);
  z-index: 1;
}

.sz-link-banners__title {
  margin: 0;
  font-size: clamp(1rem, 0.875rem + 0.5vw, 1.25rem);
  font-weight: var(--font-weight-bold, 700);
  text-shadow: 0 1px 4px rgba(0, 0, 0, 0.4);
}

.sz-link-banners__desc {
  margin: var(--spacing-xs, 0.5rem) 0 0;
  font-size: var(--font-size-sm, 0.875rem);
  opacity: 0.85;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
}

.sz-link-banners__arrow {
  position: absolute;
  right: var(--spacing-lg, 1.5rem);
  bottom: var(--spacing-md, 1rem);
  font-size: 1.25rem;
  opacity: 0.8;
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.sz-link-banners__item:hover .sz-link-banners__arrow {
  transform: translateX(4px);
  opacity: 1;
}

@media (min-width: 768px) {
  .sz-link-banners__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    overflow-x: visible;
    scroll-snap-type: none;
    padding-inline: 0;
  }

  .sz-link-banners__item {
    flex: none;
  }
}

@media (min-width: 1024px) {
  .sz-link-banners__grid {
    max-width: 72rem;
    margin-inline: auto;
  }
}

/* ----------------------------------------------------------------
   AI問診・音声ナビ CTA（横並びアイコン）
   ---------------------------------------------------------------- */
.sz-action-cta {
  padding-block: var(--spacing-md);
}

.sz-action-cta__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--spacing-sm);
}

.sz-action-cta__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--spacing-2xs, 0.25rem);
  padding: var(--spacing-md) var(--spacing-sm);
  border-radius: var(--radius-lg, 0.75rem);
  text-decoration: none;
  color: var(--color-text-main);
  border: none;
  cursor: pointer;
  text-align: center;
  font-family: inherit;
  transition: box-shadow 0.3s ease, transform 0.3s ease, background-color 0.3s ease;
}

.sz-action-cta__item:hover {
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12);
  transform: translateY(-4px);
}

.sz-action-cta__item--ai:hover {
  background: var(--color-primary);
  color: var(--color-white);
}

.sz-action-cta__item--ai:hover .sz-action-cta__icon {
  color: var(--color-white);
}

.sz-action-cta__item--ai:hover .sz-action-cta__sub {
  color: rgba(255, 255, 255, 0.8);
}

.sz-action-cta__item--voice:hover {
  background: var(--color-success);
  color: var(--color-white);
}

.sz-action-cta__item--voice:hover .sz-action-cta__icon {
  color: var(--color-white);
}

.sz-action-cta__item--voice:hover .sz-action-cta__sub {
  color: rgba(255, 255, 255, 0.8);
}

.sz-action-cta__item--ai {
  background: var(--color-primary-light);
}

.sz-action-cta__item--voice {
  background: var(--color-success-light);
}

.sz-action-cta__icon {
  font-size: 2rem;
}

.sz-action-cta__item--ai .sz-action-cta__icon {
  color: var(--color-primary);
}

.sz-action-cta__item--voice .sz-action-cta__icon {
  color: var(--color-success);
}

.sz-action-cta__label {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  margin: 0;
  line-height: var(--line-height-tight);
}

.sz-action-cta__sub {
  font-size: var(--font-size-xs);
  color: var(--color-text-sub);
  margin: 0;
}

@media (min-width: 768px) {
  .sz-action-cta__icon {
    font-size: 2.5rem;
  }
  .sz-action-cta__label {
    font-size: var(--font-size-md);
  }
}

/* ----------------------------------------------------------------
   採用 CTA バナー（コンパクト）
   ---------------------------------------------------------------- */
.sz-recruit-cta {
  padding-block: var(--spacing-md);
}

.sz-recruit-cta__inner {
  display: flex;
  align-items: center;
  gap: var(--spacing-md);
  padding: var(--spacing-md) var(--spacing-lg);
  background: linear-gradient(135deg, var(--color-recruit-cta, #e65100) 0%, #bf4400 100%);
  border-radius: var(--radius-lg, 0.75rem);
  color: var(--color-white);
  flex-wrap: wrap;
}

.sz-recruit-cta__icon {
  font-size: 2rem;
  color: var(--color-white);
  flex-shrink: 0;
}

.sz-recruit-cta__body {
  flex: 1;
  min-width: 0;
}

.sz-recruit-cta__ttl {
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-bold);
  margin: 0;
  line-height: var(--line-height-tight);
}

.sz-recruit-cta__desc {
  font-size: var(--font-size-xs);
  opacity: 0.85;
  margin: var(--spacing-2xs, 0.25rem) 0 0;
}

.sz-recruit-cta__btn {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-xs);
  padding: var(--spacing-sm) var(--spacing-lg);
  background: var(--color-white);
  color: var(--color-recruit-cta, #e65100);
  font-weight: var(--font-weight-bold);
  font-size: var(--font-size-sm);
  border-radius: 9999px;
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
  transition: transform 0.3s ease, box-shadow 0.3s ease, background-color 0.3s ease, color 0.3s ease;
}

.sz-recruit-cta__btn:hover {
  transform: translateY(-3px) scale(1.02);
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.2);
  background: var(--color-recruit-cta, #e65100);
  color: var(--color-white);
}

@media (min-width: 768px) {
  .sz-recruit-cta__inner {
    flex-wrap: nowrap;
  }
  .sz-recruit-cta__ttl {
    font-size: var(--font-size-lg);
  }
}

/* ================================================================
   お知らせバー V2（sz-hero-v2__notice）
   青枠線 + 白背景 + 通常文字色
   ================================================================ */
.sz-hero-v2__notice {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm, 0.75rem);
  padding: var(--spacing-sm, 0.75rem) var(--spacing-md, 1rem);
  background: var(--color-white, #fff);
  border: 2px solid var(--sz-primary, var(--color-primary, #114fa1));
  color: var(--color-text, #333);
  text-decoration: none;
  transition: background 0.2s ease;
  min-height: 44px;
}

.sz-hero-v2__notice:hover {
  background: var(--color-bg-subtle, #f8fafc);
}

.sz-hero-v2__notice-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.125rem 0.625rem;
  background: var(--sz-primary, var(--color-primary, #114fa1));
  color: var(--color-white, #fff);
  font-size: var(--font-size-xs, 0.75rem);
  font-weight: var(--font-weight-bold, 700);
  border-radius: var(--radius-sm, 0.25rem);
  white-space: nowrap;
  flex-shrink: 0;
}

.sz-hero-v2__notice-text {
  flex: 1;
  min-width: 0;
  font-size: var(--font-size-sm, 0.875rem);
  font-weight: var(--font-weight-semibold, 600);
  color: var(--color-text, #333);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sz-hero-v2__notice-arrow {
  flex-shrink: 0;
  color: var(--sz-primary, var(--color-primary, #114fa1));
  font-size: 1.125rem;
}

/* === object/project/_saikazo-subpage.css === */

/* ================================================================
   saikazo-subpage.css
   木古内町国民健康保険病院スタイル サブページ共通
   木古内スタイルベース

   注意: CSS変数は variables.css で一元管理されています。
   --sz-* プレフィックスの変数を使用してください。
   ================================================================ */

/* ================================================================
   Breadcrumb（パンくずリスト - 木古内スタイル）
   ================================================================ */
.page-breadcrumb {
  background: #fff;
  padding: 12px 0;
  border-bottom: none;
}

.page-breadcrumb__inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 40px;
}

.page-breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 0.75rem;
}

.page-breadcrumb__item {
  display: flex;
  align-items: center;
}

.page-breadcrumb__item::after {
  content: '>';
  margin: 0 0.75em;
  color: #9ca3af;
  font-size: 0.625rem;
}

.page-breadcrumb__item:last-child::after {
  display: none;
}

.page-breadcrumb__item a {
  color: #6b7280;
  text-decoration: none;
  transition: color 0.2s ease;
}

.page-breadcrumb__item a:hover {
  color: var(--sz-primary, #114FA1);
}

.page-breadcrumb__item:last-child a {
  color: #374151;
  pointer-events: none;
}

/* ================================================================
   Page Hero（木古内スタイル - 赤いグラデーションバナー）
   ================================================================ */
.page-hero-sakura {
  background: linear-gradient(90deg, #c23d3d 0%, #d45a5a 50%, #e8a0a0 100%);
  padding: 20px 0;
}

.page-hero-sakura__inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 40px;
}

.page-hero-sakura__en {
  display: block;
  font-size: 0.875rem;
  font-weight: 500;
  color: #fff;
  letter-spacing: 0.05em;
}

/* ================================================================
   Page Container（木古内スタイル - 左サイドバー）
   ================================================================ */
.page-container-sakura {
  max-width: 1280px;
  margin: 0 auto;
  padding: 60px 40px 80px;
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: 60px;
  align-items: start;
}

/* サイドバーなし時はフルワイド */
.page-container-sakura > .page-main-sakura:only-child {
  grid-column: 1 / -1;
}

/* ================================================================
   Sidebar（浅香山スタイル - 緑ヘッダー付き左サイドバー）
   ================================================================ */
.page-sidebar-sakura {
  position: sticky;
  top: 120px;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  overflow: hidden;
  background: #fff;
}

.page-sidebar-sakura__header {
  background: var(--sz-primary, #114FA1);
  padding: 16px 20px;
  margin: 0;
  border-bottom: none;
}

.page-sidebar-sakura__category {
  font-size: 1rem;
  font-weight: 700;
  color: #fff;
  margin: 0;
  letter-spacing: 0.04em;
}

.page-sidebar-sakura__category-en {
  font-size: 0.7rem;
  color: rgba(255, 255, 255, 0.8);
  font-style: normal;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  display: block;
  margin-top: 4px;
}

.page-sidebar-sakura__nav {
  padding: 8px 0;
}

.page-sidebar-sakura__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.page-sidebar-sakura__list > li {
  margin-bottom: 0;
}

.page-sidebar-sakura__list > li > a {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 12px 20px;
  color: #374151;
  text-decoration: none;
  font-size: 0.875rem;
  border-bottom: 1px solid #f3f4f6;
  transition: all 0.2s ease;
}

.page-sidebar-sakura__list > li:last-child > a {
  border-bottom: none;
}

.page-sidebar-sakura__list > li > a::before {
  content: '';
  width: 6px;
  height: 6px;
  border-top: 2px solid #9ca3af;
  border-right: 2px solid #9ca3af;
  transform: rotate(45deg);
  flex-shrink: 0;
  transition: border-color 0.2s ease;
}

.page-sidebar-sakura__list > li > a:hover {
  color: var(--sz-primary, #114FA1);
  background: var(--sz-primary-50, #E8F0FA);
}

.page-sidebar-sakura__list > li > a:hover::before {
  border-color: var(--sz-primary, #114FA1);
}

.page-sidebar-sakura__list > li > a.is-active {
  color: var(--sz-primary, #114FA1);
  font-weight: 600;
  background: var(--sz-primary-50, #E8F0FA);
  border-left: 3px solid var(--sz-primary, #114FA1);
}

.page-sidebar-sakura__list > li > a.is-active::before {
  border-color: var(--sz-primary, #114FA1);
}

/* サイドバー 情報ボックス（外来問い合わせ・診療予定） */
.page-sidebar-sakura__info {
  padding: 16px 20px;
  border-top: 1px solid #e5e7eb;
}

.page-sidebar-sakura__info-title {
  font-size: 0.8125rem;
  font-weight: 700;
  color: var(--sz-primary, #114FA1);
  margin: 0 0 8px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.page-sidebar-sakura__info-title .material-symbols-outlined {
  font-size: 1rem;
}

.page-sidebar-sakura__info-text {
  font-size: 0.8125rem;
  color: #4b5563;
  line-height: 1.7;
  margin: 0;
}

.page-sidebar-sakura__info-tel {
  font-size: 1.25rem;
  font-weight: 700;
  color: #1f2937;
  margin: 4px 0;
}

.page-sidebar-sakura__info-tel a {
  color: inherit;
  text-decoration: none;
}

.page-sidebar-sakura__info-note {
  font-size: 0.75rem;
  color: #9ca3af;
  margin: 4px 0 0;
}

/* ================================================================
   Main Content（木古内スタイル）
   ================================================================ */
.page-main-sakura {
  min-width: 0;
}

.page-main-sakura__title {
  font-size: 1.75rem;
  font-weight: 700;
  color: #1f2937;
  margin: 0 0 2rem;
  padding-bottom: 1.5rem;
  border-bottom: 1px solid #e5e7eb;
}

/* ================================================================
   Section Header（浅香山スタイル - 緑左線見出し）
   ================================================================ */
.sakura-section {
  margin-bottom: 3rem;
}

.sakura-section:last-child {
  margin-bottom: 0;
}

.sakura-section__title {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  font-size: 1.25rem;
  font-weight: 700;
  color: #1f2937;
  margin: 0 0 1.5rem;
  padding: 12px 16px;
  padding-left: 20px;
  border-left: 4px solid var(--sz-primary, #114FA1);
  background: var(--sz-primary-50, #E8F0FA);
  border-radius: 0 6px 6px 0;
}

.sakura-section__title::before {
  display: none;
}

/* ================================================================
   Step Number（加須スタイル - 大きなステップ番号 01, 02...）
   ================================================================ */
.sakura-step {
  margin-bottom: 2.5rem;
}

.sakura-step__header {
  display: flex;
  align-items: baseline;
  gap: 1.25rem;
  margin-bottom: 1rem;
  padding-bottom: 1rem;
  border-bottom: 1px solid #e5e7eb;
}

.sakura-step__number {
  font-family: 'Inter', sans-serif;
  font-size: 2rem;
  font-weight: 700;
  color: var(--sz-primary, #114FA1);
  min-width: 3rem;
  letter-spacing: -0.02em;
  line-height: 1;
}

.sakura-step__title {
  font-size: 1.25rem;
  font-weight: 700;
  color: #1f2937;
  margin: 0;
}

.sakura-step__content {
  padding-left: 4.25rem;
}

/* ================================================================
   Info Box（木古内スタイル - 左線付きボックス）
   ================================================================ */
.sakura-box {
  padding: 1rem 1.25rem;
  margin-bottom: 1rem;
  border-left: 4px solid var(--sz-primary, #114FA1);
  background: #f9fafb;
}

.sakura-box__title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #1f2937;
  margin: 0 0 0.5rem;
}

.sakura-box__text {
  font-size: 0.875rem;
  color: #4b5563;
  line-height: 1.7;
  margin: 0;
}

/* ================================================================
   Table（木古内スタイル - 高級感のあるテーブル）
   ================================================================ */
.sakura-table-wrapper {
  overflow-x: auto;
  margin-block-end: 1.5rem;
  -webkit-overflow-scrolling: touch;
}

.sakura-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
  font-size: clamp(0.8125rem, 0.75rem + 0.25vw, 0.9375rem);
}

.sakura-table th,
.sakura-table td {
  padding: clamp(0.5rem, 0.375rem + 0.5vw, 0.875rem) clamp(0.625rem, 0.5rem + 0.5vw, 1rem);
  border: 1px solid #e5e7eb;
  text-align: left;
  line-height: 1.6;
}

.sakura-table thead th {
  background: var(--sz-primary, #114FA1);
  color: #fff;
  font-weight: 600;
  text-align: center;
  font-size: clamp(0.75rem, 0.6875rem + 0.25vw, 0.875rem);
  letter-spacing: 0.02em;
}

.sakura-table tbody th {
  background: #f9fafb;
  font-weight: 600;
  color: #374151;
  white-space: normal;
  word-break: auto-phrase;
  min-width: 5em;
}

@media (min-width: 768px) {
  .sakura-table tbody th {
    white-space: nowrap;
    width: 30%;
  }
}

.sakura-table tbody tr:hover {
  background: rgba(17, 79, 161, 0.03);
}

/* ================================================================
   List（木古内スタイル - チェック付きリスト）
   ================================================================ */
.sakura-list {
  list-style: none;
  padding: 0;
  margin: 0 0 1rem;
}

.sakura-list > li {
  position: relative;
  padding-inline-start: 1.25rem;
  padding-block: 0.375rem;
  line-height: 1.7;
  font-size: 0.9375rem;
  color: #374151;
}

.sakura-list > li::before {
  content: '';
  position: absolute;
  inset-inline-start: 0;
  top: 0.75rem;
  width: 6px;
  height: 6px;
  background: var(--sz-primary, #114FA1);
  border-radius: 50%;
}

/* ================================================================
   Contact Box（浅香山スタイル - 緑テーマお問い合わせボックス）
   ================================================================ */
.sakura-contact {
  background: var(--sz-primary-50, #E8F0FA);
  border: 1px solid #b8e6d4;
  border-radius: 8px;
  padding: 2rem;
  text-align: center;
  margin: 2rem 0;
}

.sakura-contact__label {
  font-size: 0.875rem;
  font-weight: 600;
  color: #1f2937;
  margin: 0 0 0.5rem;
}

.sakura-contact__name {
  font-size: 0.875rem;
  color: #6b7280;
  margin: 0 0 1rem;
}

.sakura-contact__tel {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--sz-primary, #114FA1);
  margin: 0 0 0.5rem;
}

.sakura-contact__tel a {
  color: inherit;
  text-decoration: none;
}

.sakura-contact__note {
  font-size: 0.8125rem;
  color: #6b7280;
  line-height: 1.6;
  margin: 0;
}

/* ================================================================
   Intro Text（ページ冒頭のリード文）
   ================================================================ */
.sakura-intro {
  font-size: 1rem;
  line-height: 1.8;
  color: #4b5563;
  margin-block-end: 2.5rem;
  padding-block: 1rem;
  border-block-end: 1px solid #e5e7eb;
}

.sakura-intro p {
  margin: 0;
}

/* ================================================================
   Box Variants（リード文・署名）
   ================================================================ */
.sakura-box__lead {
  font-size: 1.125rem;
  line-height: 1.6;
  color: var(--sz-primary, #114FA1);
  margin-block-end: 1rem;
}

.sakura-box__signature {
  margin-block-start: 1.5rem;
  padding-block-start: 1rem;
  border-block-start: 1px solid #e5e7eb;
  font-size: 0.9375rem;
  line-height: 1.8;
  color: #374151;
  text-align: right;
}

/* ================================================================
   Related Pages（加須スタイル - 関連ページグリッド）
   ================================================================ */
.sakura-related {
  margin-top: 4rem;
  padding-top: 3rem;
  border-top: 1px solid #e5e7eb;
}

.sakura-related__title {
  font-size: 1.1rem;
  font-weight: 700;
  color: #1f2937;
  margin: 0 0 1.5rem;
  display: flex;
  align-items: center;
  gap: 8px;
}

.sakura-related__title::before {
  content: '';
  width: 8px;
  height: 8px;
  background: var(--sz-primary, #114FA1);
  border-radius: 50%;
  flex-shrink: 0;
}

.sakura-related__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

.sakura-related__card {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 8px;
  text-decoration: none;
  color: #374151;
  font-size: 0.875rem;
  font-weight: 500;
  transition: all 0.2s ease;
}

.sakura-related__card:hover {
  border-color: var(--sz-primary, #114FA1);
  color: var(--sz-primary, #114FA1);
  box-shadow: 0 2px 8px rgba(72, 187, 143, 0.12);
}

.sakura-related__card-arrow {
  font-size: 1rem;
  color: #9ca3af;
  transition: color 0.2s ease;
}

.sakura-related__card:hover .sakura-related__card-arrow {
  color: var(--sz-primary, #114FA1);
}

/* ================================================================
   Quick Links（加須スタイル - パンくず下のクイックリンク行）
   ================================================================ */
.sakura-quick-links {
  background: #fff;
  padding: 12px 0;
  border-bottom: 1px solid #e5e7eb;
}

.sakura-quick-links__inner {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 40px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 24px;
}

.sakura-quick-links__item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 0.8125rem;
  color: var(--sz-primary, #114FA1);
  text-decoration: none;
  font-weight: 500;
  transition: color 0.2s ease;
}

.sakura-quick-links__item:hover {
  color: var(--sz-primary-dark, #0D3A75);
}

.sakura-quick-links__item::before {
  content: '◆';
  font-size: 0.5rem;
}

.sakura-quick-links__item .material-symbols-outlined {
  font-size: 0.875rem;
}

/* ================================================================
   よくアクセスされるページのご案内（浅香山スタイル - 第二フッター）
   サブページ用 - saikazo-home.css からコピー
   ================================================================ */
.sz-popular-footer {
  padding: 60px 40px;
  background: #fff;
  border-top: 1px solid #e5e7eb;
}

.sz-popular-footer__inner {
  max-width: 1280px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 60px;
  align-items: start;
}

.sz-popular-footer__header {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.sz-popular-footer__icon {
  font-size: 1.75rem;
  color: #9ca3af;
  margin-bottom: 0.5rem;
}

.sz-popular-footer__ttl {
  font-size: 1rem;
  font-weight: 600;
  color: #1f2937;
  line-height: 1.6;
  margin: 0;
}

.sz-popular-footer__en {
  font-size: 0.75rem;
  color: #9ca3af;
  letter-spacing: 0.05em;
}

.sz-popular-footer__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 0;
}

.sz-popular-footer__item {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding: 1.25rem 1rem;
  text-decoration: none;
  transition: background 0.2s ease;
  border-radius: 4px;
}

.sz-popular-footer__item:hover {
  background: #f9fafb;
}

.sz-popular-footer__item-icon {
  font-size: 1.5rem;
  color: #6b7280;
  margin-bottom: 0.75rem;
}

.sz-popular-footer__item-title {
  font-size: 0.9375rem;
  font-weight: 600;
  color: #1f2937;
  line-height: 1.4;
  margin-bottom: 0.25rem;
}

.sz-popular-footer__item:hover .sz-popular-footer__item-title {
  color: var(--sz-primary, #114FA1);
}

.sz-popular-footer__item-en {
  font-size: 0.6875rem;
  color: #9ca3af;
  letter-spacing: 0.02em;
}

/* ================================================================
   Responsive - 浅香山/加須スタイル
   ================================================================ */
@media (max-width: 1024px) {
  .page-container-sakura {
    grid-template-columns: 1fr;
    gap: 0;
    padding: 40px 20px 60px;
  }

  .page-sidebar-sakura {
    position: static;
    margin-bottom: 2rem;
  }

  .sakura-related__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .sakura-quick-links__inner {
    padding: 0 20px;
  }

  .sz-popular-footer__inner {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .sz-popular-footer__header {
    flex-direction: row;
    align-items: center;
    gap: 1rem;
  }

  .sz-popular-footer__icon {
    margin-bottom: 0;
  }

  .sz-popular-footer__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (max-width: 768px) {
  .page-breadcrumb__inner {
    padding: 0 20px;
  }

  .page-hero-sakura__inner {
    padding: 0 20px;
  }

  .sakura-related__grid {
    grid-template-columns: 1fr;
  }

  .sakura-quick-links__inner {
    padding: 0 16px;
    gap: 6px 16px;
  }

  .sz-popular-footer {
    padding: 40px 20px;
  }

  .sz-popular-footer__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .sakura-table th,
  .sakura-table td {
    padding: 0.625rem 0.75rem;
    font-size: 0.8125rem;
  }

  .sakura-table tbody th {
    white-space: normal;
    width: auto;
  }

  .sakura-section__title {
    font-size: 1.125rem;
    padding: 10px 14px;
    padding-left: 16px;
  }

  .sakura-intro {
    font-size: 0.9375rem;
  }
}

@media (max-width: 480px) {
  .sz-popular-footer__grid {
    grid-template-columns: 1fr;
  }
}

/* ================================================================
   Legacy Styles（後方互換性のため維持）
   ================================================================ */

/* ================================================================
   Page Hero（ページヒーロー）- Legacy
   ================================================================ */
.page-hero {
  position: relative;
  height: 320px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.page-hero__bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 1;
}

.page-hero__bg img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.page-hero__overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, rgba(17, 79, 161, 0.85) 0%, rgba(13, 61, 122, 0.9) 100%);
  z-index: 2;
}

.page-hero__content {
  position: relative;
  z-index: 3;
  text-align: center;
  color: var(--sz-white);
  padding: 0 20px;
}

.page-hero__category {
  display: inline-block;
  padding: 6px 20px;
  background: rgba(255, 255, 255, 0.15);
  border-radius: 50px;
  font-size: 0.8125rem;
  font-weight: 500;
  letter-spacing: 0.1em;
  margin-bottom: 16px;
}

.page-hero__title {
  margin: 0;
  overflow: visible;
}

.page-hero__title-en {
  display: block;
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 0.875rem;
  font-weight: 400;
  letter-spacing: 0.3em;
  text-transform: uppercase;
  opacity: 0.9;
  margin-bottom: 12px;
  white-space: nowrap;
}

.page-hero__title-ja {
  display: block;
  font-size: 2.5rem;
  font-weight: 700;
  line-height: 1.3;
}

/* ================================================================
   Page Container（ページコンテナ）- Legacy
   ================================================================ */
.page-container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 60px 20px 80px;
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 48px;
}

/* ================================================================
   Page Main（メインコンテンツ）- Legacy
   ================================================================ */
.page-main {
  background: var(--sz-white);
  border-radius: 12px;
  padding: 48px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
}

/* セクション見出し */
.page-section {
  margin-bottom: 48px;
}

.page-section:last-child {
  margin-bottom: 0;
}

.page-section__title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 0 0 24px;
  padding-bottom: 16px;
  border-bottom: 3px solid var(--sz-primary);
}

.page-section__title .material-symbols-outlined {
  font-size: 1.75rem;
  color: var(--sz-primary);
}

.page-section__title--sub {
  font-size: 1.25rem;
  border-bottom-width: 2px;
  margin-bottom: 20px;
  padding-bottom: 12px;
}

/* 本文 */
.page-text {
  font-size: 0.9375rem;
  line-height: 1.9;
  color: var(--sz-text);
}

.page-text p {
  margin: 0 0 1.5em;
}

.page-text p:last-child {
  margin-bottom: 0;
}

/* リスト */
.page-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.page-list li {
  position: relative;
  padding-left: 24px;
  margin-bottom: 12px;
  line-height: 1.7;
}

.page-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 10px;
  width: 8px;
  height: 8px;
  background: var(--sz-primary);
  border-radius: 50%;
}

/* テーブル */
.page-table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
}

.page-table th,
.page-table td {
  padding: 16px 20px;
  text-align: left;
  border: 1px solid var(--sz-gray-200);
  font-size: 0.875rem;
  line-height: 1.6;
}

.page-table th {
  background: var(--sz-primary);
  color: var(--sz-white);
  font-weight: 600;
  white-space: nowrap;
}

.page-table tbody th {
  background: var(--sz-primary-light);
  color: var(--sz-text);
  width: 160px;
}

.page-table tbody tr:nth-child(even) {
  background: var(--sz-gray-50);
}

/* ボックス */
.page-box {
  background: var(--sz-gray-50);
  border-radius: 8px;
  padding: 24px;
  margin: 24px 0;
}

.page-box--info {
  background: var(--sz-primary-light);
  border-left: 4px solid var(--sz-primary);
}

.page-box--warning {
  background: #fef3cd;
  border-left: 4px solid #ffc107;
}

.page-box--danger {
  background: #f8d7da;
  border-left: 4px solid #dc3545;
}

.page-box__title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 12px;
}

.page-box__title .material-symbols-outlined {
  font-size: 1.375rem;
  color: var(--sz-primary);
}

/* ================================================================
   Hours Box（診療時間ボックス）
   ================================================================ */
.hours-box {
  background: linear-gradient(135deg, #f0f9ff 0%, #e8f4fd 100%);
  border-radius: 16px;
  padding: 32px;
  border: 2px solid var(--sz-primary);
  box-shadow: 0 4px 20px rgba(0, 123, 199, 0.1);
}

.hours-box__main {
  display: flex;
  justify-content: center;
  gap: 48px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}

.hours-box__time {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.hours-box__label {
  display: inline-block;
  background: var(--sz-primary);
  padding: 0 20px;
}

.page-breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 0.8125rem;
}

.page-breadcrumb__item {
  display: flex;
  align-items: center;
  gap: 8px;
}

.page-breadcrumb__item::after {
  content: '';
  display: block;
  width: 6px;
  height: 6px;
  border-top: 1px solid var(--sz-gray-400);
  border-right: 1px solid var(--sz-gray-400);
  transform: rotate(45deg);
}

.page-breadcrumb__item:last-child::after {
  display: none;
}

.page-breadcrumb__item a {
  display: flex;
  align-items: center;
  gap: 4px;
  color: var(--sz-primary);
  text-decoration: none;
  transition: opacity 0.2s ease;
}

.page-breadcrumb__item a:hover {
  opacity: 0.7;
}

.page-breadcrumb__item a .material-symbols-outlined {
  font-size: 1.125rem;
}

.page-breadcrumb__item:last-child a {
  color: var(--sz-text-light);
  pointer-events: none;
}

/* ================================================================
   Page Container（ページコンテナ）
   ================================================================ */
.page-container {
  max-width: 1440px;
  margin: 0 auto;
  padding: 60px 20px 80px;
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 48px;
}

/* ================================================================
   Page Main（メインコンテンツ）
   ================================================================ */
.page-main {
  background: var(--sz-white);
  border-radius: 12px;
  padding: 48px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
}

/* セクション見出し */
.page-section {
  margin-bottom: 48px;
}

.page-section:last-child {
  margin-bottom: 0;
}

.page-section__title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 0 0 24px;
  padding-bottom: 16px;
  border-bottom: 3px solid var(--sz-primary);
}

.page-section__title .material-symbols-outlined {
  font-size: 1.75rem;
  color: var(--sz-primary);
}

.page-section__title--sub {
  font-size: 1.25rem;
  border-bottom-width: 2px;
  margin-bottom: 20px;
  padding-bottom: 12px;
}

/* 本文 */
.page-text {
  font-size: 0.9375rem;
  line-height: 1.9;
  color: var(--sz-text);
}

.page-text p {
  margin: 0 0 1.5em;
}

.page-text p:last-child {
  margin-bottom: 0;
}

/* リスト */
.page-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.page-list li {
  position: relative;
  padding-left: 24px;
  margin-bottom: 12px;
  line-height: 1.7;
}

.page-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 10px;
  width: 8px;
  height: 8px;
  background: var(--sz-primary);
  border-radius: 50%;
}

/* テーブル */
.page-table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
}

.page-table th,
.page-table td {
  padding: 16px 20px;
  text-align: left;
  border: 1px solid var(--sz-gray-200);
  font-size: 0.875rem;
  line-height: 1.6;
}

.page-table th {
  background: var(--sz-primary);
  color: var(--sz-white);
  font-weight: 600;
  white-space: nowrap;
}

.page-table tbody th {
  background: var(--sz-primary-light);
  color: var(--sz-text);
  width: 160px;
}

.page-table tbody tr:nth-child(even) {
  background: var(--sz-gray-50);
}

/* ボックス */
.page-box {
  background: var(--sz-gray-50);
  border-radius: 8px;
  padding: 24px;
  margin: 24px 0;
}

.page-box--info {
  background: var(--sz-primary-light);
  border-left: 4px solid var(--sz-primary);
}

.page-box--warning {
  background: #fef3cd;
  border-left: 4px solid #ffc107;
}

.page-box--danger {
  background: #f8d7da;
  border-left: 4px solid #dc3545;
}

.page-box__title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 12px;
}

.page-box__title .material-symbols-outlined {
  font-size: 1.375rem;
  color: var(--sz-primary);
}

/* ================================================================
   Hours Box（診療時間ボックス）
   ================================================================ */
.hours-box {
  background: linear-gradient(135deg, #f0f9ff 0%, #e8f4fd 100%);
  border-radius: 16px;
  padding: 32px;
  border: 2px solid var(--sz-primary);
  box-shadow: 0 4px 20px rgba(0, 123, 199, 0.1);
}

.hours-box__main {
  display: flex;
  justify-content: center;
  gap: 48px;
  margin-bottom: 24px;
  flex-wrap: wrap;
}

.hours-box__time {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.hours-box__label {
  display: inline-block;
  background: var(--sz-primary);
  color: var(--sz-white);
  font-size: 0.875rem;
  font-weight: 600;
  padding: 4px 20px;
  border-radius: 50px;
  letter-spacing: 0.05em;
}

.hours-box__value {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 2rem;
  font-weight: 700;
  color: var(--sz-text);
  letter-spacing: 0.02em;
  font-variant-numeric: tabular-nums;
}

.hours-box__note {
  background: var(--sz-white);
  border-radius: 8px;
  padding: 16px 24px;
  text-align: center;
}

.hours-box__note p {
  margin: 0 0 8px;
  font-size: 0.875rem;
  color: var(--sz-text-light);
}

.hours-box__note p:last-child {
  margin-bottom: 0;
}

.hours-box__note strong {
  color: var(--sz-text);
  font-weight: 600;
}

/* ================================================================
   Guide Grid & Cards（案内グリッド＆カード）
   ================================================================ */
.guide-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
}

.guide-card {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 24px;
  background: var(--sz-white);
  border: 1px solid var(--sz-gray-200);
  border-radius: 12px;
  text-decoration: none;
  transition: all 0.3s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.guide-card:hover {
  border-color: var(--sz-primary);
  box-shadow: 0 8px 24px rgba(0, 123, 199, 0.12);
  transform: translateY(-2px);
}

.guide-card__icon {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  background: var(--sz-primary-light);
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.guide-card__icon .material-symbols-outlined {
  font-size: 1.75rem;
  color: var(--sz-primary);
}

.guide-card__content {
  flex: 1;
  min-width: 0;
}

.guide-card__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 0 0 6px;
}

.guide-card__text {
  font-size: 0.8125rem;
  color: var(--sz-text-light);
  margin: 0;
  line-height: 1.6;
}

.guide-card__arrow {
  flex-shrink: 0;
  color: var(--sz-gray-400);
  transition: transform 0.3s ease, color 0.3s ease;
}

.guide-card__arrow .material-symbols-outlined {
  font-size: 1.5rem;
}

.guide-card:hover .guide-card__arrow {
  color: var(--sz-primary);
  transform: translateX(4px);
}

/* ================================================================
   Checklist（チェックリスト）
   ================================================================ */
.checklist {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 12px;
  padding: 24px;
  background: var(--sz-gray-50);
  border-radius: 12px;
  margin-bottom: 24px;
}

.checklist__item {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.9375rem;
  color: var(--sz-text);
}

.checklist__item .material-symbols-outlined {
  font-size: 1.25rem;
  color: #22c55e;
}

/* ================================================================
   Page Sidebar（サイドバー）
   木古内スタイル: スティッキー対応
   ================================================================ */
.page-sidebar {
  display: flex;
  flex-direction: column;
  gap: 24px;
  /* スティッキーサイドバー（木古内スタイル） */
  position: sticky;
  top: 130px; /* ヘッダー高さ + 余白 */
  height: fit-content;
  align-self: start;
}

.sidebar-box {
  background: var(--sz-white);
  border-radius: 12px;
  padding: 24px;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.06);
}

.sidebar-box__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--sz-primary);
}

.sidebar-box__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sidebar-box__list li {
  border-bottom: 1px solid var(--sz-gray-100);
}

.sidebar-box__list li:last-child {
  border-bottom: none;
}

.sidebar-box__list a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 0;
  font-size: 0.875rem;
  color: var(--sz-text);
  text-decoration: none;
  transition: color 0.2s ease;
}

.sidebar-box__list a::before {
  content: '';
  display: block;
  width: 6px;
  height: 6px;
  background: var(--sz-primary);
  border-radius: 50%;
  flex-shrink: 0;
}

.sidebar-box__list a:hover {
  color: var(--sz-primary);
}

/* サイドバー お問い合わせ */
.sidebar-box--contact {
  background: var(--sz-primary);
  color: var(--sz-white);
}

.sidebar-box--contact .sidebar-box__title {
  color: var(--sz-white);
  border-bottom-color: rgba(255, 255, 255, 0.3);
}

.sidebar-box__tel {
  margin: 0 0 8px;
}

.sidebar-box__tel a {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--sz-white);
  text-decoration: none;
}

.sidebar-box__tel .material-symbols-outlined {
  font-size: 1.75rem;
}

.sidebar-box__time {
  font-size: 0.75rem;
  text-align: center;
  margin: 0 0 16px;
  opacity: 0.9;
}

.sidebar-box__btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  padding: 14px;
  background: var(--sz-white);
  color: var(--sz-primary);
  border-radius: 8px;
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.2s ease;
}

.sidebar-box__btn:hover {
  background: var(--sz-gray-100);
}

.sidebar-box__btn .material-symbols-outlined {
  font-size: 1.25rem;
}

/* ================================================================
   Page CTA（ページ下部CTA）
   ================================================================ */
.page-cta {
  background: var(--sz-gray-100);
  padding: 60px 20px;
}

.page-cta__inner {
  max-width: 1000px;
  margin: 0 auto;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.page-cta__item {
  display: flex;
  align-items: center;
  gap: 20px;
  background: var(--sz-white);
  border-radius: 12px;
  padding: 28px 32px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.page-cta__item:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

.page-cta__item > .material-symbols-outlined {
  font-size: 3rem;
  color: var(--sz-primary);
}

.page-cta__text {
  flex: 1;
}

.page-cta__label {
  font-size: 0.75rem;
  color: var(--sz-text-light);
  margin: 0 0 4px;
}

.page-cta__title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 0;
}

.page-cta__link {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 14px 28px;
  background: var(--sz-primary);
  color: var(--sz-white);
  border-radius: 50px;
  font-size: 0.875rem;
  font-weight: 600;
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.2s ease;
}

.page-cta__link:hover {
  background: var(--sz-primary-dark);
}

.page-cta__item--access > .material-symbols-outlined {
  color: var(--sz-accent);
}

/* ================================================================
   Responsive - Tablet
   ================================================================ */
@media (max-width: 1024px) {
  .page-container {
    grid-template-columns: 1fr;
    gap: 40px;
    padding: 40px 20px 60px;
  }

  .page-sidebar {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }
}

/* ================================================================
   Responsive - Mobile
   ================================================================ */
@media (max-width: 768px) {
  .page-hero {
    height: 240px;
  }

  .page-hero__category {
    font-size: 0.6875rem;
    padding: 4px 14px;
    margin-bottom: 12px;
  }

  .page-hero__title-en {
    font-size: 0.75rem;
  }

  .page-hero__title-ja {
    font-size: 1.75rem;
  }

  /* Hours Box Mobile */
  .hours-box {
    padding: 24px 16px;
  }

  .hours-box__main {
    flex-direction: column;
    gap: 20px;
  }

  .hours-box__value {
    font-size: 1.5rem;
  }

  .hours-box__note {
    padding: 12px 16px;
  }

  .hours-box__note p {
    font-size: 0.8125rem;
  }

  /* Guide Grid Mobile */
  .guide-grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .guide-card {
    padding: 16px;
    gap: 12px;
  }

  .guide-card__icon {
    width: 48px;
    height: 48px;
  }

  .guide-card__icon .material-symbols-outlined {
    font-size: 1.5rem;
  }

  .guide-card__title {
    font-size: 0.9375rem;
  }

  /* Checklist Mobile */
  .checklist {
    grid-template-columns: 1fr;
    padding: 16px;
    gap: 10px;
  }

  .checklist__item {
    font-size: 0.875rem;
  }

  .page-breadcrumb {
    padding: 12px 0;
  }

  .page-breadcrumb__list {
    font-size: 0.75rem;
  }

  .page-container {
    padding: 32px 16px 48px;
  }

  .page-main {
    padding: 28px 20px;
    border-radius: 8px;
  }

  .page-section__title {
    font-size: 1.25rem;
    gap: 10px;
  }

  .page-section__title .material-symbols-outlined {
    font-size: 1.5rem;
  }

  .page-table th,
  .page-table td {
    padding: 12px 14px;
    font-size: 0.8125rem;
  }

  .page-table tbody th {
    width: 100px;
  }

  .page-sidebar {
    grid-template-columns: 1fr;
  }

  .page-cta {
    padding: 40px 16px;
  }

  .page-cta__inner {
    grid-template-columns: 1fr;
    gap: 16px;
  }

  .page-cta__item {
    padding: 24px 20px;
    flex-wrap: wrap;
  }

  .page-cta__item > .material-symbols-outlined {
    font-size: 2.25rem;
  }

  .page-cta__title {
    font-size: 1rem;
  }

  .page-cta__link {
    width: 100%;
    margin-top: 12px;
  }
}

/* ================================================================
   NOTE: Wearable (280px) styles removed - not present in saikazo.org
   ================================================================ */

/* ================================================================
   コンテンツ用ユーティリティ
   ================================================================ */

/* 2カラムレイアウト */
.page-cols {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
  margin: 24px 0;
}

@media (max-width: 768px) {
  .page-cols {
    grid-template-columns: 1fr;
    gap: 24px;
  }
}

/* カード */
.page-card {
  background: var(--sz-white);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.page-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

.page-card__img {
  aspect-ratio: 16 / 9;
  overflow: hidden;
}

.page-card__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.page-card:hover .page-card__img img {
  transform: scale(1.05);
}

.page-card__body {
  padding: 24px;
}

.page-card__title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 0 0 12px;
}

.page-card__text {
  font-size: 0.875rem;
  line-height: 1.7;
  color: var(--sz-text-light);
  margin: 0;
}

/* ボタン */
.page-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 32px;
  background: var(--sz-primary);
  color: var(--sz-white);
  border: none;
  border-radius: 50px;
  font-size: 0.9375rem;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s ease;
}

.page-btn:hover {
  background: var(--sz-primary-dark);
  transform: translateY(-2px);
}

.page-btn--outline {
  background: transparent;
  color: var(--sz-primary);
  border: 2px solid var(--sz-primary);
}

.page-btn--outline:hover {
  background: var(--sz-primary);
  color: var(--sz-white);
}

.page-btn--accent {
  background: var(--sz-accent);
}

.page-btn--accent:hover {
  background: #d44800;
}

.page-btn .material-symbols-outlined {
  font-size: 1.25rem;
}

/* === object/project/_saikazo-subpage-detail.css === */

/* ================================================================
   saikazo-subpage-detail.css
   木古内町国民健康保険病院スタイル 詳細サブページ

   注意: CSS変数は variables.css で一元管理されています。
   --sz-* プレフィックスの変数を使用してください。
   ================================================================ */

/* ================================================================
   Page Hero（ページヒーロー）- 浅香山/加須スタイル（淡いグリーングラデーション）
   ================================================================ */
.sz-page-hero {
  position: relative;
  height: auto;
  min-height: 100px;
  padding: 40px 5%;
  padding-top: calc(64px + 40px);
  background: linear-gradient(135deg, #e8f7f0 0%, #f0faf5 50%, #ffffff 100%);
  display: flex;
  align-items: center;
  justify-content: flex-start;
}

/* PC時のヘッダー高さ対応 */
@media (min-width: 1024px) {
  .sz-page-hero {
    padding-top: calc(var(--header-height, 90px) + 40px);
  }
}

/* ヒーローが main の外にあるとき、main の padding-top を除去 */
.sz-page-hero + .l-main {
  padding-top: 0;
  padding-block-start: 0;
}

.sz-page-hero::before {
  display: none;
}

.sz-page-hero__content {
  position: relative;
  z-index: 2;
  text-align: left;
  color: #1a4a7a;
  padding: 0 20px;
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
}

.sz-page-hero__en {
  display: block;
  font-family: 'Inter', sans-serif;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--sz-primary, #114FA1);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  margin-bottom: 8px;
}

.sz-page-hero__title {
  font-size: 2rem;
  font-weight: 600;
  margin: 0;
  padding-left: 20px;
  border-left: 4px solid var(--sz-primary, #114FA1);
  letter-spacing: 0.05em;
  font-family: 'Noto Sans JP', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  text-shadow: none;
  overflow-wrap: break-word;
  color: #1a4a7a;
}

/* ================================================================
   Hero Breadcrumb（ヒーロー内パンくずリスト）
   ================================================================ */
.sz-hero-breadcrumb {
  margin-bottom: 16px;
}

.sz-hero-breadcrumb__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 8px;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 0.875rem;
}

.sz-hero-breadcrumb__item {
  display: flex;
  align-items: center;
  gap: 8px;
}

.sz-hero-breadcrumb__item::after {
  content: '>';
  color: rgba(255, 255, 255, 0.6);
}

.sz-hero-breadcrumb__item:last-child::after {
  display: none;
}

.sz-hero-breadcrumb__link {
  color: rgba(255, 255, 255, 0.85);
  text-decoration: none;
  transition: color 0.2s;
}

.sz-hero-breadcrumb__link:hover {
  color: var(--color-white);
  text-decoration: underline;
}

.sz-hero-breadcrumb__current {
  color: var(--color-white);
  font-weight: 500;
}

/* ================================================================
   Page Sub Navigation（浅香山スタイル - 緑タブバー）
   ================================================================ */
.sz-subnav {
  background: var(--color-white);
  border-bottom: 2px solid #e5e7eb;
  position: sticky;
  top: var(--header-height, 90px);
  z-index: 100;
  margin-top: 0;
}

@media (max-width: 1024px) {
  .sz-subnav {
    top: var(--header-height-mobile, 60px);
  }
}

.sz-subnav__inner {
  max-width: 1200px;
  margin: 0 auto;
  display: flex;
  overflow-x: auto;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

.sz-subnav__inner::-webkit-scrollbar {
  display: none;
}

.sz-subnav__item {
  flex-shrink: 0;
  padding: 16px 24px;
  font-size: 0.875rem;
  font-weight: 500;
  color: #6b7280;
  text-decoration: none;
  position: relative;
  transition: all 0.2s ease;
  display: flex;
  align-items: center;
  gap: 6px;
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
}

.sz-subnav__item::before {
  display: none;
}

.sz-subnav__item:hover {
  color: var(--sz-primary, #114FA1);
}

.sz-subnav__item.is-active {
  color: var(--sz-primary, #114FA1);
  font-weight: 700;
  border-bottom-color: var(--sz-primary, #114FA1);
}

.sz-subnav__item.is-active::after {
  display: none;
}

/* ================================================================
   Page Layout（ページレイアウト）
   ================================================================ */
.sz-page-layout {
  max-width: 1200px;
  margin: 0 auto;
  padding: 48px 24px 80px;
  display: grid;
  grid-template-columns: 1fr 320px;
  gap: 48px;
}

/* ================================================================
   Main Content（メインコンテンツ）
   ================================================================ */
.sz-main {
  min-width: 0;
}

/* 画像付きリードセクション */
.sz-lead-section {
  margin-bottom: 48px;
}

.sz-lead-section__image {
  border-radius: 12px;
  overflow: hidden;
  margin-bottom: 32px;
}

.sz-lead-section__image img {
  width: 100%;
  height: auto;
  display: block;
}

/* ================================================================
   受付時間テーブル（木古内スタイル）
   ================================================================ */
.sz-hours-table {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 24px;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0,0,0,0.08);
}

.sz-hours-table__header {
  background: var(--sz-primary);
  color: var(--color-white);
  text-align: center;
  padding: 16px 20px;
  font-size: 1rem;
  font-weight: 700;
}

.sz-hours-table th,
.sz-hours-table td {
  padding: 16px 24px;
  border: 1px solid var(--sz-border);
  font-size: 0.875rem;
  line-height: 1.8;
}

.sz-hours-table th {
  background: #f5f8fc;
  color: var(--sz-text);
  font-weight: 600;
  text-align: center;
  width: 120px;
}

.sz-hours-table td {
  background: var(--color-white);
}

.sz-hours-table__note {
  color: var(--sz-text-light);
  font-size: 0.8125rem;
  margin-top: 4px;
}

.sz-table-notes {
  margin-top: 16px;
  font-size: 0.8125rem;
  color: #c00;
  line-height: 1.8;
}

.sz-table-notes p {
  margin: 4px 0;
}

/* ================================================================
   セクション見出し（木古内スタイル）
   ================================================================ */
.sz-section {
  margin-bottom: 48px;
  scroll-margin-top: 160px; /* ヘッダー + サブナビ分のオフセット */
}

.sz-section:last-child {
  margin-bottom: 0;
}

.sz-section__title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 0 0 24px;
  padding: 12px 16px 12px 20px;
  border-left: 4px solid var(--sz-primary, #114FA1);
  background: #f0faf5;
  border-radius: 0 6px 6px 0;
}

.sz-section__title--orange {
  border-left-color: var(--sz-orange);
  background: #fff8f0;
}

.sz-section__title .material-symbols-outlined {
  font-size: 1.5rem;
  color: var(--sz-primary);
}

/* ================================================================
   コンテンツボックス
   ================================================================ */
.sz-content-box {
  background: var(--color-white);
  border-radius: 8px;
  padding: 28px 32px;
  margin-bottom: 24px;
  box-shadow: 0 2px 8px rgba(0,0,0,0.04);
  border: 1px solid var(--sz-border);
}

.sz-content-box__text {
  font-size: 0.9375rem;
  line-height: 2;
  color: var(--sz-text);
}

.sz-content-box__text p {
  margin: 0 0 1.2em;
}

.sz-content-box__text p:last-child {
  margin-bottom: 0;
}

/* 初診とは リスト */
.sz-definition-list {
  background: #f5f8fc;
  border-radius: 8px;
  padding: 20px 24px;
  margin: 20px 0;
}

.sz-definition-list__title {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--sz-primary);
  margin: 0 0 12px;
}

.sz-definition-list ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sz-definition-list li {
  position: relative;
  padding-left: 20px;
  margin-bottom: 8px;
  font-size: 0.875rem;
  line-height: 1.7;
  color: var(--sz-text);
}

.sz-definition-list li::before {
  content: '●';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--sz-primary);
  font-size: 0.5rem;
  line-height: 22px;
}

/* ================================================================
   アコーディオン（木古内スタイル）
   ================================================================ */
.sz-accordion {
  border: 1px solid var(--sz-border);
  border-radius: 8px;
  margin-bottom: 16px;
  overflow: hidden;
}

.sz-accordion__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  background: var(--color-white);
  cursor: pointer;
  transition: background 0.2s ease;
}

.sz-accordion__header:hover {
  background: var(--sz-gray-50);
}

.sz-accordion__title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-text);
  margin: 0;
}

.sz-accordion__title::before {
  content: '●';
  color: var(--sz-primary);
  font-size: 0.625rem;
}

.sz-accordion__icon {
  font-size: 1.5rem;
  color: var(--sz-gray-400);
  transition: transform 0.3s ease;
}

.sz-accordion.is-open .sz-accordion__icon {
  transform: rotate(45deg);
}

.sz-accordion__content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.3s ease;
  padding: 0 24px;
  font-size: 0.875rem;
  line-height: 1.8;
  color: var(--sz-text);
}

.sz-accordion.is-open .sz-accordion__content {
  padding: 0 24px 24px;
}

/* ================================================================
   初診の流れ（ステップ表示）
   ================================================================ */
.sz-flow {
  margin: 32px 0;
}

.sz-flow__item {
  display: grid;
  grid-template-columns: 80px 1fr;
  gap: 24px;
  padding: 32px 0;
  border-bottom: 1px solid var(--sz-border);
  position: relative;
}

.sz-flow__item:last-child {
  border-bottom: none;
}

.sz-flow__number {
  font-family: 'Inter', 'Noto Sans JP', sans-serif;
  font-size: 3rem;
  font-weight: 600;
  color: var(--sz-primary);
  line-height: 1;
  text-align: center;
}

.sz-flow__number--emoji {
  font-size: 2rem;
}

.sz-flow__content {
  flex: 1;
}

.sz-flow__title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 0 0 12px;
  padding-left: 16px;
  border-left: 4px solid var(--sz-primary);
}

.sz-flow__text {
  font-size: 0.9375rem;
  line-height: 1.9;
  color: var(--sz-text);
  margin: 0;
}

.sz-flow__text p {
  margin: 0 0 1em;
}

.sz-flow__text p:last-child {
  margin-bottom: 0;
}

.sz-flow__link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  color: var(--sz-primary);
  text-decoration: underline;
  font-size: 0.875rem;
  margin-top: 12px;
}

.sz-flow__link:hover {
  text-decoration: none;
}

/* 持ち物リスト */
.sz-checklist {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin: 16px 0;
  padding: 20px;
  background: #f5f8fc;
  border-radius: 8px;
}

.sz-checklist__item {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.875rem;
  color: var(--sz-text);
}

.sz-checklist__item .material-symbols-outlined {
  font-size: 1.125rem;
  color: var(--sz-primary);
}

/* ステップ内リスト */
.sz-step-list {
  background: #f5f8fc;
  border-radius: 8px;
  padding: 20px 24px;
  margin: 16px 0;
}

.sz-step-list__item {
  display: flex;
  gap: 12px;
  margin-bottom: 16px;
  font-size: 0.875rem;
  line-height: 1.7;
}

.sz-step-list__item:last-child {
  margin-bottom: 0;
}

.sz-step-list__num {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
  background: var(--sz-primary);
  color: var(--color-white);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.75rem;
  font-weight: 700;
}

/* ================================================================
   関連ページセクション
   ================================================================ */
.sz-related {
  background: var(--color-white);
  border-radius: 12px;
  padding: 32px;
  margin: 48px 0;
  border: 1px solid var(--sz-border);
  scroll-margin-top: 160px; /* ヘッダー + サブナビ分のオフセット */
}

/* 関連ページ - 基本スタイルは4053行目で定義 */

.sz-related__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.sz-related__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 8px;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--sz-text);
  text-decoration: none;
  transition: all 0.2s ease;
}

.sz-related__link:hover {
  background: var(--sz-gray-50);
  border-color: var(--sz-primary);
  color: var(--sz-primary);
}

.sz-related__link .material-symbols-outlined {
  font-size: 1.125rem;
  color: var(--sz-primary);
}

/* よくご覧いただくページ */
.sz-popular {
  background: #f5f8fc;
  border-radius: 12px;
  padding: 32px;
  margin: 48px 0;
}

.sz-popular__title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--sz-orange);
  margin: 0 0 24px;
}

.sz-popular__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.sz-popular__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 50px;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--sz-text);
  text-decoration: none;
  transition: all 0.2s ease;
}

.sz-popular__link:hover {
  background: var(--sz-gray-50);
  border-color: var(--sz-orange);
  color: var(--sz-orange);
}

.sz-popular__link .material-symbols-outlined {
  font-size: 1.125rem;
  color: var(--sz-orange);
}

.sz-popular__link:hover .material-symbols-outlined {
  color: var(--sz-orange);
}

/* ================================================================
   Sidebar（サイドバー）- 木古内スタイル
   ================================================================ */
.sz-sidebar {
  position: sticky;
  top: 120px;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

/* サイドバータイトル */
.sz-sidebar__title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1rem;
  font-weight: 700;
  color: var(--sz-primary);
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--sz-primary);
}

.sz-sidebar__title::before {
  content: '●';
  font-size: 0.625rem;
}

/* サイドナビゲーション */
.sz-sidebar-nav {
  background: var(--color-white);
  border-radius: 0;
  padding: 0;
  border: none;
}

.sz-sidebar-nav__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sz-sidebar-nav__item {
  border-bottom: 1px dotted #ccc;
}

.sz-sidebar-nav__item:last-child {
  border-bottom: 1px dotted #ccc;
}

.sz-sidebar-nav__link {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 0;
  font-size: 0.875rem;
  color: var(--color-text-primary);
  text-decoration: none;
  transition: color 0.2s ease;
}

/* 矢印アイコン */
.sz-sidebar-nav__link .material-symbols-outlined {
  font-size: 1rem;
  color: var(--sz-primary);
}

.sz-sidebar-nav__link::before {
  display: none;
}

.sz-sidebar-nav__link:hover,
.sz-sidebar-nav__item--active .sz-sidebar-nav__link {
  color: var(--sz-primary);
}

/* サイドバー カテゴリー件数表示（木古内スタイル） */
.sz-sidebar-nav__count {
  margin-left: auto;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--sz-primary, #114FA1);
  opacity: 0.8;
}

.sz-sidebar-nav__item--active .sz-sidebar-nav__count {
  opacity: 1;
}

/* サイドバー アイコンリンク */
.sz-sidebar-icons {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.sz-sidebar-icon-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  padding: 20px 16px;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.2s ease;
}

.sz-sidebar-icon-link:hover {
  border-color: var(--sz-primary);
  box-shadow: 0 4px 12px rgba(17, 79, 161, 0.15);
}

.sz-sidebar-icon-link__icon {
  width: 48px;
  height: 48px;
  background: linear-gradient(135deg, #4ecdc4 0%, #44a08d 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sz-sidebar-icon-link__icon .material-symbols-outlined {
  font-size: 1.5rem;
  color: var(--color-white);
}

.sz-sidebar-icon-link__icon--green {
  background: linear-gradient(135deg, #4ecdc4 0%, #44a08d 100%);
}

.sz-sidebar-icon-link__icon--teal {
  background: linear-gradient(135deg, #20c997 0%, #17a2b8 100%);
}

.sz-sidebar-icon-link__text {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--sz-text);
  text-align: center;
  line-height: 1.4;
}

/* 診療予約リンク */
.sz-sidebar-reserve {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.2s ease;
}

.sz-sidebar-reserve:hover {
  border-color: var(--sz-primary);
}

.sz-sidebar-reserve__left {
  display: flex;
  align-items: center;
  gap: 12px;
}

.sz-sidebar-reserve__icon {
  font-size: 1.5rem;
  color: var(--sz-primary);
}

.sz-sidebar-reserve__text {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--sz-text);
}

.sz-sidebar-reserve__arrow {
  font-size: 1.25rem;
  color: var(--sz-primary);
}

/* 関連ページセクション */
.sz-sidebar-related {
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 8px;
  padding: 20px;
  margin-top: 24px;
}

.sz-sidebar-related .sz-sidebar__title {
  margin-top: 0;
  margin-bottom: 16px;
}

.sz-sidebar-related__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sz-sidebar-related__list li {
  border-bottom: 1px solid var(--sz-border);
}

.sz-sidebar-related__list li:last-child {
  border-bottom: none;
}

.sz-sidebar-related__list a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 0;
  color: var(--sz-text);
  text-decoration: none;
  font-size: 0.875rem;
  transition: color 0.2s ease;
}

.sz-sidebar-related__list a::before {
  content: '›';
  font-size: 1rem;
  color: var(--sz-primary);
  font-weight: 600;
}

.sz-sidebar-related__list a:hover {
  color: var(--sz-primary);
}

/* ================================================================
   Breadcrumb（パンくずリスト）- ページ下部
   ================================================================ */
.sz-breadcrumb-bottom {
  background: var(--color-white);
  padding: 24px 0;
  border-top: 1px solid var(--sz-border);
}

.sz-breadcrumb-bottom__inner {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
}

.sz-breadcrumb-bottom__list {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 0.8125rem;
}

.sz-breadcrumb-bottom__item {
  display: flex;
  align-items: center;
  gap: 12px;
}

.sz-breadcrumb-bottom__item::after {
  content: '—';
  color: var(--sz-gray-400);
}

.sz-breadcrumb-bottom__item:last-child::after {
  display: none;
}

.sz-breadcrumb-bottom__link {
  color: var(--sz-primary);
  text-decoration: none;
}

.sz-breadcrumb-bottom__link:hover {
  text-decoration: underline;
}

.sz-breadcrumb-bottom__current {
  color: var(--sz-text);
}

/* 後方互換性: 旧クラス名のエイリアス */
.sz-breadcrumb-bottom .page-breadcrumb__item {
  display: flex;
  align-items: center;
  gap: 12px;
}
.sz-breadcrumb-bottom .page-breadcrumb__item::after {
  content: '—';
  color: var(--sz-gray-400);
}
.sz-breadcrumb-bottom .page-breadcrumb__item:last-child::after {
  display: none;
}
.sz-breadcrumb-bottom .page-breadcrumb__item a {
  color: var(--sz-primary);
  text-decoration: none;
}
.sz-breadcrumb-bottom .page-breadcrumb__item a:hover {
  text-decoration: underline;
}

/* ================================================================
   サイトマップバー
   ================================================================ */
.sz-sitemap-bar {
  background: var(--sz-primary);
  padding: 16px;
  text-align: center;
}

.sz-sitemap-bar__btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: var(--color-white);
  font-size: 0.875rem;
  font-weight: 500;
  text-decoration: none;
  cursor: pointer;
}

.sz-sitemap-bar__btn .material-symbols-outlined {
  font-size: 1.25rem;
}

/* ================================================================
   Responsive - Tablet
   ================================================================ */
@media (max-width: 1024px) {
  .sz-page-layout {
    grid-template-columns: 1fr;
    gap: 40px;
    padding: 32px 20px 60px;
  }

  .sz-sidebar {
    position: static;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
  }

  .sz-sidebar-nav {
    grid-column: 1 / -1;
  }

  .sz-related__grid,
  .sz-popular__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .sz-checklist {
    grid-template-columns: 1fr;
  }
}

/* ================================================================
   Responsive - Mobile
   ================================================================ */
@media (max-width: 768px) {
  .sz-page-hero {
    height: 200px;
  }

  .sz-page-hero__title {
    font-size: 1.75rem;
  }

  .sz-subnav__item {
    padding: 14px 16px;
    font-size: 0.8125rem;
  }

  .sz-page-layout {
    padding: 24px 16px 48px;
  }

  .sz-section__title {
    font-size: 1.2rem;
  }

  .sz-hours-table th,
  .sz-hours-table td {
    padding: 12px 16px;
    font-size: 0.8125rem;
  }

  .sz-flow__item {
    grid-template-columns: 60px 1fr;
    gap: 16px;
    padding: 24px 0;
  }

  .sz-flow__number {
    font-size: 2.5rem;
  }

  .sz-flow__title {
    font-size: 1.1rem;
  }

  .sz-related,
  .sz-popular {
    padding: 24px 20px;
    margin: 32px 0;
  }

  .sz-related__grid,
  .sz-popular__grid {
    grid-template-columns: 1fr;
    gap: 12px;
  }

  .sz-sidebar {
    grid-template-columns: 1fr;
  }

  .sz-sidebar-icons {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ================================================================
/* ================================================================
   NOTE: Wearable (280px) styles removed - not present in saikazo.org
   ================================================================ */

/* ================================================================
   Print Styles
   ================================================================ */
@media print {
  .sz-subnav,
  .sz-sidebar,
  .sz-sitemap-bar {
    display: none;
  }

  .sz-page-layout {
    grid-template-columns: 1fr;
  }
}

/* ================================================================
   再診ページ追加スタイル
   ================================================================ */

/* Content Box - Highlight */
.sz-content-box--highlight {
  background: var(--sz-gray-50);
  border-left: 4px solid var(--sz-primary);
  padding: 24px 32px;
  margin-bottom: 32px;
}

.sz-content-box__emphasis {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--sz-accent);
  margin-bottom: 12px;
}

/* Accordion（アコーディオン）コンポーネント */
.sz-accordion {
  border: 1px solid var(--sz-border);
  border-radius: 4px;
  margin-bottom: 16px;
  overflow: hidden;
}

.sz-accordion__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px 24px;
  background: var(--color-white);
  cursor: pointer;
  transition: background 0.2s ease;
  border-left: 4px solid var(--sz-primary);
}

.sz-accordion__header:hover {
  background: var(--sz-gray-50);
}

.sz-accordion__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-text);
  margin: 0;
  display: flex;
  align-items: center;
  gap: 8px;
}

.sz-accordion__title::before {
  content: '';
  display: inline-block;
  width: 8px;
  height: 8px;
  background: var(--sz-primary);
  border-radius: 50%;
}

.sz-accordion__icon {
  color: var(--sz-gray-500);
  font-size: 1.5rem;
  transition: transform 0.3s ease;
}

.sz-accordion.is-open .sz-accordion__icon {
  transform: rotate(45deg);
}

.sz-accordion__content {
  display: none;
  padding: 24px 32px;
  background: var(--sz-gray-50);
  border-top: 1px solid var(--sz-border);
}

.sz-accordion.is-open .sz-accordion__content {
  display: block;
}

/* Simple Table */
.sz-simple-table {
  width: 100%;
  border-collapse: collapse;
  margin: 16px 0;
}

.sz-simple-table th,
.sz-simple-table td {
  padding: 12px 16px;
  border: 1px solid var(--sz-border);
  text-align: left;
}

.sz-simple-table th {
  background: var(--sz-gray-100);
  font-weight: 600;
  white-space: nowrap;
}

/* List */
.sz-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-list li {
  position: relative;
  padding: 8px 0 8px 24px;
  line-height: 1.6;
}

.sz-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 14px;
  width: 8px;
  height: 8px;
  background: var(--sz-orange);
  border-radius: 50%;
}

/* Note */
.sz-note {
  font-size: 0.875rem;
  color: var(--sz-text-light);
  margin: 8px 0;
}

/* Flow - Detailed Version */
.sz-flow--detailed .sz-flow__item {
  padding-bottom: 40px;
  margin-bottom: 40px;
  border-bottom: 1px solid var(--sz-border);
}

.sz-flow--detailed .sz-flow__item:last-child {
  border-bottom: none;
}

.sz-flow--detailed .sz-flow__body {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 24px;
  align-items: start;
}

.sz-flow--detailed .sz-flow__image {
  width: 280px;
  height: auto;
  border-radius: 8px;
  overflow: hidden;
}

.sz-flow--detailed .sz-flow__image img {
  width: 100%;
  height: auto;
  display: block;
}

/* Flow Step List */
.sz-flow__step-list {
  margin: 16px 0;
}

.sz-flow__step-item {
  display: flex;
  align-items: flex-start;
  gap: 12px;
  margin-bottom: 12px;
}

.sz-flow__step-num {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 24px;
  height: 24px;
  background: var(--sz-primary);
  color: var(--color-white);
  font-size: 0.75rem;
  font-weight: 700;
  border-radius: 50%;
  flex-shrink: 0;
}

.sz-flow__highlight {
  color: var(--sz-primary);
  font-weight: 600;
}

/* Flow Checklist */
.sz-flow__checklist {
  background: var(--sz-primary);
  color: var(--color-white);
  padding: 24px 32px;
  border-radius: 8px;
  margin: 24px 0;
}

.sz-flow__checklist-title {
  font-size: 1rem;
  font-weight: 700;
  margin: 0 0 16px;
  text-align: center;
}

.sz-flow__checklist-items {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-flow__checklist-items li {
  position: relative;
  padding: 8px 0 8px 28px;
  font-size: 0.9375rem;
}

.sz-flow__checklist-items li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 14px;
  width: 8px;
  height: 8px;
  background: var(--sz-orange);
  border-radius: 50%;
}

/* Flow Link Button */
.sz-flow__link-button {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 24px;
  background: var(--color-white);
  border: 2px solid var(--sz-gray-300);
  border-radius: 50px;
  color: var(--sz-text);
  font-weight: 500;
  text-decoration: none;
  transition: all 0.2s ease;
  margin-top: 16px;
}

.sz-flow__link-button:hover {
  border-color: var(--sz-primary);
  color: var(--sz-primary);
}

/* Flow Info Box */
.sz-flow__info-box {
  background: var(--sz-gray-50);
  padding: 16px 20px;
  border-radius: 4px;
  margin: 16px 0;
}

.sz-flow__info-title {
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--sz-accent);
  margin-bottom: 8px;
}

/* Flow Sub Section */
.sz-flow__sub-section {
  background: var(--color-white);
  padding: 20px 24px;
  border-radius: 8px;
  margin-top: 20px;
}

.sz-flow__sub-title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-text);
  margin: 16px 0 8px;
}

.sz-flow__sub-title--blue {
  color: var(--sz-primary);
  margin-top: 24px;
}

/* Contact Info */
.sz-contact-info {
  margin-top: 16px;
}

.sz-contact-info__tel {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--sz-primary);
  text-decoration: none;
}

.sz-contact-info__tel:hover {
  text-decoration: underline;
}

/* Content Box Subtitle */
.sz-content-box__subtitle {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--sz-primary);
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--sz-border);
}

/* Related Section Enhancements */
.sz-related__link-icon {
  display: none;
}

/* Section Title with Bar */
.sz-section__title--bar {
  background: var(--sz-primary);
  color: var(--color-white);
  padding: 16px 24px;
  border-radius: 4px 4px 0 0;
  margin-bottom: 0;
}

.sz-section__title--bar::before {
  display: none;
}

/* Responsive for Flow Detailed */
@media (max-width: 768px) {
  .sz-flow--detailed .sz-flow__body {
    grid-template-columns: 1fr;
  }

  .sz-flow--detailed .sz-flow__image {
    width: 100%;
    max-width: 300px;
    margin: 16px auto 0;
  }

  .sz-flow__checklist {
    padding: 20px 24px;
  }
}

/* ================================================================
   入院・面会ページ用スタイル
   ================================================================ */

/* フルワイドヒーロー画像 */
.sz-fullwidth-hero {
  width: 100%;
  height: 500px;
  overflow: hidden;
}

.sz-fullwidth-hero__image {
  width: 100%;
  height: 100%;
}

.sz-fullwidth-hero__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* ページイントロ */
.sz-page-intro {
  max-width: 1200px;
  margin: 0 auto;
  padding: 40px 24px 24px;
}

.sz-page-intro__title {
  font-size: 2rem;
  font-weight: 700;
  color: var(--sz-primary);
  margin: 0 0 16px;
  padding-left: 16px;
  border-left: 4px solid var(--sz-orange);
}

.sz-page-intro__text {
  font-size: 1rem;
  color: var(--sz-text);
  margin: 0;
  line-height: 1.8;
}

/* ガイドカード（入院される方、面会のご案内） */
.sz-guide-cards {
  margin-bottom: 48px;
}

.sz-guide-cards__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 32px;
}

.sz-guide-card {
  display: block;
  text-decoration: none;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  transition: all 0.3s ease;
}

.sz-guide-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.sz-guide-card__image {
  width: 100%;
  height: 200px;
  overflow: hidden;
}

.sz-guide-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.sz-guide-card:hover .sz-guide-card__image img {
  transform: scale(1.05);
}

.sz-guide-card__content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 20px 24px;
  background: var(--color-white);
  border-top: 3px solid var(--sz-gray-200);
}

.sz-guide-card:hover .sz-guide-card__content {
  border-top-color: var(--sz-primary);
}

.sz-guide-card__title {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--sz-text);
  margin: 0;
}

.sz-guide-card__arrow {
  color: var(--sz-gray-400);
  font-size: 1.5rem;
  transition: color 0.2s ease;
}

.sz-guide-card:hover .sz-guide-card__arrow {
  color: var(--sz-primary);
}

/* ミッションステートメント */
.sz-mission-statement {
  margin-bottom: 24px;
}

.sz-mission-statement__text {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--sz-orange);
  line-height: 1.8;
  margin: 0;
}

/* コンテンツテキスト */
.sz-content-text {
  margin-bottom: 24px;
}

.sz-content-text p {
  font-size: 1rem;
  line-height: 1.8;
  color: var(--sz-text);
}

/* お知らせボックス */
.sz-notice-box {
  background: var(--sz-gray-50);
  border-radius: 8px;
  padding: 24px 32px;
  margin-bottom: 32px;
}

.sz-notice-box__title {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--sz-orange);
  margin: 0 0 16px;
}

.sz-notice-box__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-notice-box__list li {
  position: relative;
  padding: 8px 0 8px 24px;
  font-size: 1rem;
  line-height: 1.6;
}

.sz-notice-box__list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 16px;
  width: 8px;
  height: 8px;
  background: var(--sz-orange);
  border-radius: 50%;
}

/* 医療相談セクション */
.sz-consultation-section {
  display: grid;
  grid-template-columns: 1fr 300px;
  gap: 32px;
  align-items: start;
  margin-bottom: 24px;
}

.sz-consultation-section__content p {
  font-size: 1rem;
  line-height: 1.8;
  margin-bottom: 16px;
}

.sz-consultation-section__image {
  border-radius: 8px;
  overflow: hidden;
}

.sz-consultation-section__image img {
  width: 100%;
  height: auto;
  display: block;
}

/* 相談ボックス */
.sz-consultation-box {
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 8px;
  padding: 20px 24px;
  margin-top: 16px;
}

.sz-consultation-box__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-orange);
  margin: 0 0 12px;
}

.sz-consultation-box__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-consultation-box__list li {
  position: relative;
  padding: 6px 0 6px 20px;
  font-size: 0.9375rem;
  line-height: 1.5;
}

.sz-consultation-box__list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 13px;
  width: 6px;
  height: 6px;
  background: var(--sz-primary);
  border-radius: 50%;
}

/* 関連ページ2列 */
.sz-related__grid--2col {
  grid-template-columns: repeat(2, 1fr);
}

/* サイドバー展開リンク */
.sz-sidebar-nav__link--expandable {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.sz-sidebar-nav__link--expandable .material-symbols-outlined {
  font-size: 1.125rem;
  color: var(--sz-gray-400);
}

/* Flow Simple Version */
.sz-flow--simple .sz-flow__item {
  padding-bottom: 20px;
  margin-bottom: 20px;
}

.sz-flow--simple .sz-flow__number {
  font-size: 1.5rem;
}

.sz-flow--simple .sz-flow__title {
  font-size: 1rem;
  margin-bottom: 8px;
}

/* レスポンシブ対応 */
@media (max-width: 1024px) {
  .sz-guide-cards__grid {
    grid-template-columns: 1fr;
  }

  .sz-consultation-section {
    grid-template-columns: 1fr;
  }

  .sz-consultation-section__image {
    max-width: 300px;
    margin: 0 auto;
  }
}

@media (max-width: 768px) {
  .sz-fullwidth-hero {
    height: 300px;
  }

  .sz-page-intro__title {
    font-size: 1.5rem;
  }

  .sz-mission-statement__text {
    font-size: 1rem;
  }

  .sz-related__grid--2col {
    grid-template-columns: 1fr;
  }
}

/* ========================================
   Items Grid (持ち物リスト)
======================================== */
.sz-items-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin: 32px 0;
}

.sz-items-card {
  background: var(--color-white);
  border-radius: 8px;
  padding: 24px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  border: 1px solid var(--color-gray-300);
}

.sz-items-card__title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--sz-primary);
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--sz-primary);
  display: flex;
  align-items: center;
  gap: 8px;
}

.sz-items-card__title i {
  font-size: 1.25rem;
}

.sz-items-card__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-items-card__list li {
  padding: 8px 0;
  border-bottom: 1px solid #f0f0f0;
  font-size: 0.95rem;
  color: var(--color-text-primary);
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.sz-items-card__list li:last-child {
  border-bottom: none;
}

.sz-items-card__list li::before {
  content: "✓";
  color: var(--sz-primary);
  font-weight: bold;
  flex-shrink: 0;
}

.sz-items-card__note {
  font-size: 0.85rem;
  color: var(--color-text-secondary);
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px dashed #ddd;
}

/* ========================================
   Schedule Table (入院生活スケジュール)
======================================== */
.sz-schedule-table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
  background: var(--color-white);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.sz-schedule-table th,
.sz-schedule-table td {
  padding: 16px;
  text-align: left;
  border-bottom: 1px solid var(--color-gray-300);
}

.sz-schedule-table th {
  background: var(--sz-primary);
  color: var(--color-white);
  font-weight: 600;
  width: 120px;
}

.sz-schedule-table td {
  color: var(--color-text-primary);
}

.sz-schedule-table tr:last-child th,
.sz-schedule-table tr:last-child td {
  border-bottom: none;
}

.sz-schedule-table tr:nth-child(even) td {
  background: #f9f9f9;
}

/* ========================================
   Restrictions Section (面会制限)
======================================== */
.sz-restrictions {
  background: #fff5f5;
  border: 1px solid #ffcccc;
  border-radius: 8px;
  padding: 24px;
  margin: 24px 0;
}

.sz-restrictions__title {
  font-size: 1.125rem;
  font-weight: 700;
  color: #c62828;
  margin: 0 0 16px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.sz-restrictions__title i {
  font-size: 1.25rem;
}

.sz-restrictions__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-restrictions__list li {
  padding: 8px 0;
  font-size: 0.95rem;
  color: var(--color-text-primary);
  display: flex;
  align-items: flex-start;
  gap: 8px;
}

.sz-restrictions__list li::before {
  content: "×";
  color: #c62828;
  font-weight: bold;
  flex-shrink: 0;
}

/* ========================================
   Responsive: Items Grid
======================================== */
@media (max-width: 992px) {
  .sz-items-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .sz-items-grid {
    grid-template-columns: 1fr;
  }

  .sz-items-card {
    padding: 20px;
  }

  .sz-schedule-table th,
  .sz-schedule-table td {
    padding: 12px;
    font-size: 0.9rem;
  }

  .sz-schedule-table th {
    width: 100px;
  }
}

/* ========================================
   Emergency Page Styles (救急外来ページ)
======================================== */

/* 緊急電話ボックス */
.sz-emergency-box {
  background: var(--color-white);
  border: 3px solid #c62828;
  border-radius: 12px;
  overflow: hidden;
  margin: 0 0 40px;
}

.sz-emergency-box__header {
  background: #c62828;
  color: var(--color-white);
  padding: 16px 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  flex-wrap: wrap;
}

.sz-emergency-box__lead {
  font-size: 1.25rem;
  font-weight: 700;
  margin: 0;
}

.sz-emergency-box__badge {
  background: var(--color-white);
  color: var(--color-text-primary);
  padding: 6px 20px;
  border-radius: 20px;
  font-size: 0.9rem;
  font-weight: 600;
}

.sz-emergency-box__body {
  padding: 32px;
  text-align: center;
}

.sz-emergency-box__phone {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--sz-primary);
  text-decoration: none;
  margin-bottom: 24px;
}

.sz-emergency-box__phone .material-symbols-outlined {
  font-size: 2rem;
  color: var(--sz-primary);
}

.sz-emergency-box__note {
  font-size: 1rem;
  font-weight: 400;
  color: var(--color-text-secondary);
}

.sz-emergency-box__notes {
  text-align: left;
  max-width: 700px;
  margin: 0 auto;
}

.sz-emergency-box__notes p {
  font-size: 0.9rem;
  color: var(--color-text-secondary);
  margin: 8px 0;
}

/* ページ内ナビゲーション */
.sz-page-nav {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin: 0 0 48px;
}

.sz-page-nav__item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 16px 20px;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 4px;
  color: var(--sz-text);
  text-decoration: none;
  font-size: 0.95rem;
  transition: all 0.2s ease;
}

.sz-page-nav__item:hover {
  background: var(--sz-primary-light);
  border-color: var(--sz-primary);
}

.sz-page-nav__icon {
  color: var(--sz-primary);
  font-size: 0.75rem;
}

.sz-page-nav__arrow {
  margin-left: auto;
  color: var(--sz-primary);
  font-size: 1.25rem;
}

/* 2カラムレイアウト */
.sz-two-column {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 40px;
  margin: 24px 0;
}

.sz-two-column__text {
  font-size: 0.95rem;
  line-height: 1.8;
  color: var(--sz-text);
}

.sz-two-column__text p {
  margin: 0 0 16px;
}

.sz-two-column__image img {
  width: 100%;
  height: auto;
  border-radius: 8px;
}

.sz-text-link {
  color: #c62828;
  font-weight: 600;
}

.sz-text-small {
  font-size: 0.85rem;
  color: var(--color-text-secondary);
}

.sz-text-red {
  color: #c62828;
}

/* リンクボックス */
.sz-link-box {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 20px 24px;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 8px;
  color: var(--sz-text);
  text-decoration: none;
  font-size: 1rem;
  transition: all 0.2s ease;
  max-width: 400px;
}

.sz-link-box:hover {
  background: var(--sz-primary-light);
  border-color: var(--sz-primary);
}

.sz-link-box__icon {
  color: var(--sz-primary);
  font-size: 0.75rem;
}

.sz-link-box .material-symbols-outlined {
  margin-left: auto;
  color: var(--sz-primary);
}

/* 時間外選定療養費テーブル */
.sz-fee-table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
  background: var(--color-white);
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.sz-fee-table th,
.sz-fee-table td {
  padding: 16px;
  text-align: center;
  border: 1px solid var(--color-gray-300);
}

.sz-fee-table thead th {
  background: var(--sz-primary);
  color: var(--color-white);
  font-weight: 600;
}

.sz-fee-table tbody th {
  background: #f9f9f9;
  font-weight: 500;
}

.sz-fee-table__price {
  background: var(--color-white);
  vertical-align: middle;
}

.sz-fee-table__price strong {
  font-size: 1.5rem;
  color: var(--sz-primary);
}

.sz-fee-table__note {
  display: block;
  font-size: 0.85rem;
  color: var(--color-text-secondary);
  margin-top: 4px;
}

/* 必要な持ち物ボックス */
.sz-required-items {
  background: #c62828;
  color: var(--color-white);
  border-radius: 8px;
  padding: 24px 32px;
  margin: 24px 0;
}

.sz-required-items__title {
  font-size: 1.125rem;
  font-weight: 700;
  margin: 0 0 16px;
  text-align: center;
}

.sz-required-items__list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.sz-required-items__list li {
  display: flex;
  align-items: flex-start;
  gap: 8px;
  font-size: 0.95rem;
}

.sz-required-items__bullet {
  display: inline-block;
  width: 8px;
  height: 8px;
  background: #ffd54f;
  border-radius: 50%;
  flex-shrink: 0;
  margin-top: 6px;
}

.sz-required-items__sub {
  display: block;
  font-size: 0.85rem;
  color: rgba(255, 255, 255, 0.9);
  margin-top: 4px;
}

/* クレジットカード情報 */
.sz-credit-info {
  background: #f9f9f9;
  border: 1px solid var(--color-gray-300);
  border-radius: 8px;
  padding: 24px;
  margin: 24px 0;
}

.sz-credit-info__title {
  font-size: 1rem;
  font-weight: 600;
  color: #c62828;
  margin: 0 0 8px;
}

.sz-credit-info__cards {
  font-size: 0.95rem;
  margin: 0 0 16px;
}

.sz-credit-info__logos {
  display: flex;
  gap: 16px;
  align-items: center;
  padding: 16px;
  background: var(--color-white);
  border: 1px solid var(--color-gray-300);
  border-radius: 4px;
  margin-bottom: 16px;
}

.sz-credit-info__logos img {
  height: 32px;
  width: auto;
}

.sz-credit-info__note {
  font-size: 0.85rem;
  color: var(--color-text-secondary);
  margin: 4px 0;
}

/* 預り金注意 */
.sz-deposit-notice {
  background: #c62828;
  color: var(--color-white);
  border-radius: 8px;
  padding: 24px;
  margin: 24px 0;
}

.sz-deposit-notice__text {
  font-size: 1.125rem;
  font-weight: 700;
  margin: 0 0 16px;
  text-align: center;
}

.sz-deposit-notice__sub {
  font-size: 0.9rem;
  margin: 8px 0;
  color: rgba(255, 255, 255, 0.95);
}

/* コンテンツテキスト */
.sz-content-text {
  margin: 24px 0;
}

.sz-content-text p {
  font-size: 0.95rem;
  line-height: 1.8;
  margin: 0 0 16px;
  color: var(--sz-text);
}

/* アコーディオンのドット */
.sz-accordion__dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  background: var(--sz-primary);
  border-radius: 50%;
  margin-right: 8px;
}

/* ========================================
   Responsive: Emergency Page
======================================== */
@media (max-width: 992px) {
  .sz-two-column {
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .sz-two-column__image {
    order: -1;
    max-width: 400px;
    margin: 0 auto;
  }
}

@media (max-width: 768px) {
  .sz-page-nav {
    grid-template-columns: 1fr;
  }

  .sz-emergency-box__phone {
    font-size: 1.75rem;
  }

  .sz-emergency-box__lead {
    font-size: 1rem;
    text-align: center;
  }

  .sz-required-items__list {
    grid-template-columns: 1fr;
  }

  .sz-fee-table th,
  .sz-fee-table td {
    padding: 12px 8px;
    font-size: 0.85rem;
  }
}

@media (max-width: 576px) {
  .sz-emergency-box__body {
    padding: 20px;
  }

  .sz-emergency-box__phone {
    font-size: 1.5rem;
    flex-direction: column;
    gap: 4px;
  }

  .sz-credit-info__logos {
    flex-wrap: wrap;
  }
}

/* ========================================
   Community Page Styles (地域医療連携ページ)
======================================== */

/* フルワイドヒーロー - 高さ調整 */
.sz-fullwidth-hero--tall {
  height: 500px;
}

/* ページイントロ - オーバーラップ版 */
.sz-page-intro--overlap {
  position: relative;
  background: var(--color-white);
  padding: 48px 60px;
  margin-top: -120px;
  max-width: 500px;
  z-index: 10;
}

.sz-page-intro__divider {
  width: 40px;
  height: 3px;
  background: var(--sz-primary);
  margin: 24px 0;
}

/* カテゴリーカード（2カラム） */
.sz-category-cards {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 40px;
  margin: 48px 0;
}

.sz-category-card {
  background: var(--color-white);
}

.sz-category-card__image {
  overflow: hidden;
  border-radius: 8px;
  margin-bottom: 16px;
}

.sz-category-card__image img {
  width: 100%;
  height: 240px;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.sz-category-card:hover .sz-category-card__image img {
  transform: scale(1.05);
}

.sz-category-card__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 0;
  border-bottom: 2px solid var(--sz-border);
  text-decoration: none;
  transition: all 0.2s ease;
}

.sz-category-card__header:hover {
  border-bottom-color: var(--sz-primary);
}

.sz-category-card__title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--sz-primary);
  margin: 0;
}

.sz-category-card__header .material-symbols-outlined {
  color: var(--sz-orange);
  font-size: 1.5rem;
}

.sz-category-card__links {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-category-card__links li {
  border-bottom: 1px dashed var(--sz-border);
}

.sz-category-card__links li:last-child {
  border-bottom: none;
}

.sz-category-card__links a {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 16px 0;
  color: var(--sz-text);
  text-decoration: none;
  font-size: 0.95rem;
  transition: color 0.2s ease;
}

.sz-category-card__links a:hover {
  color: var(--sz-primary);
}

.sz-category-card__links .material-symbols-outlined {
  color: var(--sz-primary);
  font-size: 1rem;
}

/* お問い合わせボックス（2カラム） */
.sz-contact-boxes {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin: 48px 0 16px;
}

.sz-contact-box {
  border-radius: 8px;
  overflow: hidden;
  background: var(--color-white);
}

.sz-contact-box__header {
  background: var(--sz-primary);
  color: var(--color-white);
  text-align: center;
  padding: 12px 16px;
  margin: 0;
  font-size: 1rem;
  font-weight: 600;
}

.sz-contact-box__body {
  padding: 24px;
  text-align: center;
  border: 1px solid var(--sz-border);
  border-top: none;
  border-radius: 0 0 8px 8px;
}

.sz-contact-box__label {
  font-size: 0.9rem;
  color: var(--color-text-secondary);
  margin: 0 0 8px;
}

.sz-contact-box__number {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--sz-primary);
  text-decoration: none;
  margin-bottom: 8px;
}

.sz-contact-box__number .material-symbols-outlined {
  font-size: 1.25rem;
}

.sz-contact-box__number--fax {
  color: var(--sz-text);
}

.sz-contact-box__note {
  font-size: 0.85rem;
  color: var(--color-text-secondary);
  margin: 0;
}

.sz-contact-footnote {
  text-align: center;
  font-size: 0.85rem;
  color: var(--color-text-secondary);
  margin: 0 0 48px;
}

/* セクションリード */
.sz-section__lead {
  font-size: 1rem;
  line-height: 1.8;
  color: var(--sz-orange);
  font-weight: 500;
  margin: 0 0 32px;
}

/* サイドバーCTA */
.sz-sidebar-cta {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px;
  background: var(--color-gray-100);
  border: 1px solid var(--sz-border);
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.2s ease;
  margin-top: 24px;
}

.sz-sidebar-cta:hover {
  background: var(--sz-primary-light);
  border-color: var(--sz-primary);
}

.sz-sidebar-cta__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  background: var(--sz-primary);
  border-radius: 50%;
}

.sz-sidebar-cta__icon .material-symbols-outlined {
  color: var(--color-white);
  font-size: 1.5rem;
}

.sz-sidebar-cta__text {
  display: flex;
  flex-direction: column;
}

.sz-sidebar-cta__label {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--sz-text);
}

.sz-sidebar-cta__sublabel {
  font-size: 0.85rem;
  color: var(--color-text-secondary);
}

/* サイドバー子要素付き */
.sz-sidebar-nav__item--has-children {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.sz-sidebar-nav__toggle {
  color: var(--sz-primary);
  font-size: 1rem;
  cursor: pointer;
}

/* ========================================
   Responsive: Community Page
======================================== */
@media (max-width: 992px) {
  .sz-category-cards {
    grid-template-columns: 1fr;
    gap: 32px;
  }

  .sz-contact-boxes {
    grid-template-columns: 1fr;
  }

  .sz-page-intro--overlap {
    margin-top: 0;
    max-width: 100%;
    padding: 32px;
  }

  .sz-fullwidth-hero--tall {
    height: 350px;
  }
}

@media (max-width: 768px) {
  .sz-category-card__image img {
    height: 180px;
  }

  .sz-contact-box__number {
    font-size: 1.25rem;
  }
}

@media (max-width: 576px) {
  .sz-fullwidth-hero--tall {
    height: 250px;
  }

  .sz-page-intro--overlap {
    padding: 24px;
  }

  .sz-category-card__title {
    font-size: 1.1rem;
  }
}

/* ================================================================
   外来診療日程表ページ - Schedule Page Styles
   https://saikazo.org/schedule/ 完全再現
   ================================================================ */

/* PDFダウンロードリンク */
.sz-pdf-download {
  margin-bottom: 40px;
}

.sz-pdf-download__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: #fff5f0;
  border: 2px solid var(--sz-orange);
  border-radius: 8px;
  padding: 20px 24px;
  text-decoration: none;
  color: var(--sz-text);
  transition: all 0.3s ease;
}

.sz-pdf-download__link:hover {
  background: #ffebe0;
  box-shadow: 0 4px 12px rgba(230, 126, 34, 0.2);
}

.sz-pdf-download__text {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--sz-orange);
}

.sz-pdf-download__icon {
  width: 48px;
  height: 48px;
  background: var(--sz-orange);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sz-pdf-download__icon .material-symbols-outlined {
  font-size: 1.5rem;
  color: var(--color-white);
}

/* カテゴリーナビ */
.sz-schedule-nav {
  display: flex;
  gap: 16px;
  margin-bottom: 48px;
  flex-wrap: wrap;
}

.sz-schedule-nav__item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 16px 24px;
  background: var(--sz-primary-light);
  border: 1px solid var(--sz-primary);
  border-radius: 8px;
  text-decoration: none;
  color: var(--sz-primary);
  font-weight: 600;
  font-size: 1rem;
  transition: all 0.3s ease;
}

.sz-schedule-nav__item:hover {
  background: var(--sz-primary);
  color: var(--color-white);
}

.sz-schedule-nav__icon {
  color: var(--sz-orange);
  font-size: 0.75rem;
}

.sz-schedule-nav__arrow {
  margin-left: auto;
  font-size: 1.25rem;
}

/* カテゴリーセクション */
.sz-schedule-section {
  margin-bottom: 56px;
}

.sz-schedule-section__title {
  display: flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(135deg, var(--sz-orange) 0%, #d35400 100%);
  color: var(--color-white);
  padding: 16px 24px;
  font-size: 1.25rem;
  font-weight: 700;
  border-radius: 8px 8px 0 0;
  margin: 0;
}

.sz-schedule-section__title::before {
  content: '▼';
  font-size: 0.875rem;
}

/* スケジュールリスト */
.sz-schedule-list {
  background: var(--color-white);
  border: none;
  border-radius: 0 0 8px 8px;
}

.sz-schedule-list .sz-accordion {
  border-bottom: 1px solid var(--sz-border);
}

.sz-schedule-list .sz-accordion:last-child {
  border-bottom: none;
}

.sz-schedule-list .sz-accordion__header {
  padding: 18px 24px;
  display: flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
  transition: background 0.2s ease;
}

.sz-schedule-list .sz-accordion__header:hover {
  background: var(--sz-gray-50);
}

.sz-schedule-list .sz-accordion__dot {
  width: 10px;
  height: 10px;
  background: var(--sz-primary);
  border-radius: 50%;
  flex-shrink: 0;
}

.sz-schedule-list .sz-accordion__title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--sz-primary);
  margin: 0;
  flex: 1;
}

.sz-schedule-list .sz-accordion__icon {
  font-size: 1.5rem;
  color: var(--sz-primary);
  transition: transform 0.3s ease;
}

.sz-schedule-list .sz-accordion.is-open .sz-accordion__icon {
  transform: rotate(45deg);
}

.sz-schedule-list .sz-accordion__content {
  display: none;
  padding: 0 24px 24px;
  background: var(--sz-gray-50);
  border-top: 1px solid var(--sz-border);
}

.sz-schedule-list .sz-accordion.is-open .sz-accordion__content {
  display: block;
}

/* 診療科スケジュールテーブル */
.sz-dept-schedule {
  width: 100%;
  border-collapse: collapse;
  margin-top: 16px;
  background: var(--color-white);
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid var(--sz-border);
}

.sz-dept-schedule th,
.sz-dept-schedule td {
  padding: 12px 16px;
  text-align: center;
  border-bottom: 1px solid var(--sz-border);
}

.sz-dept-schedule thead th {
  background: var(--sz-primary);
  color: var(--color-white);
  font-weight: 600;
  font-size: 0.9rem;
}

.sz-dept-schedule thead th:first-child {
  width: 80px;
}

.sz-dept-schedule tbody th {
  background: var(--sz-gray-100);
  font-weight: 600;
  color: var(--sz-text);
  font-size: 0.9rem;
}

.sz-dept-schedule tbody td {
  font-size: 0.95rem;
  color: var(--sz-gray-400);
}

.sz-dept-schedule__active {
  color: var(--sz-primary);
  font-weight: 700;
}

.sz-dept-schedule tr:last-child th,
.sz-dept-schedule tr:last-child td {
  border-bottom: none;
}

.sz-dept-schedule__note {
  margin-top: 12px;
  font-size: 0.9rem;
  color: var(--sz-text-light);
  padding-left: 8px;
  border-left: 3px solid var(--sz-orange);
}

/* よくご覧いただくページ */
.sz-popular {
  background: var(--sz-gray-50);
  padding: 40px;
  border-radius: 12px;
  margin-top: 56px;
}

.sz-popular__title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 0 0 24px;
  padding-bottom: 16px;
  border-bottom: 2px solid var(--sz-primary);
}

.sz-popular__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}

.sz-popular__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--color-white);
  padding: 16px 20px;
  border-radius: 8px;
  text-decoration: none;
  color: var(--sz-text);
  font-weight: 500;
  border: 1px solid var(--sz-border);
  transition: all 0.3s ease;
}

.sz-popular__link:hover {
  background: var(--sz-gray-50);
  border-color: var(--sz-orange);
  color: var(--sz-orange);
}

.sz-popular__link .material-symbols-outlined {
  font-size: 1.125rem;
  color: var(--sz-orange);
}

.sz-popular__link:hover .material-symbols-outlined {
  color: var(--sz-orange);
}

/* サイドバーCTAグリッド（2列） */
.sz-sidebar-cta-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-bottom: 16px;
}

.sz-sidebar-cta--small {
  flex-direction: column;
  padding: 16px 12px;
  text-align: center;
  gap: 8px;
}

.sz-sidebar-cta--small .sz-sidebar-cta__text {
  flex-direction: column;
  align-items: center;
  gap: 2px;
}

.sz-sidebar-cta--small .sz-sidebar-cta__label {
  font-size: 0.85rem;
}

.sz-sidebar-cta--small .sz-sidebar-cta__sublabel {
  font-size: 0.75rem;
}

.sz-sidebar-cta__icon--teal {
  background: linear-gradient(135deg, #009688 0%, #00796b 100%);
}

.sz-sidebar-cta__icon--green {
  background: linear-gradient(135deg, #4caf50 0%, #388e3c 100%);
}

/* サイドバーリンクボックス */
.sz-sidebar-link-box {
  display: flex;
  align-items: center;
  gap: 12px;
  background: linear-gradient(135deg, var(--sz-primary) 0%, var(--sz-primary-dark) 100%);
  color: var(--color-white);
  padding: 16px 20px;
  border-radius: 8px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.sz-sidebar-link-box:hover {
  transform: translateY(-2px);
  box-shadow: 0 6px 20px rgba(17, 79, 161, 0.3);
}

.sz-sidebar-link-box__icon {
  width: 36px;
  height: 36px;
  background: rgba(255, 255, 255, 0.2);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sz-sidebar-link-box__icon .material-symbols-outlined {
  font-size: 1.25rem;
}

.sz-sidebar-link-box__text {
  flex: 1;
  font-weight: 600;
}

.sz-sidebar-link-box > .material-symbols-outlined {
  font-size: 1.125rem;
  opacity: 0.8;
}

/* サイドバーナビゲーション拡張 */
.sz-sidebar-nav__item--has-children {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.sz-sidebar-nav__toggle {
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--sz-gray-100);
  border-radius: 4px;
  font-weight: 600;
  color: var(--sz-primary);
  cursor: pointer;
  transition: all 0.2s ease;
}

.sz-sidebar-nav__toggle:hover {
  background: var(--sz-primary);
  color: var(--color-white);
}

/* レスポンシブ対応 */
@media (max-width: 992px) {
  .sz-schedule-nav {
    flex-direction: column;
    gap: 8px;
  }

  .sz-schedule-nav__item {
    width: 100%;
  }

  .sz-popular__grid {
    grid-template-columns: 1fr;
  }

  .sz-sidebar-cta-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .sz-pdf-download__link {
    padding: 16px 20px;
  }

  .sz-pdf-download__text {
    font-size: 1rem;
  }

  .sz-pdf-download__icon {
    width: 40px;
    height: 40px;
  }

  .sz-schedule-section__title {
    font-size: 1.1rem;
    padding: 14px 20px;
  }

  .sz-schedule-list .sz-accordion__header {
    padding: 14px 18px;
  }

  .sz-schedule-list .sz-accordion__title {
    font-size: 1rem;
    color: var(--sz-primary);
  }

  .sz-schedule-list .sz-accordion__content {
    padding: 0 18px 18px;
  }

  .sz-dept-schedule th,
  .sz-dept-schedule td {
    padding: 8px 6px;
    font-size: 0.8rem;
  }

  .sz-popular {
    padding: 24px;
  }
}

@media (max-width: 576px) {
  .sz-dept-schedule {
    font-size: 0.75rem;
  }

  .sz-dept-schedule th,
  .sz-dept-schedule td {
    padding: 6px 4px;
  }

  .sz-schedule-list .sz-accordion__header {
    padding: 12px 14px;
  }
}

/* ================================================================
   診療予約ページ - Web Reserve Page Styles
   https://saikazo.org/webreserve/ 完全再現
   ================================================================ */

/* イントロテキスト */
.sz-reserve-intro {
  font-size: 1.1rem;
  color: var(--sz-text);
  margin-bottom: 32px;
  line-height: 1.8;
}

/* 注意事項・お願いボックス */
.sz-reserve-notice {
  background: var(--color-white);
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 48px;
  border: 1px solid var(--sz-border);
}

.sz-reserve-notice__header {
  background: var(--sz-primary);
  padding: 16px 24px;
}

.sz-reserve-notice__title {
  color: var(--color-white);
  font-size: 1.125rem;
  font-weight: 700;
  margin: 0;
  text-align: center;
}

.sz-reserve-notice__body {
  padding: 32px;
}

.sz-reserve-notice__subtitle {
  font-size: 1.1rem;
  font-weight: 700;
  margin: 0 0 8px;
}

.sz-reserve-notice__subtitle--warning {
  color: #c0392b;
}

.sz-reserve-notice__text {
  color: var(--sz-text);
  margin: 0 0 24px;
  line-height: 1.8;
}

.sz-reserve-notice__heading {
  font-size: 1rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 24px 0 12px;
}

.sz-reserve-notice__list {
  margin: 0 0 16px;
  padding: 0;
  list-style: none;
}

.sz-reserve-notice__list li {
  position: relative;
  padding-left: 20px;
  margin-bottom: 8px;
  line-height: 1.6;
  color: var(--sz-text);
}

.sz-reserve-notice__list li::before {
  content: '●';
  position: absolute;
  left: 0;
  top: 0;
  color: var(--sz-orange);
  font-size: 0.625rem;
}

/* 予約フォーム */
.sz-reserve-form {
  background: var(--color-white);
  padding: 0;
}

.sz-reserve-form__required-note {
  color: #c0392b;
  font-size: 0.95rem;
  margin-bottom: 32px;
  display: flex;
  align-items: center;
  gap: 8px;
}

.sz-reserve-form__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 4px 12px;
  border-radius: 4px;
  font-size: 0.75rem;
  font-weight: 600;
}

.sz-reserve-form__badge--required {
  background: #c0392b;
  color: var(--color-white);
}

.sz-reserve-form__group {
  display: flex;
  align-items: flex-start;
  padding: 24px 0;
  border-bottom: 1px solid var(--sz-gray-200);
}

.sz-reserve-form__label {
  flex: 0 0 200px;
  font-weight: 600;
  color: var(--sz-text);
  display: flex;
  align-items: center;
  gap: 12px;
  padding-top: 8px;
}

.sz-reserve-form__input-wrap {
  flex: 1;
}

.sz-reserve-form__input,
.sz-reserve-form__select,
.sz-reserve-form__textarea {
  width: 100%;
  padding: 12px 16px;
  border: 1px solid var(--sz-gray-300);
  border-radius: 4px;
  font-size: 1rem;
  color: var(--sz-text);
  background: var(--sz-gray-50);
  transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

.sz-reserve-form__input:focus,
.sz-reserve-form__select:focus,
.sz-reserve-form__textarea:focus {
  outline: none;
  border-color: var(--sz-primary);
  box-shadow: 0 0 0 3px rgba(17, 79, 161, 0.1);
}

.sz-reserve-form__input::placeholder,
.sz-reserve-form__textarea::placeholder {
  color: var(--sz-gray-400);
}

.sz-reserve-form__select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%236b7280' d='M7 10l5 5 5-5z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 12px center;
  padding-right: 40px;
  cursor: pointer;
}

.sz-reserve-form__select--date {
  width: 80px;
  padding: 8px 30px 8px 12px;
}

.sz-reserve-form__hint {
  font-size: 0.85rem;
  color: var(--sz-text-light);
  margin-top: 8px;
}

.sz-reserve-form__radio-group {
  display: flex;
  gap: 32px;
  padding-top: 8px;
}

.sz-reserve-form__radio {
  display: flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
}

.sz-reserve-form__radio input[type="radio"] {
  width: 18px;
  height: 18px;
  accent-color: var(--sz-primary);
}

.sz-reserve-form__date-group {
  display: flex;
  align-items: center;
  gap: 8px;
}

.sz-reserve-form__date-label {
  font-size: 0.9rem;
  color: var(--sz-text);
}

.sz-reserve-form__date-input {
  position: relative;
}

.sz-reserve-form__input--date {
  padding-right: 40px;
}

.sz-reserve-form__textarea {
  min-height: 150px;
  resize: vertical;
}

.sz-reserve-form__file {
  padding: 12px 0;
}

.sz-reserve-form__file-notes {
  margin-top: 12px;
  padding: 0;
  list-style: none;
}

.sz-reserve-form__file-notes li {
  font-size: 0.85rem;
  color: var(--sz-text-light);
  margin-bottom: 4px;
}

.sz-reserve-form__privacy {
  padding: 32px 0;
  text-align: center;
}

.sz-reserve-form__checkbox {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  cursor: pointer;
}

.sz-reserve-form__checkbox input[type="checkbox"] {
  width: 20px;
  height: 20px;
  accent-color: var(--sz-primary);
}

.sz-reserve-form__checkbox a {
  color: var(--sz-primary);
  text-decoration: underline;
}

.sz-reserve-form__submit {
  display: flex;
  justify-content: center;
  padding: 24px 0 48px;
}

.sz-reserve-form__submit-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  background: var(--sz-primary);
  color: var(--color-white);
  border: none;
  padding: 20px 80px;
  border-radius: 50px;
  font-size: 1.125rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
}

.sz-reserve-form__submit-btn:hover {
  background: var(--sz-primary-dark);
  transform: translateY(-2px);
  box-shadow: 0 8px 24px rgba(17, 79, 161, 0.3);
}

.sz-reserve-form__submit-btn .material-symbols-outlined {
  font-size: 1.25rem;
}

/* 緊急連絡ボックス */
.sz-emergency-contact {
  display: flex;
  border-radius: 8px;
  overflow: hidden;
  margin-top: 48px;
}

.sz-emergency-contact__message {
  flex: 1;
  background: var(--sz-primary);
  color: var(--color-white);
  padding: 32px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
}

.sz-emergency-contact__title {
  font-size: 1.125rem;
  font-weight: 600;
  line-height: 1.8;
  margin: 0 0 16px;
}

.sz-emergency-contact__hours {
  display: inline-block;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 50px;
  padding: 8px 24px;
  font-size: 0.9rem;
  margin: 0;
}

.sz-emergency-contact__phone {
  flex: 1;
  background: var(--color-white);
  padding: 32px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border: 1px solid var(--sz-border);
  border-left: none;
}

.sz-emergency-contact__number {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 2rem;
  font-weight: 700;
  color: var(--sz-primary);
  text-decoration: none;
}

.sz-emergency-contact__number .material-symbols-outlined {
  font-size: 2rem;
}

.sz-emergency-contact__guide {
  margin: 8px 0 0;
  font-size: 0.9rem;
  color: var(--sz-text-light);
}

/* サイドバー - 診療受付時間 */
.sz-sidebar-hours {
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 8px;
  overflow: hidden;
  margin-bottom: 16px;
}

.sz-sidebar-hours__row {
  display: flex;
}

.sz-sidebar-hours__label {
  background: var(--sz-primary);
  color: var(--color-white);
  padding: 12px 16px;
  font-weight: 600;
  font-size: 0.9rem;
}

.sz-sidebar-hours__time {
  flex: 1;
  padding: 12px 16px;
  font-weight: 600;
  color: var(--sz-primary);
}

.sz-sidebar-note {
  font-size: 0.9rem;
  color: var(--sz-text);
  line-height: 1.6;
  margin-bottom: 16px;
}

.sz-sidebar-note--small {
  font-size: 0.8rem;
  color: var(--sz-text-light);
}

.sz-sidebar-schedule-link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 8px;
  padding: 16px 20px;
  text-decoration: none;
  color: var(--sz-text);
  font-weight: 500;
  transition: all 0.3s ease;
  margin-top: 24px;
}

.sz-sidebar-schedule-link:hover {
  border-color: var(--sz-primary);
  box-shadow: 0 4px 12px rgba(17, 79, 161, 0.1);
}

.sz-sidebar-schedule-link .material-symbols-outlined {
  color: var(--sz-primary);
}

/* レスポンシブ対応 - 診療予約ページ */
@media (max-width: 992px) {
  .sz-reserve-form__group {
    flex-direction: column;
  }

  .sz-reserve-form__label {
    flex: none;
    width: 100%;
    margin-bottom: 12px;
    padding-top: 0;
  }

  .sz-emergency-contact {
    flex-direction: column;
  }

  .sz-emergency-contact__phone {
    border-left: 1px solid var(--sz-border);
    border-top: none;
  }
}

@media (max-width: 768px) {
  .sz-reserve-notice__body {
    padding: 24px;
  }

  .sz-reserve-form__radio-group {
    flex-direction: column;
    gap: 16px;
  }

  .sz-reserve-form__date-group {
    flex-wrap: wrap;
  }

  .sz-reserve-form__submit-btn {
    width: 100%;
    padding: 18px 40px;
  }

  .sz-emergency-contact__number {
    font-size: 1.5rem;
  }
}

@media (max-width: 576px) {
  .sz-reserve-intro {
    font-size: 1rem;
  }

  .sz-reserve-notice__subtitle {
    font-size: 1rem;
  }

  .sz-reserve-form__select--date {
    width: 70px;
  }
}

/* ================================================================
   診療科・部門ページ - Department Page Styles
   https://saikazo.org/department/ 完全再現
   ================================================================ */

/* カテゴリーナビ */
.sz-dept-nav {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 48px;
}

.sz-dept-nav__item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 16px 20px;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-left: 4px solid var(--sz-primary);
  text-decoration: none;
  color: var(--sz-text);
  font-weight: 500;
  font-size: 0.95rem;
  transition: all 0.3s ease;
}

.sz-dept-nav__item:hover {
  border-left-color: var(--sz-orange);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.sz-dept-nav__icon {
  color: var(--sz-primary);
  font-size: 0.625rem;
}

.sz-dept-nav__arrow {
  margin-left: auto;
  font-size: 1.125rem;
  color: var(--sz-gray-400);
}

/* 診療科セクション */
.sz-dept-section {
  margin-bottom: 56px;
}

.sz-dept-section__title {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #fdf6e3;
  color: var(--sz-primary);
  padding: 16px 24px;
  font-size: 1.25rem;
  font-weight: 700;
  border-left: 4px solid var(--sz-orange);
  margin: 0 0 24px;
}

/* 診療科グリッド */
.sz-dept-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin-bottom: 24px;
}

.sz-dept-grid:last-child {
  margin-bottom: 0;
}

/* 診療科リンク */
.sz-dept-link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-left: 4px solid var(--sz-primary);
  text-decoration: none;
  color: var(--sz-text);
  font-weight: 500;
  transition: all 0.3s ease;
}

.sz-dept-link:hover {
  border-left-color: var(--sz-orange);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  color: var(--sz-primary);
}

.sz-dept-link__dot {
  width: 8px;
  height: 8px;
  background: var(--sz-primary);
  border-radius: 50%;
  flex-shrink: 0;
}

.sz-dept-link__text {
  flex: 1;
}

.sz-dept-link__arrow {
  font-size: 1.125rem;
  color: var(--sz-primary);
  opacity: 0.7;
  transition: transform 0.2s ease;
}

.sz-dept-link:hover .sz-dept-link__arrow {
  transform: translateX(4px);
  opacity: 1;
}

/* よくご覧いただくページ - オレンジ版 */
.sz-popular--orange {
  background: var(--color-white);
  padding: 40px;
  border-radius: 0;
  margin-top: 56px;
}

.sz-popular__title--orange {
  color: var(--sz-orange);
  border-bottom-color: var(--sz-orange);
}

/* レスポンシブ対応 - 診療科・部門ページ */
@media (max-width: 992px) {
  .sz-dept-nav {
    grid-template-columns: 1fr;
  }

  .sz-dept-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .sz-dept-grid {
    grid-template-columns: 1fr;
  }

  .sz-dept-section__title {
    font-size: 1.1rem;
    padding: 14px 20px;
  }

  .sz-dept-link {
    padding: 14px 16px;
  }
}

@media (max-width: 576px) {
  .sz-dept-nav__item {
    padding: 14px 16px;
    font-size: 0.9rem;
  }
}
/* ================================================================
   ページ内ナビゲーション - saikazo community/people style
   ================================================================ */
.sz-page-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 40px 0;
  padding: 0;
}

.sz-page-nav__item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 14px 20px;
  background: var(--sz-primary);
  color: var(--color-white);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 500;
  border-radius: 4px;
  transition: all 0.2s ease;
}

.sz-page-nav__item:hover {
  background: var(--sz-primary-dark);
  transform: translateY(-2px);
}

.sz-page-nav__item .material-symbols-outlined {
  font-size: 1.125rem;
}

.sz-page-nav__marker {
  display: none;
}

/* ================================================================
   Lead Text - オレンジ強調テキスト
   ================================================================ */
.sz-lead-text {
  font-size: 1.1rem;
  line-height: 1.8;
  margin: 30px 0;
}

.sz-lead-text--orange {
  color: var(--sz-orange);
  font-weight: 600;
}

/* ================================================================
   ヒーロー画像 - ページトップ用
   ================================================================ */
.sz-page-hero-image {
  width: 100%;
  overflow: hidden;
  margin-bottom: 30px;
}

.sz-page-hero-image img {
  width: 100%;
  height: auto;
  display: block;
}

/* ================================================================
   3つの円 - 地域医療支援病院のメリット
   ================================================================ */
.sz-section__text-with-diagram {
  display: flex;
  gap: 40px;
  margin-bottom: 40px;
}

.sz-section__text {
  flex: 1;
}

.sz-section__diagram {
  flex: 0 0 320px;
}

.sz-three-circles {
  position: relative;
  width: 280px;
  height: 240px;
  margin: 0 auto;
}

.sz-three-circles__item {
  position: absolute;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  background: var(--sz-primary);
  color: var(--color-white);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 15px;
}

.sz-three-circles__item--top {
  top: 0;
  left: 50%;
  transform: translateX(-50%);
}

.sz-three-circles__item--left {
  bottom: 0;
  left: 0;
}

.sz-three-circles__item--right {
  bottom: 0;
  right: 0;
}

.sz-three-circles__num {
  font-size: 1.2rem;
  font-weight: 700;
  opacity: 0.8;
}

.sz-three-circles__text {
  font-size: 0.75rem;
  line-height: 1.4;
  font-weight: 500;
}

/* ================================================================
   Feature Items - 特徴アイテム（プレミアムスタイル）
   ================================================================ */
.sz-feature-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
}

.sz-feature-item {
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 16px;
  padding: 28px;
  display: flex;
  gap: 20px;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.sz-feature-item::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 4px;
  height: 100%;
  background: linear-gradient(180deg, var(--sz-primary, #114fa1) 0%, #3b82f6 100%);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.sz-feature-item:hover {
  box-shadow: 0 8px 32px rgba(17, 79, 161, 0.12);
  transform: translateY(-4px);
  border-color: var(--sz-primary, #114fa1);
}

.sz-feature-item:hover::before {
  opacity: 1;
}

.sz-feature-item__icon {
  flex-shrink: 0;
  width: 56px;
  height: 56px;
  background: linear-gradient(135deg, var(--sz-primary, #114fa1) 0%, #1a5fb8 100%);
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(17, 79, 161, 0.25);
}

.sz-feature-item__icon .material-symbols-outlined {
  font-size: 1.75rem;
  color: var(--sz-white, #fff);
}

.sz-feature-item__content {
  flex: 1;
}

.sz-feature-item__title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--sz-text, #333);
  margin: 0 0 10px;
  line-height: 1.4;
}

.sz-feature-item__content p {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.8;
  color: var(--sz-text-light, #666);
}

.sz-feature-item__dot {
  width: 10px;
  height: 10px;
  background: var(--sz-primary);
  border-radius: 50%;
  flex-shrink: 0;
}

.sz-feature-item__text {
  margin: 0;
  line-height: 1.8;
  color: var(--sz-text-light);
}

/* ================================================================
   Disease Categories - 対応疾患カテゴリ（プレミアムスタイル）
   ================================================================ */
.sz-disease-categories {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 20px;
}

.sz-disease-category {
  background: var(--sz-white, #fff);
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 14px;
  overflow: hidden;
  transition: all 0.3s ease;
}

.sz-disease-category:hover {
  box-shadow: 0 6px 24px rgba(0, 0, 0, 0.08);
  transform: translateY(-2px);
}

.sz-disease-category__title {
  background: linear-gradient(135deg, var(--sz-primary, #114fa1) 0%, #1a5fb8 100%);
  color: var(--sz-white, #fff);
  font-size: 0.95rem;
  font-weight: 700;
  padding: 14px 20px;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

.sz-disease-category__title::before {
  content: '';
  width: 6px;
  height: 6px;
  background: rgba(255, 255, 255, 0.6);
  border-radius: 50%;
}

.sz-disease-list {
  list-style: none;
  margin: 0;
  padding: 16px 20px;
}

.sz-disease-list li {
  position: relative;
  padding: 10px 0 10px 24px;
  font-size: 0.9rem;
  color: var(--sz-text, #333);
  border-bottom: 1px dashed var(--sz-gray-200, #e5e7eb);
  transition: all 0.2s ease;
}

.sz-disease-list li:last-child {
  border-bottom: none;
}

.sz-disease-list li::before {
  content: '';
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  width: 8px;
  height: 8px;
  background: var(--sz-primary, #114fa1);
  border-radius: 50%;
  opacity: 0.7;
}

.sz-disease-list li:hover {
  color: var(--sz-primary, #114fa1);
  padding-left: 28px;
}

.sz-disease-list li:hover::before {
  opacity: 1;
  transform: translateY(-50%) scale(1.2);
}

/* レスポンシブ */
@media (max-width: 768px) {
  .sz-feature-list {
    grid-template-columns: 1fr;
  }

  .sz-feature-item {
    padding: 20px;
  }

  .sz-feature-item__icon {
    width: 48px;
    height: 48px;
  }

  .sz-feature-item__icon .material-symbols-outlined {
    font-size: 1.5rem;
  }

  .sz-disease-categories {
    grid-template-columns: 1fr;
  }
}

/* ================================================================
   Link Box - リンクボックス
   ================================================================ */
.sz-link-box {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  background: var(--sz-gray-100);
  color: var(--sz-primary);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 500;
  border-radius: 4px;
  margin-top: 12px;
  transition: all 0.2s ease;
}

.sz-link-box:hover {
  background: var(--sz-primary);
  color: var(--color-white);
}

/* ================================================================
   Highlight Text - 強調テキスト
   ================================================================ */
.sz-highlight-text {
  font-size: 1.1rem;
  line-height: 1.8;
  margin-bottom: 20px;
}

.sz-highlight-text--orange {
  color: var(--sz-orange);
  font-weight: 600;
}

/* ================================================================
   Download Link - ダウンロードリンク
   ================================================================ */
.sz-download-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  color: var(--sz-primary);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 500;
  border-radius: 4px;
  margin: 20px 0;
  transition: all 0.2s ease;
}

.sz-download-link:hover {
  border-color: var(--sz-primary);
  background: var(--sz-primary-light);
}

.sz-download-link .material-symbols-outlined {
  color: #c00;
}

/* Download Link Disabled - 準備中ダウンロードリンク */
.sz-download-link--disabled {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 12px 20px;
  background: var(--sz-gray-50, #f8f9fa);
  border: 1px solid var(--sz-border, #e0e0e0);
  color: var(--sz-gray-500, #6c757d);
  font-size: 0.875rem;
  font-weight: 500;
  border-radius: 4px;
  margin: 20px 0;
  cursor: not-allowed;
  opacity: 0.7;
}

.sz-download-link--disabled .material-symbols-outlined {
  color: var(--sz-gray-400, #adb5bd);
}

/* ================================================================
   Badge - バッジ
   ================================================================ */
.sz-badge {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  font-size: 0.6875rem;
  font-weight: 600;
  border-radius: 12px;
  line-height: 1.5;
  margin-left: 8px;
}

.sz-badge--gray {
  background: var(--sz-gray-200, #e9ecef);
  color: var(--sz-gray-600, #6c757d);
}

.sz-badge--primary {
  background: var(--sz-primary, #007bff);
  color: #fff;
}

.sz-badge--success {
  background: #28a745;
  color: #fff;
}

.sz-badge--warning {
  background: #ffc107;
  color: #212529;
}

/* ================================================================
   Download Info Note - ダウンロード情報ノート
   ================================================================ */
.sz-download-info {
  font-size: 0.8125rem;
  color: var(--sz-gray-500, #6c757d);
  margin-top: 8px;
  font-style: italic;
}

/* ================================================================
   Contact Inline - インライン連絡先
   ================================================================ */
.sz-contact-inline {
  background: var(--sz-gray-50);
  padding: 20px;
  border-radius: 4px;
  margin-top: 16px;
}

.sz-contact-inline__label {
  font-size: 0.875rem;
  color: var(--sz-text-light);
  margin: 0 0 8px;
}

.sz-contact-inline__tel {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 1.3rem;
  font-weight: 700;
  color: var(--sz-primary);
  text-decoration: none;
}

.sz-contact-inline__note {
  font-size: 0.8125rem;
  color: var(--sz-text-light);
  margin: 8px 0 0;
}

/* ================================================================
   Consultation Box - 相談内容ボックス
   ================================================================ */
.sz-consultation-box {
  background: var(--sz-gray-50);
  border: 1px solid var(--sz-border);
  border-radius: 4px;
  padding: 30px;
  margin: 30px 0;
}

.sz-consultation-box__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-text);
  margin: 0 0 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--sz-border);
}

.sz-consultation-box__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
}

.sz-consultation-box__item {
  background: var(--color-white);
  padding: 20px;
  border-radius: 4px;
}

.sz-consultation-box__item-title {
  display: flex;
  align-items: center;
  gap: 10px;
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--sz-text);
  margin: 0 0 10px;
}

.sz-consultation-box__dot {
  width: 8px;
  height: 8px;
  background: var(--sz-primary);
  border-radius: 50%;
  flex-shrink: 0;
}

.sz-consultation-box__text {
  font-size: 0.8125rem;
  line-height: 1.7;
  color: var(--sz-text-light);
  margin: 0;
}

/* ================================================================
   Related Section - 関連ページ
   ================================================================ */
.sz-related {
  padding: 32px;
  margin-top: 48px;
  background: #fff;
  border: 1px solid var(--sz-border, #e0e0e0);
  border-radius: 16px;
}

.sz-related--gray {
  background: var(--sz-gray-100);
}

.sz-related__title {
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--sz-text, #333);
  margin: 0 0 20px;
}

.sz-related__title-bar {
  display: block;
  width: 4px;
  height: 24px;
  background: var(--sz-accent, #E65100);
  border-radius: 2px;
}

.sz-related__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

@media (max-width: 1024px) {
  .sz-related__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .sz-related__grid {
    grid-template-columns: 1fr;
  }
  .sz-related {
    padding: 20px;
  }
}

.sz-related__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 14px 18px;
  background: #fff;
  border: 1px solid var(--sz-border, #e0e0e0);
  color: var(--sz-text, #333);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 500;
  border-radius: 8px;
  transition: all 0.3s ease;
}

.sz-related__link:hover {
  border-color: var(--sz-primary, #114FA1);
  color: var(--sz-primary, #114FA1);
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(17, 79, 161, 0.1);
}

.sz-related__link .material-symbols-outlined {
  font-size: 1.125rem;
  color: var(--sz-primary, #114FA1);
}

/* ================================================================
   Popular Section - よくご覧いただくページ
   ================================================================ */
.sz-popular {
  margin-top: 32px;
  padding: 32px;
  background: #fff;
  border-radius: 12px;
}

.sz-popular--orange {
  background: #fff;
}

.sz-popular__title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--sz-text, #333);
  margin: 0 0 20px;
  padding-bottom: 12px;
}

.sz-popular__title--orange {
  color: var(--sz-text, #333);
  border-bottom: 3px solid var(--sz-accent, #E65100);
  display: inline-block;
}

.sz-popular__title-line {
  display: none;
}

.sz-popular__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 12px;
}

@media (max-width: 1024px) {
  .sz-popular__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .sz-popular__grid {
    grid-template-columns: 1fr;
  }
  .sz-popular {
    padding: 20px;
  }
}

.sz-popular__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  background: #fff;
  border: 1px solid var(--sz-border, #e0e0e0);
  border-radius: 8px;
  text-decoration: none;
  color: var(--sz-text, #333);
  font-size: 0.875rem;
  font-weight: 500;
  transition: all 0.2s ease;
}

.sz-popular__link:hover {
  background: var(--sz-gray-50, #f8f9fa);
  border-color: var(--sz-orange, #E67E22);
  color: var(--sz-orange, #E67E22);
}

.sz-popular__link .material-symbols-outlined {
  font-size: 1.125rem;
  color: var(--sz-orange, #E67E22);
}

.sz-popular__link:hover .material-symbols-outlined {
  color: var(--sz-orange, #E67E22);
}

/* ================================================================
   Section Boxed - ボックス付きセクション
   ================================================================ */
.sz-section--boxed {
  background: var(--color-white);
  padding: 40px;
  border-radius: 0;
  margin-bottom: 40px;
  border: 1px solid var(--sz-border);
}

.sz-section__title--bar {
  position: relative;
  font-size: 1.2rem;
  font-weight: 600;
  color: var(--sz-text);
  margin: 0 0 30px;
  padding: 0 0 0 16px;
  border-left: 4px solid var(--sz-primary);
}

.sz-section__content {
  padding: 0;
}

/* ================================================================
   List Styles
   ================================================================ */
.sz-list--check {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-list--check li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 12px;
  line-height: 1.7;
}

.sz-list--check li::before {
  content: '✓';
  position: absolute;
  left: 0;
  color: var(--sz-primary);
  font-weight: 700;
}

.sz-list--number {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-list--number li {
  position: relative;
  padding-left: 28px;
  margin-bottom: 12px;
  line-height: 1.7;
}

/* ================================================================
   Table Styles
   ================================================================ */
.sz-table--bordered {
  width: 100%;
  border-collapse: collapse;
  margin-top: 16px;
}

.sz-table--bordered th,
.sz-table--bordered td {
  padding: 14px 16px;
  border: 1px solid var(--sz-border);
  text-align: left;
}

.sz-table--bordered th {
  background: var(--sz-gray-50);
  font-weight: 600;
  width: 30%;
}

/* ================================================================
   Responsive - Community Pages
   ================================================================ */
@media (max-width: 992px) {
  .sz-section__text-with-diagram {
    flex-direction: column;
  }

  .sz-section__diagram {
    flex: 0 0 auto;
  }

  .sz-consultation-box__grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .sz-page-nav {
    flex-direction: column;
  }

  .sz-page-nav__item {
    width: 100%;
    justify-content: space-between;
  }

  .sz-section--boxed {
    padding: 24px;
  }

  .sz-consultation-box {
    padding: 20px;
  }
}
/* ================================================================
   Emergency Time Boxes - 当日緊急受診
   ================================================================ */
.sz-emergency-time-boxes {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
  margin-top: 20px;
}

.sz-emergency-time-box {
  padding: 20px;
  border-radius: 4px;
  text-align: center;
}

.sz-emergency-time-box--primary {
  background: var(--sz-primary);
  color: var(--color-white);
}

.sz-emergency-time-box--secondary {
  background: var(--sz-orange);
  color: var(--color-white);
}

.sz-emergency-time-box__time {
  font-size: 0.875rem;
  font-weight: 500;
  margin: 0 0 8px;
  opacity: 0.9;
}

.sz-emergency-time-box__label {
  font-size: 0.8125rem;
  margin: 0 0 8px;
  opacity: 0.8;
}

.sz-emergency-time-box__tel {
  display: block;
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--color-white);
  text-decoration: none;
}

.sz-emergency-time-box__tel:hover {
  opacity: 0.9;
}

/* ================================================================
   Download List
   ================================================================ */
.sz-download-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-download-list li {
  margin-bottom: 12px;
}

.sz-download-list .sz-download-link {
  margin: 0;
}

/* ================================================================
   Note - 注釈
   ================================================================ */
.sz-note {
  font-size: 0.8125rem;
  color: var(--sz-text-light);
  margin: 10px 0;
}

/* ================================================================
   Popular Links Current
   ================================================================ */
.sz-popular__link--current {
  background: var(--sz-orange);
  color: var(--color-white);
  border-color: var(--sz-orange);
}

.sz-popular__link--current:hover {
  background: #d35400;
  color: var(--color-white);
}

.sz-popular__link--current .material-symbols-outlined {
  color: var(--color-white);
}

@media (max-width: 768px) {
  .sz-emergency-time-boxes {
    grid-template-columns: 1fr;
  }
}

/* ================================================================
   専門外来ページ - Specialized Outpatient Clinic
   ================================================================ */
.sz-specialized-nav {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 12px;
  margin: 40px 0;
  padding: 0;
}

.sz-specialized-nav__item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 16px 20px;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  color: var(--sz-text);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 500;
  border-radius: 0;
  transition: all 0.2s ease;
  position: relative;
}

.sz-specialized-nav__item::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 4px;
  background: var(--sz-primary);
}

.sz-specialized-nav__item:hover {
  background: var(--sz-primary-light);
  border-color: var(--sz-primary);
}

.sz-specialized-nav__item .material-symbols-outlined {
  font-size: 1.125rem;
  color: var(--sz-primary);
}

.sz-specialized-nav__marker {
  display: none;
}

/* 専門外来セクション */
.sz-specialized-section {
  margin-bottom: 40px;
}

.sz-specialized-section__header {
  background: linear-gradient(135deg, #e8f4fc 0%, #f0f8ff 100%);
  padding: 20px 24px;
  margin-bottom: 24px;
  border-left: 4px solid var(--sz-primary);
}

.sz-specialized-section__title {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--sz-primary);
  margin: 0;
}

.sz-specialized-section__body {
  padding: 0;
  line-height: 1.8;
  color: var(--sz-text);
}

.sz-specialized-section__body p {
  margin: 0 0 16px;
}

.sz-specialized-section__more {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 16px 24px;
  background: var(--sz-gray-50);
  border: 1px solid var(--sz-border);
  color: var(--sz-text);
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 500;
  border-radius: 4px;
  margin: 20px 0;
  transition: all 0.2s ease;
}

.sz-specialized-section__more:hover {
  background: var(--sz-primary-light);
  border-color: var(--sz-primary);
  color: var(--sz-primary);
}

.sz-specialized-section__more .material-symbols-outlined {
  font-size: 1.125rem;
}

/* アコーディオン専門外来版 */
.sz-accordion--specialized {
  border: 1px solid var(--sz-border);
  margin-top: 24px;
}

.sz-accordion--specialized .sz-accordion__header {
  padding: 16px 20px;
  background: var(--color-white);
}

.sz-accordion--specialized .sz-accordion__content {
  border-top: 1px dashed var(--sz-border);
}

/* リスト - disc版 */
.sz-list--disc {
  list-style: disc;
  padding-left: 20px;
  margin: 0;
}

.sz-list--disc li {
  margin-bottom: 6px;
  line-height: 1.6;
}

/* サイドバーボタン */
.sz-sidebar-buttons {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-bottom: 16px;
}

.sz-sidebar-button {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 20px 16px;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 4px;
  text-decoration: none;
  transition: all 0.2s ease;
}

.sz-sidebar-button:hover {
  border-color: var(--sz-primary);
  background: var(--sz-primary-light);
}

.sz-sidebar-button__icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 10px;
}

.sz-sidebar-button__icon--calendar {
  background: #e8f4fc;
  color: var(--sz-primary);
}

.sz-sidebar-button__icon--map {
  background: #e8f8f0;
  color: #0d9488;
}

.sz-sidebar-button__icon .material-symbols-outlined {
  font-size: 1.5rem;
}

.sz-sidebar-button__text {
  text-align: center;
}

.sz-sidebar-button__main {
  display: block;
  font-size: 0.8125rem;
  font-weight: 600;
  color: var(--sz-text);
}

.sz-sidebar-button__sub {
  display: block;
  font-size: 0.75rem;
  color: var(--sz-text-light);
}

/* サイドバー予約リンク */
.sz-sidebar-reserve {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 4px;
  text-decoration: none;
  transition: all 0.2s ease;
}

.sz-sidebar-reserve:hover {
  border-color: var(--sz-primary);
  background: var(--sz-primary-light);
}

.sz-sidebar-reserve__icon {
  width: 40px;
  height: 40px;
  background: #e8f4fc;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--sz-primary);
}

.sz-sidebar-reserve__icon .material-symbols-outlined {
  font-size: 1.25rem;
}

.sz-sidebar-reserve__text {
  flex: 1;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--sz-text);
}

.sz-sidebar-reserve__arrow {
  font-size: 1.125rem;
  color: var(--sz-text-light);
}

/* スティッキーサブナビ */
.sz-sticky-subnav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: var(--color-white);
  border-bottom: 1px solid var(--sz-border);
  display: flex;
  overflow-x: auto;
  /* -webkit-overflow-scrolling: touch; -- 非推奨、削除 */
}

.sz-sticky-subnav__item {
  flex-shrink: 0;
  padding: 16px 24px;
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--sz-text);
  text-decoration: none;
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  transition: color 0.2s ease;
}

.sz-sticky-subnav__item::before {
  content: '';
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-top: 6px solid var(--sz-primary);
}

.sz-sticky-subnav__item:hover {
  color: var(--sz-primary);
}

.sz-sticky-subnav__item.active {
  color: var(--sz-primary);
}

@media (max-width: 992px) {
  .sz-specialized-nav {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .sz-specialized-nav {
    grid-template-columns: 1fr;
  }

  .sz-sidebar-buttons {
    grid-template-columns: 1fr;
  }
}

/* ================================================================
   News Page Styles - お知らせページ
   https://saikazo.org/news/ 完全再現
   ================================================================ */

/* ----------------------------------------------------------------
   News List - お知らせ一覧
   ---------------------------------------------------------------- */
.sz-news-list {
  /* お知らせ一覧コンテナ */
}

.sz-news-list__item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 20px 0;
  border-bottom: 1px solid var(--color-gray-300);
  text-decoration: none;
  color: inherit;
  transition: background 0.3s ease;
}

.sz-news-list__item:first-child {
  padding-top: 0;
}

.sz-news-list__item:hover {
  background: var(--color-gray-100);
}

.sz-news-list__date {
  min-width: 100px;
  font-size: 0.875rem;
  color: var(--color-text-secondary);
  font-weight: 500;
}

.sz-news-list__category {
  display: inline-flex;
  align-items: center;
  min-width: 80px;
}

.sz-news-list__title {
  flex: 1;
  font-size: 0.9375rem;
  color: var(--color-text-primary);
  line-height: 1.6;
}

.sz-news-list__title:hover {
  color: var(--sz-primary);
}

/* News Category Badge */
.sz-news-category-badge {
  display: inline-block;
  padding: 3px 10px;
  font-size: 0.6875rem;
  font-weight: 600;
  border-radius: 3px;
  text-transform: uppercase;
  white-space: nowrap;
}

.sz-news-category-badge--info {
  background: #e8f4fc;
  color: #1976d2;
}

.sz-news-category-badge--news {
  background: #fff3e0;
  color: #e65100;
}

.sz-news-category-badge--event {
  background: #e8f5e9;
  color: #2e7d32;
}

.sz-news-category-badge--important {
  background: #ffebee;
  color: #c62828;
}

.sz-news-category-badge--default {
  background: var(--color-gray-100);
  color: var(--color-text-secondary);
}

/* ----------------------------------------------------------------
   News Detail - お知らせ詳細
   https://saikazo.org/news/21889/ 完全再現
   ---------------------------------------------------------------- */
.sz-news-article {
  background: var(--color-white);
}

/* 日付 */
.sz-news-article__date {
  display: block;
  font-size: 0.9375rem;
  color: var(--color-text-secondary);
  margin-bottom: 20px;
}

/* タイトル */
.sz-news-article__title {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--color-text-primary);
  line-height: 1.5;
  margin: 0 0 20px;
}

/* カテゴリバッジ - 枠線スタイル */
.sz-news-article__category {
  margin-bottom: 30px;
}

.sz-news-category-badge {
  display: inline-block;
  padding: 6px 20px;
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--color-text-primary);
  background: transparent;
  border: 1px solid var(--color-text-primary);
  border-radius: 20px;
}

/* 記事本文 */
.sz-news-article__body {
  padding-top: 30px;
  border-top: 1px solid var(--color-gray-300);
}

/* リード文 */
.sz-news-article__lead {
  font-size: 1rem;
  line-height: 1.8;
  color: var(--color-text-primary);
  margin-bottom: 20px;
}

/* 更新日 - 右寄せ */
.sz-news-article__update {
  font-size: 0.875rem;
  color: var(--color-text-primary);
  text-align: right;
  margin-bottom: 30px;
}

/* CKEditorコンテンツ */
.sz-news-article__content {
  font-size: 1rem;
  line-height: 1.8;
  color: var(--color-text-primary);
}

.sz-news-article__content h2 {
  font-size: 1.375rem;
  font-weight: 700;
  color: var(--color-text-primary);
  margin: 40px 0 20px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--sz-primary);
}

.sz-news-article__content h3 {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--color-text-primary);
  margin: 30px 0 15px;
}

.sz-news-article__content p {
  margin-bottom: 20px;
}

.sz-news-article__content ul,
.sz-news-article__content ol {
  margin: 20px 0;
  padding-left: 24px;
}

.sz-news-article__content li {
  margin-bottom: 10px;
}

.sz-news-article__content img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  margin: 20px 0;
}

.sz-news-article__content a {
  color: var(--sz-primary);
  text-decoration: underline;
}

.sz-news-article__content a:hover {
  text-decoration: none;
}

.sz-news-article__content blockquote {
  margin: 20px 0;
  padding: 20px;
  background: var(--color-gray-100);
  border-left: 4px solid var(--sz-primary);
  font-style: italic;
}

.sz-news-article__content table {
  width: 100%;
  border-collapse: collapse;
  margin: 20px 0;
}

.sz-news-article__content th,
.sz-news-article__content td {
  padding: 12px;
  border: 1px solid var(--color-gray-300);
  text-align: left;
}

.sz-news-article__content th {
  background: var(--color-gray-100);
  font-weight: 600;
}

/* 添付ファイル */
.sz-news-article__attachments {
  margin-top: 40px;
  padding-top: 30px;
  border-top: 1px solid var(--color-gray-300);
}

.sz-news-article__attachments-title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--color-text-primary);
  margin-bottom: 16px;
}

.sz-news-article__attachment-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-news-article__attachment-item {
  margin-bottom: 10px;
}

.sz-news-article__attachment-link {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  background: var(--color-gray-100);
  border-radius: 4px;
  color: var(--sz-primary);
  text-decoration: none;
  font-size: 0.875rem;
  transition: all 0.3s ease;
}

.sz-news-article__attachment-link:hover {
  background: var(--sz-primary);
  color: var(--color-white);
}

/* 一覧に戻るボタン - ベージュ/クリーム色 */
.sz-news-article__nav-back {
  margin-top: 50px;
}

.sz-news-back-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  max-width: 400px;
  margin: 0 auto;
  padding: 20px 40px;
  background: #f5f0e6;
  color: var(--color-text-primary);
  font-size: 1rem;
  font-weight: 500;
  border-radius: 50px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.sz-news-back-btn:hover {
  background: #ebe4d6;
}

.sz-news-back-btn .material-symbols-outlined {
  font-size: 1.25rem;
}

/* 区切り線 */
.sz-news-article__divider {
  border: none;
  border-top: 1px solid var(--color-gray-300);
  margin: 40px 0;
}

/* 次の記事へボタン - 白背景・枠線 */
.sz-news-article__nav-next {
  margin-bottom: 40px;
}

.sz-news-next-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  width: 100%;
  max-width: 400px;
  margin: 0 auto;
  padding: 20px 40px;
  background: var(--color-white);
  color: var(--color-text-primary);
  font-size: 1rem;
  font-weight: 500;
  border: 1px solid var(--color-gray-300);
  border-radius: 50px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.sz-news-next-btn:hover {
  background: var(--color-gray-100);
  border-color: #ccc;
}

.sz-news-next-btn .material-symbols-outlined {
  font-size: 1.25rem;
}

/* ----------------------------------------------------------------
   Pagination - ページネーション
   ---------------------------------------------------------------- */
.sz-pagination {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  margin-top: 40px;
  padding-top: 30px;
  border-top: 1px solid var(--color-gray-300);
}

.sz-pagination__link,
.sz-pagination__current {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 40px;
  height: 40px;
  padding: 0 12px;
  font-size: 0.875rem;
  font-weight: 500;
  border-radius: 4px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.sz-pagination__link {
  background: var(--color-gray-100);
  color: var(--color-text-primary);
}

.sz-pagination__link:hover {
  background: var(--sz-primary);
  color: var(--color-white);
}

.sz-pagination__current {
  background: var(--sz-primary);
  color: var(--color-white);
}

.sz-pagination__ellipsis {
  padding: 0 8px;
  color: #999;
}

/* ----------------------------------------------------------------
   News Sidebar - サイドバー
   ---------------------------------------------------------------- */
.sz-news-sidebar {
  background: #f9f9f9;
  padding: 24px;
  border-radius: 8px;
}

.sz-news-sidebar__section {
  margin-bottom: 30px;
}

.sz-news-sidebar__section:last-child {
  margin-bottom: 0;
}

.sz-news-sidebar__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--color-text-primary);
  margin-bottom: 16px;
  padding-bottom: 10px;
  border-bottom: 2px solid var(--sz-primary);
}

.sz-news-sidebar__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-news-sidebar__item {
  margin-bottom: 8px;
}

.sz-news-sidebar__link {
  display: block;
  padding: 10px 12px;
  color: var(--color-text-primary);
  font-size: 0.875rem;
  text-decoration: none;
  border-radius: 4px;
  transition: all 0.3s ease;
}

.sz-news-sidebar__link:hover,
.sz-news-sidebar__link.active {
  background: var(--sz-primary);
  color: var(--color-white);
}

.sz-news-sidebar__count {
  float: right;
  font-size: 0.75rem;
  color: #999;
  background: var(--color-gray-300);
  padding: 2px 8px;
  border-radius: 10px;
}

.sz-news-sidebar__link:hover .sz-news-sidebar__count,
.sz-news-sidebar__link.active .sz-news-sidebar__count {
  background: rgba(255, 255, 255, 0.3);
  color: var(--color-white);
}

/* Responsive */
@media (max-width: 768px) {
  .sz-news-list__item {
    flex-direction: column;
    gap: 8px;
  }

  .sz-news-list__date {
    min-width: auto;
  }

  .sz-news-article__title {
    font-size: 1.375rem;
  }

  .sz-news-article__nav {
    flex-direction: column;
  }

  .sz-news-pager {
    width: 100%;
    justify-content: space-between;
  }

  .sz-pagination {
    flex-wrap: wrap;
  }
}

/* ================================================================
   診療科・部門一覧ページ（saikazo.org/department/スタイル）
   ================================================================ */

/* サブナビのマーカー */
.sz-subnav__marker {
  color: var(--sz-primary);
  margin-right: 6px;
  font-size: 0.625rem;
}

/* ========================================
 * saikazo.org page-link スタイル（診療科一覧用）
 * ======================================== */

/* 診療科リンク - 統一デザイン */
.page-link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  gap: 0.9rem;
}

.page-link.page-link--center {
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.page-link .page-link__item {
  width: calc((100% - 1.8rem) * 0.333);
}

@media screen and (max-width: 767px) {
  .page-link .page-link__item {
    width: calc((100% - 0.9rem) / 2);
  }
}

.page-link .page-link__btn {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  position: relative;
  height: 100%;
  min-height: 3.5rem;
  padding: 0.4rem 3rem 0.4rem 1.5rem;
  font-size: 1rem;
  font-size: max(1rem, 10px);
  letter-spacing: 0.02em;
  font-weight: 400;
  line-height: 1.5;
  border: 0.1rem solid #d1d1d1;
  border-radius: 0.6rem;
  overflow: hidden;
  background-color: var(--color-white);
  text-decoration: none;
  color: #222;
  -webkit-transition: color 0.25s ease, border-color 0.25s ease, background-color 0.25s ease;
  transition: color 0.25s ease, border-color 0.25s ease, background-color 0.25s ease;
}

@media screen and (max-width: 767px) {
  .page-link .page-link__btn {
    font-size: 0.9rem;
    font-size: max(0.9rem, 10px);
    letter-spacing: 0;
    padding: 0.4rem 2rem 0.4rem 1.1rem;
    border-radius: 0.5rem;
    min-height: 3rem;
  }
}

.page-link .page-link__btn:hover {
  color: var(--color-white);
  background-color: #114fa1;
}

.page-link .page-link__btn::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -0.4rem;
  right: 0;
  margin: auto 0;
  width: 0.9rem;
  height: 0.9rem;
  background-color: #4684d7;
  border-radius: 0.9rem;
  -webkit-transition: background-color 0.25s ease, -webkit-transform 0.25s ease;
  transition: background-color 0.25s ease, transform 0.25s ease;
}

@media screen and (max-width: 767px) {
  .page-link .page-link__btn::before {
    width: 0.8rem;
    height: 0.8rem;
  }
}

.page-link .page-link__txt {
  flex: 1;
}

.page-link .page-link__btn .ico_svg {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0.8rem;
  width: 2.5rem;
  margin: auto 0;
}

@media screen and (max-width: 767px) {
  .page-link .page-link__btn .ico_svg {
    right: 0.5rem;
    width: 1.8rem;
  }
}

.page-link .page-link__btn .ico_svg .svg-circle {
  fill: #f4f2eb;
  -webkit-transition: fill 0.25s ease;
  transition: fill 0.25s ease;
}

.page-link .page-link__btn .ico_svg .svg-path {
  fill: #114fa1;
  -webkit-transition: fill 0.25s ease;
  transition: fill 0.25s ease;
}

.page-link .page-link__btn:hover .ico_svg .svg-circle {
  fill: #114fa1;
}

.page-link .page-link__btn:hover .ico_svg .svg-path {
  fill: var(--color-white);
}

/* 旧スタイル - 後方互換性 */
.sz-dept-grid {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: flex-start;
  gap: 0.9rem;
}

.sz-dept-item {
  width: calc((100% - 1.8rem) * 0.333);
  display: flex;
  align-items: center;
  justify-content: flex-start;
  position: relative;
  height: 100%;
  min-height: 3.5rem;
  padding: 0.4rem 3rem 0.4rem 1.5rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  border: 0.1rem solid #d1d1d1;
  border-radius: 0.6rem;
  overflow: hidden;
  background-color: var(--color-white);
  text-decoration: none;
  color: #222;
  transition: color 0.25s ease, border-color 0.25s ease, background-color 0.25s ease;
}

@media screen and (max-width: 767px) {
  .sz-dept-item {
    width: calc((100% - 0.9rem) / 2);
    font-size: 0.9rem;
    padding: 0.4rem 2rem 0.4rem 1.1rem;
    border-radius: 0.5rem;
    min-height: 3rem;
  }
}

.sz-dept-item:hover {
  color: var(--color-white);
  background-color: #114fa1;
}

.sz-dept-item::before {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -0.4rem;
  margin: auto 0;
  width: 0.9rem;
  height: 0.9rem;
  background-color: #4684d7;
  border-radius: 0.9rem;
}

.sz-dept-item__indicator {
  display: none;
}

.sz-dept-item__name {
  flex: 1;
  font-size: inherit;
  font-weight: 500;
  color: inherit;
}

.sz-dept-item__arrow {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0.8rem;
  display: flex;
  align-items: center;
  color: #114fa1;
  font-size: 0.875rem;
}

.sz-dept-item:hover .sz-dept-item__arrow {
  color: var(--color-white);
}

/* よくご覧いただくページ */
.sz-popular-section {
  background: #faf5ef;
  padding: 40px;
  border-radius: 8px;
  margin-top: 60px;
}

.sz-popular-section__title {
  font-size: 1.25rem;
  font-weight: 600;
  color: #e67e22;
  margin-bottom: 24px;
  padding-bottom: 0;
  border-bottom: none;
}

.sz-popular-section__title::before {
  display: none;
}

.sz-popular-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 12px;
}

.sz-popular-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 16px 20px;
  background: var(--color-white);
  border: 1px solid #e5e5e5;
  border-radius: 6px;
  text-decoration: none;
  transition: all 0.2s ease;
}

.sz-popular-link:hover {
  border-color: var(--sz-primary);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.sz-popular-link__icon {
  font-size: 1.25rem;
}

.sz-popular-link__text {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--sz-text);
}

/* サイドバーサブリスト */
.sz-sidebar-nav__sublist {
  list-style: none;
  padding: 0;
  margin: 0;
  padding-left: 20px;
  display: block;
}

.sz-sidebar-nav__sublink {
  display: block;
  padding: 10px 15px;
  font-size: 0.8125rem;
  color: var(--sz-text-light);
  text-decoration: none;
  border-left: 2px solid transparent;
  transition: all 0.2s ease;
}

.sz-sidebar-nav__sublink:hover,
.sz-sidebar-nav__sublink.active {
  color: var(--sz-primary);
  border-left-color: var(--sz-primary);
  background: var(--sz-primary-light);
}

.sz-sidebar-nav__link--parent {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.sz-sidebar-nav__toggle {
  font-size: 0.625rem;
  color: var(--sz-gray-400);
}

/* レスポンシブ */
@media (max-width: 1024px) {
  .sz-dept-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .sz-dept-item:nth-child(3n) {
    border-right: 1px solid var(--sz-border);
  }

  .sz-dept-item:nth-child(2n) {
    border-right: none;
  }
}

@media (max-width: 768px) {
  .sz-dept-grid {
    grid-template-columns: 1fr;
  }

  .sz-dept-item {
    border-right: none;
  }

  .sz-popular-section {
    padding: 24px;
    margin-top: 40px;
  }

  .sz-popular-grid {
    grid-template-columns: 1fr;
  }
}

/* 外部医師情報スタイル */
.sz-dept-schedule__doctors {
  margin-top: 16px;
  padding: 16px;
  background: linear-gradient(135deg, #f8fafc 0%, #eef2f7 100%);
  border-radius: 8px;
  border-left: 3px solid var(--sz-primary);
}

.sz-dept-schedule__doctors-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--sz-text);
  margin: 0 0 12px;
}

.sz-dept-schedule__doctors-title .material-symbols-outlined {
  font-size: 1.125rem;
  color: var(--sz-primary);
}

.sz-dept-schedule__doctors-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-dept-schedule__doctors-list li {
  padding: 8px 0;
  border-bottom: 1px dashed var(--sz-border);
}

.sz-dept-schedule__doctors-list li:last-child {
  border-bottom: none;
}

.sz-dept-schedule__doctors-list a {
  color: var(--sz-text);
  text-decoration: none;
  font-size: 0.9rem;
  transition: color 0.2s ease;
}

.sz-dept-schedule__doctors-list a:hover {
  color: var(--sz-primary);
}

.sz-dept-schedule__doctors-list small {
  color: var(--sz-text-light);
  font-size: 0.8rem;
}

/* 外部医療機関セクション */
.sz-external-doctors-intro {
  background: var(--sz-gray-50);
  padding: 20px 24px;
  border-radius: 8px;
  margin-bottom: 32px;
}

.sz-external-doctors-intro p {
  margin: 0;
  color: var(--sz-text);
  line-height: 1.8;
}

.sz-external-doctors-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
}

.sz-external-hospital-card {
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 12px;
  padding: 24px;
  transition: all 0.3s ease;
}

.sz-external-hospital-card:hover {
  border-color: var(--sz-primary);
  box-shadow: 0 8px 24px rgba(17, 79, 161, 0.1);
  transform: translateY(-2px);
}

.sz-external-hospital-card__title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 0 0 12px;
}

.sz-external-hospital-card__title .material-symbols-outlined {
  font-size: 1.375rem;
  color: var(--sz-primary);
}

.sz-external-hospital-card__dept {
  display: inline-block;
  background: var(--sz-primary-light);
  color: var(--sz-primary);
  padding: 4px 12px;
  border-radius: 20px;
  font-size: 0.85rem;
  font-weight: 500;
  margin-bottom: 16px;
}

.sz-external-hospital-card__doctors {
  list-style: none;
  padding: 0;
  margin: 0 0 20px;
}

.sz-external-hospital-card__doctors li {
  padding: 8px 0;
  border-bottom: 1px dashed var(--sz-border);
  font-size: 0.95rem;
  color: var(--sz-text);
}

.sz-external-hospital-card__doctors li:last-child {
  border-bottom: none;
}

.sz-external-hospital-card__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--sz-primary);
  text-decoration: none;
  font-size: 0.9rem;
  font-weight: 500;
  transition: all 0.2s ease;
}

.sz-external-hospital-card__link:hover {
  color: var(--sz-primary-dark);
}

.sz-external-hospital-card__link .material-symbols-outlined {
  font-size: 1rem;
}

/* 外部医療機関カードのレスポンシブ */
@media (max-width: 1024px) {
  .sz-external-doctors-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .sz-external-doctors-grid {
    grid-template-columns: 1fr;
  }

  .sz-external-hospital-card {
    padding: 20px;
  }
}

/* ================================================================
   専門外来ページ - ドクターカードスタイル
   ================================================================ */

/* 専門外来グリッド */
.sz-specialized-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin: 30px 0;
}

/* 専門外来カード */
.sz-specialized-card {
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  transition: all 0.3s ease;
}

.sz-specialized-card:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  transform: translateY(-2px);
}

.sz-specialized-card__image {
  width: 100%;
  height: 200px;
  overflow: hidden;
  background: var(--color-gray-100);
}

.sz-specialized-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.sz-specialized-card:hover .sz-specialized-card__image img {
  transform: scale(1.05);
}

.sz-specialized-card__body {
  padding: 24px;
}

.sz-specialized-card__title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--sz-primary);
  margin: 0 0 8px;
}

.sz-specialized-card__doctor {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.95rem;
  color: var(--sz-text);
  margin-bottom: 12px;
}

.sz-specialized-card__doctor .material-symbols-outlined {
  font-size: 1.125rem;
  color: var(--sz-orange);
}

.sz-specialized-card__desc {
  font-size: 0.9rem;
  line-height: 1.7;
  color: var(--sz-text-light);
  margin: 0 0 16px;
}

.sz-specialized-card__schedule {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.85rem;
  color: var(--sz-text);
  padding: 12px 16px;
  background: var(--sz-gray-50);
  border-radius: 8px;
}

.sz-specialized-card__schedule .material-symbols-outlined {
  font-size: 1.125rem;
  color: var(--sz-primary);
}

/* 看護専門外来カード（小さいバージョン） */
.sz-nurse-card {
  display: flex;
  align-items: center;
  gap: 20px;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 12px;
  padding: 20px 24px;
  transition: all 0.3s ease;
}

.sz-nurse-card:hover {
  border-color: var(--sz-primary);
  box-shadow: 0 4px 16px rgba(17, 79, 161, 0.1);
}

.sz-nurse-card__icon {
  width: 64px;
  height: 64px;
  background: linear-gradient(135deg, #e8f4fc 0%, #d4e9f7 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
}

.sz-nurse-card__icon .material-symbols-outlined {
  font-size: 2rem;
  color: var(--sz-primary);
}

.sz-nurse-card__content {
  flex: 1;
}

.sz-nurse-card__title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--sz-text);
  margin: 0 0 8px;
}

.sz-nurse-card__desc {
  font-size: 0.85rem;
  line-height: 1.6;
  color: var(--sz-text-light);
  margin: 0;
}

/* チームリスト */
.sz-team-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 16px;
  margin: 20px 0;
}

.sz-team-item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 20px;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 8px;
  transition: all 0.2s ease;
}

.sz-team-item:hover {
  border-color: var(--sz-primary);
  background: var(--sz-primary-light);
}

.sz-team-item__icon {
  width: 48px;
  height: 48px;
  background: var(--sz-gray-50);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sz-team-item__icon .material-symbols-outlined {
  font-size: 1.5rem;
  color: var(--sz-primary);
}

.sz-team-item__name {
  flex: 1;
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--sz-text);
}

/* お問い合わせセクション */
.sz-contact-section {
  background: linear-gradient(135deg, #f8fafc 0%, #eef2f7 100%);
  border-radius: 12px;
  padding: 32px;
  margin-top: 48px;
  text-align: center;
}

.sz-contact-section__title {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--sz-text);
  margin: 0 0 20px;
}

.sz-contact-section__tel {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 2rem;
  font-weight: 700;
  color: var(--sz-primary);
  text-decoration: none;
}

.sz-contact-section__tel .material-symbols-outlined {
  font-size: 2rem;
}

.sz-contact-section__note {
  font-size: 0.9rem;
  color: var(--sz-text-light);
  margin: 12px 0 0;
}

/* レスポンシブ - 専門外来カード */
@media (max-width: 992px) {
  .sz-specialized-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .sz-nurse-card {
    flex-direction: column;
    text-align: center;
  }

  .sz-team-list {
    grid-template-columns: 1fr;
  }

  .sz-contact-section {
    padding: 24px;
  }

  .sz-contact-section__tel {
    font-size: 1.5rem;
  }
}

/* ================================================================
   専門外来カード - 新スタイル
   ================================================================ */

/* 外来グリッド */
.sz-outpatient-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin: 24px 0;
}

/* 外来カード */
.sz-outpatient-card {
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
  transition: all 0.3s ease;
}

.sz-outpatient-card:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
  transform: translateY(-2px);
}

.sz-outpatient-card__header {
  background: linear-gradient(135deg, var(--sz-primary) 0%, #0d3a7d 100%);
  padding: 16px 20px;
}

.sz-outpatient-card--nurse .sz-outpatient-card__header {
  background: linear-gradient(135deg, #10b981 0%, #059669 100%);
}

.sz-outpatient-card__title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--color-white);
  margin: 0;
}

.sz-outpatient-card__body {
  padding: 20px;
}

.sz-outpatient-card__desc {
  font-size: 0.9rem;
  line-height: 1.7;
  color: var(--sz-text);
  margin: 0 0 16px;
}

.sz-outpatient-card__doctor {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px;
  background: var(--sz-gray-50);
  border-radius: 8px;
}

.sz-outpatient-card__doctor-img {
  width: 64px;
  height: 64px;
  border-radius: 50%;
  object-fit: cover;
  border: 3px solid var(--color-white);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.sz-outpatient-card__doctor-info {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.sz-outpatient-card__doctor-name {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-text);
}

.sz-outpatient-card__doctor-title {
  font-size: 0.85rem;
  color: var(--sz-text-light);
}

/* チームアイテム */
.sz-team-item {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 20px;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 8px;
  transition: all 0.2s ease;
}

.sz-team-item:hover {
  border-color: var(--sz-primary);
  background: var(--sz-primary-light);
}

.sz-team-item__icon {
  width: 48px;
  height: 48px;
  background: var(--sz-gray-50);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.5rem;
  color: var(--sz-primary);
}

.sz-team-item__name {
  flex: 1;
  font-size: 0.95rem;
  font-weight: 500;
  color: var(--sz-text);
}

/* チームリスト */
.sz-team-list {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 16px;
  margin: 24px 0;
}

/* コンタクトボックス */
.sz-contact-box {
  background: linear-gradient(135deg, #f8fafc 0%, #eef2f7 100%);
  border-radius: 12px;
  padding: 32px;
  text-align: center;
}

.sz-contact-box__title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--sz-text);
  margin: 0 0 16px;
}

.sz-contact-box__title .material-symbols-outlined {
  color: var(--sz-primary);
}

.sz-contact-box__text {
  font-size: 0.95rem;
  line-height: 1.7;
  color: var(--sz-text);
  margin: 0 0 20px;
}

.sz-contact-box__tel {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--sz-primary);
  text-decoration: none;
}

.sz-contact-box__tel .material-symbols-outlined {
  font-size: 1.75rem;
}

/* レスポンシブ */
@media (max-width: 992px) {
  .sz-outpatient-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 768px) {
  .sz-team-list {
    grid-template-columns: 1fr;
  }

  .sz-contact-box {
    padding: 24px;
  }

  .sz-contact-box__tel {
    font-size: 1.5rem;
  }
}


/* ================================================================
   外来ページ統一スタイル（インラインスタイル廃止）
   ================================================================ */

/* テキスト中央揃え */
.page-text--center {
  text-align: center;
  font-size: 1.0625rem;
}

/* PC専用改行 */
.pc-only {
  display: inline;
}

@media (max-width: 768px) {
  .pc-only {
    display: none;
  }
}

/* 診療時間ボックス */
.hours-box {
  background: linear-gradient(135deg, var(--sz-primary, #114FA1) 0%, #0d3d7a 100%);
  border-radius: 16px;
  padding: 32px;
  color: #fff;
}

.hours-box__main {
  display: flex;
  justify-content: center;
  gap: 48px;
  margin-bottom: 24px;
}

.hours-box__time {
  text-align: center;
}

.hours-box__label {
  display: block;
  font-size: 0.875rem;
  opacity: 0.9;
  margin-bottom: 8px;
  font-family: 'Noto Sans JP', sans-serif;
}

.hours-box__value {
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 2rem;
  font-weight: 600;
}

.hours-box__note {
  border-top: 1px solid rgba(255, 255, 255, 0.2);
  padding-top: 20px;
  text-align: center;
}

.hours-box__note p {
  margin: 0 0 8px;
  font-size: 0.875rem;
  opacity: 0.95;
  font-family: 'Noto Sans JP', sans-serif;
}

.hours-box__note p:last-child {
  margin-bottom: 0;
}

/* ガイドグリッド - 横並び3カラム */
.guide-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

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

@media (max-width: 768px) {
  .guide-grid {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

.guide-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 16px;
  padding: 32px 24px;
  background: #fff;
  border: 1px solid #e5e7eb;
  border-radius: 12px;
  text-decoration: none;
  transition: all 0.3s ease;
  min-height: 180px;
}

.guide-card:hover {
  border-color: var(--sz-primary, #114FA1);
  box-shadow: 0 4px 20px rgba(17, 79, 161, 0.12);
  transform: translateY(-4px);
}

.guide-card__icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  background: linear-gradient(135deg, var(--sz-primary, #114FA1) 0%, #1a66c2 100%);
  border-radius: 16px;
  flex-shrink: 0;
}

.guide-card__icon .material-symbols-outlined {
  font-size: 2rem;
  color: #fff;
}

.guide-card__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.guide-card__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--sz-text, #333);
  margin: 0 0 8px;
  font-family: 'Noto Sans JP', sans-serif;
}

.guide-card__text {
  font-size: 0.8125rem;
  line-height: 1.6;
  color: var(--sz-text-light, #666);
  margin: 0;
  font-family: 'Noto Sans JP', sans-serif;
}

.guide-card__note {
  font-size: 0.75rem;
  line-height: 1.5;
  color: var(--sz-primary);
  margin: 12px 0 0;
  padding-top: 12px;
  border-top: 1px dashed var(--sz-border);
  font-family: 'Noto Sans JP', sans-serif;
}

.guide-card__arrow {
  display: none;
}

/* チェックリスト */
.checklist {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
}

.checklist__item {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px 20px;
  background: var(--sz-gray-50, #f9fafb);
  border-radius: 10px;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--sz-text, #333);
  font-family: 'Noto Sans JP', sans-serif;
}

.checklist__item .material-symbols-outlined {
  font-size: 1.375rem;
  color: var(--sz-primary, #114FA1);
}

/* お問い合わせボックス */
.contact-box {
  text-align: center;
  padding: 32px;
  background: var(--sz-gray-50, #f9fafb);
  border-radius: 16px;
}

.contact-box__text {
  font-size: 0.9375rem;
  color: var(--sz-text-light, #666);
  margin: 0 0 20px;
  font-family: 'Noto Sans JP', sans-serif;
}

.contact-box__tel {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-family: 'Noto Sans JP', sans-serif;
  font-size: 2rem;
  font-weight: 600;
  color: var(--sz-primary, #114FA1);
  text-decoration: none;
  margin-bottom: 12px;
}

.contact-box__tel .material-symbols-outlined {
  font-size: 2rem;
}

.contact-box__hours {
  font-size: 0.8125rem;
  color: var(--sz-text-light, #666);
  margin: 0;
  font-family: 'Noto Sans JP', sans-serif;
}

/* レスポンシブ - 外来ページ */
@media (max-width: 768px) {
  .hours-box {
    padding: 24px 20px;
  }

  .hours-box__main {
    flex-direction: column;
    gap: 20px;
  }

  .hours-box__value {
    font-size: 1.625rem;
  }

  .guide-card {
    flex-wrap: wrap;
    padding: 20px;
  }

  .guide-card__icon {
    width: 48px;
    height: 48px;
  }

  .guide-card__icon .material-symbols-outlined {
    font-size: 1.5rem;
  }

  .guide-card__content {
    flex: 1 1 calc(100% - 68px);
  }

  .guide-card__arrow {
    display: none;
  }

  .checklist {
    grid-template-columns: 1fr;
  }

  .contact-box__tel {
    font-size: 1.625rem;
  }
}

/* ================================================================
   診療科詳細ページ追加スタイル
   ================================================================ */

/* 特徴カード */
.sz-feature-cards {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 24px;
}

.sz-feature-card {
  background: var(--sz-white, #fff);
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 12px;
  padding: 32px 24px;
  text-align: center;
  transition: all 0.3s ease;
}

.sz-feature-card:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
  transform: translateY(-4px);
}

.sz-feature-card__icon {
  width: 64px;
  height: 64px;
  margin: 0 auto 16px;
  background: linear-gradient(135deg, var(--sz-primary, #114fa1) 0%, #1a5fb8 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sz-feature-card__icon .material-symbols-outlined {
  font-size: 2rem;
  color: var(--sz-white, #fff);
}

.sz-feature-card__title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--sz-text, #333);
  margin: 0 0 12px;
}

.sz-feature-card__text {
  font-size: 0.9rem;
  line-height: 1.7;
  color: var(--sz-text-light, #666);
  margin: 0;
}

@media (max-width: 992px) {
  .sz-feature-cards {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 576px) {
  .sz-feature-cards {
    grid-template-columns: 1fr;
  }

  .sz-feature-card {
    padding: 24px 20px;
  }
}

/* 医師紹介カード - プレミアムスタイル */
.sz-doctors-list {
  display: flex;
  flex-direction: column;
  gap: 32px;
}

.sz-doctor-card {
  background: var(--sz-white, #fff);
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 16px;
  overflow: hidden;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
  transition: all 0.3s ease;
}

.sz-doctor-card:hover {
  box-shadow: 0 8px 32px rgba(17, 79, 161, 0.12);
  transform: translateY(-2px);
}

.sz-doctor-card__header {
  background: linear-gradient(135deg, var(--sz-primary, #114fa1) 0%, #1a5fb8 100%);
  padding: 16px 24px;
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
}

.sz-doctor-card__position {
  display: inline-block;
  background: rgba(255, 255, 255, 0.2);
  color: var(--sz-white, #fff);
  font-size: 0.75rem;
  font-weight: 600;
  padding: 4px 14px;
  border-radius: 20px;
  letter-spacing: 0.05em;
}

.sz-doctor-card__name {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--sz-white, #fff);
  letter-spacing: 0.05em;
}

.sz-doctor-card__name-kana {
  font-size: 0.85rem;
  font-weight: 400;
  color: rgba(255, 255, 255, 0.85);
  margin-left: 0.5em;
}

.sz-doctor-card__content {
  display: grid;
  grid-template-columns: 200px 1fr;
  gap: 0;
}

.sz-doctor-card__photo {
  position: relative;
  background: linear-gradient(135deg, #f0f4f8, #e0e7ef);
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 280px;
  border-right: 1px solid var(--sz-gray-200, #e5e7eb);
}

.sz-doctor-card__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sz-doctor-card__photo-placeholder {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: var(--sz-gray-400, #9ca3af);
  gap: 8px;
}

.sz-doctor-card__photo-placeholder .material-symbols-outlined {
  font-size: 4rem;
  opacity: 0.5;
}

.sz-doctor-card__photo-placeholder span:last-child {
  font-size: 0.85rem;
}

.sz-doctor-card__info {
  padding: 24px 28px;
}

.sz-doctor-card__row {
  margin-bottom: 20px;
  padding-bottom: 16px;
  border-bottom: 1px dashed var(--sz-gray-200, #e5e7eb);
}

.sz-doctor-card__row:last-child {
  margin-bottom: 0;
  padding-bottom: 0;
  border-bottom: none;
}

.sz-doctor-card__row h4 {
  font-size: 0.85rem;
  font-weight: 700;
  color: var(--sz-primary, #114fa1);
  margin: 0 0 10px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.sz-doctor-card__row h4::before {
  content: '';
  width: 4px;
  height: 14px;
  background: var(--sz-primary, #114fa1);
  border-radius: 2px;
}

.sz-doctor-card__row p {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.7;
  color: var(--sz-text, #333);
}

.sz-doctor-card__row ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.sz-doctor-card__row li {
  position: relative;
  padding-left: 16px;
  margin-bottom: 6px;
  font-size: 0.9rem;
  line-height: 1.6;
  color: var(--sz-text, #333);
}

.sz-doctor-card__row li:last-child {
  margin-bottom: 0;
}

.sz-doctor-card__row li::before {
  content: '•';
  position: absolute;
  left: 0;
  color: var(--sz-primary, #114fa1);
  font-weight: bold;
}

.sz-doctor-card__message {
  background: linear-gradient(135deg, #f8fafc, #f0f7ff);
  border-left: 4px solid var(--sz-primary, #114fa1);
  padding: 16px 20px;
  border-radius: 0 8px 8px 0;
  margin-top: 16px;
}

.sz-doctor-card__message p {
  margin: 0;
  font-size: 0.95rem;
  line-height: 1.8;
  color: var(--sz-text, #333);
  font-style: italic;
}

.sz-doctor-card__message::before {
  content: '"';
  font-size: 2rem;
  color: var(--sz-primary, #114fa1);
  opacity: 0.3;
  line-height: 1;
  display: block;
  margin-bottom: -8px;
}

/* SNSリンク */
.sz-doctor-card__sns {
  display: flex;
  gap: 12px;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid var(--sz-gray-200, #e5e7eb);
}

.sz-doctor-card__sns-link {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  border-radius: 50%;
  background: var(--sz-gray-100, #f3f4f6);
  color: var(--sz-gray-600, #4b5563);
  transition: all 0.2s ease;
}

.sz-doctor-card__sns-link:hover {
  background: var(--sz-primary, #114fa1);
  color: var(--sz-white, #fff);
  transform: translateY(-2px);
}

.sz-doctor-card__sns-link .material-symbols-outlined {
  font-size: 1.125rem;
}

/* 新患受付バッジ */
.sz-doctor-card__accepting {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  background: #10b981;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 12px;
  margin-left: auto;
}

.sz-doctor-card__accepting .material-symbols-outlined {
  font-size: 0.875rem;
}

/* レスポンシブ */
@media (max-width: 768px) {
  .sz-doctor-card__content {
    grid-template-columns: 1fr;
  }

  .sz-doctor-card__photo {
    min-height: 200px;
    border-right: none;
    border-bottom: 1px solid var(--sz-gray-200, #e5e7eb);
  }

  .sz-doctor-card__info {
    padding: 20px;
  }
}

@media (max-width: 576px) {
  .sz-doctor-card__header {
    padding: 14px 18px;
  }

  .sz-doctor-card__name {
    font-size: 1.15rem;
  }

  .sz-doctor-card__name-kana {
    display: block;
    margin-left: 0;
    margin-top: 4px;
  }

  .sz-doctor-card__info {
    padding: 16px;
  }

  .sz-doctor-card__row {
    margin-bottom: 16px;
    padding-bottom: 12px;
  }

  .sz-doctor-card__message {
    padding: 12px 16px;
  }
}

/* コンタクトボックス追加スタイル */
.sz-contact-box__info {
  background: var(--sz-white, #fff);
  border-radius: 12px;
  padding: 24px;
  margin-top: 20px;
  display: inline-block;
}

.sz-contact-box__label {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-text, #333);
  margin: 0 0 8px;
}

.sz-contact-box__time {
  font-size: 0.9rem;
  color: var(--sz-text-light, #666);
  margin: 0 0 16px;
}

/* テーブル注記 */
.sz-table-notes {
  margin-top: 16px;
  padding: 16px 20px;
  background: var(--sz-gray-50, #f9fafb);
  border-radius: 8px;
}

.sz-table-notes p {
  font-size: 0.85rem;
  color: var(--sz-text-light, #666);
  margin: 0 0 4px;
  line-height: 1.6;
}

.sz-table-notes p:last-child {
  margin-bottom: 0;
}

/* ================================================================
   当院の取り組みページ追加スタイル
   ================================================================ */

/* ハイライトボックス */
.sz-highlight-box {
  display: flex;
  align-items: flex-start;
  gap: 24px;
  padding: 32px;
  background: linear-gradient(135deg, var(--sz-gray-50, #f9fafb) 0%, var(--sz-gray-100, #f3f4f6) 100%);
  border-radius: 16px;
  border-left: 4px solid var(--sz-primary, #114fa1);
}

.sz-highlight-box__icon {
  flex: 0 0 auto;
  width: 64px;
  height: 64px;
  background: linear-gradient(135deg, var(--sz-primary, #114fa1) 0%, #1a5fb8 100%);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sz-highlight-box__icon .material-symbols-outlined {
  font-size: 2rem;
  color: var(--sz-white, #fff);
}

.sz-highlight-box__content {
  flex: 1;
}

.sz-highlight-box__title {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--sz-primary, #114fa1);
  margin: 0 0 12px;
}

.sz-highlight-box__text {
  font-size: 1rem;
  line-height: 1.8;
  color: var(--sz-text, #333);
  margin: 0;
}

/* グリッドレイアウト */
.sz-grid {
  display: grid;
  gap: 16px;
  margin-top: 20px;
}

.sz-grid--2col {
  grid-template-columns: repeat(2, 1fr);
}

.sz-grid--3col {
  grid-template-columns: repeat(3, 1fr);
}

.sz-grid--4col {
  grid-template-columns: repeat(4, 1fr);
}

/* 情報カード（番号付き） */
.sz-info-card {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 24px;
  background: var(--sz-white, #fff);
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.sz-info-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
}

.sz-info-card__num {
  flex: 0 0 auto;
  width: 40px;
  height: 40px;
  background: linear-gradient(135deg, var(--sz-primary, #114fa1) 0%, #1a5fb8 100%);
  color: var(--sz-white, #fff);
  font-size: 1.25rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sz-info-card__text {
  flex: 1;
  font-size: 1rem;
  font-weight: 500;
  color: var(--sz-text, #333);
  line-height: 1.5;
}

/* ダウンロードボックス */
.sz-download-box {
  background: var(--sz-white, #fff);
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 12px;
  overflow: hidden;
}

.sz-download-box__link {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px 24px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.sz-download-box__link:hover {
  background: var(--sz-gray-50, #f9fafb);
}

.sz-download-box__link > .material-symbols-outlined:first-child {
  flex: 0 0 auto;
  font-size: 2.5rem;
  color: #e53e3e;
}

.sz-download-box__link > .material-symbols-outlined:last-child {
  flex: 0 0 auto;
  font-size: 1.5rem;
  color: var(--sz-primary, #114fa1);
}

.sz-download-box__text {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.sz-download-box__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-text, #333);
}

.sz-download-box__info {
  font-size: 0.85rem;
  color: var(--sz-text-light, #666);
}

/* チェックリスト */
.sz-list--check {
  list-style: none;
  padding: 0;
  margin: 24px 0 0;
}

.sz-list--check li {
  position: relative;
  padding-left: 36px;
  margin-bottom: 12px;
  font-size: 1rem;
  line-height: 1.7;
  color: var(--sz-text, #333);
}

.sz-list--check li::before {
  content: '\e5ca';
  font-family: 'Material Symbols Outlined';
  position: absolute;
  left: 0;
  top: 0;
  width: 24px;
  height: 24px;
  background: var(--sz-accent, #4ca858);
  color: var(--sz-white, #fff);
  font-size: 1rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* 沿革テーブル */
.sz-history-table {
  width: 100%;
  border-collapse: collapse;
  margin: 24px 0;
}

.sz-history-table th,
.sz-history-table td {
  padding: 16px 20px;
  text-align: left;
  border-bottom: 1px solid var(--sz-gray-200, #e5e7eb);
}

.sz-history-table th {
  font-weight: 600;
  color: var(--sz-primary, #114fa1);
  background: var(--sz-gray-50, #f9fafb);
  white-space: nowrap;
  width: 140px;
}

.sz-history-table td {
  color: var(--sz-text, #333);
  line-height: 1.7;
}

/* 実績チャート */
.sz-performance-items {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin: 24px 0;
}

.sz-performance-item {
  background: var(--sz-white, #fff);
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 12px;
  padding: 24px;
}

.sz-performance-item__header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 16px;
}

.sz-performance-item__label {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-text, #333);
}

.sz-performance-item__value {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--sz-primary, #114fa1);
}

.sz-performance-item__value small {
  font-size: 0.9rem;
  font-weight: 400;
  margin-left: 4px;
}

.sz-performance-item__bar {
  height: 8px;
  background: var(--sz-gray-200, #e5e7eb);
  border-radius: 4px;
  overflow: hidden;
}

.sz-performance-item__bar-fill {
  height: 100%;
  background: linear-gradient(90deg, var(--sz-primary, #114fa1) 0%, #1a5fb8 100%);
  border-radius: 4px;
  transition: width 1s ease-out;
}

/* マージンユーティリティ */
.mt-16 { margin-top: 16px; }
.mt-20 { margin-top: 20px; }
.mt-24 { margin-top: 24px; }
.mt-32 { margin-top: 32px; }
.mb-16 { margin-bottom: 16px; }
.mb-24 { margin-bottom: 24px; }

/* レスポンシブ対応 */
@media (max-width: 768px) {
  .sz-highlight-box {
    flex-direction: column;
    text-align: center;
    padding: 24px;
  }

  .sz-highlight-box__icon {
    margin: 0 auto;
  }

  .sz-grid--2col,
  .sz-grid--3col,
  .sz-grid--4col {
    grid-template-columns: 1fr;
  }

  .sz-info-card {
    padding: 16px 20px;
  }

  .sz-download-box__link {
    padding: 16px 20px;
  }

  .sz-performance-items {
    grid-template-columns: 1fr;
  }

  .sz-history-table th {
    width: 100px;
    padding: 12px 16px;
  }

  .sz-history-table td {
    padding: 12px 16px;
  }
}

/* ================================================================
   院長あいさつページ追加スタイル
   ================================================================ */

/* 挨拶ボックス */
.sz-greeting-box {
  display: flex;
  gap: 40px;
  align-items: flex-start;
  margin-bottom: 32px;
}

.sz-greeting-box__content {
  flex: 1;
}

.sz-greeting-box__side {
  flex: 0 0 280px;
  display: flex;
  flex-direction: column;
  gap: 0;
}

.sz-greeting-box__catchphrase {
  font-size: 1.35rem;
  font-weight: 600;
  color: var(--sz-primary, #114fa1);
  line-height: 1.8;
  margin: 0 0 24px;
  padding-left: 20px;
  border-left: 4px solid var(--sz-primary, #114fa1);
}

.sz-greeting-box__text {
  margin: 0;
}

.sz-greeting-box__text p {
  font-size: 1rem;
  line-height: 2;
  color: var(--sz-text, #333);
  margin: 0 0 16px;
}

.sz-greeting-box__text p:last-child {
  margin-bottom: 0;
}

.sz-greeting-box__signature {
  margin-top: 16px;
  padding: 16px;
  background: var(--sz-gray-50, #f9fafb);
  border-radius: 8px;
}

.sz-greeting-box__hospital {
  font-size: 0.9rem;
  color: var(--sz-text-light, #666);
  margin: 0 0 8px;
}

.sz-greeting-box__position {
  font-size: 1rem;
  color: var(--sz-text, #333);
  margin: 0 0 4px;
}

.sz-greeting-box__name {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--sz-text, #333);
  margin: 0;
}

.sz-greeting-box__kana {
  font-size: 0.85rem;
  color: var(--sz-text-light, #666);
  margin: 4px 0 0;
}

.sz-greeting-box__photo {
  flex: none;
  width: 100%;
}

.sz-greeting-box__photo img {
  width: 100%;
  height: auto;
  border-radius: 12px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
}

/* 理念ハイライト */
.sz-philosophy-highlight {
  background: linear-gradient(135deg, var(--sz-primary, #114fa1) 0%, #1a5fb8 100%);
  color: var(--sz-white, #fff);
  padding: 40px;
  border-radius: 16px;
  text-align: center;
  margin: 20px 0;
}

.sz-philosophy-highlight p {
  font-size: 1.35rem;
  font-weight: 600;
  line-height: 2;
  margin: 0;
}

/* 方針リスト */
.sz-policy-list {
  list-style: none;
  padding: 0;
  margin: 20px 0 0;
}

.sz-policy-list__item {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 16px 0;
  border-bottom: 1px solid var(--sz-gray-200, #e5e7eb);
}

.sz-policy-list__item:last-child {
  border-bottom: none;
}

.sz-policy-list__bullet {
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  background: var(--sz-primary, #114fa1);
  border-radius: 50%;
  margin-top: 10px;
}

.sz-policy-list__text {
  flex: 1;
  font-size: 1rem;
  line-height: 1.8;
  color: var(--sz-text, #333);
}

/* 権利グリッド */
.sz-rights-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 20px;
}

.sz-rights-card {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  padding: 24px;
  background: var(--sz-white, #fff);
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 12px;
  transition: all 0.3s ease;
}

.sz-rights-card:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
}

.sz-rights-card__num {
  flex: 0 0 auto;
  width: 36px;
  height: 36px;
  background: linear-gradient(135deg, var(--sz-primary, #114fa1) 0%, #1a5fb8 100%);
  color: var(--sz-white, #fff);
  font-size: 1.1rem;
  font-weight: 700;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.sz-rights-card__content {
  flex: 1;
}

.sz-rights-card__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-text, #333);
  margin: 0 0 8px;
}

.sz-rights-card__text {
  font-size: 0.9rem;
  line-height: 1.7;
  color: var(--sz-text-light, #666);
  margin: 0;
}

/* アコーディオン */
.sz-accordion {
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 12px;
  overflow: hidden;
  background: var(--sz-white, #fff);
}

.sz-accordion__header {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  padding: 20px 24px;
  background: transparent;
  border: none;
  cursor: pointer;
  text-align: left;
  transition: background 0.3s ease;
}

.sz-accordion__header:hover {
  background: var(--sz-gray-50, #f9fafb);
}

.sz-accordion__bullet {
  width: 8px;
  height: 8px;
  background: var(--sz-primary, #114fa1);
  border-radius: 50%;
}

.sz-accordion__title {
  flex: 1;
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-text, #333);
}

.sz-accordion__icon {
  font-size: 1.5rem;
  color: var(--sz-text-light, #666);
  transition: transform 0.3s ease;
}

.sz-accordion.is-open .sz-accordion__icon {
  transform: rotate(45deg);
}

.sz-accordion__content {
  display: none;
  border-top: 1px solid var(--sz-gray-200, #e5e7eb);
}

.sz-accordion.is-open .sz-accordion__content {
  display: block;
}

.sz-accordion__body {
  padding: 24px;
}

/* 情報テーブル */
.sz-info-table {
  width: 100%;
  border-collapse: collapse;
}

.sz-info-table th,
.sz-info-table td {
  padding: 16px 20px;
  text-align: left;
  border-bottom: 1px solid var(--sz-gray-200, #e5e7eb);
}

.sz-info-table th {
  font-weight: 600;
  color: var(--sz-primary, #114fa1);
  background: var(--sz-gray-50, #f9fafb);
  white-space: nowrap;
  width: 120px;
}

.sz-info-table td {
  color: var(--sz-text, #333);
  line-height: 1.7;
}

.sz-info-table tr:last-child th,
.sz-info-table tr:last-child td {
  border-bottom: none;
}

/* レスポンシブ */
@media (max-width: 992px) {
  .sz-greeting-box {
    flex-direction: column-reverse;
    gap: 24px;
  }

  .sz-greeting-box__side {
    flex: 0 0 auto;
    width: 200px;
    margin: 0 auto;
  }

  .sz-greeting-box__photo {
    flex: 0 0 auto;
    width: 100%;
  }

  .sz-greeting-box__signature {
    text-align: center;
  }

  .sz-greeting-box__catchphrase {
    text-align: center;
    border-left: none;
    padding-left: 0;
    border-bottom: 4px solid var(--sz-primary, #114fa1);
    padding-bottom: 16px;
  }
}

@media (max-width: 768px) {
  .sz-rights-grid {
    grid-template-columns: 1fr;
  }

  .sz-philosophy-highlight {
    padding: 32px 24px;
  }

  .sz-philosophy-highlight p {
    font-size: 1.15rem;
  }

  .sz-greeting-box__name {
    font-size: 1.25rem;
  }
}

/* ================================================================
   Service List - 業務内容リスト（カードスタイル）
   ================================================================ */
.sz-service-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 20px;
}

.sz-service-item {
  background: linear-gradient(135deg, #ffffff 0%, #f8fafc 100%);
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 16px;
  padding: 24px 28px;
  transition: all 0.3s ease;
  position: relative;
  overflow: hidden;
}

.sz-service-item::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 4px;
  background: linear-gradient(90deg, var(--sz-primary, #114fa1) 0%, #3b82f6 100%);
  opacity: 0;
  transition: opacity 0.3s ease;
}

.sz-service-item:hover {
  box-shadow: 0 8px 24px rgba(17, 79, 161, 0.12);
  transform: translateY(-3px);
  border-color: var(--sz-primary-light, #dbeafe);
}

.sz-service-item:hover::before {
  opacity: 1;
}

.sz-service-item__title {
  font-size: 1.1rem;
  font-weight: 700;
  color: var(--sz-primary, #114fa1);
  margin: 0 0 12px;
  line-height: 1.4;
  display: flex;
  align-items: center;
  gap: 8px;
}

.sz-service-item__title::before {
  content: '';
  display: block;
  width: 8px;
  height: 8px;
  background: var(--sz-primary, #114fa1);
  border-radius: 50%;
  flex-shrink: 0;
}

.sz-service-item p {
  margin: 0;
  font-size: 0.9rem;
  line-height: 1.8;
  color: var(--sz-text-light, #666);
}

/* Greeting Style - 挨拶スタイル */
.sz-greeting {
  background: linear-gradient(135deg, #f0f7ff 0%, #e6f0ff 100%);
  border-radius: 16px;
  padding: 32px;
  border-left: 4px solid var(--sz-primary, #114fa1);
}

.sz-greeting__lead {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--sz-primary, #114fa1);
  margin: 0 0 16px;
}

.sz-greeting__name {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-text, #333);
  margin-top: 20px;
  text-align: right;
}

/* Philosophy Style - 理念スタイル */
.sz-philosophy {
  font-size: 1.15rem;
  line-height: 2;
  color: var(--sz-text, #333);
  padding: 24px;
  background: linear-gradient(135deg, #fffbeb 0%, #fef3c7 100%);
  border-radius: 12px;
  border-left: 4px solid var(--sz-orange, #f97316);
  margin: 0;
}

/* List Style - リストスタイル */
.sz-list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.sz-list li {
  padding: 12px 0 12px 28px;
  position: relative;
  border-bottom: 1px dashed var(--sz-gray-200, #e5e7eb);
  line-height: 1.7;
}

.sz-list li:last-child {
  border-bottom: none;
}

.sz-list li::before {
  content: '';
  position: absolute;
  left: 8px;
  top: 20px;
  width: 8px;
  height: 8px;
  background: var(--sz-primary, #114fa1);
  border-radius: 50%;
}

/* Button Style - ボタンスタイル */
.sz-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 14px 28px;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
  border: none;
  cursor: pointer;
}

.sz-btn--primary {
  background: linear-gradient(135deg, var(--sz-primary, #114fa1) 0%, #1a5fb8 100%);
  color: #fff;
  box-shadow: 0 4px 12px rgba(17, 79, 161, 0.25);
}

.sz-btn--primary:hover {
  background: linear-gradient(135deg, #0d3d7a 0%, #114fa1 100%);
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(17, 79, 161, 0.35);
}

.sz-btn .material-symbols-outlined {
  font-size: 1.25rem;
}

@media (max-width: 768px) {
  .sz-service-list {
    grid-template-columns: 1fr;
  }

  .sz-service-item {
    padding: 20px 24px;
  }

  .sz-greeting {
    padding: 24px 20px;
  }

  .sz-greeting__lead {
    font-size: 1.1rem;
  }
}

/* ================================================================
   リードテキスト
   ================================================================ */
.sz-lead-text {
  text-align: center;
  font-size: 0.9375rem;
  line-height: 2;
  color: var(--sz-text);
  margin: 24px 0;
}

.sz-lead-text p {
  margin: 0;
}

/* ================================================================
   ガイドグリッド・ガイドカード
   ================================================================ */
.guide-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.guide-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  padding: 32px 24px;
  background: var(--color-white);
  border: 1px solid var(--sz-border);
  border-radius: 12px;
  text-decoration: none;
  transition: all 0.3s ease;
}

.guide-card:hover {
  border-color: var(--sz-primary);
  box-shadow: 0 8px 24px rgba(17, 79, 161, 0.12);
  transform: translateY(-4px);
}

.guide-card__icon {
  width: 64px;
  height: 64px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--sz-primary);
  border-radius: 50%;
  margin-bottom: 16px;
}

.guide-card__icon .material-symbols-outlined {
  font-size: 2rem;
  color: var(--color-white);
}

.guide-card__content {
  flex: 1;
}

.guide-card__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 0 0 8px;
}

.guide-card__text {
  font-size: 0.8125rem;
  line-height: 1.7;
  color: var(--sz-text-light);
  margin: 0;
}

/* ================================================================
   お問い合わせボックス（外来用）
   ================================================================ */
.contact-box {
  text-align: center;
  padding: 40px;
  background: linear-gradient(135deg, #f5f8fc 0%, #e8f4f8 100%);
  border-radius: 12px;
}

.contact-box__text {
  font-size: 0.9375rem;
  color: var(--sz-text);
  margin: 0 0 20px;
}

.contact-box__tel {
  display: inline-flex;
  align-items: center;
  gap: 12px;
  font-size: 2rem;
  font-weight: 700;
  color: var(--sz-primary);
  text-decoration: none;
  margin-bottom: 12px;
}

.contact-box__tel .material-symbols-outlined {
  font-size: 2.25rem;
}

.contact-box__tel:hover {
  opacity: 0.8;
}

.contact-box__hours {
  font-size: 0.875rem;
  color: var(--sz-text-light);
  margin: 0;
}

/* ================================================================
   情報ボックス（ご注意など）
   ================================================================ */
.sz-info-box {
  display: flex;
  gap: 16px;
  padding: 20px 24px;
  background: #fff9e6;
  border: 1px solid #f5d98e;
  border-radius: 8px;
  margin-top: 24px;
}

.sz-info-box__icon {
  flex-shrink: 0;
}

.sz-info-box__icon .material-symbols-outlined {
  font-size: 1.5rem;
  color: #d4a500;
}

.sz-info-box__content {
  flex: 1;
}

.sz-info-box__title {
  font-size: 0.875rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 0 0 8px;
}

.sz-info-box__content p {
  font-size: 0.875rem;
  line-height: 1.7;
  color: var(--sz-text);
  margin: 0;
}

.sz-info-box__list {
  margin-top: 8px;
  padding-left: 20px;
  list-style: disc;
}

.sz-info-box__list li {
  font-size: 0.875rem;
  line-height: 1.8;
  color: var(--sz-text);
}

/* レスポンシブ */
@media (max-width: 768px) {
  .guide-grid {
    grid-template-columns: 1fr;
  }

  .guide-card {
    flex-direction: row;
    text-align: left;
    padding: 20px;
    gap: 16px;
  }

  .guide-card__icon {
    width: 48px;
    height: 48px;
    margin-bottom: 0;
  }

  .guide-card__icon .material-symbols-outlined {
    font-size: 1.5rem;
  }

  .contact-box {
    padding: 24px;
  }

  .contact-box__tel {
    font-size: 1.5rem;
  }

  .contact-box__tel .material-symbols-outlined {
    font-size: 1.75rem;
  }

  .sz-info-box {
    flex-direction: column;
    gap: 12px;
  }
}

/* ----------------------------------------------------------------
   News List Enhanced - お知らせ一覧（統一デザイン拡張）
   ---------------------------------------------------------------- */
.sz-news-list__link {
  display: block;
  padding: 20px 16px;
  text-decoration: none;
  color: inherit;
  transition: background-color 0.2s ease;
  border-radius: 4px;
}

a.sz-news-list__link:hover {
  background-color: #f8f9fa;
}

.sz-news-list__link--no-link {
  cursor: default;
}

.sz-news-list__meta {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 8px;
  flex-wrap: wrap;
}

.sz-news-list__category {
  display: inline-block;
  padding: 4px 12px;
  font-size: 0.6875rem;
  font-weight: 600;
  border-radius: 3px;
  background: #e0e0e0;
  color: #555;
}

.sz-news-list__category[data-category="emergency"],
.sz-news-list__category[data-category="important"] {
  background: #e74c3c;
  color: #fff;
}

.sz-news-list__category[data-category="notice"],
.sz-news-list__category[data-category="info"] {
  background: var(--sz-primary);
  color: #fff;
}

.sz-news-list__category[data-category="event"] {
  background: #27ae60;
  color: #fff;
}

.sz-news-list__category[data-category="recruit"] {
  background: #f39c12;
  color: #fff;
}

.sz-news-list__pinned {
  color: #e74c3c;
}

.sz-news-list__pinned .material-symbols-outlined {
  font-size: 1rem;
}

.sz-news-list__new {
  display: inline-block;
  margin-left: 8px;
  padding: 2px 8px;
  font-size: 0.625rem;
  font-weight: bold;
  background: #e74c3c;
  color: #fff;
  border-radius: 3px;
  vertical-align: middle;
}

.sz-news-list__empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 60px 20px;
  text-align: center;
  color: #888;
  background: #f9f9f9;
  border-radius: 8px;
}

/* News Category Tabs */
.sz-news-category-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 24px;
}

.sz-news-category-tab {
  display: inline-block;
  padding: 8px 20px;
  background: #f5f5f5;
  border-radius: 25px;
  color: #666;
  text-decoration: none;
  font-size: 0.875rem;
  font-weight: 500;
  transition: all 0.3s ease;
}

.sz-news-category-tab:hover {
  background: var(--sz-primary);
  color: #fff;
}

.sz-news-category-tab.is-active {
  background: var(--sz-primary);
  color: #fff;
}

/* Pagination Enhanced */
.sz-pagination__list {
  display: flex;
  align-items: center;
  gap: 4px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-pagination__link--current {
  background: var(--sz-primary);
  color: #fff;
}

.sz-pagination__link--prev,
.sz-pagination__link--next {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.sz-pagination__text {
  font-size: 0.8125rem;
}

@media (max-width: 768px) {
  .sz-news-list__link {
    padding: 16px 12px;
  }

  .sz-news-list__meta {
    margin-bottom: 6px;
  }

  .sz-news-list__date {
    font-size: 0.8125rem;
  }

  .sz-news-list__title {
    font-size: 0.875rem;
    line-height: 1.5;
  }

  .sz-news-category-tabs {
    gap: 6px;
  }

  .sz-news-category-tab {
    padding: 6px 14px;
    font-size: 0.75rem;
  }

  .sz-pagination__text {
    display: none;
  }
}

/* ----------------------------------------------------------------
   Weekly Schedule Table - 週間診療スケジュール表
   ---------------------------------------------------------------- */
.sz-schedule-table-container {
  overflow-x: auto;
  margin: 24px 0;
  border-radius: 8px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
}

.sz-schedule-table {
  width: 100%;
  min-width: 800px;
  border-collapse: collapse;
  background: #fff;
}

.sz-schedule-table__header {
  background: var(--sz-primary);
  color: #fff;
  padding: 14px 8px;
  text-align: center;
  font-weight: 600;
  font-size: 0.875rem;
  border-right: 1px solid rgba(255, 255, 255, 0.2);
}

.sz-schedule-table__header--time {
  width: 100px;
  background: #2c5f6a;
}

.sz-schedule-table__header--weekend {
  background: #c62828;
}

.sz-schedule-table__time-label {
  background: #f5f5f5;
  padding: 16px 12px;
  text-align: center;
  font-weight: 600;
  border-right: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
}

.sz-schedule-table__period-name {
  display: block;
  font-size: 0.9375rem;
  color: #333;
  margin-bottom: 4px;
}

.sz-schedule-table__time-range {
  display: block;
  font-size: 0.75rem;
  color: #888;
  font-weight: normal;
}

.sz-schedule-table__cell {
  padding: 12px 8px;
  vertical-align: top;
  border-right: 1px solid #e0e0e0;
  border-bottom: 1px solid #e0e0e0;
  min-height: 80px;
}

.sz-schedule-table__cell--weekend {
  background: #fff5f5;
}

.sz-schedule-cell {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sz-schedule-item {
  background: #f8f9fa;
  border-left: 3px solid var(--sz-primary);
  padding: 10px 12px;
  border-radius: 4px;
  font-size: 0.8125rem;
}

.sz-schedule-item__department {
  display: block;
  font-weight: 600;
  color: var(--sz-primary);
  margin-bottom: 4px;
}

.sz-schedule-item__doctor {
  display: block;
  font-size: 0.75rem;
  color: #666;
}

.sz-schedule-item__notes {
  font-size: 0.6875rem;
  color: #888;
  margin: 4px 0 0;
}

.sz-schedule-item__badges {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 6px;
}

.sz-schedule-badge {
  display: inline-block;
  padding: 2px 8px;
  font-size: 0.625rem;
  font-weight: 600;
  border-radius: 3px;
}

.sz-schedule-badge--info {
  background: #e3f2fd;
  color: #1565c0;
}

.sz-schedule-badge--warning {
  background: #fff3e0;
  color: #e65100;
}

.sz-schedule-empty {
  display: block;
  text-align: center;
  color: #ccc;
  font-size: 1.125rem;
}

.sz-schedule-filter-select {
  padding: 10px 16px;
  font-size: 0.875rem;
  border: 1px solid #ddd;
  border-radius: 6px;
  background: #fff;
  min-width: 200px;
  cursor: pointer;
}

.sz-schedule-filter-select:focus {
  outline: none;
  border-color: var(--sz-primary);
  box-shadow: 0 0 0 3px rgba(58, 127, 140, 0.1);
}

@media (max-width: 768px) {
  .sz-schedule-table-container {
    margin: 16px -16px;
    border-radius: 0;
  }

  .sz-schedule-table {
    min-width: 600px;
  }

  .sz-schedule-table__header {
    padding: 10px 6px;
    font-size: 0.75rem;
  }

  .sz-schedule-table__time-label {
    padding: 12px 8px;
  }

  .sz-schedule-table__period-name {
    font-size: 0.8125rem;
  }

  .sz-schedule-table__time-range {
    font-size: 0.625rem;
  }

  .sz-schedule-table__cell {
    padding: 8px 6px;
  }

  .sz-schedule-item {
    padding: 8px;
    font-size: 0.6875rem;
  }

  .sz-schedule-item__department {
    font-size: 0.6875rem;
  }

  .sz-schedule-item__doctor {
    font-size: 0.625rem;
  }

  .sz-schedule-filter-select {
    width: 100%;
  }
}

/* ----------------------------------------------------------------
   Checkup Tabs - 健診コースタブ
   ---------------------------------------------------------------- */
.sz-checkup-tabs {
  display: flex;
  gap: 8px;
  margin-bottom: 24px;
  border-bottom: 2px solid #e0e0e0;
  overflow-x: auto;
  flex-wrap: nowrap;
  padding-bottom: 8px;
}

.sz-checkup-tab {
  padding: 12px 24px;
  background: transparent;
  border: none;
  border-bottom: 3px solid transparent;
  font-size: 0.9375rem;
  font-weight: 600;
  color: #666;
  cursor: pointer;
  white-space: nowrap;
  transition: all 0.2s ease;
  position: relative;
  bottom: -2px;
}

.sz-checkup-tab:hover {
  color: var(--sz-primary);
  background: #f5f5f5;
}

.sz-checkup-tab--active {
  color: var(--sz-primary);
  border-bottom-color: var(--sz-primary);
}

.sz-checkup-panel {
  display: none;
  animation: fadeIn 0.3s ease;
}

.sz-checkup-panel--active {
  display: block;
}

.sz-checkup-gender {
  display: inline-block;
  padding: 3px 10px;
  border-radius: 4px;
  font-weight: 600;
}

.sz-checkup-gender--male {
  background: #e3f2fd;
  color: #1565c0;
}

.sz-checkup-gender--female {
  background: #fce4ec;
  color: #c2185b;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 768px) {
  .sz-checkup-tabs {
    gap: 4px;
    margin-bottom: 16px;
    padding-bottom: 4px;
  }

  .sz-checkup-tab {
    padding: 10px 16px;
    font-size: 0.8125rem;
  }
}

/* ================================================================
   sz-course-meta - 健診コース詳細メタ情報
   ================================================================ */
.sz-course-meta {
  display: flex;
  gap: 16px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.sz-course-meta__item {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.875rem;
  color: #666;
}

.sz-course-meta__item .material-symbols-outlined {
  font-size: 1.125rem;
}

.sz-course-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-top: 16px;
  border-top: 1px solid #e0e0e0;
}

.sz-course-price {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--sz-primary, #00838f);
}

.sz-course-price__tax {
  font-size: 0.875rem;
  font-weight: normal;
  margin-left: 4px;
}

/* ================================================================
   sz-button - 統一ボタンスタイル
   ================================================================ */
.sz-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 14px 28px;
  border-radius: 8px;
  font-size: 1rem;
  font-weight: 600;
  text-decoration: none;
  transition: all 0.3s ease;
  border: none;
  cursor: pointer;
}

.sz-button .material-symbols-outlined {
  font-size: 1.25rem;
}

/* Primary (Teal/Green) */
.sz-button--primary {
  background: linear-gradient(135deg, var(--color-primary, #00838f) 0%, var(--color-primary-light, #4fb3bf) 100%);
  color: #fff;
  box-shadow: 0 4px 12px rgba(0, 131, 143, 0.25);
}

.sz-button--primary:hover {
  background: linear-gradient(135deg, var(--color-primary-dark, #006064) 0%, var(--color-primary, #00838f) 100%);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(0, 131, 143, 0.35);
}

/* Orange */
.sz-button--orange {
  background: linear-gradient(135deg, var(--color-secondary, #ff6f00) 0%, #ff9800 100%);
  color: #fff;
  box-shadow: 0 4px 12px rgba(255, 111, 0, 0.25);
}

.sz-button--orange:hover {
  background: linear-gradient(135deg, #e65100 0%, var(--color-secondary, #ff6f00) 100%);
  color: #fff;
  transform: translateY(-2px);
  box-shadow: 0 6px 16px rgba(255, 111, 0, 0.35);
}

/* Outline */
.sz-button--outline {
  background: transparent;
  color: var(--color-primary, #00838f);
  border: 2px solid var(--color-primary, #00838f);
}

.sz-button--outline:hover {
  background: var(--color-primary, #00838f);
  color: #fff;
  transform: translateY(-2px);
}

/* Large Size */
.sz-button--large {
  padding: 16px 36px;
  font-size: 1.1rem;
}

.sz-button--large .material-symbols-outlined {
  font-size: 1.5rem;
}

@media (max-width: 768px) {
  .sz-button {
    padding: 12px 20px;
    font-size: 0.95rem;
  }

  .sz-button--large {
    padding: 14px 28px;
    font-size: 1rem;
    width: 100%;
  }
}

/* ================================================================
   sz-contact-box - 連絡先ボックス（予約ページ用）
   ================================================================ */
.sz-contact-box__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  padding: 24px;
  background: linear-gradient(135deg, var(--color-gray-100, #f5f5f5) 0%, var(--color-gray-50, #fafafa) 100%);
  border-radius: 12px;
  text-align: center;
}

.sz-contact-box__title {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--color-gray-700, #616161);
  margin: 0;
}

.sz-contact-box__tel {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1.5rem;
  font-weight: 700;
  margin: 0;
}

.sz-contact-box__tel .material-symbols-outlined {
  font-size: 1.75rem;
  color: var(--color-primary, #00838f);
}

.sz-contact-box__tel a {
  color: var(--color-primary, #00838f);
  text-decoration: none;
}

.sz-contact-box__tel a:hover {
  text-decoration: underline;
}

.sz-contact-box__note {
  font-size: 0.85rem;
  color: var(--color-gray-600, #757575);
  margin: 0;
}

/* ================================================================
   sz-document - 資料ダウンロードカード
   ================================================================ */
.sz-document-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 20px;
}

.sz-document-card {
  display: flex;
  flex-direction: column;
  gap: 16px;
  padding: 24px;
  background: #fff;
  border: 1px solid var(--color-gray-200, #e0e0e0);
  border-radius: 12px;
  transition: box-shadow 0.2s ease, transform 0.2s ease;
}

.sz-document-card:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.1);
  transform: translateY(-2px);
}

.sz-document-card__icon {
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #e8f4f8 0%, #f5f9fc 100%);
  border-radius: 12px;
  flex-shrink: 0;
}

.sz-document-card__icon .material-symbols-outlined {
  font-size: 1.75rem;
  color: var(--sz-primary, #00838f);
}

.sz-document-card__content {
  flex: 1;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sz-document-card__title {
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--color-gray-900, #212121);
  margin: 0;
}

.sz-document-card__text {
  font-size: 0.9rem;
  color: var(--color-gray-600, #757575);
  line-height: 1.6;
  margin: 0;
}

.sz-document-card__meta {
  display: flex;
  gap: 12px;
  align-items: center;
  margin-top: auto;
}

.sz-document-card__format {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  background: #ef5350;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: 4px;
  text-transform: uppercase;
}

.sz-document-card__size {
  font-size: 0.85rem;
  color: var(--color-gray-500, #9e9e9e);
}

.sz-document-card__btn {
  align-self: flex-start;
}

@media (max-width: 768px) {
  .sz-document-grid {
    grid-template-columns: 1fr;
  }

  .sz-document-card {
    padding: 20px;
  }

  .sz-document-card__btn {
    align-self: stretch;
    text-align: center;
    justify-content: center;
  }
}
/* ================================================================
   健診コース用コンポーネント
   ================================================================ */

/* コース情報フッター */
.sz-course-info-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 16px;
  padding-top: 16px;
  border-top: 1px solid #e0e0e0;
}

.sz-course-price {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--sz-primary, #1976d2);
}

.sz-course-price--large {
  font-size: 1.5rem;
}

.sz-course-duration {
  font-size: 0.875rem;
  color: #666;
  display: flex;
  align-items: center;
  gap: 4px;
}

.sz-course-duration .material-symbols-outlined {
  font-size: 1.125rem;
  vertical-align: middle;
}

/* インフォボックスの企業向けスタイル */
.sz-info-box--company {
  margin-bottom: 24px;
  border-left: 4px solid #1976d2;
}

.sz-info-box__icon {
  vertical-align: middle;
  margin-right: 8px;
}

/* オプション検査用 */
.sz-option-notice {
  margin-bottom: 20px;
  padding: 12px 16px;
  background: #f5f5f5;
  border-radius: 6px;
  font-size: 0.875rem;
}

.sz-option-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 12px;
}

.sz-option-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 16px;
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 8px;
}

.sz-option-item__name {
  font-weight: 600;
}

.sz-option-item__price {
  color: var(--sz-primary, #1976d2);
  font-weight: 700;
}

/* 説明文下部マージン */
.sz-accordion__description {
  margin-bottom: 16px;
}

/* チェックリスト下部マージン */
.sz-checklist--mb {
  margin-bottom: 16px;
}

/* アコーダイオンアイコンの色指定 */
.sz-accordion__title-icon {
  margin-right: 8px;
}

.sz-accordion__title-icon--pink {
  color: #e91e63;
}

/* アクションエリア */
.sz-course-actions {
  margin-top: 16px;
}

/* content-box下部マージン */
.sz-content-box--mb {
  margin-bottom: 16px;
}

/* 空メッセージ */
.sz-empty-message {
  text-align: center;
  color: #888;
}

/* テキストセンター */
.sz-text-center {
  text-align: center;
}

/* 上マージンユーティリティ */
.sz-mt-24 {
  margin-top: 24px;
}

/* アコーディオンコンテンツの最大高さ（開いた状態） */
.sz-accordion__content--open {
  max-height: 500px;
}

/* 性別バッジ */
.sz-checkup-gender {
  margin-left: 12px;
  font-size: 0.75rem;
  font-weight: 500;
}

/* アコーディオンアイコン（タイトル横） */
.sz-accordion__title-icon {
  margin-right: 8px;
}

.sz-accordion__title-icon--primary {
  color: var(--sz-primary, #1976d2);
}

@media (max-width: 768px) {
  .sz-option-grid {
    grid-template-columns: 1fr;
  }

  .sz-course-info-row {
    flex-direction: column;
    gap: 12px;
    align-items: flex-start;
  }
}
/* ================================================================
   病院広報誌用コンポーネント
   ================================================================ */

/* 広報誌グリッド */
.sz-publication-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 24px;
}

.sz-publication-grid--featured {
  grid-template-columns: repeat(3, 1fr);
}

/* 広報誌カード */
.sz-publication-card {
  background: var(--sz-white, #fff);
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 12px;
  overflow: hidden;
  transition: all 0.3s ease;
}

.sz-publication-card:hover {
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  transform: translateY(-4px);
}

.sz-publication-card--featured {
  border-color: var(--sz-orange, #f59e0b);
  border-width: 2px;
}

.sz-publication-card__link {
  display: block;
  text-decoration: none;
  color: inherit;
}

.sz-publication-card__image {
  position: relative;
  aspect-ratio: 3 / 4;
  background: var(--sz-gray-100, #f3f4f6);
  overflow: hidden;
}

.sz-publication-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.sz-publication-card:hover .sz-publication-card__image img {
  transform: scale(1.05);
}

.sz-publication-card__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, var(--sz-gray-100) 0%, var(--sz-gray-200) 100%);
}

.sz-publication-card__placeholder .material-symbols-outlined {
  font-size: 3rem;
  color: var(--sz-gray-400, #9ca3af);
}

.sz-publication-card__badge {
  position: absolute;
  top: 12px;
  left: 12px;
  padding: 4px 12px;
  background: var(--sz-primary, #1976d2);
  color: #fff;
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: 4px;
}

.sz-publication-card__file-type {
  position: absolute;
  bottom: 12px;
  right: 12px;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  background: #ef5350;
  color: #fff;
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: 4px;
}

.sz-publication-card__file-type .material-symbols-outlined {
  font-size: 1rem;
}

.sz-publication-card__file-type--external {
  background: #1976d2;
}

.sz-publication-card__body {
  padding: 16px;
}

.sz-publication-card__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-text, #333);
  margin: 0 0 8px;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.sz-publication-card__volume {
  display: inline-block;
  padding: 2px 8px;
  background: var(--sz-gray-100, #f3f4f6);
  color: var(--sz-gray-600, #4b5563);
  font-size: 0.75rem;
  border-radius: 4px;
  margin-bottom: 8px;
}

.sz-publication-card__date {
  display: block;
  font-size: 0.85rem;
  color: var(--sz-gray-500, #6b7280);
}

/* 広報誌詳細 */
.sz-publication-detail__meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 12px;
  margin-bottom: 24px;
}

.sz-publication-detail__type {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 14px;
  background: var(--sz-primary, #1976d2);
  color: #fff;
  font-size: 0.875rem;
  font-weight: 600;
  border-radius: 6px;
}

.sz-publication-detail__type .material-symbols-outlined {
  font-size: 1.125rem;
}

.sz-publication-detail__volume {
  padding: 4px 12px;
  background: var(--sz-gray-100, #f3f4f6);
  color: var(--sz-gray-700, #374151);
  font-size: 0.875rem;
  font-weight: 500;
  border-radius: 4px;
}

.sz-publication-detail__date {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--sz-gray-600, #4b5563);
  font-size: 0.875rem;
}

.sz-publication-detail__date .material-symbols-outlined {
  font-size: 1.125rem;
}

.sz-publication-detail__body {
  display: flex;
  gap: 32px;
  margin-top: 24px;
}

.sz-publication-detail__thumbnail {
  flex-shrink: 0;
  width: 200px;
}

.sz-publication-detail__thumbnail img {
  width: 100%;
  height: auto;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* 広報誌掲載内容 */
.sz-publication-contents__page {
  display: inline-block;
  margin-left: 12px;
  padding: 2px 8px;
  background: var(--sz-gray-100, #f3f4f6);
  color: var(--sz-gray-600, #4b5563);
  font-size: 0.75rem;
  font-weight: 500;
  border-radius: 4px;
}

.sz-publication-contents__image {
  margin-bottom: 16px;
}

.sz-publication-contents__image img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
}

/* ページネーション */
.sz-pagination {
  margin-top: 40px;
}

.sz-pagination__list {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 8px;
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-pagination__link {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 8px 16px;
  background: var(--sz-white, #fff);
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 6px;
  color: var(--sz-text, #333);
  font-size: 0.875rem;
  text-decoration: none;
  transition: all 0.2s ease;
}

.sz-pagination__link:hover {
  background: var(--sz-gray-50, #f9fafb);
  border-color: var(--sz-primary, #1976d2);
  color: var(--sz-primary, #1976d2);
}

.sz-pagination__link--current {
  background: var(--sz-primary, #1976d2);
  border-color: var(--sz-primary, #1976d2);
  color: #fff;
  pointer-events: none;
}

.sz-pagination__link .material-symbols-outlined {
  font-size: 1.125rem;
}

/* レスポンシブ */
@media (max-width: 992px) {
  .sz-publication-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }

  .sz-publication-detail__body {
    flex-direction: column;
  }

  .sz-publication-detail__thumbnail {
    width: 150px;
    margin: 0 auto;
  }
}

@media (max-width: 576px) {
  .sz-publication-grid {
    grid-template-columns: 1fr;
  }

  .sz-publication-card__image {
    aspect-ratio: 4 / 3;
  }

  .sz-pagination__link {
    padding: 6px 12px;
    font-size: 0.8rem;
  }
}

/* ==================================================================
   DONATIONS - ご寄付のお願いページ用スタイル
   ================================================================== */

/* キャンペーングリッド */
.sz-donation-campaign-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 24px;
}

/* キャンペーンカード */
.sz-donation-campaign-card {
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 2px 12px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.sz-donation-campaign-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
}

.sz-donation-campaign-card--featured {
  border: 2px solid var(--sz-primary, #1976d2);
}

.sz-donation-campaign-card__image {
  aspect-ratio: 16 / 9;
  overflow: hidden;
  background: var(--sz-gray-100, #f3f4f6);
}

.sz-donation-campaign-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s ease;
}

.sz-donation-campaign-card:hover .sz-donation-campaign-card__image img {
  transform: scale(1.05);
}

.sz-donation-campaign-card__image--placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
}

.sz-donation-campaign-card__image--placeholder .material-symbols-outlined {
  font-size: 4rem;
  color: var(--sz-gray-300, #d1d5db);
}

.sz-donation-campaign-card__body {
  padding: 20px;
}

.sz-donation-campaign-card__type {
  display: inline-block;
  background: var(--sz-primary-light, #e3f2fd);
  color: var(--sz-primary, #1976d2);
  font-size: 0.75rem;
  font-weight: 600;
  padding: 4px 10px;
  border-radius: 20px;
  margin-bottom: 12px;
}

.sz-donation-campaign-card__title {
  font-size: 1.125rem;
  font-weight: 700;
  color: var(--sz-gray-900, #111827);
  margin: 0 0 10px;
  line-height: 1.4;
}

.sz-donation-campaign-card__description {
  font-size: 0.875rem;
  color: var(--sz-gray-600, #4b5563);
  line-height: 1.6;
  margin: 0 0 16px;
}

/* 寄付プログレスバー */
.sz-donation-progress {
  margin-bottom: 16px;
}

.sz-donation-progress__bar {
  height: 8px;
  background: var(--sz-gray-200, #e5e7eb);
  border-radius: 4px;
  overflow: hidden;
}

.sz-donation-progress__fill {
  height: 100%;
  background: linear-gradient(90deg, var(--sz-primary, #1976d2), var(--sz-primary-dark, #1565c0));
  border-radius: 4px;
  transition: width 0.5s ease;
}

.sz-donation-progress__info {
  display: flex;
  justify-content: space-between;
  margin-top: 8px;
  font-size: 0.8rem;
  color: var(--sz-gray-600, #4b5563);
}

.sz-donation-progress__percentage {
  font-weight: 600;
  color: var(--sz-primary, #1976d2);
}

/* 寄付金使途グリッド */
.sz-donation-usage-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
  gap: 20px;
}

.sz-donation-usage-card {
  background: #fff;
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 12px;
  padding: 24px;
  text-align: center;
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.sz-donation-usage-card:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.08);
  border-color: var(--sz-primary, #1976d2);
}

.sz-donation-usage-card__icon {
  width: 60px;
  height: 60px;
  background: var(--sz-primary-light, #e3f2fd);
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto 16px;
}

.sz-donation-usage-card__icon .material-symbols-outlined {
  font-size: 1.75rem;
  color: var(--sz-primary, #1976d2);
}

.sz-donation-usage-card__title {
  font-size: 1rem;
  font-weight: 700;
  color: var(--sz-gray-900, #111827);
  margin: 0 0 10px;
}

.sz-donation-usage-card__text {
  font-size: 0.875rem;
  color: var(--sz-gray-600, #4b5563);
  line-height: 1.6;
  margin: 0;
}

/* 寄付方法グリッド */
.sz-donation-method-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap: 24px;
}

.sz-donation-method-card {
  background: #fff;
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 12px;
  overflow: hidden;
}

.sz-donation-method-card__header {
  background: linear-gradient(135deg, var(--sz-primary, #1976d2), var(--sz-primary-dark, #1565c0));
  color: #fff;
  padding: 16px 20px;
  display: flex;
  align-items: center;
  gap: 12px;
}

.sz-donation-method-card__icon {
  font-size: 1.75rem;
}

.sz-donation-method-card__title {
  font-size: 1.125rem;
  font-weight: 700;
  margin: 0;
}

.sz-donation-method-card__body {
  padding: 24px;
}

.sz-donation-method-card__body > p {
  margin: 0 0 16px;
  color: var(--sz-gray-700, #374151);
  line-height: 1.6;
}

/* 銀行振込情報 */
.sz-donation-bank-info {
  background: var(--sz-gray-50, #f9fafb);
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 8px;
  padding: 16px;
  margin-bottom: 20px;
}

.sz-donation-bank-info__title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--sz-gray-900, #111827);
  margin: 0 0 12px;
}

.sz-donation-bank-info__title .material-symbols-outlined {
  font-size: 1.25rem;
  color: var(--sz-primary, #1976d2);
}

.sz-donation-bank-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.875rem;
}

.sz-donation-bank-table th,
.sz-donation-bank-table td {
  padding: 8px 12px;
  border-bottom: 1px solid var(--sz-gray-200, #e5e7eb);
  text-align: left;
}

.sz-donation-bank-table th {
  width: 100px;
  background: var(--sz-gray-100, #f3f4f6);
  font-weight: 600;
  color: var(--sz-gray-700, #374151);
}

.sz-donation-bank-table td {
  color: var(--sz-gray-900, #111827);
}

.sz-donation-bank-table tr:last-child th,
.sz-donation-bank-table tr:last-child td {
  border-bottom: none;
}

/* ウィッシュリスト（物品寄付） */
.sz-donation-wishlist {
  background: #fff8e1;
  border: 1px solid #ffe082;
  border-radius: 8px;
  padding: 16px;
  margin-bottom: 20px;
}

.sz-donation-wishlist__title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.9rem;
  font-weight: 600;
  color: #f57c00;
  margin: 0 0 12px;
}

.sz-donation-wishlist__title .material-symbols-outlined {
  font-size: 1.25rem;
}

.sz-donation-wishlist__list {
  margin: 0;
  padding: 0;
  list-style: none;
}

.sz-donation-wishlist__list li {
  padding: 6px 0 6px 24px;
  color: var(--sz-gray-700, #374151);
  font-size: 0.875rem;
  position: relative;
}

.sz-donation-wishlist__list li::before {
  content: "●";
  position: absolute;
  left: 0;
  color: #f57c00;
  font-size: 0.6rem;
  line-height: 2;
}

/* ボタンスタイル */
.sz-btn--block {
  display: flex;
  width: 100%;
  justify-content: center;
}

.sz-btn--lg {
  padding: 14px 28px;
  font-size: 1rem;
}

.sz-btn--secondary {
  background: var(--sz-gray-600, #4b5563);
  color: #fff;
}

.sz-btn--secondary:hover {
  background: var(--sz-gray-700, #374151);
}

/* お問い合わせボックス */
.sz-contact-box {
  background: linear-gradient(135deg, #f8fafc, #f1f5f9);
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 12px;
  padding: 32px;
  text-align: center;
}

.sz-contact-box__text {
  margin: 0 0 20px;
  color: var(--sz-gray-700, #374151);
}

.sz-contact-box__info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
}

.sz-contact-box__dept,
.sz-contact-box__hours {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.9rem;
  color: var(--sz-gray-600, #4b5563);
  margin: 0;
}

.sz-contact-box__dept .material-symbols-outlined,
.sz-contact-box__hours .material-symbols-outlined {
  font-size: 1.125rem;
}

.sz-contact-box__tel {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--sz-primary, #1976d2);
  margin: 8px 0;
}

.sz-contact-box__tel .material-symbols-outlined {
  font-size: 1.5rem;
}

.sz-contact-box__tel a {
  color: inherit;
  text-decoration: none;
}

.sz-contact-box__tel a:hover {
  text-decoration: underline;
}

/* コンテンツボックス センタリング */
.sz-content-box__body--centered {
  text-align: center;
}

.sz-content-box__body--centered p {
  margin-bottom: 16px;
}

/* レスポンシブ - 寄付ページ */
@media (max-width: 992px) {
  .sz-donation-campaign-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .sz-donation-usage-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .sz-donation-method-grid {
    grid-template-columns: 1fr;
  }
}

@media (max-width: 576px) {
  .sz-donation-campaign-grid {
    grid-template-columns: 1fr;
  }

  .sz-donation-usage-grid {
    grid-template-columns: 1fr;
  }

  .sz-donation-usage-card {
    padding: 20px;
  }

  .sz-donation-method-card__body {
    padding: 16px;
  }

  .sz-donation-bank-table th {
    width: 80px;
    font-size: 0.8rem;
  }

  .sz-donation-bank-table td {
    font-size: 0.8rem;
  }

  .sz-contact-box {
    padding: 24px 16px;
  }

  .sz-contact-box__tel {
    font-size: 1.25rem;
  }
}

/* =====================================================
   学会・研修・研究発表ページ (Research Page)
   ===================================================== */

/* カテゴリーグリッド */
.sz-research-category-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 16px;
  margin-bottom: 32px;
}

.sz-research-category-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 24px 16px;
  background: var(--sz-white, #fff);
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  text-decoration: none;
  color: inherit;
  transition: transform 0.2s, box-shadow 0.2s;
}

.sz-research-category-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.sz-research-category-card__icon {
  font-size: 2.5rem;
  margin-bottom: 12px;
}

.sz-research-category-card__name {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-gray-800, #1f2937);
  margin-bottom: 4px;
}

.sz-research-category-card__count {
  font-size: 0.85rem;
  color: var(--sz-gray-500, #6b7280);
}

/* 研究発表グリッド */
.sz-research-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 24px;
}

.sz-research-grid--featured {
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
}

/* 研究発表カード */
.sz-research-card {
  background: var(--sz-white, #fff);
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  overflow: hidden;
  transition: transform 0.2s, box-shadow 0.2s;
}

.sz-research-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.sz-research-card--featured {
  grid-column: span 2;
}

@media (max-width: 768px) {
  .sz-research-card--featured {
    grid-column: span 1;
  }
}

.sz-research-card__link {
  display: block;
  text-decoration: none;
  color: inherit;
}

.sz-research-card__image-wrapper {
  position: relative;
  aspect-ratio: 16 / 9;
  background: var(--sz-gray-100, #f3f4f6);
  overflow: hidden;
}

.sz-research-card__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.3s;
}

.sz-research-card:hover .sz-research-card__image {
  transform: scale(1.05);
}

.sz-research-card__placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  background: linear-gradient(135deg, var(--sz-primary-light, #e3f2fd) 0%, var(--sz-gray-100, #f3f4f6) 100%);
  color: var(--sz-primary, #1976d2);
  font-size: 3rem;
}

.sz-research-card__badge {
  position: absolute;
  top: 12px;
  left: 12px;
  padding: 4px 12px;
  background: var(--sz-primary, #1976d2);
  color: var(--sz-white, #fff);
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: 20px;
}

.sz-research-card__body {
  padding: 16px;
}

.sz-research-card__category {
  display: inline-block;
  padding: 2px 8px;
  background: var(--sz-primary-light, #e3f2fd);
  color: var(--sz-primary, #1976d2);
  font-size: 0.75rem;
  font-weight: 500;
  border-radius: 4px;
  margin-bottom: 8px;
}

.sz-research-card__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-gray-800, #1f2937);
  margin: 0 0 8px;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.sz-research-card__event {
  font-size: 0.85rem;
  color: var(--sz-gray-600, #4b5563);
  margin: 0 0 8px;
}

.sz-research-card__date {
  font-size: 0.8rem;
  color: var(--sz-gray-500, #6b7280);
}

/* フィルター */
.sz-research-filter {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 24px;
}

.sz-research-filter__tag {
  display: inline-flex;
  align-items: center;
  padding: 6px 14px;
  background: var(--sz-gray-100, #f3f4f6);
  color: var(--sz-gray-700, #374151);
  font-size: 0.85rem;
  font-weight: 500;
  border-radius: 20px;
  text-decoration: none;
  transition: background 0.2s, color 0.2s;
}

.sz-research-filter__tag:hover {
  background: var(--sz-gray-200, #e5e7eb);
}

.sz-research-filter__tag--active {
  background: var(--sz-primary, #1976d2);
  color: var(--sz-white, #fff);
}

.sz-research-filter__tag--active:hover {
  background: var(--sz-primary-dark, #1565c0);
  color: var(--sz-white, #fff);
}

/* 学会・カンファレンスグリッド */
.sz-research-conference-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  gap: 20px;
}

.sz-research-conference-card {
  display: block;
  padding: 20px;
  background: var(--sz-white, #fff);
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  text-decoration: none;
  color: inherit;
  transition: transform 0.2s, box-shadow 0.2s;
}

.sz-research-conference-card:hover {
  transform: translateY(-4px);
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.sz-research-conference-card__header {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 12px;
}

.sz-research-conference-card__icon {
  font-size: 1.75rem;
}

.sz-research-conference-card__date {
  font-size: 0.85rem;
  color: var(--sz-gray-600, #4b5563);
}

.sz-research-conference-card__name {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-gray-800, #1f2937);
  margin: 0 0 8px;
}

.sz-research-conference-card__venue {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 0.85rem;
  color: var(--sz-gray-600, #4b5563);
}

/* 研究発表詳細ページ */
.sz-research-detail {
  max-width: 100%;
}

.sz-research-detail__header {
  margin-bottom: 32px;
  padding-bottom: 24px;
  border-bottom: 1px solid var(--sz-gray-200, #e5e7eb);
}

.sz-research-detail__category {
  display: inline-block;
  padding: 4px 12px;
  background: var(--sz-primary-light, #e3f2fd);
  color: var(--sz-primary, #1976d2);
  font-size: 0.85rem;
  font-weight: 500;
  border-radius: 4px;
  margin-bottom: 8px;
}

.sz-research-detail__date {
  display: block;
  font-size: 0.9rem;
  color: var(--sz-gray-600, #4b5563);
  margin-bottom: 12px;
}

.sz-research-detail__title {
  font-size: 1.75rem;
  font-weight: 700;
  color: var(--sz-gray-900, #111827);
  line-height: 1.4;
  margin: 0 0 12px;
}

.sz-research-detail__event {
  font-size: 1rem;
  color: var(--sz-gray-600, #4b5563);
  margin: 0;
}

/* 発表者 */
.sz-research-detail__presenters {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}

.sz-research-detail__presenter {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 16px;
  background: var(--sz-gray-50, #f9fafb);
  border-radius: 8px;
}

.sz-research-detail__presenter-photo {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  object-fit: cover;
}

.sz-research-detail__presenter-placeholder {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: var(--sz-primary-light, #e3f2fd);
  color: var(--sz-primary, #1976d2);
  font-size: 1.25rem;
  font-weight: 600;
}

.sz-research-detail__presenter-info {
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.sz-research-detail__presenter-name {
  font-size: 0.95rem;
  font-weight: 600;
  color: var(--sz-gray-800, #1f2937);
}

.sz-research-detail__presenter-dept {
  font-size: 0.8rem;
  color: var(--sz-gray-600, #4b5563);
}

/* 概要 */
.sz-research-detail__summary {
  font-size: 1rem;
  line-height: 1.8;
  color: var(--sz-gray-700, #374151);
  margin: 0;
}

/* 本文コンテンツ */
.sz-research-detail__content {
  font-size: 1rem;
  line-height: 1.8;
  color: var(--sz-gray-700, #374151);
}

.sz-research-detail__content h2 {
  font-size: 1.5rem;
  font-weight: 700;
  color: var(--sz-gray-900, #111827);
  margin: 32px 0 16px;
}

.sz-research-detail__content h3 {
  font-size: 1.25rem;
  font-weight: 600;
  color: var(--sz-gray-800, #1f2937);
  margin: 24px 0 12px;
}

.sz-research-detail__content p {
  margin: 0 0 16px;
}

.sz-research-detail__content ul,
.sz-research-detail__content ol {
  margin: 0 0 16px;
  padding-left: 24px;
}

.sz-research-detail__content li {
  margin-bottom: 8px;
}

.sz-research-detail__content img {
  max-width: 100%;
  height: auto;
  border-radius: 8px;
  margin: 16px 0;
}

/* 動画セクション */
.sz-research-detail__video {
  margin: 0;
}

.sz-research-detail__video-embed {
  position: relative;
  padding-bottom: 56.25%;
  height: 0;
  overflow: hidden;
  border-radius: 12px;
}

.sz-research-detail__video-embed iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.sz-research-detail__video-player {
  width: 100%;
  border-radius: 12px;
}

/* PDF資料 */
.sz-research-detail__pdf {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 20px;
  background: var(--sz-gray-50, #f9fafb);
  border-radius: 8px;
}

.sz-research-detail__pdf-icon {
  color: var(--sz-error, #d32f2f);
}

.sz-research-detail__pdf-info {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.sz-research-detail__pdf-name {
  font-size: 0.9rem;
  color: var(--sz-gray-700, #374151);
}

/* タグ */
.sz-research-detail__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.sz-tag {
  display: inline-flex;
  align-items: center;
  padding: 4px 12px;
  background: var(--sz-gray-100, #f3f4f6);
  color: var(--sz-gray-700, #374151);
  font-size: 0.85rem;
  border-radius: 20px;
  text-decoration: none;
  transition: background 0.2s;
}

.sz-tag:hover {
  background: var(--sz-gray-200, #e5e7eb);
}

.sz-tag__icon {
  margin-right: 4px;
  color: var(--sz-primary, #1976d2);
}

/* 前後ナビゲーション */
.sz-research-detail__nav {
  display: flex;
  justify-content: space-between;
  gap: 16px;
  margin-top: 40px;
  padding-top: 24px;
  border-top: 1px solid var(--sz-gray-200, #e5e7eb);
}

.sz-research-detail__nav-link {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 16px;
  background: var(--sz-white, #fff);
  border: 1px solid var(--sz-gray-200, #e5e7eb);
  border-radius: 8px;
  text-decoration: none;
  color: inherit;
  transition: border-color 0.2s, box-shadow 0.2s;
  max-width: 48%;
}

.sz-research-detail__nav-link:hover {
  border-color: var(--sz-primary, #1976d2);
  box-shadow: 0 2px 8px rgba(25, 118, 210, 0.15);
}

.sz-research-detail__nav-link--next {
  margin-left: auto;
  text-align: right;
}

.sz-research-detail__nav-arrow {
  font-size: 1.25rem;
  color: var(--sz-primary, #1976d2);
}

.sz-research-detail__nav-content {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.sz-research-detail__nav-label {
  font-size: 0.8rem;
  color: var(--sz-gray-500, #6b7280);
}

.sz-research-detail__nav-title {
  font-size: 0.9rem;
  font-weight: 500;
  color: var(--sz-gray-800, #1f2937);
}

.sz-research-detail__nav-placeholder {
  flex: 1;
}

/* サイドバーカード */
.sz-sidebar-card {
  background: var(--sz-white, #fff);
  border-radius: 12px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  padding: 20px;
  margin-bottom: 20px;
}

.sz-sidebar-card__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-gray-800, #1f2937);
  margin: 0 0 16px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--sz-primary, #1976d2);
}

.sz-sidebar-card__list {
  margin: 0;
}

.sz-sidebar-card__item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding: 8px 0;
  border-bottom: 1px solid var(--sz-gray-100, #f3f4f6);
}

.sz-sidebar-card__item:last-child {
  border-bottom: none;
  padding-bottom: 0;
}

.sz-sidebar-card__label {
  font-size: 0.8rem;
  font-weight: 500;
  color: var(--sz-gray-500, #6b7280);
}

.sz-sidebar-card__value {
  font-size: 0.9rem;
  color: var(--sz-gray-800, #1f2937);
  margin: 0;
}

.sz-sidebar-card__links {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sz-sidebar-card__links li {
  margin-bottom: 8px;
}

.sz-sidebar-card__links li:last-child {
  margin-bottom: 0;
}

.sz-sidebar-card__link {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 12px;
  background: var(--sz-gray-50, #f9fafb);
  border-radius: 6px;
  text-decoration: none;
  color: var(--sz-gray-700, #374151);
  font-size: 0.9rem;
  transition: background 0.2s;
}

.sz-sidebar-card__link:hover {
  background: var(--sz-primary-light, #e3f2fd);
  color: var(--sz-primary, #1976d2);
}

.sz-sidebar-card__link-icon {
  font-size: 1rem;
}

/* シェアボタン */
.sz-share-buttons {
  display: flex;
  gap: 12px;
}

.sz-share-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  text-decoration: none;
  color: var(--sz-white, #fff);
  transition: transform 0.2s, opacity 0.2s;
}

.sz-share-btn:hover {
  transform: scale(1.1);
  opacity: 0.9;
}

.sz-share-btn--twitter {
  background: #000;
}

.sz-share-btn--facebook {
  background: #1877f2;
}

.sz-share-btn--line {
  background: #00c300;
}

/* レスポンシブ - 研究発表ページ */
@media (max-width: 992px) {
  .sz-research-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .sz-research-conference-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 768px) {
  .sz-research-detail__title {
    font-size: 1.4rem;
  }

  .sz-research-detail__nav {
    flex-direction: column;
  }

  .sz-research-detail__nav-link {
    max-width: 100%;
  }

  .sz-research-detail__nav-link--next {
    margin-left: 0;
  }

  .sz-research-detail__presenters {
    flex-direction: column;
  }

  .sz-research-detail__presenter {
    width: 100%;
  }
}

@media (max-width: 576px) {
  .sz-research-grid {
    grid-template-columns: 1fr;
  }

  .sz-research-category-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .sz-research-conference-grid {
    grid-template-columns: 1fr;
  }

  .sz-research-detail__pdf {
    flex-direction: column;
    align-items: flex-start;
    text-align: center;
  }

  .sz-research-detail__pdf-info {
    width: 100%;
    align-items: center;
  }
}

/* =====================================================
   お知らせリスト (News List)
   ===================================================== */

.sz-news-list {
  margin-bottom: 32px;
}

.sz-news-year {
  margin-bottom: 40px;
}

.sz-news-year:last-child {
  margin-bottom: 0;
}

.sz-news-year__title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--sz-gray-800, #1f2937);
  margin: 0 0 20px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--sz-primary, #1976d2);
}

.sz-news-year__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.sz-news-item {
  display: flex;
  gap: 16px;
  padding: 20px;
  background: var(--sz-white, #fff);
  border-radius: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  margin-bottom: 12px;
  transition: box-shadow 0.2s;
}

.sz-news-item:last-child {
  margin-bottom: 0;
}

.sz-news-item:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.sz-news-item--important {
  border-left: 4px solid var(--sz-error, #d32f2f);
  background: linear-gradient(to right, rgba(211, 47, 47, 0.03), var(--sz-white, #fff));
}

.sz-news-item__date {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  width: 60px;
  padding: 8px;
  background: var(--sz-gray-50, #f9fafb);
  border-radius: 6px;
  text-align: center;
}

.sz-news-item__month {
  font-size: 0.75rem;
  color: var(--sz-gray-600, #4b5563);
}

.sz-news-item__day {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--sz-primary, #1976d2);
}

.sz-news-item__content {
  flex: 1;
  min-width: 0;
}

.sz-news-item__title {
  font-size: 1rem;
  font-weight: 600;
  color: var(--sz-gray-800, #1f2937);
  margin: 0 0 8px;
  line-height: 1.5;
}

.sz-news-item__badge {
  display: inline-block;
  padding: 2px 8px;
  background: var(--sz-error, #d32f2f);
  color: var(--sz-white, #fff);
  font-size: 0.7rem;
  font-weight: 600;
  border-radius: 4px;
  margin-right: 8px;
}

.sz-news-item__body {
  font-size: 0.9rem;
  color: var(--sz-gray-600, #4b5563);
  line-height: 1.6;
  margin-bottom: 12px;
}

.sz-news-item__body p {
  margin: 0 0 8px;
}

.sz-news-item__body p:last-child {
  margin-bottom: 0;
}

.sz-news-item__link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--sz-primary, #1976d2);
  font-size: 0.9rem;
  font-weight: 500;
  text-decoration: none;
  transition: color 0.2s;
}

.sz-news-item__link:hover {
  color: var(--sz-primary-dark, #1565c0);
  text-decoration: underline;
}

.sz-news-item__link svg {
  flex-shrink: 0;
}

/* 空メッセージ */
.sz-empty-message {
  text-align: center;
  padding: 40px 20px;
  color: var(--sz-gray-500, #6b7280);
  font-size: 1rem;
}

/* レスポンシブ - お知らせリスト */
@media (max-width: 576px) {
  .sz-news-item {
    flex-direction: column;
    gap: 12px;
    padding: 16px;
  }

  .sz-news-item__date {
    flex-direction: row;
    width: auto;
    gap: 4px;
    padding: 6px 12px;
    align-self: flex-start;
  }

  .sz-news-item__month {
    font-size: 0.8rem;
  }

  .sz-news-item__day {
    font-size: 0.9rem;
  }
}

/* ================================================================
   News Page - 木古内スタイル (サイドバーカテゴリ + カテゴリ別セクション)
   ================================================================ */

/* サイドバーカテゴリリスト */
.sz-news-sidebar {
  position: sticky;
  top: 100px;
}

.sz-news-sidebar__header {
  margin-bottom: 16px;
  padding-bottom: 12px;
  border-bottom: 2px solid var(--sz-primary);
}

.sz-news-sidebar__title {
  font-size: 1.25rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 0 0 4px;
}

.sz-news-sidebar__subtitle {
  font-size: 0.8rem;
  color: var(--sz-text-light);
  font-style: italic;
  letter-spacing: 0.05em;
}

.sz-news-sidebar__section-title {
  font-size: 0.9rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 24px 0 12px;
}

.sz-news-category-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-news-category-list__item {
  border-bottom: 1px solid #eee;
}

.sz-news-category-list__link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 12px 8px;
  color: var(--sz-text);
  text-decoration: none;
  font-size: 0.9rem;
  transition: all 0.2s ease;
}

.sz-news-category-list__link:hover {
  background: #f5f8fc;
  color: var(--sz-primary);
}

.sz-news-category-list__link.is-active {
  background: var(--sz-primary-light);
  color: var(--sz-primary);
  font-weight: 600;
}

.sz-news-category-list__link::before {
  content: '›';
  margin-right: 8px;
  color: var(--sz-primary);
  font-weight: bold;
}

.sz-news-category-list__count {
  font-size: 0.8rem;
  color: var(--sz-text-light);
}

/* カテゴリ別セクション */
.sz-news-section {
  margin-bottom: 48px;
}

.sz-news-section__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 20px;
  padding-bottom: 12px;
  border-bottom: 1px solid #ddd;
}

.sz-news-section__title-wrap {
  display: flex;
  align-items: center;
  gap: 12px;
}

.sz-news-section__indicator {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  flex-shrink: 0;
}

.sz-news-section__indicator--urgent {
  background: #e53935;
}

.sz-news-section__indicator--important {
  background: var(--sz-primary);
}

.sz-news-section__indicator--general {
  background: #4caf50;
}

.sz-news-section__indicator--event {
  background: #ff9800;
}

.sz-news-section__indicator--recruit {
  background: #9c27b0;
}

.sz-news-section__title {
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 0;
}

.sz-news-section__more {
  display: inline-flex;
  align-items: center;
  padding: 6px 16px;
  background: #f0f0f0;
  border-radius: 20px;
  color: var(--sz-text);
  text-decoration: none;
  font-size: 0.8rem;
  font-weight: 500;
  transition: all 0.2s ease;
}

.sz-news-section__more:hover {
  background: var(--sz-primary);
  color: #fff;
}

/* カテゴリ別ニュースリスト */
.sz-news-section__list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.sz-news-section__item {
  display: flex;
  align-items: flex-start;
  gap: 24px;
  padding: 16px 0;
  border-bottom: 1px solid #eee;
}

.sz-news-section__item:last-child {
  border-bottom: none;
}

.sz-news-section__date {
  flex-shrink: 0;
  font-size: 0.9rem;
  color: var(--sz-primary);
  font-weight: 500;
  min-width: 100px;
}

.sz-news-section__link {
  flex: 1;
  color: var(--sz-text);
  text-decoration: none;
  font-size: 0.95rem;
  line-height: 1.6;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: color 0.2s ease;
}

.sz-news-section__link:hover {
  color: var(--sz-primary);
}

.sz-news-section__link::after {
  content: '›';
  color: var(--sz-text-light);
  margin-left: 12px;
  flex-shrink: 0;
}

/* 緊急お知らせ用赤文字 */
.sz-news-section--urgent .sz-news-section__date {
  color: #e53935;
}

.sz-news-section--urgent .sz-news-section__link {
  color: #e53935;
}

.sz-news-section--urgent .sz-news-section__link:hover {
  color: #c62828;
}

/* 関連ページ強化版 - カード形式 */
.sz-related-enhanced {
  background: #f5f8fc;
  border-radius: 16px;
  padding: 40px;
  margin: 48px 0;
}

.sz-related-enhanced__header {
  text-align: center;
  margin-bottom: 32px;
}

.sz-related-enhanced__title {
  font-size: 1.4rem;
  font-weight: 700;
  color: var(--sz-text);
  margin: 0 0 8px;
}

.sz-related-enhanced__subtitle {
  font-size: 0.9rem;
  color: var(--sz-text-light);
}

.sz-related-enhanced__grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.sz-related-enhanced__card {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 24px 16px;
  background: #fff;
  border-radius: 12px;
  text-decoration: none;
  color: var(--sz-text);
  box-shadow: 0 2px 8px rgba(0,0,0,0.06);
  transition: all 0.3s ease;
}

.sz-related-enhanced__card:hover {
  transform: translateY(-4px);
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
}

.sz-related-enhanced__icon {
  width: 56px;
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--sz-primary-light);
  border-radius: 50%;
  margin-bottom: 12px;
}

.sz-related-enhanced__icon .material-symbols-outlined {
  font-size: 1.75rem;
  color: var(--sz-primary);
}

.sz-related-enhanced__card-title {
  font-size: 0.95rem;
  font-weight: 600;
  text-align: center;
  line-height: 1.5;
}

@media (max-width: 768px) {
  .sz-news-section__item {
    flex-direction: column;
    gap: 8px;
  }

  .sz-news-section__date {
    min-width: auto;
  }

  .sz-related-enhanced__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  .sz-related-enhanced__card {
    padding: 16px 12px;
  }

  .sz-related-enhanced__icon {
    width: 44px;
    height: 44px;
  }

  .sz-related-enhanced__icon .material-symbols-outlined {
    font-size: 1.375rem;
  }

  .sz-related-enhanced__card-title {
    font-size: 0.85rem;
  }
}

/* ================================================================
   Hero English Subtitle
   ================================================================ */
.sz-page-hero__en {
  display: block;
  font-size: 0.8rem;
  font-weight: 500;
  color: #6b8db5;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  margin-bottom: 0.25rem;
}

.sz-page-hero__en:empty {
  display: none;
}

/* === object/project/_page-common.css === */

/* ================================================================
   page-common.css
   サブページ共通スタイル（パンくずリスト、セクション、関連ページ等）
   ================================================================ */

/* ================================================================
   CSS変数
   ================================================================ */
:root {
    --page-primary: var(--color-primary, #114FA1);
    --page-primary-light: var(--color-primary-light, #E8F0FA);
    --page-secondary: var(--color-success, #2E7D32);
    --page-secondary-light: var(--color-success-light, #E8F5E9);
    --page-accent: var(--color-error, #c62828);
    --page-text: var(--color-text-main, #23221e);
    --page-text-secondary: var(--color-text-sub, #6b6560);
    --page-text-muted: var(--color-text-muted, #9e9a95);
    --page-bg: var(--color-background, #f8f7f6);
    --page-bg-light: var(--sz-gray-50, #f9fafb);
    --page-border: var(--color-border, #d6d3d0);
    --page-shadow: var(--shadow-card, 0 2px 8px rgba(0, 0, 0, 0.08));
    --page-shadow-lg: var(--shadow-dialog, 0 8px 32px rgba(0, 0, 0, 0.16));
    --page-radius: var(--radius-lg, 16px);
    --page-radius-sm: var(--radius-md, 8px);
    --page-container: var(--content-max-width, 1200px);
}

/* ================================================================
   ページヒーロー共通
   ================================================================ */
.page-hero {
    position: relative;
    background: linear-gradient(135deg, var(--page-primary) 0%, #1565C0 100%);
    color: #fff;
    padding: 4rem 1.5rem;
    text-align: center;
    overflow: hidden;
}

.page-hero::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: url("data:image/svg+xml,%3Csvg width='60' height='60' viewBox='0 0 60 60' xmlns='http://www.w3.org/2000/svg'%3E%3Cg fill='none' fill-rule='evenodd'%3E%3Cg fill='%23ffffff' fill-opacity='0.05'%3E%3Cpath d='M36 34v-4h-2v4h-4v2h4v4h2v-4h4v-2h-4zm0-30V0h-2v4h-4v2h4v4h2V6h4V4h-4zM6 34v-4H4v4H0v2h4v4h2v-4h4v-2H6zM6 4V0H4v4H0v2h4v4h2V6h4V4H6z'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
    opacity: 0.5;
}

.page-hero__inner {
    position: relative;
    z-index: 1;
    max-width: var(--page-container);
    margin: 0 auto;
}

.page-hero__title {
    font-size: 2.5rem;
    font-weight: 700;
    margin: 0 0 0.75rem;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.75rem;
    line-height: 1.3;
}

.page-hero__icon .material-symbols-outlined {
    font-size: 2.5rem;
}

.page-hero__subtitle {
    font-size: 1.125rem;
    opacity: 0.95;
    margin: 0;
}

/* ヒーローカラーバリエーション */
.page-hero--publications {
    background: linear-gradient(135deg, #5C6BC0 0%, #3949AB 100%);
}

.page-hero--research {
    background: linear-gradient(135deg, #00897B 0%, #00695C 100%);
}

.page-hero--donations {
    background: linear-gradient(135deg, #FF7043 0%, #E64A19 100%);
}

.page-hero--checkup {
    background: linear-gradient(135deg, var(--page-secondary) 0%, #1B5E20 100%);
}

.page-hero--reservations {
    background: linear-gradient(135deg, #0288D1 0%, #0277BD 100%);
}

/* ================================================================
   パンくずリスト
   ================================================================ */
.breadcrumb {
    background: var(--page-bg-light);
    border-bottom: 1px solid var(--page-border);
    padding: 0.875rem 0;
}

.breadcrumb__inner {
    max-width: var(--page-container);
    margin: 0 auto;
    padding: 0 1.5rem;
}

.breadcrumb__list {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0.5rem;
    list-style: none;
    margin: 0;
    padding: 0;
    font-size: 0.875rem;
}

.breadcrumb__list li {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    color: var(--page-text-secondary);
}

.breadcrumb__list li::after {
    content: '';
    display: block;
    width: 6px;
    height: 6px;
    border-top: 1.5px solid var(--page-text-muted);
    border-right: 1.5px solid var(--page-text-muted);
    transform: rotate(45deg);
}

.breadcrumb__list li:last-child::after {
    display: none;
}

.breadcrumb__list li a {
    display: flex;
    align-items: center;
    gap: 0.25rem;
    color: var(--page-primary);
    text-decoration: none;
    transition: color 0.2s ease;
}

.breadcrumb__list li a:hover {
    color: #1976D2;
    text-decoration: underline;
}

.breadcrumb__list li a .material-symbols-outlined {
    font-size: 1.125rem;
}

.breadcrumb__list li[aria-current="page"] {
    color: var(--page-text-secondary);
    font-weight: 500;
}

/* ================================================================
   ページメインコンテナ
   ================================================================ */
.page-main {
    min-width: 0; /* grid子要素のoverflow対策 */
}

/* 単独使用時のpage-main（page-layoutなしの場合） */
.page-main:not(.page-layout *) {
    background: var(--page-bg);
    padding: 3rem 1.5rem 5rem;
    max-width: var(--page-container);
    margin: 0 auto;
}

.page-main .container {
    max-width: var(--page-container);
    margin: 0 auto;
    padding: 0 1.5rem;
}

/* ================================================================
   セクションタイトル共通
   ================================================================ */
.section-title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--page-text);
    margin: 0 0 1.5rem;
    padding-bottom: 0.75rem;
    border-bottom: 3px solid var(--page-primary);
}

.section-title .material-symbols-outlined {
    font-size: 1.75rem;
    color: var(--page-primary);
}

.section-title--center {
    justify-content: center;
    border-bottom: none;
    padding-bottom: 0;
}

.section-title--center::after {
    display: none;
}

/* ================================================================
   ボタン共通
   ================================================================ */
.btn {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    padding: 0.75rem 1.5rem;
    font-size: 0.9375rem;
    font-weight: 600;
    text-decoration: none;
    border-radius: var(--page-radius-sm);
    border: 2px solid transparent;
    cursor: pointer;
    transition: all 0.2s ease;
    white-space: nowrap;
}

.btn .material-symbols-outlined {
    font-size: 1.25rem;
}

.btn--primary,
.btn-primary {
    background: var(--page-primary);
    color: #fff;
    border-color: var(--page-primary);
}

.btn--primary:hover,
.btn-primary:hover {
    background: #1565C0;
    border-color: #1565C0;
    transform: translateY(-2px);
    box-shadow: 0 4px 12px rgba(13, 71, 161, 0.3);
}

.btn--secondary,
.btn-secondary {
    background: var(--page-secondary);
    color: #fff;
    border-color: var(--page-secondary);
}

.btn--secondary:hover,
.btn-secondary:hover {
    background: #388E3C;
    border-color: #388E3C;
}

.btn--outline,
.btn-outline {
    background: transparent;
    color: var(--page-primary);
    border-color: var(--page-primary);
}

.btn--outline:hover,
.btn-outline:hover {
    background: var(--page-primary);
    color: #fff;
}

.btn--lg {
    padding: 1rem 2rem;
    font-size: 1rem;
}

.btn--sm {
    padding: 0.5rem 1rem;
    font-size: 0.875rem;
}

.btn--block {
    width: 100%;
}

/* ================================================================
   カード共通
   ================================================================ */
.card {
    background: #fff;
    border-radius: var(--page-radius);
    box-shadow: var(--page-shadow);
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.card:hover {
    transform: translateY(-4px);
    box-shadow: var(--page-shadow-lg);
}

.card__image {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    background: var(--page-bg-light);
}

.card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.card:hover .card__image img {
    transform: scale(1.05);
}

.card__body {
    padding: 1.25rem;
}

.card__title {
    font-size: 1.125rem;
    font-weight: 600;
    color: var(--page-text);
    margin: 0 0 0.5rem;
    line-height: 1.4;
}

.card__desc {
    font-size: 0.875rem;
    color: var(--page-text-secondary);
    line-height: 1.6;
    margin: 0;
}

/* ================================================================
   グリッド共通
   ================================================================ */
.grid {
    display: grid;
    gap: 1.5rem;
}

.grid--2 {
    grid-template-columns: repeat(2, 1fr);
}

.grid--3 {
    grid-template-columns: repeat(3, 1fr);
}

.grid--4 {
    grid-template-columns: repeat(4, 1fr);
}

.grid--auto {
    grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
}

/* ================================================================
   サイドバー（関連ページ・よく見られるページ）
   ================================================================ */
.page-sidebar {
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.sidebar-section {
    background: #fff;
    border-radius: var(--page-radius);
    box-shadow: var(--page-shadow);
    overflow: hidden;
}

.sidebar-section__header {
    background: linear-gradient(135deg, var(--page-primary) 0%, #1565C0 100%);
    color: #fff;
    padding: 1rem 1.25rem;
    display: flex;
    align-items: center;
    gap: 0.5rem;
}

.sidebar-section__header .material-symbols-outlined {
    font-size: 1.25rem;
}

.sidebar-section__title {
    font-size: 1rem;
    font-weight: 600;
    margin: 0;
}

.sidebar-section__body {
    padding: 0;
}

.sidebar-links {
    list-style: none;
    margin: 0;
    padding: 0;
}

.sidebar-links li {
    border-bottom: 1px solid var(--page-border);
}

.sidebar-links li:last-child {
    border-bottom: none;
}

.sidebar-links a {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    color: var(--page-text);
    text-decoration: none;
    font-size: 0.9375rem;
    transition: background 0.2s ease, color 0.2s ease;
}

.sidebar-links a:hover {
    background: var(--page-primary-light);
    color: var(--page-primary);
}

.sidebar-links a .material-symbols-outlined {
    font-size: 1.25rem;
    color: var(--page-primary);
    flex-shrink: 0;
}

.sidebar-links a .arrow {
    margin-left: auto;
    font-size: 1rem;
    color: var(--page-text-muted);
}

/* お知らせサイドバー */
.sidebar-news {
    list-style: none;
    margin: 0;
    padding: 0;
}

.sidebar-news li {
    border-bottom: 1px solid var(--page-border);
}

.sidebar-news li:last-child {
    border-bottom: none;
}

.sidebar-news a {
    display: block;
    padding: 1rem 1.25rem;
    text-decoration: none;
    transition: background 0.2s ease;
}

.sidebar-news a:hover {
    background: var(--page-bg-light);
}

.sidebar-news__date {
    display: block;
    font-size: 0.75rem;
    color: var(--page-text-muted);
    margin-bottom: 0.25rem;
}

.sidebar-news__title {
    font-size: 0.875rem;
    color: var(--page-text);
    line-height: 1.5;
}

/* バナーエリア */
.sidebar-banner {
    display: block;
    border-radius: var(--page-radius-sm);
    overflow: hidden;
    transition: transform 0.2s ease;
}

.sidebar-banner:hover {
    transform: scale(1.02);
}

.sidebar-banner img {
    width: 100%;
    height: auto;
    display: block;
}

/* サイドバー：お問い合わせ */
.sidebar-section--contact .sidebar-section__header {
    background: linear-gradient(135deg, #FF7043 0%, #E64A19 100%);
}

.sidebar-contact {
    padding: 1.25rem;
    text-align: center;
}

.sidebar-contact__tel {
    font-size: 1.5rem;
    font-weight: 700;
    margin: 0 0 0.5rem;
}

.sidebar-contact__tel a {
    color: var(--page-primary);
    text-decoration: none;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
}

.sidebar-contact__tel a::before {
    content: '\e0b0';
    font-family: 'Material Symbols Outlined';
    font-size: 1.25rem;
}

.sidebar-contact__tel a:hover {
    color: #1565C0;
}

.sidebar-contact__hours {
    font-size: 0.875rem;
    color: var(--page-text-secondary);
    margin: 0;
}

/* ================================================================
   フッターCTA（ページ下部のアクションエリア）
   ================================================================ */
.page-cta {
    background: linear-gradient(135deg, var(--page-primary-light) 0%, #fff 100%);
    border: 2px solid var(--page-primary);
    border-radius: var(--page-radius);
    padding: 3rem 2rem;
    text-align: center;
    margin-top: 3rem;
}

.page-cta__title {
    font-size: 1.5rem;
    font-weight: 700;
    color: var(--page-text);
    margin: 0 0 0.75rem;
}

.page-cta__desc {
    font-size: 1rem;
    color: var(--page-text-secondary);
    margin: 0 0 1.5rem;
}

.page-cta__buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
}

.page-cta__tel {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 0.5rem;
    margin-top: 1.5rem;
    font-size: 0.875rem;
    color: var(--page-text-muted);
}

.page-cta__tel a {
    color: var(--page-text);
    font-weight: 600;
    font-size: 1.125rem;
    text-decoration: none;
}

.page-cta__tel a:hover {
    color: var(--page-primary);
}

/* ================================================================
   関連ページセクション
   ================================================================ */
.related-pages {
    background: var(--page-bg-light);
    padding: 3rem 1.5rem;
    margin-top: 0;
}

.related-pages__inner {
    max-width: var(--page-container);
    margin: 0 auto;
}

.related-pages__title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.25rem;
    font-weight: 700;
    color: var(--page-text);
    margin: 0 0 1.5rem;
}

.related-pages__title .material-symbols-outlined {
    color: var(--page-primary);
}

.related-pages__grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
    gap: 1rem;
}

.related-page-card {
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 1rem 1.25rem;
    background: #fff;
    border-radius: var(--page-radius-sm);
    border: 1px solid var(--page-border);
    text-decoration: none;
    transition: all 0.2s ease;
}

.related-page-card:hover {
    border-color: var(--page-primary);
    background: var(--page-primary-light);
    transform: translateX(4px);
}

.related-page-card__icon {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: var(--page-primary-light);
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
}

.related-page-card__icon .material-symbols-outlined {
    font-size: 1.5rem;
    color: var(--page-primary);
}

.related-page-card__content {
    flex: 1;
    min-width: 0;
}

.related-page-card__title {
    font-size: 0.9375rem;
    font-weight: 600;
    color: var(--page-text);
    margin: 0 0 0.25rem;
}

.related-page-card__desc,
.related-page-card__text {
    font-size: 0.8125rem;
    color: var(--page-text-secondary);
    margin: 0;
    line-height: 1.5;
}

.related-page-card__arrow {
    flex-shrink: 0;
    font-size: 1.25rem;
    color: var(--page-text-muted);
    transition: transform 0.2s ease;
}

.related-page-card:hover .related-page-card__arrow {
    transform: translateX(4px);
    color: var(--page-primary);
}

/* ================================================================
   よく見られるページ
   ================================================================ */
.popular-pages {
    margin-top: 3rem;
}

.popular-pages__title {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    font-size: 1.125rem;
    font-weight: 700;
    color: var(--page-text);
    margin: 0 0 1rem;
}

.popular-pages__title .material-symbols-outlined {
    color: var(--page-accent);
}

.popular-pages__list {
    display: flex;
    flex-wrap: wrap;
    gap: 0.75rem;
}

.popular-page-tag {
    display: inline-flex;
    align-items: center;
    gap: 0.375rem;
    padding: 0.5rem 1rem;
    background: #fff;
    border: 1px solid var(--page-border);
    border-radius: 50px;
    font-size: 0.875rem;
    color: var(--page-text);
    text-decoration: none;
    transition: all 0.2s ease;
}

.popular-page-tag:hover {
    background: var(--page-primary);
    border-color: var(--page-primary);
    color: #fff;
}

.popular-page-tag .material-symbols-outlined {
    font-size: 1rem;
}

/* ================================================================
   お問い合わせボックス
   ================================================================ */
.contact-box {
    background: linear-gradient(135deg, var(--page-bg-light) 0%, #fff 100%);
    border: 2px solid var(--page-primary);
    border-radius: var(--page-radius);
    padding: 2.5rem 2rem;
    text-align: center;
    margin-top: 2rem;
}

.contact-box h2,
.contact-box__title {
    font-size: 1.375rem;
    font-weight: 700;
    color: var(--page-text);
    margin: 0 0 0.75rem;
}

.contact-box > p,
.contact-box__desc {
    font-size: 1rem;
    color: var(--page-text-secondary);
    margin: 0 0 1.5rem;
}

.contact-box__buttons {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem;
    margin-bottom: 1rem;
}

.contact-box__hours {
    font-size: 0.875rem;
    color: var(--page-text-muted);
    margin: 0;
}

/* ================================================================
   レスポンシブ (Mobile First)
   ================================================================ */

/* Mobile base */
.page-hero {
    padding: clamp(2rem, 5vw, 4rem) clamp(1rem, 3vw, 2rem);
}

.page-hero__title {
    font-size: clamp(1.5rem, 4vw, 2rem);
    flex-direction: column;
    gap: 0.5rem;
}

.page-hero__icon .material-symbols-outlined {
    font-size: clamp(1.75rem, 4vw, 2.5rem);
}

.page-hero__subtitle {
    font-size: clamp(0.875rem, 2vw, 1.125rem);
}

.breadcrumb__inner {
    padding: 0 1rem;
}

.page-main {
    padding: 2rem 0 3rem;
}

.page-main .container {
    padding: 0 1rem;
}

.section-title {
    font-size: clamp(1.125rem, 3vw, 1.5rem);
}

.grid--2,
.grid--3,
.grid--4 {
    grid-template-columns: 1fr;
}

.page-cta {
    padding: clamp(1.5rem, 4vw, 3rem) clamp(1rem, 3vw, 2rem);
}

.page-cta__buttons {
    flex-direction: column;
}

.page-cta__buttons .btn {
    width: 100%;
}

.related-pages__grid {
    grid-template-columns: 1fr;
}

.contact-box__buttons {
    flex-direction: column;
}

.contact-box__buttons .btn {
    width: 100%;
}

/* Tablet (768px+) */
@media (min-width: 768px) {
    .page-hero {
        padding: 3.5rem 1.5rem;
    }

    .page-hero__title {
        font-size: 1.75rem;
        flex-direction: row;
        gap: 0.75rem;
    }

    .section-title {
        font-size: 1.375rem;
    }

    .grid--2 {
        grid-template-columns: repeat(2, 1fr);
    }

    .grid--3 {
        grid-template-columns: repeat(2, 1fr);
    }

    .grid--4 {
        grid-template-columns: repeat(2, 1fr);
    }

    .related-pages__grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .page-cta__buttons {
        flex-direction: row;
    }

    .page-cta__buttons .btn {
        width: auto;
    }

    .contact-box__buttons {
        flex-direction: row;
    }

    .contact-box__buttons .btn {
        width: auto;
    }
}

/* Desktop (1024px+) */
@media (min-width: 1024px) {
    .page-hero {
        padding: 4rem 2rem;
    }

    .page-hero__title {
        font-size: 2rem;
    }

    .breadcrumb__inner {
        padding: 0;
    }

    .page-main {
        padding: 3rem 0 5rem;
    }

    .page-main .container {
        padding: 0;
    }

    .section-title {
        font-size: 1.5rem;
    }

    .grid--3 {
        grid-template-columns: repeat(3, 1fr);
    }

    .grid--4 {
        grid-template-columns: repeat(4, 1fr);
    }

    .related-pages__grid {
        grid-template-columns: repeat(3, 1fr);
    }
}

/* ================================================================
   2カラムレイアウト
   ================================================================ */
/* 2カラムレイアウト (Mobile First) */
.page-layout {
    display: grid;
    grid-template-columns: 1fr;
    gap: clamp(1.5rem, 4vw, 3rem);
    align-items: start;
    max-width: var(--page-container);
    margin: 0 auto;
    padding: clamp(1.5rem, 4vw, 3rem) clamp(1rem, 3vw, 1.5rem) clamp(2.5rem, 6vw, 5rem);
    background: var(--page-bg);
}

.page-sidebar {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.5rem;
}

@media (min-width: 640px) {
    .page-sidebar {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media (min-width: 1024px) {
    .page-layout {
        grid-template-columns: 1fr 320px;
        gap: 3rem;
        padding: 3rem 1.5rem 5rem;
    }

    .page-sidebar {
        grid-template-columns: 1fr;
    }
}

/* ================================================================
   アニメーション
   ================================================================ */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(12px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.fade-in {
    animation: fadeIn 0.4s ease forwards;
}

/* ================================================================
   プリント対応
   ================================================================ */
@media print {
    .page-hero {
        background: #333 !important;
        padding: 1.5rem !important;
    }

    .page-sidebar,
    .page-cta,
    .related-pages,
    .popular-pages {
        display: none !important;
    }

    .page-layout {
        grid-template-columns: 1fr !important;
    }

    .card {
        box-shadow: none !important;
        border: 1px solid #ccc !important;
    }
}

/* === object/project/_triage.css === */

/* ==========================================================================
 * Project: Triage (.c-urgency)
 * AI問診 — 緊急度表示スタイル
 * ========================================================================== */

/* --- Urgency label --- */
.c-urgency {
  display: inline-block;
  padding: var(--spacing-xs, 4px) var(--spacing-md, 12px);
  border-radius: var(--radius-sm, 4px);
  font-weight: var(--font-weight-bold, 700);
  font-size: var(--font-size-lg, 1.125rem);
}

.c-urgency--low {
  color: var(--color-success, #198754);
  background: color-mix(in srgb, var(--color-success, #198754) 12%, transparent);
}

.c-urgency--medium {
  color: var(--color-warning-text, #856404);
  background: color-mix(in srgb, var(--color-warning, #ffc107) 18%, transparent);
}

.c-urgency--high {
  color: var(--color-caution, #fd7e14);
  background: color-mix(in srgb, var(--color-caution, #fd7e14) 12%, transparent);
}

.c-urgency--critical {
  color: var(--color-error, #dc3545);
  background: color-mix(in srgb, var(--color-error, #dc3545) 12%, transparent);
}

/* --- Triage index page --- */
.triage-alert {
  margin-block-start: var(--sz-space-lg, 1.5rem);
}

.triage-category-heading {
  margin-block-start: var(--sz-space-xl, 2rem);
  font-size: clamp(1.125rem, 1rem + 0.5vw, 1.375rem);
  font-weight: var(--font-weight-bold, 700);
}

.triage-category-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--sz-space-md, 1rem);
  margin-block-start: var(--sz-space-lg, 1.5rem);
}

@media (min-width: 600px) {
  .triage-category-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1024px) {
  .triage-category-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.triage-category-card {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sz-space-xs, 0.5rem);
  padding: var(--sz-space-lg, 1.5rem) var(--sz-space-md, 1rem);
  border: 1px solid var(--color-border, #dee2e6);
  border-radius: var(--radius-md, 8px);
  background: var(--color-surface, #fff);
  text-decoration: none;
  color: var(--color-text, #333);
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
  min-height: 48px;
}

.triage-category-card:hover,
.triage-category-card:focus-visible {
  border-color: var(--color-primary, #1a6b3c);
  box-shadow: 0 4px 12px rgb(0 0 0 / 0.08);
}

.triage-category-card__icon {
  font-size: 2rem;
  color: var(--color-primary, #1a6b3c);
}

.triage-category-card__name {
  margin: 0;
  font-size: var(--font-size-sm, 0.875rem);
  font-weight: var(--font-weight-medium, 500);
  text-align: center;
}

.triage-empty {
  margin-block-start: var(--sz-space-xl, 2rem);
}

/* --- Questionnaire form --- */
.triage-form {
  margin-block-start: var(--sz-space-xl, 2rem);
}

.triage-result {
  margin-block-start: var(--sz-space-xl, 2rem);
}

.triage-result__dept {
  margin-block-start: var(--sz-space-md, 1rem);
}

.triage-result__actions {
  margin-block-start: var(--sz-space-lg, 1.5rem);
}

/* --- Result page detail styles --- */
.triage-result-box {
  margin-block-start: var(--sz-space-lg, 1.5rem);
}

.triage-result-recommendation {
  margin-block-start: var(--sz-space-sm, 0.75rem);
}

.triage-result-dept-icon {
  vertical-align: middle;
}

.triage-result-answer {
  padding-block: var(--sz-space-xs, 0.5rem);
  border-block-end: 1px solid var(--sz-border, #eee);
}

.triage-result-score {
  margin-block-start: var(--sz-space-sm, 0.75rem);
  color: var(--sz-text-muted, #666);
}

.triage-result-emergency {
  margin-block-start: var(--sz-space-lg, 1.5rem);
}

.triage-result-emergency__tel {
  margin-block-start: var(--sz-space-sm, 0.75rem);
}

.triage-result-actions {
  margin-block-start: var(--sz-space-xl, 2rem);
}

.triage-result-disclaimer {
  margin-block-start: var(--sz-space-lg, 1.5rem);
}

/* === object/project/_asakayama-mobile.css === */

/* ================================================================
   _asakayama-mobile.css
   
   浅香山病院スタイル モバイル/タブレット レスポンシブ対応
   Mobile First (min-width) で記述
   
   設計方針:
   - 浅香山病院 (https://www.asakayama.or.jp/) のモバイル/タブレット
     表示に近づけるレスポンシブオーバーライド
   - プロジェクトルール準拠: min-width, clamp(), 論理プロパティ,
     デザイントークン, FLOCSS+BEM, Container Queries
   ================================================================ */

/* ================================================================
   1. モバイル Design Tokens Override
   ================================================================ */
:root {
  /* 浅香山スタイル: モバイルコンテナ幅 */
  --asa-inner-mobile: 34.5rem;   /* 345px — 浅香山のSP基準 */
  --asa-inner-narrow: 31.5rem;   /* 315px — 浅香山のSP狭幅 */
  
  /* 浅香山スタイル: ヘッダー高さ */
  --asa-header-h-mobile: 6rem;   /* 60px */
  --asa-header-h-tablet: 8rem;   /* 80px */
  
  /* 浅香山スタイル: セクション間余白 */
  --asa-section-gap: clamp(1.5rem, 4vw, 4rem);
  
  /* 浅香山スタイル: カード角丸 */
  --asa-radius-card: 1rem;
  --asa-radius-button: 9999px;   /* pill shape */
  
  /* 浅香山スタイル: トランジション */
  --asa-transition: 0.25s ease;
  --asa-transition-card: 0.35s ease;
  --asa-transition-nav: 0.5s ease;
  
  /* 浅香山スタイル: フォントファミリー(英語見出し) */
  --asa-font-heading-en: "Jost", "Inter", "Noto Sans JP", sans-serif;
}

/* ================================================================
   2. ベースタイポグラフィ（浅香山準拠 Fluid）
   ================================================================ */

/* モバイルベース: 1.4rem/1.7 → タブレット: 1.5rem/1.75 → PC: 1.6rem/1.8 */
body {
  font-size: clamp(0.875rem, 0.8rem + 0.25vw, 1rem);
  line-height: 1.7;
  letter-spacing: 0.02em;
}

@media (min-width: 768px) {
  body {
    letter-spacing: 0.04em;
  }
}

@media (min-width: 1024px) {
  body {
    line-height: 1.8;
    letter-spacing: 0.05em;
  }
}

/* ================================================================
   3. SP ヘッダー 浅香山スタイル改修
   ================================================================ */

/* SPヘッダー: コンパクト化 + 救急ボタン配置 */
.sz-header-sp {
  min-height: var(--asa-header-h-mobile);
  padding-inline: clamp(0.75rem, 3vw, 1.25rem);
  background: var(--color-surface);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}

/* SPロゴ: 浅香山 17rem → 当院は調整 */
.sz-header-sp__logo-img {
  height: clamp(1.75rem, 4vw, 2.25rem);
  width: auto;
}

.sz-header-sp__logo-name {
  font-size: clamp(0.75rem, 2vw, 0.875rem);
  font-weight: var(--font-weight-bold);
  letter-spacing: 0.02em;
}

/* SP救急ボタン（浅香山風: 右端に緑/グラデCTA） */
.sz-header-sp__emergency-btn {
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
  padding: 0.5rem 0.875rem;
  font-size: clamp(0.625rem, 1.5vw, 0.75rem);
  font-weight: var(--font-weight-bold);
  color: var(--color-surface);
  background: var(--color-primary);
  border: 2px solid var(--color-primary);
  border-radius: var(--asa-radius-button);
  text-decoration: none;
  white-space: nowrap;
  min-height: 2.5rem;
  transition: background var(--asa-transition),
              color var(--asa-transition),
              border-color var(--asa-transition);
}

.sz-header-sp__emergency-btn:hover {
  background: var(--color-surface);
  color: var(--color-primary);
  border-color: var(--color-primary);
}

.sz-header-sp__emergency-btn:active {
  background: var(--color-primary-light);
  color: var(--color-primary);
  transform: scale(0.98);
}

/* ハンバーガー: 浅香山 6rem×6rem → タッチ最適化 */
.sz-header-sp__menu-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 3rem;
  height: 3rem;
  min-height: var(--touch-target-min, 44px);
  min-width: var(--touch-target-min, 44px);
  padding: 0;
  background: transparent;
  border: none;
  cursor: pointer;
  gap: 0.125rem;
}

/* ================================================================
   4. SP メニューパネル（浅香山: オフキャンバス 100dvh）
   ================================================================ */
.sz-sp-menu__panel {
  border-radius: 0;
  max-height: none;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* SPメニュー内ナビリスト: 浅香山風 グリッド */
.sz-sp-menu__list--grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
}

@media (min-width: 480px) {
  .sz-sp-menu__list--grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* SPメニュー内リンク: タッチターゲット拡大 */
.sz-sp-menu__link {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.875rem 1rem;
  min-height: var(--touch-target-min, 44px);
  font-size: clamp(0.8125rem, 2vw, 0.9375rem);
  color: var(--color-text-main);
  text-decoration: none;
  border-radius: var(--asa-radius-card);
  transition: background var(--asa-transition);
}

.sz-sp-menu__link:hover {
  background: var(--color-primary-light);
}

/* ================================================================
   5. ヒーロー 浅香山スタイル改修
   ================================================================ */

/* SPヒーロー: 角丸コンテナ維持、サイズ最適化 */
.sz-hero__main {
  border-radius: clamp(0.75rem, 2vw, 1.25rem);
  min-height: clamp(200px, 45vh, 340px);
  min-height: clamp(200px, 45dvh, 340px);
}

/* SPヒーロー内テキスト: 浅香山風の控えめ配置 */
.sz-hero__content {
  padding: clamp(1rem, 3vw, 2rem);
}

.sz-hero__txt-main-text {
  font-size: clamp(1.125rem, 3vw, 1.5rem);
  line-height: 1.6;
}

/* SPヒーロー内ニュースパネル: 非表示→下に配置 */
.sz-hero__news-panel {
  position: static;
  width: 100%;
  border-radius: 0 0 var(--asa-radius-card) var(--asa-radius-card);
  margin-block-start: -1px;
}

@media (min-width: 768px) {
  .sz-hero__news-panel {
    position: absolute;
    inset-inline-start: 0;
    inset-block-end: 0;
    width: 480px;
    border-radius: 0 1rem 0 0;
    margin-block-start: 0;
  }
}

/* SPヒーロー: 採用バナー最適化 */
.sz-hero__recruit-float {
  inset-inline-end: 0;
  inset-block-end: 15%;
  padding: 0.625rem 1rem;
  font-size: clamp(0.625rem, 1.5vw, 0.75rem);
  border-radius: var(--asa-radius-button) 0 0 var(--asa-radius-button);
}

@media (min-width: 768px) {
  .sz-hero__recruit-float {
    padding: 0.875rem 1.5rem;
    font-size: clamp(0.75rem, 1vw, 0.875rem);
  }
}

/* ヒーローSwiperナビ: 浅香山風（下部展開） */
.sz-hero__counter {
  inset-inline-start: clamp(0.75rem, 2vw, 1.875rem);
  inset-block-end: clamp(0.75rem, 2vw, 1.875rem);
}

/* ================================================================
   6. 重要お知らせ（浅香山: SPではヒーロー下にフル幅） 
   ================================================================ */
.sz-important-news {
  padding-inline: clamp(1rem, 3vw, 2rem);
  padding-block: clamp(0.75rem, 2vw, 1.25rem);
}

.sz-important-news__item {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
  padding-block: 0.625rem;
  border-block-end: 1px solid var(--color-border-light);
}

.sz-important-news__date {
  flex-shrink: 0;
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
  white-space: nowrap;
}

.sz-important-news__title {
  font-size: var(--font-size-base);
  line-height: var(--line-height-normal);
}

/* ================================================================
   7. クイックアクセス（浅香山: SP 外来・連携 2ボタン）
   ================================================================ */

/* SP: 2列 → タブレット: 3列 → PC: 横一列 */
.sz-quick-guide__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(0.5rem, 1.5vw, 0.75rem);
}

@media (min-width: 480px) {
  .sz-quick-guide__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 768px) {
  .sz-quick-guide__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

@media (min-width: 1024px) {
  .sz-quick-guide__grid {
    grid-template-columns: repeat(6, 1fr);
  }
}

/* クイックアクセスカード: 浅香山風ピル型 */
.sz-quick-guide__item {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: clamp(0.75rem, 2vw, 1rem) clamp(0.5rem, 1.5vw, 0.875rem);
  min-height: clamp(3rem, 8vw, 4rem);
  background: var(--color-surface);
  border: 1px solid var(--color-border);
  border-radius: var(--asa-radius-card);
  text-decoration: none;
  color: var(--color-text-main);
  font-size: clamp(0.75rem, 2vw, 0.875rem);
  font-weight: var(--font-weight-medium);
  transition: all var(--asa-transition);
  text-align: center;
}

.sz-quick-guide__item:hover {
  border-color: var(--color-primary);
  box-shadow: var(--shadow-card-hover);
  transform: translateY(-2px);
}

.sz-quick-guide__item .material-symbols-outlined {
  font-size: clamp(1.25rem, 3vw, 1.5rem);
  color: var(--color-primary);
}

/* ================================================================
   8. 受付時間（浅香山: アコーディオン展開）
   ================================================================ */
.sz-reception {
  padding-inline: clamp(1rem, 3vw, 1.5rem);
  padding-block: clamp(0.75rem, 2vw, 1rem);
}

.sz-reception__toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: clamp(0.75rem, 2vw, 1rem);
  min-height: var(--touch-target-min, 44px);
  background: var(--color-primary);
  color: var(--color-surface);
  border: none;
  border-radius: var(--asa-radius-card);
  font-size: clamp(0.875rem, 2vw, 1rem);
  font-weight: var(--font-weight-bold);
  cursor: pointer;
  transition: background var(--asa-transition);
}

.sz-reception__toggle:hover {
  background: var(--color-primary-hover);
}

.sz-reception__toggle .material-symbols-outlined {
  transition: transform var(--asa-transition);
}

.sz-reception__toggle[aria-expanded="true"] .material-symbols-outlined {
  transform: rotate(180deg);
}

.sz-reception__content {
  padding: clamp(0.75rem, 2vw, 1.25rem);
}

/* 受付テーブル: SP → 1列、タブ → 3列 */
.sz-reception__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

@media (min-width: 480px) {
  .sz-reception__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .sz-reception__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ================================================================
   9. セクションタイトル（浅香山: ttl系）
   ================================================================ */

/* セクション共通: Mobile余白 */
.sz-section,
.p-section {
  padding-block: var(--asa-section-gap);
  padding-inline: clamp(1rem, 4vw, 2rem);
  margin-bottom: 0;
  margin-block-end: 0;
}

/* SP: コンテナ幅制限（浅香山 34.5rem基準） */
.sz-section__inner,
.p-section__inner {
  max-inline-size: 100%;
  margin-inline: auto;
}

@media (min-width: 1024px) {
  .sz-section__inner,
  .p-section__inner {
    max-inline-size: var(--container-xl);
  }
}

@media (min-width: 1280px) {
  .sz-section__inner,
  .p-section__inner {
    max-inline-size: var(--container-xxl);
  }
}

/* セクション見出し: 浅香山 ttl風 */
.sz-section__heading,
.p-section__heading {
  font-size: clamp(1.25rem, 3vw + 0.5rem, 2rem);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  text-wrap: balance;
  word-break: auto-phrase;
  margin-block-end: clamp(1rem, 3vw, 2rem);
}

/* 英語サブ見出し: Jostフォント */
.sz-section__heading-en {
  display: block;
  font-family: var(--asa-font-heading-en);
  font-size: clamp(0.6875rem, 1.5vw, 0.8125rem);
  font-weight: 500;
  letter-spacing: 0.1em;
  color: var(--color-primary);
  margin-block-end: 0.25rem;
}

/* ================================================================
   10. カードグリッド（浅香山: 4→3→1 レスポンシブ）
   ================================================================ */

/* 診療科カード: SP 1列 → 2列 → 3列 → 4列 */
.sz-dept-grid,
.c-card-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(0.75rem, 2vw, 1.25rem);
}

@media (min-width: 480px) {
  .sz-dept-grid,
  .c-card-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .sz-dept-grid,
  .c-card-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1024px) {
  .sz-dept-grid,
  .c-card-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* ================================================================
   11. カード（浅香山: 角丸・ボーダー・ホバー）
   ================================================================ */

/* カード共通: 浅香山風 */
.c-card {
  border: 1px solid var(--color-border);
  border-radius: var(--asa-radius-card);
  overflow: hidden;
  transition: transform var(--asa-transition-card),
              box-shadow var(--asa-transition-card);
}

.c-card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-card-hover);
}

/* SP: 横カード（浅香山: 画像左・テキスト右） */
.c-card--horizontal {
  display: flex;
  flex-direction: row;
}

.c-card--horizontal .c-card__image {
  flex-shrink: 0;
  width: clamp(5.5rem, 25vw, 8rem);
  aspect-ratio: 1 / 1;
}

.c-card--horizontal .c-card__body {
  flex: 1;
  min-width: 0;
  padding: clamp(0.5rem, 1.5vw, 0.75rem);
}

.c-card--horizontal .c-card__title {
  font-size: clamp(0.8125rem, 2vw, 0.9375rem);
  -webkit-line-clamp: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

@media (min-width: 768px) {
  .c-card--horizontal {
    flex-direction: column;
  }
  
  .c-card--horizontal .c-card__image {
    width: 100%;
    aspect-ratio: 16 / 9;
  }
}

/* ================================================================
   12. 診療科セクション（浅香山: dept featured + grid）
   ================================================================ */

/* 診療科フィーチャーカード */
.sz-dept-feature {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(0.75rem, 2vw, 1rem);
}

@media (min-width: 480px) {
  .sz-dept-feature {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .sz-dept-feature {
    grid-template-columns: repeat(4, 1fr);
  }
}

.sz-dept-feature__card {
  position: relative;
  border-radius: var(--asa-radius-card);
  overflow: hidden;
  min-height: clamp(10rem, 30vw, 15rem);
}

.sz-dept-feature__card img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform var(--asa-transition-card);
}

.sz-dept-feature__card:hover img {
  transform: scale(1.05);
}

.sz-dept-feature__overlay {
  position: absolute;
  inset-block-end: 0;
  inset-inline: 0;
  padding: clamp(0.75rem, 2vw, 1.25rem);
  background: linear-gradient(transparent, rgba(0, 0, 0, 0.6));
  color: var(--color-surface);
}

/* 診療科アイコングリッド: SP 2列 → 4列 */
.sz-dept-icon-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(0.5rem, 1.5vw, 0.75rem);
}

@media (min-width: 480px) {
  .sz-dept-icon-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 768px) {
  .sz-dept-icon-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

.sz-dept-icon-grid__item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
  padding: clamp(0.75rem, 2vw, 1rem);
  border: 1px solid var(--color-border);
  border-radius: var(--asa-radius-card);
  text-decoration: none;
  color: var(--color-text-main);
  font-size: clamp(0.75rem, 2vw, 0.875rem);
  text-align: center;
  transition: all var(--asa-transition);
}

.sz-dept-icon-grid__item:hover {
  border-color: var(--color-primary);
  background: var(--color-primary-light);
}

/* ================================================================
   13. ボタン（浅香山: ピル型＋アイコン丸）
   ================================================================ */

/* ピル型ボタン: 浅香山 btn01 相当 */
.c-button--pill,
.sz-btn--pill {
  border-radius: var(--asa-radius-button);
  padding-inline: clamp(1.5rem, 4vw, 2.5rem);
  min-height: clamp(3rem, 7vw, 4.375rem);
  font-size: clamp(0.875rem, 2vw, 1rem);
  font-weight: var(--font-weight-bold);
  transition: all var(--asa-transition);
}

/* ボタン with アイコン丸（浅香山風） */
.c-button--with-icon {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
}

.c-button__icon-circle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: clamp(2rem, 5vw, 2.5rem);
  height: clamp(2rem, 5vw, 2.5rem);
  border-radius: 50%;
  background: rgba(255, 255, 255, 0.2);
  transition: transform var(--asa-transition);
}

.c-button--with-icon:hover .c-button__icon-circle {
  transform: translateX(4px);
}

/* SP: フルワイドボタン */
.c-button--sp-full {
  width: 100%;
  justify-content: center;
}

@media (min-width: 768px) {
  .c-button--sp-full {
    width: auto;
  }
}

/* ================================================================
   14. ニュースセクション（浅香山: タブ+リスト）
   ================================================================ */

/* ニュースタブ: SP 3列 → 5列 */
.sz-news-tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
}

.sz-news-tabs__item {
  flex: 0 0 auto;
  padding: 0.5rem 1rem;
  min-height: var(--touch-target-min, 44px);
  font-size: clamp(0.75rem, 2vw, 0.875rem);
  border: 1px solid var(--color-border);
  border-radius: var(--asa-radius-button);
  background: var(--color-surface);
  color: var(--color-text-main);
  cursor: pointer;
  transition: all var(--asa-transition);
}

.sz-news-tabs__item:hover,
.sz-news-tabs__item.is-active {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--color-surface);
}

/* ニュースリスト: 浅香山風 */
.sz-news-list__item {
  display: flex;
  align-items: flex-start;
  gap: clamp(0.5rem, 2vw, 1rem);
  padding-block: clamp(0.75rem, 2vw, 1rem);
  border-block-end: 1px solid var(--color-border-light);
}

.sz-news-list__date {
  flex-shrink: 0;
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
  white-space: nowrap;
  min-width: 5.5rem;
}

.sz-news-list__category {
  flex-shrink: 0;
  display: inline-flex;
  padding: 0.125rem 0.5rem;
  font-size: clamp(0.625rem, 1.5vw, 0.6875rem);
  border-radius: var(--radius-sm);
  background: var(--color-primary-light);
  color: var(--color-primary);
  font-weight: var(--font-weight-medium);
}

.sz-news-list__title {
  flex: 1;
  min-width: 0;
  font-size: var(--font-size-base);
  line-height: var(--line-height-normal);
}

.sz-news-list__title a {
  color: var(--color-text-main);
  text-decoration: none;
}

.sz-news-list__title a:hover {
  color: var(--color-primary);
}

/* SP: ニュースリスト縦並び */
@media (max-width: 479px) {
  .sz-news-list__item {
    flex-wrap: wrap;
  }
  
  .sz-news-list__title {
    flex-basis: 100%;
  }
}

/* ================================================================
   15. About/病院紹介セクション
   ================================================================ */

/* SP: 1列 → タブレット: 2列 */
.sz-about__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1.5rem, 4vw, 2.5rem);
}

@media (min-width: 768px) {
  .sz-about__grid {
    grid-template-columns: 1fr 1fr;
    align-items: center;
  }
}

.sz-about__image-gallery {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
  border-radius: var(--asa-radius-card);
  overflow: hidden;
}

.sz-about__image-gallery img {
  aspect-ratio: 4 / 3;
  object-fit: cover;
  width: 100%;
}

/* ================================================================
   16. グループ施設（浅香山: 4→3→1列、SPは横カード）
   ================================================================ */
.sz-group-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(0.75rem, 2vw, 1.25rem);
}

@media (min-width: 480px) {
  .sz-group-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .sz-group-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1024px) {
  .sz-group-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* SP: 横カード（画像左・テキスト右） */
.sz-group-card {
  display: flex;
  flex-direction: row;
  border: 1px solid var(--color-border);
  border-radius: var(--asa-radius-card);
  overflow: hidden;
  text-decoration: none;
  color: var(--color-text-main);
  transition: all var(--asa-transition-card);
}

.sz-group-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--shadow-card-hover);
}

.sz-group-card__image {
  flex-shrink: 0;
  width: clamp(5.5rem, 25vw, 7rem);
  overflow: hidden;
}

.sz-group-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.sz-group-card__body {
  flex: 1;
  min-width: 0;
  padding: clamp(0.5rem, 1.5vw, 0.75rem);
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}

.sz-group-card__name {
  font-size: clamp(0.8125rem, 2vw, 0.9375rem);
  font-weight: var(--font-weight-bold);
}

.sz-group-card__desc {
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
  -webkit-line-clamp: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* タブレット以上: 縦カード */
@media (min-width: 768px) {
  .sz-group-card {
    flex-direction: column;
  }
  
  .sz-group-card__image {
    width: 100%;
    aspect-ratio: 16 / 9;
  }
}

/* ================================================================
   17. 採用セクション（浅香山: 波SVG + 2列バナー）
   ================================================================ */
.sz-recruit-section {
  position: relative;
  padding-block: var(--asa-section-gap);
  padding-inline: clamp(1rem, 4vw, 2rem);
}

.sz-recruit-banners {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(0.75rem, 2vw, 1.25rem);
}

@media (min-width: 480px) {
  .sz-recruit-banners {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 1024px) {
  .sz-recruit-banners {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* ================================================================
   18. フッター（浅香山: モバイル最適化）
   ================================================================ */

/* SPフッター: サイトマップアコーディオン */
.l-footer .footer-sitemap__grid {
  grid-template-columns: 1fr;
}

@media (min-width: 480px) {
  .l-footer .footer-sitemap__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .l-footer .footer-sitemap__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1024px) {
  .l-footer .footer-sitemap__grid {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  }
}

/* SPフッター: 病院ロゴ＋情報 */
.footer-main__in {
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: clamp(1.5rem, 4vw, 2rem);
}

@media (min-width: 768px) {
  .footer-main__in {
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: start;
    text-align: start;
    gap: clamp(1.5rem, 3vw, 3rem);
  }
}

/* SPフッター: ボトムバー */
.footer-bottom__in {
  flex-direction: column;
  align-items: center;
  gap: 0.75rem;
  padding-block: clamp(1rem, 2vw, 1.5rem);
}

@media (min-width: 768px) {
  .footer-bottom__in {
    flex-direction: row;
    justify-content: space-between;
  }
}

/* ================================================================
   19. サブページ（浅香山: SP 1列化）
   ================================================================ */

/* SP: サイドバー非表示、メイン100% */
.page-container-sakura {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1.5rem, 4vw, 2rem);
  padding-inline: clamp(1rem, 4vw, 2rem);
  max-inline-size: 1280px;
  margin-inline: auto;
}

@media (min-width: 1024px) {
  .page-container-sakura {
    grid-template-columns: 240px 1fr;
    gap: 3.75rem;
  }
}

/* SP: サイドバーはアコーディオン化 */
.page-sidebar-sakura {
  display: none;
}

@media (min-width: 1024px) {
  .page-sidebar-sakura {
    display: block;
    position: sticky;
    inset-block-start: calc(var(--header-height, 106px) + 1rem);
  }
}

/* SP: パンくず */
.page-breadcrumb {
  font-size: clamp(0.6875rem, 1.5vw, 0.75rem);
  padding-inline: clamp(1rem, 4vw, 2rem);
  padding-block: 0.75rem;
  overflow-x: auto;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}

/* ================================================================
   20. テーブル（浅香山: SP スクロール対応）
   ================================================================ */
.c-table-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  border-radius: var(--asa-radius-card);
  border: 1px solid var(--color-border);
}

.c-table-wrap table {
  min-width: 600px;
}

/* SP: テーブルセルコンパクト */
.c-table-wrap th,
.c-table-wrap td {
  padding: clamp(0.5rem, 1.5vw, 0.75rem);
  font-size: clamp(0.75rem, 2vw, 0.875rem);
}

/* ================================================================
   21. ボトムバー拡張（浅香山: 固定下部ナビ）
   ================================================================ */
.c-bottom-bar {
  display: flex;
  align-items: stretch;
  background: var(--color-surface);
  border-block-start: 1px solid var(--color-border-light);
  box-shadow: 0 -2px 8px rgba(0, 0, 0, 0.06);
}

@media (min-width: 768px) {
  .c-bottom-bar {
    display: none;
  }
}

.c-bottom-bar__item {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 0.125rem;
  min-height: 3.5rem;
  padding: 0.25rem;
  font-size: 0.625rem;
  color: var(--color-text-sub);
  text-decoration: none;
  transition: color var(--asa-transition);
}

.c-bottom-bar__item:hover,
.c-bottom-bar__item.is-active {
  color: var(--color-primary);
}

/* ================================================================
   22. FAQ アコーディオン（浅香山風）
   ================================================================ */
.c-faq__item {
  border: 1px solid var(--color-border);
  border-radius: var(--asa-radius-card);
  margin-block-end: 0.5rem;
  overflow: hidden;
}

.c-faq__question {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: clamp(0.875rem, 2vw, 1.25rem);
  min-height: var(--touch-target-min, 44px);
  font-size: clamp(0.875rem, 2vw, 1rem);
  font-weight: var(--font-weight-medium);
  background: var(--color-surface);
  border: none;
  cursor: pointer;
  text-align: start;
  transition: background var(--asa-transition);
}

.c-faq__question:hover {
  background: var(--color-primary-light);
}

.c-faq__answer {
  padding: 0 clamp(0.875rem, 2vw, 1.25rem) clamp(0.875rem, 2vw, 1.25rem);
  font-size: var(--font-size-base);
  line-height: var(--line-height-relaxed);
}

/* ================================================================
   23. コンタクトカード（浅香山: SP 1列）
   ================================================================ */
.sz-contact-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(0.75rem, 2vw, 1rem);
}

@media (min-width: 768px) {
  .sz-contact-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

.sz-contact-card {
  padding: clamp(1rem, 3vw, 1.5rem);
  border: 1px solid var(--color-border);
  border-radius: var(--asa-radius-card);
  background: var(--color-surface);
}

.sz-contact-card__tel {
  font-size: clamp(1.25rem, 3vw, 1.75rem);
  font-weight: var(--font-weight-bold);
  color: var(--color-primary);
  letter-spacing: 0.02em;
}

/* SP: 電話リンク有効化 */
.sz-contact-card__tel a {
  color: inherit;
  text-decoration: none;
}

@media (min-width: 768px) {
  .sz-contact-card__tel a {
    pointer-events: none;
    cursor: default;
  }
}

/* ================================================================
   24. スペシャリティクリニック（浅香山: 4→3→2→1列）
   ================================================================ */
.sz-specialty-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(0.75rem, 2vw, 1rem);
}

@media (min-width: 480px) {
  .sz-specialty-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .sz-specialty-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1024px) {
  .sz-specialty-grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* SP: 横カード化 */
.sz-specialty-card {
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.75rem;
  padding: clamp(0.75rem, 2vw, 1rem);
  border: 1px solid var(--color-border);
  border-radius: var(--asa-radius-card);
  text-decoration: none;
  color: var(--color-text-main);
  transition: all var(--asa-transition);
}

.sz-specialty-card:hover {
  border-color: var(--color-primary);
  background: var(--color-primary-light);
}

@media (min-width: 768px) {
  .sz-specialty-card {
    flex-direction: column;
    text-align: center;
    padding: clamp(1rem, 2vw, 1.5rem);
  }
}

/* ================================================================
   25. 地域包括ケア / 地域医療連携 
   ================================================================ */
.sz-community-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1rem, 3vw, 1.5rem);
}

@media (min-width: 768px) {
  .sz-community-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

/* ================================================================
   26. モバイル間隔ユーティリティ
   ================================================================ */

/* SP: セクション間隔 */
.u-sp-section-gap {
  margin-block-end: var(--asa-section-gap);
}

/* SP: パディング */
.u-sp-pad-inline {
  padding-inline: clamp(1rem, 4vw, 2rem);
}

/* SP: マージンインライン */
.u-sp-center {
  margin-inline: auto;
  max-inline-size: var(--asa-inner-mobile);
}

@media (min-width: 768px) {
  .u-sp-center {
    max-inline-size: none;
  }
}

/* ================================================================
   27. ガイドセクション 浅香山準拠オーバーライド
   ================================================================
   _saikazo-home.css のデスクトップファースト max-width ルールを
   モバイルファースト min-width で上書き
   ================================================================ */

/* ホームページ: ヒーローとメインコンテンツの間にスペース */
.home-page .l-main,
.home-page .saikazo-main {
  margin-block-start: clamp(1.5rem, 4vw, 2.5rem);
}

/* Mobile base: 1カラム、カードは3列（浅香山 nav 準拠コンパクト） */
.guide-section.sz-section {
  padding-block: clamp(0.75rem, 2vw, 1rem);
  padding-inline: clamp(0.75rem, 3vw, 1.25rem);
}

.guide-section__inner {
  grid-template-columns: 1fr;
  gap: clamp(0.5rem, 2vw, 0.75rem);
}

.guide-cards {
  grid-template-columns: repeat(3, 1fr);
  gap: clamp(0.375rem, 1.5vw, 0.5rem);
}

.guide-card {
  padding: clamp(0.5rem, 1.5vw, 0.75rem) clamp(0.375rem, 1vw, 0.5rem);
  border-radius: var(--asa-radius-card);
  min-height: auto;
  flex-direction: column;
  gap: clamp(0.25rem, 1vw, 0.5rem);
}

.guide-card__icon {
  width: clamp(1.75rem, 6vw, 2.5rem);
  height: clamp(1.75rem, 6vw, 2.5rem);
  margin-block-end: clamp(0.125rem, 0.5vw, 0.25rem);
}

.guide-card__icon-fallback {
  display: flex;
  font-size: clamp(1.125rem, 3.5vw, 1.5rem);
}

.guide-card__txt {
  font-size: clamp(0.6875rem, 1.8vw, 0.8125rem);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
}

.guide-card__arrow {
  right: 4px;
  bottom: 4px;
  font-size: 0.75rem;
  opacity: 1;
  color: var(--color-text-sub);
}

/* ガイド情報（受付時間・休診日）SP: 2カラム横並び */
.guide-info {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(0.5rem, 2vw, 0.75rem);
}

.guide-info__ttl {
  font-size: clamp(0.8125rem, 2vw, 0.9375rem);
  margin-block-end: clamp(0.375rem, 1vw, 0.5rem);
}

.guide-info__time-row {
  flex-wrap: wrap;
  gap: clamp(0.25rem, 1vw, 0.5rem);
  margin-block-end: clamp(0.25rem, 1vw, 0.375rem);
}

.guide-info__badge {
  padding: clamp(0.125rem, 0.5vw, 0.25rem) clamp(0.5rem, 1.5vw, 0.75rem);
  font-size: clamp(0.625rem, 1.5vw, 0.75rem);
}

.guide-info__time {
  font-size: clamp(0.75rem, 2vw, 0.9375rem);
}

.guide-info__time strong {
  font-size: clamp(0.875rem, 2.5vw, 1.25rem);
}

.guide-info__main {
  font-size: clamp(0.75rem, 1.8vw, 0.875rem);
  line-height: var(--line-height-normal);
}

.guide-info__link {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  padding: clamp(0.5rem, 1.5vw, 0.625rem) clamp(0.75rem, 2vw, 1rem);
  font-size: clamp(0.6875rem, 1.8vw, 0.8125rem);
  min-height: var(--touch-target-min, 44px);
  border-radius: var(--asa-radius-card);
}

/* Tablet (480px+): カード3列維持 */
@media (min-width: 480px) {
  .guide-cards {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* Tablet (768px+): セクション2カラム（浅香山 nav=197px 準拠コンパクト） */
@media (min-width: 768px) {
  .guide-section.sz-section {
    padding: clamp(0.75rem, 1.5vw, 1rem) clamp(1rem, 3vw, 1.5rem);
  }

  .guide-section__inner {
    grid-template-columns: 1fr 1fr;
    gap: clamp(0.75rem, 2vw, 1.25rem);
  }

  .guide-card {
    padding: clamp(0.5rem, 1vw, 0.75rem) clamp(0.375rem, 0.8vw, 0.5rem);
    min-height: auto;
  }

  .guide-card__icon {
    width: clamp(2rem, 3vw, 2.5rem);
    height: clamp(2rem, 3vw, 2.5rem);
  }

  .guide-card__txt {
    font-size: clamp(0.6875rem, 1.2vw, 0.8125rem);
  }
}

/* Desktop (1025px+): デスクトップ正規サイズ */
@media (min-width: 1025px) {
  .guide-section {
    padding: 2.5rem 2.5rem;
  }

  .guide-section__inner {
    max-inline-size: 1440px;
    margin-inline: auto;
  }

  .guide-cards {
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
  }

  .guide-card {
    padding: 1.875rem 1.25rem;
  }

  .guide-card__icon {
    width: 4.375rem;
    height: 4.375rem;
  }

  .guide-card__txt {
    font-size: 0.9375rem;
  }
}

/* ================================================================
   28. 受付時間（旧） 浅香山準拠オーバーライド
   ================================================================ */

/* Mobile base */
.reception-info {
  padding: clamp(1.5rem, 5vw, 2.5rem) clamp(1rem, 4vw, 1.25rem);
}

.reception-info__inner {
  grid-template-columns: 1fr;
  gap: clamp(1rem, 3vw, 1.25rem);
}

.reception-info__links {
  grid-column: span 1;
}

.reception-info__btn {
  min-width: auto;
}

@media (min-width: 641px) {
  .reception-info__inner {
    grid-template-columns: 1fr 1fr;
  }

  .reception-info__links {
    grid-column: span 2;
    flex-direction: row;
    flex-wrap: wrap;
  }

  .reception-info__btn {
    flex: 1;
    min-width: 200px;
  }
}

@media (min-width: 1025px) {
  .reception-info {
    padding: 2.5rem;
  }

  .reception-info__inner {
    grid-template-columns: 1fr 1fr 1fr;
    gap: 2.5rem;
  }
}

/* ================================================================
   29. ヒーローセクション SP/タブレット 浅香山準拠
   ================================================================ */

/* SP base: ヒーロー高さ最適化 */
.sz-hero {
  padding-inline: clamp(0.75rem, 3vw, 1.25rem);
}

.sz-hero__main {
  border-radius: clamp(0.75rem, 2vw, 1.25rem);
  min-height: clamp(280px, 60vw, 480px);
  min-height: clamp(280px, 60dvw, 480px);
  height: calc(65vh - var(--header-height, 64px));
  height: calc(65dvh - var(--header-height, 64px));
  max-height: 560px;
}

/* SP: ヒーローテキスト位置調整 */
.sz-hero__content {
  left: clamp(1rem, 3vw, 2rem);
  top: clamp(1rem, 3vw, 2rem);
}

.sz-hero__txt-main-text {
  font-size: clamp(1.125rem, 3vw, 1.5rem);
  line-height: 1.6;
}

.sz-hero__txt-sub-text {
  font-size: clamp(0.625rem, 1.5vw, 0.6875rem);
}

/* SP: ニュースパネル（ヒーロー下に配置） */
.sz-hero__news-panel {
  position: static;
  width: 100%;
  border-radius: 0 0 var(--asa-radius-card) var(--asa-radius-card);
  margin-block-start: -1px;
  flex-direction: column;
}

.sz-hero__news-panel-badge {
  padding: clamp(0.375rem, 1vw, 0.5rem) clamp(0.75rem, 2vw, 1rem);
  font-size: clamp(0.6875rem, 1.5vw, 0.75rem);
  min-width: auto;
  width: 100%;
  text-align: center;
}

.sz-hero__news-panel-inner {
  height: auto;
}

.sz-hero__news-panel-item {
  padding: clamp(0.5rem, 1.5vw, 0.75rem) clamp(0.75rem, 2vw, 1rem);
}

/* SP: 採用バナー（画面右端から出る半円型） */
.sz-hero__recruit {
  position: absolute;
  inset-inline-end: 0;
  inset-block-start: 50%;
  inset-block-end: auto;
  transform: translateY(-50%);
  width: clamp(5rem, 15vw, 5.625rem);
  height: clamp(5rem, 15vw, 5.625rem);
  padding-inline-end: 0.5rem;
  border-radius: 50% 0 0 50%;
  font-size: clamp(0.625rem, 1.5vw, 0.75rem);
  aspect-ratio: auto;
  flex-shrink: unset;
}

/* SP: フローティングCTA 横スクロール対応 */
.sz-floating-cta {
  display: flex;
  gap: clamp(0.375rem, 1vw, 0.5rem);
  padding-block-start: clamp(0.75rem, 2vw, 1rem);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.sz-floating-cta::-webkit-scrollbar {
  display: none;
}

.sz-floating-cta__btn {
  flex: 0 0 auto;
  min-width: max-content;
  padding: clamp(0.5rem, 1.5vw, 0.75rem) clamp(0.75rem, 2vw, 1rem);
  font-size: clamp(0.6875rem, 1.8vw, 0.8125rem);
  border-radius: var(--asa-radius-card);
  min-height: var(--touch-target-min, 44px);
}

/* Tablet (768px+): ヒーロー（浅香山 768px hero=450px 準拠） */
@media (min-width: 768px) {
  .sz-hero__main {
    height: calc(42vh - var(--header-height, 64px));
    height: calc(42dvh - var(--header-height, 64px));
    max-height: 380px;
    min-height: 280px;
    border-radius: clamp(1rem, 1.5vw, 1.25rem);
  }

  .sz-hero__content {
    left: clamp(2rem, 4vw, 5rem);
    top: clamp(2rem, 4vw, 3.75rem);
  }

  .sz-hero__txt-main-text {
    font-size: clamp(1.375rem, 2.5vw, 1.75rem);
  }

  .sz-hero__news-panel {
    position: absolute;
    inset-inline-start: 0;
    inset-block-end: 0;
    width: clamp(360px, 50vw, 480px);
    border-radius: 0 1rem 0 0;
    margin-block-start: 0;
    flex-direction: row;
  }

  .sz-hero__news-panel-badge {
    width: auto;
    min-width: 80px;
    writing-mode: horizontal-tb;
  }

  .sz-hero__news-panel-inner {
    height: 70px;
  }

  .sz-floating-cta {
    flex-wrap: wrap;
    overflow-x: visible;
  }
}

/* Desktop (1025px+): PCヒーロー復元（タブレット上書きをデスクトップサイズに戻す） */
@media (min-width: 1025px) {
  .sz-hero {
    padding: calc(var(--header-height, 86px) + 0.75rem) clamp(1rem, 2vw, 1.25rem) 0;
  }

  .sz-hero__notice {
    position: absolute;
    inset-block-start: calc(var(--header-height, 86px) + 0.75rem);
    inset-inline-start: clamp(1rem, 2vw, 1.25rem);
    width: auto;
    z-index: 10;
  }

  .sz-hero__main {
    height: calc(67dvh - var(--header-height, 86px) - 0.75rem);
    height: calc(67vh - var(--header-height, 86px) - 0.75rem);
    min-height: 340px;
    max-height: 540px;
    border-radius: 1.25rem;
  }

  .sz-hero__content {
    left: 80px;
    top: 60px;
  }

  .sz-hero__txt-main-text {
    font-size: clamp(1.4rem, 2vw, 1.8rem);
  }

  .sz-hero__recruit {
    inset-inline-end: 0;
    inset-block-start: 50%;
    inset-block-end: auto;
    transform: translateY(-50%);
    width: 130px;
    height: 130px;
    padding-inline-end: 0.625rem;
    border-radius: 50% 0 0 50%;
    aspect-ratio: auto;
  }

  .sz-floating-cta {
    position: absolute;
    right: 20px;
    bottom: 20px;
    flex-direction: column;
    gap: 10px;
    overflow-x: visible;
  }
}

/* ================================================================
   30. About/当院について SP/タブレット 浅香山準拠
   ================================================================ */

/* SP: 1カラム、テキスト先 */
.sz-about__inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1.5rem, 4vw, 2rem);
}

.sz-about__en {
  font-family: var(--asa-font-heading-en);
  font-size: clamp(0.6875rem, 1.5vw, 0.8125rem);
  font-weight: 500;
  letter-spacing: 0.1em;
  color: var(--color-primary);
}

.sz-about__ttl {
  font-size: clamp(1.25rem, 3.5vw, 1.75rem);
  line-height: var(--line-height-tight);
  word-break: auto-phrase;
  text-wrap: balance;
}

.sz-about__desc {
  font-size: var(--font-size-base);
  line-height: var(--line-height-relaxed);
}

.sz-about__br-pc {
  display: none;
}

.sz-about__btns {
  display: flex;
  flex-direction: column;
  gap: clamp(0.5rem, 1.5vw, 0.75rem);
}

.sz-about__btn {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: clamp(0.75rem, 2vw, 1rem) clamp(1.25rem, 3vw, 1.5rem);
  border-radius: var(--asa-radius-button);
  font-size: clamp(0.875rem, 2vw, 1rem);
  min-height: var(--touch-target-min, 44px);
}

/* About: 地図/画像セクションSP */
.sz-about__map-visual {
  border-radius: var(--asa-radius-card);
  overflow: hidden;
}

.sz-about__access {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(0.5rem, 1.5vw, 0.75rem);
}

@media (min-width: 480px) {
  .sz-about__access {
    grid-template-columns: repeat(3, 1fr);
  }
  
  .sz-about__btns {
    flex-direction: row;
  }
  
  .sz-about__br-pc {
    display: inline;
  }
}

@media (min-width: 768px) {
  .sz-about__inner {
    grid-template-columns: 1fr 1fr;
    align-items: center;
  }

  .sz-about__ttl {
    font-size: clamp(1.5rem, 2.5vw, 2rem);
  }
}

/* ================================================================
   31. 特徴セクション — Phase 4c（_saikazo-home.css）で管理
   丸UIコンパクト横スクロール → 768px+でグリッド復元
   ================================================================ */

/* ================================================================
   32. 診療科セクション — Phase 4f（_saikazo-home.css）で管理
   SP: 横スクロール → 768px+で3列 → 1024px+で4列グリッド復元
   ================================================================ */

/* コスメティック（Phase 4fと競合しないスタイルのみ保持） */
.sz-dept-home__btn-all {
  font-size: clamp(0.875rem, 2vw, 1rem);
  padding: clamp(0.75rem, 2vw, 1rem) clamp(1.5rem, 4vw, 2rem);
  border-radius: var(--asa-radius-button, var(--radius-full));
  min-height: var(--touch-target-min, 44px);
}

/* ================================================================
   33. 地域医療連携セクション SP/タブレット 浅香山準拠
   ================================================================ */

/* SP: ヒーロー縦並び */
.sz-community__hero {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1rem, 3vw, 1.5rem);
}

.sz-community__ttl {
  font-size: clamp(1.25rem, 3vw, 1.75rem);
}

.sz-community__desc {
  font-size: var(--font-size-base);
  line-height: var(--line-height-relaxed);
}

/* SP: カード 1列 → 2列 */
.sz-community__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(0.75rem, 2vw, 1rem);
}

.sz-community__card {
  border-radius: var(--asa-radius-card);
  overflow: hidden;
}

.sz-community__card-body {
  padding: clamp(0.75rem, 2vw, 1rem);
}

.sz-community__card-title {
  font-size: clamp(0.8125rem, 2vw, 1rem);
}

@media (min-width: 480px) {
  .sz-community__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .sz-community__hero {
    grid-template-columns: 1fr 1fr;
    align-items: center;
  }

  .sz-community__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* ================================================================
   34. ニュースセクション v2 SP/タブレット 浅香山準拠
   ================================================================ */

/* SP: 縦並び（タイトル上、リスト下） */
.news-v2__inner {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(1rem, 3vw, 1.5rem);
}

/* SP: 左カラム横並びに変更 */
.news-v2__left {
  display: flex;
  align-items: center;
  gap: clamp(0.75rem, 2vw, 1rem);
  flex-wrap: wrap;
}

.news-v2__title-block {
  display: flex;
  align-items: baseline;
  gap: clamp(0.5rem, 1.5vw, 0.75rem);
}

/* SP: 縦書きタイトルを横書きに */
.news-v2__ttl-vertical {
  writing-mode: horizontal-tb;
  font-size: clamp(1.25rem, 3vw, 1.5rem);
}

.news-v2__en-vertical {
  writing-mode: horizontal-tb;
  font-family: var(--asa-font-heading-en);
  font-size: clamp(0.6875rem, 1.5vw, 0.8125rem);
  color: var(--color-primary);
}

/* SP: サイドリンクを横並び */
.news-v2__side-links {
  display: flex;
  flex-wrap: wrap;
  gap: clamp(0.375rem, 1vw, 0.5rem);
}

.news-v2__side-btn {
  padding: clamp(0.375rem, 1vw, 0.5rem) clamp(0.75rem, 2vw, 1rem);
  font-size: clamp(0.6875rem, 1.8vw, 0.8125rem);
  border-radius: var(--asa-radius-button);
  min-height: var(--touch-target-min, 44px);
  display: inline-flex;
  align-items: center;
  gap: 0.25rem;
}

/* SP: タブ横スクロール */
.news-v2__tabs {
  display: flex;
  gap: clamp(0.25rem, 0.5vw, 0.375rem);
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding-block-end: 0.25rem;
}

.news-v2__tabs::-webkit-scrollbar {
  display: none;
}

.news-v2__tab {
  flex: 0 0 auto;
  padding: clamp(0.375rem, 1vw, 0.5rem) clamp(0.75rem, 2vw, 1rem);
  font-size: clamp(0.6875rem, 1.8vw, 0.8125rem);
  border-radius: var(--asa-radius-button);
  min-height: var(--touch-target-min, 44px);
  white-space: nowrap;
}

/* SP: ニュースリスト */
.news-v2__item {
  border-block-end: 1px solid var(--color-border-light);
}

.news-v2__link {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: clamp(0.375rem, 1vw, 0.5rem);
  padding-block: clamp(0.625rem, 1.5vw, 0.75rem);
  min-height: var(--touch-target-min, 44px);
}

.news-v2__category {
  font-size: clamp(0.625rem, 1.5vw, 0.6875rem);
  padding: 0.125rem 0.5rem;
  border-radius: var(--radius-sm);
}

.news-v2__title {
  flex: 1 1 100%;
  font-size: var(--font-size-base);
  line-height: var(--line-height-normal);
  min-width: 0;
}

.news-v2__date {
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
  flex-shrink: 0;
}

@media (min-width: 480px) {
  .news-v2__title {
    flex: 1 1 auto;
  }
}

@media (min-width: 768px) {
  .news-v2__inner {
    grid-template-columns: auto 1fr;
    gap: 2.5rem;
  }

  .news-v2__left {
    flex-direction: column;
    align-items: flex-start;
  }

  .news-v2__ttl-vertical {
    writing-mode: vertical-rl;
    font-size: clamp(1.5rem, 2vw, 2rem);
  }

  .news-v2__en-vertical {
    writing-mode: vertical-rl;
  }

  .news-v2__side-links {
    flex-direction: column;
  }
}

/* ================================================================
   35. よくアクセス SP/タブレット 浅香山準拠
   ================================================================ */
.sz-popular-v2__grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: clamp(0.5rem, 1.5vw, 0.75rem);
}

.sz-popular-v2__card {
  padding: clamp(0.75rem, 2vw, 1rem);
  border-radius: var(--asa-radius-card);
  min-height: var(--touch-target-min, 44px);
}

.sz-popular-v2__header {
  margin-block-end: clamp(1rem, 3vw, 1.5rem);
}

.sz-popular-v2__ttl {
  font-size: clamp(1.125rem, 2.5vw, 1.5rem);
}

@media (min-width: 480px) {
  .sz-popular-v2__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .sz-popular-v2__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1025px) {
  .sz-popular-v2__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* ================================================================
   36. Feature/特徴（旧） SP 浅香山準拠オーバーライド
   ================================================================ */

/* Mobile base */
.feature {
  padding: clamp(2.5rem, 6vw, 3.75rem) clamp(1rem, 4vw, 1.25rem);
}

.feature__slide {
  grid-template-columns: 1fr;
  gap: 0;
}

.feature__slide-img {
  height: clamp(200px, 40vw, 250px);
  border-radius: var(--asa-radius-card) var(--asa-radius-card) 0 0;
}

@media (min-width: 768px) {
  .feature {
    padding: 3.75rem 2.5rem;
  }

  .feature__slide {
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }

  .feature__slide-img {
    height: auto;
    border-radius: var(--asa-radius-card);
  }
}

/* ================================================================
   37. ニュース（旧） SP 浅香山準拠オーバーライド
   ================================================================ */

/* Mobile base */
.news {
  padding: clamp(2.5rem, 6vw, 3.75rem) clamp(1rem, 4vw, 1.25rem);
}

.news__link {
  flex-wrap: wrap;
  gap: clamp(0.375rem, 1vw, 0.625rem);
}

.news__date {
  min-width: auto;
}

.news__title {
  flex-basis: 100%;
  font-size: var(--font-size-base);
}

@media (min-width: 768px) {
  .news {
    padding: 3.75rem 2.5rem;
  }

  .news__link {
    flex-wrap: nowrap;
  }

  .news__title {
    flex-basis: auto;
    font-size: 0.9375rem;
  }
}

/* ================================================================
   38. バナー SP 浅香山準拠オーバーライド
   ================================================================ */

.banners {
  padding: clamp(1.5rem, 5vw, 2.5rem) clamp(1rem, 4vw, 1.25rem);
}

.banners__grid {
  grid-template-columns: 1fr;
}

.banners__item {
  height: clamp(120px, 30vw, 150px);
  border-radius: var(--asa-radius-card);
}

@media (min-width: 768px) {
  .banners {
    padding: 2.5rem;
  }

  .banners__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .banners__item {
    height: 180px;
  }
}

/* ================================================================
   39. 施設紹介 SP 浅香山準拠オーバーライド
   ================================================================ */

/* Mobile base */
.sz-facilities__hero {
  flex-direction: column;
  gap: clamp(1rem, 3vw, 1.5rem);
}

.sz-facilities__hero-photo {
  flex: none;
  max-width: 100%;
}

.sz-facilities {
  padding: clamp(2.5rem, 6vw, 3.75rem) 0 clamp(1.5rem, 4vw, 2.5rem);
}

.sz-facilities__inner {
  padding-inline: clamp(1rem, 4vw, 1.25rem);
}

.sz-facilities__grid {
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(0.5rem, 1.5vw, 1rem);
}

@media (min-width: 768px) {
  .sz-facilities__hero {
    flex-direction: row;
    gap: 2.5rem;
  }

  .sz-facilities__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1025px) {
  .sz-facilities {
    padding: 3.75rem 0 2.5rem;
  }

  .sz-facilities__inner {
    padding-inline: 2.5rem;
  }

  .sz-facilities__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* ================================================================
   40. セクション共通 浅香山準拠 パディング統一
   ================================================================ */

/* 全 sz-section のモバイルベース余白 */
.sz-section {
  padding-block: var(--asa-section-gap);
  padding-inline: clamp(1rem, 4vw, 1.25rem);
}

.section-inner {
  max-inline-size: 100%;
  margin-inline: auto;
}

@media (min-width: 768px) {
  .sz-section {
    padding-inline: clamp(1.5rem, 4vw, 2.5rem);
  }
}

@media (min-width: 1025px) {
  .sz-section {
    padding-inline: 2.5rem;
  }

  .section-inner {
    max-inline-size: var(--content-max-width, 1280px);
  }
}

/* ================================================================
   41. セクションヘッダー SP 浅香山準拠
   ================================================================ */
.sz-section-header__ttl {
  font-size: clamp(1.25rem, 3.5vw, 2rem);
  line-height: var(--line-height-tight);
  word-break: auto-phrase;
  text-wrap: balance;
}

.sz-section-header__sub {
  font-size: clamp(0.8125rem, 2vw, 1rem);
  line-height: var(--line-height-normal);
}

/* ================================================================
   42. ヒーロー旧スタイル override（.hero クラス）
   ================================================================ */
.hero {
  margin-top: calc(-1 * var(--header-height, 64px));
  padding-top: var(--header-height, 64px);
  min-height: clamp(400px, 70vh, 600px);
  min-height: clamp(400px, 70dvh, 600px);
}

@media (min-width: 1025px) {
  .hero {
    margin-top: calc(-1 * var(--header-height, 106px));
    padding-top: var(--header-height, 106px);
    min-height: 600px;
  }
}

/* ================================================================
   43. 外部バナー（sz-banners）SP/タブレット 浅香山準拠
   ================================================================ */

/* Mobile base: 2列 */
.sz-banners__grid {
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(0.5rem, 1.5vw, 0.75rem);
}

.sz-banners__inner {
  padding-inline: clamp(1rem, 4vw, 1.25rem);
}

@media (min-width: 768px) {
  .sz-banners__inner {
    padding-inline: clamp(1.5rem, 3vw, 2.5rem);
  }

  .sz-banners__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1025px) {
  .sz-banners__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* ================================================================
   44. リンクカード SP/タブレット 浅香山準拠
   ================================================================ */

/* Mobile base: 2列 */
.link-cards {
  padding: clamp(1.5rem, 5vw, 2.5rem) clamp(1rem, 4vw, 1.25rem);
}

.link-cards__inner {
  grid-template-columns: repeat(2, 1fr);
  gap: clamp(0.5rem, 1.5vw, 0.75rem);
}

.link-cards__item {
  padding: clamp(1rem, 2.5vw, 1.25rem) clamp(0.75rem, 2vw, 1rem);
  min-height: clamp(80px, 18vw, 100px);
  border-radius: var(--asa-radius-card);
}

.link-cards__text {
  font-size: clamp(0.75rem, 2vw, 0.9375rem);
}

@media (min-width: 768px) {
  .link-cards {
    padding: clamp(2rem, 4vw, 2.5rem);
  }

  .link-cards__inner {
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
  }
}

@media (min-width: 1025px) {
  .link-cards__inner {
    grid-template-columns: repeat(5, 1fr);
  }
}

/* ================================================================
   45. リクルートセクション SP/タブレット 浅香山準拠
   ================================================================ */

/* Mobile base: 1列 */
.sz-recruit {
  padding: clamp(2.5rem, 6vw, 3.75rem) 0;
}

.sz-recruit__inner {
  padding-inline: clamp(1rem, 4vw, 1.5rem);
}

.sz-recruit__grid {
  grid-template-columns: 1fr;
  gap: clamp(0.75rem, 2vw, 1rem);
}

.sz-recruit__card {
  aspect-ratio: 4 / 3;
  border-radius: var(--asa-radius-card);
}

@media (min-width: 480px) {
  .sz-recruit__grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .sz-recruit__card {
    aspect-ratio: auto;
  }
}

@media (min-width: 768px) {
  .sz-recruit__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1025px) {
  .sz-recruit__grid {
    grid-template-columns: repeat(4, 1fr);
    gap: 1rem;
  }
}

/* ================================================================
   46. よくアクセスされるページ（フッター版）SP/タブレット
   ================================================================ */

/* Mobile base: 1列 */
.sz-popular-footer {
  padding: clamp(1.5rem, 5vw, 2.5rem) clamp(1rem, 4vw, 1.25rem);
}

.sz-popular-footer__inner {
  grid-template-columns: 1fr;
  gap: clamp(1rem, 3vw, 2rem);
}

.sz-popular-footer__header {
  flex-direction: row;
  align-items: center;
  gap: clamp(0.5rem, 1.5vw, 1rem);
}

.sz-popular-footer__icon {
  margin-block-end: 0;
}

.sz-popular-footer__grid {
  grid-template-columns: 1fr;
  gap: clamp(0.5rem, 1.5vw, 0.75rem);
}

@media (min-width: 480px) {
  .sz-popular-footer__grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (min-width: 768px) {
  .sz-popular-footer__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

@media (min-width: 1025px) {
  .sz-popular-footer__inner {
    grid-template-columns: auto 1fr;
    gap: 2.5rem;
  }

  .sz-popular-footer__header {
    flex-direction: column;
    align-items: flex-start;
  }

  .sz-popular-footer__grid {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* ================================================================
   47. オンラインサービス SP/タブレット 浅香山準拠
   ================================================================ */

/* Mobile base */
.sz-online {
  padding: clamp(2.5rem, 6vw, 3.75rem) clamp(1rem, 4vw, 1.25rem);
}

.sz-online__grid {
  grid-template-columns: 1fr;
  gap: clamp(0.75rem, 2vw, 1rem);
}

.sz-online__card {
  padding: clamp(1rem, 2.5vw, 1.25rem) clamp(1.25rem, 3vw, 1.5rem);
  gap: clamp(0.75rem, 2vw, 1rem);
  border-radius: var(--asa-radius-card);
  min-height: var(--touch-target-min, 44px);
}

.sz-online__card-icon {
  width: clamp(2.5rem, 6vw, 3rem);
  height: clamp(2.5rem, 6vw, 3rem);
  font-size: clamp(1.25rem, 3vw, 1.5rem);
}

.sz-online__card-desc {
  font-size: clamp(0.8125rem, 2vw, 0.875rem);
}

@media (min-width: 768px) {
  .sz-online {
    padding: 3.75rem 2.5rem;
  }

  .sz-online__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }
}

/* ================================================================
   48. ダウンロードセクション SP/タブレット 浅香山準拠
   ================================================================ */

/* Mobile base: 1列 */
.sz-download-v2 {
  padding: clamp(2.5rem, 6vw, 3.75rem) clamp(1rem, 4vw, 1.25rem);
}

.sz-download-v2__grid {
  grid-template-columns: 1fr;
  gap: clamp(0.75rem, 2vw, 1rem);
}

.sz-download-v2__card {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  border-radius: var(--asa-radius-card);
  overflow: hidden;
}

.sz-download-v2__card-img {
  width: clamp(80px, 20vw, 100px);
  height: auto;
  flex-shrink: 0;
}

.sz-download-v2__card-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(0.75rem, 2vw, 1rem);
}

@media (min-width: 768px) {
  .sz-download-v2 {
    padding: 3.75rem 2.5rem;
  }

  .sz-download-v2__grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
  }

  .sz-download-v2__card {
    flex-direction: column;
  }

  .sz-download-v2__card-img {
    width: 100%;
    height: auto;
  }
}

@media (min-width: 1025px) {
  .sz-download-v2__grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

/* ================================================================
   49. フローティングCTA（ボトムバー）SP 浅香山準拠
   ================================================================ */

/* SP: 底面固定バー */
@media (max-width: 767px) {
  /* 例外的に max-width 使用: ボトムバーはSP専用UI */
}

/* 上記の代替: SP base + tablet以上で非表示 */
.sz-floating-cta--bottom {
  position: fixed;
  inset-inline: 0;
  inset-block-end: 0;
  z-index: 100;
  display: flex;
  flex-direction: row;
  gap: 0;
}

.sz-floating-cta--bottom .sz-floating-cta__btn {
  flex: 1;
  border-radius: 0;
  justify-content: center;
  padding: clamp(0.5rem, 1.5vw, 0.625rem) clamp(0.375rem, 1vw, 0.5rem);
  font-size: clamp(0.6875rem, 1.8vw, 0.75rem);
  box-shadow: none;
  min-height: var(--touch-target-min, 44px);
}

.sz-floating-cta--bottom .sz-floating-cta__icon {
  font-size: 1.25rem;
  background: transparent;
  width: auto;
  height: auto;
}

.sz-floating-cta--bottom .sz-floating-cta__arrow {
  display: none;
}

/* ================================================================
   SP: ニュース+SNS オーバーフロー修正
   News grid の auto 最小幅がコンテナを超えるのを防止
   ================================================================ */
.sz-news-v3,
.sz-sns-feed {
  min-width: 0;
}

.sz-news-v3__link {
  grid-template-columns: auto auto minmax(0, 1fr) auto;
}

.sz-news-v3__title {
  min-width: 0;
}

/* ================================================================
   SP: 採用CTA バナー — 縦積みレイアウト
   flex-direction: row では body が 13px に圧縮されるため
   ================================================================ */
.sz-recruit-cta__inner {
  flex-direction: column;
  align-items: center;
  text-align: center;
}

.sz-recruit-cta__btn {
  align-self: center;
}

@media (min-width: 768px) {
  .sz-recruit-cta__inner {
    flex-direction: row;
    text-align: start;
  }

  .sz-recruit-cta__btn {
    align-self: auto;
  }
}

/* ================================================================
   SP: PWA インストールバナー — 縦積みレイアウト
   横並びだとテキストが 73px に圧縮されるため
   ================================================================ */
.c-pwa-banner {
  flex-direction: column;
  align-items: flex-start;
  max-width: calc(100vw - 2rem);
}

.c-pwa-banner__text {
  flex-shrink: 0;
}

@media (min-width: 768px) {
  .c-pwa-banner {
    flex-direction: row;
    align-items: center;
    max-width: calc(100vw - 56px - 3rem - 1rem);
  }

  .c-pwa-banner__text {
    flex-shrink: 1;
  }
}

/* ================================================================
   SP: Speech FAB → speech/_fab.css で管理
   ================================================================ */

/* === object/project/_stats-counter.css === */

/* ==========================================================================
 * Stats Counter Section — 病院の数字で見る
 * アニメーションカウントアップ付きの統計セクション
 * ========================================================================== */

.sz-stats {
  background: linear-gradient(135deg, var(--color-primary) 0%, var(--color-brand-accent) 100%);
  color: var(--color-white);
  padding-block: var(--spacing-xxxl);
  position: relative;
  overflow: hidden;
}

.sz-stats::before {
  content: "";
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 20% 80%, rgba(255, 255, 255, 0.06) 0%, transparent 50%),
    radial-gradient(circle at 80% 20%, rgba(255, 255, 255, 0.04) 0%, transparent 50%);
  pointer-events: none;
}

.sz-stats__inner {
  max-width: var(--content-max-width);
  margin-inline: auto;
  padding-inline: var(--spacing-md);
  position: relative;
}

.sz-stats__header {
  text-align: center;
  margin-block-end: var(--spacing-xl);
}

.sz-stats__label {
  display: block;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  opacity: 0.7;
  margin-block-end: var(--spacing-xs);
}

.sz-stats__ttl {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  line-height: var(--line-height-tight);
  margin: 0;
}

.sz-stats__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--spacing-lg);
}

.sz-stats__item {
  text-align: center;
  padding: var(--spacing-lg) var(--spacing-md);
  background: rgba(255, 255, 255, 0.1);
  border-radius: var(--radius-md);
  backdrop-filter: blur(4px);
  transition: transform var(--transition-normal), background var(--transition-normal);
}

.sz-stats__item:hover {
  transform: translateY(-4px);
  background: rgba(255, 255, 255, 0.15);
}

.sz-stats__icon {
  font-size: 2rem;
  opacity: 0.85;
  margin-block-end: var(--spacing-sm);
  display: block;
}

.sz-stats__number {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 0.15em;
  font-size: clamp(2rem, 1.5rem + 2.5vw, 3.5rem);
  font-weight: var(--font-weight-bold);
  line-height: 1;
  margin-block-end: var(--spacing-xs);
  font-variant-numeric: tabular-nums;
}

.sz-stats__value {
  display: inline-block;
  min-width: 1.5ch;
}

.sz-stats__suffix {
  font-size: 0.4em;
  font-weight: var(--font-weight-medium);
  opacity: 0.85;
}

.sz-stats__desc {
  font-size: var(--font-size-sm);
  opacity: 0.85;
  margin: 0;
  line-height: var(--line-height-normal);
}

/* ──────────────── Tablet (768px+) ──────────────── */
@media (min-width: 768px) {
  .sz-stats__grid {
    grid-template-columns: repeat(4, 1fr);
  }

  .sz-stats__item {
    padding: var(--spacing-xl) var(--spacing-md);
  }
}

/* ──────────────── Desktop (1024px+) ──────────────── */
@media (min-width: 1024px) {
  .sz-stats {
    padding-block: calc(var(--spacing-xxxl) * 1.25);
  }

  .sz-stats__item {
    padding: var(--spacing-xxl) var(--spacing-lg);
  }
}

/* ──────────────── prefers-reduced-motion ──────────────── */
@media (prefers-reduced-motion: reduce) {
  .sz-stats__item {
    transition: none;
  }
}

/* ============================================================
 * Phase 4d: Numbers モバイル横スクロール
 * ============================================================ */

.sz-stats__grid {
  display: flex;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  gap: var(--spacing-md);
  scrollbar-width: none;
  -webkit-mask-image: linear-gradient(to right, #000 0%, #000 85%, transparent 100%);
  mask-image: linear-gradient(to right, #000 0%, #000 85%, transparent 100%);
}

.sz-stats__grid::-webkit-scrollbar {
  display: none;
}

.sz-stats__item {
  flex: 0 0 calc(33.333% - var(--spacing-sm));
  min-width: 7.5rem;
  scroll-snap-align: start;
}

/* lg(768px): 4列グリッド復元 */
@media (min-width: 768px) {
  .sz-stats__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    overflow-x: visible;
    scroll-snap-type: none;
    -webkit-mask-image: none;
    mask-image: none;
  }

  .sz-stats__item {
    flex: auto;
    min-width: auto;
  }
}

/* === object/project/_doctors.css === */

/* ==========================================================================
 * Doctor Staff Section — 医師紹介
 * ホームページ用の医師カードグリッド
 * ========================================================================== */

.sz-doctors {
  padding-block: var(--spacing-xxxl);
  background: var(--color-background);
}

.sz-doctors__inner {
  max-width: var(--content-max-width);
  margin-inline: auto;
  padding-inline: var(--spacing-md);
}

.sz-doctors__header {
  text-align: center;
  margin-block-end: var(--spacing-xxl);
}

.sz-doctors__label {
  display: block;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--color-primary);
  margin-block-end: var(--spacing-xs);
}

.sz-doctors__ttl {
  font-size: var(--font-size-xl);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-main);
  line-height: var(--line-height-tight);
  margin: 0;
}

.sz-doctors__grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--spacing-md);
}

.sz-doctors__card {
  background: var(--color-surface);
  border-radius: var(--radius-md);
  overflow: hidden;
  box-shadow: var(--shadow-card);
  transition: transform var(--transition-normal), box-shadow var(--transition-normal);
  text-decoration: none;
  color: inherit;
}

.sz-doctors__card:hover {
  transform: translateY(-4px);
  box-shadow: var(--shadow-card-hover);
}

.sz-doctors__card-img-wrap {
  position: relative;
  aspect-ratio: 3 / 4;
  overflow: hidden;
  background: var(--color-border-light);
}

.sz-doctors__card-img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: transform 0.5s ease;
}

.sz-doctors__card:hover .sz-doctors__card-img {
  transform: scale(1.05);
}

.sz-doctors__card-tag {
  position: absolute;
  inset-block-start: var(--spacing-sm);
  inset-inline-start: var(--spacing-sm);
  background: var(--color-primary);
  color: var(--color-white);
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  padding: 0.2em 0.6em;
  border-radius: var(--radius-sm);
  line-height: 1.4;
}

.sz-doctors__card-body {
  padding: var(--spacing-md);
}

.sz-doctors__card-dept {
  display: block;
  font-size: var(--font-size-xs);
  color: var(--color-primary);
  font-weight: var(--font-weight-medium);
  margin-block-end: var(--spacing-xs);
}

.sz-doctors__card-name {
  display: block;
  font-size: var(--font-size-md);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-main);
  margin-block-end: 0.2em;
  line-height: var(--line-height-tight);
}

.sz-doctors__card-role {
  display: block;
  font-size: var(--font-size-xs);
  color: var(--color-text-sub);
}

.sz-doctors__bottom {
  text-align: center;
  margin-block-start: var(--spacing-xl);
}

.sz-doctors__btn-all {
  display: inline-flex;
  align-items: center;
  gap: 0.5em;
  color: var(--color-primary);
  font-weight: var(--font-weight-medium);
  font-size: var(--font-size-base);
  text-decoration: none;
  padding: 0.75em 1.5em;
  border: var(--border-width-thick) solid var(--color-primary);
  border-radius: var(--radius-full);
  transition: background var(--transition-fast), color var(--transition-fast);
}

.sz-doctors__btn-all:hover {
  background: var(--color-primary);
  color: var(--color-white);
}

/* ──────────────── Tablet (768px+) ──────────────── */
@media (min-width: 768px) {
  .sz-doctors__grid {
    grid-template-columns: repeat(3, 1fr);
    gap: var(--spacing-lg);
  }
}

/* ──────────────── Desktop (1024px+) ──────────────── */
@media (min-width: 1024px) {
  .sz-doctors__grid {
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-lg);
  }

  .sz-doctors__card-body {
    padding: var(--spacing-md) var(--spacing-lg);
  }
}

/* ──────────────── prefers-reduced-motion ──────────────── */
@media (prefers-reduced-motion: reduce) {
  .sz-doctors__card,
  .sz-doctors__card-img {
    transition: none;
  }
}

/* ============================================================
 * Phase 4e: Doctors モバイル・タブレット最適化
 * ============================================================ */

/* モバイル: 院長のみ水平カードレイアウト */
.sz-doctors__grid {
  grid-template-columns: 1fr;
}

.sz-doctors__card--director {
  display: grid;
  grid-template-columns: 5rem 1fr;
  gap: var(--spacing-md);
}

.sz-doctors__card--director .sz-doctors__card-img-wrap {
  aspect-ratio: 1;
  border-radius: var(--radius-full);
}

.sz-doctors__card--director .sz-doctors__card-img {
  border-radius: var(--radius-full);
}

.sz-doctors__card--director .sz-doctors__card-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

/* アコーディオン: 他の医師 */
.sz-doctors__accordion {
  margin-block-start: var(--spacing-md);
}

.sz-doctors__accordion-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--spacing-md);
  padding-block-start: var(--spacing-md);
}

/* lg(768px): 全員4列グリッド */
@media (min-width: 768px) {
  .sz-doctors__inner {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: var(--spacing-lg);
  }

  .sz-doctors__header {
    grid-column: 1 / -1;
  }

  .sz-doctors__grid {
    display: contents;
  }

  /* .mobile-accordion → display:contents (from _mobile-utilities.css) */
  .sz-doctors__accordion-grid {
    display: contents;
  }

  .sz-doctors__card--director {
    display: flex;
    flex-direction: column;
    gap: 0;
  }

  .sz-doctors__card--director .sz-doctors__card-img-wrap {
    aspect-ratio: 3 / 4;
    border-radius: 0;
  }

  .sz-doctors__card--director .sz-doctors__card-img {
    border-radius: 0;
  }
}

/* === object/project/_virtual-tour.css === */

/* ==========================================================================
 * Virtual Tour — バーチャル病院見学
 * ========================================================================== */

/* --- Intro --- */
.vt__intro {
  margin-block-end: var(--space-xl, 2rem);
  text-align: center;
}

.vt__lead {
  font-size: clamp(0.9375rem, 0.875rem + 0.25vw, 1.0625rem);
  color: var(--color-text-sub);
  line-height: var(--line-height-relaxed, 1.8);
}

/* --- Filter Nav --- */
.vt__filter {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-xs, 0.5rem);
  justify-content: center;
  margin-block-end: var(--space-2xl, 3rem);
  padding-block-end: var(--space-lg, 1.5rem);
  border-block-end: 1px solid var(--color-border-light);
}

.vt__filter-btn {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2xs, 0.25rem);
  padding: var(--space-xs, 0.5rem) var(--space-md, 1rem);
  border: 1px solid var(--color-border);
  border-radius: var(--radius-pill, 9999px);
  background: var(--color-surface);
  color: var(--color-text-sub);
  font-size: clamp(0.8125rem, 0.75rem + 0.25vw, 0.9375rem);
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s, border-color 0.2s;
}

.vt__filter-btn .material-symbols-outlined {
  font-size: 1.125rem;
}

.vt__filter-btn:hover {
  border-color: var(--color-primary);
  color: var(--color-primary);
}

.vt__filter-btn.is-active {
  background: var(--color-primary);
  border-color: var(--color-primary);
  color: var(--color-white, #fff);
}

/* --- Area Section --- */
.vt__area {
  margin-block-end: var(--space-3xl, 4rem);
}

.vt__area[hidden] {
  display: none;
}

.vt__area-title {
  display: flex;
  align-items: center;
  gap: var(--space-xs, 0.5rem);
  font-size: clamp(1.125rem, 1rem + 0.5vw, 1.5rem);
  color: var(--color-text-main);
  margin-block-end: var(--space-lg, 1.5rem);
  padding-block-end: var(--space-xs, 0.5rem);
  border-block-end: 2px solid var(--color-primary);
}

.vt__area-icon {
  color: var(--color-primary);
  font-size: 1.5rem;
}

/* --- Photo Grid --- */
.vt__grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr));
  gap: var(--space-md, 1rem);
}

@media (min-width: 480px) {
  .vt__grid {
    grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
  }
}

@media (min-width: 768px) {
  .vt__grid {
    grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));
  }
}

/* --- Photo Item --- */
.vt__item {
  margin: 0;
  border-radius: var(--radius-md, 0.5rem);
  overflow: hidden;
  background: var(--color-surface);
  box-shadow: var(--shadow-card);
  cursor: pointer;
  transition: transform 0.2s, box-shadow 0.2s;
}

.vt__item:hover,
.vt__item:focus-visible {
  transform: translateY(-2px);
  box-shadow: var(--shadow-card-hover);
}

.vt__item:focus-visible {
  outline: 2px solid var(--color-primary);
  outline-offset: 2px;
}

.vt__img {
  width: 100%;
  aspect-ratio: 4/3;
  object-fit: cover;
  display: block;
}

.vt__caption {
  padding: var(--space-xs, 0.5rem) var(--space-sm, 0.75rem);
  font-size: clamp(0.75rem, 0.6875rem + 0.25vw, 0.875rem);
  color: var(--color-text-sub);
  text-align: center;
}

/* ==========================================================================
 * Lightbox
 * ========================================================================== */
.vt-lightbox {
  position: fixed;
  inset: 0;
  z-index: 9999;
  display: flex;
  align-items: center;
  justify-content: center;
}

.vt-lightbox[hidden] {
  display: none;
}

.vt-lightbox__overlay {
  position: absolute;
  inset: 0;
  background: var(--color-overlay, rgba(0, 0, 0, 0.85));
}

.vt-lightbox__content {
  position: relative;
  max-width: 90vw;
  max-height: 90vh;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.vt-lightbox__img {
  max-width: 90vw;
  max-height: 75vh;
  object-fit: contain;
  border-radius: var(--radius-md, 0.5rem);
}

.vt-lightbox__close {
  position: absolute;
  top: -3rem;
  right: 0;
  background: none;
  border: none;
  color: #fff;
  cursor: pointer;
  padding: var(--space-xs, 0.5rem);
  font-size: 1.5rem;
}

.vt-lightbox__close:hover {
  opacity: 0.8;
}

.vt-lightbox__prev,
.vt-lightbox__next {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0, 0, 0, 0.5);
  border: none;
  border-radius: 50%;
  color: #fff;
  width: 48px;
  height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: background-color 0.2s;
}

.vt-lightbox__prev:hover,
.vt-lightbox__next:hover {
  background: rgba(0, 0, 0, 0.7);
}

.vt-lightbox__prev {
  left: -4rem;
}

.vt-lightbox__next {
  right: -4rem;
}

@media (max-width: 767px) {
  .vt-lightbox__prev {
    left: 0.5rem;
  }

  .vt-lightbox__next {
    right: 0.5rem;
  }

  .vt-lightbox__close {
    top: -2.5rem;
    right: 0.5rem;
  }
}

.vt-lightbox__caption {
  color: #fff;
  margin-block-start: var(--space-sm, 0.75rem);
  font-size: clamp(0.875rem, 0.8125rem + 0.25vw, 1rem);
  text-align: center;
}

.vt-lightbox__counter {
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.8125rem;
  margin-block-start: var(--space-2xs, 0.25rem);
}

/* === object/project/_donations.css === */

/* ================================================================
   _donations.css — 寄付ページ専用スタイル
   ================================================================ */

/* ── プログレスバー ── */
.donation-progress {
  margin-block: var(--space-md, 1rem);
}

.donation-progress__bar {
  block-size: 0.75rem;
  background: var(--color-bg-tertiary, #e9ecef);
  border-radius: var(--radius-pill, 9999px);
  overflow: hidden;
}

.donation-progress__fill {
  block-size: 100%;
  background: var(--color-reservation-cta, #00897B);
  border-radius: var(--radius-pill, 9999px);
  transition: width 0.6s ease;
}

.donation-progress__text {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: var(--space-xs, 0.25rem);
  margin-block-start: var(--space-xs, 0.25rem);
  font-size: clamp(0.75rem, 0.7rem + 0.25vw, 0.875rem);
  color: var(--color-text-secondary, #666);
}

.donation-progress__current {
  font-weight: 700;
  font-size: clamp(1rem, 0.9rem + 0.5vw, 1.25rem);
  color: var(--color-reservation-cta, #00897B);
}

.donation-progress__percent {
  font-weight: 600;
}

/* ── 大きめプログレスバー (詳細ページ用) ── */
.donation-progress--large .donation-progress__bar {
  block-size: 1.25rem;
}

.donation-progress--large .donation-progress__stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: var(--space-md, 1rem);
  margin-block-start: var(--space-md, 1rem);
  padding-block: var(--space-md, 1rem);
  border-block-start: 1px solid var(--color-border, #dee2e6);
}

@media (min-width: 768px) {
  .donation-progress--large .donation-progress__stats {
    grid-template-columns: repeat(4, 1fr);
  }
}

.donation-progress__stat {
  text-align: center;
}

.donation-progress__label {
  display: block;
  font-size: clamp(0.75rem, 0.7rem + 0.2vw, 0.813rem);
  color: var(--color-text-secondary, #666);
  margin-block-end: var(--space-2xs, 0.125rem);
}

.donation-progress__value {
  display: block;
  font-weight: 700;
  font-size: clamp(1.125rem, 1rem + 0.5vw, 1.5rem);
  color: var(--color-text-primary, #333);
}

/* ── キャンペーンメタ情報 ── */
.donation-campaign-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: var(--space-md, 1rem);
  margin-block-start: var(--space-sm, 0.5rem);
  font-size: clamp(0.813rem, 0.75rem + 0.25vw, 0.875rem);
  color: var(--color-text-secondary, #666);
}

.donation-campaign-meta__supporters,
.donation-campaign-meta__period {
  display: inline-flex;
  align-items: center;
  gap: var(--space-2xs, 0.25rem);
}

.donation-campaign-meta__supporters .material-symbols-outlined,
.donation-campaign-meta__period .material-symbols-outlined {
  font-size: 1.125rem;
}

.donation-campaign-meta__badge {
  display: inline-block;
  padding-inline: var(--space-sm, 0.5rem);
  padding-block: var(--space-2xs, 0.125rem);
  border-radius: var(--radius-sm, 0.25rem);
  font-size: 0.75rem;
  font-weight: 600;
  letter-spacing: 0.02em;
}

.donation-campaign-meta__badge--active {
  background: var(--color-reservation-cta, #00897B);
  color: #fff;
}

.donation-campaign-meta__badge--ended {
  background: var(--color-bg-tertiary, #e9ecef);
  color: var(--color-text-secondary, #666);
}

/* ── リターン ── */
.donation-return__amount {
  font-weight: 700;
  font-size: clamp(1.125rem, 1rem + 0.5vw, 1.375rem);
  color: var(--color-reservation-cta, #00897B);
  margin-block-end: var(--space-xs, 0.25rem);
}

.donation-return__limit {
  font-size: 0.813rem;
  color: var(--color-text-secondary, #666);
}

.donation-return__soldout {
  font-weight: 600;
  color: var(--color-danger, #dc3545);
}

/* sakura-box disabled */
.sakura-box--disabled {
  opacity: 0.6;
}

/* sakura-box icon large */
.sakura-box__icon--large {
  font-size: 3rem;
}

/* hero image in sakura-section */
.sakura-section__hero-image {
  inline-size: 100%;
  block-size: auto;
  border-radius: var(--radius-md, 0.5rem);
  margin-block-end: var(--space-lg, 1.5rem);
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

/* --- Object: Utility --- */

/* === object/utility/_spacing.css === */

/* ==========================================================================
 * Utility: Spacing (.u-mt-*, .u-mb-*, .u-mx-auto, etc.)
 * 8pxグリッドベースのスペーシングユーティリティ
 *
 * レベル:  0    1(xs)  2(sm)  3(md)  4(lg)  5(xl)  6(xxl)  7(xxxl)
 * 値:     0px  4px    8px    16px   24px   32px   48px    64px
 * ========================================================================== */

/* --- Margin block-start (mt) --- */
.u-mt-0 { margin-block-start: 0; }
.u-mt-1 { margin-block-start: var(--spacing-xs); }
.u-mt-2 { margin-block-start: var(--spacing-sm); }
.u-mt-3 { margin-block-start: var(--spacing-md); }
.u-mt-4 { margin-block-start: var(--spacing-lg); }
.u-mt-5 { margin-block-start: var(--spacing-xl); }
.u-mt-6 { margin-block-start: var(--spacing-xxl); }
.u-mt-7 { margin-block-start: var(--spacing-xxxl); }

/* --- Margin block-end (mb) --- */
.u-mb-0 { margin-block-end: 0; }
.u-mb-1 { margin-block-end: var(--spacing-xs); }
.u-mb-2 { margin-block-end: var(--spacing-sm); }
.u-mb-3 { margin-block-end: var(--spacing-md); }
.u-mb-4 { margin-block-end: var(--spacing-lg); }
.u-mb-5 { margin-block-end: var(--spacing-xl); }
.u-mb-6 { margin-block-end: var(--spacing-xxl); }
.u-mb-7 { margin-block-end: var(--spacing-xxxl); }

/* --- Margin inline (mx) --- */
.u-mx-auto { margin-inline: auto; }

/* --- Padding (p) --- */
.u-p-0 { padding: 0; }
.u-p-1 { padding: var(--spacing-xs); }
.u-p-2 { padding: var(--spacing-sm); }
.u-p-3 { padding: var(--spacing-md); }
.u-p-4 { padding: var(--spacing-lg); }
.u-p-5 { padding: var(--spacing-xl); }
.u-p-6 { padding: var(--spacing-xxl); }

/* --- Padding block (py) --- */
.u-py-3 { padding-block: var(--spacing-md); }
.u-py-4 { padding-block: var(--spacing-lg); }
.u-py-5 { padding-block: var(--spacing-xl); }
.u-py-6 { padding-block: var(--spacing-xxl); }

/* --- Padding inline (px) --- */
.u-px-3 { padding-inline: var(--spacing-md); }
.u-px-4 { padding-inline: var(--spacing-lg); }
.u-px-5 { padding-inline: var(--spacing-xl); }

/* --- Gap --- */
.u-gap-1 { gap: var(--spacing-xs); }
.u-gap-2 { gap: var(--spacing-sm); }
.u-gap-3 { gap: var(--spacing-md); }
.u-gap-4 { gap: var(--spacing-lg); }
.u-gap-5 { gap: var(--spacing-xl); }

/* === object/utility/_text.css === */

/* ==========================================================================
 * Utility: Text (.u-text-*)
 * テキストユーティリティ
 * ========================================================================== */

/* --- Alignment --- */
.u-text-center { text-align: center; }
.u-text-left { text-align: start; }
.u-text-right { text-align: end; }

/* --- Size --- */
.u-text-xs { font-size: var(--font-size-xs); }
.u-text-sm { font-size: var(--font-size-sm); }
.u-text-base { font-size: var(--font-size-base); }
.u-text-md { font-size: var(--font-size-md); }
.u-text-lg { font-size: var(--font-size-lg); }
.u-text-xl { font-size: var(--font-size-xl); }
.u-text-xxl { font-size: var(--font-size-xxl); }

/* --- Weight --- */
.u-text-normal { font-weight: var(--font-weight-normal); }
.u-text-medium { font-weight: var(--font-weight-medium); }
.u-text-bold { font-weight: var(--font-weight-bold); }

/* --- Line height --- */
.u-leading-tight { line-height: var(--line-height-tight); }
.u-leading-normal { line-height: var(--line-height-normal); }
.u-leading-relaxed { line-height: var(--line-height-relaxed); }

/* --- Color --- */
.u-text-sub { color: var(--color-text-sub); }
.u-text-muted { color: var(--color-text-muted); }
.u-text-primary { color: var(--color-primary); }
.u-text-error { color: var(--color-error); }
.u-text-success { color: var(--color-success); }
.u-text-inherit { color: inherit; }

/* --- Decoration --- */
.u-text-no-decoration { text-decoration: none; }

/* --- Truncate --- */
.u-truncate {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.u-line-clamp-2 {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.u-line-clamp-3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* ==========================================================================
 * Screen Reader Only (.u-sr-only)
 * WCAG 2.2 AA アクセシビリティ必須クラス
 * 視覚的に非表示だがスクリーンリーダーでは読み上げられる
 * ========================================================================== */
.u-sr-only {
  position: absolute;
  inline-size: 1px;
  block-size: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* === object/utility/_display.css === */

/* ==========================================================================
 * Utility: Display (.u-d-*, .u-hidden-*, .u-visually-hidden)
 * 表示制御ユーティリティ
 * ========================================================================== */

/* --- Display --- */
.u-d-none { display: none; }
.u-d-block { display: block; }
.u-d-inline-block { display: inline-block; }
.u-d-flex { display: flex; }
.u-d-inline-flex { display: inline-flex; }
.u-d-grid { display: grid; }

/* --- Flex utilities --- */
.u-flex-column { flex-direction: column; }
.u-flex-wrap { flex-wrap: wrap; }
.u-flex-center { align-items: center; justify-content: center; }
.u-items-center { align-items: center; }
.u-items-start { align-items: flex-start; }
.u-justify-between { justify-content: space-between; }
.u-justify-center { justify-content: center; }
.u-flex-1 { flex: 1; }

/* .u-visually-hidden は .u-sr-only (_text.css) に統一済み */

/* ==========================================================================
 * Responsive visibility
 * スマホファースト（min-width）
 *   --sm: 576px  --md: 768px  --lg: 1024px
 * ========================================================================== */

/* --- スマホのみ表示（md以上で非表示） --- */
@media (min-width: 768px) {
  .u-hidden-md-up { display: none !important; }
}

/* --- タブレット以上のみ表示（smまで非表示） --- */
.u-hidden-sm-down { display: none !important; }
@media (min-width: 768px) {
  .u-hidden-sm-down { display: initial !important; }
}

/* --- デスクトップのみ表示（lgまで非表示） --- */
.u-hidden-md-down { display: none !important; }
@media (min-width: 1024px) {
  .u-hidden-md-down { display: initial !important; }
}

/* --- モバイル〜タブレットのみ表示（lg以上で非表示） --- */
@media (min-width: 1024px) {
  .u-hidden-lg-up { display: none !important; }
}

/* ==========================================================================
 * Misc
 * ========================================================================== */
.u-w-full { inline-size: 100%; }
.u-max-w-content { max-inline-size: var(--content-max-width); }
.u-overflow-hidden { overflow: hidden; }

/* === object/utility/_saikazo-utilities.css === */

/* ================================================================
   saikazo-utilities.css
   共通ユーティリティクラス

   注意: CSS変数は variables.css で一元管理されています。
   このファイルではユーティリティクラスのみを定義してください。
   ================================================================ */

/* ================================================================
   Typography
   ================================================================ */
.text-xs { font-size: 0.75rem; line-height: 1rem; }
.text-sm { font-size: 0.875rem; line-height: 1.25rem; }
.text-base { font-size: 1rem; line-height: 1.5rem; }
.text-lg { font-size: 1.125rem; line-height: 1.75rem; }
.text-xl { font-size: 1.25rem; line-height: 1.75rem; }
.text-2xl { font-size: 1.5rem; line-height: 2rem; }
.text-3xl { font-size: 1.875rem; line-height: 2.25rem; }
.text-4xl { font-size: 2.25rem; line-height: 2.5rem; }

.font-light { font-weight: 300; }
.font-normal { font-weight: 400; }
.font-medium { font-weight: 500; }
.font-semibold { font-weight: 600; }
.font-bold { font-weight: 700; }

.text-center { text-align: center; }
.text-left { text-align: left; }
.text-right { text-align: right; }

.text-primary { color: var(--color-primary); }
.text-accent { color: var(--color-accent); }
.text-success { color: var(--color-success); }
.text-warning { color: var(--color-warning); }
.text-danger { color: var(--color-danger); }
.text-muted { color: var(--color-text-muted); }

/* ================================================================
   Layout（木古内準拠）
   ================================================================ */
.container {
  width: var(--content-width-mobile, calc(100% - 40px));
  max-width: var(--container-max-width, 1440px);
  margin: 0 auto;
  padding: 0;
}

@media (min-width: 768px) {
  .container {
    width: var(--content-width-tablet, calc(100% - 60px));
  }
}

@media (min-width: 1024px) {
  .container {
    width: var(--content-width-desktop, calc(100% - 100px));
  }
}

.container-sm { max-width: 800px; }
.container-lg { max-width: 1560px; }

/* 統一 セクションインナー */
.section-inner {
  width: var(--content-width-mobile, calc(100% - 40px));
  max-width: var(--container-max-width, 1440px);
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 768px) {
  .section-inner {
    width: var(--content-width-tablet, calc(100% - 60px));
  }
}

@media (min-width: 1024px) {
  .section-inner {
    width: var(--content-width-desktop, calc(100% - 100px));
  }
}

/* 統一 フルワイド */
.w-full { width: 100%; }
.w-state {
  width: var(--content-width-mobile, calc(100% - 40px));
  max-width: 1440px;
  margin-right: auto;
  margin-left: auto;
}

@media (min-width: 768px) {
  .w-state {
    width: var(--content-width-desktop, calc(100% - 100px));
  }
}

.flex { display: flex; }
.flex-col { flex-direction: column; }
.flex-wrap { flex-wrap: wrap; }
.items-center { align-items: center; }
.items-start { align-items: flex-start; }
.items-end { align-items: flex-end; }
.justify-center { justify-content: center; }
.justify-between { justify-content: space-between; }
.justify-end { justify-content: flex-end; }
.gap-1 { gap: var(--spacing-xs); }
.gap-2 { gap: var(--spacing-sm); }
.gap-3 { gap: var(--spacing-md); }
.gap-4 { gap: var(--spacing-lg); }
.gap-5 { gap: var(--spacing-xl); }

.grid { display: grid; }
.grid-cols-1 { grid-template-columns: repeat(1, 1fr); }
.grid-cols-2 { grid-template-columns: repeat(2, 1fr); }
.grid-cols-3 { grid-template-columns: repeat(3, 1fr); }
.grid-cols-4 { grid-template-columns: repeat(4, 1fr); }

@media (min-width: 768px) {
  .md\:grid-cols-2 { grid-template-columns: repeat(2, 1fr); }
  .md\:grid-cols-3 { grid-template-columns: repeat(3, 1fr); }
  .md\:grid-cols-4 { grid-template-columns: repeat(4, 1fr); }
}

/* ================================================================
   Spacing
   ================================================================ */
.m-0 { margin: 0; }
.m-1 { margin: var(--spacing-xs); }
.m-2 { margin: var(--spacing-sm); }
.m-3 { margin: var(--spacing-md); }
.m-4 { margin: var(--spacing-lg); }
.m-5 { margin: var(--spacing-xl); }

.mt-0 { margin-top: 0; }
.mt-1 { margin-top: var(--spacing-xs); }
.mt-2 { margin-top: var(--spacing-sm); }
.mt-3 { margin-top: var(--spacing-md); }
.mt-4 { margin-top: var(--spacing-lg); }
.mt-5 { margin-top: var(--spacing-xl); }

.mb-0 { margin-bottom: 0; }
.mb-1 { margin-bottom: var(--spacing-xs); }
.mb-2 { margin-bottom: var(--spacing-sm); }
.mb-3 { margin-bottom: var(--spacing-md); }
.mb-4 { margin-bottom: var(--spacing-lg); }
.mb-5 { margin-bottom: var(--spacing-xl); }

.p-0 { padding: 0; }
.p-1 { padding: var(--spacing-xs); }
.p-2 { padding: var(--spacing-sm); }
.p-3 { padding: var(--spacing-md); }
.p-4 { padding: var(--spacing-lg); }
.p-5 { padding: var(--spacing-xl); }

.py-1 { padding-top: var(--spacing-xs); padding-bottom: var(--spacing-xs); }
.py-2 { padding-top: var(--spacing-sm); padding-bottom: var(--spacing-sm); }
.py-3 { padding-top: var(--spacing-md); padding-bottom: var(--spacing-md); }
.py-4 { padding-top: var(--spacing-lg); padding-bottom: var(--spacing-lg); }
.py-5 { padding-top: var(--spacing-xl); padding-bottom: var(--spacing-xl); }

.px-1 { padding-left: var(--spacing-xs); padding-right: var(--spacing-xs); }
.px-2 { padding-left: var(--spacing-sm); padding-right: var(--spacing-sm); }
.px-3 { padding-left: var(--spacing-md); padding-right: var(--spacing-md); }
.px-4 { padding-left: var(--spacing-lg); padding-right: var(--spacing-lg); }
.px-5 { padding-left: var(--spacing-xl); padding-right: var(--spacing-xl); }

/* ================================================================
   Backgrounds
   ================================================================ */
.bg-white { background-color: var(--color-white); }
.bg-gray-50 { background-color: var(--color-gray-50); }
.bg-gray-100 { background-color: var(--color-gray-100); }
.bg-primary { background-color: var(--color-primary); }
.bg-primary-light { background-color: var(--color-primary-light); }
.bg-accent { background-color: var(--color-accent); }
.bg-success { background-color: var(--color-success); }
.bg-success-light { background-color: var(--color-success-light); }

/* ================================================================
   Borders
   ================================================================ */
.border { border: 1px solid var(--color-gray-200); }
.border-0 { border: 0; }
.border-t { border-top: 1px solid var(--color-gray-200); }
.border-b { border-bottom: 1px solid var(--color-gray-200); }
.border-l { border-left: 1px solid var(--color-gray-200); }
.border-r { border-right: 1px solid var(--color-gray-200); }

.rounded { border-radius: var(--radius-md); }
.rounded-sm { border-radius: var(--radius-sm); }
.rounded-lg { border-radius: var(--radius-lg); }
.rounded-xl { border-radius: var(--radius-xl); }
.rounded-full { border-radius: var(--radius-full); }

/* ================================================================
   Shadows
   ================================================================ */
.shadow-sm { box-shadow: var(--shadow-sm); }
.shadow { box-shadow: var(--shadow-md); }
.shadow-lg { box-shadow: var(--shadow-lg); }
.shadow-xl { box-shadow: var(--shadow-xl); }
.shadow-none { box-shadow: none; }

/* ================================================================
   Buttons
   ================================================================ */
.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  padding: 0.75rem 1.5rem;
  font-size: 1rem;
  font-weight: 500;
  text-decoration: none;
  border: none;
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: all var(--transition-fast);
}

.btn-sm {
  padding: 0.5rem 1rem;
  font-size: 0.875rem;
}

.btn-lg {
  padding: 1rem 2rem;
  font-size: 1.125rem;
}

/* NOTE: .btn-primary, .btn-secondary are defined in components/button.css
   These definitions are kept for backward compatibility but should be removed
   in future refactoring. Use button.css as the primary source. */

.btn-secondary {
  background-color: var(--color-gray-100);
  color: var(--color-text);
}

.btn-secondary:hover {
  background-color: var(--color-gray-200);
}

.btn-outline {
  background-color: transparent;
  border: 2px solid var(--color-primary);
  color: var(--color-primary);
}

.btn-outline:hover {
  background-color: var(--color-primary);
  color: var(--color-white);
}

.btn-accent {
  background-color: var(--color-accent);
  color: var(--color-white);
}

.btn-accent:hover {
  background-color: #bf4400;
}

/* ================================================================
   Cards
   ================================================================ */
.card {
  background: var(--color-white);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-md);
  overflow: hidden;
  transition: all var(--transition-normal);
}

.card:hover {
  box-shadow: var(--shadow-lg);
  transform: translateY(-2px);
}

.card-body {
  padding: var(--spacing-lg);
}

.card-header {
  padding: var(--spacing-md) var(--spacing-lg);
  border-bottom: 1px solid var(--color-gray-200);
  background: var(--color-gray-50);
}

.card-footer {
  padding: var(--spacing-md) var(--spacing-lg);
  border-top: 1px solid var(--color-gray-200);
  background: var(--color-gray-50);
}

/* ================================================================
   Animations
   ================================================================ */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeInDown {
  from {
    opacity: 0;
    transform: translateY(-20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes fadeInLeft {
  from {
    opacity: 0;
    transform: translateX(-20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes fadeInRight {
  from {
    opacity: 0;
    transform: translateX(20px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes scaleIn {
  from {
    opacity: 0;
    transform: scale(0.95);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

@keyframes pulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.5; }
}

@keyframes spin {
  from { transform: rotate(0deg); }
  to { transform: rotate(360deg); }
}

.animate-fade-in { animation: fadeIn 0.5s ease-out; }
.animate-fade-in-up { animation: fadeInUp 0.5s ease-out; }
.animate-fade-in-down { animation: fadeInDown 0.5s ease-out; }
.animate-fade-in-left { animation: fadeInLeft 0.5s ease-out; }
.animate-fade-in-right { animation: fadeInRight 0.5s ease-out; }
.animate-scale-in { animation: scaleIn 0.3s ease-out; }
.animate-pulse { animation: pulse 2s infinite; }
.animate-spin { animation: spin 1s linear infinite; }

/* Scroll Animation Triggers */
.scroll-animate {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.scroll-animate.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* ================================================================
   Forms
   ================================================================ */
.form-group {
  margin-bottom: var(--spacing-lg);
}

.form-label {
  display: block;
  font-weight: 500;
  margin-bottom: var(--spacing-sm);
  color: var(--color-text);
}

.form-label .required {
  color: var(--color-danger);
  margin-left: 0.25rem;
}

.form-control {
  width: 100%;
  padding: 0.75rem 1rem;
  font-size: 1rem;
  border: 2px solid var(--color-gray-200);
  border-radius: var(--radius-md);
  background: var(--color-white);
  transition: border-color var(--transition-fast), box-shadow var(--transition-fast);
}

.form-control:focus {
  outline: none;
  border-color: var(--color-primary);
  box-shadow: 0 0 0 3px var(--color-primary-light);
}

.form-control:disabled {
  background: var(--color-gray-100);
  cursor: not-allowed;
}

.form-select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3e%3cpath fill='none' stroke='%23333' stroke-linecap='round' stroke-linejoin='round' stroke-width='2' d='m2 5 6 6 6-6'/%3e%3c/svg%3e");
  background-repeat: no-repeat;
  background-position: right 0.75rem center;
  background-size: 16px 12px;
  padding-right: 2.5rem;
}

.form-hint {
  display: block;
  margin-top: var(--spacing-xs);
  font-size: 0.875rem;
  color: var(--color-text-muted);
}

.form-error {
  color: var(--color-danger);
}

/* ================================================================
   Badges
   ================================================================ */
.badge {
  display: inline-flex;
  align-items: center;
  padding: 0.25rem 0.75rem;
  font-size: 0.75rem;
  font-weight: 600;
  border-radius: var(--radius-full);
  white-space: nowrap;
}

.badge-primary {
  background: var(--color-primary-light);
  color: var(--color-primary);
}

.badge-success {
  background: var(--color-success-light);
  color: var(--color-success);
}

.badge-warning {
  background: var(--color-warning-light);
  color: var(--color-warning);
}

.badge-danger {
  background: var(--color-danger-light);
  color: var(--color-danger);
}

/* ================================================================
   Alerts
   ================================================================ */
.alert {
  padding: var(--spacing-md) var(--spacing-lg);
  border-radius: var(--radius-md);
  margin-bottom: var(--spacing-lg);
  display: flex;
  align-items: flex-start;
  gap: var(--spacing-md);
}

.alert-icon {
  flex-shrink: 0;
  font-size: 1.25rem;
}

.alert-content {
  flex: 1;
}

.alert-title {
  font-weight: 600;
  margin-bottom: 0.25rem;
}

.alert-info {
  background: #e3f2fd;
  color: #1565c0;
}

.alert-success {
  background: var(--color-success-light);
  color: var(--color-success);
}

.alert-warning {
  background: var(--color-warning-light);
  color: #e65100;
}

.alert-danger {
  background: var(--color-danger-light);
  color: var(--color-danger);
}

/* ================================================================
   Tables
   ================================================================ */
.table {
  width: 100%;
  border-collapse: collapse;
  background: var(--color-white);
}

.table th,
.table td {
  padding: var(--spacing-md);
  text-align: left;
  border-bottom: 1px solid var(--color-gray-200);
}

.table th {
  font-weight: 600;
  background: var(--color-gray-50);
  color: var(--color-text);
}

.table tbody tr:hover {
  background: var(--color-gray-50);
}

.table-striped tbody tr:nth-child(even) {
  background: var(--color-gray-50);
}

/* ================================================================
   Utilities - Visibility
   ================================================================ */
.hidden { display: none; }
.invisible { visibility: hidden; }
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

/* Mobile base: hidden-mobile on mobile */
.hidden-mobile { display: none; }

@media (min-width: 768px) {
  .hidden-mobile { display: revert; }
  .hidden-desktop { display: none; }
}

/* ================================================================
   Utilities - Overflow
   ================================================================ */
.overflow-hidden { overflow: hidden; }
.overflow-auto { overflow: auto; }
.overflow-x-auto { overflow-x: auto; }
.overflow-y-auto { overflow-y: auto; }

/* ================================================================
   Loading States
   ================================================================ */
.loading {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--spacing-sm);
  color: var(--color-text-muted);
}

.loading-spinner {
  width: 20px;
  height: 20px;
  border: 2px solid var(--color-gray-200);
  border-top-color: var(--color-primary);
  border-radius: 50%;
  animation: spin 1s linear infinite;
}

.skeleton {
  background: linear-gradient(90deg, var(--color-gray-200) 25%, var(--color-gray-100) 50%, var(--color-gray-200) 75%);
  background-size: 200% 100%;
  animation: skeleton-loading 1.5s infinite;
  border-radius: var(--radius-sm);
}

@keyframes skeleton-loading {
  0% { background-position: 200% 0; }
  100% { background-position: -200% 0; }
}

/* ================================================================
   Card Grid Layouts
   ================================================================ */
.partslist01--grid {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-top: 40px;
}

/* Mobile base */
.partslist01__card--3col {
  width: 100%;
}

.partslist01--grid {
  flex-direction: column;
  gap: 15px;
}

@media (min-width: 768px) {
  .partslist01--grid {
    flex-direction: row;
    gap: 20px;
  }
  .partslist01__card--3col {
    width: calc(50% - 10px);
  }
}

@media (min-width: 992px) {
  .partslist01__card--3col {
    width: calc(33.333% - 14px);
  }
}

/* ================================================================
   マイクロインタラクション（木古内スタイル）
   Intersection Observer によるフェードイン・アップ
   ================================================================ */
.fade-in-up {
  opacity: 0;
  transform: translateY(30px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.fade-in-up.is-visible {
  opacity: 1;
  transform: translateY(0);
}

/* 遅延バリエーション */
.fade-in-up--delay-1 { transition-delay: 0.1s; }
.fade-in-up--delay-2 { transition-delay: 0.2s; }
.fade-in-up--delay-3 { transition-delay: 0.3s; }
.fade-in-up--delay-4 { transition-delay: 0.4s; }
.fade-in-up--delay-5 { transition-delay: 0.5s; }

/* スタガー子要素アニメーション（親に .stagger-children + .is-visible で発火） */
.stagger-children > * {
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}

.stagger-children.is-visible > *:nth-child(1) { opacity: 1; transform: translateY(0); transition-delay: 0.05s; }
.stagger-children.is-visible > *:nth-child(2) { opacity: 1; transform: translateY(0); transition-delay: 0.1s; }
.stagger-children.is-visible > *:nth-child(3) { opacity: 1; transform: translateY(0); transition-delay: 0.15s; }
.stagger-children.is-visible > *:nth-child(4) { opacity: 1; transform: translateY(0); transition-delay: 0.2s; }
.stagger-children.is-visible > *:nth-child(5) { opacity: 1; transform: translateY(0); transition-delay: 0.25s; }
.stagger-children.is-visible > *:nth-child(6) { opacity: 1; transform: translateY(0); transition-delay: 0.3s; }
.stagger-children.is-visible > *:nth-child(n+7) { opacity: 1; transform: translateY(0); transition-delay: 0.35s; }

/* フェードイン（単純） */
.fade-in {
  opacity: 0;
  transition: opacity 0.6s ease-out;
}

.fade-in.is-visible {
  opacity: 1;
}

/* スケールイン */
.scale-in {
  opacity: 0;
  transform: scale(0.95);
  transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}

.scale-in.is-visible {
  opacity: 1;
  transform: scale(1);
}

/* スライドイン（左から） */
.slide-in-left {
  opacity: 0;
  transform: translateX(-30px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.slide-in-left.is-visible {
  opacity: 1;
  transform: translateX(0);
}

/* スライドイン（右から） */
.slide-in-right {
  opacity: 0;
  transform: translateX(30px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

.slide-in-right.is-visible {
  opacity: 1;
  transform: translateX(0);
}

/* ホバーエフェクト強化 */
.hover-lift {
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hover-lift:hover {
  transform: translateY(-4px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.12);
}

/* カードホバー */
.card-hover {
  transition: transform 0.3s ease, box-shadow 0.3s ease, border-color 0.3s ease;
}

.card-hover:hover {
  transform: translateY(-2px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
  border-color: var(--sz-primary, #114FA1);
}

/* リンクアンダーラインアニメーション */
.link-underline {
  position: relative;
  text-decoration: none;
}

.link-underline::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 0;
  height: 2px;
  background: currentColor;
  transition: width 0.3s ease;
}

.link-underline:hover::after {
  width: 100%;
}

/* ================================================================
   prefers-reduced-motion 対応
   ================================================================ */
@media (prefers-reduced-motion: reduce) {
  .fade-in-up,
  .fade-in,
  .scale-in,
  .slide-in-left,
  .slide-in-right,
  .hover-lift,
  .card-hover {
    transition: none;
  }

  .fade-in-up,
  .fade-in,
  .scale-in,
  .slide-in-left,
  .slide-in-right {
    opacity: 1;
    transform: none;
  }

  .stagger-children > * {
    opacity: 1;
    transform: none;
    transition: none;
  }
}
/* ================================================================
   統一 統一セクションヘッダー
   木古内形式: 「日本語タイトル 英語ラベル」横並び（木古内スタイル）
   ================================================================ */
.sz-section-header {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
  gap: 0.75rem;
  margin-bottom: 2.5rem;
}

.sz-section-header--center {
  flex-direction: column;
  justify-content: flex-start;
  text-align: left;
}

.sz-section-header--left {
  justify-content: flex-start;
  text-align: left;
}

/* 右端にリンクを配置する場合 */
.sz-section-header--with-link {
  justify-content: space-between;
  flex-wrap: wrap;
}

.sz-section-header__link {
  font-size: 0.875rem;
  color: var(--saikazo-text, #333);
  text-decoration: none;
  display: flex;
  align-items: center;
  gap: 0.25rem;
  transition: color 0.2s ease;
}

.sz-section-header__link:hover {
  color: var(--saikazo-primary, #114FA1);
}

.sz-section-header__link .material-symbols-outlined {
  font-size: 1rem;
}

/* 日本語タイトル（木古内スタイル: インライン） */
.sz-section-header__ttl {
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 1.4;
  color: var(--saikazo-text, #333);
  margin: 0;
  letter-spacing: 0.02em;
}

.sz-section-header__ttl .accent {
  color: var(--saikazo-primary, #114FA1);
}

/* 英語ラベル（木古内スタイル: タイトル横に小さく） */
.sz-section-header__en {
  font-family: 'Palatino Linotype', Palatino, 'Times New Roman', serif;
  font-size: 0.8125rem;
  font-weight: 400;
  letter-spacing: 0.1em;
  color: var(--saikazo-text-light, #888);
  text-transform: none;
  margin: 0;
}

/* タイトル+英語をまとめるラッパー */
.sz-section-header__main {
  display: flex;
  align-items: baseline;
  gap: 0.75rem;
}

/* 日本語ラベル（小さなバッジ風 - オプション） */
.sz-section-header__label {
  display: inline-block;
  font-size: 0.6875rem;
  font-weight: 600;
  color: var(--saikazo-primary, #114FA1);
  background: rgba(17, 79, 161, 0.08);
  padding: 0.25rem 0.75rem;
  border-radius: 20px;
  margin-bottom: 0.5rem;
}

/* サブタイトル（オプション） */
.sz-section-header__sub {
  display: block;
  font-size: 0.9375rem;
  color: var(--saikazo-text-light, #666);
  margin-top: 0.75rem;
  line-height: 1.6;
}

/* Mobile base */
.sz-section-header {
  margin-bottom: 2rem;
}

.sz-section-header__ttl {
  font-size: clamp(1.25rem, 3vw, 1.625rem);
}

.sz-section-header__en {
  font-size: clamp(0.5625rem, 1.5vw, 0.75rem);
  letter-spacing: 0.15em;
}

@media (min-width: 768px) {
  .sz-section-header {
    margin-bottom: 3rem;
  }

  .sz-section-header__ttl {
    font-size: 1.625rem;
  }

  .sz-section-header__en {
    font-size: 0.75rem;
    letter-spacing: 0.2em;
  }
}

/* ================================================================
   統一 統一セクション余白
   ※ padding は _asakayama-mobile.css §9/§40 で管理。ここでは背景色のみ
   ================================================================ */
.sz-section--gray {
  background-color: var(--saikazo-bg-gray, #f8f9fa);
}

.sz-section--primary {
  background-color: var(--saikazo-primary, #114FA1);
  color: #fff;
}

/* ================================================================
   統一 統一リンク・ボタンスタイル
   ================================================================ */

/* アロー付きリンク（一覧をみる等） */
.sz-link-more {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 0.9375rem;
  font-weight: 500;
  color: var(--saikazo-primary, #114FA1);
  text-decoration: none;
  transition: all 0.3s ease;
  padding: 0.5rem 0;
}

.sz-link-more .material-symbols-outlined {
  font-size: 1.125rem;
  transition: transform 0.3s ease;
}

.sz-link-more:hover {
  color: var(--saikazo-primary-dark, #0D3A75);
}

.sz-link-more:hover .material-symbols-outlined {
  transform: translateX(4px);
}

/* センター配置ラッパー */
.news-v2__footer {
  text-align: center;
  margin-top: 2rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--saikazo-border-light, #e0e0e0);
}

/* news-v2 コンテンツ（旧__right -> __content） */
.news-v2__content {
  width: 100%;
}

/* news-v2 タブを中央揃え */
.news-v2 .news-v2__tabs {
  justify-content: center;
  margin-bottom: 1.5rem;
}

/* news-v2 inner を縦方向レイアウトに */
.news-v2 .news-v2__inner {
  flex-direction: column;
}

/* --- Speech UI --- */

/* === speech/_fab.css === */

/* ==========================================================================
 * Speech: FAB (.sp-fab)
 * 音声ナビゲーション起動用 Floating Action Button
 * ========================================================================== */
.sp-fab {
  position: fixed;
  bottom: 4.5rem;
  right: var(--spacing-md);
  z-index: var(--z-fab);
  display: none;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border: 2px solid var(--color-primary);
  border-radius: var(--radius-full);
  background-color: var(--color-primary);
  color: var(--color-surface);
  box-shadow: var(--shadow-fab);
  cursor: pointer;
  transition: background-color var(--transition-fast),
              color var(--transition-fast),
              border-color var(--transition-fast),
              transform var(--transition-fast);
}

/* タブレット以上: FAB表示 + 位置復元 */
@media (min-width: 768px) {
  .sp-fab {
    display: flex;
    bottom: var(--spacing-xl);
    right: var(--spacing-xl);
  }
}

.sp-fab:hover {
  background-color: var(--color-surface);
  color: var(--color-primary);
  border-color: var(--color-primary);
  transform: scale(1.05);
}

.sp-fab:active {
  background-color: var(--color-primary-light);
  color: var(--color-primary);
  transform: scale(0.95);
}

.sp-fab[aria-expanded="true"] {
  background-color: var(--color-brand-accent);
}

.sp-fab__icon {
  width: 24px;
  height: 24px;
  fill: currentColor;
}

/* ---------- 録音中パルスアニメーション ---------- */
.sp-fab--recording {
  background-color: var(--color-error);
  animation: sp-fab-pulse 1.2s ease-in-out infinite;
}

@keyframes sp-fab-pulse {
  0%, 100% { box-shadow: var(--shadow-fab); }
  50% { box-shadow: 0 0 0 12px rgba(198, 40, 40, 0.2); }
}

@media (prefers-reduced-motion: reduce) {
  .sp-fab--recording {
    animation: none;
  }
}

/* ---------- ツールチップ ---------- */
.sp-fab__tooltip {
  position: absolute;
  right: calc(100% + var(--spacing-sm));
  top: 50%;
  transform: translateY(-50%);
  white-space: nowrap;
  padding: var(--spacing-xs) var(--spacing-sm);
  font-size: var(--font-size-xs);
  color: var(--color-surface);
  background-color: var(--color-text-main);
  border-radius: var(--radius-sm);
  pointer-events: none;
  opacity: 0;
  transition: opacity var(--transition-fast);
}

.sp-fab:hover .sp-fab__tooltip,
.sp-fab:focus-visible .sp-fab__tooltip {
  opacity: 1;
}

/* === speech/_dialog.css === */

/* ==========================================================================
 * Speech: Dialog (.sp-dialog)
 * 音声対話UIダイアログ
 * ========================================================================== */
.sp-dialog {
  position: fixed;
  bottom: calc(var(--spacing-xl) + 56px + var(--spacing-md));
  right: var(--spacing-xl);
  z-index: var(--z-dialog);
  width: 360px;
  max-width: calc(100vw - var(--spacing-xl) * 2);
  max-height: 480px;
  background-color: var(--color-surface);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-dialog);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

/* [hidden] は _reset.css のグローバルルールで処理 */

.sp-dialog__header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: var(--spacing-md);
  border-bottom: var(--border-width) solid var(--color-border-light);
}

.sp-dialog__title {
  font-size: var(--font-size-base);
  font-weight: var(--font-weight-bold);
}

.sp-dialog__body {
  flex: 1;
  overflow-y: auto;
  padding: var(--spacing-md);
}

.sp-dialog__footer {
  padding: var(--spacing-sm) var(--spacing-md);
  border-top: var(--border-width) solid var(--color-border-light);
}

/* Overlay */
.sp-overlay {
  position: fixed;
  inset: 0;
  z-index: var(--z-overlay);
  background-color: var(--color-overlay);
}

/* ---------- Close Button ---------- */
.sp-dialog__close {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--touch-target-min);
  height: var(--touch-target-min);
  border: none;
  background: none;
  color: var(--color-text-sub);
  cursor: pointer;
  border-radius: var(--radius-sm);
  transition: background-color var(--transition-fast);
}

.sp-dialog__close:hover {
  background-color: var(--color-border-light);
}

/* ---------- ステータス表示 ---------- */
.sp-dialog__status {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
  padding: var(--spacing-xs) var(--spacing-md);
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
}

.sp-dialog__status-icon {
  width: 16px;
  height: 16px;
}

/* ---------- 対話履歴 ---------- */
.sp-dialog__messages {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  min-height: 0;
}

.sp-dialog__bubble {
  max-width: 85%;
  padding: var(--spacing-sm) var(--spacing-md);
  border-radius: var(--radius-md);
  font-size: var(--font-size-sm);
  line-height: var(--line-height-normal);
  word-break: break-word;
}

.sp-dialog__bubble--user {
  align-self: flex-end;
  background-color: var(--color-primary);
  color: var(--color-surface);
  border-bottom-right-radius: var(--radius-sm);
}

.sp-dialog__bubble--system {
  align-self: flex-start;
  background-color: var(--color-border-light);
  color: var(--color-text-main);
  border-bottom-left-radius: var(--radius-sm);
}

/* ---------- テキスト入力フォールバック ---------- */
.sp-dialog__input-area {
  display: flex;
  gap: var(--spacing-xs);
  padding: var(--spacing-sm) var(--spacing-md);
  border-top: var(--border-width) solid var(--color-border-light);
}

.sp-dialog__text-input {
  flex: 1;
  min-height: var(--touch-target-min);
  padding: var(--spacing-xs) var(--spacing-sm);
  font-size: var(--font-size-sm);
  font-family: var(--font-family-base);
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--radius-md);
  background-color: var(--color-surface);
  color: var(--color-text-main);
}

.sp-dialog__text-input::placeholder {
  color: var(--color-text-muted);
}

.sp-dialog__send-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: var(--touch-target-min);
  min-height: var(--touch-target-min);
  border: none;
  border-radius: var(--radius-md);
  background-color: var(--color-primary);
  color: var(--color-surface);
  cursor: pointer;
  transition: background-color var(--transition-fast);
}

.sp-dialog__send-btn:hover {
  background-color: var(--color-primary-hover);
}

/* ---------- メッセージ（初期案内） ---------- */
.sp-dialog__message {
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
  line-height: var(--line-height-normal);
}

/* ---------- ヘッダーアクションボタン群 ---------- */
.sp-dialog__header-actions {
  display: flex;
  align-items: center;
  gap: var(--spacing-xs);
}

.sp-dialog__settings-toggle {
  display: flex;
  align-items: center;
  justify-content: center;
  width: var(--touch-target-min);
  height: var(--touch-target-min);
  border: none;
  background: none;
  color: var(--color-text-sub);
  cursor: pointer;
  border-radius: var(--radius-sm);
  transition: background-color var(--transition-fast);
}

.sp-dialog__settings-toggle:hover {
  background-color: var(--color-border-light);
}

.sp-dialog__settings-toggle[aria-expanded="true"] {
  color: var(--color-primary);
}

/* ---------- 音声設定パネル ---------- */
.sp-dialog__settings {
  padding: var(--spacing-sm) var(--spacing-md);
  border-bottom: var(--border-width) solid var(--color-border-light);
  background-color: var(--color-bg-sub);
}

.sp-dialog__settings-group {
  border: none;
  padding: 0;
  margin: 0;
}

.sp-dialog__settings-legend {
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-bold);
  color: var(--color-text-main);
  margin-bottom: var(--spacing-sm);
}

.sp-dialog__settings-row {
  display: flex;
  align-items: center;
  gap: var(--spacing-sm);
  margin-bottom: var(--spacing-sm);
}

.sp-dialog__settings-label {
  flex-shrink: 0;
  width: 3em;
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
}

.sp-dialog__settings-range {
  flex: 1;
  min-width: 0;
  height: var(--touch-target-min);
  accent-color: var(--color-primary);
  cursor: pointer;
}

.sp-dialog__settings-value {
  flex-shrink: 0;
  width: 3.5em;
  text-align: right;
  font-size: var(--font-size-sm);
  color: var(--color-text-main);
  font-variant-numeric: tabular-nums;
}

.sp-dialog__settings-reset {
  display: block;
  width: 100%;
  min-height: var(--touch-target-min);
  padding: var(--spacing-xs) var(--spacing-sm);
  font-size: var(--font-size-sm);
  font-family: var(--font-family-base);
  color: var(--color-text-sub);
  background: none;
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: background-color var(--transition-fast);
}

.sp-dialog__settings-reset:hover {
  background-color: var(--color-border-light);
}

/* ==========================================================================
 * Speech: Consent Dialog (.sp-consent)
 * プライバシー同意ダイアログ
 * ========================================================================== */
.sp-consent {
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: calc(var(--z-dialog) + 1);
  width: 400px;
  max-width: calc(100vw - var(--spacing-xl) * 2);
  background-color: var(--color-surface);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-dialog);
  padding: var(--spacing-xl);
}

.sp-consent__title {
  font-size: var(--font-size-lg);
  font-weight: var(--font-weight-bold);
  margin-bottom: var(--spacing-md);
}

.sp-consent__body {
  margin-bottom: var(--spacing-md);
}

.sp-consent__text {
  font-size: var(--font-size-sm);
  color: var(--color-text-sub);
  line-height: var(--line-height-relaxed);
  margin-bottom: var(--spacing-lg);
}

.sp-consent__actions {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
}

.sp-consent__btn {
  display: block;
  width: 100%;
  min-height: var(--touch-target-min);
  padding: var(--spacing-sm) var(--spacing-md);
  font-size: var(--font-size-base);
  font-family: var(--font-family-base);
  font-weight: var(--font-weight-medium);
  border-radius: var(--radius-md);
  cursor: pointer;
  transition: background-color var(--transition-fast);
  border: none;
}

.sp-consent__btn--accept {
  background-color: var(--color-primary);
  color: var(--color-surface);
}

.sp-consent__btn--accept:hover {
  background-color: var(--color-primary-hover);
}

.sp-consent__btn--decline {
  background-color: transparent;
  color: var(--color-text-sub);
  border: var(--border-width) solid var(--color-border);
}

.sp-consent__btn--decline:hover {
  background-color: var(--color-border-light);
}

/* ---------- DOM Engine: ハイライト ---------- */
.is-highlighted {
  outline: 3px solid var(--color-primary);
  outline-offset: 4px;
  transition: outline-color 0.3s ease;
}

/* === speech/_visualizer.css === */

/* ==========================================================================
 * Speech: Visualizer (.sp-visualizer)
 * 音声波形アニメーション（認識中フィードバック）
 * ========================================================================== */
.sp-visualizer {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 3px;
  height: 32px;
  padding: var(--spacing-xs);
}

.sp-visualizer__bar {
  width: 3px;
  height: 100%;
  background-color: var(--color-primary);
  border-radius: var(--radius-full);
  transform-origin: bottom;
  animation: sp-visualizer-pulse 0.6s ease-in-out infinite alternate;
}

.sp-visualizer__bar:nth-child(2) { animation-delay: 0.1s; }
.sp-visualizer__bar:nth-child(3) { animation-delay: 0.2s; }
.sp-visualizer__bar:nth-child(4) { animation-delay: 0.3s; }
.sp-visualizer__bar:nth-child(5) { animation-delay: 0.4s; }

@keyframes sp-visualizer-pulse {
  0% { transform: scaleY(0.3); }
  100% { transform: scaleY(1); }
}

/* === speech/_chips.css === */

/* ==========================================================================
 * Speech: Chips (.sp-chips)
 * サジェストチップ（音声コマンド候補）
 * ========================================================================== */
.sp-chips {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-xs);
  padding: var(--spacing-xs) 0;
}

.sp-chips__item {
  display: inline-flex;
  align-items: center;
  min-height: var(--touch-target-min);
  padding: var(--spacing-xs) var(--spacing-md);
  font-size: var(--font-size-sm);
  color: var(--color-primary);
  background-color: var(--color-primary-light);
  border: var(--border-width) solid var(--color-primary);
  border-radius: var(--radius-full);
  cursor: pointer;
  transition: background-color var(--transition-fast),
              color var(--transition-fast);
}

.sp-chips__item:hover {
  background-color: var(--color-primary);
  color: var(--color-surface);
}

/* --- Wearable --- */

/* === wearable.css === */

/**
 * ウェアラブルデバイス対応CSS + ヘルスダッシュボード
 * Apple Watch、Wear OS等の小型デバイス向け最適化
 * 木古内町国民健康保険病院
 */

/* =================================================================
   ヘルスダッシュボード コンポーネント（全デバイス共通）
   ================================================================= */

/* センサーグリッド */
.wearable-sensor-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: var(--space-md, 16px);
  margin-bottom: var(--space-lg, 24px);
}

/* 大数字表示 */
.wearable-big-number {
  font-size: 2.5rem;
  font-weight: 700;
  color: var(--primary, #114FA1);
  line-height: 1.1;
  margin: var(--space-xs, 4px) 0;
}

/* 緊急リンク */
.wearable-emergency-link {
  color: var(--danger, #dc3545);
  font-weight: 700;
  text-decoration: none;
  font-size: 1.1rem;
}

.wearable-emergency-link:hover {
  text-decoration: underline;
}

/* フォーム */
.wearable-form {
  display: flex;
  flex-direction: column;
  gap: var(--space-sm, 8px);
}

.wearable-form__group {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.wearable-form__group label {
  font-weight: 500;
  font-size: 0.875rem;
}

.wearable-form__group small {
  color: var(--text-muted, #6c757d);
  font-weight: 400;
}

.wearable-form__group input,
.wearable-form__group select {
  padding: 10px 12px;
  border: 1px solid var(--border, #ddd);
  border-radius: 6px;
  font-size: 1rem;
  min-height: 44px;
}

/* クイックリンク */
.wearable-quick-links {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
  gap: var(--space-sm, 8px);
  margin-top: var(--space-lg, 24px);
}

.wearable-quick-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: var(--space-md, 16px) var(--space-sm, 8px);
  background: var(--bg-secondary, #f5f5f5);
  border-radius: 12px;
  text-decoration: none;
  color: var(--text, #333);
  font-size: 0.875rem;
  font-weight: 500;
  transition: background 0.2s;
  min-height: 44px;
}

.wearable-quick-link:hover {
  background: var(--bg-tertiary, #e8e8e8);
}

.wearable-quick-link--emergency {
  background: var(--danger, #dc3545);
  color: white;
}

.wearable-quick-link--emergency:hover {
  background: #c82333;
  color: white;
}

/* 履歴表示 */
.wearable-history-group {
  margin-bottom: var(--space-md, 16px);
}

.wearable-history-group h3 {
  font-size: 1rem;
  margin-bottom: var(--space-xs, 4px);
  color: var(--primary, #114FA1);
}

.wearable-history-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.wearable-history-list li {
  display: flex;
  justify-content: space-between;
  padding: 6px 0;
  border-bottom: 1px solid var(--border-light, #eee);
  font-size: 0.9rem;
}

.wearable-history-date {
  color: var(--text-muted, #6c757d);
  font-size: 0.8rem;
}

/* =================================================================
   超小型デバイス (200px以下) - スマートウォッチ基本
   ================================================================= */
@media screen and (max-width: 200px) {
  /* 基本リセット */
  body {
    padding: 4px;
    font-size: 0.625rem;
    line-height: 1.3;
  }

  /* ヘッダー非表示 */
  header,
  .header,
  .site-header {
    display: none !important;
  }

  /* フッター非表示 */
  footer,
  .footer,
  .site-footer {
    display: none !important;
  }

  /* ナビゲーション非表示（.sz-quickは除外） */
  nav:not(.sz-quick),
  .nav,
  .navigation,
  .menu {
    display: none !important;
  }

  /* メインコンテンツのみ表示 */
  main,
  .main-content {
    padding: 2px;
    margin: 0;
  }

  /* 見出し最適化 */
  h1 {
    font-size: 0.875rem;
    margin-bottom: 4px;
  }

  h2 {
    font-size: 0.75rem;
    margin-bottom: 3px;
  }

  h3 {
    font-size: 0.6875rem;
    margin-bottom: 2px;
  }

  /* 緊急連絡先を固定表示 */
  .wearable-emergency {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: #dc3545;
    color: white;
    text-align: center;
    padding: 8px 4px;
    font-size: 0.875rem;
    font-weight: bold;
    z-index: 9999;
  }

  .wearable-emergency a {
    color: white;
    text-decoration: none;
  }
}

/* =================================================================
   小型デバイス (200px - 280px) - スマートウォッチ拡張
   ================================================================= */
@media screen and (min-width: 201px) and (max-width: 280px) {
  body {
    padding: 6px;
    font-size: 0.75rem;
    line-height: 1.4;
  }

  /* 簡易ヘッダー */
  header,
  .header,
  .site-header {
    padding: 4px;
    background: var(--primary-color, #3a7f8c);
  }

  .site-logo img {
    max-height: 24px;
    width: auto;
  }

  /* ナビゲーション非表示（.sz-quickは除外） */
  nav:not(.sz-quick),
  .nav,
  .navigation,
  .menu,
  .navbar {
    display: none !important;
  }

  /* 見出し */
  h1 {
    font-size: 1rem;
    margin-bottom: 8px;
  }

  h2 {
    font-size: 0.875rem;
    margin-bottom: 6px;
  }

  /* カード・ボックス */
  .card,
  .box,
  .panel {
    padding: 8px;
    margin-bottom: 8px;
    border-radius: 4px;
  }

  /* ボタン最適化（タッチターゲット最小44px） */
  button,
  .btn,
  .button,
  a.btn {
    min-height: 44px;
    min-width: 44px;
    padding: 10px 12px;
    font-size: 0.875rem;
    border-radius: 6px;
  }

  /* 緊急連絡 */
  .emergency-call {
    position: fixed;
    bottom: 8px;
    left: 8px;
    right: 8px;
    background: #dc3545;
    color: white;
    text-align: center;
    padding: 12px;
    border-radius: 8px;
    font-weight: bold;
    z-index: 9999;
  }

  .emergency-call a {
    color: white;
    text-decoration: none;
    font-size: 1rem;
  }

  /* 診療時間シンプル表示 */
  .schedule-table {
    font-size: 0.625rem;
  }

  .schedule-table th,
  .schedule-table td {
    padding: 4px 2px;
  }

  /* フッター非表示 */
  footer,
  .footer,
  .site-footer {
    display: none !important;
  }
}

/* =================================================================
   小型スマートフォン (280px - 360px)
   ================================================================= */
@media screen and (min-width: 281px) and (max-width: 360px) {
  body {
    font-size: 0.875rem;
    line-height: 1.5;
  }

  /* コンパクトヘッダー */
  header,
  .site-header {
    padding: 8px;
  }

  .site-logo img {
    max-height: 32px;
  }

  /* ナビゲーション：ハンバーガーのみ */
  .nav-links,
  .nav-menu > li:not(.nav-toggle) {
    display: none;
  }

  .nav-toggle,
  .hamburger-menu {
    display: block !important;
    min-height: 44px;
    min-width: 44px;
  }

  /* 見出し */
  h1 {
    font-size: 1.25rem;
  }

  h2 {
    font-size: 1.125rem;
  }

  h3 {
    font-size: 1rem;
  }

  /* カード */
  .card {
    padding: 12px;
    margin-bottom: 12px;
  }

  /* タッチ最適化ボタン */
  button,
  .btn,
  a.btn {
    min-height: 44px;
    padding: 12px 16px;
  }

  /* グリッド1列化 */
  .grid,
  .row {
    display: block;
  }

  .col,
  .column,
  [class*="col-"] {
    width: 100%;
    margin-bottom: 12px;
  }
}

/* =================================================================
   タッチ最適化（全デバイス共通）
   ================================================================= */
@media (pointer: coarse) {
  /* タッチターゲット最小サイズ */
  a,
  button,
  input[type="button"],
  input[type="submit"],
  .btn,
  .link {
    min-height: 44px;
    min-width: 44px;
  }

  /* フォーム入力 */
  input[type="text"],
  input[type="email"],
  input[type="tel"],
  input[type="number"],
  select,
  textarea {
    min-height: 44px;
    font-size: 1rem; /* iOSでズーム防止 */
    padding: 12px;
  }

  /* リンク間隔 */
  nav ul li,
  .menu li {
    margin: 4px 0;
  }

  nav ul li a,
  .menu li a {
    padding: 12px 16px;
    display: block;
  }
}

/* =================================================================
   ウェアラブル専用コンポーネント
   ================================================================= */

/* 緊急連絡ボタン */
.wearable-emergency-btn {
  display: none;
}

@media screen and (max-width: 280px) {
  .wearable-emergency-btn {
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    background: linear-gradient(135deg, #dc3545, #c82333);
    color: white;
    text-align: center;
    padding: 16px 8px;
    font-size: 1rem;
    font-weight: bold;
    text-decoration: none;
    z-index: 9999;
    box-shadow: 0 -2px 10px rgba(0, 0, 0, 0.3);
  }

  .wearable-emergency-btn::before {
    content: "📞 ";
  }

  .wearable-emergency-btn:active {
    background: #a71d2a;
  }
}

/* 簡易情報カード */
.wearable-info-card {
  background: white;
  border-radius: 8px;
  padding: 12px;
  margin: 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

@media screen and (max-width: 280px) {
  .wearable-info-card {
    padding: 8px;
    margin: 4px;
    border-radius: 4px;
  }

  .wearable-info-card h3 {
    font-size: 0.75rem;
    margin-bottom: 4px;
  }

  .wearable-info-card p {
    font-size: 0.625rem;
    margin: 0;
  }
}

/* 診療時間バッジ */
.wearable-status-badge {
  display: inline-block;
  padding: 4px 8px;
  border-radius: 12px;
  font-size: 0.75rem;
  font-weight: bold;
}

.wearable-status-badge.open {
  background: #28a745;
  color: white;
}

.wearable-status-badge.closed {
  background: #6c757d;
  color: white;
}

@media screen and (max-width: 200px) {
  .wearable-status-badge {
    font-size: 0.625rem;
    padding: 2px 6px;
  }
}

/* =================================================================
   アクセシビリティ強化
   ================================================================= */

/* フォーカス表示 */
@media screen and (max-width: 280px) {
  :focus {
    outline: 3px solid #007bff;
    outline-offset: 2px;
  }

  :focus:not(:focus-visible) {
    outline: none;
  }

  :focus-visible {
    outline: 3px solid #007bff;
    outline-offset: 2px;
  }
}

/* 高コントラスト */
@media (prefers-contrast: high) {
  body {
    background: white;
    color: black;
  }

  a {
    color: #0000ee;
    text-decoration: underline;
  }

  button,
  .btn {
    border: 2px solid black;
  }
}

/* 動きを減らす */
@media (prefers-reduced-motion: reduce) {
  * {
    animation: none !important;
    transition: none !important;
  }
}

/* ダークモード — 無効化済み */

/* =================================================================
   印刷用（ウェアラブルからの印刷対応）
   ================================================================= */
@media print {
  .wearable-emergency-btn,
  .wearable-emergency {
    display: none !important;
  }

  nav,
  .nav,
  footer,
  .footer {
    display: none !important;
  }

  body {
    font-size: 12pt;
    color: black;
    background: white;
  }
}