[display: grid;]の実装されたデザインを学ぶため。レスポンシブデザインの細やかな指定を学ぶため。ハンバーガーメニューの仕組みをより理解するため。

ファーストビューの中心に表示されるロゴは画像ではなくCSSにて指定しているので画面幅によって細やかに変化させる必要があった。

pcからモバイル端末時に変わるとハンバーガーメニューになるようにしました。HTMLの最終行あたりにjavaにてtoggleを記入しナビに使用。

グリッドデザインにすることでサイトの縦軸が綺麗に合わせることができる点、divで必要以上に括らなくていいこと魅力を感じました。横軸はautoで指定し縦軸は四分割して左右に20px中心が1frで行いました。テンプレ化するデザインや、分業して行う時にはグリッドデザインの長所が生かされると感じました。