@charset "UTF-8";
/* =====================================================================
   無呼吸ラボ 記事ページ共通スタイル（第2段階・レスポンシブ）
   page-responsive.css と同じデザイン言語：ネイビー基調・罫線ベース・フラット。
   ハブ用の page-responsive.css とセットで読み込む。
   ===================================================================== */

/* パンくず位置調整：
   固定ヘッダー分のオフセットを .p-main から .p-bc（パンくず）に付け替える。
   （本ページはパンくずを main の外に置くため、p-main側のpaddingでは被ってしまう） */
.p-bc{ margin-top:119px; }
.p-main{ padding-top:0; }

/* 記事レイアウト（本文＋ローカルナビの2カラム） */
.a-layout{ display:flex; gap:36px; align-items:flex-start; }
.a-article{ flex:1; min-width:0; max-width:760px; margin:0; padding-bottom:56px; }

/* ローカルナビ（PC：右カラム／SP：記事下） */
.a-localnav{ flex:none; width:250px; position:sticky; top:24px; margin-top:36px; border:1px solid var(--p-line-d); border-radius:4px; overflow:hidden; background:#fff; }
.a-localnav__heading{ display:block; background:var(--p-soft); border-bottom:1px solid var(--p-line-d); padding:11px 16px; font-size:13.5px; font-weight:800; color:var(--p-navy); margin:0; }
.a-localnav__list{ list-style:none; margin:0; padding:0; }
.a-localnav__list li{ border-top:1px solid var(--p-line); }
.a-localnav__list li:first-child{ border-top:none; }
.a-localnav__list a{ position:relative; display:block; padding:13px 30px 13px 16px; font-size:12.5px; line-height:1.65; color:var(--p-ink); text-decoration:none; transition:background .15s; }
.a-localnav__list a::after{ content:""; position:absolute; right:14px; top:50%; width:7px; height:7px; border-top:2px solid var(--p-navy); border-right:2px solid var(--p-navy); transform:translateY(-50%) rotate(45deg); opacity:.55; }
.a-localnav__list a:hover{ background:var(--p-soft); }
.a-localnav__list a:hover::after{ opacity:1; }
.a-localnav__list li.current a{ color:var(--p-navy-d); font-weight:700; background:var(--p-soft); box-shadow:inset 4px 0 0 var(--p-navy); pointer-events:none; }
.a-localnav__list li.current a::after{ content:none; }
.a-localnav__index a{ color:var(--p-navy); font-weight:700; text-align:center; padding-right:16px; }
.a-localnav__index a::after{ position:static; display:inline-block; margin-left:8px; transform:rotate(45deg); vertical-align:1px; }
.a-article__head{ display:flex; align-items:flex-end; gap:24px; padding:36px 0 24px; border-bottom:1px solid var(--p-line); margin-bottom:30px; }
.a-article__headtext{ flex:1; min-width:0; }
.a-article__eyebrow{ display:block; font-size:13px; font-weight:700; color:var(--p-navy); letter-spacing:.02em; margin:0 0 10px; }
.a-article__title{ font-size:clamp(23px,3.4vw,31px); font-weight:800; color:var(--p-navy-d); margin:0; letter-spacing:-.01em; line-height:1.5; }
.a-article__mv{ flex:none; width:200px; }
.a-article__mv img{ width:100%; border-radius:4px; }

/* 医師ボックス（お話を伺った先生／監修） */
.a-doctor{ border:1px solid var(--p-line-d); border-radius:4px; margin:0 0 30px; overflow:hidden; }
.a-doctor__label{ display:block; background:var(--p-soft); border-bottom:1px solid var(--p-line); padding:9px 18px; font-size:13px; font-weight:800; color:var(--p-navy); }
.a-doctor__body{ padding:18px; }
.a-doctor__head{ display:flex; gap:16px; align-items:center; margin-bottom:14px; }
.a-doctor__photo{ flex:none; width:84px; }
.a-doctor__photo img{ width:84px; height:84px; object-fit:cover; border-radius:4px; border:1px solid var(--p-line); }
.a-doctor__text{ flex:1; min-width:0; }
.a-doctor__name{ font-size:16.5px; font-weight:800; color:var(--p-ink); margin:0 0 3px; }
.a-doctor__role{ font-size:13px; color:var(--p-sub); margin:0; }
.a-doctor__bio{ font-size:13px; color:var(--p-sub); line-height:1.85; margin:0; }

/* リード */
.a-lead p{ font-size:15.5px; margin:0 0 1.2em; }

/* 目次 */
.a-toc{ background:var(--p-soft); border:1px solid var(--p-line); border-radius:4px; padding:20px 24px; margin:32px 0 40px; }
.a-toc__title{ font-size:14px; font-weight:800; color:var(--p-navy); margin:0 0 10px; }
.a-toc__list{ margin:0; padding:0 0 0 1.4em; font-size:14px; }
.a-toc__list li{ margin:5px 0; }
.a-toc__list a{ color:var(--p-link); text-decoration:none; }
.a-toc__list a:hover{ text-decoration:underline; }

/* 本文見出し */
.a-body h2{ font-size:clamp(19px,2.6vw,23px); font-weight:800; color:var(--p-navy-d); line-height:1.5;
  margin:52px 0 20px; padding:12px 16px; background:var(--p-soft); border-left:4px solid var(--p-navy); border-radius:0 4px 4px 0; }
.a-body h3{ font-size:clamp(16.5px,2.2vw,18.5px); font-weight:800; color:var(--p-ink); line-height:1.55;
  margin:36px 0 14px; padding-bottom:9px; border-bottom:1px solid var(--p-line-d); }
.a-body h4{ font-size:15.5px; font-weight:800; color:var(--p-ink); margin:28px 0 12px; }

/* 本文 */
.a-body p{ font-size:15.5px; margin:0 0 1.2em; }
.a-body ul{ margin:0 0 1.4em; padding:0 0 0 1.5em; font-size:15.5px; }
.a-body ul li{ margin:6px 0; }

/* 強調（docxの太字／太字＋ハイライトを反映） */
.a-body strong{ font-weight:700; color:var(--p-ink); }
.a-marker{ font-weight:700; background:linear-gradient(transparent 58%, #ffe895 58%); padding:0 1px; }

/* 本文図版 */
.a-fig{ margin:26px auto 30px; max-width:560px; }
.a-fig img{ width:100%; border-radius:4px; border:1px solid var(--p-line); }
.a-fig figcaption{ font-size:12px; color:var(--p-sub); margin-top:8px; text-align:center; }

/* 医師コメント
   見出しH2（ソフト背景＋ネイビー左罫線）との差別化：
   白背景＋全周罫線の「コメントカード」スタイル */
.a-quote{ margin:20px 0 26px; padding:16px 20px; background:#fff; border:1px solid var(--p-line-d); border-radius:4px; }
.a-quote p{ margin:0; font-size:15px; color:var(--p-ink); }

/* 記事ご利用にあたって */
.a-note{ margin:44px 0 0; padding:18px 20px; border:1px solid var(--p-line-d); border-radius:4px; background:#fff; }
.a-note__title{ font-size:14px; font-weight:800; color:var(--p-ink); margin:0 0 8px; }
.a-note p{ font-size:13px; color:var(--p-sub); line-height:1.85; margin:0; }

/* 参考文献 */
.a-refs{ margin:40px 0 0; }
.a-refs__title{ font-size:15px; font-weight:800; color:var(--p-ink); margin:0 0 12px; padding-bottom:8px; border-bottom:1px solid var(--p-line-d); }
.a-refs ol{ margin:0; padding:0 0 0 1.5em; font-size:12.5px; color:var(--p-sub); }
.a-refs ol li{ margin:0 0 10px; line-height:1.75; }
.a-refs a{ color:var(--p-link); word-break:break-all; }

/* 取材協力 */
.a-support{ margin:36px 0 0; padding:18px 20px; border:1px solid var(--p-line); border-radius:4px; background:var(--p-soft); }
.a-support__title{ font-size:13px; font-weight:800; color:var(--p-navy); margin:0 0 8px; }
.a-support p{ font-size:13.5px; margin:0; line-height:1.85; }

/* レスポンシブ */
@media (max-width:768px){
  .p-bc{ margin-top:56px; }
  .a-layout{ flex-direction:column; gap:0; }
  .a-localnav{ position:static; width:100%; margin:8px 0 40px; }
  .a-article{ padding-bottom:40px; }
  .a-article__head{ padding:24px 0 18px; margin-bottom:24px; gap:14px; align-items:flex-end; }
  .a-article__mv{ width:104px; }
  .a-toc{ padding:16px 18px; margin:26px 0 32px; }
  .a-body h2{ margin:42px 0 16px; padding:10px 14px; }
  .a-body h3{ margin:30px 0 12px; }
  .a-doctor__body{ padding:15px 16px; }
  .a-doctor__head{ gap:12px; margin-bottom:12px; }
  .a-doctor__photo{ width:68px; }
  .a-doctor__photo img{ width:68px; height:68px; }
  .a-quote{ padding:14px 16px; }
  .a-fig{ margin:22px auto 26px; }
}