:root { --font-body: "Hiragino Sans", "FP-ヒラギノ角ゴ ProN W3", "Noto Sans JP", sans-serif; --font-heading: "Hiragino Sans", "FP-ヒラギノ角ゴ StdN W7", "Noto Sans JP", sans-serif; }
* { font-feature-settings: "palt"; }
html { scroll-behavior: smooth; }
body { background: var(--color-bg); color: var(--color-text); font-family: var(--font-body); font-size: 14px; letter-spacing: .5px; line-height: 1.9; }
img { display: block; max-width: 100%; }
a { color: var(--color-accent); text-decoration: none; } a:hover { opacity: .7; }
.container { width: min(1200px, 100%); margin: 0 auto; padding: 0 20px; }
.site-header { position: relative; background: var(--color-bg); border-bottom: 1px solid color-mix(in srgb, var(--color-text) 10%, var(--color-bg)); box-shadow: none; }
.site-header .container { height: 80px; gap: 32px; }.site-logo { display: flex; align-items: center; width: 168px; min-width: 130px; }.site-logo img { width: 100%; height: auto; }.site-nav ul { gap: 28px; }.site-nav a { color: var(--color-accent); font-family: var(--font-body); font-size: 14px; font-weight: 400; line-height: 21px; padding: 10px 0; border-bottom: 2px solid transparent; }.site-nav a:hover, .site-nav a.active { border-bottom-color: var(--color-accent); color: var(--color-accent); }.hamburger { width: 44px; height: 44px; align-items: center; justify-content: center; }.hamburger span { background: var(--color-text); }
.hero { position: relative; display: grid; min-height: 615px; overflow: hidden; background: var(--color-primary); isolation: isolate; }.hero::after { content: ""; position: absolute; inset: 0; z-index: -1; background: color-mix(in srgb, var(--color-primary) 70%, transparent); }.hero-slides { position: absolute; inset: 0; z-index: -2; }.hero-slide { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 3; opacity: 0; transition: opacity .5s cubic-bezier(.075,.82,.165,1); }.hero-slide.is-active { opacity: .3; }.hero-content { align-self: center; padding-top: 80px; padding-bottom: 80px; }.eyebrow { color: var(--color-text); font-size: 12px; font-weight: 500; letter-spacing: .5px; line-height: 22.8px; margin-bottom: 16px; }.hero h1 { max-width: 760px; font-family: var(--font-heading); font-size: 36px; font-weight: 700; letter-spacing: .5px; line-height: 1.5; margin: 0; }.hero-lead { max-width: 600px; font-size: 16px; font-weight: 300; line-height: 1.9; margin: 24px 0 32px; }.hero-actions { display: flex; flex-wrap: wrap; gap: 12px; }.button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; border: 1px solid transparent; border-radius: 100000px; font-size: 14px; font-weight: 400; line-height: 21px; padding: 10px 24px; transition: background-color .4s cubic-bezier(.165,.84,.44,1), color .4s cubic-bezier(.165,.84,.44,1), border-color .4s cubic-bezier(.165,.84,.44,1), opacity .4s cubic-bezier(.165,.84,.44,1); }.button-dark { background: var(--color-text); color: white; }.button-dark:hover { background: color-mix(in srgb, var(--color-text) 78%, var(--color-primary)); color: white; opacity: 1; }.button-light { background: white; color: var(--color-text); }.button-light:hover { background: color-mix(in srgb, white 75%, var(--color-primary)); color: var(--color-text); opacity: 1; }.button-outline { border-color: var(--color-text); color: var(--color-text); }.button-outline:hover { background: var(--color-text); color: white; opacity: 1; }
.section { padding: 80px 0; }.section-intro { margin-bottom: 40px; }.intro-center { margin-left: auto; margin-right: auto; max-width: 720px; text-align: center; }.section h2 { font-family: var(--font-heading); font-size: 28px; font-weight: 700; letter-spacing: .5px; line-height: 1.5; margin: 0; }.section-intro > p:last-child, .feature-copy > p:not(.eyebrow), .narrow-copy > p:last-child, .access-grid p, .benefit-grid p, .brand-intro > p:not(.eyebrow), .contact-prompt-card p { margin-top: 16px; }.service-grid, .category-grid { display: grid; gap: 20px; grid-template-columns: repeat(4, minmax(0, 1fr)); }.service-card, .category-card { background: white; border: 1px solid color-mix(in srgb, var(--color-text) 10%, var(--color-bg)); border-radius: 16px; overflow: hidden; }.service-card { padding: 0 24px 24px; }.service-card img, .category-card img, .gallery-grid img, .mini-gallery-grid img, .photo-pair img, .access-grid > img, .contact-prompt-card > img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }.service-card img { width: calc(100% + 48px); margin: 0 -24px 18px; }.service-card h3, .category-card h3 { font-family: var(--font-body); font-size: 14px; font-weight: 700; line-height: 1.95; margin: 0; }.service-card p { color: color-mix(in srgb, var(--color-text) 75%, var(--color-bg)); margin-top: 6px; }.statement { padding-top: 0; padding-bottom: 80px; }.statement-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; text-align: center; }.statement-grid p { font-family: var(--font-heading); font-size: 24px; font-weight: 700; line-height: 1.2; }
.split-layout { align-items: center; display: grid; gap: 80px; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }.photo-pair { display: grid; gap: 16px; grid-template-columns: 1.25fr .75fr; }.photo-pair img:last-child { margin-top: 56px; }.feature-copy { max-width: 480px; }.feature-copy h2 { margin-bottom: 20px; }.text-links { display: flex; flex-wrap: wrap; gap: 24px; margin-top: 28px; }.text-links a, .center-link a { border-bottom: 1px solid currentColor; font-size: 14px; line-height: 1.5; padding-bottom: 3px; }.wide-visual { margin: 0; overflow: hidden; }.wide-visual img { width: 100%; aspect-ratio: 3 / 1; object-fit: cover; }.blue-message { background: color-mix(in srgb, var(--color-primary) 22%, var(--color-bg)); padding: 110px 0; }.narrow-copy { max-width: 780px; }.narrow-copy h2 { font-size: 32px; }.category-card h3 { padding: 16px 20px 19px; }.center-link { margin-top: 32px; text-align: center; }.quiet-note { padding-bottom: 20px; padding-top: 0; text-align: center; }.quiet-note p { color: var(--color-secondary); font-size: 12px; line-height: 1.9; }.gallery-grid { display: grid; gap: 16px; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.information-section { padding-bottom: 48px; }.information-grid { display: grid; gap: 80px; grid-template-columns: .75fr 1.25fr; }.store-details { border-top: 1px solid color-mix(in srgb, var(--color-text) 14%, var(--color-bg)); }.store-details div { border-bottom: 1px solid color-mix(in srgb, var(--color-text) 14%, var(--color-bg)); display: grid; gap: 24px; grid-template-columns: 104px 1fr; padding: 16px 0; }.store-details dt { font-family: var(--font-heading); font-weight: 700; }.staff-section { padding-top: 48px; }.photo-pair-right { grid-template-columns: .75fr 1.25fr; }.photo-pair-right img:last-child { margin-top: 0; }.photo-pair-right img:first-child { margin-top: 56px; }.benefit-section { padding-top: 48px; }.benefit-grid { display: grid; gap: 40px; grid-template-columns: repeat(3, 1fr); }.benefit-grid article { border-top: 1px solid color-mix(in srgb, var(--color-text) 18%, var(--color-bg)); padding-top: 20px; }.benefit-grid h3 { font-family: var(--font-heading); font-size: 20px; font-weight: 500; line-height: 1.5; }.brand-intro { text-align: center; }.brand-intro > p:not(.eyebrow) { margin-bottom: 28px; }.access-grid { align-items: center; display: grid; gap: 64px; grid-template-columns: 1fr 1fr; }.access-grid > div { max-width: 460px; }.address { font-size: 14px; font-weight: 500; }.mini-gallery { padding-top: 56px; }.mini-gallery h2 { font-size: 20px; font-weight: 500; margin-bottom: 24px; }.mini-gallery-grid { display: grid; gap: 12px; grid-template-columns: repeat(6, minmax(0, 1fr)); }.contact-prompt { padding-bottom: 56px; }.contact-prompt-card { align-items: center; background: color-mix(in srgb, var(--color-primary) 14%, var(--color-bg)); display: grid; gap: 56px; grid-template-columns: 1fr 1fr; padding: 24px; }.contact-prompt-card h2 { margin-bottom: 16px; }.contact-band { background: color-mix(in srgb, var(--color-primary) 20%, var(--color-bg)); }.contact-band-grid { align-items: center; display: flex; gap: 24px; justify-content: space-between; }.contact-band h2 { font-size: 24px; }.contact-band p { font-size: 12px; margin-bottom: 4px; }.contact-actions { display: flex; flex-wrap: wrap; gap: 12px; }
@media (max-width: 991px) { .site-header .container { height: 72px; }.site-nav ul { gap: 16px; }.split-layout { gap: 48px; }.service-grid, .category-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }.mini-gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 767px) { .container { padding-left: 20px; padding-right: 20px; }.site-header .container { height: 68px; }.site-logo { width: 148px; }.hamburger { display: flex; }.site-nav { display: none; left: 0; max-height: calc(100vh - 68px); overflow-y: auto; padding: 12px 20px; position: absolute; right: 0; top: 68px; background: var(--color-bg); border-top: 1px solid color-mix(in srgb, var(--color-text) 10%, var(--color-bg)); box-shadow: 0 4px 16px color-mix(in srgb, black 12%, transparent); }.site-nav.open { display: block; }.site-nav ul { align-items: stretch; flex-direction: column; gap: 0; }.site-nav a { align-items: center; border-bottom: 1px solid color-mix(in srgb, var(--color-text) 10%, var(--color-bg)); display: flex; min-height: 44px; padding: 10px 0; }.hero { min-height: 530px; }.hero-content { padding-bottom: 64px; padding-top: 64px; }.hero h1 { font-size: 25px; line-height: 1.5; word-break: keep-all; }.hero-lead { font-size: 14px; margin-bottom: 28px; }.section { padding: 64px 0; }.section h2, .narrow-copy h2 { font-size: 22px; line-height: 1.5; word-break: keep-all; }.eyebrow { margin-bottom: 12px; }.service-grid, .category-grid { gap: 12px; }.service-card { padding: 0 16px 18px; }.service-card img { width: calc(100% + 32px); margin: 0 -16px 14px; }.statement { padding-bottom: 64px; }.statement-grid { gap: 22px; grid-template-columns: 1fr; }.statement-grid p { font-size: 20px; }.split-layout, .access-grid, .information-grid, .contact-prompt-card { gap: 32px; grid-template-columns: 1fr; }.photo-pair { gap: 12px; }.photo-pair img:last-child, .photo-pair-right img:first-child { margin-top: 32px; }.reverse-mobile .feature-copy { order: 2; }.wide-visual img { aspect-ratio: 4 / 3; }.blue-message { padding: 80px 0; }.gallery-grid { gap: 10px; grid-template-columns: repeat(2, minmax(0, 1fr)); }.information-section { padding-bottom: 32px; }.store-details div { gap: 8px; grid-template-columns: 1fr; }.benefit-grid { gap: 28px; grid-template-columns: 1fr; }.benefit-section { padding-top: 32px; }.mini-gallery-grid { gap: 8px; grid-template-columns: repeat(2, minmax(0, 1fr)); }.contact-prompt-card { padding: 16px; }.contact-prompt-card > img { order: 2; }.contact-prompt-card h2 br { display: none; }.contact-band-grid { align-items: flex-start; flex-direction: column; }.contact-band h2 { font-size: 22px; }.contact-actions { width: 100%; }.contact-actions .button { flex: 1; } }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto; transition-duration: 0.01ms; } }

/* Footer brand elements shared by every page. */
.site-footer .footer-brand { min-width: 0; }
.site-footer .footer-logo-img { display: block; width: auto; max-width: 100%; height: 38px; margin-bottom: 0.6rem; object-fit: contain; }
.site-footer .footer-privacy { display: inline-block; color: inherit; white-space: nowrap; }
@media (max-width: 767px) {
  .site-footer .footer-privacy { margin-left: 0 !important; }
}

/* sm-page-hero */
/* 下層ページの見出しの帯(全ページ共通。正本 = faq の帯。高さは PC 390px / スマホ 300px。unify-page-hero.js) */
.smph-container { width: min(1200px, 100%); margin: 0px auto; padding: 0px 20px; }
.site-header .smph-container { height: 80px; gap: 32px; }
.smph-hero { position: relative; display: grid; min-height: 615px; overflow: hidden; background: var(--color-primary); isolation: isolate; }
.smph-hero::after { content: ""; position: absolute; inset: 0px; z-index: -1; background: color-mix(in srgb, var(--color-primary) 70%, transparent); }
.smph.smph-hero-slides { position: absolute; inset: 0px; z-index: -2; }
.smph-hero-slide { position: absolute; inset: 0px; width: 100%; height: 100%; object-fit: cover; aspect-ratio: 4 / 3; opacity: 0; transition: opacity 0.5s cubic-bezier(0.075, 0.82, 0.165, 1); }
.smph-hero-slide.smph-is-active { opacity: 0.3; }
.smph-hero-content { align-self: center; padding-top: 80px; padding-bottom: 80px; }
.smph-eyebrow { color: var(--color-text); font-size: 12px; font-weight: 500; letter-spacing: 0.5px; line-height: 22.8px; margin-bottom: 16px; }
.smph-hero h1 { max-width: 760px; font-family: var(--font-heading); font-size: 36px; font-weight: 700; letter-spacing: 0.5px; line-height: 1.5; margin: 0px; }
.smph-hero-lead { max-width: 600px; font-size: 16px; font-weight: 300; line-height: 1.9; margin: 24px 0px 32px; }
.section-intro > p:last-child, .feature-copy > p:not(.smph-eyebrow), .narrow-copy > p:last-child, .access-grid p, .benefit-grid p, .brand-intro > p:not(.smph-eyebrow), .contact-prompt-card p { margin-top: 16px; }
.brand-intro > p:not(.smph-eyebrow) { margin-bottom: 28px; }
@media (max-width: 991px) {.site-header .smph-container { height: 72px; }}
@media (max-width: 767px) {.smph-container { padding-left: 20px; padding-right: 20px; } .site-header .smph-container { height: 68px; } .smph-hero { min-height: 530px; } .smph-hero-content { padding-bottom: 64px; padding-top: 64px; } .smph-hero h1 { font-size: 25px; line-height: 1.5; word-break: keep-all; } .smph-hero-lead { font-size: 14px; margin-bottom: 28px; } .smph-eyebrow { margin-bottom: 12px; }}
.smph-faq.smph-hero { min-height: 420px; }
.smph-faq.smph-hero .smph-hero-slide.smph-is-active { opacity: 0.3; }
@media (max-width: 767px) {.smph-faq.smph-hero { min-height: 360px; }}
[data-sm-page-hero] [data-smph-media]{height:390px !important;min-height:0 !important;max-height:none !important;aspect-ratio:auto !important;overflow:hidden !important;}
[data-sm-page-hero] > :only-child{max-width:none !important;width:100% !important;margin-left:0 !important;margin-right:0 !important;}
[data-sm-page-hero] img{width:100% !important;height:100% !important;max-width:none !important;max-height:none !important;object-fit:cover !important;aspect-ratio:auto !important;}
[data-sm-page-hero]{height:auto !important;min-height:390px !important;max-height:none !important;}
@media (max-width: 767px){[data-sm-page-hero]{min-height:300px !important;}[data-sm-page-hero] [data-smph-media]{height:300px !important;}}

/* 下層ページの見出しの大きさを全ページでそろえる(unify-page-headings.js が実測の最多値から書く) */
[data-sm-page-title]{font-size:36px !important;line-height:54px !important;letter-spacing:0.5px !important;font-weight:700 !important;}
[data-sm-section-title]{font-size:28px !important;line-height:42px !important;letter-spacing:0.5px !important;font-weight:700 !important;}
@media (max-width: 767px){[data-sm-page-title]{font-size:25px !important;line-height:37.5px !important;letter-spacing:0.5px !important;font-weight:700 !important;}[data-sm-section-title]{font-size:22px !important;line-height:33px !important;letter-spacing:0.5px !important;font-weight:700 !important;}}

/* sm-normalize */
/* セクションの写真の縦横比をそろえる・スマホで狭すぎる段組みを1列に・見出しを文節で折り返す(normalize-sections.js) */
[data-sm-ratio]{aspect-ratio:1 / 0.7500 !important;height:auto !important;min-height:0 !important;max-height:none !important;}
img[data-sm-ratio]{width:100% !important;object-fit:cover !important;display:block;}
[data-sm-gallery]{display:grid !important;grid-template-columns:repeat(3,minmax(0,1fr)) !important;grid-auto-rows:auto !important;gap:16px !important;}
[data-sm-gallery] > *{grid-column:auto !important;grid-row:auto !important;width:auto !important;height:auto !important;margin:0 !important;position:relative !important;}
@media (min-width: 768px){[data-sm-gx-pc]{display:none !important;}}
@media (max-width: 767px){[data-sm-gallery]{grid-template-columns:repeat(2,minmax(0,1fr)) !important;gap:8px !important;}[data-sm-gx-sp]{display:none !important;}}

[data-sm-imgbox]{height:auto !important;min-height:0 !important;max-height:none !important;}
@media (max-width: 767px){[data-sm-sp1]{display:grid !important;grid-template-columns:1fr !important;gap:24px !important;}[data-sm-sp1] > *{width:auto !important;max-width:none !important;flex:none !important;grid-column:auto !important;}}
@media (max-width: 767px){[data-sm-sp-tall]{aspect-ratio:4 / 5 !important;height:auto !important;min-height:0 !important;max-height:none !important;}img[data-sm-sp-tall]{width:100% !important;object-fit:cover !important;}}
h1, h2, h3{word-break:auto-phrase;text-wrap:balance;}
[data-sm-hero-box="media"]{height:720px !important;min-height:0 !important;max-height:none !important;aspect-ratio:auto !important;}
[data-sm-hero-box="media"] > *{height:100% !important;min-height:0 !important;}
[data-sm-hero-wide]{max-width:none !important;width:100% !important;margin-left:0 !important;margin-right:0 !important;}
[data-sm-hero-box="section"]{height:auto !important;min-height:720px !important;max-height:none !important;}
img[data-sm-hero-img]{width:100% !important;height:100% !important;object-fit:cover !important;}
@media (max-width: 767px){[data-sm-hero-box="media"]{height:420px !important;}[data-sm-hero-box="section"]{min-height:420px !important;}}
.site-footer .footer-nav ul{display:grid !important;grid-auto-flow:column !important;grid-template-rows:repeat(5, auto) !important;grid-auto-columns:max-content !important;column-gap:clamp(24px, 3vw, 48px) !important;row-gap:0 !important;}
.site-footer .footer-nav li{margin:0 0 0.4rem !important;}
@media (min-width: 768px){.site-footer .footer-grid{grid-template-columns:minmax(0, 1.4fr) auto minmax(0, 1fr) !important;}}
@media (min-width: 768px){.site-header:not(.nav-collapsed) .site-nav ul{display:flex !important;flex-wrap:nowrap !important;grid-template-columns:none !important;align-items:center !important;gap:0 clamp(14px, 1.6vw, 28px) !important;}.site-header:not(.nav-collapsed) .site-nav li{flex:none !important;}.site-header:not(.nav-collapsed) .site-nav a{white-space:nowrap !important;}}

/* sm-reveal */
/* セクションのフェードイン(common.js が画面に入った .fade-in に .visible を付ける。add-section-reveal.js) */
.sm-js .fade-in{opacity:0;transform:translateY(20px);transition:opacity 0.9s ease,transform 0.9s ease;}
.sm-js .fade-in.visible{opacity:1;transform:none;}
@media (prefers-reduced-motion: reduce){.fade-in, .fade-in > *{opacity:1 !important;transform:none !important;transition:none !important;}}
