:root{
  /* color */
  --c-base:#F7F5F0; --c-paper:#FFFFFF;
  --c-sky:#64C3EB; --c-sky-band:#7BCDEE; --c-sky-deep:#4F92AE; --c-sky-pale:#B9E0F1;
  --c-navy:#0C4562; --c-ink:#594B47; --c-gold:#D4B100; --c-red:#FC4215; --c-line:#E3DFD6;
  --c-title:#009FE8; --c-muted:#988D76;
  /* type */
  --f-jp:"YakuHanJPs","Noto Sans JP",sans-serif; --f-en:"Jost",sans-serif;
  --fs-display:clamp(2.2rem,5vw,4rem);
  --fs-h2:clamp(1.3rem,2.5vw,1.9rem);
  --fs-lead:clamp(1.05rem,1.6vw,1.25rem);
  --fs-body:1rem; --fs-sm:.82rem; --lh-body:1.9; --lh-head:1.25;
  --fs-en-lg:clamp(40px,5.625vw,108px);
  --fs-en-md:clamp(32px,4.167vw,80px);
  --fs-title:clamp(20px,1.667vw,32px);
  --fs-body2:clamp(16px,.9375vw,18px);
  /* space */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px;
  --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px; --s-10:128px;
  /* radius / shadow */
  --r-card:18px; --r-pill:999px; --shadow-card:0 6px 24px rgba(12,69,98,.10);
  /* layout */
  --site-max:1920px;
  --container:1260px; --gutter:clamp(16px,4vw,48px);
  --edge:70px;
}
@media (max-width:1279px){
  :root{ --gutter:20px; --edge:20px; --fs-en-lg:60px; --fs-en-md:40px; }
}