実習範囲
下図の範囲をカンプに合うよう作成してください。 タブレット幅（768px以上）でも無理なく見えるようにCSS設定をお願いします。
本範囲コーディング完了時に、提出の必要はありません。
コーディングが出来たら、書き２つの方法で確認してください。
- デザインと重ねてセルフチェックを行う
- 解説のコーディングと見合わせてみる
コーディングのヒント
1.3つのブロックを横並びにする
スマホ幅で作った時に、数のようにdivを配置しました。
「.whats-item_text」は幅を親要素の100％にすることで下段に配置しています。
強制的に100%に指定しないようにすれば、勝手に３ブロック横並びになります。
.whats-item_text {
flex: 2;
}
orderプロパティでブロックの並び順を変えます。 そして各ブロックの幅をカンプと合わせれば、再現できるでしょう。
2.左のアイコンの表示位置
スマホ幅では横方向中央に配置したSVGですが、PC幅のデザインでは左寄せになっています。text-align: left;に切り替えたほうが配置が楽でしょう。
