﻿.huxing ul {
    margin: 0 calc(var(--dw_f) * 3);
    position: relative;
    width: 100%;
    display: block;
    white-space: nowrap;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.huxing-out {
    position: relative;
}

.huxing-out .mid-left {
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(3%, -50%);
    color: #ccc;
    animation: twinkle 1.5s infinite;
    -webkit-animation: twinkle 1.5s infinite; /* Safari 和 Chrome */
}

.huxing-out .mid-right {
    position: absolute;
    top: 50%;
    right: 0;
    transform: translate(-3%, -50%);
    color: #ccc;
    animation: twinkle 1.5s infinite;
    -webkit-animation: twinkle 1.5s infinite; /* Safari 和 Chrome */
}

.huxing-out .icon-back {
    font-size: calc(var(--dw) * 10);
    text-shadow: 2px 2px 1px #666;
}

.huxing-out .icon-front {
    font-size: calc(var(--dw) * 10);
    text-shadow: 2px 2px 1px #666;
}

.huxing ul li {
    display: inline-block;
    position: relative;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
}

.unit-img {
    width: calc(var(--dw) * 30);
    height: calc(var(--dw) * 40 - var(--dw_f) * 3);
    background: #fafafa;
}

.unit-img img {
    width: 100%;
    height: 100%;
    object-fit: contain;
}

.unit-type {
    margin: calc(var(--dw_f) * 2) 0;
}

.unit-type .type {
    font-size: calc(var(--dw) * 5);
    margin-right: calc(var(--dw_f) * 2);
    -webkit-text-stroke: 0.2px;
}

.unit-type .tag {
    font-size: calc(var(--dw) * 5 - var(--dw_f) * 2);
    height: calc(var(--dw) * 5 - var(--dw_f));
    padding: 0 calc(var(--dw_f));
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border-radius: 2px;
    text-align: center;
    position: relative;
}

.unit-attr {
    color: #888;
    font-size: calc(var(--dw) * 5 - var(--dw_f) * 2);
    margin-bottom: calc(var(--dw_f) * 2);
}

.unit-price {
    font-size: calc(var(--dw) * 5 - var(--dw_f) * 2);
}

.unit-img .big3d {
    position: absolute;
    background: rgba(0, 0, 0, 0.10);
    width: calc(var(--dw) * 30);
    height: calc(var(--dw) * 40 - var(--dw_f) * 3);
}

.unit-img .mini3d {
    position: absolute;
    width: calc(var(--dw) * 10);
    height: calc(var(--dw) * 10);
    bottom: calc(var(--dw) * 5);
    left: calc(var(--dw) * 5);
}

@-webkit-keyframes twinkle {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.5;
    }

    100% {
        opacity: 1;
    }
}

@keyframes twinkle {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 0.5;
    }

    100% {
        opacity: 1;
    }
}

.huxing .swiper-inner {
    padding: calc(var(--dw_f) * 2);
    /*margin: 0 0 calc(var(--dw_f) * 2) calc(var(--dw) * 5 + var(--dw_f) * 2);*/
    display: inline-block;
}

.huxing-body {
    padding-top: 1px;
}