デザインカンプ（デザインの完成見本図）から、レスポンシブ対応のコーディングを行いました。 デザインカンプはPCデザインのみのため、タブレットやスマートフォン向けのデザインは自身で行っています。

Javascriptを使用し、スマートフォンのメニュー、タブ形式の表示切り替え、ヘッダーメニューのエフェクトなどを実装しました。 また、宿泊予約をクリックすると、モーダル（ブラウザ上に別枠で表示されるウィンドウ）が表示されるようにしています。 Javascriptのライブラリflatpickrで日にちを選択し、Google Formへ入力情報を送信できるよう機能を具備しました。 そのほか、AOS.jsやSwiper.jsなどのJavascriptのライブラリを利用した動きのあるWebサイトになっています。

※ 架空サイトのため、Basic認証を設定しています。ID: guest / Password: guest123 を入力してご覧ください。