/* l-heading
 **************************************/
.l-heading-block {
    text-align: center;
    margin-bottom: calc(120/var(--base-font-size-row-value) * 1rem);
}

.c-heading {
    font-family: var(--base-alphabetic-font);
    font-weight: 600;
    font-size: calc(28/var(--base-font-size-row-value) * 1rem);
    text-transform: uppercase;
}

@media screen and (max-width: 767px) {
    .l-heading-block {
        margin-bottom: calc(60/var(--base-font-size-row-value) * 1rem);
    }

    .c-heading {
        font-size: calc(20/var(--base-font-size-row-value) * 1rem);
    }
}

/* l-padding
  **************************************/
.l-padding-160 {
    padding: calc(160/var(--base-font-size-row-value) * 1rem) 0;
}

@media screen and (max-width: 767px) {
    .l-padding-160 {
        padding: calc(80/var(--base-font-size-row-value) * 1rem) 0;
    }
}

/* btn
  **************************************/
.btn-style {
    display: flex;
    justify-content: center;
    align-items: center;
    border: 1px solid #333;
    border-radius: 300px;
}

/* g-header
  **************************************/

.g-header {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    transition: transform 0.3s ease;
    height: calc(100/var(--base-font-size-row-value) * 1rem);
    z-index: 1000;
}

.g-header.moved {
    position: fixed;
    background-color: rgba(255, 255, 255, 0.72);
}

.g-header__inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%;
    margin-left: calc(64/var(--base-font-size-row-value) * 1rem);
    margin-right: calc(55/var(--base-font-size-row-value) * 1rem);
}

.g-header-logo-wrap {
    width: calc(120/var(--base-font-size-row-value) * 1rem);
}


@media screen and (max-width: 767px) {
    .g-header {
        height: calc(80/var(--base-font-size-row-value) * 1rem);
    }

    .g-header__inner {
        width: 90%;
        margin: 0 auto;
    }

    .g-header-logo-wrap {
        width: calc(90 / var(--base-font-size-row-value) * 1rem);
    }
}

/* nav */
.g-nav-list {
    display: flex;
    align-items: center;
    gap: calc(40/var(--base-font-size-row-value) * 1rem);
}

.g-nav__item>.btn-style {
    padding: 2px 15px;
}

.g-nav__heading__alphabetic {
    display: block;
    font-family: var(--base-alphabetic-font);
    text-transform: uppercase;
    font-weight: 600;
    font-size: calc(13/var(--base-font-size-row-value) * 1rem);
    ;
}

@media screen and (min-width: 768px) {
    .menu-trigger {
        display: none !important;
    }
}

@media screen and (max-width: 767px) {
    .menu-trigger {
        display: block !important;
    }

    .g-nav {
        position: fixed;
        top: 0;
        right: 0;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        height: 100%;
        padding: 20px 0;
        text-align: center;
        opacity: 0;
        pointer-events: none;
        background: rgba(51, 51, 51, 0.6);
        -webkit-backdrop-filter: blur(10px) brightness(68%);
        backdrop-filter: blur(10px) brightness(68%);
        color: #fff;
        transition: opacity 0.4s;
    }

    .g-header.active .g-nav {
        opacity: 1;
        z-index: 99;
        pointer-events: all;
    }

    .g-nav-list {
        flex-direction: column;
        align-items: center;

    }

    .g-nav__heading__alphabetic {
        font-size: calc(14 / var(--base-font-size-row-value) * 1rem);
    }

    .g-nav__item>.btn-style {
        border: 1px solid #fff;
    }

    .menu-trigger {
        position: fixed;
        top: calc(28/var(--base-font-size-row-value) * 1rem);
        right: 5%;
        z-index: 100;
        display: inline-block;
        cursor: pointer;
        -webkit-transition: all 0.4s;
        -o-transition: all 0.4s;
        transition: all 0.3s;
    }

    .menu-trigger__btn {
        position: absolute;
        right: 0;
    }

    .menu-trigger__btn.--on {
        opacity: 0;
        color: #fff;
    }

    .active .menu-trigger__btn.--on {
        opacity: 1;
    }

    .active .menu-trigger__btn.--off {
        opacity: 0;
    }

    .menu-trigger__icon {
        position: relative;
    }

    .menu-trigger__txt {
        letter-spacing: 0.05rem;
        font-size: calc(13 / var(--base-font-size-row-value) * 1rem);
    }

    .menu-trigger__btn.--off>.menu-trigger__icon::before {
        content: "";
        position: absolute;
        top: 50%;
        left: -0.8rem;
        height: calc(12/var(--base-font-size-row-value) * 1rem);
        width: calc(12/var(--base-font-size-row-value) * 1rem);
        background-color: #333;
        transform: translateY(-50%);
    }

    .menu-trigger__btn.--on>.menu-trigger__icon::before {
        transform: translate(-50%, -50%) rotate(45deg);
    }

    .menu-trigger__btn.--on>.menu-trigger__icon::after {
        transform: translate(-50%, -50%) rotate(-45deg);
    }

    .menu-trigger__btn.--on>.menu-trigger__icon::before,
    .menu-trigger__btn.--on>.menu-trigger__icon::after {
        content: "";
        position: absolute;
        top: 50%;
        left: calc(50% - 0.5rem);
        height: 1px;
        transform-origin: center;
        width: calc(16/var(--base-font-size-row-value) * 1rem);
        background-color: #fff;
    }
}

/* mv
  **************************************/
.mv {
    /* header space */
    padding-top: calc(100/var(--base-font-size-row-value) * 1rem);
}

.mv-slider {
    position: relative;
    padding-top: calc(45.8/var(--base-font-size-row-value) * 1rem);
    padding-bottom: calc(52.8/var(--base-font-size-row-value) * 1rem);
}

.mv-catchcopy-wrap {
    position: absolute;
    left: 50%;
    bottom: 17%;
    transform: translateX(-50%);
    color: #fff;
    z-index: 2;
}

.mv-catchcopy {
    margin-bottom: calc(48/var(--base-font-size-row-value) * 1rem);
    width: 100vw;
    text-align: center;
    font-family: var(--base-alphabetic-font);
    font-size: calc(50/var(--base-font-size-row-value) * 1rem);
    font-weight: 600;
    letter-spacing: 0.25rem;
    line-height: 1.2;
}

.mv-catchcopy-jp {
    text-align: center;
}

@media screen and (max-width: 767px) {
    .mv {
        overflow: hidden;
    }

    .mv-slider {
        padding-top: calc(20 / var(--base-font-size-row-value) * 1rem);
        padding-bottom: calc(40 / var(--base-font-size-row-value) * 1rem);
    }

    .swiper-slide img {
        height: calc(500/var(--base-font-size-row-value) * 1rem);
    }

    .mv-catchcopy-wrap {
        bottom: 13%;
    }

    .mv-catchcopy {
        margin-bottom: calc(24/var(--base-font-size-row-value) * 1rem);
        width: 700px;
        font-size: calc(30/var(--base-font-size-row-value) * 1rem);
    }

    .mv-catchcopy-jp {
        font-size: calc(16/var(--base-font-size-row-value) * 1rem);
        line-height: 1.5;
    }
}

/* concept
  **************************************/
.concept {
    background-image: url(../images/concept/sumi.webp);
    background-repeat: no-repeat;
    background-position: top calc(53/var(--base-font-size-row-value) * 1rem) left;
    background-size: auto;
}

.concept-body {
    position: relative;
    width: 80%;
    max-width: 1200px;
    margin: 0 auto;
    padding: calc(240/var(--base-font-size-row-value) * 1rem) 0;
}

.concept-items {
    display: flex;
    justify-content: space-between;
    gap: calc(20/var(--base-font-size-row-value) * 1rem);
}

.concept-item-jp {
    flex-shrink: 0;
    padding-bottom: calc(120/var(--base-font-size-row-value) * 1rem);
}

.concept-item-jp>.concept-title {
    margin-bottom: calc(80/var(--base-font-size-row-value) * 1rem);
    font-size: calc(28/var(--base-font-size-row-value) * 1rem);
    font-weight: 700;
}

.concept-item-jp>.concept-paragraph {
    line-height: 3;
}

.concept-item-jp>.concept-paragraph+.concept-paragraph {
    margin-top: calc(40/var(--base-font-size-row-value) * 1rem);
}

.concept-item-en {
    max-width: 486px;
    align-self: flex-end;
    font-family: var(--base-alphabetic-font);
    color: #ddd;
    line-height: 2;
}

.concept-item-en>.concept-title {
    margin-bottom: calc(64/var(--base-font-size-row-value) * 1rem);
    font-size: calc(16/var(--base-font-size-row-value) * 1rem);
    font-weight: 700;
}

.concept-item-en>.concept-paragraph {
    font-size: calc(13/var(--base-font-size-row-value) * 1rem);
}

.concept-item-en>.concept-paragraph+.concept-paragraph {
    margin-top: calc(20/var(--base-font-size-row-value) * 1rem);
}

@media screen and (max-width: 767px) {
    .concept {
        background-position: top left;
        background-size: 55%;
    }

    .concept-body {
        padding: calc(80 / var(--base-font-size-row-value) * 1rem) 0;
    }

    .concept-items {
        flex-direction: column;
        gap: calc(60 / var(--base-font-size-row-value) * 1rem);
    }

    .concept-item-jp {
        padding-bottom: 0;
    }

    .concept-item-jp>.concept-title {
        margin-bottom: calc(40 / var(--base-font-size-row-value) * 1rem);
        font-size: calc(16 / var(--base-font-size-row-value) * 1rem);
    }

    .concept-item-jp>.concept-paragraph {
        line-height: 2;
    }

    .concept-item-en {
        letter-spacing: 0.03rem;
    }

    .concept-item-en>.concept-title {
        margin-bottom: calc(40 / var(--base-font-size-row-value) * 1rem);
        font-size: calc(12 / var(--base-font-size-row-value) * 1rem);
    }

    .concept-item-en>.concept-paragraph {
        font-size: calc(9 / var(--base-font-size-row-value) * 1rem);
    }
}

/* feature
  **************************************/
.feature {
    position: relative;
    width: 100%;
}

.feature::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    pointer-events: none;
    background: radial-gradient(rgba(43, 43, 43, 1), rgba(78, 76, 76, 1));
    mix-blend-mode: hard-light;
}

.feature-bg {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 100%;
    height: 100%;
    z-index: -1;
    transform: translate(-50%, -50%);
    object-fit: cover;
}

.feature-body {
    position: relative;
    z-index: 2;
    color: #fff;
}

.feature-items {
    padding-bottom: calc(80/var(--base-font-size-row-value) * 1rem);
}

.feature-item {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    width: 80%;
    max-width: 1020px;
    margin: 0 auto;
}

.feature-item+.feature-item {
    margin-top: calc(240/var(--base-font-size-row-value) * 1rem);
}

.feature-item[class*="--inverted"] {
    flex-direction: row-reverse;
}

.feature__fig>img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    box-shadow: -5px 10px 30px 0px rgba(0, 0, 0, 0.1);
}

.feature__data {
    max-width: calc(510/var(--base-font-size-row-value) * 1rem);
}

.feature__data>dt>.title {
    display: block;
    margin-bottom: calc(60/var(--base-font-size-row-value) * 1rem);
    font-size: calc(18/var(--base-font-size-row-value) * 1rem);
    font-weight: 700;
    line-height: 2.5;
}

.feature__data>dt>span:not(.title) {
    font-family: var(--base-alphabetic-font);
    font-size: calc(13/var(--base-font-size-row-value) * 1rem);
    font-weight: 600;
}

.feature-item[class*="--01"]>.feature__fig {
    position: absolute;
    right: 0;
    width: 38.3vw;
    max-width: calc(720/var(--base-font-size-row-value) * 1rem);
}

.feature-item[class*="--01"]>.feature__data {
    margin-top: calc(160/var(--base-font-size-row-value) * 1rem);
}

.feature-item[class*="--02"]>.feature__fig {
    position: absolute;
    left: 0;
    width: 32vw;
    max-width: calc(600/var(--base-font-size-row-value) * 1rem);
}

.feature-item[class*="--03"] {
    justify-content: space-between;
}

.feature-item[class*="--03"]>.feature__fig {
    width: 21.2vw;
    max-width: calc(400/var(--base-font-size-row-value) * 1rem);
}

@media screen and (max-width: 767px) {
    .feature {
        margin-top: calc(50/var(--base-font-size-row-value) * 1rem);
    }

    .feature-items {
        padding-bottom: calc(120 / var(--base-font-size-row-value) * 1rem);
    }

    .feature-item {
        align-items: start;
    }

    .feature-item+.feature-item {
        margin-top: calc(75 / var(--base-font-size-row-value) * 1rem);
    }

    .feature-item[class*="--01"]>.feature__data {
        margin-top: calc(205 / var(--base-font-size-row-value) * 1rem);
    }

    .feature-item[class*="--02"]>.feature__data {
        margin-top: calc(185 / var(--base-font-size-row-value) * 1rem);
    }

    .feature-item[class*="--03"]>.feature__data {
        margin-top: calc(205 / var(--base-font-size-row-value) * 1rem);
    }

    .feature__data>dt>span:not(.title) {
        font-size: calc(12 / var(--base-font-size-row-value) * 1rem);
    }

    .feature__data>dt>.title {
        margin-bottom: calc(30 / var(--base-font-size-row-value) * 1rem);
        font-size: calc(15 / var(--base-font-size-row-value) * 1rem);
    }

    .feature-item[class*="--01"]>.feature__fig {
        top: calc(-50 / var(--base-font-size-row-value) * 1rem);
        width: 60vw;
    }

    .feature-item[class*="--02"]>.feature__fig {
        width: 66.7vw;
    }

    .feature-item[class*="--02"]>.feature__fig>img {
        position: relative;
    }

    .feature-item[class*="--03"]>.feature__fig {
        position: absolute;
        right: 0;
        width: 45.4vw;
    }
}

/* price
  **************************************/
.price-block {
    display: flex;
    justify-content: space-between;
    gap: calc(80/var(--base-font-size-row-value) * 1rem);
    width: 80%;
    max-width: 1020px;
    margin: 0 auto calc(120/var(--base-font-size-row-value) * 1rem);
}

.price-block>div {
    width: 100%;
}

.menu-block {
    font-family: var(--base-alphabetic-font);
    font-weight: 500;
}

.menu-block+.menu-block {
    margin-top: calc(80/var(--base-font-size-row-value) * 1rem);
}

.menu-block__heading {
    padding-bottom: calc(30/var(--base-font-size-row-value) * 1rem);
    margin-bottom: calc(30/var(--base-font-size-row-value) * 1rem);
    font-size: calc(28/var(--base-font-size-row-value) * 1rem);
    font-weight: 600;
    text-transform: uppercase;
    border-bottom: 1px solid #ddd;
    line-height: 1;
}

.menu-data {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.menu-data+.menu-data {
    margin-top: calc(16/var(--base-font-size-row-value) * 1rem);
}

.menu-data>dt>span {
    font-family: var(--base-kana-font);
}

.menu-data>dd>span.menu-price {
    font-weight: 600;
    font-family: var(--base-alphabetic-font);
}

.price-note {
    margin-top: calc(80/var(--base-font-size-row-value) * 1rem);
    text-align: right;
}

.price-body .more-btn__wrapper {
    width: calc(336/var(--base-font-size-row-value) * 1rem);
    margin: 0 auto;
}

.price-body .more-btn__wrapper .more-btn {
    height: calc(80/var(--base-font-size-row-value) * 1rem);
    font-size: calc(20/var(--base-font-size-row-value) * 1rem);
    font-weight: 600;
    font-family: var(--base-alphabetic-font);
    text-transform: uppercase;
}

@media screen and (max-width: 767px) {
    .price-block {
        flex-direction: column;
        gap: calc(60 / var(--base-font-size-row-value) * 1rem);
        margin: 0 auto calc(60/var(--base-font-size-row-value) * 1rem);
    }

    .menu-block+.menu-block {
        margin-top: calc(60 / var(--base-font-size-row-value) * 1rem);
    }

    .menu-block__heading {
        padding-bottom: calc(20 / var(--base-font-size-row-value) * 1rem);
        margin-bottom: calc(20 / var(--base-font-size-row-value) * 1rem);
        font-size: calc(16 / var(--base-font-size-row-value) * 1rem);
    }

    .menu-data+.menu-data {
        margin-top: calc(8 / var(--base-font-size-row-value) * 1rem);
    }

    .price-note {
        margin-top: calc(20 / var(--base-font-size-row-value) * 1rem);
        text-align: center;
    }

    .price-body .more-btn__wrapper {
        width: calc(220 / var(--base-font-size-row-value) * 1rem);
    }

    .price-body .more-btn__wrapper .more-btn {
        height: calc(60 / var(--base-font-size-row-value) * 1rem);
        font-size: calc(16 / var(--base-font-size-row-value) * 1rem);
    }
}

/* space
  **************************************/
.space {
    position: relative;
    background-image: linear-gradient(180deg, #FAFAFA, #D2D2D2);
}

.space::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url(../images/space/bg.png);
    background-position: top center;
    background-repeat: no-repeat;
    opacity: 0.9;
    background-size: 100% auto;
    pointer-events: none;
    mix-blend-mode: lighten;
    z-index: 0;
}

.space-body {
    position: relative;
}

.space-body::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-image: url(../images/space/overray.png);
    background-position: bottom center;
    background-repeat: no-repeat;
    opacity: 0.9;
    background-size: 100% auto;
    pointer-events: none;
    mix-blend-mode: overlay;
    z-index: 1;
}

.space-block {
    position: relative;
    z-index: 2;
}

.space-items {
    width: 80%;
    max-width: 1020px;
    margin: 0 auto;
}

.space-item {
    display: flex;
    justify-content: space-between;
    gap: calc(80/var(--base-font-size-row-value) * 1rem);
}

.space-item[class*="--inverted"] {
    flex-direction: row-reverse;
}

.space-item+.space-item {
    margin-top: calc(120/var(--base-font-size-row-value) * 1rem);
}

.space__fig {
    flex-shrink: 0;
    width: calc(400/var(--base-font-size-row-value) * 1rem);
}

.space__fig>img {
    display: block;
}

.space__data {
    max-width: 510px;
    width: 100%;
    margin-top: calc(40/var(--base-font-size-row-value) * 1rem);
}

.space__data>dt {
    text-align: center;
    margin-bottom: calc(55/var(--base-font-size-row-value) * 1rem);
}

.space__data>dt>.title {
    display: block;
    font-weight: 700;
    font-size: calc(28/var(--base-font-size-row-value) * 1rem);
}

.space__data>dt>span:not(.title) {
    font-family: var(--base-alphabetic-font);
    font-weight: 600;
    font-size: calc(13/var(--base-font-size-row-value) * 1rem);
    color: #898989;
}

@media screen and (max-width: 767px) {
    .space-item {
        flex-direction: column;
        gap: calc(30 / var(--base-font-size-row-value) * 1rem);
    }

    .space-item[class*="--inverted"] {
        flex-direction: column;
    }

    .space-item+.space-item {
        margin-top: calc(80 / var(--base-font-size-row-value) * 1rem);
    }

    .space__data {
        margin-top: 0;
    }

    .space__data>dt {
        text-align: center;
        margin-bottom: calc(40 / var(--base-font-size-row-value) * 1rem);
    }

    .space__fig {
        width: fit-content;
        margin: 0 auto;
    }

    .space__data>dt>.title {
        font-size: calc(18 / var(--base-font-size-row-value) * 1rem);
    }

    .space__data>dt>span:not(.title) {
        font-size: calc(9 / var(--base-font-size-row-value) * 1rem);
    }

    .space::before,
    .space-body::before {
        background-size: 350% auto;
    }
}

/* galally
  **************************************/
.gallery-body {
    position: relative;
}

.gallery-block {
    padding-bottom: calc(20/var(--base-font-size-row-value) * 1rem);
}

.gallery-heading {
    position: absolute;
    top: -6%;
    left: 10%;
    display: block;
    margin: 0 auto;
    font-family: var(--base-alphabetic-font);
    font-weight: 600;
    font-size: calc(102/var(--base-font-size-row-value) * 1rem);
    color: #fff;
    mix-blend-mode: overlay;
    line-height: 1.2;
    z-index: 2;
}

.gallery-items {
    display: grid;
    grid-template-columns: 27% 19% 20% 1fr;
    gap: calc(20/var(--base-font-size-row-value) * 1rem);
}

.gallery-item>.gallery__fig {
    height: 100%;
    width: 100%;
    overflow: hidden;
}

.gallery-item>.gallery__fig>img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
}

.gallery-item[class*="--01"] {
    grid-area: 1 / 1 / 3 / 2;
}

.gallery-item[class*="--02"] {
    grid-area: 3 / 1 / 4 / 2;
}

.gallery-item[class*="--03"] {
    grid-area: 1 / 2 / 2 / 3;
}

.gallery-item[class*="--04"] {
    grid-area: 2 / 2 / 4 / 3;
}

.gallery-item[class*="--05"] {
    grid-area: 1 / 3 / 3 / 5;
}

.gallery-item[class*="--06"] {
    grid-area: 3 / 3 / 4 / 4;
}

.gallery-item[class*="--07"] {
    grid-area: 3 / 4 / 4 / 5;
}

@media screen and (max-width: 767px) {
    .gallery-block {
        padding-bottom: calc(10 / var(--base-font-size-row-value) * 1rem);
    }

    .gallery-heading {
        top: -2%;
        left: 5%;
        font-size: calc(39/var(--base-font-size-row-value) * 1rem);
    }

    .gallery-items {
        display: grid;
        grid-template-columns: 40% 15% 1fr;
        /* grid-template-rows: 18.1% auto 17.8% 30% 18.1%; */
        gap: calc(10/var(--base-font-size-row-value) * 1rem);
    }

    .gallery-item[class*="--01"] {
        grid-area: 1 / 1 / 3 / 3;
    }

    .gallery-item[class*="--02"] {
        grid-area: 3 / 1 / 4 / 3;
    }

    .gallery-item[class*="--03"] {
        grid-area: 1 / 3 / 2 / 4;
    }

    .gallery-item[class*="--04"] {
        grid-area: 2 / 3 / 4 / 4;
    }

    .gallery-item[class*="--05"] {
        grid-area: 4 / 1 / 5 / 4;
    }

    .gallery-item[class*="--06"] {
        grid-area: 5 / 1 / 6 / 2;
    }

    .gallery-item[class*="--06"] img {
        object-position: right;
    }

    .gallery-item[class*="--07"] {
        grid-area: 5 / 2 / 6 / 4;
    }
}

/* Access
  **************************************/


.access {
    background-image: url(../images/access/sumi-02.webp);
    background-repeat: no-repeat;
    background-size: auto;
    background-position: top calc(101/var(--base-font-size-row-value) * 1rem) left calc(-350/var(--base-font-size-row-value) * 1rem);
}


.access-body {
    max-width: 1200px;
    width: 80%;
    margin: 0 auto;
}

.access-block {
    display: flex;
    justify-content: space-between;
    gap: calc(50/var(--base-font-size-row-value) * 1rem);
}

.access-data__wrapper {
    width: 50%;
    margin-top: calc(80/var(--base-font-size-row-value) * 1rem);
}

.access-data__wrapper .c-heading {
    text-align: left;
}

.access-data {
    display: grid;
    grid-template-columns: 35% 1fr;
}

.access-data+.access-data {
    margin-top: calc(80/var(--base-font-size-row-value) * 1rem);
}

.access-data>dt {
    text-transform: uppercase;
    font-weight: 500;
    font-family: var(--base-alphabetic-font);
}

.access-data>dd .map-link,
.access-data>dd>.num {
    font-family: var(--base-alphabetic-font);
}

.access-data>dd .map-link {
    font-size: calc(13/var(--base-font-size-row-value) * 1rem);
    width: fit-content;
    padding: 0 15px;
    margin-top: 5px;
}

a[target="_blank"].map-link::after {
    width: calc(8/var(--base-font-size-row-value) * 1rem);
    height: calc(8/var(--base-font-size-row-value) * 1rem);
    margin-left: 0.5rem;
}

.access__fig {
    width: calc(540/var(--base-font-size-row-value) * 1rem);
}

.access__fig>img {
    display: block;
}

@media screen and (max-width: 767px) {
    .access {
        background-position: top calc(30/var(--base-font-size-row-value) * 1rem) right calc(-20/var(--base-font-size-row-value) * 1rem);
    }
    
    .access-block {
        flex-direction: column;
        gap: calc(50/var(--base-font-size-row-value) * 1rem);
    }

    .access-data__wrapper .c-heading {
        text-align: center;
    }

    .access-data__wrapper {
        width: 100%;
        margin-top: 0;
    }

    .access-data+.access-data {
        margin-top: calc(40 / var(--base-font-size-row-value) * 1rem);
    }

    .access__fig {
        width: fit-content;
        margin: 0 auto;
    }
}

/* reservation
  **************************************/
.reservation {
    position: relative;
    background-image: url(../images/reservation/bg.jpg);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
    color: #fff;
    z-index: 0;
}

.reservation::before {
    content: "";
    position: absolute;
    top: 0;
    width: 100%;
    height: 100%;
    background-color: #333;
    mix-blend-mode: multiply;
    z-index: -1;
}

.reservation-body {
    padding: calc(240/var(--base-font-size-row-value) * 1rem) 0;
    text-align: center;
}

.reservation-body .l-heading-block {
    margin-bottom: calc(32 / var(--base-font-size-row-value) * 1rem);
}

.reservation-block {
    margin-top: calc(80 / var(--base-font-size-row-value) * 1rem);
}

.reservation-options {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: calc(80 / var(--base-font-size-row-value) * 1rem);
}

.reservation-btn__wrap>.reservation-btn {
    width: calc(336 / var(--base-font-size-row-value) * 1rem);
    height: calc(80 / var(--base-font-size-row-value) * 1rem);
    border: 1px solid #fff;
}

.reservation-btn__wrap>.reservation-btn>.line-btn-txt {
    font-size: calc(18 / var(--base-font-size-row-value) * 1rem);
    font-weight: 700;
}

.reservation-btn__wrap>.reservation-btn>.tel-num {
    font-family: var(--base-alphabetic-font);
    font-size: calc(20 / var(--base-font-size-row-value) * 1rem);
    font-weight: 600;
}

a[target="_blank"].reservation-btn::after {
    background-image: url(../images/common/tab_wh.svg);
}

@media screen and (max-width: 767px) {
    .reservation-body {
        padding: calc(80 / var(--base-font-size-row-value) * 1rem) 0;
    }

    .reservation-block {
        margin-top: calc(60 / var(--base-font-size-row-value) * 1rem);
    }

    .reservation-options {
        flex-direction: column;
        gap: calc(30 / var(--base-font-size-row-value) * 1rem);
    }

    .reservation-btn__wrap>.reservation-btn>.line-btn-txt {
        font-size: calc(16 / var(--base-font-size-row-value) * 1rem);
    }

    .reservation-btn__wrap>.reservation-btn>.tel-num {
        font-size: calc(18 / var(--base-font-size-row-value) * 1rem);
    }

    .reservation-btn__wrap>.reservation-btn {
        width: calc(280 / var(--base-font-size-row-value) * 1rem);
        height: calc(60 / var(--base-font-size-row-value) * 1rem);
    }
}

/* footer
  **************************************/
.footer-inner {
    font-size: calc(13/ var(--base-font-size-row-value) * 1rem);
}

.footer-nav {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: calc(80 / var(--base-font-size-row-value) * 1rem);
    text-transform: uppercase;
}

.g-footer__logo {
    max-width: calc(200/var(--base-font-size-row-value) * 1rem);
    width: 100%;
}

.footer-nav-list {
    display: flex;
    gap: calc(37 / var(--base-font-size-row-value) * 1rem);
    margin-bottom: calc(48 / var(--base-font-size-row-value) * 1rem);
}

.l-footer__copyright {
    display: flex;
    justify-content: center;
    align-items: center;
}

@media screen and (max-width: 767px) {
    .footer-inner {
        font-size: calc(12 / var(--base-font-size-row-value) * 1rem);
        padding: calc(60/var(--base-font-size-row-value) * 1rem) 0;
    }

    .footer-nav {
        gap: calc(40 / var(--base-font-size-row-value) * 1rem);
    }

    .g-footer__logo {
        max-width: calc(150 / var(--base-font-size-row-value) * 1rem);
    }

    .footer-nav-list {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        flex-wrap: wrap;
        gap: calc(10 / var(--base-font-size-row-value) * 1rem);
        margin-bottom: calc(48 / var(--base-font-size-row-value) * 1rem);
    }
}