<svg viewBox="0 0 1200 675" xmlns="http://www.w3.org/2000/svg" font-family="'Hiragino Kaku Gothic ProN','Hiragino Sans','Noto Sans JP',sans-serif">
  <defs>
    <linearGradient id="titleUnderlineWihRoleStock" x1="0" y1="0" x2="1" y2="0">
      <stop offset="0" stop-color="#79bb74"/>
      <stop offset="1" stop-color="#55aae2"/>
    </linearGradient>
    <linearGradient id="hubGradWihRoleStock" x1="0" y1="0" x2="1" y2="1">
      <stop offset="0" stop-color="#79bb74"/>
      <stop offset="1" stop-color="#55aae2"/>
    </linearGradient>
    <marker id="arrowHeadWihRoleStock" markerWidth="9" markerHeight="9" refX="6" refY="4.5" orient="auto">
      <path d="M0,0 L9,4.5 L0,9 Z" fill="#a9a9a9"/>
    </marker>
  </defs>

  <rect x="0" y="0" width="1200" height="675" fill="#ffffff"/>

  <!-- タイトル -->
  <text x="600" y="46" text-anchor="middle" font-size="26" font-weight="700" fill="#2d2d2d">ホームページは「公式の案内所」</text>
  <rect x="420" y="62" width="360" height="4" rx="2" fill="url(#titleUnderlineWihRoleStock)"/>

  <!-- 中央ハブ -->
  <ellipse cx="600" cy="310" rx="118" ry="70" fill="url(#hubGradWihRoleStock)"/>
  <text x="600" y="300" text-anchor="middle" font-size="17" font-weight="700" fill="#ffffff">ホームページ</text>
  <text x="600" y="325" text-anchor="middle" font-size="14" fill="#eafaf0">24時間開いている</text>
  <text x="600" y="343" text-anchor="middle" font-size="14" fill="#eafaf0">公式の案内所</text>

  <!-- スポーク1: 左上 住所・営業時間 -->
  <path d="M 505 265 L 330 175" stroke="#a9a9a9" stroke-width="2" fill="none" marker-end="url(#arrowHeadWihRoleStock)"/>
  <rect x="90" y="95" width="290" height="100" rx="14" fill="#f4f9f3" stroke="#79bb74" stroke-width="2"/>
  <text x="235" y="130" text-anchor="middle" font-size="15" font-weight="700" fill="#3f6b3c">住所・営業時間</text>
  <text x="235" y="155" text-anchor="middle" font-size="13" fill="#4a4a4a">どこにある？何時まで？</text>
  <text x="235" y="176" text-anchor="middle" font-size="13" fill="#4a4a4a">に正確に答える</text>

  <!-- スポーク2: 右上 メニュー・料金 -->
  <path d="M 695 265 L 870 175" stroke="#a9a9a9" stroke-width="2" fill="none" marker-end="url(#arrowHeadWihRoleStock)"/>
  <rect x="820" y="95" width="290" height="100" rx="14" fill="#f2f8fc" stroke="#55aae2" stroke-width="2"/>
  <text x="965" y="130" text-anchor="middle" font-size="15" font-weight="700" fill="#2f6a91">メニュー・料金</text>
  <text x="965" y="155" text-anchor="middle" font-size="13" fill="#4a4a4a">何をいくらで受けられる</text>
  <text x="965" y="176" text-anchor="middle" font-size="13" fill="#4a4a4a">かを自分の言葉で発信</text>

  <!-- スポーク3: 左下 お店の想い -->
  <path d="M 495 360 L 330 460" stroke="#a9a9a9" stroke-width="2" fill="none" marker-end="url(#arrowHeadWihRoleStock)"/>
  <rect x="90" y="465" width="290" height="100" rx="14" fill="#fdf1e7" stroke="#e0894a" stroke-width="2"/>
  <text x="235" y="500" text-anchor="middle" font-size="15" font-weight="700" fill="#a85a1e">お店の想い</text>
  <text x="235" y="525" text-anchor="middle" font-size="13" fill="#4a4a4a">どんな人がやっている</text>
  <text x="235" y="546" text-anchor="middle" font-size="13" fill="#4a4a4a">お店かが伝わる</text>

  <!-- スポーク4: 右下 問い合わせ -->
  <path d="M 705 360 L 870 460" stroke="#a9a9a9" stroke-width="2" fill="none" marker-end="url(#arrowHeadWihRoleStock)"/>
  <rect x="820" y="465" width="290" height="100" rx="14" fill="#f4f9f3" stroke="#79bb74" stroke-width="2"/>
  <text x="965" y="500" text-anchor="middle" font-size="15" font-weight="700" fill="#3f6b3c">問い合わせ</text>
  <text x="965" y="525" text-anchor="middle" font-size="13" fill="#4a4a4a">質問・予約の連絡手段を</text>
  <text x="965" y="546" text-anchor="middle" font-size="13" fill="#4a4a4a">いつでも用意しておく</text>

  <!-- フッター -->
  <rect x="90" y="595" width="1020" height="60" rx="12" fill="#f5f5f3"/>
  <text x="600" y="631" text-anchor="middle" font-size="15.5" font-weight="700" fill="#2d2d2d">紙のチラシと違い、印刷し直さずいつでも内容を更新できる「公式の置き場所」</text>
</svg>
