@charset "UTF-8";
/* ==========================================================================
   components.css - 岩本町クリニック テンプレート 共通コンポーネント
   全ページ共通のUI部品（メガメニュー / ドロワー / パンくず / 文字サイズ切替）
   ========================================================================== */

/* グローバルナビ共通フォント（PCナビ + ドロワー） */
#nav-inner .hidden.lg\:flex,
#nav-inner .hidden.lg\:flex a,
.nav-drop-link,
.drawer-nav-ja {
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
}

/* --- ドロワー レスポンシブ（SP） --- */
@media (max-width: 767px) {
  .drawer-fullscreen {
    overflow-y: auto;
  }
  .drawer-acc-btn {
    padding: 13px 0;
  }
}

/* ===== 見出しデザイン（h2: 下線 + アクセントライン） ===== */
h2 {
  border-bottom: solid 3px #c8e6a0;
  position: relative;
  padding-bottom: 8px;
}
h2::after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #7cb342;
  bottom: -3px;
  left: 0;
  width: 30%;
}

/* ============================================================
   ハンバーガーアイコン（共通: SP メニュー開閉ボタン）
   ============================================================ */
.ham-box{
  width:20px; height:14px; position:relative;
}
.ham-line{
  position:absolute; left:0; width:100%; height:2px;
  background:#fff; border-radius:2px;
  transition:transform 0.4s cubic-bezier(0.23,1,0.32,1), opacity 0.25s ease;
  transform-origin:center center;
}
.ham-line--top{ top:0; }
.ham-line--mid{ top:6px; transition:transform 0.4s cubic-bezier(0.23,1,0.32,1), opacity 0.25s ease, width 0.3s ease; }
.ham-line--bot{ bottom:0; }

/* === 下層ページ MAIN 共通背景 === */
.main-bg{ background:#fafaf7; }

/* === body 共通: 固定ナビバー分の上余白 === */
body.has-fixed-nav{ padding-top: 70px; }

/* ============================================================
   フェードインアニメーション（共通: スクロール時に出現）
   - JS: js/common.js の IntersectionObserver で .is-visible を付与
   ============================================================ */
.fade-in{
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
}
.fade-in.is-visible{
  opacity: 1;
  transform: translateY(0);
}
