@media (min-width: 377px) and (max-width: 512px) {
    --baseColorWhite: #FFFFFF;
    @keyframes fadeInMove {
        0% {
            opacity: 0;
            transform: translateY(5rem); /* 起始状态 */
        }
        100% {
            opacity: 1;
            transform: translateY(0); /* 结束状态 */
        }
    }
    @keyframes fadeInOpacity {
        0% {
            opacity: 0;
        }
        100% {
            opacity: 1;
        }
    }

    .page-list.case-wrapper {
        padding: 0;
    }

    .product0 {
        /*background-image: url("../images/product/product.png");*/
        /*background-repeat: no-repeat;*/
        /*background-size: cover;*/
        /*background-position: center;*/
        position: relative;
        height: 26.8rem;
        overflow: hidden; /* 隐藏超出的部分 */
    }

    .product0 .rellax-bg {
        position: absolute;
        top: 0rem;
        left: 0;
        width: 100%;
        height: 100%;
        background-image: url("../images/product/product.png");
        background-size: cover;
        background-position: center;
        z-index: 1; /* 确保背景在底层 */
    }

    .product0 span {
        display: block;
        position: absolute;
        z-index: 1; /* 确保背景在底层 */
    }

    .product0 span:nth-of-type(1) {
        background-image: url("../images/product/producttext1.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 33rem;
        height: 8.2rem;
        top: 6rem;
        left: 3.6rem;
    }

    .product0 span:nth-of-type(2) {
        background-image: url("../images/product/producttext2.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 20.1rem;
        height: 5.2rem;
        bottom: 6rem;
        left: 3.6rem;
    }


    .product1 {
        background-color: var(--baseColorWhite);
        width: 100%;
        height: 60rem;
        position: relative;
    }

    .product1 .hidden-wineBottle {
        position: absolute;
        overflow: hidden;
        width: 12.6rem;
        height: 29.5rem;
        top: 14rem;
        left: calc(50% - 6.1rem);
        z-index: 2;
        /* 添加过渡效果使高度变化更平滑 */
        transition: height 0.1s linear;
        background-color: var(--baseColorWhite);
    }

    .product1 .show-wineBottle {
        position: absolute;
        width: 12.6rem;
        height: 29.5rem;
        top: 14rem;
        left: calc(50% - 6.1rem);
        z-index: 1;
    }

    .product1 .hidden-wineBottle .wineBottle-img, .product1 .show-wineBottle .wineBottle-img {
        width: 12.6rem;
        height: 29.5rem;
    }

    /*.wineBottleBox {*/
    /*    position: absolute;*/
    /*    bottom: 0;*/
    /*    background-image: url("../images/product/wineBottleFull.png");*/
    /*    background-repeat: no-repeat;*/
    /*    background-size: 100%;*/
    /*    width: 12.6rem;*/
    /*    height: 29.476rem;*/
    /*    top: 14rem;*/
    /*    left: calc(50% - 6.1rem);*/
    /*    overflow: hidden; !* 隐藏超出的部分 *!*/
    /*    z-index: 1;*/
    /*}*/
    /*.wineBottleBox .rellax-bg {*/
    /*    position: absolute;*/
    /*    top: 0rem;*/
    /*    left: 0;*/
    /*    width: 100%;*/
    /*    height: 100%;*/
    /*    background-image: url("../images/product/wineBottleNotFull.png");*/
    /*    background-size: cover;*/
    /*    background-position: center;*/
    /*     !* 确保背景在底层 *!*/
    /*}*/
    .product1 span {
        position: absolute;
        background-image: url("../images/product/product1text.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 25.5rem;
        height: 4.1rem;
        bottom: 6.7rem;
        left: calc(50% - 12.75rem);
        opacity: 0;
    }

    .changeProduct1 span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .product2 {
        background-image: url("../images/product/product2Bg.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        width: 100%;
        height: 68rem;
        position: relative;
    }

    .product2 span {
        display: block;
        position: absolute;
        opacity: 0;
    }

    .changeProduct2 span:nth-of-type(1) {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .changeProduct2 span:nth-of-type(2) {
        animation: fadeInMove 2s ease-in-out forwards;
    }

    .changeProduct2 span:nth-of-type(3) {
        animation: fadeInMove 3s ease-in-out forwards;
    }

    .product2 span:nth-of-type(1) {
        background-image: url("../images/product/product2text1.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 32.6rem;
        height: 12.5rem;
        top: 6.4rem;
        left: 4rem;
    }

    .product2 span:nth-of-type(2) {
        background-image: url("../images/product/product2text2.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 32.6rem;
        height: 12.5rem;
        top: 22.9rem;
        left: 4rem;
    }

    .product2 span:nth-of-type(3) {
        background-image: url("../images/product/product2text3.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 32.6rem;
        height: 16.8rem;
        top: 40.9rem;
        left: 4rem;
    }

    .product3 {
        background-image: url("../images/product/product3Bg.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        width: 100%;
        height: 40.2rem;
        position: relative;
        opacity: 0;
    }

    .changeProduct3 {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    /*.product3 span {*/
    /*    display: block;*/
    /*    position: absolute;*/
    /*}*/
    /*.product3 span:nth-of-type(1) {*/
    /*    background-image: url("../images/product/product3text1.png");*/
    /*    background-repeat: no-repeat;*/
    /*    background-size: 100%;*/
    /*    width: 13rem;*/
    /*    height: 4.1rem;*/
    /*    top: 3.2rem;*/
    /*    left: 3.6rem;*/
    /*}*/
    /*.product3 span:nth-of-type(2) {*/
    /*    background-image: url("../images/product/product3text2.png");*/
    /*    background-repeat: no-repeat;*/
    /*    background-size: 100%;*/
    /*    width: 10.9rem;*/
    /*    height: 4.2rem;*/
    /*    top: 8.1rem;*/
    /*    left: 3.6rem;*/
    /*}*/
    /*.product3 span:nth-of-type(3) {*/
    /*    background-image: url("../images/product/product3text3.png");*/
    /*    background-repeat: no-repeat;*/
    /*    background-size: 100%;*/
    /*    width: 8.6rem;*/
    /*    height: 3.1rem;*/
    /*    top: 14.8rem;*/
    /*    left: 3.6rem;*/
    /*}*/
    /*.product3 .bg {*/
    /*    background-image: url("../images/product/product3Bg.png");*/
    /*    background-repeat: no-repeat;*/
    /*    background-size: 100%;*/
    /*    width: 31rem;*/
    /*    height: 26.4rem;*/
    /*    top: 30.3rem;*/
    /*    left: 3.6rem;*/
    /*}*/
    .product4 {
        /*background-image: url("../images/product/product4Bg.png");*/
        /*background-repeat: no-repeat;*/
        /*background-size: cover;*/
        /*background-position: center;*/
        /*width: 100%;*/
        height: 26.8rem;
        position: relative;
        overflow: hidden;
    }

    .product4 .rellax-bg {
        position: absolute;
        top: -32rem;
        left: 0;
        width: 100%;
        height: 200%;
        background-image: url("../images/product/product4Bg.jpg");
        background-size: cover;
        background-position: center;
        z-index: 1; /* 确保背景在底层 */
    }

    .product4 span {
        display: block;
        position: absolute;
        background-image: url("../images/product/product4text.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 29rem;
        height: 10.6rem;
        top: calc(50% - 5.3rem);
        left: 3.6rem;
        opacity: 0;
        z-index: 1; /* 确保背景在底层 */
    }

    .changeProduct4 span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .product5 {
        background-image: url("../images/product/product5Bg.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        width: 100%;
        height: 40.2rem;
        position: relative;
        opacity: 0;
    }

    .changeProduct5 {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .product6 {
        /*background-image: url("../images/product/product6Bg.png");*/
        /*background-repeat: no-repeat;*/
        /*background-size: cover;*/
        /*background-position: center;*/
        /*width: 100%;*/
        height: 26.8rem;
        position: relative;
        overflow: hidden;
    }

    .product6 .rellax-bg {
        position: absolute;
        top: -42rem;
        left: 0;
        width: 100%;
        height: 200%;
        background-image: url("../images/product/product6Bg.jpg");
        background-size: cover;
        background-position: center;
        z-index: 1; /* 确保背景在底层 */
    }

    .product6 span {
        display: block;
        position: absolute;
        background-image: url("../images/product/product6text.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 33rem;
        height: 10.2rem;
        top: calc(50% - 5.1rem);
        left: calc(50% - 16.5rem);
        opacity: 0;
        z-index: 1; /* 确保背景在底层 */
    }

    .changeProduct6 span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .product7 {
        background-image: url("../images/product/product7Bg.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        width: 100%;
        height: 26.8rem;
        position: relative;
    }

    .product7 span {
        display: block;
        position: absolute;
        opacity: 0;
    }

    .changeProduct7 span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .product7 span:nth-of-type(1) {
        background-image: url("../images/product/product7logo.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 8.4rem;
        height: 8.4rem;
        top: 4rem;
        left: 3.6rem;
    }

    .product7 span:nth-of-type(2) {
        background-image: url("../images/product/product7text.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 19rem;
        height: 7.4rem;
        top: 15rem;
        left: 3.6rem;
    }

    .product8 {
        /*background-image: url("../images/product/product8Bg.png");*/
        /*background-repeat: no-repeat;*/
        /*background-size: cover;*/
        /*background-position: center;*/
        /*width: 100%;*/
        height: 26.8rem;
        position: relative;
        overflow: hidden;
    }

    .product8 .rellax-bg {
        position: absolute;
        top: -52rem;
        left: 0;
        width: 100%;
        height: 200%;
        background-image: url("../images/product/product8Bg.jpg");
        background-size: cover;
        background-position: center;
        z-index: 1; /* 确保背景在底层 */
    }

    .product9 {
        background-color: var(--baseColorWhite);
        width: 100%;
        height: 26.8rem;
        position: relative;
    }

    .product9 span {
        display: block;
        position: absolute;
        opacity: 0;
    }

    .changeProduct9 span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .product9 span:nth-of-type(1) {
        background-image: url("../images/product/product9logo.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 8.4rem;
        height: 8.4rem;
        top: 4rem;
        right: 3.6rem;
    }

    .product9 span:nth-of-type(2) {
        background-image: url("../images/product/product9text.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 21.6rem;
        height: 7.4rem;
        top: 15rem;
        right: 3.6rem;
    }

    .product10 {
        /*background-image: url("../images/product/product10Bg.png");*/
        /*background-repeat: no-repeat;*/
        /*background-size: cover;*/
        /*background-position: center;*/
        /*width: 100%;*/
        height: 26.8rem;
        position: relative;
        overflow: hidden;
    }

    .product10 .rellax-bg {
        position: absolute;
        top: -58rem;
        left: 0;
        width: 100%;
        height: 200%;
        background-image: url("../images/product/product10Bg.jpg");
        background-size: cover;
        background-position: center;
        z-index: 1; /* 确保背景在底层 */
    }

    .product11 {
        background-image: url("../images/product/product11Bg.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        width: 100%;
        height: 34rem;
        position: relative;
    }

    .product11 span {
        display: block;
        position: absolute;
        opacity: 0;
    }

    .changeProduct11 span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .product11 span:nth-of-type(1) {
        background-image: url("../images/product/product11logo.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 8.4rem;
        height: 8.4rem;
        top: 4rem;
        left: 3.6rem;
    }

    .product11 span:nth-of-type(2) {
        background-image: url("../images/product/product11text.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 26.8rem;
        height: 5.6rem;
        top: 15rem;
        left: 3.6rem;
    }

    .product11 span:nth-of-type(3) {
        background-image: url("../images/product/product11logo2.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 7rem;
        height: 6.4rem;
        bottom: 2.5rem;
        left: calc(50% - 3.5rem);
    }
}


@media (max-width: 376px) {
    --baseColorWhite: #FFFFFF;
    @keyframes fadeInMove {
        0% {
            opacity: 0;
            transform: translateY(5rem); /* 起始状态 */
        }
        100% {
            opacity: 1;
            transform: translateY(0); /* 结束状态 */
        }
    }
    @keyframes fadeInOpacity {
        0% {
            opacity: 0;
        }
        100% {
            opacity: 1;
        }
    }

    .page-list.case-wrapper {
        padding: 0;
    }

    .product0 {
        /*background-image: url("../images/product/product.png");*/
        /*background-repeat: no-repeat;*/
        /*background-size: cover;*/
        /*background-position: center;*/
        position: relative;
        height: 26.8rem;
        overflow: hidden; /* 隐藏超出的部分 */
    }

    .product0 .rellax-bg {
        position: absolute;
        top: 0rem;
        left: 0;
        width: 100%;
        height: 100%;
        background-image: url("../images/product/product.png");
        background-size: cover;
        background-position: center;
        z-index: 1; /* 确保背景在底层 */
    }

    .product0 span {
        display: block;
        position: absolute;
        z-index: 1; /* 确保背景在底层 */
    }

    .product0 span:nth-of-type(1) {
        background-image: url("../images/product/producttext1.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 33rem;
        height: 8.2rem;
        top: 6rem;
        left: 3.6rem;
    }

    .product0 span:nth-of-type(2) {
        background-image: url("../images/product/producttext2.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 20.1rem;
        height: 5.2rem;
        bottom: 6rem;
        left: 3.6rem;
    }

    .product1 {
        background-color: var(--baseColorWhite);
        width: 100%;
        height: 60rem;
        position: relative;
    }

    .product1 .hidden-wineBottle {
        position: absolute;
        overflow: hidden;
        width: 12.6rem;
        height: 29.5rem;
        top: 14rem;
        left: calc(50% - 6.1rem);
        z-index: 2;
        /* 添加过渡效果使高度变化更平滑 */
        transition: height 0.1s linear;
        background-color: var(--baseColorWhite);
    }

    .product1 .show-wineBottle {
        position: absolute;
        width: 12.6rem;
        height: 29.5rem;
        top: 14rem;
        left: calc(50% - 6.1rem);
        z-index: 1;
    }

    .product1 .hidden-wineBottle .wineBottle-img, .product1 .show-wineBottle .wineBottle-img {
        width: 12.6rem;
        height: 29.5rem;
    }

    /*.wineBottleBox {*/
    /*    position: absolute;*/
    /*    bottom: 0;*/
    /*    background-image: url("../images/product/wineBottleFull.png");*/
    /*    background-repeat: no-repeat;*/
    /*    background-size: 100%;*/
    /*    width: 12.6rem;*/
    /*    height: 29.5rem;*/
    /*    top: 14rem;*/
    /*    left: calc(50% - 6.1rem);*/
    /*    overflow: hidden; !* 隐藏超出的部分 *!*/
    /*    z-index: 1;*/
    /*}*/
    /*.wineBottleBox .rellax-bg {*/
    /*    position: absolute;*/
    /*    top: 0rem;*/
    /*    left: 0;*/
    /*    width: 100%;*/
    /*    height: 100%;*/
    /*    background-image: url("../images/product/wineBottleNotFull.png");*/
    /*    background-size: cover;*/
    /*    background-position: center;*/
    /*    !* 确保背景在底层 *!*/
    /*}*/
    .product1 span {
        position: absolute;
        background-image: url("../images/product/product1text.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 25.5rem;
        height: 4.1rem;
        bottom: 6.7rem;
        left: calc(50% - 12.75rem);
        opacity: 0;
    }

    .changeProduct1 span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .product2 {
        background-image: url("../images/product/product2Bg.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        width: 100%;
        height: 68rem;
        position: relative;
    }

    .product2 span {
        display: block;
        position: absolute;
        opacity: 0;
    }

    .changeProduct2 span:nth-of-type(1) {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .changeProduct2 span:nth-of-type(2) {
        animation: fadeInMove 2s ease-in-out forwards;
    }

    .changeProduct2 span:nth-of-type(3) {
        animation: fadeInMove 3s ease-in-out forwards;
    }

    .product2 span:nth-of-type(1) {
        background-image: url("../images/product/product2text1.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 32.6rem;
        height: 12.5rem;
        top: 6.4rem;
        left: 4rem;
    }

    .product2 span:nth-of-type(2) {
        background-image: url("../images/product/product2text2.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 32.6rem;
        height: 12.5rem;
        top: 22.9rem;
        left: 4rem;
    }

    .product2 span:nth-of-type(3) {
        background-image: url("../images/product/product2text3.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 32.6rem;
        height: 16.8rem;
        top: 40.9rem;
        left: 4rem;
    }

    .product3 {
        background-image: url("../images/product/product3Bg.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        width: 100%;
        height: 40.2rem;
        position: relative;
        opacity: 0;
    }

    .changeProduct3 {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    /*.product3 span {*/
    /*    display: block;*/
    /*    position: absolute;*/
    /*}*/
    /*.product3 span:nth-of-type(1) {*/
    /*    background-image: url("../images/product/product3text1.png");*/
    /*    background-repeat: no-repeat;*/
    /*    background-size: 100%;*/
    /*    width: 13rem;*/
    /*    height: 4.1rem;*/
    /*    top: 3.2rem;*/
    /*    left: 3.6rem;*/
    /*}*/
    /*.product3 span:nth-of-type(2) {*/
    /*    background-image: url("../images/product/product3text2.png");*/
    /*    background-repeat: no-repeat;*/
    /*    background-size: 100%;*/
    /*    width: 10.9rem;*/
    /*    height: 4.2rem;*/
    /*    top: 8.1rem;*/
    /*    left: 3.6rem;*/
    /*}*/
    /*.product3 span:nth-of-type(3) {*/
    /*    background-image: url("../images/product/product3text3.png");*/
    /*    background-repeat: no-repeat;*/
    /*    background-size: 100%;*/
    /*    width: 8.6rem;*/
    /*    height: 3.1rem;*/
    /*    top: 14.8rem;*/
    /*    left: 3.6rem;*/
    /*}*/
    /*.product3 .bg {*/
    /*    background-image: url("../images/product/product3Bg.png");*/
    /*    background-repeat: no-repeat;*/
    /*    background-size: 100%;*/
    /*    width: 31rem;*/
    /*    height: 26.4rem;*/
    /*    top: 30.3rem;*/
    /*    left: 3.6rem;*/
    /*}*/
    .product4 {
        /*background-image: url("../images/product/product4Bg.png");*/
        /*background-repeat: no-repeat;*/
        /*background-size: cover;*/
        /*background-position: center;*/
        /*width: 100%;*/
        height: 26.8rem;
        position: relative;
        overflow: hidden;
    }

    .product4 .rellax-bg {
        position: absolute;
        top: -38rem;
        left: 0;
        width: 100%;
        height: 200%;
        background-image: url("../images/product/product4Bg.jpg");
        background-size: cover;
        background-position: center;
        z-index: 1; /* 确保背景在底层 */
    }

    .product4 span {
        display: block;
        position: absolute;
        background-image: url("../images/product/product4text.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 29rem;
        height: 10.6rem;
        top: calc(50% - 5.3rem);
        left: 3.6rem;
        opacity: 0;
        z-index: 1; /* 确保背景在底层 */
    }

    .changeProduct4 span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .product5 {
        background-image: url("../images/product/product5Bg.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        width: 100%;
        height: 40.2rem;
        position: relative;
        opacity: 0;
    }

    .changeProduct5 {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .product6 {
        /*background-image: url("../images/product/product6Bg.png");*/
        /*background-repeat: no-repeat;*/
        /*background-size: cover;*/
        /*background-position: center;*/
        /*width: 100%;*/
        height: 26.8rem;
        position: relative;
        overflow: hidden;
    }

    .product6 .rellax-bg {
        position: absolute;
        top: -51rem;
        left: 0;
        width: 100%;
        height: 200%;
        background-image: url("../images/product/product6Bg.jpg");
        background-size: cover;
        background-position: center;
        z-index: 1; /* 确保背景在底层 */
    }

    .product6 span {
        display: block;
        position: absolute;
        background-image: url("../images/product/product6text.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 33rem;
        height: 10.2rem;
        top: calc(50% - 5.1rem);
        left: calc(50% - 16.5rem);
        opacity: 0;
        z-index: 1; /* 确保背景在底层 */
    }

    .changeProduct6 span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .product7 {
        background-image: url("../images/product/product7Bg.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        width: 100%;
        height: 26.8rem;
        position: relative;
    }

    .product7 span {
        display: block;
        position: absolute;
        opacity: 0;
    }

    .changeProduct7 span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .product7 span:nth-of-type(1) {
        background-image: url("../images/product/product7logo.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 8.4rem;
        height: 8.4rem;
        top: 4rem;
        left: 3.6rem;
    }

    .product7 span:nth-of-type(2) {
        background-image: url("../images/product/product7text.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 19rem;
        height: 7.4rem;
        top: 15rem;
        left: 3.6rem;
    }

    .product8 {
        /*background-image: url("../images/product/product8Bg.png");*/
        /*background-repeat: no-repeat;*/
        /*background-size: cover;*/
        /*background-position: center;*/
        /*width: 100%;*/
        height: 26.8rem;
        position: relative;
        overflow: hidden;
    }

    .product8 .rellax-bg {
        position: absolute;
        top: -62rem;
        left: 0;
        width: 100%;
        height: 200%;
        background-image: url("../images/product/product8Bg.jpg");
        background-size: cover;
        background-position: center;
        z-index: 1; /* 确保背景在底层 */
    }

    .product9 {
        background-color: var(--baseColorWhite);
        width: 100%;
        height: 26.8rem;
        position: relative;
    }

    .product9 span {
        display: block;
        position: absolute;
        opacity: 0;
    }

    .changeProduct9 span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .product9 span:nth-of-type(1) {
        background-image: url("../images/product/product9logo.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 8.4rem;
        height: 8.4rem;
        top: 4rem;
        right: 3.6rem;
    }

    .product9 span:nth-of-type(2) {
        background-image: url("../images/product/product9text.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 21.6rem;
        height: 7.4rem;
        top: 15rem;
        right: 3.6rem;
    }

    .product10 {
        /*background-image: url("../images/product/product10Bg.png");*/
        /*background-repeat: no-repeat;*/
        /*background-size: cover;*/
        /*background-position: center;*/
        /*width: 100%;*/
        height: 26.8rem;
        position: relative;
        overflow: hidden;
    }

    .product10 .rellax-bg {
        position: absolute;
        top: -70rem;
        left: 0;
        width: 100%;
        height: 200%;
        background-image: url("../images/product/product10Bg.jpg");
        background-size: cover;
        background-position: center;
        z-index: 1; /* 确保背景在底层 */
    }

    .product11 {
        background-image: url("../images/product/product11Bg.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        width: 100%;
        height: 26.8rem;
        position: relative;
    }

    .product11 span {
        display: block;
        position: absolute;
        opacity: 0;
    }

    .changeProduct11 span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .product11 span:nth-of-type(1) {
        background-image: url("../images/product/product11logo.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 8.4rem;
        height: 8.4rem;
        top: 4rem;
        left: 3.6rem;
    }

    .product11 span:nth-of-type(2) {
        background-image: url("../images/product/product11text.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 26.8rem;
        height: 5.6rem;
        top: 15rem;
        left: 3.6rem;
    }
}

@media (min-width: 512px) {
    .pc-product0 {
        /*background-image: url("../images/product/pcproduct0Bg.png");*/
        /*background-repeat: no-repeat;*/
        /*background-size: cover;*/
        /*background-position: center;*/
        position: relative;
        height: 61.3rem;
        overflow: hidden;
    }

    .pc-product0 .rellax-bg {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-image: url("../images/product/prbg1.jpg");
        background-size: cover;
        background-position: center;
        z-index: 0; /* 确保背景在底层 */
    }

    .pc-product0 span {
        display: block;
        position: absolute;
        z-index: 1; /* 确保背景在底层 */
    }

    .pc-product0 span:nth-of-type(1) {
        background-image: url("../images/product/pcproduct0Text1.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 49.85rem;
        height: 11.6rem;
        top: 21.7rem;
        left: 16rem;
    }

    .pc-product0 span:nth-of-type(2) {
        background-image: url("../images/product/pcproduct0Text2.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 32.2rem;
        height: 8.8rem;
        top: 37.9rem;
        left: 16rem;
    }

    .pc-product1 {
        background-color: var(--baseColorWhite);
        position: relative;
        width: 100%;
        height: 94.9rem;
    }

    .pc-product1 .hidden-wineBottle-pc {
        position: absolute;
        overflow: hidden;
        width: 20.3rem;
        height: 47.5rem;
        top: 20rem;
        left: calc(50% - 10.15rem);
        z-index: 2;
        /* 添加过渡效果使高度变化更平滑 */
        transition: height 0.1s linear;
        background-color: var(--baseColorWhite);
    }

    .pc-product1 .show-wineBottle-pc {
        position: absolute;
        width: 20.3rem;
        height: 47.5rem;
        top: 20rem;
        left: calc(50% - 10.15rem);
        z-index: 1;
    }

    .pc-product1 .hidden-wineBottle-pc .wineBottle-img, .pc-product1 .show-wineBottle-pc .wineBottle-img {
        width: 20.3rem;
        height: 47.5rem;
        display: block;
    }

    .pc-product1 span {
        position: absolute;
        background-image: url("../images/product/pcproduct1Text.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 93.6rem;
        height: 6.6rem;
        top: calc(50% - 3.3rem);
        left: calc(50% - 46.8rem);
        opacity: 0;
    }

    .changeProductPC1 span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .pc-product2 {
        background-image: url("../images/product/pcproduct2Bg.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        position: relative;
        height: 42rem;
    }

    .pc-product2 .textBox {
        position: absolute;
        left: 16rem;
        top: 8rem;
        /*width: 110rem;*/
        display: flex;
        justify-content: flex-start;
    }

    .pc-product2 .textBox .left, .pc-product2 .textBox .center, .pc-product2 .textBox .right {
        position: relative;
        /*width: 30rem;*/
        display: flex;
    }

    .pc-product2 .textBox .center, .pc-product2 .textBox .right {
        margin-left: 4.5rem;
    }

    .pc-product2 .textBox .left span, .pc-product2 .textBox .center span, .pc-product2 .textBox .right span {
        display: block;
        opacity: 0;
        z-index: 1; /* 确保背景在底层 */
    }

    .changeProductPC2 .textBox .left span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .changeProductPC2 .textBox .center span {
        animation: fadeInMove 2s ease-in-out forwards;
    }

    .changeProductPC2 .textBox .right span {
        animation: fadeInMove 3s ease-in-out forwards;
    }

    .pc-product2 .textBox .left span:nth-of-type(1) {
        background-image: url("../images/product/pcproduct2Text1.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 4.5rem;
        height: 19rem;
    }

    .pc-product2 .textBox .left span:nth-of-type(2) {
        background-image: url("../images/product/pcproduct2Line1.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: .16rem;
        height: 18.2rem;
        margin: 0 2rem;
    }

    .pc-product2 .textBox .left span:nth-of-type(3) {
        background-image: url("../images/product/pcproduct2Text2.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 21rem;
        height: 18.2rem;
    }

    .pc-product2 .textBox .center span:nth-of-type(1) {
        background-image: url("../images/product/pcproduct2Text3.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 4.5rem;
        height: 19rem;
    }

    .pc-product2 .textBox .center span:nth-of-type(2) {
        background-image: url("../images/product/pcproduct2Line2.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: .16rem;
        height: 18.2rem;
        margin: 0 2rem;
    }

    .pc-product2 .textBox .center span:nth-of-type(3) {
        background-image: url("../images/product/pcproduct2Text4.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 21rem;
        height: 18.2rem;
    }

    .pc-product2 .textBox .right span:nth-of-type(1) {
        background-image: url("../images/product/pcproduct2Text5.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 4.5rem;
        height: 19rem;
    }

    .pc-product2 .textBox .right span:nth-of-type(2) {
        background-image: url("../images/product/pcproduct2Line3.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: .16rem;
        height: 22.2rem;
        margin: 0 2rem;
    }

    .pc-product2 .textBox .right span:nth-of-type(3) {
        background-image: url("../images/product/pcproduct2Text6.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 32rem;
        height: 22.2rem;
    }

    .pc-product3 {
        position: relative;
        display: flex;
        flex-wrap: wrap;
        height: 128.6rem;
    }

    .pc-product3 .text {
        width: 50%;
        height: 64.3rem;
        position: relative;
        background-color: var(--baseColorWhite);
    }

    .pc-product3 .text:nth-of-type(1) {
        background-image: url("../images/product/pcproduct3Bg1.png");
        background-repeat: no-repeat;
        background-size: 100%;
    }

    .pc-product3 .text:nth-of-type(2) {
        background-image: url("../images/product/pcproduct3Bg3.png");
        background-repeat: no-repeat;
        background-size: 100%;
        opacity: 0;
    }

    .pc-product3 .text:nth-of-type(3) {
        background-image: url("../images/product/pcproduct3Bg4.png");
        background-repeat: no-repeat;
        background-size: 100%;
        opacity: 0;
    }

    .pc-product3 .text:nth-of-type(4) {
        background-image: url("../images/product/pcproduct3Bg2.png");
        background-repeat: no-repeat;
        background-size: 100%;
    }

    .pc-product3 .text span {
        display: block;
        position: absolute;
        opacity: 0;
    }

    .changeProductPC3 .text span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .changeProductPC3 .text:nth-of-type(2), .changeProductPC3 .text:nth-of-type(3) {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .pc-product3 .text:nth-of-type(1) span {
        background-image: url("../images/product/pcproduct3Text1.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 46.2rem;
        height: 17.6rem;
        top: 23.4rem;
        left: 8rem;
    }

    .pc-product3 .text:nth-of-type(4) span {
        background-image: url("../images/product/pcproduct3Text2.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 55.4rem;
        height: 17.6rem;
        top: 23.4rem;
        left: 8rem;
    }

    .pc-product4 {
        background-image: url("../images/product/pcproduct4Bg.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        position: relative;
        height: 29.2rem;
    }

    .pc-product4 span {
        display: block;
        position: absolute;
        opacity: 0;
    }

    .changeProductPC4 span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .pc-product4 span:nth-of-type(1) {
        background-image: url("../images/product/pcproduct4Logo.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 8.5rem;
        height: 8.5rem;
        top: 8rem;
        left: 16rem;
    }

    .pc-product4 span:nth-of-type(2) {
        background-image: url("../images/product/pcproduct4Text.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 29.2rem;
        height: 13.2rem;
        top: 9.4rem;
        left: 32.5rem;
    }

    .pc-product5 {
        /*background-image: url("../images/product/pcproduct5Bg.png");*/
        /*background-repeat: no-repeat;*/
        /*background-size: cover;*/
        /*background-position: center;*/
        position: relative;
        height: 32rem;
        overflow: hidden;
    }

    .pc-product5 .rellax-bg {
        position: absolute;
        top: -60%;
        left: 0;
        width: 100%;
        height: 160%;
        background-image: url("../images/product/prbg2.jpg");
        background-size: cover;
        background-position: center;
        z-index: 0; /* 确保背景在底层 */
    }

    .pc-product6 {
        background-color: var(--baseColorWhite);
        position: relative;
        height: 29.2rem;
    }

    .pc-product6 span {
        display: block;
        position: absolute;
        opacity: 0;
    }

    .changeProductPC6 span {
        animation: fadeInMove 1s ease-in-out forwards;
    }

    .pc-product6 span:nth-of-type(1) {
        background-image: url("../images/product/pcproduct6Logo.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 8.5rem;
        height: 8.5rem;
        top: 8rem;
        right: 16rem;
    }

    .pc-product6 span:nth-of-type(2) {
        background-image: url("../images/product/pcproduct6Text.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 31.6rem;
        height: 13.2rem;
        top: 9.4rem;
        right: 32.5rem;
    }

    .pc-product7 {
        /*background-image: url("../images/product/pcproduct7Bg.png");*/
        /*background-repeat: no-repeat;*/
        /*background-size: cover;*/
        /*background-position: center;*/
        position: relative;
        height: 32rem;
        overflow: hidden;
    }

    .pc-product7 .rellax-bg {
        position: absolute;
        top: -60%;
        left: 0;
        width: 100%;
        height: 160%;
        background-image: url("../images/product/prbg3.jpg");
        background-size: cover;
        background-position: center;
        z-index: 0; /* 确保背景在底层 */
    }

    .pc-product8 {
        background-color: #340606;
        background-image: url("../images/product/pcproduct8Bg.png");
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        position: relative;
        height: 40.2rem;
    }

    .pc-product8 span {
        display: block;
        position: absolute;
        opacity: 0;
    }

    .pc-product8 span:nth-of-type(1) {
        background-image: url("../images/product/pcproduct8Logo.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 8.5rem;
        height: 8.5rem;
        top: 8rem;
        left: 16rem;
        animation: fadeInMoveTop 1s ease-in-out forwards;
    }

    .pc-product8 span:nth-of-type(2) {
        background-image: url("../images/product/pcproduct8Text.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 44.5rem;
        height: 8.8rem;
        top: 9.4rem;
        left: 32.5rem;
        animation: fadeInMoveTop 1s ease-in-out forwards;
    }

    .pc-product8 span:nth-of-type(3) {
        background-image: url("../images/product/pcproduct8Logo2.png");
        background-repeat: no-repeat;
        background-size: 100%;
        width: 7.8rem;
        height: 7rem;
        bottom: 8rem;
        left: calc(50% - 3.9rem);
    }

    .pc-product8 span:nth-of-type(3) {
        animation: fadeInMove 1s ease-in-out forwards;
    }

}