/* ---------------------------------------------
    SP追従ナビゲーション
--------------------------------------------- */

/* 基本設定：PCでは非表示 */
.fixedCta {
    display: none;
}

@media screen and (width <= 1024px) {
    .fixedCta {
        bottom: 0;
        display: block;
        left: 0;
        opacity: 1;
        position: fixed;
        transform: translateY(0);
        transition: opacity 0.3s ease, transform 0.3s ease;
        width: 100%;
        z-index: 999;
    }

    /* フッター到達時にJSで付与 */
    .fixedCta.is-hide {
        opacity: 0;
        pointer-events: none;
        transform: translateY(100%);
    }

    .fixedCta__inner {
        display: flex;
        gap: 8px;
        padding: 10px 12px;
    }

    .fixedCta__btn--line,
    .fixedCta__btn--web,
    .fixedCta__btn--tel {
        align-items: center;
        border: none;
        border-radius: 8px;
        color: #fff;
        cursor: pointer;
        display: flex;
        flex: 1;
        font-size: clamp(16px, 3vw, 16px);
        font-weight: 500;
        gap: 4px;
        justify-content: center;
        padding: 12px 4px;
        text-decoration: none;
        white-space: nowrap;
    }

    /* 各ボタンの色 */
    .fixedCta__btn--line { background: #06c755; }
    .fixedCta__btn--web  { background: var(--color-orange); }
    .fixedCta__btn--tel  { background: var(--color-blue-700); }

    .fixedCta__inner span {
        display: inline;
        font-size: 14px;
    }

    .fixedCta__inner img {
        flex-shrink: 0;
        height: 20px;
        object-fit: contain;
        width: 20px;
    }

    /* アイコン白抜き（LINE以外） */
    .fixedCta__btn--web img,
    .fixedCta__btn--tel img {
        filter: brightness(0) invert(1);
    }
}