/* あぜみち農園（制作の見本）
   色：麦わらの地・葉の緑・土の茶（トマトの赤は、ごく少し）。字：Zen Kurenaido／Noto Sans JP／Outfit。
   しるし：芽が出て、旬がめぐる。
   端末の字の控え：手書きの字 → ヒラギノ丸ゴ／本文 → ヒラギノ角ゴ・游ゴシック／数 → Helvetica Neue */
:root{
  --bg:#F4F0E1; --face:#E9E3CF; --paper:#FAF7EC; --rule:#D9D1B8; --rule2:#C5BB9C;
  --ink:#2A2A1F; --txt:#3D3B2E; --mute:#6E6A55; --leaf:#4F7A28; --leaf-d:#3F6320; --soil:#6B4A2F; --tomato:#D4472B;
  --leaf-l:#A9C47E;
  --ff-hand:"Zen Kurenaido","Hiragino Maru Gothic ProN","Hiragino Sans",sans-serif;
  --ff-go:"Noto Sans JP","Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;
  --ff-num:"Outfit","Helvetica Neue",Arial,sans-serif;
  --ease:cubic-bezier(.22,.61,.36,1); --ease-out:cubic-bezier(.16,1,.3,1); --ease-soft:cubic-bezier(.65,0,.25,1);
  --gutter:clamp(22px,6vw,80px);
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:70px}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--ff-go);font-size:15px;line-height:2;letter-spacing:.04em;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;line-break:strict;overflow-wrap:anywhere}
img,svg{display:block;max-width:100%}
img{height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure,fieldset,legend{margin:0;padding:0}
fieldset{border:0;min-width:0}
h1,h2,h3,h4{font-weight:400}
ul,ol{list-style:none}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer;letter-spacing:inherit}
::selection{background:var(--leaf);color:var(--paper)}
:focus-visible{outline:2px solid var(--leaf);outline-offset:3px}
.wrap{overflow-x:hidden}
@supports (overflow:clip){.wrap{overflow-x:clip}}
/* 麦わら色の紙の目 */
body::after{content:"";position:fixed;inset:0;z-index:90;pointer-events:none;opacity:.08;mix-blend-mode:multiply;background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='220' height='220'><filter id='n'><feTurbulence type='fractalNoise' baseFrequency='.62 .9' numOctaves='3' stitchTiles='stitch'/><feColorMatrix values='0 0 0 0 .32 0 0 0 0 .26 0 0 0 0 .15 0 0 0 .85 0'/></filter><rect width='100%' height='100%' filter='url(%23n)'/></svg>")}

/* ---------- 共通の部品 ---------- */
main{position:relative}
.sec{position:relative;padding-block:clamp(88px,22vw,120px)}
.sec__in{position:relative;padding-inline:var(--gutter);max-width:1240px;margin-inline:auto}
.ib{display:inline-block;font-weight:inherit}
.lbl{display:flex;align-items:flex-end;gap:10px;margin-bottom:16px;line-height:1}
.lbl .sprout{flex:none;width:22px;height:28px;margin-bottom:-1px}
.lbl__n{padding-bottom:2px;font-family:var(--ff-num);font-size:13px;letter-spacing:.16em;color:var(--soil)}
.lbl__t{position:relative;padding:0 0 1px 24px;font-family:var(--ff-hand);font-size:16px;letter-spacing:.1em;color:var(--leaf-d)}
.lbl__t::before{content:"";position:absolute;left:3px;top:52%;width:13px;height:1px;background:currentColor;opacity:.55}
.h2{font-family:var(--ff-hand);font-size:clamp(28px,7.9vw,50px);line-height:1.5;letter-spacing:.05em;text-wrap:balance}
.body{margin-top:22px;color:var(--txt);text-wrap:pretty}
.note{font-size:12px;line-height:1.9;color:var(--mute);text-wrap:pretty}
.lnk{display:inline-flex;align-items:center;gap:14px;min-height:46px;font-family:var(--ff-hand);font-size:17px;letter-spacing:.08em;border-bottom:1px solid currentColor}
.lnk i,.btn i,.gmenu__cta i{position:relative;flex:none;width:30px;height:1px;background:currentColor;transition:width .5s var(--ease-out)}
.lnk i::after,.btn i::after,.gmenu__cta i::after{content:"";position:absolute;right:0;top:-3px;width:7px;height:7px;border-top:1px solid;border-right:1px solid;transform:rotate(45deg)}
.lnk:hover i{width:48px}

/* 芽（見出しの横） */
.sprout path{stroke:var(--ink);stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.sprout .sp-soil{stroke:var(--soil)}
.sprout .sp-l,.sprout .sp-r{stroke:var(--leaf);transform-box:view-box;transform-origin:12.25px 14.3px}
.sprout .sp-stem{stroke-dasharray:1 1.2;stroke-dashoffset:0}
html.js [data-r] .sprout .sp-stem{stroke-dashoffset:1.1;transition:stroke-dashoffset .9s var(--ease) calc(var(--d,0s) + .2s)}
html.js [data-r] .sprout .sp-l,html.js [data-r] .sprout .sp-r{transform:scale(0) rotate(-14deg);transition:transform 1.1s var(--ease-out) calc(var(--d,0s) + .85s)}
html.js [data-r] .sprout .sp-r{transform:scale(0) rotate(14deg);transition-delay:calc(var(--d,0s) + 1s)}
html.js [data-r].is-in .sprout .sp-stem{stroke-dashoffset:0}
html.js [data-r].is-in .sprout .sp-l,html.js [data-r].is-in .sprout .sp-r{transform:none}

/* 線で描いた野菜 */
.veg{display:block}
.veg svg{width:100%;height:100%;overflow:visible}
.veg path{fill:none;stroke:var(--ink);stroke-width:var(--sw,1.7);stroke-linecap:round;stroke-linejoin:round}
.veg .g{stroke:var(--leaf)}
.veg .t{stroke:var(--tomato)}

/* 写真 */
.ph{position:relative}
.ph__z{display:block;position:relative;overflow:hidden;aspect-ratio:3/2;background:var(--face)}
.ph__z img{position:absolute;left:0;top:-7%;width:100%;height:114%;object-fit:cover}
.ph figcaption{margin-top:10px;font-family:var(--ff-hand);font-size:14px;letter-spacing:.06em;line-height:1.6;color:var(--mute)}

/* 出てくる動き（プログラムが動く時だけ） */
html.js [data-r=""]{opacity:0;transform:translateY(24px);transition:opacity 1.1s var(--ease) var(--d,0s),transform 1.3s var(--ease-out) var(--d,0s)}
html.js [data-r=""].is-in{opacity:1;transform:none}
html.js .ph[data-r="img"] .ph__z{clip-path:inset(100% 0 0 0);transition:clip-path 1.7s var(--ease-out) var(--d,0s)}
html.js .ph[data-r="img"].is-in .ph__z{clip-path:inset(0 0 0 0)}
html.js .ph[data-r="img"] .ph__z img{scale:1.14;transition:scale 2.6s var(--ease-out) var(--d,0s)}
html.js .ph[data-r="img"].is-in .ph__z img{scale:1}
html.js .ph[data-r="img"] figcaption{opacity:0;transition:opacity 1s var(--ease) 1s}
html.js .ph[data-r="img"].is-in figcaption{opacity:1}

/* ---------- 始まりの幕：土の線から芽が出る ---------- */
.loader{display:none}
html.js .loader{display:flex;position:fixed;z-index:100;inset:0;align-items:center;justify-content:center;background:var(--bg);clip-path:inset(0 0 0 0);transition:clip-path 1.25s var(--ease-soft) .1s,visibility 0s 1.45s,opacity 0s 1.45s}
html.js.is-loaded .loader{clip-path:inset(0 0 100% 0);visibility:hidden;opacity:0}
.loader__in{display:flex;flex-direction:column;align-items:center;margin-top:-6vh}
.loader__sprout{width:156px;height:130px}
.loader__sprout path{stroke:var(--ink);stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round}
.loader__sprout .ls-soil{stroke:var(--soil);stroke-dasharray:1 1.2;stroke-dashoffset:1.1;animation:draw 1s var(--ease) .1s forwards}
.loader__sprout .ls-crumb{stroke:var(--soil);opacity:0;animation:fade .6s ease .75s forwards}
.loader__sprout .ls-stem{stroke-dasharray:1 1.2;stroke-dashoffset:1.1;animation:draw .85s var(--ease) .55s forwards}
.loader__sprout .ls-leaf path{stroke:var(--leaf)}
.ls-leaf{transform-box:view-box;transform-origin:60.5px 52.8px;transform:scale(0) rotate(-16deg);animation:leaf 1.15s var(--ease-out) 1.15s forwards}
.ls-leaf--r{transform:scale(0) rotate(16deg);animation-delay:1.3s}
.loader__name{margin-top:10px;font-family:var(--ff-hand);font-size:22px;line-height:1.4;letter-spacing:.3em;padding-left:.3em;opacity:0;animation:up .9s var(--ease) .45s forwards}
.loader__en{margin-top:6px;font-family:var(--ff-num);font-size:12px;line-height:1.4;letter-spacing:.22em;padding-left:.22em;text-transform:uppercase;color:var(--mute);opacity:0;animation:up .9s var(--ease) .75s forwards}
@keyframes draw{to{stroke-dashoffset:0}}
@keyframes fade{to{opacity:1}}
@keyframes leaf{to{transform:none}}
@keyframes up{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}

/* ---------- 上の帯 ---------- */
.hd{position:fixed;z-index:50;top:0;left:0;right:0;display:flex;align-items:center;justify-content:space-between;height:64px;padding-inline:var(--gutter);transition:transform .7s var(--ease),background-color .5s}
.hd::after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--rule);opacity:0;transition:opacity .5s}
.hd.is-solid{background:rgba(244,240,225,.88);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}
.hd.is-solid::after{opacity:1}
.hd.is-hide{transform:translateY(-102%)}
html.is-menu .hd{transform:none;background:transparent;-webkit-backdrop-filter:none;backdrop-filter:none}
html.is-menu .hd::after{opacity:0}
.hd__logo{display:grid;grid-template-columns:auto auto;column-gap:9px;align-items:center;align-content:center;min-height:44px;line-height:1}
.hd__mark{grid-row:1/3;width:20px;height:25px}
.hd__mark path{stroke:var(--ink);stroke-width:1.3;stroke-linecap:round;stroke-linejoin:round}
.hd__mark .g{stroke:var(--leaf)}
.hd__ja{font-family:var(--ff-hand);font-size:19px;letter-spacing:.12em}
.hd__en{margin-top:4px;font-family:var(--ff-num);font-size:12px;letter-spacing:.14em;text-transform:uppercase;color:var(--mute)}
.hd__nav,.hd__cta{display:none}
.hd__btn{position:relative;width:54px;height:48px;margin-right:-12px}
.hd__btn i{position:absolute;left:14px;right:14px;height:1.2px;background:var(--ink);transition:transform .6s var(--ease-out),top .6s var(--ease-out),right .6s var(--ease-out)}
.hd__btn i:nth-child(1){top:15px}
.hd__btn i:nth-child(2){top:22px;right:21px}
.hd__btn span{position:absolute;left:0;right:0;bottom:5px;font-family:var(--ff-hand);font-size:12px;letter-spacing:.14em;padding-left:.14em;line-height:1;text-align:center}
html.is-menu .hd__btn i:nth-child(1){top:19px;transform:rotate(24deg)}
html.is-menu .hd__btn i:nth-child(2){top:19px;right:14px;transform:rotate(-24deg)}

/* 目次（帳面の1枚） */
.gmenu{position:fixed;z-index:40;inset:0;overflow:auto;background:var(--paper);visibility:hidden;clip-path:inset(0 0 100% 0);transition:clip-path .9s var(--ease-out),visibility 0s .9s}
html.is-menu .gmenu{visibility:visible;clip-path:inset(0 0 0 0);transition:clip-path .9s var(--ease-out)}
html.is-menu,html.is-menu body{overflow:hidden}
.gmenu__in{display:flex;flex-direction:column;min-height:100%;padding:90px var(--gutter) 40px}
.gmenu__ttl{font-family:var(--ff-hand);font-size:13px;letter-spacing:.2em;color:var(--leaf-d)}
.gmenu__list{margin-top:12px;border-top:1px solid var(--rule2)}
.gmenu__list li{border-bottom:1px solid var(--rule);opacity:0;transform:translateY(14px);transition:opacity .4s,transform .4s}
html.is-menu .gmenu__list li{opacity:1;transform:none;transition:opacity .8s var(--ease) calc(.2s + var(--i,0)*.06s),transform 1s var(--ease-out) calc(.2s + var(--i,0)*.06s)}
.gmenu__list li:nth-child(2){--i:1}.gmenu__list li:nth-child(3){--i:2}.gmenu__list li:nth-child(4){--i:3}.gmenu__list li:nth-child(5){--i:4}.gmenu__list li:nth-child(6){--i:5}.gmenu__list li:nth-child(7){--i:6}.gmenu__list li:nth-child(8){--i:7}
.gmenu__list a{display:flex;align-items:center;gap:18px;min-height:54px}
.gmenu__list small{width:22px;font-family:var(--ff-num);font-size:12px;letter-spacing:.12em;color:var(--soil)}
.gmenu__list span{font-family:var(--ff-hand);font-size:19px;letter-spacing:.08em}
.gmenu__cta{display:flex;align-items:center;justify-content:space-between;margin-top:28px;min-height:58px;padding:0 22px;background:var(--ink);color:var(--bg);font-family:var(--ff-hand);font-size:17px;letter-spacing:.08em}
.gmenu__info{margin-top:auto;padding-top:26px;font-size:13px;line-height:1.95;color:var(--mute)}

/* ---------- 最初の画面 ---------- */
.hero{position:relative;display:flex;flex-direction:column;padding-top:64px}
.hero__txt{order:1;position:relative;z-index:2;padding:30px var(--gutter) 30px}
.hero__media{order:2}
.hero__place{order:3}
.hero__kicker{display:flex;align-items:flex-end;gap:8px;font-family:var(--ff-hand);font-size:15px;letter-spacing:.08em;line-height:1.4;color:var(--leaf-d)}
.hero__kicker .sprout{flex:none;width:20px;height:25px}
.hero__ttl{margin-top:16px;font-family:var(--ff-hand);font-size:clamp(34px,11vw,92px);line-height:1.36;letter-spacing:.04em}
.hl{display:block;overflow:hidden;padding:.05em 0 .1em;margin:-.05em 0 -.1em}
.hl>span{display:block;white-space:nowrap}
.hero__aside{margin-top:18px}
.hero__sub{font-size:16px;line-height:1.9;color:var(--txt)}
.hero__cta{margin-top:16px}
.hero__media{position:relative;z-index:1}
.hero__ph{position:relative;overflow:hidden;aspect-ratio:3/2;background:var(--face)}
.hero__ph img{position:absolute;left:0;top:-4%;width:100%;height:108%;object-fit:cover;object-position:50% 60%}
.hero__place{display:flex;justify-content:space-between;padding:10px var(--gutter) 0;font-family:var(--ff-hand);font-size:13px;letter-spacing:.08em;line-height:1.6;color:var(--mute)}
html.js .hl>span{transform:translateY(112%);transition:transform 1.5s var(--ease-out) .15s}
html.js .hl:nth-child(2)>span{transition-delay:.33s}
html.js.is-loaded .hl>span{transform:none}
html.js .hero__kicker,html.js .hero__aside,html.js .hero__place{opacity:0;transform:translateY(14px);transition:opacity 1.2s var(--ease) .75s,transform 1.4s var(--ease-out) .75s}
html.js .hero__aside{transition-delay:.95s,.95s}
html.js .hero__place{transition-delay:1.5s,1.5s}
html.js.is-loaded .hero__kicker,html.js.is-loaded .hero__aside,html.js.is-loaded .hero__place{opacity:1;transform:none}
html.js .hero .sprout .sp-stem{stroke-dashoffset:1.1;transition:stroke-dashoffset .9s var(--ease) 1s}
html.js .hero .sprout .sp-l{transform:scale(0) rotate(-14deg);transition:transform 1.1s var(--ease-out) 1.6s}
html.js .hero .sprout .sp-r{transform:scale(0) rotate(14deg);transition:transform 1.1s var(--ease-out) 1.75s}
html.js.is-loaded .hero .sprout .sp-stem{stroke-dashoffset:0}
html.js.is-loaded .hero .sprout .sp-l,html.js.is-loaded .hero .sprout .sp-r{transform:none}
html.js .hero__ph{clip-path:inset(100% 0 0 0);transition:clip-path 1.8s var(--ease-out) .4s}
html.js.is-loaded .hero__ph{clip-path:inset(0 0 0 0)}
html.js .hero__ph img{scale:1.12;transition:scale 3s var(--ease-out) .4s}
html.js.is-loaded .hero__ph img{scale:1}

/* ---------- 01 畑のこと ---------- */
.nums{margin-top:44px;border-top:1px solid var(--rule2)}
.nums li{display:grid;grid-template-columns:60px 1fr;column-gap:20px;align-items:center;padding:22px 0 20px;border-bottom:1px solid var(--rule)}
.nums__ic{grid-row:1/3;width:60px;height:38px}
.nums__ic path{stroke:var(--ink);stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.nums__ic .s{stroke:var(--soil)}
.nums__ic .g{stroke:var(--leaf)}
.nums__v{display:flex;align-items:baseline;gap:6px;line-height:1}
.nums__v b{font-family:var(--ff-num);font-weight:200;font-size:58px;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.nums__v span{font-family:var(--ff-hand);font-size:20px}
.nums__t{margin-top:8px;font-size:14px;line-height:1.7;color:var(--txt)}

/* 畝の線（スクロールで引かれる） */
.une{max-width:1240px;height:30px;margin:0 auto;padding-inline:var(--gutter)}
.une svg{width:100%;height:30px;overflow:visible}
.une path{fill:none;stroke-linecap:round;stroke-linejoin:round}
.une .u1{stroke:var(--soil);stroke-width:1.3}
.une .u2{stroke:var(--ink);stroke-width:1;opacity:.3}

/* ---------- 02 今月の畑（しるしの動き） ---------- */
.season{--step:40vh;--vs:84px;position:relative;background:var(--face)}
.season__stage{position:relative;background-image:repeating-linear-gradient(to bottom,transparent 0 31px,rgba(110,106,85,.11) 31px 32px)}
html.js .season{height:calc(100vh + 12 * var(--step))}
html.js .season__stage{position:sticky;top:0;height:100vh;height:100svh;overflow:hidden}
.season__in{display:flex;flex-direction:column;gap:22px;max-width:1240px;margin-inline:auto;padding:clamp(88px,22vw,120px) var(--gutter)}
html.js .season__in{height:100%;justify-content:space-between;gap:0;padding:76px var(--gutter) 64px}
.season__top{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.season__head .lbl{margin-bottom:10px}
.season__head .h2{line-height:1.25}
.season__mon{display:grid;grid-template-columns:auto auto;align-items:end;line-height:1;text-align:right}
.season__mon b{font-family:var(--ff-num);font-weight:200;font-size:clamp(64px,19vw,84px);line-height:.78;letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.season__ji{margin-left:4px;font-family:var(--ff-hand);font-size:24px}
.season__mon em{grid-column:1/-1;margin-top:9px;font-family:var(--ff-num);font-style:normal;font-size:12px;letter-spacing:.22em;text-transform:uppercase;color:var(--mute)}
.field__list{display:flex;flex-wrap:wrap;justify-content:center;row-gap:12px}
.fv{position:relative;display:flex;flex-direction:column;align-items:center;width:33.333%}
.fv::after{content:"";position:absolute;left:0;right:0;top:calc(var(--vs) + 3px);height:1px;background:var(--ink);opacity:.2}
.fv::before{content:"";position:absolute;z-index:2;left:50%;top:calc(var(--vs) - 6px);width:calc(var(--vs) * .86);height:10px;transform:translateX(-50%);background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 80 10' preserveAspectRatio='none'><path d='M1 9.4 C 13 3.4, 28 1.2, 40 1.3 C 53 1.4, 67 3.2, 79 9.4 Z' fill='%23E9E3CF'/><path d='M1 9.4 C 13 3.4, 28 1.2, 40 1.3 C 53 1.4, 67 3.2, 79 9.4' fill='none' stroke='%236B4A2F' stroke-width='1.25' stroke-linecap='round'/><path d='M24 6.4 h2.2 M44 4.6 h1.8 M58 6.8 h2' stroke='%236B4A2F' stroke-width='1' stroke-linecap='round'/></svg>") center/100% 100% no-repeat}
.fv__pic{position:relative;width:var(--vs);height:var(--vs);overflow:hidden;--sw:1.75}
.fv__pic svg{position:relative}
.fv__name{margin-top:13px;font-family:var(--ff-hand);font-size:15px;line-height:1.3;letter-spacing:.06em;white-space:nowrap}
.season__say{font-family:var(--ff-hand);font-size:16px;line-height:1.8;letter-spacing:.05em;text-wrap:pretty}
.season__mon b,.season__mon .season__ji,.season__mon em,.season__say{transition:opacity .7s var(--ease),transform .9s var(--ease-out)}
html.js .season.is-swap .season__mon b,html.js .season.is-swap .season__mon .season__ji,html.js .season.is-swap .season__mon em,html.js .season.is-swap .season__say{opacity:0;transform:translateY(-10px);transition:opacity .3s var(--ease),transform .4s var(--ease)}
html.js .fv__pic svg{transform:translateY(104%);transition:transform 1.25s cubic-bezier(.2,.75,.25,1) calc(var(--i,0) * .11s)}
html.js .fv__pic path{stroke-dasharray:1 1.2;stroke-dashoffset:1.1;transition:stroke-dashoffset 1.9s var(--ease) calc(var(--i,0) * .11s + var(--k,0) * .05s + .1s)}
html.js .fv__name{opacity:0;transform:translateY(8px);transition:opacity .8s var(--ease) calc(var(--i,0) * .11s + .8s),transform 1s var(--ease-out) calc(var(--i,0) * .11s + .8s)}
html.js .field.is-grow .fv__pic svg{transform:none}
html.js .field.is-grow .fv__pic path{stroke-dashoffset:0}
html.js .field.is-grow .fv__name{opacity:1;transform:none}
html.js .field.is-out .fv__pic svg{transform:translateY(104%);transition:transform .42s cubic-bezier(.55,0,.8,.2) calc(var(--i,0) * .035s)}
html.js .field.is-out .fv__name{opacity:0;transform:translateY(-4px);transition:opacity .25s,transform .3s}
.cal{display:grid;grid-template-columns:repeat(6,1fr);border-top:1px solid var(--rule2);border-left:1px solid var(--rule2)}
.cal button{position:relative;height:44px;border-right:1px solid var(--rule2);border-bottom:1px solid var(--rule2);font-family:var(--ff-num);font-size:15px;color:var(--mute);transition:color .4s,background-color .4s}
.cal button:hover{background:rgba(244,240,225,.7)}
.cal button span{position:relative;z-index:1}
.cal button.is-now::after{content:"今月";position:absolute;left:0;right:0;top:2px;font-family:var(--ff-hand);font-size:12px;letter-spacing:.08em;line-height:1;color:var(--leaf-d)}
.cal button[aria-pressed="true"]{color:var(--ink)}
.pen{position:absolute;left:50%;top:50%;pointer-events:none;overflow:visible}
.cal .pen{width:40px;height:30px;transform:translate(-50%,-48%) rotate(-5deg)}
.pen path{fill:none;stroke:var(--tomato);stroke-width:1.5;stroke-linecap:round;stroke-dasharray:1 1.2;stroke-dashoffset:1.1;transition:stroke-dashoffset .75s var(--ease)}
.cal button[aria-pressed="true"] .pen path{stroke-dashoffset:0}
.season__note{margin-top:10px;font-size:12px;line-height:1.8;color:var(--mute)}
.season__hint{display:none}
html.js .season__hint{display:block;margin-top:2px;font-family:var(--ff-hand);font-size:12.5px;letter-spacing:.06em;color:var(--leaf-d)}
html.js .season__hint::before{content:"";display:inline-block;width:6px;height:6px;margin:0 8px 2px 1px;border-right:1px solid;border-bottom:1px solid;transform:rotate(45deg)}

/* ---------- 03 箱を選ぶ（機能） ---------- */
.pick{position:relative;margin-top:40px;background:var(--paper);border:1px solid var(--rule);box-shadow:0 1px 0 rgba(42,42,31,.04),0 26px 50px -34px rgba(42,42,31,.4)}
.pick__form{padding:28px 20px 26px}
.pick__q+.pick__q{margin-top:28px}
.pick__q legend{display:flex;flex-wrap:wrap;align-items:center;column-gap:10px;width:100%;margin-bottom:12px;font-family:var(--ff-hand);font-size:18px;letter-spacing:.06em;line-height:1.4}
.pick__q legend b{display:grid;place-items:center;width:26px;height:26px;border:1px solid var(--ink);border-radius:50%;font-family:var(--ff-num);font-weight:400;font-size:13px;line-height:1}
.pick__q legend small{flex-basis:100%;margin-top:4px;padding-left:36px;font-family:var(--ff-go);font-size:12px;letter-spacing:.04em;color:var(--mute)}
.seg{display:grid;gap:8px}
.seg--3{grid-template-columns:repeat(3,1fr)}
.seg--2{grid-template-columns:repeat(2,1fr)}
.seg label,.chips label{position:relative;display:block;cursor:pointer}
.seg input,.chips input{position:absolute;left:0;top:0;width:1px;height:1px;margin:0;opacity:0;pointer-events:none}
.seg span{position:relative;display:grid;place-items:center;min-height:52px;padding:0 4px;border:1px solid var(--rule2);background:var(--bg);font-size:15px;font-weight:500;letter-spacing:.06em;line-height:1.3;white-space:nowrap;transition:border-color .3s,background-color .3s}
.seg .pen{width:84px;height:40px;transform:translate(-50%,-50%) rotate(-3deg)}
.seg input:checked+span{border-color:var(--ink);background:#FFFDF6}
.seg input:checked+span .pen path{stroke-dashoffset:0}
.seg input:focus-visible+span,.chips input:focus-visible+span{outline:2px solid var(--leaf);outline-offset:2px}
.chips{display:flex;flex-wrap:wrap;gap:8px}
.chips span{position:relative;display:inline-flex;align-items:center;min-height:44px;padding:0 16px;border:1px solid var(--rule2);border-radius:999px;background:var(--bg);font-size:14px;letter-spacing:.06em;transition:color .3s,border-color .3s,background-color .3s}
.chips span::after{content:"";position:absolute;left:10px;right:10px;top:50%;height:1.5px;background:var(--soil);transform:scaleX(0) rotate(-7deg);transform-origin:left center;transition:transform .45s var(--ease-out)}
.chips input:checked+span{color:var(--mute);border-color:var(--soil);background:var(--face)}
.chips input:checked+span::after{transform:scaleX(1) rotate(-7deg)}
.pick__tip{display:flex;align-items:flex-start;gap:10px;margin-top:30px;padding-top:20px;border-top:1px dashed var(--rule2);font-family:var(--ff-hand);font-size:15px;line-height:1.8;letter-spacing:.05em;color:var(--leaf-d)}
.pick__tip .sprout{flex:none;width:20px;height:25px;margin-top:2px}
.pick__out{padding:30px 20px 26px;border-top:1px dashed var(--rule2)}
.crate{position:relative;width:var(--cw,82%);margin-inline:auto;transition:width .9s var(--ease-out)}
.crate[data-size="0"]{--cw:66%}
.crate[data-size="1"]{--cw:84%}
.crate[data-size="2"]{--cw:100%}
.crate__veg{position:relative;z-index:1;display:flex;justify-content:center;align-items:flex-end;height:74px;padding-inline:3%}
.cv{flex:none;width:60px;height:60px;margin-inline:-5px;overflow:visible;--sw:2.5}
.crate__front{position:relative;z-index:2;height:58px;margin-top:-24px;border:1.5px solid var(--ink);background-color:var(--bg);background-image:linear-gradient(var(--ink),var(--ink)),linear-gradient(var(--ink),var(--ink));background-size:100% 1px;background-position:0 33%,0 67%;background-repeat:no-repeat}
.crate__front::before,.crate__front::after{content:"";position:absolute;top:0;bottom:0;width:1px;background:var(--ink)}
.crate__front::before{left:9px}
.crate__front::after{right:9px}
.crate__tag{position:absolute;right:-8px;bottom:-15px;padding:3px 12px 4px;background:var(--paper);border:1px solid var(--soil);font-family:var(--ff-hand);font-size:14px;line-height:1.5;letter-spacing:.08em;transform:rotate(-4deg);white-space:nowrap}
html.js .cv svg{transform:translateY(56%);transition:transform 1.1s cubic-bezier(.2,.75,.25,1) calc(var(--i,0) * .08s)}
html.js .cv path{stroke-dasharray:1 1.2;stroke-dashoffset:1.1;transition:stroke-dashoffset 1.5s var(--ease) calc(var(--i,0) * .08s + .1s)}
html.js .crate.is-grow .cv svg{transform:none}
html.js .crate.is-grow .cv path{stroke-dashoffset:0}
.sum{display:grid;grid-template-columns:1fr 1fr;margin-top:40px;border-top:1px solid var(--ink)}
.sum div{padding:12px 0 14px;border-bottom:1px solid var(--rule)}
.sum div:nth-child(odd){padding-right:12px;border-right:1px solid var(--rule)}
.sum div:nth-child(even){padding-left:16px}
.sum dt{font-size:12px;letter-spacing:.1em;line-height:1.6;color:var(--mute)}
.sum dd{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 6px;margin-top:4px;line-height:1.15}
.sum__big{font-family:var(--ff-hand);font-size:30px}
.sum__yen{font-family:var(--ff-num);font-weight:400;font-size:31px;letter-spacing:.01em;font-variant-numeric:tabular-nums}
.sum dd small{font-size:12.5px;color:var(--txt)}
.sum dd em{flex-basis:100%;margin-top:4px;font-style:normal;font-size:12px;letter-spacing:.04em;color:var(--mute)}
.inbox{margin-top:24px}
.inbox__ttl{font-family:var(--ff-hand);font-size:15px;letter-spacing:.06em;color:var(--leaf-d)}
.inbox__list{margin-top:6px;font-family:var(--ff-hand);font-size:16.5px;line-height:1.85;letter-spacing:.04em}
.inbox__no{margin-top:6px;font-size:12.5px;line-height:1.8;color:var(--soil)}
.msg{margin-top:28px;padding:20px 18px 18px;background:var(--face)}
.msg__lbl{font-size:12px;letter-spacing:.12em;line-height:1.6;color:var(--mute)}
.msg__bb{position:relative;max-width:94%;margin:10px 0 0 auto;padding:12px 16px;border-radius:16px 16px 4px 16px;background:var(--leaf);color:var(--paper);font-size:14px;line-height:1.85;letter-spacing:.04em}
.msg .note{margin-top:10px}
.pick__note{margin-top:20px}
.btn{position:relative;display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:18px;min-height:58px;padding:12px 22px;overflow:hidden;background:var(--ink);color:var(--bg);font-family:var(--ff-hand);font-size:17px;letter-spacing:.08em;line-height:1.4;transition:color .4s}
.btn::before{content:"";position:absolute;inset:0;background:var(--leaf);transform:scaleY(0);transform-origin:bottom;transition:transform .6s var(--ease-out)}
.btn span,.btn i{position:relative}
.btn:hover::before{transform:scaleY(1)}
.btn:hover i{width:44px}
.btn--inv{background:var(--bg);color:var(--ink)}
.btn--inv:hover{color:var(--paper)}

/* ---------- 04 届くまで ---------- */
.flow__ph{margin-inline:calc(var(--gutter) * -1)}
.flow__ph figcaption{padding-inline:var(--gutter)}
.flow__txt{margin-top:56px}
.tl{position:relative;margin-top:40px;--p:1}
.tl::before,.tl::after{content:"";position:absolute;left:78px;top:12px;bottom:40px;width:1px;background:var(--rule2)}
.tl::after{width:1.5px;margin-left:-.25px;background:var(--soil);transform-origin:top;transform:scaleY(var(--p))}
.tl li{position:relative;display:grid;grid-template-columns:62px 1fr;column-gap:32px;padding-bottom:32px}
.tl li:last-child{padding-bottom:0}
.tl li::before{content:"";position:absolute;z-index:1;left:72.5px;top:8px;width:12px;height:12px;border:1.5px solid var(--soil);border-radius:50%;background:var(--bg);transition:background-color .5s,border-color .5s}
.tl li.is-on::before{background:var(--leaf);border-color:var(--leaf)}
.tl time{font-family:var(--ff-num);font-weight:300;font-size:20px;line-height:1.3;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.tl h3{font-family:var(--ff-hand);font-size:20px;line-height:1.35;letter-spacing:.06em}
.tl p{margin-top:6px;font-size:16px;line-height:1.85;color:var(--txt)}

/* ---------- 05 食べ方の紙 ---------- */
.sheet{background:var(--face)}
.paper{position:relative;max-width:430px;margin:58px auto 0}
.paper__in{position:relative;padding:30px 22px 30px 24px;background-color:#FCFAF1;background-image:repeating-linear-gradient(to bottom,transparent 0 29px,rgba(79,122,40,.17) 29px 30px);background-origin:content-box;background-position:0 0;transform:rotate(-1.3deg);box-shadow:0 1px 1px rgba(42,42,31,.06),0 30px 50px -30px rgba(42,42,31,.45)}
.paper__in::before{content:"";position:absolute;left:50%;top:-13px;width:104px;height:26px;transform:translateX(-50%) rotate(3deg);background:rgba(190,172,122,.5);clip-path:polygon(2% 10%,98% 0,100% 90%,0 100%)}
.paper__in>*{font-family:var(--ff-hand);line-height:30px;letter-spacing:.04em}
.paper__hd{display:flex;align-items:baseline;justify-content:space-between;gap:10px}
.paper__hd span{font-size:22px;letter-spacing:.1em}
.paper__hd small{font-size:12px;color:var(--mute)}
.paper__list{font-size:15px}
.paper__sub{margin-top:30px;font-size:13px;color:var(--leaf-d)}
.paper__how li{display:grid;grid-template-columns:52px 1fr;column-gap:12px}
.paper__pic{width:52px;height:60px;--sw:2.8}
.paper__how h3{font-size:17px;line-height:30px}
.paper__how p{font-size:16px;line-height:30px}
.paper__keep{margin-top:30px;font-size:14px}
.paper__keep>span{display:grid;grid-template-columns:5.4em 1fr}
.paper__keep b{font-weight:400;color:var(--leaf-d)}
.nw{white-space:nowrap}
.paper__sign{font-size:18px;text-align:right}
.paper__note{margin-top:20px;font-size:12px;line-height:1.8;color:var(--mute);text-align:center}
html.js .paper[data-r="paper"]{opacity:0;transform:translateY(46px) rotate(-5deg);transition:opacity 1s var(--ease),transform 1.7s var(--ease-out)}
html.js .paper[data-r="paper"].is-in{opacity:1;transform:none}

/* ---------- 06 畑の人から ---------- */
.farmer__ph{margin-inline:calc(var(--gutter) * -1)}
.farmer__ph figcaption{padding-inline:var(--gutter)}
.farmer__txt{margin-top:56px}
.letter{margin-top:26px}
.letter p{font-size:16px;line-height:2.05;text-wrap:pretty}
.letter p+p{margin-top:1.2em}
.sign{display:flex;align-items:baseline;justify-content:flex-end;flex-wrap:wrap;gap:4px 14px;margin-top:32px;line-height:1.6}
.sign small{font-size:12px;letter-spacing:.12em;color:var(--txt)}
.sign span{font-family:var(--ff-hand);font-size:26px;letter-spacing:.14em}

/* ---------- 07 直売所 ---------- */
.shop__ph{margin-top:36px}
.shop__in{margin-top:44px}
.info{border-top:1px solid var(--rule2)}
.info div{display:grid;grid-template-columns:6.4em 1fr;gap:12px;padding:15px 0;border-bottom:1px solid var(--rule)}
.info dt{font-family:var(--ff-hand);font-size:15px;line-height:1.9;letter-spacing:.06em;color:var(--leaf-d)}
.info dd{font-size:16px;line-height:1.85;text-wrap:pretty}
.map{margin-top:40px;padding:16px 14px 14px;background:var(--paper);border:1px solid var(--rule)}
.map__svg{width:100%;height:auto}
.map__road{stroke:var(--ink);stroke-width:1.1;opacity:.75;stroke-linecap:round}
.map__field,.map__fieldb{stroke:var(--leaf);stroke-width:1;opacity:.5;stroke-linecap:round}
.map__hut{stroke:var(--soil);stroke-width:1.4;stroke-linejoin:round;stroke-linecap:round}
.map__tree{stroke:var(--leaf);stroke-width:1.2;stroke-linecap:round;stroke-linejoin:round}
.map__way{stroke:var(--tomato);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.map__bus{fill:var(--paper);stroke:var(--ink);stroke-width:1.3}
.map__goal{fill:var(--tomato)}
.map__n{stroke:var(--ink);stroke-width:1;stroke-linecap:round}
.map text{font-family:var(--ff-hand);font-size:clamp(13.4px,calc(34.4px - 5.43vw),17px);letter-spacing:.04em;fill:var(--ink)}
.map__note{margin-top:8px;font-size:12px;line-height:1.8;color:var(--mute)}
html.js .map .map__way{stroke-dasharray:1 1.2;stroke-dashoffset:1.1;transition:stroke-dashoffset 2.4s var(--ease) .5s}
html.js .map.is-in .map__way{stroke-dashoffset:0}

/* ---------- 08 よくある質問 ---------- */
.faq__list{margin-top:34px;border-bottom:1px solid var(--rule2)}
.faq details{border-top:1px solid var(--rule2)}
.faq summary{display:grid;grid-template-columns:auto 1fr 18px;align-items:center;gap:14px;min-height:64px;padding:15px 0;cursor:pointer;list-style:none;font-size:16px;font-weight:500;line-height:1.7;letter-spacing:.04em}
.faq summary::-webkit-details-marker{display:none}
.faq summary::before{content:"問";font-family:var(--ff-hand);font-weight:400;font-size:17px;line-height:1;color:var(--leaf)}
.faq summary span{text-wrap:pretty}
.faq summary i{position:relative;width:18px;height:18px}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;left:1px;right:1px;top:50%;height:1.2px;background:var(--ink);transition:transform .6s var(--ease-out)}
.faq summary i::after{transform:rotate(90deg)}
.faq details[open] summary i::after{transform:rotate(0deg)}
.faq details>div{padding:0 32px 24px 31px}
.faq details>div p{font-size:16px;line-height:1.9;color:var(--txt)}
.faq details[open]>div{animation:faqIn .8s var(--ease-out)}
@keyframes faqIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}

/* ---------- 09 箱を試す ---------- */
.try{background:var(--ink);color:var(--bg)}
.try .lbl__n{color:#C7B08A}
.try .lbl__t{color:var(--leaf-l)}
.try .sprout path{stroke:var(--bg)}
.try .sprout .sp-soil{stroke:#C7B08A}
.try .sprout .sp-l,.try .sprout .sp-r{stroke:var(--leaf-l)}
.try .body{color:rgba(244,240,225,.78)}
.steps{margin-top:34px;border-top:1px solid rgba(244,240,225,.2)}
.steps li{display:grid;grid-template-columns:34px 1fr;gap:14px;padding:18px 0 17px;border-bottom:1px solid rgba(244,240,225,.2)}
.steps b{font-family:var(--ff-num);font-weight:200;font-size:30px;line-height:1}
.steps h3{font-family:var(--ff-hand);font-size:18.5px;line-height:1.5;letter-spacing:.05em}
.steps p{margin-top:4px;font-size:16px;line-height:1.85;color:rgba(244,240,225,.72)}
.try .btn{margin-top:34px}
.try__note{margin-top:14px;font-size:12px;line-height:1.95;color:rgba(244,240,225,.62)}
.try__vis{margin-top:64px}
.crate--inv .cv{width:60px;height:60px;--sw:2.5}
.crate--inv .crate__veg{height:76px}
.crate--inv .crate__front{height:64px;margin-top:-28px;border-color:var(--bg);background-color:var(--ink);background-image:linear-gradient(var(--bg),var(--bg)),linear-gradient(var(--bg),var(--bg))}
.crate--inv .crate__front::before,.crate--inv .crate__front::after{background:var(--bg)}
.crate--inv .crate__tag{background:var(--bg);color:var(--ink);border-color:var(--bg)}
.crate--inv .veg path{stroke:var(--bg)}
.crate--inv .veg .g{stroke:var(--leaf-l)}
.crate--inv .veg .t{stroke:#E5735B}

/* ---------- 下の帯 ---------- */
.ft{position:relative;overflow:hidden;background:var(--face)}
.ft__in{max-width:1240px;margin-inline:auto;padding:64px var(--gutter) 0}
.ft__cols{display:grid;gap:30px}
.ft__addr{font-size:12.5px;line-height:2.05;color:var(--txt)}
.ft__addr b{font-family:var(--ff-hand);font-weight:400;font-size:20px;letter-spacing:.14em;color:var(--ink)}
.ft__nav{display:grid;grid-template-columns:1fr 1fr;gap:0 20px;font-family:var(--ff-hand);font-size:15.5px;letter-spacing:.06em}
.ft__nav a{display:inline-flex;align-items:center;min-height:44px}
.ft__logo{margin:34px 0 .16em;font-family:var(--ff-hand);font-size:clamp(50px,14.4vw,220px);line-height:1;letter-spacing:.06em;white-space:nowrap;text-align:center;color:rgba(107,74,47,.14)}
.sample{position:relative;padding:22px var(--gutter) calc(98px + env(safe-area-inset-bottom,0px));background:var(--paper);border-top:1px solid var(--rule);font-size:12.5px;line-height:1.9;color:var(--txt)}
.sample__lnk{margin-top:6px}
.sample__lnk a{display:inline-flex;align-items:center;min-height:44px;text-decoration:underline;text-underline-offset:4px;text-decoration-color:var(--leaf)}

/* 荷札（箱を試す）と、見本のしるし */
.tag{position:fixed;z-index:30;right:12px;bottom:calc(12px + env(safe-area-inset-bottom,0px));display:block;width:64px;opacity:0;transform:translateY(24px) rotate(5deg);transform-origin:50% 0;pointer-events:none;transition:opacity .6s var(--ease),transform 1s var(--ease-out);filter:drop-shadow(0 10px 14px rgba(42,42,31,.18))}
.tag.is-on{opacity:1;transform:rotate(5deg);pointer-events:auto}
.tag__str{width:14px;height:21px;margin:0 auto -3px}
.tag__str path{stroke:var(--soil);stroke-width:1.2;stroke-linecap:round}
.tag__in{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;width:64px;height:92px;padding-bottom:13px;background:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 64 92'><path d='M15 .7 H49 L63.3 15 V91.3 H.7 V15 Z' fill='%23FAF7EC' stroke='%236B4A2F' stroke-width='1.2'/><circle cx='32' cy='12.5' r='3.6' fill='%23E9E3CF' stroke='%236B4A2F' stroke-width='1.1'/></svg>") center/100% 100% no-repeat}
.tag__in>span{font-family:var(--ff-hand);font-size:16px;line-height:1.4;letter-spacing:.08em;padding-left:.08em;text-align:center}
.tag__in small{font-family:var(--ff-hand);font-size:12px;line-height:1;letter-spacing:.04em;padding-left:.04em;color:var(--leaf-d)}
.tag__in i{display:block;width:24px;height:1px;margin:6px 0 7px;background:var(--leaf)}
.pill{position:fixed;z-index:30;left:12px;bottom:calc(14px + env(safe-area-inset-bottom,0px));display:flex;align-items:center;gap:10px;padding:5px 14px 5px 12px;border:1px solid var(--rule2);border-radius:999px;background:rgba(250,247,236,.92);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);font-size:12px;letter-spacing:.04em;line-height:1.7}
.pill span{font-family:var(--ff-hand);font-size:12px;color:var(--leaf-d)}
.pill a{display:inline-flex;align-items:center;min-height:44px;margin-block:-11px;text-decoration:underline;text-underline-offset:3px;text-decoration-color:var(--leaf)}
html.is-menu .tag,html.is-menu .pill{opacity:0;pointer-events:none}

/* ---------- 止めた姿（確かめ用） ---------- */
html.static *,html.static *::before,html.static *::after{transition:none!important}
html.static .tag{opacity:1;transform:rotate(5deg)}

/* ================= 背の低い携帯 ================= */
@media (max-width:899px) and (max-height:720px){
  .season{--vs:72px}
  html.js .season__in{padding:70px var(--gutter) 58px}
  .season__mon b{font-size:60px}
  .fv__name{margin-top:10px;font-size:14px}
  .season__say{font-size:15px;line-height:1.7}
}

/* ================= 広い画面 ================= */
@media (min-width:900px){
  html{scroll-padding-top:86px}
  body{font-size:15.5px}
  .sec{padding-block:clamp(140px,12vw,210px)}
  .lbl{margin-bottom:24px}
  .lbl .sprout{width:26px;height:33px}
  .lbl__t{font-size:17px}
  .h2{font-size:clamp(34px,3vw,44px)}
  .faq__head .h2{font-size:clamp(32px,2.6vw,38px)}
  .body{margin-top:28px;max-width:34em}

  .hd{height:84px}
  .hd__mark{width:22px;height:28px}
  .hd__ja{font-size:21px}
  .hd__btn{display:none}
  .hd__nav{display:flex;gap:clamp(18px,2.1vw,34px);margin-left:auto;margin-right:clamp(22px,2.6vw,40px);font-family:var(--ff-hand);font-size:16px;letter-spacing:.08em}
  .hd__nav a{position:relative;padding:8px 0}
  .hd__nav a::after{content:"";position:absolute;left:0;right:0;bottom:3px;height:1px;background:var(--soil);transform:scaleX(0);transform-origin:right;transition:transform .6s var(--ease-out)}
  .hd__nav a:hover::after{transform:scaleX(1);transform-origin:left}
  .hd__cta{display:inline-flex;align-items:center;min-height:46px;padding:0 22px;background:var(--ink);color:var(--bg);font-family:var(--ff-hand);font-size:16px;letter-spacing:.08em;transition:background-color .4s}
  .hd__cta:hover{background:var(--leaf)}

  .hero{height:100vh;height:100svh;min-height:640px;max-height:1100px;padding-top:0;overflow:hidden}
  .hero::before{content:"";position:absolute;z-index:1;left:0;right:0;top:0;height:66%;background:linear-gradient(to bottom,rgba(244,240,225,.8) 0%,rgba(244,240,225,.5) 46%,rgba(244,240,225,0) 100%);pointer-events:none}
  .hero__media{position:absolute;inset:0}
  .hero__ph{height:100%;aspect-ratio:auto}
  .hero__ph img{top:-5%;height:110%;object-position:50% 12%}
  .hero__txt{position:absolute;left:8vw;right:8vw;top:clamp(116px,15vh,170px);display:grid;grid-template-columns:auto 1fr;column-gap:56px;align-items:end;padding:0}
  .hero__kicker{grid-column:1/-1;font-size:16.5px}
  .hero__kicker .sprout{width:22px;height:28px}
  .hero__ttl{margin-top:16px;font-size:clamp(54px,5.4vw,86px);line-height:1.32}
  .hero__aside{justify-self:end;max-width:22em;margin:0 0 .9em}
  .hero__sub{font-size:15.5px;color:var(--ink)}
  .hero__place{position:absolute;z-index:2;left:8vw;bottom:88px;gap:22px;padding:5px 16px 6px;background:rgba(244,240,225,.92);color:var(--txt)}
  html.js .hero__ph{clip-path:none}

  .about__head{display:grid;grid-template-columns:1fr 1fr;column-gap:8%;align-items:end}
  .about__head .lbl{grid-column:1/-1}
  .about__head .body{margin:0 0 .5em}
  .nums{display:grid;grid-template-columns:repeat(3,1fr);margin-top:96px;border-top:0}
  .nums li{display:block;padding:4px 48px 6px;border:0;border-left:1px solid var(--rule2)}
  .nums li:first-child{padding-left:0;border-left:0}
  .nums__ic{width:76px;height:48px;margin-bottom:26px}
  .nums__v b{font-size:108px}
  .nums__v span{font-size:26px}
  .nums__t{margin-top:18px;font-size:14.5px}
  .une{height:40px}

  .season{--step:50vh;--vs:146px}
  .season__in{display:grid;grid-template-columns:minmax(0,40fr) minmax(0,60fr);grid-template-rows:auto auto 1fr;column-gap:7%;row-gap:0}
  html.js .season__in{display:grid;align-content:center;padding:112px var(--gutter) 64px}
  .season__top{grid-column:1;grid-row:1;flex-direction:column;align-items:flex-start;gap:0}
  .season__mon{margin-top:34px;text-align:left}
  .season__mon b{font-size:clamp(140px,13vw,196px)}
  .season__ji{font-size:40px;margin-left:8px}
  .season__mon em{margin-top:16px;font-size:12px}
  .season__say{grid-column:1;grid-row:2;margin-top:26px;font-size:18px;line-height:1.85;max-width:20em}
  .field{grid-column:2;grid-row:1/4;align-self:center}
  .field__list{row-gap:34px}
  .fv__name{margin-top:18px;font-size:17px}
  .fv__pic{--sw:1.08}
  .pick__form{display:flex;flex-direction:column}
  .pick__tip{margin-top:auto}
  .season__foot{grid-column:1;grid-row:3;align-self:end;margin-top:34px}
  .cal button{height:46px}

  .box__head{display:grid;grid-template-columns:1fr 1fr;column-gap:8%;align-items:end}
  .box__head .lbl{grid-column:1/-1}
  .box__head .body{margin:0 0 .5em}
  .pick{display:grid;grid-template-columns:44fr 56fr;margin-top:72px}
  .pick__form{padding:50px 46px 46px;border-right:1px dashed var(--rule2)}
  .pick__out{padding:50px 50px 42px;border-top:0}
  .crate__veg{height:94px}
  .cv{width:76px;height:76px;--sw:2}
  .crate__front{height:70px;margin-top:-30px}
  .sum__yen{font-size:36px}

  .flow__in{display:grid;grid-template-columns:1fr 1fr;column-gap:8%;align-items:start}
  .flow__ph{position:sticky;top:120px;margin-inline:0}
  .flow__ph .ph__z{aspect-ratio:4/5}
  .flow__ph img{object-position:36% 50%}
  .flow__ph figcaption{padding-inline:0}
  .flow__txt{margin-top:0;padding-top:4%}
  .tl{margin-top:56px}
  .tl li{padding-bottom:44px}
  .tl time{font-size:22px}
  .tl h3{font-size:22px}
  .tl p{font-size:14.5px}

  .sheet__in{display:grid;grid-template-columns:44fr 56fr;column-gap:8%;align-items:center}
  .paper{max-width:470px;margin:0 0 0 auto}
  .paper__in{padding:30px 34px 30px}

  .farmer__in{display:grid;grid-template-columns:48fr 52fr;column-gap:8%;align-items:center}
  .farmer__ph{order:2;margin-inline:0}
  .farmer__ph .ph__z{aspect-ratio:4/5}
  .farmer__ph img{object-position:30% 50%}
  .farmer__ph figcaption{padding-inline:0}
  .farmer__txt{margin-top:0}
  .letter{margin-top:36px}
  .letter p{font-size:15.5px;line-height:2.25}

  .shop{padding-top:0}
  .shop__band{position:relative}
  .shop__head{position:absolute;z-index:2;left:0;right:0;top:clamp(64px,7vw,110px)}
  .shop__ph{margin-top:0}
  .shop__ph .ph__z{aspect-ratio:auto;height:min(82vh,780px)}
  .shop__ph img{object-position:50% 0%}
  .shop__in{display:grid;grid-template-columns:45fr 55fr;column-gap:8%;align-items:start;margin-top:96px}
  .map{margin-top:0;padding:22px 22px 16px}
  .info div{padding:18px 0}
  .info dd{font-size:14.5px}

  .faq__in{display:grid;grid-template-columns:36fr 64fr;column-gap:8%;align-items:start}
  .faq__head{position:sticky;top:130px}
  .faq__list{margin-top:8px}
  .faq summary{min-height:76px;font-size:16px}
  .faq details>div{padding:0 60px 30px 31px}
  .faq details>div p{font-size:14.5px}

  .try__in{display:grid;grid-template-columns:52fr 48fr;column-gap:8%;align-items:center}
  .try .btn{max-width:440px}
  .try__vis{margin-top:0}
  .crate--inv .cv{width:96px;height:96px;--sw:1.6}
  .crate--inv .crate__veg{height:118px}
  .crate--inv .crate__front{height:92px;margin-top:-40px}

  .ft__in{padding-top:96px}
  .ft__cols{grid-template-columns:1.4fr 1fr;gap:60px;align-items:start}
  .ft__nav{grid-template-columns:repeat(4,auto);justify-content:start;gap:0 34px}
  .ft__logo{margin-top:64px}
  .sample{display:flex;align-items:center;justify-content:space-between;gap:40px;padding:14px var(--gutter) 14px 240px}
  .sample br{display:none}
  .sample__lnk{margin-top:0;flex:none}
  .tag{right:30px;bottom:28px;width:76px}
  .tag__in{width:76px;height:108px;padding-bottom:16px}
  .tag__in>span{font-size:18px}
  .tag__in small{font-size:12px}
  .pill{left:24px;bottom:24px}
}