コーポレートヘッダー（ミニマル）

このパーツの使いどころと実装ポイント

このパーツは、左にロゴ・右に横並びナビ・末尾に「お問い合わせ」CTA を置いた、コーポレートサイトで最も使われる標準ヘッダーです。内側のラッパーを max-width:1100px で中央寄せし、display:flex と margin-left:auto でナビを右へ押し出しているため、ロゴとメニューの間が自然に空きます。背景は白＋下線一本だけのミニマル設計で、コンテンツより主張しすぎないのが特徴です。

向いている場面

事業会社の会社案内サイト、士業・コンサルのコーポレートサイト、採用サイトのトップなど、清潔感と読みやすさを優先したい場面に向きます。情報量が多すぎないナビ（4〜5項目）と相性が良く、ニュースやIRを抱える企業でも破綻しません。

カスタマイズと注意点

差し替えどころは COMPANY のロゴ文字（画像ロゴに置換可）と h-min__nav 内のリンク文言です。CTA の色はブランドカラーに合わせて変えると締まります。すでに h-min__ham というハンバーガーボタンが用意されているので、狭い画面ではナビを隠してこのボタンに切り替える実装を足してください。各リンクは <a> に href を必ず付け、現在地のリンクには aria-current="page" を添えるとアクセシビリティが上がります。

このパーツは JavaScript が含まれます。HTML の最後に <script> タグで読み込むか、外部 JS ファイルに切り出してください。