@charset "UTF-8";

/*
 * BIANCHI JAPAN CUP 2026（固定ページ: japan-cup2026）専用スタイル
 *
 * 構成: 1.リセット → 2.トークン定義 → 3.ページ土台・共通要素 → 4.Header → 5.Hero → 6.Intro → 7.Ride → 8.Campaign → 9.Event → 10.Fan → 11.Footer → 12.レスポンシブ上書き
 *       （セクションを追加するときはレスポンシブ上書きの手前に挿し込み、番号を振り直す）
 *
 * 記述の約束（後続セクションもこれに合わせる）
 * - ブロック名: p-japanCup2026 をページのブロック、p-japanCup2026<セクション名> を各セクションのブロックとする。
 * - 状態は is-、JS から参照する要素は js- プレフィックスのクラスで表す（スタイル用クラスと分離する）。
 * - 単位は font-size・余白・コンテンツ幅を rem、罫線と影・ぼかしの距離を px とする。
 *   デザインが流体指定している値は clamp() をそのまま引き継ぐ。
 * - モバイルファースト。SP を基準に @media (min-width: 861px)（デザインの max-width:860px の裏返し）で上書きする。
 *   デザインが 760px で切り替える箇所（Campaign の応募期間帯・Campaign/Fan の見出し画像帯）に限り @media (min-width: 761px) を併用する。
 */

/* =============================================================
   1. リセット（このLPの範囲だけに適用する）
   ============================================================= */
.p-japanCup2026,
.p-japanCup2026 *,
.p-japanCup2026 *::before,
.p-japanCup2026 *::after {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

/* テーマ全体の img{width:100%} を打ち消す。要素セレクターを :where() に入れて詳細度を上げないため、
   各コンポーネントのクラス指定（幅・高さ・色）が後勝ちでそのまま効く */
.p-japanCup2026 :where(img) {
    display: block;
    max-width: 100%;
    width: auto;
    height: auto;
}

.p-japanCup2026 :where(a) {
    color: inherit;
    text-decoration: none;
}

.p-japanCup2026 :where(ul) {
    list-style: none;
}

.p-japanCup2026 ::selection {
    background: var(--jc-celeste);
    color: #04110f;
}

/* テーマ共通の .page-body は白背景。本CSSはこの固定ページでしか読み込まないため、ここで黒へ寄せる */
.page-body {
    background-color: #000;
}

/* =============================================================
   2. トークン定義
   ============================================================= */
:root {
    --jc-ink: #0d0f10;
    --jc-panel: #16191b;
    --jc-panel-2: #1c2023;
    --jc-celeste: #5ab7b2;
    --jc-celeste-bright: #74d3cd;
    --jc-celeste-deep: #3f8f8a;
    --jc-line: rgba(255, 255, 255, .12);
    --jc-text: #e9ebeb;
    --jc-muted: #969c9d;
    --jc-jp: "Noto Sans JP", sans-serif;
    --jc-en: "Oswald", sans-serif;
}

/* =============================================================
   3. ページ土台・共通要素
   ============================================================= */
.p-japanCup2026 {
    position: relative;
    background: #000;
    color: var(--jc-text);
    font-family: var(--jc-jp);
    font-weight: 400;
    line-height: 1.85;
    -webkit-font-smoothing: antialiased;
}

/* 画面左下から広がるグロー（デザインの body::before に相当） */
.p-japanCup2026::before {
    content: "";
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 0;
    width: min(100vw, 78.125rem);
    height: min(100vh, 71.875rem);
    height: min(100dvh, 71.875rem);
    pointer-events: none;
    background: radial-gradient(120% 120% at 0% 100%, rgba(170, 242, 255, .62) 0%, rgba(104, 200, 196, .5) 16%, rgba(52, 132, 175, .34) 34%, rgba(26, 66, 98, .17) 52%, transparent 74%);
}

/* グローより手前にコンテンツを重ねる（デザインの header,section,footer{z-index:1} に相当）。
   <main> の外に置くヘッダー・フッターは各ブロック側で重ね順を持つ */
.p-japanCup2026__main > * {
    position: relative;
    z-index: 1;
}

.p-japanCup2026__wrap {
    max-width: 75rem;
    margin: 0 auto;
    padding: 0 1.375rem;
}

.p-japanCup2026__eyebrow {
    display: flex;
    align-items: center;
    gap: 0.875rem;
    font-family: var(--jc-en);
    font-weight: 500;
    font-size: 0.9375rem;
    letter-spacing: .34em;
    text-transform: uppercase;
    color: var(--jc-celeste);
}

.p-japanCup2026__eyebrow::before {
    content: "";
    width: 2.375rem;
    height: 2px;
    background: var(--jc-celeste);
}

/* Ride 以降の各セクションで共通に使う枠（見出し帯・セクション余白） */
.p-japanCup2026__section {
    position: relative;
    padding: clamp(56px, 7.7vw, 105px) 0;
}

.p-japanCup2026__sectionHead {
    margin-bottom: 3.5rem;
}

.p-japanCup2026__sectionTitle {
    margin-top: 1rem;
    font-family: var(--jc-en);
    font-weight: 700;
    font-size: clamp(46px, 6.4vw, 88px);
    line-height: .98;
    letter-spacing: .01em;
    text-transform: uppercase;
}

.p-japanCup2026__sectionSubJa {
    margin-top: 1.125rem;
    font-weight: 700;
    font-size: clamp(19px, 2.4vw, 30px);
    color: #fff;
}

/* 注記文（デザインの .note-star）。
   上の余白は置かれる文脈ごとに変わるため、各セクション側の要素クラスで指定する */
.p-japanCup2026__noteStar {
    font-size: 0.84375rem;
    color: #fff;
}

/* 定員バッジ（デザインの .cap）。人数の数字だけを大きく見せる箇所は __badgeNum を内側に置く
   （数字を強調しない使い方もあるため、子要素セレクターではなくクラスで分ける） */
.p-japanCup2026__badge {
    display: inline-flex;
    align-items: baseline;
    padding: 0.75rem 1rem;
    overflow: hidden;
    background: #5AB7B3;
    font-family: var(--jc-en);
    font-weight: 600;
    font-size: 0.9375rem;
    line-height: 1;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: #fff;
}

.p-japanCup2026__badgeNum {
    font-weight: 700;
    font-size: 1.9em;
    line-height: .5;
}

/* 視覚表現だけでは意味が伝わらない箇所に、読み上げ用のテキストを添えるためのクラス。
   フレックス／グリッドの並びに影響しないよう、フローから外して隠す */
.p-japanCup2026__srOnly {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

/* 本文中の強調リンク（デザインの .ltxt） */
.p-japanCup2026__textLink {
    font-weight: 700;
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 3px;
    transition: color .2s;
}

/* CTA ボタン（デザインの .apply）。hover で ::before の背景が左から入る。
   --line は枠と矢印を白系にした配色違い（デザインの .apply.line 相当） */
.p-japanCup2026__applyLink {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    align-self: stretch;
    gap: 0.75rem;
    margin-top: 1.375rem;
    padding: 1rem 1.125rem 1rem 1.375rem;
    overflow: hidden;
    border: 1px solid var(--jc-celeste);
    background: rgba(255, 255, 255, .14);
    font-family: var(--jc-en);
    font-weight: 600;
    font-size: 0.90625rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #fff;
    transition: color .3s;
}

.p-japanCup2026__applyLink::before {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 0;
    background: var(--jc-celeste);
    transform: translateX(-101%);
    transition: transform .35s cubic-bezier(.5, 0, .2, 1);
}

/* ::before の背景より前面にラベル・アイコンを出す（子要素の数はセクションごとに変わるため個別クラスで指定しない） */
.p-japanCup2026__applyLink > * {
    position: relative;
    z-index: 1;
}

.p-japanCup2026__applyIcon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: none;
    width: 2.125rem;
    height: 2.125rem;
    border-radius: 50%;
    background: var(--jc-celeste);
    font-size: 1rem;
    color: #04110f;
    transition: background .3s, color .3s;
}

.p-japanCup2026__applyLink--line {
    border-color: rgba(255, 255, 255, .55);
}

.p-japanCup2026__applyLink--line .p-japanCup2026__applyIcon {
    background: #fff;
    color: #04110f;
}

/* タッチ端末で hover スタイルが残留しないよう hover 可能な環境に限定する */
@media (hover: hover) {

    .p-japanCup2026__applyLink:hover {
        color: #04110f;
    }

    .p-japanCup2026__applyLink:hover::before {
        transform: translateX(0);
    }

    .p-japanCup2026__applyLink:hover .p-japanCup2026__applyIcon {
        background: #04110f;
        color: var(--jc-celeste);
    }

    .p-japanCup2026__textLink:hover {
        color: #6bb2ff;
    }
}

/* スクロールで下から現れる要素（JSフック: js-japanCup2026Reveal） */
.p-japanCup2026__reveal {
    opacity: 0;
    transform: translateY(1.875rem);
    transition: opacity .8s cubic-bezier(.2, .7, .2, 1), transform .8s cubic-bezier(.2, .7, .2, 1);
}

.p-japanCup2026__reveal.is-revealed {
    opacity: 1;
    transform: none;
}

/* Hero と Intro を重ねてスクロールで切り替えるための土台。
   .p-japanCup2026__revealPin の祖先に overflow を持たせない（Safari で sticky が無効になる） */
.p-japanCup2026__revealStage {
    position: relative;
    z-index: 1;
    height: 300vh;
    height: 300dvh;
}

.p-japanCup2026__revealPin {
    position: sticky;
    top: 0;
    height: 100vh;
    height: 100dvh;
    overflow: hidden;
}

/* 見出し＋画像を横並びにする帯（デザインの .camp-top）。Campaign・Fan で共通。
   761px 以上でのみ2カラム化する（12. のレスポンシブ上書き参照） */
.p-japanCup2026__mediaHead {
    display: grid;
    grid-template-columns: 1fr;
    align-items: start;
    gap: 2rem;
    margin-bottom: clamp(2rem, 4vw, 3.5rem);
}

.p-japanCup2026__mediaHeadMedia {
    position: relative;
    aspect-ratio: 16 / 10;
    min-height: 0;
}

.p-japanCup2026__mediaHeadMedia::after {
    content: "";
    position: absolute;
    inset: 0;
    z-index: 1;
    background: rgba(0, 0, 0, .2);
    pointer-events: none;
}

.p-japanCup2026__mediaHeadImage {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* =============================================================
   4. Header
   ============================================================= */
.p-japanCup2026Header {
    position: fixed;
    inset: 0 0 auto 0;
    z-index: 50;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.75rem 1.375rem;
    border-bottom: 1px solid transparent;
    transition: background .3s, -webkit-backdrop-filter .3s, backdrop-filter .3s, border-color .3s;
}

.p-japanCup2026Header.is-scrolled {
    background: rgba(10, 12, 13, .82);
    -webkit-backdrop-filter: blur(14px);
    backdrop-filter: blur(14px);
    border-bottom-color: var(--jc-line);
}

.p-japanCup2026Header__logoLink {
    display: block;
    flex: none;
}

.p-japanCup2026Header__logo {
    width: 8.25rem;
    height: 2.75rem;
    object-fit: contain;
}

/* =============================================================
   5. Hero
   ============================================================= */
.p-japanCup2026Hero {
    position: absolute;
    inset: 0;
    z-index: 1;
    display: flex;
    align-items: flex-end;
    overflow: hidden;
    will-change: opacity, transform;
}

.p-japanCup2026Hero__bg {
    position: absolute;
    inset: 0;
}

.p-japanCup2026Hero__bgImage {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.p-japanCup2026Hero__scrim {
    position: absolute;
    inset: 0;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(10, 12, 13, .55) 0%, rgba(10, 12, 13, .15) 32%, rgba(10, 12, 13, .35) 62%, rgba(10, 12, 13, .96) 100%);
}

.p-japanCup2026Hero__inner {
    position: relative;
    z-index: 2;
    width: 100%;
    max-width: 80rem;
    margin: 0 auto;
    padding: 0 2.5rem 12vh;
}

.p-japanCup2026Hero__title {
    font-family: var(--jc-en);
    font-weight: 700;
    font-size: clamp(50px, 10.5vw, 148px);
    line-height: .9;
    letter-spacing: .01em;
    text-transform: uppercase;
    text-shadow: 0 8px 40px rgba(0, 0, 0, .5);
}

.p-japanCup2026Hero__titleYear {
    color: var(--jc-celeste);
}

.p-japanCup2026Hero__dates {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 1.125rem 1.625rem;
    margin-top: 1.375rem;
}

.p-japanCup2026Hero__date {
    padding-left: 1rem;
    border-left: 4px solid var(--jc-celeste);
    font-family: var(--jc-en);
    font-weight: 600;
    font-size: clamp(18px, 6vw, 30px);
    line-height: 1.1;
    letter-spacing: .04em;
}

.p-japanCup2026Hero__dateLabel {
    display: block;
    font-size: .42em;
    font-weight: 400;
    letter-spacing: .24em;
    color: var(--jc-muted);
}

.p-japanCup2026Hero__lead {
    max-width: 40ch;
    margin-top: 1.625rem;
    font-weight: 700;
    font-size: clamp(17px, 2.1vw, 25px);
    line-height: 1.6;
}

.p-japanCup2026Hero__leadAccent {
    /* デザインは <b> のUA既定 font-weight:bolder（親700に対し900相当）で強調している。
       意味的な太字ではないため要素は span のままだが、文字幅を合わせるため明示指定する */
    font-weight: bolder;
    color: var(--jc-celeste-bright);
}

.p-japanCup2026Hero__scrollCue {
    display: none;
    position: absolute;
    right: 2.5rem;
    bottom: 6vh;
    z-index: 3;
    align-items: center;
    gap: 0.875rem;
    font-family: var(--jc-en);
    font-size: 0.75rem;
    letter-spacing: .3em;
    text-transform: uppercase;
    color: var(--jc-muted);
    writing-mode: vertical-rl;
}

.p-japanCup2026Hero__scrollCue::after {
    content: "";
    width: 1px;
    height: 3.75rem;
    background: linear-gradient(var(--jc-celeste), transparent);
    animation: jcCue 1.8s ease-in-out infinite;
}

@keyframes jcCue {
    0% {
        transform: scaleY(.3);
        transform-origin: top;
    }

    50% {
        transform: scaleY(1);
        transform-origin: top;
    }

    50.1% {
        transform-origin: bottom;
    }

    100% {
        transform: scaleY(.3);
        transform-origin: bottom;
    }
}

/* =============================================================
   6. Intro（Hero の背面から現れる）
   ============================================================= */
.p-japanCup2026Intro {
    position: absolute;
    inset: 0;
    z-index: 2;
    display: flex;
    align-items: center;
    overflow: hidden;
    opacity: 0;
    will-change: opacity, transform;
}

.p-japanCup2026Intro__bg {
    position: absolute;
    inset: 0;
    z-index: 0;
    transform: scale(1.12);
    will-change: transform;
}

.p-japanCup2026Intro__bgImage {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.p-japanCup2026Intro__scrim {
    position: absolute;
    inset: 0;
    z-index: 1;
    pointer-events: none;
    background: linear-gradient(180deg, rgba(3, 5, 6, .35) 0%, rgba(3, 5, 6, .55) 45%, rgba(3, 5, 6, .9) 100%);
}

.p-japanCup2026Intro__inner {
    position: relative;
    z-index: 2;
    display: flex;
    justify-content: flex-start;
    width: 100%;
    max-width: 75rem;
    margin: 0 auto;
    padding: 0 1.375rem;
}

.p-japanCup2026Intro__copy {
    text-align: left;
    opacity: 0;
    transform: translateY(42vh);
    will-change: transform, opacity;
}

.p-japanCup2026Intro__copy .p-japanCup2026__eyebrow {
    margin-bottom: 1.625rem;
}

.p-japanCup2026Intro__title {
    font-weight: 900;
    font-size: clamp(26px, 3.4vw, 46px);
    line-height: 1.45;
    letter-spacing: .01em;
    text-shadow: 0 6px 30px rgba(0, 0, 0, .6);
}

.p-japanCup2026Intro__titleAccent {
    color: var(--jc-celeste-bright);
}

.p-japanCup2026Intro__text {
    margin-top: 1.75rem;
    font-size: clamp(15px, 1.4vw, 17.5px);
    line-height: 2.05;
    color: #fff;
    text-shadow: 0 2px 16px rgba(0, 0, 0, .65);
}

/* =============================================================
   7. Ride
   ============================================================= */
/* Intro（画面に固定表示される区間）から続く黒を、セクション上端でグラデーションに溶かす。
   位置の基準は同じ要素に付く .p-japanCup2026__section の position: relative */
.p-japanCup2026Ride::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    z-index: 0;
    height: clamp(440px, 54vh, 640px);
    pointer-events: none;
    background: linear-gradient(180deg, #000 0%, rgba(0, 0, 0, .92) 30%, rgba(0, 0, 0, .6) 62%, transparent 100%);
}

.p-japanCup2026Ride__wrap {
    position: relative;
    z-index: 1;
}

/* 直後に続くリード文との間隔を詰める（デザインの style="margin-bottom:-24px"） */
.p-japanCup2026Ride__wrap .p-japanCup2026__sectionSubJa {
    margin-bottom: -1.5rem;
}

.p-japanCup2026Ride__lead {
    margin-bottom: 3.5rem;
    line-height: 2;
    color: #fff;
}

.p-japanCup2026Ride__model {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.625rem;
    align-items: center;
    padding: clamp(38px, 5vw, 64px) 0;
    border-top: 0.5px solid #fff;
}

.p-japanCup2026Ride__model:last-of-type {
    border-bottom: 0.5px solid #fff;
}

.p-japanCup2026Ride__media {
    position: relative;
    aspect-ratio: 16 / 11;
}

.p-japanCup2026Ride__image {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.p-japanCup2026Ride__tag {
    margin-bottom: 0.75rem;
    font-family: var(--jc-en);
    font-size: 0.8125rem;
    letter-spacing: .28em;
    text-transform: uppercase;
    color: var(--jc-celeste);
}

.p-japanCup2026Ride__name {
    font-family: var(--jc-en);
    font-weight: 700;
    font-size: clamp(42px, 5vw, 64px);
    line-height: .95;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.p-japanCup2026Ride__text {
    margin-top: 1rem;
    color: #fff;
}

.p-japanCup2026Ride__link {
    background: rgba(255, 255, 255, .04);
}

/* =============================================================
   8. Campaign
   ============================================================= */
/* 見出し＋リード文と画像を横並びにする帯（デザインの .campaign .camp-top）。
   __top は共通の .p-japanCup2026__mediaHead と併用する */
.p-japanCup2026Campaign__top .p-japanCup2026__sectionHead {
    margin-bottom: 1.125rem;
}

/* 1カラム時の縦間隔だけ Fan（共通の 2rem）より詰める。761px 以上では共通側の gap が後勝ちする */
.p-japanCup2026Campaign__top {
    gap: 1.25rem;
}

.p-japanCup2026Campaign__lead {
    margin-bottom: 0;
    font-weight: 900;
    font-size: clamp(19px, 2.4vw, 30px);
    line-height: 1.5;
}

.p-japanCup2026Campaign__leadAccent {
    color: var(--jc-celeste-bright);
}

.p-japanCup2026Campaign__text {
    margin-bottom: 1.25rem;
    line-height: 2;
    color: #fff;
}

/* 応募期間の帯（デザインの .ov-outer .oo-cell.entry-row）。中間幅は 3. の共通要素にならい
   モバイルファーストで組み、761px 以上でサブ情報を右寄せに切り替える（12. で上書き） */
.p-japanCup2026Campaign__entry {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    row-gap: 0.625rem;
    column-gap: clamp(1.25rem, 4vw, 3.375rem);
    margin-top: 4rem;
    padding: clamp(1.125rem, 1.9vw, 1.5rem) 1.375rem clamp(1.125rem, 1.9vw, 1.5rem) clamp(1.75rem, 4vw, 3.5rem);
    border-top: 1px solid rgba(255, 255, 255, .7);
    border-bottom: 1px solid rgba(255, 255, 255, .7);
    background: #80B6B240;
    text-align: center;
}

.p-japanCup2026Campaign__entryKey {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 0.5625rem 1.125rem;
    border: 1px solid #fff;
    font-family: var(--jc-en);
    font-weight: 500;
    font-size: clamp(9px, 1vw, 11px);
    line-height: 1.15;
    letter-spacing: .22em;
    text-transform: uppercase;
    color: #fff;
}

.p-japanCup2026Campaign__entryKeyJa {
    font-family: var(--jc-jp);
    font-weight: 700;
    font-size: clamp(13px, 1.4vw, 15px);
    letter-spacing: .1em;
    color: #fff;
}

.p-japanCup2026Campaign__entryDateSub {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    column-gap: clamp(0.625rem, 2vw, 1.6875rem);
    row-gap: 0.625rem;
    align-items: baseline;
}

.p-japanCup2026Campaign__entryAnchor {
    display: flex;
    align-items: flex-end;
    justify-content: center;
}

.p-japanCup2026Campaign__entryNum {
    display: inline-flex;
    align-items: baseline;
    font-family: var(--jc-en);
    font-weight: 700;
    font-size: clamp(34px, 4.2vw, 52px);
    line-height: .8;
    letter-spacing: .005em;
    color: var(--jc-celeste-bright);
}

/* 曜日は日付の直後（デザインの entry-row 用 .wd は position:static） */
.p-japanCup2026Campaign__entryDateItem {
    display: inline-flex;
    align-items: baseline;
    gap: 0.5rem;
    line-height: .85;
}

.p-japanCup2026Campaign__entryWeekday {
    font-family: var(--jc-en);
    font-weight: 600;
    font-size: .5em;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--jc-celeste-bright);
}

.p-japanCup2026Campaign__entryArrow {
    align-self: flex-end;
    margin: 0 clamp(8px, 1.2vw, 18px);
    padding-bottom: .15em;
    font-family: var(--jc-en);
    font-weight: 300;
    font-size: .5em;
    color: var(--jc-celeste);
}

.p-japanCup2026Campaign__entrySub {
    font-weight: 500;
    font-size: clamp(14px, 1.4vw, 16px);
    line-height: 1.65;
    color: #fff;
    text-align: center;
}

.p-japanCup2026Campaign__entryNote {
    margin-top: 1rem;
}

.p-japanCup2026Campaign__routes {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.75rem;
    margin-top: 3.25rem;
}

.p-japanCup2026Campaign__route {
    display: flex;
    flex-direction: column;
    padding: 2.5rem 2.125rem;
    border: 1px solid rgba(13, 15, 16, .12);
    border-top: 3px solid var(--jc-celeste);
    background: linear-gradient(0deg, #3D827FCC, #3D827F59);
}

.p-japanCup2026Campaign__routeHead {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
}

.p-japanCup2026Campaign__routeName {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    margin-bottom: 0.375rem;
    font-family: var(--jc-en);
    font-weight: 700;
    font-size: 0.875rem;
    letter-spacing: .2em;
    color: #fff;
}

.p-japanCup2026Campaign__routeNumber {
    padding-right: 0.75rem;
    border-right: 1px solid #fff;
    font-size: 2.75rem;
    line-height: 1;
    letter-spacing: 0;
}

.p-japanCup2026Campaign__routeTitle {
    margin: 0.625rem 0 0.25rem;
    font-weight: 900;
    font-size: clamp(20px, 2vw, 24px);
    line-height: 1.5;
    color: #fff;
}

.p-japanCup2026Campaign__routeList {
    margin-top: 1rem;
    padding-top: 1.375rem;
    border-top: 1px solid #fff;
}

.p-japanCup2026Campaign__routeItem {
    position: relative;
    padding-left: 1.25rem;
    font-size: 0.90625rem;
    line-height: 1.9;
    color: #fff;
}

/* 行頭の四角。テキストの1行目の中心へ合わせた位置をデザインから引き継ぐ */
.p-japanCup2026Campaign__routeItem::before {
    content: "";
    position: absolute;
    top: 0.8125rem;
    left: 0;
    width: 0.5rem;
    height: 0.5rem;
    background: #fff;
}

.p-japanCup2026Campaign__note {
    margin-top: 1.25rem;
    margin-bottom: 3rem;
}

.p-japanCup2026Campaign__terms {
    margin-top: 1.875rem;
    border: 1px solid var(--jc-line);
    background: rgba(13, 15, 16, .5);
}

.p-japanCup2026Campaign__termsHead {
    padding: 1.375rem 1.75rem;
    border-bottom: 1px solid var(--jc-line);
    font-family: var(--jc-en);
    font-weight: 600;
    font-size: 0.9375rem;
    line-height: inherit;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: #fff;
}

.p-japanCup2026Campaign__termsBody {
    padding: 0.5rem 1.75rem 2.125rem;
    background: rgba(13, 15, 16, .5);
}

.p-japanCup2026Campaign__termsTitle {
    margin: 1.625rem 0 0.5rem;
    font-weight: 700;
    font-size: 0.96875rem;
    line-height: inherit;
    color: var(--jc-celeste-bright);
}

/* 文中の改行位置を原稿どおりに出す（デザインが1段落を複数行で組んでいるため） */
.p-japanCup2026Campaign__termsText {
    font-size: 0.84375rem;
    line-height: 1.95;
    color: #fff;
    white-space: pre-line;
}

.p-japanCup2026Campaign__termsList {
    font-size: 0.84375rem;
    line-height: 1.95;
    color: #fff;
}

/* デザインが本文へ直書きしている行頭の「・」を、リストのマーカーとして持たせる */
.p-japanCup2026Campaign__termsItem::before {
    content: "・";
}

.p-japanCup2026Campaign__termsLink {
    color: #fff;
    text-decoration: underline;
    text-underline-offset: 3px;
    word-break: break-all;
    transition: color .2s;
}

@media (hover: hover) {

    .p-japanCup2026Campaign__termsLink:hover {
        color: #6bb2ff;
    }
}

/* =============================================================
   9. Event
   ============================================================= */
.p-japanCup2026Event__dl {
    max-width: 62.5rem;
    margin: 0 auto;
    border-top: 1px solid var(--jc-line);
}

.p-japanCup2026Event__dlRow {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.375rem;
    padding: 1.375rem 0.375rem;
    border-bottom: 1px solid var(--jc-line);
}

.p-japanCup2026Event__dlTerm {
    padding-top: 0.1875rem;
    font-family: var(--jc-en);
    font-weight: 600;
    font-size: 0.875rem;
    letter-spacing: .14em;
    text-transform: uppercase;
    color: var(--jc-celeste);
}

.p-japanCup2026Event__dlDesc {
    line-height: 1.8;
    color: #fff;
}

/* 定義リストと同じ幅で中央に置き、注記が本文の左端に揃うようにする */
.p-japanCup2026Event__dlNote {
    max-width: 62.5rem;
    margin: 1rem auto 0;
}

/* =============================================================
   10. Fan
   ============================================================= */
/* 見出しと画像を横並びにする帯（デザインの .fan .camp-top）。
   Campaign と違いリード文を持たないため、画像と縦中央で揃える */
.p-japanCup2026Fan__top {
    align-items: center;
}

.p-japanCup2026Fan__top .p-japanCup2026__sectionHead {
    margin-bottom: 0;
}

.p-japanCup2026Fan__intro {
    margin-bottom: 0.75rem;
    line-height: 2;
    color: #fff;
}

.p-japanCup2026Fan__venues {
    display: grid;
    grid-template-columns: 1fr;
    gap: 1.75rem;
    margin-top: 3.25rem;
}

.p-japanCup2026Fan__venue {
    display: flex;
    flex-direction: column;
    overflow: hidden;
    border: 1px solid var(--jc-line);
    background: linear-gradient(0deg, #3D827FCC, #3D827F59);
}

.p-japanCup2026Fan__venueHead {
    padding: 1.875rem 2rem 0;
}

.p-japanCup2026Fan__venueHeadTop {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    gap: 1rem;
    margin-top: 0.3125rem;
    margin-bottom: 1.125rem;
}

.p-japanCup2026Fan__city {
    font-family: var(--jc-en);
    font-weight: 700;
    font-size: clamp(28px, 3.4vw, 44px);
    line-height: 1;
    letter-spacing: .02em;
    text-transform: uppercase;
}

.p-japanCup2026Fan__tagline {
    margin-top: 1rem;
    font-weight: 700;
    line-height: 1.6;
    color: #fff;
}

/* カードの高さが揃ったとき、注記までの余白ではなく本文側が伸びるようにする */
.p-japanCup2026Fan__venueBody {
    display: flex;
    flex-direction: column;
    flex: 1;
    padding: 1.375rem 2rem 2rem;
}

.p-japanCup2026Fan__dl {
    margin: 0.375rem 0 0.25rem;
}

/* 見出し側の列幅は Event の定義リスト（12.5rem）と異なる。デザインの値をそのまま持つ */
.p-japanCup2026Fan__dlRow {
    display: grid;
    grid-template-columns: 5.5rem 1fr;
    gap: 1rem;
    padding: 0.6875rem 0;
    border-bottom: 1px solid #fff;
}

.p-japanCup2026Fan__dlTerm {
    font-weight: 700;
    font-size: 0.8125rem;
    color: #fff;
}

.p-japanCup2026Fan__dlDesc {
    font-size: 0.875rem;
    line-height: 1.7;
    color: #fff;
}

/* 色付きパネルの上に置くため、共通の CTA より枠と背景を明るくする（デザインの .venues .apply） */
.p-japanCup2026Fan__applyLink {
    border-color: rgba(255, 255, 255, .55);
    background: rgba(255, 255, 255, .32);
}

.p-japanCup2026Fan__applyLink .p-japanCup2026__applyIcon {
    background: #fff;
    color: #04110f;
}

.p-japanCup2026Fan__applyLink--disabled {
    cursor: default;
}

/* 応募フォームが未公開の会場は遷移先を持たないため、押下できる見た目にしない */
@media (hover: hover) {

    .p-japanCup2026Fan__applyLink--disabled:hover {
        color: #fff;
    }

    .p-japanCup2026Fan__applyLink--disabled:hover::before {
        transform: translateX(-101%);
    }

    .p-japanCup2026Fan__applyLink--disabled:hover .p-japanCup2026__applyIcon {
        background: #fff;
        color: #04110f;
    }
}

.p-japanCup2026Fan__note {
    margin: 0.75rem 0 0.3125rem;
}

/* =============================================================
   11. Footer
   ============================================================= */
/* <main> の外にあるため、ページ土台のグローより手前に出す重ね順を自分で持つ */
.p-japanCup2026Footer {
    position: relative;
    z-index: 1;
    padding: 4rem 0 2.5rem;
    margin-top: clamp(56px, 7.7vw, 105px);
    background: rgba(0, 0, 0, .5);
    text-align: center;
}

.p-japanCup2026Footer__logoLink {
    display: block;
    width: fit-content;
    margin: 0 auto 1.625rem;
}

.p-japanCup2026Footer__logo {
    width: 10.625rem;
    height: 3.5rem;
    object-fit: contain;
}

.p-japanCup2026Footer__company {
    margin-bottom: 0.5rem;
    font-size: 0.8125rem;
    color: #fff;
}

.p-japanCup2026Footer__copyright {
    font-family: var(--jc-en);
    font-size: 0.75rem;
    letter-spacing: .12em;
    color: #5b6162;
}

/* =============================================================
   12. レスポンシブ上書き（デザインの max-width:860px の裏返し）
   ============================================================= */
@media (min-width: 861px) {

    .p-japanCup2026__wrap {
        padding: 0 2.5rem;
    }

    .p-japanCup2026Header {
        padding: 1rem 2.5rem;
    }

    .p-japanCup2026Hero__inner {
        padding-bottom: 8vh;
    }

    .p-japanCup2026Hero__date {
        font-size: clamp(20px, 3vw, 38px);
    }

    .p-japanCup2026Hero__scrollCue {
        display: flex;
    }

    .p-japanCup2026Intro__scrim {
        background: linear-gradient(180deg, rgba(10, 12, 13, .55) 0%, rgba(10, 12, 13, .15) 32%, rgba(10, 12, 13, .35) 62%, rgba(10, 12, 13, .96) 100%);
    }

    .p-japanCup2026Intro__inner {
        justify-content: flex-end;
        padding: 0 clamp(2.5rem, 5vw, 4.5rem);
    }

    .p-japanCup2026Intro__copy {
        width: 50%;
        max-width: 38.75rem;
    }

    .p-japanCup2026Ride__model {
        grid-template-columns: 1fr 1fr;
        gap: min(6vw, 80px);
    }

    /* 2台目だけ画像を右カラムへ送る。even の判定は .p-japanCup2026__wrap 直下の並び
       （見出し帯・リード文・モデル3件）に依存するため、要素の増減時は順序を確認する */
    .p-japanCup2026Ride__model:nth-child(even) .p-japanCup2026Ride__media {
        order: 2;
    }

    .p-japanCup2026Campaign__routes {
        grid-template-columns: 1fr 1fr;
    }

    .p-japanCup2026Event__dlRow {
        grid-template-columns: 12.5rem 1fr;
        gap: 1.5rem;
    }

    .p-japanCup2026Fan__venues {
        grid-template-columns: 1fr 1fr;
    }
}

/* Campaign の応募期間帯だけはデザインが 760px でサブ情報の配置を切り替えるため、861px とは別の境界を持つ */
@media (min-width: 761px) {

    .p-japanCup2026Campaign__entry {
        text-align: left;
    }

    .p-japanCup2026Campaign__entryDateSub {
        justify-content: flex-start;
        row-gap: 0.25rem;
    }

    .p-japanCup2026Campaign__entrySub {
        margin-left: auto;
        text-align: right;
    }

    .p-japanCup2026__mediaHead {
        grid-template-columns: 1.05fr .95fr;
        gap: min(6vw, 4.5rem);
    }
}
