/*
 * 🔴 Green 製の打ち消し CSS（Step3-25-3）。**移送物ではない**（Blue に対応するファイルは無い）。
 *
 * ── なぜ要るか ──────────────────────────────────────────────
 * 海外レイアウトは「モバイル版を土台にして、広い幅で PC 版を上から着せる」形で統合してある。
 * このとき **PC 版が再宣言していないプロパティはモバイル版の指定が広い幅にも残る**。
 * 過去に **5回** 踏んだ型（13-2e ／ 14-5a-3a-2 ／ 21-2b ／ 22-3 ／ 24-2c）で、
 * **ファイルを読むだけでは異常に見えない**。
 *
 * ── 値の出どころ ────────────────────────────────────────────
 * 🎯 **すべて Blue 本番（https://hinode.pics/lang/en/cities/show/1）を PC 幅 1280 で
 *    実測した computed style**（2026-08-07・chrome-devtools の総当たり突合）。**値は1つも発明していない。**
 *
 * ── 適用範囲 ────────────────────────────────────────────────
 * ⚠️ **`media` 属性は `<link>` に付けず、このファイルの中で分ける**（9枚目・10枚目と同じ作法）。
 *    しきい値 **1000px** は **PC 版 CSS を着せる条件と同値**でなければならない
 *    （ズレると「PC の見た目なのに打ち消しが効かない幅」が生まれる）。
 *    🔴 **Step3-32 で 768px から上げた**＝PC 骨格が `width: 1000px` を要求するため。
 * ⚠️ セレクタは**移送物と同じ鎖**にしてある（詳細度を揃え、読み込み順の後勝ちで打ち消す）。
 *    🔴 **短い形に書き換えると詳細度で負けて静かに効かなくなる**
 *    ＝11枚目（24-2b）で実際に踏み、**静的テスト1152本 全緑のまま PC で出し分けが効いていなかった**。
 *
 * ── ここに無いもの（意図的・「見落とし」と区別するための記録）──────────
 * 🟢 **本文の `ul` の黒丸**＝Blue PC は `ul { list-style-type: disc }` で Green は `none` だが、
 *    **マーカーが付くのは `li` の方で、`li` は Blue も Green も `none`**（2026-08-07 に両方実測）。
 *    → **画面には1ピクセルも出ない**ので打ち消さない。9枚目の green.css の注釈と同じ結論。
 * 🟢 **パンくずの `align-items: center` ／ `white-space: nowrap` ／ `flex-shrink: 0`**
 *    ＝レイアウト CSS（`layout.mobile/Main.css`）由来なので**所有は9枚目**（ここでは触らない）。
 *    ⚠️ Blue PC は `normal` / `wrap` / `1` だが、**一番長い言語（ru・4段）でも
 *    `#breadcrumb_list_wrap` は 1000×19 で Blue と完全一致・横スクロール 0**（実測）＝実害なし。
 *    📌 将来はみ出したら `LangCitiesShowLayoutTests` の はみ出し検査が捕まえる。
 * 🔴 **（訂正・2026-08-07 25-6）** ここには元々
 *    「`#sun_chart` と `#sun_map_canvas` の差＝Chart.js と Leaflet がまだ動いていないぶんの差で
 *    CSS の残留ではない」と書いてあったが、**半分誤りだった**。
 *    実際には **`.chart_wrap` の `height: 200px`** と **カレンダーの月送りボタン／年月の箱指定**が
 *    本物の残留として混ざっており、**25-6 の検品（JS 投入後の総当たり）で初めて出た**。
 *    🔑 **教訓＝「JS が動けば消える」と束ねて除外すると、その中の本物を取りこぼす**
 *    （25-4a で `canvas` の `min-height` を拾ったときと同じ型の、2度目と3度目）。
 *    ⚠️ **カレンダーは JS が中身を作るので、25-3 の時点では測る対象が DOM に存在しなかった**＝
 *    「測って差が無かった」のではなく「**測れていなかった**」。両者を混同しないこと。
 */

@charset "utf-8";

@media (min-width: 1000px) {
  /* ─────────────────────────────────────────────────────────
   * 🔴 モバイル専用ブロックを広い幅で畳む（Q-D＝ユーザー確定で「DOM には残す」）。
   *    どちらも **Blue の PC には存在しない**要素なので、広い幅では出してはいけない。
   *    ⚠️ セレクタは移送物と同じ鎖（`map_note_wrap` の方は `> div.map_note_wrap` まで含める）。
   * ───────────────────────────────────────────────────────── */
  .h2_wrap .h2_body .selected_date_wrap {
    display: none;
  }

  .h2_wrap .h2_body .map_canvas_wrap > div.map_note_wrap {
    display: none;
  }

  /* 時差の枠：モバイルは下に 50px 空けるが、Blue の PC は 0（実測 marginBottom: 0px）。 */
  .h2_wrap .h2_body .time_difference_wrap {
    margin-bottom: 0;
  }

  /* カレンダー：モバイルは下に 25px 空けるが、Blue の PC は 0（実測）。
     📌 移送物のセレクタは `.calendar_wrap`（`#sun_calendar` ではない）＝そちらに合わせる。 */
  .h2_wrap .h2_body .calendar_wrap {
    margin-bottom: 0;
  }

  /* 地図の器：モバイルは `position: relative` ＋ 左右 10px の余白を持つが、Blue の PC は
     `static` ＋ 余白 0（実測）。
     ⚠️ **余白が残ると地図の幅が 20px 細くなる**（948.667px → 928.667px）＝
        地図そのものの見た目が Blue と変わるので、ここは効き目が大きい。 */
  .h2_wrap .h2_body .map_canvas_wrap {
    position: static;
    padding-left: 0;
    padding-right: 0;
  }

  /* 他の都市：モバイルは下 50px・左 15px を空けるが、Blue の PC は 0（実測）。
     ⚠️ 左余白が残ると幅が 1000px → 985px になり、**上のブロックと左端が揃わない**。
     📌 移送物のセレクタも `.other_cities_wrap` の1つだけ（PC 版はこの要素に何も書いていない）。 */
  .other_cities_wrap {
    margin-bottom: 0;
    margin-left: 0;
  }

  /* 他の都市のリンク：モバイルは 1行 50px の高さを持たせる（指で押しやすくするため）が、
     Blue の PC は `normal`（実測）。
     🔑 **これは `document.fonts.ready` を待って測って初めて確信できた残留**＝
        フォント確定前に測ると別の差（`legend` の幅）が偽陽性で出て紛れる。
     ⚠️ 継承されるプロパティなので、宣言は `p` に在るが**効いて見えるのは中の `a`**。
        `a` 自身を調べても規則が1つも見つからず、**鎖を上に辿って初めて発生源が分かった**。 */
  .other_cities_wrap > ul > li > p {
    line-height: normal;
  }

  /* 🔴🔴 高度グラフの canvas：モバイルは `min-height: 200px` を持つが、Blue の PC は `0`（実測）。
     ⚠️ **Chart.js は自分で `style="height: 189px"` を付ける**が、**CSS の `min-height` の方が勝つ**ので
        グラフだけ 11px 高くなる。
     🔑🔴 **これは 25-3 の総当たりで「JS が未投入だから出ている差」と判断して除外した中に混ざっていた**
        （`#sun_chart` の差 8件のうち `min-height` だけが本物の CSS 残留だった）。
        → **「JS が動けば消える」と束ねて除外すると、その中の本物を取りこぼす**。
        **JS を入れた後にもう一度測って初めて分かった**＝24-2c の申し送り1
        「JS が中身を作ったら、もう一度総当たりで測る」が**実際に効いた**。 */
  .h2_wrap .h2_body > .chart_wrap > div > canvas {
    min-height: 0;
  }

  /* 🔴🔴 高度グラフの器そのもの：モバイルは `height: 200px` で丈を固定するが、
     Blue の PC は**高さを一切宣言していない**（computed 227px＝中身なりの auto）。
     ⚠️ PC 版の規則は同じ鎖で `margin` だけを書き換えるので、**`height` は誰も上書きしない**。
     結果、器が 200px のまま中身（26px + 5px + 196px = 227px）がはみ出し、
     **グラフから下（地図・写真・広告・フッター）が丸ごと 25px 上へズレる**。
     🔑🔴 **25-3 の総当たりが JS 投入前だったので取りこぼした残留**＝
        24-2c の申し送り①「JS が中身を作ったら、もう一度総当たりで測る」は
        25-4 で `canvas` の `min-height` にだけ適用され、**全体では回されていなかった**。
        → 25-6 の検品で全要素を測り直して発見（2026-08-07）。
     🎯 **狭い幅では `height: 200px` が正しい**（Blue モバイルとページ全高 3262px が一致）＝
        直すのは PC 幅だけ。 */
  .h2_wrap .h2_body > .chart_wrap {
    height: auto;
  }

  /* 🔴 カレンダーの月送りボタン（前月＝span1／次月＝span3）：
     モバイルは指で押しやすい 40×40 の箱にするが、Blue の PC は**箱を作らず**
     `padding: 5px 10px` ぶんだけ膨らんだ素の inline-block（実測 32×37）。
     ⚠️ PC 版の規則は詳細度が上だが `border`/`padding`/`cursor`/`font-weight`/`font-size` しか
        書き換えないので、**箱まわりの5つ（下記）がモバイルのまま残る**。
     📌 Blue 本番 PC の computed 実測＝`content-box` / `height: auto`(26px) /
        `width: auto`(10.625px) / `line-height: normal` / `text-align: start`。
     🔑 **カレンダーは JS が中身を作る**ので、25-3 の総当たり時点では
        この span が DOM に1個も無く、測りようが無かった（上の `.chart_wrap` と同じ家系）。 */
  .h2_wrap .h2_body .calendar_wrap .header > div:nth-of-type(1) > span:nth-of-type(1),
  .h2_wrap .h2_body .calendar_wrap .header > div:nth-of-type(1) > span:nth-of-type(3) {
    box-sizing: content-box;
    height: auto;
    width: auto;
    line-height: normal;
    text-align: start;
  }

  /* 🔴 カレンダーの年月テキスト（span2）：モバイルは `width: 100px` + 中央寄せだが、
     Blue の PC は幅の指定が無く（実測 85.9583px＝文字なり）`text-align: start`。
     ⚠️ 幅が 100px のままだと**月送りボタンの位置が左右にズレる**（Blue 839 対 Green 834）。 */
  .h2_wrap .h2_body .calendar_wrap .header > div:nth-of-type(1) > span:nth-of-type(2) {
    width: auto;
    text-align: start;
  }
}