    /* ============================================================
       About Page — --b unit system (same as top.blade.php)
       SP design: 393px  → --b = calc(100vw / 39.3)  [1unit=10px]
       PC design: 1366px → --b = calc(100vw / 136.6) [1unit=10px]
       PC is default; SP overrides in @media (max-width: 1024px)
    ============================================================ */

    /* ===== Global ===== */
    .ab-page {
        padding-top: 0;
        --b: calc(100vw / 136.6);
    }

    .ab-page * {
        box-sizing: border-box;
    }

    .ab-page img {
        display: block;
        max-width: 100%;
    }

    .ab-more-btn {
        display: inline-flex;
        flex-direction: row;
        align-items: center;
        gap: calc(1.6 * var(--b));
        padding: calc(0.4 * var(--b));
        text-decoration: none;
        cursor: pointer;
        border: none;
        color: #212227;
        --bg-y: 100%;
        background: linear-gradient(#8E8E8E, #8E8E8E) 0 var(--bg-y)/100% 1px no-repeat;
    }

    .ab-more-btn__text {
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: calc(1.5 * var(--b));
        line-height: 170%;
        letter-spacing: .03em;
        color: #212227;
    }

    .ab-more-btn__icon svg {
        display: block;
    }

    /* ===== MV ===== */
    .ab-mv {
        position: relative;
        width: 100%;
        height: 100vh;
        min-height: calc(60 * var(--b));
        overflow: hidden;
        background: #212227;
    }

    .ab-mv__img {
        position: absolute;
        inset: 0;
        width: 100%;
        height: 100%;
    }

    .ab-mv__img img,
    .ab-mv__img source {
        width: 100%;
        height: 100%;
        object-fit: cover;
        object-position: center;
    }

    .ab-mv__text {
        position: absolute;
        left: calc(12 * var(--b));
        top: 60%;
        transform: translateY(-50%);
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: calc(1 * var(--b));
        isolation: isolate;
        width: auto;
    }

    .ab-mv__blur {
        position: absolute;
        width: calc(24 * var(--b));
        height: calc(24 * var(--b));
        left: calc(-5 * var(--b));
        top: 50%;
        transform: translateY(-50%);
        background: #1C3537;
        opacity: 0.5;
        filter: blur(calc(6 * var(--b)));
        border-radius: 50%;
        z-index: 0;
    }

    .ab-mv__title {
        position: relative;
        z-index: 1;
        font-family: new-spirit, serif;
        font-weight: 500;
        font-size: calc(6.4 * var(--b));
        line-height: 100%;
        color: #FFFFFF;
        margin: 0;
    }

    /* ===== Intro (Concept + About) ===== */
    .ab-intro {
        position: relative;
        overflow: hidden;
        background: #EDECE2;
    }

    .ab-intro__bg {
        position: absolute;
        inset: 0;
        z-index: 0;
        pointer-events: none;
        padding-top: 20rem;
    }

    .ab-intro__bg svg {
        width: 100%;
        display: block;
    }

    .ab-intro__bg-pc {
        display: block;
        height: 100%;
    }

    .ab-intro__divider-sp {
        display: none;
    }

    .ab-intro__divider-sp svg {
        width: 100%;
        height: auto;
        display: block;
    }

    .ab-intro__inner {
        position: relative;
        z-index: 1;
        padding: calc(15 * var(--b)) calc(12 * var(--b));
        display: flex;
        flex-direction: column;
        gap: calc(10 * var(--b));
    }

    .ab-concept__inner {
        display: flex;
        flex-direction: column;
        gap: calc(4 * var(--b));
        max-width: calc(112.6 * var(--b));
    }

    .ab-concept__title {
        font-family: new-spirit, serif;
        font-weight: 400;
        font-size: calc(3.2 * var(--b));
        line-height: 170%;
        color: #212227;
        margin: 0;
    }

    .ab-concept__paragraphs {
        display: flex;
        flex-direction: column;
        gap: calc(3 * var(--b));
    }

    .ab-concept__p {
        font-family: 'Shippori Mincho', serif;
        font-weight: 500;
        font-size: calc(1.8 * var(--b));
        line-height: 200%;
        letter-spacing: .03em;
        color: #212227;
        margin: 0;
    }

    .ab-about__inner {
        display: flex;
        flex-direction: column;
        gap: calc(3 * var(--b));
        max-width: calc(112.6 * var(--b));
        width: auto;
        background: none;
        margin: calc(4 * var(--b)) 0 0;
        padding: calc(25 * var(--b)) calc(2 * var(--b)) calc(8 * var(--b));
    }

    .ab-about__title {
        font-family: new-spirit, serif;
        font-weight: 400;
        font-size: calc(3.2 * var(--b));
        line-height: 170%;
        color: #212227;
        margin: 0;
    }

    .ab-about__contents {
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        gap: calc(8 * var(--b));
    }

    .ab-about__texts {
        display: flex;
        flex-direction: column;
        gap: calc(6 * var(--b));
        flex: 0 0 calc(44.3 * var(--b));
        padding-top: calc(0.8 * var(--b));
    }

    .ab-about__paragraph {
        display: flex;
        flex-direction: column;
        gap: calc(1.6 * var(--b));
    }

    .ab-about__paragraph p {
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: calc(1.5 * var(--b));
        line-height: 170%;
        letter-spacing: .03em;
        color: #212227;
        margin: 0;
    }

    .ab-about__btn {
        display: flex;
        justify-content: flex-end;
    }

    .ab-about__image {
        flex: 0 0 calc(60.3 * var(--b));
        width: calc(60.3 * var(--b));
        height: calc(45.2 * var(--b));
        max-width: unset;
        overflow: hidden;
    }

    .ab-about__image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    /* ===== Progress Carousel (Stay / Sauna) ===== */
    .ab-pc {
        display: flex;
        flex-direction: column;
        gap: calc(3 * var(--b));
    }

    .ab-pc__viewport {
        width: 100%;
        overflow-x: scroll;
        overflow-y: hidden;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
        scroll-snap-type: x mandatory;
    }

    .ab-pc__viewport::-webkit-scrollbar {
        display: none;
    }

    .ab-pc__track {
        display: flex;
        gap: calc(2 * var(--b));
    }

    .ab-pc__item {
        flex: 0 0 calc((100% - calc(4 * var(--b))) / 3);
        width: auto;
        scroll-snap-align: start;
        display: flex;
        flex-direction: column;
        gap: calc(1 * var(--b));
    }

    .ab-pc__item-img {
        width: 100%;
        height: calc(36.2 * var(--b));
        overflow: hidden;
        background: #E5E4D5;
    }

    .ab-pc__item-img img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .ab-pc__item-caption {
        align-self: flex-start;
        font-family: 'Noto Sans JP', sans-serif;
        font-size: calc(1.2 * var(--b));
        line-height: 170%;
        letter-spacing: .03em;
        color: #212227;
        text-align: center;
    }

    .ab-pc__bottom {
        display: flex;
        flex-direction: column;
        gap: calc(2 * var(--b));
    }

    .ab-pc__progress {
        position: relative;
        width: 100%;
        height: 2px;
        background: #FFFFFF;
    }

    .ab-pc__fill {
        position: absolute;
        left: 0;
        top: 0;
        height: 2px;
        background: #212227;
        transition: width 0.35s ease;
        width: 11.11%;
    }

    .ab-pc__arrows {
        display: flex;
        justify-content: flex-end;
        gap: calc(3 * var(--b));
    }

    .ab-pc__arrow {
        background: none;
        border: none;
        cursor: pointer;
        padding: 0;
        width: calc(1.6 * var(--b));
        height: calc(1.6 * var(--b));
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .ab-pc__arrow svg {
        display: block;
    }

    /* ===== Stay ===== */
    .ab-stay {
        background: #EDECE2;
        padding: calc(12 * var(--b)) calc(12 * var(--b)) calc(9.5 * var(--b));
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: calc(4 * var(--b));
    }

    .ab-stay__inner {
        display: flex;
        flex-direction: column;
        gap: calc(4 * var(--b));
        align-self: stretch;
    }

    .ab-stay__heading {
        display: flex;
        flex-direction: column;
        gap: calc(1.6 * var(--b));
    }

    .ab-stay__title-row {
        display: flex;
        flex-direction: row;
        align-items: flex-end;
        gap: calc(1.6 * var(--b));
    }

    .ab-stay__title {
        font-family: new-spirit, serif;
        font-weight: 400;
        font-size: calc(3.6 * var(--b));
        line-height: 100%;
        color: #212227;
        margin: 0;
    }

    .ab-stay__subtitle {
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: calc(1.4 * var(--b));
        line-height: 170%;
        letter-spacing: .03em;
        color: #212227;
    }

    .ab-stay__lead {
        display: flex;
        flex-direction: column;
        gap: calc(0.8 * var(--b));
    }

    .ab-stay__lead p {
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: calc(1.5 * var(--b));
        line-height: 170%;
        letter-spacing: .03em;
        color: #212227;
        margin: 0;
    }

    .ab-stay__box {
        display: flex;
        flex-direction: column;
        gap: calc(6 * var(--b));
    }

    .ab-stay__list {
        display: flex;
        flex-direction: column;
        gap: calc(1 * var(--b));
        padding: 0;
        border-bottom: none;
    }

    .ab-stay__list:last-child {
        padding: 0;
        border-bottom: none;
    }

    .ab-stay__list-title-row {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        gap: calc(1.6 * var(--b));
        padding: 0;
    }

    .ab-stay__list-name {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: calc(0.4 * var(--b));
    }

    .ab-stay__list-name-jp {
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: calc(2 * var(--b));
        line-height: 170%;
        letter-spacing: .03em;
        color: #212227;
    }

    .ab-stay__list-name-sep {
        width: 0;
        height: calc(0.8 * var(--b));
        border-left: 1px solid #8E8E8E;
        margin: 0 calc(0.4 * var(--b));
    }

    .ab-stay__list-name-en {
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: calc(1.2 * var(--b));
        line-height: 170%;
        letter-spacing: .03em;
        color: #212227;
    }

    .ab-stay__btn-row {
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: calc(2 * var(--b));
    }

    /* ===== Sauna ===== */
    .ab-sauna {
        background: #EDECE2;
        padding: calc(9.5 * var(--b)) calc(12 * var(--b)) calc(12 * var(--b));
        display: flex;
        flex-direction: column;
        align-items: flex-end;
        gap: calc(4 * var(--b));
    }

    .ab-sauna__inner {
        display: flex;
        flex-direction: column;
        gap: calc(4 * var(--b));
        align-self: stretch;
    }

    .ab-sauna__heading {
        display: flex;
        flex-direction: column;
        gap: calc(1.6 * var(--b));
    }

    .ab-sauna__title-row {
        display: flex;
        flex-direction: row;
        align-items: flex-end;
        gap: calc(1.6 * var(--b));
    }

    .ab-sauna__title {
        font-family: new-spirit, serif;
        font-weight: 400;
        font-size: calc(3.6 * var(--b));
        line-height: 100%;
        color: #212227;
        margin: 0;
        min-width: unset;
    }

    .ab-sauna__subtitle {
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: calc(1.4 * var(--b));
        line-height: 170%;
        letter-spacing: .03em;
        color: #212227;
    }

    .ab-sauna__lead {
        display: flex;
        flex-direction: column;
        gap: calc(0.8 * var(--b));
    }

    .ab-sauna__lead p {
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: calc(1.5 * var(--b));
        line-height: 170%;
        letter-spacing: .03em;
        color: #212227;
        margin: 0;
    }

    /* ===== Models ===== */
    .ab-models {
        background: #E5E4D5;
        padding: calc(12 * var(--b)) calc(12 * var(--b));
    }

    .ab-models__inner {
        display: flex;
        flex-direction: column;
        gap: calc(4 * var(--b));
    }

    .ab-models__cols {
        display: flex;
        flex-direction: row;
        overflow: visible;
        gap: calc(10 * var(--b));
        align-items: flex-start;
    }

    .ab-models__left {
        display: block;
        flex: 0 0 calc(24 * var(--b));
    }

    .ab-models__title-row {
        display: flex;
        flex-direction: row;
        align-items: flex-end;
        gap: calc(1.6 * var(--b));
    }

    .ab-models__title {
        font-family: new-spirit, serif;
        font-weight: 400;
        font-size: calc(3.6 * var(--b));
        line-height: 100%;
        color: #212227;
        margin: 0;
    }

    .ab-models__subtitle {
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: calc(1.4 * var(--b));
        line-height: 170%;
        letter-spacing: .03em;
        color: #212227;
    }

    .ab-models__right {
        flex: 1;
        min-width: 0;
        display: flex;
        flex-direction: column;
        gap: calc(6 * var(--b));
        overflow: visible;
        scroll-snap-type: none;
    }

    .ab-model-item {
        flex: none;
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: calc(2 * var(--b));
        padding-bottom: calc(6 * var(--b));
    }

    .ab-model-item:last-child {
        border-bottom: none;
        padding-bottom: 0;
    }

    .ab-model-item__title {
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: calc(1.8 * var(--b));
        line-height: 100%;
        color: #212227;
        margin: 0;
    }

    .ab-model-item__body {
        display: flex;
        flex-direction: row;
        gap: calc(4 * var(--b));
        align-items: flex-start;
    }

    .ab-model-item__image {
        flex: 0 0 calc(31.3 * var(--b));
        width: calc(31.3 * var(--b));
        aspect-ratio: 27 / 20;
        height: auto;
        overflow: hidden;
        background: #EDECE2;
    }

    .ab-model-item__image img {
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .ab-model-item__info {
        flex: 1;
        display: flex;
        flex-direction: column;
        gap: calc(2 * var(--b));
    }

    .ab-model-item__desc {
        display: flex;
        flex-direction: column;
        gap: calc(0.8 * var(--b));
    }

    .ab-model-item__desc p {
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: calc(1.5 * var(--b));
        line-height: 170%;
        letter-spacing: .03em;
        color: #212227;
        margin: 0;
    }

    .ab-model-item__btn {
        display: flex;
        justify-content: flex-end;
    }

    .ab-models__sp-nav {
        display: none;
    }

    .ab-models__sp-dots {
        display: flex;
        flex-direction: row;
        gap: calc(0.8 * var(--b));
        align-items: center;
    }

    .ab-models__sp-dot {
        width: calc(0.7 * var(--b));
        height: calc(0.7 * var(--b));
        border-radius: 50%;
        background: #D1D0C1;
        border: none;
        padding: 0;
        cursor: pointer;
        transition: background 0.2s;
        flex-shrink: 0;
    }

    .ab-models__sp-dot.is-active {
        background: #212227;
    }

    .ab-models__sp-arrows {
        display: flex;
        flex-direction: row;
        gap: calc(3 * var(--b));
        align-items: center;
    }

    .ab-models__sp-arrow {
        background: none;
        border: none;
        cursor: pointer;
        padding: 0;
        width: calc(1.6 * var(--b));
        height: calc(1.6 * var(--b));
        display: flex;
        align-items: center;
        justify-content: center;
        touch-action: manipulation;
        -webkit-tap-highlight-color: transparent;
        position: relative;
        z-index: 2;
    }

    .ab-models__sp-arrow::before {
        content: '';
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: calc(4.8 * var(--b));
        height: calc(4.8 * var(--b));
    }

    .ab-models__sp-arrow svg {
        display: block;
    }

    /* ===== Where We Are ===== */
    .ab-where {
        background: #EDECE2;
        padding: calc(12 * var(--b)) calc(12 * var(--b));
        position: relative;
    }

    .back-to-top {
        position: absolute;
        bottom: calc(-1.4 * var(--b));
        left: 80%;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        padding: calc(1 * var(--b)) calc(2 * var(--b));
        gap: calc(0.8 * var(--b));
        height: calc(4 * var(--b));
        background: #FFFFFF;
        border-radius: 9999px;
        border: none;
        cursor: pointer;
        z-index: 10;
        white-space: nowrap;
    }

    .back-to-top span {
        font-family: new-spirit, serif;
        font-weight: 500;
        font-size: calc(1.2 * var(--b));
        line-height: 100%;
        letter-spacing: 0.03em;
        text-transform: uppercase;
        color: #212227;
        white-space: nowrap;
    }

    .ab-where__header {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: flex-end;
        gap: calc(1.6 * var(--b));
        margin-bottom: calc(6 * var(--b));
    }

    .ab-where__title-row {
        display: flex;
        flex-direction: row;
        align-items: flex-end;
        gap: calc(1.6 * var(--b));
    }

    .ab-where__title {
        font-family: new-spirit, serif;
        font-weight: 400;
        font-size: calc(3.6 * var(--b));
        line-height: 100%;
        color: #212227;
        margin: 0;
    }

    .ab-where__subtitle {
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: calc(1.4 * var(--b));
        line-height: 170%;
        letter-spacing: .03em;
        color: #212227;
    }

    .ab-where__map-link {
        display: inline-flex;
        align-items: center;
        gap: calc(0.8 * var(--b));
        font-family: 'Noto Sans JP', sans-serif;
        font-size: calc(1.4 * var(--b));
        line-height: 170%;
        letter-spacing: .03em;
        color: #212227;
        text-decoration: none;
        cursor: pointer;
        --bg-y: 100%;
        background: linear-gradient(#8E8E8E, #8E8E8E) 0 var(--bg-y)/100% 1px no-repeat;
    }

    .ab-where__grid {
        display: grid;
        grid-template-columns: 1fr 1fr 1fr;
        gap: calc(4 * var(--b));
    }

    .ab-where__bottom {
        display: flex;
        justify-content: center;
        padding-top: calc(4 * var(--b));
    }

    .ab-where__bottom .ab-loc-card__cta {
        display: inline-flex;
    }

    .ab-loc-card {
        display: flex;
        flex-direction: column;
        gap: calc(1.6 * var(--b));
        cursor: pointer;
        align-items: flex-start;
        border-bottom: none;
        padding: 0;
    }

    .ab-loc-card:last-child {
        border-bottom: none;
        padding: 0;
    }

    .ab-loc-card__head {
        display: flex;
        flex-direction: row;
        justify-content: space-between;
        align-items: center;
        width: auto;
    }

    .ab-loc-card__name-group {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: calc(1.6 * var(--b));
    }

    .ab-loc-card__name {
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: calc(2 * var(--b));
        line-height: 170%;
        letter-spacing: .03em;
        color: #212227;
        margin: 0;
    }

    .ab-loc-card__divider {
        width: 1px;
        height: calc(0.8 * var(--b));
        background: #8E8E8E;
    }

    .ab-loc-card__area {
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: calc(1.2 * var(--b));
        line-height: 170%;
        letter-spacing: .03em;
        color: #212227;
    }

    .ab-loc-card__cta {
        display: none;
        flex-direction: row;
        align-items: center;
        padding: calc(1 * var(--b)) calc(1.6 * var(--b)) calc(1 * var(--b)) calc(2 * var(--b));
        gap: calc(0.8 * var(--b));
        background: #FFFFFF;
        border-radius: 9999px;
        text-decoration: none;
        white-space: nowrap;
        font-family: 'Noto Sans JP', sans-serif;
        font-weight: 400;
        font-size: calc(1.4 * var(--b));
        line-height: 100%;
        letter-spacing: .03em;
        color: #212227;
        transition: background 0.2s ease, color 0.2s ease;
    }

    .ab-loc-card__cta:hover {
        background: #212227;
        color: #FFFFFF;
    }

    .ab-loc-card__cta:hover svg path {
        stroke: #FFFFFF;
    }

    /* Location carousel */
    .ab-loc-carousel {
        position: relative;
        width: 100%;
    }

    .ab-loc-carousel__cta-pc {
        display: flex;
        position: absolute;
        top: calc(1 * var(--b));
        right: calc(1 * var(--b));
        width: calc(2.8 * var(--b));
        height: calc(2.8 * var(--b));
        background: rgba(255, 255, 255, 0.92);
        border: 1px solid #212227;
        border-radius: 50%;
        align-items: center;
        justify-content: center;
        text-decoration: none;
        z-index: 2;
        flex-shrink: 0;
        transform: scale(1);
        transform-origin: bottom left;
        transition: transform 0.4s ease;
    }

    .ab-loc-carousel__cta-pc:hover {
        transform: scale(1.6);
    }

    .ab-loc-carousel__wrap {
        width: 100%;
        aspect-ratio: 1 / 1;
        overflow: hidden;
        background: #D1D0C1;
        position: relative;
        transform: scale(1);
        transition: transform 0.4s ease;
    }

    .ab-loc-slides {
        display: flex;
        height: 100%;
        transition: transform 0.35s ease;
    }

    .ab-loc-slide {
        flex-shrink: 0;
        width: 100%;
        height: 100%;
        overflow: hidden;
    }

    .ab-loc-slide img {
        width: 100%;
        height: 100%;
        object-fit: cover;
        display: block;
        transform: scale(1.04);
        transition: transform 0.4s ease;
    }

    .ab-loc-card:hover .ab-loc-carousel__wrap {
        transform: scale(0.97);
    }

    .ab-loc-card:hover .ab-loc-slide img {
        transform: scale(1.07);
    }

    .ab-loc-card:hover .ab-loc-carousel__cta-pc {
        transform: scale(1.6);
    }

    .ab-loc-carousel__nav {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: space-between;
        padding: calc(1 * var(--b)) 0;
    }

    .ab-loc-carousel__dots {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: calc(0.8 * var(--b));
    }

    .ab-loc-dot {
        width: calc(0.7 * var(--b));
        height: calc(0.7 * var(--b));
        border-radius: 50%;
        background: #D1D0C1;
        border: none;
        padding: 0;
        cursor: pointer;
        transition: background 0.2s;
        flex-shrink: 0;
    }

    .ab-loc-dot.is-active {
        background: #212227;
    }

    .ab-loc-carousel__prev-next {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: calc(3 * var(--b));
    }

    .ab-loc-carousel__btn {
        background: none;
        border: none;
        cursor: pointer;
        padding: 0;
        width: calc(1.6 * var(--b));
        height: calc(1.6 * var(--b));
        display: flex;
        align-items: center;
        justify-content: center;
        flex-shrink: 0;
    }

    .ab-loc-carousel__btn svg {
        display: block;
        transition: transform 0.2s ease;
    }

    .ab-loc-carousel__btn[data-dir="next"]:hover svg {
        transform: translateX(3px);
    }

    .ab-loc-carousel__btn[data-dir="prev"]:hover svg {
        transform: translateX(-3px);
    }

    /* ===== SP overrides (max-width: 1024px) ===== */
    @media (max-width: 1024px) {

        .ab-page {
            --b: calc(100vw / 39.3);
        }

        /* MV */
        .ab-mv {
            height: calc(85.2 * var(--b));
            min-height: calc(85.2 * var(--b));
        }

        .ab-mv__text {
            left: calc(2 * var(--b));
            top: 50%;
            width: calc(100% - calc(4 * var(--b)));
        }

        .ab-mv__title {
            font-size: calc(4.8 * var(--b));
        }

        /* Intro */
        .ab-intro__bg {
            padding-top: 0;
        }

        .ab-intro__bg .ab-intro__bg-pc {
            display: none;
        }

        .ab-intro__divider-sp {
            display: block;
            margin: calc(1 * var(--b)) calc(-2 * var(--b)) 0;
            width: calc(100% + calc(4 * var(--b)));
        }

        .ab-intro__inner {
            padding: calc(8 * var(--b)) calc(2 * var(--b)) 0;
            gap: 0;
        }

        .ab-concept__title {
            font-size: calc(2.4 * var(--b));
        }

        .ab-concept__p {
            font-size: calc(1.5 * var(--b));
        }

        /* About */
        .ab-about__inner {
            max-width: none;
            width: calc(100% + calc(4 * var(--b)));
            background: #E5E4D5;
            margin: calc(-16 * var(--b)) calc(-2 * var(--b)) 0;
            padding: calc(2 * var(--b)) calc(2 * var(--b)) calc(8 * var(--b));
            position: relative;
            z-index: 1;
            gap: calc(2 * var(--b));
        }

        .ab-about__title {
            font-size: calc(2.4 * var(--b));
        }

        .ab-about__contents {
            flex-direction: column;
            gap: calc(2 * var(--b));
        }

        .ab-about__texts {
            flex: none;
            width: 100%;
            gap: calc(3 * var(--b));
            order: 2;
        }

        .ab-about__image {
            flex: none;
            width: 100%;
            max-width: calc(35.3 * var(--b));
            height: calc(35.3 * var(--b));
            order: 1;
        }

        /* Progress carousel */
        .ab-pc__item {
            flex: 0 0 100%;
            width: 100%;
        }

        .ab-pc__item-img {
            height: calc(35.3 * var(--b));
        }

        .ab-pc__progress {
            background: #E4E4E4;
        }

        /* Stay */
        .ab-stay {
            padding: calc(6 * var(--b)) calc(2 * var(--b));
        }

        .ab-stay__inner {
            gap: calc(3 * var(--b));
        }

        .ab-stay__title {
            font-size: calc(3.2 * var(--b));
        }

        .ab-stay__box {
            gap: 0;
        }

        .ab-stay__list {
            padding: calc(4 * var(--b)) 0 calc(6 * var(--b));
            border-bottom: 1px solid #D1D0C1;
        }

        .ab-stay__list:last-child {
            padding: calc(6 * var(--b)) 0 calc(2 * var(--b));
            border-bottom: none;
        }

        /* Sauna */
        .ab-sauna {
            padding: calc(6 * var(--b)) calc(2 * var(--b));
        }

        .ab-sauna__inner {
            gap: calc(3 * var(--b));
        }

        .ab-sauna__title {
            font-size: calc(3.2 * var(--b));
        }

        /* Models */
        .ab-models {
            padding: calc(6 * var(--b)) 0 calc(6 * var(--b)) calc(2 * var(--b));
        }

        .ab-models__cols {
            flex-direction: column;
            overflow: hidden;
            gap: calc(3 * var(--b));
        }

        .ab-models__left {
            display: none;
        }

        .ab-models__title {
            font-size: calc(3.2 * var(--b));
        }

        .ab-models__inner {
            gap: 0;
        }

        .ab-models__title-row {
            margin-bottom: calc(4 * var(--b));
        }

        .ab-models__right {
            flex-direction: row;
            gap: 0;
            overflow-x: scroll;
            overflow-y: hidden;
            -webkit-overflow-scrolling: touch;
            scrollbar-width: none;
            scroll-snap-type: x mandatory;
            align-items: flex-start;
        }

        .ab-models__right::-webkit-scrollbar {
            display: none;
        }

        .ab-model-item {
            flex: 0 0 calc(100% - 4 * var(--b));
            width: calc(100% - 4 * var(--b));
            margin-right: calc(1 * var(--b));
            padding-bottom: 0;
            scroll-snap-align: start;
        }

        .ab-model-item:last-child {
            margin-right: calc(2 * var(--b));
        }

        .ab-model-item__body {
            flex-direction: column;
            gap: calc(2.8 * var(--b));
        }

        .ab-model-item__image {
            flex: none;
            width: 100%;
            height: auto;
            aspect-ratio: 1;
        }

        .ab-models__sp-nav {
            display: flex;
            flex-direction: row;
            align-items: center;
            justify-content: space-between;
            padding-top: 0;
            position: relative;
            z-index: 2;
            margin-top: 30px;
            margin-right: calc(2 * var(--b));
            transition: margin-top 0.4s ease;
        }

        /* Where We Are */
        .ab-where {
            padding: calc(6 * var(--b)) calc(2 * var(--b)) calc(15 * var(--b));
        }

        .ab-where__header {
            flex-direction: column;
            justify-content: flex-start;
            align-items: flex-start;
            gap: calc(1.6 * var(--b));
            margin-bottom: calc(4 * var(--b));
        }

        .ab-where__map-link {
            align-self: flex-end;
        }

        .ab-where__title {
            font-size: calc(3.2 * var(--b));
        }

        .ab-where__grid {
            display: flex;
            flex-direction: column;
            gap: 0;
        }

        .ab-loc-card {
            align-items: flex-end;
            gap: calc(2 * var(--b));
            border-bottom: 1px solid #D1D0C1;
            padding: calc(4 * var(--b)) 0 calc(6 * var(--b));
        }

        .ab-loc-card:first-child {
            padding-top: 0;
        }

        .ab-loc-card:last-child {
            border-bottom: none;
            padding: calc(4 * var(--b)) 0 0;
        }

        .ab-loc-card__head {
            width: 100%;
        }

        .ab-loc-card__cta {
            display: inline-flex;
        }

        .ab-loc-carousel__cta-pc {
            display: none;
        }

        .ab-loc-slide img {
            transition: none;
        }

        .ab-loc-card:hover .ab-loc-carousel__wrap {
            transform: none;
        }

        .ab-loc-card:hover .ab-loc-slide img {
            transform: none;
        }

        .back-to-top {
            bottom: calc(-1.4 * var(--b));
            left: 50%;
            transform: translateX(-50%);
        }
        .ab-model-item__desc p {
            font-size: calc(1.4 * var(--b));
        }
    }

    @media (hover: hover) and (pointer: fine) {
        .ab-more-btn,
        .ab-where__map-link {
            transition: background-size 0.4s ease-out, background-position 0s 0.4s;
        }
        .ab-more-btn:hover,
        .ab-where__map-link:hover {
            background-size: 0 1px;
            background-position: 100% var(--bg-y);
            transition: background-size 0.4s ease-out;
        }
    }

    .ab-pc__viewport,
    #ab-models-track { cursor: grab; }
    .ab-pc__viewport:active,
    #ab-models-track:active { cursor: grabbing; }
