<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 760 420" width="760" height="420">
  <defs>
    <style>text { font-family: 'Noto Sans JP','Hiragino Sans',sans-serif; }</style>
  </defs>
  <rect width="760" height="420" rx="12" fill="#F8FAFC"/>
  <text x="380" y="32" text-anchor="middle" font-size="15" font-weight="700" fill="#1E293B">働きながら合格を掴む24時間ドッキングマップ</text>
  <text x="380" y="52" text-anchor="middle" font-size="11" fill="#64748B">生活の導線の中に、15〜30分の「小さなハコ」を固定で埋め込む</text>

  <!-- timeline base -->
  <line x1="50" y1="200" x2="710" y2="200" stroke="#CBD5E1" stroke-width="3"/>

  <!-- time markers -->
  <text x="80" y="222" text-anchor="middle" font-size="10" fill="#94A3B8">7:00</text>
  <text x="230" y="222" text-anchor="middle" font-size="10" fill="#94A3B8">9:00</text>
  <text x="380" y="222" text-anchor="middle" font-size="10" fill="#94A3B8">12:30</text>
  <text x="530" y="222" text-anchor="middle" font-size="10" fill="#94A3B8">19:00</text>
  <text x="670" y="222" text-anchor="middle" font-size="10" fill="#94A3B8">23:00</text>

  <!-- markers on line -->
  <circle cx="80" cy="200" r="4" fill="#64748B"/>
  <circle cx="230" cy="200" r="4" fill="#64748B"/>
  <circle cx="380" cy="200" r="4" fill="#64748B"/>
  <circle cx="530" cy="200" r="4" fill="#64748B"/>
  <circle cx="670" cy="200" r="4" fill="#64748B"/>

  <!-- Box 1: 出勤前 (base activity, above line, neutral) -->
  <rect x="40" y="70" width="90" height="46" rx="8" fill="#F1F5F9" stroke="#CBD5E1" stroke-width="1.5"/>
  <text x="85" y="90" text-anchor="middle" font-size="10" font-weight="700" fill="#475569">出勤前</text>
  <text x="85" y="105" text-anchor="middle" font-size="9" fill="#64748B">身支度・朝食</text>
  <line x1="85" y1="116" x2="85" y2="196" stroke="#CBD5E1" stroke-width="1.5" stroke-dasharray="3,3"/>

  <!-- Box 2: 通勤電車15分 (pastel blue, below line) -->
  <line x1="230" y1="204" x2="230" y2="240" stroke="#93C5FD" stroke-width="1.5" stroke-dasharray="3,3"/>
  <rect x="180" y="244" width="100" height="70" rx="8" fill="#DBEAFE" stroke="#3B82F6" stroke-width="2"/>
  <text x="230" y="264" text-anchor="middle" font-size="10.5" font-weight="700" fill="#1D4ED8">通勤電車</text>
  <text x="230" y="280" text-anchor="middle" font-size="13" font-weight="700" fill="#1E40AF">15分</text>
  <text x="230" y="298" text-anchor="middle" font-size="8.5" fill="#1E40AF">スマホで1講義</text>

  <!-- Box 3: 昼休憩スマホ1問 (pastel yellow, above line) -->
  <line x1="380" y1="196" x2="380" y2="160" stroke="#FDE68A" stroke-width="1.5" stroke-dasharray="3,3"/>
  <rect x="330" y="90" width="100" height="70" rx="8" fill="#FEF9C3" stroke="#EAB308" stroke-width="2"/>
  <text x="380" y="110" text-anchor="middle" font-size="10.5" font-weight="700" fill="#A16207">昼休憩</text>
  <text x="380" y="126" text-anchor="middle" font-size="13" font-weight="700" fill="#854D0E">1問だけ</text>
  <text x="380" y="144" text-anchor="middle" font-size="8.5" fill="#854D0E">スマホで演習アプリ</text>

  <!-- Box 4: 帰りのカフェ20分 (pastel green, below line, priority) -->
  <line x1="530" y1="204" x2="530" y2="240" stroke="#86EFAC" stroke-width="1.5" stroke-dasharray="3,3"/>
  <rect x="480" y="244" width="100" height="76" rx="8" fill="#DCFCE7" stroke="#22C55E" stroke-width="2.5"/>
  <text x="530" y="264" text-anchor="middle" font-size="10.5" font-weight="700" fill="#15803D">帰りのカフェ</text>
  <text x="530" y="282" text-anchor="middle" font-size="13" font-weight="700" fill="#166534">20分</text>
  <text x="530" y="300" text-anchor="middle" font-size="8.5" fill="#166534">その日一番の集中枠</text>
  <rect x="490" y="306" width="80" height="14" rx="7" fill="#22C55E"/>
  <text x="530" y="317" text-anchor="middle" font-size="8" font-weight="700" fill="#fff">1日の主戦場</text>

  <!-- Box 5: 帰宅後 (neutral, above line) -->
  <rect x="630" y="70" width="90" height="46" rx="8" fill="#F1F5F9" stroke="#CBD5E1" stroke-width="1.5"/>
  <text x="675" y="90" text-anchor="middle" font-size="10" font-weight="700" fill="#475569">帰宅後</text>
  <text x="675" y="105" text-anchor="middle" font-size="9" fill="#64748B">お風呂・就寝準備</text>
  <line x1="675" y1="116" x2="675" y2="196" stroke="#CBD5E1" stroke-width="1.5" stroke-dasharray="3,3"/>

  <!-- Bottom summary -->
  <rect x="40" y="340" width="680" height="60" rx="10" fill="#FFFBEB" stroke="#FDE68A" stroke-width="2"/>
  <text x="380" y="362" text-anchor="middle" font-size="12" font-weight="700" fill="#92400E">合計 約55分／日 ── 新しい時間を作らず、既存の導線に勉強をドッキングするだけ</text>
  <text x="380" y="382" text-anchor="middle" font-size="9.5" fill="#B45309">通勤15分＋昼1問＋帰りのカフェ20分＝毎日固定で回せる「超小さなハコ」の合計</text>
</svg>
