/* CSS Document */

/* =========================================================
  /reasons 
========================================================= */

/* tokens */
#c11_3{
  --ink:#1f2937;
  --muted:#6b7280;
  --accent:#2fa994;            /* ブランドグリーン */
  --accent-weak: rgba(47,169,148,.18);
  --radius:14px;
  max-width:1146px;
  width:100%;
  margin:0 auto;
  color:var(--ink);
}

/* ヘッダー固定対策（内部アンカー） */
#c11_3 [id^="Reasons"]{ scroll-margin-top: 92px; }

/* ---- 小見出し（1.〜6.） ---- */
#c11_3 .c11_3_m_wrap{margin: 28px 8px 8px; }
#c11_3 .midashi_04l_min{
  display:inline-block;
  position:relative;
  padding-left: 28px;
  font-weight:800;
  font-size: clamp(18px, 2.3vw, 24px);
  line-height:1.25;
  background: none;
  border: 0;
  color:#0f3d36;
}
#c11_3 .midashi_04l_min::before{
  content:"";
  position:absolute; left:0; top:50%; transform:translateY(-50%);
  width:12px; height:12px; border-radius:999px;
  background:var(--accent);
  box-shadow: 0 0 0 6px var(--accent-weak);
}
#c11_3 .midashi_04l_min::after{
  content:"";
  display:block;
  height:3px; width:72px; margin-top:10px;
  background:var(--accent);
  border-radius:999px;
}

/* ---- 本文＋画像の並び ---- */
#c11_3 .c11_3_t_wrap{
  display:grid;
  grid-template-columns: 1.15fr 1fr;      /* テキストやや広め */
  gap: clamp(16px, 3vw, 36px);
  align-items:center;
  margin: 6px 0 32px;
}

/* 偶数ブロックで左右を反転（PC時のみ） */
#c11_3 > .c11_3_t_wrap:nth-of-type(2n) > div:first-child{ order:2; }
#c11_3 > .c11_3_t_wrap:nth-of-type(2n) > div:last-child{  order:1; }

/* ---- 本文（“枠で囲まない”最小デザイン） ---- */
#c11_3 .c11_3_t{
  font-size: clamp(15px, 1.5vw, 16.5px);
  line-height: 1.9;
  padding-left: clamp(14px, 2vw, 20px);
  border-left: 3px solid var(--accent);   /* ← 最小限のガイド */
}
#c11_3 .c11_3_t p{ margin:0 0 1.1em; color:var(--ink); }
#c11_3 .c11_3_t br{ line-height:1.2; }

/* ---- 画像（角丸のみ・影なし） ---- */
#c11_3 .c11_3_t_wrap > div:last-child img{
  display:block;
  width:100%;
  height:auto;
  border-radius: var(--radius);
}

/* ---- レスポンシブ ---- */
@media (max-width: 1024px){
  #c11_3 .c11_3_t_wrap{ grid-template-columns: 1.1fr 1fr; }
}
@media (max-width: 768px){
  #c11_3 .c11_3_t_wrap{
    grid-template-columns: 1fr;           /* SPは縦積み */
    gap: 14px;
  }
  /* 自然な順序に戻す */
  #c11_3 > .c11_3_t_wrap:nth-of-type(2n) > div:first-child{ order:1; }
  #c11_3 > .c11_3_t_wrap:nth-of-type(2n) > div:last-child{  order:2; }
}

/* ---- ダークモード（軽） ---- */
@media (prefers-color-scheme: dark){
  #c11_3{ --ink:#e5e7eb; --muted:#9aa3b2; }
  #c11_3 .midashi_04l_min{ color:#e5f3f0; }
  #c11_3 .c11_3_t{ border-left-color: color-mix(in srgb, var(--accent) 92%, white 8%); }
}