:root{--serif:var(--sans);--fs-label:12px;--fs-note:13px;--fs-button:15px;--fs-cell:15px;--fs-body:16px;--fs-lead:17px;--heading:'Zen Maru Gothic','Zen Kaku Gothic New',sans-serif;--head-large:clamp(32px,4.4vw,62px);--head-section:clamp(28px,3.2vw,44px);--head-small:clamp(19px,1.8vw,25px);--world-bg:#e1e5d9;--sage:var(--world-bg);--peach:#e7ddcc;--sand:#ebe6d9;--space-section:clamp(72px,8vw,116px);--paper-ground:#efebe2;--chapter-learn:oklch(93.5% .018 225);--chapter-care:var(--paper-ground);--chapter-price:var(--paper-ground);--chapter-visit:var(--paper-ground)}
/* Japanese is the primary voice. Latin type is retained only for small metadata. */
.display,.hero-copy .display,.arrival .display,.field__heading .display{font:500 var(--head-large)/1.65 var(--heading);letter-spacing:.055em;font-style:normal}.hero-copy .display{font-size:clamp(38px,5.1vw,72px);margin:var(--m) 0}.display em{font-style:normal}.hero-copy{padding-top:clamp(150px,19vh,200px)}.p-front-mv__title{font-family:var(--sans);font-size:clamp(13px,1.2vw,16px);line-height:2.1}.hero-copy .eyebrow{font-size:10px}.arrival__ja,.field .lead{font:500 clamp(21px,2.2vw,29px)/1.9 var(--heading)}.mission-side h2,.continuation h2,.c-cv-area h2{font:500 var(--head-section)/1.7 var(--heading);letter-spacing:.035em}.continuation h3,.continuation .pr-card h3,.continuation .pr-only-block h3,.continuation .pr-renewal h3{font:500 var(--head-small)/1.65 var(--heading);letter-spacing:.015em}.continuation .label,.mission-side .label{font:500 12px/1.8 var(--sans);letter-spacing:.12em}.chapter{margin-bottom:var(--m)}.chapter>span{font:10px/1.8 var(--sans);letter-spacing:.14em}.continuation .pr-rank,.continuation .pr-renewal__label{font:500 13px/1.8 var(--sans);font-style:normal}.photo figcaption span{font:500 14px/1.8 var(--heading);font-style:normal}.art-area p,.scene-art>p{font:500 18px/1.8 var(--heading)}.vc-body p{font:400 15px/2.1 var(--sans)}.rs-num,.cf-num,.sv-num{font:400 27px/1.5 var(--en);font-style:normal}.tlink{font:500 14px/1.9 var(--sans)}.continuation .faq .fq-cat{font:500 19px/1.8 var(--heading)}.aside-copy em{font-style:normal}.section-meta{margin-bottom:var(--l)}
/* Shared scenery continues through the narrative rather than separate color bands. */
main{background:var(--world-bg)}.opening,.opening__sticky,.arrival,.field,.mission,.continuation{background:var(--world-bg)}.mission{border-radius:0}.field,.mission,.continuation>section{padding-block:var(--space-section)}.continuation>.reason,.continuation>.draft-gallery,.continuation>.comfort,.continuation>.support,.continuation>.voices,.continuation>.news,.continuation>.access,.continuation>.faq{background:transparent;border-radius:0}.continuation{position:relative;isolation:isolate}.continuation::before,.continuation::after{content:'';position:absolute;inset:0 auto 0 0;width:4%;background:color-mix(in srgb,var(--sage-dark) 12%,var(--world-bg));border-radius:50% 45% 40% 55%/8% 12% 10% 12%;z-index:-1;pointer-events:none}.continuation::after{left:auto;right:0;border-radius:45% 55% 35% 45%/10% 8% 12% 7%}.continuation .c-cv-area{background:var(--sage-dark)}.scene-art,.art-area--people{background:color-mix(in srgb,var(--base) 50%,var(--world-bg))}.comfort>.wrap>.scene-art,.faq .scene-art{background:var(--sand)}.photo,.rs-card figure{border-radius:8px;padding:8px;box-shadow:0 3px 0 color-mix(in srgb,var(--ink) 7%,transparent)}.photo img,.rs-card img{border-radius:4px}.album .photo:first-child,.album .photo:nth-child(2),.album .photo:nth-child(3),.photo--field,.photo--learning,.rs-card figure,.rs-card:nth-child(2) figure{transform:none}.vc-card,.sp-item{background:var(--base);border-radius:10px}.vc-card:nth-child(even),.sp-item:nth-child(2){transform:none}.price .pr-card{background:var(--sand);border-radius:12px;padding-top:var(--l)}.price .pr-only-block,.price .pr-renewal{background:color-mix(in srgb,var(--sand) 55%,var(--base))}.scene-art--small{height:230px}.rs-head{max-width:800px}.rs-head h2{margin-top:var(--s)}.cf-top{gap:var(--l)}.cf-top__desc,.sp-top__desc{max-width:46em}.rs-grid{margin-top:-65px}.album{margin-top:-55px}.sp-list,.vc-grid{margin-top:-45px}.film-frame{position:absolute;inset:-2px;z-index:3;pointer-events:none;border:18px solid var(--world-bg);border-bottom-width:0;border-radius:35% 10% 0 0/20px 30px 0 0}.land-band{border-radius:55% 36% 0 0/8% 6% 0 0}.land-band span{display:none}.layer-label{right:var(--gutter);font-size:10px}.hd nav ul{gap:var(--s)}.hd nav{font-size:11px}.contact-modal__title{font-family:var(--heading)}
@media(min-width:960px){.is-enhanced .opening{height:250vh}.is-enhanced .land-band{height:160vh}.is-enhanced .arrival{padding-top:130px;padding-bottom:100px}.is-enhanced .arrival .display{max-width:65%}.annotation{max-width:28%;font-size:11px}.mission__grid{gap:7vw}.mission__scene{padding-top:var(--l)}}
@media(max-width:959px){:root{--head-large:31px;--head-section:28px;--head-small:20px}.hero-copy .display{font-size:38px;letter-spacing:.025em}.hero-copy{padding-top:150px}.arrival{min-height:530px}.arrival .display,.field__heading .display{font-size:31px;letter-spacing:.02em}.arrival .display{margin-block:var(--m)}.arrival__ja{font-size:21px}.continuation h2,.mission-side h2{font-size:28px;letter-spacing:.01em}.c-cv-area h2{font-size:23px}.continuation h3{font-size:20px}.continuation::before,.continuation::after{width:10px}.film-frame{border-width:9px;border-bottom-width:0}.annotation{max-width:100%}.field__heading{gap:var(--m)}.cf-card h3{font-size:17px}.continuation .price .pr-card{border-radius:12px}.scene-art--small{height:250px}.rs-card:nth-child(2),.rs-card:nth-child(3){margin-inline:0}.photo--field{width:92%;margin-left:4%}.draft-badge{font-size:8px}}
/* Repeated motion vocabulary: a persistent landscape and independently passing photos. */
.scene-sequence{position:relative;isolation:isolate}.scene-sequence>.scene-art{z-index:0}.scene-sequence>.rs-grid,.scene-sequence>.album{z-index:1;position:relative}.scene-sequence .rs-card{isolation:isolate}.world-bridge{position:absolute;inset:-48px 0 auto;height:96px;overflow:hidden;pointer-events:none;z-index:0}.world-bridge i{display:block;position:absolute;left:-5%;width:110%;height:76px;border-radius:50% 35% 0 0/70% 80% 0 0;background:var(--bridge-back);transform-origin:center bottom}.world-bridge__back{top:12px}.world-bridge .world-bridge__front{top:35px;left:-12%;width:125%;background:var(--bridge-front);border-radius:35% 60% 0 0/65% 90% 0 0}.continuation>section>.wrap{position:relative}.scene-sequence .rs-card p{background:var(--chapter-bg);position:relative}.scene-sequence .rs-card h3{background:var(--chapter-bg);position:relative}.scene-sequence .rs-num{position:relative;background:var(--chapter-bg)}
@media(min-width:960px) and (min-height:650px){.is-scene-motion .scene-sequence>.scene-art{position:sticky;top:100px;margin-bottom:0}.is-scene-motion .scene-sequence>.rs-grid,.is-scene-motion .scene-sequence>.album{margin-top:72px;padding-bottom:56px}.is-scene-motion .scene-sequence>.album{min-height:540px;align-items:center}.is-scene-motion .scene-sequence>.rs-grid{padding-top:24px}}
@media(max-width:959px){.world-bridge{height:56px;top:-28px}.world-bridge i{height:48px}.world-bridge .world-bridge__front{top:25px}.scene-sequence>.rs-grid{margin-top:-40px}.scene-sequence>.album{margin-top:-30px}}
@media(prefers-reduced-motion:reduce){.scene-sequence>.scene-art{position:relative!important;top:auto!important}}
/* Clip decorative edges without creating a scroll container that disables sticky. */
.continuation{overflow:clip}

/* Illustration B: preserve the supplied composition and keep the actual field visible. */
.field-illustration{margin:0;position:relative}
.field-illustration picture{display:block;overflow:hidden;border-radius:var(--s)}
.field-illustration img{display:block;width:100%;height:auto}
.field-illustration figcaption{margin-top:var(--s);font-size:11px;color:var(--muted)}
.field__stage:has(.field-illustration){padding-bottom:0}
.field__stage:has(.field-illustration) .field__note{margin:var(--m) 0 0}
@media(min-width:960px){
.field__stage:has(.field-illustration) .photo--field{width:28%;left:3%;top:6%;bottom:auto}
}
@media(max-width:959px){
.field__stage:has(.field-illustration) .photo--field{width:92%;margin:var(--l) auto 0}
}

/* Illustration C: show faces, controller and aircraft without photo overlap. */
.learning-illustration{margin:0}
.learning-illustration picture{display:block;overflow:hidden;border-radius:var(--s)}
.learning-illustration img{display:block;width:100%;height:auto}
.learning-illustration + .photo--learning{width:72%;margin:var(--l) 0 0 auto}
@media(max-width:959px){.learning-illustration + .photo--learning{width:92%;margin:var(--l) auto 0}}

/* One landscape persists from the film through the introduction and field. */
.field-journey{position:relative;background:var(--base)}
.journey-scenery{display:none;pointer-events:none}
.field-journey .opening,.field-journey .opening__sticky,.field-journey .arrival,.field-journey .field{background:transparent}
.field-journey .film-frame{display:none}
.field-journey .arrival{background:linear-gradient(180deg,var(--base),color-mix(in srgb,var(--base) 92%,var(--world-bg)))}
.field-journey .field-illustration picture{border-radius:0}
.field-journey .field{background:linear-gradient(180deg,var(--base) 80%,var(--world-bg))}
@media(min-width:960px) and (min-height:650px){
.is-enhanced .journey-scenery{display:block;position:sticky;top:0;height:100vh;margin-bottom:-100vh;overflow:hidden}
.journey-scenery picture,.journey-scenery img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}
.is-enhanced .opening{height:270vh}
.is-enhanced .arrival{background:transparent;pointer-events:none}
.is-enhanced .arrival .display{font-size:clamp(32px,3.6vw,54px);max-width:48%;margin-top:var(--m)}
.is-enhanced .arrival__ja{font-size:clamp(18px,1.8vw,25px)}
.is-enhanced .arrival{justify-content:flex-start;padding-top:clamp(110px,17vh,180px)}
.is-enhanced .field{position:relative;background:linear-gradient(180deg,transparent 70%,var(--world-bg));padding-top:var(--gap)}
.is-enhanced .field__heading{padding:var(--m);background:color-mix(in srgb,var(--base) 94%,transparent);border-radius:var(--s)}
.is-enhanced .field .section-meta{padding:var(--s);background:color-mix(in srgb,var(--base) 94%,transparent)}
.is-enhanced .field-illustration{visibility:hidden}
}
@media(max-width:959px){
.field-journey .arrival{min-height:0;padding-top:var(--gap);padding-bottom:var(--l)}
.field-journey .arrival::before{content:'';position:absolute;inset:calc(-1 * var(--l)) 0 auto;height:var(--l);background:linear-gradient(transparent,var(--base))}
.field-journey .field{padding-top:var(--l)}
}

/* Illustration D: preserve all three learning scenes and the paper margin. */
.scene-sequence .reason-illustration{position:relative;height:auto;padding:0;border:0;border-radius:var(--s);background:transparent;margin-top:var(--l);overflow:hidden}
.reason-illustration picture,.reason-illustration img{display:block;width:100%;height:auto}
/* PC: 風景画を短くピン留めし、カードが下辺 約2割まで滑り込んだところで一緒に流れる（全面を横切る sticky は 2026-09-22 に停止。ピンは JS・reduced-motion/no-JS では重ならず縦に並ぶ） */
.scene-sequence .reason-illustration + .rs-grid,.scene-sequence .pin-spacer + .rs-grid{margin-top:var(--m)}
@media(min-width:960px){
.is-scene-motion [data-world-scene="reasons"]>.scene-art{position:relative;top:auto}
.is-scene-motion [data-world-scene="reasons"]>.rs-grid{padding-top:0;padding-bottom:0}
}
@media(max-width:959px){.scene-sequence .reason-illustration{position:relative;top:auto}.scene-sequence .reason-illustration + .rs-grid,.scene-sequence .pin-spacer + .rs-grid{margin-top:var(--l)}}

/* Photography and copy share one paper surface while crossing the landscape. */
[data-world-scene="reasons"] .rs-grid{gap:clamp(24px,5vw,76px);align-items:start;padding-inline:var(--m)}
[data-world-scene="reasons"] .rs-card{padding:var(--m);background:var(--base);border:1px solid color-mix(in srgb,var(--ink) 9%,transparent);border-radius:4px;box-shadow:0 8px 20px color-mix(in srgb,var(--ink) 7%,transparent)}
[data-world-scene="reasons"] .rs-card:nth-child(2){padding-top:var(--m);margin-top:var(--l)}
[data-world-scene="reasons"] .rs-card:nth-child(3){padding-top:var(--m);margin-top:var(--s)}
[data-world-scene="reasons"] .rs-card figure{padding:0;margin:0 0 var(--m);border-radius:2px;box-shadow:none;background:transparent}
[data-world-scene="reasons"] .rs-card img{aspect-ratio:3/2;border-radius:2px;filter:saturate(.8)}
[data-world-scene="reasons"] .rs-card .rs-num,[data-world-scene="reasons"] .rs-card h3,[data-world-scene="reasons"] .rs-card p{background:transparent}
[data-world-scene="reasons"] .rs-num{display:block;font:500 12px/1.7 var(--sans);letter-spacing:.18em;color:var(--accent);margin-bottom:var(--s)}
[data-world-scene="reasons"] .rs-card h3{font-size:clamp(19px,1.55vw,23px);margin:0 0 var(--m);line-height:1.7}
[data-world-scene="reasons"] .rs-card p{font-size:14px;line-height:2;color:var(--muted)}
@media(max-width:959px){
[data-world-scene="reasons"] .rs-grid{padding-inline:0;gap:var(--l)}
[data-world-scene="reasons"] .rs-card,[data-world-scene="reasons"] .rs-card:nth-child(2),[data-world-scene="reasons"] .rs-card:nth-child(3){margin:0;width:100%;max-width:none}
}

/* Gallery grid (PC): 9枚を 4コマ×3段の誌面風に組む。横2コマ（.gallery__item--wide）は 全景 → 講習風景 → 講習動画 と段ごとに位置をずらして対角の流れを作る（2026-09-22）。絞り込みで隠れても span は維持される */
@media(min-width:960px){
#gallery:not(.gallery--nav) .gallery__grid{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-flow:dense;gap:var(--m)}
#gallery:not(.gallery--nav) .gallery__item--wide{grid-column:span 2}
#gallery:not(.gallery--nav) .gallery__item--wide .gallery__trigger{height:100%;display:flex;flex-direction:column}
#gallery:not(.gallery--nav) .gallery__item--wide .gallery__figure{aspect-ratio:auto;flex:1 1 auto;min-height:0}
#gallery:not(.gallery--nav) .gallery__item--wide .gallery__figure>picture,#gallery:not(.gallery--nav) .gallery__item--wide .gallery__figure>video{position:absolute;inset:0}
#gallery:not(.gallery--nav) [data-gallery-en="Lesson Flight"] img{object-position:50% 22%}
}
/* Gallery nav (A+E, 2026-09-22): main のタイポナビを日本語主体に。左＝丸ゴシックのタイトル一覧、右＝水彩の縁で切り抜いた固定プレビュー */
@media(min-width:960px){
#gallery.gallery--nav .gallery__grid{display:flex;gap:clamp(32px,4vw,64px);align-items:stretch;height:min(70vh,580px);overflow:hidden;position:relative}
#gallery.gallery--nav .gallery__navcol{flex:1 1 44%;min-width:0;position:relative;overflow:hidden;
  mask-image:linear-gradient(to bottom,transparent 0,#000 28px,#000 calc(100% - 28px),transparent 100%)}
#gallery.gallery--nav .gallery__navview{flex:1 1 56%;position:relative;align-self:center;aspect-ratio:4/3;max-height:100%;border:0;background:transparent;overflow:hidden;
  border-radius:46% 34% 42% 30% / 34% 42% 30% 44%;
  mask-image:radial-gradient(ellipse farthest-side at 50% 50%,#000 72%,transparent 100%)}
#gallery.gallery--nav .gallery__navview .gallery__figure{position:absolute;inset:0;width:100%;height:100%;margin:0;border:0;aspect-ratio:auto;opacity:0;transition:opacity .45s ease;pointer-events:none;background:transparent}
#gallery.gallery--nav .gallery__navview .gallery__figure.is-active{opacity:1}
#gallery.gallery--nav .gallery__navview picture,#gallery.gallery--nav .gallery__navview img,#gallery.gallery--nav .gallery__navview video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 45%}
#gallery.gallery--nav .gallery__navview .gallery__figcaption,#gallery.gallery--nav .gallery__overlay{display:none}
#gallery.gallery--nav .gallery__navview .gallery__video--preview{z-index:1}
#gallery.gallery--nav .gallery__trigger{background:transparent;padding:0;border-radius:0}
#gallery.gallery--nav .gallery__row{display:flex;align-items:baseline;gap:clamp(12px,1.4vw,20px);padding:clamp(8px,1vw,12px) 4px;border-top:1px solid transparent;border-bottom:1px solid transparent;transition:border-color .25s ease}
#gallery.gallery--nav .gallery__row em{font:500 clamp(1.15rem,1.6vw,1.45rem)/1.35 var(--heading);font-style:normal;letter-spacing:.04em;color:color-mix(in srgb,var(--ink) 42%,transparent);transition:color .25s ease;white-space:nowrap}
#gallery.gallery--nav .gallery__row small{font:500 10px/1.6 var(--sans);letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
#gallery.gallery--nav .gallery__trigger:hover .gallery__row,#gallery.gallery--nav .gallery__trigger:focus-visible .gallery__row{border-top-color:var(--line);border-bottom-color:var(--line)}
#gallery.gallery--nav .gallery__trigger:hover .gallery__row em,#gallery.gallery--nav .gallery__trigger:focus-visible .gallery__row em{color:var(--ink)}
#gallery.gallery--nav .gallery__item{position:relative;margin:0;width:100%}
#gallery.gallery--nav .gallery__item.is-hidden{display:none}
}
/* Illustration E introduces the gallery without covering its controls or media. */
.gallery-illustration{margin:var(--l) 0;color:var(--muted)}
.gallery-illustration picture{display:block;overflow:hidden;border-radius:var(--s)}
.gallery-illustration img{display:block;width:100%;height:auto}
@media(max-width:599px){.gallery-illustration img{height:auto;aspect-ratio:4/3;object-fit:cover;object-position:25% center}}


/* Support illustration G gives the consultation scene its own breathing room. */
.support-illustration{margin:var(--l) 0;color:var(--muted)}
.support-illustration picture{display:block;overflow:hidden;border-radius:var(--s)}
.support-illustration img{display:block;width:100%;height:auto}
.support-illustration + .sp-list{margin-top:var(--l)}
@media(max-width:599px){.support-illustration img{aspect-ratio:4/3;object-fit:cover;object-position:center}}

/* A small letter illustration introduces the alumni testimonials. */
.alumni-illustration{width:100%;max-width:600px;margin:var(--l) auto;overflow:hidden;border-radius:var(--s)}
.alumni-illustration picture,.alumni-illustration img{display:block;width:100%;height:auto}
.alumni-illustration + .vc-grid{margin-top:var(--l)}
.voices{--voice-person-size:64px}
.vc-person{display:flex;align-items:center;gap:var(--s);margin-bottom:var(--m)}
.vc-person__art{display:block;flex:0 0 var(--voice-person-size);width:var(--voice-person-size);mix-blend-mode:multiply;mask-image:radial-gradient(ellipse closest-side,#000 72%,transparent 100%)}
.vc-person__art img{width:100%;height:auto}
.vc-person .vc-meta{display:flex;flex-direction:column;align-items:flex-start;gap:0;margin-bottom:0;min-width:0}

/* Course illustration I stays beside the introduction, clear of the prices. */
.course-illustration{float:right;width:38%;max-width:480px;margin:0 0 var(--l) var(--l);overflow:hidden;border-radius:var(--s)}
.course-illustration picture,.course-illustration img{display:block;width:100%;height:auto}
@media(max-width:959px){.course-illustration{float:none;width:100%;max-width:480px;margin:0 auto var(--l)}}

/* Mission trial: one warm editorial spread, with the title first on mobile. */
.mission--editorial{--mission-inset:clamp(24px,4vw,64px);--mission-body:15px;--mission-note:12px}
.mission__spread{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);grid-template-areas:"heading art" "story art";column-gap:var(--l);row-gap:var(--m);padding:var(--mission-inset);background:var(--base);border-radius:var(--m)}
.mission__heading{grid-area:heading;align-self:end}
.mission__heading h2{margin:var(--s) 0 0;font-size:var(--head-section);text-wrap:balance}
.mission__art{grid-area:art;align-self:center;min-width:0;position:relative;padding-right:clamp(48px,4.5vw,84px)}
.mission__art picture{mix-blend-mode:multiply;mask-image:radial-gradient(ellipse farthest-side,#000 78%,transparent 100%)}
.mission__story{grid-area:story;max-width:34em;font-size:var(--mission-body);line-height:2.1}
.mission__story .tlink{display:inline-block;margin-top:var(--m);padding-block:var(--s)}
/* 使命文：main の縦書きシグネチャーをイラスト右端に重ねて再現（PC）。SP は横書きの注記に戻す */
.mission__tate{position:absolute;top:6%;right:0;margin:0;writing-mode:vertical-rl;text-orientation:mixed;white-space:nowrap;font:500 clamp(14px,1.25vw,18px)/2.4 var(--heading);letter-spacing:.14em;color:color-mix(in srgb,var(--ink) 80%,transparent);}
/* 強調語「新しい仕事」：ブロンズの文字色（--accent-text）で生成りの台紙に対し 4.5:1 以上（10-10・旧 accent 88% は SP 14px で 3.68:1） */
.mission__tate em{font-style:normal;color:var(--accent-text)}
.mission__tate .st-char{display:inline-block}
@media(max-width:959px){
  .mission__spread{grid-template-columns:minmax(0,1fr);grid-template-areas:"heading" "art" "story" "tate";gap:var(--m)}
  /* SP: 使命文を本文の後ろへ。art の箱を外して figure と使命文を個別のグリッド項目にする */
  .mission__art{display:contents}
  .mission__art>figure{grid-area:art;width:100%;max-width:560px;justify-self:center;margin:0}
  .mission__tate br{display:none}
  .mission__tate{grid-area:tate;position:static;white-space:normal;writing-mode:horizontal-tb;font:400 var(--mission-note)/2 var(--sans);letter-spacing:0;color:var(--ink);border-top:1px solid var(--line);padding-top:var(--m);margin:0;text-wrap:pretty}
  .mission__heading h2{font-size:var(--head-section);line-height:1.65}
}

/* A paper navigation strip connects the real landscape to the watercolor world. */
:root{--header-height:88px;--nav-size:15px;--action-size:15px;--z-header:100}
html{scroll-padding-top:calc(var(--header-height) + var(--m))}
#siteHeader{position:fixed;inset:0 0 auto;z-index:var(--z-header);padding:var(--s) clamp(24px,3vw,48px);background:var(--base);color:var(--ink);border-bottom:1px solid var(--line)}
.hd{min-height:64px;gap:var(--m)}
.hd .brand img{width:150px;filter:none}
.hd nav{font:500 var(--nav-size)/1.5 var(--sans)}
.hd nav ul{gap:clamp(8px,1.1vw,20px)}
.hd nav a{display:flex;align-items:center;min-height:48px;white-space:nowrap;position:relative}
.hd nav a::after{content:'';position:absolute;bottom:5px;left:0;right:0;height:2px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .2s ease}
.hd nav a:hover::after,.hd nav a:focus-visible::after{transform:scaleX(1)}
.hd-cta{display:inline-flex;align-items:center;justify-content:center;gap:var(--s);padding:14px 22px;min-height:52px;white-space:nowrap;background:var(--sage-dark);color:var(--base);border-color:var(--sage-dark);font:500 var(--action-size)/1.5 var(--sans);border-radius:32px 24px 32px 24px}
.hd-cta::after{content:'↗';font-size:20px}
.hd-cta:hover{background:var(--ink);border-color:var(--ink)}
.hd a:focus-visible,.m-nav-toggle:focus-visible,.hero-link a:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.hero-copy{padding-top:clamp(160px,22vh,230px);padding-right:calc(var(--gutter) + 70px)}
.arrival .eyebrow,.scroll-note{letter-spacing:.18em}
.hero-link{margin-top:var(--m)}
.hero-link .p-front-mv__cta-button{min-height:60px;padding:16px 26px;background:var(--base);color:var(--ink);border-color:var(--base);font:500 17px/1.5 var(--sans);gap:var(--l);border-radius:36px 25px 36px 25px}
.hero-link .p-front-mv__cta-button span{transition:transform .2s ease}
.hero-link .p-front-mv__cta-button:hover span{transform:translateX(5px)}
.p-front-mv__vert{position:absolute;top:calc(var(--header-height) + clamp(84px,12vh,120px));right:clamp(18px,3vw,42px);z-index:3;margin:0;writing-mode:vertical-rl;font-family:var(--heading);font-weight:500;font-size:16px;letter-spacing:.36em;white-space:nowrap;color:color-mix(in srgb,var(--base) 92%,transparent);border-right:1px solid color-mix(in srgb,var(--base) 50%,transparent);padding-right:14px;height:auto}
.m-nav-toggle{min-width:72px;min-height:48px;font:500 15px var(--sans);cursor:pointer}
.m-nav{font-family:var(--sans)}
/* メニュー：開いている間もヘッダー（ロゴと「閉じる」）と下の予約バーを残し、その間に細罫線の一覧を置く */
.is-menu-open #siteHeader,.is-menu-open .c-fixed-cv{z-index:calc(var(--z-header) + 1000)}
.m-nav{padding:calc(var(--header-height) + var(--m)) var(--gutter) calc(60px + var(--l));background:var(--base)}
.m-nav__list{gap:0;margin:0;border-top:1px solid var(--line)}
.m-nav__list a{display:flex!important;align-items:center;min-height:56px;padding-block:6px;border-bottom:1px solid var(--line);color:var(--ink);font:500 17px/1.6 var(--sans);letter-spacing:.04em;text-decoration:none}
.m-nav__list a:focus-visible,.m-nav__tel:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
#m-nav .m-nav__tel{display:inline-flex;flex-direction:column;gap:2px;margin-top:var(--l);color:var(--ink);font-size:24px;text-decoration:none}
#m-nav .m-nav__tel small{display:block;margin:0;font:400 var(--fs-note)/1.6 var(--sans);letter-spacing:.02em;color:var(--muted)}
@media(max-width:1599px){.hd-tel{display:none}}
@media(min-width:1101px) and (max-width:1250px){.hd nav{display:none}.m-nav-toggle{display:block;background:transparent;border:1px solid currentColor;border-radius:24px;color:inherit}.hd-cta{margin-left:auto}}
@media(max-width:959px){
 :root{--header-height:80px}
 #siteHeader{padding:8px var(--m)}
 .hd .brand img{width:132px}
 .hd-cta{display:none}
 .hero-copy{padding:150px 70px 130px var(--m)}
 .hero-copy .display{font-size:clamp(31px,8.7vw,38px);letter-spacing:0;white-space:nowrap}
 .p-front-mv__vert{top:calc(var(--header-height) + 84px);height:auto;font-size:14px;right:20px}
 .hero-link .p-front-mv__cta-button{font-size:15px;padding:16px 20px;gap:var(--s)}
}
@media(prefers-reduced-motion:reduce){.hd nav a::after,.hero-link .p-front-mv__cta-button span{transition:none}}

@media(max-width:599px){.p-front-mv__vert{display:none}}

/* Field: one composition — illustration as anchor, stats as quiet field notes. */
.field__stage{position:relative;isolation:isolate;overflow:hidden;border-radius:var(--s)}
.field-illustration{margin:0}
.field-illustration picture{display:block}
.field-illustration img{display:block;width:100%;height:auto}
.field-illustration figcaption{position:absolute;right:var(--m);bottom:var(--m);z-index:1;max-width:220px;font:italic 13px/1.5 var(--en);color:var(--sage-dark);background:color-mix(in srgb,var(--base) 78%,transparent);padding:6px 10px;border-radius:2px}

.field-facts{position:absolute;inset:0;z-index:2;display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-template-rows:auto 1fr auto;gap:var(--m);padding:clamp(20px,4vw,48px);pointer-events:none}
.field-fact{color:var(--sage-dark)}
.field-fact__label{font:500 16px/1.7 var(--heading);letter-spacing:.08em}
.field-fact__value{font:500 40px/1.1 var(--en);margin:6px 0;font-variant-numeric:lining-nums tabular-nums;white-space:nowrap}
.field-fact__value span{font:500 16px/1.5 var(--heading)}
.field-fact__detail{font:400 12px/1.9 var(--sans)}

/* 750㎡ — the lead figure, top-left, soft paper bloom instead of a hard card. */
.field-fact--space{grid-column:1/8;grid-row:1;position:relative;padding:6px 0}
.field-fact--space::before{content:'';position:absolute;inset:-28px -36px;z-index:-1;background:radial-gradient(ellipse at 32% 34%,color-mix(in srgb,var(--base) 60%,transparent) 0%,color-mix(in srgb,var(--base) 25%,transparent) 45%,transparent 78%);filter:blur(6px);pointer-events:none}
.field-fact--space .field-fact__value{font-family:var(--heading);font-size:clamp(56px,6.5vw,104px);font-weight:500;letter-spacing:-.045em;line-height:1.05}
.field-fact--space .field-fact__value span{font-size:26px;margin-left:12px;letter-spacing:0}
.field-fact--space .field-fact__detail{display:inline-block;border-top:1px solid var(--sage-dark);padding-top:var(--s);margin-top:6px}

/* 地域No.1 — small hand-stamp mark, top-right, no fill, no crisp line. */
.field-fact--satisfaction{grid-column:10/13;grid-row:1;justify-self:end;align-self:start;width:168px;aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:16px 14px;text-align:center;position:relative;pointer-events:auto}
.field-fact--satisfaction::before{content:'';position:absolute;inset:0;z-index:-1;border-radius:48% 52% 46% 54%/53% 47% 55% 45%;transform:rotate(-8deg);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--sage-dark) 45%,transparent),0 0 22px 8px color-mix(in srgb,var(--base) 45%,transparent)}
.field-fact--satisfaction .field-fact__label{font-size:12px}
.field-fact--satisfaction .field-fact__value{font-size:34px;margin:4px 0}
.field-fact--satisfaction .field-fact__value span{font-size:12px}
.field-fact--satisfaction .field-fact__detail{font-size:9px;line-height:1.5}

/* Price — the one true card, styled as the postcard tag already used elsewhere. */
.field-fact--price{grid-column:1/6;grid-row:3;align-self:end;justify-self:start;max-width:250px;background:var(--base);padding:var(--m);border-radius:6px;box-shadow:0 3px 0 color-mix(in srgb,var(--ink) 7%,transparent);transform:rotate(-3deg);pointer-events:auto}
.field-fact--price .field-fact__label{font-size:14px}
.field-fact__value--price{font-size:38px}
.field-fact__link{display:inline-flex;align-items:center;gap:var(--s);min-height:44px;font:500 14px/1.8 var(--sans);text-decoration:none;margin-top:4px}
.field-fact__link span{display:grid;place-items:center;width:36px;height:36px;border:1px solid var(--sage-dark);border-radius:50%;transition:transform .2s ease}
.field-fact__link:hover span{transform:translateX(5px)}
.field-fact__link:focus-visible{outline:2px solid var(--accent);outline-offset:5px}

.field-facts__note{max-width:48em;margin-top:var(--m);font:400 12px/1.9 var(--sans);color:var(--muted)}

@media(min-width:960px) and (min-height:650px){
 .is-enhanced .field-illustration{visibility:hidden}
}

@media(max-width:959px){
 .field__stage{aspect-ratio:3/4}
 .field-illustration,.field-illustration picture{position:absolute;inset:0;height:100%}
 .field-illustration img{width:100%;height:100%;object-fit:cover}
 .field-facts{padding:16px;grid-template-columns:1fr 1fr;gap:var(--s)}
 .field-fact--space{grid-column:1/-1}
 .field-fact--space .field-fact__value{font-size:clamp(64px,16vw,84px)}
 .field-fact--satisfaction{grid-column:2;width:132px;padding:12px 10px}
 .field-fact--satisfaction .field-fact__value{font-size:26px}
 .field-fact--satisfaction .field-fact__detail{font-size:8px}
 .field-fact--price{grid-column:1/-1;grid-row:3;transform:rotate(-2deg);max-width:none}
 .field-illustration figcaption{display:none}
}
@media(prefers-reduced-motion:reduce){.field-fact__link span{transition:none}}


/* G サポート（2026-09-23）：文章 → 水彩 → 「前後で伴走」の3場面を手描きの点線でつなぐ旅程。カード箱は使わない。
   spot は挿絵の仮枠（ILLUSTRATION G-1〜3）。画像が届いたら <figure class="sp-spot"> に <img> を入れる */
.sp-top{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr);gap:var(--l) clamp(40px,6vw,96px);align-items:start}
.sp-top__body{padding-top:calc(var(--l) + 20px)}
.sp-top__lead{max-width:38em;text-wrap:pretty;word-break:auto-phrase}
.support-illustration{margin:clamp(40px,5vw,64px) 0 0}
.sp-journey{position:relative;isolation:isolate;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--l) clamp(32px,4vw,64px);margin-top:clamp(56px,6vw,96px);padding-top:var(--m)}
.sp-journey::before{content:none}
.sp-path{position:absolute;left:-2%;top:62px;width:104%;height:170px;z-index:-1;pointer-events:none;overflow:visible}
.sp-path path{fill:none;stroke:color-mix(in srgb,var(--sage-dark) 55%,var(--world-bg));stroke-width:2;stroke-dasharray:1 11;stroke-linecap:round;vector-effect:non-scaling-stroke}
.sp-journey .sp-item{background:transparent;padding:0;border-radius:0;display:flex;flex-direction:column;align-items:flex-start;transform:none}
.sp-journey .sp-item:nth-child(3){padding-top:64px}
.sp-journey .sp-item:nth-child(4){padding-top:8px}
.sp-spot{position:relative;width:min(100%,210px);aspect-ratio:1;margin:0 0 var(--m);display:grid;place-items:center;border-radius:48% 52% 45% 55%/55% 45% 55% 45%;background:radial-gradient(circle at 38% 32%,color-mix(in srgb,var(--base) 85%,var(--world-bg)) 0,color-mix(in srgb,var(--sand) 75%,var(--world-bg)) 58%,transparent 74%)}
.sp-journey .sp-item:nth-child(3) .sp-spot{border-radius:55% 45% 52% 48%/48% 56% 44% 52%}
.sp-journey .sp-item:nth-child(4) .sp-spot{border-radius:45% 55% 48% 52%/52% 44% 56% 48%}
.sp-spot span{font:500 10px/1.6 var(--sans);letter-spacing:.14em;color:var(--muted)}
.sp-spot picture{display:block;width:100%;height:100%}.sp-spot img{display:block;width:100%;height:100%;object-fit:contain;-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 52%,transparent 74%);mask-image:radial-gradient(circle at 50% 50%,#000 52%,transparent 74%)}
.sp-item__body{max-width:24em}
.sp-item .sv-num{display:block;margin:0 0 var(--s);font:500 12px/1.7 var(--sans);letter-spacing:.18em;color:var(--accent)}
.sp-item h3{margin:0 0 var(--s);text-wrap:balance;word-break:auto-phrase}
.sp-item p{margin:0;font-size:14px;line-height:1.95}
@media(max-width:959px){
 .sp-top{grid-template-columns:1fr;gap:var(--m)}.sp-top__body{padding-top:0}
 .support-illustration{margin-top:var(--l)}
 .sp-journey{grid-template-columns:1fr;gap:var(--l);margin-top:var(--l);padding-top:0}
 .sp-path{display:none}
 .sp-journey .sp-item{flex-direction:row;gap:var(--m);align-items:flex-start}
 .sp-journey .sp-item:nth-child(3),.sp-journey .sp-item:nth-child(4){padding-top:0}
 .sp-spot{flex:0 0 96px;width:96px;margin:0}
 .sp-spot span{font-size:8px;letter-spacing:.08em;text-align:center}
 .sp-item__body{max-width:none;min-width:0}
}

/* H 卒業生の声（2026-09-23）：封筒＋ドローンの場面絵は G の挿絵と重複するため撤去。カードは「便箋」風の紙に人物メダリオンを上辺から半分のせ、
   引用符は丸ゴシックで右上の飾りに。PC は偶数カードを少し下げ、背後に F/G と同じサンドの地面帯 */
.vc-grid{position:relative;isolation:isolate;align-items:start;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--l) clamp(32px,4vw,56px);margin-top:calc(clamp(56px,6vw,88px) + 36px)}
.vc-grid::before{content:'';position:absolute;left:-4%;right:-4%;bottom:-28px;height:46%;background:color-mix(in srgb,var(--base) 28%,var(--chapter-bg,var(--world-bg)));border-radius:50% 45% 40% 55%/60% 40% 55% 45%;z-index:-1;pointer-events:none}
.vc-card{position:relative;background:var(--base);border-radius:12px;padding:var(--m) var(--m) var(--m);box-shadow:0 3px 0 color-mix(in srgb,var(--ink) 7%,transparent);transform:none}
.vc-card:nth-child(even){margin-top:40px}
.voice-mark{position:absolute;top:10px;right:var(--m);font:700 46px/1 var(--heading);color:color-mix(in srgb,var(--accent) 55%,transparent);pointer-events:none}
.vc-person{display:flex;align-items:flex-end;gap:var(--m);margin:calc(-1 * var(--m) - 36px) 0 var(--m)}
.voices{--voice-person-size:84px}
.vc-person__art{flex:0 0 var(--voice-person-size);width:var(--voice-person-size);height:var(--voice-person-size);padding:4px;background:var(--base);border-radius:50%;box-shadow:0 2px 0 color-mix(in srgb,var(--ink) 8%,transparent);mask-image:none;-webkit-mask-image:none;mix-blend-mode:normal;overflow:hidden}
.vc-person__art img{display:block;width:100%;height:100%;object-fit:cover;border-radius:50%;mix-blend-mode:multiply}
.vc-person .vc-meta{padding-bottom:6px}
.vc-person .vc-meta strong{font:500 15px/1.6 var(--heading)}
.vc-person .vc-meta span{font-size:12px;color:var(--muted)}
.vc-body p{margin:0;font:400 15px/2.05 var(--sans);color:var(--ink)}
.vc-cta{margin-top:clamp(48px,5vw,72px)}
@media(max-width:959px){
 .vc-grid{grid-template-columns:1fr;gap:calc(var(--l) + 24px);margin-top:calc(var(--l) + 36px)}
 .vc-grid::before{bottom:-20px;height:34%}
 .vc-card:nth-child(even){margin-top:0}
 .voices{--voice-person-size:72px}
 .vc-person{gap:var(--s)}
}

/* I 料金 v3（2026-09-23）：誌面の一覧表。inspo 参照＝Function Health（推し列だけを縦の色帯で通す）／Lookback（推し列のみ塗りボタン・他は線）／
   Goodside（細罫線と小さな見出し・挿絵は枠なしで紙に置く）。カード・切り欠き・判子などの飾りは使わず、書体の階層と余白で読ませる */
.pr-intro{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(32px,4vw,64px);align-items:center}
.pr-intro .course-illustration{float:none;width:100%;max-width:none;margin:0;border-radius:0;-webkit-mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 62%,transparent 100%);mask-image:radial-gradient(ellipse 50% 50% at 50% 50%,#000 62%,transparent 100%)}
.pr-intro .pr-legend{max-width:52em}
/* 挿絵の枠（仮枠は破線の円＋ID。納品後は <picture> を入れ、紙の地へ溶かす） */
.pr-art{position:relative;display:grid;place-items:center;width:112px;aspect-ratio:1;margin:0;border-radius:50%;border:1px dashed color-mix(in srgb,var(--ink) 22%,transparent)}
.pr-art>span{font:500 9px/1.5 var(--sans);letter-spacing:.14em;color:var(--muted);text-align:center}
.pr-art:has(picture){border:0}
.pr-art picture,.pr-art img{display:block;width:100%;height:100%}
/* 紙の地色（#f7f5f1 付近）を乗算で消し、セージの帯の上でも縁が白く浮かないようにする */
.pr-art img{mix-blend-mode:multiply}
/* 挿絵は紙の上に丸い風景を描いた正方形。丸い風景（直径 約85%）は残し、四隅の紙だけを地へ溶かす */
.pr-art img{object-fit:contain;-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 58%,transparent 70%);mask-image:radial-gradient(circle at 50% 50%,#000 58%,transparent 70%)}
.pr-compare{margin-top:clamp(56px,6vw,88px)}
.pr-compare__meta{display:flex;flex-wrap:wrap;gap:4px 18px;margin:0 0 var(--s);font:400 12px/1.7 var(--sans);color:var(--muted)}
.pr-compare__meta span:first-child{font-weight:500;letter-spacing:.18em;color:var(--accent)}
.pr-table{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed}
.pr-table__corner{width:30%;padding-left:0!important}
.pr-table__corner .pr-compare__meta{flex-direction:column;margin:0}
.pr-table th,.pr-table td{padding:16px clamp(16px,2vw,28px);text-align:left;vertical-align:middle;border-top:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}
.pr-table thead th,.pr-table thead td{border-top:0;vertical-align:top;padding-top:40px;padding-bottom:28px;font-weight:400}.pr-table thead td{vertical-align:bottom}
.pr-table tbody th{padding-left:0;font:500 14px/1.7 var(--heading);color:var(--ink)}
.pr-table tbody th small{display:block;font:400 12px/1.6 var(--sans);color:var(--muted)}
/* 推し列（二等）：上端の見出しから CTA までを一本の色帯で通す */
.pr-table .is-feature{background:var(--world-bg)}
.pr-table thead .is-feature{border-radius:20px 20px 0 0}
.pr-table .pr-r--cta .is-feature{border-radius:0 0 20px 20px}
.pr-head .pr-art{width:136px;margin-bottom:20px}
.pr-head .pr-rank{display:block;font:500 12px/1.7 var(--sans);letter-spacing:.18em;color:var(--accent)}
.continuation .pr-head h3{margin:2px 0 8px;word-break:keep-all}
.pr-head .desc{margin:0;max-width:26em;font:400 13px/1.9 var(--sans);color:var(--muted);word-break:auto-phrase;text-wrap:pretty}
.pr-yen{font-family:var(--en);font-weight:400;color:var(--ink);letter-spacing:.01em;white-space:nowrap;font-variant-numeric:lining-nums tabular-nums}
.pr-yen--l{font-size:clamp(26px,2.3vw,32px);line-height:1.2}
.pr-table .pr-r--base>*{padding-block:24px 20px}
.pr-check{display:inline-flex;align-items:center;gap:10px;font:400 13px/1.6 var(--sans);color:var(--muted)}
.pr-check::before{content:'';width:5px;height:10px;margin:-3px 3px 0;border:solid var(--sage-dark);border-width:0 1.5px 1.5px 0;transform:rotate(40deg)}
.pr-table .pr-r--group>*{border-top:0;padding-top:44px;padding-bottom:12px;vertical-align:bottom}
.pr-table .pr-r--group th{font:500 17px/1.6 var(--heading);letter-spacing:.02em;word-break:keep-all}
.pr-table .pr-r--group th small{margin-top:4px}
.pr-pair{display:flex;flex-wrap:wrap;gap:6px clamp(20px,2.4vw,40px)}
.pr-pair>span{display:flex;flex-direction:column;min-width:5.2em;font:400 22px/1.2 var(--en);color:var(--ink);white-space:nowrap;font-variant-numeric:lining-nums tabular-nums}
.pr-pair small{font:400 11px/1.5 var(--sans);letter-spacing:.06em;color:var(--muted)}
.pr-table .pr-r--cta>*{border-top:0;padding-top:28px;padding-bottom:32px}
.continuation .pr-table .btn-cv{width:100%;margin:0;padding-inline:14px;white-space:nowrap}
.continuation .pr-btn--ghost{background:transparent;color:var(--ink)}
/* 相談ボタン（比較表の2つ＋更新講習）のホバー：セージの面が左から満ち、矢印が少し先へ進む。キーボード操作（focus-visible）でも同じ */
.continuation .pr-btn{position:relative;isolation:isolate;overflow:hidden;transition:color .35s ease,border-color .35s ease}
.continuation .pr-btn::after{content:'';position:absolute;inset:0;z-index:-1;background:var(--sage-dark);transform:scaleX(0);transform-origin:left center;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.pr-btn__arrow{display:inline-block;margin-left:.4em;transition:transform .4s cubic-bezier(.2,.7,.2,1)}
.continuation .pr-btn:focus-visible{color:var(--base);border-color:var(--sage-dark)}
.continuation .pr-btn:focus-visible::after{transform:scaleX(1)}
.continuation .pr-btn:focus-visible .pr-btn__arrow{transform:translateX(5px)}
@media(hover:hover){
 .continuation .pr-btn:hover{color:var(--base);border-color:var(--sage-dark)}
 .continuation .pr-btn:hover::after{transform:scaleX(1)}
 .continuation .pr-btn:hover .pr-btn__arrow{transform:translateX(5px)}
}
/* その他の料金・割引制度・注意事項（2026-09-24）：四角い枠をやめ、見出しの上下の細罫線だけで区切る。開くと左＝補講・追加料金、
   右＝割引制度＋経験者の定義。項目名は左、金額は右（講習料金と同じ Noto Sans JP のタブラー数字）。summary は GTM faq_open の計測対象＝要素は維持 */
.continuation .pr-more{margin-top:clamp(64px,7vw,104px);border:0;border-top:1px solid color-mix(in srgb,var(--ink) 16%,transparent);border-bottom:1px solid color-mix(in srgb,var(--ink) 16%,transparent);border-radius:0;background:none}
.continuation .pr-more summary{position:relative;display:flex;align-items:center;justify-content:space-between;gap:var(--m);padding:22px 12px;list-style:none;cursor:pointer;font:500 16px/1.6 var(--heading);letter-spacing:.04em;color:var(--ink);transition:background-color .3s ease}
.continuation .pr-more summary::after,.continuation .pr-more[open] summary::after{content:none;display:none}
.pr-more__title{word-break:keep-all;text-wrap:balance}
.pr-more__icon{position:relative;flex:none;width:32px;height:32px;border-radius:50%;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--sage-dark) 45%,transparent);transition:background-color .3s ease}
.pr-more__icon::before,.pr-more__icon::after{content:'';position:absolute;top:50%;left:50%;width:12px;height:1.5px;margin:-.75px 0 0 -6px;background:var(--sage-dark);transition:transform .35s cubic-bezier(.2,.7,.2,1)}
.pr-more__icon::after{transform:rotate(90deg)}
.pr-more[open] .pr-more__icon::after{transform:rotate(0deg)}
.continuation .pr-more summary:focus-visible{outline:2px solid var(--sage-dark);outline-offset:2px}
@media(hover:hover){
 .continuation .pr-more summary:hover{background:color-mix(in srgb,var(--world-bg) 55%,transparent)}
 .continuation .pr-more summary:hover .pr-more__icon{background:var(--base)}
}
.continuation .pr-more-body{padding:8px 12px 32px;color:var(--ink)}
.pr-more[open] .pr-more-body{animation:pr-more-in .45s cubic-bezier(.2,.7,.2,1)}
@keyframes pr-more-in{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
.pr-more__cols{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start}
.pr-more__side{display:grid;gap:clamp(32px,3.6vw,48px)}
.continuation .pr-more__group h4{display:flex;align-items:baseline;gap:10px;margin:0 0 8px;font:500 12px/1.7 var(--sans);letter-spacing:.18em;color:var(--accent)}
.pr-more__group h4 small{font-size:12px;font-weight:400;letter-spacing:.04em;color:var(--muted)}
.pr-more__list,.pr-more__defs{margin:0;padding:0;list-style:none}
.pr-more__list li{display:flex;align-items:baseline;justify-content:space-between;gap:var(--m);padding:14px 0;border-top:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}
.pr-more__list li:first-child{border-top:0}
.pr-more__item{display:flex;flex-direction:column;gap:2px;min-width:0;font:500 14px/1.6 var(--heading);color:var(--ink)}
.pr-more__item small{font:400 12px/1.7 var(--sans);color:var(--muted)}
.pr-more__price,.pr-more__rate{flex:none;display:inline-flex;align-items:baseline;gap:4px;font:400 22px/1.2 var(--en);color:var(--ink);white-space:nowrap;font-variant-numeric:lining-nums tabular-nums}
.pr-more__price small,.pr-more__rate small{font:400 11px/1.5 var(--sans);letter-spacing:.04em;color:var(--muted)}
.pr-more__rate{font-size:30px;color:var(--sage-dark)}
.pr-more__defs li{position:relative;padding:8px 0 8px 18px;font:400 13px/1.8 var(--sans);color:var(--ink)}
.pr-more__defs li::before{content:'';position:absolute;left:2px;top:1.05em;width:6px;height:6px;border-radius:50%;background:var(--sage-dark)}
.continuation .pr-more .pr-note{margin:clamp(28px,3vw,40px) 0 0;padding-top:16px;border-top:1px solid color-mix(in srgb,var(--ink) 12%,transparent);font:400 12px/1.9 var(--sans);color:var(--muted)}
@media(max-width:959px){
 .continuation .pr-more summary{padding:18px 4px;font-size:15px}
 .continuation .pr-more-body{padding:4px 4px 24px}
 .pr-more__cols{grid-template-columns:1fr;gap:var(--l)}
 .pr-more__price{font-size:19px}
 .pr-more__rate{font-size:24px}
 .pr-more__list li{gap:14px}
}
@media(prefers-reduced-motion:reduce){
 .continuation .pr-btn,.continuation .pr-more summary,.pr-more__icon,.pr-more__icon::before,.pr-more__icon::after,.continuation .pr-btn::after,.pr-btn__arrow{transition:none}
 .pr-more[open] .pr-more-body{animation:none}
}
/* 限定変更のみ：細罫線の下に3項目。挿絵は枠なしで項目の頭に置く */
.pr-limits{margin-top:clamp(72px,8vw,120px)}
.pr-limits__head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 22px;padding-bottom:var(--m);border-bottom:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}
.continuation .pr-limits__head h3{margin:0}
.pr-limits__head p{margin:0;font:400 12px/1.8 var(--sans);color:var(--muted)}
.pr-limits__list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3.4vw,64px);margin:var(--l) 0 0;padding:0;list-style:none}
.pr-limits__list li{display:flex;flex-direction:column}
.pr-art--sm{width:148px;margin-bottom:var(--m)}
.pr-limits__name{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;margin:0;font:500 19px/1.6 var(--heading);color:var(--ink)}
.pr-limits__name small{font:400 12px/1.6 var(--sans);color:var(--muted)}
.pr-limits__hint{margin:6px 0 0;font:400 13px/1.9 var(--sans);color:var(--muted);word-break:auto-phrase;text-wrap:pretty}
.pr-limits__price{margin:auto 0 0;padding-top:20px;font:400 32px/1.1 var(--en);color:var(--ink);font-variant-numeric:lining-nums tabular-nums}
/* 更新講習：挿絵 I-R を右上に置く。紙の縁は他の紙と揃える */
/* 更新講習 v3（2026-09-24）：カードの枠をやめ、見出し群の下に細罫線を1本引く（「限定変更のみ」と同じ区切り）。
   料金＝比較表と同じ細罫線の表（卒業生の行だけセージの帯）／時期＝満了日から逆算した1本の時間軸に講習・申請の期間を帯の長さで並べる／
   流れ＝アイコンを使わず、番号・手順名・補足を1本の線でつなぐ */
.price .pr-renewal{position:relative;display:block;margin-top:clamp(72px,8vw,120px);padding:0;background:none;border:0;border-radius:0;box-shadow:none}
.price .pr-renewal__head{display:grid;gap:8px;max-width:46em}
.continuation .pr-renewal h3{margin:0}
.rn-label{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;margin:0 0 var(--m);font:500 12px/1.7 var(--sans);letter-spacing:.18em;color:var(--accent)}
.rn-label span{font-weight:400;letter-spacing:.04em;color:var(--muted)}
.rn-table{width:100%;border-collapse:separate;border-spacing:0}
.rn-table th,.rn-table td{padding:14px 12px;border-top:1px solid color-mix(in srgb,var(--ink) 12%,transparent);text-align:right}
.rn-table thead th,.rn-table thead td{border-top:0;padding-top:0;padding-bottom:10px;font:500 14px/1.6 var(--heading);color:var(--ink)}
.rn-table tbody tr:first-child>*{border-top:0}
.rn-table tbody th{text-align:left;font:500 14px/1.6 var(--heading);color:var(--ink)}
.rn-table tbody td{font:400 clamp(24px,2.1vw,30px)/1.2 var(--en);color:var(--ink);white-space:nowrap;font-variant-numeric:lining-nums tabular-nums}
.rn-table .is-alumni>*{background:var(--world-bg)}
.rn-table .is-alumni>:first-child{border-radius:12px 0 0 12px}
.rn-table .is-alumni>:last-child{border-radius:0 12px 12px 0}
.rn-note{margin:14px 0 0;font:400 12px/1.8 var(--sans);color:var(--muted)}
.rn-note b{margin-right:12px;font:500 13px/1.6 var(--heading);color:var(--ink)}
.rn-note--alumni{color:var(--sage-dark);font-weight:500}
.rn-path__num{display:block;font:500 12px/1.7 var(--sans);letter-spacing:.1em;color:var(--accent)}
.continuation .pr-renewal__cta{display:inline-flex;margin-top:clamp(40px,4vw,56px);padding-inline:28px}
.price .pr-renewal__head p{text-wrap:pretty;word-break:auto-phrase}
/* 更新講習「逆算の暦」（2026-10-08 オーナー決定・比較は output/renewal-20261008/）：時期と流れを1本にまとめ、満了日から逆算した節目 9・6・満了日 を点線の道でつなぐ。
   挿絵（季節がめぐる川沿いの並木道）を道の起点に置き、料金の表は最後に相談ボタンと並べる */
#top .pr-renewal{--rn-num:clamp(64px,6.2vw,92px);--rn-dot:color-mix(in srgb,var(--sage-dark) 55%,var(--paper-ground));--rn-ground:var(--paper-ground)}

/* 道：挿絵の中心から満了日まで、点の並ぶ1本の線 */
#top .rn-cal{margin-top:clamp(48px,5vw,72px)}
#top .rn-road{position:relative;display:grid;grid-template-columns:clamp(150px,14vw,200px) minmax(0,1fr);column-gap:clamp(24px,3vw,48px);margin-top:var(--l);padding-top:calc(clamp(150px,14vw,200px) / 2 - var(--rn-num) / 2)}
#top .rn-road::before{content:'';position:absolute;top:calc(clamp(150px,14vw,200px) / 2);left:calc(clamp(150px,14vw,200px) / 2);right:0;height:4px;margin-top:-2px;background:radial-gradient(circle,var(--rn-dot) 1.4px,transparent 1.9px) 0 50%/12px 4px repeat-x;pointer-events:none}
#top .rn-art{position:relative;z-index:1;align-self:start;margin:calc(var(--rn-num) / 2 - clamp(150px,14vw,200px) / 2) 0 0;padding:0;border:0;width:100%;aspect-ratio:1}
#top .rn-art picture,#top .rn-art img{display:block;width:100%;height:auto;border-radius:50%}

#top .rn-marks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,48px);margin:0;padding:0;list-style:none}
#top .rn-mark{position:relative;min-width:0}
#top .rn-when{position:relative;z-index:1;display:flex;width:fit-content;align-items:baseline;gap:6px;height:var(--rn-num);margin:0;padding-right:14px;background:var(--rn-ground)}
#top .rn-num{font:700 var(--rn-num)/1 var(--heading);letter-spacing:-.02em;color:var(--ink);font-variant-numeric:lining-nums}
#top .rn-unit{font:500 16px/1 var(--heading);color:var(--ink);letter-spacing:.04em}
#top .rn-end{align-self:center;font:700 clamp(24px,2.2vw,30px)/1 var(--heading);letter-spacing:.04em;color:var(--ink)}
#top .rn-mark--end .rn-when{width:auto;padding-left:14px;margin-left:-14px;margin-right:-2px}
#top .rn-lead{margin:18px 0 0;padding-top:14px;border-top:1px solid color-mix(in srgb,var(--ink) 30%,transparent);font:500 var(--fs-body)/1.7 var(--heading);color:var(--ink)}

#top .rn-tasks{display:grid;gap:14px;margin:18px 0 0;padding:0;list-style:none}
#top .rn-tasks li{display:grid;grid-template-columns:2.2em minmax(0,1fr);column-gap:6px}
#top .rn-tasks .rn-path__num{grid-row:span 2;padding-top:3px}
#top .rn-tasks h4{margin:0;font:500 16px/1.6 var(--heading);letter-spacing:.02em;color:var(--ink)}
#top .rn-tasks p{margin:2px 0 0;font:400 var(--fs-note)/1.8 var(--sans);color:var(--muted);word-break:auto-phrase;text-wrap:pretty}
#top .rn-fine{margin:16px 0 0;font:400 var(--fs-note)/1.8 var(--sans);color:var(--muted)}
#top .rn-fine b{margin-right:10px;font:500 var(--fs-note)/1.6 var(--heading);color:var(--ink)}
#top .pr-renewal .rn-mark--end .pr-renewal__notice{margin:18px 0 0;color:var(--muted)}

/* 料金：今の表のまま。右に「2,200円お得」と相談ボタン */
#top .rn-price{display:grid;grid-template-columns:minmax(0,520px) minmax(0,1fr);gap:clamp(32px,5vw,88px);align-items:end;margin-top:clamp(56px,6vw,88px);padding-top:var(--l);border-top:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}
#top .rn-price__side .rn-note{margin:0 0 20px}
#top .pr-renewal .pr-renewal__cta{margin-top:0}

@media(max-width:959px){
  #top .pr-renewal{--rn-num:56px}
  #top .rn-road{display:block;padding-top:0}
  #top .rn-road::before{top:96px;bottom:0;left:calc(var(--rn-num) / 2);right:auto;width:4px;height:auto;margin:0 0 0 -2px;background:radial-gradient(circle,var(--rn-dot) 1.4px,transparent 1.9px) 50% 0/4px 12px repeat-y}
  #top .rn-art{width:96px;margin:0 0 var(--m) calc(var(--rn-num) / 2 + 2px - 48px)}
  #top .rn-marks{grid-template-columns:1fr;gap:var(--l)}
  #top .rn-mark{display:grid;grid-template-columns:calc(var(--rn-num) + 4px) minmax(0,1fr);column-gap:14px}
  #top .rn-when{grid-row:span 4;flex-direction:column;align-items:center;gap:2px;height:auto;padding:0 0 8px}
  #top .rn-unit{font-size:12px;writing-mode:horizontal-tb}
  #top .rn-end{font-size:18px;writing-mode:vertical-rl;letter-spacing:.2em;padding:4px 0}
  #top .rn-mark--end .rn-when{margin:0;padding:0 0 8px}
  #top .rn-lead{margin:6px 0 0}
  #top .rn-price{grid-template-columns:1fr;gap:var(--m)}
}
@media(max-width:959px){
 .pr-intro{grid-template-columns:1fr;gap:var(--l)}
 .pr-intro .course-illustration{max-width:480px;margin-inline:auto}
 /* SP：行見出しを1行目に、一等｜二等の値を2列で下に。推し列は帯の代わりに各セルを淡く塗る */
 .pr-table,.pr-table thead,.pr-table tbody{display:block}
 .pr-table tr{display:grid;grid-template-columns:1fr 1fr;column-gap:8px}
 .pr-table th,.pr-table td{padding:10px 12px}
 .pr-table__corner{grid-column:1/-1;width:auto;padding:0 0 10px!important}
 .pr-table__corner .pr-compare__meta{flex-direction:row}
 .pr-table thead th{padding:44px 14px 18px;border-radius:16px;vertical-align:top}
 .pr-head .desc{word-break:normal}
 .pr-art>span{display:none}
 .pr-head .pr-art{width:72px;margin-bottom:12px}
 .continuation .pr-head h3{font-size:17px;letter-spacing:0}
 .pr-head .desc{font-size:12px;line-height:1.8}
 .pr-table tbody th{grid-column:1/-1;padding:14px 0 4px;border-top:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}
 .pr-table tbody td{border-top:0;border-radius:10px}
 .pr-table .pr-r--base>*,.pr-table .pr-r--base2>*{padding-block:8px}
 .pr-table .pr-r--base th,.pr-table .pr-r--base2 th{padding-top:14px}
 .pr-yen--l{font-size:22px}
 .pr-table .pr-r--group{display:block}
 .pr-table .pr-r--group td{display:none}
 .pr-table .pr-r--group th{padding:32px 0 4px;border-top:0;font-size:18px}
 .pr-table .pr-r--incl{grid-template-columns:1fr auto auto;column-gap:0;align-items:center;border-top:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}
 .pr-table .pr-r--incl th{grid-column:1;padding:12px 0;border-top:0;font:400 13px/1.7 var(--sans)}
 .pr-table .pr-r--incl td{border-top:0;border-radius:0;padding:12px 10px;align-self:stretch;display:flex;align-items:center}
 .pr-table .pr-r--incl .is-feature{background:none}
 .pr-check{font-size:0;gap:0}
 .pr-check::before{margin:0 6px}
 .pr-pair{flex-direction:column;gap:6px}
 .pr-pair>span{flex-direction:row;align-items:baseline;justify-content:space-between;gap:8px;font-size:18px}
 .pr-table .pr-r--cta{margin-top:12px}
 .pr-table .pr-r--cta>*{padding:8px 0;background:none}
 .pr-table .pr-r--cta td:first-child{display:none}
 .pr-table .pr-r--cta{grid-template-columns:1fr}
 .continuation .pr-table .btn-cv{font-size:12px}
 .pr-table .pr-r--cta td:nth-child(2) .btn-cv::before{content:'一等｜'}
 .pr-table .pr-r--cta td:nth-child(3) .btn-cv::before{content:'二等｜'}
 .pr-limits__list{grid-template-columns:1fr;gap:0;margin-top:0}
 .pr-limits__list li{display:grid;grid-template-columns:76px 1fr auto;column-gap:14px;align-items:center;padding:18px 0;border-bottom:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}
 .pr-art--sm{grid-row:1/3;width:76px;margin:0}
 .pr-limits__name{grid-column:2;flex-direction:column;gap:0;font-size:17px}
 .pr-limits__hint{grid-column:2/4;font-size:12px}
 .pr-limits__price{grid-column:3;grid-row:1;margin:0;padding:0;font-size:24px}
 .rn-table tbody td{font-size:22px}
 .continuation .pr-renewal__cta{display:flex;width:100%;justify-content:center}
}

/* お知らせ（2026-09-24）：小さなサムネイル（note の見出し画像・1.91:1）＋日付＋タイトル（2行まで）＋外部リンクの矢印を、料金と同じ細罫線で区切った一覧に。
   読み込み前は同じ高さの仮の3行（.news-skeleton）で場所を取り、差し込み時に下のセクションが動かないようにする */
/* _restored-features の `.news{padding:… 0}` が左右の余白を消していた（SP で一覧が画面の端に付く）ため、他セクションと同じ余白に戻す */
.continuation>.news{padding-inline:var(--gutter)}
/* 見出しのテキストは変えず、折り返し位置だけ整える（SP で「せ」が1文字だけ次の行に落ちないように） */
.news .n-head h2{word-break:auto-phrase;text-wrap:balance}
.news .news-list{margin-top:clamp(32px,4vw,48px);padding:0;list-style:none;border-top:1px solid color-mix(in srgb,var(--ink) 16%,transparent)}
.news .news-list>li{border-bottom:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}
.news .news-item{display:grid;grid-template-columns:160px minmax(0,1fr) 32px;align-items:center;gap:clamp(16px,2.4vw,32px);padding:20px 4px;border:0;color:var(--ink);text-decoration:none}
.news .news-item.no-thumb{grid-template-columns:minmax(0,1fr) 32px}
.news-thumb{display:block;aspect-ratio:1.91;overflow:hidden;border-radius:8px;background:color-mix(in srgb,var(--base) 60%,var(--world-bg));box-shadow:0 0 0 1px color-mix(in srgb,var(--ink) 8%,transparent),0 3px 0 color-mix(in srgb,var(--ink) 6%,transparent)}
.news-thumb img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.news-body{display:flex;flex-direction:column;gap:4px;min-width:0}
.news .news-body time{font:500 12px/1.6 var(--sans);letter-spacing:.08em;color:var(--muted);font-variant-numeric:tabular-nums}
.news-title{display:-webkit-box;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;font:500 16px/1.7 var(--heading);letter-spacing:.02em;color:var(--ink);word-break:auto-phrase;text-underline-offset:4px;text-decoration-thickness:1px}
.news-arrow{justify-self:end;display:grid;place-items:center;width:32px;height:32px;border-radius:50%;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--sage-dark) 45%,transparent);font:400 14px/1 var(--sans);color:var(--sage-dark);transition:transform .4s cubic-bezier(.2,.7,.2,1),background-color .3s ease,color .3s ease}
.news .news-item:focus-visible{outline:2px solid var(--sage-dark);outline-offset:2px;border-radius:6px}
@media(hover:hover){
 .news .news-item:hover .news-thumb img{transform:scale(1.05)}
 .news .news-item:hover .news-title{text-decoration-line:underline}
 .news .news-item:hover .news-arrow{background:var(--sage-dark);color:var(--base);transform:translate(2px,-2px)}
}
.news-skeleton{display:grid;grid-template-columns:160px minmax(0,1fr) 32px;align-items:center;gap:clamp(16px,2.4vw,32px);padding:20px 4px}
.news-skeleton span{display:block;border-radius:8px;background:color-mix(in srgb,var(--ink) 6%,transparent);animation:news-pulse 1.4s ease-in-out infinite}
/* JS が動かない環境では差し込まれないので、仮の行は出さず <noscript> の一文だけにする（10-10） */
.no-js .news-skeleton{display:none}
.news-skeleton span:first-child{aspect-ratio:1.91}
.news-skeleton span:last-child{grid-column:2/4;width:60%;height:16px}
@keyframes news-pulse{50%{opacity:.55}}
.news .news-fallback{padding:24px 4px;list-style:none;font:400 14px/1.8 var(--sans);color:var(--muted)}
.news .news-fallback a{display:inline;padding:0;border:0;color:var(--sage-dark);font-weight:500;text-decoration:underline;text-underline-offset:3px}
@media(max-width:959px){
 .news .news-item,.news-skeleton{grid-template-columns:104px minmax(0,1fr) 28px;gap:14px;padding:16px 0}
 .news .news-item.no-thumb{grid-template-columns:minmax(0,1fr) 28px}
 .news-title{font-size:14px;line-height:1.65}
 .news-arrow{width:28px;height:28px;font-size:12px}
 .news-skeleton span:last-child{width:80%}
}
@media(prefers-reduced-motion:reduce){
 .news-thumb img,.news-arrow{transition:none}
 .news-skeleton span{animation:none}
}

/* J アクセス（2026-09-24）：路線図の形の「道のり」。4本の道（左）が縦の幹線で1点に合流し、右のスクール（J-2 の挿絵）へ着く。
   駅からは実線（セージ）、高速道路の出口からは破線（ブロンズ）＝出発地の種類で分ける（南海 貝塚駅は車移動だが駅発なので実線）。地理の正確さは Google マップが受け持つ */
.ac-route{margin:clamp(40px,5vw,64px) 0 0;padding:0}
.ac-route__label{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px;margin:0 0 var(--m);font:500 12px/1.7 var(--sans);letter-spacing:.18em;color:var(--accent)}
.ac-route__label span{font-weight:400;letter-spacing:.04em;color:var(--muted)}
.ac-route__map{--join:44px;display:grid;grid-template-columns:minmax(0,1fr) minmax(220px,.42fr);align-items:center;gap:0 var(--join)}
.ac-route__lines{position:relative;margin:0;padding:0;list-style:none}
/* 合流する縦の幹線（最初の道と最後の道の高さの間）＋スクールへ向かう短い線 */
.ac-route__lines::before{content:'';position:absolute;top:calc(var(--first) / 2);bottom:calc(var(--row) / 2);right:0;border-right:2px solid color-mix(in srgb,var(--sage-dark) 55%,transparent)}
.ac-route__lines::after{content:'';position:absolute;top:50%;right:calc(-1 * var(--join));width:var(--join);border-top:2px solid color-mix(in srgb,var(--sage-dark) 55%,transparent)}
/* 1本目（東貝塚駅）だけ挿絵 J-1 を置くため行を高くする（--first） */
.ac-route__lines{--row:76px;--first:112px}
.ac-line:first-child{height:var(--first)}
.ac-line{position:relative;display:grid;grid-template-columns:96px minmax(9em,auto) minmax(80px,1fr);align-items:center;gap:0 16px;height:var(--row)}
.ac-line__dot{justify-self:center;width:12px;height:12px;border-radius:50%;background:var(--base);box-shadow:inset 0 0 0 2px var(--sage-dark)}
.ac-line--road .ac-line__dot{box-shadow:inset 0 0 0 2px var(--accent)}
.ac-line__from{display:flex;flex-direction:column;font:500 16px/1.35 var(--heading);color:var(--ink);white-space:nowrap}
.ac-line__from small{font:400 11px/1.5 var(--sans);letter-spacing:.06em;color:var(--muted)}
.ac-line__track{position:relative;display:grid;place-items:center;height:100%}
.ac-line__track::before{content:'';position:absolute;left:0;right:0;top:50%;border-top:2px solid color-mix(in srgb,var(--sage-dark) 55%,transparent);transform-origin:left center}
.ac-line--road .ac-line__track::before{border-top:2px dashed color-mix(in srgb,var(--accent) 70%,transparent)}
.ac-line__time{position:relative;padding:4px 14px;border-radius:999px;background:var(--world-bg);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink) 12%,transparent);font:500 13px/1.5 var(--heading);color:var(--ink);white-space:nowrap}
.ac-route__goal{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.ac-route__goal strong{font:500 var(--head-small)/1.5 var(--heading);color:var(--ink)}
.ac-route__goal>span:last-child{font:400 13px/1.7 var(--sans);color:var(--muted)}
/* 挿絵の枠（仮枠は破線の円＋ID）。J-1 は東貝塚駅の点の代わりに小さく、J-2 はスクールに大きく */
.ac-spot{position:relative;display:grid;place-items:center;width:156px;aspect-ratio:1;margin:0 0 12px;border-radius:50%;border:1px dashed color-mix(in srgb,var(--ink) 22%,transparent);background:var(--world-bg)}
.ac-spot>span{font:500 9px/1.5 var(--sans);letter-spacing:.14em;color:var(--muted);text-align:center}
.ac-spot--sm{justify-self:center;width:96px;margin:0}
.ac-spot:has(picture){border:0;background:none}
.ac-spot picture,.ac-spot img{display:block;width:100%;height:100%}
.ac-spot img{object-fit:contain;mix-blend-mode:multiply;-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 58%,transparent 70%);mask-image:radial-gradient(circle at 50% 50%,#000 58%,transparent 70%)}
.ac-route__foot{display:flex;flex-wrap:wrap;justify-content:space-between;gap:10px 24px;margin-top:var(--m);padding-top:14px;border-top:1px solid color-mix(in srgb,var(--ink) 12%,transparent);font:400 12px/1.8 var(--sans);color:var(--muted)}
.ac-route__legend{display:inline-flex;flex-wrap:wrap;align-items:center;gap:6px 10px}
.ac-route__legend i{display:inline-block;width:28px;margin-left:8px}
.ac-route__legend i:first-child{margin-left:0}
.ac-route__legend .is-rail{border-top:2px solid color-mix(in srgb,var(--sage-dark) 55%,transparent)}
.ac-route__legend .is-road{border-top:2px dashed color-mix(in srgb,var(--accent) 70%,transparent)}
.ac-route__pickup{font:500 13px/1.8 var(--heading);color:var(--sage-dark)}
.ac-route__pickup::before{content:'';display:inline-block;width:8px;height:8px;margin-right:8px;border-radius:50%;background:var(--sage-dark);vertical-align:.1em}
/* 詳細：英字ラベルをやめ、料金と同じ細罫線の一覧に */
.access .ac-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,80px);align-items:start;margin-top:clamp(48px,5vw,72px)}
.access .ac-dl{display:block;margin:0}
.access .ac-dl>div{display:grid;grid-template-columns:5em minmax(0,1fr);gap:var(--m);padding:14px 0;border-top:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}
.access .ac-dl>div:first-child{border-top:0;padding-top:0}
.access .ac-dl dt{font:500 13px/1.8 var(--heading);font-style:normal;color:var(--ink)}
.access .ac-dl dd{margin:0;font:400 14px/1.8 var(--sans);color:var(--ink);word-break:auto-phrase}
.access .ac-map{border:0;border-radius:12px;box-shadow:0 0 0 1px color-mix(in srgb,var(--ink) 10%,transparent),0 3px 0 color-mix(in srgb,var(--ink) 6%,transparent)}
@media(max-width:959px){
 /* SP：4本の道を縦に並べ、左の幹線でまとめて、下のスクールへ */
 .ac-route__map{grid-template-columns:1fr;gap:0}
 .ac-route__lines{--row:64px;--first:84px;padding-left:0}
 .ac-spot--sm{width:72px}
 .ac-route__lines::before{top:calc(var(--first) / 2 + 36px);bottom:0;left:35px;right:auto;border-right:0;border-left:2px solid color-mix(in srgb,var(--sage-dark) 55%,transparent)}
 .ac-route__lines::after{content:none}
 .ac-line{grid-template-columns:72px minmax(0,1fr) auto;gap:0 12px}
 .ac-line__track::before{content:none}
 .ac-line__from{font-size:15px}
 .ac-line__time{padding:3px 12px;font-size:12px}
 .ac-route__goal{margin-top:var(--m);padding-left:72px}
 .ac-route__goal .ac-spot{width:120px}
 /* 幹線の下端からスクールの挿絵の中心まで、角を丸めた L 字でつなぐ（挿絵 120px の中心＝60px） */
 .ac-route__goal::before{content:'';position:absolute;left:35px;top:calc(-1 * var(--m));width:37px;height:calc(var(--m) + 60px);border-left:2px solid color-mix(in srgb,var(--sage-dark) 55%,transparent);border-bottom:2px solid color-mix(in srgb,var(--sage-dark) 55%,transparent);border-bottom-left-radius:14px}
 .access .ac-grid{grid-template-columns:1fr;gap:var(--l)}
 .access .ac-dl>div{grid-template-columns:3.5em minmax(0,1fr);gap:var(--s)}
}

/* K FAQ（2026-09-24）：左＝挿絵 K とカテゴリの目次（PC は sticky・今いるカテゴリを色で示す）／右＝質問の一覧。
   Q01〜の番号と回答の「A」は CSS の生成内容（読み上げ用の代替テキストは空）＝質問・回答の文は JSON-LD と全文一致のまま。summary は GTM faq_open の計測対象 */
/* .continuation の overflow:hidden はスクロール容器になり sticky の目次が効かないため、はみ出しの切り取りだけを残す clip に替える */
.continuation{overflow:clip}
.faq .fq-layout{display:grid;grid-template-columns:minmax(200px,.34fr) minmax(0,1fr);gap:clamp(32px,5vw,88px);align-items:start;margin-top:clamp(40px,5vw,64px)}
.faq .lead{max-width:48em;margin-inline:0}
.fq-side{position:sticky;top:calc(var(--header-height,80px) + var(--m))}
.fq-art{display:grid;place-items:center;width:min(100%,200px);aspect-ratio:1;margin:0 0 var(--l);border-radius:50%;border:1px dashed color-mix(in srgb,var(--ink) 22%,transparent)}
.fq-art>span{font:500 9px/1.5 var(--sans);letter-spacing:.14em;color:var(--muted)}
.fq-art:has(picture){border:0}
.fq-art picture,.fq-art img{display:block;width:100%;height:100%}
.fq-art img{object-fit:contain;mix-blend-mode:multiply;-webkit-mask-image:radial-gradient(circle at 50% 50%,#000 58%,transparent 70%);mask-image:radial-gradient(circle at 50% 50%,#000 58%,transparent 70%)}
.continuation .fq-index{display:block}
.fq-index__label{margin:0 0 var(--s);font:500 12px/1.7 var(--sans);letter-spacing:.18em;color:var(--accent)}
.fq-index ol{margin:0;padding:0;list-style:none;border-top:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}
.fq-index li{border-bottom:1px solid color-mix(in srgb,var(--ink) 12%,transparent)}
.fq-index a{position:relative;display:flex;align-items:baseline;justify-content:space-between;gap:12px;padding:12px 4px 12px 16px;font:500 14px/1.6 var(--heading);color:var(--ink);text-decoration:none;transition:color .3s ease,background-color .3s ease}
.fq-index a span{font:400 12px/1.6 var(--sans);color:var(--muted);font-variant-numeric:tabular-nums}
.fq-index a::before{content:'';position:absolute;left:0;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:color-mix(in srgb,var(--sage-dark) 25%,transparent);transition:background-color .3s ease,transform .3s ease}
.fq-index a.is-current{color:var(--sage-dark)}
.fq-index a.is-current::before{background:var(--sage-dark);transform:scale(1.4)}
@media(hover:hover){.fq-index a:hover{background:color-mix(in srgb,var(--world-bg) 55%,transparent)}}
.faq .fq-list{counter-reset:faq-q;min-width:0}
.faq .fq-group{scroll-margin-top:calc(var(--header-height,80px) + var(--m))}
.faq .fq-group+.fq-group{margin-top:clamp(40px,4.4vw,64px)}
.continuation .faq .fq-cat{max-width:none;margin:0 0 var(--s);font:500 17px/1.6 var(--heading);letter-spacing:.03em;color:var(--ink)}
.faq .fq-group details{max-width:none;margin:0;border-bottom:1px solid color-mix(in srgb,var(--ink) 12%,transparent);counter-increment:faq-q}
.faq .fq-group details:first-of-type{border-top:1px solid color-mix(in srgb,var(--ink) 16%,transparent)}
.faq .fq-group summary{position:relative;display:grid;grid-template-columns:3.2em minmax(0,1fr) 32px;align-items:center;gap:0 12px;padding:18px 8px;list-style:none;cursor:pointer;font:500 15px/1.7 var(--heading);color:var(--ink);word-break:auto-phrase;text-wrap:pretty;transition:background-color .3s ease}
.faq .fq-group summary::-webkit-details-marker{display:none}
.faq .fq-group summary::before{content:'Q' counter(faq-q,decimal-leading-zero);content:'Q' counter(faq-q,decimal-leading-zero) / '';font:500 12px/1 var(--sans);letter-spacing:.08em;color:var(--accent)}
/* ＋／− は丸の中に2本の線（背景のグラデーション）。開くと縦線が縮んで − になる */
.faq .fq-group summary::after{content:'';grid-column:3;width:32px;height:32px;border-radius:50%;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--sage-dark) 45%,transparent);background:linear-gradient(var(--sage-dark),var(--sage-dark)) center/12px 1.5px no-repeat,linear-gradient(var(--sage-dark),var(--sage-dark)) center/1.5px 12px no-repeat;transition:background-size .35s cubic-bezier(.2,.7,.2,1),background-color .3s ease}
.faq .fq-group details[open] summary::after{background-size:12px 1.5px,1.5px 0}
.faq .fq-group summary:focus-visible{outline:2px solid var(--sage-dark);outline-offset:2px}
@media(hover:hover){
 .faq .fq-group summary:hover{background:color-mix(in srgb,var(--world-bg) 55%,transparent)}
 .faq .fq-group summary:hover::after{background-color:var(--base)}
}
.faq .fq-group .fq-a{position:relative;padding:0 calc(32px + 20px) 22px calc(3.2em + 20px);font:400 14px/2 var(--sans);color:var(--ink);word-break:auto-phrase}
.faq .fq-group .fq-a::before{content:'A';content:'A' / '';position:absolute;left:8px;top:.3em;font:500 12px/1 var(--sans);letter-spacing:.08em;color:var(--sage-dark)}
.faq .fq-group details[open] .fq-a{animation:pr-more-in .45s cubic-bezier(.2,.7,.2,1)}
.fq-more{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--m);margin-top:clamp(40px,4.4vw,64px);padding:clamp(20px,2.4vw,28px) clamp(20px,2.4vw,32px);border-radius:16px 12px 18px 10px/12px 18px 10px 16px;background:color-mix(in srgb,var(--base) 55%,transparent)}
.fq-more p{margin:0;font:500 16px/1.7 var(--heading);color:var(--ink)}
.continuation .fq-more .btn-cv{padding-inline:28px}
@media(max-width:959px){
 .faq .fq-layout{grid-template-columns:1fr;gap:var(--l)}
 .fq-side{position:static;display:flex;flex-direction:column;gap:var(--m)}
 .fq-art{width:140px;margin:0}
 .fq-index ol{display:flex;flex-wrap:wrap;gap:8px;border:0}
 .fq-index li{border:0}
 .fq-index a{padding:8px 14px;border-radius:999px;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--sage-dark) 35%,transparent);font-size:13px}
 .fq-index a::before{content:none}
 .fq-index a.is-current{background:var(--sage-dark);color:var(--base)}
 .fq-index a.is-current span{color:color-mix(in srgb,var(--base) 80%,transparent)}
 .faq .fq-group summary{grid-template-columns:2.6em minmax(0,1fr) 28px;padding:16px 2px;font-size:14px}
 .faq .fq-group summary::after{width:28px;height:28px}
 .faq .fq-group .fq-a{padding:0 4px 20px calc(2.6em + 14px);font-size:13px}
 .faq .fq-group .fq-a::before{left:2px}
 .fq-more{flex-direction:column;align-items:flex-start}
 .continuation .fq-more .btn-cv{display:flex;width:100%;justify-content:center}
}
@media(prefers-reduced-motion:reduce){
 .faq .fq-group summary,.faq .fq-group summary::after,.fq-index a,.fq-index a::before{transition:none}
 .faq .fq-group details[open] .fq-a{animation:none}
}

/* L 来校相談（2026-09-24）：深いセージの夜明け前の空に、点線の飛行経路（サポート・更新講習・アクセスと同じ点線）が
   スクールの発着マーク（同心円）へ降り立つ。経路はスクロールで引かれ、着地で円が一度広がる（PC・非 reduced-motion のみ）。
   no-JS／reduced-motion は経路・発着マークとも最初から全部見える。GTM フック（.c-cv-area / tel: / data-open-contact-modal）は維持 */
.continuation .c-cv-area{position:relative;isolation:isolate;overflow:clip;padding-top:clamp(96px,10vw,140px);padding-bottom:clamp(96px,10vw,140px);background:radial-gradient(closest-side at 50% 64%,color-mix(in srgb,var(--sage-dark) 82%,var(--accent)) 0,var(--sage-dark) 100%) center/80% 90% no-repeat,var(--sage-dark)}
.cv-landing{position:relative;display:flex;flex-direction:column;align-items:center;text-align:center}
.cv-landing .chapter{align-self:stretch;text-align:left}
/* 舞台（1000×460 の比率）。経路の SVG は全面、窓は中心 (500,310)・半径 150 の位置に重ねる＝SVG の座標と % で一致させる */
.cv-scene{position:relative;width:min(100%,1000px);aspect-ratio:1000/460;margin:clamp(8px,2vw,24px) auto clamp(28px,3vw,40px)}
.cv-sky{position:absolute;inset:0;z-index:2;width:100%;height:100%;overflow:visible}
.cv-sky__route{fill:none;stroke:color-mix(in srgb,var(--base) 55%,transparent);stroke-width:2;stroke-dasharray:1 12;stroke-linecap:round;vector-effect:non-scaling-stroke}
/* マスク用の見えない実線。既定は全部見える（dashoffset 0）＝no-JS でも経路が出る。JS が 100→0 に動かして道順どおりに引く */
.cv-sky__reveal{fill:none;stroke:#fff;stroke-width:12;stroke-linecap:round;stroke-dasharray:100 100;stroke-dashoffset:0}
.cv-sky__touch{fill:var(--base)}
/* 円い窓：生成りの細い縁＋外側に淡い輪。着地後は縁から薄い輪が静かに広がる（6秒に1回） */
.cv-window{position:absolute;left:35%;top:34.78%;width:30%;aspect-ratio:1;margin:0;border-radius:50%;overflow:hidden;clip-path:circle(50% at 50% 50%)}
/* 窓の縁は切り抜き（clip-path）の外に別要素で描く：生成りの細い縁＋淡い外輪＋落ち影 */
.cv-scene::before{content:'';position:absolute;left:35%;top:34.78%;width:30%;aspect-ratio:1;border-radius:50%;box-shadow:0 0 0 6px color-mix(in srgb,var(--base) 90%,transparent),0 0 0 16px color-mix(in srgb,var(--base) 12%,transparent),0 20px 44px color-mix(in srgb,var(--ink) 32%,transparent);pointer-events:none}
.cv-window picture,.cv-window img{display:block;width:100%;height:100%}
.cv-window img{object-fit:cover;object-position:62% 60%;transform:scale(1.14);transform-origin:62% 60%}
.cv-scene::after{content:'';position:absolute;left:35%;top:34.78%;width:30%;aspect-ratio:1;border-radius:50%;box-shadow:0 0 0 1.5px color-mix(in srgb,var(--base) 55%,transparent);opacity:0;pointer-events:none;animation:cv-ripple 6s cubic-bezier(.2,.7,.2,1) 1.4s infinite}
@keyframes cv-ripple{0%{opacity:.7;transform:scale(1.05)}60%,100%{opacity:0;transform:scale(1.55)}}
.c-cv-area .cv-landing .label{color:color-mix(in srgb,var(--base) 80%,transparent)}
.continuation .c-cv-area h2{margin:var(--s) 0 0;color:var(--base);font-size:clamp(26px,3vw,40px);line-height:1.7;letter-spacing:.04em;text-wrap:balance;word-break:auto-phrase}
/* 親が中央ぞろえの flex 列なので、行の幅を中身ではなく全幅にしてボタン2つを横に並べる */
.c-cv-area .cta-row{align-self:stretch;justify-content:center;margin:clamp(32px,3.6vw,48px) 0 var(--l);gap:14px}
.continuation .c-cv-area .cta-row .btn-cv,.continuation .c-cv-area .cta-row .btn-ghost{min-width:min(100%,300px);padding-inline:32px}
/* ボタンのホバー：比較表と同じ「面が左から満ちる・矢印が進む」を、暗い地に合わせた色で */
.continuation .c-cv-area .pr-btn::after{background:var(--world-bg)}
@media(hover:hover){.continuation .c-cv-area .pr-btn:hover{color:var(--ink);border-color:var(--world-bg)}}
.continuation .c-cv-area .pr-btn:focus-visible{color:var(--ink);border-color:var(--world-bg);outline:2px solid var(--base);outline-offset:3px}
.c-cv-area .cta-tel{display:inline-flex;flex-direction:column;align-items:center;gap:6px;padding-top:var(--m);border-top:1px solid color-mix(in srgb,var(--base) 25%,transparent);font:400 clamp(32px,3.4vw,44px)/1.1 var(--en);letter-spacing:.04em;color:var(--base);font-variant-numeric:lining-nums tabular-nums;text-decoration:none}
.c-cv-area .cta-tel small{max-width:32em;text-wrap:balance;word-break:auto-phrase;font:400 12px/1.8 var(--sans);letter-spacing:.02em;color:color-mix(in srgb,var(--base) 75%,transparent)}
@media(hover:hover){.c-cv-area .cta-tel:hover{color:var(--world-bg)}}
@media(max-width:959px){
 /* SP：経路は描かず（小さな画面で点線が窓の縁とずれるため）、窓だけを大きく中央に */
 .cv-scene{aspect-ratio:auto;margin:var(--m) auto var(--l)}
 .cv-sky,.cv-scene::after{display:none}
 .cv-scene::before{left:50%;top:0;width:min(64%,260px);transform:translateX(-50%)}
 .cv-window{position:relative;left:auto;top:auto;width:min(64%,260px);margin:0 auto}
 .continuation .c-cv-area h2{font-size:22px}
 .c-cv-area .cta-row{flex-direction:column;align-items:stretch;width:100%}
 .continuation .c-cv-area .cta-row .btn-cv,.continuation .c-cv-area .cta-row .btn-ghost{min-width:0;width:100%}
 .c-cv-area .cta-tel{font-size:30px}
}
@media(prefers-reduced-motion:reduce){.cv-scene::after{animation:none}}
/* フッターのロゴ（2026-09-24）：白抜き（filter）をやめ、ヘッダーと同じ色のロゴを生成りの小さな台紙に載せる（深いセージの地で黒文字が沈まないように） */
.l-footer .ft-brand>a{display:inline-flex;align-items:center;padding:14px 20px;margin-bottom:var(--m);border-radius:14px 10px 16px 9px/10px 16px 9px 14px;background:var(--base);box-shadow:0 3px 0 color-mix(in srgb,var(--ink) 18%,transparent)}
.l-footer .ft-brand>a img{display:block;width:150px;height:auto;margin:0}

/* お問い合わせフォーム「罫線の申込書」（2026-09-24 v2）：inspo 参照＝Cooper Hewitt（見出しの上の細罫線・飾りのない欄と矢印）／MONOLOG（小さな四角いタグ・細罫線の一覧）／
   Formafantasma（番号を静かな文字として使う）。料金表・アクセス・FAQ と同じ「項目名｜内容」を細罫線で区切る作法。カード・ピル・✓・暗いパネルは使わない。
   送信の仕組み（Web3Forms・name 属性・redirect・honeypot）と同意の必須は不変 */
.contact-modal__content.cf{display:block;width:min(820px,94vw);max-height:92vh;padding:0;border:0;border-radius:6px;overflow:hidden;background:var(--base);box-shadow:0 30px 80px color-mix(in srgb,var(--ink) 35%,transparent)}
.cf-main{position:relative;max-height:92vh;overflow:auto;overscroll-behavior:contain;padding:clamp(40px,4.4vw,60px) clamp(24px,5vw,64px) clamp(32px,3.6vw,48px)}
/* 進み具合：上端の点線（未達）の上に、実線が --progress の分だけ伸びる */
.cf-progress{position:sticky;top:calc(-1 * clamp(40px,4.4vw,60px));z-index:2;height:0;margin:calc(-1 * clamp(40px,4.4vw,60px)) calc(-1 * clamp(24px,5vw,64px)) clamp(40px,4.4vw,60px)}
.cf-progress::before,.cf-progress span{content:'';position:absolute;left:0;right:0;top:0;height:3px}
.cf-progress::before{background:repeating-linear-gradient(90deg,color-mix(in srgb,var(--sage-dark) 35%,transparent) 0 2px,transparent 2px 8px)}
.cf-progress span{background:var(--sage-dark);transform-origin:left;transform:scaleX(var(--progress,0));transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.cf .contact-modal__close{top:14px;right:14px;z-index:3;width:40px;height:40px;border:0;border-radius:50%;background:transparent;font-size:1.4rem}
@media(hover:hover){.cf .contact-modal__close:hover{background:color-mix(in srgb,var(--ink) 6%,transparent)}}
.cf .contact-modal__head{position:relative;padding-right:120px}
.cf-stamp{position:absolute;right:0;top:-6px;width:92px;aspect-ratio:1;margin:0;border-radius:50%;overflow:hidden;transform:rotate(-6deg);box-shadow:0 0 0 4px var(--base),0 0 0 5px color-mix(in srgb,var(--ink) 16%,transparent)}
.cf-stamp picture,.cf-stamp img{display:block;width:100%;height:100%}
.cf-stamp img{object-fit:cover;object-position:62% 60%;transform:scale(1.14)}
.cf .contact-modal__eyebrow{font:500 12px/1.7 var(--sans);letter-spacing:.18em;color:var(--accent)}
.cf .contact-modal__eyebrow::before,.cf .contact-modal__eyebrow::after{content:none}
.cf .contact-modal__title{margin:6px 0 10px;font:500 clamp(22px,2.4vw,30px)/1.5 var(--heading);letter-spacing:.03em}
.cf .contact-modal__lead{margin:0;max-width:34em;font:400 13px/1.9 var(--sans);color:var(--muted);word-break:auto-phrase;text-wrap:pretty}
.cf .contact-modal__form{gap:clamp(36px,4vw,48px);margin-top:clamp(32px,3.6vw,44px)}
/* 段：上に細罫線、番号は小さな数字（Formafantasma の「1 STUDIO」式） */
.cf-step{display:block;margin:0;padding:0;border:0;min-width:0}
.cf-step__title{display:flex;align-items:baseline;gap:14px;width:100%;padding:12px 0 0;border-top:1px solid var(--ink);font:500 15px/1.5 var(--heading);letter-spacing:.04em;color:var(--ink)}
.cf-step__title>span{font:400 13px/1 var(--en);letter-spacing:.06em;color:var(--accent);font-variant-numeric:lining-nums}
.cf-step__title em{margin-left:auto;font:400 11px/1.6 var(--sans);font-style:normal;letter-spacing:.06em;color:var(--muted);padding:0;background:none;border:0}
/* ご用件：小さな丸の付いた文字の一覧（2列・行ごとに細罫線） */
.cf-choices{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:clamp(24px,3vw,40px);margin-top:10px}
.cf-choice{position:relative;display:block;border-bottom:1px solid color-mix(in srgb,var(--ink) 12%,transparent);cursor:pointer}
.cf-choice input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer;padding:0;border:0}
.cf-choice span{position:relative;display:block;padding:13px 0 13px 26px;font:400 14px/1.6 var(--sans);color:var(--ink);transition:color .2s ease}
.cf-choice span::before{content:'';position:absolute;left:2px;top:50%;width:12px;height:12px;margin-top:-6px;border-radius:50%;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--ink) 45%,transparent);transition:box-shadow .2s ease}
.cf-choice input:checked+span{font-weight:500}
.cf-choice input:checked+span::before{box-shadow:inset 0 0 0 1px var(--sage-dark),inset 0 0 0 3.5px var(--base),inset 0 0 0 8px var(--sage-dark)}
.cf-choice input:focus-visible+span{outline:2px solid var(--sage-dark);outline-offset:2px}
@media(hover:hover){.cf-choice:hover span{color:var(--sage-dark)}}
.cf-choice input.is-invalid+span::before{box-shadow:inset 0 0 0 1.5px #b3261e}
/* 入力：「項目名｜入力」を1行ずつ細罫線で区切る（料金表・アクセスと同じ作法）。欄そのものには枠も下線も付けない */
.cf .contact-modal__field{display:grid;grid-template-columns:9.5em minmax(0,1fr);column-gap:24px;align-items:baseline;padding:4px 0;border-bottom:1px solid color-mix(in srgb,var(--ink) 12%,transparent);transition:border-color .25s ease}
.cf .contact-modal__field:focus-within{border-bottom-color:var(--sage-dark)}
.cf .contact-modal__field>.contact-modal__label{grid-column:1;grid-row:1/3;padding-top:13px}
.cf .contact-modal__field>:not(.contact-modal__label){grid-column:2}
.cf .contact-modal__label{display:flex;flex-direction:column;align-items:flex-start;gap:0;font:500 13px/1.6 var(--heading);color:var(--ink)}
.cf .contact-modal__required,.cf .contact-modal__optional{padding:0;border:0;background:none;font:400 11px/1.6 var(--sans);letter-spacing:.04em;color:var(--muted)}
.cf .contact-modal__required{color:var(--accent)}
.cf input[type="text"],.cf input[type="email"],.cf input[type="tel"],.cf textarea{width:100%;padding:12px 0;border:0;border-radius:0;background:transparent;font:400 16px/1.6 var(--sans);color:var(--ink);box-shadow:none}
.cf input::placeholder,.cf textarea::placeholder{color:color-mix(in srgb,var(--ink) 35%,transparent)}
.cf input:focus,.cf textarea:focus,.cf input:hover,.cf textarea:hover{border:0;box-shadow:none;outline:none}
.cf textarea{min-height:84px;resize:vertical}
.cf .contact-modal__field:has(.is-invalid){border-bottom-color:#b3261e}
.cf .is-invalid{border:0!important;box-shadow:none!important}
.cf .contact-modal__hint{padding-bottom:10px;font:400 12px/1.7 var(--sans);color:var(--muted)}
.cf .contact-modal__error{padding-bottom:8px}
.cf-step .contact-modal__field:first-of-type{margin-top:6px}
.cf-step[data-step="2"]{display:block}
/* 希望時期：小さな四角いタグ（MONOLOG の絞り込み式） */
.cf-chips{display:flex;flex-wrap:wrap;gap:6px;padding:12px 0 2px}
.cf-chip{padding:4px 12px;border:1px solid color-mix(in srgb,var(--ink) 22%,transparent);border-radius:3px;background:transparent;font:400 12px/1.6 var(--sans);color:var(--ink);cursor:pointer;transition:background-color .2s ease,color .2s ease,border-color .2s ease}
.cf-chip[aria-pressed="true"]{border-color:var(--ink);background:var(--ink);color:var(--base)}
@media(hover:hover){.cf-chip:hover{border-color:var(--ink)}}
.cf-chip:focus-visible{outline:2px solid var(--sage-dark);outline-offset:2px}
/* 同意と方針 */
.cf .contact-modal__privacy-box{display:grid;gap:12px;padding-top:12px;border-top:1px solid var(--ink)}
.cf-policy summary{display:inline-flex;align-items:center;gap:8px;padding:4px 0;cursor:pointer;list-style:none;font:400 13px/1.6 var(--sans);color:var(--ink);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px}
.cf-policy summary::-webkit-details-marker{display:none}
.cf-policy summary::after{content:'+';font:400 14px/1 var(--en);text-decoration:none}
.cf-policy[open] summary::after{content:'−'}
.cf .contact-modal__privacy-scroll{max-height:180px;margin-top:8px;padding:14px 16px;border:0;border-left:2px solid color-mix(in srgb,var(--ink) 16%,transparent);border-radius:0;background:transparent}
.cf .contact-modal__agree{gap:12px;font:500 14px/1.6 var(--heading)}
.cf .contact-modal__agree .contact-modal__required{margin-left:8px}
.cf .contact-modal__agree input[type="checkbox"]{width:18px;height:18px;accent-color:var(--sage-dark)}
/* 送信：全幅の墨色の帯、右端に矢印（Cooper Hewitt の欄と矢印を帯に）。ホバーは相談ボタンと同じ「面が満ちる」 */
.cf .contact-modal__actions{justify-content:stretch;margin-top:-12px}
.cf .contact-modal__submit{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;width:100%;min-height:60px;padding:0 24px;border:0;border-radius:2px;background:var(--ink);color:var(--base);font:500 15px/1.6 var(--heading);letter-spacing:.08em;box-shadow:none;transform:none;transition:color .35s ease}
.cf .contact-modal__submit-text{display:flex;align-items:center;justify-content:space-between;width:100%}
.cf .contact-modal__submit-text[hidden]{display:none}
.cf .contact-modal__submit-loading{margin:0 auto}
.cf .contact-modal__submit::after{content:'';position:absolute;inset:0;z-index:-1;background:var(--sage-dark);transform:scaleX(0);transform-origin:left center;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.cf .contact-modal__submit .pr-btn__arrow{font-size:18px}
@media(hover:hover){.cf .contact-modal__submit:hover{background:var(--ink);box-shadow:none;transform:none}.cf .contact-modal__submit:hover::after{transform:scaleX(1)}.cf .contact-modal__submit:hover .pr-btn__arrow{transform:translateX(6px)}}
.cf .contact-modal__submit:focus-visible{outline:2px solid var(--sage-dark);outline-offset:3px}
.cf.is-sending .cf-progress span{transform:scaleX(1)}
@media(max-width:959px){
 .contact-modal__content.cf{width:100vw;height:100dvh;max-height:100dvh;border-radius:0}
 .cf-main{max-height:100dvh;height:100%;padding:44px 20px 32px}
 .cf-progress{top:-44px;margin:-44px -20px 44px}
 .cf .contact-modal__head{padding-right:0}
 .cf .contact-modal__close{top:10px;right:10px;background:var(--base);box-shadow:0 0 0 1px color-mix(in srgb,var(--ink) 12%,transparent)}
 .cf-stamp{position:static;width:64px;margin:0 0 14px;transform:rotate(-6deg)}
 .cf-choices{grid-template-columns:1fr}
 .cf .contact-modal__field{grid-template-columns:1fr;column-gap:0;padding:8px 0 0}
 .cf .contact-modal__field>.contact-modal__label{grid-row:auto;flex-direction:row;align-items:baseline;gap:8px;padding-top:4px}
 .cf .contact-modal__field>:not(.contact-modal__label){grid-column:1}
 .cf input[type="text"],.cf input[type="email"],.cf input[type="tel"],.cf textarea{padding:6px 0 12px}
}
@media(prefers-reduced-motion:reduce){
 .cf-progress span,.cf-choice span,.cf-choice span::before,.cf-chip,.cf .contact-modal__submit,.cf .contact-modal__submit::after,.cf .contact-modal__field{transition:none}
}

/* Hero copy: set like the section heads (Noto Sans JP 900 + palt, see "Type system" at the end). Klee One was dropped on 10-07. */

/* Type scale (09-25, site-wide): floors per role — label 12 / note 13 / button & table cell 15 / body 16 / lead 17 (SP 16). Headings and the header nav are unchanged.
   Scoped with the page ids (#top = main, #contact-modal, #siteHeader, #m-nav) so the older, more specific rules are overridden; the section-head block below sets labels and leads. At the main merge, fold these values into the original rules. */
@media(max-width:959px){:root{--fs-lead:16px}}
/* label — small English, numbers, dates */
#top :is(.chapter>span,.section-meta span,.arrival .eyebrow,.scroll-note,.sv-num,.rs-num,.pr-rank,.rn-path__num,.vf-number,.p-news-ticker__badge),.l-footer a>small,#contact-modal :is(.contact-modal__required,.contact-modal__optional){font-size:var(--fs-label)}
/* note — captions, sources, footnotes, hints */
#top :is(figcaption,.vf-fine,.vc-source,.vc-source a,.vc-meta span,.news-body time,.gallery__tag,.gallery__row small,.ac-line__from small,.ac-route__legend,.ac-route__label,.ac-route__label span,.cta-tel small,.p-news-ticker__date,.pr-legend,.pr-compare__meta span,.pr-renewal__notice,.pr-limits__head p,.pr-limits__name small,.rn-label,.rn-label span,.rn-note,.rn-ticks li,.rn-span__text,.pr-more__group h4,.pr-note,.fq-index__label,.fq-index span),#top #license small,.l-footer :is(.ft-brand p,p.wrap),#contact-modal :is(.contact-modal__hint,.contact-modal__eyebrow),#siteHeader .hd-tel small,#m-nav small,#top #contact .label{font-size:var(--fs-note);line-height:1.75}
#top #gallery .gallery__row small{font-size:var(--fs-label);letter-spacing:.08em} /* English sub-labels of the gallery nav; the original rule is #gallery.gallery--nav … */
#top .pr-renewal__notice{font-size:var(--fs-note)!important} /* the original rule in _draft-full-page.css is !important */
/* button, link, table cell, short label */
#top :is(.btn-cv,.btn-ghost,.btn-outline,.pr-btn__arrow,.tlink,.map-link,.gallery__filter,.m-fold-btn,.ac-line__time,.ac-route__pickup,.ac-route__goal span,.ac-dl dt,.pr-r:not(.pr-r--group) th,.rn-table th,.pr-more__item,.fq-index a,.p-news-ticker__title),.l-footer li a,#contact-modal :is(.contact-modal__label,.cf-step__title span,.cf-policy summary,.contact-modal__agree span){font-size:var(--fs-cell)}
body .c-fixed-cv a{font-size:var(--fs-cell)}
#contact-modal .cf-chip{font-size:14px}
/* body — sentences people read */
#top :is(.rs-head__desc,.rs-card p,.pr-head .desc,.pr-limits__hint,.rn-path__step p,.pr-more__defs li,.pr-renewal__head p,.fq-a,.fq-more>p,.cf-card p,.sp-item__body p,.vc-body p,.ac-dl dd,.news-title,.gallery__text,.vf-copy),#contact-modal .cf-choice span{font-size:var(--fs-body);line-height:1.9}
#top .news-title{line-height:1.7}
#contact-modal :is(.contact-modal__lead,.contact-modal__privacy-scroll p,.contact-modal__privacy-scroll li,.contact-modal__privacy-scroll :is(h3,h4)){font-size:var(--fs-cell);line-height:1.85}
#top #faq summary{font-size:var(--fs-lead);line-height:1.9}
@media(max-width:959px){
 #top #license .pr-head .desc{font-size:var(--fs-cell);line-height:1.8;letter-spacing:.02em} /* two narrow columns: one step down so each line keeps 8+ characters */
 #top .p-front-mv__title{font-size:var(--fs-cell)}
 #top .mission__tate{font-size:14px}
}
@media(max-width:599px){#top .hero-copy{padding-right:var(--m)}} /* the vertical label is hidden here, so its 70px gutter is not needed and h1 keeps one line per span */

/* Body text line breaks: break Japanese at phrase boundaries (as .sp-top__lead / .pr-head .desc already do) and avoid a one- or two-character last line. Headings are excluded so their line structure stays as written. */
p,li,dd,figcaption,.fq-a,.contact-modal__hint{text-wrap:pretty;word-break:auto-phrase}
#reasons .rs-head__desc{max-width:44em} /* same measure as the lead line above */

/* Section heads (09-25): every content section opens the same way — label → h2 → one lead (supplementary text lives in the section body). Exceptions keep their own form: hero, the opening story (field / video facts), contact, footer. */
:root{--head-label-gap:12px;--head-lead-gap:24px}
section:is(#mission,#reasons,#gallery,#instructors,#support,#voices,#license,#news,#access,#faq) :is(.label,.gallery__eyebrow){display:block;margin:0;font:500 var(--fs-note)/1.8 var(--sans);letter-spacing:.12em;color:var(--accent)}
section:is(#mission,#reasons,#gallery,#instructors,#support,#voices,#license,#news,#access,#faq) :is(h2.h-ja,h2.gallery__title){margin:var(--head-label-gap) 0 0}
section:is(#reasons,#gallery,#instructors,#support,#voices,#license,#news,#access,#faq) :is(.lead,.gallery__lead,.in-top__lead,.sp-top__lead){max-width:40em;margin:var(--head-lead-gap) 0 var(--m);font:400 var(--fs-lead)/1.9 var(--sans);letter-spacing:.02em;color:var(--ink)}
#mission .mission__story>p{font-size:var(--fs-lead);line-height:1.9}
#license{padding-top:var(--space-section)}
#support .sp-top{display:block}
#support .sp-top__body{padding-top:0;margin:var(--l) 0 0}
#support .sp-top__desc{max-width:40em;margin:0;font:400 var(--fs-body)/1.9 var(--sans);color:var(--ink)} /* detail sits in the body (under the illustration), set as body text */
#voices .vc-rating{max-width:40em;margin:var(--l) 0 var(--m);font:400 var(--fs-body)/1.9 var(--sans);color:var(--ink)}

/* Phone numbers (09-25): set in the rounded heading face instead of the serif, so numbers read softly and match the headings. */
.hd-tel,#m-nav .m-nav__tel,.c-cv-area .cta-tel{font-family:var(--heading);font-weight:500;letter-spacing:.04em;font-variant-numeric:tabular-nums}
.hd-tel{font-size:19px}

/* Header CTA (09-25): no motion beyond a soft watercolor bleed on hover / keyboard focus — a deeper green seeps in from the arrow side. Replaces the old flat switch to ink. */
.hd-cta{position:relative;overflow:hidden;isolation:isolate}
.hd-cta::before{content:'';position:absolute;z-index:-1;right:-30%;top:50%;width:160%;aspect-ratio:1;border-radius:46% 54% 50% 50%/52% 46% 54% 48%;background:radial-gradient(closest-side,color-mix(in srgb,var(--sage-dark) 72%,var(--ink)) 0 58%,color-mix(in srgb,var(--sage-dark) 86%,var(--ink)) 78%,transparent 100%);opacity:0;transform:translate(6%,-50%) scale(.55);transition:opacity .45s ease,transform .6s cubic-bezier(.2,.7,.2,1);pointer-events:none}
.hd-cta:is(:hover,:focus-visible){background:var(--sage-dark);border-color:var(--sage-dark)}
.hd-cta:is(:hover,:focus-visible)::before{opacity:1;transform:translate(0,-50%) scale(1)}
@media(prefers-reduced-motion:reduce){.hd-cta::before{transition:none}}

/* Usability fixes (09-25, from the Web Interface Guidelines audit) */
/* modal open: the page behind does not scroll (the rule used to live only in the unloaded _contact.css); scrolling inside the modal and the mobile menu stops at their edges */
body.is-modal-open{overflow:hidden}
#contact-modal,#m-nav{overscroll-behavior:contain}
/* focus: the consent checkbox gets a visible ring again; text fields show a 2px line and a green label while focused */
.cf .contact-modal__agree input:focus-visible{outline:2px solid var(--sage-dark);outline-offset:3px}
.cf .contact-modal__field:focus-within{border-bottom-color:var(--sage-dark);box-shadow:0 1px 0 var(--sage-dark)}
.cf .contact-modal__field:focus-within>.contact-modal__label{color:var(--sage-dark)}
#contact-modal-title:focus{outline:none} /* focused only as the starting point on touch devices */
/* touch targets: 44px */
#contact-modal .cf-chip{min-height:44px;display:inline-flex;align-items:center}
#contact-modal .contact-modal__close{width:44px;height:44px}
/* the skip link sits above the fixed header */
.skip{z-index:calc(var(--z-header) + 1)}
/* small bronze text: 15% ink mixed in for 4.5:1 on the sage ground (5.0:1; 5.9:1 on paper) */
:root{--accent-text:color-mix(in srgb,var(--accent) 85%,var(--ink))}
section:is(#mission,#reasons,#gallery,#instructors,#support,#voices,#license,#news,#access,#faq) :is(.label,.gallery__eyebrow),#contact-modal :is(.contact-modal__required,.contact-modal__eyebrow){color:var(--accent-text)}
/* taps: no 300ms double-tap delay on controls */
a,button,summary,label,input,textarea{touch-action:manipulation}

/* Subtraction (09-25, design review) */
/* buttons: two kinds only — primary = filled deep green (on dark grounds: filled paper, unchanged), secondary = outline. No black fills. On hover the primary fills with one step deeper green so the change stays visible. */
#top .continuation :is(.btn-cv,.pr-btn):not(.pr-btn--ghost,.btn-ghost){background:var(--sage-dark);border-color:var(--sage-dark);color:var(--base)}
#top .continuation .pr-btn:not(.pr-btn--ghost,.btn-ghost)::after{background:color-mix(in srgb,var(--sage-dark) 72%,var(--ink))}
#top .continuation .pr-btn:not(.pr-btn--ghost,.btn-ghost):is(:hover,:focus-visible){border-color:color-mix(in srgb,var(--sage-dark) 72%,var(--ink))}
#top .continuation .c-cv-area :is(.btn-cv,.pr-btn):not(.pr-btn--ghost,.btn-ghost){background:var(--base);border-color:var(--base);color:var(--ink)}
#top .continuation .c-cv-area .pr-btn:not(.pr-btn--ghost,.btn-ghost)::after{background:var(--world-bg)}
#top #voices .vc-cta{align-items:center}
/* voices: no background blob and no card shadow — the paper cards sit directly on the ground */
#top #voices .vc-grid::before{content:none}
#top #voices .vc-card{box-shadow:none}
/* long text: body-size text drops the display-style wide tracking */
#top :is(.rs-card p,.sp-item__body p,.vc-body p,.fq-a,.ac-dl dd,.pr-limits__hint,.rn-path__step p,.pr-more__defs li,.pr-renewal__head p,.mission__story>p,.sp-top__desc,.vc-rating,.gallery__text),#contact-modal :is(.contact-modal__lead,.contact-modal__privacy-scroll p,.contact-modal__privacy-scroll li){letter-spacing:.02em}
/* SP price table: the 一等 / 二等 column heads scroll away, so each price cell carries its own small head (hidden from screen readers — the table headers already name the column) */
@media(max-width:959px){
 #top .pr-table :is(.pr-r--base,.pr-r--base2,.pr-r--opt) td::before{display:block;margin-bottom:4px;font:500 var(--fs-label)/1.4 var(--sans);letter-spacing:.08em;color:var(--muted)}
 #top .pr-table :is(.pr-r--base,.pr-r--base2,.pr-r--opt) td:not(.is-feature)::before{content:'一等' / ''}
 #top .pr-table :is(.pr-r--base,.pr-r--base2,.pr-r--opt) td.is-feature::before{content:'二等' / ''}
}

/* Chapter grounds and curved dividers（2026-09-25・10-07 に「白い紙に、色のページを挟む」へ変更）
   地は生成りの台紙 --paper-ground（カード・便箋の生成り #f7f5f1 より一段だけ濃い＝部品が地に溶けない）で通し、色を持つのは
   学ぶ場所 #reasons〜#instructors の淡い空色と、来校相談 #contact の深緑の2か所だけ。挿絵は生成りの水彩紙に描いているので、地も紙にそろえる。
   波 .world-bridge は色が変わる3か所（#reasons・#support・#contact の上端）だけに置き、紙→紙の境目には置かない。
   比較は output/transition-20261005/（d＝採用案・c＝空から地上へ・now＝旧「空の一日」） */
.continuation>section{--chapter-bg:var(--paper-ground)}
.continuation>:is(#reasons,#gallery,#instructors){--chapter-bg:var(--chapter-learn)}
.continuation>#contact{--chapter-bg:var(--sage-dark)}
.continuation>:is(#reasons,#gallery,#instructors,#support,#voices,#license,#news,#access,#faq){background:var(--chapter-bg)}
#top #mission{background:var(--paper-ground)}
/* 空色の見開きの終わり（講師紹介の下端）だけ、台紙の色へ半分にじませてから波でつなぐ。oklch で補間して中間を濁らせない */
.continuation>#instructors{background:linear-gradient(in oklch 180deg,var(--chapter-learn) 45%,color-mix(in oklch,var(--chapter-learn),var(--paper-ground)))}
/* フィールドの水彩の下端を、Mission の台紙へ溶かす */
#video-facts::after{content:'';position:absolute;left:0;right:0;bottom:0;height:200px;background:linear-gradient(180deg,color-mix(in srgb,var(--paper-ground) 0%,transparent),var(--paper-ground));pointer-events:none} /* 始点は台紙と同じ色の透明＝途中で色相がずれて桃色に寄らない */
/* .continuation は横だけ切る：縦も切ると最初の章（#reasons）の波が Mission 側へはみ出せない。clip は sticky を壊さない */
.continuation{overflow-x:clip;overflow-y:visible}
/* 区切り＝流れる波（2026-09-25 オーナー決定・比較は output/divider-20260925/compare.html の B）。
   横2倍幅の波（1周期 1440・山の高さと間隔を不揃いにして定型の正弦波に見せない）を -50% まで流して継ぎ目なくループ。奥の波は次の章の色を半透明で重ね、手前と逆向き・より遅く流れる */
.world-bridge{--bridge-front:var(--chapter-bg,var(--world-bg));--wave-speed:44s}
.world-bridge i,.world-bridge .world-bridge__front{inset:0;left:0;top:0;width:100%;height:100%;border-radius:0;background:none;overflow:hidden}
.world-bridge i svg{display:block;width:200%;height:100%;fill:var(--bridge-front);animation:world-wave var(--wave-speed) linear infinite}
.world-bridge__back svg{opacity:.5;animation-duration:calc(var(--wave-speed) * 1.45)!important;animation-direction:reverse!important}
@media(min-width:960px){.world-bridge{top:-70px;height:140px}}/* PC は前の章へ 70px 重ね、波の振れ幅を取る（SP は既存の 56px・重なり 28px） */
/* 章の地色が付いたので、卒業生の声の地面帯（楕円）はスマホでは外す＝縦に積むと本文の後ろで大きな楕円になるため */
@media(max-width:959px){.vc-grid::before{display:none}}
@keyframes world-wave{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media(prefers-reduced-motion:reduce){.world-bridge i svg{animation:none}}

/* 来校相談の旧い角丸（50% 30% 0 0/35px 40px）は区切りと役割が重なり、角から背後が四角く覗くので外す */
.continuation>#contact{border-radius:0;overflow-x:clip;overflow-y:visible}/* 縦は切らない＝区切りが FAQ 側へ 48px はみ出す。横のはみ出しは .continuation が clip */
/* 境目ごとに流れの向きと速さを変え、同じ波が並んで見えないようにする */
.world-bridge--mirror{--wave-speed:52s}
.world-bridge--mirror .world-bridge__front svg{animation-direction:reverse}
.world-bridge--mirror .world-bridge__back svg{animation-direction:normal!important}

/* Instructors (2026-10-05): replaces the seasonal summer slot (#comfort). One block per instructor — photo, role, name, a short message in their own voice, then a hairline profile list. No cards, radii, shadows or number chips: strength comes from type, hairlines and space. Two columns on PC so 2–4 people sit evenly; a single instructor spans the full width with the photo beside the text. One column on SP. */
.in-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--l) clamp(32px,4vw,64px);margin:clamp(40px,5vw,72px) 0 0;padding:0;list-style:none}
.in-person{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:var(--m);align-items:start;padding-top:var(--m);border-top:1px solid var(--ink)}
.in-list>.in-person:only-child{grid-column:1/-1;grid-template-columns:minmax(0,4fr) minmax(0,7fr);column-gap:clamp(56px,8vw,128px);padding-top:clamp(56px,6vw,88px)}
/* photo: the real person only — no illustration, no decoration around it. */
.in-photo{position:relative;margin:0;aspect-ratio:1}
/* torn paper (10-05 owner pick from output/instructor-frame-20261005/compare.html, B): the photo is torn by hand into a rough circle and pasted on a slightly larger sheet of paper, both a little askew. Both edges are PNGs generated once (feTurbulence + displacement), so every browser shows the same edge. The photo's mask is inlined as a data URI: a mask image fetched from a file is blocked by CORS when the page is opened from file://, and a failed mask hides the photo entirely. The photo itself is not altered. */
.in-photo::before{content:'';position:absolute;inset:-6%;background:url('../images/instructors/frame-torn-paper.png?v=20261005001') center/100% 100% no-repeat;transform:rotate(-5deg);pointer-events:none}
.in-photo picture{position:relative;display:block;width:100%;height:100%;transform:rotate(2deg)}
.in-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:45% 28%;--in-mask:url('data:image/png;base64,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');-webkit-mask:var(--in-mask) center/100% 100% no-repeat;mask:var(--in-mask) center/100% 100% no-repeat}
.in-role{margin:0;font:500 var(--fs-note)/1.6 var(--sans);letter-spacing:.12em;color:var(--accent-text)}
.in-name{margin:var(--s) 0 0;font:500 var(--head-small)/1.5 var(--heading);letter-spacing:.06em;color:var(--ink)}
.in-kana{display:block;margin-top:2px;font:400 var(--fs-note)/1.6 var(--sans);letter-spacing:.12em;color:var(--muted)}
.in-message{max-width:36em;margin:var(--m) 0 0}
.in-message p{margin:0;font:400 var(--fs-body)/2 var(--sans);letter-spacing:.02em;color:var(--ink)}
.in-message p+p{margin-top:1em}
.in-dl{margin:var(--l) 0 0;border-bottom:1px solid var(--line)}
.in-dl>div{display:grid;grid-template-columns:6.5em minmax(0,1fr);gap:var(--s);padding:12px 0;border-top:1px solid var(--line)}
.in-dl dt{font:500 var(--fs-note)/1.85 var(--sans);letter-spacing:.06em;color:var(--muted)}
.in-dl dd{margin:0;font:400 var(--fs-cell)/1.85 var(--sans);letter-spacing:.02em;color:var(--ink)}
.in-credentials{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:var(--m);margin:0;padding:0;list-style:none}
.in-credentials li{padding-left:1em;text-indent:-1em}
.in-credentials li::before{content:'・'}
.in-nowrap{white-space:nowrap}
@media(max-width:1199px){.in-person{grid-template-columns:1fr}.in-photo{max-width:320px}.in-list>.in-person:only-child{grid-template-columns:minmax(0,4fr) minmax(0,7fr)}.in-list>.in-person:only-child .in-photo{max-width:none}.in-credentials{grid-template-columns:1fr}}
/* SP: the photo sits small beside the role and name; the message and the list run full width underneath */
@media(max-width:959px){.in-list{grid-template-columns:1fr;margin-top:var(--l)}.in-person,.in-list>.in-person:only-child{grid-template-columns:112px minmax(0,1fr);column-gap:var(--m);row-gap:0;padding-top:var(--m)}.in-photo,.in-list>.in-person:only-child .in-photo{grid-row:1/span 2;max-width:none}.in-body{display:contents}.in-role{align-self:end}.in-name{align-self:start;margin-top:4px}.in-message,.in-dl{grid-column:1/-1}.in-dl>div{grid-template-columns:1fr;gap:2px}}
/* Hero video (10-07): the video stays transparent over the still until it actually plays, then fades in — no blank or jump while it loads, and if autoplay is refused (low-power mode etc.) the still remains. */
.film video{opacity:0;transition:opacity .8s ease}
.film video.is-playing{opacity:1}

/* Type system (2026-10-07 owner decision; comparison in output/font-20261007/): two families only.
   Headings and every number / price = Noto Sans JP — hero copy at 900, h2 / h3 at 700 (FAQ questions are body text), other heading-face uses (phone, facts, small numbers) at 700.
   Body = Zen Kaku Gothic New (unchanged). palt tightens kana and punctuation in headings. Cormorant, Zen Maru Gothic and Klee One are no longer loaded.
   font-synthesis-style:none keeps the old italic number / caption rules upright instead of faking an oblique Noto. */
:root{--heading:'Noto Sans JP',sans-serif;--en:'Noto Sans JP',sans-serif}
html{font-synthesis-style:none}
#top .hero-copy .display,#top h2{font-family:var(--heading);font-weight:900;font-feature-settings:"palt";letter-spacing:.02em;line-height:1.55}
#top h2{font-weight:700} /* 10-07 owner: 900 on paper read too forceful (e.g. Mission's three-line statement); only the hero copy over the video keeps 900. h2 and h3 share 700 and differ by size */
#top .hero-copy .display{font-size:clamp(26px,3.6vw,52px)}
#top h3,#contact-modal h3{font-family:var(--heading);font-weight:700;font-feature-settings:"palt";letter-spacing:.02em}
#top .faq summary{font-family:var(--sans);font-weight:500} /* 10-07 owner: the questions are full sentences — the heading face at 700 read too heavy; the category (h3) keeps the heading face */
#contact-modal .contact-modal__close{font-family:var(--sans)} /* the "×" fell back to Arial */
/* Mission's vertical statement reads as quiet body voice, not a heading: back to the body face (Noto would render at 700 here) */
.mission__tate{font-family:var(--sans)}
/* Hero vertical note (10-07 owner: read too strong next to the copy): body face, regular weight, a quieter paper tone and a fainter rule */
.p-front-mv__vert{font-family:var(--sans);font-weight:400;color:color-mix(in srgb,var(--base) 75%,transparent);border-right-color:color-mix(in srgb,var(--base) 32%,transparent)}
/* Small fixes (10-07): the three facts' headings join the heading system (700, ink, palt) instead of a grey-green 500; all small "01" numbers share one colour and tracking */
#top .vf-heading,#top .vf-heading strong{font-weight:700;color:var(--ink);font-feature-settings:"palt";letter-spacing:.02em}
#top .vf-number{color:var(--accent-text)}
#top .rn-path__num{letter-spacing:.18em}
/* Image shapes (2026-10-07 owner pick B, comparison in output/shapes-20261007/): two shapes only.
   Illustrations = no frame, radius or shadow; edges dissolve into the paper (wide scenes fade at the edges, spot art stays round).
   Photographs = torn paper, the same grammar as the instructor portrait — except the gallery preview, which keeps its soft dissolving oval (owner preferred it for the videos, 10-07). The torn edge is an inline PNG mask (a file-based mask is blocked by CORS under file:// and would hide the photo). !important: these override several older layered rules. */
:root{--torn-rect:url('data:image/png;base64,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')}
#top :is(.scene-art,.gallery-illustration,.support-illustration),#top :is(.scene-art,.gallery-illustration,.support-illustration) :is(picture,img){border-radius:0!important;background:none!important;box-shadow:none!important}
#top :is(.scene-art,.gallery-illustration,.support-illustration) img,#top .rs-card img[src*="/illustrations/"]{-webkit-mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent),linear-gradient(180deg,transparent,#000 9%,#000 91%,transparent);-webkit-mask-composite:source-in;mask:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent),linear-gradient(180deg,transparent,#000 9%,#000 91%,transparent);mask-composite:intersect}
#top .sp-spot,#top .sp-spot :is(picture,img){border-radius:50%!important}
#top .rs-card img:not([src*="/illustrations/"]),#top .news-thumb img{border-radius:0!important;-webkit-mask:var(--torn-rect) center/100% 100% no-repeat!important;mask:var(--torn-rect) center/100% 100% no-repeat!important}
#top .rs-card img,#top .rs-card :is(figure,picture){border-radius:0!important}
#top .news-thumb{border-radius:0!important;box-shadow:none!important;background:none!important}
/* UI/UX review fixes (10-07)
   contrast: inactive gallery titles were ink 42% (~2.5:1 on the sky ground) — 62% clears 3:1 for this large text and still reads as "not selected" */
#gallery.gallery--nav .gallery__row em{color:color-mix(in srgb,var(--ink) 62%,transparent)}
/* touch targets: stand-alone text links and the header logo get a 44px hit area (inline links inside sentences are left as they are) */
#top :is(.tlink,.map-link){display:inline-flex;align-items:center;min-height:44px}
#siteHeader .brand>a{display:inline-flex;align-items:center;min-height:44px}
@media(max-width:959px){
 #top .fq-index a{min-height:44px;display:inline-flex;align-items:center}
 .l-footer .ft-nav a{display:inline-flex;align-items:center;min-height:44px}
 .l-footer .ft-nav ul{row-gap:0} /* the 44px links carry the spacing themselves */
}
/* Cards → rules (10-07 owner pick A, comparison in output/cards-20261007/): one grammar for content blocks across the page.
   Exception: the alumni voices keep their paper letters, rounded corners and ringed portraits (owner, 10-08).
   No card grounds, radii or shadows; a thin top rule and space separate blocks, as in the price table, renewal, access, FAQ and instructors.
   The price table keeps its single colour band for the 2nd-class column (only its rounded ends go). !important: overrides several older layered rules. */
#top .mission__spread{background:none!important;border-radius:0!important;box-shadow:none!important;border-top:1px solid var(--ink);padding-left:0!important;padding-right:0!important}
/* 選ばれる理由のカードは上端の罫線もなし（10-09 オーナー：写真・挿絵の上の線が不要。番号と見出しで区切りは足りる） */
#top .rs-card{background:none!important;border-radius:0!important;box-shadow:none!important;border:0!important;padding-left:0!important;padding-right:0!important}
#top .pr-table .is-feature{border-radius:0!important}
#top .ac-map{border-radius:0!important;box-shadow:none!important}
#top .fq-more{background:none!important;border-radius:0!important;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
/* Price table fits one screen (10-08 owner): the "included in both courses" rows (all ✓ in both columns) move into the empty corner cell as a short list,
   the rank label that repeated the h3 goes, and on PC the course art sits small beside the title; option and CTA rows lose spare padding. Prices, h3 and JSON-LD unchanged. */
.pr-incl{margin-top:var(--m);padding-top:var(--s);border-top:1px solid var(--line)}
.pr-incl__title{margin:0 0 6px;font:500 var(--fs-note)/1.6 var(--sans);color:var(--ink)}
.pr-incl ul{margin:0;padding:0;list-style:none}
.pr-incl li{position:relative;padding-left:1em;font:400 var(--fs-note)/1.75 var(--sans);color:var(--muted)}
.pr-incl li::before{content:'・';position:absolute;left:0}
.pr-incl small{font-size:var(--fs-label)}
@media(min-width:960px){
 /* keep th a table cell (display:grid on th broke the row height); the art floats beside the title instead */
 #top .pr-table .pr-head{padding-top:24px!important;padding-bottom:20px!important}
 #top .pr-table .pr-head .pr-art{float:left;width:72px!important;height:72px!important;margin:0 18px 0 0!important}
 #top .pr-table .pr-head h3{margin:0;padding-top:16px;line-height:1.5}
 #top .pr-table .pr-head .desc{clear:both;margin:0;padding-top:14px}
 #top .pr-table .pr-table__corner{vertical-align:bottom;padding-bottom:20px!important}
 #top .pr-table .pr-r--base :is(th,td),#top .pr-table .pr-r--base2 :is(th,td){padding-block:14px!important}
 #top .pr-table .pr-r--group :is(th,td){padding-top:22px!important;padding-bottom:8px!important}
 #top .pr-table .pr-r--opt :is(th,td){padding-block:10px!important}
 #top .pr-table .pr-r--cta :is(th,td){padding-block:18px!important}
}
/* Option rows (10-08 owner, prototype in output/price-20261008/): on PC the "初学者｜経験者" column heads sit once in the group row and each row shows prices only;
   the per-cell labels stay for screen readers (visually hidden). Fixed px widths keep heads and prices in the same columns. SP keeps the per-cell labels. */
@media(min-width:960px){
 #top .pr-pair>span{width:150px;min-width:0}
 #top .pr-r--opt .pr-pair small{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
 #top .pr-pair--head>span{font:500 var(--fs-note)/1.4 var(--sans)!important;letter-spacing:.06em;color:var(--muted)!important}
 #top .pr-r--group td{vertical-align:bottom}
}
@media(max-width:959px){#top .pr-pair--head{display:none}}

/* 空からの便り（2026-10-08 オーナー決定・比較は output/announce-20261008/）：ヒーローの左下に note の最新1件。
   文字の左端は見出し・リード・予約ボタンと同じ --gutter。点線の飛行経路（サポート・更新講習・来校相談と同じ点線）は左の余白を飛んで、
   文字の左端の真上の着地の円に降りる。PC は右下の SCROLL TO EXPLORE と下端をそろえ、ヒーローの四隅で枠を作る。SP は予約ボタンの下。
   取得できないときは要素ごと出さない（hidden のまま）。reduced-motion では経路・円・文字とも最初から見える */
.hero-news{--hn-route-h:34px;position:relative;max-width:min(100%,40em);margin-top:calc(clamp(40px,6vh,64px) + var(--hn-route-h) - 10px);color:var(--white)}
.hero-news[hidden]{display:none}
.hero-news__route{position:absolute;left:calc(-1 * var(--gutter));top:calc(-1 * var(--hn-route-h) + 4px);width:calc(var(--gutter) + 4px);height:var(--hn-route-h);pointer-events:none}
.hero-news__route svg{display:block;width:100%;height:100%;overflow:visible}
.hero-news__route path{fill:none;stroke:color-mix(in srgb,var(--white) 72%,transparent);stroke-width:2;stroke-dasharray:1 11;stroke-linecap:round;vector-effect:non-scaling-stroke}
/* 着地の円（中心＝文字の左端＋4px）と、一度だけ広がる輪 */
.hero-news__touch{position:absolute;right:-4px;top:calc(50% - 4px);width:8px;height:8px;border-radius:50%;background:var(--white)}
.hero-news__touch::after{content:'';position:absolute;inset:-6px;border:1px solid color-mix(in srgb,var(--white) 60%,transparent);border-radius:50%;opacity:0}

.hero-news__link{display:grid;gap:6px;min-width:0;color:inherit;text-decoration:none}
.hero-news__meta{display:flex;gap:14px;align-items:baseline;font:500 var(--fs-note)/1.4 var(--sans);letter-spacing:.16em;color:color-mix(in srgb,var(--white) 78%,transparent)}
.hero-news__meta time{font:500 14px/1.4 var(--heading);letter-spacing:.04em;font-variant-numeric:lining-nums tabular-nums}
.hero-news__title{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;font:500 var(--fs-body)/1.75 var(--sans);letter-spacing:.03em;word-break:auto-phrase;text-wrap:pretty;text-decoration:underline;text-decoration-color:color-mix(in srgb,var(--white) 40%,transparent);text-underline-offset:5px}
.hero-news__arrow{display:inline-block;margin-left:10px;text-decoration:none;transition:transform .3s ease}
.hero-news__link:hover .hero-news__title,.hero-news__link:focus-visible .hero-news__title{text-decoration-color:currentColor}
.hero-news__link:hover .hero-news__arrow{transform:translateX(3px)}
.hero-news__link:focus-visible{outline:2px solid var(--white);outline-offset:6px}

@media(min-width:960px){
  /* 左下に置く：ヒーローを縦の流れにして、お知らせを下端へ押し下げる（margin-top:auto）。
     画面が低いときも予約ボタンとの間は最低 64px＋経路の高さを確保し、ボタンに重ならない。
     右下の SCROLL TO EXPLORE も同じ下端（--hn-bottom）にそろえて、四隅の枠を作る */
  .hero-copy{--hn-bottom:72px;display:flex;flex-direction:column;align-items:flex-start;padding-bottom:var(--hn-bottom)}
  .hero-copy>.hero-link{margin-bottom:calc(64px + var(--hn-route-h,34px))}
  .hero-news{margin-top:auto}
  .scroll-note{top:auto;bottom:72px}
}
/* 低い画面（ノートPC 720px 等）ではヒーローが画面より長くなり、右下の SCROLL と左下のお知らせの下端がずれる。SCROLL は飾りなので隠す */
@media(min-width:960px) and (max-height:820px){.scroll-note{display:none}}
@media(max-width:959px){
  .hero-news{--hn-route-h:30px;margin-top:calc(44px + var(--hn-route-h))}
  .hero-news__route{width:calc(var(--gutter) + 56px)}
}

@media(prefers-reduced-motion:no-preference){
  .hero-news:not([hidden]) .hero-news__route path{animation:hn-draw 1.4s cubic-bezier(.4,0,.2,1) both}
  .hero-news:not([hidden]) .hero-news__touch{animation:hn-fade .3s 1.3s both}
  .hero-news:not([hidden]) .hero-news__touch::after{animation:hn-ring 1.2s 1.45s ease-out both}
  .hero-news:not([hidden]) .hero-news__link{animation:hn-rise .7s 1.4s ease-out both}
}
@keyframes hn-draw{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes hn-fade{from{opacity:0}to{opacity:1}}
@keyframes hn-ring{0%{opacity:0;transform:scale(.4)}40%{opacity:1}100%{opacity:0;transform:scale(1.9)}}
@keyframes hn-rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
/* 着地の印を水彩のドローンに（10-09 オーナー決定 B 案・比較は output/news-drone-20261009/）。白丸は消し、輪の広がりは残す。
   ドローンは実写寄りの白い機体（10-09 水彩から変更＝写真の上で水彩が浮いたため。原本 src/images_raw/decor/hero-news-drone-real-source.jpeg・上面の刻印を消し、灰色の地を抜いて左右反転＝機首を着地点の右下へ。透過 PNG/WebP 192px）。
   点線も少し見えやすく（2.5px・白 88%） */
.hero-news__route path{stroke-width:2.5;stroke:color-mix(in srgb,var(--white) 88%,transparent)}
.hero-news__touch{background:transparent}
.hero-news__drone{position:absolute;left:50%;top:50%;width:64px;transform:translate(-50%,-62%);filter:drop-shadow(0 3px 4px color-mix(in srgb,#000 40%,transparent))}
.hero-news__drone img{display:block;width:100%;height:auto}
@media(max-width:959px){.hero-news__drone{width:52px}}
/* はじめの一歩を、この場所で。のタイプライター（10-09・js/draft-wireframe.js）：打った文字の直後に点滅するカーソル。打ち終えて1.2秒で消え、分割は元の文章に戻す */
.tw-caret{display:inline-block;width:2px;height:.92em;margin-left:3px;vertical-align:-.1em;background:currentColor;animation:tw-blink 1s steps(1) infinite}
@keyframes tw-blink{50%{opacity:0}}