/* ------------------------------------------------------------------ *
 * PC グローバルナビ 実テキスト化
 *
 * 従来: topnavi_off.png / topnavi_on.png（850x60 の 1x スプライト）を
 *       a::before / a::after に敷き、li の text-indent:-9999px で
 *       本物のテキストを画面外へ飛ばしていた。
 * 問題: (1) 1x 画像の等倍表示なので Retina で 2倍に拡大され文字が滲む
 *       (2) 画像は "HOME" なのに HTML は "トップページ" と食い違っていた
 * 対応: 画像レイヤーを撤去し、Zen Maru Gothic Medium(500) の実テキストで組む。
 *       採寸値（全角送り16px = 15px+1px / 2行間19px / CTA 154x32・角丸16px）は
 *       元スプライトを実測して合わせてある。
 *
 * ※ assets/ は tools/copy-assets.mjs が毎回まるごと作り直すため、
 *   この上書きは assets/ の外（custom/）に置いている。
 * ------------------------------------------------------------------ */

/* 1) 文字画像レイヤーを撤去（content:none で疑似要素ごと消す＝画像も読まれない） */
div#access #menu-gnavi > li.menu-item > a::before,
div#access #menu-gnavi > li.menu-item > a::after {
  content: none;
}

/* 2) 画面外に飛ばしていたテキストを戻す（サブメニューは元から text-indent:initial で影響なし） */
div#access #menu-gnavi > li.menu-item {
  text-indent: 0;
}

/* 3) 実テキストの組み版 */
div#access #menu-gnavi > li.menu-item > a {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 60px !important;
  padding: 0;
  font-family: "Zen Maru Gothic", "Hiragino Maru Gothic ProN", sans-serif;
  font-weight: 500;
  font-size: 15px;
  line-height: 19px !important;
  letter-spacing: 1px;
  text-align: center;
  text-decoration: none;
  color: #000;
  background: none transparent;
  transition: color 0.3s ease 0s;
}

/* 4a) 現在ページ = 通常と同じ黒のまま。
       元スプライトには current 状態が無く全ページ同じ絵だったので、見た目を変えない。
       ただし multipress/style.css が current に color:#fff を当てており、
       画像時代は文字が画面外だったので露見しなかったバグが実テキスト化で顕在化する
       （薄いグレー帯に白文字＝消える）。ここで明示的に打ち消す。 */
div#access #menu-gnavi > li.menu-item.current-menu-item > a,
div#access #menu-gnavi > li.menu-item.current_page_item > a {
  color: #000;
  background: none transparent;
}

/* 4b) hover = 赤（元 topnavi_on.png と同じ #E50012）。
       current より後に置いて、現在ページの項目でも hover が勝つようにする。 */
div#access #menu-gnavi > li.menu-item > a:hover,
div#access #menu-gnavi > li.menu-item:hover > a {
  color: #E50012;
  background: none transparent;
}

/* 5) 「来場予約・お問い合わせ」= 緑のピルボタン
      margin 14px/6px と 154x32 で、元スプライトのボタン位置とピクセル一致する */
div#access #menu-gnavi > li.gnavi18 > a {
  width: 154px;
  height: 32px !important;
  margin: 14px 0 14px 6px;
  border-radius: 16px;
  background: #00913A;
  color: #fff;
  font-size: 13px;
  letter-spacing: -1px;
  transition: background-color 0.3s ease 0s;
}
div#access #menu-gnavi > li.gnavi18.current-menu-item > a,
div#access #menu-gnavi > li.gnavi18.current_page_item > a {
  background: #00913A;
  color: #fff;
}
div#access #menu-gnavi > li.gnavi18 > a:hover,
div#access #menu-gnavi > li.gnavi18:hover > a {
  background: #E50012;
  color: #fff;
}
