.new-front {

}
.new-front .top-menu {
    display: flex;
    justify-content: center;
    background: none;
}

/* ==========================================================================
   追従バナー（お問い合わせ / WeChat / LINE）
   PC : 右側縦バー / SP : 画面下部横バー
   --cta-shift は fixed-cta.js がフッター手前で止めるために書き換える
   ========================================================================== */
.fixed-cta {
    --cta-shift: 0px;
    position: fixed;
    z-index: 9990;
    display: flex;
    line-height: 1;
}

.fixed-cta a {
    display: flex;
    color: #fff;
    text-decoration: none;
    transition: opacity .3s;
}

.fixed-cta a:hover {
    opacity: .8;
}

.fixed-cta a:focus-visible {
    outline: 2px solid #fff;
    outline-offset: -4px;
}

.fixed-cta__contact {
    background: linear-gradient(var(--cta-grad-dir, 180deg), #056A47 0%, #056A47 25%, #00B953 100%);
}

.fixed-cta__sns--wechat { background: #1AAD19; }
.fixed-cta__sns--line   { background: #06C755; }

.fixed-cta__icon svg { display: block; }
.fixed-cta__arrow    { display: block; color: #fff; }

.fixed-cta__label, .fixed-cta__sns-txt {
    color: #fff;
}


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

    .fixed-cta {
        top: 50%;
        right: 0;
        width: 67px;
        flex-direction: column;
        transform: translateY(calc(-50% - var(--cta-shift)));
    }

    .fixed-cta__contact {
        --cta-grad-dir: 180deg;
        box-sizing: border-box;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 256px;
    }

    .fixed-cta__label {
        writing-mode: vertical-rl;
        font-size: 16px;
        letter-spacing: .16em;
        text-indent: .16em;
        color: #fff;
        font-size: 16px;
        font-weight: 500;
        line-height: 18.776px; 
    }

    .fixed-cta__arrow {
        width: 7px;
        height: 12px;
        margin-top: 14px;
    }

    .fixed-cta__sns {
        flex-direction: column;
        align-items: center;
        justify-content: center;
        height: 67px;
    }

    .fixed-cta__icon svg { width: 22px; height: 20px; }

    .fixed-cta__sns-txt {
        margin-top: 3px;
        letter-spacing: .02em;
        font-size: 12px;
        font-style: normal;
        font-weight: 500;
        line-height: 13.873px;
    }

    .new-front #service .card-content {
        padding-top: 10px;
        padding-bottom: 10px;
    }
    .new-front #service .ttl-ctn--in+.cards .card .card-content {
        min-height: 100px;
    }
    .new-front #service .card-content {
        min-height: 100px;
    }
    .new-front #service .card-img img {
        max-height: 200px;
        object-fit: cover;
    }
    .new-front #service .cards {
        flex-wrap: nowrap;
    }
}

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

    .nav li:nth-of-type(5):after {
        right: -5.66667vw;
    }

    .fixed-cta {
        left: 0;
        right: 0;
        bottom: 0;
        height: 62px;
        transform: translateY(calc(-1 * var(--cta-shift)));
    }

    .fixed-cta__contact {
        --cta-grad-dir: 90deg;
        flex: 1 1 auto;
        align-items: center;
        justify-content: center;
        font-size: 15px;
        letter-spacing: .04em;
    }

    .fixed-cta__arrow {
        width: 7px;
        height: 12px;
        margin-left: 16px;
    }

    .fixed-cta__sns {
        flex: 0 0 71px;
        width: 71px;
        flex-direction: column;
        align-items: center;
        justify-content: center;
    }

    .fixed-cta__icon svg { width: 26px; height: 24px; }

    .fixed-cta__sns-txt {
        margin-top: 3px;
        font-size: 10px;
    }

    /* SPメニュー展開中は隠す（クラス名は既存のドロワーに合わせて要調整） */
    body.menu-open .fixed-cta { display: none; }
}