*{box-sizing:border-box}html,body{margin:0;padding:0}
:root{--fg:#111;--muted:#666;--line:#eee;--bg:#f6f7f9}
body{font-family:system-ui,-apple-system,Segoe UI,Roboto,Noto Sans JP,Arial,sans-serif;line-height:1.8;color:var(--fg);background:#fff}
img{max-width:100%;height:auto;display:block}a{color:inherit;text-decoration:none}
.container{width:min(1140px,92%);margin-inline:auto}.narrow{width:min(860px,92%);margin-inline:auto}
.site-header{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--line);z-index:20}
.site-header .container{display:flex;align-items:center;justify-content:space-between;padding:14px 0;gap:1rem}
.site-title{font-weight:700;font-size:1.125rem}.menu{display:flex;gap:clamp(.5rem,2.2vw,1.25rem);list-style:none;padding:0;margin:0}
.btn-open-menu{appearance:none;border:1px solid #bbb;background:#fff;padding:.35em .75em;border-radius:999px;font-size:.8rem;opacity:.9}
.btn-open-menu:hover{opacity:1}
.hero{padding: clamp(36px,6vw,56px) 0;background:var(--bg)}
.hero--visual{min-height:56vh;display:grid;place-items:center;background:var(--bg);position:relative;overflow:hidden}
.hero--visual::before{content:"";position:absolute;inset:0;background-image:var(--hero);background-size:cover;background-position:center;filter:grayscale(100%) contrast(105%) brightness(95%);opacity:.85}
.hero-inner{position:relative;z-index:1;display:grid;gap:22px;justify-items:center;text-align:center}
.brand-text{font-size:clamp(1.6rem,3.6vw,2.8rem);font-weight:600;letter-spacing:.04em}
.hero-tags{list-style:none;display:grid;gap:6px;padding:0;margin:4px 0 0;color:#fff;text-shadow:0 2px 8px rgba(0,0,0,.35);font-weight:700}
.scroll-indicator{position:absolute;left:50%;bottom:24px;transform:translateX(-50%);color:#fff;opacity:.9}
.scroll-indicator span{writing-mode:vertical-rl;letter-spacing:.3em;text-transform:uppercase;font-size:.8rem}
.section-intro{background:#f3f4f5;padding:64px 0}
.lead-paragraph{font-size:clamp(1rem,1.3vw,1.125rem);color:var(--muted);text-align:center}
.section-gallery{padding:64px 0}
.gallery-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.gallery-head h2{font-size:1.25rem}
.gallery-nav button{border:1px solid var(--fg);background:#fff;padding:.4em .8em;border-radius:999px}
.g-item{position:relative}.g-link-indicator{position:absolute;right:8px;bottom:8px;background:#fff;border:1px solid var(--fg);border-radius:999px;padding:.2em .5em;font-size:.9rem}
.gallery-swiper .swiper-slide{width:auto}.gallery-swiper .g-img{width:100%;height:auto;border-radius:8px}
.menu-overlay[hidden]{display:none}.menu-overlay{position:fixed;inset:0;background:rgba(0,0,0,.5);display:grid;place-items:center;z-index:999;animation:fadeIn .18s ease}
.menu-panel{position:relative;background:#fff;width:min(92vw,680px);padding:28px;border-radius:16px;box-shadow:0 10px 40px rgba(0,0,0,.12)}
.menu-panel--pc{width:min(92vw,880px)}.menu-vertical{list-style:none;padding:0;margin:0;display:grid;gap:12px;font-size:1.1rem}
.btn-close{position:absolute;top:12px;right:12px;border:none;background:transparent;font-size:1.5rem;line-height:1}
.site-footer{padding:40px 0;border-top:1px solid var(--line);margin-top:40px}
@media (max-width:767px){.site-header .container{flex-wrap:wrap}}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}