/**
 * LP 実装用（style.css の後に読み込み）
 * ブレイクポイント・フォント・カラーは :root の変数で統一する。
 */

/* -------------------------------------------------------------------------
   デザイントークン（必要に応じて値のみ変更）
   ------------------------------------------------------------------------- */
:root {
    /* ====================
       Color
    ==================== */
    /* Primary */
    --primary-1: #fefdfc;
    --primary-2: #fbf9f7;
    --primary-3: #f3efec;
    --primary-4: #ece7e2;
    --primary-5: #e6ded7;
    --primary-6: #dfd5cc;
    --primary-7: #d5c7bb;
    --primary-8: #c2b3a6;
    --primary-9: #97897c;
    --primary-10: #8a7d70;
    --primary-11: #6e6156;
    --primary-12: #2b2723;

    /* Secondary */
    --secondary-1: #fcfefc;
    --secondary-2: #f5faf7;
    --secondary-3: #e8f6ee;
    --secondary-4: #daefe3;
    --secondary-5: #cae7d6;
    --secondary-6: #b6dbc6;
    --secondary-7: #9bcbb1;
    --secondary-8: #75b594;
    --secondary-9: #458b69;
    --secondary-10: #29805a;
    --secondary-11: #357b5a;
    --secondary-12: #253a2e;

    /* Tertiary */
    --tertiary-1: #fffcfc;
    --tertiary-2: #fff8f7;
    --tertiary-3: #feebe7;
    --tertiary-4: #ffdcd3;
    --tertiary-5: #ffcdc2;
    --tertiary-6: #fdbdaf;
    --tertiary-7: #f5a898;
    --tertiary-8: #ec8e7b;
    --tertiary-9: #e54d2e;
    --tertiary-10: #dd4425;
    --tertiary-11: #d13415;
    --tertiary-12: #5c271f;

    /* Neutral */
    --neutral-black: #3d3d3d;
    --neutral-white: #ffffff;
    --neutral-gray-1: #fcfcfc;
    --neutral-gray-2: #f9f9f9;
    --neutral-gray-3: #efefef;
    --neutral-gray-4: #e8e8e8;
    --neutral-gray-5: #e0e0e0;
    --neutral-gray-6: #d8d8d8;
    --neutral-gray-7: #cecece;
    --neutral-gray-8: #bbbbbb;
    --neutral-gray-9: #8d8d8d;
    --neutral-gray-10: #838383;
    --neutral-gray-11: #646464;
    --neutral-gray-12: #202020;

    /* Status (Error) */
    --error-1: var(--tertiary-1);
    --error-2: var(--tertiary-2);
    --error-3: var(--tertiary-3);
    --error-4: var(--tertiary-4);
    --error-5: var(--tertiary-5);
    --error-6: var(--tertiary-6);
    --error-7: var(--tertiary-7);
    --error-8: var(--tertiary-8);
    --error-9: var(--tertiary-9);
    --error-10: var(--tertiary-10);
    --error-11: var(--tertiary-11);
    --error-12: var(--tertiary-12);

    /* レイアウト */
    --pc-body-width-max: 1440px;
    --sp-body-width-max: 640px;
    /* 未定
    --pc-content-width-max: 1152px; 
    --sp-content-width-max: 500px;
    --container-padding-x: clamp(20px, 4vw, 114px); */

    /* ====================
       Typography（Figma 415:918）
       letterSpacing: 3 → 0.03em
    ==================== */
    --font-serif: "Noto Serif JP", serif;
    --font-sans: "Noto Sans JP", sans-serif;
    /* 欧文（ヘッダーナビ・セクションキッカー等）— 行田店: Zen Kaku Gothic New */
    --font-latin: "Zen Kaku Gothic New", sans-serif;

    --font-size-5xl: 3rem; /* 48px */
    --font-size-4xl: 2.25rem; /* 36px */
    --font-size-3xl: 1.875rem; /* 30px */
    --font-size-2xl: 1.5rem; /* 24px */
    --font-size-xl: 1.25rem; /* 20px */
    --font-size-lg: 1.125rem; /* 18px */
    --font-size-base: 1rem; /* 16px */
    --font-size-sm: 0.9375rem; /* 15px */
    --font-size-xs: 0.875rem; /* 14px */
    --font-size-2xs: 0.75rem; /* 12px */

    --font-weight-regular: 400;
    --font-weight-bold: 700;

    --leading-heading: 1.5;
    --leading-body: 1.8;
    --leading-oneline: 1;

    --tracking-default: 0.03em;
}

/* -------------------------------------------------------------------------
   Typography コンポジット（プリミティブを組み合わせたテキストスタイル）
   ------------------------------------------------------------------------- */

/* Heading — Noto Serif JP / Regular / leading 1.5 */
.text-ja-heading-5xl,
.text-ja-heading-4xl,
.text-ja-heading-3xl,
.text-ja-heading-2xl,
.text-ja-heading-xl,
.text-ja-heading-lg,
.text-ja-heading-base,
.text-ja-heading-sm,
.text-ja-heading-xs {
    font-family: var(--font-serif);
    font-weight: var(--font-weight-regular);
    line-height: var(--leading-heading);
    letter-spacing: var(--tracking-default);
}
.text-ja-heading-5xl {
    font-size: var(--font-size-5xl);
}
.text-ja-heading-4xl {
    font-size: var(--font-size-4xl);
}
.text-ja-heading-3xl {
    font-size: var(--font-size-3xl);
}
.text-ja-heading-2xl {
    font-size: var(--font-size-2xl);
}
.text-ja-heading-xl {
    font-size: var(--font-size-xl);
}
.text-ja-heading-lg {
    font-size: var(--font-size-lg);
}
.text-ja-heading-base {
    font-size: var(--font-size-base);
}
.text-ja-heading-sm {
    font-size: var(--font-size-sm);
}
.text-ja-heading-xs {
    font-size: var(--font-size-xs);
}

/* Bodyのとさんず — Noto Sans JP / leading 1.8 */
.text-ja-body-sans-xl-b,
.text-ja-body-sans-lg-b,
.text-ja-body-sans-base-b,
.text-ja-body-sans-sm-b,
.text-ja-body-sans-xs-b,
.text-ja-body-sans-2xs-b,
.text-ja-body-sans-xl-r,
.text-ja-body-sans-lg-r,
.text-ja-body-sans-base-r,
.text-ja-body-sans-sm-r,
.text-ja-body-sans-xs-r,
.text-ja-body-sans-2xs-r {
    font-family: var(--font-sans);
    line-height: var(--leading-body);
    letter-spacing: var(--tracking-default);
}
.text-ja-body-sans-xl-b,
.text-ja-body-sans-lg-b,
.text-ja-body-sans-base-b,
.text-ja-body-sans-sm-b,
.text-ja-body-sans-xs-b,
.text-ja-body-sans-2xs-b {
    font-weight: var(--font-weight-bold);
}
.text-ja-body-sans-xl-r,
.text-ja-body-sans-lg-r,
.text-ja-body-sans-base-r,
.text-ja-body-sans-sm-r,
.text-ja-body-sans-xs-r,
.text-ja-body-sans-2xs-r {
    font-weight: var(--font-weight-regular);
}
.text-ja-body-sans-xl-b,
.text-ja-body-sans-xl-r {
    font-size: var(--font-size-xl);
}
.text-ja-body-sans-lg-b,
.text-ja-body-sans-lg-r {
    font-size: var(--font-size-lg);
}
.text-ja-body-sans-base-b,
.text-ja-body-sans-base-r {
    font-size: var(--font-size-base);
}
.text-ja-body-sans-sm-b,
.text-ja-body-sans-sm-r {
    font-size: var(--font-size-sm);
}
.text-ja-body-sans-xs-b,
.text-ja-body-sans-xs-r {
    font-size: var(--font-size-xs);
}
.text-ja-body-sans-2xs-b,
.text-ja-body-sans-2xs-r {
    font-size: var(--font-size-2xs);
}

/* Body — Noto Serif JP / leading 1.8 */
.text-ja-body-lg-b,
.text-ja-body-base-b,
.text-ja-body-sm-b,
.text-ja-body-xs-b,
.text-ja-body-2xs-b,
.text-ja-body-lg-r,
.text-ja-body-base-r,
.text-ja-body-sm-r,
.text-ja-body-xs-r,
.text-ja-body-2xs-r {
    font-family: var(--font-serif);
    line-height: var(--leading-body);
    letter-spacing: var(--tracking-default);
}
.text-ja-body-lg-b,
.text-ja-body-base-b,
.text-ja-body-sm-b,
.text-ja-body-xs-b,
.text-ja-body-2xs-b {
    font-weight: var(--font-weight-bold);
}
.text-ja-body-lg-r,
.text-ja-body-base-r,
.text-ja-body-sm-r,
.text-ja-body-xs-r,
.text-ja-body-2xs-r {
    font-weight: var(--font-weight-regular);
}
.text-ja-body-lg-b,
.text-ja-body-lg-r {
    font-size: var(--font-size-lg);
}
.text-ja-body-base-b,
.text-ja-body-base-r {
    font-size: var(--font-size-base);
}
.text-ja-body-sm-b,
.text-ja-body-sm-r {
    font-size: var(--font-size-sm);
}
.text-ja-body-xs-b,
.text-ja-body-xs-r {
    font-size: var(--font-size-xs);
}
.text-ja-body-2xs-b,
.text-ja-body-2xs-r {
    font-size: var(--font-size-2xs);
}

/* Oneline — Noto Serif JP / leading 1 */
.text-ja-oneline-lg-b,
.text-ja-oneline-base-b,
.text-ja-oneline-sm-b,
.text-ja-oneline-xs-b,
.text-ja-oneline-2xs-b,
.text-ja-oneline-lg-r,
.text-ja-oneline-base-r,
.text-ja-oneline-sm-r,
.text-ja-oneline-xs-r,
.text-ja-oneline-2xs-r {
    font-family: var(--font-serif);
    line-height: var(--leading-oneline);
    letter-spacing: var(--tracking-default);
}
.text-ja-oneline-lg-b,
.text-ja-oneline-base-b,
.text-ja-oneline-sm-b,
.text-ja-oneline-xs-b,
.text-ja-oneline-2xs-b {
    font-weight: var(--font-weight-bold);
}
.text-ja-oneline-lg-r,
.text-ja-oneline-base-r,
.text-ja-oneline-sm-r,
.text-ja-oneline-xs-r,
.text-ja-oneline-2xs-r {
    font-weight: var(--font-weight-regular);
}
.text-ja-oneline-lg-b,
.text-ja-oneline-lg-r {
    font-size: var(--font-size-lg);
}
.text-ja-oneline-base-b,
.text-ja-oneline-base-r {
    font-size: var(--font-size-base);
}
.text-ja-oneline-sm-b,
.text-ja-oneline-sm-r {
    font-size: var(--font-size-sm);
}
.text-ja-oneline-xs-b,
.text-ja-oneline-xs-r {
    font-size: var(--font-size-xs);
}
.text-ja-oneline-2xs-b,
.text-ja-oneline-2xs-r {
    font-size: var(--font-size-2xs);
}

/* -------------------------------------------------------------------------
   欧文 UI（ヘッダーナビ・セクション英字タイトル・フッター付近の英語）
   行田店: Zen Kaku Gothic New / 川越・鶴ヶ島: Plus Jakarta Sans（店舗 override）
   ------------------------------------------------------------------------- */
.site-header__nav-link,
.site-header__dropdown-link,
.site-header__drawer-link,
.site-header__drawer-sub-link,
.fv__kicker-text,
.about__kicker-text,
.section-header__kicker-text,
.exterior__kicker-text,
.access__kicker-text,
.form-page-kicker-text,
.thanks-kicker-text,
.bottom-nav__kicker {
    font-family: var(--font-latin);
}

.sp-only {
    display: none;
}
@media (max-width: 1023px) {
    .sp-only {
        display: block;
    }
}

.pc-only {
    display: block;
}
@media (max-width: 1023px) {
    .pc-only {
        display: none;
    }
}

/* -------------------------------------------------------------------------
   ベース
   ------------------------------------------------------------------------- */
*,
*::before,
*::after {
    box-sizing: border-box;
    margin: 0;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: middle;
}

@media (prefers-reduced-motion: no-preference) {
    html {
        scroll-behavior: smooth;
    }
}

/* -------------------------------------------------------------------------
   site-header
   ------------------------------------------------------------------------- */
.site-header {
    position: sticky;
    top: 0;
    z-index: 100;
    background-color: var(--primary-4);
}

.site-header__inner {
    position: relative;
    z-index: 102;
    display: flex;
    align-items: center;
    justify-content: space-between;
    max-width: var(--pc-body-width-max);
    height: 80px;
    margin-inline: auto;
    padding-inline: 80px;
    background-color: var(--primary-4);
    backdrop-filter: blur(8px);
}
@media (max-width: 1147px) {
    .site-header__inner {
        min-height: 68px;
        height: auto;
        padding-inline: 16px;
    }
}

.site-header__logo {
    display: block;
    flex-shrink: 0;
    width: 153px;
}
@media (max-width: 1147px) {
    .site-header__logo {
        width: 100px;
    }
}

.site-header__logo img {
    display: block;
    width: 100%;
    height: auto;
}

.site-header__pc {
    display: flex;
    align-items: stretch;
    gap: 32px;
    height: 100%;
}
@media (max-width: 1147px) {
    .site-header__pc {
        display: none;
    }
}

.site-header__sp {
    display: none;
}
@media (max-width: 1147px) {
    .site-header__sp {
        display: flex;
        align-items: center;
        gap: 16px;
    }
}

.site-header__nav {
    display: flex;
    height: 100%;
}

.site-header__nav-list {
    display: flex;
    align-items: stretch;
    gap: 24px;
    height: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

.site-header__nav-item {
    position: relative;
    display: flex;
    align-items: center;
}

.site-header__nav-item--has-dropdown {
    display: flex;
    align-items: center;
}

/* ヘッダーとドロップダウンの 4px 隙間でも hover を維持する透過ヒット領域 */
.site-header__nav-item--has-dropdown::after {
    content: "";
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    z-index: 11;
    height: 4px;
}

.site-header__nav-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
    min-height: 32px;
    padding-left: 4px;
    color: var(--neutral-black);
    text-decoration: none;
    white-space: nowrap;
}

.site-header__nav-link::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 1px;
    background-color: var(--neutral-black);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.3s ease-in-out;
}

.site-header__nav-link:hover::after,
.site-header__nav-link:focus-visible::after,
.site-header__nav-item--has-dropdown:hover > .site-header__nav-link::after,
.site-header__nav-item--has-dropdown:focus-within
    > .site-header__nav-link::after {
    transform: scaleX(1);
}

.site-header__nav-link--dropdown {
    gap: 4px;
}

.site-header__nav-arrow {
    flex-shrink: 0;
    transition: transform 0.3s ease-in-out;
}

.site-header__nav-item--has-dropdown:hover .site-header__nav-arrow,
.site-header__nav-item--has-dropdown:focus-within .site-header__nav-arrow {
    transform: rotate(180deg);
}

.site-header__dropdown {
    position: absolute;
    top: calc(100% + 4px);
    left: 50%;
    z-index: 10;
    display: flex;
    flex-direction: column;
    gap: 20px;
    margin: 0;
    padding: 20px 32px;
    list-style: none;
    background-color: var(--primary-4);
    border-radius: 4px;
    backdrop-filter: blur(8px);
    transform: translateX(-50%);
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    transition:
        opacity 0.2s ease-in-out,
        visibility 0.2s ease-in-out;
}

.site-header__nav-item--has-dropdown:hover .site-header__dropdown,
.site-header__nav-item--has-dropdown:focus-within .site-header__dropdown {
    visibility: visible;
    opacity: 1;
    pointer-events: auto;
}

.site-header__dropdown-link {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 32px;
    color: var(--neutral-black);
    text-decoration: none;
    white-space: nowrap;
}

.site-header__dropdown-link::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: 0;
    left: 0;
    height: 1px;
    background-color: var(--neutral-black);
    transform: scaleX(0);
    transform-origin: center;
    transition: transform 0.3s ease-in-out;
}

.site-header__dropdown-link:hover::after,
.site-header__dropdown-link:focus-visible::after {
    transform: scaleX(1);
}

.site-header__divider {
    flex-shrink: 0;
    align-self: center;
    width: 1px;
    height: 32px;
    background-color: var(--neutral-gray-7);
}

.site-header__cta {
    display: flex;
    align-items: center;
    align-self: center;
    gap: 24px;
}

.site-header__phone {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 52px;
    color: var(--neutral-black);
    white-space: nowrap;
}

.site-header__pc .button {
    min-width: 180px;
    min-height: 52px;
    padding: 14px 40px;
    font-size: var(--font-size-base);
}

/* ヘッダー SP CTA */
.site-header__sp .button {
    width: 110px;
    min-width: 0;
    min-height: 0;
    padding: 10px 16px;
    font-size: var(--font-size-2xs);
}

.site-header__hamburger {
    position: relative;
    z-index: 103;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    width: 48px;
    min-width: 48px;
    height: 48px;
    min-height: 48px;
    padding: 0;
    cursor: pointer;
    background: transparent;
    border: none;
    border-radius: 0 0 4px 4px;
}

.site-header__hamburger-bar {
    display: block;
    width: 48px;
    height: 2px;
    background-color: var(--primary-11);
    transform-origin: center;
    transition:
        transform 0.3s ease-in-out,
        margin 0.3s ease-in-out,
        opacity 0.3s ease-in-out;
}

.site-header__hamburger.is-active .site-header__hamburger-bar {
    position: absolute;
    margin: 0;
}

.site-header__hamburger.is-active .site-header__hamburger-bar:first-child {
    transform: rotate(30deg);
}

.site-header__hamburger.is-active .site-header__hamburger-bar:last-child {
    transform: rotate(-30deg);
}

.site-header__overlay {
    display: none;
}

.site-header__drawer {
    display: none;
}

@media (max-width: 1147px) {
    .site-header__overlay {
        position: fixed;
        inset: 0;
        z-index: 100;
        display: block;
        width: 100%;
        height: 100dvh;
        background-color: rgba(0, 0, 0, 0.3);
        visibility: hidden;
        opacity: 0;
        transition:
            opacity 0.3s ease-in-out,
            visibility 0.3s ease-in-out;
    }

    .site-header.is-menu-open .site-header__overlay {
        visibility: visible;
        opacity: 1;
    }

    .site-header__overlay[hidden] {
        display: none;
    }

    .site-header.is-menu-open .site-header__overlay[hidden] {
        display: block;
    }

    .site-header__drawer {
        position: fixed;
        top: 0;
        right: 0;
        bottom: 0;
        z-index: 101;
        display: flex;
        flex-direction: column;
        gap: 32px;
        width: 80%;
        max-width: 80vw;
        height: 100dvh;
        padding: 112px 24px 32px;
        overflow-y: auto;
        background-color: var(--primary-5);
        backdrop-filter: blur(8px);
        transform: translateX(100%);
        visibility: hidden;
        transition:
            transform 0.3s ease-in-out,
            visibility 0.3s ease-in-out;
    }

    .site-header.is-menu-open .site-header__drawer {
        transform: translateX(0);
        visibility: visible;
    }

    .site-header__drawer[aria-hidden="true"] {
        pointer-events: none;
    }

    .site-header.is-menu-open .site-header__drawer {
        pointer-events: auto;
    }
}

.site-header__drawer-list {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

.site-header__drawer-item {
    border-bottom: 1px solid rgba(32, 32, 30, 0.1);
}

.site-header__drawer-item--has-sub {
    border-bottom: none;
}

.site-header__drawer-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 32px;
    padding: 12px 0;
    color: var(--primary-11);
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    background: transparent;
    border: none;
}

.site-header__drawer-sub {
    display: flex;
    flex-direction: column;
    width: 100%;
    margin: 0;
    padding: 0 0 0 20px;
    list-style: none;
    border-bottom: 1px solid rgba(32, 32, 30, 0.1);
}

.site-header__drawer-sub-link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    min-height: 32px;
    padding: 12px 0;
    color: var(--primary-11);
    text-decoration: none;
}

.site-header__drawer-sub-label {
    display: inline-flex;
    gap: 8px;
    align-items: center;
}

.site-header__drawer-sub-dash {
    display: block;
    flex-shrink: 0;
    width: 4px;
    height: 1px;
    background-color: var(--primary-11);
}

.site-header__drawer-cta {
    width: 100%;
}

body.is-menu-open {
    overflow: hidden;
}

/* -------------------------------------------------------------------------
   fv
   ------------------------------------------------------------------------- */
.fv {
    position: relative;
    background-image: url("../images/gyota/fv/img-fv.webp");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.fv::before {
    position: absolute;
    inset: 0;
    z-index: 0;
    content: "";
    background-color: rgba(0, 0, 0, 0.35);
    pointer-events: none;
}

.fv__inner {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: flex-start;
    max-width: var(--pc-body-width-max);
    height: 820px;
    margin-inline: auto;
    padding: 244px 120px 0;
}
@media (max-width: 1023px) {
    .fv__inner {
        align-items: center;
        height: 627px;
        max-width: var(--sp-body-width-max);
        padding: 20px;
    }
}

.fv__contents {
    display: flex;
    flex-direction: column;
    gap: 52px;
    align-items: flex-start;
}
@media (max-width: 1023px) {
    .fv__contents {
        gap: 40px;
        width: 100%;
    }
}

.fv__text {
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: flex-start;
}
@media (max-width: 1023px) {
    .fv__text {
        width: 100%;
    }
}

.fv__kicker {
    display: flex;
    gap: 16px;
    align-items: center;
}
@media (max-width: 1023px) {
    .fv__kicker {
        gap: 12px;
    }
}

.fv__kicker-line {
    flex-shrink: 0;
    width: 30px;
    height: 1px;
    background-color: var(--primary-1);
}

.fv__kicker-text {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-regular);
    line-height: var(--leading-body);
    letter-spacing: var(--tracking-default);
    color: var(--primary-1);
    white-space: nowrap;
}
@media (max-width: 1023px) {
    .fv__kicker-text {
        font-size: var(--font-size-2xs);
    }
}

.fv__heading {
    font-family: var(--font-serif);
    font-size: 4.25rem;
    font-weight: var(--font-weight-regular);
    line-height: var(--leading-heading);
    color: var(--neutral-white);
    text-shadow: 0 2px 3px rgba(133, 121, 114, 0.9);
}
@media (max-width: 1023px) {
    .fv__heading {
        font-size: var(--font-size-3xl);
        letter-spacing: var(--tracking-default);
        text-shadow: 0 2px 3px #857972;
    }
}

/* Figma: 「ち」「」」の字間調整 */
.fv__heading-tight-chi {
    letter-spacing: -4.8px;
}
@media (max-width: 1023px) {
    .fv__heading-tight-chi {
        letter-spacing: -9px;
    }
}

.fv__heading-tight-bracket {
    letter-spacing: -3.04px;
}
@media (max-width: 1023px) {
    .fv__heading-tight-bracket {
        letter-spacing: var(--tracking-default);
    }
}

.fv__lead {
    font-family: var(--font-serif);
    font-size: 1.75rem;
    font-weight: var(--font-weight-regular);
    line-height: var(--leading-body);
    letter-spacing: var(--tracking-default);
    color: var(--neutral-white);
    text-shadow: 0 2px 3px rgba(133, 121, 114, 0.8);
}
@media (max-width: 1023px) {
    .fv__lead {
        font-size: var(--font-size-base);
        text-shadow: 0 2px 3px #857972;
    }
}

.fv__cta {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

/* -------------------------------------------------------------------------
   about
   ------------------------------------------------------------------------- */
.about {
    background-color: var(--primary-1);
}

.about__inner {
    display: flex;
    align-items: center;
    max-width: var(--pc-body-width-max);
    margin-inline: auto;
    padding: 120px 0;
}
@media (max-width: 1023px) {
    .about__inner {
        flex-direction: column;
        max-width: var(--sp-body-width-max);
        padding: 0;
    }
}

.about__content {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 24px;
    align-items: flex-start;
    min-width: 0;
    padding: 0 64px 0 120px;
}
@media (max-width: 1023px) {
    .about__content {
        width: 100%;
        padding: 48px 20px;
    }
}

.about__kicker {
    display: flex;
    gap: 16px;
    align-items: center;
}

.about__kicker-line {
    flex-shrink: 0;
    width: 30px;
    height: 1px;
    background-color: var(--primary-9);
}

.about__kicker-text {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-regular);
    line-height: var(--leading-body);
    letter-spacing: var(--tracking-default);
    color: var(--primary-9);
    white-space: nowrap;
}
@media (max-width: 1023px) {
    .about__kicker-text {
        font-size: var(--font-size-xs);
    }
}

.about__heading {
    font-family: var(--font-serif);
    font-size: var(--font-size-3xl);
    font-weight: var(--font-weight-regular);
    line-height: var(--leading-heading);
    letter-spacing: var(--tracking-default);
    color: var(--neutral-black);
}
@media (max-width: 1023px) {
    .about__heading {
        font-size: var(--font-size-2xl);
    }
}

.about__separator {
    display: block;
    width: 50px;
    height: 1px;
    background-color: var(--primary-9);
}

.about__body {
    font-family: var(--font-sans);
    font-size: var(--font-size-xs);
    font-weight: var(--font-weight-regular);
    line-height: var(--leading-body);
    letter-spacing: var(--tracking-default);
    color: var(--primary-11);
}

.about__photo {
    flex: 1;
    min-width: 0;
    aspect-ratio: 5 / 4;
    margin: 0;
    overflow: hidden;
}
@media (max-width: 1023px) {
    .about__photo {
        width: 100%;
        flex: none;
    }
}

.about__photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* -------------------------------------------------------------------------
   button
   ------------------------------------------------------------------------- */
.button {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    min-width: 180px;
    min-height: 52px;
    padding: 14px 40px;
    font-family: var(--font-serif);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-regular);
    line-height: var(--leading-oneline);
    letter-spacing: var(--tracking-default);
    text-decoration: none;
    white-space: nowrap;
    border-radius: 26px;
    border-style: solid;
    border-width: 1px;
    transition:
        background-color 0.3s ease-in-out,
        color 0.3s ease-in-out,
        border-color 0.3s ease-in-out;
}

.button img {
    flex-shrink: 0;
    transition: filter 0.3s ease-in-out;
}

.button--fill {
    width: 100%;
}

.button--primary {
    color: var(--primary-11);
    background-color: var(--primary-1);
    border-color: var(--primary-11);
}

.button--primary:hover,
.button--primary:focus-visible {
    color: var(--primary-1);
    background-color: var(--primary-11);
    border-color: var(--primary-11);
}

.button--primary:hover img,
.button--primary:focus-visible img {
    filter: brightness(0) invert(1);
}

.button--secondary {
    color: var(--primary-1);
    background-color: rgba(61, 61, 61, 0.8);
    border-color: transparent;
}

.button--secondary img {
    filter: brightness(0) invert(1);
}

.button--secondary:hover,
.button--secondary:focus-visible {
    background-color: rgba(61, 61, 61, 0.3);
}

/* -------------------------------------------------------------------------
   form-page
   ------------------------------------------------------------------------- */
.form-page-sec {
    background-color: var(--primary-2);
}

.form-page-sec-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 64px;
    max-width: var(--pc-body-width-max);
    margin-inline: auto;
    padding: 120px 80px;
}

.form-page-heading {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    width: 100%;
    max-width: 1280px;
}

.form-page-kicker {
    display: flex;
    gap: 16px;
    align-items: center;
    align-self: flex-start;
}

.form-page-kicker-line {
    display: block;
    flex-shrink: 0;
    width: 30px;
    height: 1px;
    background-color: var(--primary-9);
}

.form-page-kicker-text {
    color: var(--primary-9);
    font-size: var(--font-size-xl);
}

.form-page-heading-contents {
    display: flex;
    flex-direction: column;
    gap: 32px;
    align-items: stretch;
    width: 100%;
}

.form-page-heading-title {
    color: var(--primary-11);
    text-align: center;
}

.form-page-heading-title-break {
    display: none;
}

.form-page-heading-text {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.form-page-heading-lead {
    color: var(--primary-11);
    text-align: center;
}

.form-page-heading-lead--sp {
    display: none;
}

@media (max-width: 1023px) {
    .form-page-tel {
        text-decoration: none;
        color: var(--primary-11);
    }
}

.form-page-body {
    width: 100%;
    max-width: 684px;
}

.form-page-body .wpcf7-form {
    margin: 0;
}

.form-page-fields {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.form-page-fields > p {
    margin: 0;
}

.form-page-row {
    display: flex;
    gap: 14px;
    align-items: flex-start;
}
@media (max-width: 1023px) {
    .form-page-row {
        flex-direction: column;
    }
}

.form-page-row-2 > .form-page-field {
    flex: 1;
    min-width: 0;
}

.form-page-field {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}

.form-page-field > p {
    margin: 0;
}

.form-page-label {
    display: flex;
    gap: 8px;
    align-items: center;
    color: var(--primary-11);
}

.form-page-label label {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    cursor: pointer;
}

.form-page-label > span {
    display: inline-flex;
    gap: 8px;
    align-items: center;
}

.form-page-required {
    display: inline-flex;
    align-items: center;
    align-self: center;
    flex-shrink: 0;
    padding: 1px 4px 2px;
    color: var(--tertiary-10);
    font-family: var(--font-sans);
    font-size: 0.625rem;
    font-weight: var(--font-weight-regular);
    line-height: 1.4;
    letter-spacing: var(--tracking-default);
    border: 1px solid var(--tertiary-10);
}

.form-page-control {
    display: block;
    width: 100%;
    padding: 16px;
    color: var(--primary-11);
    font-family: var(--font-sans);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-regular);
    line-height: var(--leading-body);
    letter-spacing: var(--tracking-default);
    background-color: var(--neutral-white);
    border: 1px solid var(--primary-4);
    border-radius: 0;
    appearance: none;
}

.form-page-control::placeholder {
    color: var(--neutral-gray-9);
}

.form-page-control:focus {
    outline: 2px solid var(--primary-8);
    outline-offset: 0;
}

/* Figma Textarea: Field height 84px（PC / SP 共通）。CF7 既定 rows=10 を上書きする */
.form-page-body textarea.form-page-control,
.form-page-control-textarea {
    height: 84px;
    min-height: 84px;
    resize: vertical;
}

.form-page-field-has-icon .form-page-control,
.form-page-body input.form-page-control[name="preferred-date"],
.form-page-body input.form-page-reservation-date,
.form-page-body .flatpickr-input.form-page-control,
.form-page-body select.form-page-control[name="preferred-time"] {
    padding-right: 48px;
    background-color: var(--neutral-white);
    background-repeat: no-repeat;
    background-position: right 16px center;
    background-size: 24px 24px;
}

.form-page-field-has-icon-calender .form-page-control,
.form-page-body input.form-page-control[name="preferred-date"],
.form-page-body input.form-page-reservation-date,
.form-page-body .flatpickr-input.form-page-control {
    position: relative;
    cursor: text;
    background-image: url("../images/common/icons/icon-calender-field.svg");
}

.form-page-field-has-icon-clock .form-page-control {
    background-image: url("../images/common/icons/icon-clock.svg");
}

.form-page-body .wpcf7-form-control-wrap[data-name="preferred-time"] {
    position: relative;
    display: block;
}

.form-page-body .wpcf7-form-control-wrap[data-name="preferred-time"]::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 16px;
    z-index: 1;
    width: 24px;
    height: 24px;
    background: url("../images/common/icons/icon-clock.svg") no-repeat center /
        contain;
    pointer-events: none;
    transform: translateY(-50%);
}

.form-page-field-privacy {
    gap: 20px;
}

.form-page-privacy-box {
    height: 223px;
    padding: 16px;
    overflow-y: auto;
    border: 1px solid var(--primary-7);
}

.form-page-privacy-content {
    display: flex;
    flex-direction: column;
    gap: 12px;
    align-items: center;
}

.form-page-privacy-title {
    color: var(--primary-11);
    text-align: center;
}

.form-page-privacy-body {
    align-self: stretch;
    color: var(--primary-9);
    text-align: left;
}

.form-page-privacy-body p {
    margin: 0;
}

.form-page-privacy-body strong {
    color: inherit;
    font-weight: var(--font-weight-bold);
}

.form-page-consent {
    display: flex;
    justify-content: center;
    margin: 0;
}

.form-page-consent .wpcf7-list-item {
    margin: 0;
}

.form-page-consent .wpcf7-list-item label {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    color: var(--primary-11);
    cursor: pointer;
}

.form-page-consent input[type="checkbox"] {
    flex-shrink: 0;
    width: 18px;
    height: 18px;
    margin: 0;
    accent-color: var(--primary-11);
    border: 1px solid var(--primary-11);
}

.form-page-submit-wrap {
    display: flex;
    justify-content: center;
    margin-top: 40px;
}

.form-page-submit-wrap > p {
    display: inline-flex;
    position: relative;
    align-items: center;
    justify-content: center;
    margin: 0;
}

/* CF7 のスピナーが横幅を取ってボタンが左にズレないようにする */
.form-page-submit-wrap .wpcf7-spinner {
    position: absolute;
    top: 50%;
    left: 100%;
    margin: 0 0 0 16px;
    transform: translateY(-50%);
}

.form-page-submit {
    display: inline-flex;
    gap: 8px;
    align-items: center;
    justify-content: center;
    min-width: 180px;
    min-height: 52px;
    padding: 14px 40px;
    color: var(--primary-1);
    font-family: var(--font-serif);
    font-size: var(--font-size-base);
    font-weight: var(--font-weight-regular);
    line-height: var(--leading-oneline);
    letter-spacing: var(--tracking-default);
    white-space: nowrap;
    cursor: pointer;
    appearance: none;
    background-color: rgba(61, 61, 61, 0.8);
    border: 1px solid transparent;
    border-radius: 26px;
    transition: background-color 0.3s ease-in-out;
}

.form-page-submit:hover,
.form-page-submit:focus-visible {
    background-color: rgba(61, 61, 61, 0.3);
}

.form-page-body .wpcf7-not-valid,
.form-page-body
    .wpcf7-form-control-wrap:has(.wpcf7-not-valid)
    .form-page-control,
.form-page-body
    .wpcf7-form-control-wrap:has(.wpcf7-not-valid)
    .flatpickr-input {
    border-color: var(--tertiary-10);
}

.form-page-body .wpcf7-not-valid:focus,
.form-page-body
    .wpcf7-form-control-wrap:has(.wpcf7-not-valid)
    .form-page-control:focus,
.form-page-body
    .wpcf7-form-control-wrap:has(.wpcf7-not-valid)
    .flatpickr-input:focus {
    outline-color: var(--tertiary-10);
}

.form-page-body .wpcf7-not-valid-tip {
    margin-top: 8px;
    color: var(--tertiary-10);
    font-family: var(--font-sans);
    font-size: var(--font-size-2xs);
    line-height: var(--leading-body);
}

.form-page-body .wpcf7-response-output {
    margin: 24px 0 0;
    padding: 16px;
    color: var(--primary-11);
    font-family: var(--font-sans);
    font-size: var(--font-size-sm);
    line-height: var(--leading-body);
    border: 1px solid var(--primary-7);
}

/* フィールド下のエラー表示だけで十分なため、全体メッセージは出さない */
.form-page-body .wpcf7-form.invalid .wpcf7-response-output,
.form-page-body .wpcf7-form.unaccepted .wpcf7-response-output {
    display: none;
}

@media (max-width: 1023px) {
    .form-page-sec-inner {
        align-items: stretch;
        gap: 48px;
        max-width: var(--sp-body-width-max);
        padding: 64px 20px;
    }

    .form-page-heading {
        align-items: stretch;
        gap: 20px;
        max-width: none;
    }

    .form-page-kicker-text {
        font-size: var(--font-size-2xs);
    }

    .form-page-heading-title {
        font-size: var(--font-size-2xl);
    }

    .form-page-heading-title-break {
        display: inline;
    }

    .form-page-heading-lead--pc {
        display: none;
    }

    .form-page-heading-lead--sp {
        display: block;
        text-align: left;
    }

    .form-page-body {
        max-width: none;
    }

    .form-page-field {
        gap: 8px;
    }

    .form-page-control {
        padding: 12px;
    }

    .form-page-field-has-icon .form-page-control,
    .form-page-body input.form-page-control[name="preferred-date"],
    .form-page-body input.form-page-reservation-date,
    .form-page-body .flatpickr-input.form-page-control,
    .form-page-body select.form-page-control[name="preferred-time"] {
        padding-right: 48px;
        background-position: right 12px center;
    }

    .form-page-body
        .wpcf7-form-control-wrap[data-name="preferred-time"]::after {
        right: 12px;
    }

    .form-page-consent .wpcf7-list-item label {
        font-size: var(--font-size-2xs);
        text-align: center;
    }

    .form-page-submit-wrap {
        margin-top: 0;
        width: 100%;
    }

    .form-page-submit-wrap > p {
        width: 100%;
    }

    .form-page-submit {
        width: 100%;
        min-width: 0;
    }
}

/* flatpickr（希望日） */
.flatpickr-calendar {
    font-family: var(--font-sans);
}

.flatpickr-day.selected,
.flatpickr-day.startRange,
.flatpickr-day.endRange {
    background: var(--primary-11);
    border-color: var(--primary-11);
}

.flatpickr-day.selected:hover,
.flatpickr-day.startRange:hover,
.flatpickr-day.endRange:hover {
    background: var(--primary-10);
    border-color: var(--primary-10);
}

.flatpickr-day.today {
    border-color: var(--primary-8);
}

.flatpickr-day.flatpickr-disabled,
.flatpickr-day.flatpickr-disabled:hover {
    color: var(--neutral-gray-8);
}

/* -------------------------------------------------------------------------
   footer
   ------------------------------------------------------------------------- */
.footer {
    background-color: var(--primary-5);
}

.footer__inner {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    max-width: var(--pc-body-width-max);
    margin-inline: auto;
    padding: 40px 120px 64px;
}
@media (max-width: 1023px) {
    .footer__inner {
        flex-direction: column;
        align-items: center;
        gap: 24px;
        padding: 32px 20px 56px;
    }
}

.footer__logo {
    display: block;
    flex-shrink: 0;
    width: 153px;
}
@media (max-width: 1023px) {
    .footer__logo {
        width: 170px;
    }
}

.footer__logo img {
    display: block;
    width: 100%;
    height: auto;
}

.footer__address {
    color: var(--primary-11);
}
@media (max-width: 1023px) {
    .footer__address {
        text-align: center;
    }
}

/* -------------------------------------------------------------------------
   exhibition
   ------------------------------------------------------------------------- */
.exhibition {
    background-color: var(--primary-4);
}

.exhibition__inner {
    display: flex;
    flex-direction: column;
    gap: 64px;
    align-items: flex-start;
    max-width: var(--pc-body-width-max);
    margin-inline: auto;
    padding: 100px 80px 116px;
}
@media (max-width: 1023px) {
    .exhibition__inner {
        gap: 48px;
        max-width: var(--sp-body-width-max);
        padding: 64px 20px;
    }
}

.section-header {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
    width: 100%;
}
@media (max-width: 1023px) {
    .section-header {
        gap: 20px;
    }
}

.section-header__kicker {
    display: flex;
    gap: 16px;
    align-items: center;
}

.section-header__kicker-line {
    flex-shrink: 0;
    width: 30px;
    height: 1px;
    background-color: var(--primary-9);
}

.section-header__kicker-text {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-regular);
    line-height: var(--leading-body);
    letter-spacing: var(--tracking-default);
    color: var(--primary-9);
    white-space: nowrap;
}
@media (max-width: 1023px) {
    .section-header__kicker-text {
        font-size: var(--font-size-2xs);
    }
}

.section-header__contents {
    display: flex;
    flex-direction: column;
    gap: 32px;
    align-items: flex-start;
    width: 100%;
}

.section-header__heading {
    width: 100%;
    margin: 0;
    color: var(--primary-11);
    text-align: center;
}
@media (max-width: 1023px) {
    .section-header__heading {
        font-size: var(--font-size-2xl);
    }
}

.section-header__logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin: 0;
}
@media (max-width: 1023px) {
    .section-header__logo {
        padding-inline: 20px;
    }
}

.section-header__logo img {
    display: block;
    width: 393px;
    max-width: 100%;
    height: auto;
}
@media (max-width: 1023px) {
    .section-header__logo img {
        width: 100%;
        aspect-ratio: 393 / 135;
        object-fit: contain;
    }
}

.section-header__lead {
    width: 100%;
}

.section-header__lead-pc {
    color: var(--primary-11);
    text-align: center;
}

.section-header__lead-pc p {
    margin: 0;
}

.section-header__lead-sp {
    margin: 0;
    color: var(--primary-11);
    text-align: left;
}

.exhibition__cards {
    display: flex;
    gap: 32px;
    align-items: stretch;
    width: 100%;
}
@media (max-width: 1023px) {
    .exhibition__cards {
        flex-direction: column;
    }
}

.exhibition-card {
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: flex-start;
    min-width: 0;
    overflow: hidden;
    background-color: rgba(254, 253, 252, 0.6);
    border-radius: 4px;
}
@media (max-width: 1023px) {
    .exhibition-card {
        flex: none;
        width: 100%;
    }
}

.exhibition-card__photo {
    width: 100%;
    aspect-ratio: 3 / 2;
    margin: 0;
    overflow: hidden;
}

.exhibition-card__photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.exhibition-card__body {
    display: flex;
    flex: 1;
    flex-direction: column;
    gap: 12px;
    align-items: flex-start;
    width: 100%;
    padding: 32px 36px;
}
@media (max-width: 1023px) {
    .exhibition-card__body {
        padding: 20px 24px;
    }
}

.exhibition-card__title {
    margin: 0;
    color: var(--neutral-black);
}
@media (max-width: 1023px) {
    .exhibition-card__title {
        font-size: var(--font-size-xl);
    }
}

.exhibition-card__description {
    margin: 0;
    min-height: 50px;
    color: var(--primary-11);
}

.exhibition-card__link-wrap {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    width: 100%;
    margin: 0;
    margin-top: auto;
}

.exhibition-card__link {
    padding-bottom: 4px;
    color: var(--secondary-9);
    text-decoration: none;
    border-bottom: 1px solid var(--secondary-9);
}

/* -------------------------------------------------------------------------
   exterior
   ------------------------------------------------------------------------- */
:root {
    --kurashi-lab-scroll-margin: 80px;
}
@media (max-width: 1147px) {
    :root {
        --kurashi-lab-scroll-margin: 68px;
    }
}

#kurashi-lab {
    scroll-margin-top: var(--kurashi-lab-scroll-margin);
}

.exterior {
    background-color: var(--primary-2);
}

.exterior__bg {
    position: relative;
    width: 100%;
    height: 122px; /* 3点目までの距離（PC） */
    overflow: hidden;
    background-color: var(--primary-4);
}
@media (max-width: 1023px) {
    .exterior__bg {
        height: 33px; /* 3点目までの距離（SP） */
    }
}

.exterior__bg::after {
    position: absolute;
    inset: 0;
    content: "";
    background-color: var(--primary-2);
    /* 上中央 → 右下 → 左下。左右は常に要素幅＝画面幅 */
    clip-path: polygon(50% 0, 100% 100%, 0 100%);
}

.exterior__logo-inner {
    max-width: var(--pc-body-width-max);
    margin-inline: auto;
    padding: 60px 80px 0;
}
@media (max-width: 1023px) {
    .exterior__logo-inner {
        max-width: var(--sp-body-width-max);
        padding: 56px 80px 0;
    }
}

.exterior__logo {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    margin: 0;
}
@media (max-width: 1023px) {
    .exterior__logo {
        padding-inline: 20px;
    }
}

.exterior__logo img {
    display: block;
    width: 393px;
    max-width: 100%;
    height: auto;
}
@media (max-width: 1023px) {
    .exterior__logo img {
        width: 100%;
        aspect-ratio: 393 / 135;
        object-fit: contain;
    }
}

.exterior__plan-inner {
    display: flex;
    flex-direction: column;
    gap: 80px;
    align-items: center;
    max-width: var(--pc-body-width-max);
    margin-inline: auto;
    padding: 80px;
}
@media (max-width: 1023px) {
    .exterior__plan-inner {
        gap: 40px;
        align-items: flex-start;
        max-width: var(--sp-body-width-max);
        padding: 56px 20px;
    }
}

.exterior__header {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
    width: 100%;
    max-width: 1280px;
}
@media (max-width: 1023px) {
    .exterior__header {
        gap: 20px;
        max-width: none;
    }
}

.exterior__kicker {
    display: flex;
    gap: 16px;
    align-items: center;
}

.exterior__kicker-line {
    flex-shrink: 0;
    width: 30px;
    height: 1px;
    background-color: var(--primary-9);
}

.exterior__kicker-text {
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-regular);
    line-height: var(--leading-body);
    letter-spacing: var(--tracking-default);
    color: var(--primary-9);
    white-space: nowrap;
}
@media (max-width: 1023px) {
    .exterior__kicker-text {
        font-size: var(--font-size-2xs);
    }
}

.exterior__header-contents {
    display: flex;
    flex-direction: column;
    gap: 32px;
    align-items: flex-start;
    width: 100%;
}

.exterior__heading {
    width: 100%;
    margin: 0;
    color: var(--primary-11);
    text-align: center;
}
@media (max-width: 1023px) {
    .exterior__heading {
        font-size: var(--font-size-2xl);
    }
}

.exterior__lead {
    width: 100%;
    color: var(--primary-11);
    text-align: center;
}
@media (max-width: 1023px) {
    .exterior__lead {
        font-size: var(--font-size-xs);
        text-align: left;
    }
}

.exterior__lead p {
    margin: 0;
}

.exterior__images {
    display: flex;
    gap: 24px;
    align-items: center;
    width: 100%;
    min-width: 0;
}
@media (max-width: 1023px) {
    .exterior__images {
        flex-direction: column;
        align-items: flex-start;
    }
}

.exterior__photo {
    position: relative;
    flex: 746 1 0;
    width: auto;
    min-width: 280px;
    max-width: 746px;
    height: auto;
    margin: 0;
    overflow: hidden;
    aspect-ratio: 746 / 796;
}
@media (max-width: 1023px) {
    .exterior__photo {
        flex: none;
        width: 100%;
        min-width: 0;
        max-width: none;
        aspect-ratio: 827 / 882;
    }
}

.exterior__photo img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    pointer-events: none;
}

.exterior__madori {
    display: flex;
    flex: 418 1 0;
    flex-direction: column;
    gap: 84px;
    align-items: center;
    align-self: stretch;
    width: auto;
    min-width: 160px;
}
@media (max-width: 1023px) {
    .exterior__madori {
        flex: none;
        flex-direction: row;
        gap: 16px;
        align-items: flex-start;
        width: 100%;
        min-width: 0;
        max-width: none;
    }
}

.exterior__madori-item {
    position: relative;
    flex: 1 0 0;
    width: 100%;
    min-width: 0;
    min-height: 0;
    margin: 0;
    aspect-ratio: 418 / 302;
}
@media (max-width: 1023px) {
    .exterior__madori-item {
        aspect-ratio: 1 / 1;
    }
}

.exterior__madori-item img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    pointer-events: none;
}
@media (max-width: 1023px) {
    .exterior__madori-item img {
        object-fit: contain;
    }
}

.exterior__image-group {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 100%;
    min-width: 0;
}

.exterior__interior {
    display: flex;
    gap: 32px;
    align-items: center;
    width: 100%;
    min-width: 0;
}
@media (max-width: 1023px) {
    .exterior__interior {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }
}

.exterior__interior-item {
    position: relative;
    flex: 1 0 0;
    width: 100%;
    min-width: 0;
    margin: 0;
    overflow: hidden;
    aspect-ratio: 1 / 1;
}

.exterior__interior-item img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    pointer-events: none;
}

/* -------------------------------------------------------------------------
   gallery
   ------------------------------------------------------------------------- */
.gallery {
    background-color: var(--primary-2);
}

.gallery__inner {
    display: flex;
    flex-direction: column;
    gap: 80px;
    align-items: center;
    max-width: var(--pc-body-width-max);
    margin-inline: auto;
    padding: 80px 0 100px;
}
@media (max-width: 1023px) {
    .gallery__inner {
        gap: 40px;
        max-width: var(--sp-body-width-max);
        padding: 56px 0;
    }
}

.gallery__inner .section-header {
    padding-inline: 80px;
    box-sizing: border-box;
}
@media (max-width: 1023px) {
    .gallery__inner .section-header {
        padding-inline: 20px;
    }
}

.gallery__grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 8px;
    width: 100%;
}
@media (max-width: 1023px) {
    .gallery__grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

.gallery__column {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: 0;
}

.gallery__item {
    position: relative;
    display: block;
    width: 100%;
    margin: 0;
    overflow: hidden;
}

.gallery__item--1-1 {
    aspect-ratio: 1 / 1;
}

.gallery__item--2-3 {
    aspect-ratio: 2 / 3;
}

.gallery__button {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: none;
    background: transparent;
    cursor: pointer;
}

.gallery__item img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    pointer-events: none;
}

/* -------------------------------------------------------------------------
   point
   ------------------------------------------------------------------------- */
.point {
    --point-divider-height: 80px;
    background-color: var(--primary-2);
}
@media (max-width: 1023px) {
    .point {
        --point-divider-height: 22px;
    }
}

/* 下辺の斜め区切り。Figma Polygon: neutral-gray-3 / 左短・右長 */
.point__divider {
    width: 100%;
    height: var(--point-divider-height);
    background-color: var(--neutral-gray-3);
    /* 左下 → 右上 → 右下 */
    clip-path: polygon(0 100%, 100% 0, 100% 100%);
}

.point__inner {
    display: flex;
    flex-direction: column;
    gap: 64px;
    align-items: center;
    max-width: var(--pc-body-width-max);
    margin-inline: auto;
    padding: 80px 80px 100px;
}
@media (max-width: 1023px) {
    .point__inner {
        gap: 32px;
        max-width: var(--sp-body-width-max);
        padding: 40px 20px;
    }
}

.point .section-header__lead-sp {
    font-size: var(--font-size-base);
    text-align: center;
}

.point__list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 88px;
    box-sizing: border-box;
    width: 100%;
    padding-inline: 0;
}
@media (max-width: 1023px) {
    .point__list {
        display: flex;
        flex-direction: column;
        gap: 56px;
    }
}

.point__item {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-width: 0;
    overflow: hidden;
}

.point__photo {
    margin: 0;
    aspect-ratio: 3 / 2;
    width: 100%;
    overflow: hidden;
}

.point__photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.point__body {
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
    padding-top: 24px;
}
@media (max-width: 1023px) {
    .point__body {
        gap: 20px;
        padding-top: 20px;
    }
}

.point__title-wrap {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: flex-start;
    width: 100%;
}
@media (max-width: 1023px) {
    .point__title-wrap {
        gap: 20px;
    }
}

.point__title {
    margin: 0;
    width: 100%;
    color: var(--primary-11);
    text-align: left;
}

.point__title-line {
    display: block;
    width: 60px;
    height: 1px;
    background-color: var(--primary-11);
}

.point__text {
    margin: 0;
    width: 100%;
    color: var(--primary-11);
}

/* -------------------------------------------------------------------------
   american-house
   ------------------------------------------------------------------------- */
.american-house {
    background-color: var(--neutral-gray-3);
}

.american-house__inner {
    display: flex;
    flex-direction: column;
    gap: 80px;
    align-items: center;
    max-width: var(--pc-body-width-max);
    margin-inline: auto;
    padding: 80px 80px 100px;
}
@media (max-width: 1023px) {
    .american-house__inner {
        gap: 40px;
        max-width: var(--sp-body-width-max);
        padding: 40px 20px;
    }
}

.american-house .section-header__kicker-line {
    background-color: var(--neutral-black);
}

.american-house .section-header__kicker-text,
.american-house .section-header__heading {
    color: var(--neutral-black);
}

.american-house__contents {
    display: flex;
    flex-direction: column;
    gap: 56px;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    padding-inline: 111px;
}
@media (max-width: 1023px) {
    .american-house__contents {
        gap: 40px;
        padding-inline: 0;
    }
}

.american-house__intro {
    display: flex;
    gap: 56px;
    align-items: center;
    width: 100%;
}
@media (max-width: 1023px) {
    .american-house__intro {
        flex-direction: column;
        gap: 40px;
        align-items: flex-start;
    }
}

.american-house__photo {
    margin: 0;
    overflow: hidden;
}

.american-house__photo img,
.american-house__thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.american-house__photo--exterior {
    flex: 1 1 0;
    min-width: 0;
    aspect-ratio: 16 / 9;
}
@media (max-width: 1023px) {
    .american-house__photo--exterior {
        width: 100%;
        flex: none;
    }
}

.american-house__catch {
    flex: 1 1 0;
    max-width: 450px;
    min-width: 0;
    margin: 0;
    color: var(--neutral-black);
}
@media (max-width: 1023px) {
    .american-house__catch {
        max-width: none;
        width: 100%;
        flex: none;
    }
}

.american-house__detail {
    display: flex;
    gap: 68px;
    align-items: flex-end;
    width: 100%;
}
@media (max-width: 1023px) {
    .american-house__detail {
        flex-direction: column;
        gap: 24px;
        align-items: flex-start;
    }
}

.american-house__photo--living {
    flex: 0 1 429px;
    width: 429px;
    max-width: 100%;
    aspect-ratio: 429 / 322;
}
@media (max-width: 1023px) {
    .american-house__photo--living {
        flex: none;
        width: 100%;
    }
}

.american-house__detail-body {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    gap: 32px;
    align-items: flex-start;
    max-width: 561px;
    min-width: 0;
}
@media (max-width: 1023px) {
    .american-house__detail-body {
        gap: 24px;
        max-width: none;
        width: 100%;
        flex: none;
    }
}

.american-house__text {
    margin: 0;
    width: 100%;
    color: var(--neutral-black);
}
@media (max-width: 1023px) {
    .american-house__text {
        font-size: var(--font-size-xs);
    }
}

.american-house__thumbs {
    display: flex;
    justify-content: space-between;
    width: 100%;
    overflow: hidden;
}
@media (max-width: 1023px) {
    .american-house__thumbs {
        gap: 8px;
        justify-content: flex-start;
    }
}

.american-house__thumb {
    flex: 0 1 175px;
    width: 175px;
    max-width: 175px;
    aspect-ratio: 1 / 1;
    margin: 0;
    overflow: hidden;
}
@media (max-width: 1023px) {
    .american-house__thumb {
        flex: 1 1 0;
        width: auto;
        max-width: none;
        min-width: 0;
    }
}

/* -------------------------------------------------------------------------
   interior-goods
   ------------------------------------------------------------------------- */
.interior-goods {
    background-color: var(--primary-1);
}

.interior-goods__inner {
    display: flex;
    flex-direction: column;
    gap: 56px;
    align-items: center;
    max-width: var(--pc-body-width-max);
    margin-inline: auto;
    padding: 80px 80px 100px;
}
@media (max-width: 1023px) {
    .interior-goods__inner {
        gap: 40px;
        max-width: var(--sp-body-width-max);
        padding: 40px 20px;
    }
}

.interior-goods .section-header__lead-sp {
    white-space: pre-line;
}

.interior-goods__contents {
    display: flex;
    flex-direction: column;
    gap: 56px;
    align-items: stretch;
    box-sizing: border-box;
    width: 100%;
    padding-inline: 111px;
}
@media (max-width: 1023px) {
    .interior-goods__contents {
        gap: 40px;
        padding-inline: 0;
    }
}

.interior-goods__intro {
    display: flex;
    gap: 56px;
    align-items: center;
    width: 100%;
}
@media (max-width: 1023px) {
    .interior-goods__intro {
        flex-direction: column;
        gap: 40px;
        align-items: flex-start;
    }
}

.interior-goods__photo {
    margin: 0;
    overflow: hidden;
}

.interior-goods__photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.interior-goods__photo--main {
    flex: 1 1 0;
    min-width: 0;
    height: 344px;
}
@media (max-width: 1023px) {
    .interior-goods__photo--main {
        width: 100%;
        height: auto;
        flex: none;
        aspect-ratio: 16 / 9;
    }
}

.interior-goods__catch {
    flex: 1 1 0;
    min-width: 0;
    margin: 0;
    color: var(--neutral-black);
    text-align: left;
}
@media (max-width: 1023px) {
    .interior-goods__catch {
        width: 100%;
        flex: none;
        font-size: var(--font-size-xs);
    }
}

.interior-goods__detail {
    display: flex;
    gap: 68px;
    align-items: flex-start;
    width: 100%;
}
@media (max-width: 1200px) {
    .interior-goods__detail {
        flex-direction: column;
        gap: 40px;
    }
}
@media (max-width: 1023px) {
    .interior-goods__detail {
        gap: 24px;
    }
}

.interior-goods__photo--living {
    flex: 0 1 429px;
    width: 429px;
    max-width: 100%;
    aspect-ratio: 429 / 322;
}
@media (max-width: 1200px) {
    .interior-goods__photo--living {
        flex: none;
        width: 100%;
    }
}

.interior-goods__detail-body {
    display: flex;
    flex: 1 1 0;
    flex-direction: column;
    gap: 32px;
    align-items: flex-start;
    max-width: 561px;
    min-width: 0;
}
@media (max-width: 1200px) {
    .interior-goods__detail-body {
        max-width: none;
        width: 100%;
        flex: none;
    }
}
@media (max-width: 1023px) {
    .interior-goods__detail-body {
        gap: 24px;
    }
}

.interior-goods__text {
    margin: 0;
    width: 100%;
    color: var(--neutral-black);
    text-align: left;
}
@media (max-width: 1023px) {
    .interior-goods__text {
        font-size: var(--font-size-xs);
    }
}

.interior-goods__thumbs {
    display: flex;
    justify-content: space-between;
    width: 100%;
    overflow: hidden;
}
@media (max-width: 1023px) {
    .interior-goods__thumbs {
        gap: 8px;
        justify-content: flex-start;
    }
}

.interior-goods__thumb {
    flex: 0 1 175px;
    width: 175px;
    max-width: 175px;
    aspect-ratio: 1 / 1;
    margin: 0;
    overflow: hidden;
}

.interior-goods__thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
@media (max-width: 1023px) {
    .interior-goods__thumb {
        flex: 1 1 0;
        width: auto;
        max-width: none;
        min-width: 0;
    }
}

/* -------------------------------------------------------------------------
   floor-plan
   ------------------------------------------------------------------------- */
.floor-plan {
    background-color: var(--neutral-gray-3);
}

.floor-plan__inner {
    display: flex;
    flex-direction: column;
    gap: 80px;
    align-items: center;
    max-width: var(--pc-body-width-max);
    margin-inline: auto;
    padding: 80px;
}
@media (max-width: 1023px) {
    .floor-plan__inner {
        gap: 32px;
        max-width: var(--sp-body-width-max);
        padding: 40px 20px;
    }
}

.floor-plan .section-header__kicker-line {
    background-color: var(--neutral-black);
}

.floor-plan .section-header__kicker-text,
.floor-plan .section-header__heading {
    color: var(--neutral-black);
}

.floor-plan__images {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    padding-inline: 111px;
}
@media (max-width: 1023px) {
    .floor-plan__images {
        flex-direction: column;
        gap: 24px;
        padding-inline: 0;
    }
}

.floor-plan__image {
    flex: 1 0 0;
    min-width: 0;
    margin: 0;
    aspect-ratio: 960 / 1047;
    overflow: hidden;
}
@media (max-width: 1023px) {
    .floor-plan__image {
        flex: none;
        width: 100%;
        aspect-ratio: 350 / 250;
    }
}

.floor-plan__image img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
@media (max-width: 1023px) {
    .floor-plan__image img {
        object-fit: contain;
    }
}

.floor-plan__note {
    margin: 0;
    color: var(--neutral-black);
}

/* -------------------------------------------------------------------------
   american-point
   ------------------------------------------------------------------------- */
.american-point {
    background-color: var(--neutral-gray-3);
}

.american-point__inner {
    display: flex;
    flex-direction: column;
    gap: 80px;
    align-items: center;
    max-width: var(--pc-body-width-max);
    margin-inline: auto;
    padding: 80px;
}
@media (max-width: 1023px) {
    .american-point__inner {
        gap: 32px;
        max-width: var(--sp-body-width-max);
        padding: 40px 20px;
    }
}

.american-point .section-header__kicker-line {
    background-color: var(--neutral-black);
}

.american-point .section-header__kicker-text,
.american-point .section-header__heading {
    color: var(--neutral-black);
}

.american-point__list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 88px;
    box-sizing: border-box;
    width: 100%;
    padding-inline: 0;
}
@media (max-width: 1023px) {
    .american-point__list {
        display: flex;
        flex-direction: column;
        gap: 32px;
    }
}

.american-point__item {
    display: flex;
    flex-direction: column;
    width: 100%;
    min-width: 0;
    overflow: hidden;
}

.american-point__photo {
    margin: 0;
    aspect-ratio: 3 / 2;
    width: 100%;
    overflow: hidden;
}

.american-point__photo img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.american-point__text {
    margin: 0;
    width: 100%;
    padding-top: 24px;
    color: var(--neutral-black);
}
@media (max-width: 1023px) {
    .american-point__text {
        padding-top: 20px;
    }
}

/* -------------------------------------------------------------------------
   cafe
   ------------------------------------------------------------------------- */
.cafe {
    background-color: var(--primary-1);
}

.cafe__inner {
    display: flex;
    flex-direction: column;
    gap: 64px;
    align-items: center;
    max-width: var(--pc-body-width-max);
    margin-inline: auto;
    padding: 80px 80px 100px;
}
@media (max-width: 1023px) {
    .cafe__inner {
        gap: 40px;
        max-width: var(--sp-body-width-max);
        padding: 80px 20px;
    }
}

@media (max-width: 1023px) {
    .cafe .section-header__logo img {
        width: 189px;
        aspect-ratio: 189 / 65;
    }
}

.cafe__body {
    display: flex;
    flex-direction: column;
    gap: 40px;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    padding-inline: 111px;
}
@media (max-width: 1023px) {
    .cafe__body {
        gap: 20px;
        padding-inline: 0;
    }
}

.cafe__hero {
    width: 100%;
    margin: 0;
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.cafe__hero img,
.cafe__thumb img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.cafe__gallery-block {
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
    width: 100%;
}

.cafe__thumbs {
    display: flex;
    gap: 32px;
    align-items: center;
    width: 100%;
}
@media (max-width: 1023px) {
    .cafe__thumbs {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 16px;
    }
}

.cafe__thumb {
    flex: 1 0 0;
    min-width: 0;
    margin: 0;
    aspect-ratio: 1 / 1;
    overflow: hidden;
}

.cafe__caption {
    width: 100%;
    margin: 0;
    color: var(--primary-11);
}
@media (max-width: 1023px) {
    .cafe__caption {
        font-size: var(--font-size-xs);
    }
}

/* -------------------------------------------------------------------------
   flow
   ------------------------------------------------------------------------- */
.flow {
    background-color: var(--primary-3);
}

.flow__inner {
    display: flex;
    flex-direction: column;
    gap: 56px;
    align-items: flex-start;
    max-width: var(--pc-body-width-max);
    margin-inline: auto;
    padding: 80px 80px 100px;
}
@media (max-width: 1023px) {
    .flow__inner {
        gap: 40px;
        max-width: var(--sp-body-width-max);
        padding: 80px 20px;
    }
}

.flow .section-header__heading {
    color: var(--neutral-black);
}

.flow__list {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}
@media (max-width: 1023px) {
    .flow__list {
        flex-direction: column;
        gap: 16px;
        align-items: center;
    }
}

.flow__item {
    display: flex;
    flex: 1 0 0;
    align-items: flex-start;
    min-width: 0;
}
@media (max-width: 1023px) {
    .flow__item {
        flex: none;
        flex-direction: column;
        gap: 16px;
        align-items: center;
        width: 100%;
        max-width: 213px;
    }
}

.flow__item:last-child {
    flex: 0 0 auto;
    width: 192px;
}
@media (max-width: 1023px) {
    .flow__item:last-child {
        width: 100%;
        max-width: 213px;
    }
}

.flow__step {
    display: flex;
    flex: 1 0 0;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    min-width: 0;
}
@media (max-width: 1023px) {
    .flow__step {
        flex: none;
        width: 100%;
    }
}

.flow__number {
    box-sizing: border-box;
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: center;
    width: 48px;
    height: 48px;
    color: var(--secondary-9);
    border: 1.5px solid var(--secondary-9);
    border-radius: 50%;
}

.flow__text {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

.flow__title {
    margin: 0;
    color: var(--neutral-black);
    white-space: nowrap;
}

.flow__note {
    margin: 0;
    color: var(--primary-11);
    white-space: nowrap;
}

.flow__connector {
    box-sizing: border-box;
    flex-shrink: 0;
    width: 80px;
    height: 0;
    margin-block: calc((48px - 1px) / 2);
    border-top: 1px dashed var(--secondary-9);
}
@media (max-width: 1023px) {
    .flow__connector {
        width: 0;
        height: 28px;
        margin-block: 0;
        border-top: none;
        border-left: 1px dashed var(--secondary-9);
    }
}

/* -------------------------------------------------------------------------
   access
   ------------------------------------------------------------------------- */
.access {
    background-color: var(--neutral-white);
}

.access__inner {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    max-width: var(--pc-body-width-max);
    margin-inline: auto;
}
@media (max-width: 1023px) {
    .access__inner {
        display: flex;
        flex-direction: column;
        max-width: var(--sp-body-width-max);
    }
}

.access__map {
    position: relative;
    width: 100%;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    /* stretch で縦に伸びて比率が崩れるのを防ぐ */
    align-self: start;
}
@media (max-width: 1023px) {
    .access__map {
        flex: none;
        width: 100%;
    }
}

.access__map iframe {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

.access__content {
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: flex-start;
    justify-content: center;
    min-width: 0;
    padding: 80px;
}
@media (max-width: 1023px) {
    .access__content {
        flex: none;
        width: 100%;
        padding: 48px 20px 56px;
    }
}

.access__kicker {
    display: flex;
    gap: 16px;
    align-items: center;
}

.access__kicker-line {
    flex-shrink: 0;
    width: 30px;
    height: 1px;
    background-color: var(--primary-9);
}

.access__kicker-text {
    margin: 0;
    color: var(--primary-9);
    white-space: nowrap;
}
@media (max-width: 1023px) {
    .access__kicker-text {
        font-size: var(--font-size-xs);
    }
}

.access__heading {
    margin: 0;
    color: var(--neutral-black);
}
@media (max-width: 1023px) {
    .access__heading {
        font-size: var(--font-size-2xl);
    }
}

.access__separator {
    display: block;
    width: 50px;
    height: 1px;
    background-color: var(--primary-9);
}

.access__info {
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: flex-start;
    width: 100%;
    color: var(--primary-11);
}
@media (max-width: 1023px) {
    .access__info {
        gap: 8px;
    }
}

.access__info-group {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.access__info-item,
.access__note {
    margin: 0;
}
@media (max-width: 1023px) {
    .access__info-item,
    .access__note {
        /* Figma SP: 本文・注釈とも 14px */
        font-size: var(--font-size-xs);
    }
}

.access__tel {
    color: inherit;
    text-decoration: none;
}

@media (min-width: 1024px) {
    .access__tel-text {
        display: inline;
    }
}

@media (max-width: 1023px) {
    a.access__tel.sp-only {
        display: inline;
    }
}

/* -------------------------------------------------------------------------
   cta
   ------------------------------------------------------------------------- */
.cta {
    position: relative;
    background-image: url("../images/gyota/cta/img-cta.webp");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
}

.cta__inner {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 48px;
    align-items: center;
    justify-content: center;
    max-width: var(--pc-body-width-max);
    height: 500px;
    margin-inline: auto;
}
@media (max-width: 1023px) {
    .cta__inner {
        gap: 32px;
        max-width: var(--sp-body-width-max);
        height: auto;
        padding: 100px 20px;
    }
}

.cta__heading {
    margin: 0;
    /* Figma PC: 54px / leading 1.6（トークン外） */
    font-size: 3.375rem;
    line-height: 1.6;
    color: var(--primary-1);
    text-align: center;
    text-shadow: 0 2px 3px rgba(61, 61, 61, 0.4);
}
@media (max-width: 1023px) {
    .cta__heading {
        /* Figma SP: text-ja-heading-2xl を継承 */
        font-size: var(--font-size-2xl);
        line-height: var(--leading-heading);
        text-shadow: 0 1px 2px rgba(61, 61, 61, 0.4);
    }
}

.cta__actions {
    display: flex;
    gap: 24px;
    align-items: center;
    justify-content: center;
}
@media (max-width: 1023px) {
    .cta__actions {
        flex-direction: column;
        gap: 12px;
        width: 100%;
    }

    .cta__actions .sp-only {
        width: 100%;
    }

    .cta__actions .button {
        width: 100%;
    }
}

/* -------------------------------------------------------------------------
   preview-card
   仕様（Figma アノテーション）:
   - ImageArea PC: アスペクト比 16:9
   - ImageArea SP: アスペクト比 1:1
   - 画像は contain で比率維持。余白は neutral-gray-4
   ------------------------------------------------------------------------- */
.preview-card {
    position: fixed;
    inset: 0;
    z-index: 200;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 24px 16px;
    box-sizing: border-box;
}
.preview-card[hidden] {
    display: none;
}

.preview-card__overlay {
    position: absolute;
    inset: 0;
    background-color: rgba(0, 0, 0, 0.3);
    cursor: pointer;
}

.preview-card__panel {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 964px;
    max-width: 100%;
    max-height: calc(100dvh - 48px);
    padding-bottom: 52px;
    overflow-y: auto;
    box-sizing: border-box;
}
@media (max-width: 1023px) {
    .preview-card__panel {
        width: 100%;
        max-width: 500px;
        max-height: calc(100dvh - 32px);
        padding-bottom: 24px;
    }
}

.preview-card__header {
    display: flex;
    flex-shrink: 0;
    align-items: center;
    justify-content: flex-end;
    min-height: 44px;
    width: 100%;
}

.preview-card__close {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 77px;
    min-height: 44px;
    padding: 8px 0;
    border: none;
    border-radius: 0 0 4px 4px;
    background: transparent;
    cursor: pointer;
}

.preview-card__close img {
    display: block;
}

.preview-card__container {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    overflow: hidden;
    background-color: var(--primary-1);
}

/* 仕様: ImageArea アスペクト比 PC 16:9 / SP 1:1。画像は比率を維持し余白はグレー */
.preview-card__image-area {
    position: relative;
    width: 100%;
    margin: 0;
    overflow: hidden;
    aspect-ratio: 16 / 9;
    background-color: var(--neutral-gray-4);
}
@media (max-width: 1023px) {
    .preview-card__image-area {
        aspect-ratio: 1 / 1;
    }
}

.preview-card__image {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: contain;
}

.preview-card__body {
    display: flex;
    flex-direction: column;
    gap: 20px;
    align-items: flex-start;
    width: 100%;
    padding: 24px;
    overflow: hidden;
    box-sizing: border-box;
    color: var(--primary-11);
}
@media (max-width: 1023px) {
    .preview-card__body {
        padding: 20px;
    }
}

.preview-card__title {
    margin: 0;
    width: 100%;
    color: var(--primary-11);
    font-family: var(--font-serif);
    font-size: var(--font-size-xl);
    font-weight: var(--font-weight-regular);
    line-height: var(--leading-heading);
    letter-spacing: var(--tracking-default);
    overflow-wrap: break-word;
}
@media (max-width: 1023px) {
    .preview-card__title {
        display: -webkit-box;
        max-height: 54px;
        overflow: hidden;
        font-size: var(--font-size-lg);
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }
}

.preview-card__separator {
    display: block;
    flex-shrink: 0;
    width: 60px;
    height: 1px;
    background-color: var(--primary-11);
}

.preview-card__text {
    display: flex;
    flex-direction: column;
    gap: 0;
    width: 100%;
    margin: 0;
    color: var(--primary-11);
    overflow-wrap: break-word;
}
@media (max-width: 1023px) {
    .preview-card__text {
        max-height: 150px;
        overflow: hidden;
    }
}

.preview-card__text p {
    margin: 0;
}

body.is-preview-card-open {
    overflow: hidden;
}

/* -------------------------------------------------------------------------
   bottom-nav
   ------------------------------------------------------------------------- */
.bottom-nav__inner {
    display: flex;
    align-items: stretch;
    width: 100%;
}
@media (max-width: 1023px) {
    .bottom-nav__inner {
        flex-direction: column;
    }
}

.bottom-nav__link {
    position: relative;
    display: flex;
    flex: 1;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding-block: 96px;
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    color: var(--neutral-white);
    text-align: center;
    text-decoration: none;
}
@media (max-width: 1023px) {
    .bottom-nav__link {
        flex: none;
        width: 100%;
        padding-block: 48px;
    }
}

.bottom-nav__link::before {
    position: absolute;
    inset: 0;
    z-index: 0;
    content: "";
    background-color: rgba(0, 0, 0, 0.45);
    pointer-events: none;
}

.bottom-nav__link--gyota {
    background-image: url("../images/common/bottom-nav/img-bottom-nav-gyota.webp");
}

.bottom-nav__link--kawagoe {
    background-image: url("../images/common/bottom-nav/img-bottom-nav-kawagoe.webp");
}

.bottom-nav__link--tsurugashima {
    background-image: url("../images/common/bottom-nav/img-bottom-nav-tsurugashima.webp");
}

.bottom-nav__kicker,
.bottom-nav__name {
    position: relative;
    z-index: 1;
}

.bottom-nav__kicker {
    font-size: 0.6875rem; /* 11px — Figma指定（トークン未定義） */
    font-weight: var(--font-weight-regular);
    line-height: normal;
    color: var(--neutral-white);
    text-transform: uppercase;
    white-space: nowrap;
}

.bottom-nav__name {
    color: var(--neutral-white);
}
@media (max-width: 1023px) {
    .bottom-nav__name {
        font-size: var(--font-size-2xl);
    }
}

/* -------------------------------------------------------------------------
   thanks
   ------------------------------------------------------------------------- */
.thanks-sec {
    background-color: var(--primary-1);
}

.thanks-sec-inner {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 80px;
    max-width: var(--pc-body-width-max);
    margin-inline: auto;
    padding: 100px 80px;
}

.thanks-header {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    max-width: 1280px;
}

.thanks-kicker {
    display: flex;
    gap: 16px;
    align-items: center;
}

.thanks-kicker-line {
    display: block;
    flex-shrink: 0;
    width: 30px;
    height: 1px;
    background-color: var(--primary-9);
}

.thanks-kicker-text {
    color: var(--primary-9);
    font-size: var(--font-size-xl);
}

.thanks-contents {
    display: flex;
    flex-direction: column;
    gap: 56px;
    width: 100%;
    max-width: 1054px;
}

.thanks-title {
    color: var(--primary-11);
    font-weight: 300;
    letter-spacing: 0.1em;
}

.thanks-title-break {
    display: none;
}

.thanks-text {
    color: var(--primary-11);
}

.thanks-contact {
    display: flex;
    justify-content: center;
    align-items: center;
    width: fit-content;
    padding: 20px 28px;
    border-top: 1px solid var(--primary-11);
    border-bottom: 1px solid var(--primary-11);
    color: var(--primary-11);
}

.thanks-contact p {
    margin: 0;
}

@media (max-width: 1023px) {
    .thanks-sec {
        background-color: var(--tertiary-1);
    }

    .thanks-sec-inner {
        align-items: stretch;
        gap: 56px;
        padding: 64px 20px;
    }

    .thanks-header {
        gap: 20px;
        max-width: none;
    }

    .thanks-kicker-text {
        font-size: var(--font-size-2xs);
    }

    .thanks-contents {
        gap: 36px;
        max-width: none;
    }

    .thanks-title {
        font-size: var(--font-size-2xl);
        font-weight: var(--font-weight-regular);
        letter-spacing: var(--tracking-default);
        text-align: center;
    }

    .thanks-title-break {
        display: inline;
    }

    .thanks-text,
    .thanks-contact {
        font-size: var(--font-size-xs);
    }

    .thanks-contact {
        align-self: center;
        padding: 16px 24px;
    }
}

/* -------------------------------------------------------------------------
   Location overrides — 欧文フォント（川越・鶴ヶ島）
   ------------------------------------------------------------------------- */
body.location-kawagoe,
body.location-tsurugashima {
    --font-latin: "Plus Jakarta Sans", sans-serif;
}

/* -------------------------------------------------------------------------
   Location overrides (kawagoe)
   ------------------------------------------------------------------------- */
body.location-kawagoe .fv {
    background-image: url("../images/kawagoe/fv/img-fv.webp");
}

body.location-kawagoe .cta {
    background-image: url("../images/kawagoe/cta/img-cta.webp");
}

@media (max-width: 1023px) {
    body.location-kawagoe .fv__kicker-text {
        white-space: normal;
    }

    body.location-kawagoe .about__inner {
        padding: 0 0 48px;
    }
}

body.location-kawagoe .exterior {
    background-color: var(--primary-3);
}

body.location-kawagoe .exterior__bg {
    background-color: var(--primary-1);
}

@media (max-width: 1023px) {
    body.location-kawagoe .exterior__bg {
        height: 81px;
    }
}

body.location-kawagoe .exterior__bg::after {
    background-color: var(--primary-3);
}

@media (max-width: 1023px) {
    body.location-kawagoe .exterior__plan-inner {
        align-items: stretch;
    }
}

body.location-kawagoe .exterior__madori-item img {
    object-fit: contain;
}

body.location-kawagoe .gallery {
    background-color: var(--primary-3);
}

body.location-kawagoe .point {
    background-color: var(--primary-3);
}

body.location-kawagoe .flow {
    background-color: var(--primary-2);
}

@media (min-width: 1024px) {
    body.location-kawagoe .flow__item {
        flex: 0 0 auto;
    }

    body.location-kawagoe .flow__item:last-child {
        width: auto;
    }

    body.location-kawagoe .flow__step {
        flex: none;
        width: auto;
        min-width: 192px;
    }
}

/* -------------------------------------------------------------------------
   Location overrides (tsurugashima)
   ------------------------------------------------------------------------- */
body.location-tsurugashima {
    --font-sans: "Zen Kaku Gothic New", sans-serif;
    --font-serif: "Zen Kaku Gothic New", sans-serif;
}

body.location-tsurugashima .site-header,
body.location-tsurugashima .site-header__inner {
    background-color: var(--neutral-gray-5);
}

@media (max-width: 1147px) {
    body.location-tsurugashima .site-header__drawer {
        background-color: var(--neutral-gray-3);
    }
}

body.location-tsurugashima .site-header__nav-link,
body.location-tsurugashima .site-header__phone,
body.location-tsurugashima .site-header__drawer-link {
    color: var(--neutral-black);
}

body.location-tsurugashima .site-header__divider {
    background-color: rgba(61, 61, 61, 0.1);
}

body.location-tsurugashima .site-header__hamburger-bar {
    background-color: var(--neutral-black);
}

body.location-tsurugashima .button--primary {
    color: var(--neutral-black);
    border-color: var(--neutral-black);
}

body.location-tsurugashima .button--primary:hover,
body.location-tsurugashima .button--primary:focus-visible {
    color: var(--primary-1);
    background-color: var(--neutral-black);
    border-color: var(--neutral-black);
}

body.location-tsurugashima .fv {
    background-image: url("../images/tsurugashima/fv/img-fv.webp");
}

body.location-tsurugashima .fv__kicker-line {
    background-color: var(--primary-1);
}

body.location-tsurugashima .fv__kicker-text {
    color: var(--primary-1);
    line-height: var(--leading-oneline);
}

body.location-tsurugashima .fv__heading {
    font-family: var(--font-sans);
    font-size: 4.25rem;
    text-shadow: 0 2px 3px rgba(61, 61, 61, 0.9);
}

@media (max-width: 1023px) {
    body.location-tsurugashima .fv__heading {
        font-size: var(--font-size-3xl);
        text-shadow: 0 2px 3px rgba(61, 61, 61, 0.8);
    }

    body.location-tsurugashima .fv__kicker-text {
        white-space: normal;
        font-size: var(--font-size-2xs);
    }

    body.location-tsurugashima .about__inner {
        padding: 0 0 48px;
    }
}

body.location-tsurugashima .fv__lead {
    font-family: var(--font-sans);
    font-size: 1.75rem;
    text-shadow: 0 2px 3px rgba(61, 61, 61, 0.8);
}

@media (max-width: 1023px) {
    body.location-tsurugashima .fv__lead {
        font-size: var(--font-size-base);
        text-shadow: 0 1px 2px rgba(61, 61, 61, 0.8);
    }
}

body.location-tsurugashima .about {
    background-color: var(--primary-1);
}

body.location-tsurugashima .about__kicker-line,
body.location-tsurugashima .about__separator {
    background-color: var(--neutral-black);
}

body.location-tsurugashima .about__kicker-text,
body.location-tsurugashima .about__heading,
body.location-tsurugashima .about__body {
    color: var(--neutral-black);
}

body.location-tsurugashima .about__heading {
    font-family: var(--font-sans);
}

body.location-tsurugashima .exterior {
    background-color: var(--neutral-gray-3);
}

body.location-tsurugashima .exterior__bg {
    background-color: var(--primary-1);
}

@media (max-width: 1023px) {
    body.location-tsurugashima .exterior__bg {
        height: 81px;
    }

    body.location-tsurugashima .exterior__plan-inner {
        align-items: stretch;
    }
}

body.location-tsurugashima .exterior__bg::after {
    background-color: var(--neutral-gray-3);
}

body.location-tsurugashima .exterior__madori-item img {
    object-fit: contain;
}

body.location-tsurugashima .section-header__kicker-line {
    background-color: var(--neutral-black);
}

body.location-tsurugashima .section-header__kicker-text,
body.location-tsurugashima .section-header__heading,
body.location-tsurugashima .section-header__lead-pc,
body.location-tsurugashima .section-header__lead-sp {
    color: var(--neutral-black);
}

body.location-tsurugashima .section-header__heading {
    font-family: var(--font-sans);
}

body.location-tsurugashima .interior-goods {
    background-color: var(--neutral-gray-3);
}

body.location-tsurugashima .flow {
    background-color: var(--neutral-gray-3);
}

/* 3ステップ構成のため、4ステップ前提の伸縮を抑える（川越と同様） */
@media (min-width: 1024px) {
    body.location-tsurugashima .flow__item {
        flex: 0 0 auto;
    }

    body.location-tsurugashima .flow__item:last-child {
        width: auto;
    }

    body.location-tsurugashima .flow__step {
        flex: none;
        width: auto;
        min-width: 192px;
    }
}

body.location-tsurugashima .point {
    background-color: var(--primary-1);
}

body.location-tsurugashima .point__title,
body.location-tsurugashima .point__text {
    color: var(--neutral-black);
}

body.location-tsurugashima .point__title-line {
    background-color: var(--neutral-black);
}

body.location-tsurugashima .interior-goods .section-header__kicker-line {
    background-color: var(--neutral-black);
}

body.location-tsurugashima .interior-goods .section-header__kicker-text,
body.location-tsurugashima .interior-goods .section-header__heading,
body.location-tsurugashima .interior-goods .section-header__lead-pc,
body.location-tsurugashima .interior-goods .section-header__lead-sp,
body.location-tsurugashima .interior-goods__catch,
body.location-tsurugashima .interior-goods__text {
    color: var(--neutral-black);
}

body.location-tsurugashima .flow__title {
    color: var(--neutral-black);
}

body.location-tsurugashima .flow__note {
    color: var(--neutral-gray-11);
}

body.location-tsurugashima .access {
    background-color: var(--primary-1);
}

body.location-tsurugashima .access__kicker-line,
body.location-tsurugashima .access__separator {
    background-color: var(--neutral-black);
}

body.location-tsurugashima .access__kicker-text,
body.location-tsurugashima .access__heading,
body.location-tsurugashima .access__info-item,
body.location-tsurugashima .access__tel {
    color: var(--neutral-black);
}

@media (max-width: 1023px) {
    body.location-tsurugashima .access__info-item,
    body.location-tsurugashima .access__note {
        color: var(--neutral-gray-11);
    }
}

body.location-tsurugashima .cta {
    background-image: url("../images/tsurugashima/cta/img-cta.webp");
}

body.location-tsurugashima .cta::before {
    position: absolute;
    inset: 0;
    z-index: 0;
    content: "";
    background-color: rgba(0, 0, 0, 0.45);
    pointer-events: none;
}

body.location-tsurugashima .cta__heading {
    font-family: var(--font-sans);
    text-shadow: 0 2px 3px rgba(61, 61, 61, 0.4);
}

@media (max-width: 1023px) {
    body.location-tsurugashima .cta__heading {
        text-shadow: 0 1px 2px rgba(61, 61, 61, 0.4);
    }
}

body.location-tsurugashima .preview-card__title {
    font-family: var(--font-sans);
    color: var(--neutral-black);
}

body.location-tsurugashima .preview-card__separator {
    background-color: var(--neutral-black);
}

body.location-tsurugashima .preview-card__text {
    color: var(--neutral-black);
}

body.location-tsurugashima .footer {
    background-color: var(--neutral-gray-5);
}

body.location-tsurugashima .footer__address {
    color: var(--neutral-black);
}