/* ===== gallery：写真に場所と日付。大きく・2枚並び・右寄せ・左寄せをくり返して、写真集のように ===== */
.gal{ display:flex; flex-direction:column; gap:clamp(64px,12vw,160px); padding:0 0 20px; }
.gal__row{ position:relative; }
.gal__f{ margin:0; }
.gal__ph{ position:relative; overflow:hidden; aspect-ratio:4/5; background:var(--tile); cursor:zoom-in; }
.gal__ph img{ width:100%; height:100%; object-fit:cover; will-change:transform; }
.gal__cap{ display:flex; align-items:baseline; gap:12px; margin-top:12px; font:300 10px/1.6 var(--en); letter-spacing:.18em; color:var(--sub); }
.gal__cap b{ font-weight:300; color:var(--ink); letter-spacing:.24em; }
.gal__cap span{ color:var(--text); letter-spacing:.14em; } .gal__cap small{ display:block; font-size:10px; color:var(--sub); letter-spacing:.18em; }
/* スマホ */
.gal__row--full .gal__ph{ aspect-ratio:4/5; }
.gal__row--full .gal__cap{ padding:0 var(--gut); }
.gal__row--right{ padding-left:22%; padding-right:var(--gut); }
.gal__row--left{ padding-right:22%; padding-left:var(--gut); }
.gal__row--pair{ display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:0 var(--gut); align-items:start; }
.gal__row--pair .gal__f:nth-child(2){ margin-top:64px; }
.gal__row--pair .gal__ph{ aspect-ratio:3/4; }
.gal__tate{ position:absolute; top:0; writing-mode:vertical-rl; font:300 10px/1 var(--en); letter-spacing:.3em; color:var(--sub); }
.gal__row--right .gal__tate{ left:var(--gut); } .gal__row--left .gal__tate{ right:var(--gut); }
.gal__quote{ padding:0 var(--gut); text-align:center; font-size:13px; line-height:2.4; letter-spacing:.24em; color:var(--ink); }
@media (min-width:750px){
  .gal{ max-width:1240px; margin:0 auto; padding:0 var(--gut) 20px; }
  .gal__row--full{ padding:0 12%; } .gal__row--full .gal__ph{ aspect-ratio:3/2; } .gal__row--full .gal__cap{ padding:0; }
  .gal__row--right{ padding-left:48%; padding-right:6%; } .gal__row--left{ padding-right:48%; padding-left:6%; }
  .gal__row--right .gal__tate{ left:calc(48% - 60px); } .gal__row--left .gal__tate{ right:calc(48% - 60px); }
  .gal__row--pair{ padding:0 6%; gap:clamp(24px,4vw,64px); } .gal__row--pair .gal__f:nth-child(2){ margin-top:clamp(80px,12vw,180px); }
  .gal__quote{ font-size:15px; }
}
.gal__row--trio{ display:grid; grid-template-columns:1fr 1fr 1fr; gap:8px; padding:0 var(--gut); align-items:start; }
.gal__row--trio .gal__f:nth-child(2){ margin-top:40px; } .gal__row--trio .gal__f:nth-child(3){ margin-top:80px; }
.gal__row--trio .gal__ph{ aspect-ratio:3/4; } .gal__row--trio .gal__cap span{ display:none; }
/* 章 */
.chap{ scroll-margin-top:calc(var(--head) + 50px); }
.chap + .chap{ margin-top:clamp(110px,18vw,220px); }
.chap__h{ position:relative; padding:clamp(56px,10vw,110px) var(--gut) clamp(40px,7vw,80px); }
.chap__no{ display:block; font:300 10px/1 var(--en); letter-spacing:.32em; color:var(--sub); }
.chap__t{ margin:16px 0 0; font:300 clamp(48px,15vw,140px)/1 var(--en); letter-spacing:.01em; color:var(--ink); text-transform:lowercase; overflow:hidden; }
.chap__ja{ margin:20px 0 0; font-size:13px; letter-spacing:.26em; color:var(--text); }
.chap__en{ display:block; margin-top:10px; font:300 10px/1 var(--en); letter-spacing:.24em; color:var(--sub); text-transform:uppercase; }
.chap:first-of-type .chap__h{ padding-top:clamp(32px,6vw,70px); }
.chips--gal{ justify-content:flex-start; } .chips--gal a{ font-family:var(--en); letter-spacing:.16em; }
@media (min-width:750px){ .chap__h{ max-width:1240px; margin:0 auto; } .chips--gal{ justify-content:center; } .gal__row--trio{ padding:0 6%; gap:clamp(16px,2.4vw,40px); } .gal__row--trio .gal__f:nth-child(3){ margin-top:clamp(80px,10vw,160px); } }
/* 大きく見る */
.lb{ position:fixed; inset:0; z-index:80; background:var(--bg); display:grid; grid-template-rows:auto 1fr auto; opacity:0; pointer-events:none; transition:opacity .6s var(--ease); }
.lb.on{ opacity:1; pointer-events:auto; }
.lb__top{ display:flex; justify-content:space-between; align-items:center; height:var(--head); padding:0 var(--gut); font:300 11px/1 var(--en); letter-spacing:.24em; color:var(--sub); }
.lb__x{ width:44px; height:44px; margin-right:-12px; position:relative; }
.lb__x::before,.lb__x::after{ content:""; position:absolute; left:11px; right:11px; top:50%; height:1px; background:var(--ink); transform:rotate(45deg); }
.lb__x::after{ transform:rotate(-45deg); }
.lb__stage{ position:relative; overflow:hidden; touch-action:pan-y; }
.lb__stage img{ position:absolute; inset:0; width:100%; height:100%; object-fit:contain; padding:0 var(--gut); }
.lb__bot{ display:flex; justify-content:space-between; align-items:center; gap:16px; padding:18px var(--gut) 26px; font:300 10px/1.6 var(--en); letter-spacing:.18em; color:var(--sub); }
.lb__bot b{ font-weight:300; color:var(--ink); }
.lb__nav{ display:flex; gap:6px; } .lb__nav button{ width:44px; height:44px; display:grid; place-items:center; }
.lb__nav svg{ width:22px; height:22px; stroke:var(--ink); fill:none; stroke-width:1; }

/* ===== about us（第3版・スマホが主）：1画面に「写真1枚」か「言葉1つ」。言葉は中央・大きめ・濃い字 ===== */
.ab1{ margin:0; height:74svh; min-height:440px; overflow:hidden; }
.ab1 img{ width:100%; height:100%; object-fit:cover; }
.ab1__cap{ margin:28px 0 0; text-align:center; font-size:12px; letter-spacing:.34em; color:var(--text); }
.vs{ padding:clamp(110px,30vw,200px) var(--gut); text-align:center; }
.vs--q{ padding-top:clamp(96px,26vw,180px); }
.vs__rule{ display:block; width:1px; height:56px; margin:0 auto 44px; background:var(--ink); opacity:.4; transform-origin:top; }
.st{ margin:0; font-size:15px; line-height:2.5; letter-spacing:.12em; color:var(--ink); }
.st + .st{ margin-top:2.2em; }
.st .l{ display:block; }
.p{ display:inline-block; }  /* 言葉の切れ目でだけ折り返す */
.vs--q .st{ font-size:clamp(18px,5vw,26px); line-height:2.2; letter-spacing:.14em; }
.bo{ font-style:normal; -webkit-text-emphasis:filled dot; text-emphasis:filled dot;  /* けいと「、、を・・に」10/27 */ -webkit-text-emphasis-color:var(--sub); text-emphasis-color:var(--sub); }
.ph{ margin:0; aspect-ratio:4/5; overflow:hidden; }
.ph img{ width:100%; height:100%; object-fit:cover; }
/* 「存在」：画面に貼りつき、写真が窓から全体へ広がって言葉が出る */
.exist{ position:relative; height:240vh; }
.exist__pin{ position:sticky; top:0; height:100svh; overflow:hidden; display:grid; place-items:center; }
.exist__ph{ position:absolute; inset:0; margin:0; will-change:clip-path; }
.exist__ph img{ width:100%; height:100%; object-fit:cover; }
.exist__ph::after{ content:""; position:absolute; inset:0; background:rgba(30,26,20,.32); }
.exist__w{ position:relative; z-index:2; margin:0; text-align:center; color:#fff; padding:0 var(--gut); }
.exist__s{ display:block; font-size:13px; letter-spacing:.34em; }
.exist__b{ display:block; margin-top:16px; font-size:clamp(40px,12vw,80px); line-height:1.3; letter-spacing:.1em; font-weight:300; }
/* そばにある、小さなもの：横に払うカード */
.small{ padding:clamp(110px,28vw,200px) 0 0; }
.small__t{ margin:0 0 44px; text-align:center; font-size:clamp(19px,5.2vw,26px); line-height:2; letter-spacing:.2em; color:var(--ink); }
.small__row{ display:flex; gap:14px; padding:0 var(--gut) 6px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding-left:var(--gut); scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.small__row::-webkit-scrollbar{ display:none; }
.small__c{ flex:0 0 78%; margin:0; scroll-snap-align:start; }
.small__ph{ aspect-ratio:4/5; overflow:hidden; background:var(--tile); }
.small__ph img{ width:100%; height:100%; object-fit:cover; }
.small__c figcaption{ margin-top:18px; text-align:center; font-size:13px; line-height:2; letter-spacing:.14em; color:var(--ink); }
.small__dots{ display:flex; justify-content:center; gap:8px; margin-top:22px; }
.small__dots i{ width:18px; height:1px; background:var(--line); transition:background .4s; }
.small__dots i.on{ background:var(--ink); }
/* むすび */
.fin{ position:relative; margin-top:0; height:100svh; min-height:540px; overflow:hidden; }
.fin__ph{ position:absolute; inset:0; margin:0; }
.fin__ph img{ width:100%; height:100%; object-fit:cover; }
.fin__ph::after{ content:""; position:absolute; inset:0; background:linear-gradient(180deg,rgba(30,26,20,.05) 30%,rgba(30,26,20,.55)); }
.fin__tx{ position:absolute; left:0; right:0; bottom:clamp(56px,10vh,110px); z-index:2; padding:0 var(--gut); color:#fff; text-align:center; }
.fin__s{ margin:0; font-size:13px; letter-spacing:.3em; }
.fin__b{ margin:18px 0 0; font-size:clamp(20px,5.6vw,34px); line-height:2; letter-spacing:.18em; }
.fin__b .l, .fin__s .l{ display:block; }
.fin__logo{ width:96px; margin:36px auto 0; filter:brightness(0) invert(1); opacity:.9; }
/* つづきを読む：小さな写真つきの行 */
.more{ margin:clamp(80px,20vw,140px) var(--gut) 0; border-top:1px solid var(--line); }
.more a{ display:grid; grid-template-columns:72px 1fr auto; gap:18px; align-items:center; padding:16px 0; border-bottom:1px solid var(--line); }
.more img{ width:72px; height:72px; object-fit:cover; }
.more b{ display:block; font:300 19px/1.2 var(--en); letter-spacing:.06em; color:var(--ink); }
.more small{ display:block; margin-top:6px; font-size:11px; letter-spacing:.14em; color:var(--sub); }
.more a i{ width:24px; height:1px; background:var(--ink); transition:width .6s var(--ease); }
@media (hover:hover){ .more a:hover i{ width:44px; } }
@media (min-width:750px){
  .ab1{ height:86vh; margin:0 var(--gut); }
  .vs .st{ font-size:16px; } .vs--q .st{ font-size:26px; }
  .ph{ max-width:640px; margin:0 auto; aspect-ratio:4/5; }
  .small{ max-width:1240px; margin:0 auto; } .small__row{ overflow:visible; display:grid; grid-template-columns:repeat(4,1fr); gap:24px; }
  .small__c{ flex:none; } .small__c:nth-child(even){ margin-top:80px; } .small__dots{ display:none; }
  .fin{ margin-left:var(--gut); margin-right:var(--gut); }
  .more{ max-width:860px; margin-left:auto; margin-right:auto; }
}

/* ===== faq：分類の札（帯の下に貼りつく）＋行ぜんぶが押せる開閉 ===== */
.chips{ position:sticky; top:var(--head); z-index:20; display:flex; gap:8px; overflow-x:auto; padding:12px var(--gut); background:rgba(248,248,247,.94); backdrop-filter:blur(10px); -webkit-backdrop-filter:blur(10px); scrollbar-width:none; border-bottom:1px solid var(--line); }
.chips::-webkit-scrollbar{ display:none; }
.chips a{ flex:none; padding:9px 16px; border:1px solid var(--line); border-radius:999px; font-size:12px; line-height:1; letter-spacing:.1em; color:var(--text); white-space:nowrap; transition:background .4s, color .4s, border-color .4s; }
.chips a.on{ background:var(--ink); border-color:var(--ink); color:var(--bg); }
.faq{ padding:0 var(--gut); }
.faq__grp{ padding-top:clamp(48px,8vw,90px); scroll-margin-top:calc(var(--head) + 70px); }
.faq__grp h2{ display:flex; align-items:baseline; gap:14px; margin:0 0 14px; font-weight:400; font-size:15px; letter-spacing:.16em; color:var(--ink); }
.faq__grp h2 small{ font:300 10px/1 var(--en); letter-spacing:.3em; color:var(--sub); }
.qa{ border-bottom:1px solid var(--line); }
.qa:first-of-type{ border-top:1px solid var(--line); }
.qa__q{ width:100%; display:grid; grid-template-columns:auto 1fr auto; gap:14px; align-items:center; padding:20px 0; text-align:left; font-size:14px; line-height:1.7; letter-spacing:.04em; color:var(--ink); }
.qa__q .k{ font:300 12px/1 var(--en); letter-spacing:.12em; color:var(--sub); }
.qa__q .pm{ position:relative; width:14px; height:14px; }
.qa__q .pm::before,.qa__q .pm::after{ content:""; position:absolute; left:0; right:0; top:50%; height:1px; background:var(--ink); transition:transform .6s var(--ease); }
.qa__q .pm::after{ transform:rotate(90deg); }
.qa.open .qa__q .pm::after{ transform:rotate(0); }
.qa__a{ height:0; overflow:hidden; transition:height .7s var(--ease); }
.qa__a > div{ display:grid; grid-template-columns:auto 1fr; gap:14px; padding:0 30px 24px 0; font-size:13px; line-height:2.1; color:var(--text); }
.qa__a .k{ font:300 12px/2.1 var(--en); letter-spacing:.12em; color:var(--sub); }
.ask{ margin:clamp(72px,12vw,140px) var(--gut) 0; padding:clamp(36px,6vw,56px) 24px; background:var(--paper); text-align:center; }
.ask p{ margin:0; font-size:13px; letter-spacing:.14em; color:var(--ink); }
.ask a{ display:inline-flex; align-items:center; gap:14px; margin-top:22px; padding:15px 28px; border:1px solid var(--ink); font:300 11px/1 var(--en); letter-spacing:.24em; color:var(--ink); text-transform:uppercase; transition:background .5s, color .5s; }
.ask a i{ width:22px; height:1px; background:currentColor; }
@media (hover:hover){ .ask a:hover{ background:var(--ink); color:var(--bg); } }
@media (min-width:750px){
  .chips{ justify-content:center; }
  .faq{ max-width:860px; margin:0 auto; }
  .ask{ max-width:860px; margin-left:auto; margin-right:auto; }
}

/* ===== policy：目次（スマホは開け閉め）＋条ごとに番号 ===== */
.toc{ margin:0 var(--gut); border-top:1px solid var(--line); border-bottom:1px solid var(--line); }
.toc__btn{ width:100%; display:flex; justify-content:space-between; align-items:center; padding:18px 0; font:300 11px/1 var(--en); letter-spacing:.24em; color:var(--ink); text-transform:uppercase; }
.toc__btn .pm{ position:relative; width:12px; height:12px; }
.toc__btn .pm::before,.toc__btn .pm::after{ content:""; position:absolute; left:0; right:0; top:50%; height:1px; background:var(--ink); transition:transform .6s var(--ease); }
.toc__btn .pm::after{ transform:rotate(90deg); } .toc.open .toc__btn .pm::after{ transform:rotate(0); }
.toc__list{ height:0; overflow:hidden; transition:height .8s var(--ease); }
.toc__list ol{ list-style:none; margin:0; padding:0 0 20px; columns:1; }
.toc__list a{ display:grid; grid-template-columns:34px 1fr; padding:7px 0; font-size:12px; line-height:1.6; letter-spacing:.08em; color:var(--text); }
.toc__list a span{ font:300 11px/1.6 var(--en); letter-spacing:.12em; color:var(--sub); }
.art{ padding:0 var(--gut); }
.art__i{ padding-top:clamp(56px,8vw,90px); scroll-margin-top:calc(var(--head) + 20px); }
.art__i h2{ display:flex; align-items:baseline; gap:16px; margin:0 0 18px; font-weight:400; font-size:15px; letter-spacing:.14em; color:var(--ink); }
.art__i h2 small{ font:300 11px/1 var(--en); letter-spacing:.24em; color:var(--sub); min-width:34px; }
.art__i p{ margin:0; font-size:13px; line-height:2.1; letter-spacing:.06em; color:var(--text); }
.art__i p + p{ margin-top:6px; }
.art__i p.sub{ padding-left:1em; text-indent:-1em; }
.art__date{ margin:clamp(56px,8vw,90px) 0 0; font:300 11px/2 var(--en); letter-spacing:.16em; color:var(--sub); }
.art__more{ margin-top:16px; font-size:12px; color:var(--text); } .art__more a{ border-bottom:1px solid var(--line); }
.totop{ position:fixed; right:18px; bottom:calc(18px + env(safe-area-inset-bottom)); z-index:30; width:46px; height:46px; border-radius:50%; background:rgba(78,76,70,.9); display:grid; place-items:center; opacity:0; transform:translateY(20px); transition:opacity .5s, transform .6s var(--ease); pointer-events:none; }
.totop.on{ opacity:1; transform:none; pointer-events:auto; }
.totop svg{ width:18px; height:18px; stroke:#fff; fill:none; stroke-width:1.2; }
@media (min-width:750px){
  .toc, .art{ max-width:860px; margin-left:auto; margin-right:auto; }
  .toc__list ol{ columns:2; column-gap:40px; }
  .totop{ right:32px; bottom:32px; }
}

/* ===== brand story（/welcome/ の作り直し）：はじまり→映画のように入れ替わる言葉と写真→むすび→Number.→places ===== */
.op{ position:relative; height:calc(100svh - var(--head)); min-height:540px; overflow:hidden; }
.op__ph{ position:absolute; inset:0; margin:0; }
.op__ph img{ width:100%; height:100%; object-fit:cover; }
.op__ph::after{ content:""; position:absolute; inset:0; background:radial-gradient(60% 45% at 88% 22%,rgba(30,26,20,.38),rgba(30,26,20,0)),linear-gradient(180deg,rgba(30,26,20,.05),rgba(30,26,20,.35)); }
.op__t{ position:absolute; top:clamp(36px,8vh,80px); right:calc(var(--gut) + 4px); margin:0; writing-mode:vertical-rl; font-weight:300; font-size:clamp(17px,4.6vw,24px); line-height:2; letter-spacing:.34em; color:#fff; text-shadow:0 0 14px rgba(0,0,0,.35); }
.op__t span{ display:block; }
.op__t2{ padding-inline-start:3.2em; }  /* 2行目「いつもそばに。』」を少し下から始める */
.op__brand{ position:absolute; left:var(--gut); bottom:clamp(36px,6vh,64px); margin:0; display:flex; flex-direction:column; gap:12px; color:#fff; }
.op__brand img{ width:120px; filter:brightness(0) invert(1); }
.op__brand span{ font:300 10px/1 var(--en); letter-spacing:.34em; text-transform:uppercase; }
.op__cue{ position:absolute; right:var(--gut); bottom:clamp(36px,6vh,64px); margin:0; display:flex; flex-direction:column; align-items:center; gap:10px; font:300 9px/1 var(--en); letter-spacing:.3em; color:#fff; writing-mode:vertical-rl; }
.op__cue i{ position:relative; width:1px; height:44px; background:rgba(255,255,255,.35); overflow:hidden; }
.op__cue i::after{ content:""; position:absolute; left:0; top:-100%; width:1px; height:100%; background:#fff; animation:cue 2.2s cubic-bezier(.6,0,.2,1) infinite; }
@keyframes cue{ to{ top:100%; } }
.film{ position:relative; height:calc(var(--n) * 100svh); }
.film__pin{ position:sticky; top:0; height:100svh; overflow:hidden; }
.film__img{ position:absolute; inset:0; margin:0; }
.film__img img{ width:100%; height:100%; object-fit:cover; will-change:transform; }
.film__veil{ position:absolute; inset:0; background:linear-gradient(180deg,rgba(30,26,20,.1) 20%,rgba(30,26,20,.5)); }
.film__tx{ position:absolute; left:0; right:0; bottom:clamp(90px,16vh,160px); margin:0; padding:0 var(--gut); text-align:center; color:#fff; font-size:clamp(16px,4.4vw,22px); line-height:2.1; letter-spacing:.14em; text-shadow:0 0 18px rgba(0,0,0,.18); }
.film__tx .l{ display:block; } .film__tx .l + .l{ margin-top:.5em; }
.film__count{ position:absolute; right:var(--gut); top:50%; transform:translateY(-50%); margin:0; display:flex; flex-direction:column; align-items:center; gap:10px; font:300 10px/1 var(--en); letter-spacing:.1em; color:rgba(255,255,255,.85); }
.film__count b{ font-weight:300; color:#fff; }
.film__count i{ position:relative; width:1px; height:72px; background:rgba(255,255,255,.3); }
.film__count em{ position:absolute; inset:0; background:#fff; transform-origin:top; transform:scaleY(0); }
.last{ padding:clamp(110px,28vw,200px) var(--gut); text-align:center; }
.last__tx{ margin:0; font-size:clamp(18px,5vw,28px); line-height:2.2; letter-spacing:.16em; color:var(--ink); }
.last__tx .l{ display:block; }
.last__logo{ width:110px; margin:44px auto 0; opacity:.85; }
.sec-h{ padding:0 var(--gut); }
.sec-h__no{ margin:0; font:300 10px/1 var(--en); letter-spacing:.32em; color:var(--sub); text-transform:uppercase; }
.sec-h__t{ margin:16px 0 0; font:300 clamp(40px,12vw,96px)/1 var(--en); letter-spacing:.02em; color:var(--ink); }
.sec-h__ja{ margin:18px 0 0; font-size:13px; letter-spacing:.2em; color:var(--text); }
.num{ padding:clamp(40px,8vw,90px) 0 0; border-top:1px solid var(--line); }
.num__row, .pl__row{ display:flex; gap:14px; margin-top:40px; padding:0 var(--gut) 6px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding-left:var(--gut); scrollbar-width:none; -webkit-overflow-scrolling:touch; }
.num__row::-webkit-scrollbar, .pl__row::-webkit-scrollbar{ display:none; }
.num__c{ flex:0 0 66%; scroll-snap-align:start; }
.num__ph{ position:relative; aspect-ratio:1; overflow:hidden; background:var(--tile); }
.num__ph img{ position:absolute; inset:0; width:100%; height:100%; object-fit:cover; transition:opacity .8s, transform 1.6s var(--ease); }
.num__ph2{ opacity:0; }
@media (hover:hover){ .num__c:hover .num__ph2{ opacity:1; } .num__c:hover .num__ph img{ transform:scale(1.03); } }
.num__n{ margin:16px 0 0; font:300 17px/1 var(--en); letter-spacing:.08em; color:var(--ink); }
.num__d{ margin:10px 0 0; font-size:12px; line-height:1.9; letter-spacing:.06em; color:var(--text); }
.num__pr{ margin:8px 0 0; font:300 12px/1 var(--en); letter-spacing:.1em; color:var(--sub); }
.num__c.sold .num__ph img{ opacity:.5; }
.num__dots{ display:flex; justify-content:center; gap:6px; margin-top:22px; }
.num__dots i{ width:12px; height:1px; background:var(--line); transition:background .4s; } .num__dots i.on{ background:var(--ink); }
.btn{ display:flex; justify-content:center; align-items:center; gap:14px; width:fit-content; margin:44px auto 0; padding:16px 34px; border:1px solid var(--ink); font:300 11px/1 var(--en); letter-spacing:.26em; color:var(--ink); text-transform:uppercase; transition:background .5s, color .5s; }
.btn i{ width:22px; height:1px; background:currentColor; }
@media (hover:hover){ .btn:hover{ background:var(--ink); color:var(--bg); } }
.pl{ padding:clamp(110px,24vw,180px) 0 0; }
.pl__c{ flex:0 0 52%; margin:0; scroll-snap-align:start; }
.pl__ph{ aspect-ratio:3/4; overflow:hidden; } .pl__ph img{ width:100%; height:100%; object-fit:cover; }
.pl__c figcaption{ margin-top:12px; font:300 11px/1.6 var(--en); letter-spacing:.12em; color:var(--ink); }
.pl__c figcaption small{ display:block; font-size:10px; color:var(--sub); }
@media (min-width:750px){
  .op{ margin:0 var(--gut); }
  .op__t{ right:56px; top:64px; }
  .film__tx{ bottom:18vh; }
  .sec-h{ max-width:1240px; margin:0 auto; }
  .num__row{ max-width:1240px; margin-left:auto; margin-right:auto; overflow:visible; display:grid; grid-template-columns:repeat(4,1fr); gap:40px 24px; }
  .num__c{ flex:none; } .num__dots{ display:none; }
  .pl__row{ max-width:1240px; margin-left:auto; margin-right:auto; overflow:visible; display:grid; grid-template-columns:repeat(6,1fr); gap:24px 16px; }
  .pl__c{ flex:none; } .pl__c:nth-child(even){ margin-top:60px; }
}

/* about・gallery・brand story：商品へ行くボタンを常に出す（けいと 10/27「VIEW ITEMSというボタンを常時つけて欲しい」）＝お店の m-fab と同じ形 */
.vi{ position:fixed; left:50%; bottom:calc(18px + env(safe-area-inset-bottom)); z-index:40; transform:translateX(-50%); display:flex; align-items:center; gap:12px;
  padding:13px 24px; border-radius:999px; background:rgba(78,76,70,.92); color:#f7f5f1; font:300 11px/1 'Jost',sans-serif; letter-spacing:.24em; text-transform:uppercase; text-decoration:none;
  box-shadow:0 10px 30px rgba(40,36,30,.18); -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); white-space:nowrap; }
.vi i{ display:block; width:18px; height:1px; background:currentColor; transition:width .4s; }
.vi:hover i{ width:28px; }
@media (min-width:750px){ .vi{ bottom:28px; padding:15px 30px; font-size:12px; } }