@charset "UTF-8";
:root {
    --c-blk-1:#282828;
    --c-gray-1:#D9D9D9;
    --c-primary-1:#009944;
    --c-secondary-1:#b6e9d3;
    --c-secondary-2:#fafaf5;
    --f-serif: serif;
    --f-sans: "dnp-shuei-gothic-gin-std", sans-serif;
    --f-sans2: "dnp-shuei-gothic-gin-std", sans-serif;
    --f-en: "dnp-shuei-gothic-gin-std", sans-serif;
}
html,body{
    height: auto;
}
body{
    font-feature-settings: normal;
    letter-spacing: 0.1;
    font-weight: 400;
}
.pageheader__cnv__list [href],
.globalnavi__heading,
.btn--link,
.contact-block form input[type=submit],
.wp-block-button__link,
.page--front .front__concept__catch,
main h2,
main h3,
main h4,
.pagefooter__contact__link{
    font-feature-settings: "palt";
    font-weight: 600;
    letter-spacing: 0;
}
strong{
    font-weight: 600;
}
.pageheader{
    position: sticky;
}
.news__title--wrap .news__title{
    color: var(--c-primary-1);
    font-size: 1.75em;
    font-weight: 600;
}
.news__content h2{
    color: var(--c-primary-1);
    font-size: 1.5em;
    font-weight: 600;
    text-align: left;
    width: 100%;
}
.news__date{
    font-weight: 600;
    color: #aaa;
}
.kv-slider{
    position: relative;
    z-index: 0;
    width: 100%;
    height: calc(100svh - 70px);
    background-image: var(--filename);
    background-size: cover;
    background-position: center;
    @media(max-width:1024px){
        height: calc(100svh - 50px);
    }
    li{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 0;
        opacity: 0;
        overflow: hidden;
        img{
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
    }
    li.next{
        z-index: 1;
        opacity: 1;
        clip-path: polygon(100% 0, 100% 0, 100% 100%, 100% 100%);
        img{scale: 1.1;}
    }
    li.active{
        opacity: 1;
        z-index: 1;
        transition: clip-path 1s;
        clip-path: polygon(100% 0, 0 0, 0 100%, 100% 100%);
        img{
            transition: scale 2s ease-out;
            scale: 1;
        }
    }
    li.prev{
        transition: opacity 1s;
        z-index: 2;
        opacity: 0;
    }
}
.kv-slider::after{
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;left: 0;
    z-index: 10;
    background-color: rgba(0,0,0,0.3);
    background-image: radial-gradient(circle, rgba(0,0,0,0.7) 1px, transparent 1px);
    background-position: center center;
    background-size: 3px 3px;
    background-repeat: repeat;
}
#kv{
    position: relative;
    .logo{
        position: absolute;
        top: 0;left: 0;right: 0;bottom: 0;
        margin: auto;
        width: 300px;
        @media(max-width:600px){
            width: 200px;
        }
    }
    .copy{
        color: #fff;
        position: absolute;
        left: 0;right: 0;top: 20%;
        font-weight: 700;
        font-size: 1.4em;
        letter-spacing: 0.2em;
        width: fit-content;
        max-width: calc(100% - 80px);
        margin: auto;
    }
}
main{
    padding-top: 0;
}
main h2{
    padding: 0;
    background: none;
}
.front__lead{
    max-width: 650px;
}
.wp-block-table .has-fixed-layout{
    width: auto;
    max-width: 800px;
    margin: auto;
    td{border-color: #d6d9d4;}
    td:first-child{width:8em;}
    td:last-child{width:auto;}
}
.front__access__map {
    aspect-ratio: 2 / 1.5;
    margin: 30px calc(-1 * var(--space-hor)) 15px;
    position: relative;
    iframe{
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
}
@media screen and (min-width: 1025px) {
    .front__access__map {
        margin: 50px auto 25px;
        aspect-ratio: 2 / 1;
    }
}
.wp-block-image.size-large{
    img{width: 100%;}
}
.info__list{
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    @media(min-width:600px){
        margin-top: 40px;
    }
    .info-item{
        width: 100%;
        @media(min-width:600px){
            width: calc(50% - 10px);
        }
        @media(min-width:900px){
            width: calc((100% / 3) - (20px * 2 / 3 ));
        }
    }
}
.info-item{
    background-color: #efefef;
    display: flex;
    flex-direction: column;
    position: relative;
    font-feature-settings: "palt";
    .photo{
        width: 100%;
        aspect-ratio: 1.618/1;
        background-color: #efefef;
        position: relative;
        img{
            position: absolute;
            top: 0;left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
        }
    }
    .category{
        position: absolute;
        top: 10px;
        right: 10px;
        z-index: 1;
        font-size: 12px;
        line-height: 1;
        display: flex;
        justify-content: flex-end;
        gap: 5px;
        li{
            padding: 5px;
            background-color: var(--c-primary-1);
            color: #fff;
            font-weight: 600;
            border-radius: 3px;
        }
    }
    .title{
        font-weight: 600;
        font-size: 14px;
        line-height: 1;
        text-align: left;
        padding: 5px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        border-top: 1px solid #fff;
    }
    dl{
        display: flex;
        border-top: 1px solid #fff;
        padding: 5px;
        line-height: 1;
        dt{
            width: 7em;
            font-size: 10px;
        }
        dd{
            flex: 1;
            text-align: right;
            font-size: 12px;
            small{
                font-size: 0.75em;
            }
        }
    }
    .price{
        font-weight: 600;
    }
}
.info-photos{
    overflow: auto;
    position: sticky;
    top: 50px;
    left: 0;
    z-index: 10;
    background-color: var(--c-secondary-2);
    @media(min-width:1000px){
        position: static;
        top: 0;
        width: 500px;
    }
}
.info-photos__inner{
    display: flex;
    white-space: nowrap;
    gap: 10px;
    @media(min-width:1000px){
        flex-direction: column;
    }
}
.info-photos__item{
    height: 30svh;
    aspect-ratio: 1.618/1;
    background-color: #efefef;
    position: relative;
    @media(min-width:1000px){
        width: 100%;
        height: auto;
    }
    img{
        position: absolute;
        top: 0;left: 0;
        width: 100%;
        height: 100%;
        object-fit: contain;
    }
}
body:has(.page--info){background-color: var(--c-secondary-2);}
.page--info{
    @media(min-width:1000px){
        display: flex;
        max-width: 1170px;
        margin: auto;
    }
}
.info-article{
    max-width: 600px;
    margin: 0 auto;
}
.info-content{
    padding: 40px 20px 80px;
    @media(min-width:1000px){
        position: sticky;
        top: 70px;
        left: 0;
    }
    .category{
        font-size: 12px;
        line-height: 1;
        display: flex;
        gap: 5px;
        a{
            padding: 5px;
            background-color: var(--c-primary-1);
            color: #fff;
            font-weight: 600;
            border-radius: 3px;
        }
    }
    .title{
        margin: 1em 0;
        font-size: 16px;
        font-weight: 600;
        line-height: 1.6;
        text-align: left;
        @media(min-width:768px){
            font-size: 18px;
        }
    }
    dl{
        display: flex;
        padding: 10px;
        line-height: 1;
        background-color: #fff;
        dt{
            width: 7em;
            font-size: 12px;
            color: var(--c-primary-1);
            @media(min-width:768px){
                font-size: 14px;
            }
        }
        dd{
            flex: 1;
            text-align: right;
            small{
                font-size: 0.75em;
            }
        }
    }
    .other{
        display: flex;
        flex-direction: column;
        gap: 1px;
        margin-bottom: 20px;
    }
    .price{
        font-weight: 600;
    }
    .the_content{
        text-align: justify;
        a{
            text-decoration: underline;
            color: var(--c-primary-1);
        }
    }
}
.info-recomend{
    padding: 60px 20px;
    background-color: #f5f5f5;
    h2{
        text-align: center;
        font-weight: 600;
        font-size: 1.5em;
        margin-bottom: 1em;
    }
    .info__list{
        max-width: 1170px;
        margin: auto;
    }
}
.page--message{
    .section__inner{
        max-width: 800px;
        margin: auto;
        h2{
            width: 100%;
            text-align: left;
            font-size: 1.5em;
        }
    }
}
.taxnavi{
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 0.5em 1.5em;
    margin: 1.5em auto;
    a{
        text-decoration: underline;
    }
    .current-cat a{
        pointer-events: none;
        text-decoration: none;
        color: var(--c-primary-1);
        font-weight: 600;
    }
}
.wp-block-separator{
    margin: 1em 0;
    height: 1px;
    opacity: .5;
}
#manifest li{
    margin: 0.75em 0;
    strong{ font-size: 1.1em; }
}