<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="titleUnderlineWritingTips" x1="0" y1="0" x2="1" y2="0">
      <stop offset="0" stop-color="#79bb74"/>
      <stop offset="1" stop-color="#55aae2"/>
    </linearGradient>
    <linearGradient id="hubGradWritingTips" x1="0" y1="0" x2="1" y2="1">
      <stop offset="0" stop-color="#79bb74"/>
      <stop offset="1" stop-color="#55aae2"/>
    </linearGradient>
    <marker id="arrowHeadWritingTips" 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="42" text-anchor="middle" font-size="25" font-weight="700" fill="#2d2d2d">伝わる文章の5つのコツ</text>
  <rect x="480" y="58" width="240" height="4" rx="2" fill="url(#titleUnderlineWritingTips)"/>

  <!-- 中央ハブ -->
  <ellipse cx="600" cy="300" rx="108" ry="64" fill="url(#hubGradWritingTips)"/>
  <text x="600" y="292" text-anchor="middle" font-size="14.5" font-weight="700" fill="#ffffff">お客さまの疑問に</text>
  <text x="600" y="314" text-anchor="middle" font-size="14.5" font-weight="700" fill="#ffffff">答える</text>
  <text x="600" y="337" text-anchor="middle" font-size="11.5" fill="#eafaf0">接客の言葉で書く</text>

  <!-- コツ1: 左上（主語をお客さまに） -->
  <path d="M 510 258 L 335 160" stroke="#a9a9a9" stroke-width="2" fill="none" marker-end="url(#arrowHeadWritingTips)"/>
  <rect x="65" y="85" width="270" height="98" rx="13" fill="#f4f9f3" stroke="#79bb74" stroke-width="2"/>
  <text x="200" y="115" text-anchor="middle" font-size="14.5" font-weight="700" fill="#3f6b3c">①主語を「お客さま」に</text>
  <text x="200" y="140" text-anchor="middle" font-size="12" fill="#4a4a4a">「当店は〜」ではなく</text>
  <text x="200" y="160" text-anchor="middle" font-size="12" fill="#4a4a4a">「あなたに〜」で伝える</text>

  <!-- コツ2: 右上（1文を短く） -->
  <path d="M 690 258 L 865 160" stroke="#a9a9a9" stroke-width="2" fill="none" marker-end="url(#arrowHeadWritingTips)"/>
  <rect x="865" y="85" width="270" height="98" rx="13" fill="#f2f8fc" stroke="#55aae2" stroke-width="2"/>
  <text x="1000" y="115" text-anchor="middle" font-size="14.5" font-weight="700" fill="#2f6a91">②1文を短くする</text>
  <text x="1000" y="140" text-anchor="middle" font-size="12" fill="#4a4a4a">目安は60文字前後</text>
  <text x="1000" y="160" text-anchor="middle" font-size="12" fill="#4a4a4a">1段落は2〜3文まで</text>

  <!-- コツ3: 左下（専門用語に補足） -->
  <path d="M 500 340 L 335 445" stroke="#a9a9a9" stroke-width="2" fill="none" marker-end="url(#arrowHeadWritingTips)"/>
  <rect x="65" y="450" width="270" height="98" rx="13" fill="#fdf1e7" stroke="#e0894a" stroke-width="2"/>
  <text x="200" y="480" text-anchor="middle" font-size="14.5" font-weight="700" fill="#a85a1e">③専門用語にひとこと補足</text>
  <text x="200" y="505" text-anchor="middle" font-size="12" fill="#4a4a4a">「炭酸スパ（頭皮を洗う</text>
  <text x="200" y="525" text-anchor="middle" font-size="12" fill="#4a4a4a">ケア）」のように補足</text>

  <!-- コツ4: 右下（数字と固有名詞） -->
  <path d="M 700 340 L 865 445" stroke="#a9a9a9" stroke-width="2" fill="none" marker-end="url(#arrowHeadWritingTips)"/>
  <rect x="865" y="450" width="270" height="98" rx="13" fill="#f4f9f3" stroke="#79bb74" stroke-width="2"/>
  <text x="1000" y="480" text-anchor="middle" font-size="14.5" font-weight="700" fill="#3f6b3c">④数字と固有名詞で具体的に</text>
  <text x="1000" y="505" text-anchor="middle" font-size="12" fill="#4a4a4a">「駅から近い」ではなく</text>
  <text x="1000" y="525" text-anchor="middle" font-size="12" fill="#4a4a4a">「〇〇駅から徒歩3分」</text>

  <!-- コツ5: 下（誇張しない） -->
  <path d="M 600 364 L 600 460" stroke="#a9a9a9" stroke-width="2" fill="none" marker-end="url(#arrowHeadWritingTips)"/>
  <rect x="440" y="465" width="320" height="90" rx="13" fill="#f2f8fc" stroke="#55aae2" stroke-width="2"/>
  <text x="600" y="495" text-anchor="middle" font-size="14.5" font-weight="700" fill="#2f6a91">⑤誇張しないが最強の信頼づくり</text>
  <text x="600" y="518" text-anchor="middle" font-size="12" fill="#4a4a4a">「地域No.1」より等身大の言葉で書く</text>
  <text x="600" y="536" text-anchor="middle" font-size="11" fill="#4a4a4a">根拠のない誇張表現は避ける</text>

  <!-- フッター -->
  <rect x="90" y="590" width="1020" height="60" rx="12" fill="#f5f5f3"/>
  <text x="600" y="626" text-anchor="middle" font-size="15.5" font-weight="700" fill="#2d2d2d">文才はいらない。接客でよく聞かれる質問に、普段の言葉で答えるだけでいい</text>
</svg>
