@charset "UTF-8";
/* ==========================================================================
   b.s. — sandaime.css（SPECIAL：三代目PROJECT）
   白い背景・鮮やかなグリーンの斜めの面・黒い文字。
   共通ヘッダー／ページナビは使わず、ロゴだけ（TOPへ戻る）を固定しています。
   数値はIllustratorのデザイン座標（幅1280px基準）。
   ========================================================================== */

@layer pages {
  .p-sandaime { background: var(--c-white); color: var(--c-black); }
  .p-sandaime ::selection { background: var(--c-green); color: var(--c-black); }
  .p-sandaime .l-footer { background: var(--c-footer); }

  /* ロゴ */
  .p-sandaime-hero { --scene-y: 0; --scene-h: 939; }
  .p-sandaime-hero__logo { --x: 367.9; --y: 321.9; --w: 509.3; }

  /* WEB MEDIA */
  .p-sandaime-media { --scene-y: 939; --scene-h: 415; }
  .p-sandaime-media__green { --x: 460.5; --y: 939.0; --w: 819.5; --h: 838.0; --shape-c: var(--c-green); --shape-clip: polygon(0.00% 21.21%, 0.00% 100.00%, 100.00% 78.79%, 100.00% 0.00%); }
  .p-sandaime-media__text { --x: 630.1; --y: 1098.2; --fs: 42.997; --lh: 1.6431; --ls: 0.0408em; }

  /* 動画（デザインの黒い16:9の枠。映像の上下の黒帯は枠と一体に見せるため残しています） */
  .p-sandaime-movie { --scene-y: 1354; --scene-h: 846; }
  .p-sandaime-movie__figure { --x: 133.6; --y: 1354; --w: 1036.5; }
  /* PLAY：人物のシルエットに重ねず、人物の視線の先（左の空）に置く */
  .p-sandaime-movie__figure .c-movie__play { justify-content: flex-start; padding: 4% 0 0 8%; }
  /* 代替書体の和文は字幅が広いため字間を詰め、欧文との間（語間）を広げてデザインの字面に合わせています */
  .p-sandaime-movie__caption-en { letter-spacing: 0.06em; }
  .p-sandaime-movie__caption { --x: 364.9; --y: 2017.8; --fs: 37; --lh: 1; --ls: -0.03em; --k: var(--k-corporate); word-spacing: 0.55em; --slant: 0deg; --scene-y: 1937; margin-left: calc(var(--frame-x) + var(--x) * var(--u) - var(--movie-x)); }

  /* core message */
  .p-sandaime-core { --scene-y: 2200; --scene-h: 1450; }
  .p-sandaime-core__green1 { --x: 0.0; --y: 2200.0; --w: 666.7; --h: 856.9; --shape-c: var(--c-green); --shape-clip: polygon(0.00% 16.87%, 0.00% 100.00%, 100.00% 83.13%, 100.00% 0.00%); }
  .p-sandaime-core__green2 { --x: 666.5; --y: 2776.6; --w: 613.5; --h: 845.4; --shape-c: var(--c-green); --shape-clip: polygon(0.00% 15.74%, 0.00% 100.00%, 100.00% 84.26%, 100.00% 0.00%); }
  .p-sandaime-core__green3 { --x: 720.5; --y: 2804.4; --w: 559.5; --h: 833.6; --shape-c: var(--c-green); --shape-clip: polygon(0.00% 14.55%, 0.00% 100.00%, 100.00% 85.45%, 100.00% 0.00%); }
  .p-sandaime-core__title { --x: 29.8; --y: 2371.9; --fs: 72.412; --lh: 1.2; --ls: 0.0000em; }
  .p-sandaime-core__title .l0 { letter-spacing: 0.0293em; }
  .p-sandaime-core__text { --x: 29.8; --y: 2532.7; --fs: 35.397; --lh: 1.4719; --ls: 0.0408em; }
  .p-sandaime-core__text .l3 { letter-spacing: 0.0800em; }

  /* 取材を希望される三代目の方へ */
  .p-sandaime-ask { --scene-y: 3650; --scene-h: 1150; }
  .p-sandaime-ask__green { --x: 449.5; --y: 3722.6; --w: 830.5; --h: 370.4; --shape-c: var(--c-green); --shape-clip: polygon(0.00% 48.62%, 0.00% 100.00%, 100.00% 51.38%, 100.00% 0.00%); }
  .p-sandaime-ask__title { --x: 29.8; --y: 4017.9; --fs: 72.412; --lh: 1.2; --ls: 0.0407em; }
  .p-sandaime-ask__text { --x: 29.8; --y: 4194.5; --fs: 35.397; --lh: 1.4722; --ls: 0.0408em; }
  .p-sandaime-ask__btn { position: relative; z-index: 4; /* 周囲の文字より手前に置き、押せる範囲を確保 */
    --frame-x: 0px;
    justify-self: stretch;
    margin-left: calc((var(--vw, 100vw) - var(--design-w) * var(--u)) / 2);
    width: calc(var(--design-w) * var(--u));
    pointer-events: none;
  }
  .p-sandaime-ask__btn > * { pointer-events: auto; }
  .p-sandaime-ask__btn-bg { --x: 386.5; --y: 4136.0; --w: 856.2; --h: 376.0; --shape-c: var(--c-black); --shape-clip: polygon(100.00% 50.61%, 0.00% 100.00%, 0.00% 49.39%, 100.00% 0.00%); }
  .p-sandaime-ask__btn-label { --x: 533.7; --y: 4408.0; --fs: 46.092; --lh: 1.2; --ls: -0.0089em; }
  .p-sandaime-ask__btn-label .l0 { translate: 0 calc(10.5 * var(--u)); }
  .p-sandaime-ask__btn-bg,
  .p-sandaime-ask__btn-label { transition: transform 0.6s var(--ease-out), translate 0.6s var(--ease-out), background-color 0.3s; }
  @media (hover: hover) {
    .p-sandaime-ask__btn:hover .p-sandaime-ask__btn-bg { transform: skewY(-2.5deg); }
    .p-sandaime-ask__btn:hover .p-sandaime-ask__btn-label { translate: 0.5em -0.1em; }
  }
  .p-sandaime-ask__btn:focus-visible { outline: none; }
  .p-sandaime-ask__btn:focus-visible .p-sandaime-ask__btn-bg { outline: 3px solid var(--c-green); outline-offset: 4px; }
  @media (hover: none) {
    .p-sandaime-ask__btn:active .p-sandaime-ask__btn-bg { transform: skewY(-2.5deg); transition-duration: 0.25s; }
  }

  /* メディアでの発信を超えて */
  .p-sandaime-net { --scene-y: 4800; --scene-h: 700; }
  .p-sandaime-net__green { --x: 0.0; --y: 4864.0; --w: 720.7; --h: 346.6; --shape-c: var(--c-green); --shape-clip: polygon(0.00% 45.10%, 0.00% 100.00%, 100.00% 54.90%, 100.00% 0.00%); }
  .p-sandaime-net__title { --x: 29.8; --y: 4861.9; --fs: 72.412; --lh: 1.205; --ls: 0.0407em; }
  .p-sandaime-net__text { --x: 29.8; --y: 5186.7; --fs: 35.397; --lh: 1.4719; --ls: 0.0408em; }
  .p-sandaime-net__text .l1 { letter-spacing: 0.1021em; }

  /* contact */
  .p-sandaime-contact { --scene-y: 5500; --scene-h: 460; scroll-margin-top: calc(160 * var(--u)); }
  .p-sandaime-contact__title { --x: 355.9; --y: 5668.9; --fs: 160.952; --lh: 1.2; --ls: -0.0540em; --k: var(--k-sans); --slant: var(--slant-en); }
  .p-sandaime-contact__word { font-family: var(--ff-sans); font-weight: 700; font-kerning: normal; }
  .p-sandaime-contact__mail { --x: 29.8; --y: 5855.5; --fs: 47.246; --lh: 1.2; --ls: 0.0000em; }
  .p-sandaime-contact__mail .l0 { letter-spacing: 0.0161em; }
  .p-sandaime-contact__note { --x: 514.8; --y: 5814.7; --fs: 28.998; --lh: 1.2; --ls: 0.0408em; }
  .p-sandaime-contact__link { text-decoration: underline; text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
  @media (hover: hover) {
    .p-sandaime-contact__link:hover { text-decoration-color: transparent; background: var(--c-green); }
  }

  /* ロゴ（締め） */
  .p-sandaime-closing { --scene-y: 5960; --scene-h: 477; }
  .p-sandaime-closing__tagline { --x: 513.0; --y: 6064.1; --fs: 24.303; --lh: 1.7389; --ls: 0.0406em; --k: var(--k-shippori); }
  .p-sandaime-closing__logo { --x: 763.34; --y: 6082.4; --w: 464.05; }
}

/* ---------- 動き：グリーンの面が蛍光ペンのように引かれ、動画はそのあとに現れる ---------- */
@layer motion {
  .js-motion [data-intro="stamp"] { opacity: 0; scale: 1.06; transition: opacity 0.5s linear 0.2s, scale 0.9s var(--ease-out) 0.2s; }
  .js-motion.is-ready [data-intro="stamp"] { opacity: 1; scale: 1; }
  .js-motion .p-sandaime .c-shape--poly[data-reveal="wipe"] { clip-path: polygon(0 0, 0 0, 0 100%, 0 100%); transition: clip-path 1s var(--ease-inout); }
  .js-motion .p-sandaime .c-shape--poly[data-reveal="wipe"].is-inview { clip-path: var(--shape-clip); }
}

/* ==========================================================================
   SMARTPHONE／TABLET（〜1023px）
   ========================================================================== */
@layer pages {
  @media (max-width: 1023px) {
    .p-sandaime-hero { --spb: 0; }
    .p-sandaime-hero__logo { --sx: 40; --sy: 96; --sw: 330; }
    .p-sandaime-media { --spb: 20; }
    .p-sandaime-media__green { --sx: 70; --sy: -10; --sw: 320; --sh: 250; }
    .p-sandaime-media__text { --sx: 96; --sy: -208; --sfs: 22; --sfs-min: 19px; --slh: 1.6; z-index: 3; }
    .p-sandaime-movie { --spb: 30; }
    .p-sandaime-movie__figure { margin: 20px 0 0; width: 100%; }
    .p-sandaime-movie__caption { margin: 12px 0 0 16px; font-size: 14px; }
    .p-sandaime-core { --spb: 30; }
    .p-sandaime-core__green1 { --sx: 0; --sy: 40; --sw: 300; --sh: 340; }
    .p-sandaime-core__green2 { position: absolute; margin: 0; right: 0; top: 34%; --sw: 230; --sh: 300; }
    .p-sandaime-core__green3 { position: absolute; margin: 0; right: 0; top: 36%; --sw: 210; --sh: 290; }
    .p-sandaime-core__title { --sx: 16; --sy: -296; --sfs: 42; --slh: 1.1; z-index: 3; --o: 1; }
    .p-sandaime-core__text { --sx: 18; --sy: 36; --sfs: 15.5; --sfs-min: 14.5px; --slh: 1.9; z-index: 3; --o: 2; }
    .p-sandaime-ask { --spb: 30; }
    .p-sandaime-ask__green { --sx: 120; --sy: 40; --sw: 270; --sh: 120; }
    .p-sandaime-ask__title { --sx: 16; --sy: -110; --sfs: 34; --sfs-min: 28px; --slh: 1.2; z-index: 3; }
    .p-sandaime-ask__text { --sx: 18; --sy: 30; --sfs: 15.5; --sfs-min: 14.5px; --slh: 1.9; z-index: 3; }
    .p-sandaime-ask__btn { margin-left: 0; width: 100%; display: flex; flex-direction: column; align-items: flex-start; }
    .p-sandaime-ask__btn-bg { --shape-clip: polygon(0 calc(60 * var(--s)), 100% 0, 100% calc(100% - 60 * var(--s)), 0 100%); }
    .p-sandaime-ask__btn-bg { --sx: 30; --sy: 40; --sw: 340; --sh: 0; --shs: 150; }
    .p-sandaime-ask__btn-label { --sx: 64; --sys: -92; translate: 0 calc(70 * (var(--s) - var(--sf))); --sfs: 19; --sfs-min: 17px; --slh: 1.2; }
    .p-sandaime-net { --spb: 30; }
    .p-sandaime-net__green { --sx: 0; --sy: 96; --sw: 280; --sh: 110; }
    .p-sandaime-net__title { --sx: 16; --sy: -150; --sfs: 30; --sfs-min: 25px; --slh: 1.25; z-index: 3; }
    .p-sandaime-net__text { --sx: 18; --sy: 30; --sfs: 15.5; --sfs-min: 14.5px; --slh: 1.9; z-index: 3; }
    .p-sandaime-contact { --spb: 40; scroll-margin-top: 70px; }
    .p-sandaime-contact__title { --sx: 60; --sy: 90; --sfs: 76; --slh: 1; --sls: -0.05em; }
    .p-sandaime-contact__mail { --o: 1; --sx: 18; --sy: 30; --sfs: 21; --sfs-min: 18px; --slh: 1.3; }
    .p-sandaime-contact__note { --o: 2; --sx: 30; --sy: 16; --sfs: 14.5; --sfs-min: 13.5px; --slh: 1.7; }
  }
}