黒と白の 2 色が骨格。有彩色は存在せず、面色を持つのはグローバルナビ帯のペールブルーグレー #d4dde1 とサブナビ帯の #eeeff0 だけ。リンクも色を変えず、黒のまま下線か矢印で示す。
和文はヒラギノ UD 角ゴ StdN（W3 / W6）。font-feature-settings は全域 normal で、日本語サイトの主流である palt を意図的に使わない。UD 書体は「読み間違えにくさ」を優先して字面を大きく均一に設計しているため、詰めると設計意図が損なわれる。letter-spacing も全域 normal、行間は 1.8。
ひらくデザイン ／ 2026.7.15 ／ サービスデザイン
ユーザー調査の結果を、そのまま施策の一覧に落としてしまうと、なぜそれをやるのかという理由が抜け落ちます。私たちは、調査で得た事実を一度「その人の物語」として組み直したうえで、設計の判断基準に変換します。
行間を 1.8 と広く取っているのは、読み物としての可読性を優先しているためです。UD 書体は字面が大きいぶん行が詰まって見えやすく、詰めると窮屈になります。サービスデザインの支援内容はこちら。
納品して終わりではなく、運用のなかで仮説を確かめ、必要なら設計に戻る。その往復に付き合うことを、私たちは「伴走」と呼んでいます。
CTA は 3 系統。本文中は白地＋黒 1px アウトライン、フッターは黒ベタ＋白文字＋白 1px 罫、画像・動画の上は透明＋白 1px 罫。いずれも角丸 0px で、右端に 44px の余白を取ってシェブロン › か外部リンクアイコンを絶対配置する。
カードは上辺に 4px solid #000000 の罫だけを持つ。他辺の罫なし、角丸 0px、影なし。誌面の「柱」に相当するこの罫がカードの帰属を示す。
デフォルト / フォーカス / エラーの3状態。角丸 0px、枠は黒 1px。フォーカスは色を変えず罫を 2px に太らせる。エラーは文字と 1px 罫だけで示し、面では塗らない。
実測では全要素が box-shadow: none。奥行きは「罫の太さ」（1px → 4px）と面色（#d4dde1 / #eeeff0）、そしてヒーローの暗幕だけで作る。#d4dde1 は影の代わりに、ヘッダーが本文より手前にあることを示す。
6 / 10 / 20 / 30 / 44 / 80px。44px は「アイコン用の右余白」として繰り返し現れる。コンテナは 1366px、事例カードは 3 カラム・ガター 30px。ヒーローの動画グリッドだけ全幅ブリードする。