<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="titleUnderlineGettingStarted" x1="0" y1="0" x2="1" y2="0">
      <stop offset="0" stop-color="#79bb74"/>
      <stop offset="1" stop-color="#55aae2"/>
    </linearGradient>
  </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">登録完了までの3ステップ</text>
  <rect x="480" y="62" width="240" height="4" rx="2" fill="url(#titleUnderlineGettingStarted)"/>

  <!-- ステップ1 -->
  <rect x="90" y="160" width="280" height="260" rx="14" fill="#f4f9f3" stroke="#79bb74" stroke-width="2"/>
  <circle cx="230" cy="160" r="24" fill="#79bb74"/>
  <text x="230" y="168" text-anchor="middle" font-size="20" font-weight="700" fill="#ffffff">1</text>
  <text x="230" y="216" text-anchor="middle" font-size="17" font-weight="700" fill="#3f6b3c">お名前・法人名を</text>
  <text x="230" y="238" text-anchor="middle" font-size="17" font-weight="700" fill="#3f6b3c">入力（/register）</text>
  <rect x="114" y="254" width="232" height="1" fill="#c9ddc7"/>
  <text x="130" y="284" font-size="13.5" fill="#4a4a4a">・お名前</text>
  <text x="130" y="310" font-size="13.5" fill="#4a4a4a">・法人名または事務所名</text>
  <text x="130" y="336" font-size="13.5" fill="#4a4a4a">・メールアドレス</text>
  <text x="130" y="362" font-size="13.5" fill="#4a4a4a">・規約等の同意チェック</text>
  <rect x="114" y="384" width="232" height="30" rx="15" fill="#79bb74"/>
  <text x="230" y="404" text-anchor="middle" font-size="13" font-weight="700" fill="#ffffff">「認証コードを送信」</text>

  <!-- 矢印1 -->
  <line x1="378" y1="290" x2="404" y2="290" stroke="#a9a9a9" stroke-width="2.5"/>
  <polygon points="404,282 404,298 416,290" fill="#a9a9a9"/>

  <!-- ステップ2 -->
  <rect x="424" y="160" width="280" height="260" rx="14" fill="#f2f8fc" stroke="#55aae2" stroke-width="2"/>
  <circle cx="564" cy="160" r="24" fill="#55aae2"/>
  <text x="564" y="168" text-anchor="middle" font-size="20" font-weight="700" fill="#ffffff">2</text>
  <text x="564" y="216" text-anchor="middle" font-size="17" font-weight="700" fill="#2f6a91">6桁の認証コード</text>
  <text x="564" y="238" text-anchor="middle" font-size="17" font-weight="700" fill="#2f6a91">を入力</text>
  <rect x="448" y="254" width="232" height="1" fill="#bcdcea"/>
  <text x="464" y="284" font-size="13.5" fill="#4a4a4a">・メールに届く数字</text>
  <text x="464" y="310" font-size="13.5" fill="#4a4a4a">　コードを入力（リンク</text>
  <text x="464" y="336" font-size="13.5" fill="#4a4a4a">　クリック方式ではない）</text>
  <text x="464" y="362" font-size="13.5" fill="#4a4a4a">・届かなければ迷惑メール確認</text>
  <rect x="448" y="384" width="232" height="30" rx="15" fill="#55aae2"/>
  <text x="564" y="404" text-anchor="middle" font-size="13" font-weight="700" fill="#ffffff">「コードを認証する」</text>

  <!-- 矢印2 -->
  <line x1="712" y1="290" x2="738" y2="290" stroke="#a9a9a9" stroke-width="2.5"/>
  <polygon points="738,282 738,298 750,290" fill="#a9a9a9"/>

  <!-- ステップ3 -->
  <rect x="758" y="160" width="280" height="260" rx="14" fill="#fdf1e7" stroke="#e0894a" stroke-width="2"/>
  <circle cx="898" cy="160" r="24" fill="#e0894a"/>
  <text x="898" y="168" text-anchor="middle" font-size="20" font-weight="700" fill="#ffffff">3</text>
  <text x="898" y="216" text-anchor="middle" font-size="17" font-weight="700" fill="#a85a1e">パスワードを</text>
  <text x="898" y="238" text-anchor="middle" font-size="17" font-weight="700" fill="#a85a1e">設定する</text>
  <rect x="782" y="254" width="232" height="1" fill="#f0d5b8"/>
  <text x="798" y="284" font-size="13.5" fill="#4a4a4a">・パスワード（8文字以上）</text>
  <text x="798" y="310" font-size="13.5" fill="#4a4a4a">・パスワード（確認）</text>
  <text x="798" y="336" font-size="13.5" fill="#4a4a4a">・条件は画面で✓表示</text>
  <text x="798" y="362" font-size="13.5" fill="#4a4a4a">・完了後すぐログイン可</text>
  <rect x="782" y="384" width="232" height="30" rx="15" fill="#e0894a"/>
  <text x="898" y="404" text-anchor="middle" font-size="12.5" font-weight="700" fill="#ffffff">「アカウント作成を完了する」</text>

  <!-- フッター -->
  <rect x="90" y="460" width="948" height="86" rx="12" fill="#f5f5f3"/>
  <text x="564" y="494" text-anchor="middle" font-size="16" font-weight="700" fill="#2d2d2d">3ステップとも数分で完了。難しい設定判断は必要ない</text>
  <text x="564" y="522" text-anchor="middle" font-size="13.5" fill="#4a4a4a">完了後はそのままオンボーディング（お店の情報を伝える対話画面）に進む</text>
</svg>
