@charset "UTF-8";
/* flowfig.css v2  2026-06-29b  list-spacing-locked */
/* 一般的な検査・診断の流れ（画像→HTML/CSS化）
   自己完結クラス（flowfig-）で既存CSSと衝突しない */
.flowfig{ --fnavy:#003b96; --fband:#e1e9f5; max-width:600px; margin:0 auto; padding:6px 0;
  font-family:"Noto Sans JP","Hiragino Kaku Gothic ProN",sans-serif; color:var(--fnavy); }
.flowfig *{ box-sizing:border-box; }
.flowfig__step{ display:flex; align-items:flex-start; gap:14px; background:var(--fband); padding:16px 22px; }
.flowfig__step > div{ min-width:0; } /* 帯内のテキストを確実に折り返す */
.flowfig__num{ font-size:27px; font-weight:700; line-height:1.05; flex:none; width:26px; text-align:center; }
.flowfig__ttl{ font-size:19px; font-weight:700; margin:0; line-height:1.45; }
/* リスト間隔は外部カスケード（本文行間2.0 / p+*余白 / 旧版CSSの残存）に左右されないよう
   !important で図側に固定。項目間は最小限に詰める */
.flowfig .flowfig__list{ list-style:none !important; margin:6px 0 0 !important; padding:0 !important; line-height:1.5 !important; }
.flowfig .flowfig__ttl + .flowfig__list{ margin-top:6px !important; }
.flowfig .flowfig__list li{ position:relative; margin:0 !important; padding:0 0 0 1.1em !important; font-size:14px; line-height:1.5 !important; overflow-wrap:anywhere; }
.flowfig .flowfig__list li + li{ margin-top:2px !important; }
.flowfig .flowfig__list li::before{ content:"\25CF"; position:absolute; left:0; top:.5em; font-size:9px; }
.flowfig .flowfig__list li.is-sub::before{ content:"" !important; }
.flowfig__arrow{ display:block; width:0; height:0; margin:9px auto;
  border-left:11px solid transparent; border-right:11px solid transparent; border-top:13px solid var(--fnavy); }
/* ステップ3：帯（左）＋バイパス（右）の2カラム。帯の幅を縮めて右側にバイパス領域を確保 */
.flowfig__branch{ display:flex; align-items:stretch; }
.flowfig__branch > .flowfig__step{ flex:1 1 auto; min-width:0; }
.flowfig__bypass{ flex:none; width:160px; position:relative; }
.flowfig__bypass-label{ display:block; font-size:13px; line-height:1.65; text-align:right; white-space:nowrap; padding:8px 14px 0 0; }
.flowfig__bypass-line{ position:absolute; top:6px; bottom:-31px; right:7px; width:2px; background:var(--fnavy); } /* bottom:-31px=下向き矢印分だけ下へ伸ばしステップ4の手前へ */
.flowfig__bypass-line::after{ content:""; position:absolute; left:50%; bottom:-1px; transform:translateX(-50%);
  width:0; height:0; border-left:6px solid transparent; border-right:6px solid transparent; border-top:9px solid var(--fnavy); }
@media (max-width:480px){
  .flowfig__num{ font-size:23px; width:22px; }
  .flowfig__ttl{ font-size:17px; }
  .flowfig .flowfig__list li{ line-height:1.5 !important; }
  /* バイパスのラベルを帯の上（2→3の矢印の右・白地）へ逃がし、帯にほぼ全幅を確保 */
  .flowfig__branch{ margin-top:22px; } /* ラベルを白地に収め、ステップ2の帯と重ならないための余白 */
  .flowfig__bypass{ width:24px; }
  .flowfig__bypass-label{ position:absolute; right:0; bottom:100%; margin-bottom:6px;
    white-space:nowrap; font-size:11px; line-height:1.45; text-align:right; padding:0; }
}
