# Balance Creates
True Value

ゴールドと紺碧が交差するヒーローセクション。
天体写真を背景に、スケールのアイコンとブランドタイポグラフィを中央配置。
円形の装飾フレームがビジュアルの格調を高める。

Our Philosophy

## 均衡が生む、
究極の美

左半分に風景写真、右半分にクリーム色のパネルを配置した2カラムレイアウト。 写真にはグラデーションオーバーレイを施し、テキストパネルとの境界を自然に融合させる。 ブランドの哲学を語るテキストは縦の金線アクセントとともに配置し、高級感と読みやすさを両立する。

Our Services

## 課題に寄り添い、最適な解決策を。

### Planning

ゴールドのアイコンと暗紺色の背景カードで構成される3列グリッドレイアウト。 各カードは細い金色のボーダーで囲まれ、ホバー時にグロー効果が現れる。 サービス内容をアイコン・タイトル・説明文の3要素で構造化。

Learn More

### Design

中央のカードはデザインサービスを象徴するペンのアイコンを配置。 3枚のカードはほぼ等幅で並び、全体のバランスを保つ。 説明文は細い書体で可読性を高め、リンクはゴールドカラーで統一。

Learn More

### Development

コードアイコンが技術力を視覚的に示す右端のカード。 3カラム全体が同一の高さに揃えられ、整然としたサービス訴求を実現。 ボタンはテキストリンク形式でシンプルに配置。

Learn More

Our Data

顧客満足度

96%

円形プログレスリングで
数値を直感的に可視化

プロジェクト成功率

98%

星空を背景にゴールドの
リングが輝くデータ表示

継続取引率

89%

半透明のオーバーレイで
宇宙写真と融合するUI

プロジェクト実績（累計）

右端はバーチャートで
成長トレンドを年別に表示

Our Process

## 共に創り上げる、成功へのプロセス。

01

### ヒアリング

中央垂直ラインを軸に左右交互でステップを配置するタイムラインレイアウト。各ステップはダークな円形アイコンと番号で識別される。

02

### コンセプト立案

クリーム色の背景にゴールドと紺のアクセントが映えるプロセスセクション。奇数ステップは左配置、偶数は右配置で視線誘導を最適化。

03

### プロトタイプ制作

アイコンはFont Awesomeを使用し各フェーズのコンセプトを視覚化。コネクティングラインがフローの連続性を示す。

04

### 開発・実装

5つのフェーズを整然とレイアウトし、プロジェクト推進のロードマップをビジュアル化。

05

### 運用・改善

最終ステップは継続的な改善を示す分析アイコン。成果最大化に向けたサイクルの完結を表現。

FAQ

## よくあるご質問

Q. ゴールドのボーダーで囲まれたアコーディオン形式のFAQセクション。各質問をクリックで展開するインタラクティブな設計。
Q. 紺色の背景にゴールドの「Q.」ラベルが映えるタイポグラフィデザイン。開閉ボタンはプラスからマイナスに切り替わる。
Q. 展開状態のアイテムは回答テキストが表示され、境界線で区切られた構造を持つ。
A. 展開時はゴールドの上線で質問と回答を分離。回答テキストは薄い文字色でコントラストを調整し読みやすさを確保する。FAQセクション全体はdark navy背景に統一。
Q. 4件の質問を縦一列に並べるシンプルなレイアウト。各アイテム間の余白は最小限に抑えスッキリとした印象を与える。

Contact

## まずはお気軽に
ご相談ください

左カラムにブランドコピーと説明文、右カラムにフォームを配置した非対称2分割レイアウト。 ゴールドの縦仕切り線が左右のセクションを上品に分断する。 フォームフィールドは暗い背景に細いゴールドボーダーで統一。