@charset "UTF-8";
/*===================
カミングスーン
====================*/
@import url("https://fonts.googleapis.com/css2?family=Roboto:wght@700&display=swap");

.coming_soon_body {
    width: 100%;
    height: 100svh;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 40px clamp(16px, 5.8565153734vw, 80px);

    @media (width > 768px) {
        align-items: center;
    }

    /*立川*/
    &.tachikawa_bg {
        background: url(../img/coming_soon_img/tachikawa_img_sp02.jpg) center center no-repeat;
        background-size: cover;

        @media (width > 768px) {
            background: url(../img/coming_soon_img/tachikawa_img02.jpg) center center no-repeat;
            background-size: cover;
            .coming_soon_inner {
                .coming_soon_wrap {
                    margin-left: auto;
                }
            }
        }
    }
}

.coming_soon_wrap {
    position: relative;
    z-index: 10;

    width: 100vw;
    margin: 0 calc(50% - 50vw);
    padding-inline: clamp(20px, 4.39238653vw, 60px);
    padding-block:4em 3em;

    &::before {
        content: "";
        display: block;
        background: linear-gradient(90deg, rgba(var(--white), 0.5) 0%, rgba(var(--white), 0.8) 25%, rgba(var(--white), 1) 50%, rgba(var(--white), 0.8) 75%, rgba(var(--white), 0.5) 100%);
        clip-path: polygon(0 30%, 50% 0, 100% 30%, 100% 70%, 50% 100%, 0 70%);
        inline-size: 100%;
        block-size: 100%;
        position: absolute;
        inset: 0;
        z-index: -2;
    }

    @media (width >= 992px) {
        &::before {
            clip-path: polygon(0 20%, 50% 0, 100% 20%, 100% 80%, 50% 100%, 0 80%);
            background: linear-gradient(90deg, rgba(var(--white), 0) 0%, rgba(var(--white), 0.5) 25%, rgba(var(--white), 1) 30%, rgba(var(--white), 1) 50%,rgba(var(--white), 1) 70%, rgba(var(--white), 0.5) 75%, rgba(var(--white), 0) 100%);
        }
        padding-block:4em 3em;
    }
}

.open_days {
    position: absolute;
    z-index: -1;
    inset: -10px clamp(16px, 5.8565153734vw, 80px) auto auto;
    color: rgba(var(--light_tx_color), 1);
    background: #e06a66;
    inline-size: 90px;
    aspect-ratio: 1;
    border-radius: 100vmax;
    font-weight: 700;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    font-size: clamp(2.4rem,48vw/13.66,4.8rem);
    line-height: 1.1;
    .year{
        font-size: 0.6em;
        line-height: 1;
    }
    @media (width >= 768px) {
        inline-size: clamp(120px,180vw/13.66,180px);
    }
    @media (width >= 1336px) {
        inset: -10px  calc(calc(100vmax - 1200px) / 2) auto auto;
    }
}

.coming_soon_logo {
    margin-block-end: 1em;
    :is(img) {
        width:180px;
    }
    @media (width > 768px) {
        margin-block-end: 0.6em;
        :is(img) {
            width: min(100%, 320px);
        }
    }
}
.sub_tx {
    color: #8c7537;
    padding-block: 0.8em 0.5em;
    inline-size: max-content;
    margin-inline: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 0.3em 1em;
    & > dt {
        font-weight: 700;
        color: rgba(var(--white), 1);
        inline-size: max-content;
        background: #8c7537;
        border-radius: var(--base_radius);
        padding-inline: 1em;
        margin-inline: auto;
        font-size: clamp(1.8rem, 24vw/13.66, 2.4rem);
    }
    & > dd {
        font-weight: 700;
        font-size: clamp(1.8rem, 32vw/13.66, 3.2rem);
    }
    @media (width >= 768px) {
        flex-direction: row;
        & > dt {
            margin-inline: revert;
        }
    }
}

.coming_soon_ti {
    inline-size: max-content;
    margin-inline:auto;
    font-weight: 700;
    color: #8c7537;
    font-size: clamp(3.2rem, 88vw/13.66, 8.8rem);
    line-height: 1.4;
    white-space: nowrap;
    position: relative;
    &::after{
        content: "";
        display: block;
        inline-size: 100%;
        block-size: 2px;
        position: absolute;
        inset: auto auto 0;
        background: linear-gradient(90deg, #8C753737 0%,#8c7537FF 50%, #8C753737 100%);
    }
}

.title01 {
    text-align: center;
}
.title01::before {
    left: 50%;
    -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
}
.tachikawa_body .title01 {
    color: #444a73;
}
.tachikawa_body .title01::before {
    background: #444a73;
}
.shibuya_body .title01 {
    color: #a27898;
}
.shibuya_body .title01::before {
    background: #a27898;
}

#access iframe {
    width: 100%;
    height: 360px;
}

.tachikawa_body .footer_wrap {
    background: url(../tachikawa/img/common_img/bgimg_foot.jpg);
}
.shibuya_body .footer_wrap {
    background: url(../shibuya/img/common_img/bgimg_foot.jpg);
}
@media (width >= 768px) {
    footer .ly_card_2column > div:first-child {
        text-align: left;
    }
    footer .ly_card_2column > div:last-child {
        text-align: right;
    }
    .copyright {
        margin-top: 11px;
    }
}
