@charset "utf-8";
/* =========================================================
   やさいとおさけとやまちゃん / style.css
   構造・レイアウト文法は青柳総本家サイトの設計を踏襲
   ========================================================= */

/* ---------- design tokens ---------- */
:root{
  --c-key:      #b5e06b;   /* ブランドのイエローグリーン */
  --c-key-deep: #8ec13f;
  --c-bg:       #eef3e2;   /* ベース背景（やや黄緑寄りのオフホワイト） */
  --c-bg-2:     #e4ecd2;
  --c-paper:    #f7faf0;
  --c-ink:      #1a1c17;   /* 手描き線の黒 */
  --c-ink-60:   rgba(26,28,23,.62);
  --c-ink-30:   rgba(26,28,23,.28);
  --c-ink-12:   rgba(26,28,23,.12);
  --c-green:    #5a7a3a;   /* 深い緑（英字ラベル等） */
  --c-accent:   #f5a623;   /* CTA用オレンジ */
  --c-accent-d: #dd8f10;
  --c-illust-bg:#d2e85a;   /* イラストの地色の平均。個別値は各imgの --bg で上書きする */

  --f-jp: "Zen Maru Gothic","Hiragino Maru Gothic ProN","ヒラギノ丸ゴ ProN W4",-apple-system,sans-serif;
  --f-jp-t: "Zen Kaku Gothic New","Hiragino Sans","ヒラギノ角ゴシック",-apple-system,sans-serif;
  --f-en: "Cormorant Garamond","Times New Roman",serif;

  --ease: cubic-bezier(.22,.61,.36,1);
  --header-h: 84px;
  --pad-x: clamp(20px, 5vw, 90px);
}

/* ---------- reset ---------- */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%; scroll-behavior:smooth}
body{
  margin:0; background:var(--c-bg); color:var(--c-ink);
  font-family:var(--f-jp-t); font-size:15px; line-height:2;
  letter-spacing:.06em; font-feature-settings:"palt";
  overflow-x:hidden;
}
body.is-locked{overflow:hidden}
h1,h2,h3,p,dl,dd,figure{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
a{color:inherit;text-decoration:none}
img,svg{display:block;max-width:100%}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
::selection{background:var(--c-key);color:var(--c-ink)}

.pc{display:block}
.sp{display:none}
@media (max-width:767px){ .pc{display:none} .sp{display:block} }

/* =========================================================
   LOADING
   ========================================================= */
#l-load{
  position:fixed; inset:0; z-index:9999; background:var(--c-key);
  display:grid; place-items:center;
  transition:opacity .8s var(--ease), visibility .8s;
}
body.is-loaded #l-load{opacity:0;visibility:hidden}
#l-load__inner{text-align:center;color:var(--c-ink)}
.l-load__mark{width:52px;height:52px;margin:0 auto 18px;color:var(--c-ink);animation:loadSway 2.4s ease-in-out infinite}
@keyframes loadSway{0%,100%{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}
.l-load__text{font-family:var(--f-jp);font-size:14px;letter-spacing:.2em}
.l-load__bar{width:140px;height:1px;margin:20px auto 0;background:rgba(26,28,23,.2);overflow:hidden}
.l-load__bar span{display:block;width:100%;height:100%;background:var(--c-ink);transform:scaleX(0);transform-origin:left;animation:loadBar 1.4s var(--ease) forwards}
@keyframes loadBar{to{transform:scaleX(1)}}

/* =========================================================
   HEADER
   ========================================================= */
#l-header{position:fixed;inset:0 0 auto 0;z-index:900;pointer-events:none}
#l-header__inner{position:relative;pointer-events:none}

#l-header-title{position:absolute;top:26px;left:var(--pad-x);z-index:940;pointer-events:auto}
#l-header-title a{display:block;transition:opacity .3s}
#l-header-title .jp{
  display:block;font-family:var(--f-jp);font-weight:700;font-size:16px;
  line-height:1.45;letter-spacing:.08em;
}
#l-header-title .en{
  display:block;margin-top:5px;font-family:var(--f-en);font-size:9px;
  letter-spacing:.28em;color:var(--c-ink-60);
}
body.is-navi-open #l-header-title .jp,
body.is-navi-open #l-header-title .en{color:var(--c-ink)}

/* hamburger */
#l-header-btn{
  position:absolute;top:22px;right:var(--pad-x);z-index:940;
  display:flex;align-items:center;gap:12px;pointer-events:auto;
  padding:10px 0;
}
#l-header-btn__line{position:relative;width:30px;height:14px}
#l-header-btn__line span{
  position:absolute;left:0;width:100%;height:1.5px;background:var(--c-ink);border-radius:2px;
  transition:transform .45s var(--ease),opacity .3s;
}
#l-header-btn__line span:nth-child(1){top:0}
#l-header-btn__line span:nth-child(2){top:6px}
#l-header-btn__line span:nth-child(3){top:12px}
body.is-navi-open #l-header-btn__line span:nth-child(1){transform:translateY(6px) rotate(45deg)}
body.is-navi-open #l-header-btn__line span:nth-child(2){opacity:0}
body.is-navi-open #l-header-btn__line span:nth-child(3){transform:translateY(-6px) rotate(-45deg)}
#l-header-btn-text{position:relative;width:52px;height:14px;font-family:var(--f-en);font-size:11px;letter-spacing:.22em}
#l-header-btn-text span{position:absolute;left:0;top:0;transition:opacity .3s}
#l-header-btn-text .close{opacity:0}
body.is-navi-open #l-header-btn-text .open{opacity:0}
body.is-navi-open #l-header-btn-text .close{opacity:1}

/* header bg (scrolled) */
#l-header-bg{position:absolute;inset:0 0 auto 0;height:var(--header-h);overflow:hidden}
#l-header-bg__inner{
  width:100%;height:100%;background:var(--c-bg);
  box-shadow:0 1px 0 var(--c-ink-12);
  transform:translateY(-100%);transition:transform .5s var(--ease);
}
body.is-scrolled #l-header-bg__inner{transform:translateY(0)}
body.is-navi-open #l-header-bg__inner{transform:translateY(-100%)}

/* 落款（縦組みの店名） */
#l-header-rakkan{
  position:fixed;top:50%;left:calc(var(--pad-x) - 6px);transform:translateY(-50%);
  z-index:880;
  font-family:var(--f-jp);font-size:11px;letter-spacing:.42em;color:var(--c-ink-60);
  writing-mode:vertical-rl;text-orientation:upright;pointer-events:none;
  opacity:0;transition:opacity .6s var(--ease);
}
body.is-loaded #l-header-rakkan{opacity:1}
body.is-scrolled #l-header-rakkan,
body.is-navi-open #l-header-rakkan,
body.is-kv-detail #l-header-rakkan{opacity:0}

#l-header-copy{
  position:fixed;bottom:38px;left:var(--pad-x);z-index:880;
  font-family:var(--f-en);font-size:10px;letter-spacing:.34em;color:var(--c-ink-60);
  writing-mode:vertical-rl;pointer-events:none;
  opacity:0;transition:opacity .6s var(--ease) .2s;
}
body.is-loaded #l-header-copy{opacity:1}
body.is-scrolled #l-header-copy{opacity:0}

#l-header__scroll{
  position:fixed;bottom:0;right:var(--pad-x);z-index:880;
  display:flex;flex-direction:column;align-items:center;gap:12px;
  font-family:var(--f-en);font-size:10px;letter-spacing:.3em;color:var(--c-ink-60);
  pointer-events:none;opacity:0;transition:opacity .6s var(--ease) .3s;
}
body.is-loaded #l-header__scroll{opacity:1}
body.is-scrolled #l-header__scroll{opacity:0}
#l-header__scroll span{writing-mode:vertical-rl;letter-spacing:.3em}
#l-header__scroll__inner{width:1px;height:70px;background:var(--c-ink-30);overflow:hidden;position:relative}
#l-header__scroll__inner::after{
  content:"";position:absolute;inset:0;background:var(--c-ink);
  animation:scrollLine 2.2s var(--ease) infinite;
}
@keyframes scrollLine{0%{transform:translateY(-100%)}60%,100%{transform:translateY(100%)}}

/* ---------- global nav ---------- */
#l-header__navi{
  position:fixed;inset:0;z-index:930;background:var(--c-key);
  display:flex;align-items:center;
  clip-path:inset(0 0 100% 0);
  transition:clip-path .8s var(--ease);
  pointer-events:none;overflow-y:auto;
}
body.is-navi-open #l-header__navi{clip-path:inset(0 0 0 0);pointer-events:auto}
#l-header__navi__inner{
  width:100%;padding:120px var(--pad-x) 80px;
  display:grid;grid-template-columns:1fr 300px;gap:60px;align-items:start;
}
#l-header__navi__parent{max-width:640px}
.l-header__navi__item{border-top:1px solid rgba(26,28,23,.18)}
.l-header__navi__item:last-child{border-bottom:1px solid rgba(26,28,23,.18)}
.l-header__navi__item>a{
  display:flex;align-items:baseline;gap:20px;padding:22px 4px;
  opacity:0;transform:translateY(14px);
  transition:opacity .6s var(--ease),transform .6s var(--ease),padding-left .35s var(--ease);
}
body.is-navi-open .l-header__navi__item>a{opacity:1;transform:none}
body.is-navi-open .l-header__navi__item:nth-child(1)>a{transition-delay:.22s}
body.is-navi-open .l-header__navi__item:nth-child(2)>a{transition-delay:.30s}
body.is-navi-open .l-header__navi__item:nth-child(3)>a{transition-delay:.38s}
body.is-navi-open .l-header__navi__item:nth-child(4)>a{transition-delay:.46s}
.l-header__navi__item>a:hover{padding-left:16px}
.l-header__navi__item .num{font-family:var(--f-en);font-size:12px;letter-spacing:.2em;color:rgba(26,28,23,.5)}
.l-header__navi__item .jp{font-family:var(--f-jp);font-weight:700;font-size:clamp(24px,3.4vw,38px);line-height:1.2;letter-spacing:.06em}
.l-header__navi__item .en{margin-left:auto;font-family:var(--f-en);font-size:12px;letter-spacing:.24em;color:rgba(26,28,23,.55)}
.l-header__navi__children{display:flex;flex-wrap:wrap;gap:8px 26px;padding:0 4px 22px 54px}
.l-header__navi__children .text{position:relative;font-size:13px;color:rgba(26,28,23,.72);padding-left:14px;transition:color .3s}
.l-header__navi__children .text::before{content:"";position:absolute;left:0;top:.95em;width:7px;height:1px;background:currentColor}
.l-header__navi__children a:hover .text{color:var(--c-ink)}

#l-header__navi__side{
  opacity:0;transform:translateY(14px);
  transition:opacity .6s var(--ease) .5s,transform .6s var(--ease) .5s;
}
body.is-navi-open #l-header__navi__side{opacity:1;transform:none}
#l-header__navi__reserve .note{margin-top:14px;font-size:12px;line-height:1.9;color:rgba(26,28,23,.7)}
#l-header__navi__reserve .note span{font-size:10px;color:rgba(26,28,23,.5)}
#l-header__navi__sns{margin-top:40px}
#l-header__navi__sns-title,#l-footer__sns-title{font-family:var(--f-en);font-size:10px;letter-spacing:.3em;color:rgba(26,28,23,.6);margin-bottom:12px}
#l-header__navi__sns-list,#l-footer__sns-list{display:flex;gap:20px}
#l-header__navi__sns-list a,#l-footer__sns-list a{font-family:var(--f-en);font-size:13px;letter-spacing:.14em;border-bottom:1px solid var(--c-ink-30);padding-bottom:3px;transition:border-color .3s}
#l-header__navi__sns-list a:hover,#l-footer__sns-list a:hover{border-color:var(--c-ink)}
#l-header__navi__copy{margin-top:40px;font-family:var(--f-jp);font-size:13px;letter-spacing:.14em;color:rgba(26,28,23,.7)}

#l-header__navi__deco{position:absolute;inset:0;pointer-events:none;opacity:0;transition:opacity 1s var(--ease) .4s}
body.is-navi-open #l-header__navi__deco{opacity:.22}
#l-header__navi__deco svg{position:absolute;width:88px;height:88px;color:var(--c-ink)}
#l-header__navi__deco svg:nth-child(1){top:12%;right:8%;transform:rotate(-14deg)}
#l-header__navi__deco svg:nth-child(2){bottom:16%;right:24%;transform:rotate(10deg)}
#l-header__navi__deco svg:nth-child(3){bottom:8%;left:6%;transform:rotate(-8deg)}
#l-header__navi__deco svg:nth-child(4){top:8%;left:44%;transform:rotate(6deg)}
#l-header__navi__deco svg:nth-child(5){bottom:34%;right:4%;transform:rotate(18deg)}

/* =========================================================
   BUTTONS
   ========================================================= */
.c-btn{display:inline-flex;align-items:center;gap:12px;cursor:pointer}
.c-btn svg{width:18px;height:18px;flex:none;transition:transform .4s var(--ease)}
.c-btn:hover svg{transform:translateX(5px)}

.c-btn.type-line{
  margin-top:34px;font-family:var(--f-jp);font-weight:500;font-size:14px;letter-spacing:.1em;
  padding-bottom:9px;border-bottom:1px solid var(--c-ink-30);transition:border-color .35s;
}
.c-btn.type-line:hover{border-color:var(--c-ink)}

.c-btn.type-box{
  justify-content:space-between;width:100%;padding:16px 20px;
  border:1px solid var(--c-ink);border-radius:999px;
  font-family:var(--f-jp);font-weight:500;font-size:14px;letter-spacing:.1em;
  transition:background .35s,color .35s;
}
.c-btn.type-box:hover{background:var(--c-ink);color:var(--c-key)}

.c-btn.type-fill{
  margin-top:26px;padding:18px 44px;border-radius:999px;
  background:var(--c-accent);color:#fff;
  font-family:var(--f-en);font-size:22px;letter-spacing:.1em;
  box-shadow:0 8px 20px rgba(245,166,35,.28);
  transition:background .35s,transform .35s var(--ease),box-shadow .35s;
}
.c-btn.type-fill:hover{background:var(--c-accent-d);transform:translateY(-2px);box-shadow:0 12px 26px rgba(245,166,35,.34)}

.js__hover-opacity{transition:opacity .3s}
.js__hover-opacity:hover{opacity:.55}

/* =========================================================
   KEY VISUAL
   ========================================================= */
#p-kv{position:relative;height:100svh;min-height:600px;background:var(--c-key);overflow:hidden}
#p-kv__inner{position:relative;width:100%;height:100%}

/* 水面レイヤー（WebGL）。テクスチャは2Dキャンバスで生成している。 */
#p-kv-bg{position:absolute;inset:0;overflow:hidden}
#p-kv-canvas{
  display:block;width:100%;height:100%;
  opacity:0;transition:opacity 1.2s var(--ease) .2s;
}
body.is-loaded #p-kv-canvas{opacity:1}
/* WebGL非対応時も2Dの絵は成立するので、そのまま見せる */
#p-kv-canvas.is-fallback{opacity:1}

#p-kv-copy{
  position:absolute;top:46%;left:50%;transform:translate(-50%,-50%);
  text-align:center;font-family:var(--f-jp);font-weight:700;
  font-size:clamp(30px,6.2vw,74px);line-height:1.42;letter-spacing:.1em;white-space:nowrap;
}
#p-kv-copy .line{display:block}
#p-kv-copy .ch{display:inline-block;opacity:0;transform:translateY(24px) rotate(4deg)}
body.is-loaded #p-kv-copy .ch{animation:chIn .9s var(--ease) forwards}
@keyframes chIn{to{opacity:1;transform:none}}

#p-kv-lead{
  position:absolute;top:calc(46% + clamp(80px,11vw,132px));left:50%;transform:translateX(-50%);
  text-align:center;font-family:var(--f-jp);font-size:clamp(12px,1.5vw,15px);
  line-height:2.1;letter-spacing:.14em;color:rgba(26,28,23,.78);white-space:nowrap;
  opacity:0;transition:opacity .9s var(--ease) 1.3s;
}
body.is-loaded #p-kv-lead{opacity:1}

/* triggers */
#p-kv-trigger{position:absolute;inset:0}
.p-kv-trigger{
  position:absolute;left:var(--x,50%);top:var(--y,50%);transform:translate(-50%,-50%);
  width:46px;height:46px;border-radius:50%;
  display:grid;place-items:center;
  border:1px solid rgba(26,28,23,.42);background:rgba(255,255,255,.42);
  backdrop-filter:blur(2px);
  font-family:var(--f-en);font-size:13px;letter-spacing:.08em;
  opacity:0;transition:opacity .7s var(--ease),background .35s,border-color .35s,transform .45s var(--ease);
}
body.is-loaded .p-kv-trigger{opacity:1}
.p-kv-trigger::after{
  content:"";position:absolute;inset:-6px;border-radius:50%;
  border:1px solid rgba(26,28,23,.28);opacity:0;transform:scale(.85);
  transition:opacity .45s,transform .45s var(--ease);
}
.p-kv-trigger:hover,.p-kv-trigger.is-current{background:var(--c-ink);color:var(--c-key);border-color:var(--c-ink);transform:translate(-50%,-50%) scale(1.08)}
.p-kv-trigger:hover::after,.p-kv-trigger.is-current::after{opacity:1;transform:scale(1)}
body.is-kv-detail .p-kv-trigger:not(.is-current){opacity:0;pointer-events:none}

/* detail panel */
#p-kv__detail{position:absolute;inset:0;pointer-events:none}
.p-kv-detail__list{
  position:absolute;inset:0;display:grid;place-items:center;
  opacity:0;visibility:hidden;transition:opacity .55s var(--ease),visibility .55s;
}
.p-kv-detail__list.is-current{opacity:1;visibility:visible}
.p-kv-detail__list__inner{
  width:min(560px,86vw);padding:clamp(30px,4vw,52px);
  background:var(--c-paper);border-radius:26px;text-align:center;
  box-shadow:0 22px 60px rgba(26,28,23,.14);
  transform:translateY(20px);transition:transform .6s var(--ease);
}
.p-kv-detail__list.is-current .p-kv-detail__list__inner{transform:none}
.p-kv-detail__list-num{font-family:var(--f-en);font-size:13px;letter-spacing:.3em;color:var(--c-green)}
.p-kv-detail__list-icon{width:56px;height:56px;margin:14px auto 10px;color:var(--c-ink)}
.p-kv-detail__list-title{font-family:var(--f-jp);font-weight:700;font-size:clamp(22px,3vw,30px);letter-spacing:.16em;margin-bottom:14px}
.p-kv-detail__list-content{font-size:14px;line-height:2.2;letter-spacing:.08em;color:var(--c-ink-60);text-align:left}

#p-kv-pager,#p-kv-button,#p-kv-close{opacity:0;visibility:hidden;transition:opacity .5s var(--ease),visibility .5s}
body.is-kv-detail #p-kv-pager,
body.is-kv-detail #p-kv-button,
body.is-kv-detail #p-kv-close{opacity:1;visibility:visible}
#p-kv-pager{
  position:absolute;left:50%;bottom:56px;transform:translateX(-50%);
  display:flex;align-items:center;gap:14px;font-family:var(--f-en);font-size:13px;letter-spacing:.16em;
}
#p-kv-pager .line{width:52px;height:1px;background:var(--c-ink-30)}
#p-kv-pager .total{color:var(--c-ink-60)}
#p-kv-button{position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);display:flex;justify-content:space-between;padding:0 clamp(14px,4vw,56px);pointer-events:none}
#p-kv-button button{pointer-events:auto;width:52px;height:52px;border-radius:50%;border:1px solid var(--c-ink-30);display:grid;place-items:center;background:rgba(255,255,255,.5);transition:background .35s,color .35s,border-color .35s}
#p-kv-button button:hover{background:var(--c-ink);color:var(--c-key);border-color:var(--c-ink)}
#p-kv-button svg{width:20px;height:20px}
#p-kv-button .prev svg{transform:rotate(180deg)}
#p-kv-close{position:absolute;top:96px;right:var(--pad-x);width:44px;height:44px;border-radius:50%;border:1px solid var(--c-ink-30);display:grid;place-items:center;background:rgba(255,255,255,.5);transition:background .35s,border-color .35s}
#p-kv-close span{position:absolute;width:16px;height:1.4px;background:var(--c-ink);transition:background .35s}
#p-kv-close span:nth-child(1){transform:rotate(45deg)}
#p-kv-close span:nth-child(2){transform:rotate(-45deg)}
#p-kv-close:hover{background:var(--c-ink);border-color:var(--c-ink)}
#p-kv-close:hover span{background:var(--c-key)}

#p-kv-guide{
  position:absolute;left:50%;bottom:56px;transform:translateX(-50%);
  font-size:11px;letter-spacing:.16em;color:rgba(26,28,23,.5);white-space:nowrap;
  text-align:center;opacity:0;transition:opacity .8s var(--ease) 1.8s;
}
#p-kv-guide .sub{display:block;margin-top:3px;font-size:10px;color:rgba(26,28,23,.38)}
body.is-loaded #p-kv-guide{opacity:1}
body.is-kv-detail #p-kv-guide{opacity:0;transition-delay:0s}

/* custom pointer */
#p-kv-pointer{position:fixed;top:0;left:0;z-index:950;pointer-events:none;opacity:0;transition:opacity .3s}
body.is-pointer-active #p-kv-pointer{opacity:1}
#p-kv-pointer-circle{position:absolute;width:44px;height:44px;margin:-22px 0 0 -22px;border:1px solid var(--c-ink);border-radius:50%;transition:transform .3s var(--ease)}
#p-kv-pointer-dot{position:absolute;width:5px;height:5px;margin:-2.5px 0 0 -2.5px;background:var(--c-ink);border-radius:50%}
body.is-pointer-hover #p-kv-pointer-circle{transform:scale(1.5)}
@media (hover:none){#p-kv-pointer{display:none}}

/* =========================================================
   SECTION COMMON
   ========================================================= */
.l-section{position:relative;padding:clamp(90px,12vw,170px) 0}
.l-section__inner{width:min(1180px,calc(100% - var(--pad-x)*2));margin-inline:auto}

.c-section-title{position:relative;margin-bottom:clamp(38px,5vw,64px)}
.c-section-title .en{
  display:block;font-family:var(--f-en);font-weight:400;
  font-size:clamp(44px,7vw,92px);line-height:1;letter-spacing:.06em;color:var(--c-green);
}
.c-section-title .jp{
  display:block;margin-top:12px;padding-left:4px;
  font-family:var(--f-jp);font-weight:700;font-size:clamp(15px,1.8vw,18px);letter-spacing:.24em;
}
.c-section-title::after{
  content:"";display:block;width:56px;height:1px;margin-top:22px;background:var(--c-ink-30);
  transform:scaleX(0);transform-origin:left;transition:transform .9s var(--ease) .25s;
}
.js__tsc.is-visible .c-section-title::after{transform:scaleX(1)}
.c-section-title.position-right{text-align:right}
.c-section-title.position-right::after{margin-left:auto;transform-origin:right}

.c-section-sub-title{display:flex;align-items:baseline;gap:14px;margin-bottom:26px}
.c-section-sub-title .en{font-family:var(--f-en);font-size:15px;letter-spacing:.24em;color:var(--c-green)}
.c-section-sub-title .jp{font-family:var(--f-jp);font-weight:700;font-size:13px;letter-spacing:.2em}

.l-section .text{max-width:34em;font-size:14px;line-height:2.3;letter-spacing:.09em;color:var(--c-ink-60)}
.c-note{margin-top:20px;font-size:11px;line-height:1.9;color:rgba(26,28,23,.45)}

/* scroll trigger */
.js__tsc-title,.js__tsc-y,.js__tsc-opacity{opacity:0;transition:opacity .9s var(--ease),transform .9s var(--ease)}
.js__tsc-title,.js__tsc-y{transform:translateY(34px)}
.js__tsc.is-visible .js__tsc-title{opacity:1;transform:none}
.js__tsc.is-visible .js__tsc-y{opacity:1;transform:none;transition-delay:.14s}
.js__tsc.is-visible .js__tsc-opacity{opacity:1;transition-delay:.2s}

/* photo placeholder */
.c-photo{
  position:relative;display:grid;place-items:center;
  aspect-ratio:4/3;border-radius:18px;overflow:hidden;
  background:linear-gradient(150deg,var(--c-bg-2) 0%,var(--c-paper) 100%);
  border:1px solid var(--c-ink-12);
}
.c-photo svg{width:34%;height:34%;color:var(--c-ink-30)}
.c-photo img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:var(--bg,var(--c-illust-bg));z-index:2}
.c-photo.has-img::after{content:none}
.c-photo.has-img svg{display:none}
.c-photo::after{
  content:attr(data-label);position:absolute;bottom:12px;left:0;right:0;text-align:center;
  font-size:10px;letter-spacing:.18em;color:rgba(26,28,23,.35);
}
.c-photo.small{aspect-ratio:1;border-radius:14px}
.c-photo.tall{aspect-ratio:3/4}
.c-photo.portrait{aspect-ratio:1015/1000;border-radius:22px}

/* 実写（店内・商品など）は背景色がまちまちなので、
   イラストの余白埋め方式ではなく枠いっぱいにトリミング表示する。 */
.c-photo.is-photo img{object-fit:cover;background:none}
.c-photo.is-photo{background:var(--c-bg-2)}

/* =========================================================
   BAND (full-bleed)
   ========================================================= */
.c-band{position:relative;overflow:hidden;background:var(--c-key);padding:clamp(70px,9vw,120px) var(--pad-x)}
.c-band.alt{background:var(--c-ink)}
.c-band.alt .c-band__text{color:var(--c-key)}
.c-band.alt .c-band__veg svg{color:var(--c-key);opacity:.16}
.c-band__inner{position:relative;max-width:1180px;margin-inline:auto;text-align:center}
.c-band__text{
  position:relative;z-index:2;font-family:var(--f-jp);font-weight:700;
  font-size:clamp(20px,3.6vw,42px);line-height:1.75;letter-spacing:.12em;
}
.c-band__veg{position:absolute;inset:-40px 0;display:flex;justify-content:space-between;align-items:center;pointer-events:none}
.c-band__veg svg{width:clamp(40px,6vw,86px);height:auto;aspect-ratio:1;color:var(--c-ink);opacity:.18}
.c-band__veg svg:nth-child(odd){transform:translateY(-22px) rotate(-10deg)}
.c-band__veg svg:nth-child(even){transform:translateY(24px) rotate(12deg)}

/* =========================================================
   MENU
   ========================================================= */
#p-top-menu__seasonal{margin-top:clamp(60px,8vw,110px)}
#p-top-menu__seasonal ul{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.6vw,34px)}
#p-top-menu__seasonal .caption{margin-top:14px;font-family:var(--f-jp);font-size:13px;letter-spacing:.1em}
#p-top-menu__seasonal li{opacity:0;transform:translateY(26px);transition:opacity .8s var(--ease),transform .8s var(--ease)}
#p-top-menu__seasonal.is-visible li{opacity:1;transform:none}
#p-top-menu__seasonal.is-visible li:nth-child(2){transition-delay:.12s}
#p-top-menu__seasonal.is-visible li:nth-child(3){transition-delay:.24s}

#p-top-menu__recommend{margin-top:clamp(60px,8vw,110px)}

/* 写真もアイコンも使わず、品書きらしいタイポグラフィだけで見せるリスト。
   品名と価格をドットのリーダー罫で結ぶ、洋食メニューの組み方を踏襲。 */
.c-standard-list{
  margin-top:4px;
  display:grid;grid-template-columns:1fr;column-gap:clamp(30px,4.5vw,64px);
}
.c-standard-list li{
  display:flex;align-items:flex-end;gap:14px;
  padding:clamp(18px,2.4vw,25px) 2px;
  border-bottom:1px solid var(--c-ink-12);
  transition:padding-left .4s var(--ease);
}
.c-standard-list li:hover{padding-left:10px}
.c-standard-list .nm{
  flex:none;font-family:var(--f-jp);font-weight:500;
  font-size:clamp(15px,1.7vw,19px);letter-spacing:.1em;line-height:1.5;
  transition:color .35s var(--ease);
}
.c-standard-list li:hover .nm{color:var(--c-green)}
.c-standard-list .leader{
  flex:1;min-width:24px;margin-bottom:.4em;
  border-bottom:1px dotted var(--c-ink-30);
  transition:border-color .35s var(--ease);
}
.c-standard-list li:hover .leader{border-color:var(--c-green)}
.c-standard-list .pr{
  flex:none;font-family:var(--f-en);font-size:clamp(16px,1.8vw,20px);
  letter-spacing:.05em;color:var(--c-green);
}
.c-standard-list .pr::before{content:"￥";font-size:.72em;margin-right:2px;opacity:.7}

@media (min-width:768px){
  .c-standard-list{grid-template-columns:1fr 1fr}
}

/* =========================================================
   お品書き＝ノート本（menu.html）
   PC：見開き＋3Dページめくり／SP：1ページずつ横スワイプ
   ========================================================= */
#l-body.is-book{padding:clamp(120px,15vw,180px) var(--pad-x) clamp(60px,8vw,100px)}

.p-book-head{max-width:1180px;margin:0 auto clamp(34px,5vw,56px);text-align:center}
.p-book-head .en{font-family:var(--f-en);font-size:clamp(38px,6vw,74px);line-height:1;letter-spacing:.06em;color:var(--c-green)}
.p-book-head .jp{margin-top:12px;font-family:var(--f-jp);font-weight:700;font-size:clamp(15px,1.8vw,18px);letter-spacing:.26em}
.p-book-head .lead{margin-top:20px;font-size:13px;line-height:2.1;letter-spacing:.09em;color:var(--c-ink-60)}

/* ---------- ステージ ---------- */
.p-book-stage{
  perspective:2600px;perspective-origin:50% 46%;
  display:flex;justify-content:center;
  padding:10px 0 24px;
}
.p-book{
  position:relative;
  width:min(1020px, 94vw);
  aspect-ratio:1.44/1;
  transform-style:preserve-3d;
  transition:transform .9s var(--ease);
}
/* 閉じているあいだ、表紙（右半分）が中央に来るよう左へ寄せる */
.p-book.is-closed{transform:translateX(-25%)}

.p-book__base{position:absolute;top:0;width:50%;height:100%;transition:opacity .5s var(--ease)}
.p-book__base--left{left:0}
.p-book__base--right{left:50%}
/* 閉じているときは中身側を見せない */
.p-book.is-closed .p-book__base{opacity:0}

/* ---------- 綴じ ---------- */
.p-book::after{
  content:"";position:absolute;left:50%;top:0;width:26px;height:100%;
  transform:translateX(-50%);pointer-events:none;z-index:60;
  background:linear-gradient(90deg,
    rgba(26,28,23,0) 0%, rgba(26,28,23,.10) 38%,
    rgba(26,28,23,.16) 50%, rgba(26,28,23,.10) 62%, rgba(26,28,23,0) 100%);
  opacity:0;transition:opacity .6s var(--ease) .4s;
}
.p-book:not(.is-closed)::after{opacity:1}

/* ---------- 葉（1枚＝表裏2ページ） ---------- */
.p-book__leaf{
  position:absolute;top:0;left:50%;width:50%;height:100%;
  transform-origin:left center;transform-style:preserve-3d;
  transition:transform 1.05s cubic-bezier(.5,.02,.28,1);
}
.p-book__leaf.is-flipped{transform:rotateY(-180deg)}

.p-book__face{
  position:absolute;inset:0;backface-visibility:hidden;overflow:hidden;
  border-radius:2px 8px 8px 2px;
}
.p-book__face.is-back{transform:rotateY(180deg);border-radius:8px 2px 2px 8px}

/* ---------- 紙 ---------- */
.p-page{
  position:relative;width:100%;height:100%;
  background:
    linear-gradient(90deg, rgba(26,28,23,.07) 0%, rgba(26,28,23,0) 7%),
    var(--c-paper);
  box-shadow:0 10px 30px rgba(26,28,23,.10);
  overflow:hidden;
}
.p-book__face.is-back .p-page{
  background:
    linear-gradient(270deg, rgba(26,28,23,.07) 0%, rgba(26,28,23,0) 7%),
    var(--c-paper);
}
.p-page::before{
  /* 紙の質感 */
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.5;
  background-image:
    radial-gradient(circle at 18% 24%, rgba(26,28,23,.05) 0 1px, transparent 1px),
    radial-gradient(circle at 62% 71%, rgba(26,28,23,.05) 0 1px, transparent 1px),
    radial-gradient(circle at 84% 36%, rgba(26,28,23,.04) 0 1px, transparent 1px),
    radial-gradient(circle at 37% 88%, rgba(26,28,23,.04) 0 1px, transparent 1px);
  background-size:130px 130px, 170px 170px, 210px 210px, 90px 90px;
}
.p-page__inner{
  position:relative;z-index:2;height:100%;
  padding:clamp(26px,3.6vw,52px) clamp(24px,3.4vw,50px);
  display:flex;flex-direction:column;
}

/* ---------- 表紙 ----------
   和書の装丁に寄せる：布張りの地／内側に二重罫の題簽（だいせん）／
   縦組みの書名／左下に店名／右下に落款。 */
.p-page.type-cover{
  background:
    /* 布目 */
    repeating-linear-gradient(90deg, rgba(255,255,255,.055) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(0deg,  rgba(26,28,23,.045) 0 1px, transparent 1px 3px),
    linear-gradient(150deg, #c3e77c 0%, var(--c-key) 46%, #a6d259 100%);
  box-shadow:0 18px 46px rgba(26,28,23,.24);
}
.p-page.type-cover::before{opacity:.28}
/* 背に近い側の陰り */
.p-page.type-cover::after{
  content:"";position:absolute;inset:0;pointer-events:none;
  background:linear-gradient(90deg, rgba(26,28,23,.14) 0%, rgba(26,28,23,0) 12%);
}
.p-page.type-cover .p-page__inner{padding:clamp(18px,2.2vw,30px)}

.cover-frame{
  position:relative;flex:1;min-height:0;display:flex;flex-direction:column;
  padding:clamp(16px,2vw,26px) clamp(16px,2vw,26px) clamp(34px,4vw,48px);
  border:1px solid rgba(26,28,23,.5);
  box-shadow:inset 0 0 0 1px rgba(247,250,240,.5), inset 0 0 0 5px rgba(26,28,23,.14);
}

/* 表紙のイラスト */
.cover-art{
  position:relative;width:100%;aspect-ratio:3/2;min-height:0;overflow:hidden;
  border:1px solid rgba(26,28,23,.28);
  background:rgba(247,250,240,.5);
}
.cover-art img{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;background:var(--bg,var(--c-illust-bg));z-index:2}
.cover-art__fallback{
  position:absolute;inset:0;display:grid;
  grid-template-columns:repeat(3,1fr);place-items:center;gap:4px;padding:10%;
}
.cover-art__fallback svg{width:64%;height:auto;aspect-ratio:1;color:var(--c-ink);opacity:.42}
.cover-art.has-img .cover-art__fallback{display:none}

/* 書名（縦組み） */
.cover-title{
  display:flex;align-items:flex-start;justify-content:flex-end;gap:clamp(8px,1.1vw,14px);
  margin-top:clamp(14px,1.8vw,22px);flex:1;min-height:0;
}
.cover-title__jp{
  writing-mode:vertical-rl;
  font-family:var(--f-jp);font-weight:700;
  font-size:clamp(19px,2.6vw,32px);letter-spacing:.2em;
}
.cover-title__jp span{
  display:inline-block;padding:clamp(11px,1.4vw,17px) clamp(7px,.9vw,11px);
  background:rgba(247,250,240,.94);
  box-shadow:0 1px 0 rgba(26,28,23,.5), inset 0 0 0 1px rgba(26,28,23,.28);
}
.cover-title__en{
  writing-mode:vertical-rl;margin-top:6px;
  font-family:var(--f-en);font-size:clamp(10px,1.05vw,13px);letter-spacing:.44em;
  color:rgba(26,28,23,.62);
}

.cover-foot{margin-top:auto}
.cover-shop{font-family:var(--f-jp);font-weight:700;font-size:clamp(12px,1.35vw,16px);line-height:1.7;letter-spacing:.12em}
.cover-copy{margin-top:7px;font-size:clamp(10px,1.05vw,12px);letter-spacing:.16em;color:rgba(26,28,23,.66)}

/* 落款 */
.cover-seal{
  position:absolute;right:clamp(16px,2vw,26px);bottom:clamp(34px,4vw,48px);
  width:clamp(30px,3.2vw,40px);height:clamp(30px,3.2vw,40px);
  display:grid;place-items:center;border-radius:3px;
  background:#c0392b;color:#fff;
  font-family:var(--f-jp);font-weight:700;font-size:clamp(9px,1vw,12px);
  line-height:1.1;letter-spacing:.04em;writing-mode:vertical-rl;
  box-shadow:0 1px 3px rgba(26,28,23,.28);opacity:.92;
}

/* めくれることを示す小さなヒント（枠の下、中央） */
.cover-note{
  position:absolute;left:50%;bottom:clamp(11px,1.3vw,16px);transform:translateX(-50%);
  /* .cover-frame の下部余白（padding-bottom）の中に置く */
  font-family:var(--f-jp);font-size:10.5px;letter-spacing:.24em;color:rgba(26,28,23,.52);
  white-space:nowrap;
}
.cover-note::after{content:"›";margin-left:7px;font-size:13px}

/* ---------- 本文 ---------- */
.p-page__label{
  font-family:var(--f-jp);font-weight:700;font-size:clamp(12px,1.35vw,15px);
  letter-spacing:.24em;padding-bottom:14px;border-bottom:1px solid var(--c-ink-12);
}
.p-page__lead{margin-top:24px;font-family:var(--f-jp);font-weight:700;font-size:clamp(15px,1.9vw,22px);line-height:1.8;letter-spacing:.1em}
.p-page__lead2{margin-top:18px;font-size:12px;letter-spacing:.12em;color:var(--c-ink-60)}
.p-page__text{margin-top:16px;font-size:clamp(11.5px,1.05vw,13px);line-height:2.15;letter-spacing:.06em;color:var(--c-ink-60)}
.p-page__sign{margin-top:auto;padding-top:18px;font-family:var(--f-jp);font-size:12px;letter-spacing:.2em;text-align:right}
.p-page__note{margin-top:auto;padding-top:18px;font-size:10.5px;line-height:1.9;color:rgba(26,28,23,.45)}

/* もくじ */
.p-index{margin-top:24px;counter-reset:idx}
.p-index li{
  display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;gap:14px;
  padding:15px 2px;border-bottom:1px dotted var(--c-ink-30);cursor:pointer;
  transition:padding-left .3s var(--ease),color .3s;
}
.p-index li:hover{padding-left:8px;color:var(--c-green)}
.p-index .no{font-family:var(--f-jp);font-size:11px;letter-spacing:.1em;color:var(--c-green)}
.p-index .nm{font-family:var(--f-jp);font-weight:500;font-size:clamp(13px,1.4vw,16px);letter-spacing:.14em}
.p-index .pg{font-family:var(--f-en);font-size:13px;color:var(--c-ink-60)}

/* 品書き */
.p-dish{margin-top:20px;flex:1}
.p-dish li{
  display:grid;grid-template-columns:1fr auto;gap:2px 16px;align-items:baseline;
  padding:13px 0;border-bottom:1px dotted var(--c-ink-30);
}
.p-dish .nm{font-family:var(--f-jp);font-weight:500;font-size:clamp(12.5px,1.25vw,15px);letter-spacing:.08em}
.p-dish .pr{
  font-family:var(--f-en);font-size:clamp(13px,1.3vw,16px);letter-spacing:.06em;color:var(--c-green);
}
.p-dish .pr::before{content:"￥";font-size:.78em;margin-right:2px;opacity:.75}
/* 価格未定（要確認）の行は ￥ を出さない */
.p-dish .pr.is-tbd{color:var(--c-ink-30)}
.p-dish .pr.is-tbd::before{content:none}
.p-dish .ds{grid-column:1/-1;font-size:10.5px;line-height:1.8;color:rgba(26,28,23,.5)}
.p-dish .ds .todo{margin-left:8px;font-size:9.5px;padding:1px 7px}

/* 品書き内の小見出し（やき野菜／そのほか など） */
.p-dish li.p-dish__sub{
  display:block;border-bottom:0;padding:16px 0 4px;
}
.p-dish li.p-dish__sub:first-child{padding-top:4px}
.p-dish li.p-dish__sub .nm{
  display:inline-block;font-family:var(--f-jp);font-weight:700;
  font-size:clamp(10.5px,1.05vw,12px);letter-spacing:.2em;color:var(--c-green);
}
.p-dish li.p-dish__sub .nm::after{
  content:"";display:block;width:100%;height:1px;margin-top:5px;background:var(--c-green);opacity:.32;
}

/* 品書きページに添える小さめの2枚組 */
.p-photos{
  display:grid;grid-template-columns:1fr 1fr;gap:clamp(10px,1.2vw,16px);
  margin-top:auto;padding-top:clamp(16px,2vw,26px);
}
.p-photos__item{
  position:relative;aspect-ratio:4/3;overflow:hidden;border-radius:8px;
  display:grid;place-items:center;
  background:linear-gradient(150deg,var(--c-bg-2) 0%,var(--c-paper) 100%);
  border:1px solid var(--c-ink-12);
}
.p-photos__item img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:contain;background:var(--bg,var(--c-illust-bg));z-index:2;
}
.p-photos__item svg{width:26%;height:26%;color:var(--c-ink-30)}
.p-photos__item::after{
  content:attr(data-label);position:absolute;bottom:8px;left:0;right:0;text-align:center;
  font-size:9.5px;letter-spacing:.16em;color:rgba(26,28,23,.32);
}
.p-photos__item.has-img::after{content:none}
.p-photos__item.has-img svg{display:none}

/* 扉ページ（写真） */
.p-page.type-plate .p-page__inner{padding:0;justify-content:flex-end}
.p-plate{
  position:absolute;inset:0;display:grid;place-items:center;
  background:linear-gradient(150deg,var(--c-bg-2) 0%,var(--c-paper) 100%);
}
.p-plate svg{width:26%;height:26%;color:var(--c-ink-30)}
/* イラストは縦横比がまちまちなので切り抜かず全体を出し、
   余白はイラスト自身の背景と同じ緑で埋める（継ぎ目が出ない）。 */
.p-plate img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:contain;background:var(--bg,var(--c-illust-bg));z-index:2;
}
.p-plate::after{
  content:attr(data-label);position:absolute;bottom:14px;left:0;right:0;text-align:center;
  font-size:10px;letter-spacing:.18em;color:rgba(26,28,23,.32);
}
.p-plate.has-img::after{content:none}
.p-plate.has-img svg{display:none}
.p-plate__vt{
  position:absolute;top:clamp(22px,3vw,40px);right:clamp(22px,3vw,40px);z-index:3;
  writing-mode:vertical-rl;
  font-family:var(--f-jp);font-weight:700;font-size:clamp(17px,2.1vw,26px);letter-spacing:.28em;
}
.p-plate__vt span{
  display:inline-block;padding:14px 10px;
  background:rgba(247,250,240,.86);border-radius:4px;
}
.p-plate__cap{
  position:relative;z-index:3;margin:0 clamp(20px,2.6vw,34px) clamp(20px,2.6vw,34px);
  padding:10px 14px;background:rgba(247,250,240,.9);border-radius:4px;
  font-family:var(--f-jp);font-size:11.5px;letter-spacing:.1em;
}

/* 最終ページ */
.p-page.type-end .p-page__inner{align-items:flex-start}
.p-end__catch{margin-top:26px;font-family:var(--f-jp);font-weight:700;font-size:clamp(17px,2.1vw,26px);line-height:1.7;letter-spacing:.1em}
.p-end__btns{display:flex;flex-wrap:wrap;align-items:center;gap:10px 20px;margin-top:22px}
.p-end__tel{
  display:inline-block;padding:13px 30px;border-radius:999px;
  background:var(--c-accent);color:#fff;font-family:var(--f-en);font-size:clamp(15px,1.6vw,19px);letter-spacing:.08em;
  transition:background .3s;
}
.p-end__tel:hover{background:var(--c-accent-d)}
.p-end__ig{
  display:inline-block;padding:12px 24px;border-radius:999px;
  border:1px solid var(--c-ink-30);color:var(--c-ink);
  font-family:var(--f-jp);font-weight:500;font-size:12.5px;letter-spacing:.06em;
  transition:border-color .3s,background .3s;
}
.p-end__ig:hover{border-color:var(--c-ink);background:rgba(26,28,23,.04)}
.p-end__back{
  margin-top:auto;padding-bottom:2px;border-bottom:1px solid var(--c-ink-30);
  font-family:var(--f-jp);font-size:12px;letter-spacing:.1em;align-self:flex-start;
}

/* 奥付・白紙 */
.p-page.type-colophon .p-page__inner{align-items:center;justify-content:center;text-align:center}
.colophon-mark{width:44px;height:44px;color:var(--c-ink);opacity:.4}
.colophon-shop{margin-top:18px;font-family:var(--f-jp);font-weight:700;font-size:14px;letter-spacing:.14em}
.colophon-copy{margin-top:8px;font-size:11px;letter-spacing:.14em;color:var(--c-ink-60)}
.p-page.type-blank{background:var(--c-bg-2)}

/* ページ番号 */
.p-book__face[data-pageno]::after{
  content:attr(data-pageno);position:absolute;bottom:14px;z-index:4;
  font-family:var(--f-en);font-size:11px;letter-spacing:.1em;color:rgba(26,28,23,.4);
}
.p-book__face:not(.is-back)[data-pageno]::after{right:clamp(20px,2.4vw,34px)}
.p-book__face.is-back[data-pageno]::after{left:clamp(20px,2.4vw,34px)}
.p-page.type-cover ~ *::after,
.p-book__face.is-cover::after{content:none}

/* めくり用の当たり判定 */
.p-book__hit{position:absolute;top:0;width:14%;height:100%;z-index:70;cursor:pointer;border:0;background:none}
.p-book__hit--next{right:0}
.p-book__hit--prev{left:0}
.p-book__hit:disabled{cursor:default}

/* ---------- 操作UI ---------- */
.p-book-ctrl{display:flex;align-items:center;justify-content:center;gap:22px;margin-top:26px}
.p-book-ctrl__btn{
  width:50px;height:50px;border-radius:50%;border:1px solid var(--c-ink-30);
  display:grid;place-items:center;transition:background .3s,color .3s,border-color .3s,opacity .3s;
}
.p-book-ctrl__btn svg{width:19px;height:19px}
.p-book-ctrl__btn:hover:not(:disabled){background:var(--c-ink);color:var(--c-key);border-color:var(--c-ink)}
.p-book-ctrl__btn:disabled{opacity:.28}
.js__book-prev svg{transform:rotate(180deg)}
.p-book-ctrl__pager{display:flex;align-items:center;gap:12px;font-family:var(--f-en);font-size:13px;letter-spacing:.14em}
.p-book-ctrl__pager .line{width:44px;height:1px;background:var(--c-ink-30)}
.p-book-ctrl__pager .tot{color:var(--c-ink-60)}
.p-book-hint{margin-top:14px;text-align:center;font-size:11px;letter-spacing:.12em;color:rgba(26,28,23,.42)}
.p-book-hint .pc,.p-book-hint .sp{display:inline}
@media (max-width:767px){.p-book-hint .pc{display:none}}
@media (min-width:768px){.p-book-hint .sp{display:none}}

/* ---------- SP：1ページずつの横送り ---------- */
@media (max-width:767px){
  #l-body.is-book{padding-top:104px}
  .p-book-stage{perspective:none;padding:0;overflow:hidden;margin-inline:calc(var(--pad-x) * -1);padding-inline:var(--pad-x)}
  .p-book{
    width:100%;aspect-ratio:.62/1;transform:none !important;
    transform-style:flat;
  }
  .p-book::after{display:none}
  .p-book__base{display:none}
  #p-book-leaves{position:absolute;inset:0}
  .p-book__leaf{
    position:absolute;inset:0;width:100%;
    transform-origin:center;transform-style:flat;
    transition:transform .55s var(--ease),opacity .45s var(--ease);
  }
  .p-book__face{border-radius:8px}
  .p-book__face.is-back{transform:none;border-radius:8px}
  .p-book__hit{display:none}
  .p-book-hint{font-size:10px}
  /* 品数の多いページは、ページ内で縦にスクロールできるようにする。
     横スワイプ判定は |dx|>|dy| なので、縦スクロールとは競合しない。 */
  .p-page__inner{padding:26px 22px 40px;overflow-y:auto;-webkit-overflow-scrolling:touch}
  .p-page.type-plate .p-page__inner{overflow:hidden;padding:0}
  .p-plate__vt{font-size:19px}
}
/* =========================================================
   NEWS
   ========================================================= */
.c-news__tab{display:flex;gap:26px;border-bottom:1px solid var(--c-ink-12);margin-bottom:8px}
.js__tab{position:relative;padding:0 2px 14px;font-family:var(--f-jp);font-size:13px;letter-spacing:.12em;color:var(--c-ink-60);cursor:pointer;transition:color .3s}
.js__tab::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:1px;background:var(--c-ink);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.js__tab.is-current{color:var(--c-ink)}
.js__tab.is-current::after{transform:scaleX(1)}
.js__tab__content{display:none}
.js__tab__content.is-current{display:block;animation:fadeUp .5s var(--ease)}
@keyframes fadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.c-news__list article{border-bottom:1px solid var(--c-ink-12)}
.c-news__list a{display:block;padding:26px 4px;transition:padding-left .35s var(--ease),background .35s}
.c-news__list a:hover{padding-left:14px}
.c-news__list .meta{display:flex;align-items:center;gap:16px;margin-bottom:8px}
.c-news__list time{font-family:var(--f-en);font-size:13px;letter-spacing:.14em;color:var(--c-green)}
.c-news__list .cat{padding:3px 12px;border:1px solid var(--c-ink-30);border-radius:999px;font-size:10px;letter-spacing:.12em;color:var(--c-ink-60)}
.c-news__list__content-text{font-family:var(--f-jp);font-weight:500;font-size:15px;line-height:1.8;letter-spacing:.08em}
#p-top-news .c-btn.type-line{margin-left:auto;display:flex;width:max-content}

/* =========================================================
   STORE
   ========================================================= */
.p-top-store__body{display:grid;grid-template-columns:1fr 1fr;gap:clamp(30px,5vw,74px);align-items:center}
#p-top-store__image{position:relative}
.js__carousel-list{position:relative;aspect-ratio:3/4}
.js__carousel-list>li{position:absolute;inset:0;opacity:0;transform:scale(1.04);transition:opacity .7s var(--ease),transform .9s var(--ease)}
.js__carousel-list>li.is-current{opacity:1;transform:none}
.js__carousel-list .c-photo{height:100%}
.js__carousel-sub{position:relative;min-height:170px}
.js__carousel-sub>section{position:absolute;inset:0;opacity:0;visibility:hidden;transform:translateY(14px);transition:opacity .6s var(--ease),transform .6s var(--ease),visibility .6s}
.js__carousel-sub>section.is-current{opacity:1;visibility:visible;transform:none}
.js__carousel-sub .title{font-family:var(--f-jp);font-weight:700;font-size:clamp(20px,2.6vw,28px);letter-spacing:.16em;margin-bottom:16px}
.js__carousel-sub .text{font-size:14px;line-height:2.3;color:var(--c-ink-60)}
.c-carousel-pager{display:flex;align-items:center;gap:14px;margin-top:22px;font-family:var(--f-en);font-size:13px;letter-spacing:.16em}
.c-carousel-pager-line{width:52px;height:1px;background:var(--c-ink-30)}
.c-carousel-pager-total{color:var(--c-ink-60)}
.c-carousel-button{display:flex;gap:12px;margin-top:22px}
.c-carousel-button button{width:48px;height:48px;border-radius:50%;border:1px solid var(--c-ink-30);display:grid;place-items:center;transition:background .35s,color .35s,border-color .35s}
.c-carousel-button button:hover{background:var(--c-ink);color:var(--c-key);border-color:var(--c-ink)}
.c-carousel-button svg{width:18px;height:18px}
.c-carousel-button-prev svg{transform:rotate(180deg)}

.c-info{margin-top:clamp(50px,7vw,90px);border-top:1px solid var(--c-ink-12)}
.c-info>div{display:grid;grid-template-columns:180px 1fr;gap:20px;padding:20px 4px;border-bottom:1px solid var(--c-ink-12)}
.c-info dt{font-family:var(--f-jp);font-weight:500;font-size:13px;letter-spacing:.16em}
.c-info dd{font-size:14px;letter-spacing:.08em;color:var(--c-ink-60)}
.c-info dd a{border-bottom:1px solid var(--c-ink-30)}
.todo{display:inline-block;margin-left:10px;padding:2px 9px;border-radius:999px;background:rgba(245,166,35,.16);color:var(--c-accent-d);font-size:10px;letter-spacing:.1em}
.c-map{margin-top:36px}
.c-map__placeholder{
  display:grid;place-items:center;aspect-ratio:16/7;border-radius:18px;
  background:repeating-linear-gradient(45deg,var(--c-bg-2) 0 12px,var(--c-paper) 12px 24px);
  border:1px solid var(--c-ink-12);
}
.c-map__placeholder p{font-size:12px;letter-spacing:.14em;color:var(--c-ink-60);text-align:center}
.c-map__placeholder span{display:block;font-size:10px;color:rgba(26,28,23,.4)}

.c-map__frame{
  display:block;width:100%;aspect-ratio:16/7;border:1px solid var(--c-ink-12);
  border-radius:18px;filter:grayscale(.15) contrast(1.02);
}
.c-map__link{
  display:inline-flex;align-items:center;gap:10px;margin-top:18px;
  font-family:var(--f-jp);font-weight:500;font-size:13px;letter-spacing:.1em;
  padding-bottom:6px;border-bottom:1px solid var(--c-ink-30);transition:border-color .3s;
}
.c-map__link svg{width:16px;height:16px;transition:transform .4s var(--ease)}
.c-map__link:hover{border-color:var(--c-ink)}
.c-map__link:hover svg{transform:translateX(4px)}

/* =========================================================
   ABOUT
   ========================================================= */
#p-top-about__body{display:grid;grid-template-columns:0.85fr 1.15fr;gap:clamp(30px,5vw,74px);align-items:center}
#p-top-about__text .catch{font-family:var(--f-jp);font-weight:700;font-size:clamp(22px,3.2vw,36px);line-height:1.6;letter-spacing:.12em;margin-bottom:26px}
#p-top-about__text .text{margin-bottom:18px;max-width:none}
#p-top-about__text .sign{margin-top:26px;font-family:var(--f-jp);font-size:13px;letter-spacing:.2em;text-align:right}
#p-top-about__list{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.6vw,30px);margin-top:clamp(50px,7vw,86px)}
#p-top-about__list li{padding:30px 26px;background:var(--c-paper);border-radius:20px;border:1px solid var(--c-ink-12)}
#p-top-about__list .num{font-family:var(--f-en);font-size:12px;letter-spacing:.3em;color:var(--c-green)}
#p-top-about__list .q{margin-top:12px;font-family:var(--f-jp);font-weight:700;font-size:14px;letter-spacing:.16em}
#p-top-about__list .a{margin-top:8px;font-size:13px;line-height:2;color:var(--c-ink-60)}

/* =========================================================
   SCENE
   ========================================================= */
#p-top-scene{background:var(--c-bg-2)}
#p-top-scene__list{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.6vw,34px)}
#p-top-scene__list li{padding:clamp(28px,3.4vw,42px);background:var(--c-paper);border-radius:22px;border:1px solid var(--c-ink-12);transition:transform .45s var(--ease),box-shadow .45s}
#p-top-scene__list li:hover{transform:translateY(-6px);box-shadow:0 16px 36px rgba(26,28,23,.08)}
#p-top-scene__list svg{width:52px;height:52px;color:var(--c-ink);margin-bottom:18px}
#p-top-scene__list .title{font-family:var(--f-jp);font-weight:700;font-size:18px;letter-spacing:.18em;margin-bottom:12px}
#p-top-scene__list .text{font-size:13px;line-height:2.1;color:var(--c-ink-60)}

/* =========================================================
   RESERVE
   ========================================================= */
#p-top-reserve{background:var(--c-key);padding:clamp(80px,11vw,150px) var(--pad-x);text-align:center}
.p-top-reserve__inner{max-width:720px;margin-inline:auto}
#p-top-reserve .en{font-family:var(--f-en);font-size:13px;letter-spacing:.34em;color:var(--c-green)}
#p-top-reserve .catch{margin-top:18px;font-family:var(--f-jp);font-weight:700;font-size:clamp(24px,4vw,44px);line-height:1.6;letter-spacing:.1em}
#p-top-reserve .text{margin:24px auto 0;max-width:none;font-size:14px;line-height:2.2;color:rgba(26,28,23,.72)}
#p-top-reserve .note{margin-top:16px;font-size:12px;color:rgba(26,28,23,.6)}

.p-top-reserve__btns{
  display:flex;flex-wrap:wrap;align-items:center;justify-content:center;
  gap:8px 28px;margin-top:26px;
}
.p-top-reserve__btns .c-btn.type-fill{margin-top:0}
.p-top-reserve__btns .c-btn.type-line{margin-top:0;border-color:var(--c-ink-30)}
.p-top-reserve__btns .c-btn.type-line:hover{border-color:var(--c-ink)}

/* =========================================================
   FOOTER
   ========================================================= */
#l-footer{position:relative;background:var(--c-ink);color:var(--c-bg);padding:clamp(64px,8vw,110px) var(--pad-x) 40px}
#l-footer__pagetop{position:absolute;top:-26px;right:var(--pad-x);display:flex;flex-direction:column;align-items:center;gap:10px}
#l-footer__pagetop-arrow{width:52px;height:52px;border-radius:50%;background:var(--c-key);color:var(--c-ink);display:grid;place-items:center;transition:transform .4s var(--ease)}
#l-footer__pagetop-arrow svg{width:20px;height:20px;transform:rotate(-90deg)}
#l-footer__pagetop:hover #l-footer__pagetop-arrow{transform:translateY(-5px)}
#l-footer__pagetop-line{display:none}
#l-footer__pagetop-text{font-family:var(--f-en);font-size:10px;letter-spacing:.26em;color:rgba(238,243,226,.6)}

#l-footer__content{max-width:1180px;margin-inline:auto}
#l-footer-title .jp{display:block;font-family:var(--f-jp);font-weight:700;font-size:clamp(19px,2.4vw,26px);line-height:1.5;letter-spacing:.1em}
#l-footer-title .en{display:block;margin-top:12px;font-family:var(--f-jp);font-size:12px;letter-spacing:.2em;color:rgba(238,243,226,.6)}

#l-footer__link{display:grid;grid-template-columns:repeat(4,1fr);gap:34px;margin-top:clamp(44px,6vw,72px)}
.l-footer__list .title{font-family:var(--f-jp);font-weight:700;font-size:13px;letter-spacing:.2em;padding-bottom:14px;border-bottom:1px solid rgba(238,243,226,.18)}
.l-footer__list ul{margin-top:16px;display:grid;gap:11px}
.l-footer__list a{font-size:13px;color:rgba(238,243,226,.72);transition:color .3s}
.l-footer__list a:hover{color:var(--c-key)}

#l-footer__other{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-top:clamp(44px,6vw,72px);padding-top:34px;border-top:1px solid rgba(238,243,226,.18)}
#l-footer__sns-title{color:rgba(238,243,226,.6)}
#l-footer__sns-list a{color:rgba(238,243,226,.85);border-color:rgba(238,243,226,.3)}
#l-footer__sns-list a:hover{border-color:var(--c-key);color:var(--c-key)}
#l-footer__veg{display:flex;gap:18px}
#l-footer__veg svg{width:40px;height:40px;color:var(--c-key);opacity:.5}
#l-footer__copyright{margin-top:34px;font-family:var(--f-en);font-size:11px;letter-spacing:.18em;color:rgba(238,243,226,.45)}

/* =========================================================
   SP FIXED BAR
   ========================================================= */
#l-spbar{
  position:fixed;left:0;right:0;bottom:0;z-index:890;
  display:none;background:var(--c-paper);border-top:1px solid var(--c-ink-12);
  transform:translateY(100%);transition:transform .5s var(--ease);
  padding-bottom:env(safe-area-inset-bottom);
}
body.is-scrolled #l-spbar{transform:translateY(0)}
body.is-navi-open #l-spbar{transform:translateY(100%)}
.l-spbar__item{flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;padding:11px 4px;font-size:11px;letter-spacing:.08em}
.l-spbar__item .ic{font-family:var(--f-en);font-size:11px;letter-spacing:.1em;color:var(--c-green)}
.l-spbar__item.is-primary{background:var(--c-accent);color:#fff}
.l-spbar__item.is-primary .ic{color:rgba(255,255,255,.85)}

/* =========================================================
   RESPONSIVE
   ========================================================= */
@media (max-width:1024px){
  #l-header__navi__inner{grid-template-columns:1fr;gap:44px}
  .c-products__list{grid-template-columns:repeat(3,1fr)}
  #p-top-about__body{grid-template-columns:1fr;gap:34px}
  #p-top-about__body .c-photo.portrait{max-width:360px}
}

@media (max-width:767px){
  :root{--header-h:70px}
  body{font-size:14px}
  #l-spbar{display:flex}
  #l-footer{padding-bottom:96px}

  #l-header-title{top:18px}
  #l-header-title .jp{font-size:14px}
  #l-header-title .en{font-size:8px;letter-spacing:.16em}
  #l-header-btn{top:16px}
  #l-header-btn-text{display:none}

  #l-header__navi__inner{padding:104px var(--pad-x) 60px}
  .l-header__navi__item>a{gap:14px;padding:18px 2px;flex-wrap:wrap}
  .l-header__navi__item .en{display:none}
  .l-header__navi__children{padding-left:34px;gap:6px 18px}

  #p-kv{height:100svh;min-height:520px}
  #p-kv-copy{top:40%;font-size:clamp(26px,8.4vw,44px)}
  #p-kv-lead{top:calc(40% + 108px);font-size:12px}
  .p-kv-trigger{width:38px;height:38px;font-size:11px}
  #p-kv-close{top:78px;right:16px}
  #p-kv-button{padding:0 10px}
  #p-kv-button button{width:44px;height:44px}
  #p-kv-pager{bottom:80px}
  #p-kv-guide{bottom:66px}
  .p-kv-detail__list__inner{border-radius:20px}
  .p-kv-detail__list-content{font-size:13px;line-height:2.05}

  .c-section-title .en{font-size:clamp(38px,13vw,56px)}
  .c-section-title.position-right{text-align:left}
  .c-section-title.position-right::after{margin-left:0;transform-origin:left}

  #p-top-menu__seasonal ul{grid-template-columns:1fr;gap:26px}
  .c-products__list{grid-template-columns:repeat(2,1fr)}
  #p-top-news .c-btn.type-line{margin-left:0}
  .c-news__list a{padding:20px 2px}

  .p-top-store__body{grid-template-columns:1fr;gap:28px}
  .js__carousel-list{aspect-ratio:4/3}
  .c-photo.tall{aspect-ratio:4/3}
  .js__carousel-sub{min-height:190px}
  .c-info>div{grid-template-columns:1fr;gap:4px;padding:16px 2px}
  .c-map__placeholder{aspect-ratio:4/3}
  .c-map__frame{aspect-ratio:4/3}

  #p-top-about__list{grid-template-columns:1fr;gap:14px}
  #p-top-scene__list{grid-template-columns:1fr;gap:16px}

  .c-band__veg{inset:0;opacity:.5}
  .c-band__veg svg:nth-child(n+5){display:none}

  /* 「空けてお待ちしています。」が3行に割れるのを防ぐ */
  #p-top-reserve .catch{font-size:21px;letter-spacing:.06em}

  #l-footer__link{grid-template-columns:1fr;gap:0}
  .l-footer__list{border-bottom:1px solid rgba(238,243,226,.18)}
  .l-footer__list .title{position:relative;padding:18px 2px;border-bottom:0;cursor:pointer}
  .l-footer__list .title::before,.l-footer__list .title::after{
    content:"";position:absolute;right:4px;top:50%;width:12px;height:1px;background:var(--c-bg);transition:transform .4s var(--ease);
  }
  .l-footer__list .title::after{transform:rotate(90deg)}
  .l-footer__list.is-open .title::after{transform:rotate(0)}
  .l-footer__list ul{margin-top:0;overflow:hidden;max-height:0;transition:max-height .5s var(--ease),padding .5s var(--ease);padding-bottom:0}
  .l-footer__list.is-open ul{max-height:280px;padding-bottom:20px}
  #l-footer__other{flex-direction:column;align-items:flex-start;gap:26px}
  #l-footer__pagetop{top:-24px;right:16px}
}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  html{scroll-behavior:auto}
}

/* ============================================================
   Instagram リールのカバー（TOPのおしらせ枠）
   ── 横3枚で折り返し。写真をただ貼らず、番号＋手書きキャプションで
      サイトのお品書き／ABOUTと同じ「見出し＋小文」の文法に寄せる。
   ============================================================ */
.c-ig__reels{
  list-style:none;margin:clamp(28px,4vw,44px) 0 0;padding:0;
  display:grid;grid-template-columns:repeat(3,1fr);
  gap:clamp(18px,2.6vw,34px) clamp(16px,2.4vw,30px);
}
.c-ig__reels li{margin:0}
.c-ig__reels figure{margin:0}
.c-ig__reels a{
  position:relative;display:block;overflow:hidden;
  aspect-ratio:4/5;border-radius:10px;
  border:1px solid var(--c-ink-12);
  background:var(--c-bg-2);
  transition:transform .45s var(--ease),border-color .45s,box-shadow .45s;
}
.c-ig__reels a:hover{
  transform:translateY(-4px);
  border-color:var(--c-ink-30);
  box-shadow:0 14px 30px -18px rgba(26,28,23,.4);
}
.c-ig__reels img{
  position:absolute;inset:0;width:100%;height:100%;
  object-fit:cover;transition:transform .6s var(--ease);
}
.c-ig__reels a:hover img{transform:scale(1.045)}

/* 再生マーク：野菜の線画と同じ「細い線」のトーンに合わせる */
.c-ig__play{
  position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);
  width:52px;height:52px;border-radius:50%;
  border:1.5px solid rgba(247,250,240,.92);
  background:rgba(26,28,23,.26);
  display:grid;place-items:center;pointer-events:none;
  transition:background .35s;
}
.c-ig__reels a:hover .c-ig__play{background:rgba(26,28,23,.1)}
.c-ig__play::before{
  content:"";
  border-style:solid;border-width:6px 0 6px 11px;
  border-color:transparent transparent transparent rgba(247,250,240,.95);
  margin-left:3px;
}

/* キャプション：Cormorantの番号＋和文小文（.caption / p-plate__cap と同系） */
.c-ig__reels figcaption{
  display:flex;align-items:baseline;gap:10px;
  margin-top:12px;padding-top:11px;
  border-top:1px solid var(--c-ink-12);
}
.c-ig__reels figcaption .no{
  flex:none;font-family:var(--f-en);font-size:14px;
  letter-spacing:.06em;color:var(--c-green);
}
.c-ig__reels figcaption .tx{
  font-family:var(--f-jp);font-size:12px;line-height:1.75;
  letter-spacing:.08em;color:var(--c-ink-60);
}
.c-ig__reels a:hover ~ figcaption .tx,
.c-ig__reels figure:hover figcaption .tx{color:var(--c-ink)}

.c-ig__handle{
  margin-top:clamp(20px,2.6vw,30px);
  font-family:var(--f-en);font-size:13px;letter-spacing:.2em;
  color:rgba(26,28,23,.5);
}
#p-top-news .c-btn.type-line{margin-top:14px}

@media (max-width:820px){
  .c-ig__reels{grid-template-columns:repeat(2,1fr)}
}
@media (max-width:480px){
  .c-ig__reels{gap:20px 14px}
  .c-ig__reels figcaption .tx{font-size:11.5px}
}

/* ============================================================
   下層ページ（プライバシーポリシー / お問い合わせ）
   ============================================================ */
#l-body.is-lower{
  padding:clamp(120px,15vw,180px) var(--pad-x) clamp(60px,8vw,100px);
  max-width:820px;margin-inline:auto;
}
@media (max-width:768px){
  #l-body.is-lower{padding-top:104px}
}
.p-legal{margin-top:clamp(30px,5vw,48px)}
.p-legal h2{
  font-family:var(--f-jp);font-weight:700;
  font-size:clamp(15px,1.8vw,17px);letter-spacing:.12em;
  margin:clamp(30px,4vw,44px) 0 12px;padding-bottom:10px;
  border-bottom:1px solid var(--c-ink-12);
}
.p-legal h2:first-child{margin-top:0}
.p-legal p,.p-legal li{
  font-size:13px;line-height:2.1;letter-spacing:.06em;color:var(--c-ink-60);
}
.p-legal p+p{margin-top:14px}
.p-legal ul,.p-legal ol{margin:12px 0 0;padding-left:1.4em}
.p-legal ul{list-style:disc}
.p-legal ol{list-style:decimal}
.p-legal li{padding-left:.2em}
.p-legal li::marker{color:var(--c-key-deep)}
.p-legal li+li{margin-top:6px}
.p-legal a{border-bottom:1px solid var(--c-ink-30);transition:border-color .3s}
.p-legal a:hover{border-color:var(--c-ink)}
.p-legal dl{margin-top:14px}
.p-legal dl>div{
  display:grid;grid-template-columns:120px 1fr;gap:6px 20px;
  padding:14px 0;border-top:1px solid var(--c-ink-12);
}
.p-legal dl>div:last-child{border-bottom:1px solid var(--c-ink-12)}
.p-legal dt{font-family:var(--f-jp);font-weight:500;font-size:12.5px;letter-spacing:.08em;color:var(--c-ink)}
.p-legal dd{font-size:13px;line-height:2;color:var(--c-ink-60)}
@media (max-width:768px){
  .p-legal dl>div{grid-template-columns:1fr;gap:4px}
}
.p-legal__updated{margin-top:clamp(34px,5vw,50px);font-size:11px;letter-spacing:.1em;color:var(--c-ink-30)}
.p-lower-head .en{
  display:block;font-family:var(--f-en);font-size:clamp(34px,6vw,60px);
  line-height:1;letter-spacing:.06em;color:var(--c-green);
}
.p-lower-head .jp{
  display:block;margin-top:12px;font-family:var(--f-jp);font-weight:700;
  font-size:clamp(15px,1.8vw,18px);letter-spacing:.22em;
}

/* ============================================================
   アクセス文（STOREセクション）
   ============================================================ */
.c-access{margin-top:clamp(30px,4vw,44px)}
.c-access__title{
  font-family:var(--f-jp);font-weight:700;
  font-size:clamp(14px,1.7vw,16px);letter-spacing:.1em;margin-bottom:12px;
}
.c-access__text{font-size:13px;line-height:2.1;letter-spacing:.05em;color:var(--c-ink-60)}
.c-access__text+.c-access__text{margin-top:12px}
.c-access__text strong{font-weight:700;color:var(--c-ink)}
.c-access__text a{border-bottom:1px solid var(--c-ink-30);transition:border-color .3s}
.c-access__text a:hover{border-color:var(--c-ink)}

/* ============================================================
   よくあるご質問（FAQ）
   ============================================================ */
.c-faq{margin-top:clamp(30px,5vw,50px);max-width:860px}
.c-faq__item{border-top:1px solid var(--c-ink-12);padding:clamp(18px,2.4vw,26px) 0}
.c-faq__item:last-child{border-bottom:1px solid var(--c-ink-12)}
.c-faq__q{
  position:relative;padding-left:1.7em;
  font-family:var(--f-jp);font-weight:700;
  font-size:clamp(14px,1.6vw,16px);line-height:1.7;letter-spacing:.04em;color:var(--c-ink);
}
.c-faq__q::before{
  content:"Q";position:absolute;left:0;top:-.05em;
  font-family:var(--f-en);font-size:1.15em;font-weight:500;color:var(--c-key-deep);
}
.c-faq__a{
  position:relative;margin-top:10px;padding-left:1.7em;
  font-size:13px;line-height:2.05;letter-spacing:.04em;color:var(--c-ink-60);
}
.c-faq__a::before{
  content:"A";position:absolute;left:0;top:-.05em;
  font-family:var(--f-en);font-size:1.15em;font-weight:500;color:var(--c-ink-30);
}
.c-faq__a a{border-bottom:1px solid var(--c-ink-30);transition:border-color .3s}
.c-faq__a a:hover{border-color:var(--c-ink)}

/* ============================================================
   フッターのNAP（店名・住所・電話）
   ============================================================ */
#l-footer__nap{
  margin-top:34px;font-style:normal;
  font-size:12px;line-height:2;letter-spacing:.04em;color:rgba(238,243,226,.6);
}
#l-footer__nap a{color:rgba(238,243,226,.82);border-bottom:1px solid rgba(238,243,226,.3);transition:color .3s}
#l-footer__nap a:hover{color:var(--c-key)}
#l-footer__nap+#l-footer__copyright{margin-top:16px}