@charset "utf-8";
/* =====================================================================
 * 英語ページ専用の上書き（en/ 配下のみ読み込む）
 * ---------------------------------------------------------------------
 * 日本語版のCSSはそのまま使い、ここでは「日本語の字送りを前提にした指定」と
 * 「文字数が増えて収まらなくなる箇所」だけを打ち消す。
 * セレクタは html[lang="en"] で限定しているので、日本語ページには一切効かない。
 * 新しく調整が必要になったら、元のCSSを直さずここに足すこと。
 * ===================================================================== */

/* ---------------------------------------------------------------------
 * 1. ヘッダー右上の会期表示
 * 日本語版は「（水）」のような全角括弧を前提に、負のマージンと letter-spacing で
 * 括弧まわりのアキを削っている。英語は半角の "(Wed)" なので、その詰めをかけると
 * 数字と括弧がぶつかる。詰めを解除して半角向けの間隔に戻す。
 * ------------------------------------------------------------------- */
html[lang="en"] .header-date__dow {
  letter-spacing: 0;
  margin-left: .08em;
  margin-right: .12em;
}

/* 区切りは「〜」ではなく "-"。字幅が狭いので前後にアキを取る。 */
html[lang="en"] .header-date__wave {
  font-size: 18px;
  margin: 0 .18em;
}

/* 「Tokyo Big Sight」は「東京ビッグサイト」より横に長い。
   1px 落として、ヘッダーのロゴ側に食い込まない幅に収める。 */
html[lang="en"] .header-date__place {
  font-size: 14px;
  letter-spacing: -.01em;
}

/* ---------------------------------------------------------------------
 * 2. グローバルナビ
 * 日本語版は6項目ぶんを 16.666%（＝1/6）で等分している。
 * 英語版は「前回の開催報告」「プレスのご案内」を出さない4項目なので、
 * そのままだと右側に 1/3 の空白が残る。項目数に応じて等分されるようにする。
 * 項目を増減しても指定を直す必要がない。
 * ------------------------------------------------------------------- */
html[lang="en"] #header .navbar-default .navbar-nav .dropdown {
  width: auto;
  flex: 1 1 0;
}

/* 「Exhibitor Information」「Visitor Information」は日本語より長く、
   左右 22px のパディングのままだと窮屈に折り返す。少し詰めて2行に収める。 */
html[lang="en"] #header .navbar-default .navbar-nav .dropdown > a {
  padding: 10px 12px;
  font-size: 14px;
  line-height: 1.35;
}

/* 上のパディングを削ったぶん、開いた状態の高さが日本語版と揃うよう縦を補う。 */
html[lang="en"] #header .navbar-default .navbar-nav {
  min-height: 50px;
}

/* ドロップダウンの「SURTECH [Held in December 2026]」は1行に収まらない。
   幅を親いっぱいまで許して、折り返しても読めるようにする。 */
html[lang="en"] #header .navbar-default .navbar-nav .dropdown-menu {
  width: 100%;
  min-width: 200px;
}

html[lang="en"] #header .navbar-default .navbar-nav .dropdown-menu a {
  line-height: 1.4;
  padding: 8px 8px;
}

/* ---------------------------------------------------------------------
 * 3. フッターのサイトマップ
 * 「Description based on the Specified Commercial Transactions Act」のように
 * 極端に長い項目がある。日本語版は1行想定なので、折り返しを許して
 * 行間を確保する。
 * ------------------------------------------------------------------- */
html[lang="en"] #sitemap dt,
html[lang="en"] #sitemap dd li,
html[lang="en"] #sitemap .sub_cnt_menu li {
  line-height: 1.5;
  white-space: normal;
}

/* ---------------------------------------------------------------------
 * 4. 本文の共通事項
 * 英語は単語単位でしか折り返せないため、日本語では起きなかった
 * 「長い語が箱をはみ出す」が起きる。見出し・表・ボタンで折り返しを許す。
 * ------------------------------------------------------------------- */
html[lang="en"] #contents h2,
html[lang="en"] #contents h3,
html[lang="en"] #contents h4,
html[lang="en"] #contents th,
html[lang="en"] #contents td,
html[lang="en"] #contents li,
html[lang="en"] #contents p {
  word-break: normal;
  overflow-wrap: anywhere;
}

/* 表の見出し列は日本語の字数で幅を決め打ちしている箇所がある。
   英語だと見出しだけで埋まってしまうので、内容側に幅を譲る。 */
html[lang="en"] #contents table.normal th {
  width: auto;
  min-width: 8em;
}

/* 固定の申込ボタン。"Apply to exhibit here" は「出展申込はこちら」より長い。 */
html[lang="en"] #fix-btn a {
  line-height: 1.3;
}

/* ---------------------------------------------------------------------
 * 5. 準備中のメニュー項目
 * VISIT のプルダウン（Visitor Pre-registration / Exhibitors List / Seminar）は
 * 行き先のページがまだ無い。項目としては見せておきたいので、薄くして
 * クリックを受け付けないようにしている。
 * ページができたら header.php で href を入れ、この class を外すこと。
 * ------------------------------------------------------------------- */
html[lang="en"] #header .navbar-default .navbar-nav .dropdown-menu li a.comingsoon {
  opacity: .45;
  pointer-events: none;
  cursor: default;
}

/* 薄くした項目はホバーの色替えも起こさない（pointer-events で届かないが、
   キーボード操作などで当たった場合にも見た目を変えない）。 */
html[lang="en"] #header .navbar-default .navbar-nav .dropdown-menu li a.comingsoon:hover {
  background-color: rgba(0, 0, 0, 0.8);
}

/* ---------------------------------------------------------------------
 * 6. ヘッダー右上の会期表示（英語）
 * 日本語版は数字を大きく見せる独自の組みだが、英語は語数が多く同じ組みだと
 * 収まらない。2行の素直な表記に差し替える（マークアップも inc/header.php で
 * 英語専用の枝に分けてある）。
 * 上の「1.」の指定は日本語の組み向けなので、こちらには効かない。
 * ------------------------------------------------------------------- */
html[lang="en"] #header .header_top .navbar-right p.header-date--en {
  display: block;
  text-align: right;
  white-space: nowrap;
  line-height: 1.35;
  color: #585757;
  font-family: 'SurtechDigit', 'Hiragino Sans', 'Yu Gothic', 'Meiryo', sans-serif;
  font-weight: 900;
}

html[lang="en"] .header-date__l1,
html[lang="en"] .header-date__l2 {
  display: block;
}

/* Roboto Black は字面が詰まって見えるので、少し字間を開けて読みやすくする。 */
html[lang="en"] .header-date__l1 {
  font-size: 25px;
  letter-spacing: .045em;
}

html[lang="en"] .header-date__l2 {
  font-size: 19px;
  letter-spacing: .05em;
}

/* ---------------------------------------------------------------------
 * 7. 英語トップの見出し間隔
 * Exhibition Outline / Concurrent exhibitions / Inquiries を続けて置くので、
 * 2つ目以降の見出しの上にアキを取る。
 * ------------------------------------------------------------------- */
html[lang="en"] #txt.outline h2 ~ h2 {
  margin-top: 50px;
}

/* ---------------------------------------------------------------------
 * 8. 見出しタブ（.hd-tab > .title-bar）
 * 日本語は字間を .2em 開けて「同 時 開 催 展」のように見せているが、
 * 英語で同じ字間をかけると語が間延びして読みにくい。通常字間に戻す。
 * ------------------------------------------------------------------- */
html[lang="en"] .hd-tab > .title-bar {
  letter-spacing: normal;
  text-indent: 0;
}