@charset "UTF-8";
/* ============================================================================
   株式会社荒畑園  新トップページ（index-new.html 専用）  ─ 2026.09
   ----------------------------------------------------------------------------
   方針
     ・既存の style.css とは独立。下層ページには影響しません
     ・大きな写真と余白、英字ラベル＋和文見出しの2段組みで「先進的・モダン」に振る
     ・スクロール連動の演出は html.fx が付いているときだけ有効
       （動きを減らす設定・JS無効時は静的なレイアウトで全文が読める）
     ・演出の進み具合は JS が各セクションに --p（0〜1）として渡し、CSS が描く
   ----------------------------------------------------------------------------
   目次
     01 変数 / 02 リセット / 03 共通部品 / 04 ヘッダー / 05 メニュー
     06 ファーストビュー / 07 私たちについて / 08 商品 / 09 強み / 10 工程
     11 茶草場・サステナビリティ / 12 受賞 / 13 会社情報 / 14 採用
     15 ショップ・問い合わせ / 16 フッター / 17 表示演出 / 18 動きを減らす
   ========================================================================== */

/* ------------------------------------------------------------------ 01 変数 */
:root {
  --g900: #0D2318;
  --g800: #143222;
  --g700: #1D4A33;
  --g600: #2A6746;
  --matcha:    #7FA34F;
  --matcha-lt: #A9C77E;   /* 濃色背景の上の文字用 */
  --gold-tx:   #6E5622;

  --ink:   #16201A;
  --ink-2: #48524B;
  --ink-3: #626B64;
  --line:  #E3E0D6;
  --line-2:#C9CFC6;
  --paper: #FAF9F5;
  --paper-2: #F2F0E8;

  --ff-jp:    "Zen Kaku Gothic New", "Yu Gothic Medium", "YuGothic", "Hiragino Sans",
              "Hiragino Kaku Gothic ProN", "Meiryo", system-ui, sans-serif;
  --ff-en:    "Roboto Condensed", "Arial Narrow", "Helvetica Neue", Arial, sans-serif;

  --w: 1200px;
  --gut: clamp(20px, 5vw, 72px);
  --hh: 84px;
  --radius: clamp(24px, 3.2vw, 48px);

  --e-out:  cubic-bezier(.16, 1, .3, 1);
  --e-io:   cubic-bezier(.76, 0, .24, 1);
  --e-soft: cubic-bezier(.25, .46, .45, .94);

  --i-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 10'%3E%3Cpath d='M0 5h14.5M10 .8 14.5 5 10 9.2' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E");
  --i-ext:   url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12'%3E%3Cpath d='M1.5 10.5 10.5 1.5M3.5 1.5h7v7' fill='none' stroke='black' stroke-width='1.4'/%3E%3C/svg%3E");
}
@media (max-width: 900px) { :root { --hh: 68px; } }

/* --------------------------------------------------------------- 02 リセット */
*, *::before, *::after { box-sizing: border-box; }
html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
  scroll-padding-top: calc(var(--hh) + 16px);
}
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0;
  font-family: var(--ff-jp);
  font-size: 15.5px;
  line-height: 2;
  letter-spacing: .05em;
  color: var(--ink);
  background: #fff;
  font-feature-settings: "palt" 1;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
  overflow-x: clip;
}
body.is-locked { overflow: hidden; }
img, video, svg { display: block; max-width: 100%; height: auto; }
figure, p, h1, h2, h3, dl, dd { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
h1, h2, h3 { font-weight: 700; }
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(--matcha); outline-offset: 3px; border-radius: 4px; }
::selection { background: var(--g700); color: #fff; }

.t-vh {
  position: absolute !important;
  width: 1px; height: 1px; overflow: hidden;
  clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap;
}
.t-skip {
  position: fixed; left: 12px; top: -80px; z-index: 100;
  padding: 10px 18px; border-radius: 8px;
  background: var(--g900); color: #fff; font-size: 14px;
}
.t-skip:focus { top: 12px; }

/* ------------------------------------------------------------- 03 共通部品 */
.t-wrap { width: min(100% - var(--gut) * 2, var(--w)); margin-inline: auto; }

/* 見出し ─ 英字ラベル＋和文 */
.t-head__en {
  display: flex; align-items: center; gap: .9em;
  font-family: var(--ff-en); font-weight: 700;
  font-size: 13px; line-height: 1; letter-spacing: .22em; text-transform: uppercase;
  color: var(--g600);
}
.t-head__en::before {
  content: ""; flex: none;
  width: 7px; height: 7px; border-radius: 50%; background: currentColor;
}
.t-head__en--light, .t-head--light .t-head__en { color: var(--matcha-lt); }
.t-head__ja {
  margin-top: 24px;
  font-size: clamp(27px, 3.5vw, 50px);
  line-height: 1.5; letter-spacing: .06em;
}
.t-head--light .t-head__ja { color: #fff; }

.t-text { font-size: clamp(14.5px, 1.1vw, 16px); line-height: 2.1; color: var(--ink-2); }
.t-text + .t-text { margin-top: 1.2em; }
.t-note { margin-top: 16px; font-size: 12px; line-height: 1.8; letter-spacing: .02em; color: var(--ink-3); }

/* 円形の矢印リンク */
.t-links { display: flex; flex-wrap: wrap; gap: 16px 40px; margin-top: 40px; }
.t-arrow {
  display: inline-flex; align-items: center; gap: 18px;
  font-weight: 700; font-size: 15px; line-height: 1.5; letter-spacing: .08em;
  color: var(--ink);
}
.t-arrow__c {
  position: relative; flex: none;
  width: 54px; height: 54px; border-radius: 50%;
  border: 1px solid var(--line-2);
  overflow: hidden;
  transition: background .45s var(--e-out), border-color .45s var(--e-out), color .45s var(--e-out);
}
.t-arrow__c::before, .t-arrow__c::after {
  content: ""; position: absolute; inset: 0; margin: auto;
  width: 15px; height: 10px; background: currentColor;
  -webkit-mask: var(--i-arrow) center / contain no-repeat;
          mask: var(--i-arrow) center / contain no-repeat;
  transition: transform .55s var(--e-out);
}
.t-arrow__c::after { transform: translateX(-300%); }
.t-arrow--ext .t-arrow__c::before, .t-arrow--ext .t-arrow__c::after {
  width: 11px; height: 11px;
  -webkit-mask-image: var(--i-ext); mask-image: var(--i-ext);
}
.t-arrow--ext .t-arrow__c::after { transform: translate(-300%, 300%); }
.t-arrow:hover .t-arrow__c { background: var(--g700); border-color: var(--g700); color: #fff; }
.t-arrow:hover .t-arrow__c::before { transform: translateX(300%); }
.t-arrow--ext:hover .t-arrow__c::before { transform: translate(300%, -300%); }
.t-arrow:hover .t-arrow__c::after { transform: none; }
.t-arrow--light { color: #fff; }
.t-arrow--light .t-arrow__c { border-color: rgba(255,255,255,.5); }
.t-arrow--light:hover .t-arrow__c { background: #fff; border-color: #fff; color: var(--g900); }

/* 外部リンクの小アイコン */
.t-ext {
  display: inline-block; width: 10px; height: 10px; background: currentColor;
  -webkit-mask: var(--i-ext) center / contain no-repeat;
          mask: var(--i-ext) center / contain no-repeat;
}

/* 丸型ボタン */
.t-pill {
  display: inline-flex; align-items: center; gap: 10px;
  height: 52px; padding: 0 28px; border-radius: 999px;
  font-weight: 700; font-size: 14px; letter-spacing: .08em;
  transition: background .3s, color .3s, border-color .3s;
}
.t-pill--light { background: #fff; color: var(--g900); }
.t-pill--light:hover { background: var(--matcha-lt); }
.t-pill--line { border: 1px solid rgba(255,255,255,.5); color: #fff; }
.t-pill--line:hover { background: #fff; color: var(--g900); }

/* ------------------------------------------------------------- 04 ヘッダー */
.t-header {
  position: fixed; inset: 0 0 auto; z-index: 50;
  display: flex; align-items: center;
  height: var(--hh);
  padding: 0 clamp(16px, 2.6vw, 40px);
  color: #fff;
  transition: background .5s, color .5s, box-shadow .5s, transform .6s var(--e-out);
}
.t-header.is-solid {
  background: rgba(255,255,255,.86);
  -webkit-backdrop-filter: blur(16px) saturate(1.4);
          backdrop-filter: blur(16px) saturate(1.4);
  color: var(--ink);
  box-shadow: 0 1px 0 rgba(13,35,24,.07);
}
.t-header.is-hidden { transform: translateY(-100%); }

.t-logo { position: relative; display: block; width: clamp(118px, 10.5vw, 150px); flex: none; }
.t-logo img { width: 100%; transition: opacity .4s; }
.t-logo__dark { position: absolute; inset: 0; opacity: 0; }
.is-solid .t-logo__dark { opacity: 1; }
.is-solid .t-logo__white { opacity: 0; }

.t-gnav { margin-left: auto; }
.t-gnav__list { display: flex; align-items: center; gap: clamp(22px, 2.6vw, 44px); }
.t-gnav__item { position: relative; }
.t-gnav__link {
  position: relative;
  display: flex; flex-direction: column; align-items: center; gap: 7px;
  padding: 12px 0; line-height: 1;
}
.t-gnav__en {
  font-family: var(--ff-en); font-weight: 700;
  font-size: 14px; letter-spacing: .12em; text-transform: uppercase;
}
.t-gnav__ja { font-size: 10px; font-weight: 500; letter-spacing: .14em; opacity: .85; }
.t-gnav__link::after {
  content: ""; position: absolute; left: 0; right: 0; bottom: 2px;
  height: 1px; background: currentColor;
  transform: scaleX(0); transform-origin: right;
  transition: transform .5s var(--e-out);
}
.t-gnav__link:hover::after, .is-open > .t-gnav__link::after {
  transform: scaleX(1); transform-origin: left;
}

/* ドロップダウン（吹き出し） */
.t-drop {
  position: absolute; top: calc(100% + 16px); left: 50%;
  width: min(580px, 80vw);
  padding: 26px 28px 22px;
  background: #fff; color: var(--ink);
  border-radius: 20px;
  box-shadow: 0 30px 60px -24px rgba(13,35,24,.35), 0 0 0 1px rgba(13,35,24,.05);
  opacity: 0; visibility: hidden;
  transform: translate(-50%, 12px);
  transition: opacity .35s var(--e-out), transform .5s var(--e-out), visibility 0s .35s;
}
.t-drop::before { content: ""; position: absolute; left: 0; right: 0; top: -18px; height: 18px; }
.is-open > .t-drop {
  opacity: 1; visibility: visible; transform: translate(-50%, 0);
  transition-delay: 0s;
}
.t-drop__head {
  display: flex; align-items: baseline; gap: 14px;
  padding: 0 8px 16px; border-bottom: 1px solid var(--line);
  font-weight: 700; font-size: 14px; line-height: 1.4;
}
.t-drop__en {
  font-family: var(--ff-en); font-weight: 300;
  font-size: 28px; letter-spacing: .02em; text-transform: uppercase; color: var(--g700);
}
.t-drop__list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 6px; margin-top: 12px; }
.t-drop__list a {
  position: relative; display: block;
  padding: 14px 12px 16px; border-radius: 12px;
  font-weight: 700; font-size: 14.5px; line-height: 1.5;
  transition: background .3s;
}
.t-drop__list a:hover { background: var(--paper-2); }
.t-drop__list small {
  display: block; margin-top: 6px;
  font-weight: 400; font-size: 11.5px; line-height: 1.7; letter-spacing: .02em; color: var(--ink-3);
}

.t-shopbtn {
  display: inline-flex; align-items: center; gap: 10px; flex: none;
  height: 44px; padding: 0 20px; margin-left: clamp(22px, 2.6vw, 44px);
  border: 1px solid rgba(255,255,255,.6); border-radius: 999px;
  font-family: var(--ff-en); font-weight: 700; font-size: 13px; letter-spacing: .12em; text-transform: uppercase;
  transition: background .3s, color .3s, border-color .3s;
}
.t-shopbtn:hover { background: #fff; border-color: #fff; color: var(--g900); }
.is-solid .t-shopbtn { border-color: var(--g700); color: var(--g700); }
.is-solid .t-shopbtn:hover { background: var(--g700); color: #fff; }

.t-menubtn, .t-menu__close {
  display: grid; place-items: center; flex: none;
  width: 48px; height: 48px; border-radius: 50%;
  transition: transform .45s var(--e-out), background .3s;
}
.t-menubtn { margin-left: 12px; background: var(--g700); color: #fff; }
.t-menubtn:hover { transform: scale(1.08); background: var(--g600); }
.t-lines { position: relative; display: block; width: 18px; height: 8px; }
.t-lines i {
  position: absolute; left: 0; width: 100%; height: 1.5px; background: currentColor;
  transition: transform .45s var(--e-out);
}
.t-lines i:first-child { top: 0; }
.t-lines i:last-child { bottom: 0; }
.t-menubtn:hover .t-lines i:last-child { transform: scaleX(.55); transform-origin: left; }
.t-lines.is-x i { top: 50%; bottom: auto; }
.t-lines.is-x i:first-child { transform: translateY(-50%) rotate(45deg); }
.t-lines.is-x i:last-child  { transform: translateY(-50%) rotate(-45deg); }

@media (max-width: 1100px) {
  .t-gnav { display: none; }
  .t-shopbtn { margin-left: auto; }
}
@media (max-width: 600px) {
  .t-shopbtn { display: none; }
  .t-menubtn { margin-left: auto; }
}

/* ------------------------------------------------------------- 05 メニュー */
.t-menu { position: fixed; inset: 0; z-index: 80; visibility: hidden; transition: visibility 0s .9s; }
.t-menu.is-open { visibility: visible; transition-delay: 0s; }
.t-menu__veil {
  position: absolute; inset: 0; background: rgba(8,20,13,.55);
  opacity: 0; transition: opacity .6s;
}
.t-menu.is-open .t-menu__veil { opacity: 1; }
.t-menu__panel {
  position: absolute; top: 0; right: 0; bottom: 0;
  display: flex; flex-direction: column;
  width: min(100%, 1080px);
  padding: 0 var(--gut) 40px;
  overflow-y: auto; overscroll-behavior: contain;
  background: var(--g900); color: #fff;
  clip-path: inset(0 0 0 100%);
  transition: clip-path .9s var(--e-io);
}
.t-menu.is-open .t-menu__panel { clip-path: inset(0); }
.t-menu__top { display: flex; align-items: center; justify-content: space-between; flex: none; height: var(--hh); }
.t-menu__logo { width: clamp(118px, 10.5vw, 150px); }
.t-menu__close { background: #fff; color: var(--g900); }
.t-menu__close:hover { transform: rotate(90deg); }
.t-menu__nav {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px clamp(24px, 4vw, 56px);
  margin-top: clamp(32px, 8vh, 96px);
}
.t-menu__en {
  font-family: var(--ff-en); font-weight: 300;
  font-size: clamp(34px, 4vw, 56px); line-height: 1; letter-spacing: .01em; text-transform: uppercase;
  color: var(--matcha-lt);
}
.t-menu__col ul { margin-top: 24px; border-top: 1px solid rgba(255,255,255,.18); }
.t-menu__col li { border-bottom: 1px solid rgba(255,255,255,.18); }
.t-menu__col a {
  display: flex; align-items: center; justify-content: space-between; gap: 12px;
  padding: 18px 0;
  font-weight: 700; font-size: clamp(15px, 1.35vw, 18px); line-height: 1.5;
}
.t-menu__col a::after {
  content: ""; flex: none; width: 14px; height: 9px; background: currentColor;
  -webkit-mask: var(--i-arrow) center / contain no-repeat;
          mask: var(--i-arrow) center / contain no-repeat;
  transition: transform .45s var(--e-out);
}
.t-menu__col a:hover { color: var(--matcha-lt); }
.t-menu__col a:hover::after { transform: translateX(6px); }
.t-menu__foot {
  display: flex; flex-wrap: wrap; align-items: center; gap: 14px 16px;
  margin-top: auto; padding-top: 48px;
}
.t-menu__addr { width: 100%; margin-top: 12px; font-size: 12.5px; color: rgba(255,255,255,.65); }
.fx .t-menu__col, .fx .t-menu__foot {
  opacity: 0; transform: translate3d(0, 28px, 0);
  transition: opacity .5s, transform .8s var(--e-out);
}
.fx .t-menu.is-open .t-menu__col, .fx .t-menu.is-open .t-menu__foot {
  opacity: 1; transform: none;
  transition-delay: calc(.35s + var(--i, 0) * .08s);
}
@media (max-width: 767px) {
  .t-menu__nav { grid-template-columns: 1fr; }
}

/* ------------------------------------------------------ 06 ファーストビュー */
.t-fv {
  position: relative;
  height: 100vh; height: 100svh;
  background: var(--g900); color: #fff;
}
.fx .t-fv { height: 320vh; height: 320svh; }
.t-fv__sticky {
  position: sticky; top: 0;
  height: 100vh; height: 100svh;
  overflow: hidden;
}

/* 右：空撮映像（スクロールで全面へ広がる） */
.t-fv__b {
  position: absolute; inset: 0;
  clip-path: inset(0 0 0 calc(50% - 50% * var(--p, 0)));
}
.t-fv__b-in { position: absolute; inset: 0; transform: scale(calc(1.14 - .14 * var(--p, 0))); }
.t-fv__b img, .t-fv__b video {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
}
.t-fv__b video { opacity: 0; transition: opacity 1.2s; }
.t-fv.is-video .t-fv__b video { opacity: 1; }

/* 左：写真スライド（スクロールで左へ抜ける） */
.t-fv__a {
  position: absolute; top: 0; bottom: 0; left: 0; right: 50%;
  overflow: hidden;
  transform: translate3d(calc(-100% * var(--p, 0)), 0, 0);
}
.t-fv__slide { position: absolute; inset: 0; opacity: 0; transition: opacity 1.4s var(--e-soft); }
.t-fv__slide.is-active { opacity: 1; z-index: 1; }
.t-fv__slide img {
  width: 100%; height: 100%; object-fit: cover;
  transform: scale(1.1); transition: transform 7s linear;
}
.t-fv__slide.is-active img { transform: scale(1); }

.t-fv__shade {
  position: absolute; inset: 0; z-index: 2; pointer-events: none;
  background:
    linear-gradient(180deg, rgba(8,20,13,.42) 0%, rgba(8,20,13,0) 26%),
    linear-gradient(90deg, rgba(8,20,13,.5) 0%, rgba(8,20,13,.12) 70%);
}
.t-fv__shade--a {
  background:
    linear-gradient(180deg, rgba(8,20,13,.4) 0%, rgba(8,20,13,0) 26%, rgba(8,20,13,0) 66%, rgba(8,20,13,.55) 100%);
}

/* コピー */
.t-fv__copy {
  position: absolute; z-index: 5; left: 50%; top: 50%;
  padding: 0 var(--gut) 0 clamp(28px, 4.6vw, 84px);
  transform: translate3d(calc(-50vw * var(--p, 0)), -50%, 0);
}
.t-fv__ln { display: block; overflow: hidden; padding-bottom: .1em; }
.t-fv__ln > span { display: block; }
.t-fv__title {
  font-size: clamp(36px, 5.2vw, 88px);
  line-height: 1.42; letter-spacing: .06em;
  text-shadow: 0 2px 30px rgba(8,20,13,.25);
}
.t-fv__lead {
  margin-top: clamp(20px, 2.6vw, 36px);
  font-size: clamp(14px, 1.15vw, 17px); font-weight: 500; line-height: 2; letter-spacing: .12em;
  text-shadow: 0 1px 16px rgba(8,20,13,.35);
}

/* 下部の情報・操作 */
.t-fv__meta {
  position: absolute; z-index: 5; left: var(--gut); bottom: clamp(24px, 4.4vh, 44px);
  display: flex; align-items: center; gap: 14px;
  font-weight: 500; font-size: 12.5px; line-height: 1; letter-spacing: .16em;
}
.t-fv__meta i { width: 40px; height: 1px; background: currentColor; opacity: .7; }
.t-fv__ctrl {
  position: absolute; z-index: 6; right: var(--gut); bottom: clamp(18px, 4vh, 36px);
  display: flex; align-items: center; gap: 16px;
  font-family: var(--ff-en); font-size: 12px; letter-spacing: .14em;
}
.t-fv__count b { font-weight: 700; }
.t-fv__timer { position: relative; width: 72px; height: 1px; background: rgba(255,255,255,.35); overflow: hidden; }
.t-fv__timer i { position: absolute; inset: 0; background: #fff; transform: scaleX(0); transform-origin: left; }
.t-fv__timer.is-run i { animation: t-timer 5s linear forwards; }
@keyframes t-timer { to { transform: scaleX(1); } }
.t-fv__pause {
  display: grid; place-items: center;
  width: 42px; height: 42px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.55);
  transition: background .3s;
}
.t-fv__pause:hover { background: rgba(255,255,255,.15); }
.t-fv__pause-ic { width: 10px; height: 12px; border-left: 3px solid #fff; border-right: 3px solid #fff; }
.t-fv.is-paused .t-fv__pause-ic {
  width: 0; height: 0; margin-left: 3px;
  border-right: 0; border-left: 11px solid #fff;
  border-top: 7px solid transparent; border-bottom: 7px solid transparent;
}
.t-fv__scroll {
  position: absolute; z-index: 5; left: 50%; bottom: 0;
  display: flex; flex-direction: column; align-items: center; gap: 12px;
  transform: translateX(-50%);
  font-family: var(--ff-en); font-size: 11px; line-height: 1; letter-spacing: .3em; text-transform: uppercase;
}
.t-fv__scroll i { position: relative; width: 1px; height: 64px; overflow: hidden; background: rgba(255,255,255,.3); }
.t-fv__scroll i::after {
  content: ""; position: absolute; inset: 0; background: #fff;
  animation: t-drip 2.4s var(--e-io) infinite;
}
@keyframes t-drip { 0% { transform: translateY(-100%); } 60%, 100% { transform: translateY(100%); } }
.fx .t-fv__meta, .fx .t-fv__ctrl, .fx .t-fv__scroll { opacity: calc(1 - var(--p, 0) * 5); }
.t-fv.is-moved .t-fv__ctrl { visibility: hidden; }

/* 読み込み時の登場 */
.fx .t-fv__ln > span { transform: translate3d(0, 108%, 0); transition: transform 1.4s var(--e-out); transition-delay: calc(.35s + var(--d, 0) * .09s); }
.fx .t-fv.is-in .t-fv__ln > span { transform: none; }
.fx .t-fv__a { clip-path: inset(100% 0 0 0); transition: clip-path 1.5s var(--e-io) .1s; }
.fx .t-fv.is-in .t-fv__a { clip-path: inset(0); }
.fx .t-fv__b-in > * { opacity: 0; transition: opacity 1.6s ease .2s; }
.fx .t-fv.is-in .t-fv__b-in > img { opacity: 1; }
.fx .t-fv.is-in.is-video .t-fv__b-in > video { opacity: 1; }

@media (max-width: 767px) {
  .t-fv__a { right: 0; bottom: 50%; transform: translate3d(0, calc(-100% * var(--p, 0)), 0); }
  .t-fv__b { clip-path: inset(calc(50% - 50% * var(--p, 0)) 0 0 0); }
  .t-fv__copy {
    left: 0; top: auto; bottom: clamp(56px, 11svh, 110px);
    padding: 0 var(--gut);
    transform: translate3d(0, calc(-22svh * var(--p, 0)), 0);
  }
  .t-fv__meta { bottom: auto; top: calc(50% - 34px); font-size: 10.5px; gap: 10px; }
  .t-fv__meta i { width: 22px; }
  .t-fv__ctrl { bottom: auto; top: calc(50% - 50px); gap: 12px; }
  .t-fv__timer { display: none; }
  .t-fv__scroll { display: none; }
}

/* ------------------------------------------------------- 07 私たちについて */
.t-intro {
  position: relative; z-index: 3;
  padding: clamp(96px, 11vw, 180px) 0 clamp(88px, 10vw, 150px);
  background: #fff;
}
.fx .t-intro {
  margin-top: -100vh; margin-top: -100svh;
  border-radius: var(--radius) var(--radius) 0 0;
  box-shadow: 0 -40px 80px -40px rgba(0,0,0,.45);
}
.t-intro__grid {
  display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  gap: clamp(40px, 6vw, 120px); align-items: end;
}
.t-facts {
  display: grid; grid-template-columns: repeat(3, 1fr);
  margin-top: clamp(80px, 9vw, 140px);
  border-top: 1px solid var(--line);
}
.t-fact { padding: 28px 24px 30px 0; border-bottom: 1px solid var(--line); }
.t-fact:not(:nth-child(3n+1)) { padding-left: clamp(20px, 3vw, 44px); border-left: 1px solid var(--line); }
.t-fact dt { font-size: 13px; font-weight: 700; letter-spacing: .12em; color: var(--ink-2); }
.t-fact dd {
  margin-top: 14px;
  font-family: var(--ff-en); font-weight: 300;
  font-size: clamp(46px, 5.6vw, 86px); line-height: 1; letter-spacing: -.01em;
  color: var(--g800);
  font-variant-numeric: tabular-nums;
}
.t-fact small { margin-left: .3em; font-family: var(--ff-jp); font-size: 15px; font-weight: 700; letter-spacing: .06em; }

@media (max-width: 900px) {
  .t-intro__grid { grid-template-columns: 1fr; }
}
@media (max-width: 767px) {
  .t-facts { grid-template-columns: repeat(2, 1fr); }
  .t-fact:not(:nth-child(3n+1)) { padding-left: 0; border-left: 0; }
  .t-fact:nth-child(2n) { padding-left: 18px; border-left: 1px solid var(--line); }
  .t-fact dd { font-size: clamp(36px, 11vw, 50px); }
}

/* ------------------------------------------------------------------ 08 商品 */
.t-tea { padding: clamp(40px, 5vw, 80px) 0 clamp(110px, 12vw, 190px); overflow: hidden; }
.t-tea__grid {
  display: grid; grid-template-columns: minmax(0, 1.12fr) minmax(0, .88fr);
  gap: clamp(40px, 6vw, 110px); align-items: center;
}
.t-tea__kv { display: grid; grid-template-columns: repeat(3, 1fr); gap: clamp(12px, 1.6vw, 26px); align-items: start; }
.t-tea__item { display: block; }
.t-tea__item:nth-child(1) { margin-top: 14%; }
.t-tea__item:nth-child(3) { margin-top: 28%; }
.t-tea__fig {
  position: relative; aspect-ratio: 3 / 5; overflow: hidden;
  border-radius: 999px 999px 18px 18px;
  background: var(--paper-2);
}
.t-tea__fig img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--e-out); }
.t-tea__item:hover .t-tea__fig img { transform: scale(1.07); }
.t-tea__cap { margin-top: 16px; font-weight: 700; font-size: 14.5px; line-height: 1.5; }
.t-tea__cap span {
  display: block; margin-bottom: 6px;
  font-family: var(--ff-en); font-weight: 700; font-size: 11px; letter-spacing: .22em; text-transform: uppercase;
  color: var(--g600);
}
.fx .t-tea__fig { transform: translate3d(0, calc((var(--p, .5) - .5) * var(--s, 0px)), 0); }
.t-tea__item:nth-child(1) .t-tea__fig { --s: -90px; }
.t-tea__item:nth-child(2) .t-tea__fig { --s: 70px; }
.t-tea__item:nth-child(3) .t-tea__fig { --s: -50px; }

@media (max-width: 900px) {
  .t-tea__grid { grid-template-columns: 1fr; }
  .t-tea__body { order: -1; }
  .t-tea__cap { font-size: 13px; }
}

/* ------------------------------------------------------------------ 09 強み */
.t-strength {
  position: relative; z-index: 2;
  padding: clamp(96px, 11vw, 170px) 0;
  background: var(--paper-2);
  border-radius: var(--radius) var(--radius) 0 0;
}
.t-strength__grid {
  display: grid; grid-template-columns: minmax(0, .82fr) minmax(0, 1.18fr);
  gap: clamp(40px, 7vw, 120px); align-items: start;
}
.t-strength__side { position: sticky; top: calc(var(--hh) + 48px); }
.t-strength__lead { margin-top: 32px; }
.t-str + .t-str { margin-top: clamp(64px, 7vw, 104px); }
.t-str__link { display: block; }
.t-str__fig { aspect-ratio: 16 / 10; overflow: hidden; border-radius: 22px; background: var(--paper); }
.t-str__fig img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.2s var(--e-out); }
.t-str__link:hover .t-str__fig img { transform: scale(1.05); }
.t-str__body { margin-top: 28px; }
.t-str__no {
  display: flex; align-items: baseline; gap: 16px;
  font-family: var(--ff-en); font-weight: 300; font-size: 58px; line-height: 1; color: var(--g700);
}
.t-str__no span { font-weight: 700; font-size: 12px; letter-spacing: .22em; text-transform: uppercase; color: var(--g600); }
.t-str__title { margin-top: 16px; font-size: clamp(20px, 2vw, 27px); line-height: 1.6; letter-spacing: .06em; }
.t-str__text { margin-top: 12px; font-size: 15px; line-height: 2.05; color: var(--ink-2); }
.t-str__more {
  display: inline-flex; align-items: center; gap: 12px; margin-top: 18px;
  font-weight: 700; font-size: 14px; color: var(--g700);
}
.t-str__more::after {
  content: ""; width: 15px; height: 10px; background: currentColor;
  -webkit-mask: var(--i-arrow) center / contain no-repeat;
          mask: var(--i-arrow) center / contain no-repeat;
  transition: transform .45s var(--e-out);
}
.t-str__link:hover .t-str__more::after { transform: translateX(6px); }

@media (max-width: 900px) {
  .t-strength__grid { grid-template-columns: 1fr; }
  .t-strength__side { position: static; }
}

/* ------------------------------------------------------------------ 10 工程 */
.t-process {
  position: relative; z-index: 3;
  margin-top: calc(var(--radius) * -1);
  background: var(--g900); color: #fff;
  border-radius: var(--radius) var(--radius) 0 0;
}
.t-process__sticky { padding: clamp(96px, 10vw, 150px) 0 clamp(80px, 9vw, 130px); }
.t-process__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 28px 40px; }
.t-process__meter {
  display: flex; align-items: center; gap: 14px;
  font-family: var(--ff-en); font-size: 13px; letter-spacing: .12em; color: rgba(255,255,255,.7);
}
.t-process__now { font-weight: 700; color: #fff; }
.t-process__bar { position: relative; width: 160px; height: 1px; background: rgba(255,255,255,.25); }
.t-process__bar i { position: absolute; inset: 0; background: var(--matcha-lt); transform: scaleX(0); transform-origin: left; }
.t-process__viewport {
  margin-top: clamp(44px, 6vh, 72px);
  overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scroll-padding-inline: max(var(--gut), calc((100% - var(--w)) / 2));
  scrollbar-width: none;
}
.t-process__viewport::-webkit-scrollbar { display: none; }
.t-process__track {
  display: flex; gap: clamp(16px, 2vw, 32px);
  width: max-content;
  padding: 0 max(var(--gut), calc((100vw - var(--w)) / 2));
}
.t-step { flex: none; width: clamp(250px, 25vw, 360px); scroll-snap-align: start; }
.t-step__fig { aspect-ratio: 4 / 5; overflow: hidden; border-radius: 22px; background: var(--g800); }
.t-step__fig img { width: 100%; height: 100%; object-fit: cover; }
.t-step__no {
  margin-top: 24px;
  font-family: var(--ff-en); font-weight: 700; font-size: 12px; line-height: 1; letter-spacing: .24em; text-transform: uppercase;
  color: var(--matcha-lt);
}
.t-step__title { margin-top: 12px; font-size: clamp(19px, 1.7vw, 24px); line-height: 1.5; letter-spacing: .08em; }
.t-step__text { margin-top: 10px; font-size: 14px; line-height: 1.95; color: rgba(255,255,255,.78); }
.t-step--end { display: flex; align-items: center; width: auto; padding: 0 clamp(16px, 4vw, 72px); }

/* PC：縦スクロールに合わせて横へ送る（JS が高さと移動量を計算） */
.t-process.is-pinned .t-process__sticky {
  position: sticky; top: 0;
  display: flex; flex-direction: column; justify-content: center;
  height: 100vh; height: 100svh;
  padding: var(--hh) 0 32px;
  overflow: hidden;
}
.t-process.is-pinned .t-process__viewport { overflow: visible; margin-top: clamp(28px, 5vh, 64px); }
.t-process.is-pinned .t-process__track { will-change: transform; }
.t-process.is-pinned .t-head__ja { font-size: clamp(24px, 2.7vw, 42px); }
/* 1画面に収めるため、写真の高さは「画面の高さ − 見出しと文字の分」で決める（1280×720 でも欠けない） */
.t-process.is-pinned .t-step__fig {
  aspect-ratio: auto;
  height: clamp(160px, calc(100vh - 500px), 440px);
  height: clamp(160px, calc(100svh - 500px), 440px);
}

/* -------------------------------------------- 11 茶草場・サステナビリティ */
.t-heritage { position: relative; background: #fff; }
.t-heritage__sticky {
  position: relative;
  display: flex; align-items: center;
  min-height: 100vh; min-height: 100svh;
  padding: clamp(96px, 12vh, 150px) 0;
  overflow: hidden; color: #fff;
}
.t-heritage__media { position: absolute; inset: 0; overflow: hidden; background: var(--g900); }
.t-heritage__media-in { position: absolute; inset: 0; }
.t-heritage__media img, .t-heritage__media video {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover;
}
.t-heritage__media video { opacity: 0; transition: opacity 1s; }
.t-heritage__sticky.is-playing .t-heritage__media video { opacity: 1; }
.t-heritage__shade {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, rgba(8,20,13,.82) 0%, rgba(8,20,13,.45) 62%, rgba(8,20,13,.25) 100%);
}
.t-heritage__content { position: relative; z-index: 2; }
.t-heritage__cols {
  display: grid; grid-template-columns: minmax(0, 1.15fr) minmax(0, .85fr);
  gap: clamp(32px, 5vw, 88px); align-items: end;
  margin-top: 36px;
}
.t-heritage__badge {
  display: inline-block; margin-bottom: 18px;
  padding: 6px 16px; border: 1px solid rgba(169,199,126,.6); border-radius: 999px;
  font-size: 12.5px; font-weight: 700; line-height: 1.6; letter-spacing: .1em; color: var(--matcha-lt);
}
.t-heritage .t-text { color: rgba(255,255,255,.88); }
.t-sdg { display: flex; flex-wrap: wrap; gap: 8px; }
.t-sdg img { width: 52px; height: 52px; border-radius: 4px; }
.t-heritage .t-links { margin-top: 32px; }
.t-vbtn {
  position: absolute; z-index: 3; right: var(--gut); bottom: 28px;
  display: grid; place-items: center;
  width: 42px; height: 42px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.55);
  transition: background .3s;
}
.t-vbtn:hover { background: rgba(255,255,255,.15); }
.t-vbtn__ic { width: 10px; height: 12px; border-left: 3px solid #fff; border-right: 3px solid #fff; }
.t-vbtn.is-paused .t-vbtn__ic {
  width: 0; height: 0; margin-left: 3px;
  border-right: 0; border-left: 11px solid #fff;
  border-top: 7px solid transparent; border-bottom: 7px solid transparent;
}

@media (min-width: 768px) {
  .fx .t-heritage {
    height: 260vh; height: 260svh;
    --e: clamp(0, calc(var(--p, 0) * 2.3), 1);
    --r: clamp(0, calc((var(--p, 0) - .45) * 5), 1);
  }
  .fx .t-heritage__sticky {
    position: sticky; top: 0;
    height: 100vh; height: 100svh; min-height: 0;
    padding: 0;
  }
  .fx .t-heritage__media {
    clip-path: inset(calc((1 - var(--e)) * 16%) calc((1 - var(--e)) * 25%) round calc((1 - var(--e)) * 36px));
  }
  .fx .t-heritage__media-in { transform: scale(calc(1.22 - .22 * var(--e))); }
  .fx .t-heritage__content {
    opacity: var(--r);
    transform: translate3d(0, calc((1 - var(--r)) * 48px), 0);
  }
  .fx .t-heritage__content:focus-within { opacity: 1; transform: none; }
  .fx .t-vbtn { opacity: var(--r); }
}
@media (max-width: 900px) {
  .t-heritage__cols { grid-template-columns: 1fr; }
}

/* ------------------------------------------------------------------ 12 受賞 */
.t-awards {
  position: relative; z-index: 2;
  margin-top: calc(var(--radius) * -1);
  padding: clamp(96px, 10vw, 160px) 0 clamp(96px, 10vw, 150px);
  background: var(--paper-2);
  border-radius: var(--radius) var(--radius) 0 0;
}
.t-awards__head {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto;
  gap: 24px 56px; align-items: end;
}
.t-awards__lead { max-width: 30em; }
.t-awards__nav { display: flex; gap: 10px; }
.t-cbtn {
  position: relative;
  width: 58px; height: 58px; border-radius: 50%;
  border: 1px solid var(--line-2); color: var(--ink);
  transition: background .3s, border-color .3s, color .3s, opacity .3s;
}
.t-cbtn::before {
  content: ""; position: absolute; inset: 0; margin: auto;
  width: 15px; height: 10px; background: currentColor;
  -webkit-mask: var(--i-arrow) center / contain no-repeat;
          mask: var(--i-arrow) center / contain no-repeat;
}
.t-cbtn--prev::before { transform: rotate(180deg); }
.t-cbtn:hover:not(:disabled) { background: var(--g700); border-color: var(--g700); color: #fff; }
.t-cbtn:disabled { opacity: .35; cursor: default; }
.t-awards__track {
  display: grid; grid-auto-flow: column; grid-auto-columns: clamp(258px, 25vw, 340px);
  gap: 20px;
  margin-top: 56px;
  padding: 6px max(var(--gut), calc((100% - var(--w)) / 2)) 14px;
  scroll-padding-inline: max(var(--gut), calc((100% - var(--w)) / 2));
  overflow-x: auto; overscroll-behavior-x: contain;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  cursor: grab;
}
.t-awards__track::-webkit-scrollbar { display: none; }
.t-awards__track.is-drag { cursor: grabbing; scroll-snap-type: none; user-select: none; }
.t-awards__track:focus-visible { outline-offset: -2px; }
.t-award {
  display: flex; flex-direction: column;
  min-height: 310px; padding: 30px 28px 32px;
  background: #fff; border-radius: 22px;
  scroll-snap-align: start;
  transition: transform .5s var(--e-out), box-shadow .5s var(--e-out);
}
.t-award:hover { transform: translateY(-6px); box-shadow: 0 26px 44px -26px rgba(13,35,24,.4); }
.t-award__tag {
  display: inline-block; padding: 4px 14px;
  border: 1px solid rgba(154,123,60,.5); border-radius: 999px;
  font-size: 11.5px; font-weight: 700; line-height: 1.5; letter-spacing: .14em; color: var(--gold-tx);
}
.t-award__year {
  margin-top: 26px;
  font-family: var(--ff-en); font-weight: 300; font-size: 68px; line-height: 1; letter-spacing: -.01em;
  color: var(--g800);
}
.t-award__org { margin-top: auto; padding-top: 28px; font-size: 13px; line-height: 1.8; color: var(--ink-2); }
.t-award__title { margin-top: 6px; font-weight: 700; font-size: 16.5px; line-height: 1.65; }
.t-awards__foot { display: flex; align-items: center; justify-content: space-between; gap: 24px 40px; margin-top: 40px; }
.t-awards__bar { position: relative; flex: 1; max-width: 460px; height: 2px; overflow: hidden; border-radius: 2px; background: rgba(13,35,24,.1); }
.t-awards__bar i { position: absolute; inset: 0; background: var(--g700); transform: scaleX(.12); transform-origin: left; transition: transform .2s; }

@media (max-width: 900px) {
  .t-awards__head { grid-template-columns: minmax(0, 1fr) auto; }
  .t-awards__lead { grid-column: 1 / -1; grid-row: 2; }
  .t-awards__nav { grid-column: 2; grid-row: 1; }
}
@media (max-width: 600px) {
  .t-awards__foot { flex-direction: column; align-items: flex-start; }
  .t-awards__bar { width: 100%; max-width: none; flex: none; }
  .t-cbtn { width: 50px; height: 50px; }
}

/* -------------------------------------------------------------- 13 会社情報 */
.t-corp { position: relative; z-index: 2; padding: clamp(100px, 11vw, 180px) 0; background: #fff; }
.t-corp__row {
  display: grid; grid-template-columns: minmax(0, .9fr) minmax(0, 1.1fr);
  gap: clamp(40px, 7vw, 120px); align-items: center;
}
.t-corp__row + .t-corp__row { margin-top: clamp(80px, 9vw, 150px); }
.t-corp__row--rev .t-corp__kv { order: 2; }
.t-corp__kv { position: relative; width: min(100%, 460px); aspect-ratio: 1; margin-inline: auto; }
.t-corp__img { position: absolute; inset: 10%; overflow: hidden; border-radius: 50%; background: var(--paper-2); }
.t-corp__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--e-out); }
.t-corp__kv:hover .t-corp__img img { transform: scale(1.06); }
.t-ring { position: absolute; inset: 0; width: 100%; height: 100%; color: var(--g700); animation: t-spin 48s linear infinite; }
.t-ring--rev { animation-direction: reverse; }
.t-ring text {
  font-family: var(--ff-en); font-weight: 500; font-size: 10.5px; letter-spacing: .2em;
  fill: currentColor;
}
@keyframes t-spin { to { transform: rotate(360deg); } }

@media (max-width: 900px) {
  .t-corp__row { grid-template-columns: 1fr; }
  .t-corp__row--rev .t-corp__kv { order: 0; }
  .t-corp__kv { width: min(80%, 380px); }
}

/* ------------------------------------------------------------------ 14 採用 */
.t-recruit { position: relative; background: var(--g900); color: #fff; }
.fx .t-recruit { height: 280vh; height: 280svh; }
.t-recruit__sticky {
  position: relative;
  display: flex; align-items: center;
  min-height: 100vh; min-height: 100svh;
  padding: 120px 0;
  overflow: hidden;
}
.fx .t-recruit__sticky { position: sticky; top: 0; height: 100vh; height: 100svh; min-height: 0; padding: 0; }
.t-recruit__bg { position: absolute; inset: 0; }
.t-recruit__bg img { width: 100%; height: 100%; object-fit: cover; }
.t-recruit__bg::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(8,20,13,.62) 0%, rgba(8,20,13,.78) 100%);
}
.fx .t-recruit__bg { transform: scale(calc(1.18 - var(--p, 0) * .18)); }
.t-recruit__inner { position: relative; z-index: 2; }
.t-recruit__words {
  margin-top: 28px;
  font-size: clamp(46px, min(8.4vw, 14vh), 136px); line-height: 1.18; letter-spacing: .04em;
}
.t-recruit__words span { display: block; }
.fx .t-recruit__words span {
  opacity: clamp(.18, calc((var(--p, 0) - .04 - var(--i) * .2) / .18), 1);
}
.t-recruit__foot {
  display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between;
  gap: 28px 48px; margin-top: clamp(32px, 5vh, 56px);
}
.t-recruit__text { max-width: 34em; font-size: 15px; line-height: 2; color: rgba(255,255,255,.86); }
.fx .t-recruit__foot { opacity: clamp(0, calc((var(--p, 0) - .62) * 5), 1); }
.fx .t-recruit__foot:focus-within { opacity: 1; }

/* ------------------------------------------------- 15 ショップ・問い合わせ */
.t-gate { padding: clamp(20px, 3vw, 40px); background: #fff; }
.t-gate__grid { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(14px, 2vw, 24px); }
.t-gate__item {
  position: relative; isolation: isolate;
  display: flex; flex-direction: column; justify-content: flex-end;
  min-height: clamp(300px, 34vw, 480px);
  padding: clamp(28px, 3.4vw, 52px);
  padding-right: calc(clamp(28px, 3.4vw, 52px) + 80px);
  overflow: hidden; border-radius: 26px;
  background: var(--g800); color: #fff;
}
.t-gate__bg { position: absolute; inset: 0; z-index: -1; }
.t-gate__bg img { width: 100%; height: 100%; object-fit: cover; transition: transform 1.4s var(--e-out); }
.t-gate__bg::after {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(200deg, rgba(8,20,13,.2) 0%, rgba(8,20,13,.78) 100%);
  transition: background .6s;
}
.t-gate__item:hover .t-gate__bg img { transform: scale(1.06); }
.t-gate__en {
  font-family: var(--ff-en); font-weight: 300;
  font-size: clamp(44px, 5.4vw, 88px); line-height: 1; letter-spacing: .01em; text-transform: uppercase;
}
.t-gate__ja { margin-top: 18px; font-weight: 700; font-size: 16px; line-height: 1.7; }
.t-gate__ja small { display: block; margin-top: 4px; font-weight: 400; font-size: 13px; opacity: .88; }
.t-gate__arrow {
  position: absolute; right: clamp(24px, 3vw, 44px); bottom: clamp(24px, 3vw, 44px);
  width: 66px; height: 66px; border-radius: 50%;
  border: 1px solid rgba(255,255,255,.6); color: #fff;
  transition: background .45s var(--e-out), color .45s var(--e-out), transform .45s var(--e-out);
}
.t-gate__arrow::before {
  content: ""; position: absolute; inset: 0; margin: auto;
  width: 17px; height: 11px; background: currentColor;
  -webkit-mask: var(--i-arrow) center / contain no-repeat;
          mask: var(--i-arrow) center / contain no-repeat;
}
.t-gate__arrow--ext::before { width: 13px; height: 13px; -webkit-mask-image: var(--i-ext); mask-image: var(--i-ext); }
.t-gate__item:hover .t-gate__arrow { background: #fff; color: var(--g900); transform: scale(1.08); }

@media (max-width: 767px) {
  .t-gate__grid { grid-template-columns: 1fr; }
  .t-gate__arrow { width: 54px; height: 54px; }
}

/* --------------------------------------------------------------- 16 フッター */
.t-footer {
  position: relative; overflow: hidden;
  padding-top: clamp(72px, 8vw, 120px);
  background: var(--g900); color: rgba(255,255,255,.78);
  border-radius: var(--radius) var(--radius) 0 0;
}
.t-footer__top { display: grid; grid-template-columns: minmax(0, .8fr) minmax(0, 1.6fr); gap: 48px; }
.t-footer__logo { width: 170px; }
.t-footer__addr { margin-top: 24px; font-size: 13.5px; line-height: 2; }
.t-footer__addr strong { color: #fff; }
.t-footer__nav { display: grid; grid-template-columns: repeat(3, 1fr); gap: 32px; }
.t-footer__h {
  font-family: var(--ff-en); font-weight: 700; font-size: 13px; line-height: 1; letter-spacing: .22em; text-transform: uppercase;
  color: var(--matcha-lt);
}
.t-footer__nav ul { display: grid; gap: 10px; margin-top: 20px; }
.t-footer__nav a { font-size: 14px; color: rgba(255,255,255,.86); transition: color .3s; }
.t-footer__nav a:hover { color: #fff; text-decoration: underline; text-underline-offset: 4px; }
.t-footer__bottom {
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px 32px;
  margin-top: 72px; padding: 24px 0;
  border-top: 1px solid rgba(255,255,255,.14);
  font-size: 12px; letter-spacing: .06em;
}
.t-footer__bottom a:hover { color: #fff; }
.t-footer__pagetop {
  display: inline-flex; align-items: center; gap: 10px;
  font-family: var(--ff-en); font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: #fff;
}
.t-footer__pagetop i {
  width: 10px; height: 15px; background: currentColor;
  -webkit-mask: var(--i-arrow) center / contain no-repeat;
          mask: var(--i-arrow) center / contain no-repeat;
  transform: rotate(-90deg);
}
.t-footer__mark {
  margin: 0 0 -.1em;
  font-family: var(--ff-en); font-weight: 700;
  font-size: 19.5vw; line-height: .9; letter-spacing: -.015em; text-align: center; white-space: nowrap;
  color: rgba(255,255,255,.06);
  user-select: none;
}

@media (max-width: 900px) {
  .t-footer__top { grid-template-columns: 1fr; }
}
@media (max-width: 600px) {
  .t-footer__nav { grid-template-columns: 1fr 1fr; }
}

/* -------------------------------------------------------------- 17 表示演出 */
.fx [data-reveal] {
  opacity: 0; transform: translate3d(0, 36px, 0);
  transition: opacity 1s var(--e-out), transform 1.2s var(--e-out);
  transition-delay: var(--d, 0s);
}
.fx [data-reveal="mask"] {
  opacity: 1; transform: translate3d(0, 24px, 0);
  clip-path: inset(0 0 100% 0);
  transition: clip-path 1.3s var(--e-out), transform 1.3s var(--e-out);
  transition-delay: var(--d, 0s);
}
.fx [data-reveal].is-in { opacity: 1; transform: none; clip-path: inset(0 0 -20% 0); }

/* ------------------------------------------------------------ 18 動きを減らす */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
    transition-delay: 0s !important;
  }
  .t-fv__slide img { transform: none; }
}

/* 印刷 */
@media print {
  .t-header, .t-menu, .t-fv__ctrl, .t-fv__scroll, .t-vbtn, .t-awards__nav { display: none !important; }
  .t-fv, .t-heritage, .t-recruit { height: auto !important; }
}