* {
    margin: 0;
    padding: 0;
}

body {
    width: 100vw;
    /* height: calc(3512 / 1920 * 100vw); */
    /* min-height: 3512px; */
    /* overflow-x: hidden; */
}

/* logo */
.logo-box {
    width: 100vw;
    height: calc(101 / 1920 * 100vw);
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
}

.logo-box .img-logo {
    width: calc(185.35 / 1920 * 100vw);
}


/* banner */
.banner-box {
    width: 100vw;
}

.banner-box .img-banner {
    width: 100vw;
}

/* 亮点 */
.highlights-box {
    width: 100vw;
    margin-top: calc(28 / 1920 * 100vw);
    margin-bottom: calc(122 / 1920 * 100vw);
}

.highlights-title-box {
    width: 100vw;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-top: calc(30 / 1920 * 100vw);
    padding-bottom: calc(30 / 1920 * 100vw);
}

.highlights-title-box .img-highlights-title {
    width: calc(166 / 1920 * 100vw);
}

.highlights-content-box {
    width: 100vw;
    height: calc(495 / 1920 * 100vw);
    /* background-color: red; */
}

.highlights-content-pos {
    width: 100vw;
    height: calc(495 / 1920 * 100vw);
    position: absolute;

    display: flex;
    justify-content: center;
    gap: calc(56 / 1920 * 100vw);
    padding-left: calc(157 / 1920 * 100vw);
    padding-right: calc(337 / 1920 * 100vw);
    box-sizing: border-box;
}

.highlights-content-pos .left {
    display: flex;
    flex-direction: column;
    gap: calc(13 / 1920 * 100vw);
    align-items: center;
    height: calc(495 / 1920 * 100vw);
}


.highlights-content-pos .left .img {
    width: calc(731 / 1920 * 100vw);
}

.highlights-content-pos .left .brief {
    width: auto;
    height: calc(24/ 1920 * 100vw);
}

.highlights-content-pos .right {
    display: flex;
    flex-wrap: wrap;
    row-gap: calc(25 / 1920 * 100vw);
    column-gap: calc(47 / 1920 * 100vw);
    justify-content: center;
    align-items: center;
    height: calc(495 / 1920 * 100vw);
    /* background-color: red; */
}

.highlights-content-pos .right .highlights-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(13 / 1920 * 100vw);
    /* background-color: red; */
    /* height: 50%; */
}

.highlights-content-pos .right .img {
    width: calc(294 / 1920 * 100vw);
}

.highlights-content-pos .right .brief {
    width: auto;
    height: calc(24 / 1920 * 100vw);
}

.highlights-content-pos .right .img-highlights-right {
    width: calc(294 / 1920 * 100vw);
}

.highlights-toy-pos {
    position: absolute;
    right: 0;
    top: calc(-111 / 1920 * 100vw);
    ;
}

.highlights-toy-pos .img-highlights-toy {
    width: calc(337 / 1920 * 100vw);
}

.carousel-box {
    width: 100vw;
    height: calc(1038 / 1920 * 100vw);
    /* background-color: red; */
}

.img-swiper {
    width: 100vw;
}

.switch-box {
    display: flex;
    gap: calc(42 / 1920 * 100vw);
    padding-left: calc(122 / 1920 * 100vw);

    opacity: 1;

}

.switch-box.aninimated {
    animation: opacity 2.5s linear;
}

.switch-box .left-img .img-three-views {
    width: calc(264 / 1920 * 100vw);
}

.switch-box .right-brief {
    padding-top: calc(42 / 1920 * 100vw)
}

.switch-box .right-brief img {
    width: calc(865 / 1920 * 100vw);
}

/* 好带娃更省心 */
.shengxin-box {
    /* margin-top: calc(124.09 / 1920 * 100vw); */
}

.shengxin-title-box {
    width: 100vw;
    display: flex;
    flex-direction: column;
    gap: calc(7.91 / 1920 * 100vw);
    align-items: center;
    margin-bottom: calc(27 / 1920 * 100vw);
}

.shengxin-title-box .main-title {
    width: calc(262 / 1920 * 100vw);
}

.shengxin-title-box .sub-title {
    width: calc(512 / 1920 * 100vw);
}

.shengxin-content-box {
    width: 100vw;
    height: calc(406 / 1920 * 100vw);
    /* overflow: scroll; */
    overflow: hidden;
    position: relative;
    /* padding-left: calc(157 / 1920 * 100vw); */
    max-width: 100vw;
    /* padding-left: calc(157 / 1920 * 100vw); */
}

.shengxin-content-box::-webkit-scrollbar {
    display: none;
}


/* 滑动 */
/* 宽度 = 157*2 + 6*（374+30）- 30 */
.shengxin-content-ul {
    /* width: 100vw; */
    /* width: calc(2708 / 1920 * 100vw); */

    padding-right: calc(157 / 1920 * 100vw);
    box-sizing: border-box;
    display: flex;
    flex-wrap: nowrap;
    gap: calc(30 / 1920 * 100vw);
    box-sizing: border-box;
    width: fit-content;
    /* width: 100vw; */

    /* position: absolute; */
    /* left: calc(157 / 1920 * 100vw); */
    /* transition: all 2s; */
    margin-left: calc(157 / 1920 * 100vw);
    transform: translateX(0)
}

.shengxin-content-li {
    flex-shrink: 0;
    width: calc(374 / 1920 * 100vw) !important;
}

/* .van-swipe-item {
    width: calc(374 / 1920 * 100vw) !important;
} */

.shengxin-content-li .img {
    width: calc(374 / 1920 * 100vw);
}


.shengxin-scroll-bar-box {
    width: 100vw;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: calc(46 / 1920 * 100vw);
}

.shengxin-scroll-bar {
    width: calc(614 / 1920 * 100vw);
    height: calc(6 / 1920 * 100vw);
    background: #eff0f8;

    /* background-color: red; */
}

.shengxin-scroll-bar-pos {
    position: absolute;
    width: calc(614 / 1920 * 100vw);
    height: calc(6 / 1920 * 100vw);
    background-color: transparent;
}

.shengxin-scroll-process {
    width: 45%;
    height: calc(6 / 1920 * 100vw);
    background-color: #9490fa;
    /* background-color: red; */
    /* transition: all 2s; */
}

/* .shengxin-content-ul.aninimated {
    animation: transition 2s;
} */

.footer {
    width: 100vw;
    font-weight: 400;
    font-size: calc(20 / 1920 * 100vw);
    letter-spacing: 0.05px;
    /* line-height: calc(14 / 1920 * 100vw); */
    text-align: left;
    color: #333;
    display: flex;
    flex-direction: column;
    margin-top: calc(151 / 1920 * 100vw);
    padding-left: calc(84 / 1920 * 100vw);
    box-sizing: border-box;
    gap: calc(8 / 1920 * 100vw);
    padding-bottom: calc(52 / 1920 * 100vw);
}

.footer a.link {
    font-weight: 400;
    font-size: calc(20 / 1920 * 100vw);
    letter-spacing: 0.05px;
    /* line-height: calc(14 / 1920 * 100vw); */
    text-align: left;
    color: #333;
    text-decoration: none;
}

.bottom {
    width: 100vw;
    height: calc(48 / 1920 * 100vw);
    background-color: #9490FA;
}

/* 动画 */

@keyframes opacity {
    from {
        opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes transition {
    from {}

    to {
        transition-x: calc(- 404 / 1920 * 100vw)
    }
}

li.el-carousel__indicator.el-carousel__indicator--horizontal,
li.el-carousel__indicator.el-carousel__indicator--horizontal.is-active {
    width: calc(11.31 / 1920 * 100vw) !important;
    height: calc(11.31 / 1920 * 100vw) !important;
    border-radius: 50% !important;
    padding: calc(9 / 1920 * 100vw) !important;
}

.el-carousel__indicator--horizontal .el-carousel__button {
    width: calc(11.31 / 1920 * 100vw) !important;
    height: calc(11.31 / 1920 * 100vw) !important;
    background: #fff !important;
    border-radius: 50% !important;
    border: calc(0.8 / 1920 * 100vw) solid #fff !important;
    box-sizing: border-box !important;
    padding: 0 !important;
}

.el-carousel__indicator--horizontal.is-active .el-carousel__button {
    background-color: #fff !important;
    background: #9490fa !important;
    /* border: calc(0.8 / 1920 * 100vw) solid #fff !important; */
}