.wx-tc {
    width: 100%;
    height: 150px;
    padding: 0.18rem;
    position: absolute;
    top: calc(100% + 1rem);
    left: 50%;
    transform: translateX(-50%);
    background: #fff;
    border: 1px solid #dedede;
    border-radius: 0.1rem;
    z-index: 1;
    transition: all 0.4s;
    opacity: 0;
    visibility: hidden;
}

.wx-tc::before {
    content: "";
    border-bottom: 8px solid #fff;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    position: absolute;
    left: 50%;
    bottom: 100%;
    transform: translateX(-50%);
    z-index: 2;
}

.wx-tc::after {
    content: "";
    border-bottom: 8px solid #dedede;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    position: absolute;
    left: 50%;
    bottom: calc(100% + 1px);
    transform: translateX(-50%);
}

.wx:hover .wx-tc {
    opacity: 1;
    visibility: visible;
}

.wx:hover {
    background: var(--bs-warning);
    color: var(--bs-white) !important;
    border: 1px solid transparent !important;
}
@media screen and (min-width: 992px) {
    .bg-contact {
        background: url(//qn1.10soo.net/assets24/202406261131650.png) no-repeat center right;
        background-size: 50% 100%;
    }
}