@charset "utf-8";

.intro {
    position: relative;
    padding: 80px 0 120px;
}

.intro .bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    z-index: -1;
}

.intro .sec-tit {
    display: flex;
    flex-direction: column;
    gap: 32px;
    align-items: center;
    justify-content: center;
}

.intro .sec-tit .tit-ja {
    font-size: clamp(1.5rem, 1.379rem + 0.52vw, 2rem);
    text-align: center;
    color: #e6e2d8;
}

.intro .sec-tit .desc p {
    line-height: calc(40/16);
    text-align: center;
    color: #e6e2d8;
}


.kodawari .inner {
    max-width: 1150px;
    width: 90%;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 40px;
    align-items: center;
}

.kodawari .sec-head {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.kodawari .sec-head .tit-sub {
    font-size: 14px;
    text-align: center;
    color: #150e06;
}

.kodawari .sec-head .tit-main {
    font-size: clamp(1.25rem, 1.068rem + 0.78vw, 2rem);
    text-align: center;
    color: #150e06;
}

.kodawari .list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 4%;
}

.kodawari .num {
    font-size: clamp(1rem, 0.939rem + 0.26vw, 1.25rem);
    color: #150e06;
    padding: 0 18px;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.kodawari .num::before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    background: url(/system_panel/uploads/images/20260724002632102482.svg) no-repeat bottom/contain;
}

.kodawari .item-tit {
    font-size: clamp(1rem, 0.939rem + 0.26vw, 1.25rem);
    line-height: calc(48/20);
    text-align: center;
    color: #150e06;
}

.kodawari .sec-img {
    aspect-ratio: 350/209;
    margin-bottom: 16px;
}

.kodawari .sec-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.kodawari .item .desc p {
    line-height: calc(24/16);
}

.access {
    padding: 136px 0 160px;
}

.access .sec-head {
    margin-bottom: 40px;
}

.access .map {
    width: 100%;
    height: 596px;
    margin-bottom: 36px;
}

.access iframe {
    width: 100%;
    height: 100%;
    border: none;
}

.access .inner {
    max-width: 1248px;
    width: 90%;
    margin: 0 auto;
    display: flex;
    gap: 5%;
}

.access .sec-slider {
    max-width: 546px;
    width: 100%;
}

.access .sec-slider .main-swiper {
    height: 332px;
    margin-bottom: 8px;
}

.access .sec-slider .thumb-swiper {
    height: 61px;
}

.access .swiper-slide img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.access .sec-text {
    display: flex;
    flex-direction: column;
    gap: 17px;
}

.access .sec-text .item {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding-bottom: 16px;
    border-bottom: 1px solid #150E06;
}

.access .sec-text .item-tit {
    display: flex;
    align-items: center;
    gap: 8px;
}

.access .sec-text .item-tit .icon {
    width: 26px;
    aspect-ratio: 1/1;
}

.access .sec-text .item-tit .ttl {
    font-size: clamp(0.875rem, 0.845rem + 0.13vw, 1rem);
    color: #150e06;
}

.access .sec-text .desc {
    padding-left: 34px;
}

.access .sec-text .desc p {
    line-height: calc(24/16);
}

@media screen and (max-width: 1024px) {
    .kodawari .inner {
        width: 80%;
    }

    .kodawari .list {
        display: flex;
        flex-direction: column;
        gap: 40px;
    }

    .access .map {
        height: 309px;
    }

    .access .inner {
        flex-direction: column;
        gap: 44px;
    }

    .access .sec-slider {
        max-width: none;
        width: 100%;
    }

    .access .sec-slider .main-swiper {
        height: 204px;
    }

    .access .sec-slider .thumb-swiper {
        height: 58px;
    }
}

@media screen and (max-width: 767px) {
    .intro {
        padding: 56px 0;
    }

    .intro .bg.pc-hidden {
        display: block;
    }

    .intro .bg.sp-hidden {
        display: none;
    }

    .intro .sec-tit {
        gap: 20px;
    }

    .intro .desc {
        width: 90%;
        margin: 0 auto;
    }



    .access {
        padding: 64px 0 120px;
    }
}

.gjs-dashed .bg {
    z-index: 0;
}

.gjs-dashed .intro .sec-tit {
    position: relative;
    z-index: 1;
}

.gjs-dashed .swiper {
    height: auto !important;
}