/* Layout: トップと同じ色・字体。上から「講習を知る → 選ぶ → 流れ → 申し込む」の一本道。フォームは1列で迷わせない */
:root{
  --paper:#FBF8F4;
  --paper-2:#F5EDE6;
  --greige:#ECE2D9;
  --ink:#4A403A;
  --ink-soft:#85776E;
  --gold:#A9846F;
  --gold-light:#EBD9CC;
  --line:#E8DDD3;
  --err:#B5584A;
  --f-copy:"Shippori Mincho","Hiragino Mincho ProN","Yu Mincho",serif;
  --f-body:"Zen Kaku Gothic New","Hiragino Sans","Yu Gothic",sans-serif;
  --f-latin:"Cormorant Garamond","Times New Roman",serif;
  color-scheme:light;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:15px;line-height:1.9;letter-spacing:.04em}
a{color:inherit}
.u-link{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:.45em;text-decoration-color:var(--gold);transition:color .3s}
.u-link:hover{color:var(--gold)}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.latin{font-family:var(--f-latin);text-transform:uppercase;font-variant-numeric:lining-nums tabular-nums;font-feature-settings:"lnum" 1}

/* header（このページは最初から白い帯） */
.hd{position:fixed;left:0;right:0;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:calc(12px + env(safe-area-inset-top,0px)) clamp(16px,4vw,48px) 12px;background:color-mix(in srgb,var(--paper) 94%,transparent);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.logo{font-family:var(--f-latin);font-size:24px;letter-spacing:.42em;color:var(--gold);text-decoration:none;font-weight:500}
.nav{display:flex;gap:clamp(18px,2.4vw,36px);list-style:none;margin:0;padding:0}
.nav a,.nav button{all:unset;cursor:pointer;display:grid;justify-items:center;color:var(--ink)}
.nav .en{font-family:var(--f-latin);font-size:14px;letter-spacing:.16em;text-transform:uppercase}
.nav .ja{font-size:10px;letter-spacing:.1em;opacity:.8;line-height:1.4}
.nav .cur-page .en{color:var(--gold)}
.menu-btn{display:none;background:none;border:0;width:40px;height:40px;cursor:pointer;color:var(--ink)}
.menu-btn span{display:block;width:24px;height:1px;background:currentColor;margin:7px auto}

.wrap{max-width:1080px;margin:0 auto;padding-inline:clamp(16px,5vw,56px)}
.narrow{max-width:760px}
.eyebrow{font-family:var(--f-latin);font-size:14px;letter-spacing:.32em;color:var(--gold);margin:0 0 14px;text-transform:uppercase;font-variant-numeric:lining-nums}
.h2{font-family:var(--f-copy);font-weight:400;font-size:clamp(22px,2.6vw,30px);letter-spacing:.12em;line-height:1.7;margin:0 0 22px}
.h2 .ln{display:block;overflow:hidden}
.h2 .ln>span{display:block;transition:transform 1.2s cubic-bezier(.2,.7,.2,1)}
.sec{padding-block:clamp(80px,11vw,140px)}
.muted{color:var(--ink-soft)}

/* page head */
.ph-head{padding-top:calc(130px + env(safe-area-inset-top,0px));padding-bottom:clamp(40px,6vw,72px)}
.crumb{font-size:11px;letter-spacing:.12em;color:var(--ink-soft);margin:0 0 40px;display:flex;gap:10px;flex-wrap:wrap}
.crumb a{text-decoration:none}
.head-grid{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:32px;align-items:end}
.ph-title{font-family:var(--f-copy);font-weight:400;font-size:clamp(28px,4vw,46px);letter-spacing:.14em;line-height:1.5;margin:0}
.ph-title .ch{display:inline-block;transform:translateY(105%);animation:rise 1s cubic-bezier(.2,.7,.2,1) forwards}
.ph-title .ln{display:block;overflow:hidden}
@keyframes rise{to{transform:none}}
.brand-logo{width:clamp(110px,14vw,160px);height:auto;opacity:0;animation:fade 1.2s .9s forwards}
@keyframes fade{to{opacity:1}}
.ph-img{position:relative;height:clamp(240px,38vw,460px);overflow:hidden;margin-inline:clamp(16px,5vw,56px);clip-path:inset(0 12% 0 12%);animation:open 1.6s cubic-bezier(.7,0,.2,1) .4s forwards}
.ph-img img{position:absolute;inset:0;width:100%;height:120%;object-fit:cover;max-width:none;will-change:transform}
/* 一番上：イタルワックスの紹介映像をそのまま流す（16:9で切らずに見せる） */
.ph-img.film{height:auto;aspect-ratio:16/9;background:#e9e1d8}
.ph-img.film video{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block}
.snd{position:absolute;right:14px;bottom:14px;z-index:2;font:inherit;font-size:11px;letter-spacing:.12em;color:#fff;background:rgba(58,48,42,.55);border:1px solid rgba(255,255,255,.45);border-radius:999px;padding:6px 14px;cursor:pointer;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px)}
.snd:hover{background:rgba(58,48,42,.75)}
.vcredit{margin:10px clamp(16px,5vw,56px) 0;text-align:right;font-size:10px;letter-spacing:.1em;color:var(--ink-soft)}

/* PC：一番上の映像は幅を抑えて中央に（ゆとりを持たせる） */
@media (min-width:821px){
  .ph-img.film{width:min(100% - 2*clamp(16px,5vw,56px),1040px);margin-inline:auto}
  .vcredit{width:min(100% - 2*clamp(16px,5vw,56px),1040px);margin-inline:auto}
  /* 03 素材の写真：画面の端まで広げず、余白をとって右に寄せる */
  .band{width:min(100% - 2*clamp(16px,5vw,56px),1180px);margin-inline:auto;height:clamp(300px,36vw,500px)}
  .band img{object-position:50% 40%}
}
@media (max-width:600px){.vcredit{margin-inline:16px}.snd{right:10px;bottom:10px;padding:5px 12px}}
@keyframes open{to{clip-path:inset(0 0 0 0)}}
.tag{position:absolute;left:14px;bottom:10px;font-size:11px;color:rgba(255,255,255,.9);letter-spacing:.1em;margin:0;text-shadow:0 1px 6px rgba(0,0,0,.3)}
.lead-copy{font-family:var(--f-copy);font-size:clamp(17px,1.8vw,21px);letter-spacing:.12em;line-height:2.1;margin:0 0 18px}

/* course cards */
.courses{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,28px)}
.course{background:color-mix(in srgb,#fff 55%,var(--paper));border:1px solid var(--line);padding:clamp(26px,3.4vw,44px);display:flex;flex-direction:column;gap:18px;transition:border-color .5s,transform .6s cubic-bezier(.2,.7,.2,1)}
.course:hover{border-color:var(--gold-light);transform:translateY(-4px)}
.course .tt{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
.course h3{font-family:var(--f-copy);font-weight:400;font-size:clamp(20px,2vw,24px);letter-spacing:.12em;margin:0}
.course .en{font-family:var(--f-latin);font-size:13px;letter-spacing:.26em;color:var(--gold);text-transform:uppercase}
.course dl{margin:0;display:grid;grid-template-columns:5.5em minmax(0,1fr);border-top:1px solid var(--line)}
.course dt,.course dd{margin:0;padding:12px 0;border-bottom:1px solid var(--line);font-size:14px}
.course dt{color:var(--ink-soft);font-size:12px;letter-spacing:.12em;padding-top:14px}
.course .free{font-family:var(--f-copy);font-size:18px;color:var(--gold);letter-spacing:.14em}
.course ul{margin:0;padding-left:1.1em;font-size:13px;color:var(--ink-soft);line-height:1.9}

/* flow */
.flow{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;position:relative}
.flow::before{content:"";position:absolute;left:0;right:0;top:28px;height:1px;background:var(--line)}
.flow .bar{position:absolute;left:0;right:0;top:28px;height:1px;background:var(--gold);transform-origin:left;transform:scaleX(0);transition:transform 1.8s cubic-bezier(.7,0,.2,1)}
.flow.go .bar{transform:scaleX(1)}
.flow li{position:relative;padding-right:24px}
.flow .num{display:grid;place-items:center;width:56px;height:56px;border-radius:50%;background:var(--paper);border:1px solid var(--gold-light);font-family:var(--f-latin);font-size:18px;color:var(--gold);font-variant-numeric:lining-nums;position:relative;z-index:1;margin-bottom:18px}
.flow h3{font-family:var(--f-copy);font-weight:400;font-size:18px;letter-spacing:.1em;margin:0 0 6px}
.flow p{margin:0;font-size:13px;color:var(--ink-soft)}

/* form */
.form{display:flex;flex-direction:column;gap:34px}
.fld{display:flex;flex-direction:column;gap:10px;border:0;margin:0;padding:0;min-width:0}
.fld>label,.fld>legend{font-size:14px;letter-spacing:.08em;display:flex;align-items:center;gap:10px;padding:0}
.req,.opt{font-size:10px;letter-spacing:.12em;padding:1px 8px;border-radius:2px}
.req{background:var(--gold);color:#fff}
.opt{border:1px solid var(--line);color:var(--ink-soft)}
.hint{font-size:12px;color:var(--ink-soft);margin:-4px 0 0}
input[type=text],input[type=email],input[type=tel],input[type=date],select,textarea{font:inherit;font-size:16px;color:var(--ink);background:#fff;border:1px solid var(--line);border-radius:2px;padding:12px 14px;width:100%;transition:border-color .3s,box-shadow .3s;appearance:none}
input:focus,select:focus,textarea:focus{outline:none;border-color:var(--gold);box-shadow:0 0 0 3px color-mix(in srgb,var(--gold-light) 60%,transparent)}
textarea{min-height:140px;resize:vertical}
.two{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.zip{display:grid;grid-template-columns:9em minmax(0,1fr);gap:12px}
select{background-image:linear-gradient(45deg,transparent 50%,var(--ink-soft) 50%),linear-gradient(135deg,var(--ink-soft) 50%,transparent 50%);background-position:calc(100% - 18px) 52%,calc(100% - 13px) 52%;background-size:5px 5px;background-repeat:no-repeat;padding-right:36px}
.dates{display:flex;flex-direction:column;gap:10px}
.date-row{display:grid;grid-template-columns:4.6em minmax(0,1fr) minmax(0,1fr);gap:10px;align-items:center}
.date-row span{font-size:12px;color:var(--ink-soft);letter-spacing:.1em}

/* 選択カード（講習コース） */
.choice{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.choice label{position:relative;display:block;cursor:pointer}
.choice input{position:absolute;opacity:0;pointer-events:none}
.choice .box{display:flex;flex-direction:column;gap:2px;padding:18px 20px 18px 50px;background:#fff;border:1px solid var(--line);border-radius:2px;transition:border-color .3s,background .3s}
.choice .box::before{content:"";position:absolute;left:18px;top:22px;width:18px;height:18px;border-radius:50%;border:1px solid var(--gold-light);background:#fff;transition:all .3s}
.choice input:checked+.box{border-color:var(--gold);background:color-mix(in srgb,var(--gold-light) 25%,#fff)}
.choice input:checked+.box::before{border:5px solid var(--gold)}
.choice input:focus-visible+.box{box-shadow:0 0 0 3px var(--gold-light)}
.choice .t{font-size:15px}
.choice .s{font-size:12px;color:var(--ink-soft)}

/* 複数選択（チップ） */
.chips{display:flex;flex-wrap:wrap;gap:10px}
.chips label{cursor:pointer}
.chips input{position:absolute;opacity:0;pointer-events:none}
.chips span{display:inline-block;padding:8px 18px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:13px;transition:all .3s}
.chips input:checked+span{background:var(--gold);border-color:var(--gold);color:#fff}
.chips input:focus-visible+span{box-shadow:0 0 0 3px var(--gold-light)}
.other{margin-top:4px}

.agree{display:flex;gap:12px;align-items:flex-start;font-size:14px;cursor:pointer}
.agree input{width:18px;height:18px;accent-color:var(--gold);margin-top:5px;flex:none}
.err{font-size:12px;color:var(--err);margin:0}
.fld.bad input,.fld.bad select,.fld.bad .box,.fld.bad textarea{border-color:var(--err)}
.submit{align-self:center;font:inherit;font-size:15px;letter-spacing:.2em;color:#fff;background:var(--gold);border:0;border-radius:999px;padding:18px 64px;cursor:pointer;position:relative;overflow:hidden;transition:background .4s}
.submit::after{content:"";position:absolute;inset:0;background:rgba(255,255,255,.18);transform:translateX(-101%);transition:transform .6s cubic-bezier(.2,.7,.2,1)}
.submit:hover::after{transform:none}
.done{border:1px solid var(--gold-light);background:#fff;padding:28px;text-align:center}
.done p{margin:0}

/* footer */
.cta a{position:relative;overflow:hidden;display:flex;flex-direction:column;justify-content:flex-end;min-height:clamp(240px,28vw,360px);padding:clamp(24px,4vw,56px);color:#fff;text-decoration:none;background:#9C8B80}
.cta img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;max-width:none;opacity:.55;mix-blend-mode:luminosity;transform:scale(1.2);transition:transform 1.6s cubic-bezier(.2,.7,.2,1),opacity 1s}

/* お問い合わせの背景：モヤがゆっくり流れる（マウスに関係なく、いつも動く） */
.cta img{z-index:0;animation:haze 18s ease-in-out infinite alternate}
.cta a::before,.cta a::after{content:"";position:absolute;inset:-30%;z-index:1;pointer-events:none;mix-blend-mode:screen;filter:blur(18px)}
.cta a::before{background:radial-gradient(22% 30% at 30% 45%,rgba(255,250,244,.55),transparent 70%),radial-gradient(18% 26% at 62% 30%,rgba(255,255,255,.4),transparent 70%);animation:mistA 12s ease-in-out infinite alternate}
.cta a::after{background:radial-gradient(24% 32% at 70% 62%,rgba(255,246,236,.5),transparent 70%),radial-gradient(16% 22% at 45% 70%,rgba(255,255,255,.35),transparent 70%);animation:mistB 15s ease-in-out infinite alternate}
.cta .e,.cta .j,.cta .d,.cta .bar{z-index:2}
@keyframes haze{0%{translate:-6% 3%}50%{translate:4% -4%}100%{translate:6% 4%}}
@keyframes mistA{0%{transform:translate(-18%,8%) scale(1);opacity:.55}50%{transform:translate(6%,-8%) scale(1.25);opacity:1}100%{transform:translate(20%,6%) scale(1.05);opacity:.7}}
@keyframes mistB{0%{transform:translate(16%,-6%) scale(1.1);opacity:.8}50%{transform:translate(-8%,8%) scale(.95);opacity:.5}100%{transform:translate(-20%,-4%) scale(1.2);opacity:1}}
@media (prefers-reduced-motion: reduce) and (max-width: 0px){.cta img,.cta a::before,.cta a::after{animation:none}}
.cta a:hover img{transform:scale(1.16);opacity:.75}
.cta .e,.cta .j,.cta .d{position:relative}
.cta .e{font-family:var(--f-latin);font-size:14px;letter-spacing:.32em;opacity:.85}
.cta .j{font-family:var(--f-copy);font-size:clamp(22px,2.6vw,32px);letter-spacing:.12em;margin-top:6px}
.cta .d{font-size:13px;color:rgba(255,255,255,.88);margin-top:10px}
.cta .bar{position:relative;display:block;height:1px;background:rgba(255,255,255,.35);margin-top:22px;width:min(520px,100%);overflow:hidden}
.cta .bar::after{content:"";position:absolute;inset:0;background:var(--gold-light);transform:scaleX(0);transform-origin:left;transition:transform .8s}
.cta a:hover .bar::after{transform:scaleX(1)}
.site{display:grid;grid-template-columns:minmax(0,1.4fr) repeat(4,minmax(0,1fr));gap:32px;padding-block:64px 48px}
.site address{font-style:normal;font-size:12px;color:var(--ink-soft);margin-top:14px;line-height:1.9}
.site h4{font-family:var(--f-latin);font-weight:500;font-size:14px;letter-spacing:.24em;margin:0 0 12px}
.site ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px;font-size:12px;color:var(--ink-soft)}
.site ul a{text-decoration:none}
.legal{display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;border-top:1px solid var(--line);padding-block:20px calc(24px + env(safe-area-inset-bottom,0px))}
.legal small{font-size:11px;color:var(--ink-soft);letter-spacing:.1em}
.note{position:fixed;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));z-index:30;background:var(--ink);color:#fff;font-size:11px;padding:6px 12px;letter-spacing:.08em;margin:0}

/* reveal */
.rv{transition:opacity 1.1s ease,transform 1.1s cubic-bezier(.2,.7,.2,1)}
.rv.pre{opacity:0;transform:translateY(28px)}
.h2.pre .ln>span{transform:translateY(105%)}

/* cursor */
.cur{position:fixed;left:0;top:0;width:20px;height:20px;margin:-10px 0 0 -10px;border:1px solid var(--gold);border-radius:50%;pointer-events:none;z-index:60;opacity:0;transition:width .45s,height .45s,margin .45s,background-color .45s,border-color .45s,opacity .4s}
.cur.on{opacity:1}
.cur.big{width:44px;height:44px;margin:-22px 0 0 -22px;background:color-mix(in srgb,var(--gold-light) 45%,transparent);border-color:transparent}
.cur.light{border-color:rgba(255,255,255,.8)}
@media (hover:none),(pointer:coarse){.cur{display:none}}

@media (max-width:820px){
  .nav{display:none}
  .menu-btn{display:block}
  .courses,.choice{grid-template-columns:1fr}
  .flow{grid-template-columns:1fr;gap:28px}
  .flow::before,.flow .bar{left:28px;right:auto;top:0;bottom:0;width:1px;height:auto}
  .flow .bar{transform:scaleY(0);transform-origin:top}
  .flow.go .bar{transform:scaleY(1)}
  .flow li{display:grid;grid-template-columns:56px minmax(0,1fr);gap:18px;padding:0}
  .flow .num{margin:0}
  .site{grid-template-columns:1fr 1fr}
  .site>div:first-child{grid-column:1/-1}
}
@media (max-width:600px){
  body{font-size:14px}
  .logo{font-size:20px}
  .head-grid{grid-template-columns:1fr}
  .brand-logo{width:110px}
  .ph-img{margin-inline:0}
  .two,.zip{grid-template-columns:1fr}
  .date-row{grid-template-columns:1fr 1fr}
  .date-row span{grid-column:1/-1}
  .submit{width:100%}
}
@media (prefers-reduced-motion: reduce) and (max-width: 0px){
  .ph-title .ch,.brand-logo{animation:none;transform:none;opacity:1}
  .ph-img{animation:none;clip-path:none}
  .rv.pre,.h2.pre .ln>span{opacity:1;transform:none}
  .flow .bar{transition:none}
}

/* 正式ロゴ */
.logo{display:inline-flex;align-items:center;line-height:0}
.logo svg{height:15px;width:auto;display:block}
.site .logo svg{height:78px}
.ol{line-height:0;opacity:0;transform:translateY(10px);animation:logoUp 1.4s cubic-bezier(.2,.7,.2,1) .2s forwards;color:var(--gold)}
.ol svg{width:clamp(110px,12vw,150px);height:auto;display:block}
@keyframes logoUp{to{opacity:1;transform:none}}
@media (max-width:600px){.logo svg{height:13px}}

.site .sub-brand{font-family:var(--f-latin);font-size:13px;letter-spacing:.2em;text-transform:uppercase;color:var(--ink);margin:0 0 8px}
.site .sub-brand a{text-decoration:none}
.site ul.nest{padding-left:14px;border-left:1px solid var(--gold-light)}

/* 日本語を言葉のまとまりで改行する */
body{word-break:auto-phrase;line-break:strict}
.site ul a,.dd ul a{white-space:nowrap}
.site{grid-template-columns:minmax(0,1.3fr) minmax(0,.8fr) minmax(0,1.3fr) minmax(0,.8fr) minmax(0,1fr)}
@media (max-width:820px){.site{grid-template-columns:1fr 1fr}}

.course dd.items{display:flex;flex-direction:column;gap:2px}
.course dd.items span::before{content:"・";color:var(--gold)}
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}
.guard{text-align:center;font-size:11px;color:var(--ink-soft);margin:-14px 0 0;letter-spacing:.06em}
.done{text-align:left;padding:clamp(20px,3vw,32px)}
.done-t{font-size:14px;margin:0 0 20px!important}
.mails{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.mail{border:1px solid var(--line);background:var(--paper);padding:18px;min-width:0}
.mh{font-size:12px;letter-spacing:.12em;color:var(--gold);margin:0 0 10px!important}
.mhead{display:grid;grid-template-columns:3em minmax(0,1fr);gap:4px 10px;font-size:12px;margin:0 0 12px;padding-bottom:12px;border-bottom:1px solid var(--line)}
.mhead dt{color:var(--ink-soft)}.mhead dd{margin:0;word-break:break-all}
.mail pre{margin:0;font-family:var(--f-body);font-size:12px;line-height:1.85;white-space:pre-wrap;word-break:break-word;color:var(--ink)}
@media (max-width:820px){.mails{grid-template-columns:1fr}}

br.pc{display:inline}
@media (max-width:600px){br.pc{display:none}}
.course ul{text-wrap:pretty}
.grp{display:flex;align-items:baseline;gap:14px;margin:18px 0 -10px;padding-top:24px;border-top:1px solid var(--line);font-family:var(--f-copy);font-size:17px;letter-spacing:.12em}
.grp .latin{font-size:13px;letter-spacing:.28em;color:var(--gold)}
.sub-q{display:flex;flex-direction:column;gap:28px;padding-left:18px;border-left:1px solid var(--gold-light);animation:subIn .6s cubic-bezier(.2,.7,.2,1)}
@keyframes subIn{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}

/* 講習カードの説明文：枠いっぱいに流し込む（言葉単位の改行・行の均等化をしない） */
.course ul{list-style:none;padding:0;margin:0;word-break:normal;line-break:normal;text-wrap:wrap;overflow-wrap:anywhere}
.course ul li{padding:0}
.course ul li::before{content:"・";color:var(--gold)}
/* ── イタルワックスとは ── */
.facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:0;margin-top:48px;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.facts>div{padding:26px 18px;text-align:center}
.facts>div+div{border-left:1px solid var(--line)}
.fn{font-size:clamp(30px,3.6vw,42px);letter-spacing:.12em;color:var(--gold);margin:0;line-height:1.2}
.fn small{font-size:.6em}
.fl{font-size:12px;color:var(--ink-soft);margin:8px 0 0;letter-spacing:.08em;line-height:1.8}
.body{color:var(--ink-soft);margin:0 0 18px;max-width:30em}
.rimg{position:relative;overflow:hidden;height:100%}
.rimg img{display:block;width:100%;height:100%;object-fit:cover;max-width:none;transition:transform 1.6s cubic-bezier(.2,.7,.2,1)}
.card{margin:0;will-change:transform}
.card:hover .rimg img{transform:scale(1.04)}
/* 写真がせり上がって現れる */
.card.pre .rimg{clip-path:inset(100% 0 0 0)}
.card .rimg{clip-path:inset(0 0 0 0);transition:clip-path 1.4s cubic-bezier(.7,0,.2,1)}
.card.pre .rimg img{transform:scale(1.2)}
.chap-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);gap:clamp(32px,6vw,96px);align-items:center}
.stack{position:relative;height:clamp(420px,46vw,620px)}
.stack .c1{position:absolute;right:0;top:0;width:82%;aspect-ratio:16/10}
.stack .c2{position:absolute;left:0;bottom:0;width:52%;aspect-ratio:4/3}
.stack .rimg img{width:calc(100% + 2px);height:calc(100% + 2px);margin:-1px}
.stack .c2{box-shadow:0 0 0 2px var(--paper)}
/* PC：01 ITALY の写真2枚を大きく、重ねて見せる */
@media (min-width:821px){
  .chap-grid:has(.stack){max-width:1320px;grid-template-columns:minmax(0,.8fr) minmax(0,1.35fr);gap:clamp(40px,5vw,88px)}
  .stack{height:auto;aspect-ratio:1/.8}
  .stack .c1{width:86%}
  .stack .c2{width:50%;bottom:0;box-shadow:0 0 0 8px var(--paper)}
}
.q-hero{height:clamp(300px,46vw,600px);overflow:hidden}
.q-hero img{height:120%}
.q-body{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:clamp(24px,5vw,80px);padding-block:clamp(40px,5vw,64px)}
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(12px,2vw,24px);align-items:start}
.trio .card{aspect-ratio:4/5}
.trio .card:nth-child(2){margin-top:60px}
.trio .card:nth-child(3){margin-top:24px}
.mat{position:relative;padding-bottom:clamp(80px,10vw,140px)}
.band{height:clamp(300px,48vw,620px);overflow:hidden}
.band img{width:100%;height:130%;object-fit:cover;max-width:none;display:block;will-change:transform}
.mat-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.1fr);gap:clamp(24px,4vw,64px);align-items:end;margin-top:-120px;position:relative}
.mat-card{background:var(--paper);padding:clamp(28px,4vw,56px)}
.mat-pic{aspect-ratio:3/2;margin-bottom:-40px;align-self:end;margin-right:calc(-1 * clamp(0px,3vw,40px))}
.next-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,28px)}
.nx{display:flex;flex-direction:column;gap:8px;padding:clamp(28px,4vw,48px);border:1px solid var(--line);text-decoration:none;background:color-mix(in srgb,#fff 50%,var(--paper));transition:border-color .5s,background .5s}
.nx:hover{border-color:var(--gold-light);background:#fff}
.nx .e{font-size:13px;letter-spacing:.28em;color:var(--gold)}
.nx .j{margin-bottom:28px;font-family:var(--f-copy);font-size:clamp(18px,2vw,22px);letter-spacing:.1em}
.nx .bar{display:block;height:1px;background:var(--line);margin-top:auto;position:relative;overflow:hidden}
.nx .bar::after{content:"";position:absolute;inset:0;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .8s cubic-bezier(.2,.7,.2,1)}
.nx:hover .bar::after{transform:scaleX(1)}
@media (max-width:820px){
  .chap-grid,.q-body,.mat-grid,.next-grid{grid-template-columns:minmax(0,1fr)}
  .stack{height:auto;display:grid;gap:12px}
  .stack .c1,.stack .c2{position:relative;width:100%;border:0}
  .stack .c2{width:70%;justify-self:end;margin-top:-40px;border:6px solid var(--paper)}
  .mat-grid{margin-top:-60px}
  .mat-pic{width:100%;justify-self:end;margin:0}
  .facts>div{padding:18px 8px}
}
@media (max-width:600px){
  .trio{grid-template-columns:1fr 1fr}
  .trio .card:nth-child(3){grid-column:1/-1;aspect-ratio:16/10;margin-top:0}
  .trio .card:nth-child(2){margin-top:30px}
}
@media (prefers-reduced-motion: reduce) and (max-width: 0px){.card.pre .rimg{clip-path:none}.card.pre .rimg img{transform:none}}

.body,.muted,.lead-copy{word-break:normal;line-break:normal}
.chap .h2{font-size:clamp(20px,2.1vw,26px)}
@media (min-width:821px){.chap .h2 .ln>span{white-space:nowrap}}

/* 明朝の見出しは文字の左の余白ぶん左へ寄せ、英字や本文と左端をそろえる */
.ph-title,.lead-copy,.h2,.copy h1{margin-left:-.08em}

/* ── さりげない動き ── */
/* 文字は、ぼかしから焦点が合うように現れる */
.rv{transition:opacity 1.4s ease,transform 1.4s cubic-bezier(.2,.7,.2,1),filter 1.4s ease}
.rv.pre{filter:blur(6px)}
.h2 .ln>span{transition:transform 1.3s cubic-bezier(.2,.7,.2,1),filter 1.3s ease,opacity 1.3s}
.h2.pre .ln>span{filter:blur(4px);opacity:0}
/* 大きな写真は、呼吸するようにゆっくり拡大・縮小 */
@keyframes breathe{0%{scale:1}50%{scale:1.05}100%{scale:1}}
/* 呼吸の動きは使わない（1章に主役の動き1つ） */

/* ワックスの種類 */
.types{padding-block:clamp(80px,10vw,130px) 0}
.types-grid{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.4vw,28px);margin-top:clamp(28px,3vw,40px)}
.type{padding:clamp(28px,3.4vw,44px);border-top:1px solid var(--gold-light);background:color-mix(in srgb,#fff 45%,var(--paper))}
.type .e{font-family:var(--f-latin);font-size:13px;letter-spacing:.28em;color:var(--gold);text-transform:uppercase}
.type .nm{font-family:var(--f-copy);font-size:clamp(19px,1.9vw,22px);letter-spacing:.12em;margin:14px 0 4px}
.type .cp{font-family:var(--f-copy);color:var(--gold);letter-spacing:.14em;font-size:14px;margin:0 0 18px}
.type .tx{color:var(--ink-soft);font-size:14px;line-height:2;margin:0}
.types .after{color:var(--ink-soft);font-size:14px;margin:clamp(24px,3vw,36px) 0 0;text-align:center}
@media (max-width:820px){.types-grid{grid-template-columns:minmax(0,1fr)}.types .after{text-align:left}}
/* NEXT：日本の写真 */
.next-pic{max-width:760px;margin:0 auto clamp(40px,5vw,64px);aspect-ratio:3/2}
/* 写真のクレジット（このページの写真はItalwaxの映像から） */
.next-pic:has(+ .icredit){margin-bottom:0!important}
.icredit{max-width:760px;margin:10px auto clamp(40px,5vw,64px)!important;text-align:right;font-size:10px;letter-spacing:.1em;color:var(--ink-soft);margin:0}
/* よくある質問 */
.faq{padding-block:clamp(72px,9vw,120px) 0}
.faq-grid{display:grid;grid-template-columns:minmax(0,.7fr) minmax(0,1.3fr);gap:clamp(24px,6vw,96px);align-items:start}
.faq-list{border-top:1px solid var(--line)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;cursor:pointer;display:flex;gap:18px;align-items:baseline;padding:22px 40px 22px 0;position:relative;font-family:var(--f-copy);font-size:clamp(15px,1.5vw,17px);letter-spacing:.08em;line-height:1.7}
.faq summary::-webkit-details-marker{display:none}
.faq summary .qn{font-family:var(--f-latin);color:var(--gold);font-size:14px;letter-spacing:.2em;flex:none}
.faq summary::after{content:"";position:absolute;right:6px;top:50%;width:11px;height:11px;margin-top:-6px;background:linear-gradient(var(--gold),var(--gold)) center/100% 1px no-repeat,linear-gradient(var(--gold),var(--gold)) center/1px 100% no-repeat;transition:transform .5s cubic-bezier(.2,.7,.2,1)}
.faq details[open] summary::after{transform:rotate(135deg)}
.faq .ans{padding:0 40px 24px 38px;color:var(--ink-soft);font-size:14px;line-height:2;margin:0}
.faq details[open] .ans{animation:faqIn .6s cubic-bezier(.2,.7,.2,1)}
@keyframes faqIn{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media (max-width:820px){.faq-grid{grid-template-columns:minmax(0,1fr)}.faq .ans{padding-left:0;padding-right:0}}
/* スマホ：講習への入口を画面下に */
.mcta{display:none}
@media (max-width:820px){
  .mcta{display:flex;align-items:center;justify-content:space-between;gap:12px;position:fixed;left:16px;right:16px;bottom:calc(14px + env(safe-area-inset-bottom,0px));z-index:25;padding:15px 20px;background:color-mix(in srgb,var(--ink) 92%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);color:#fff;text-decoration:none;font-size:13px;letter-spacing:.14em;transform:translateY(calc(100% + 30px));opacity:0;transition:transform .7s cubic-bezier(.2,.7,.2,1),opacity .7s}
  .mcta .e{font-family:var(--f-latin);font-size:11px;letter-spacing:.24em;color:var(--gold-light)}
  .mcta .ar{width:22px;height:1px;background:currentColor;position:relative}
  .mcta .ar::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:1px;background:currentColor;transform:rotate(35deg);transform-origin:right}
  .mcta.on{transform:none;opacity:1}
  body.mcta-on .note{bottom:calc(76px + env(safe-area-inset-bottom,0px))}
}

/* 写真の上を、やわらかな光が一度だけ横切る */
.ph-img,.q-hero{position:relative}
.sheen{position:absolute;inset:0;pointer-events:none;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.28) 50%,transparent 65%);transform:translateX(-120%)}
.sheen{display:none}

@keyframes sheen{to{transform:translateX(120%)}}
/* 写真の脇に添える縦書きの小さな英字 */
.vcap{writing-mode:vertical-rl;font-size:11px;letter-spacing:.32em;color:var(--ink-soft);margin:0;opacity:.75;white-space:nowrap}
.vcap-hero{position:absolute;right:clamp(8px,1.4vw,22px);margin-top:-200px}
.vcap-stack{position:absolute;left:-26px;top:0}
.q-hero{overflow:visible}
.q-hero .rimg{overflow:hidden;height:100%}
.vcap-q{position:absolute;right:-24px;bottom:0}
/* 3つのポイントの数字が、ほんのり浮かぶ */
.facts>div{transition:background .6s}
.facts>div:hover{background:color-mix(in srgb,var(--gold-light) 25%,transparent)}
@media (max-width:820px){.vcap-hero,.vcap-stack,.vcap-q{display:none}}
@media (prefers-reduced-motion: reduce) and (max-width: 0px){.ph-img img,.breathe img,.band img{animation:none}.sheen{display:none}.rv.pre,.h2.pre .ln>span{filter:none;opacity:1}}

/* 章と章をつなぐ金の細い線（スクロールで伸びる） */
.thread{position:relative;height:clamp(80px,10vw,130px);display:flex;justify-content:center}
.thread::before{content:"";width:1px;height:100%;background:var(--line)}
.thread i{position:absolute;top:0;left:50%;width:1px;height:100%;background:var(--gold);transform-origin:top;transform:scaleY(0)}
.closing{font-family:var(--f-copy);font-size:clamp(20px,2.4vw,28px);letter-spacing:.14em;margin:0 0 40px -.08em}
.next{padding-top:clamp(40px,5vw,64px)}
.next .eyebrow{margin-bottom:10px}
.next .wrap:first-child{text-align:center}
.next .closing{margin-left:0}

/* GMPの4つの約束 */
.gmp{list-style:none;margin:0 0 clamp(48px,6vw,80px);padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line)}
.gmp li{padding:24px 20px 26px;border-bottom:1px solid var(--line);min-width:0}
.gmp li+li{border-left:1px solid var(--line)}
.gn{display:block;font-size:13px;letter-spacing:.24em;color:var(--gold);margin-bottom:10px}
.gt{font-family:var(--f-copy);font-size:17px;letter-spacing:.1em;margin:0 0 8px}
.gd{font-size:13px;color:var(--ink-soft);margin:0;line-height:1.9;word-break:normal;line-break:normal}
.q-tag{font-family:var(--f-copy);font-size:clamp(18px,2vw,23px);letter-spacing:.14em;line-height:2;text-align:center;margin:clamp(56px,7vw,96px) 0 0}
@media (max-width:820px){.gmp{grid-template-columns:1fr 1fr}.gmp li:nth-child(3){border-left:0}}
@media (max-width:480px){.gmp{grid-template-columns:1fr}.gmp li+li{border-left:0}}

/* A：線から写真へ */
.q-hero .rimg{background:var(--gold);clip-path:inset(0 50% 0 50%)}
.q-hero img{opacity:0}


/* 試作D：写真はもとの大きさのまま止め、その上と外側を文字のカードが流れる */
.qpin{position:relative;height:280svh;overflow-x:clip}
.qstick{position:sticky;top:0;height:100svh;display:grid;align-items:center;padding-top:60px;box-sizing:border-box}
.qstage{--qh:min(68svh,600px);position:relative;height:var(--qh)}
@media (min-width:821px){
  .qstick{grid-template-rows:auto auto;align-content:center;row-gap:0}
  .qhead{grid-column:1;grid-row:1;align-self:end}
  .qbody{grid-column:1;grid-row:2;align-self:start}
  .qstage{grid-column:2;grid-row:1 / 3;align-self:center}
}
.qstage .q-hero{height:100%;overflow:hidden}
.qstage .q-hero .rimg{height:100%}
.qstage .q-hero img{height:115%;object-position:62% 50%}
.qwin{position:absolute;inset:0;overflow:hidden;clip-path:inset(0);pointer-events:none}
.qflow{position:absolute;left:0;right:0;top:0;display:flex;flex-direction:column;align-items:center;gap:calc(var(--qh) * .32);will-change:transform}
.qcard{pointer-events:auto;width:min(320px,64%);box-sizing:border-box;background:color-mix(in srgb,var(--paper) 93%,transparent);padding:clamp(22px,2.4vw,32px);box-shadow:0 20px 50px -30px rgba(74,64,58,.35)}
.qcard:nth-child(odd){margin-right:22%}
.qcard:nth-child(even){margin-left:22%}
@media (max-width:600px){.qcard{width:80%;padding:20px 22px}.qcard:nth-child(odd){margin-right:8%}.qcard:nth-child(even){margin-left:8%}.qcard .qd{font-size:13px;line-height:1.8}}
.qcard .gn{display:block;font-size:13px;letter-spacing:.28em;color:var(--gold);margin-bottom:8px}
.qcard .qh{font-family:var(--f-copy);font-size:clamp(17px,1.6vw,20px);letter-spacing:.1em;margin:0 0 10px}
.qcard .qd{font-size:14px;color:var(--ink-soft);line-height:1.9;margin:0}
@media (max-width:820px){
  /* スマホもPCと同じく、写真を止めてカードを流す */
  .qpin{overflow-x:clip}
  .qstick{position:relative;height:100%;display:block;padding-top:0}
  .qhead{position:sticky;top:var(--hdh,61px);z-index:3;height:auto;background:var(--paper);padding:14px 0 10px;margin-top:-14px}
  .qhead .h2{margin-bottom:0}
  .qbody{padding-top:16px}
  .qstage{--qh:min(calc(100svh - var(--hdh,61px) - 150px),500px);position:sticky;top:calc(var(--hdh,61px) + 104px);height:var(--qh);margin-top:28px}
  .qflow{gap:calc(var(--qh) * .16)}
  .qstage .q-hero{height:100%}
}

/* ===== 各項目の間隔をそろえる（PC 180px／スマホ 100px） ===== */
:root{--gap:180px;--th:120px;--pre:60px}
@media (max-width:820px){:root{--gap:100px;--th:110px;--pre:30px}}
.thread{height:var(--th)}
main>section.sec:has(+ .thread),main>section.chap:has(+ .thread),main>section.faq:has(+ .thread){padding-bottom:var(--pre)}
section.chap.mat{padding-bottom:0}
section.types{padding-top:calc(var(--gap) + 40px);padding-bottom:0}
@media (max-width:820px){section.types{padding-top:var(--gap)}}
section.faq{padding-top:var(--gap)}
section.sec.next{padding-top:clamp(36px,4.5vw,56px);padding-bottom:clamp(84px,9vw,128px)}
.next .closing{margin-bottom:0}
@media (min-width:821px){.qpin{margin-top:calc(-1 * ((100svh - min(68svh,600px)) / 2 + 30px))}}
main>section.sec:has(.lead-copy){padding-top:var(--gap)}
@media (prefers-reduced-motion: reduce) and (max-width: 0px){
.rv{transition:opacity 1.1s ease!important}
.rv.pre{opacity:0!important;transform:none!important;filter:none!important}
.h2 .ln>span{transition:opacity 1s ease!important}
.h2.pre .ln>span{opacity:0!important;transform:none!important;filter:none!important}
.ph-title .ch{transform:none!important;opacity:0;animation-name:chFade!important;animation-duration:.9s!important;animation-timing-function:ease!important;animation-fill-mode:both!important}
.reveal-img{transition:opacity 1.2s ease!important}
.reveal-img.pre{opacity:0!important;clip-path:none!important}
.reveal-img.pre *{transform:none!important;clip-path:none!important}
}
@keyframes chFade{from{opacity:0}to{opacity:1}}
br.m{display:none}
@media (max-width:820px){
br.m{display:inline}
.fn{font-size:clamp(24px,7vw,30px);letter-spacing:.08em}
.chap-txt .body{padding-left:13%}
}
@media (max-width:820px){.qcard{background:var(--paper);will-change:opacity}.qflow{backface-visibility:hidden}}
.q-tag .s1,.q-tag .s2{display:block}.q-tag .s2{margin-top:.55em}
.q-hero .rimg{-webkit-mask-composite:source-in;mask-composite:intersect;-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat}
.q-hero .rimg{background:transparent!important}
.nw{white-space:nowrap}
.legal{align-items:baseline}
.legal .u-link,.legal small{line-height:1.6}

/* 02 network */
.net{padding-block:clamp(40px,6vw,80px) 0}
.net-lang{align-self:center;padding:clamp(8px,1.2vw,14px) clamp(28px,3.4vw,44px);border-top:1px solid var(--gold-light);background:color-mix(in srgb,#fff 45%,var(--paper))}
.nl-row{display:grid;grid-template-columns:clamp(84px,8vw,104px) minmax(0,1fr);align-items:start;column-gap:clamp(16px,2vw,24px);padding:clamp(22px,2.6vw,30px) 0}
.nl-row+.nl-row{border-top:1px solid var(--line)}
.nl-num{margin:0;font-size:clamp(44px,4.4vw,58px);line-height:1;color:var(--gold);letter-spacing:.02em}
.nl-num small{font-size:.5em;margin-left:2px}
.nl-lab{margin:0;padding-top:clamp(8px,1vw,14px);font-size:14px;letter-spacing:.1em;line-height:1.9;color:var(--ink)}
.nl-list{list-style:none;margin:16px 0 0;padding:14px 0 0;border-top:1px dashed var(--line);display:grid;grid-template-columns:repeat(2,max-content);gap:8px clamp(24px,3vw,40px);font-size:clamp(14px,1.2vw,16px);letter-spacing:.06em;color:var(--ink-soft)}
.net-jp{margin-top:clamp(72px,9vw,120px);padding-top:clamp(48px,6vw,72px);border-top:1px solid var(--line);display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:clamp(32px,5vw,72px);align-items:start}
.nj-h{font-family:var(--f-copy);font-weight:400;font-size:clamp(20px,2.2vw,26px);letter-spacing:.12em;line-height:1.8;margin:0 0 18px}
.nj-links{display:flex;gap:12px;flex-wrap:wrap;margin-top:clamp(36px,4vw,48px)}
.nj-btn{display:inline-flex;align-items:center;gap:14px;padding:15px 26px;background:var(--ink);color:#fff;text-decoration:none;font-size:14px;letter-spacing:.12em;transition:background .3s,color .3s}
.nj-btn:hover{background:var(--gold)}
.nj-btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.nj-btn.ghost:hover{background:var(--ink);color:#fff}
@media (max-width:820px){
  .net-lang{margin-top:28px}
  .net-jp{grid-template-columns:minmax(0,1fr)}
  .nj-btn{flex:1 1 100%;justify-content:space-between}
}

/* 03 lineup */
.lineup{padding-block:clamp(100px,12vw,160px) 0}
.lu-pic{aspect-ratio:3/2}
.lu-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(16px,2.4vw,28px);margin-top:clamp(56px,7vw,96px);align-items:start}
.lu-g{padding:clamp(28px,3.4vw,40px);border-top:1px solid var(--gold-light);background:color-mix(in srgb,#fff 45%,var(--paper))}
.lu-g .e{font-size:13px;letter-spacing:.28em;color:var(--gold);text-transform:uppercase}
.lu-g .nm{font-family:var(--f-copy);font-size:clamp(18px,1.6vw,21px);letter-spacing:.08em;white-space:nowrap;margin:14px 0 4px}
.lu-g .cp{font-family:var(--f-copy);color:var(--gold);letter-spacing:.14em;font-size:14px;margin:0 0 16px}
.lu-g .tx{color:var(--ink-soft);font-size:13.5px;line-height:2;margin:0 0 22px}
.lu-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.lu-list li{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;column-gap:10px;padding:13px 0;border-bottom:1px solid var(--line)}
.lu-list .lj{font-family:var(--f-copy);font-size:15px;letter-spacing:.04em;white-space:nowrap;color:var(--ink)}
.lu-list .le{grid-column:1;font-size:12px;letter-spacing:.04em;white-space:nowrap;color:var(--ink-soft);margin-top:2px}
.lu-list .lt{grid-column:2;grid-row:2;align-self:center;font-size:11px;letter-spacing:.12em;color:var(--gold);border:1px solid var(--gold-light);padding:3px 9px;border-radius:999px;white-space:nowrap}
.lu-foot{margin-top:clamp(40px,5vw,64px);text-align:center}
.lu-foot p{color:var(--ink-soft);font-size:14px;line-height:2;margin:0}
.lu-foot .nj-links{justify-content:center}
@media (max-width:1000px){.lu-grid{grid-template-columns:minmax(0,1fr)}}
@media (max-width:820px){.lu-pic{margin-top:12px}.lu-foot{text-align:left}.lu-foot br{display:none}}

@media (min-width:1001px){
  .lu-grid{grid-template-rows:repeat(5,auto)}
  .lu-g{display:grid;grid-template-rows:subgrid;grid-row:span 5;align-content:start;row-gap:0}
  .lu-g .tx{align-self:start}
}
@media (min-width:821px){
  .nj-flow{grid-template-columns:repeat(3,max-content);column-gap:clamp(44px,5vw,72px)}
  .nj-flow::before,.nj-flow .bar{display:none}
  .nj-flow li{padding-right:0}
  .nj-flow li:not(:last-child)::after{content:"";position:absolute;top:28px;left:56px;right:calc(-1 * clamp(44px,5vw,72px));height:1px;background:var(--line)}
  .nj-flow li:not(:last-child)::before{content:"";position:absolute;top:28px;left:56px;right:calc(-1 * clamp(44px,5vw,72px));height:1px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .9s cubic-bezier(.7,0,.2,1);z-index:1}
  .nj-flow li:nth-child(3)::before{transition-delay:.8s}
  .nj-flow.go li:not(:last-child)::before{transform:scaleX(1)}
}
@media (max-width:820px){.nj-flow::before,.nj-flow .bar{right:auto}.nj-flow li:last-child{position:relative}.nj-flow li:last-child::after{content:"";position:absolute;left:26px;top:57px;bottom:-2px;width:5px;background:var(--paper)}}

/* 10-14 */
.st-credit{position:absolute;right:0;bottom:-26px;margin:0!important;max-width:none}
.qtag-sec .q-tag{margin-top:clamp(24px,3vw,48px)}
.net-jp{display:block}
.nj-row1{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(40px,5vw,88px);align-items:center}
.nj-row2{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:clamp(32px,4vw,64px);align-items:end;margin-top:clamp(56px,7vw,96px)}
.nj-row2 .nj-links{justify-content:flex-end;margin:0}
.nj-stack{height:auto;aspect-ratio:1/.86}
.nj-stack .c1{width:84%;aspect-ratio:16/10.5}
.nj-stack .c2{width:38%;aspect-ratio:3/4;box-shadow:0 0 0 8px var(--paper)}
.nj-stack .c1 img{object-position:50% 90%}
.nj-stack .c2 img{object-position:50% 68%}
.nj-cap{margin:18px 0 0;text-align:center;font-size:12px;letter-spacing:.08em;color:var(--ink-soft)}
@media (max-width:1100px){.nj-row2{grid-template-columns:minmax(0,1fr)}.nj-row2 .nj-links{justify-content:flex-start}}
@media (max-width:820px){
  .st-credit{position:static;justify-self:end;font-size:10px}
  .nj-row1{grid-template-columns:minmax(0,1fr);gap:32px}
  .nj-pics{order:2}
  .nj-stack{aspect-ratio:auto}
  .nj-stack .c1,.nj-stack .c2{aspect-ratio:4/3}
  .nj-stack .c2{width:58%;aspect-ratio:3/4;border:6px solid var(--paper);box-shadow:none}
  .nj-row2{margin-top:40px}
  .nj-stack .c2 img{object-position:50% 68%}   /* 展示会の写真2枚目：人物を少し上に */
  .net-jp{margin-top:36px;padding-top:40px}   /* 75か国・6言語の箱と、下の線の間を詰める */
}

/* 03 lineup：4つの入口（ARGELAN風） */
.lu-cats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(64px,8vw,112px)}
.lc{position:relative;display:flex;flex-direction:column;align-items:center;text-decoration:none;color:var(--ink);padding-top:clamp(200px,20vw,300px)}
.lc-bg{position:absolute;left:0;right:0;top:0;height:clamp(200px,20vw,300px);overflow:hidden}
.lc-bg::before{content:"";position:absolute;inset:-12%;background:url({{forest}}) center/cover no-repeat;mix-blend-mode:luminosity;opacity:.5;transform:scale(1.15);animation:haze 18s ease-in-out infinite alternate;transition:transform 1.6s cubic-bezier(.2,.7,.2,1),opacity 1s}
.lc-bg::after{content:"";position:absolute;inset:-30%;pointer-events:none;mix-blend-mode:screen;filter:blur(18px);background:radial-gradient(22% 30% at 30% 45%,rgba(255,250,244,.5),transparent 70%),radial-gradient(18% 26% at 66% 30%,rgba(255,255,255,.35),transparent 70%),radial-gradient(22% 30% at 70% 70%,rgba(255,246,236,.4),transparent 70%);animation:mistA 13s ease-in-out infinite alternate}
.lc-strip .lc-bg::after{animation:mistB 15s ease-in-out infinite alternate}
.lc-pre .lc-bg::after{animation-duration:16s;animation-delay:-5s}
.lc-after .lc-bg::after{animation:mistB 14s ease-in-out -7s infinite alternate}
.lc-film .lc-bg{background:radial-gradient(120% 90% at 30% 20%,#6a5446 0%,#3b2f29 55%,#231c18 100%)}
.lc-strip .lc-bg{background:radial-gradient(120% 90% at 70% 25%,#efe5d9 0%,#d7c7b5 55%,#bfab96 100%)}
.lc-pre .lc-bg{background:radial-gradient(120% 90% at 30% 25%,#c3d2b5 0%,#93a983 55%,#667d5a 100%)}
.lc-after .lc-bg{background:radial-gradient(120% 90% at 70% 20%,#e6e9e7 0%,#c4cdca 55%,#9fada8 100%)}
.lc-film .lc-bg::before{opacity:.55;mix-blend-mode:soft-light}
.lc-film .lc-bg::after{opacity:.3}
@media (prefers-reduced-motion: reduce) and (max-width: 0px){.lc-bg::before,.lc-bg::after{animation:none}}
.lc-pic{position:absolute;left:0;right:0;bottom:calc(clamp(56px,6vw,80px) + 48px);height:clamp(250px,24vw,360px);display:flex;align-items:flex-end;justify-content:center;pointer-events:none}
.lc-pic img{display:block;max-width:none;filter:drop-shadow(0 18px 22px rgba(40,28,20,.28));transition:transform 1s cubic-bezier(.2,.7,.2,1)}
.lc-film .lc-pic img{height:74%}
.lc-strip .lc-pic img{height:44%}
.lc-pre .lc-pic img{height:80%}
.lc-after .lc-pic img{height:68%}
.lc-e{margin-top:clamp(110px,10vw,150px);font-size:clamp(15px,1.4vw,19px);letter-spacing:.24em;text-transform:uppercase}
.lc-j{margin-top:6px;font-size:12px;letter-spacing:.14em;color:var(--ink-soft);padding-bottom:clamp(8px,1vw,12px)}
.lc:hover .lc-bg::before{transform:scale(1.22)}
.lc:hover .lc-pic img{transform:translateY(-8px)}
.lc:hover .lc-e{color:var(--gold)}
.lc .lc-e,.lc .lc-j{transition:color .3s}
@media (max-width:820px){
  .lu-cats{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:28px}
  .lc{padding-top:170px}
  .lc-bg{height:170px}
  .lc-pic{height:210px;bottom:100px}
  .lc-e{margin-top:98px;font-size:14px;letter-spacing:.2em}
  .lc-j{font-size:11px}
}
.nest li.sub a{padding-left:1em;position:relative;font-size:.92em}
.nest li.sub a::before{content:"";position:absolute;left:0;top:50%;width:.55em;height:1px;background:currentColor;opacity:.5}
/* お問い合わせの帯：PCは薄く、文字の左端を下の一覧の左端にそろえる／スマホも少し薄く */
@media (min-width:821px){.cta a{min-height:clamp(170px,17vw,240px);padding-block:clamp(28px,3vw,44px);padding-inline:calc(max(0px,(100% - 1080px)/2) + clamp(16px,5vw,56px))}}
@media (max-width:820px){.cta a{min-height:180px;padding-block:26px}}
/* 01 Making：下の写真（工場の空撮）を少しワイドに */
.stack .c2{aspect-ratio:16/10!important;width:58%!important}
@media (max-width:820px){.stack .c2{width:82%!important}}
/* iPad縦（601〜820px）：写真が画面いっぱいで大きすぎるため、講習のお申込みと同じくらいに抑えて中央に */
@media (min-width:601px) and (max-width:820px){.stack,.lu-pic{max-width:560px;margin-left:auto!important;margin-right:auto!important}}

.hd .logo{padding:14px 10px;margin:-14px -10px}
/* WordPress：ログイン中の管理バーの分だけ、固定ヘッダーを下げる */
.admin-bar .hd{top:32px}
@media (max-width:782px){.admin-bar .hd{top:46px}}
