@media (max-width: 860px) {
    .home-story__layout {
        flex-direction: column;
        min-height: 0;
    }

    .home-story__main {
        max-width: 100%;
        flex: 1 1 auto;
        min-height: min(72vw, 420px);
    }

    .home-story__jp {
        flex: 1 1 auto;
        justify-content: center;
        padding: 20px 16px 28px;
        min-height: 160px;
    }

    .home-story__jpCols {
        justify-content: center;
    }

    .home-trio__grid {
        flex-direction: column;
        min-height: 0;
    }

    .home-trio__photo {
        flex: 1 1 auto;
        min-height: 260px;
    }

    .home-trio__brand {
        flex: 1 1 auto;
        min-height: 280px;
        padding-top: 28px;
        padding-bottom: 28px;
    }

    .home-trio--about .home-trio__brand {
        min-width: 0;
    }

    .home-trio--about .home-trio__photo--aboutLeft,
    .home-trio--about .home-trio__photo--aboutRight {
        background-position: center center;
    }

    .home-cta {
        flex-wrap: wrap;
        min-height: 0;
    }

    .home-cta__panel {
        flex: 1 1 100%;
        min-height: 240px;
    }

    .home-cta__dividerText {
        writing-mode: horizontal-tb;
        text-orientation: mixed;
        letter-spacing: 18px;
    }
}

@media (max-width: 767px) {
    .ui.container {
        width: auto !important;
        margin-left: 0em !important;
        margin-right: 0em !important;
    }
    
    .about-content__split {
        flex-direction: column;
        min-height: 0;
    }

    .about-content__splitPhoto {
        flex: none;
        min-height: min(62vw, 320px);
        background-position: center center;
    }

    .about-content__splitRail {
        flex: none;
        width: 100%;
        padding: 18px 16px 22px;
        background: var(--ume-orange);
        color: #fff;
    }

    .about-content__splitRailInner {
        flex-direction: column;
        gap: 10px;
    }

    .about-content__splitLead,
    .about-content__splitTitle {
        writing-mode: horizontal-tb;
        text-orientation: mixed;
        text-align: center;
        max-width: 36em;
        color: #fff;
    }

    .about-content__splitLead {
        font-size: 13px;
        letter-spacing: 0.06em;
    }

    .about-content__splitTitle {
        font-size: clamp(22px, 6vw, 28px);
        letter-spacing: 0.08em;
    }

    .about-sauce {
        padding: clamp(24px, 5vw, 40px) 12px;
    }

    .about-sauce__card {
        flex: 1 1 100%;
        max-width: 100%;
    }

    .about-sauce__cardsRow {
        flex-direction: column;
        align-items: stretch;
    }
}

@media (max-width: 600px) {
    .ume-footer__inner {
        align-items: center;
        gap: 5px;
        padding: 10px;
        flex-wrap: nowrap;
    }

    .ume-footer__right,
    .ume-footer__left {
        align-items: center;
        text-align: center;
        margin-left: 0;
    }

    .ume-footer__line {
        justify-content: center;
        gap: 3px;
    }

    .ume-footer__line--address {
        max-width: 100%;
        display: block;
    }
    .ume-footer__line--address .ume-footer__ico {
        font-size: 21px;
        top: 2px;
    }
}

@media (max-width: 520px) {
    body {
        background-size: 100% 100%;
    }

    #header {
        background: #000000;
    }
    .is-sticky #header {
        background: transparent;
    }
    .ume-header {
        padding: 10px 15px;
    }
    .ume-header__logo img {
        width: 70px;
    }

    .is-sticky .ume-header__logo img {
        width: 65px;
    }

    .is-sticky .ume-menu-btn__home {
        width: 42px;
        height: 42px;
    }

    .ume-icon-btn {
        width: 34px;
        height: 34px;
    }
    .ume-quick-actions {
        width: 48px;
    }
    .ume-quick-actions__seg--hotline {
        display: none;
    }
    .ume-menu-btn { width: 50px; height: 50px; }
    .ume-quick-actions__hotlineNum,
    .ume-quick-actions__hotlineText,
    .ume-quick-actions__bookVn,
    .ume-quick-actions__bookJp {
        font-size: 13px;
    }
    .ume-menu-btn__bars { top: 12px; width: 24px; height: 24px; }
    .is-sticky .ume-menu-btn__bars {
        top: 10px;
        width: 24px;
        height: 24px;
    }
    .ume-hotline,
    .ume-header__social {
        flex-direction: row;
        align-items: center;
    }
    .ume-header__right {
        gap: 0;
    }
    .is-sticky .ume-header__right {
        gap: 0;
    }
    .ume-hotline__label { font-size: 16px; }
    .ume-hotline__pill { font-size: 15px; }
    .ume-menu__bar {
        display: block;
        text-align: center;
        padding: 20px 12px;
    }
    .ume-menu__list {
        display: block;
    }
    .ume-menu__item {
        text-align: center;
    }
    .ume-menu__close {
        position: absolute;
        top: 20px;
        right: 20px;
    }
    .home-trio__brandMain { font-size: 48px; }
    .home-trio__brandSub { font-size: 14px; }
    #home,
    #about,
    #location,
    #promo,
    #membership {
        top: 0;
    }
    .home-slider {
        top: 0;
        position: relative;
        margin-top: 103px;
    }
    #about .home-slider--pageHero {
        height: clamp(300px, 48vh, 460px);
    }
    .location-content {
        padding: clamp(60px, 2vw, 12px) clamp(16px, 0vw, 18px) clamp(16px, 0vw, 18px);;
    }

    .location-split {
        flex-direction: column;
        min-height: 0;
    }

    .location-split__gallery,
    .location-split__panel {
        flex: 1 1 auto;
        width: 100%;
    }

    .location-slider__slide img {
        min-height: clamp(240px, 56vw, 360px);
    }

    .location-widget__main {
        padding: clamp(18px, 4vw, 28px) clamp(14px, 3vw, 20px);
    }

    .location-widget__placeholder,
    .location-widget__mapFrame {
        width: 380px;
        height: 249px;
    }

    .location-slider .location-slider__owl .owl-nav {
        margin-bottom: 0;
        padding-bottom: clamp(8px, 2vw, 14px);
    }

    .promo-content__col--follow {
        flex: 1 1 100%;
        margin-left: 0;
    }

    .promo-news__item {
        flex-direction: column;
        align-items: stretch;
    }

    .promo-news__thumb {
        flex: 0 0 auto;
        max-width: 100%;
        width: 100%;
    }

    .promo-modal__dialog {
        width: min(100%, 400px);
        max-height: 92vh;
    }

    .promo-modal__cover {
        max-height: 38vh;
    }

    .membership-content__hero {
        display: block;
        width: 100%;
    }
    .membership-content__heroText {
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
    }
    .membership-content__benefitRow {
        grid-template-columns: 1fr;
        gap: 12px;
    }

    .membership-content__benefitIconCol {
        max-width: none;
    }

    #home, #about, #booking, #menu, #location, #promo, #membership {
        top: 0;
    }

    .menu-content {
        padding: 20px 0;
    }

    .menu-content__viewport {
        margin: 0 40px;
    }

    .menu-content__slide img {
        height: auto;
    }

    .menu-content .menu-content__owl .owl-nav .owl-prev {
        left: -40px;
    }

    .menu-content .menu-content__owl .owl-nav .owl-next {
        right: -40px;
    }
    .page-title__jp {
        font-size: clamp(18px, 3.4vw, 36px);
    }
    .page-title__vn {
        font-size: clamp(24px, 5.8vw, 46px);
    }
    .booking-content {
        padding: 0;
    }
    .booking-content__title {
        margin: 20px 0;
    }
    .booking-content__titleText {
        font-size: 18px;
    }
    .membership-content__howItem {
        flex: 0 1 95px;
        max-width: none;
    }
    .membership-content__howGrid .membership-content__howItem:first-child {
        width: 100%;
        flex: none;
    }
    .membership-content__howGrid .membership-content__howItem:last-child {
        min-width: auto;
        max-width: none;
    }
    .home-story__jpTitle {
        padding-right: 5%;
    }
    .home-story__more {
        margin-top: 90px;
    }
    .home-trio__photoHead {
        font-size: 36px;
    }
    .booking-modal__header h2 {
        font-size: 21px;
    }
    .booking-modal__back {
        top: 21px;
    }
    .booking-modal__back img {
        width: 32px;
        height: 32px;
    }
    .home-story__jp::after {
        display: none;
    }
}

@media (min-width: 992px) {
    #promo .promo-content__slider {
        display: none !important;
    }
}