.onlineBox {
    position: fixed;
    right: 5px;
    bottom: 10%;
    z-index: 22;
    width: 50px
}

    .onlineBox ul {
        background: #fff;
        border-radius: 5px;
        box-shadow: 0 0 15px rgba(0,0,0,0.1);
        margin-bottom: 10px
    }

        .onlineBox ul li {
            display: block;
            border-bottom: 1px #eee solid;
            margin: 0
        }

            .onlineBox ul li:last-child {
                border: none
            }

            .onlineBox ul li a {
                display: flex;
                align-items: center;
                width: 100%;
                height: 50px;
                line-height: 50px;
                text-align: center;
                justify-content: center;
                position: relative
            }

                .onlineBox ul li a svg {
                    fill: #666
                }

                .onlineBox ul li a p {
                    position: absolute;
                    right: 58px;
                    background: #b70005;
                    padding: 5px 15px;
                    border-radius: 5px;
                    top: 50%;
                    transform: translate(-50px,-50%);
                    color: #fff;
                    width: max-content;
                    font-size: 14px;
                    line-height: 30px;
                    opacity: 0;
                    visibility: hidden;
                    transition: all 0.6s
                }

                    .onlineBox ul li a p:after {
                        content: "";
                        display: block;
                        width: 0;
                        height: 0;
                        border-top: 5px solid transparent;
                        border-left: 10px solid #b70005;
                        border-bottom: 5px solid transparent;
                        position: absolute;
                        right: -8px;
                        top: 50%;
                        transform: translate(0,-50%)
                    }

            .onlineBox ul li.weixin a p {
                padding: 5px;
                background: #b70005
            }

                .onlineBox ul li.weixin a p:after {
                    border-left: 10px solid var(--c)
                }

            .onlineBox ul li a p img {
                width: 130px
            }

            .onlineBox ul li a:hover svg {
                fill: var(--c)
            }

            .onlineBox ul li a:hover p {
                transform: translate(0,-50%);
                opacity: 1;
                visibility: visible
            }