/*--------------------------------
ポンちゃん フローティング吹き出し
----------------------------------*/

.ponchan-float {
    position: fixed !important;
    left: 24px !important;
    bottom: 24px !important;
    z-index: 9999 !important;
}

.ponchan-float__link {
    display: flex !important;
    align-items: center !important;
    gap: 12px !important;
    text-decoration: none !important;
}

.ponchan-float__icon {
    display: block !important;
    order: 1 !important;

    width: 86px !important;
    height: 86px !important;

    background-image: url("https://www.shinyo-f.co.jp/bl-content/uploads/pages/f8d21b0036b6c68dc71ff2677d4ae65b/ponchanyoko.png") !important;
    background-repeat: no-repeat !important;
    background-position: center !important;
    background-size: contain !important;

    filter: drop-shadow(0 0 3px #fff)
            drop-shadow(0 0 6px #fff);
}

.ponchan-float__bubble {
    position: relative !important;
    display: block !important;
    order: 2 !important;

    max-width: 260px !important;
    padding: 14px 18px !important;

    background: #fffdf8 !important;
    border: 2px solid #d8c5a0 !important;
    border-radius: 18px !important;

    color: #333 !important;
    font-size: 14px !important;
    line-height: 1.7 !important;
    letter-spacing: 0.03em !important;

    box-shadow: 2px 2px 10px rgba(0,0,0,0.15) !important;

    cursor: pointer !important;
}

.ponchan-float__bubble::after {
    content: "" !important;
    position: absolute !important;
    left: -14px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;

    width: 0 !important;
    height: 0 !important;

    border-top: 10px solid transparent !important;
    border-bottom: 10px solid transparent !important;
    border-right: 14px solid #d8c5a0 !important;
}

.ponchan-float__bubble::before {
    content: "" !important;
    position: absolute !important;
    left: -11px !important;
    top: 50% !important;
    transform: translateY(-50%) !important;

    width: 0 !important;
    height: 0 !important;

    border-top: 8px solid transparent !important;
    border-bottom: 8px solid transparent !important;
    border-right: 12px solid #fffdf8 !important;

    z-index: 1 !important;
}

.ponchan-float__link:hover .ponchan-float__bubble {
    background: #fff6dd !important;
    text-decoration: underline !important;
}

@media screen and (max-width: 768px) {
    .ponchan-float {
        left: 12px !important;
        bottom: 12px !important;
    }

    .ponchan-float__link {
        gap: 8px !important;
    }

    .ponchan-float__icon {
        width: 58px !important;
        height: 58px !important;
    }

    .ponchan-float__bubble {
        max-width: 190px !important;
        padding: 10px 12px !important;
        font-size: 12px !important;
        line-height: 1.6 !important;
    }

    .ponchan-float__bubble::after {
        left: -12px !important;
        border-top-width: 8px !important;
        border-bottom-width: 8px !important;
        border-right-width: 12px !important;
    }

    .ponchan-float__bubble::before {
        left: -9px !important;
        border-top-width: 6px !important;
        border-bottom-width: 6px !important;
        border-right-width: 10px !important;
    }
}