ピンク領域は、max-width: 800px; の親要素
水色領域は、親要素に対して横幅30%の正方形（aspect-ratio: 1 / 1; を使用）
水色領域内に文字を配置
サンプル1
サンプル2