:root{--b:#5fcffa;--bd:#2fb6ea;--ink:#0b3b57;--y:#f7d23e;--w:#fff;--b2:#8fdcfc;--soft:#eefaff}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",Meiryo,sans-serif;color:var(--ink);background:var(--b);line-height:1.9;word-break:auto-phrase;line-break:strict;-webkit-font-smoothing:antialiased}
h1,h2,h3{text-wrap:balance;font-weight:800;line-height:1.35}
p,li{text-wrap:pretty}
.nw{white-space:nowrap}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
.in{max-width:1080px;margin:0 auto;padding:0 24px}
.narrow{max-width:760px}
/* header */
.hd{position:fixed;top:0;left:0;right:0;z-index:50;display:flex;justify-content:space-between;align-items:center;padding:10px 28px;background:rgba(95,207,250,.92);backdrop-filter:blur(8px)}
.brand img{height:46px;width:auto}
.hd nav{display:flex;gap:22px;align-items:center;font-weight:700;font-size:13px;letter-spacing:.08em}
.hd nav a{text-decoration:none;padding:6px 0;border-bottom:2px solid transparent}
.hd nav a.on,.hd nav a:hover{border-color:var(--ink)}
.hd nav a.ig{background:var(--ink);color:#fff;padding:8px 16px;border-radius:99px;border:0}
main{padding-top:72px}
/* hero */
.hero{padding:56px 0 90px;position:relative;overflow:hidden}
.hg{display:grid;grid-template-columns:1.05fr 1fr;gap:48px;align-items:center;position:relative}
.hlogo{width:200px;margin-bottom:22px}
.eye{font-weight:800;letter-spacing:.2em;font-size:12px;color:#fff;margin-bottom:14px}
.hero h1{font-size:clamp(30px,4.1vw,52px);color:#fff;letter-spacing:.02em;margin-bottom:22px;text-shadow:0 2px 0 rgba(11,59,87,.12)}
.hero h1 .nw{display:inline-block}
.lead{font-size:17px;font-weight:700;margin-bottom:28px}
.hp img{width:100%;max-width:440px;margin:0 auto;border-radius:22px;box-shadow:0 18px 40px rgba(11,59,87,.25);border:6px solid #fff}
.cat{position:absolute;height:auto;pointer-events:none}
.c1{left:-8px;bottom:-84px;width:104px}.c2{right:44%;top:-34px;width:96px}.c3{right:-6px;bottom:-66px;width:104px}
.btn{display:inline-block;background:var(--ink);color:#fff;text-decoration:none;font-weight:800;letter-spacing:.06em;padding:14px 30px;border-radius:99px;margin:0 10px 10px 0;transition:transform .25s}
.btn:hover{transform:translateY(-2px)}
.btn.o{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 2px var(--ink)}
/* sections */
.sec{padding:96px 0}.white{background:var(--b2)}.blue{background:var(--b)}
.st{margin-bottom:40px}.st span{display:block;font-weight:800;letter-spacing:.24em;font-size:12px;color:#fff;margin-bottom:6px}
.st h2{font-size:clamp(26px,3.6vw,38px)}
.g3{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.card{background:#fff;border-radius:22px;padding:12px 12px 22px;box-shadow:0 10px 26px rgba(11,59,87,.14)}
.card img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:14px;margin-bottom:16px}
.card h3,.card p{padding:0 10px}.card h3{font-size:21px;margin-bottom:4px}
.more{text-align:center;margin-top:46px}
.two>*,.hg>*{min-width:0}.two{display:grid;grid-template-columns:1fr 1.1fr;gap:56px;align-items:center}
.round{border-radius:20px;box-shadow:0 14px 32px rgba(11,59,87,.22);width:100%;max-width:460px;margin:0 auto}
.two p{margin-bottom:16px;font-size:17px}
.big{font-size:clamp(28px,3.8vw,42px);margin-bottom:22px}
.cta .c{text-align:center}.cta .st{margin-bottom:22px}
/* page head */
.ph{background:var(--b);padding:70px 0 54px}
.ph span{display:block;color:#fff;font-weight:800;letter-spacing:.26em;font-size:13px}
.ph h1{font-size:clamp(34px,5vw,54px);color:#fff}
/* menu */
.lead2{margin-bottom:36px;font-weight:700}
.mb{display:grid;grid-template-columns:200px 1fr;gap:20px;padding:30px 0;border-top:2px solid #fff}
.mh span{display:block;font-weight:800;letter-spacing:.2em;font-size:11px;color:#fff}
.mh h2{font-size:22px}
.mb li{list-style:none;padding:6px 0;border-bottom:1px dashed rgba(11,59,87,.3)}
.note{margin-top:10px;font-size:14px;opacity:.8}
/* gallery + menu photos */
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.gal img{width:100%;aspect-ratio:1/1;object-fit:cover;border-radius:14px}
.mp{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px;margin-top:16px}
.mp img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:12px}
.mp figcaption{font-size:12px;line-height:1.6;margin-top:6px}
/* cats row */
.cats{display:flex;flex-wrap:wrap;gap:22px 30px;align-items:center;justify-content:center}
.cats .cat{position:static;width:112px}.cats .cat:last-child{width:88px}
/* info */
.info{display:grid;grid-template-columns:170px 1fr;gap:0}
.info dt,.info dd{padding:18px 0;border-bottom:1px solid #fff}
.info dt{font-weight:800}
.tbd{color:rgba(11,59,87,.55)}.info a{font-weight:800}
/* footer */
.ft{background:#2aa9e0;color:var(--ink);text-align:center;padding:56px 24px 90px}
.fw{width:140px;margin:0 auto 16px}
.ft nav{display:flex;justify-content:center;gap:22px;flex-wrap:wrap;margin:18px 0;font-size:13px;font-weight:700;letter-spacing:.08em}
.ft a{text-decoration:none}.ft small{opacity:.7}
.bar{display:none}
/* reveal */
.rv{opacity:0;transform:translateY(22px);transition:opacity .9s ease,transform .9s ease}
.rv.in-v{opacity:1;transform:none}
/* opening */
#ld{position:fixed;inset:0;z-index:999;background:var(--b);display:flex;align-items:center;justify-content:center;animation:ldout .8s ease 3.1s forwards}
.lw{position:relative;width:clamp(240px,50vw,440px);overflow:hidden}
.lw img{width:100%;height:auto;animation:ldin 1.5s ease forwards;opacity:0}
.sw{position:absolute;inset:0;-webkit-mask:url(logo_w.svg) center/contain no-repeat;mask:url(logo_w.svg) center/contain no-repeat;background:linear-gradient(105deg,transparent 35%,rgba(11,59,87,.85) 50%,transparent 65%);transform:translateX(-120%);animation:sweep 1.4s ease 1.6s forwards}
@keyframes ldin{from{opacity:0;filter:blur(8px);transform:scale(.94)}to{opacity:1;filter:blur(0);transform:none}}
@keyframes sweep{to{transform:translateX(120%)}}
@keyframes ldout{to{opacity:0;visibility:hidden}}
body.top .hero .rv{transition-delay:3s}
@media(max-width:820px){
 .hd{padding:8px 16px}.brand img{height:42px}.hlogo{width:140px}.gal{grid-template-columns:repeat(2,1fr)}main{padding-top:60px}
 .hd nav{gap:12px;font-size:11px}.hd nav a:not(.ig):not(.on){display:none}
 .hd nav a.ig{padding:7px 12px}
 .hg,.two{grid-template-columns:1fr;gap:34px}
 .hero{padding:36px 0 90px}.c1{left:0;bottom:-70px;width:84px}.c2{right:6px;top:-26px;width:76px}.c3{right:0;bottom:-70px;width:84px}
 .hp{order:2}.g3{grid-template-columns:1fr}
 .sec{padding:68px 0}.mb{grid-template-columns:1fr;gap:6px}
 .info{grid-template-columns:110px 1fr}
 .bar{display:block;position:fixed;left:12px;right:12px;bottom:12px;z-index:60;background:var(--ink);color:#fff;text-decoration:none;text-align:center;font-weight:800;font-size:14px;padding:14px;border-radius:99px;box-shadow:0 8px 20px rgba(11,59,87,.35)}
}
@media(prefers-reduced-motion:reduce){.rv{opacity:1;transform:none;transition:none}#ld{display:none}.lw img,.sw{animation:none}}