:root{--bg:#f4ead6;--paper:#faf5e8;--ink:#241a15;--mute:#52443a;--shu:#b0301c;--shu2:#8f2514;--matcha:#56652b;--line:rgba(36,26,21,.22);--gut:clamp(16px,4vw,64px);
--f:"Shippori Mincho","Hiragino Mincho ProN","Yu Mincho",serif;--d:"Zen Antique","Shippori Mincho","Hiragino Mincho ProN",serif;--band:46px;--sam:26px}
body[data-season=spring]{--bg:#f6e9e2}
body[data-season=summer]{--bg:#eceedb}
body[data-season=autumn]{--bg:#f4ead6}
body[data-season=winter]{--bg:#e9e8e1}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:40px}
body{margin:0;background:var(--bg);color:var(--ink);font:500 16px/1.95 var(--f);letter-spacing:.04em;padding-top:var(--sam);padding-bottom:var(--band);transition:background-color 1.4s ease;overflow-x:hidden;-webkit-text-size-adjust:100%}
h1,h2,h3,p,ol,ul,dl,dd,dt,figure,fieldset,legend{margin:0;padding:0}
ol,ul{list-style:none}a{color:inherit}img{display:block;max-width:100%;height:auto}
button,input,select,textarea{font:inherit;color:inherit;letter-spacing:inherit}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
:focus-visible{outline:2px solid var(--shu2);outline-offset:3px}
.skip{position:absolute;left:8px;top:-60px;z-index:100;background:var(--paper);padding:8px 14px}.skip:focus{top:calc(var(--sam) + 6px)}

/* サンプル帯 */
.sample{position:fixed;top:0;left:0;right:0;z-index:60;height:var(--sam);display:flex;align-items:center;justify-content:space-between;gap:14px;padding:0 var(--gut);background:var(--ink);color:#f6efe0;font:500 12.5px/1 var(--f);letter-spacing:.06em}
.sample span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sample a{white-space:nowrap;text-decoration:underline;text-underline-offset:3px;padding:6px 0}

/* 屋号と印 */
.top{position:absolute;left:0;right:0;top:var(--sam);z-index:20;height:0}
.ya{position:absolute;left:var(--gut);top:16px;display:flex;flex-direction:column;text-decoration:none;color:var(--ink);background:rgba(250,245,232,.9);padding:8px 14px 8px}
.ya-m{font:400 22px/1.2 var(--d);letter-spacing:.2em}.ya-s{font:500 12px/1.4 var(--f);letter-spacing:.24em;color:var(--mute)}
.stamp{position:fixed;right:14px;top:calc(var(--sam) + 12px);z-index:70;width:56px;height:56px;border:0;background:var(--shu);color:#fff7ea;cursor:pointer;display:grid;place-items:center;box-shadow:0 0 0 3px var(--shu),inset 0 0 0 3px var(--shu),inset 0 0 0 4.5px rgba(255,247,234,.8);transform:rotate(-3deg);transition:transform .3s}
.stamp:hover{transform:rotate(0) scale(1.05)}.stamp span{writing-mode:vertical-rl;font:400 17px/1 var(--d);letter-spacing:.2em}
.stamp:focus-visible{outline-color:var(--ink);outline-offset:5px}
.menu-open .stamp{background:#fff7ea;color:var(--shu2);box-shadow:0 0 0 3px #fff7ea}

/* 全面メニュー */
.menu{position:fixed;inset:0;z-index:65;background:var(--ink);color:#f6efe0;padding:calc(var(--sam) + 90px) var(--gut) 90px;flex-direction:column;justify-content:space-between;opacity:0;transition:opacity .4s}
.menu:not([hidden]){display:flex}.menu.in{opacity:1}
.menu ol{display:flex;direction:rtl;gap:clamp(14px,3vw,48px);height:min(60vh,520px);justify-content:flex-start;overflow-x:auto}
.menu li{direction:ltr}
.menu a{display:block;writing-mode:vertical-rl;text-decoration:none;font:400 clamp(21px,2.8vw,38px)/1.3 var(--d);letter-spacing:.16em;height:100%;padding:0 6px;border-right:1px solid rgba(246,239,224,.3)}
.menu a b{display:block;color:#f2a08f;font-size:.55em;margin-bottom:.6em;letter-spacing:0}
.menu a small{display:inline-block;font:500 13px/1.4 var(--f);color:#d8cbb4;letter-spacing:.14em;margin-top:1.6em;margin-right:12px}
.menu a:hover,.menu a:focus-visible{color:#fff;background:rgba(246,239,224,.1)}
.menu a:focus-visible{outline-color:#f6efe0}
.menu-note{font-size:13px;color:#d8cbb4;letter-spacing:.1em}

/* 序 */
.hero{position:relative;height:calc(100svh - var(--sam) - var(--band));min-height:600px;max-height:980px;overflow:hidden;background:var(--paper)}
.hero>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:18% 42%}
.hero::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 52%,rgba(250,245,232,.55) 72%)}
.hero>*{z-index:2}.hero>img{z-index:0}
.tag{position:absolute;right:20px;top:92px;display:flex;flex-direction:column;align-items:center;gap:6px;background:var(--shu);color:#fff7ea;padding:12px 8px 14px;writing-mode:vertical-rl;font-size:14px;line-height:1}
.tag span{letter-spacing:.3em}.tag b{font:400 28px/1 var(--d);letter-spacing:.2em}
.hero h1{position:absolute;right:clamp(84px,8vw,140px);top:84px;writing-mode:vertical-rl;font:400 clamp(30px,3.7vw,58px)/1.6 var(--d);letter-spacing:.2em;display:flex;flex-direction:column}
.hero h1 span{display:block;opacity:0;animation:ink 1.4s ease forwards}.hero h1 span+span{animation-delay:.5s}
@keyframes ink{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:none}}
.vsub{position:absolute;right:calc(clamp(84px,8vw,140px) + clamp(30px,3.7vw,58px)*3.4 + 24px);top:84px;writing-mode:vertical-rl;font:500 clamp(15px,1.25vw,19px)/2.2 var(--f);letter-spacing:.22em;color:var(--ink);display:flex;flex-direction:column;opacity:0;animation:ink 1.2s ease 1.1s forwards}
.vsub span{display:block}
.plate{position:absolute;left:var(--gut);bottom:28px;width:min(360px,calc(100% - var(--gut)*2));background:rgba(250,245,232,.96);padding:16px 22px 14px;border-left:4px solid var(--shu);display:grid;gap:4px}
.plate-sk{display:flex;align-items:baseline;gap:14px}.plate-sk b{font:400 34px/1.2 var(--d);letter-spacing:.14em;color:var(--shu2)}.plate-sk span{font-size:14px;color:var(--mute)}
.plate-line{font-size:15px}.plate-open{font-size:14px;color:var(--mute)}.plate-open.is-open{color:var(--matcha);font-weight:700}
.plate-go{display:flex;gap:18px;flex-wrap:wrap;margin-top:6px}
.plate-go a{font-size:14px;letter-spacing:.12em;text-underline-offset:5px;padding:8px 0;min-height:36px}
.plate-go a:first-child{text-decoration:none;background:var(--shu);color:#fff7ea;padding:8px 18px}
.plate-go a:first-child:hover{background:var(--shu2)}

/* 共通セクション */
.sec{position:relative;padding:clamp(72px,9vw,128px) var(--gut) clamp(40px,5vw,72px)}
.sec-head{display:flex;flex-direction:row-reverse;justify-content:flex-start;align-items:flex-start;gap:clamp(20px,3vw,44px);margin-bottom:clamp(32px,5vw,64px)}
.vh{writing-mode:vertical-rl;font:400 clamp(30px,3.2vw,48px)/1.25 var(--d);letter-spacing:.12em;flex:none}
.sec-lead{max-width:26em;font-size:15.5px;line-height:2.05;color:var(--mute);padding-top:.6em}
.sec:not(#now){padding-right:calc(var(--gut) + clamp(72px,8vw,120px));min-height:460px}
.sec:not(#now) .vh{position:absolute;right:var(--gut);top:clamp(72px,9vw,128px)}
.sec:not(#now) .sec-head{margin-bottom:clamp(24px,3vw,40px);min-height:0}
.rv{opacity:0;transform:translateY(14px);transition:opacity .9s ease,transform .9s ease}.rv.in{opacity:1;transform:none}

/* 絵巻 */
#now{padding-inline:0;padding-bottom:clamp(60px,7vw,100px)}
#now{padding-top:clamp(56px,6vw,84px)}
#now .sec-head{padding-inline:var(--gut);flex-direction:row;align-items:flex-end;margin-bottom:24px}
#now .vh{writing-mode:horizontal-tb;font-size:clamp(34px,3.6vw,52px)}
#now .sec-lead{padding-top:0;flex:1}
.maki-ctl{margin-left:auto;display:flex;gap:10px;align-self:flex-end}
.maki-ctl button{width:48px;height:48px;border:1px solid var(--ink);background:transparent;cursor:pointer;display:grid;place-items:center;transition:background .25s,color .25s}
.maki-ctl button:hover{background:var(--ink);color:var(--paper)}.maki-ctl svg{width:24px;height:12px}
.maki{direction:rtl;overflow-x:auto;overflow-y:hidden;cursor:grab;scrollbar-width:none;overscroll-behavior-x:contain;border-block:2px solid var(--ink);background:var(--paper);position:relative;-webkit-mask-image:linear-gradient(90deg,transparent 0,#000 140px);mask-image:linear-gradient(90deg,transparent 0,#000 140px)}
.maki::-webkit-scrollbar{display:none}.maki{scroll-snap-type:x proximity}.maki.drag{cursor:grabbing;user-select:none;scroll-snap-type:none}
.ma{scroll-snap-align:start}
.ma-i{transition:opacity .5s}.ma.part:not(.intro):not(.outro) .ma-i{opacity:0}.maki.drag img{pointer-events:none}
.maki-track{display:flex;direction:rtl;width:max-content;padding-inline:var(--gut)}
.ma{direction:ltr;flex:none;width:clamp(300px,82vw,460px);padding:clamp(22px,2.4vw,34px) clamp(20px,2.6vw,40px);display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"ph t" "i i";column-gap:clamp(14px,2vw,28px);row-gap:20px;align-content:start;border-left:1px solid var(--line)}
.ma:first-child{border-left:1px solid var(--line)}
.ma-t{grid-area:t;display:flex;flex-direction:row;direction:rtl;gap:12px;align-items:flex-start}
.ma-t>*{direction:ltr}
.ma .v{writing-mode:vertical-rl;font:400 clamp(46px,4.8vw,70px)/1.25 var(--d);letter-spacing:.14em}
.mei{writing-mode:vertical-rl;font-size:14px;letter-spacing:.3em;color:var(--shu2);padding-top:.4em}
.ph{grid-area:ph;position:relative;overflow:hidden;background:var(--c,#d9ccb0)}
.ph img{max-width:none;height:auto}
.ph::after{content:"";position:absolute;inset:8px;border:1px solid rgba(250,245,232,.55);pointer-events:none}
.ma-i{grid-area:i}.ma-no{font-size:13px;color:var(--mute);letter-spacing:.14em}
.ma-d{font-size:15px;line-height:2;margin-top:6px}
.ma dl{margin-top:10px;font-size:13.5px;line-height:1.85;border-top:1px solid var(--line)}
.ma dl div{display:grid;grid-template-columns:6em 1fr;gap:8px;padding:5px 0;border-bottom:1px solid var(--line)}.ma dt{color:var(--mute)}
.ma-p{margin-top:10px;font-size:14px;color:var(--mute)}.ma-p b{font:400 34px/1 var(--d);color:var(--shu2);letter-spacing:.04em;margin-right:2px}
.ma.intro,.ma.outro{width:clamp(220px,22vw,320px);grid-template-columns:none;grid-template-areas:none;display:flex;flex-direction:row-reverse;gap:16px;justify-content:flex-start;align-items:stretch;min-height:480px}
.vi{writing-mode:vertical-rl;font:400 clamp(34px,3.6vw,54px)/1.4 var(--d);letter-spacing:.2em;color:var(--shu2)}
.vi2{writing-mode:vertical-rl;font-size:15px;line-height:2.1;letter-spacing:.18em;padding-top:.5em;max-height:420px}
.ma-note{writing-mode:vertical-rl;font-size:13px;line-height:2;color:var(--mute);padding-top:.5em;max-height:420px}
.maki-bar{height:3px;background:var(--line);margin:0 var(--gut);margin-top:14px}.maki-bar i{display:block;height:100%;width:0;background:var(--shu);transition:width .15s linear}

/* 詰め合わせ */
.builder{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,.9fr);gap:clamp(28px,4vw,64px);align-items:start}
.sizes{border:0;display:flex;gap:12px;margin-bottom:18px}.sizes legend{font-size:14px;color:var(--mute);margin-bottom:8px;padding:0}
.sizes label{flex:1;position:relative;cursor:pointer}.sizes input{position:absolute;opacity:0;inset:0;cursor:pointer}
.sizes span{display:block;border:1px solid var(--ink);padding:10px 12px;text-align:center;font-size:15px;transition:background .25s,color .25s;line-height:1.5}
.sizes b{font:400 36px/1 var(--d);margin-right:2px}.sizes small{display:block;font-size:12.5px;color:var(--mute);letter-spacing:.08em}
.sizes input:checked+span{background:var(--ink);color:var(--paper)}.sizes input:checked+span small{color:#d9cdb6}
.sizes input:focus-visible+span{outline:2px solid var(--shu2);outline-offset:3px}
.ledger{width:100%;border-collapse:collapse;font-size:14.5px}
.ledger caption{text-align:left;font-size:14px;color:var(--mute);padding-bottom:6px}
.ledger th,.ledger td{padding:9px 6px;border-bottom:1px solid var(--line);text-align:left;font-weight:500;vertical-align:middle}
.ledger thead th{font-size:12.5px;color:var(--mute);border-bottom:2px solid var(--ink)}
.ledger tbody th{white-space:nowrap}.ledger tbody th i{display:inline-block;width:14px;height:14px;border-radius:50%;margin-right:10px;vertical-align:-1px;border:1px solid rgba(36,26,21,.35)}
.ledger small{display:inline-block;margin-left:8px;font-size:12.5px;color:var(--shu2);border:1px solid var(--shu2);padding:0 5px;line-height:1.5}
.ledger tr.on th{font-weight:700}
.stp{white-space:nowrap}.stp button{width:40px;height:40px;border:1px solid var(--ink);background:transparent;cursor:pointer;font-size:19px;line-height:1}
.stp button:hover:not(:disabled){background:var(--ink);color:var(--paper)}.stp button:disabled{opacity:.3;cursor:default}
.stp output{display:inline-block;min-width:34px;text-align:center;font:400 22px/1 var(--d)}
.fill{margin-top:14px;display:flex;gap:18px}.fill button{background:none;border:0;border-bottom:1px solid var(--ink);padding:8px 0;cursor:pointer;font-size:14px}
.bld-right{position:sticky;top:calc(var(--sam) + 12px);background:var(--paper);padding:22px clamp(18px,2.2vw,30px) 26px;border-top:4px solid var(--shu)}
.boxfig svg{width:100%;max-width:340px;margin:0 auto;display:block}.boxfig figcaption{text-align:center;font-size:14px;color:var(--mute);margin-top:4px}
.recpt{margin-top:14px;font-size:14.5px}.recpt div{display:flex;justify-content:space-between;padding:6px 0;border-bottom:1px dotted var(--line)}.recpt dt{color:var(--mute)}
.recpt .sum{font-size:17px;border-bottom:2px solid var(--ink)}.recpt .sum dt{color:var(--ink)}.recpt .sum dd{font:400 26px/1.3 var(--d)}
.how{border:0;margin-top:14px;display:flex;gap:6px 22px;flex-wrap:wrap}.how legend{font-size:13px;color:var(--mute);padding:0;margin-bottom:2px}
.how label,.rad label{display:flex;align-items:center;gap:8px;font-size:14.5px;cursor:pointer;min-height:36px}.how input:disabled+span{opacity:.4}
.how input,.rad input{accent-color:var(--shu2);width:18px;height:18px}
.how-note{font-size:13px;line-height:1.8;color:var(--mute);margin-top:4px;min-height:3.6em}
.go{width:100%;margin-top:8px;border:0;background:var(--shu2);color:#fff7ea;padding:15px;font:500 15px/1.4 var(--f);letter-spacing:.14em;cursor:pointer}
.go[aria-disabled=true]{background:#8d8174;cursor:not-allowed}.go:not([aria-disabled=true]):hover{background:var(--shu)}
.gift-info{margin-top:clamp(48px,6vw,88px);display:grid;grid-template-columns:minmax(0,1fr) minmax(180px,.34fr);gap:clamp(20px,3vw,48px) clamp(24px,4vw,64px)}
.boxphoto{grid-column:2;grid-row:1/3;aspect-ratio:3/4;overflow:hidden;background:#d8c49a}.boxphoto img{width:100%;height:100%;object-fit:cover}
.flow h3,.cannot h3,.day h3{font:400 24px/1.4 var(--d);letter-spacing:.16em;margin-bottom:14px}
.flow ol{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));counter-reset:s;border-top:2px solid var(--ink)}
.flow li{counter-increment:s;padding:14px 14px 10px 0;font-size:14px;line-height:1.85;color:var(--mute)}
.flow li::before{content:counter(s);display:block;font:400 34px/1 var(--d);color:var(--shu2);margin-bottom:6px}
.flow li b{display:block;color:var(--ink);font-size:16px;margin-bottom:2px}
.flow-note{font-size:13px;color:var(--shu2);margin-top:8px}
.terms{display:grid;grid-template-columns:1fr 1fr;gap:0 32px;align-content:start;font-size:14px;line-height:1.85}
.terms div{padding:10px 0;border-top:1px solid var(--line)}.terms dt{font-weight:700}.terms dd{color:var(--mute)}

/* 日持ちする菓子 */
.cho{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:clamp(16px,2.4vw,32px)}
.cho li{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);gap:0 clamp(14px,2vw,26px);background:var(--paper);padding:22px 24px 22px 34px;overflow:hidden}
.cho li:last-child{grid-column:1/-1}
.cho-pat{position:absolute;left:0;top:0;bottom:0;width:14px;background:conic-gradient(var(--c) 25%,transparent 0 50%,var(--c) 0 75%,transparent 0) 0 0/14px 14px;opacity:.9;border-right:1px solid rgba(36,26,21,.25)}
.cho-v{writing-mode:vertical-rl;font:400 clamp(30px,2.8vw,40px)/1.3 var(--d);letter-spacing:.14em;align-self:start}
.cho-k{font-size:13px;color:var(--mute);letter-spacing:.08em}
.cho-d{font-size:15px;line-height:1.95;margin:4px 0 8px}
.cho dl{font-size:13.5px;line-height:1.8}.cho dl div{display:grid;grid-template-columns:6.2em 1fr;gap:6px;padding:2px 0}.cho dt{color:var(--mute)}
.cho-p{margin-top:8px;font-size:14px;color:var(--mute)}.cho-p b{font:400 32px/1 var(--d);color:var(--ink)}

/* 素材 */
.ingr{aspect-ratio:21/8;overflow:hidden;background:#d9ccb0;margin-bottom:clamp(32px,4vw,56px)}.ingr img{width:100%;height:100%;object-fit:cover}
.trio{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(20px,3vw,48px)}
.mat{display:block;padding:0}
.vh2{font:400 clamp(56px,6vw,88px)/1 var(--d);color:var(--shu2);letter-spacing:.04em;margin-bottom:10px;display:block}
.mat-lead{font:400 20px/1.7 var(--d);letter-spacing:.06em;margin-bottom:.6em}
.mat p{font-size:15px;line-height:2}
.day{margin-top:clamp(48px,6vw,88px)}
.day-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(24px,4vw,64px);align-items:end}
.clock{border-left:2px solid var(--ink);padding-left:0}
.clock li{display:grid;grid-template-columns:5.2em 1fr;gap:10px;padding:9px 0 9px 22px;position:relative;border-bottom:1px solid var(--line);align-items:baseline}
.clock li::before{content:"";position:absolute;top:19px;left:-7px;width:12px;height:12px;border-radius:50%;background:var(--shu2)}
.clock time{font:400 24px/1.3 var(--d);color:var(--shu2);letter-spacing:.04em}.clock span{font-size:14.5px;line-height:1.8}
.making-row{display:flex;flex-direction:column;gap:12px}.making-cap{font-size:15px;line-height:2;color:var(--mute);order:2}
.making-photo{margin:0;width:100%;aspect-ratio:16/8;overflow:hidden;background:#d9ccb0}.making-photo img{width:100%;height:100%;object-fit:cover}

/* 三代の店 */
.story-body{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(24px,4vw,64px);align-items:start}
.counter{aspect-ratio:4/3;overflow:hidden;background:#d9ccb0}.counter img{width:100%;height:100%;object-fit:cover}
.vtext{writing-mode:vertical-rl;height:clamp(380px,56vh,480px);font-size:20px;line-height:2.1;letter-spacing:.12em;color:var(--ink);display:block}
.vtext p{margin:0 0 0 1.6em}
.nenpyo{grid-column:1/-1;border-top:2px solid var(--ink);margin-top:clamp(12px,3vw,32px)}
.nenpyo li{display:grid;grid-template-columns:120px 1fr;gap:16px;align-items:baseline;padding:12px 0;border-bottom:1px solid var(--line);font-size:15px;line-height:1.9}
.nenpyo time{font:400 30px/1.2 var(--d);color:var(--shu2);letter-spacing:.08em}
.crew{grid-column:1/-1;font-size:15.5px}
.cannot{grid-column:1/-1;background:var(--paper);padding:20px clamp(18px,3vw,36px);border-left:4px solid var(--ink)}
.cannot ul{font-size:14.5px;line-height:1.95}.cannot li{padding-left:1.1em;position:relative}.cannot li::before{content:"—";position:absolute;left:0;color:var(--shu2)}

/* 店頭 */
.shop-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:clamp(28px,4vw,56px) clamp(20px,3vw,48px);align-items:start}
.cal-wrap{grid-column:1/7}.hours{grid-column:7/13}.tea{grid-column:1/5;aspect-ratio:4/5;overflow:hidden;background:#d9ccb0}.tea img{width:100%;height:100%;object-fit:cover}.access{grid-column:5/13}
.cal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:8px}.cal-head h3{font:400 24px/1.4 var(--d);letter-spacing:.14em}
.cal-head button{width:44px;height:44px;border:1px solid var(--ink);background:none;cursor:pointer;font-size:22px;line-height:1}.cal-head button:hover{background:var(--ink);color:var(--paper)}
.cal{width:100%;border-collapse:collapse;table-layout:fixed;font-size:14px}
.cal th{font-size:12.5px;padding:6px 0;border-bottom:2px solid var(--ink);color:var(--mute)}.cal th:first-child{color:var(--shu2)}
.cal td{height:56px;border:1px solid var(--line);padding:4px 5px;vertical-align:top;position:relative;line-height:1.3}
.cal td b{font:400 16px/1 var(--d)}.cal td span{display:block;font-size:12.5px;margin-top:3px;color:var(--shu2)}
.cal td.cl{background:rgba(36,26,21,.05)}.cal td.cl span{color:var(--shu2);display:inline-grid;place-items:center;width:22px;height:22px;border:1.5px solid var(--shu2);border-radius:50%;font-size:12.5px;line-height:1;margin-top:2px}
.cal td.today{outline:2px solid var(--shu2);outline-offset:-2px;background:rgba(176,48,28,.08)}
.legend{display:flex;gap:6px 18px;flex-wrap:wrap;font-size:12.5px;color:var(--mute);margin-top:10px}.legend i{display:inline-block;width:14px;height:14px;vertical-align:-2px;margin-right:6px;border:1px solid var(--line)}
.l-closed{border-radius:50%;border:1.5px solid var(--shu2)!important}.l-sk{border-color:var(--shu2)!important;background:rgba(176,48,28,.2)}
.hours{font-size:14.5px;line-height:1.9;border-top:2px solid var(--ink)}.hours div{display:grid;grid-template-columns:7.5em 1fr;gap:10px;padding:11px 0;border-bottom:1px solid var(--line)}.hours dt{color:var(--mute)}
.access svg{width:100%;height:auto;border:1px solid var(--ink)}
.mp-s{font:500 16px var(--f);fill:#3a2d26}.mp-m{font:700 22px var(--f);fill:#241a15}.mp-w{font:500 17px var(--f);fill:#fff7ea}
.addr{margin-top:12px;font-size:16px}.addr span{margin-left:10px;font-size:13px;color:var(--mute)}.access p:last-child{font-size:14.5px;color:var(--mute);margin-top:4px}

/* 予約 */
.form{display:grid;grid-template-columns:1fr 1fr;gap:20px clamp(24px,4vw,56px);max-width:960px}
.fld{border:0;min-width:0}.fld.wide{grid-column:1/-1}
.fld label:not(.rad label),.fld legend{display:block;font-size:14px;color:var(--mute);margin-bottom:4px;padding:0}
.rad label{display:flex;color:var(--ink)}.rad{display:flex;flex-direction:column}
.fld input:not([type=radio]),.fld select,.fld textarea{width:100%;border:0;border-bottom:1.5px solid var(--ink);background:rgba(250,245,232,.7);padding:12px 10px;font-size:16px;border-radius:0;min-height:48px}
.fld textarea{border:1.5px solid var(--ink);line-height:1.8}
.fld [aria-invalid=true]{border-color:var(--shu2);background:#fbe9e2}
.err{color:#8f2514;font-size:13.5px;min-height:1.2em;margin-top:4px}
.send{border:0;background:var(--shu2);color:#fff7ea;padding:16px 32px;font:500 16px/1.4 var(--f);letter-spacing:.14em;cursor:pointer}.send:hover{background:var(--shu)}
.sent{margin-top:14px;font-size:14.5px;color:var(--matcha);font-weight:700;max-width:40em}

/* 奥付 */
.okuzuke{background:var(--paper);border-top:14px solid transparent;border-image:conic-gradient(#241a15 25%,var(--paper) 0 50%,#241a15 0 75%,var(--paper) 0) 14/14px/0 round;padding:clamp(36px,5vw,64px) var(--gut) 44px;display:flex;flex-direction:row-reverse;justify-content:space-between;gap:clamp(24px,5vw,80px);align-items:flex-start}
.ok-r{display:flex;flex-direction:row;gap:clamp(18px,3vw,40px);align-items:flex-start;flex:none}
.ok-v{writing-mode:vertical-rl;font:400 clamp(26px,3vw,40px)/1.5 var(--d);letter-spacing:.3em;color:var(--ink);height:auto;display:flex;flex-direction:column}.ok-v span{display:block}
.ok-in{width:54px;height:54px;background:var(--shu);color:#fff7ea;display:grid;place-items:center;font:400 28px/1 var(--d);box-shadow:inset 0 0 0 3px var(--shu),inset 0 0 0 4.5px rgba(255,247,234,.8);transform:rotate(-3deg)}
.ok-t{font-size:14.5px;line-height:1.95;max-width:40em;flex:1}.ok-name{font:400 30px/1.3 var(--d);letter-spacing:.2em;margin-bottom:10px}
.ok-t dl div{display:grid;grid-template-columns:5em 1fr;gap:10px;padding:7px 0;border-bottom:1px solid var(--line)}.ok-t dt{color:var(--mute)}
.ok-sample{margin-top:16px;color:var(--mute)}.okuzuke a{text-underline-offset:4px;padding:6px 0;display:inline-block}
/* 暦の帯 */
.kcard{position:fixed;left:var(--gut);bottom:calc(var(--band) + 12px);z-index:55;width:min(420px,calc(100% - var(--gut)*2));background:var(--paper);border:1px solid var(--ink);border-left:4px solid var(--shu);padding:14px 18px;font-size:14px;line-height:1.8;box-shadow:0 12px 30px -16px rgba(36,26,21,.6)}
.kcard[hidden]{display:none}.kcard b{font:400 26px/1.3 var(--d);letter-spacing:.14em;margin-right:6px}.kcard span{color:var(--mute);font-size:13px}
.kcard button{background:none;border:0;border-bottom:1px solid var(--ink);cursor:pointer;padding:6px 0;font-size:13.5px}
.koyomi{position:fixed;left:0;right:0;bottom:0;z-index:58;height:var(--band);background:var(--ink);overflow-x:auto;scrollbar-width:none}.koyomi::-webkit-scrollbar{display:none}
.koyomi ol{display:flex;min-width:100%;height:100%}.koyomi li{flex:1 0 58px;border-top:3px solid var(--sc,#999)}
.koyomi li[data-s=spring]{--sc:#e6a5b5}.koyomi li[data-s=summer]{--sc:#9fb867}.koyomi li[data-s=autumn]{--sc:#e0a043}.koyomi li[data-s=winter]{--sc:#9db2c4}
.koyomi button{width:100%;height:100%;background:none;border:0;color:#efe6d3;cursor:pointer;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;padding:0;line-height:1.2}
.koyomi b{font:700 14.5px/1.2 var(--f);letter-spacing:.08em}.koyomi span{font-size:12.5px;color:#cbbfa8}
.koyomi button:hover{background:rgba(239,230,211,.14)}.koyomi button.view{background:rgba(239,230,211,.2)}
.koyomi button[aria-current=date]{background:var(--shu);color:#fff7ea}.koyomi button[aria-current=date] span{color:#ffe6dd}
.koyomi :focus-visible{outline-color:#efe6d3;outline-offset:-4px}

.nophoto{background:linear-gradient(135deg,#e5d8bd,#d2c3a3)}

@media(max-width:1100px){
 .cho{grid-template-columns:1fr}
 .day-grid{grid-template-columns:1fr}
 .trio{grid-template-columns:1fr 1fr}
 .shop-grid>*{grid-column:1/-1!important}.tea{max-width:340px}
}
@media(max-width:860px){
 .builder{grid-template-columns:1fr}.bld-right{position:static}
 .gift-info{grid-template-columns:1fr}.boxphoto{grid-column:1;grid-row:auto;aspect-ratio:16/9;order:3}.terms{grid-template-columns:1fr}
 .flow ol{grid-template-columns:1fr 1fr}
 .trio{grid-template-columns:1fr;direction:ltr}.mat{border-left:0;border-top:1px solid var(--line);padding:20px 0}
 .story-body{grid-template-columns:minmax(0,1fr)}.nenpyo{grid-template-columns:1fr 1fr}
 .form{grid-template-columns:1fr}
}
@media(max-width:720px){
 :root{--band:46px}
 .hero{height:auto;max-height:none;min-height:0;display:grid;direction:rtl;grid-template-columns:auto auto 1fr;grid-template-rows:auto auto auto;align-items:start;padding-bottom:0}
 .hero>*{direction:ltr}
 .hero>img{position:relative;grid-column:1/-1;grid-row:1;height:50svh;min-height:300px;object-position:20% 40%}
 .hero::after{display:none}
 .tag{position:static;grid-column:1;grid-row:2;margin:20px 16px 0 16px;z-index:3}
 .hero h1{position:static;grid-column:2;grid-row:2;margin-top:20px;font-size:clamp(26px,7.4vw,34px)}
 .vsub{position:static;grid-column:3;grid-row:2;margin:22px 8px 0 0;font-size:14.5px;line-height:2}
 .plate{position:static;grid-column:1/-1;grid-row:3;width:auto;margin:24px 16px 24px}
 .ya{top:10px;padding:6px 10px}.ya-m{font-size:18px}
 .stamp{right:10px;width:50px;height:50px}
 .sec:not(#now){padding-right:var(--gut);min-height:0}
 .sec:not(#now) .vh{position:static;writing-mode:horizontal-tb;font-size:30px;margin-bottom:6px}
 .sec:not(#now) .sec-head{flex-direction:column}
 .ledger td{white-space:nowrap}
 .sec-head{gap:14px}.vh{font-size:30px}.sec-lead{font-size:14.5px}
 .maki-ctl{display:none}
 .ma{width:min(86vw,420px)}
 .ledger{font-size:13.5px}.ledger th,.ledger td{padding:8px 3px}.ledger small{display:none}
 .ledger tbody th{white-space:normal}
 .cal td{height:48px;padding:3px}.cal td span{font-size:12px}
 .clock{grid-template-columns:1fr;direction:ltr}
 .nenpyo li{grid-template-columns:84px 1fr}
 .flow ol{grid-template-columns:1fr}
 .kcard{left:10px;width:calc(100% - 20px)}
 .okuzuke{flex-direction:column}.ok-r{flex-direction:row-reverse;align-self:stretch;justify-content:space-between}.ok-v{height:auto}
 .ingr{aspect-ratio:16/10}
 .vtext{writing-mode:horizontal-tb;height:auto;display:block;font-size:15.5px;line-height:2.05}.vtext p{height:auto;margin-bottom:1em}
 .menu ol{gap:6px}.menu a small{display:none}
 .sample{font-size:12px}
 .mp-s{font-size:22px}.mp-m{font-size:28px}.mp-w{font-size:22px}
}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}.rv{opacity:1;transform:none}.hero h1 span,.vsub{opacity:1}html{scroll-behavior:auto}}