/* 第4段：写真の追加と区切りの変化（③ジュニアユース＝力強い鋭い斜め）。色は既存の配色（#314395 #1e2a5c #d6000c）のみ */
:root{--v4-cut:64px}
@media(max-width:767px){:root{--v4-cut:30px}}

/* --- 写真つき2カラム --- */
.v4-split{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;margin:30px 0 40px}
.v4-split .kfa-lead,.v4-split .v4-split__text{margin:0;text-align:left}
.v4-split .kfa-photo{aspect-ratio:4/3;border-radius:5px;overflow:hidden;box-shadow:0 10px 26px rgba(30,42,92,.18)}
.v4-split--rev .kfa-photo{order:-1}
.v4-split__text p{margin:0 0 20px;line-height:1.9}
@media(max-width:767px){.v4-split{grid-template-columns:1fr;gap:20px;margin:20px 0 28px}.v4-split--rev .kfa-photo{order:0}.v4-split .kfa-lead{font-size:18px}}

/* --- CTA帯：写真を暗い膜の下に敷く（白文字のコントラスト確保） --- */
.kfa-section-cta{background:linear-gradient(rgba(30,42,92,.86),rgba(30,42,92,.86)),url(../sample-photos/coach.webp) center 35%/cover no-repeat,#314395}

/* --- 区切り（ホームベース型）。セクション下端の中央を下向きにとがらせ、次の面に重ねる。H=--v4-cut --- */
.kfa-v8-intro,.kfa-section.v4-cut-up,.r9-media{position:relative;z-index:2;clip-path:polygon(0 -2px,100% -2px,100% calc(100% - var(--v4-cut)),50% 100%,0 calc(100% - var(--v4-cut)));margin-bottom:calc(var(--v4-cut)*-1)}
/* A. VISION(写真+紺) -> POLICY(白) */
.kfa-features{padding-top:calc(30px + var(--v4-cut))}
/* B. ENVIRONMENT(白) -> 活動日・費用(紺) */
.kfa-section.v4-cut-up{padding-bottom:calc(30px + var(--v4-cut))}
@media(min-width:768px){.kfa-section.v4-cut-up{padding-bottom:calc(70px + var(--v4-cut))}}
.kfa-recruit-band{padding-top:calc(44px + var(--v4-cut))}
/* C. SNS(赤) -> CTA(写真+紺) */
.r9-media{padding-bottom:calc(48px + var(--v4-cut))}
.kfa-section-cta{position:relative;padding-top:calc(30px + var(--v4-cut))}
@media(min-width:768px){.kfa-section-cta{padding-top:calc(40px + var(--v4-cut))}}


/* ===== 第7段：区切りの一貫性 =====
   決まり：背景色が変わる境目は、すべて同じホームベース型（下向きのとがり・高さ=--v4-cut）。
   同じ濃紺が続く境目（FV→日程、CTA→フッター）はまっすぐのまま。
   方法：色が変わる境目の「下の面」の上端に、上の面の色の三角形を重ねる。
   下の面は、とがりの先端より下から中身が始まるよう、上余白に --v4-cut を足す。 */
.v6-from{position:relative}
.v6-from::before{content:"";position:absolute;left:0;right:0;top:-1px;height:calc(var(--v4-cut) + 1px);background:var(--v6-from);clip-path:polygon(0 0,100% 0,100% 1px,50% 100%,0 1px);pointer-events:none;z-index:1}
.v6-f-ink{--v6-from:#1e2a5c}.v6-f-navy{--v6-from:#314395}.v6-f-light{--v6-from:#fefbef}.v6-f-white{--v6-from:#fff}
/* 下の面の上余白（先端より下から始める） */
.v6-banner{background:#fefbef;padding:calc(40px + var(--v4-cut)) 0 40px}
.kfa-v8-intro.v6-from{padding-top:calc(10*var(--vu) + 24px);padding-bottom:calc(4*var(--vu) + var(--v4-cut))}
.kfa-section.v6-from{padding-top:var(--v4-cut)}
.r21-summary.v6-from{padding-top:calc(28px + var(--v4-cut));border-bottom:0}
.r9-media.v6-from{padding-top:calc(48px + var(--v4-cut))}
/* 区切りの直後の見出しの上罫線（--c-border）は外す。罫線が区切りの線に見えるため */
.v6-from .kfa-heading-en{border-top:0}
.kfa-heading-en--onwhite{border-top:0}

/* ===== 第9段：セクション数を10に（入会案内の要約を活動日・費用に統合／NEWS・SNSを削除） ===== */
.kfa-recruit-band__note{margin:20px 0 0;font-size:13px;line-height:1.8;color:#fff;opacity:.9}
@media(min-width:768px){.kfa-recruit-band__note{text-align:left}}
