@charset "UTF-8";

.sig {
    display: block;
    margin-top: 2rem;
    text-align: right;
}

/* ==========================================
   ABOUT 見出し
========================================== */

.about-intro__content h2 {
    max-width: 700px;
    font-size: clamp(42px, 4vw, 64px);
    line-height: 1.28;
    letter-spacing: -0.02em;
    word-break: keep-all;
}

@media screen and (min-width:1025px) and (max-width:1500px) {

    .about-intro__content h2 {
        font-size: 52px;
    }

}

/* =========================================================
   QUICK CONTACT FINAL
========================================================= */

/* ---------- PC ---------- */
@media screen and (min-width: 769px) {

    .quick-contact {
        position: fixed;
        top: 50%;
        right: 0;
        z-index: 9999;

        display: flex;
        flex-direction: column;

        width: 50px;

        transform: translateY(-50%);
        overflow: visible;
    }

    .quick-contact__item {
        position: relative;

        display: block;

        width: 50px;
        height: 58px;

        margin: 0;
        padding: 0;

        overflow: visible;

        color: #fff;
        text-decoration: none;

        border: 0;
        border-radius: 0;
    }

    /* 背景 */
    .quick-contact__item::before {
        content: "";

        position: absolute;
        top: 0;
        right: 0;

        width: 50px;
        height: 58px;

        z-index: -1;

        transition: width .25s ease;
    }

    .quick-contact__tel::before {
        background: #075865;
    }

    .quick-contact__access::before {
        background: #15958f;
    }

    .quick-contact__mail::before {
        background: #2fc4be;
    }

    /* hoverで左へ展開 */
    .quick-contact__item:hover::before {
        width: 185px;
    }

    /* アイコン */
    .quick-contact__icon {
        position: absolute;
        top: 0;
        right: 0;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 50px;
        height: 58px;

        margin: 0;
        padding: 0;

        background: transparent;

        color: #fff;
    }

    .quick-contact__icon i {
        color: #fff;
        font-size: 17px;
    }

    /* 電話だけ少し小さく */
    .quick-contact__tel .quick-contact__icon i {
        font-size: 15px;
    }

    /* 文字 */
    .quick-contact__text {
        position: absolute;
        top: 0;
        right: 50px;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 135px;
        height: 58px;

        gap: 7px;

        padding: 0 10px;

        opacity: 0;
        visibility: hidden;

        transform: translateX(10px);

        transition:
            opacity .18s ease,
            transform .18s ease,
            visibility .18s ease;
    }

    .quick-contact__item:hover .quick-contact__text {
        opacity: 1;
        visibility: visible;

        transform: translateX(0);
    }

    .quick-contact__text strong {
        color: #fff;

        font-size: 13px;
        font-weight: 700;

        white-space: nowrap;
    }

    .quick-contact__text small {
        color: rgba(255, 255, 255, .7);

        font-size: 8px;
        font-weight: 700;

        white-space: nowrap;
    }
}


/* ---------- SP ---------- */
@media screen and (max-width: 768px) {

    .quick-contact {
        position: fixed;

        top: auto;
        right: 0;
        bottom: 0;
        left: 0;

        z-index: 9999;

        display: grid;
        grid-template-columns: repeat(3, 1fr);

        width: 100%;
        height: 64px;

        transform: none;
    }

    .quick-contact__item {
        display: flex;

        align-items: center;
        justify-content: center;

        width: 100%;
        height: 64px;

        color: #fff;
        text-decoration: none;
    }

    .quick-contact__tel {
        background: #075865;
    }

    .quick-contact__access {
        background: #15958f;
    }

    .quick-contact__mail {
        background: #2fc4be;
    }

    .quick-contact__icon {
        position: static;

        display: flex;
        align-items: center;
        justify-content: center;

        width: 30px;
        height: 30px;

        margin-right: 7px;

        border-radius: 50%;

        background: #fff;

        color: #063e47;
    }

    .quick-contact__icon i {
        color: #063e47;
        font-size: 13px;
    }

    .quick-contact__text {
        position: static;

        display: flex;
        flex-direction: column;

        width: auto;
        height: auto;

        opacity: 1;
        visibility: visible;

        transform: none;
    }

    .quick-contact__text strong {
        color: #fff;
        font-size: 11px;
        font-weight: 700;
    }

    .quick-contact__text small {
        display: none;
    }

    body {
        padding-bottom: 64px;
    }
}

.access-map-image {
    width: 100%;
    max-width: 1200px;
    margin: 0 auto;
}

.access-map-image img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 28px;
}