/* =========================================================
   かたづけて（katazukete.net）STG
   配色：メイン #F4D702 ／ 黒 #1B1918 ／ グレー #DCDEEC・#A0B2C6 ／ 薄黄 #EDE589
   ========================================================= */
:root{
  --yellow:#F4D702;
  --yellow-pale:#EDE589;
  --ink:#1B1918;
  --paper:#FAF9F4;
  --white:#FFFFFF;
  --lav:#DCDEEC;
  --blue:#A0B2C6;
  --mist:#EEF0F6;
  --text:#3C4048;
  --muted:#4A4F5A;
  --title-blue:#3D5170;
  --red:#A0302B;
  --nav-w:88px;
  --mincho:"Shippori Mincho",serif;
  --gothic:"Zen Kaku Gothic New",sans-serif;
  --hand:"Klee One",cursive;
  --en:"Jost",sans-serif;
  --logo:"Kiwi Maru",serif;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--gothic);line-height:1.8;overflow-x:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--ink)}
a:hover{color:var(--title-blue)}
h1,h2,h3,p,ul,ol,dl,dd{margin:0}
ul,ol{padding:0;list-style:none}
:focus-visible{outline:3px solid var(--title-blue);outline-offset:3px}
.skip{position:absolute;left:-9999px;top:0;background:var(--ink);color:var(--white);padding:8px 16px;z-index:100}
.skip:focus{left:8px;top:8px}

/* ---------- ロゴの猫の手 ---------- */
.paw{height:1.05em;width:auto;vertical-align:-.2em;margin-left:.06em;fill:currentColor;transform:rotate(10deg);transform-origin:50% 100%}

/* ---------- 共通見出し ---------- */
.sec-label{display:flex;flex-direction:column;align-items:center;gap:10px;font-family:var(--en);font-size:16px;letter-spacing:.24em}
.sec-label::after{content:"";width:40px;height:2px;background:var(--yellow)}
.sec-label--dark::after{background:var(--ink)}
.sec-title{font-family:var(--mincho);font-size:clamp(28px,3vw,38px);font-weight:700;letter-spacing:.06em;text-align:center;line-height:1.5}

/* =========================================================
   レイアウト：左の追尾メニュー ＋ 本文（フッターは外）
   ========================================================= */
.page{position:relative;display:grid;grid-template-columns:var(--nav-w) minmax(0,1fr)}
.side{position:relative;background:var(--white);border-right:1px solid var(--lav);z-index:50}
.side__logo,.side__toggle{display:none}
.gnav{position:sticky;top:0;height:100vh;max-height:100%;padding-top:64px}
.gnav ul{display:flex;flex-direction:column;align-items:center;gap:28px}
.gnav a{display:flex;align-items:center;writing-mode:vertical-rl;text-decoration:none;font-size:14px;letter-spacing:.2em}
.gnav a.is-active{font-weight:700;background:var(--yellow);width:104px;padding:22px 0 22px 18px;margin-left:16px;clip-path:polygon(0 0,84% 0,100% 50%,84% 100%,0 100%);color:var(--ink)}
.main{min-width:0}
section[id]{scroll-margin-top:0}

/* =========================================================
   FV
   ========================================================= */
/* FVはどの画面でも1画面ぴったり */
.fv{display:grid;grid-template-columns:minmax(0,1fr) 440px;height:100vh;height:100svh;min-height:560px}
.fv__body{position:relative;padding:56px 72px;display:flex;flex-direction:column;overflow:hidden}
.brand{display:inline-flex;flex-direction:column;gap:2px;text-decoration:none;align-self:flex-start}
.brand__ja{font-family:var(--logo);font-size:26px;font-weight:500;letter-spacing:.08em;line-height:1.4}
.brand__en{font-family:var(--en);font-size:11px;letter-spacing:.24em;color:var(--muted)}
.fv__copy{margin-top:clamp(32px,12vh,150px);display:flex;flex-direction:column;gap:26px;position:relative;z-index:2}
.fv__title{font-family:var(--mincho);font-weight:700;font-size:clamp(34px,4.2vw,66px);line-height:1.35;letter-spacing:.04em}
.fv__lead{font-size:clamp(15px,1.3vw,19px);color:var(--text)}
.fv__more{display:inline-flex;align-items:center;gap:14px;text-decoration:none;font-size:14px;letter-spacing:.1em;margin-top:10px;align-self:flex-start}
.fv__more-icon{width:48px;height:48px;border-radius:50%;background:var(--yellow);display:flex;align-items:center;justify-content:center;color:var(--ink)}
.fv__cat{position:absolute;right:0;bottom:5px;height:clamp(220px,48vh,404px);width:auto;z-index:1}
/* 棚のイラスト */
.shelf{position:absolute;right:340px;bottom:64px;width:440px;display:flex;flex-direction:column}
.shelf__items{display:flex;align-items:flex-end;gap:14px;padding:0 28px}
.shelf__box{display:block;border-radius:4px}
.shelf__box--a{width:96px;height:72px;background:var(--blue)}
.shelf__clock{position:relative;display:block;width:62px;height:62px;border-radius:50%;background:var(--yellow-pale)}
.shelf__clock i{position:absolute;left:50%;bottom:50%;background:var(--ink);border-radius:2px;transform-origin:50% 100%}
.shelf__clock .h{width:3px;height:16px;margin-left:-1.5px;transform:rotate(-60deg)}
.shelf__clock .m{width:2px;height:21px;margin-left:-1px;transform:rotate(10deg)}
.shelf__clock b{position:absolute;left:50%;top:50%;width:7px;height:7px;margin:-3.5px 0 0 -3.5px;background:var(--ink);border-radius:50%}
.shelf__files{display:flex;gap:4px;align-items:flex-end}
.shelf__files i{display:block;width:16px;height:92px;border-radius:2px;background:var(--lav)}
.shelf__files i:nth-child(2){background:var(--yellow-pale)}
.shelf__files i:nth-child(3){background:var(--blue)}
.shelf__plant{display:flex;flex-direction:column;align-items:center}
.shelf__plant b{display:block;width:46px;height:46px;border-radius:999px 999px 999px 4px;background:var(--blue)}
.shelf__plant em{display:block;width:34px;height:30px;background:var(--ink);border-radius:0 0 6px 6px}
.shelf__board{height:6px;background:var(--ink);border-radius:3px}
.shelf__legs{display:flex;justify-content:space-between;padding:0 36px}
.shelf__legs i{display:block;width:4px;height:96px;background:var(--ink)}
/* 黄色の帯 */
.fv__side{background:var(--yellow);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:32px;padding:64px 56px}
.fv__say{font-family:var(--hand);font-size:30px;font-weight:600;line-height:1.7;text-align:center}
.fv__note{font-size:14px;line-height:1.9;text-align:center}
.fv__arrow{align-self:flex-end;display:inline-flex;align-items:center;gap:10px;text-decoration:none;font-size:14px;font-weight:700}

/* =========================================================
   CONCEPT
   ========================================================= */
.concept{background:var(--white);padding:120px 72px 128px;display:flex;flex-direction:column;align-items:center;gap:56px}
.concept__row{display:flex;align-items:flex-start;justify-content:center;gap:72px}
.concept__text{writing-mode:vertical-rl;height:380px;font-size:15px;line-height:2.3;letter-spacing:.1em;color:var(--text)}
.concept__title{writing-mode:vertical-rl;height:400px;font-family:var(--mincho);font-size:34px;font-weight:700;line-height:1.7;letter-spacing:.14em}
.concept__visual{position:relative;width:520px;max-width:100%;aspect-ratio:520/400;flex-shrink:0}
.hex{position:absolute;inset:5% 0;background:var(--yellow);clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%);overflow:hidden}
.hex img{position:absolute;left:50%;bottom:-4px;transform:translateX(-50%);width:63%}
.spark{position:absolute;fill:var(--blue)}
.s1{width:26px;left:-8px;top:8%}.s2{width:16px;left:7%;top:1%}.s3{width:22px;right:-6px;top:18%}.s4{width:30px;right:2%;bottom:2%}.s5{width:14px;left:4%;bottom:8%}

/* =========================================================
   FOR YOU
   ========================================================= */
.foryou{position:relative;background:var(--yellow);padding:96px 72px 104px;display:flex;flex-direction:column;align-items:center;gap:28px;text-align:center}
.foryou::after{content:"";position:absolute;left:50%;bottom:-22px;width:48px;height:48px;background:var(--yellow);transform:translateX(-50%) rotate(45deg);border-radius:6px;z-index:1}
.foryou__title{font-size:clamp(22px,2.2vw,30px);font-weight:700;letter-spacing:.08em;line-height:1.6}
.foryou__text{font-size:16px;line-height:2.2;max-width:720px}
.bubbles{position:absolute;top:70px;display:flex;flex-direction:column;gap:22px}
.bubbles li{background:var(--white);border-radius:999px;padding:18px 26px;font-family:var(--hand);font-size:17px;font-weight:600;line-height:1.4;white-space:nowrap}
.bubbles--l{left:40px;align-items:flex-start}.bubbles--l li:nth-child(2){margin-left:70px}
.bubbles--r{right:40px;align-items:flex-end}.bubbles--r li:nth-child(2){margin-right:70px}

/* =========================================================
   6 POINTS
   ========================================================= */
.points{position:relative;background:var(--mist);padding:128px 72px 120px;display:flex;flex-direction:column;gap:72px}
.points__head{display:flex;flex-direction:column;align-items:center;gap:6px}
.points__catch{font-size:17px;font-weight:700;letter-spacing:.2em;transform:rotate(-4deg)}
.points__title{display:flex;align-items:center;gap:20px;font-size:20px;font-weight:700;letter-spacing:.16em}
.points__num{font-family:var(--en);font-size:88px;font-weight:400;line-height:1;background:var(--yellow);width:104px;height:104px;border-radius:50%;display:flex;align-items:center;justify-content:center;letter-spacing:0}
.badge{position:absolute;right:72px;top:96px;width:150px;height:150px;border-radius:50%;border:2px dashed var(--ink);background:var(--yellow);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;text-decoration:none;font-size:15px;font-weight:700;line-height:1.6;text-align:center}
.points__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:40px;row-gap:80px;max-width:1120px;width:100%;margin:0 auto}
.point{position:relative;background:var(--white);border:1px solid var(--blue);border-top:none;padding:72px 32px 44px;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
.point::before,.point::after{content:"";position:absolute;top:0;height:1px;background:var(--blue)}
.point::before{left:0;width:64px}
.point::after{left:236px;right:0}
.point__no{position:absolute;top:-44px;left:74px;display:flex;align-items:flex-end;gap:6px}
.point__label{position:absolute;left:14px;top:-6px;font-family:var(--en);font-size:12px;letter-spacing:.12em}
.point__no i{display:block;width:1px;height:64px;background:var(--ink);transform:rotate(40deg);margin-right:14px}
.point__digit{font-family:var(--en);font-size:52px;font-weight:300;line-height:1}
.point__icon{width:56px;height:56px;fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;margin:8px 0}
.point__lead{font-size:13px;color:var(--muted)}
.point__title{text-wrap:balance;font-family:var(--mincho);font-size:clamp(21px,1.75vw,25px);font-weight:700;color:var(--title-blue);letter-spacing:.06em;line-height:1.5}
.point__body{font-size:14px;line-height:2;color:var(--text);margin-top:6px}

/* =========================================================
   PRICE
   ========================================================= */
.price{padding:128px 72px 120px;display:flex;flex-direction:column;gap:32px}
.price .sec-title{margin-bottom:32px}
.plans{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));max-width:1120px;width:100%;margin:0 auto;padding-left:2px;row-gap:48px}
.plan{position:relative;border:0 solid var(--ink);border-left-width:2px;border-right-width:2px;margin-left:-2px;padding:8px 30px 12px;display:flex;flex-direction:column;gap:14px;min-height:380px}
.plan:not(:last-child)::after{content:"";position:absolute;right:-11px;top:50%;width:18px;height:30px;transform:translateY(-50%);background:var(--yellow);clip-path:polygon(0 0,100% 50%,0 100%,33% 50%)}
.plan__head{display:flex;align-items:flex-end;justify-content:space-between;gap:8px;min-height:110px}
.plan__en{display:block;font-family:var(--en);font-size:12px;letter-spacing:.2em;color:var(--muted)}
.plan__name{font-size:21px;font-weight:700;line-height:1.5}
.plan__no{font-family:var(--en);font-size:112px;font-weight:500;line-height:.9;color:var(--yellow);-webkit-text-stroke:1.5px var(--ink)}
.plan__price{border-top:1px solid var(--lav);padding-top:16px;font-size:14px}
.plan__price strong{font-family:var(--mincho);font-size:32px;font-weight:700;margin-right:4px}
.plan__body{font-size:14px;line-height:2;color:var(--text);flex-grow:1}
.plan__icon{width:40px;height:40px;align-self:center;fill:none;stroke:var(--ink);stroke-width:2;stroke-linecap:round;stroke-linejoin:round}
.price__note{text-align:center;font-size:13px;color:var(--muted);margin-top:32px}

/* =========================================================
   FLOW
   ========================================================= */
.flow{position:relative;background:var(--yellow);padding:104px 120px 150px;display:flex;flex-direction:column;align-items:center;gap:56px}
.flow__head{display:flex;flex-direction:column;align-items:center;gap:6px}
.flow__en,.contact__en{font-family:var(--en);font-size:13px;letter-spacing:.24em}
.steps{display:flex;align-items:flex-start;gap:28px;width:100%;max-width:1040px;position:relative;z-index:1}
.step{flex:1;display:flex;flex-direction:column;gap:18px}
.step:not(:last-child){position:relative}
.step:not(:last-child)::after{content:"";position:absolute;right:-21px;top:60px;width:10px;height:10px;border-top:2px solid var(--ink);border-right:2px solid var(--ink);transform:rotate(45deg)}
.step__no{display:flex;flex-direction:column;align-items:center;border-bottom:2px solid var(--ink);padding-bottom:14px}
.step__no span{font-family:var(--en);font-size:14px;letter-spacing:.24em}
.step__no b{font-family:var(--en);font-size:52px;font-weight:300;line-height:1}
.step h3{font-size:20px;text-align:center}
.step p{font-size:15px;line-height:2}
.flow__wave{position:absolute;left:0;bottom:-1px;width:100%;height:90px;fill:var(--white)}

/* =========================================================
   CONTACT
   ========================================================= */
.contact{background:var(--white);padding:72px 24px 200px;display:flex;flex-direction:column;align-items:center;gap:40px}
.contact__head{display:flex;flex-direction:column;align-items:center;gap:6px}
.contact__en{color:var(--muted)}
.monitor{width:100%;max-width:720px;background:#FBF7D6;border:1.5px dashed var(--ink);border-radius:16px;padding:22px 28px;display:flex;align-items:center;gap:20px;font-size:14px;line-height:1.9}
.monitor__tag{flex-shrink:0;background:var(--yellow);font-size:13px;font-weight:700;padding:6px 14px;border-radius:999px}
.form{width:100%;max-width:720px;display:flex;flex-direction:column;gap:22px}
.field{display:flex;flex-direction:column;gap:8px;border:none;margin:0;padding:0;min-width:0}
.field label,.field legend{font-size:14px;font-weight:700;padding:0}
.field legend{margin-bottom:12px}
.field-row{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.req{color:var(--red)}
.form input[type=text],.form input[type=tel],.form input[type=email],.form textarea{width:100%;border:1px solid var(--lav);background:var(--mist);border-radius:6px;padding:0 16px;font-size:16px;font-family:inherit;color:var(--ink)}
.form input[type=text],.form input[type=tel],.form input[type=email]{height:52px}
.form textarea{padding:14px 16px;line-height:1.8;resize:vertical}
.form [aria-invalid=true]{border-color:var(--red);background:#FFF4F3}
.checks{display:flex;flex-wrap:wrap;gap:14px 28px;font-size:15px}
.checks label{display:flex;align-items:center;gap:8px;font-weight:400}
.checks input{width:20px;height:20px;accent-color:var(--ink);margin:0}
.form__foot{display:flex;flex-direction:column;align-items:center;gap:14px;margin-top:12px}
.form__foot > a{font-size:14px}
.req-note{font-size:13px;color:var(--red)}
.btn-submit{margin-top:8px;min-width:280px;height:60px;border-radius:999px;border:1.5px solid var(--ink);background:var(--yellow);font-size:16px;font-weight:700;font-family:inherit;color:var(--ink);cursor:pointer}
.btn-submit:hover{background:var(--ink);color:var(--yellow)}
.form__msg{font-size:14px;font-weight:700;text-align:center;min-height:1.8em}

/* =========================================================
   FOOTER（白黒反転）
   ========================================================= */
.footer{position:relative;background:var(--ink);color:var(--paper);border-top:8px solid var(--yellow);padding:88px 160px 40px;display:flex;flex-direction:column;gap:64px}
.footer a{color:var(--paper)}
.footer a:hover{color:var(--yellow)}
.footer__cat{position:absolute;left:clamp(16px,17.8vw,256px);bottom:calc(100% - 2px);width:clamp(220px,29vw,420px)}
.footer__top{display:flex;justify-content:space-between;align-items:flex-start;gap:64px}
.footer__brand{display:flex;flex-direction:column;gap:18px;max-width:380px}
.brand--light{color:var(--paper)}
.brand--light .brand__ja{font-size:32px}
.brand--light .brand__en{color:#B9BCC8}
.footer__brand p{font-size:14px;line-height:2;color:var(--lav)}
.btn-yellow{align-self:flex-start;margin-top:8px;text-decoration:none;background:var(--yellow);color:var(--ink) !important;padding:16px 32px;border-radius:999px;font-size:15px;font-weight:700}
.btn-yellow:hover{background:var(--paper)}
.footer__label{font-family:var(--en);font-size:12px;letter-spacing:.24em;color:var(--yellow)}
.footer__nav{display:flex;flex-direction:column;gap:16px}
.footer__nav a{text-decoration:none;font-size:15px}
.footer__company{display:flex;flex-direction:column;gap:16px;max-width:360px}
.footer__company dl{display:grid;grid-template-columns:88px minmax(0,1fr);row-gap:12px;font-size:14px;line-height:1.8}
.footer__company dt{color:#B9BCC8}
.footer__pluto{font-size:13px;line-height:2;color:#B9BCC8}
.footer__bottom{border-top:1px solid #3A3836;padding-top:28px;display:flex;justify-content:space-between;align-items:center;gap:20px}
.footer__links{display:flex;gap:28px;font-size:13px}
.footer__links a{color:var(--lav)}
.footer__copy{display:flex;align-items:center;gap:28px}
.footer__copy small{font-family:var(--en);font-size:12px;letter-spacing:.1em;color:#B9BCC8}
.pagetop{width:56px;height:56px;border-radius:50%;background:var(--yellow);display:flex;align-items:center;justify-content:center;color:var(--ink) !important}

/* =========================================================
   レスポンシブ
   ========================================================= */
@media (max-height:760px) and (min-width:901px){
  .shelf{display:none}
}
@media (max-width:1280px){
  .shelf{display:none}
  .bubbles{position:static;flex-direction:row;flex-wrap:wrap;justify-content:center;gap:12px}
  .bubbles li:nth-child(2){margin:0 !important}
  .foryou{padding-top:72px}
  .footer{padding:88px 72px 40px}
}
@media (max-width:1100px){
  .fv{grid-template-columns:minmax(0,1fr) 340px}
  .fv__side{padding:48px 32px}
  .fv__say{font-size:24px}
  .concept__row{gap:40px}
  .points__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .badge{position:static;align-self:center;margin-top:-32px}
  .plans{grid-template-columns:repeat(2,minmax(0,1fr))}
  .plan:nth-child(2n)::after{display:none}
  .flow{padding:96px 48px 140px}
}

/* ---- タブレット・スマホ：左メニュー → 上部バー（フッターまでは付いてこない） ---- */
@media (max-width:900px){
  .page{display:block}
  .side{position:sticky;top:0;height:60px;display:flex;align-items:center;justify-content:space-between;padding:0 16px;border-right:none;border-bottom:1px solid var(--lav)}
  .page{display:flex;flex-direction:column}
  .side__logo{display:block;text-decoration:none;font-family:var(--logo);font-size:20px;font-weight:500;letter-spacing:.08em}
  .side__toggle{display:flex;flex-direction:column;justify-content:center;gap:6px;width:44px;height:44px;border:none;background:none;padding:10px;cursor:pointer}
  .side__toggle span{display:block;height:2px;background:var(--ink);transition:transform .2s,opacity .2s}
  .side__toggle[aria-expanded=true] span:nth-child(1){transform:translateY(8px) rotate(45deg)}
  .side__toggle[aria-expanded=true] span:nth-child(2){opacity:0}
  .side__toggle[aria-expanded=true] span:nth-child(3){transform:translateY(-8px) rotate(-45deg)}
  .gnav{position:absolute;top:60px;left:0;right:0;height:auto;padding:8px 0 16px;background:var(--white);border-bottom:1px solid var(--lav);display:none}
  .gnav.is-open{display:block}
  .gnav ul{gap:0;align-items:stretch}
  .gnav a{writing-mode:horizontal-tb;padding:14px 24px;font-size:15px}
  .gnav a.is-active{width:auto;margin:0;padding:14px 24px;clip-path:none;border-left:6px solid var(--ink)}
  .fv{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr) auto;height:calc(100vh - 60px);height:calc(100svh - 60px);min-height:500px}
  .fv__body{padding:28px 20px 0;min-height:0}
  .fv .brand{display:none}
  .fv__copy{margin-top:24px;max-width:70%}
  .fv__cat{height:min(40svh,300px)}
  .fv__side{padding:20px 24px 24px;gap:10px}
  .fv__say{font-size:21px;line-height:1.6}
  .fv__note{font-size:12px;line-height:1.7}
  .fv__more{margin-top:0}
  .concept{padding:88px 24px}
  .concept__row{flex-wrap:wrap;gap:32px 40px}
  .concept__row{width:100%}
  .concept__visual{order:-1;flex:0 0 100%;width:100%;max-width:440px}
  .foryou{padding:72px 24px 88px}
  .foryou__text br{display:none}
  .points{padding:96px 24px}
  .price{padding:96px 24px}
  .contact{padding:72px 16px 180px}
  .footer{padding:72px 24px 32px}
  .footer__top{flex-direction:column;gap:40px}
}
@media (max-width:640px){
  .fv__copy{max-width:100%}
  .fv__title{font-size:clamp(26px,7.8vw,34px)}
  .fv__cat{height:min(32svh,240px)}
  .fv__copy{gap:16px}
  .points__title{flex-wrap:wrap;justify-content:center;gap:8px 14px;font-size:17px}
  .points__num{width:80px;height:80px;font-size:64px}
  .points__grid{grid-template-columns:1fr}
  .point{padding:72px 24px 40px}
  .point::after{left:220px}
  .plans{grid-template-columns:1fr}
  .plan{min-height:0;padding:8px 24px 24px}
  .plan::after{display:none}
  .steps{flex-direction:column;gap:48px}
  .step::after{display:none}
  .monitor{flex-direction:column;align-items:flex-start;gap:10px}
  .field-row{grid-template-columns:1fr}
  .btn-submit{min-width:0;width:100%}
  .footer__bottom{flex-direction:column-reverse;align-items:flex-start}
}

/* 縦書きの中の数字を横に並べて立てる（縦中横） */
.tcy{text-combine-upright:all;-webkit-text-combine:horizontal}

/* =========================================================
   下層ページ（プライバシーポリシー／特定商取引法／送信完了）
   ========================================================= */
.sub{background:var(--paper)}
.subhead{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:24px clamp(16px,5vw,72px);background:var(--white);border-bottom:1px solid var(--lav)}
.subhead__back{font-size:14px;text-decoration:none;border:1.5px solid var(--ink);border-radius:999px;padding:10px 20px;white-space:nowrap}
.subhead__back:hover{background:var(--yellow);color:var(--ink)}
.doc{max-width:860px;margin:0 auto;padding:72px 24px 120px}
.doc__head{display:flex;flex-direction:column;align-items:center;gap:8px;margin-bottom:56px;text-align:center}
.doc__en{font-family:var(--en);font-size:14px;letter-spacing:.24em}
.doc__en::after{content:"";display:block;width:40px;height:2px;background:var(--yellow);margin:10px auto 0}
.doc__title{font-family:var(--mincho);font-size:clamp(26px,3vw,34px);font-weight:700;letter-spacing:.06em;line-height:1.5}
.doc__body{background:var(--white);border-radius:20px;padding:clamp(28px,5vw,56px);font-size:15px;line-height:2;color:var(--text)}
.doc__body h2{font-size:17px;color:var(--ink);margin:40px 0 10px;padding-left:12px;border-left:4px solid var(--yellow);line-height:1.6}
.doc__body h2:first-of-type{margin-top:32px}
.doc__body ol{list-style:decimal;padding-left:1.6em;margin:8px 0 0}
.doc__body ol li{margin:4px 0}
.doc__table{display:grid;grid-template-columns:140px minmax(0,1fr);margin:12px 0 0;border-top:1px solid var(--lav)}
.doc__table--wide{grid-template-columns:200px minmax(0,1fr);margin:0}
.doc__table dt,.doc__table dd{padding:16px 8px;border-bottom:1px solid var(--lav);margin:0}
.doc__table dt{font-weight:700;color:var(--ink)}
.doc__date{text-align:right;margin-top:32px;font-size:14px}
.doc__body--center{display:flex;flex-direction:column;align-items:center;gap:20px;text-align:center}
.thanks__cat{width:220px}
.thanks__say{text-wrap:balance;font-family:var(--hand);font-size:clamp(20px,5.4vw,26px);font-weight:600;line-height:1.6;color:var(--ink)}
.thanks__note{font-size:13px;color:var(--muted)}
.btn-yellow--center{align-self:center;margin-top:16px}
.subfoot{background:var(--ink);color:#B9BCC8;border-top:8px solid var(--yellow);padding:32px clamp(16px,5vw,72px);display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:16px}
.subfoot a{color:var(--lav)}
.subfoot small{font-family:var(--en);font-size:12px;letter-spacing:.1em}
@media (max-width:640px){
  .doc__table,.doc__table--wide{grid-template-columns:1fr}
  .doc__table dt{border-bottom:none;padding-bottom:0}
  .subhead .brand__en{display:none}
}

/* ボット対策の見えない入力欄 */
.hp{position:absolute;left:-9999px;width:1px;height:1px;overflow:hidden}

/* スマホ：FVの棚と小物も表示（小さくして左下に） */
@media (max-width:900px){
  .shelf{display:flex;right:auto;left:12px;bottom:0;transform:scale(.5);transform-origin:left bottom;z-index:0}
}
@media (max-width:900px) and (max-height:700px){
  .shelf{transform:scale(.42)}
}

/* 小さめのノートPC：棚も小さくして左下に表示 */
@media (min-width:901px) and (max-width:1280px), (min-width:901px) and (max-height:820px){
  .shelf{display:flex;right:auto;left:72px;bottom:28px;transform:scale(.7);transform-origin:left bottom}
}
@media (min-width:901px) and (max-height:640px){
  .shelf{transform:scale(.55)}
}

/* スマホ：文字の下にイラストの場所を確保し、間の余白を詰める（FVの高さは中身に合わせる） */
@media (max-width:900px){
  .fv{height:auto;min-height:0}
  .fv__body{min-height:0;--illust:clamp(200px,34svh,280px);padding-bottom:calc(var(--illust) + 12px)}
  .fv__cat{height:var(--illust)}
  .shelf{transform:scale(.55)}
}
@media (max-width:380px){
  .shelf{transform:scale(.46)}
}

/* イラストの置き場（PCではレイアウトに影響しない） */
.fv__stage{display:contents}

/* スマホ：FVを1画面に。文字の下の残りの高さをイラスト、黄色い帯にはゆとり */
@media (max-width:900px){
  .fv{height:calc(100svh - 60px);min-height:520px;grid-template-rows:minmax(0,1fr) auto}
  .fv__body{padding-bottom:0;display:flex;flex-direction:column}
  .fv__stage{display:block;position:relative;flex:1 1 auto;min-height:130px;margin-top:12px;margin-right:-20px;container-type:size}
  .fv__cat{height:min(100cqh,300px);bottom:-2px;right:0}
  .shelf{left:0;bottom:0}
  .fv__side{padding:36px 24px 40px;gap:16px}
  .fv__say{font-size:22px}
  .fv__note{font-size:13px;line-height:1.9}
}
@media (max-width:900px) and (max-height:700px){
  .fv__body{padding-top:20px}
  .fv__copy{gap:12px;margin-top:8px}
  .fv__stage{min-height:100px}
  .fv__side{padding:24px 24px 28px;gap:10px}
}