/* 2026-11-04 見比べ用：トップの区画の並び（/top-look/ だけで読む）。3回目（docs/トップ_区画の並び_案_20261104.md）
   文と区画の中身は今のまま。変えるのは ①並び（払えるものをメリットの前へ）②同じことを言う区画を2つ外す（後ろの利用料＝上の帯と同じ・途中のダウンロード＝最後の案内と同じ）③隣り合う区画の地の色を交互に
   旅行や欲しいもの（fx-story）は残す（アプリの魅力。栄成さん「アプリの魅力が伝わらないのでは？」） */
html.lk-top2 main.rs-main { display: flex; flex-direction: column; }
html.lk-top2 .rd-hero { order: 1; } html.lk-top2 .rd-facts { order: 2; } html.lk-top2 .rd-hawks { order: 3; } html.lk-top2 .tx-intro { order: 4; }
html.lk-top2 .rd-pay { order: 5; } html.lk-top2 .fx-merit { order: 6; } html.lk-top2 .fx-story { order: 7; } html.lk-top2 .tx-start { order: 8; }
html.lk-top2 .rd-biz { order: 9; } html.lk-top2 .rd-faq { order: 10; } html.lk-top2 .fx-news { order: 11; } html.lk-top2 .rd-cta { order: 12; }
html.lk-top2 .rd-fee, html.lk-top2 .fx-dl { display: none !important; }
/* 地の色：最初の画面 白 → 費用の帯 薄いグレー → ホークス 白 → しくみ 薄いグレー → 払えるもの 白 → メリット 薄い青 → 旅行や欲しいもの 白 → 始め方 紺 → 法人 白 → よくある質問 薄いグレー → 最新情報 白 */
html.lk-top2 .rd-hero, html.lk-top2 .rd-hawks, html.lk-top2 .rd-pay, html.lk-top2 .rd-biz, html.lk-top2 .fx-news { background: #fff !important; }
html.lk-top2 .rd-facts, html.lk-top2 .tx-intro, html.lk-top2 .rd-faq { background: #f6f8fa !important; }
html.lk-top2 .fx-merit { background: #eef6fd !important; }
html.lk-top2 .fx-story { background: #fff !important; }
html.lk-top2 .rd-facts { padding: 28px 0; }
html.lk-top2 .tx-start { background: #0b1b2b !important; }
html.lk-top2 .tx-start .rd-h2 { color: #fff; }
html.lk-top2 .tx-start__lead { color: rgba(255,255,255,.75); }
html.lk-top2 .tx-start .tx-steps li:not(.is-on) b, html.lk-top2 .tx-start .tx-steps li:not(.is-on) .tx-steps__n { color: rgba(255,255,255,.78); }
/* 11/4 条件の3つの札にアイコン（栄成さん「添付の部分はアイコンを入れた方がわかりやすいのでは？」）。絵はオーナー様ページと同じ Codex の絵 */
.rd-cond li { display: grid; grid-template-columns: 64px minmax(0, 1fr); grid-template-areas: "ic b" "ic s"; align-items: center; column-gap: 14px; text-align: left; }
.rd-cond__ic { grid-area: ic; width: 64px; height: auto; }
.rd-cond li b { grid-area: b; align-self: end; } .rd-cond li span { grid-area: s; align-self: start; }
@media (min-width: 901px) { .rd-cond li { grid-template-columns: 1fr; grid-template-areas: "ic" "b" "s"; justify-items: center; text-align: center; row-gap: 6px; } .rd-cond__ic { width: 84px; } }