/* #mod-nav start */
 .mod-nav-wrap{position: relative;overflow: visible !important;z-index: 10;}
.mod-nav-wrap.wrap, .mod-nav-wrap .wrap{padding-left: 0.6rem;padding-right: 0.6rem;max-width: 100%;overflow: hidden;}
.mod-nav-wrap .area{margin: 0 auto;width: 100%;max-width: 16rem;}
.mod-nav-wrap .icon-box{display: flex;align-items: center;justify-content: center;width: 1em;height: 1em;transition: 0.3s;}
.mod-nav-wrap .tr-x{transform: rotateY(180deg);}
.mod-nav-wrap .tr-y{transform: rotateY(180deg);}
@keyframes ani-slide-top{to{transform: translateY(0);opacity: 1;}
}
.mod-nav-wrap [ani-slide-top]{transform: translateY(-50%);opacity: 0;transform-origin: center;}
.mod-nav-wrap .ani-slide-top{animation: ani-slide-top 0.8s ease-in-out forwards;}
@keyframes ani-slide-bottom{to{transform: translateY(0);opacity: 1;}
}
.mod-nav-wrap [ani-slide-bottom]{transform: translateY(50%);opacity: 0;transform-origin: center;}
.mod-nav-wrap .ani-slide-bottom{animation: ani-slide-bottom 0.8s ease-in-out forwards;}
@keyframes ani-slide-left{to{transform: translateX(0);opacity: 1;}
}
.mod-nav-wrap [ani-slide-left]{transform: translateX(-50%);opacity: 0;transform-origin: center;}
.mod-nav-wrap .ani-slide-left{animation: ani-slide-left 0.8s ease-in-out forwards;}
@keyframes ani-slide-right{to{transform: translateX(0);opacity: 1;}
}
.mod-nav-wrap [ani-slide-right]{transform: translateX(50%);opacity: 0;transform-origin: center;}
.mod-nav-wrap .ani-slide-right{animation: ani-slide-right 0.8s ease-in-out forwards;}
@keyframes ani-lessen{to{transform: scale(1);opacity: 1;}
}
.mod-nav-wrap [ani-lessen]{transform: scale(1.5);opacity: 0;transform-origin: center;}
.mod-nav-wrap .ani-lessen{animation: ani-lessen 0.8s ease-in-out forwards;}
@keyframes ani-scale{to{transform: scale(1);opacity: 1;}
}
.mod-nav-wrap [ani-scale]{transform: scale(0.5);opacity: 0;transform-origin: center;}
.mod-nav-wrap .ani-scale{animation: ani-scale 0.8s ease-in-out forwards;}
@keyframes ani-scale-x{to{transform: scaleX(1);opacity: 1;}
}
.mod-nav-wrap [ani-scale-x]{transform: scaleX(0);opacity: 0;transform-origin: center;}
.mod-nav-wrap .ani-scale-x{animation: ani-scale-x 0.8s ease-in-out forwards;}
@keyframes ani-scale-y{to{transform: scaleY(1);opacity: 1;}
}
.mod-nav-wrap [ani-scale-y]{transform: scaleY(0);opacity: 0;transform-origin: center;}
.mod-nav-wrap .ani-scale-y{animation: ani-scale-y 0.8s ease-in-out forwards;}
@keyframes ani-rotate{to{transform: rotateZ(0);opacity: 1;}
}
.mod-nav-wrap [ani-rotate]{transform: rotateZ(-90deg);opacity: 0;transform-origin: center;}
.mod-nav-wrap .ani-rotate{animation: ani-rotate 0.8s ease-in-out forwards;}
@keyframes ani-rotate-reverse{to{transform: rotateZ(0);opacity: 1;}
}
.mod-nav-wrap [ani-rotate-reverse]{transform: rotateZ(90deg);opacity: 0;transform-origin: center;}
.mod-nav-wrap .ani-rotate-reverse{animation: ani-rotate-reverse 0.8s ease-in-out forwards;}
.mod-nav-wrap .mod-nav{display: flex;align-items: center;justify-content: space-between;z-index: 10;}
.mod-nav-wrap .mod-nav.detail{position: absolute;top: 0;left: 50%;transform: translateX(-50%);}
.mod-nav-wrap .mod-nav-list{display: flex;height: 0.9rem;overflow-x: auto;}
.mod-nav-wrap .mod-nav-item{display: flex;align-items: center;height: 100%;color: #333;white-space: nowrap;transition: 0.3s;}
.mod-nav-wrap .mod-nav-item:nth-child(n+2){margin-left: 0.95rem;}
.mod-nav-wrap .mod-nav-item:hover{color: #66ccff;}
.mod-nav-wrap .mod-nav-item.active{color: #66ccff;box-shadow: 0 -0.02rem 0 0 inset #66ccff;}
.mod-nav-wrap .breadcrumbs{display: flex;color: #777;}
.mod-nav-wrap .breadcrumb-item{display: flex;align-items: center;cursor: pointer;transition: 0.3s;}
.mod-nav-wrap .breadcrumb-item:first-child{display: block;height: 1em;width: 1em;margin-right: 0.1rem;background: url("/static/home/images/icon/home.png") no-repeat center/contain;}
.mod-nav-wrap .breadcrumb-item:nth-child(n+3)::before{content: "-";display: block;margin: 0 0.1rem;color: #999 !important;}
.mod-nav-wrap .breadcrumb-item:last-child{color: #333 !important;}
.mod-nav-wrap .breadcrumb-item:hover{color: #66ccff;}
@media (max-width: 750px){.mod-nav .breadcrumbs{display: none;}
}
/* #mod-nav end */

/* #product-page start */
 .product-page-wrap{background-color: #faf9f9;}
.product-page-wrap input, .product-page-wrap button{background-color: transparent;border: none;outline: none;margin: 0;padding: 0;}
.product-page-wrap .icon-box{display: flex;align-items: center;justify-content: center;width: 1em;height: 1em;transition: 0.3s;}
.product-page-wrap .tr-x{transform: rotateY(180deg);}
.product-page-wrap .tr-y{transform: rotateY(180deg);}
.product-page-wrap .cn-wh, .product-page-wrap .cn-w, .product-page-wrap .cv-wh, .product-page-wrap .cv-w{width: 100%;}
.product-page-wrap .cn-wh, .product-page-wrap .cn-h, .product-page-wrap .cv-wh, .product-page-wrap .cv-h{height: 100%;}
.product-page-wrap .cn-wh, .product-page-wrap .cn-w, .product-page-wrap .cn-h{object-fit: contain;}
.product-page-wrap .cv-wh, .product-page-wrap .cv-w, .product-page-wrap .cv-h{object-fit: cover;}
.product-page-wrap .pic-box{width: 100%;height: 100%;}
.product-page-wrap .pic-box img{max-width: 100%;max-height: 100%;}
.product-page-wrap.wrap, .product-page-wrap .wrap{padding-left: 0.6rem;padding-right: 0.6rem;max-width: 100%;overflow: hidden;}
.product-page-wrap .area{margin: 0 auto;width: 100%;max-width: 16rem;}
.product-page-wrap [data-eps]{overflow: hidden;text-overflow: ellipsis;display: -webkit-box;max-height: 0;/*! autoprefixer: off */ -webkit-box-orient: vertical;/* autoprefixer: on */ -webkit-box-orient: vertical;max-width: 100%;}
.product-page-wrap [data-eps="1"]{display: block;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.product-page-wrap .mod-head{display: flex;align-items: center;justify-content: space-between;}
.product-page-wrap .mod-head.center{justify-content: center;}
.product-page-wrap .mod-head.center .mod-name, .product-page-wrap .mod-head.center .mod-title{text-align: center;}
.product-page-wrap .mod-name{font-family: "Poppins-Medium";color: #66ccff;}
.product-page-wrap .mod-title{margin-top: 0.06rem;line-height: 1.2;font-family: "MiSans-Semibold";}
.product-page-wrap .mod-right{margin-left: auto;}
.product-page-wrap .icon-btn{display: inline-flex;align-items: center;min-width: 1.8rem;min-height: 0.54rem;color: #fff;border-radius: 0.3rem;background-color: #66ccff;padding: 0.15rem 0.45rem;}
.product-page-wrap .icon-btn .icon-box{margin-left: 0.2rem;}
.product-page-wrap .paging-turner{display: flex;align-items: center;justify-content: center;}
.product-page-wrap .paging-turner .paging-index-list{display: flex;align-items: center;}
.product-page-wrap .paging-turner .paging-prev, .product-page-wrap .paging-turner .paging-next, .product-page-wrap .paging-turner .paging-index, .product-page-wrap .paging-turner .paging-eps{display: flex;align-items: center;justify-content: center;width: 0.54rem;height: 0.54rem;margin-right: 0.2rem;border-radius: 50%;background-color: #fff;color: #666;cursor: pointer;transition: 0.3s;}
.product-page-wrap .paging-turner .paging-prev span, .product-page-wrap .paging-turner .paging-next span, .product-page-wrap .paging-turner .paging-index span, .product-page-wrap .paging-turner .paging-eps span{user-select: none;}
.product-page-wrap .paging-turner .paging-prev, .product-page-wrap .paging-turner .paging-next{border: solid 0.01rem #66ccff;}
.product-page-wrap .paging-turner .paging-prev::after, .product-page-wrap .paging-turner .paging-next::after{content: "";display: block;width: 0.16rem;height: 0.14rem;background: url("/static/home/images/icon/view-more-fill.png") no-repeat center/contain;}
.product-page-wrap .paging-turner .paging-prev:hover::after, .product-page-wrap .paging-turner .paging-next:hover::after{filter: grayscale(1) brightness(10);}
.product-page-wrap .paging-turner .paging-next::after{background: url("/static/home/images/icon/view-more-fill.png") no-repeat center/contain;}
.product-page-wrap .paging-turner .paging-prev::after{transform: rotateZ(180deg);}
.product-page-wrap .paging-turner .paging-prev:hover, .product-page-wrap .paging-turner .paging-next:hover, .product-page-wrap .paging-turner .paging-index:hover{background-color: #66ccff;color: #fff;box-shadow: 0 0 0.01rem 0 rgba(0, 0, 0, 0.0666666667);}
.product-page-wrap .paging-turner .paging-prev:hover span, .product-page-wrap .paging-turner .paging-next:hover span, .product-page-wrap .paging-turner .paging-index:hover span{color: #fff;}
.product-page-wrap .paging-turner .paging-index.active{background-color: #66ccff;}
.product-page-wrap .paging-turner .paging-index.active span{color: #fff !important;}
@keyframes ani-slide-top{to{transform: translateY(0);opacity: 1;}
}
.product-page-wrap [ani-slide-top]{transform: translateY(-50%);opacity: 0;transform-origin: center;}
.product-page-wrap .ani-slide-top{animation: ani-slide-top 0.8s ease-in-out forwards;}
@keyframes ani-slide-bottom{to{transform: translateY(0);opacity: 1;}
}
.product-page-wrap [ani-slide-bottom]{transform: translateY(50%);opacity: 0;transform-origin: center;}
.product-page-wrap .ani-slide-bottom{animation: ani-slide-bottom 0.8s ease-in-out forwards;}
@keyframes ani-slide-left{to{transform: translateX(0);opacity: 1;}
}
.product-page-wrap [ani-slide-left]{transform: translateX(-50%);opacity: 0;transform-origin: center;}
.product-page-wrap .ani-slide-left{animation: ani-slide-left 0.8s ease-in-out forwards;}
@keyframes ani-slide-right{to{transform: translateX(0);opacity: 1;}
}
.product-page-wrap [ani-slide-right]{transform: translateX(50%);opacity: 0;transform-origin: center;}
.product-page-wrap .ani-slide-right{animation: ani-slide-right 0.8s ease-in-out forwards;}
@keyframes ani-lessen{to{transform: scale(1);opacity: 1;}
}
.product-page-wrap [ani-lessen]{transform: scale(1.5);opacity: 0;transform-origin: center;}
.product-page-wrap .ani-lessen{animation: ani-lessen 0.8s ease-in-out forwards;}
@keyframes ani-scale{to{transform: scale(1);opacity: 1;}
}
.product-page-wrap [ani-scale]{transform: scale(0.5);opacity: 0;transform-origin: center;}
.product-page-wrap .ani-scale{animation: ani-scale 0.8s ease-in-out forwards;}
@keyframes ani-scale-x{to{transform: scaleX(1);opacity: 1;}
}
.product-page-wrap [ani-scale-x]{transform: scaleX(0);opacity: 0;transform-origin: center;}
.product-page-wrap .ani-scale-x{animation: ani-scale-x 0.8s ease-in-out forwards;}
@keyframes ani-scale-y{to{transform: scaleY(1);opacity: 1;}
}
.product-page-wrap [ani-scale-y]{transform: scaleY(0);opacity: 0;transform-origin: center;}
.product-page-wrap .ani-scale-y{animation: ani-scale-y 0.8s ease-in-out forwards;}
@keyframes ani-rotate{to{transform: rotateZ(0);opacity: 1;}
}
.product-page-wrap [ani-rotate]{transform: rotateZ(-90deg);opacity: 0;transform-origin: center;}
.product-page-wrap .ani-rotate{animation: ani-rotate 0.8s ease-in-out forwards;}
@keyframes ani-rotate-reverse{to{transform: rotateZ(0);opacity: 1;}
}
.product-page-wrap [ani-rotate-reverse]{transform: rotateZ(90deg);opacity: 0;transform-origin: center;}
.product-page-wrap .ani-rotate-reverse{animation: ani-rotate-reverse 0.8s ease-in-out forwards;}
.product-page-wrap .product-main{display: flex;padding-bottom: 1.2rem;}
.product-page-wrap .product-head{display: flex;justify-content: space-between;padding: 0.4rem 1.6rem 0 0.6rem;}
.product-page-wrap .product-title{display: flex;align-items: center;}
.product-page-wrap .product-search{display: flex;height: 0.6rem;min-width: 3.6rem;background-color: #fff;}
.product-page-wrap .search-ipt{flex: 1;padding: 0.1rem 0.2rem;}
.product-page-wrap .search-btn{padding: 0.1rem 0.2rem;}
.product-page-wrap .product-sidebar{display: flex;width: 27%;background-color: #f3f3f3;}
.product-page-wrap .p-sidebar{margin-left: auto;padding: 0.4rem 0;}
.product-page-wrap .ps-item-box:nth-child(n+2){margin-top: 0.1rem;}
.product-page-wrap .ps-item{display: flex;align-items: center;justify-content: space-between;min-height: 0.6rem;padding: 0.15rem 0.3rem;background-color: #fff;transition: 0.3s;}
.product-page-wrap .ps-item .icon-box{opacity: 0;transition: 0.3s;}
.product-page-wrap .ps-item:hover, .product-page-wrap .ps-item.active{color: #fff;background-color: #66ccff;}
.product-page-wrap .ps-item:hover .icon-box, .product-page-wrap .ps-item.active .icon-box{opacity: 1;}
.product-page-wrap .product-body{flex: 1;}
.product-page-wrap .product-list{display: flex;flex-wrap: wrap;flex: 1;padding: 0.4rem 1.6rem 0.4rem 0.6rem;background-color: #faf9f9;}
.product-page-wrap .product-item{position: relative;width: calc((100% - 0.4rem) / 3);height: 4.6rem;background: url("/static/home/images/img/product-bg.jpg") no-repeat center/cover;}
.product-page-wrap .product-item:nth-child(n+2){margin-left: 0.2rem;}
.product-page-wrap .product-item:nth-child(3n+1){margin-left: 0;}
.product-page-wrap .product-item:nth-child(n+4){margin-top: 0.2rem;}
.product-page-wrap .product-item:hover .product-cover::before{opacity: 1;}
.product-page-wrap .product-item:hover .product-content{transform: translateY(0);}
.product-page-wrap .product-item:hover .product-name{color: #fff;}
.product-page-wrap .product-item:hover .view-more{opacity: 1;}
.product-page-wrap .product-pic{display: flex;align-items: center;justify-content: center;height: 3.8rem;width: 100%;padding: 0.4rem;}
.product-page-wrap .product-cover{position: absolute;top: 0;left: 0;width: 100%;height: 100%;display: flex;align-items: flex-end;justify-content: center;}
.product-page-wrap .product-cover::before{content: "";position: absolute;top: 0;left: 0;width: 100%;height: 100%;opacity: 0;background: linear-gradient(to top, #66ccff, rgba(102, 204, 255, 0) 80%);transition: 0.3s;}
.product-page-wrap .product-content{display: flex;flex-direction: column;align-items: center;width: 100%;padding: 0.3rem;transform: translateY(0.7rem);transition: 0.3s;}
.product-page-wrap .product-name{color: #333;text-align: center;line-height: 1.5;font-family: "MiSans-Demibold";width: 100%;}
.product-page-wrap .view-more{display: flex;align-items: center;justify-content: center;width: 0.54rem;height: 0.54rem;padding: 0.15rem;background-color: #fff;margin-top: 0.14rem;border-radius: 50%;opacity: 0;transition: 0.3s;}
.product-page-wrap .paging-turner{margin-top: 0.2rem;}
.product-expand.expand-bar{height: 100vh;min-width: 40%;transition: 0.3s;position: fixed;right: 0;top: 0;background-color: #fff;overflow-y: auto;z-index: 52;transform: translateX(100%);}
.product-expand.expand-bar .expand-list{padding: 0.3rem 0;}
.product-expand.expand-bar .expand-list li{position: relative;flex-direction: column;display: flex;justify-content: space-evenly;align-items: center;padding-top: 0.01rem;transition: 0.3s;border-bottom: 0.01rem solid #eee;}
.product-expand.expand-bar .expand-list li.active .expand-item{background-color: #66ccff;color: #fff;}
.product-expand.expand-bar .expand-list li.active .expand-item:has(+ .expand-sub-list)::after{transform: rotate(180deg);filter: invert(1);}
.product-expand.expand-bar .expand-list li.active .expand-sub-list{display: flex;}
.product-expand.expand-bar .expand-item{display: flex;align-items: center;justify-content: space-between;padding: 0.1rem 0.5rem;width: 100%;height: 100%;color: #333;line-height: 2;transition: 0.3s;}
.product-expand.expand-bar .expand-item:has(+ .expand-sub-list)::after{content: "";width: 1em;height: 1em;margin-left: 0.3rem;background: url("/static/home/images/icon/dropdown.png") no-repeat center/contain;transition: 0.3s;}
.product-expand.expand-bar .expand-sub-list{display: none;flex-direction: column;width: 100%;background-color: #f8f8f8;padding-left: 0.2rem;}
.product-expand.expand-bar .expand-sub-item{position: relative;padding: 0.05rem 0.5rem;line-height: 2;color: #444;}
.product-expand.expand-bar.expand-show{opacity: 1;transform: translateX(0);}
@media (max-width: 750px){.product-page-wrap .product-head{flex-direction: column;padding: 0.4rem 0.6rem 0;}
.product-page-wrap .product-search{margin-top: 0.3rem;}
.product-page-wrap .product-list{padding: 0.4rem 0.6rem 0.4rem 0.6rem;}
.product-page-wrap .product-sidebar{display: none;}
.product-page-wrap .product-item{width: calc((100% - 0.2rem) / 2);}
.product-page-wrap .product-item:nth-child(n+2){margin-left: 0.2rem;}
.product-page-wrap .product-item:nth-child(2n+1){margin-left: 0;}
.product-page-wrap .product-item:nth-child(n+3){margin-top: 0.2rem;}
}
/* #product-page end */