:root{--teal:#5f8089;--teal2:#4c6b74;--ink:#5a5a5e;--gold:#d49a64;--peach:#fbe6d6;--sky:#dcecf3;--line:#e5dcd6}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Zen Kaku Gothic New",sans-serif;color:var(--ink);background:#fffdfb;line-height:2;font-size:14px;word-break:auto-phrase;overflow-wrap:anywhere;-webkit-font-smoothing:antialiased;position:relative}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.sample{position:relative;z-index:30;background:#4c6b74;color:#fff;text-align:center;font-size:12px;padding:6px 12px;line-height:1.6}
/* やわらかな光の背景 */
.glow{position:fixed;inset:0;z-index:0;pointer-events:none;overflow:hidden}
.glow i{position:absolute;border-radius:50%;filter:blur(70px);opacity:.7;will-change:transform;animation:drift 26s ease-in-out infinite alternate}
.glow i:nth-child(1){width:46vw;height:46vw;left:-12vw;top:-8vw;background:var(--peach)}
.glow i:nth-child(2){width:40vw;height:40vw;right:-10vw;top:18vh;background:var(--sky);animation-delay:-8s;animation-duration:32s}
.glow i:nth-child(3){width:36vw;height:36vw;left:20vw;bottom:-14vw;background:#fdeed9;animation-delay:-14s}
@keyframes drift{0%{transform:translate3d(0,0,0) scale(1)}50%{transform:translate3d(4vw,3vw,0) scale(1.08)}100%{transform:translate3d(-3vw,5vw,0) scale(1.02)}}
main,header,footer{position:relative;z-index:1}
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px clamp(16px,4vw,48px);background:rgba(255,253,251,.82);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}
.logo{display:flex;align-items:center;gap:10px}
.logo b{font-family:"Shippori Mincho",serif;font-weight:500;font-size:28px;color:var(--gold);line-height:1}
.logo span{font-family:"Cormorant Garamond",serif;font-size:21px;line-height:1.1;letter-spacing:.06em;color:var(--teal2)}
.logo small{display:block;font-size:9px;letter-spacing:.3em;color:#9aa3a6;font-family:"Zen Kaku Gothic New",sans-serif}
nav{display:flex;align-items:center;gap:clamp(12px,2.2vw,28px);font-size:12px;letter-spacing:.08em}
nav a{padding:8px 2px;border-bottom:1px solid transparent;transition:border-color .4s}
nav a:hover{border-color:var(--gold)}
nav .rsv{padding:8px 20px;border-radius:99px;background:linear-gradient(90deg,#f6c9a0,#9fc6d6);color:#fff;border:0;transition:opacity .4s}
nav .rsv:hover{opacity:.85}
.en,.band-en,.sec-en{font-family:"Cormorant Garamond",serif;font-style:italic;letter-spacing:.14em}
/* hero */
.hero{position:relative;max-width:1180px;margin:0 auto;padding:clamp(28px,5vw,60px) clamp(16px,4vw,48px) clamp(40px,6vw,70px);display:grid;grid-template-columns:.9fr 1.3fr;align-items:center;gap:0}
.hero-copy{position:relative;z-index:3;margin-right:-60px;padding:0 0 0 8px}
.hero-copy .en{color:var(--gold);font-size:17px}
.hero h1{font-family:"Shippori Mincho",serif;font-weight:500;font-size:clamp(28px,4.6vw,46px);line-height:1.55;margin:10px 0 18px;color:var(--teal2)}
.lead{font-size:13px;margin-bottom:28px}
.hero-ph{position:relative;z-index:1;aspect-ratio:4/3.1;border-radius:6px 90px 6px 6px;overflow:hidden;background:var(--peach)}
.hero-ph::after{content:"";position:absolute;inset:0;background:radial-gradient(60% 60% at 15% 85%,rgba(255,210,150,.35),transparent 70%),linear-gradient(180deg,rgba(255,255,255,0),rgba(255,236,214,.18));pointer-events:none}
.bokeh{position:absolute;z-index:2;border-radius:50%;background:radial-gradient(circle,rgba(255,220,160,.95),rgba(255,200,130,.35) 55%,transparent 72%);filter:blur(2px);animation:twinkle 7s ease-in-out infinite alternate;pointer-events:none}
.b1{width:92px;height:92px;right:26%;bottom:16%}
.b2{width:64px;height:64px;right:8%;bottom:26%;animation-delay:-3s}
.b3{width:44px;height:44px;right:42%;bottom:8%;animation-delay:-5s;animation-duration:9s}
@keyframes twinkle{0%{opacity:.45;transform:scale(.9)}100%{opacity:1;transform:scale(1.12)}}
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:46px;padding:8px 36px;border-radius:99px;border:1px solid var(--teal);color:var(--teal2);font-size:13px;letter-spacing:.14em;background:rgba(255,255,255,.6);transition:background .5s,color .5s}
.btn:hover{background:var(--teal);color:#fff}
.btn.solid{background:var(--teal);color:#fff;padding:8px 44px}
.btn.solid:hover{background:var(--teal2)}
/* worry band */
.worry{padding:clamp(20px,4vw,40px) clamp(16px,4vw,48px)}
.band{max-width:1000px;margin:0 auto;background:var(--teal);color:#fff;text-align:center;padding:clamp(34px,6vw,56px) clamp(16px,4vw,40px);border-radius:4px;box-shadow:0 24px 50px -34px rgba(60,90,100,.7)}
.band-en{font-size:14px;opacity:.8}
.band h2{display:inline-block;font-family:"Shippori Mincho",serif;font-weight:500;font-size:clamp(20px,3.2vw,26px);margin:2px 0 26px;padding:6px 28px;border:1px solid rgba(255,255,255,.6);border-radius:99px}
.band ul{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:18px}
.band svg{width:44px;height:44px;fill:none;stroke:#fff;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;margin:0 auto 8px}
.band li p{font-size:13px;line-height:1.8}
/* about */
.about{position:relative;padding:clamp(50px,8vw,100px) clamp(16px,4vw,48px) clamp(40px,6vw,80px);overflow:hidden}
.water{position:absolute;left:50%;top:clamp(0px,2vw,24px);transform:translateX(-50%);font-family:"Cormorant Garamond",serif;font-size:clamp(70px,17vw,210px);letter-spacing:.04em;white-space:nowrap;color:rgba(212,154,100,.14);line-height:1;pointer-events:none;user-select:none}
.wrap{position:relative;max-width:1000px;margin:0 auto}
.about h2{text-align:center;font-family:"Shippori Mincho",serif;font-weight:500;font-size:clamp(20px,3.4vw,28px);line-height:1.8;color:var(--teal2);margin-top:clamp(30px,6vw,70px)}
.about h2 small{display:block;font-family:"Zen Kaku Gothic New",sans-serif;font-size:12px;letter-spacing:.3em;color:var(--gold);margin-bottom:6px}
.txt{text-align:center;max-width:640px;margin:22px auto 40px}
.duo{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:0;max-width:880px;margin:0 auto;align-items:start}
.p1{aspect-ratio:4/5;margin-right:-30px;z-index:1}
.p2{aspect-ratio:4/5;margin-top:60px;margin-left:-30px;z-index:2}
/* sections */
.menu,.flow{padding:clamp(40px,7vw,90px) clamp(16px,4vw,48px)}
.sec-en{text-align:center;font-size:clamp(28px,4.6vw,38px);color:var(--teal);line-height:1.2}
.sec-h{text-align:center;font-family:"Shippori Mincho",serif;font-weight:400;font-size:13px;letter-spacing:.3em;color:#8a9a9f;margin-bottom:34px}
.mcards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.mcards article{background:rgba(255,255,255,.8);padding:14px 14px 24px;text-align:center;border:1px solid var(--line)}
.mcards h3{font-family:"Shippori Mincho",serif;font-weight:500;font-size:17px;margin:16px 0 0;color:var(--teal2)}
.price{font-size:12px;color:#8a8a8e}
.price b{font-family:"Cormorant Garamond",serif;font-size:22px;color:var(--gold);font-weight:500}
.mcards p:last-child{font-size:12px;line-height:1.9;text-align:left;margin-top:6px}
.gal{padding:0 clamp(16px,4vw,48px)}
.strip{max-width:1100px;margin:0 auto;display:grid;grid-template-columns:1fr 1.3fr 1fr;gap:16px;align-items:end}
.g1{aspect-ratio:3/4}.g2{aspect-ratio:3/4.2}.g3{aspect-ratio:3/4}
.flow ol{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:22px;counter-reset:s}
.flow li{border-top:1px solid var(--teal);padding-top:14px}
.flow li span{font-family:"Cormorant Garamond",serif;font-size:30px;color:var(--gold);line-height:1}
.flow h3{font-family:"Shippori Mincho",serif;font-weight:500;font-size:16px;color:var(--teal2);margin:4px 0}
.flow p{font-size:12px;line-height:1.9}
.reserve{text-align:center;padding:clamp(44px,7vw,80px) 20px;background:linear-gradient(120deg,rgba(251,230,214,.8),rgba(220,236,243,.8))}
.reserve h2{font-family:"Shippori Mincho",serif;font-weight:500;font-size:24px;color:var(--teal2);margin-bottom:10px}
.more{margin-top:26px}
footer{text-align:center;padding:34px 16px 40px;background:#fffdfb}
.flogo{font-family:"Cormorant Garamond",serif;font-size:22px;color:var(--teal2);letter-spacing:.08em}
footer small{display:block;font-size:11px;margin-top:6px;color:#9a9a9e}
/* 写真の動き：浮かび上がる＋ゆっくりついてくる */
.ph{position:relative;overflow:hidden;background:var(--peach);border-radius:4px}
.ph img,.hero-ph img{width:100%;height:calc(100% + 100px);margin-top:-50px;object-fit:cover}
.ph.p1,.ph.p2{border-radius:4px 60px 4px 4px}
.ph.p2{border-radius:60px 4px 4px 4px}
.ph.th{aspect-ratio:4/3}
.fl img{will-change:transform}
.js .fl{opacity:0;transform:translate3d(0,40px,0);transition:opacity 1.6s cubic-bezier(.22,.61,.36,1),transform 1.8s cubic-bezier(.22,.61,.36,1);transition-delay:var(--d,0s)}
.js .fl.on{opacity:1;transform:none}
@media(max-width:820px){
 .hero{grid-template-columns:1fr;padding-top:16px}
 .hero-ph{order:-1;aspect-ratio:4/3.4;border-radius:4px 60px 4px 4px}
 .hero-copy{margin:-34px 0 0;padding:26px 18px 0;background:linear-gradient(180deg,rgba(255,253,251,.92),rgba(255,253,251,.6));border-radius:4px}
 .b1{right:14%;bottom:44%}.b2{right:4%;bottom:52%}.b3{display:none}
 .band ul{grid-template-columns:repeat(2,1fr);gap:22px 12px}
 .mcards{grid-template-columns:1fr;max-width:440px;margin:0 auto}
 .strip{grid-template-columns:1fr 1fr}.g3{display:none}
 .flow ol{grid-template-columns:1fr 1fr;gap:22px 16px}
 .p1{margin-right:-14px}.p2{margin-left:-14px;margin-top:36px}
 nav a:not(.rsv){display:none}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.js .fl{opacity:1;transform:none;transition:none}.glow i,.bokeh{animation:none}.fl img{will-change:auto}}
