.product-bg.palette{
                background: url('/assets/img/products/palette/kv.webp') no-repeat center;
                background-size: cover;
                height: 46vw;
                margin-top: 0;
            }
            .product-bg.palette img{
                max-width: 24vw;
            }
            .product-bg.palette h2{
                color: #fff;
                margin-top: .5vw;
                font-size: 2vw;
            }
            .product-bg.palette .popup-video{
                margin-top: 32vw;
            }

            .product-bg.cloud .info p{
                max-width: 50vw;
                margin: 0 auto;
            }
            .product-bg.cloud{
                padding: 3vw 0;
                display: block;
                background: url('/assets/img/products/palette/bg-blue.webp') no-repeat center;
                background-size: cover;
            }
            .product-bg.cloud .boost{
                width: 74vw;
                margin: 0 auto;
                margin-top: 3vw;
                gap: 2vw;
            }
            .product-bg.cloud.sf{
                background: url('/assets/img/products/palette/bg-pink.webp') no-repeat center;
                background-size: cover;
                height: 48vw;
            }
            .product-bg.cloud.sf .boost{
                gap: 0;
                width: 80vw;
            }
            .product-bg.cloud .box{
                position: relative;
                transition: all .3s;
                cursor: pointer;
                overflow: hidden;
            }
            .product-bg.cloud .box h4{
                position: absolute;
                top: 3vw;
                padding: 0 2vw;
                text-align: center;
                color: #fff;
                font-size: 2.2vw;
                width: 100%;
            }
            .product-bg.cloud .progress-outer{
                border: none;
                position: relative;
            }
            .product-bg.cloud .progress-outer p{
                color: var(--tp-theme-color-2);
                font-size: 2vw;
                position: absolute;
                right: -0.35vw;
                top: -0.65vw;
                font-family: 'inter-b';
            }
            .product-bg.cloud .tp-skill-item{
                margin-bottom: 1.6vw;
            }
            .product-bg.cloud .tp-skill-item.m{
                margin-bottom: 5vw;
            }
            .product-bg.cloud .progress-outer.n .progress-bar{
                background-color: rgba(255, 255, 255, .4);
            }
            .product-bg.cloud .progress-outer.n p{
                color: rgba(255, 255, 255, .4);
                font-size: 1.2vw;
                top: -0.3vw;
                right: 6vw;
                font-family: 'inter-m';
            }
            .product-bg.cloud .progress-outer.nt p{
                right: 10.2vw;
            }
            .product-bg.screen{
                height: 400vh;
                overflow: initial !important;
            }
            .product-bg.screen .section-sticky{
                display: flex;
                flex-wrap: wrap;
                background: url('/assets/img/products/palette/bg-uni.webp') no-repeat center;
                background-size: cover;
            }
            .product-bg.screen .canvas-bg{
                width: 31.8vw;
                height: 36.4vw;
                margin: 0 auto;
                margin-top: 3vw;
            }   
            .product-bg.screen .canvas-bg canvas{
                transition: all .3s;
            }
            .product-bg.screen .tips{
                font-weight: 700;
                transition: all .3s;
                display: flex;
                align-items: center;
                gap: 1vw;
                max-width: 20vw;
                font-size: 1.4vw;
                color: #fff;
                line-height: 1.3;
                transition: all .5s;
                transform: translateY(30px);
                opacity: 0;
            }
            .product-bg.screen .tips.show{
                transform: translateY(0);
                opacity: 1;
            }
            .product-bg.screen .tips.left{
                position: absolute;
                top: 4vw;
                left: -9.5vw;
                text-align: right;
            }
            .product-bg.screen .tips.left.l2{
                top: 20vw;
                left: -7.5vw;
            }
            .product-bg.screen .tips.right{
                position: absolute;
                top: 7vw;
                right: -10vw;
                text-align: left;
            }
            .product-bg.screen .tips.right.r2{
                top: 25vw;
            }
            .product-pack{
                background: url('/assets/img/products/palette/bg-pack.webp') no-repeat center;
                background-size: cover;
                height: 50vw;
            }
            .product-bg.duo{
                height: 300vh;
                overflow: initial !important;
            }
            .product-bg.duo .info{
                position: relative;
                z-index: 3;
                padding-top: 1vw;
            }
            .product-bg.duo .p{
                position: absolute;
                width: 100%;
                height: 100%;
                top: 0;
                left: 0;
                transition: all .3s;
                z-index: 0;
                background: url('/assets/img/products/palette/mix-1.webp') no-repeat center;
                background-size: cover;
            }
            .product-bg.duo .p2{
                z-index: 1;
                opacity: 0;
                background: url('/assets/img/products/palette/mix-2.webp') no-repeat center;
                background-size: cover;
            }
            .product-bg.duo .p3{
                z-index: 2;
                opacity: 0;
                background: url('/assets/img/products/palette/mix-3.webp') no-repeat center;
                background-size: cover;
            }
            .product-bg.led{
                height: 350vh;
                overflow: initial !important;
            }
            .product-bg.led .p{
                position: absolute;
                width: 100%;
                height: 100%;
                top: 0;
                left: 0;
                transition: all .3s;
                z-index: 0;
                background: #fff;
                display: flex;
                align-items: center;
                justify-content: center;
            }
            .product-bg.led .p2{
                z-index: 1;
                display: none;
            }
            .product-bg.led .p3{
                z-index: 2;
                display: none;
            }
            .product-bg.led .p .pro{
                display: flex;
                align-items: center;
                position: relative;
                gap: 5vw;
            }
            .product-bg.led .p .pro .label{
                height: 35vw;
            }
            .product-bg.led .p .pro .desc{
                position: relative;
                max-width: 24vw;
                transition: all .5s;
            }
            .product-bg.led .p .pro .desc h4{
                position: relative;
                font-size: 2vw;
                z-index: 3;
            }
            .product-bg.led .p .pro .desc h4::after{
                position: absolute;
                content: '';
                left: -1.8vw;
                top: 0.6vw;
                width: 1.2vw;
                height: 1.2vw;
                background-color: #A530FF;
                border-radius: 50%;
                z-index: 2;
            }
            .product-bg.led .p.p1 .pro .desc h4::after{
                left: 24.6vw;
            }
            .product-bg.led .p.p1 .pro .desc .line{
                position: absolute;
                left: 25.4vw;
                top: 1.7vw;
                z-index: 0;
                width: 16vw;
                transition: all .5s;
            }
            .product-bg.led .p.p2 .pro .desc .line{
                position: absolute;
                left: -13vw;
                top: 1.2vw;
                z-index: 0;
                width: 12vw;
                transition: all .5s;
            }
            .product-bg.led .p.p3 .pro .desc .line{
                position: absolute;
                left: -21vw;
                top: 1.2vw;
                z-index: 0;
                width: 20vw;
                transition: all .5s;
            }
            .product-bg.led .p .pro .desc p{
                font-size: 1.04vw;
            }
            .product-bg.led .p.p1 .pro .desc{
                text-align: right;
                transform: translateX(-8vw);
            }
            .product-bg.led .p.p3 .pro .desc{
                text-align: right;
                transform: translateX(5vw);
            }
            .product-spec{
                padding: 5vw 10vw 6vw 10vw;
            }
            .product-spec .area img{
                width: 45vw;
            }
            .product-spec .area .detail{
                width: 50vw;
            }
            .product-bg.product-color{
                background: url('/assets/img/products/palette/new/bgc.webp') no-repeat center;
                background-size: cover;
                height: 136vw;
                padding: 4vw 8vw;
            }
            .color-tab .color-swiper .swiper-slide{
                width: auto;
            }
            .color-tab .color-swiper .swiper-slide img{
                height: 14.5vw;
            }
            .color-tab{
                background: url('/assets/img/products/palette/new/bgc-1.webp') no-repeat center;
                background-size: cover;
                border-radius: 4vw;
                margin-top: 2vw;
                padding-bottom: 3vw;
            }
            .color-tab2{
                background: url('/assets/img/products/palette/new/bgc-2.webp') no-repeat center;
                background-size: cover;
            }
            .color-tab3{
                background: url('/assets/img/products/palette/new/bgc-3.webp') no-repeat center;
                background-size: cover;
            }
            .color-tab2 .color-swiper .swiper-slide img{
                height: 12.5vw
            }
            .color-tab3 .color-swiper .swiper-slide img{
                height: 12.2vw
            }
            .social-swiper2{
                padding-top: 1.5vw;
            }
            .color-tab{
                margin-bottom: 4vw;
            }
            .nico-title{
                font-size: 1.35vw;
                background-color: #A239FF;
                padding: 5px 12px;
                color: #fff;
                display: inline-block;
                transform: translateY(-8px);
            }
            .c-info{
                display: flex;
                justify-content: center;
                align-items: center;
                padding-top: 0 !important;
            }
            .c-title{
                display: inline-block;
                width: 9vw;
                margin-right: 2vw;
            }
            /** mob **/
            @media (max-width: 991px) {
                .product-spec{
                    padding: 1rem .3rem 1.2rem .3rem;
                }
                .product-spec .area .detail{
                    width: 100%;
                }
                .c-info{
                    display: flex;
                    justify-content: start;
                    align-items: center;
                    padding-top: .6rem !important;
                }
                .c-title{
                    display: inline-block;
                    width: 2.2rem;
                    margin-right: 0.1rem;
                }
                .nico-title{
                    font-size: .3rem;
                    transform: translateY(-0.08rem);
                }
                .color-tab .color-swiper .swiper-slide img{
                    height: 3.2rem;
                }
                .social-swiper{
                    padding-top: .6rem;
                }
                .social-swiper2{
                    padding-top: .4rem;
                }
                .color-tab{
                    margin-top: 0;
                    padding-bottom: .6rem;
                }
                .product-bg.cloud .info p{
                    max-width: 100%;
                    margin-bottom: 0;
                }
                .product-bg.cloud{
                    height: auto;
                    padding: 1.2rem .6rem;
                }
                .product-bg.cloud .boost{
                    width: 100%;
                    height: auto;
                    flex-wrap: wrap;
                    margin-top: 0;
                    gap: .4rem;
                }
                .product-bg.cloud .box h4{
                    top: .6rem;
                    font-size: .36rem;
                }
                .product-bg.cloud .box{
                    width: 100%;
                }
                .product-bg.cloud .box.p{
                    border-radius: 0;
                    border-bottom-left-radius: .32rem;
                    background-size: cover;
                }
                .product-bg.cloud .box.c{
                    border-radius: 0;
                    border-bottom-right-radius: .32rem;
                    background-size: cover;
                }
                .product-bg.cloud .tp-skill-item{
                    margin-bottom: .2rem;
                }
                .product-bg.cloud .tp-skill-item.m{
                    margin-bottom: .6rem;
                }
                .product-bg.cloud .tp-skill-bar label{
                    font-size: .36rem;
                    margin-bottom: .3rem;
                }
                .product-bg.cloud .progress-outer p{
                    font-size: .48rem;
                    right: 0;
                    top: -0.12rem;
                }
                .product-bg.cloud .progress-outer.n p{
                    font-size: .48rem;
                    right: 1.3rem;
                    top: -0.12rem;
                }
                .product-bg.cloud .progress-outer.nt p{
                    right: 2.5rem;
                }
                .product-bg.beauty .info p{
                    text-align: center;
                }
                .product-pack{
                    background: url('/assets/img/products/palette/mob/bg-pack.webp') no-repeat center;
                    background-size: cover;
                    height: 5.6rem;
                }
                .product-bg.screen .section-sticky{
                    background: #04112c;
                }
                .product-bg.screen .info{
                    padding-top: .5rem;
                    z-index: 2;
                }
                .product-bg.screen .v-bg{
                    position: relative;
                    transform: scale(.6);
                }
                .product-bg.screen .v-bg::after{
                    position: absolute;
                    left: 0;
                    content: '';
                    bottom: -4rem;
                    width: 100%;
                    height: 5rem;
                    background-color: #000615;
                    filter: blur(20px);
                }
                .product-bg.screen .canvas-bg{
                    width: 100%;
                    height: 100%;
                    position: absolute;
                    top: -2rem;
                    left: 0;
                }
                .product-bg.screen .tips.left{
                    top: 8.5rem;
                    left: .2rem;
                }
                .product-bg.screen .tips{
                    font-size: .28rem;
                }
                .product-bg.screen .tips img{
                    width: .6rem;
                }
                .product-bg.screen .tips.left.l2{
                    top: 12rem;
                    left: -0.2rem;
                }
                .product-bg.screen .tips.right{
                    top: 8.5rem;
                    right: 0;
                }
                .product-bg.screen .tips.right.r2{
                    top: 11.5rem;
                    right: -0.2rem;
                }
                .product-bg.screen{
                    height: 250vh;
                }
                .product-bg.palette{
                    background: url('/assets/img/products/palette/mob/kv-mob.webp') no-repeat center;
                    background-size: cover;
                    height: 10.5rem;
                    margin-top: 0;
                }
                .product-bg.palette img{
                    max-width: 5rem;
                }
                .product-bg.palette .info{
                    padding-top: .8rem;
                }
                .product-bg.palette h2{
                    margin-top: .2rem;
                    font-size: .4rem;
                }
                .banner-video.palette{
                    padding: 4rem .6rem;
                }
                .product-bg.duo .p{
                    background-color: #e0dee8;
                    background-size: 215%;
                    background-position: center;
                }
                .product-bg.duo .info{
                    padding-top: .8rem;
                }
                .product-bg.cloud .info h3{
                    font-size: .48rem;
                }
                .product-bg.cloud.sf{
                    height: auto;
                }
                .product-bg.led .p .pro .desc h4{
                    font-size: .48rem;
                    margin-bottom: .1rem;
                }
                .product-bg.led .p .pro .desc p{
                    font-size: .32rem;
                }
                .product-bg.led .p .pro{
                    flex-wrap: wrap;
                    gap: .4rem;
                    width: 100%;
                    justify-content: center;
                }
                .product-bg.led .p .pro .desc{
                    transform: translateX(0) !important;
                    text-align: left !important;
                    width: 100%;
                    max-width: 100%;
                    padding: 0 .6rem;
                }
                .product-bg.led .p .pro .desc .line, .product-bg.led .p .pro .desc h4::after{
                    display: none;
                }
                .product-bg.led .p .pro .label{
                    height: auto;
                    width: 2rem;
                }
                .product-bg.led .p2 .pro{
                    flex-direction: column-reverse;
                }
                .product-bg.led .p2 .pro .label{
                    width: 5rem;
                }
                .product-bg.led .p3 .pro{
                    flex-direction: column-reverse;
                }
                .product-bg.led .p3 .pro .label{
                    width: 4rem;
                }
                .product-bg.product-color{
                    height: auto;
                    padding: .8rem .4rem;
                }
                .social-swiper .swiper-slide{
                    width: 2.8rem;
                }
                .product-spec .area img{
                    width: 100%;
                }
                .product-bg.palette .popup-video{
                    margin-top: 6rem;
                }
                .product-spec ul li .title{
                    width: 40%;
                    text-align: left;
                }
                .product-spec ul li .desc{
                    width: 60%;
                }
            }