日本と世界、街、人、モノ、想い、
「つなぐ」成田空港。
#033b7d は「面と文字の地の色」、#0058aa は「いま押せるもの」で役割が違う。補足テキストは別の hex を作らず、本文色 #081018 の 70% 不透明度で作る。
可視テキスト 62 / 66 要素のすべてが同じスタック。500 と 600 は 1 要素もない(読み込んでいるのも 400 と 700 の 2 ウェイトだけ)。サイズは 10 / 12 / 14 / 16 / 20 / 32 / 60 の 7 段で、端数が出ない。
body は letter-spacing: normal のまま。ほぼすべての要素が .012em を個別に宣言している。実測の px がサイズに正比例するのがその証拠で、body に 1 回書いて継承させた設計ではない。
.012em32px の見出しは 0.384px、12px の注記は 0.144px。サイズが変わると字間も比例して変わる。375px に縮んでも関係が崩れない。
body に em を 1 回body に .012em と書くと 16px × .012 = 0.192px という絶対値が全子孫に降りる。12px の注記も 60px の見出しも同じ 0.192px になり、小さい字が広く、大きい字が詰まって見える。
左右の 12px の行(成田国際空港 / 気温 21℃)を見比べると、右(誤)のほうが字間が広い。縮小したスクリーンショットでは差が見えないので、等倍で確認すること。
主ボタンは #0058aa の面。それ以外は枠線だけで作り、角丸の大きさ(5px / 10px)で性格を分ける。
ボタンの line-height は 1.4、本文は 1.8。中間の値を作らない。
box-shadow はサイト全体で 0 種。地(#f6f8fb)の上に面(#ffffff)を置き、1px solid の枠と 10px の角丸で浮かせる。
成田エクスプレス・京成スカイライナーで都心から最短 36 分。
東京駅・新宿駅から高速バスが運行しています。
駐車場は第1・第2・第3ターミナルにご用意しています。
th は 12px / 700、td は 16px / 400。背景色も縦罫も使わず、サイズとウェイトの差だけで見出しと値を分ける。
| 駅名 | 所要時間 | 電話番号 |
|---|---|---|
| 東京駅 | 約 53 分 | 050-3772-3910 |
| 新宿駅 | 約 81 分 | 050-3772-3910 |
| 横浜駅 | 約 85 分 | 050-3772-3910 |
所要時間は目安です。詳しくは各公共交通機関にお問い合わせください。
フォーカスは #0058aa の outline: 2px。プレースホルダは 別のグレーを作らず rgba(8,16,24,.698)。
影が無いので、5px(チップ・入力欄)→ 10px(カード・ボタン)→ 20px(大きな区画)の 3 段で層を作る。
ブレークポイントは min-width: 768px(実測 89 箇所)と min-width: 960px(20 箇所)。834px まで値が動かず、768px を割ってから本文 16px → 12px、惹句 60px → 40px に落ちる。字間は .012em のまま比例して縮む。