インパクトのある見出しと短いキャッチコピーが、ブランドの世界観を一瞬で伝えるヒーローセクション
背景画像と半透明オーバーレイを組み合わせ、
奥行きと没入感を演出するイントロセクション。
ブランドの価値観・ビジョン・存在意義を
簡潔なテキストで力強く表現します。
左側にセクションの主旨を簡潔に説明するテキストを配置し、右側の3カードグリッドと視覚的なバランスを保ちます。
各カードに関連アイコン・英語タイトル・日本語サブタイトル・説明テキストを縦に積み重ねたカードコンポーネントのデザイン解説
ダークな背景色と細い境界線で区切られた3カラムカードグリッド。ホバー時に背景色が変化するインタラクションを実装
セクション下部にページネーションドットを配置し、スライダーへの拡張性を示す視覚的ヒントを与えるUIパターン
年代順に会社の歴史を縦型タイムラインで表現。最新年はアクティブスタイルで赤いアクセントカラーと拡大した年号フォントで強調します。
最新の出来事や実績を説明するテキストエリア。赤いドットと拡大された年号で現在地を示し、説明文も展開表示されます。
KPIや実績数値を4カラムの大型タイポグラフィで表示。各数値に赤い上昇矢印を添え、成長トレンドを直感的に伝えます。
課題発見から成果創出までの4段階プロセスを、番号付きカードとアイコンで視覚化するプロセスフローセクションです。
番号・アイコン・英語タイトル・日本語サブタイトル・説明文を縦積みしたステップカードのレイアウト解説
4カードを細い境界線区切りで横一列に並べ、各ステップを等幅で視覚的に整理したプロセスグリッド
ダークな背景色とホバー時の色変化で、インタラクティブな操作感を演出するステップカード
プロセスの最終ステップを示すカード。次のアクションへ誘導するCTAとの連携も考慮した設計
左カラムにセクション説明、右カラムにアコーディオンUIを配置。クリックで展開される回答はスムーズなmax-heightアニメーションで表示します。