@charset "UTF-8";
/* ======================================== Common ======================================== */
/* ============================== html tags ============================== */
html {
    box-sizing: border-box;
    font-family: "Yu Mincho", YuMincho, "Zen Old Mincho", "Hiragino Mincho ProN", 'Hiragino Mincho Pro', 'Yu Mincho', 'MS Mincho', serif;
    font-size: 62.5%;
    font-weight: 400;
    font-style: normal;
    letter-spacing: 0;
    line-height: 1;
    color: #041e42;
    background: #f3f2ef;
    -webkit-overflow-scrolling: touch;
}
*, *::before, *::after {
    box-sizing: border-box;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    /* font-feature-settings: "palt"; */
}
body {
    box-sizing: border-box;
    position: relative;
    z-index: 0;
    text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
}
body.-fixed {
    position: fixed;
    width: 100%;
}
main {
    position: relative;
}
h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
}
h1, h2, h3, h4, h5, h6, p, span, a, figcaption, button, th, td, input, textarea,
h1 span, h2 span, h3 span, h4 span, h5 span, h6 span, p span, a span, button span, input::placeholder, textarea::placeholder, *::before, *::after {
    letter-spacing: 0.025em;
}
h1 span, h2 span, h3 span, h4 span, h5 span, h6 span, p span, a span, button span  {
    font-size: inherit;
    font-weight: inherit;
    color: inherit;
}
/* img,
video {
    width: 100%;
    height: auto;
    object-fit: contain;
} */
a {
    cursor: pointer;
    text-decoration: none;
    color: inherit;
}
button {
    all: unset;
    box-sizing: border-box;
    appearance: none; /* ← これが効く！ */
    -webkit-appearance: none; /* Safari対策 */
    cursor: pointer;
    display: block;
    outline: none;
    display: block;
    padding: 0;
    border: none;
    padding-block: 0;
    padding-inline: 0;
    border-width: 0;
    border-radius: 0;
    margin: 0;
    font-family: inherit;
    font-weight: inherit;
    font-size: inherit;
    color: inherit;
    background-color: transparent;
}
ul,
ol {
    padding: 0;
    margin: 0;
    list-style: none;
    caret-color: transparent;
    /* キャレットを非表示にする */
}
table {
    width: 100%;
    border-spacing: 0;
    border-collapse: collapse;
}
tbody {
    display: block;
    width: 100%;
}
::-webkit-input-placeholder,
:-moz-placeholder {
    font-family: "Zen Kaku Gothic New", sans-serif;
}
th,
td {
    text-align: left;
}
input,
textarea {
    box-sizing: border-box;
    display: block;
    width: 100%;
    padding: 0;
    border: unset;
    border-width: 0;
    background-color: transparent;
}
input[type="text" i] {
    padding: 0;
}
input:focus-visible,
textarea:focus-visible {
    outline: unset;
}
input:-webkit-autofill,
textarea:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 1000px #f4f0eb inset;
    -webkit-text-fill-color: #222;
}
select {
    border-width: 0px;
}
/* ============================== End html tags ============================== */
/* ============================== Utility Classes ============================== */
/* display inline-block */
.display_ib {
    display: inline-block;
}
/* width 0 */
.width_0 {
    display: inline-block;
    width: 0;
}
.text-decoration_underline {
    text-decoration: underline;
}
.fw_bold {
    font-weight: bold;
}
/* color */
.color_gray {
    color: #8d8b84;
}
/* background-color */
.bgc-white {
    color: #fff;
}
/* Display Utilities: Show/Hide on Devices */
/* 
- .pc / .tablet-sp:
- Default: .pc is visible, .tablet-sp is hidden.
- Below 1000px: .pc is hidden, .tablet-sp is visible.
*/
.pc {
    display: block;
}
.tablet-sp {
    display: none;
}
@media screen and (max-width: 1000px) {
    .pc {
        display: none !important;
    }
    .tablet-sp {
        display: block !important;
    }
}
/* 
- .pc-tablet / .sp:
- Default: .pc-tablet is visible, .sp is hidden.
- Below 750px: .pc-tablet is hidden, .sp is visible.
*/
.pc-tablet {
    display: block;
}
.sp {
    display: none;
}
@media screen and (max-width: 750px) {
    .pc-tablet {
        display: none !important;
    }
    .sp {
        display: block !important;
    }
}
/* ============================== End Utility Classes ============================== */
/* ============================== Helper Classes ============================== */
.img,
.video {
    width: 100%;
    height: auto;
    object-fit: contain;
}
/* English Font Settings */
.en {
    font-family: "Palatino Linotype", "Palatino","Book Antiqua", "Baskervville", serif;
}
.text {
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 2;
}
.text + .text {
    padding-top: 2.5rem;
}
.text strong {
    font-weight: 600;
}
/* ---------------------------------------------
 * Helper: .text-link
 * テキストリンク用の汎用ヘルパー
 * - 下線を常時表示し、hover可能な環境のみ薄くフェード
 * --------------------------------------------- */
.text-link {
    text-decoration: underline;
    opacity: 1;
    transition: opacity .3s;
}
@media (hover: hover) {
    .text-link:hover {
        opacity: .6;
    }
}
/* hover-animation opacity */
.hover-opacity {
    opacity: 1;
    transition: opacity .3s;
}
@media (hover: hover) {
    .hover-opacity:hover {
        opacity: .5;
    }
}
/* Container Helper: Layout Width */
:root {
    --wrapper-width: 84%;
    --wrapper-max-width: 140rem;
}
.wrapper {
    width: var(--wrapper-width);
    margin: 0 auto;
    max-width: var(--wrapper-max-width);
}
/*  wrapper responsive (1000)  */
@media screen and (max-width: 1000px) {
    :root {
        --wrapper-width: 89%;
    }
}
/* inview */
.inview {
    transform: translate(0, 5px);
    opacity: 0;
    transition: opacity .8s, transform .8s;
}
.inview.show {
    transform: translate(0, 0);
    opacity: 1.0;
}
.inview.--blur {
    transform: translate(0);
    filter: blur(50px);
    opacity: 0;
    transition: filter 1s, opacity 1s, transform 1s;
}
.inview.--blur.show {
    transform: translate(0);
    filter: blur(0);
    opacity: 1.0;
}
.inview.--blur.--kv {
    filter: blur(1px);
}
.inview.--blur.--kv.show {
    filter: blur(0);
}
.inview.--scale {
    transform: translate(0) scale(0.9);
    opacity: 0;
    transition: filter 1s, opacity 1s, transform 1s;
}
.inview.--scale.show {
    transform: translate(0, 0) scale(1);
    opacity: 1.0;
}
/* ============================== End Helper Classes ============================== */
/* ============================== Component Classes ============================== */
/* ========== logo ========== */
.logo {
    position: absolute;
    top: 2rem;
    right: 2.3%;
    z-index: 5;
    display: inline-block;
    width: 17rem;
}
.logo a {
    display: inline-block;
    cursor: pointer;
}
/* ---------- logo responsive (1000) ---------- */
@media screen and (max-width: 1000px) {
    .logo {
        top: 1.5rem;
        right: 4%;
        width: 13rem;
    }
}
/* ========== End logo ========== */
/* ========== booking-button ========== */
.booking-button {
    position: fixed;
    bottom: 4rem;
    right: 11rem;
    z-index: 9;
    width: 18rem;
}
.booking-button__link {
    width: 100%;
    text-align: center;
    opacity: 1;
    transition: opacity .3s;
}
@media (hover: hover) {
    .booking-button__link:hover {
        opacity: .8;
    }
}
.booking-button__text {
    position: relative;
    padding-left: 2.8rem;
}
.booking-button__icon {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: inline-block;
    --icon-width: 1.6rem;
    --icon-height: 2rem;
    width: var(--icon-width);
    height: var(--icon-height);
    background-image: url('/fourgrains/assets/img/common/icon-calender.png');
    background-repeat: no-repeat;
    background-size: var(--icon-width) var(--icon-height);
    background-position: center;
}
/* ---------- booking-button responsive (1000) ---------- */
@media screen and (max-width: 1000px) {
    .booking-button {
        bottom: 1.5rem;
        right: 4%;
        width: 14rem;
    }
    .booking-button__icon {
        top: -1px;
    }
}
/* ========== End booking-button ========== */
/* ==================== hamburger-button ==================== */
.hamburger-button {
    position: fixed;
    bottom: 4rem;
    right: 3rem;
    z-index: 9;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 6rem;
    height: 6rem;
    border-radius: 50%;
    background-color: #fff;
}
.hamburger-button__lines {
    position: relative;
    width: 2rem;
    height: 11px;
}
.hamburger-button__line {
    position: absolute;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 1px;
    background-color: #041e42;
    background-size: 1px;
}
.hamburger-button__line.--1 {
    top: 0;
}
.hamburger-button__line.--2 {
    top: 5px;
}
.hamburger-button__line.--3 {
    bottom: 0;
}
@keyframes hamburger-line1 {
    0% {
        top: 0;
        transform: rotate(0);
    }
    60% {
        top: 5px;
        transform: rotate(0);
    }
    100% {
        top: 5px;
        transform: rotate(45deg);
    }
}
@keyframes hamburger-line1-c {
    0% {
        top: 5px;
        transform: rotate(45deg);
    }
    40% {
        top: 5px;
        transform: rotate(0);
    }
    100% {
        top: 0;
        transform: rotate(0);
    }
}
@keyframes hamburger-line2 {
    0% {
        opacity: 1;
    }
    59% {
        opacity: 1;
    }
    60% {
        opacity: 0;
    }
    100% {
        opacity: 0;
    }
}
@keyframes hamburger-line2-c {
    0% {
        opacity: 0;
    }
    40% {
        opacity: 0;
    }
    42% {
        opacity: 1;
    }
    100% {
        opacity: 1;
    }
}
@keyframes hamburger-line3 {
    0% {
        bottom: 0;
        transform: rotate(0);
    }
    60% {
        bottom: 5px;
        transform: rotate(0);
    }
    100% {
        bottom: 5px;
        transform: rotate(-45deg);
    }
}
@keyframes hamburger-line3-c {
    0% {
        bottom: 5px;
        transform: rotate(-45deg);
    }
    40% {
        bottom: 5px;
        transform: rotate(0);
    }
    100% {
        bottom: 0;
        transform: rotate(0);
    }
}
/* -------------------- hamburger-button responsive (1000) -------------------- */
@media screen and (max-width: 1000px) {
    .hamburger-button {
        right: unset;
        bottom: 1.5rem;
        left: 4%;
        width: 5rem;
        height: 5rem;
    }
}
/* ==================== End hamburger-button ==================== */
/* ==================== hamburger-menu ==================== */
.hamburger-menu {
    position: fixed;
    bottom: 12.5rem;
    right: 3rem;
    z-index: 9;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.3s, visibility 0.3s;
}
.hamburger-menu.-open {
    opacity: 1;
    visibility: visible;
}
.hamburger-menu-escape {
    cursor: pointer;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 7;
    width: 100%;
    height: 100%;
    background-color: rgb(0,0,0,0.1);
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s, visibility .3s;
    backdrop-filter: blur(20px) saturate(0.7);
}
.hamburger-menu.-open + .hamburger-menu-escape {
    opacity: 1;
    visibility: visible;
}
/* ::::: hamburger-menu-nav ::::: */
.hamburger-menu-nav {
    padding: 3rem 3rem 3rem 3rem;
    border-radius: 5px;
    background-color: #fff;
}
.hamburger-menu-nav__list {
    display: flex;
    flex-direction: column;
    gap: 1.5rem;
}
.hamburger-menu-nav__link {
    position: relative;
    display: inline-block;
    font-size: 1.6rem;
    line-height: 1.2;
    color: #041e42;
    opacity: 1;
}
.hamburger-menu-nav__link::before {
    content: '';
    position: absolute;
    top: 7px;
    left: -1.5rem;
    display: inline-block;
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background-color: #041e42;
    opacity: 0;
    transition: opacity .1s;
}
.hamburger-menu-nav__link:hover::before,
.hamburger-menu-nav__link.-current::before {
    opacity: 1;
}
/* ::::: End hamburger-menu-nav ::::: */
.hamburder-menu__decoration {
    position: absolute;
    bottom: 0;
    right: 3rem;
    transform: translate(0,100%) ;
    display: block;
    width: 0;
    height: 0;
    border-left: 15px solid transparent;
    border-top: 10px solid #fff;
}
/* -------------------- hamburger-menu responsive (1000) -------------------- */
@media screen and (max-width: 1000px) {
    .hamburger-menu {
        bottom: 9rem;
        right: unset;
        left: 4%;
    }
    /* ::::: hamburger-menu-nav ::::: */
    .hamburger-menu-nav {
        padding: 3.1rem 3rem 3.1rem 3rem;
    }
    .hamburger-menu-nav__list {
        gap: 1.7rem;
    }
    .hamburger-menu-nav__link {
        font-size: 1.5rem;
    }
    .hamburger-menu-nav__link::before {
        top: 7px;
        left: -1.5rem;
    }
    /* ::::: End hamburger-menu-nav ::::: */
    .hamburder-menu__decoration {
        left: 3rem;
        border-left: unset;
        border-right: 15px solid transparent;
        border-top: 10px solid #fff;
    }
}
/* ==================== End hamburger-menu ==================== */
/* ==================== footer ==================== */
.footer {
    position: relative;
    z-index: 1;
    background-color: #ebe9e4;
}
.footer__inner {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 5.5rem 5.5% 5.2rem;
}
.footer__logo {
    width: 30rem;
}
.footer__web-link-area {
    margin-top: 4.8rem;
}
/* ===== footer-web-link ===== */
.footer-web-link {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1.1rem;
    width: 24rem;
    padding: 2rem 2rem 2.1rem;
    border-radius: 9999px;
    background-color: #fff;
    opacity: 1;
    transition: opacity .3s;
}
@media (hover: hover) {
    .footer-web-link:hover {
        opacity: .6;
    }
}
.footer-web-link__text {
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.075em;
    color: #041e42;
    background-color: #fff;
}
.footer-web-link__icon {
    position: relative;
    display: inline-block;
    width: 17px;
    height: 11px;
    margin-top: 2px;
}
/* ===== End footer-web-link ===== */
.footer__links-area {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1rem 2rem;
    margin-top: 5rem;
}
.footer__link {
    position: relative;
    text-decoration: underline;
    font-size: 1.3rem;
    font-weight: 600;
    line-height: 2;
    opacity: 1;
    transition: opacity .3s;
}
@media (hover: hover) {
    .footer__link:hover {
        opacity: .5;
    }
}
.footer__link.--with-target_blank {
    padding-right: 2.5rem;
}
.footer__link.--with-target_blank::after {
    content: '';
    position: absolute;
    top: 0.9rem;
    right: 0;
    display: inline-block;
    width: 17px;
    height: 11px;
    background-image: url('/fourgrains/assets/img/common/icon-external-link.png');
    background-repeat: no-repeat;
    background-size: 17px 11px;
}
.footer__copyright-area {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 1.4rem 5.5% 1.5rem;
    background-color: #041e42;
}
.copyright {
    font-size: 1rem;
    line-height: 2;
    color: #fff;
}
.footer__anker-link {
    position: absolute;
    top: 0;
    left: 50%;
    transform: translate(-50%,-50%);
    display: flex;
    justify-content: center;
    align-items: center;
    width: 7rem;
    height: 7rem;
    border-radius: 50%;
    background-color: #ebe9e4;
}
.footer__anker-link::before {
    content: '';
    position: relative;
    transform: rotate(-45deg);
    display: block;
    width: 9px;
    height: 9px;
    border-top: 2px solid #111;
    border-right: 2px solid #111;
    margin-bottom: -2px;
    transition: margin .3s;
}
@media (hover: hover) {
    .footer__anker-link:hover::before {
        margin-bottom: 8px;
    }
}
/* -------------------- footer responsive (1000) -------------------- */
@media screen and (max-width: 1000px) {
    .footer {}
    .footer__inner {
        padding: 5rem 5.5% 5rem;
    }
    .footer__logo {
        width: 22rem;
    }
    .footer__web-link-area {
        margin-top: 4rem;
    }
    .footer__links-area {
        gap: 1rem 2rem;
        margin-top: 3.8rem;
    }
    .footer__link.--with-target_blank::after {
        top: 0.9rem;
    }
    .footer__copyright-area {
        padding: 1.4rem 5.5% 8rem;
    }
    .footer__anker-link {
        width: 6rem;
        height: 6rem;
    }
}
/* ==================== End footer ==================== */
/* ==================== Other Common Modules ==================== */
/* ===== common-table ===== */
.common-table {}
.common-table__th {
    width: 17rem;
    padding: 1.5rem 1rem 1.5rem 0;
    border-bottom: 1px solid #041e42;
    text-align: left;
    font-size: 1.5rem;
    font-weight: 600;
    line-height: 2;
}
.common-table__td {
    width: calc(100% - 17rem);
    padding: 1.5rem 2rem;
    border-bottom: 1px solid rgba(4, 30, 66, 0.1);
    font-size: 1.5rem;
    font-weight: 500;
    line-height: 2;
}
/* ----- common-table responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .common-table {}
    .common-table__th {
        width: 7.5rem;
    }
    .common-table__td {
        width: calc(100% - 7.5rem);
    }
}
/* ===== End common-table ===== */
/* ===== common-list ===== */
.common-list {}
.common-list__item {
    position: relative;
    padding-left: 2rem;
}
.common-list__item::before {
    box-sizing: border-box;
    content: '';
    position: absolute;
    top: 1.2rem;
    left: 0;
    display: block;
    width: 6px;
    height: 6px;
    border: 1px solid #444;
    border-radius: 50%;
}
/* ----- common-list responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .common-list {}
    .common-list__item {
        padding-left: 1.5rem;
    }
}
/* ===== End common-list ===== */
/* ===== common-square ===== */
.common-square {
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    width: fit-content;
    min-width: 40rem;
    padding: 1.5rem 1.5rem 1.7rem;
    border: 1px solid #e14722;
    font-size: 1.7rem;
    line-height: 1.76;
    color: #e14722;
    background-color: transparent;
    opacity: 1;
    transition: color .3s, background-color .3s, opacity .3s;
}
@media (hover: hover) {
    .common-square:hover {
        opacity: .7;
    }
}
.common-square.--type1 {}
.common-square.--type2 {
    color: #fff;
    background-color: #e14722;
}
.common-square__text {
    text-align: center;
}

/* ----- common-square responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .common-square {
        width: 100%;
        min-width: unset;
        padding: 1.4rem 1rem 1.6rem;
    }
}
/* ===== End common-square ===== */
/* ===== common-rounded-square ===== */
.common-rounded-square {
    cursor: pointer;
    display: block;
    width: 100%;
    padding: 2rem 2rem 2.1rem;
    border-radius: 9999px;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0.075em;
    color: #fff;
    background-color: #041e42;
}
.common-rounded-square.--bgc_white {
    color: #041e42;
    background-color: #fff;
}
/* ----- common-rounded-square responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .common-rounded-square {
        padding: 1.5rem 1rem 1.6rem;
    }
}
/* ===== End common-rounded-square ===== */
/* ===== common-scroll-link ===== */
.common-scroll-link {
    position: relative;
    display: inline-block;
    width: 5.8rem;
    height: 9rem;
    padding-left: 1rem;
    opacity: 1;
    transition: opacity .3s;
}
@media (hover: hover) {
    .common-scroll-link:hover {
        opacity: .6;
    }
}
.common-scroll-link::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 1px;
    height: 9rem;
    background-color: #fff;
    opacity: .25;
}
.common-scroll-link::after {
    content: '';
    position: absolute;
    left: -2px;
    width: 5px;
    border-radius: 9999px;
    background-color: #fff;
    animation: scroll-bar 2.0s infinite ease;
}
@keyframes scroll-bar {
    0% {
        top: 0;
        height: 0;
    }
    50% {
        top: 0;
        height: 9rem;
    }
    100% {
        top: 9rem;
        height: 0;
    }
}
.common-scroll-link__text {
    font-size: 1.5rem;
    letter-spacing: 0.05em;
    color: #fff;
}
/* ----- common-scroll-link responsive (1000) ----- */
@media screen and (max-width: 1000px) {
    .common-scroll-link {
        width: 5.3rem;
        height: 6rem;
        padding-left: 1rem;
    }
    .common-scroll-link::before {
        height: 6rem;
    }
    @keyframes scroll-bar {
        0% {
            top: 0;
            height: 0;
        }
        50% {
            top: 0;
            height: 6rem;
        }
        100% {
            top: 6rem;
            height: 0;
        }
    }
    .common-scroll-link__text {
        font-size: 1.3rem;
    }
    /* ::::: End common-scroll-link ::::: */
}
/* ===== End common-scroll-link===== */
/* ==================== End Other Common Modules ==================== */
/* ============================== End Component Classes ============================== */
/* ======================================== End Common ======================================== */
/* ======================================== Pages ======================================== */
/* ==================== home (index) ==================== */
/* ========== loading ========== */
.loading {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 100000;
    display: block;
    width: 100%;
    height: 100%;
    background-color: #000;
    transition: opacity 1.65s 1.65s, visibility 1.65s 1.65s;
}
.body.loading-end .loading {
    opacity: 0;
    visibility: hidden;
}
/* ---------- load responsive (1000) ---------- */
@media screen and (max-width: 1000px) {
    .loading {
        transition: opacity 1.2s 1s, visibility 1.2s 1s;
    }
}
/* ========== End loading ========== */
/* ========== home-kv ========== */
.home-kv {
    position: relative;
    z-index: 0;
}
.home-kv__logo-and-button-area {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 10;
}
.home-kv__logo {
    width: 48rem;
}
.home-kv__button-area {
    width: 26rem;
    margin: 5rem auto 0;
}
.home-kv__scroll-link-area {
    position: absolute;
    bottom: 7rem;
    left: 0;
    width: 100%;
}
.home-kv__bgv {
    position: relative;
    z-index: -1;
    width: 100%;
    height: 100vh;
    min-height: 700px;
    max-height: 1000px;
    object-fit: cover;
}
.home-kv__bgv::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    background-image: linear-gradient(rgba(0,0,0,0.5) 0%, rgba(0,0,0,0.2) 100%);
}
.home-kv__bgv > .video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
/* ---------- home-kv responsive (1000) ---------- */
@media screen and (max-width: 1000px) {
    .home-kv {}
    .home-kv__logo-and-button-area {
        top: calc(50% - 1.5rem);
        left: 50%;
        transform: translate(-50%, -50%);
        z-index: 10;
    }
    .home-kv__logo {
        width: 30rem;
    }
    .home-kv__button-area {
        margin: 3.8rem auto 0;
    }
    .home-kv__scroll-link-area {
        bottom: 12rem;
    }
}
/* ---------- home-kv responsive (750) ---------- */
@media screen and (max-width: 750px) {
    .home-kv {}
    .home-kv__bgv {
        height: 177vw;
        min-height: 640px;
        max-height: 1000px;
    }
}
/* ========== End home-kv ========== */
/* ========== home-modal1-button ========== */
.home-modal1-button {
    position: relative;
    display: flex;
    justify-content: space-between;
    width: 100%;
    padding: 2rem 2rem 2.1rem 2.5rem;
    border: 1px solid #fff;
    border-radius: 9999px;
    background-color: transparent;
    transition: border .3s, background-color .3s;
}
.home-modal1-button:hover {
    background-color: #fff;
}
.home-modal1-button__text {
    margin-top: 2px;
    font-size: 1.6rem;
    font-weight: 700;
    line-height: 1.3;
    letter-spacing: 0.075em;
    color: #fff;
    transition: color .3s;
}
.home-modal1-button:hover .home-modal1-button__text {
    color: #041e42;
}
.home-modal1-button__icon-img {
    position: relative;
    display: inline-block;
    width: 2.4rem;
    height: 2.4rem;
}
.home-modal1-button .home-modal1-button__icon-img .icon-color {
    fill: #fff;
    transition: fill .3s;
}
.home-modal1-button:hover .home-modal1-button__icon-img .icon-color {
    fill: #041e42;
}

/* ---------- home-modal1-button responsive (1000) ---------- */
@media screen and (max-width: 1000px) {
    .home-modal1-button {
        padding: 1.2rem 1.5rem 1.2rem 2.3rem;
    }
    .home-modal1-button__text {
        margin-top: 1px;
    }
}
/* ========== End home-modal1-button ========== */
/* ========== home-modal1-menu ========== */
.home-modal1-menu {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 10000;
    width: 100%;
    height: 100dvh;
    opacity: 0;
    visibility: hidden;
    transition: opacity .3s, visibility .3s;
}
.home-modal1-menu.-open {
    opacity: 1;
    visibility: visible;
}
.home-modal-menu__inner {
    pointer-events: none;
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}
.home-modal1-menu__close-button {
    pointer-events: auto;
    position: absolute;
    top: 2rem;
    right: 2.3%;
    z-index: 0;
    width: 6rem;
    height: 6rem;
    border-radius: 50%;
    background-color: #fff;
}
.home-modal1-menu__close-button::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(45deg);
    z-index: 1;
    width: 2rem;
    height: 2px;
    background-color: #041e42;
}
.home-modal1-menu__close-button::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(135deg);
    z-index: 1;
    width: 2rem;
    height: 2px;
    background-color: #041e42;
}
.home-modal-menu__iframe {
    pointer-events: auto;
    position: relative;
    z-index: 1;
    width: 78%;
    max-width: 100vmin;
}
.home-modal-menu__iframe > iframe {
    width: 100%;
    aspect-ratio: 16/9;
}
.home-modal1-menu__escape {
    cursor: pointer;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    background-color: #333333;
    opacity: .95;
}
/* ---------- home-modal1-menu responsive (1000) ---------- */
@media screen and (max-width: 1000px) {
    .home-modal1-menu {}
    .home-modal1-menu__close-button {
        top: 1.5rem;
        right: 4%;
        width: 5rem;
        height: 5rem;
    }
    .home-modal-menu__iframe {
        width: 100%;
    }
}
/* ========== End home-modal1-menu ========== */
/* ========== home-intro ========== */
.home-intro {
    position: relative;
    z-index: 1;
}
.home-intro__sec {
    padding: 9.5rem 0 0;
}
.home-intro__inner {
    position: relative;
    width: var(--wrapper-width);
    margin: 0 auto;
    max-width: var(--wrapper-max-width);
}
.common-section-title {
    font-size: 3.6rem;
    line-height: 1.52;
    letter-spacing: 0px;
}
.home-intro__texts {
    padding-top: 2.5rem;
}
.home-intro__bar {
    transform: translateY(1.3rem);
    display: inline-block;
    width: 4.5rem;
    border-top: 1px solid #041e42;
    margin-left: 0.2rem;

}
.home-intro__bg-text-area {
    display: flex;
    justify-content: end;
    width: calc(100% * 100 / 84);
    margin: 0 calc(-8% * 100 / 84);
}
.common-bg-text {
    font-size: 20rem;
    font-size: clamp( 15rem ,15.6vw,20rem);
    letter-spacing: 0;
    color: #ebe9e4;
}
.common-bg-text.--sp-smaller {}
.home-intro__imgs-area {
    width: calc(100% * 100 / 84);
    margin: 0 calc(-8% * 100 / 84);
}
.home-intro__img.--1 {
    width: 40.5%;
    margin-top: -5.7%;
}
.home-intro__img.--2 {
    width: 42.1%;
    margin-top: -42%;
    margin-right: 7.8%;
    margin-left: auto;
}
.home-intro__img.--3 {
    width: 32.8%;
    margin-top: 26.5%;
    margin-left: 23.4%;
}
.home-intro__img.--4 {
    display: inline-flex;
    justify-content: end;
    width: 100%;
    margin: -21.9% 0 0;
}
.home-intro__img.--4 video {
    width: 41%;
    width: 35.1%;
    aspect-ratio: 450 / 600;
}
/* ---------- home-intro responsive (1000) ---------- */
@media screen and (max-width: 1000px) {
    .home-intro {}
    .home-intro__sec {
        padding: 5.7rem 0 0;
    }
    .common-section-title {
        font-size: 2.8rem;
    }
    .home-intro__bg-text-area {
        width: calc(100% * 100 / 89);
        margin: 0 calc(-5.5% * 100 / 89);
    }
    .common-bg-text {
        font-size: 8rem;
    }
    .common-bg-text.--sp-smaller {
        font-size: 6.4rem;
    }
    .home-intro__imgs-area {
        width: calc(100% * 100 / 89);
        margin: 0 calc(-5.5% * 100 / 89);
    }
}
/* ---------- home-intro responsive (750) ---------- */
@media screen and (max-width: 750px) {
    .home-intro {
        padding-bottom: 1rem;
    }
    .home-intro__bg-text-area {
        padding-bottom: 1rem;
    }
    .home-intro__img.--1 {
        width: 72.2%;
        margin-top: 0.6rem;
    }
    .home-intro__img.--2 {
        width: 75%;
        margin-top: 5rem;
        margin-right: 5.5%;
    }
    .home-intro__img.--3 {
        width: 58.3%;
        margin-top: 5rem;
        margin-left: 5.5%;
    }
    .home-intro__img.--4 {
        width: 100%;
        margin: 5rem 0 0;
    }
    .home-intro__img.--4 video {
        width: 62.5%;
    }
}
/* ========== End home-intro ========== */
/* ========== home-chef ========== */
.home-chef {}
.home-chef__section {}
.home-chef__bg-text-area {
    display: flex;
    justify-content: start;
    width: calc(100% * 100 / 84);
    margin: 0 calc(-8% * 100 / 84);
}
.home-chef__body {
    display: flex;
    gap: 4rem 8%;
}
.home-chef__small-section {
    width: calc(100% - 8% - 37%);
}
.home-chef__small-title-area {
    margin-top: 4.5rem;
}
.home-chef__small-title {
    font-size: 2.1rem;
    font-weight: 600;
    line-height: 1.78;
}
.home-chef__texts-area {
    margin-top: 2.8rem;
}
.home-chef__two-chefs-figure-area {
    display: flex;
    justify-content: end;
    margin-top: 9.3rem;
}
.home-chef__two-chefs-figure {
    width: 24rem;
}
.home-chef__two-chefs-caption {
    margin-top: 1rem;
    font-size: 1.4rem;
    line-height: 2;
    color: #999999;
    font-weight: 500;
}
.home-chef__img {
    width: 37%;
    margin-top: 3rem;
}
.home-chef__sign-img {
    width: 22rem;
    margin: -2.5rem -3rem 0 auto;
}
.home-chef__bottom-media-area {
    display: flex;
    justify-content: start;
    align-items: end;
    width: calc(100% * 100 / 84);
    margin: 8.5rem calc(-8% * 100 / 84) 0;
}
.home-chef__video {
    width: 56%;
    aspect-ratio: 720 / 480;
}
.home-chef__dish-img {
    width: 26%;
    margin-left: auto;
    margin-right: 8%;
}
/* ---------- home-chef responsive (1000) ---------- */
@media screen and (max-width: 1000px) {
    .home-chef {}
    .home-chef__section {}
    .home-chef__bg-text-area {
        width: calc(100% * 100 / 89);
        margin: 0 calc(-5.5% * 100 / 89);
    }
    .home-chef__body {
        gap: 4rem 8%;
    }
    .home-chef__small-section {
        width: calc(100% - 5.5% - 37%);
    }
    .home-chef__small-title-area {
        margin-top: 2rem;
    }
    .home-chef__small-title {
        font-size: 1.9rem;
        line-height: 1.78;
    }
    .home-chef__texts-area {
        margin-top: 2.6rem;
    }
    .home-chef__two-chefs-figure-area {
        margin-top: 5rem;
    }
    .home-chef__two-chefs-figure {
        width: 24rem;
    }
    .home-chef__two-chefs-caption {
        margin-top: 1rem;
    }
    .home-chef__img {
        /* width: 37%; */
        margin-top: 2rem;
    }
    .home-chef__sign-img {
        width: 13rem;
        margin: -2.5rem -1rem 0 auto;
    }
    .home-chef__bottom-media-area {
        width: calc(100% * 100 / 89);
        margin: 4rem calc(-5.5% * 100 / 89) 0;
    }
    .home-chef__video {}
    .home-chef__dish-img {
        margin-right: 5.5%;
    }
}
/* ---------- home-chef responsive (750) ---------- */
@media screen and (max-width: 750px) {
    .home-chef {}
    .home-chef__section {}
    .home-chef__body {
        flex-direction: column;
        gap: 0;
    }
    .home-chef__small-section {
        display: contents;
    }
    .home-chef__two-chefs-figure-area {
        order: 4;
        margin-top: 1.2rem;
    }
    .home-chef__two-chefs-figure {
        width: 50%;
    }
    .home-chef__img {
        order: 3;
        width: 80%;
        margin-top: 7.5rem;
    }
    .home-chef__sign-img {
        width: 13rem;
        margin: -1.5rem auto 0 -1.4rem;
    }
    .home-chef__bottom-media-area {
        flex-direction: column;
    }
    .home-chef__video {
        width: 100%;
    }
    .home-chef__dish-img {
        width: 62.5%;
        margin-top: 5rem;
        margin-right: 5.5%;
    }
}
/* ========== End home-chef ========== */
/* ========== home-menu ========== */
.home-menu {}
.home-menu__section {
    margin-bottom: 12rem;
}
.home-menu__bg-text-area {
    display: flex;
    justify-content: end;
    width: calc(100% * 100 / 84);
    margin: 2rem calc(-8% * 100 / 84) clamp(-13.5rem,-12.5%,-10rem);
}
.home-menu__texts-area {
    margin-top: 3rem;
}
.home-menu__buttons-area {
    display: flex;
    gap: 2rem;
    margin-top: 4rem;
}
.home-menu-button {
    width: 24rem;
}
.home-menu-button__link {
    display: flex;
    justify-content: center;
    width: 100%;
}
.home-menu-button__text {
    position: relative;
    padding-left: 2.8rem;
}
.home-menu-button__icon {
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: inline-block;
}
.home-menu-button__icon.--external-link {
    top: 5px;
    width: 1.7rem;
    height: 1.1rem;
}
.home-menu-button__icon.--calender {
    width: 1.6rem;
    height: 2cm;
}
/* ---------- home-menu responsive (1000) ---------- */
@media screen and (max-width: 1000px) {
    .home-menu {}
    .home-menu__section {
        margin-bottom: 8rem;
    }
    .home-menu__bg-text-area {
        width: calc(100% * 100 / 89);
        margin: 2rem calc(-5.5% * 100 / 89) -4rem;
    }
    .home-menu__texts-area {
        margin-top: 2.5rem;
    }
    .home-menu__buttons-area {
        flex-direction: column;
        margin-top: 3.5rem;
    }
    .home-menu-button {
        width: 22rem;
    }
    .home-menu-button__text {
        padding-left: 2.8rem;
    }
    .home-menu-button__icon.--external-link {
        top: 4px;
    }
}
/* ---------- home-menu responsive (750) ---------- */
@media screen and (max-width: 750px) {
    .home-menu {}
    .home-menu__bg-text-area {
        margin: 2rem calc(-5.5% * 100 / 89) 0;
    }
}
/* ========== End home-menu ========== */
/* ========== home-interior ========== */
.home-interior {}
.home-interior__slider-area {}
/* ===== swiper ===== */
.swiper-slide {
    width: auto;
}
.slide-figure {
    display: inline-block;    /* 中身のサイズに合わせて幅を決める */
    margin: 0;
}
.slide-figure img {
    display: block;
    width: auto;              /* ← ここが重要。サイト共通の .img { width:100% } を打ち消す */
    height: 37.5vw;
    max-width: 100%;          /* ただし、はみ出しは防ぐ */
}
.slide-caption {
    margin-top: 1rem;
    font-size: 1.4rem;
    font-weight: 500;
    line-height: 2;
    color: #999999;
}
.swiper-pagination {
    all: unset;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 1.2rem;
    margin-top: 1.5rem;
}
.swiper-pagination-bullet {
    all: unset;
    display: inline-block;
    width: 8px;
    height: 8px;
    border-radius: 9999px;
    border: 1px solid #d5d1c6;
    background-color: transparent;
    transition: width .3s ease-in-out, border .3s ease, background-color .4s ease;
}
.swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 28px;
    border: 1px solid #041e42;
    background-color: #041e42;
    transition: width .3s .3s ease-in-out, background-color .4s ease;
}
.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet, .swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0;
}
.swiper-button-next, .swiper-button-prev {
    cursor: pointer;
    top: calc(37.5vw / 2);
    transform: translateY(-50%);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    margin-top: 0;
    background-color: #fff;
    opacity: 1;
    transition: opacity .3s;
}
@media (hover: hover) {
    .swiper-button-next:hover, .swiper-button-prev:hover {
        opacity: .6;
    }
}
.swiper-button-next {
    right: 2.3vw;
}
.swiper-button-prev {
    left: 2.3vw;
}
.swiper-button-next::after, .swiper-button-prev::after {
    all: unset;
    content: '';
    display: block;
    width: 9px;
    height: 9px;
    border-top: 2px solid #041e42;
    border-right: 2px solid #041e42;
}
.swiper-button-next::after {
    transform: translate(-2px,0) rotate(45deg);
}
.swiper-button-prev::after {
    transform: translate(2px,0) rotate(225deg);
}
/* ===== End swiper ===== */
.home-interior__section {
    margin-top: 4rem;
}
.home-interior__texts-area {
    margin-top: 3rem;
    position: relative;
    z-index: 2;
}
.home-interior__bg-text-area {
    display: flex;
    justify-content: start;
    width: calc(100% * 100 / 84);
    margin: 0 calc(-8% * 100 / 84) 4rem;
}
.home-interior__bottom-media-area {
    display: flex;
    justify-content: space-between;
    width: calc(100% * 100 / 84);
    margin: 0 calc(-8% * 100 / 84) 2.4rem;
}
.home-interior__dish-img {
    width: 23%;
    margin-top: 8rem;
    margin-left: 8%;
}
.home-interior__video {
    width: 56.25%;
    aspect-ratio: 720 / 480;
}
/* ---------- home-interior responsive (1000) ---------- */
@media screen and (max-width: 1000px) {
    .home-interior {}
    /* ===== swiper ===== */
    .swiper-slide {}
    .slide-figure img {
        height: 50vw;
    }
    .swiper-button-next, .swiper-button-prev {
        top: calc(50vw / 2);
        width: 30px;
        height: 30px;
    }
    .swiper-button-next {
        right: 8vw;
    }
    .swiper-button-prev {
        left: 8vw;
    }
    .swiper-button-next::after, .swiper-button-prev::after {
        width: 6px;
        height: 6px;
    }
    .swiper-button-next::after {
        transform: translate(-2px,0) rotate(45deg);
    }
    .swiper-button-prev::after {
        transform: translate(2px,0) rotate(225deg);
    }
    /* ===== End swiper ===== */
    .home-interior__section {
        margin-top: 2.7rem;
    }
    .home-interior__texts-area {
        margin-top: 2.5rem;
    }
    .home-interior__bg-text-area {
        width: calc(100% * 100 / 89);
        margin: 0 calc(-5.5% * 100 / 89) 2rem;
    }
    .home-interior__bottom-media-area {
        width: calc(100% * 100 / 89);
        margin: 0 calc(-5.5% * 100 / 89) 2.4rem;
    }
    .home-interior__dish-img {
        margin-top: 4rem;
        margin-left: 5.5%;
    }
}
/* ---------- home-interior responsive (750) ---------- */
@media screen and (max-width: 750px) {
    .home-interior {}
    .home-interior__section {
        margin-top: 2.7rem;
    }
    .home-interior__texts-area {
        margin-top: 2.5rem;
    }
    .home-interior__bg-text-area {
        display: flex;
        justify-content: start;
        width: calc(100% * 100 / 89);
        margin: 0.4rem calc(-5.5% * 100 / 89) 3rem;
    }
    .home-interior__bottom-media-area {
        flex-direction: column-reverse;
    }
    .home-interior__dish-img {
        width: 38.8%;
        margin-top: 5rem;
        margin-left: 5.5%;
    }
    .home-interior__video {
        width: 100%;
    }
}
/* ========== End home-interior ========== */
/* ========== home-information ========== */
.home-information {}
.home-information__section {
    margin-bottom: 13.2rem;
}
.home-information__bg-text-area {
    display: flex;
    justify-content: end;
    width: calc(100% * 100 / 84);
    margin: 0 calc(-8% * 100 / 84) 0;
}
.home-information__table-area {
    margin-top: 2.5rem;
}
/* ---------- home-information responsive (1000) ---------- */
@media screen and (max-width: 1000px) {
    .home-information {}
    .home-information__section {
        margin-bottom: 10rem;
    }
    .home-information__bg-text-area {
        width: calc(100% * 100 / 89);
        margin: 0 calc(-5.5% * 100 / 89) 0;
    }
    .home-information__table-area {
        margin-top: 1.3rem;
    }
}
/* ========== End home-information ========== */
/* ==================== End End home (index) ==================== */
/* ======================================== End pages ======================================== */