@charset "UTF-8";
/* =========================================================
   むらつ歯科クリニック インプラント専門サイト｜ナビゲーション拡張CSS
   - グロナビのプルダウン（PC）
   - SPドロワーの子ページリンク
   style.css（共通）の後に全ページで読み込む（functions.php）
   2026-09-24
   ========================================================= */

/* ---- グロナビ：項目ラッパー ---- */
.gnav-in > .gnav-item { flex:1; position:relative; display:flex; }
.gnav-in > .gnav-item > a { flex:1; border-right:0; }
.gnav-in > .gnav-item:last-of-type > a { border-right:1px solid #f0eaee; }
.gnav-in > .gnav-item.has-sub > a { padding-right:18px; }
.gnav-in > .gnav-item.has-sub > a::after { content:""; position:absolute; right:8px; top:50%; width:6px; height:6px; margin-top:-5px; border-right:1.5px solid #b0a6ae; border-bottom:1.5px solid #b0a6ae; transform:rotate(45deg); transition:transform .2s, border-color .2s; }
.gnav-in > .gnav-item { position:relative; }
.gnav-in > .gnav-item > a { position:relative; }
.gnav-in > .gnav-item:hover > a, .gnav-in > .gnav-item:focus-within > a { background:#faf6f8; color:var(--wine); }
.gnav-in > .gnav-item:hover > a::after, .gnav-in > .gnav-item:focus-within > a::after { transform:rotate(-135deg); margin-top:-1px; border-color:var(--pink-d); }

/* ---- プルダウン本体 ---- */
.gnav .gnav-sub { display:none; position:absolute; top:100%; left:0; min-width:280px; margin:0; padding:6px 0 8px; list-style:none; background:#fff; border-top:3px solid var(--pink-d); box-shadow:0 18px 44px rgba(60,40,50,.18); z-index:120; text-align:left; }
.gnav .gnav-item:hover > .gnav-sub, .gnav .gnav-item:focus-within > .gnav-sub { display:block; }
.gnav .gnav-sub li { margin:0; padding:0; }
.gnav .gnav-sub a { display:block; flex:none; text-align:left; padding:12px 22px 12px 30px; font-size:1.35rem; font-weight:500; line-height:1.5; color:#3a3542; border:0; border-bottom:1px solid #f4eef1; white-space:nowrap; position:relative; }
.gnav .gnav-sub li:last-child a { border-bottom:0; }
.gnav .gnav-sub a::before { content:""; position:absolute; left:14px; top:50%; width:6px; height:6px; margin-top:-3px; background:var(--gold-l); transform:rotate(45deg); }
.gnav .gnav-sub a:hover, .gnav .gnav-sub a:focus { background:#f6ecf0; color:var(--wine); }
.gnav .gnav-sub a:hover::before { background:var(--pink-d); }
/* 右端寄りの項目は右揃えで開く（画面外へのはみ出し防止） */
.gnav-in > .gnav-item:nth-last-of-type(-n+3) > .gnav-sub { left:auto; right:0; }

/* ---- タブレット（グロナビが横スクロールになる幅）ではプルダウンを無効化 ---- */
@media (max-width:1080px) {
  .gnav-in > .gnav-item { flex:0 0 auto; min-width:120px; }
  .gnav .gnav-sub { display:none !important; }
  .gnav-in > .gnav-item.has-sub > a::after { display:none; }
  .gnav-in > .gnav-item.has-sub > a { padding-right:6px; }
}

/* ---- SPドロワー：カテゴリ＋子ページ ---- */
.drawer-nav .drawer-cat { background:#faf6f8; color:var(--wine); font-size:1.5rem; padding:14px 26px; }
.drawer-nav .drawer-cat small { display:block; font-family:"EB Garamond",serif; font-style:italic; font-weight:400; font-size:1.2rem; letter-spacing:.14em; color:#b0a6ae; }
.drawer-nav .drawer-sub { padding:12px 22px 12px 44px; font-size:1.4rem; font-weight:500; color:#5c5464; border-bottom:1px solid #f6f1f4; position:relative; }
.drawer-nav .drawer-sub::before { content:""; position:absolute; left:28px; top:50%; width:5px; height:5px; margin-top:-2px; background:var(--gold-l); transform:rotate(45deg); }
.drawer-nav .drawer-top { font-size:1.5rem; }

/* TOP ドクター紹介：SPで飾り線が画面外にはみ出さないように（2026-09-24） */
@media (max-width:720px) {
  .doc-ph2 { max-width:calc(100% - 14px); margin-right:14px; }
  .doc-ph2::after { right:-10px; bottom:-10px; }
  .doc-catch h2 { font-size:2.3rem; line-height:1.6; }
}

/* 2026-09-30 ページ最上部のサイト見出し（TOP=h1／下層=p） */
.site-h1 { margin:0; background:#faf6f8; border-bottom:1px solid #f0eaee; font-family:"Noto Sans JP",sans-serif; font-size:1.15rem; font-weight:500; line-height:1.5; letter-spacing:.06em; color:#6b6472; position:relative; z-index:61; }
.site-h1__in { display:block; width:1380px; max-width:calc(100% - 40px); margin:0 auto; padding:6px 0; }
@media (max-width: 767px) {
  .site-h1 { font-size:1.3rem; letter-spacing:.02em; }
  .site-h1__in { max-width:calc(100% - 32px); padding:5px 0; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
}

/* ---- 2026-09-30 SPドロワー：カテゴリをプルダウン（アコーディオン）に ---- */
.drawer-nav .drawer-cat { display:block; width:100%; text-align:left; border:0; border-bottom:1px solid #f0eaee; cursor:pointer; font-family:inherit; font-weight:700; line-height:1.4; position:relative; padding-right:52px; -webkit-appearance:none; appearance:none; }
.drawer-nav .drawer-cat .drawer-arrow { position:absolute; right:24px; top:50%; width:10px; height:10px; margin-top:-8px; border-right:2px solid var(--wine); border-bottom:2px solid var(--wine); transform:rotate(45deg); transition:transform .25s ease, margin-top .25s ease; }
.drawer-nav .drawer-cat[aria-expanded="true"] { background:#f3e9ee; }
.drawer-nav .drawer-cat[aria-expanded="true"] .drawer-arrow { transform:rotate(225deg); margin-top:-2px; }
.drawer-nav .drawer-subs { display:flex; flex-direction:column; background:#fff; }
.drawer-nav .drawer-subs .drawer-sub { display:block; }
.drawer-nav .drawer-subs[hidden] { display:none; }
.drawer-nav .drawer-subs .drawer-sub:last-child { border-bottom:1px solid #f0eaee; }