UI の面はすべて黒と白の不透明度で作る。有彩色は「HILLS LIFE」に使う青 1 色だけで、CSS 全文でも 1 回しか出てこない。
不透明色に置き換えないこと。rgba(0,0,0,0.05) を #f2f2f2 にすると、写真やグラデーションの上に重ねたときの馴染み方が変わる。本文の #000000 も #333333 にしない — 純黒がこのブランドの硬質さを作っている。
本文＝中ゴシックBBB、見出し・ラベル＝見出ゴ MB31、欧文＝Univers Next Pro、標語のみリュウミン。すべて Morisawa Fonts。
見出しを font-weight: 700 で作らない。太さではなく書体（見出ゴ MB31）で見出しにするのがこのシステム。実サイトはモリサワのバリアブルフォント（ウェイト軸 1–1000）を使い、書体そのものの太さで階層をつけている。
letter-spacing は -0.28px の固定値。body（14px）に -0.02em を一度だけ宣言し、その computed 値が全要素に継承される。したがって 10px では -0.028em、24px では -0.0117em と、大きい文字ほど相対的な詰めが弱くなる。子要素ごとに -0.02em を再宣言すると別物になる。例外は明朝の標語（1.47px）と欧文の小ラベル（1.36px）だけで、どちらも「広げる」方向。
font-feature-settings: "palt" は body に置いて全体に継承させる（実測 537 要素）。CSS 中の宣言はわずか 3 箇所。<button> など一部のフォーム要素は UA スタイルで normal に戻るが、揃える必要はない。
16px / line-height: 1.7 で 1 行あたり約 44 文字。日本語の可読上限に収まる。
都市を創り、都市を育む。
私たちは、単に建物をつくる会社ではありません。街をつくり、そこで暮らし働く人の時間を設計し、完成したあとも長く手をかけて育て続ける——それが森ビルの事業です。
| 商号 | 森ビル株式会社 |
|---|---|
| 本社所在地 | 東京都港区六本木六丁目10番1号 六本木ヒルズ森タワー |
| 事業内容 | 都市再開発事業、不動産賃貸事業、建物管理・運営事業、コンサルティング事業 |
| 主なプロジェクト | 六本木ヒルズ、虎ノ門ヒルズ、麻布台ヒルズ、アークヒルズ |
東京メトロ日比谷線「六本木」駅より徒歩 0 分（コンコースにて直結）。都営大江戸線「六本木」駅 3 番出口より徒歩 4 分。総合受付は六本木ヒルズ森タワー 5 階です。
カードは rgba(0,0,0,0.05) の面に border-radius: 3px。タイトルは -webkit-line-clamp: 2 で 2 行に切る。
写真セクションへの主要な導線は直径 72px の丸い矢印ボタン。ホバーで要素が右上に 5px 滑る。
Filled は rgba(0,0,0,0.8)、Tonal は rgba(0,0,0,0.05)。角丸を 8px 以上にしない（タグの 100px を除く）。ドロップダウンだけ border-radius: 0 0 3px 3px で下端のみ丸める。
カードは面の色を持たず、写真の下端にグラデーションのスクリムを敷いて可読性を確保する。
サイト内のフォームは検索欄のみ。入力欄だけは "Helvetica Neue", Arial, "Hiragino Kaku Gothic ProN" という OS 依存スタックで、モリサワの Web フォントを当てていない。
0 0 32px rgba(0,0,0,0.1) はオフセットゼロのアンビエントシャドウ。ドロップシャドウではなく、光の回り込みとして使う。
階層は影ではなく写真の面積と rgba(0,0,0,0.05) の面で表現する。下方向オフセットの影に置き換えないこと。
全幅セクションは 1440px まで広げ、読み物は 741px に絞る。
ブレークポイントは 768 / 1024 / 1200 / 1440px。ホバーは transform: translate(5px, -5px)（--moveUpRightValue）で右上へ滑らせる。これが実質唯一の CSS 変数。