@charset "utf-8";

/* ==========================================
access01
========================================== */

.access01 {
    padding: 9rem 0 14.8rem;
}

.access01-row {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    margin: 6rem auto 0;
}

.access01-left {
    max-width: 61rem;
    width: 46.21%;
}

.access01-img {
    aspect-ratio: 610/400;
}

.access01-right {
    max-width: 56rem;
    width: 42.42%;
    padding: 0 5rem 0 0;
}

.access01-block {
    margin: 3rem 0 0;
}

.access01-row01 {
    display: flex;
}

.access01-row01:nth-child(n+2) {
    margin: 1.5rem 0 0;
}

.access01-td {
    flex: 1;
}

.access01-btn-row {
    display: flex;
    max-width: 42.4rem;
    width: 100%;
    margin: 3rem 0 0;
}

.access01-btn {
    min-width: 19.4rem;
    width: 100%;
    background: var(--primary);
    color: var(--white);
    border-radius: 100vmax;
    text-align: center;
    padding: .75rem 1.5rem;
    margin: 0 2rem 0 0;
    transition: .3s;
}

.access01-btn:hover {
    filter: brightness(1.12);
}

.access01-tel-row {
    max-width: 32rem;
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: center;
    margin: 3rem 0 0;
    padding: 0 0 1rem;
    border-bottom: 2px dashed;
}

.access01-tel-row .tel-icon {
    margin: 0 2rem 1rem 0;
}

.access01-map-area {
    margin: 6rem auto 0;
    padding: 7rem 2rem;
    background: url(../../../../uploads/access_bg01.jpg) no-repeat top / cover;
}

.access01-map-block {
    max-width: 100rem;
    width: 100%;
    height: 40rem;
    margin: 0 auto;
}

.access01-map-block iframe {
    width: 100%;
    height: 100%;
}

/* ==========================================
access02
========================================== */

.access02 {
    padding: 0 0 7rem;
}

.access02-contents {
    max-width: 166rem;
    width: 100%;
    padding: 7.5rem 2rem 7.8rem;
    margin: 0 auto;
}

.access02-title-box {
    display: flex;
    align-items: center;
    position: relative;
}

.access02-title-box:after{
    content: "";
    position: absolute;
    border-top: 2px dashed var(--base-font-color);
    width: 68%;
    height: 2px;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    z-index: 1;
}

.access02-img01 {
    max-width: 3.36rem;
    width: 10%;
    margin: 0 2rem 0 0;
}

.access02-text-box {
    margin: 3rem 0 0;
}

.access02-num {
    font-family: var(--font-family01);
    font-size: clamp(2.8rem, 2.679rem + 0.518vw, 3.3rem);
    text-align: center;
}

.access02-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 3rem 4rem;
    margin: 5rem auto 0;
    overflow: hidden;
}

.access02-item {
    position: relative;
}

.access02-item:after {
    content: "";
    position: absolute;
    width: 1.2rem;
    height: 2rem;
    top: 42%;
    right: -2.5rem;
    background: url(../../../../uploads/icon_arrow_right02.svg) no-repeat center / contain;
}

.access02-item-text-box {
    margin: 2rem 0 0;
}

.access02-text-box p {
    font-size: clamp(1.6rem, 1.503rem + 0.414vw, 2rem);
    font-weight: 600;
}

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <=1550px) {



}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <=1024px) {

/* ==========================================
access01
========================================== */

    .access01-right {
        max-width: 56rem;
        width: 45.42%;
        padding: 0;
    }

/* ==========================================
access02
========================================== */

    .access02-title-box:after {
        width: 57%;
    }

}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <=768px) {

/* ==========================================
access01
========================================== */

    .access01 {
        padding: 7rem 0 9rem;
    }

    .access01-row {
        flex-direction: column;
        align-items: center;
        margin: 4rem auto 0;
    }

    .access01-left {
        width: 100%;
    }

    .access01-right {
        width: 100%;
        margin: 3rem auto 0;
    }

    .access01-map-area {
        margin: 5rem auto 0;
        padding: 5rem 2rem;
    }

/* ==========================================
access02
========================================== */

    .access02-contents {
        padding: 5rem 2rem;
    }

    .access02-title-box:after {
        width: 47%;
    }

    .access02-grid {
        grid-template-columns: repeat(2, 1fr);
        gap: 1rem 4rem;
        margin: 4rem auto 0;
    }

}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <=576px) {

    .access01-row01:nth-child(n+2) {
        margin: .6rem 0 0;
    }

    .access01-btn-row {
        flex-direction: column;
        margin: 3rem auto 0;
    }

    .access01-btn {
        max-width: 30rem;
        padding: 1rem 1.5rem;
        margin: 0 auto 0;
    }

    .access01-btn:nth-child(n+2) {
        margin: 2rem auto 0;
    }

    .access01-tel-row {
        margin: 3rem auto 0;
    }

    .access02-title-box:after {
        width: 23%;
    }

    .access02-grid {
        gap: 1rem 2rem;
    }

    .access02-item:after {
        width: .8rem;
        height: 1.8rem;
        top: 11rem;
        right: -1.5rem;
    }

    .access02-item-text-box {
        margin: 1rem 0 0;
    }

}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */

/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */
/* ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★ */

@media screen and (width <=414px) {

    .access02-title-box:after {
        content: none;
    }
    .access02-item:after {
        top: 9.5rem;
    }


}

/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */
/* ☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆☆ */