/* Sound Laplace — オリジナル案（2026-10-15 明るい版。暗い版は style-dark.css）。書体は Noto Sans JP / Noto Serif JP（SIL OFL）をページで使う文字だけに絞って同梱 */
@font-face{font-family:"SL Sans";src:url(fonts/notosansjp.woff2) format("woff2");font-weight:100 900;font-display:swap}
@font-face{font-family:"SL Serif";src:url(fonts/notoserifjp.woff2) format("woff2");font-weight:200 900;font-display:swap}

:root{
  --bg:#f6f4ef;--white:#ffffff;--tint-blue:#eef3ff;--tint-warm:#fff4ec;
  --fg:#0e1322;--muted:#5b6070;--line:rgba(14,19,34,.12);--line-strong:rgba(14,19,34,.85);
  --blue:#2c5bff;--cyan:#1fc8ff;--sun:#ffc21a;--coral:#ff5a3d;--red:#ff2d55;
  --grad:linear-gradient(100deg,#2c5bff 0%,#1fc8ff 32%,#ffc21a 62%,#ff5a3d 82%,#ff2d55 100%);
  --grad-cool:linear-gradient(100deg,#2c5bff 0%,#1a7fe0 55%,#0b8fc0 100%); /* 白地の文字用：青系だけ（混ぜると濁るので分ける） */
  --grad-warm:linear-gradient(100deg,#ef5a24 0%,#e8433a 55%,#e0244f 100%); /* 白地の文字用：オレンジ〜赤系だけ */
  --shadow:0 30px 70px -36px rgba(14,19,34,.28);
  --ease:cubic-bezier(.2,.7,.15,1);--ease-io:cubic-bezier(.65,0,.35,1);
  --pad:clamp(20px,4vw,56px);
  --sans:"SL Sans","Noto Sans JP","Hiragino Sans","Yu Gothic",sans-serif;
  --serif:"SL Serif","Noto Serif JP","Yu Mincho",serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:88px}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--sans);font-size:16px;line-height:1.9;letter-spacing:.04em;font-weight:400;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden}
h1,h2,h3,p,ol,ul,dl,dd,figure{margin:0}
h1,h2,h3,.sec-title,.school__catch,.contact__title,.stat__label,.index__copy,.hero__lead,.news__title,.player__now{word-break:auto-phrase}  /* 文節で折るのは見出しと短い表示だけ。本文はふつうの折り返し（2026-10-18） */
p{text-wrap:pretty}
ol,ul{padding:0;list-style:none}
img{display:block;max-width:100%;height:auto}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
:focus-visible{outline:2px solid var(--blue);outline-offset:4px;border-radius:4px}
.wrap{width:min(1320px,100% - var(--pad)*2);margin-inline:auto}
.skip{position:fixed;left:16px;top:-80px;z-index:100;background:var(--fg);color:var(--white);padding:10px 18px;border-radius:8px}
.skip:focus{top:16px}
.grad{background:var(--grad-cool);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:gradShift 9s var(--ease-io) infinite alternate}
@keyframes gradShift{to{background-position:100% 0}}
.dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--grad);margin-right:12px;vertical-align:1px;box-shadow:0 0 0 0 rgba(44,91,255,.4);animation:pulse 2.4s ease-out infinite}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(44,91,255,0)}100%{box-shadow:0 0 0 0 rgba(44,91,255,0)}}

/* 紙のような細かい粒子を薄く */
body::after{content:"";position:fixed;inset:0;z-index:70;pointer-events:none;opacity:.05;mix-blend-mode:multiply;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}

/* プレビューの札 */
.preview-pill{position:fixed;right:16px;bottom:16px;z-index:60;font-size:10.5px;letter-spacing:.12em;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.82);color:var(--fg);border:1px solid var(--line);backdrop-filter:blur(8px);pointer-events:none}


/* ヘッダー */
.header{position:fixed;inset:0 0 auto;z-index:50;height:76px;padding:0 var(--pad);display:flex;align-items:center;gap:32px;color:var(--fg);transition:transform .5s var(--ease)}
.header::before{content:"";position:absolute;inset:0;z-index:-1;opacity:0;transition:opacity .4s;background:rgba(255,255,255,.74);backdrop-filter:blur(16px) saturate(160%);-webkit-backdrop-filter:blur(16px) saturate(160%);border-bottom:1px solid var(--line)}
.header.is-scrolled::before{opacity:1}
.header.is-hidden{transform:translateY(-100%)}
.brand{display:flex;align-items:center;gap:12px;margin-right:auto}
.brand__mark{width:32px;height:auto}
.brand__name{font-family:var(--serif);font-weight:600;font-size:21px;letter-spacing:.01em;line-height:1}
.nav{display:flex;gap:30px;font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase}
.nav a{position:relative;padding:8px 0}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1.5px;background:var(--grad);transform:scaleX(0);transform-origin:right;transition:transform .5s var(--ease)}
.nav a:hover::after{transform:scaleX(1);transform-origin:left}
.header__cta{font-size:13px;font-weight:700;letter-spacing:.08em;padding:11px 22px;border-radius:999px;background:var(--fg);color:var(--white);transition:box-shadow .3s}
.header__cta:hover{box-shadow:0 0 0 5px rgba(14,19,34,.1)}
.menu-btn{display:none;width:44px;height:44px;position:relative}
.menu-btn span{position:absolute;left:10px;right:10px;height:1.5px;background:currentColor;transition:transform .4s var(--ease)}
.menu-btn span:first-child{top:18px}.menu-btn span:last-child{top:25px}
.menu-btn[aria-expanded=true] span:first-child{transform:translateY(3.5px) rotate(45deg)}
.menu-btn[aria-expanded=true] span:last-child{transform:translateY(-3.5px) rotate(-45deg)}
.drawer{position:fixed;inset:0;z-index:45;background:var(--white);color:var(--fg);padding:110px var(--pad) 40px;display:flex}
.drawer[hidden]{display:none}
.drawer nav{display:flex;flex-direction:column;gap:6px;width:100%}
.drawer a{display:flex;align-items:baseline;justify-content:space-between;font-size:40px;font-weight:800;letter-spacing:0;padding:10px 0;border-bottom:1px solid var(--line)}
.drawer small{font-size:13px;font-weight:500;color:var(--muted);letter-spacing:.1em}

/* 見出しの共通 */
.eyebrow{font-size:12px;font-weight:700;letter-spacing:.24em;text-transform:uppercase;display:flex;align-items:center;gap:12px}
.eyebrow::before{content:"";width:28px;height:2px;background:var(--grad)}
.eyebrow span{letter-spacing:.12em;text-transform:none;font-weight:500;color:var(--muted)}
.eyebrow--plain::before{display:none}
.sec-title{font-size:clamp(40px,6.2vw,96px);font-weight:800;line-height:1.14;letter-spacing:-.01em;font-feature-settings:"palt";margin-top:28px}
.sec-lead{max-width:34em;font-size:17px;line-height:2.05;margin-top:36px;color:var(--muted)}
.fineprint{font-size:12px;line-height:1.9;letter-spacing:.04em;margin-top:56px;max-width:60em;color:var(--muted)}
.text-link{display:inline-flex;align-items:center;gap:14px;margin-top:56px;font-weight:700;font-size:15px;position:relative;padding-bottom:6px}
.text-link::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1.5px;background:var(--fg);transform-origin:left;transition:transform .5s var(--ease)}
.text-link:hover::after{transform:scaleX(.35)}
.text-link i{font-style:normal;transition:transform .4s var(--ease)}
.text-link:hover i{transform:translateX(6px)}

/* ボタン */
.btn{display:inline-flex;align-items:center;gap:16px;padding:18px 30px;border-radius:999px;font-size:15px;font-weight:700;letter-spacing:.06em;transition:background .3s,color .3s,box-shadow .3s;will-change:transform}
.btn i{font-style:normal;transition:transform .4s var(--ease)}
.btn:hover i{transform:translateY(3px)}
.btn--ink{background:var(--fg);color:var(--white)}
.btn--ink:hover{box-shadow:0 0 0 6px rgba(14,19,34,.1)}
.btn--grad{color:var(--fg);border:1.5px solid transparent;background:linear-gradient(var(--white),var(--white)) padding-box,var(--grad) border-box}
.btn--ghost{border:1px solid var(--line-strong)}
.btn--ghost:hover{background:var(--fg);color:var(--white)}
.btn--ghost:hover i,.btn--big:hover i{transform:translateX(5px)}
.btn--big{padding:26px 40px;font-size:17px;background:var(--fg);color:var(--white)}
.btn--big:hover{box-shadow:0 0 0 8px rgba(14,19,34,.08)}
.btn[aria-disabled=true]{opacity:.8;cursor:not-allowed}

/* 出てくる動き（JS が有効なときだけ隠しておく） */
.js [data-reveal]{opacity:0;transform:translateY(32px);transition:opacity 1s var(--ease),transform 1.2s var(--ease)}
.js [data-reveal].is-in{opacity:1;transform:none}
.js [data-split]{opacity:1;transform:none}
.ln{display:block;overflow:hidden;padding-bottom:.06em;margin-bottom:-.06em}
.ln>span{display:inline-block}
.js [data-split] .ln>span{transform:translateY(108%);transition:transform 1.25s var(--ease)}
.js [data-split].is-in .ln>span{transform:none}
.js [data-split].is-in .ln:nth-child(2)>span{transition-delay:.09s}
.js [data-split].is-in .ln:nth-child(3)>span{transition-delay:.18s}

/* ヒーロー */
.hero{position:relative;min-height:100vh;min-height:100svh;overflow:hidden;isolation:isolate;background:radial-gradient(42% 46% at 88% 12%,rgba(31,200,255,.20),transparent 70%),radial-gradient(36% 40% at 62% 96%,rgba(255,90,61,.16),transparent 70%),radial-gradient(30% 34% at 100% 70%,rgba(255,194,26,.14),transparent 70%),var(--white)}
.hero__field{position:absolute;inset:0;width:100%;height:100%;z-index:-1}
.hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(110% 70% at 14% 6%,rgba(255,255,255,.96) 0%,rgba(255,255,255,.6) 45%,rgba(255,255,255,0) 70%),radial-gradient(60% 45% at 6% 100%,rgba(255,255,255,.92) 0%,rgba(255,255,255,0) 70%)}
.hero__inner{position:relative;min-height:100vh;min-height:100svh;padding:clamp(120px,18vh,180px) var(--pad) clamp(40px,7vh,72px);display:flex;flex-direction:column}
.hero__kicker{font-size:12px;font-weight:600;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.hero__title{margin-top:clamp(16px,3vh,40px);font-size:clamp(56px,min(11.4vw,15.2vh),200px);font-weight:900;line-height:.98;letter-spacing:-.02em;font-feature-settings:"palt"}
.hero__title .line{display:block;overflow:hidden;padding-bottom:.04em}
.hero__title .line>span{display:inline-block}
.js .hero__title .line>span{transform:translateY(105%);transition:transform 1.4s var(--ease)}
.is-ready .hero__title .line>span{transform:none}
.is-ready .hero__title .line:nth-child(2)>span{transition-delay:.12s}
.is-ready .hero__title .line:nth-child(3)>span{transition-delay:.24s}
.js .is-ready .hero [data-reveal]{opacity:1;transform:none}
.js .is-ready .hero__lead{transition-delay:.5s}
.js .is-ready .hero__actions{transition-delay:.62s}
.hero__foot{margin-top:auto;padding-top:32px;display:flex;align-items:flex-end;justify-content:space-between;gap:40px}
.hero__lead{font-size:clamp(15px,1.25vw,18px);line-height:2.1;font-weight:500}
.hero__meta{position:absolute;top:clamp(120px,18vh,180px);right:var(--pad);display:flex;flex-direction:column;align-items:flex-end;gap:4px;font-size:11px;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.hero__scroll{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;font-size:10px;letter-spacing:.3em;text-transform:uppercase;color:var(--muted)}
.hero__scroll::after{content:"";width:1px;height:48px;background:linear-gradient(var(--fg),transparent);transform-origin:top;animation:scrollLine 2.2s var(--ease-io) infinite}
@keyframes scrollLine{0%{transform:scaleY(0)}50%{transform:scaleY(1);transform-origin:top}50.1%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* 流れる帯 */
.marquee{background:var(--white);border-block:1px solid var(--line);overflow:hidden;padding:clamp(18px,2.4vw,30px) 0}
.marquee__track{display:flex;align-items:center;gap:clamp(24px,3vw,48px);width:max-content;animation:marquee 46s linear infinite}
.marquee span{font-family:var(--serif);font-size:clamp(34px,5.4vw,84px);font-weight:500;letter-spacing:-.01em;white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(14,19,34,.32)}
.marquee b{font-size:clamp(18px,2.2vw,30px);background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}
@keyframes marquee{to{transform:translateX(-50%)}}

/* 場面の背景 */
.numbers,.music,.company{background:var(--bg)}
.services,.news{background:var(--white)}

/* 実績 */
.numbers{padding:clamp(120px,15vw,220px) 0 clamp(96px,11vw,160px)}
.numbers .sec-head{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);column-gap:clamp(40px,6vw,104px);align-items:end}
.numbers .sec-head .eyebrow{grid-column:1/-1}
.numbers .sec-lead{margin-top:0;padding-bottom:14px}
.numbers__grid{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:clamp(40px,6vw,104px);align-items:end;margin-top:clamp(64px,8vw,120px)}
.stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
.stat{position:relative;padding:36px 28px 40px 0;border-top:1px solid var(--line)}
.stat:nth-child(even){padding-left:28px;border-left:1px solid var(--line)}
.stat:nth-child(n+3){border-bottom:1px solid var(--line)}
.stat::before{content:"";position:absolute;left:0;top:-1px;width:56px;height:2px;background:var(--grad);transform:scaleX(0);transform-origin:left;transition:transform 1.2s var(--ease) .3s}
.stat:nth-child(even)::before{left:28px}
.stat.is-in::before{transform:none}
.stat__label{font-size:14px;font-weight:700;letter-spacing:.06em}
.stat__label span{display:inline-block}
.stat__value{display:flex;align-items:baseline;gap:4px;margin-top:18px;font-size:clamp(64px,7.6vw,124px);font-weight:800;line-height:1;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.stat__value small{font-size:.26em;font-weight:700;letter-spacing:0;margin-right:2px}
.stat__value em{font-style:normal;font-size:.19em;font-weight:700;letter-spacing:.02em;margin-left:6px;color:var(--blue)}
.stat__note{margin-top:16px;font-size:12.5px;line-height:1.7;color:var(--muted)}
.stat:nth-child(2){transition-delay:.08s}.stat:nth-child(3){transition-delay:.16s}.stat:nth-child(4){transition-delay:.24s}
.plaque__frame{border-radius:22px;overflow:hidden;background:#d8d4ca;box-shadow:var(--shadow);transform:perspective(1000px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .6s var(--ease)}
.plaque__frame img{width:100%;aspect-ratio:878/941;object-fit:cover;transform:scale(1.04);transition:transform 1.4s var(--ease)}
.plaque:hover .plaque__frame img{transform:scale(1)}
.plaque figcaption{display:grid;grid-template-columns:auto 1fr;gap:18px;align-items:center;margin-top:22px;font-size:12.5px;line-height:1.75;color:var(--muted)}
.plaque figcaption b{font-family:var(--serif);font-size:56px;font-weight:500;line-height:1;color:var(--fg)}

/* サービスの一覧 */
.services{position:relative;padding:clamp(120px,14vw,200px) 0}
.sec-head--row{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);align-items:start;gap:40px}
.sec-head--row .sec-title{margin-top:-10px;font-size:clamp(36px,4.6vw,72px)}
.index{margin-top:clamp(72px,8vw,120px);border-bottom:1px solid var(--line)}
.index__row{position:relative;display:grid;grid-template-columns:72px minmax(0,1.1fr) minmax(0,1fr) 64px;align-items:center;gap:24px;padding:clamp(32px,4vw,52px) 0;border-top:1px solid var(--line)}
.index__row::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(44,91,255,.07),rgba(255,194,26,.07),rgba(255,45,85,.06));opacity:0;transition:opacity .5s}
.index__row:hover::before{opacity:1}
.index__no{font-family:var(--serif);font-size:15px;color:var(--muted)}
.index__name b{display:block;font-size:clamp(52px,7.4vw,124px);font-weight:800;line-height:1;letter-spacing:-.03em;transition:transform .6s var(--ease)}
.index__name small{display:block;margin-top:14px;font-size:13px;letter-spacing:.12em;color:var(--muted)}
.index__row:hover .index__name b{transform:translateX(16px)}
.index__copy{font-size:clamp(15px,1.3vw,18px);font-weight:600}
.index__arrow{width:64px;height:64px;border-radius:50%;border:1px solid var(--line-strong);display:grid;place-items:center;font-size:20px;transition:background .4s,color .4s,transform .6s var(--ease)}
.index__row:hover .index__arrow{background:var(--fg);color:var(--white);transform:rotate(-45deg)}
.preview{position:fixed;left:0;top:0;z-index:20;width:min(380px,30vw);aspect-ratio:16/10;border-radius:18px;overflow:hidden;pointer-events:none;opacity:0;transform:translate3d(-50%,-50%,0) scale(.85);transition:opacity .4s;will-change:transform;box-shadow:0 30px 70px -20px rgba(14,19,34,.35)}
.preview img{width:100%;height:100%;object-fit:cover}
.preview.is-on{opacity:1}
@media (hover:none){.preview{display:none}}

/* 音楽 */
.music{padding:clamp(120px,15vw,220px) 0}
.music__top{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(0,1fr);gap:clamp(40px,6vw,96px);align-items:end}
.royalty{border-left:1px solid var(--line);padding-left:clamp(24px,3vw,48px)}
.royalty__num{display:flex;align-items:flex-start;font-size:clamp(130px,17vw,270px);font-weight:900;line-height:.82;letter-spacing:-.05em;background:var(--grad-warm);background-size:220% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:gradShift 10s var(--ease-io) infinite alternate;padding-bottom:.04em}
.royalty__num small{font-size:.3em;font-weight:800;letter-spacing:0;margin:.12em 0 0 .06em}
.royalty__label{margin-top:22px;font-size:16px;font-weight:700}
.royalty__note{margin-top:10px;font-size:12.5px;line-height:1.8;color:var(--muted)}
.steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(24px,3vw,48px);margin-top:clamp(80px,9vw,140px)}
.steps li{padding-top:28px;border-top:2px solid var(--fg)}
.steps li:nth-child(2){transition-delay:.08s}.steps li:nth-child(3){transition-delay:.16s}
.steps span{font-family:var(--serif);font-size:14px;color:var(--muted)}
.steps h3{font-size:clamp(26px,2.4vw,34px);font-weight:800;margin-top:10px;letter-spacing:.02em}
.steps p{margin-top:14px;font-size:15px;line-height:2;color:var(--muted)}
.player{margin-top:clamp(96px,10vw,160px);background:var(--white);border:1px solid var(--line);border-radius:clamp(20px,2.4vw,32px);padding:clamp(28px,3.4vw,52px);overflow:hidden;box-shadow:var(--shadow);position:relative;isolation:isolate}
.player::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(50% 60% at 0% 0%,rgba(31,200,255,.10),transparent 70%),radial-gradient(45% 60% at 100% 100%,rgba(255,90,61,.09),transparent 70%)}
.player__head{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap}
.player__now{font-size:13px;color:var(--muted);letter-spacing:.06em}
.player__viz{display:block;width:100%;height:clamp(120px,14vw,190px);margin-top:28px}
.tracks{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0 clamp(16px,2vw,32px);margin-top:24px}
.track{width:100%;display:grid;grid-template-columns:30px minmax(0,1fr) auto 28px;align-items:center;gap:14px;text-align:left;padding:18px 6px;border-top:1px solid var(--line);border-radius:6px;transition:background .3s}
.track:hover{background:rgba(14,19,34,.035)}
.track__no{font-family:var(--serif);font-size:13px;color:var(--muted)}
.track__title{font-size:15px;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.track__time{font-size:12px;color:var(--muted);font-variant-numeric:tabular-nums}
.track__icon{width:28px;height:28px;border-radius:50%;border:1px solid var(--line-strong);position:relative}
.track__icon::before{content:"";position:absolute;left:11px;top:9px;border-left:8px solid currentColor;border-top:5px solid transparent;border-bottom:5px solid transparent}
.track.is-playing .track__icon{background:var(--fg);border-color:var(--fg)}
.track.is-playing .track__icon::before{left:9px;top:9px;width:10px;height:10px;border:0;background:linear-gradient(90deg,#fff 0 3px,transparent 3px 7px,#fff 7px 10px)}
.track.is-playing .track__title{background:var(--grad-cool);-webkit-background-clip:text;background-clip:text;color:transparent}
.player__bar{height:2px;margin-top:20px;background:var(--line);border-radius:2px;overflow:hidden}
.player__bar span{display:block;height:100%;width:100%;background:var(--grad);transform:scaleX(0);transform-origin:left}
.partners{margin-top:clamp(80px,9vw,140px)}
.partners .fineprint{margin-top:28px}

/* ガリレオ */
.school{position:relative;padding:clamp(120px,15vw,220px) 0;overflow:hidden;isolation:isolate;background:linear-gradient(180deg,var(--tint-blue) 0%,#f5f8ff 55%,var(--white) 100%)}
.school__glow{position:absolute;inset:-20% -10%;z-index:-1;background:radial-gradient(40% 35% at 80% 16%,rgba(44,91,255,.16),transparent 70%),radial-gradient(30% 28% at 10% 78%,rgba(255,138,30,.12),transparent 70%);filter:blur(10px);animation:glow 16s var(--ease-io) infinite alternate}
@keyframes glow{to{transform:translate3d(-4%,3%,0) scale(1.06)}}
.school__top{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:clamp(32px,5vw,80px);align-items:center}
.school__head{max-width:860px}
.school__title{display:flex;align-items:center;gap:clamp(18px,2.4vw,36px);margin-top:36px}
.school__title img{width:clamp(76px,9vw,132px);height:auto;filter:drop-shadow(0 18px 34px rgba(44,91,255,.28))}
.school__title span{font-size:clamp(68px,10.4vw,176px);font-weight:900;line-height:1;letter-spacing:-.02em;font-feature-settings:"palt"}
.school__title small{display:block;font-size:clamp(13px,1.1vw,16px);font-weight:700;letter-spacing:.2em;color:var(--muted);margin-bottom:14px}
.school__catch{margin-top:clamp(36px,4vw,56px);font-size:clamp(30px,4.2vw,62px);font-weight:800;line-height:1.32;letter-spacing:-.005em;font-feature-settings:"palt"}
.school__catch em{font-style:normal;background:var(--grad-cool);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:gradShift 9s var(--ease-io) infinite alternate}
.ring{position:relative;width:min(100%,440px);aspect-ratio:1;justify-self:end}
.ring svg{width:100%;height:100%;overflow:visible}
.ring line{stroke:rgba(14,19,34,.14);stroke-width:2;stroke-linecap:round;transition:stroke .25s}
.ring__num{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px}
.ring__num b{font-size:clamp(72px,8vw,128px);font-weight:900;line-height:1;letter-spacing:-.04em;font-variant-numeric:tabular-nums}
.ring__num span{font-size:12px;font-weight:700;letter-spacing:.3em;color:var(--muted)}
.timeline{position:relative;margin-top:clamp(96px,10vw,150px)}
.timeline__rail{position:absolute;left:0;right:0;top:0;height:1px;background:var(--line)}
.timeline__rail span{position:absolute;inset:0;background:var(--grad);transform:scaleX(var(--p,0));transform-origin:left}
.timeline ol{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(20px,2.4vw,40px)}
.timeline li{position:relative;padding-top:40px}
.timeline li::before{content:"";position:absolute;left:0;top:-5px;width:11px;height:11px;border-radius:50%;background:var(--white);border:1.5px solid var(--fg)}
.timeline li:nth-child(2){transition-delay:.08s}.timeline li:nth-child(3){transition-delay:.16s}.timeline li:nth-child(4){transition-delay:.24s}
.timeline__when{font-size:12px;font-weight:700;letter-spacing:.16em;color:var(--blue)}
.timeline h3{margin-top:12px;font-size:clamp(20px,1.7vw,24px);font-weight:800;line-height:1.5}
.timeline li p:last-child{margin-top:10px;font-size:14px;line-height:1.95;color:var(--muted)}
.support{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(12px,1.4vw,20px);margin-top:clamp(80px,8vw,120px)}
.support li{padding:30px 28px 32px;border-radius:20px;background:var(--white);border:1px solid var(--line);box-shadow:0 20px 50px -34px rgba(14,19,34,.3);transition:transform .6s var(--ease),box-shadow .4s}
.support li:hover{transform:translateY(-6px);box-shadow:0 30px 60px -30px rgba(44,91,255,.35)}
.support li:nth-child(2){transition-delay:.06s}.support li:nth-child(3){transition-delay:.12s}.support li:nth-child(4){transition-delay:.18s}
.support p{font-size:12px;font-weight:700;letter-spacing:.12em;color:var(--blue)}
.support h3{margin-top:10px;font-size:26px;font-weight:800}
.support span{display:block;margin-top:10px;font-size:14px;line-height:1.85;color:var(--muted)}
.school__perk{display:grid;grid-template-columns:auto minmax(0,1fr);gap:clamp(24px,3vw,48px);align-items:center;margin-top:clamp(64px,7vw,100px);padding:clamp(28px,3vw,40px) 0;border-block:1px solid var(--line)}
.school__perk-num{font-size:clamp(72px,8vw,120px);font-weight:900;line-height:.9;letter-spacing:-.04em;background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent}
.school__perk-num small{font-size:.36em}
.school__perk p:last-child{font-size:clamp(15px,1.3vw,18px);line-height:2;max-width:36em}
.school__cta{display:flex;justify-content:space-between;align-items:center;gap:32px;flex-wrap:wrap;margin-top:clamp(56px,6vw,88px)}
.school__cta>p{font-size:14px;line-height:2;color:var(--muted)}
.school__btns{display:flex;gap:14px;flex-wrap:wrap}

/* お知らせ */
.news{padding:clamp(120px,14vw,200px) 0 clamp(80px,9vw,140px)}
.news__grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:clamp(40px,6vw,96px);align-items:start}
.news .text-link{margin-top:40px}
.news__list{border-bottom:1px solid var(--line)}
.news__item{position:relative;isolation:isolate}
.news__item:nth-child(2){transition-delay:.06s}.news__item:nth-child(3){transition-delay:.12s}.news__item:nth-child(4){transition-delay:.18s}
.news__tags{display:flex;gap:8px;flex-wrap:wrap}
.news__link{position:relative;display:grid;grid-template-columns:110px 150px minmax(0,1fr) 28px;align-items:center;gap:18px;padding:30px 12px 30px 0;border-top:1px solid var(--line);overflow:hidden}
.news__link::before{content:"";position:absolute;inset:0;background:var(--bg);transform:scaleY(0);transform-origin:bottom;transition:transform .5s var(--ease);z-index:-1}
.news__link:hover::before{transform:scaleY(1)}
.news__link time{font-family:var(--serif);font-size:15px;font-variant-numeric:tabular-nums}
.news__cat{font-size:11px;font-weight:700;letter-spacing:.1em;padding:4px 10px;border:1px solid var(--line);border-radius:999px;white-space:nowrap}
.news__draft{font-size:11px;font-weight:700;letter-spacing:.06em;padding:4px 10px;border-radius:999px;background:#ffe6dc;color:#9a2c0f;white-space:nowrap}
.news__title{font-size:16px;font-weight:700;line-height:1.7}
.news__arrow{transition:transform .4s var(--ease)}
.news__link:hover .news__arrow{transform:translateX(6px)}

/* 会社情報 */
.company{padding:clamp(110px,12vw,180px) 0}
.company__grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:clamp(40px,6vw,96px)}
.facts{border-bottom:1px solid var(--line)}
.facts div{display:grid;grid-template-columns:140px minmax(0,1fr);gap:24px;padding:26px 0;border-top:1px solid var(--line)}
.facts dt{font-size:13px;font-weight:700;letter-spacing:.1em;color:var(--muted);padding-top:3px}
.facts dd{font-size:16px;line-height:1.95}
.facts dd span{display:block;font-family:var(--serif);font-size:14px;color:var(--muted)}

/* お問い合わせ：明るい色のにじみ */
.contact{position:relative;isolation:isolate;overflow:hidden;padding:clamp(130px,15vw,220px) 0 clamp(100px,11vw,160px);background:radial-gradient(48% 60% at 8% 18%,rgba(44,91,255,.16),transparent 70%),radial-gradient(40% 55% at 92% 86%,rgba(255,90,61,.18),transparent 70%),radial-gradient(36% 40% at 62% 6%,rgba(255,194,26,.18),transparent 70%),radial-gradient(30% 40% at 40% 100%,rgba(31,200,255,.14),transparent 70%),var(--white)}
.contact__title .grad{background:var(--grad-warm);background-size:200% 100%;-webkit-background-clip:text;background-clip:text}
.contact__title{margin-top:32px;font-size:clamp(56px,10.4vw,176px);font-weight:900;line-height:1.04;letter-spacing:-.02em;font-feature-settings:"palt"}
.contact__row{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap;margin-top:clamp(48px,6vw,80px)}
.contact__row p{font-size:15px;line-height:2;color:var(--muted)}

/* フッター */
.footer{background:var(--white);color:var(--fg);padding:0 0 32px;border-top:1px solid var(--line);overflow:hidden}
.footer__top{display:flex;justify-content:space-between;align-items:center;gap:24px;flex-wrap:wrap;padding:36px 0}
.footer__nav{display:flex;flex-wrap:wrap;gap:8px 28px;font-size:13px;color:var(--muted)}
.footer__nav a:hover,.footer__top-link:hover{color:var(--fg)}
.footer__top-link{font-size:12px;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.footer__word{font-family:var(--serif);font-size:clamp(44px,12.9vw,232px);font-weight:600;line-height:.95;letter-spacing:-.035em;white-space:nowrap;color:transparent;-webkit-text-stroke:1px rgba(14,19,34,.2);background:var(--grad);-webkit-background-clip:text;background-clip:text;background-size:0% 100%;background-repeat:no-repeat;transition:background-size 1.4s var(--ease);margin-top:12px}
.footer__word:hover{background-size:100% 100%}
.footer__copy{margin-top:40px;font-size:12px;color:var(--muted);letter-spacing:.08em}

/* タブレット・スマホ */
@media (max-width:1080px){
  .tracks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .support{grid-template-columns:repeat(2,minmax(0,1fr))}
  .timeline ol{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:48px}
}
@media (max-width:900px){
  .school__top{grid-template-columns:1fr}
  .ring{justify-self:center;width:min(78vw,340px);margin-top:24px}
  .nav,.header__cta{display:none}
  .menu-btn{display:block}
  .header{height:64px}
  .hero__meta,.hero__scroll{display:none}
  .hero__foot{flex-direction:column;align-items:flex-start;gap:28px}
  .numbers__grid,.music__top,.news__grid,.company__grid,.sec-head--row,.numbers .sec-head{grid-template-columns:1fr}
  .numbers .sec-lead{margin-top:32px}
  .sec-head--row .sec-title{margin-top:0}
  .plaque{max-width:440px}
  .royalty{border-left:0;padding-left:0;border-top:1px solid var(--line);padding-top:32px}
  .steps{grid-template-columns:1fr}
  .index__row{grid-template-columns:44px minmax(0,1fr) 48px;row-gap:12px}
  .index__copy{grid-column:2/3;grid-row:2}
  .index__arrow{width:48px;height:48px;grid-row:1/3;grid-column:3}
  .timeline__rail{left:5px;right:auto;width:1px;height:100%;top:0}
  .timeline__rail span{transform:scaleY(var(--p,0));transform-origin:top}
  .timeline ol{grid-template-columns:1fr;row-gap:40px;padding-left:36px}
  .timeline li{padding-top:0}
  .timeline li::before{left:-36px;top:6px}
  .news__link{grid-template-columns:minmax(0,1fr) 20px;row-gap:10px}
  .news__link time,.news__tags{grid-column:1/2}
  .news__title{grid-column:1/2}
  .news__arrow{grid-column:2;grid-row:1/4}
}
@media (max-width:560px){
  body{font-size:15px}
  .hero__title{font-size:min(21vw,15vh)}
  .stats{grid-template-columns:1fr}
  .stat,.stat:nth-child(even){padding:30px 0 34px;border-left:0}
  .stat:nth-child(even)::before{left:0}
  .stat:nth-child(n+2){border-bottom:0}.stat:last-child{border-bottom:1px solid var(--line)}
  .tracks,.support{grid-template-columns:1fr}
  .school__perk{grid-template-columns:1fr;gap:12px}
  .facts div{grid-template-columns:1fr;gap:6px}
  .btn{padding:16px 24px}
  .btn--big{width:100%;justify-content:center}
  .drawer a{font-size:34px}
}

/* 動きを減らす設定 */
@media (prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation:none!important;transition:none!important}
  .js [data-reveal],.js [data-split] .ln>span,.js .hero__title .line>span{opacity:1!important;transform:none!important}
}

/* ───────── 2026-10-15 青と白の版（ユーザー：真っ白ではなく、青と白でアクセントを）。上の白の版に重ねて上書き ───────── */
/* 2026-10-15 夜 ユーザー：アクセントの青とオレンジをロゴと同じ色に。値はロゴ画像から測った色
   Sound Laplace：青 #0356fc → #0383fc → #0cacfb → 水色 #2bf0fc ／ 黄 #fccc12 → 橙 #fc982e・#fc7f35 → 赤 #fc3947・#fc1555
   ガリレオ：濃い青 #0352b9、星の橙 #fd7120 → #fda626 */
:root{--brand:#0356fc;--brand-deep:#0352b9;--sky:#e6efff;--sky-2:#f3f7ff;--accent:#fc7f35;
  --blue:#0356fc;--cyan:#2bf0fc;--sun:#fccc12;--coral:#fc7f35;--red:#fc1555;
  --grad:linear-gradient(100deg,#0352b9 0%,#0356fc 30%,#0383fc 55%,#0cacfb 78%,#2bf0fc 100%);
  --grad-cool:linear-gradient(100deg,#0352b9 0%,#0356fc 50%,#0383fc 100%);
  --grad-warm:linear-gradient(100deg,#fccc12 0%,#fc982e 30%,#fc7f35 50%,#fc3947 78%,#fc1555 100%);
  --panel:linear-gradient(135deg,#0352b9 0%,#0356fc 55%,#0a6ffc 100%);
  --panel-glow:radial-gradient(50% 60% at 92% 8%,rgba(43,240,252,.26),transparent 70%)}
.dot{background:var(--accent);box-shadow:0 0 0 0 rgba(252,127,53,.45)}
@keyframes pulse{70%{box-shadow:0 0 0 10px rgba(252,127,53,0)}100%{box-shadow:0 0 0 0 rgba(252,127,53,0)}}
.eyebrow::before{background:var(--brand)}
.header__cta,.btn--ink,.btn--big{background:var(--brand);color:#fff}
.header__cta:hover,.btn--ink:hover{box-shadow:0 0 0 6px rgba(3,86,252,.18)}
.nav a::after{background:var(--brand)}
.stat__value em,.timeline__when,.support p{color:var(--brand)}
.text-link::after{background:var(--brand)}

/* ヒーロー：淡い青 */
.hero{background:radial-gradient(44% 50% at 86% 10%,rgba(3,86,252,.18),transparent 70%),radial-gradient(40% 44% at 64% 100%,rgba(43,240,252,.22),transparent 70%),linear-gradient(180deg,#ffffff 0%,var(--sky) 100%)}
.hero::after{background:radial-gradient(110% 70% at 14% 6%,rgba(255,255,255,.95) 0%,rgba(255,255,255,.55) 45%,rgba(255,255,255,0) 70%),radial-gradient(60% 45% at 6% 100%,rgba(243,246,253,.92) 0%,rgba(243,246,253,0) 70%)}

/* 流れる帯：青の面に白い太字（2026-10-15 夜 ユーザー：白抜きの輪郭文字はダサい → 塗りの太字に）。区切りの星はロゴの暖色 */
.marquee{background:var(--panel);border-block:0}
.marquee__track{gap:clamp(22px,2.6vw,44px)}
.marquee span{font-family:var(--sans);font-size:clamp(30px,4.6vw,72px);font-weight:800;letter-spacing:-.025em;color:#fff;-webkit-text-stroke:0;font-feature-settings:"palt"}
.marquee b{font-size:clamp(20px,2.4vw,34px);background:var(--grad-warm);-webkit-background-clip:text;background-clip:text;color:transparent}

/* 実績・音楽・お知らせは白、会社情報は淡い青 */
.numbers,.music,.news{background:#fff}
.company{background:var(--sky-2)}

/* サービス：青一色 */
.services{background:var(--panel);color:#fff}
.services .eyebrow::before{background:#fff}
.services .eyebrow span,.index__no,.index__name small{color:rgba(255,255,255,.86)}
.index{border-bottom-color:rgba(255,255,255,.28)}
.index__row{border-top-color:rgba(255,255,255,.28)}
.index__row::before{background:linear-gradient(90deg,rgba(255,255,255,.10),rgba(255,255,255,.02))}
.index__arrow{border-color:rgba(255,255,255,.75)}
.index__row:hover .index__arrow{background:#fff;color:var(--brand)}
.preview{box-shadow:0 30px 70px -20px rgba(8,20,80,.55)}

/* 音楽：90% は青、試聴は青いカード */
.royalty__num,.school__perk-num{background:var(--grad-cool);background-size:200% 100%;-webkit-background-clip:text;background-clip:text}
.player{background:var(--panel);color:#fff;border:0;box-shadow:0 40px 90px -40px rgba(3,82,185,.7)}
.player::before{background:radial-gradient(50% 70% at 100% 0%,rgba(43,240,252,.35),transparent 70%)}
.player .eyebrow span,.player__now,.track__no,.track__time{color:rgba(255,255,255,.86)}
.track{border-top-color:rgba(255,255,255,.22)}
.track:hover{background:rgba(255,255,255,.08)}
.track__icon{border-color:rgba(255,255,255,.85)}
.track.is-playing .track__icon{background:#fff;border-color:#fff}
.track.is-playing .track__icon::before{background:linear-gradient(90deg,var(--brand) 0 3px,transparent 3px 7px,var(--brand) 7px 10px)}
.track.is-playing .track__title{background:none;-webkit-text-fill-color:currentColor;color:#fff;text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:6px}
.player__bar{background:rgba(255,255,255,.25)}
.player__bar span{background:#fff}

/* ガリレオ：淡い青 */
.school{background:linear-gradient(180deg,var(--sky) 0%,#f4f7ff 60%,#ffffff 100%)}
.school__glow{background:radial-gradient(40% 35% at 80% 16%,rgba(3,86,252,.18),transparent 70%),radial-gradient(26% 24% at 8% 80%,rgba(252,127,53,.10),transparent 70%)}
.ring line{stroke:rgba(3,86,252,.16)}
.timeline__rail span{background:var(--grad)}
.support li:hover{box-shadow:0 30px 60px -30px rgba(3,86,252,.45)}

/* お問い合わせ：青一色に白い文字、差し色はオレンジ */
.contact{background:radial-gradient(50% 60% at 90% 10%,rgba(43,240,252,.35),transparent 70%),radial-gradient(40% 50% at 10% 100%,rgba(252,127,53,.18),transparent 70%),var(--panel);color:#fff}
.contact .eyebrow::before{background:#fff}
.contact .eyebrow span,.contact__row p{color:rgba(255,255,255,.88)}
.contact__title .grad{background:linear-gradient(100deg,#fccc12 0%,#fc982e 55%,#fc7f35 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:none}  /* ロゴの暖色・黄→オレンジ（2026-10-16 ユーザーが見比べて決定。薄いピーチ色・濃いオレンジ一色より） */
.contact .btn--big{background:#fff;color:var(--brand)}
.contact .btn--big:hover{box-shadow:0 0 0 8px rgba(255,255,255,.18)}

/* フッター：白に青の輪郭文字 */
.footer__word{-webkit-text-stroke:1px rgba(3,86,252,.28);background:var(--grad);-webkit-background-clip:text;background-clip:text;background-size:0% 100%;background-repeat:no-repeat}
/* 会社情報・お知らせの見出しは細い列なので小さめに（4行に折れないように） */
.company .sec-title,.news .sec-title{font-size:clamp(36px,4.4vw,64px)}

/* ───────── 詳細ページ（2026-10-15〜）。トップと同じ部品を使い、足りないものだけここに足す ───────── */
:root{interpolate-size:allow-keywords}
html:has(.chapters){scroll-padding-top:150px}
.psec{position:relative;padding:clamp(110px,13vw,200px) 0;background:#fff}
.psec--sky{background:var(--sky-2)}
.psec--blue{background:var(--panel-glow),var(--panel);color:#fff}
.psec--blue .eyebrow::before{background:#fff}
.psec--blue .eyebrow span,.psec--blue .sec-lead,.psec--blue .fineprint{color:rgba(255,255,255,.88)}
.sec-head--split{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);column-gap:clamp(40px,6vw,104px);align-items:end}
.sec-head--split .eyebrow{grid-column:1/-1}
.sec-head--split .sec-lead{margin-top:0;padding-bottom:14px}
.nav a[aria-current=page]::after{transform:scaleX(1)}
.drawer a[aria-current=page]{color:var(--brand)}

/* 詳細ページのヒーロー：トップの波を低めに */
.hero--page,.hero--page .hero__inner{min-height:min(100vh,940px);min-height:min(100svh,940px)}
.hero--page .hero__inner{padding-top:clamp(108px,15vh,150px)}
.hero--page::after{background:linear-gradient(90deg,rgba(248,250,255,.94) 0%,rgba(248,250,255,.84) 40%,rgba(248,250,255,0) 70%),radial-gradient(110% 60% at 14% 0%,rgba(255,255,255,.9) 0%,rgba(255,255,255,0) 70%)}  /* 文字の後ろだけ波を薄く */
.crumbs{display:flex;align-items:center;gap:10px;margin-bottom:clamp(18px,3vh,30px);font-size:11px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}
.crumbs a:hover{color:var(--brand)}
.ptitle{font-size:clamp(64px,min(11.6vw,16vh),190px);margin-top:clamp(14px,2.4vh,30px)}
.ptitle__row{display:inline-flex!important;align-items:center;gap:clamp(16px,2vw,32px)}
.ptitle__row img{width:.74em;height:auto}  /* 影は行の枠で切れて四角が見えるので付けない */
.ptitle__row small{display:block;font-size:max(13px,.09em);font-weight:700;letter-spacing:.2em;color:var(--muted);margin-bottom:.5em;line-height:1.2}
.ptitle__catch{margin-top:clamp(22px,3.4vh,40px);font-size:clamp(26px,min(3.5vw,5vh),54px);font-weight:800;line-height:1.36;font-feature-settings:"palt";word-break:auto-phrase}
.ptitle__catch em{font-style:normal;background:var(--grad-cool);background-size:200% 100%;-webkit-background-clip:text;background-clip:text;color:transparent;animation:gradShift 9s var(--ease-io) infinite alternate}
.js .is-ready .hero .ptitle__catch{transition-delay:.36s}
.hero__actions{display:flex;gap:12px;flex-wrap:wrap}
.btn--ghost{background:rgba(255,255,255,.6);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}

/* このページの内容：囲みではなく、上に貼りつく細い帯。読んでいる所に線が付く */
.chapters{position:sticky;top:0;z-index:30;background:rgba(255,255,255,.88);backdrop-filter:blur(14px) saturate(160%);-webkit-backdrop-filter:blur(14px) saturate(160%);border-block:1px solid var(--line);transition:top .5s var(--ease)}
.header:not(.is-hidden) ~ main .chapters{top:76px}
.chapters ol{display:flex;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.chapters ol::-webkit-scrollbar{display:none}
.chapters li{flex:1 0 auto}
.chapters a{position:relative;display:flex;align-items:center;justify-content:center;gap:9px;padding:17px 14px;font-size:13px;font-weight:700;letter-spacing:.05em;white-space:nowrap;color:var(--muted);transition:color .3s}
.chapters a span{font-family:var(--serif);font-size:12px;font-weight:500;color:var(--brand)}
.chapters a::after{content:"";position:absolute;left:14px;right:14px;bottom:-1px;height:2px;background:var(--brand);transform:scaleX(0);transform-origin:left;transition:transform .5s var(--ease)}
.chapters a:hover,.chapters a.is-active{color:var(--fg)}
.chapters a.is-active::after{transform:scaleX(1)}

/* ガリレオとは：繰り返しの輪と、2つの進み方 */
.about__grid{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.05fr);gap:clamp(40px,6vw,104px);align-items:center;margin-top:clamp(64px,8vw,120px)}
.cycle{position:relative;width:min(100%,480px);aspect-ratio:1;margin:0 auto}
.cycle svg{width:100%;height:100%;overflow:visible}
.cycle__track{fill:none;stroke:rgba(3,86,252,.16);stroke-width:1.5}
.cycle__track--in{stroke-dasharray:2 8;stroke:rgba(3,86,252,.22)}
.cycle__spin{transform-box:fill-box;transform-origin:center;animation:cycleSpin 12s linear infinite}
.cycle__tail{fill:none;stroke:url(#cycleGrad);stroke-width:3;stroke-linecap:round;stroke-dasharray:157 785.5}
.cycle__dot{fill:var(--brand);filter:drop-shadow(0 0 8px rgba(3,86,252,.6))}
@keyframes cycleSpin{to{transform:rotate(360deg)}}
.cycle__nodes{position:absolute;inset:0}
.cycle__node{position:absolute;width:max-content;white-space:nowrap;display:flex;flex-direction:column;align-items:center;gap:2px;padding:12px 18px;border-radius:16px;background:#fff;border:1px solid var(--line);box-shadow:0 18px 40px -26px rgba(14,19,34,.35);font-size:clamp(14px,1.3vw,17px);font-weight:800;line-height:1.35;text-align:center;transform:translate(-50%,-50%);animation:nodeOn 12s linear infinite}
.cycle__node span{font-family:var(--serif);font-size:12px;font-weight:500;color:var(--brand)}
.cycle__node--1{left:50%;top:12.5%;animation-delay:0s}
.cycle__node--2{left:87.5%;top:50%;animation-delay:-9s}
.cycle__node--3{left:50%;top:87.5%;animation-delay:-6s}
.cycle__node--4{left:12.5%;top:50%;animation-delay:-3s}
@keyframes nodeOn{0%,10%{border-color:var(--brand);box-shadow:0 0 0 4px rgba(3,86,252,.14),0 18px 40px -26px rgba(3,86,252,.6)}20%,90%{border-color:var(--line);box-shadow:0 18px 40px -26px rgba(14,19,34,.35)}100%{border-color:var(--brand);box-shadow:0 0 0 4px rgba(3,86,252,.14),0 18px 40px -26px rgba(3,86,252,.6)}}
.cycle__center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font-size:clamp(15px,1.4vw,19px);font-weight:800;line-height:1.6}
.cycle__center small{font-size:11px;font-weight:700;letter-spacing:.3em;text-transform:uppercase;color:var(--brand);margin-bottom:6px}
.routes{display:grid;gap:clamp(14px,1.6vw,22px)}
.route{position:relative;padding:clamp(28px,3vw,44px);border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:0 26px 60px -40px rgba(14,19,34,.35);transition:transform .6s var(--ease),box-shadow .4s,opacity 1s var(--ease)}
.route:hover{transform:translateY(-4px);box-shadow:0 30px 60px -30px rgba(3,86,252,.4)}
.route:nth-child(2){transition-delay:.08s}
.route__no{position:absolute;right:clamp(22px,2.4vw,36px);top:clamp(14px,1.6vw,24px);font-family:var(--serif);font-size:clamp(48px,5vw,72px);line-height:1;color:rgba(3,86,252,.14)}
.route__for{font-size:12px;font-weight:700;letter-spacing:.12em;color:var(--brand)}
.route h3{margin-top:8px;font-size:clamp(24px,2.2vw,32px);font-weight:800;line-height:1.4}
.route>p:not(.route__for){margin-top:14px;font-size:15px;line-height:2;color:var(--muted)}
.ticks{margin-top:18px;display:grid;gap:8px}
.ticks li{position:relative;padding-left:24px;font-size:14.5px;line-height:1.85}
.ticks li::before{content:"";position:absolute;left:0;top:.8em;width:12px;height:2px;background:var(--brand)}
.pnote{margin-top:clamp(48px,5vw,72px);padding:22px 0 22px 26px;border-left:2px solid var(--accent);font-size:15px;line-height:2;color:var(--muted);max-width:62em}
.pnote b{display:block;color:var(--fg);font-size:16px}

/* 90日間の流れ：左の目盛りが、右の段落を読み進めた分だけ進む */
.flow__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:clamp(40px,6vw,120px);align-items:start}
.flow__aside{position:sticky;top:150px}
.flow .sec-title{font-size:clamp(36px,4.4vw,68px)}
.flow__ring{justify-self:start;width:min(100%,380px);margin-top:clamp(36px,4vw,56px)}
.phases{position:relative}
.phase{min-height:clamp(260px,42vh,420px);padding:clamp(40px,5vw,64px) 0;border-top:1px solid var(--line);transition:opacity .5s var(--ease)}
.phase:last-child{border-bottom:1px solid var(--line)}
.js .phase{opacity:.32}
.js .phase.is-active{opacity:1}
.phase__when{font-size:12px;font-weight:700;letter-spacing:.16em;color:var(--brand)}
.phase h3{margin-top:14px;font-size:clamp(26px,2.6vw,40px);font-weight:800;line-height:1.42;font-feature-settings:"palt"}
.phase p:last-child{margin-top:16px;font-size:16px;line-height:2;color:var(--muted)}
.weekly{margin-top:clamp(80px,9vw,140px)}
.weekly__title{font-size:clamp(24px,2.6vw,38px);font-weight:800}
.weekly__title em{font-style:normal;color:var(--brand)}
.weekly__steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(14px,2vw,32px);margin-top:28px}
.weekly__steps li{position:relative;padding:26px 24px 28px;border-radius:20px;background:#fff;border:1px solid var(--line);font-size:15px;font-weight:700;line-height:1.75}
.weekly__steps li:nth-child(2){transition-delay:.06s}.weekly__steps li:nth-child(3){transition-delay:.12s}.weekly__steps li:nth-child(4){transition-delay:.18s}
.weekly__steps span{display:grid;place-items:center;width:34px;height:34px;margin-bottom:14px;border-radius:50%;background:var(--brand);color:#fff;font-family:var(--serif);font-size:15px;font-weight:500}
.weekly__steps li:not(:last-child)::after{content:"→";position:absolute;right:calc(-1 * clamp(14px,2vw,32px) / 2);top:50%;transform:translate(50%,-50%);color:var(--brand);font-weight:700}
.weekly__steps li:last-child span{background:var(--accent)}

/* サポート：青の面に4つ */
.sups{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(14px,1.6vw,24px);margin-top:clamp(64px,7vw,104px)}
.sup{position:relative;padding:clamp(30px,3.4vw,52px);border-radius:26px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.24);transition:background .4s,transform .6s var(--ease),opacity 1s var(--ease)}
.sup:hover{background:rgba(255,255,255,.14);transform:translateY(-4px)}
.sup:nth-child(2){transition-delay:.06s}.sup:nth-child(3){transition-delay:.12s}.sup:nth-child(4){transition-delay:.18s}
.sup__no{position:absolute;right:clamp(24px,2.6vw,40px);top:clamp(22px,2.4vw,36px);font-family:var(--serif);font-size:15px;color:rgba(255,255,255,.7)}
.sup__meta{display:flex;align-items:center;gap:10px;font-size:12.5px;font-weight:700;letter-spacing:.1em}
.sup__meta::before{content:"";width:7px;height:7px;border-radius:50%;background:var(--accent)}
.sup h3{margin-top:14px;font-size:clamp(32px,3.2vw,48px);font-weight:800;line-height:1.2}
.sup>p:not(.sup__meta){margin-top:16px;font-size:15px;line-height:2;color:rgba(255,255,255,.92);max-width:32em}
.sup small{display:block;margin-top:12px;font-size:12.5px;line-height:1.8;color:rgba(255,255,255,.8)}
.supports .fineprint{margin-top:40px}

/* 教材：大きな文字の一覧 */
.materials__grid{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(40px,6vw,104px);align-items:start}
.materials .sec-title{font-size:clamp(34px,3.8vw,60px)}
.lessons{border-bottom:1px solid var(--line)}
.lessons li{display:grid;grid-template-columns:56px minmax(0,1fr) auto;align-items:baseline;gap:18px;padding:clamp(20px,2.2vw,28px) 0;border-top:1px solid var(--line);transition:padding .5s var(--ease),opacity 1s var(--ease),transform 1.2s var(--ease)}
.lessons li:hover{padding-left:14px}
.lessons__no{font-family:var(--serif);font-size:15px;color:var(--brand)}
.lessons b{font-size:clamp(24px,2.6vw,40px);font-weight:800;line-height:1.3;letter-spacing:.01em}
.lessons small{font-size:11px;font-weight:600;letter-spacing:.2em;text-transform:uppercase;color:var(--muted)}
.lessons li:first-child b{color:var(--brand)}
.keep{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:clamp(24px,6vw,104px);align-items:center;margin-top:clamp(72px,8vw,120px);padding-top:clamp(36px,4vw,56px);border-top:1px solid var(--line)}
.keep__big{font-size:clamp(28px,3vw,46px);font-weight:800;line-height:1.35}
.keep__big em{font-style:normal;color:var(--brand)}
.keep p:last-child{font-size:16px;line-height:2;color:var(--muted);max-width:34em}

/* 専用楽曲：90% と3つの事実 */
.gmusic .sec-title{font-size:clamp(36px,4.6vw,72px)}
.facts3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,48px);margin-top:clamp(64px,7vw,104px)}
.facts3 li{padding-top:24px;border-top:2px solid var(--fg)}
.facts3 li:nth-child(2){transition-delay:.08s}.facts3 li:nth-child(3){transition-delay:.16s;border-top-color:var(--accent)}
.facts3 b{display:block;font-size:clamp(19px,1.7vw,24px);font-weight:800;line-height:1.5}
.facts3 span{display:block;margin-top:10px;font-size:13.5px;line-height:1.95;color:var(--muted)}

/* 受講について */
.join__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,104px);align-items:start}
.join .sec-title{font-size:clamp(36px,4.4vw,68px)}
.join__lead{font-size:clamp(17px,1.5vw,20px);line-height:2.05;font-weight:500}
.join__common{margin-top:40px;padding:clamp(28px,3vw,40px);border-radius:24px;background:linear-gradient(135deg,var(--sky) 0%,#f7f9ff 100%)}
.join__common h3{font-size:14px;font-weight:700;letter-spacing:.12em;color:var(--brand)}
.checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 24px;margin-top:18px}
.checks li{position:relative;padding-left:30px;font-size:16px;font-weight:700;line-height:1.7}
.checks li::before{content:"";position:absolute;left:0;top:.28em;width:18px;height:18px;border-radius:50%;background:var(--brand) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 18 18'%3E%3Cpath d='M5 9.2l2.6 2.6L13 6.4' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/18px no-repeat}
.join__common>p{margin-top:20px;font-size:13.5px;line-height:1.9;color:var(--muted)}
.join .fineprint{margin-top:28px}

/* 受講までの流れ：番号の丸を縦の線でつなぐ（読み進めると線が伸びる） */
.entry__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,104px);align-items:start}
.entry .sec-title{font-size:clamp(32px,3.6vw,56px)}
.entry__steps{position:relative}
.entry__steps li:not(:last-child)::before,.entry__steps li:not(:last-child)::after{content:"";position:absolute;left:22px;top:22px;bottom:-22px;width:1px;background:var(--line)}
.entry__steps li:not(:last-child)::after{width:2px;margin-left:-.5px;background:linear-gradient(180deg,var(--brand),#0cacfb);transform:scaleY(clamp(0,calc(var(--p,0) * 4 - var(--i,0)),1));transform-origin:top}
.entry__steps li{position:relative;display:grid;grid-template-columns:44px minmax(0,1fr);gap:clamp(20px,2.4vw,32px);padding-bottom:clamp(32px,3.6vw,48px)}
.entry__steps li:last-child{padding-bottom:0}
.entry__no{position:relative;z-index:1;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:#fff;border:1.5px solid var(--brand);color:var(--brand);font-family:var(--serif);font-size:17px}
.entry__steps li:last-child .entry__no{background:var(--brand);color:#fff}
.entry__steps h3{padding-top:8px;font-size:clamp(19px,1.7vw,23px);font-weight:800;line-height:1.5}
.entry__steps li p{margin-top:8px;font-size:15px;line-height:2;color:var(--muted)}
.entry .fineprint{margin-top:40px;padding-left:calc(44px + clamp(20px,2.4vw,32px))}

/* よくある質問：開くと答えが下に伸びる */
.faq__grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.6fr);gap:clamp(40px,6vw,96px);align-items:start}
.faq .sec-title{font-size:clamp(36px,4.4vw,64px)}
.qa{border-top:1px solid var(--line)}
.qa:last-child{border-bottom:1px solid var(--line)}
.qa summary{display:grid;grid-template-columns:32px minmax(0,1fr) 30px;align-items:center;gap:16px;padding:26px 0;cursor:pointer;list-style:none;font-size:clamp(16px,1.35vw,19px);font-weight:700;line-height:1.6;transition:color .3s}
.qa summary::-webkit-details-marker{display:none}
.qa summary:hover{color:var(--brand)}
.qa__q{font-family:var(--serif);font-size:22px;font-weight:500;color:var(--brand);line-height:1}
.qa summary i{position:relative;width:30px;height:30px;border-radius:50%;border:1px solid var(--line-strong);transition:background .3s,border-color .3s}
.qa summary i::before,.qa summary i::after{content:"";position:absolute;left:8px;right:8px;top:50%;height:1.5px;margin-top:-.75px;background:currentColor;transition:transform .45s var(--ease)}
.qa summary i::after{transform:rotate(90deg)}
.qa[open] summary i{background:var(--brand);border-color:var(--brand);color:#fff}
.qa[open] summary i::after{transform:rotate(0)}
.qa::details-content{block-size:0;overflow:hidden;transition:block-size .5s var(--ease),content-visibility .5s allow-discrete}
.qa[open]::details-content{block-size:auto}
.qa__a{padding:0 46px 28px 48px}
.qa__a p{font-size:15px;line-height:2.05;color:var(--muted)}

/* 終わりの呼びかけ：ボタン2つ */
.contact__btns{display:flex;gap:14px;flex-wrap:wrap}
.btn--line{border:1px solid rgba(255,255,255,.7);color:#fff;padding:26px 36px;font-size:17px}
.btn--line:hover{background:#fff;color:var(--brand)}
.btn--line:hover i{transform:translateX(5px)}

@media (max-width:1080px){
  .weekly__steps{grid-template-columns:repeat(2,minmax(0,1fr))}
  .weekly__steps li:nth-child(2)::after{display:none}
  .facts3{grid-template-columns:1fr}
}
@media (max-width:900px){
  .header:not(.is-hidden) ~ main .chapters{top:64px}
  html:has(.chapters){scroll-padding-top:130px}
  .chapters li{flex:0 0 auto}
  .chapters a{padding:14px 12px}
  .sec-head--split{grid-template-columns:1fr}
  .sec-head--split .sec-lead{margin-top:32px}
  .about__grid,.flow__grid,.materials__grid,.join__grid,.entry__grid,.faq__grid,.keep{grid-template-columns:1fr}
  .cycle{width:min(100%,400px)}
  .flow__aside{position:static}
  .flow__ring{display:none}
  .phase{min-height:0;padding:32px 0}
  .js .phase{opacity:1}
  .sups{grid-template-columns:1fr}
}
@media (max-width:560px){
  .hero--page,.hero--page .hero__inner{min-height:0}
  .hero--page .hero__inner{padding-bottom:240px}
  .hero--page .hero__field{--wave-band:200px}
  .hero--page::after{background:linear-gradient(180deg,rgba(248,250,255,0) 0%,rgba(248,250,255,0) 100%)}
  .ptitle__row small{letter-spacing:.12em}
  .cycle__node{padding:9px 12px;font-size:13px;border-radius:12px}
  .cycle__center{font-size:13px}
  .cycle__center small{font-size:10px}
  .weekly__steps{grid-template-columns:1fr}
  .weekly__steps li::after{display:none}
  .checks{grid-template-columns:1fr}
  .qa summary{grid-template-columns:24px minmax(0,1fr) 28px;gap:12px}
  .qa__a{padding:0 0 26px 36px}
  .entry .fineprint{padding-left:0}
  .btn--line{width:100%;justify-content:center;padding:18px 24px}
  .contact__btns{width:100%}
}
@media (prefers-reduced-motion:reduce){
  .js .phase{opacity:1}
}

/* ───────── 音楽のページ ───────── */
.sec-title--m{font-size:clamp(36px,4.6vw,72px)}
.ptitle--text{font-size:clamp(44px,min(7.4vw,11vh),124px);line-height:1.12}
.ptitle--text .line{padding-bottom:.08em}
.inline-link{color:var(--brand);text-decoration:underline;text-underline-offset:4px}
.page--music .contact__title{font-size:clamp(40px,6.6vw,112px)}

/* 収益が届くまで：4つの点を線でつなぐ。線の上を光が流れる */
.route-map{position:relative;overflow:hidden;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:clamp(16px,2vw,28px);margin-top:clamp(72px,8vw,120px);padding-top:56px}
.route-map::before{content:"";position:absolute;left:0;right:0;top:20px;height:2px;background:linear-gradient(90deg,var(--line) 0 100%)}
.route-map::after{content:"";position:absolute;left:0;top:19px;width:22%;height:4px;border-radius:4px;background:linear-gradient(90deg,rgba(3,86,252,0),var(--brand),#0cacfb);animation:routeFlow 4.8s var(--ease-io) infinite}
@keyframes routeFlow{0%{transform:translateX(-30%);opacity:0}12%{opacity:1}88%{opacity:1}100%{transform:translateX(380%);opacity:0}}
.route-map li{position:relative}
.route-map li::before{content:"";position:absolute;left:0;top:-44px;width:14px;height:14px;border-radius:50%;background:#fff;border:2px solid var(--brand)}
.route-map li.is-goal::before{background:var(--accent);border-color:var(--accent);box-shadow:0 0 0 6px rgba(252,127,53,.18)}
.route-map span{font-family:var(--serif);font-size:13px;color:var(--brand)}
.route-map b{display:block;margin-top:6px;font-size:clamp(16px,1.4vw,19px);font-weight:800;line-height:1.55}
.route-map small{display:block;margin-top:6px;font-size:12.5px;color:var(--muted)}
.route-map .is-goal b{color:var(--brand)}
.svc-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(32px,5vw,88px);margin-top:clamp(72px,8vw,112px);padding-top:clamp(40px,4vw,56px);border-top:1px solid var(--line)}
.svc-h{font-size:clamp(22px,2vw,28px);font-weight:800;line-height:1.5}
.svc-p{margin-top:14px;font-size:15.5px;line-height:2;color:var(--muted)}
.unit{padding:clamp(28px,3vw,44px);border-radius:24px;background:linear-gradient(135deg,var(--sky) 0%,#f7faff 100%)}
.unit__label{font-size:13px;font-weight:700;letter-spacing:.1em;color:var(--brand)}
.unit__value{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 6px;margin-top:14px;font-size:clamp(48px,5.4vw,84px);font-weight:800;line-height:1.05;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.unit__value small{flex-basis:100%;font-size:15px;font-weight:700;letter-spacing:.04em;color:var(--fg)}
.unit__value i{font-style:normal;font-size:.5em;font-weight:700}
.unit__value em{font-style:normal;font-size:.3em;font-weight:700;color:var(--brand)}
.unit__note{margin-top:16px;font-size:12.5px;line-height:1.9;color:var(--muted)}

/* 3つの特徴（青の面） */
.sups--3{grid-template-columns:repeat(3,minmax(0,1fr))}
.sups--3 .sup h3{font-size:clamp(26px,2.4vw,36px);line-height:1.38}

/* サービス詳細：番号つきの行 */
.rows{margin-top:clamp(64px,7vw,104px);border-bottom:1px solid var(--line)}
.rows li{display:grid;grid-template-columns:72px minmax(0,1fr) minmax(0,1.15fr);gap:clamp(20px,3vw,48px);padding:clamp(36px,4vw,56px) 0;border-top:1px solid var(--line)}
.rows li:nth-child(2){transition-delay:.06s}.rows li:nth-child(3){transition-delay:.12s}
.rows__no{font-family:var(--serif);font-size:clamp(36px,3.4vw,52px);line-height:1;color:var(--brand)}
.rows__head p{font-size:12px;font-weight:700;letter-spacing:.16em;color:var(--brand)}
.rows__head h3{margin-top:8px;font-size:clamp(22px,2.2vw,32px);font-weight:800;line-height:1.45}
.rows__body p{font-size:15.5px;line-height:2.05;color:var(--muted)}
.rows__body p+p{margin-top:12px}

/* 試聴：トップと同じ青いカード */
.player--page{margin-top:clamp(56px,6vw,88px)}

/* 活用実績：大きな数字3つ */
.bign{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));margin-top:clamp(56px,6vw,96px);border-block:1px solid var(--line)}
.bign li{position:relative;padding:clamp(32px,3.4vw,48px) clamp(20px,2.4vw,36px) clamp(36px,3.6vw,52px)}
.bign li:first-child{padding-left:0}
.bign li+li{border-left:1px solid var(--line)}
.bign li:nth-child(2){transition-delay:.08s}.bign li:nth-child(3){transition-delay:.16s}
.bign__label{font-size:14px;font-weight:700;letter-spacing:.04em;word-break:auto-phrase}
.bign__label span{display:inline-block}
.bign__value{display:flex;align-items:baseline;gap:4px;margin-top:20px;font-size:clamp(60px,6.6vw,108px);font-weight:800;line-height:1;letter-spacing:-.035em;font-variant-numeric:tabular-nums}
.bign__value small{font-size:.26em;font-weight:700;letter-spacing:0}
.bign__value em{font-style:normal;font-size:.22em;font-weight:700;letter-spacing:.02em;margin-left:6px;color:var(--brand)}
.bign__value--words{display:block;font-size:clamp(26px,2.6vw,40px);line-height:1.4;letter-spacing:0}
.bign__note{margin-top:16px;font-size:12.5px;line-height:1.7;color:var(--muted)}

/* 提携クリエイター：写真は使わず、名前と登録者数を大きく */
.creators{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,24px);margin-top:clamp(56px,6vw,96px)}
.creators li{position:relative;display:flex;flex-direction:column;overflow:hidden;padding:clamp(28px,3vw,44px);border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:0 26px 60px -40px rgba(14,19,34,.35);transition:transform .6s var(--ease),box-shadow .4s,opacity 1s var(--ease)}
.creators li::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--grad)}
.creators li:hover{transform:translateY(-4px);box-shadow:0 30px 60px -30px rgba(3,86,252,.4)}
.creators li:nth-child(2){transition-delay:.08s}.creators li:nth-child(3){transition-delay:.16s}
.creators__name{font-size:clamp(20px,1.8vw,26px);font-weight:800;line-height:1.45}
.creators__name small{display:block;font-size:13px;font-weight:600;color:var(--muted)}
.creators__id{margin-top:4px;font-family:var(--serif);font-size:14px;color:var(--muted)}
.creators__count{display:flex;align-items:baseline;gap:4px;margin-top:auto;padding-top:clamp(28px,3vw,44px);font-size:clamp(52px,5vw,80px);font-weight:800;line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.creators__count em{font-style:normal;font-size:.28em;font-weight:700;color:var(--brand)}
.creators__label{margin-top:8px;font-size:12.5px;color:var(--muted)}

@media (max-width:1080px){
  .sups--3{grid-template-columns:1fr}
  .creators{grid-template-columns:1fr}
}
@media (max-width:900px){
  .route-map{grid-template-columns:1fr;gap:28px;padding-top:0;padding-left:40px}
  .route-map::before{left:6px;right:auto;top:8px;bottom:8px;width:2px;height:auto}
  .route-map::after{display:none}
  .route-map li::before{left:-40px;top:4px}
  .svc-grid{grid-template-columns:1fr}
  .rows li{grid-template-columns:52px minmax(0,1fr)}
  .rows__body{grid-column:2}
  .bign{grid-template-columns:1fr}
  .bign li{padding-left:0;padding-right:0}
  .bign li+li{border-left:0;border-top:1px solid var(--line)}
}
@media (max-width:560px){
  .ptitle--text{font-size:clamp(34px,9.4vw,48px)}
  .unit__value{font-size:44px}
}

/* ───────── 会社・お問い合わせ・プライバシーポリシー・お知らせ（低めのヒーロー＋読み物） ───────── */
.hero--compact,.hero--compact .hero__inner{min-height:0}
.hero--compact{border-bottom:1px solid var(--line)}
.hero--compact .hero__inner{padding-bottom:clamp(220px,28vh,270px)}
.hero--compact .hero__field{--wave-band:190px}
.hero--compact::after{background:linear-gradient(180deg,rgba(248,250,255,.0) 0%,rgba(248,250,255,0) 100%)}
.ptitle--en{font-size:clamp(64px,min(10.4vw,15vh),172px);letter-spacing:-.035em}
.ptitle--en small{display:block;font-size:max(13px,.085em);font-weight:700;letter-spacing:.2em;color:var(--muted);margin-bottom:.6em;line-height:1.2}
.hero--compact .ptitle__catch{margin-top:clamp(16px,2.6vh,28px);font-size:clamp(22px,min(2.6vw,4vh),40px)}
mark.tbd{background:#fff1c2;color:#7a4d00;border-radius:4px;padding:0 .2em}

/* 会社情報 */
.co-intro__grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(40px,6vw,104px);align-items:end}
.co-intro__body .svc-p{margin-top:24px}
.biz{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(14px,1.6vw,24px);margin-top:clamp(64px,7vw,104px)}
.biz li:nth-child(2){transition-delay:.08s}.biz li:nth-child(3){transition-delay:.16s}
.biz__card{position:relative;display:block;height:100%;padding:clamp(28px,3vw,44px) clamp(28px,3vw,44px) clamp(72px,7vw,96px);border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:0 26px 60px -40px rgba(14,19,34,.35);overflow:hidden;isolation:isolate;transition:transform .6s var(--ease),box-shadow .4s,color .4s}
.biz__card::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--panel);opacity:0;transition:opacity .5s}
.biz__card:hover{transform:translateY(-4px);color:#fff;box-shadow:0 30px 60px -30px rgba(3,86,252,.5)}
.biz__card:hover::before{opacity:1}
.biz__no{font-family:var(--serif);font-size:14px;color:var(--brand);transition:color .4s}
.biz__en{margin-top:18px;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--muted);transition:color .4s}
.biz__card h3{margin-top:6px;font-size:clamp(26px,2.4vw,36px);font-weight:800}
.biz__card>p:not(.biz__en){margin-top:12px;font-size:14.5px;line-height:1.95;color:var(--muted);transition:color .4s}
.biz__card i{position:absolute;right:clamp(24px,2.6vw,40px);bottom:clamp(24px,2.6vw,36px);display:grid;place-items:center;width:48px;height:48px;border-radius:50%;border:1px solid var(--line-strong);font-style:normal;transition:background .4s,color .4s,border-color .4s,transform .6s var(--ease)}
.biz__card:hover .biz__no,.biz__card:hover .biz__en,.biz__card:hover>p:not(.biz__en){color:rgba(255,255,255,.88)}
.biz__card:hover i{background:#fff;color:var(--brand);border-color:#fff;transform:rotate(-45deg)}
.facts--page dd small{display:block;margin-top:2px;font-size:13px;color:var(--muted)}

/* お問い合わせ：左に案内、右にフォーム */
.form-grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:clamp(40px,6vw,104px);align-items:start}
.form-aside{position:sticky;top:110px}
.form-aside .join__lead{margin-top:28px}
.form-info{margin-top:32px;border-top:1px solid var(--line)}
.form-info div{display:grid;grid-template-columns:96px minmax(0,1fr);gap:16px;padding:18px 0;border-bottom:1px solid var(--line)}
.form-info dt{font-size:13px;font-weight:700;letter-spacing:.08em;color:var(--muted)}
.form-info dd{margin:0;font-size:15px;line-height:1.8}
.form-galileo{margin-top:32px;padding:24px 26px;border-radius:20px;background:var(--sky)}
.form-galileo__label{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:800}
.form-galileo p:last-child{margin-top:10px;font-size:14px;line-height:1.9;color:var(--muted)}
.form{display:grid;gap:26px;padding:clamp(28px,3.6vw,56px);border-radius:28px;background:#fff;border:1px solid var(--line);box-shadow:0 40px 90px -60px rgba(14,19,34,.45)}
.form__preview{padding:14px 18px;border-radius:14px;background:#fff1c2;color:#6b4500;font-size:13px;line-height:1.8}
.form fieldset{margin:0;padding:0;border:0}
.form legend,.field__label{display:flex;align-items:center;gap:10px;font-size:14px;font-weight:700;margin-bottom:10px}
.req,.opt,.cond{font-size:11px;font-weight:700;letter-spacing:.06em;padding:2px 8px;border-radius:999px;white-space:nowrap}
.req{background:var(--brand);color:#fff}
.opt{background:rgba(14,19,34,.06);color:var(--muted)}
.cond{background:var(--sky);color:var(--brand)}
.form__kinds{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.form__kinds legend{grid-column:1/-1}
.kind{position:relative;cursor:pointer}
.kind input{position:absolute;opacity:0;pointer-events:none}
.kind span{display:block;height:100%;padding:16px 18px;border-radius:16px;border:1.5px solid var(--line);transition:border-color .3s,background .3s,box-shadow .3s}
.kind b{display:block;font-size:15px;font-weight:800}
.kind small{display:block;margin-top:2px;font-size:12px;color:var(--muted)}
.kind:hover span{border-color:rgba(3,86,252,.45)}
.kind input:checked+span{border-color:var(--brand);background:var(--sky-2);box-shadow:0 0 0 4px rgba(3,86,252,.12)}
.kind input:focus-visible+span{outline:2px solid var(--brand);outline-offset:3px}
.form__row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.field{display:block}
.field input,.field textarea{display:block;width:100%;font:inherit;font-size:16px;color:var(--fg);padding:14px 16px;border-radius:14px;border:1.5px solid var(--line);background:#fbfcff;transition:border-color .3s,box-shadow .3s,background .3s}
.field textarea{resize:vertical;line-height:1.8}
.field input::placeholder{color:#9aa0ad}
.field input:focus,.field textarea:focus{outline:0;border-color:var(--brand);background:#fff;box-shadow:0 0 0 4px rgba(3,86,252,.12)}
.field__hint{display:block;margin-top:8px;font-size:12.5px;line-height:1.8;color:var(--muted)}
.agree{display:flex;align-items:center;gap:12px;font-size:14.5px;font-weight:600}
.agree input{width:20px;height:20px;accent-color:var(--brand)}
.agree .req{margin-left:8px}
.form__submit{justify-self:start;opacity:.55;cursor:not-allowed}

/* プライバシーポリシー：左に条の一覧（読んでいる条に印）、右に本文 */
.doc-grid{display:grid;grid-template-columns:minmax(0,.62fr) minmax(0,1.38fr);gap:clamp(40px,6vw,104px);align-items:start}
.doc-toc{position:sticky;top:110px;max-height:calc(100vh - 140px);overflow:auto;scrollbar-width:thin}
.doc-toc ol{margin-top:18px;border-top:1px solid var(--line)}
.doc-toc a{position:relative;display:block;padding:11px 0 11px 18px;border-bottom:1px solid var(--line);font-size:13px;font-weight:700;line-height:1.5;color:var(--muted);transition:color .3s}
.doc-toc a span{display:block;font-weight:500;font-size:12.5px}
.doc-toc a::before{content:"";position:absolute;left:0;top:50%;width:6px;height:6px;margin-top:-3px;border-radius:50%;background:var(--line);transition:background .3s,transform .3s}
.doc-toc a:hover,.doc-toc a.is-active{color:var(--fg)}
.doc-toc a.is-active::before{background:var(--brand);transform:scale(1.4)}
.doc{max-width:46em}
.doc__preview{margin-bottom:36px;padding:14px 18px;border-radius:14px;background:#fff1c2;color:#6b4500;font-size:13px;line-height:1.8}
.doc>p,.doc li{font-size:15.5px;line-height:2.05}
.doc h2{margin-top:56px;padding-top:28px;border-top:1px solid var(--line);font-size:clamp(19px,1.6vw,22px);font-weight:800;line-height:1.5;scroll-margin-top:110px}
.doc h2+p,.doc h2+ul,.doc h2+ol{margin-top:14px}
.doc ul,.doc ol{display:grid;gap:8px;margin-top:14px}
.doc ul li{position:relative;padding-left:22px}
.doc ul li::before{content:"";position:absolute;left:0;top:.95em;width:10px;height:2px;background:var(--brand)}
.doc ol{counter-reset:n}
.doc ol li{position:relative;padding-left:34px;counter-increment:n}
.doc ol li::before{content:counter(n);position:absolute;left:0;top:.35em;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:var(--sky);color:var(--brand);font-family:var(--serif);font-size:12px;line-height:1}
.doc a{color:var(--brand);text-decoration:underline;text-underline-offset:4px}
.doc__dates{margin-top:56px;padding-top:28px;border-top:1px solid var(--line);color:var(--muted)}

/* お知らせ */
.news--page{padding-top:clamp(90px,10vw,150px)}
.news__count{margin-top:18px;font-size:14px;color:var(--muted)}
.news__count b{font-size:clamp(48px,5vw,80px);font-weight:800;color:var(--fg);letter-spacing:-.03em;margin-right:6px}
.article__meta{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-top:clamp(20px,3vh,32px)}
.article__meta time{font-family:var(--serif);font-size:16px;font-variant-numeric:tabular-nums}
.article__title{margin-top:18px;max-width:20em;font-size:clamp(30px,4vw,60px);font-weight:800;line-height:1.35;font-feature-settings:"palt";word-break:auto-phrase}
.article-sec{padding-top:clamp(64px,7vw,104px)}
.article{max-width:760px;margin-inline:auto}
.article__note{margin-bottom:32px;padding:14px 18px;border-radius:14px;background:#fff1c2;color:#6b4500;font-size:13px;line-height:1.8}
.article__body p{font-size:16.5px;line-height:2.15}
.article__body p+p{margin-top:1.2em}
.article__rel{margin-top:36px}
.article__adj{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;margin-top:clamp(56px,6vw,88px);padding-top:32px;border-top:1px solid var(--line)}
.adj{display:block;padding:20px 22px;border-radius:18px;border:1px solid var(--line);font-size:14.5px;font-weight:700;line-height:1.7;transition:border-color .3s,background .3s}
.adj span{display:block;margin-bottom:4px;font-size:12px;font-weight:600;color:var(--brand)}
.adj:hover{border-color:var(--brand);background:var(--sky-2)}
.adj--old{grid-column:2;text-align:right}
.article .text-link{margin-top:40px}

@media (max-width:900px){
  .co-intro__grid,.form-grid,.doc-grid{grid-template-columns:1fr}
  .biz{grid-template-columns:1fr}
  .form-aside,.doc-toc{position:static;max-height:none}
  .doc-toc ol{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:20px}
}
@media (max-width:560px){
  .hero--compact .hero__inner{padding-bottom:180px}
  .hero--compact .hero__field{--wave-band:160px}
  .ptitle--en{font-size:clamp(52px,16vw,72px)}
  .form__kinds,.form__row{grid-template-columns:1fr}
  .form{padding:24px 18px;border-radius:22px}
  .doc-toc ol{grid-template-columns:1fr}
  .article__adj{grid-template-columns:1fr}
  .adj--old{grid-column:auto}
}

/* ───────── 写真・アイコン（2026-10-15 夜 ユーザー：元の写真やアイコンは、新しいデザインでも入れる） ───────── */
/* 大きな写真：読み進めると枠が広がり、写真が少し引いていく（--r は main.js が 0→1） */
.photo-sec{position:relative;padding:clamp(72px,8vw,128px) 0 0;background:#fff}
.photo-reveal{margin:0}
.photo-reveal__frame{position:relative;overflow:hidden;aspect-ratio:21/9;border-radius:clamp(20px,2.4vw,32px);background:var(--sky);clip-path:inset(calc((1 - var(--r,1)) * 7%) calc((1 - var(--r,1)) * 11%) round clamp(20px,2.4vw,32px))}
.photo-reveal__frame img{width:100%;height:100%;object-fit:cover;transform:scale(calc(1.16 - var(--r,1) * .16));transform-origin:50% 60%}
.photo-reveal figcaption{display:flex;align-items:baseline;gap:14px;margin-top:16px;font-size:12.5px;color:var(--muted)}
.photo-reveal figcaption span{font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--brand)}

/* サービス一覧（トップ）：写真をいつも見せる（重ねたときに付いてくる写真はやめた） */
.index__row{grid-template-columns:72px minmax(0,1.1fr) minmax(0,1fr) clamp(150px,15vw,230px) 64px}
.index__thumb{display:block;aspect-ratio:16/10;border-radius:14px;overflow:hidden;box-shadow:0 22px 44px -26px rgba(0,10,60,.6)}
.index__thumb img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.index__row:hover .index__thumb img{transform:scale(1.07)}

/* 試聴：曲名の横にジャケット、再生中はジャケットが回る */
.track{grid-template-columns:30px 44px minmax(0,1fr) auto 28px}
.track__art{width:44px;height:44px;border-radius:10px;object-fit:cover;box-shadow:0 10px 20px -12px rgba(0,0,0,.6);transition:transform .4s var(--ease)}
.track:hover .track__art,.track.is-playing .track__art{transform:scale(1.06)}
.player__now{display:flex;align-items:center;gap:12px}
.player__art{width:40px;height:40px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 3px rgba(255,255,255,.35);animation:spin 8s linear infinite}
.player__art[hidden]{display:none}
.player__art.is-paused{animation-play-state:paused}
@keyframes spin{to{transform:rotate(360deg)}}

/* 音楽：サービス詳細の行に写真と円グラフ */
.rows li{grid-template-columns:72px minmax(0,.9fr) minmax(0,1fr) clamp(200px,20vw,300px)}
.rows__img{margin:0;align-self:start;aspect-ratio:3/2;border-radius:18px;overflow:hidden;background:#fff;box-shadow:0 24px 50px -34px rgba(14,19,34,.5)}
.rows__img img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}
.rows li:hover .rows__img img{transform:scale(1.05)}
.rows__img--pie{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:1px solid var(--line);box-shadow:none}
.rows__img--pie svg{width:58%;height:auto;overflow:visible}
.rows__img--pie figcaption{font-size:11.5px;color:var(--muted)}
.pie__t1{font-family:var(--sans);font-size:15px;font-weight:700;fill:var(--muted)}
.pie__t2{font-family:var(--sans);font-size:34px;font-weight:800;fill:var(--fg)}
.js .rows .pie__val{stroke-dashoffset:90;transition:stroke-dashoffset 1.8s var(--ease) .35s}
.rows li.is-in .pie__val{stroke-dashoffset:0}

/* 提携クリエイター：アイコン */
.creators__icon{width:72px;height:72px;margin-bottom:22px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 4px #fff,0 0 0 5px var(--line),0 16px 30px -18px rgba(14,19,34,.5)}

/* ガリレオ：受講までの流れの中のリンク */
.step-link{display:inline-flex;align-items:center;gap:10px;margin-top:14px;padding:10px 18px;border-radius:999px;background:var(--brand);color:#fff;font-size:13.5px;font-weight:700;letter-spacing:.04em;transition:box-shadow .3s}
.step-link:hover{box-shadow:0 0 0 5px rgba(3,86,252,.16)}
.step-link i{font-style:normal}

@media (max-width:900px){
  .photo-reveal__frame{aspect-ratio:4/3}
  .index__row{grid-template-columns:44px minmax(0,1fr) 48px}
  .index__thumb{grid-column:2/4;grid-row:3;margin-top:6px}
  .rows li{grid-template-columns:52px minmax(0,1fr)}
  .rows__img{grid-column:2;width:100%;max-width:440px}
}
@media (max-width:560px){
  .track{grid-template-columns:24px 40px minmax(0,1fr) auto 28px;gap:10px}
  .track__art{width:40px;height:40px}
}
@media (prefers-reduced-motion:reduce){
  .js .rows .pie__val{stroke-dashoffset:0}
}

/* ───────── 2026-10-15 深夜の直し ───────── */
/* 提携クリエイター：カードが左右に流れる（元のHPと同じ作り）。マウスで引っ張る・矢印・止めるボタン */
.cr{margin-top:28px}
.cr__viewport{overflow-x:auto;overflow-y:hidden;scrollbar-width:none;cursor:grab;overscroll-behavior-x:contain;touch-action:pan-x pan-y;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent 100%);mask-image:linear-gradient(90deg,transparent 0,#000 5%,#000 95%,transparent 100%)}
.cr__viewport::-webkit-scrollbar{display:none}
.cr__viewport.is-dragging{cursor:grabbing}
.cr__track{display:flex;gap:24px;width:max-content;padding:10px 0 30px}
.cr__card{position:relative;flex:0 0 auto;width:400px;display:grid;grid-template-columns:80px minmax(0,1fr);gap:4px 20px;align-items:center;padding:28px;border-radius:24px;background:#fff;border:1px solid var(--line);box-shadow:0 22px 50px -36px rgba(14,19,34,.42);overflow:hidden;user-select:none;-webkit-user-select:none}
.cr__card::before{content:"";position:absolute;left:0;right:0;top:0;height:4px;background:var(--grad)}
.cr__icon{width:80px;height:80px;border-radius:50%;object-fit:cover;box-shadow:0 0 0 4px #fff,0 0 0 5px var(--line);-webkit-user-drag:none}
.cr__name{font-size:19px;font-weight:800;line-height:1.45;word-break:auto-phrase}
.cr__id{margin-top:2px;font-family:var(--serif);font-size:13.5px;color:var(--muted)}
.cr__count{grid-column:1/-1;display:flex;align-items:baseline;gap:6px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.cr__count small{margin-right:auto;font-size:12.5px;color:var(--muted)}
.cr__count b{font-size:44px;font-weight:800;line-height:1;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.cr__count em{font-style:normal;font-size:14px;font-weight:700;color:var(--brand)}
.cr__nav{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:6px}
.cr__nav[hidden]{display:none}
.cr__btn{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;border:1px solid var(--line-strong);transition:background .3s,color .3s,border-color .3s}
.cr__btn:hover{background:var(--brand);border-color:var(--brand);color:#fff}
.cr__toggle{padding:11px 20px;border-radius:999px;border:1px solid var(--line);font-size:13px;font-weight:700;transition:border-color .3s}
.cr__toggle:hover{border-color:var(--brand)}
.partners .cr{margin-top:20px}

/* 最新のお知らせ：流れる帯のすぐ下に1件だけ */
.latest{background:#fff;border-bottom:1px solid var(--line)}
.latest__link{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 16px;padding:18px 0 20px;font-size:14.5px}
.latest__label{flex-basis:100%;display:flex;align-items:center;justify-content:center;white-space:nowrap;font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--brand)}
.latest__link time{font-family:var(--serif);font-size:15px;font-variant-numeric:tabular-nums;white-space:nowrap}
.latest__title{flex:0 1 auto;min-width:0;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;transition:color .3s}
.latest__arrow{transition:transform .4s var(--ease)}
.latest__link:hover .latest__title{color:var(--brand)}
.latest__link:hover .latest__arrow{transform:translateX(6px)}

/* ロゴの読み（サウンドラプラス）を社名の下に小さく */
.brand__text{display:inline-grid;gap:5px}  /* 読みの幅を社名に合わせ、両端をそろえる */
.brand__kana{font-size:10px;font-weight:600;letter-spacing:0;line-height:1;color:var(--muted);text-align:justify;text-align-last:justify;-moz-text-align-last:justify}

/* フッターの大きな社名：p の下まで色が届くように、下に余白（色は余白の分まで塗られる） */
.footer__word{padding-bottom:.2em;margin-bottom:-.12em}

@media (max-width:560px){
  .cr__card{width:290px;grid-template-columns:64px minmax(0,1fr);gap:4px 16px;padding:22px}
  .cr__icon{width:64px;height:64px}
  .cr__name{font-size:17px}
  .cr__count b{font-size:36px}
  .cr__track{gap:16px}
  .latest__link{flex-wrap:wrap;row-gap:6px;gap:10px 12px;padding:16px 0}
  .latest__title{flex-basis:100%;white-space:normal;order:5;text-align:center}
  .latest__arrow{display:none}
  .brand__kana{font-size:9px}
}

/* 会社情報：ロゴマークの欄（会社概要の上） */
.logo-sec{border-top:1px solid var(--line)}
.logo-sec__grid{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(40px,7vw,120px);align-items:center}
.logo-sec__mark{position:relative;margin:0;display:grid;place-items:center;aspect-ratio:1;border-radius:50%;background:radial-gradient(closest-side,var(--sky) 0%,rgba(230,239,255,.5) 62%,rgba(230,239,255,0) 100%)}
.logo-sec__mark img{width:62%;height:auto;filter:drop-shadow(0 30px 40px rgba(3,86,252,.18));animation:logoFloat 7s var(--ease-io) infinite alternate}
@keyframes logoFloat{to{transform:translateY(-10px) rotate(-2deg)}}
.logo-sec__body .join__lead{margin-top:32px}
/* ロゴの意味：青（知性と技術）とオレンジ（感性と創造）の2枚 */
.meaning{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.4vw,20px);margin-top:36px}
.meaning__item{position:relative;padding:clamp(24px,2.4vw,32px);border-radius:22px;background:#fff;border:1px solid var(--line);overflow:hidden;transition:opacity 1s var(--ease),transform 1.2s var(--ease)}
.meaning__item:nth-child(2){transition-delay:.08s}
.meaning__item::before{content:"";position:absolute;left:0;right:0;top:0;height:4px}
.meaning__item--blue::before{background:linear-gradient(90deg,#0356fc,#0383fc,#2bf0fc)}
.meaning__item--warm::before{background:linear-gradient(90deg,#fccc12,#fc7f35,#fc1555)}
.meaning__en{font-size:11px;font-weight:700;letter-spacing:.24em;text-transform:uppercase}
.meaning__item--blue .meaning__en{color:var(--brand)}
.meaning__item--warm .meaning__en{color:#e8572a}
.meaning__item h3{margin-top:8px;font-size:clamp(24px,2.2vw,30px);font-weight:800}
.meaning__item>p:not(.meaning__en):not(.meaning__chips){margin-top:10px;font-size:14.5px;line-height:1.95;color:var(--muted)}
.meaning__chips{display:flex;gap:6px;margin-top:18px}
.meaning__chips span{width:18px;height:18px;border-radius:50%;background:var(--c)}
.meaning__close{margin-top:28px;font-size:15.5px;line-height:2.05;color:var(--muted)}
@media (max-width:900px){
  .logo-sec__grid{grid-template-columns:1fr}
  .logo-sec__mark{width:min(72vw,340px);justify-self:center}
}
@media (max-width:560px){
  .meaning{grid-template-columns:1fr}
}
/* ロゴの文：幅が足りないときは文の切れ目で折り返す */
.nobr-line>span{display:inline-block}


/* プライバシーポリシー：箇条書きのあとの文にすき間 */
.doc ul+p,.doc ol+p{margin-top:16px}

/* 2026-10-18：詳細ページへのボタンを中央に大きく（トップの音楽・ガリレオ） */
.more{display:flex;justify-content:center;margin-top:clamp(56px,6vw,88px)}
.btn--more{padding:24px 44px;font-size:17px}
.btn--more:hover i{transform:translateX(5px)}
.music .player{margin-top:clamp(56px,6vw,88px)}
@media (max-width:560px){.btn--more{width:100%;justify-content:center;padding:20px 24px}}
/* 提携クリエイター様：まだ決まっていない枠のアイコン */
.cr__icon--empty{display:block;width:80px;height:80px;border-radius:50%;background:repeating-linear-gradient(45deg,var(--sky) 0 8px,#fff 8px 16px);box-shadow:0 0 0 4px #fff,0 0 0 5px var(--line)}
@media (max-width:560px){.cr__icon--empty{width:64px;height:64px}}
/* 意味のまとまり（.ph）の途中では折り返さない。幅が足りないときは、まとまりの切れ目で折れる */
.ph{display:inline-block}
/* サポートのカード：右の余白を使い、1文字だけ次の行に落ちないように */
.sup>p:not(.sup__meta){max-width:none}
/* 教材：これからも増えることを示す行 */
.lessons li.lessons__more b{color:var(--muted);font-weight:700;font-style:italic;letter-spacing:.02em}
.lessons li.lessons__more .lessons__no{color:var(--accent)}

/* 本文の折り返し（2026-10-18）：ふつうの折り返しで行末までそろえ、句読点・小さい「っ」などが行頭に来ないようにする */
p,li,dd,dt,small,figcaption,summary{line-break:strict;overflow-wrap:break-word}
/* 2〜3行の短い導入文で、語の途中で折りたくない所だけ文節で折る */
.phrase{word-break:auto-phrase}

/* 折り返しの仕上げ（2026-10-18）
   短い文は行の長さをそろえる（最後の行に数文字だけ残らない。Chrome・Edge・Safari 17.5〜。6行を超えるとふつうの折り返し）。
   長い本文は行末まで流し、最後の行が極端に短くならないようにする */
li,dd,small,figcaption,summary{text-wrap:pretty}
.sec-lead,.join__lead,.hero__lead,.svc-p,.royalty__note,.royalty__label,.phase p,.timeline li p,.steps p,.contact__row p,.school__cta>p,
.sup>p,.sup small,.route>p,.checks li,.ticks li,.facts3 span,.bign__note,.stat__note,.unit__note,.pnote,.keep p,.meaning__close,
.meaning__item p,.biz__card p,.fineprint,.cr__name,.form-info dd,.qa__a p,.weekly__steps li,.entry__steps li p,.route-map b,.route-map small,
.form-galileo p,.creators__name,.news__title,.latest__title,.article__body p,.doc>p,.doc li,.rows__body p,.school__perk p,.player__now{text-wrap:balance}


/* 文節で折るのは、意味の切れ目で折りたいと指定のあった所（会社の説明文の .phrase）とヒーローの短い文だけ。
   ほかの導入文・本文は文字単位で流し、行の長さをそろえる（文節で折ると、長い文では行末に大きなすき間ができるため） */
.hero__lead,.phrase{word-break:auto-phrase}


/* 2026-10-19 実績の並び（ユーザー：左の数字の上が空く）：数字4つを横一列、銀の盾は下の段で写真と記録を左右に */
.numbers__grid{grid-template-columns:1fr;align-items:stretch;gap:clamp(56px,6vw,96px)}
.stats{grid-template-columns:repeat(4,minmax(0,1fr));border-bottom:1px solid var(--line)}
.stat,.stat:nth-child(even),.stat:nth-child(n+3){padding:32px 24px 36px;border-left:1px solid var(--line);border-bottom:0}
.stat:first-child{padding-left:0;border-left:0}
.stat::before,.stat:nth-child(even)::before{left:24px}
.stat:first-child::before{left:0}
.stat__label{min-height:3.8em}  /* 2行分（行の高さ1.9）。数字の高さをそろえる */
.stat__value{font-size:clamp(56px,5.4vw,88px)}
.plaque{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(32px,5vw,72px);align-items:center}
.plaque .plaque__cap{margin-top:0}
.plaque__frame img{aspect-ratio:1600/1507;transform:none}
.plaque:hover .plaque__frame img{transform:scale(1.02)}
@media (max-width:1080px){
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .stat:nth-child(3){padding-left:0;border-left:0}
  .stat:nth-child(3)::before{left:0}
  .stat:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .stat__value{font-size:clamp(56px,8vw,96px)}
}
@media (max-width:900px){
  .plaque{grid-template-columns:1fr;max-width:none}
}
@media (max-width:560px){
  .stats{grid-template-columns:1fr}
  .stat,.stat:nth-child(even),.stat:nth-child(n+3){padding:30px 0 34px;border-left:0;border-bottom:1px solid var(--line)}
  .stat:last-child{border-bottom:0}
  .stat::before,.stat:nth-child(even)::before{left:0}
  .stat__label{min-height:0}
}

/* 2026-10-19 銀の盾を実績欄の上に。記録の数字は下の4つと同じ部品（.stat__label / .stat__value / .stat__note）で、大きさと色をそろえる */
.plaque .plaque__cap{display:block;margin-top:0;font-size:inherit;line-height:inherit;color:var(--fg)}
.pstat{position:relative;padding:28px 0 32px;border-top:1px solid var(--line)}
.pstat:last-child{border-bottom:1px solid var(--line)}
.pstat::before{content:"";position:absolute;left:0;top:-1px;width:56px;height:2px;background:var(--grad);transform:scaleX(0);transform-origin:left;transition:transform 1.2s var(--ease) .3s}
.plaque.is-in .pstat::before{transform:none}
.plaque.is-in .pstat+.pstat::before{transition-delay:.45s}
.pstat .stat__label{min-height:0}
.pstat__pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));margin-top:18px}
.pstat__pair>div+div{padding-left:24px;border-left:1px solid var(--line)}
.pstat__pair dt{font-size:11px;font-weight:700;letter-spacing:.2em;color:var(--brand)}
.pstat__pair dd{margin:0}
.pstat__pair .stat__value{margin-top:10px}
.stat__value em+.count{margin-left:4px}
@media (max-width:1080px){
  .plaque{grid-template-columns:repeat(2,minmax(0,1fr))}  /* 数字が大きくなる幅なので、記録の列を広げて「2年6か月」を1行に収める */
}
@media (max-width:900px){
  .plaque{grid-template-columns:1fr}
}
@media (max-width:560px){
  .pstat__pair>div+div{padding-left:18px}
}
@media (max-width:350px){
  .pstat__pair{grid-template-columns:1fr}
  .pstat__pair>div+div{margin-top:24px;padding-left:0;border-left:0}
}

/* 2026-10-19 お問い合わせを Contact Form 7 につないだ：送信ボタンを使える見た目に、Turnstile・送信結果・項目ごとのエラー */
.form__submit{opacity:1;cursor:pointer}
.form__submit:disabled{opacity:.55;cursor:progress}
.form__turnstile{min-height:65px}
.form__status{padding:14px 18px;border-radius:14px;font-size:14px;line-height:1.8;background:var(--sky-2);color:var(--fg)}
.form__status[data-kind="ok"]{background:#e6f6ec;color:#11592c}
.form__status[data-kind="error"],.form__status[data-kind="warn"]{background:#fff1ec;color:#8a2a0a}
.field__error{display:block;margin-top:8px;font-size:13px;font-weight:600;color:#c2410c}
.field [aria-invalid="true"]{border-color:#e4572e;background:#fff8f5}
.agree .field__error,.form__kinds .field__error{flex-basis:100%;margin-top:4px}

/* 2026-10-19 法人のお客様へ（トップ）：受け付ける形。写真と2つの支援、成果を約束しない注記、お問い合わせへ */
.forbiz{position:relative;padding:clamp(110px,12vw,180px) 0;background:var(--bg)}
.forbiz__top{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.9fr);gap:clamp(32px,5vw,80px);align-items:center}
.forbiz__head .sec-title{margin-top:24px}
.forbiz__head .sec-lead{margin-top:28px}
.forbiz__photo{margin:0;border-radius:clamp(18px,2vw,28px);overflow:hidden;box-shadow:var(--shadow);aspect-ratio:16/10;background:var(--sky)}
.forbiz__photo img{width:100%;height:100%;object-fit:cover}
.forbiz__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(12px,1.4vw,20px);margin-top:clamp(56px,6vw,88px)}
.forbiz__list li{padding:clamp(28px,3vw,40px);border-radius:22px;background:var(--white);border:1px solid var(--line);box-shadow:0 20px 50px -34px rgba(14,19,34,.3)}
.forbiz__list li:nth-child(2){transition-delay:.08s}
.forbiz__no{font-family:var(--serif);font-size:15px;letter-spacing:.12em;color:var(--brand)}
.forbiz__list h3{margin-top:14px;font-size:clamp(22px,2.2vw,30px);font-weight:800;line-height:1.4}
.forbiz__list h3+p{margin-top:16px;font-size:15px;line-height:2;color:var(--muted)}
.forbiz__cta{display:flex;justify-content:space-between;align-items:center;gap:24px 40px;flex-wrap:wrap;margin-top:clamp(40px,4vw,64px)}
.forbiz__cta>p{font-size:13px;line-height:2;color:var(--muted);max-width:44em}
.form__kinds{grid-template-columns:repeat(2,minmax(0,1fr))}  /* 種類が4つになったので2列×2段に */
@media (max-width:900px){
  .forbiz__top,.forbiz__list{grid-template-columns:1fr}
}

/* 2026-10-19 グラデーション文字が箱の外で切れる所（ユーザー：90% の％が途切れる）：箱を字形まで広げる */
.school__perk-num{padding:0 .08em .16em 0;margin-bottom:-.16em}
.footer__word{padding-bottom:.32em;margin-bottom:-.24em}  /* 「p」の下の端（マウスを乗せて色が付いたとき） */


/* 2026-10-19 スマホの見直し（ユーザーは iPhone 15 Pro を「拡大表示」＝幅320で使っている）
   ・上の「種類を2列×2段」が、スマホで1列にする指定（max-width:560px）を上書きしていた → スマホは1列に戻す
   ・1列の段組みでも、中の一番広い物（種類の欄・見出しの1行）より狭くならず、幅320で横にはみ出していた */
@media (max-width:560px){ .form__kinds{grid-template-columns:minmax(0,1fr)} }
@media (max-width:900px){ .co-intro__grid,.form-grid,.doc-grid{grid-template-columns:minmax(0,1fr)} }
.form__kinds{min-width:0}  /* fieldset は中身より狭くならない決まりがあるので外す */
@media (max-width:392px){ .contact__title.contact__title{font-size:min(12vw,56px)} }  /* 2つ重ねは、ページごとの指定（.page--music .contact__title など）より優先させるため */  /* ガリレオの「説明動画から。」が幅375で切れていた */
@media (max-width:374px){  /* 幅320〜374（拡大表示の iPhone・小さい Android）：大きい見出しの1行が画面に収まる大きさに */
  .sec-title.sec-title{font-size:8vw}  /* 場面ごとの指定（.gmusic .sec-title など）より優先させる。11字の行まで1行に */
  .school__title img{width:20vw}
  .school__title span{font-size:14vw}  /* トップの「ガリレオ」 */
  .school__title small{letter-spacing:.08em}
  .ptitle__row{font-size:.8em}  /* ガリレオのページの一番上の「ガリレオ」 */
  .index__row{grid-template-columns:30px minmax(0,1fr) 40px;column-gap:14px}  /* トップのサービス一覧：「Music」が「Musi／c」に折れていた（ユーザー） */
  .index__name b{font-size:12.5vw;white-space:nowrap}
  .index__arrow{width:40px;height:40px}
}
@media (max-width:430px){  /* 試聴の曲名：スマホでは「OVER…」「和を…」と数文字で切れていた → 折り返して全部出す */
  .track__title{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.45}
  .index__name small{word-break:keep-all;overflow-wrap:anywhere}  /* 「ガリ／レオ」のように名前の途中で折れないように */
}
@media (max-width:400px){ .page--galileo .hero__lead br{display:none} }  /* 狭い画面では改行の位置がばらつくので、流して組む */
@media (max-width:374px){
  .track{grid-template-columns:40px minmax(0,1fr) auto 28px}
  .track__no{display:none}
}
@media (max-width:374px){  /* 2026-10-19 ユーザー：拡大表示で「01 — MUSIC ／ 音楽制作・著作権管理」が2列に折れる。ほかの短い文字も */
  .eyebrow{font-size:11px;letter-spacing:.14em;flex-wrap:wrap;row-gap:6px}  /* 入りきらないときは、後ろの日本語をまるごと次の行へ */
  .eyebrow span{letter-spacing:.04em}
  .hero__kicker{letter-spacing:.12em}
  .btn{padding:16px 22px;gap:10px;letter-spacing:.03em}
  .btn--big,.btn--line,.btn--more{padding:20px 22px;font-size:15px}
  .cr__toggle{padding:10px 14px;font-size:12px;white-space:nowrap}
  .ptitle--text{font-size:8.6vw}  /* 音楽のページの「あなただけの音楽を。」 */
  .lessons li{grid-template-columns:34px minmax(0,1fr);column-gap:12px;row-gap:2px}  /* ガリレオの教材一覧：英語の名前を下に回して、「導入講義」などが折れないように */
  .lessons small{grid-column:2}
  .lessons b{font-size:21px}
}