@charset "utf-8";
@import url("base.css");/* 重置&常用样式 */
@import url("fonts/custom.css"); /* 字体 */

/* 全局变量 */
:root{
   --max-width: 1400;
   --background-cover: no-repeat center center / cover;
   --background-contain: no-repeat center center / contain;
   --default-color__rgb: 51,51,51; /*#333*/
   --default-color: rgba(var(--default-color__rgb), 1);
   --primary-color__rgb: 243, 152, 0; /*#f39800*/
   --primary-color: rgba(var(--primary-color__rgb), 1);
   --secondary-color__rgb: 23, 28, 97;/*#171c61*/
   --secondary-color: rgba(var(--secondary-color__rgb), 1);
   --font-family: 'SourceHanSansCN',sans-serif;
   --white-color__rgb: 255,255,255; /*#FFFFFF*/
   --white-color: rgba(var(--white-color__rgb), 1);
   --black-color__rgb: 0,0,0; /*#000000*/
   --black-color: rgba(var(--black-color__rgb), 1);
   --main_line_height: 1.6;
   --button_height: 0.4rem;
   --font-weight__l: 100;
   --font-weight__r: 400;
   --font-weight__m: 500;
   --font-weight__b: 700;
   --transition:transform .3s cubic-bezier(.215,.61,.355,1),-webkit-transform .3s cubic-bezier(.215,.61,.355,1);
   --box-shadow:0 4px 8px 0 rgba(0, 0, 0, .14), 0 4px 15px 0 rgba(0, 0, 0, .09);
   
}

.fancybox__nav{--f-button-next-pos: 0!important;--f-button-prev-pos: !important;}

/* 比例要求 */
/*超过1920px时，比例不变  默认*/
html{font-size: 100px;}
html,body{background: #ebebeb;}
main{max-width: 1920px;margin: 0 auto; min-height: 40vh; margin-top: 1.29rem;}
.container {max-width: calc(var(--max-width) * 1px);}
@media (max-width: 1400px) {
   html:not(.view){font-size: calc(100 / 1400 * 100vw);}
}
@media (max-width: 1024px) {
   html:not(.view){font-size: calc(100 / 750 * 100vw);}
}
@media (max-width: 480px) {
   html:not(.view){font-size: calc(100 / 520 * 100vw);}
}


body{font-size: var(--font-size__16); font-family:var(--font-family); line-height:  var(--main_line_height); color: var(--default-color);}

.container {width: 87.6%;margin: 0 auto;}
@media (max-width: 1024px) {
   .container { width: 94%; }
   main{margin-top: 0.94rem;}
}

/* Start
   ========================================================================== */
header{position: fixed;left: 0;top: 0;z-index: 100;width: 100%; background-color: var(--white-color); border-bottom: solid 1px #dedede;}
header .top{background-color: var(--default-color); padding: 0 10px; color: var(--white-color); font-size: var(--font-size__12); line-height: calc(35 / 12);}
header .top a{color: var(--white-color);}
header .top .left p{margin: 0;}
header .top .right li:not(:last-child),
header .top .left p:not(:last-child){margin-right: 15px;}
header .mid{padding: 0 20px; height: 0.51rem;}
header .logo img{display: block; height: 0.35rem;}
header .nav li:not(:last-child){margin-right: 15px;}
header .nav li{position: relative;width: 0.3rem;height: 0.3rem;}
header .nav li a{display: block; font-size: var(--font-size__30); height: 100%; cursor: pointer;}
header .nav li a.user{background: url(../images/person.svg) var(--background-contain);}
header .nav li.member {width:auto; line-height: 0.3rem; display: flex; align-items: center;}
header .nav li.member a {font-size: var(--font-size__18);}
header .nav li.member .out {margin-left: 0.1rem;}
header .nav li a.collect{color: var(--primary-color);}
header .nav li a.cart{color: var(--default-color); }
header .nav li span{position: absolute;top: -0.05rem;right: -0.04rem; background-color: var(--black-color);color: var(--white-color); border-radius: 50%; display: none;width: calc(18 / 12 * 1em);
height: calc(18 / 12 * 1em);text-align: center;line-height: calc(19 / 12); font-size: var(--font-size__12); }

header .search{border: 1px solid var(--default-color); border-radius: 0.3rem;display: flex;justify-content: space-between; width: 6.5rem;}
header .search .text{padding: 0 10px;height: 0.33rem; line-height: 0.33rem;flex:1;margin-right: 0.09rem; background: none;border: 0;}
header .search .btn{width: 0.3rem;display: flex;align-items: center; justify-content: center;cursor: pointer;}

.main-menu .sub{background-color: var(--white-color); }
.main-menu li span{padding: 0 0.11rem;position: relative; line-height: calc(42/16);}
.main-menu .sub dl{padding: 0.1rem var(--padding-margin__40);}
.main-menu .sub dt{font-weight:var(--font-weight__b);}
.main-menu .sub .items-info,
.main-menu .sub .items-info dt{font-size: var(--font-size__19);font-weight:var(--font-weight__r);}
.main-menu .sub .items-info dd{margin-top: 10px;}
@media (min-width:1025px) {
.main-menu li:not(:last-child) span::after{content: '|'; left:100%;position: absolute; top: 0; height: 100%;display: flex;align-items: center;}
.main-menu .sub{position: absolute; top: 100%;left: 0;width: 100%;border-bottom: solid 1px #dedede;border-top: solid 1px #dedede;opacity: 0;visibility: hidden;z-index: -1;padding: 0.2rem var( --padding-margin__50);} 
.main-menu .sub dl{font-size: var(--font-size__14);  max-width: 3rem;min-width: 3rem;border-left: 1px solid var(--primary-color); }
.main-menu li:hover .sub{opacity: 1;  visibility: visible;z-index: 100;}
.main-menu .sub dl:hover{background-color: rgba(240,240,240,.95);}
}
@media(max-width:1024px){
   .main-menu{position: fixed;top: 0.94rem;bottom: 0;width: 100%;z-index: 100;left: 0;background-color: var(--white-color);padding: 0.1rem 0; left: -100%;opacity: 0; transition: 0.5s;}
   .menu-show .main-menu{left: 0;opacity: 1;}
   .main-menu ul{overflow: auto;height: 100%;}
   .main-menu li > span{display: block; font-size: var(--font-size__20); padding-right: 0.5rem;position: relative;border-bottom: solid 1px #dedede; overflow: hidden;}
   .op{position: absolute; right: 0rem; top: 0;height: 100%;display: flex;align-items: center;justify-content: center;width: 0.5rem; }
   .op:after{content: "\f105"; font-size: var(--font-size__30); font-family: 'swt'; transform: rotate(90deg);display: block;}
   .main-menu .sub .items-info{background-color: rgba(240,240,240,.95);}
   .main-menu .sub dl:not(.items-info) dd{margin-top: 0.1rem;}
   .main-menu .sub{display: none;border-bottom: solid 1px #dedede;}
   header .top{display: none;}
   header .search{position: absolute; top: 100%;height: 0.43rem;background-color: var(--white-color);width: 100%;left: 0; border-radius:0;border-left: 0;border-right: 0;padding: 0.05rem 0;}
   header .mid .right{display: flex;align-items: center;}
   .open-menu{width: 0.35rem;height: 0.35rem;display: flex;flex-direction: column; justify-content: space-between;align-items: center; margin-left: 15px; padding: 0.05rem 0;}
   .open-menu i{display: block;height: 3px;background-color: var(--black-color);width: 100%;}
}

body, html { height: 100%;width: 100%;}
body{transition: var(--transition); }
#page-container{position: relative; min-height: 100%;transition: var(--transition);overflow: hidden; }
.has-fixed-right-show #page-container{position: fixed;width: 100%; height: 100%}
.has-fixed-right-show body{transform: translate3d(-3.5rem,0,0);overflow: hidden;}
html.has-fixed-right-show  { top: 0; position: fixed}
#page-container:after { content: ""; top: 0; left: 0;  bottom: 0;position: fixed; background-color: rgba(92, 92, 92, .4);opacity: 0;z-index: 999999;  transition: opacity .7s;}
.has-fixed-right-show #page-container:after {opacity: 1;right: 0; transform: translate3d(0, 0, 0);}
#shopping-favorite-cart{position: fixed;right: 0;width: 3.5rem;background-color: var(--white-color);top: 0; z-index: 200; display: flex;flex-direction: column; justify-content: space-between; height: 100%; transform: translate3d(100%,0,0);transition: var(--transition);}
#shopping-favorite-cart .header-item{height: 0.7rem; border-bottom: 1px solid #dedede;flex-shrink: 0; padding-right: 0.2rem;}
#shopping-favorite-cart .header-item .title{display: flex;align-items: center; font-size: var(--font-size__20);}
#shopping-favorite-cart .header-item .close{width: 0.7rem;height: 0.7rem;display: flex;align-items: center; justify-content: center; font-size: var(--font-size__32);color: #373737;cursor: pointer;}
#shopping-favorite-cart .content{flex: 1; overflow-y: auto; margin-bottom: 0.1rem;}
#shopping-favorite-cart .header-item dd{position: relative;z-index: 1;}
#shopping-favorite-cart .header-item dd a{width: 0.3rem;height: 0.3rem;display: flex;align-items: center; justify-content: center; font-size: var(--font-size__30);cursor: pointer;}
#shopping-favorite-cart .header-item dd a.icons-img-cart{color: var(--default-color); }
#shopping-favorite-cart .header-item dd a.icons-img-collect{color: var(--primary-color);}
#shopping-favorite-cart .header-item dd .num{position: absolute;top: -0.05rem;right: -0.04rem; background-color: var(--black-color);color: var(--white-color); border-radius: 50%; width: calc(18 / 12 * 1em);height: calc(18 / 12 * 1em);text-align: center;line-height: calc(19 / 12); font-size: var(--font-size__12); }
#shopping-favorite-cart .header-item dd:after{position: absolute; left: 0;content: '';width: 100%;height: 3px; background-color: #373737;opacity: 0; top: 0.47rem;}
#shopping-favorite-cart .header-item dd.active:after{opacity: 1;}
#shopping-favorite-cart .header-item dd:not(:last-child){margin-right: 0.15rem;}
#shopping-favorite-cart .bottom{flex-shrink: 0; border-top: 1px solid #dedede;}
#shopping-favorite-cart .to-login,
#shopping-favorite-cart .emtry-tips{padding: 15px 20px; font-size: 0.13rem; opacity: .8;}
#shopping-favorite-cart .to-login a{color: var(--secondary-color);}
#shopping-favorite-cart .emtry-tips + .to-login{padding-top: 0;}
#shopping-favorite-cart .total{font-size: var(--font-size__22); padding: 0.2rem;}
#shopping-favorite-cart .total .price span{font-size: var(--font-size__11);}
#shopping-favorite-cart .btn a{margin: 0 20px 20px 20px; position: relative;
display: block; line-height: 1;background: var(--secondary-color); box-shadow: var(--box-shadow);border: solid 1px var(--secondary-color);border-radius: 0.05rem;padding: 0.16rem 0.32rem 0.14rem;color: var(--white-color); position: relative;padding-right: 0.32rem; font-size: var(--font-size__18);text-align: center;}
#shopping-favorite-cart .btn a i{position: absolute;font-size: var(--font-size__24); right: 0.14rem; top: 50%; transform: translateY(-50%);}

.shop-list .item{ border-bottom: 1px solid #dedede;}
.shop-list .add-cart{color: #373737; flex-shrink: 0;
 width: 0.55rem; box-shadow: var(--box-shadow);border: solid 1px var(--secondary-color);border-radius: 0.05rem;border-right-color: #dedede; font-size: var(--font-size__20);display: flex;align-items: center;justify-content: center; cursor: pointer;}
 .shop-list .add-cart:hover{background-color: #444;color: var(--white-color);}
.shop-list .img{width: 0.55rem;margin: 0.05rem; height: 0.55rem;display: flex;align-items: center;justify-content: center;cursor: pointer;}
.shop-list .del{width: 0.4rem;}
.shop-list .del a{display: flex; align-items: center;justify-content: center;height: 0.4rem;box-shadow: var(--box-shadow); border: solid 1px var(--secondary-color); font-size: var(--font-size__17);border-radius: 0.05rem; cursor: pointer;}
.shop-list .sku{font-size: var(--font-size__12);}
.shop-list .sku span:not(:last-child):after{content: ",";margin-right: 4px;}
.shop-list .con{flex: 1;}
.shop-list .txt{flex: 1; padding: 0.12rem 0 0.12rem 0.07rem;cursor: pointer;}
.shop-list .price span{font-size: var(--font-size__12);}


.home-ban{position: relative;z-index: 1;}
.home-ban .img{height: 3.6rem;}
.home-ban .txt h1{color: #fff;font-size: var(--font-size__48);margin: 0; line-height: 1.2;text-align: center; width: 70%; text-shadow: 0 8px 12px rgba(0, 0, 0, .7);}
.home-ban .banner-btn{margin-top: 1em;}
.home-ban .banner-btn a{display: block;width: 2.58rem; line-height: calc(52 / 16); border-radius: 0.05rem;background-color: var(--secondary-color); color: var(--white-color);font-weight:var(--font-weight__b);text-align: center;}
.home-ban .banner-btn a:hover{background-color: #0d1151;}

.home-items{padding: 0.04rem 0; background-color: #333;color: var(--white-color);}
.home-items li{padding: 0.13rem;display: flex;align-items: center; }
.home-items li span{font-size: var(--font-size__19);display: block;margin-left: calc(16 / 19 * 1em);}
.home-items li i{color: var(--primary-color);}

.home-column{margin: 0.35rem 0 0.2rem 0;}
.home-column li{--limr:0.2rem}
.home-column li a{display: flex;flex-direction: column;align-items: center; justify-content: center;}
.home-column li h3{margin: 1em 0 0 0;font-size: var(--font-size__22);text-align: center; font-weight: normal;}
.home-column li .pic{max-width: 3rem;width: 100%;}
.home-column li figure{padding-bottom: calc(171 / 300 * 100%); }
@media (min-width: 1025px) {
.home-column li:not(:nth-child(4n)){margin-right: var(--limr);}
.home-column li:nth-child(4) ~ li{margin-top: 0.1rem;}
}
@media (max-width: 1024px) {
   .home-column li{--lin:2}
   .home-column li:not(:nth-child(2n)){margin-right: var(--limr);}
   .home-column li:nth-child(2) ~ li{margin-top: 0.1rem;}
}

.home-title{margin-top: 0.38rem; margin-bottom: 0.1rem;display: flex;justify-content: center;}
.home-title span{font-size: var(--font-size__38);letter-spacing:0.32px;display: block;}
.home-title span.border{padding: 0 0.25rem;border-bottom: 2px solid var(--primary-color); line-height: 1.4; margin-bottom: 0.15rem;}

.blog-list .item{--limr:0.2rem;background-color: var(--white-color);display: flex;flex-direction: column;}
.home-latest .item{text-align: center;}

@media (min-width: 1025px) {
.home-latest .item{--lin:5;}
.home-latest .item:not(:nth-child(5n)){margin-right: var(--limr);}
.home-latest .item:nth-child(5) ~ .item{margin-top:var(--limr);}

.page-blog .blog-list .item{--lin:3;}
.page-blog .blog-list .item:not(:nth-child(3n)){margin-right: var(--limr);}
.page-blog .blog-list .item:nth-child(3) ~ .item{margin-top:var(--limr);}

.related-products .blog-list .item{--lin:4;}
.related-products .blog-list .item:not(:nth-child(4n)){margin-right: var(--limr);}
.related-products .blog-list .item:nth-child(4) ~ .item{margin-top:var(--limr);}
}
@media (max-width: 1024px) {
.blog-list .item{--lin:2;}
.blog-list .item:not(:nth-child(2n)){margin-right: var(--limr);}
.blog-list .item:nth-child(2) ~ .item{margin-top:var(--limr);}
}

.blog-list .item figure{padding-bottom: calc(198 / 264 * 100%);margin-bottom: 0.05rem;}
.blog-list .item .txt{padding: 0.1rem;line-height: 1.3;margin: 0 0.2rem;}
.home-latest .item .txt{margin: 0;}
.blog-list .date{opacity: 0.5; line-height: 1.2; font-size: var(--font-size__14); margin-bottom: 0.1rem;}
.blog-list .title{ font-size: var(--font-size__28);}
.blog-list .desc{margin-top: 0.15rem; }
.blog-list .label-groups{padding: 0.15rem 0.1rem 0.25rem; font-size: var(--font-size__12); display: flex;flex-wrap: wrap;justify-content: center;margin-top: auto;}
.blog-list .label-groups a{display: block; opacity: .5;}
.blog-list .label-groups a:not(:last-child){margin-right: 0.05rem;}
.blog-list .label-groups a:not(:last-child):after{content: ',';}

.left-right-layout{padding-bottom: var(--padding-margin__60);}
@media (min-width: 1025px) {
.left-right-layout .left{width: calc(1080 / var(--max-width) * 100%);}
.left-right-layout .right{width: calc(260 / var(--max-width) * 100%);}
}
@media (max-width: 1024px) {
   .left-right-layout .right{margin-top: var(--padding-margin__60);}
}

.home-category{margin-top: var(--padding-margin__90); margin-bottom: var(--padding-margin__50);}
.home-category li{position: relative;--limr:0.2rem;}
.home-category ol li:last-child{margin-right: 0;}
.home-category ol li a{margin-top: 0.05rem;display: block;}
.home-category li .pic{padding: 0.1rem;background-color: var(--white-color);}
.home-category li .pic figure{padding-bottom: 100%;}
.home-category li .details{display: flex;align-items: center; justify-content: center;    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(255, 255, 255, .1), rgba(255, 255, 255, .8), rgba(255, 255, 255, .8), rgba(255, 255, 255, .1), rgba(0, 0, 0, 0)); transition: background-color 0.3s ease; position: absolute; left: 0;top: 0;width: 100%;height: 100%;z-index: 10;}
.home-category li a:hover .details{background-color: rgba(222, 222, 222, .5);}
.home-category li h3{font-size: var(--font-size__19);}
@media (min-width: 1025px) {
.home-category ul li{--lin:4; }
.home-category ul li:not(:nth-child(4n)){margin-right: var(--limr);}
.home-category ul li:nth-child(4) ~ li{margin-top:var(--limr);}
.home-category ol li{--lin:5; }
.home-category ol li:not(:nth-child(5n)){margin-right: var(--limr);}
.home-category ol li:nth-child(5) ~ li{margin-top:var(--limr);}
}
@media (max-width: 1024px) {
   .home-category ul li{--lin:2; }
   .home-category ul li:not(:nth-child(2n)){margin-right: var(--limr);}
   .home-category ul li:nth-child(2) ~ li{margin-top:var(--limr);}   
   .home-category ol li{--lin:3; }
   .home-category ol li:not(:nth-child(3n)){margin-right: var(--limr);}
   .home-category ol li:nth-child(3) ~ li{margin-top:var(--limr);}
}

.full{position: absolute; left: 0;top: 0;width: 100%;height: 100%;z-index: 10;}
.all-btn{padding: 0.15rem 1em;color: var(--white-color); background: var(--secondary-color); border-radius: 0.05rem; box-shadow: var(--box-shadow); font-size: var(--font-size__18); line-height: 1;cursor: pointer;}
.all-btn.white{border: 1px solid var(--secondary-color);color: var(--black-color); background-color: var(--white-color);}
a.all-btn{color: var(--white-color);}
.all-btn:hover{background: #2e347f;}
.all-btn.white:hover{background: var(--white-color);}
.all-btn.loading:after{content: "";border-radius: 50%;border: 2px solid #fff; border-top: 2px solid transparent;  width: 0.16rem; height: 0.16rem;top: 0.06rem;right: -0.06rem;animation: spin 1s linear infinite;display: block;position: absolute;}
@keyframes spin {
   0% {
      -webkit-transform: rotate(0deg);
               transform: rotate(0deg);
   }
   100% {
      -webkit-transform: rotate(360deg);
               transform: rotate(360deg);
   }
   }

[class*=list-prod-] li{--limr:0.2rem;background-color: var(--white-color);position: relative;}
@media (min-width: 1025px) {
.list-prod-4 li{--lin:4;}
.list-prod-4 li:not(:nth-child(4n)){margin-right: var(--limr);}
.list-prod-4 li:nth-child(4) ~ li{margin-top:var(--limr);}
.list-prod-5 li{--lin:5;}
.list-prod-5 li:not(:nth-child(5n)){margin-right: var(--limr);}
.list-prod-5 li:nth-child(5) ~ li{margin-top:var(--limr);}
.list-prod-6 li{--lin:6;}
.list-prod-6 li:not(:nth-child(6n)){margin-right: var(--limr);}
.list-prod-6 li:nth-child(6) ~ li{margin-top:var(--limr);}
.list-prod-9 li{--lin:6;}
.list-prod-9 li:not(:nth-child(6n)){margin-right: var(--limr);}
.list-prod-9 li:nth-child(6) ~ li{margin-top:var(--limr);}
}
@media (max-width: 1024px) {
   [class*=list-prod-] li{--lin:2;}
   [class*=list-prod-] li:not(:nth-child(2n)){margin-right: var(--limr);}
   [class*=list-prod-] li:nth-child(2) ~ li{margin-top:var(--limr);}
}
[class*=list-prod-] li{border: 1px solid #dedede;box-shadow: 0 4px 13px -6px rgba(0, 0, 0, .1)}
[class*=list-prod-] li:hover{box-shadow: 0 4px 13px -2px rgba(0,0,0,.1)}
[class*=list-prod-] li .pic{padding: 0.1rem;position: relative;z-index: 1;}
[class*=list-prod-] li .pic figure{padding-bottom: 100%;}
[class*=list-prod-] li a{ margin-bottom: 0.52rem; flex: 1 0 auto; color: #373737;}
[class*=list-prod-] li .option{position: absolute; left: 0;bottom: 0;width: 100%;}
[class*=list-prod-] li .option > div{cursor: pointer;}
[class*=list-prod-] li .details{flex: 1 0 auto;  padding: 0.1rem;}
[class*=list-prod-] li .desc{flex: 1 0 auto;/*  margin-bottom: 0.15rem; */text-align: center;font-size: var(--font-size__19);}
[class*=list-prod-] li .desc :where(h3,p){margin: 0;}
[class*=list-prod-] li .short-desc{height: .34rem;font-size: var(--font-size__14);margin: 0.5em 0;}
[class*=list-prod-] li .desc h3{font-weight:var(--font-weight__r);letter-spacing: .32px; line-height: 1.1;}
[class*=list-prod-] li .desc p{line-height: 1.2; }
[class*=list-prod-] li .desc p.sku{margin: 0.5em 0;color: var(--black-color);}
[class*=list-prod-] li .product-price{display: flex;justify-content: center;font-size: var(--font-size__20);}
[class*=list-prod-] li .price span{font-size: var(--font-size__11);}
[class*=list-prod-] li .add-buy{margin-bottom: 0.1rem;position: relative;}
[class*=list-prod-] li .add-cart{margin-bottom: 0.1rem;margin-left: .1rem;position: relative;}
[class*=list-prod-] li .add-collect{position: absolute;right: 0;bottom: 0; width: 0.48rem;height: 0.48rem;display: flex;align-items: center;justify-content: center; font-size: var(--font-size__20);color: var(--primary-color);}
[class*=list-prod-] li .add-ok{display: flex;justify-content: center; align-items: center; font-size: var(--font-size__30); opacity: 0; transition:0.3s}
[class*=list-prod-] li .add-ok.active{opacity: 1;}
[class*=list-prod-] li .add-ok i{color: #fff; width: 0.5rem;height: 0.5rem; background: rgba(var(--black-color__rgb), 0.5);border-radius: 50%; box-shadow: 0 0 0 2px rgba(255,255,255,.3);display: flex;justify-content: center; align-items: center; }
[class*=list-prod-] li .rating{font-size: var(--font-size__12);margin-top: 0.em;}
#layout-1 li a{flex-direction: row;align-items: flex-start; position: relative;}
#layout-1 li .pic{flex-shrink: 0;width: 2rem;}
#layout-1 li .details{flex: 1; margin-left: 0.1rem;}
#layout-1 li .desc{text-align: left;}
#layout-1 li .product-price{justify-content: flex-start;}
#layout-1 li .option{justify-content: flex-start; padding-left: 0.88rem;}
#layout-1 li .pic{position: initial;}

.home-about{margin-top: var(--padding-margin__70);}
.edit-info h2{letter-spacing: .32px; line-height: 1.4;font-weight: normal; font-size: var(--font-size__26); margin: 1em 0 0 0;}
.edit-info p{margin: 0.6em 0 0 0;}
.edit-info h3{line-height: 1.4;font-weight: normal; font-size: var(--font-size__22);}
.edit-info a{color: var(--secondary-color);}
.edit-info .right-align {float: right;margin: 0 0 10px 10px;}
.edit-info .centered{display: block;margin: 0 auto;}
.custom-hr {border: none;height: 2px;background-color: #ccc;margin: 0.2rem 0;}
.faq-block ul {padding-left: 0;}
.faq-block li { list-style: none;padding-left: 13px;position: relative;}
.faq-block li:before { content: "•"; position: absolute; top: 0; left: 0px; line-height: 1.4em;}
.faq-block ol li {list-style: inherit;}
.faq-block ol li:before {content: none;}
.edit-info .socialmedia{float: left;padding: 7px;}
@media (min-width:1025px) {
   .edit-info .two{display: flex;justify-content: space-between;}
   .edit-info .two :where(.left,.right){width: calc((100% - 0.2rem) / 2);}
}

.edit-info .table {border: 1px solid #eee; table-layout: fixed;width: 100%;margin-bottom: 20px}
.edit-info .table th {
font-weight: 700;padding: 5px;background: #efefef;  border: 1px solid #ddd}
.edit-info .table td {padding: 5px 10px;
border: 1px solid #eee;text-align: left}
.edit-info .table tbody tr:nth-child(odd) { background: var(--white-color)}
.edit-info .table tbody tr:nth-child(even) {background: #F7F7F7}

.google-container {text-align: center;margin: var(--padding-margin__40) 0 var(--padding-margin__70);}
a.google-review-btn { background-color: var(--secondary-color);color: var(--white-color);padding: 0.1rem 0.2rem;border: none;border-radius: 5px; cursor: pointer;  text-decoration: none;  transition: background-color 0.3s; display: block;margin: 0 auto;  text-align: center}
.google-review-btn:hover {background-color: #2e347f}

.newsletter{background-color: #dedede;  padding: var(--padding-margin__50) 0.2rem; margin: 0.4rem auto;}
.newsletter h3{line-height: 1.4;text-align: center; margin-bottom: 0.2rem; letter-spacing: 0.32px; font-weight:var(--font-weight__r);}
.newsletter .container{max-width: 6rem;}
.newsletter .notice{color: #a7a7a7;line-height: 1.6;margin-top: 5px; font-size: var(--font-size__12);}
.newsletter .notice a{color: #333;}
.newsletter .text{height: 0.48rem;line-height: 0.48rem;border: 1px solid #a7a7a7; background: #ececec; font-size: var(--font-size__19);flex: 1; padding: 0 0.1rem;}
.newsletter .all-btn{background-color: #333; border: 0; padding-top: 0.1rem;padding-bottom: 0.1rem;}
.newsletter .all-btn:hover{background-color: #444;}

footer{background-color: #333;padding: var(--padding-margin__40) 0 var(--padding-margin__30) 0;}
footer h3{font-size: var(--font-size__24);color: #dedede;    font-weight:var(--font-weight__r);}
footer p{margin: 0.6em 0 0 0;}
footer,
footer a:not(:hover){color: var(--white-color);}
footer a:hover{color: #dedede;}
footer nav .column{border-left: 2px solid #dedede; padding-left: 0.18rem; flex: 1;}

.all-title{text-align: center; line-height: 1.4; font-size: var(--font-size__27);}

.category-main{padding-bottom: var(--padding-margin__110);}
.category-title{padding-top: 0.3rem; font-size: var(--font-size__38); line-height: 1.1;}
.category-current{margin-top: 0.08rem;display: flex;flex-wrap: wrap; font-size: var(--font-size__19);}
.category-current a{padding: 0.06rem 0;}
.category-current a:not(:hover){color: #373737;}
.category-current a:not(:last-child)::after{content: "/"; opacity: .6;margin-right: .4em;}
.category-desc{margin-bottom: 0.3rem;}

.prod-option{margin-bottom: 0.2rem;}
.prod-option select{font-size:var(--font-size__12); background: none;border: none;padding-right: 22px; height: calc(26 / 12 * 1em); line-height: calc(26 / 12);}
.prod-option li{margin-left: 0.06rem;width: 0.26rem;height: 0.26rem;display: flex;align-items: center; justify-content: center; opacity: 0.5; cursor: pointer;}
.prod-option li:hover,
.prod-option li.active{opacity: 1;}
.prod-option li i{font-size: var(--font-size__36);}
.prod-option li:hover{color: var(--primary-color);}
.rating{color: #ebbf3c;}

.category-title + .list-category{margin-top: 0.2rem;}
.list-category li{--limr:0.2rem; background-color: var(--white-color); padding: 0.1rem 0 0.15rem 0;margin-bottom:var(--limr);}
.list-category li .pic{padding: 0.1rem;max-width: 3rem; margin: 0 auto;}
.list-category li .pic figure{padding-bottom: 100%;}
.list-category li .details{text-align: center; line-height: 1.1; font-size: var(--font-size__19);font-weight:var(--font-weight__b);}
@media (min-width: 1025px) {
   .list-category li:not(:nth-child(5n)){margin-right: var(--limr);}
}
@media (max-width:1024px) {
   .list-category li{--lin:2;}
   .list-category li:not(:nth-child(2n)){margin-right: var(--limr);}
}

.prodct-details{background-color: var(--white-color); padding-bottom: 0.3rem;}
.related-products  [class*=list-prod-] li{border-radius: 3px;}
.reviews .all-title,
.related-products .all-title{text-align: left; margin: 0.2rem 0; font-size: var(--font-size__22);}
.reviews .has-rate .rating{color: var(--default-color);display: flex;align-items: center;}
.reviews .has-rate .rating i{color: #ebbf3c; font-size: var(--font-size__24); margin-left: 0.1rem;}
.reviews .has-rate p{opacity: .5;font-size: var(--font-size__12); line-height: 1.4;}
.select-star{display: flex;align-items: center; font-size: var(--font-size__18);}
.select-star dd{cursor: pointer;color: #e0e0e0;}
.select-star dd.selected,
.select-star dd:hover{color: #ebbf3c;}
.reviews .form b{margin-left: 0.24rem;}
.reviews .form{position: relative;padding: 10px 10px 20px 10px; margin-bottom: 10px;background-color: #fff; border: 1px dotted silver;max-width: 4.52rem;}
.reviews .form .star-tips{opacity: .5;font-size: var(--font-size__12); line-height: 1.4;min-height: 1.4em;}
.reviews .form-item{position: relative;z-index: 1;}
.reviews .form textarea{border:0;border-bottom: 1px solid var(--black-color);display: block;width: 100%; font-size: var(--font-size__19); margin: 0.1rem 0;}
.reviews .form textarea::placeholder{opacity: 0.5;}
.reviews .form .no-onrate{font-size: var(--font-size__12);position: absolute; left: 0;top: -0.1rem;transform: translateY(0.2rem); transition: 0.3s;opacity: 0;color: rgba(var(--default-color__rgb), 0.5); pointer-events: none;}
.reviews .form .no-onrate.active{opacity: 1;transform: translateY(0);}
.reviews .form .all-btn{text-align: center; }

.reviews-list{margin-top: 0.6em;}
.reviews-list li{--limr:0.2rem;border: 1px dotted silver;display: flex;justify-content: space-between; padding: 0.1rem 0.1rem 0.2rem;}
.reviews-list li .rate{flex-shrink: 0;width: 1.05rem;}
.reviews-list li .txt{flex: 1;}
.reviews-list li .rating{font-size: var(--font-size__18); margin-top: 0.2em;}
.reviews-list li .star-tips{font-size: var(--font-size__12); opacity: .5; margin-top: 0.5em;}
.reviews-list li .name{font-weight: bold; margin-bottom: 0.05rem;}
@media (min-width:1025px) {
.reviews-list li:not(:nth-child(3n)){margin-right: var(--limr);}
.reviews-list li:nth-child(3) ~ li{margin-top: var(--limr);}
}
@media (max-width:1024px) {
   .reviews-list li{--lin:2;}
   .reviews-list li:not(:nth-child(2n)){margin-right: var(--limr);}
   .reviews-list li:nth-child(2) ~ li{margin-top: var(--limr);}
}

.prodct-details .category-current{margin: 0;padding: 0.18rem 0 0.2rem 0;}
.prod-details .left-img :where(ol,li){border: 1px solid #dedede;}
.prod-details .left-img .pic{padding-bottom: 100%;position: relative;z-index: 1;}
.prod-details .left-img .pic a{z-index: 1;display: flex;align-items: center;justify-content: center;}
.prod-details .left-img ol{width: 100%;}
.prod-details .left-img ol .pic img{max-width: 5rem;}
.prod-details .left-img .getlayout{position: absolute; top: 100%;margin-top: 0.08rem;right: 0;}
.prod-details .left-img .getlayout dd{cursor: pointer;}
.prod-details .left-img .getlayout dd i{font-size: var(--font-size__32);}
.prod-details .left-img .getlayout dd:not(:last-child){margin-right: 0.06rem;}
.prod-details .left-img .getlayout dd:not(.active){opacity: 0.5;}
.prod-details .left-img .layout-4 ol{margin-bottom: 0.46rem;position: relative;}
.prod-details .left-img .layout-4 li{width: calc((100% - 0.1rem * 4) / 5); margin-bottom: 0.1rem;}
.prod-details .left-img .layout-4 li:not(:nth-of-type(5n)){margin-right: 0.1rem;}
.prod-details .left-img .layout-1{position: relative;margin-bottom: 0.46rem;}
.prod-details .left-img .layout-1 li{width: 100%; margin-top: 0.1rem;}
@media (min-width:1025px) {
   .prod-details .left-img{width: calc(710 / var(--max-width) * 100%);}
   .prod-details .right-detail{width: calc(658 / var(--max-width) * 100%);}
}
@media (max-width:1024px) {
   .prod-details .right-detail{margin-top: var(--padding-margin__50);} 
}

.prod-details .name{font-size: var(--font-size__38);line-height: 1.1;}
.prod-details .desc{margin: 0.3rem 0;}
.prod-details .price{font-size: var(--font-size__38); margin-bottom: 0.3rem;}
.prod-details .price span{font-size: var(--font-size__14);}
.prod-details .detail-form{max-width: 2.84rem;}
.prod-details .buy-number p{margin: 0;font-size: var(--font-size__11);opacity: 0.5;}
.prod-details .buy-number .number .text{flex: 1;border: 0;border-bottom: 1px solid #000;}
.prod-details .buy-number .number span{font-size: var(--font-size__12);opacity: 0.5;}
.prod-details .buy-btn{margin-top: 0.2rem;position: relative;display: flex;flex-wrap: wrap;}
.prod-details .buy-btn .all-btn{text-align: center; line-height: 1;}
.prod-details .buy-btn .all-btn.loading:after{right: 0.1rem; top: 0.15rem;}
.prod-details .buy-btn .add-cart{margin-left: .15rem;}
.prod-details .buy-btn .add-collect{position: absolute; left: 100%;top: 0;display: flex;align-items: center; margin-left: 0.15rem; font-size: var(--font-size__30);color: var(--primary-color); height: 100%;cursor: pointer;}
.after-add-buy p{margin: 0.6em 0;}
.after-add-buy p a{color: var(--secondary-color);}
.after-add-buy .all-btn i{font-size: var(--font-size__30); margin-left: 0.2rem;}
.after-add-buy .all-btn span{margin-right: 0.1rem;}
.prod-details .info{margin-top: 0.3rem;}
.prod-details .info dl{display: flex;justify-content: space-between; font-size: var(--font-size__14);}
.prod-details .info dl.important{font-size: var(--font-size__22);}
.prod-details .info dt{flex-shrink: 0;}
.prod-details .info dd{flex: 1;text-align: right;margin-left: 0.2rem;}
.prod-details .to-search{margin-top: 0.6em;color: var(--secondary-color);}
.prod-details .has-rate{margin-top: 0.3rem;}
.prod-details .has-rate a{color: var(--secondary-color);}
.prod-details .has-rate a:hover{text-decoration: underline;}
.prod-details .has-rate p{margin: 0;}
.prod-details .has-rate .rating i{font-size: var(--font-size__26);}
.prodcut-editor{padding-top: 0.2rem;}

@media (min-width:1025px) {
   .checkout-form .box{width: calc((100% -  0.3rem) / 2);}
}
@media (max-width:1024px) {
   .checkout-form .box:not(:last-child){margin-bottom: 0.2rem;}
}
.checkout-title{padding: 0.3rem 0;}
.checkout-title h3{font-weight: var(--font-weight__r); font-size: var(--font-size__38);margin: 0;}
.checkout-title p{margin: 0.6em 0 0 0;}
.checkout-title  a{color: var(--secondary-color);}
.checkout-form{padding-bottom: 0.6rem;}
.checkout-form .box{background-color: var(--white-color);font-weight: var(--font-weight__r);  padding: 0.2rem;}
.checkout-form .box h4{margin:0 0 0.05rem 0;font-size: var(--font-size__24); font-weight: var(--font-weight__r);}
.checkout-form .left ul{display: flex;justify-content: space-between;}
.checkout-form .left li{font-size: var(--font-size__18);}
.checkout-form .left .head li{opacity: 0.5;font-size: var(--font-size__16);}
.checkout-form .left li:not(:first-child){flex-shrink: 0;}
.checkout-form .left li:nth-child(1){flex: 1 0 auto;}
.checkout-form .left li:nth-child(2){width:0.9rem;margin: 0 1em;}
.checkout-form .left li:nth-child(3){width: 0.8rem;}
.checkout-form .left li:nth-child(4){width: 1.2rem;text-align: right;}
.checkout-form .left li .text{width: 100%;}
.checkout-form .left li span{font-size: var(--font-size__11);}
.checkout-form .left .list-items .items{padding-bottom: 0.1rem; margin-bottom: 0.1rem;border-bottom: 1px dotted silver;}
.checkout-form .left .list-items .img{width: 1rem;}
.checkout-form .left .list-items .img img{height: 1rem;}
.checkout-form .left .list-items .txt,
.checkout-form .left .list-items .info a{flex: 1;}
.checkout-form .left .list-items .btn{flex-shrink: 0;width: 0.4rem;}
.checkout-form .left .list-items .txt{padding-left: 1em;}
.checkout-form .left .list-items .btn .all-btn{color: var(--default-color); background-color: var(--white-color); border: 1px solid var(--secondary-color);padding-top: 0.1rem;padding-bottom: 0.1rem;}
.checkout-form .left .list-items .name{font-size: var(--font-size__17);}
.checkout-form .left .list-items .num{font-size: var(--font-size__11);opacity: 0.5;}
.checkout-form .left .list-items .num::before{content: attr(data-title);}
.total-items{border-bottom: 1px dotted silver; margin: 1em 0 0.1rem 0; padding-bottom: 0.1rem;}
.total-items dl{display: flex;justify-content: space-between; opacity: 0.5; font-size: var(--font-size__14);}
.total-items dl.total{font-size: var(--font-size__17); opacity: 1;font-weight: var(--font-weight__b);}
.total-items .unit{font-size: var(--font-size__11);}
.checkout-form .no-login{text-align: right; opacity: 0.8;}
.checkout-form .no-login a:not(:hover){color: var(--secondary-color);}
.checkout-form .no-login a{cursor: pointer;}
.checkout-form .use-discode a{color: var(--secondary-color);cursor: pointer;}
.checkout-form .use-discode .form{padding-top: 0.1rem;}
.checkout-form .use-discode .form .text{width: 100%; border: 0;border-bottom: 1px solid var(--default-color);line-height: calc(47 / 19); font-size: var(--font-size__19); background: none;}
.checkout-form .use-discode .all-btn{margin-top: 0.1rem;text-align: center;}

.customer-type-selection{margin-top: 0.1rem;}
.customer-type-selection label{margin-right: 0.2rem;}

.popup-box{position: fixed;top: 0;width: 100%;height: 100%;z-index: 990;display: flex;align-items: center; justify-content: center; left: -100%;visibility: hidden;opacity: 0;}
.popup-box.active{ left: 0; visibility: visible; opacity: 1;}
.popup-box .full{background: rgba(var(--black-color__rgb), 0.7);}
.popup-box .box{background: var(--white-color);position: relative;z-index: 30; padding: 0.3rem;}
.popup-box .close{position: absolute;right: 4px;top: 4px;box-shadow: var(--box-shadow);border-radius: 50%;display: flex;align-items: center; justify-content: center; font-size: var(--font-size__26);color: var(--black-color); width: 0.4rem; height: 0.4rem; cursor: pointer;}
.popup-box .box h3{font-size: var(--font-size__22); line-height: 1.4;margin: 0;}

.change-setting .form-select{min-width: 2.14rem; margin-bottom: 0.3rem;}
.change-setting .form-select dd{margin-top: 0.1rem;}
.change-setting .form-select dd select{height: 0.43rem;width: 100%;display: block;border: 0; border-bottom: 1px solid var(--black-color); font-size: var(--font-size__19);}
.change-setting .btn-groups .all-btn{display: flex;justify-content: center;align-items: center;}
.change-setting .btn-groups .all-btn i{font-size: var(--font-size__14);color: var(--primary-color); margin-right: 1em;}

.customer-form-section{position: relative;z-index: 1;}
.customer-form-section{display: flex;justify-content: space-between;flex-wrap: wrap;}
.customer-form-section .form-action{position: absolute;right: 0;top: 0;width: calc((100% - 0.2rem) / 2);text-align: center;z-index: 10;}
.customer-form-section .form-group.short{width: calc((100% - 0.2rem) / 2);}
.customer-form-section .form-group{margin-bottom: 0.1rem; position: relative;z-index: 1;padding-top: 0.1rem;width: 100%;}
.form-group > label{position: absolute; left: 0;top: 0;font-size: var(--font-size__11); opacity: 0.5;}
.customer-form-section .form-group .text{display: block;width: 100%;font-size: var(--font-size__19); line-height: calc(43 / 19);height: calc(43 / 19 * 1em); border-width: 0 0 1px 0; background: none;}
.customer-form-section .select{display: block;color: #757575;width: 100%;font-size: var(--font-size__19); line-height: calc(43 / 19);height: calc(43 / 19 * 1em); border-width: 0 0 1px 0; background-color: transparent;border-bottom: 1px solid #5555;}
.checkbox-group{display: flex;align-items: center;}
.checkbox-group > label{position: relative;font-size: var(--font-size__16); opacity: 1;}
.checkbox-group > label input{margin-right: 0.1rem;}
.customer-form-section .login-links{display: flex;align-items: flex-end;height: 100%;}
.customer-form-section .login-links a{cursor: pointer;}
.customer-form-section .login-links a:not(:hover){color: var(--secondary-color);}

.pay-method{margin-bottom: 0.2rem;}
.pay-method h2{margin: 0;font-size: var(--font-size__24);font-weight: var(--font-weight__r);}
.payment-option{padding: 0.1rem 0.7rem 0.1rem 0; border-bottom: 1px dotted silver;}
.payment-option .txt{flex: 1; margin-right: 0.2rem;}
.payment-option .tips{opacity: 0.5;}
.payment-option .payment-icon{height: .67rem;object-fit: contain;}
.payment-icon{width: 0.67rem;}
.error-message{background-color: var(--primary-color);color: var(--white-color);font-size: var(--font-size__11);padding: 0 0.05rem;width: 100%;}
.other-checkbox{margin-bottom: 0.1rem;}
.other-checkbox label{margin-top: 0.1rem;}

.message .icon{width: 0.64rem; height: 0.64rem; border-radius: 50%;display: flex;align-items: center;justify-content: center;color: var(--black-color);font-size: var(--font-size__64); flex-shrink: 0;}
.message .txt{margin-left: 0.26rem;flex: 1;}
.message .btn-groups{margin-top: 0.2rem;}
.message .btn-groups a{display: block;color: var(--white-color);width: 46%;  padding: .6em 1em .6em; line-height: 1; border-radius: 0.05rem;text-align: center;cursor: pointer;}
.message .btn-groups a.cancel{background-color: #d14b2c;}
.message .btn-groups a.ok{background-color: #67ab00;}

.column-name{ padding-top: var(--padding-margin__30); }
.column-name .name{font-size: var(--font-size__38);line-height: 1;margin-bottom: var(--padding-margin__50);}
.column-name .name + .edit-info{margin-top: calc(var(--padding-margin__50) * -1 + 0.6em);}
.column-name .edit-info{margin-bottom: var(--padding-margin__30);}
.about-content{padding-bottom: var(--padding-margin__70);}

.right .blog-list .item{margin-bottom: 0.2rem;}
.blog-list + .side-nav{margin-top: var(--padding-margin__40);}
.side-nav h4{margin: 0 0 0.08rem 0;font-weight: var(--font-weight__r); font-size: var(--font-size__20);}
.side-nav li{margin-bottom: 0.14rem; line-height: 1.2;}
@media (max-width: 1024px) {
.side-nav ul{display: flex;flex-wrap: wrap;}   
.side-nav li{width: calc(100% / 3);}
.right .blog-list{display: none;}
}

.Pages{margin: 0.2rem 0;}
.Pages,
.Pages .arrow,
.Pages .p_page{display: flex;align-items: center;}
.Pages .arrow a{font-size: var(--font-size__18); width: 0.26rem; height: 0.26rem;display: flex;align-items: center;justify-content: center;color: var(--white-color); background-color: var(--default-color);}
.Pages .arrow a:not(:last-child){margin-right: 2px;}
.Pages .arrow a[href^="javascript:"]{opacity: 0.5;cursor: default;}
.Pages .p_page{margin-left: 4px;}
.Pages .p_page a{color: var(--default-color);cursor: default;}
.Pages .p_page a:not(.a_cur){display: none;}
.Pages em{font-style: normal;margin: 0 0.5em;}

.pdf-list li{--limr:0.2rem;margin-bottom: var(--padding-margin__100);}
.pdf-list li:not(:nth-child(3n)){margin-right: var(--limr);}
.pdf-list li iframe{height: 5rem;max-width: 3.5rem; margin-top: 0.6em;display: block;}
.pdf-list li a.all-btn{display: inline-block; font-size: var(--font-size__14);}
.pdf-list li .title{font-size: var(--font-size__22);}
.pdf-list li > p{margin: 0.6em 0;}

.top-space{height: var(--padding-margin__30);}
.bottom-space{height: var(--padding-margin__70);}

.customer-reviews-list{padding-bottom: var(--padding-margin__60);}
.customer-reviews-list li{margin: 0.2rem 0;}
.customer-reviews-list li .pic{display: flex;justify-content: center;}
.customer-reviews-list li .pic img{max-width: 3rem;width: 100%;}
.customer-reviews-list li .con{font-size: var(--font-size__22);}
.customer-reviews-list li .name{margin-top: 0.6em;}
@media (min-width:481px) {
   .customer-reviews-list li :where(.pic,.txt){width: calc(690 / var(--max-width) * 100%);}
}
@media(max-width:480px){
   .customer-reviews-list li{display: block;}
   .customer-reviews-list li .txt{margin-top: 0.2rem;}
}

.prod_quality{margin-top: var(--padding-margin__70); padding-bottom: var(--padding-margin__60);}
.prod_quality .item{margin-bottom: var(--padding-margin__30);}
.prod_quality .item :where(.pic,.txt){flex-shrink: 0;}
.prod_quality .item .txt{margin-left: 0.2rem;}
.prod_quality .item .pic img{display: block;width: 100%;}
.prod_quality .item h3{ font-size: var(--font-size__22); font-weight: var(--font-weight__r);margin: 0;}
.prod_quality .item h3 a:not(:hover){color: var(--secondary-color);}
.prod_quality .item p{margin-top: 0.6em;}
@media (min-width:1025px) {
.prod_quality .item :where(.pic,.txt){width: calc(100% / 3);}
.prod_quality .item h3{margin:1em 0 0 0;}
}
@media (max-width:1024px) {
.prod_quality .item :where(.pic,.txt){width: calc(100% / 2);}
}

@media (min-width:1025px) {
.edit-columns .item{width: calc((100% - 0.2rem * 2) / 3);}
.edit-columns .item:not(:nth-child(3n)){margin-right: 0.2rem;}
}

.bolg-details{box-shadow: 0 0 4px #d0d0d0;background-color: var(--white-color); padding: 0 0.3rem 0.3rem;}
.bolg-details .pic{display: flex;justify-content: center;}
.bolg-details .publish{opacity: 0.5; margin-top: 1em;}

.slideshow-media{margin: 3em 0;}
.slideshow-media .figure{position: relative;display: flex;justify-content: center;}
.slideshow-media .figure img{display: block;max-width: 8rem;width: 100%;}
.slideshow-media .caption{text-align: center;color: var(--white-color);font-size: var(--font-size__34); line-height: 1.2; position: absolute; left: 0;bottom: 0;width: 100%;z-index: 10;}
.slideshow-media .caption p{margin: 0;}
.slideshow-media .arrow > div{position: absolute; top: 50%; width: 0.44rem;height: 0.44rem; background: var(--white-color); border-radius: 50%; z-index: 10;font-size: var(--font-size__40);color: var(--black-color); padding: 0;display: flex;align-items: center; justify-content: center;}
.slideshow-media .arrow .prev{left: 0.1rem;}
.slideshow-media .arrow .next{right: 0.1rem;}
.slideshow-media .swiper-pagination{position: relative;display: flex;justify-content: center;align-items: center;top: auto;bottom: auto;--swiper-pagination-bullet-width:10px;margin-top: 0.3rem;--swiper-pagination-bullet-height:10px;--swiper-pagination-color:var(--default-color)}
.slideshow-media .swiper-pagination span{margin: 0 8px;}
@media (max-width:1024px) {
   .slideshow-media .caption{font-size: var(--font-size__24);}
}

.search-result .column-name .name{margin-bottom: 0;}
.search-result .serach-key{margin-top: 0.6em;}
.search-result .prod-option{margin-top: -0.46rem;}
.Login .table-nav ul{display: flex;align-items: center;}
.Login .table-nav ul li{margin-right: .2rem;width: 1.2rem;height: .45rem;display: flex;align-items: center;justify-content: center;cursor: pointer;color: var(--secondary-color);border-radius: .1rem;border: 1px solid var(--secondary-color);box-sizing: border-box;}
.Login .table-nav ul li:last-child{margin-right: 0;}
.Login .table-nav ul li.on{background-color: var(--secondary-color);color: var(--white-color);}
.Login .table-box{margin-top: .3rem;background-color: #fff;padding: .4rem .3rem}
.Login .table-box .item{display: none;}
.Login .table-box .item.on{display: block;}
.Login .table-box .item .left-box{width: 48%;}
.Login .table-box .item .left-box ul li{margin-bottom: .2rem;}
.Login .table-box .item .left-box ul li:last-child{margin-bottom: 0;}
.Login .table-box .item .left-box ul li .text{width: 100%;height: .45rem;padding: 0 .2rem;border: 1px solid #ddd;box-sizing: border-box;}
.Login .table-box .item .left-box .code{display: flex;}
.Login .table-box .item .left-box .code .text{width: calc(100% - 1.6rem)}
.Login .table-box .item .left-box .code .all-btn{width: 1.4rem;margin-left: .2rem;}
.Login .table-box .item .left-box .tip{margin-top: .3rem;}
.Login .table-box .item .right-box{width: 48%}
.Login .table-box .item .right-box .more{margin-top: .3rem;}
.Login .all-btn{text-align: center;}
@media (max-width:768px){
.Login .table-box .item .left-box{width: 100%;}
.Login .table-box .item .right-box{width: 100%;margin-top: .2rem;}
}
.Personal .menu-nav{display: flex;justify-content: space-between;align-items: center}
.Personal .menu-nav .out{color: var(--secondary-color);cursor: pointer;}
.Personal .menu-nav ul{display: flex;}
.Personal .menu-nav ul li:not(:last-child){margin-right: .1rem;}
.Personal .menu-nav ul li a{display: flex;align-items: center;justify-content: center;width: 1.2rem;height: .5rem;background-color: #fff;border-radius: .06rem .06rem 0 0;color: var(--secondary-color);}
@media (max-width:480px) {
   .Personal .menu-nav ul li a{width: auto;padding: 0 0.1rem;}
   .Personal .menu-nav ul li:not(:last-child){margin-right: .05rem;}
}
.Personal .menu-nav ul li.on a{background-color: var(--secondary-color);color: #fff;}
.Personal .box{background-color: #fff;padding: .4rem .3rem;}
.Orders .list table{width: 100%;border: 1px solid #ddd;}
.Orders .list table tr{border-bottom: 1px solid #ddd;}
.Orders .list table tr:last-child{border-bottom: 0;}
.Orders .list table tr td{border-right: 1px solid #ddd;text-align: center;height: .6rem;width: 10%}
.Orders .list table tr td:last-child{border-right: 0;}
.Orders .list table tr th{border-right: 1px solid #ddd;height: .6rem;}
.Orders .list table tr th:last-child{border-bottom: 0;}
.Orders .list table tr td .all-btn{margin: 0 .05rem;color: #fff;display: inline-block;padding: .1rem;}
.Orders .list table tr td .all-btn.off{background-color: #ddd;color: #333;}
.Orders .list table tr td:nth-of-type(1){width: 35%;text-align: left;}
.Orders .list table tr td:nth-of-type(6){width: 25%;}
.Orders .list table tr td .number{padding: 0 .2rem;font-size: .18rem;font-weight: bold;}
.Orders .list table tr td .info{display: flex;padding: 0 .2rem;margin-top: .15rem;}
.Orders .list table tr td .info .img{width: 35%;}
.Orders .list table tr td .info .img .pic{width: 100%;padding-bottom: 100%;background-position: center;background-repeat: no-repeat;background-size: contain;}
.Orders .list table tr td .info .box{margin-left: 5%;width: 60%;padding: 0;}
.Message .text{margin-top: .3rem;}
.Account ul li{margin-bottom: .2rem;}
.Account ul li:last-child{margin-bottom: 0;}
.Account ul li .text{width: 100%;height: .45rem;padding: 0 .2rem;border: 1px solid #ddd;box-sizing: border-box;}
.Account ul li .name{margin-bottom: .1rem;font-size: .18rem;}
.Account ul li .more{margin-top: .1rem;}
.Account ul li .more a{color: var(--secondary-color);}

.Returns .list table{width: 100%;border: 1px solid #ddd;}
.Returns .list table tr{border-bottom: 1px solid #ddd;}
.Returns .list table tr:last-child{border-bottom: 0;}
.Returns .list table tr td{border-right: 1px solid #ddd;text-align: center;height: .6rem;}
.Returns .list table tr td:last-child{border-right: 0;}
.Returns .list table tr th{border-right: 1px solid #ddd;height: .6rem;}
.Returns .list table tr th:last-child{border-bottom: 0;}
.Returns .list table tr td:first-child{width: 30%;}
.Returns .list table tr:nth-child(2) ~ tr td:first-child{vertical-align: top;}
.Returns .form{padding: 0.2rem;text-align: left;}
.Returns .form ul li{display: flex; }
.Returns .form ul li .name{width: 1rem; line-height: calc(45 / 16);}
.Returns .form ul li .module{width: calc(100% - 1rem)}
.Returns .form ul li .text{width: 100%;height: .45rem;padding: 0 .2rem;border: 1px solid #ddd;box-sizing: border-box;}
.Returns .form ul li select{width: 100%;height: .45rem;padding: 0 .2rem;border: 1px solid #ddd;box-sizing: border-box;}
.Returns .form ul li textarea{width: 100%;height: 1.6rem;padding: .2rem;border: 1px solid #ddd;box-sizing: border-box;}
.Returns .form ul li .all-btn{width: 1.6rem;text-align: center;}
.Returns .form ul li .up{position: relative;width: 1.2rem;}
.Returns .form ul li .up .tip{display: flex;align-items: center;justify-content: center;width: 100%;height: .45rem;padding: 0 .2rem;border: 1px solid #ddd;box-sizing: border-box;}
.Returns .form ul li .up .file{position: absolute;left: 0;top: 0;width: 100%;height: 100%;opacity: 0;z-index: 33;cursor: pointer;}

.Returns .form ul .el-upload-list--picture .el-upload-list__item {flex-direction: column; height: auto; padding-left:10px;justify-content: space-between;}
.Returns .form ul .el-upload-list--picture .el-upload-list__item-thumbnail {width:100%; height: auto; margin-left: 0;}
.Returns .form ul .el-upload-list--picture .el-upload-list__item-status-label {z-index: 5;}
.Returns .form ul .el-upload-list__item-name {margin-right: 0; padding-left: 0; text-align: center; line-height: 2em!important; margin-top: 1em;}
.Returns .form ul .el-upload-list__item .el-icon-close {z-index: 5;}
@media (min-width:751px) {
.Returns .form ul{display: flex;flex-wrap: wrap;justify-content: space-between;}
.Returns .form ul li{width: 48%;}
.Returns .form ul li:nth-child(2) ~ li{margin-top: .2rem;}
}
@media (max-width:750px) {
   .Returns .form ul li:nth-child(1) ~ li{margin-top: .2rem;}
}
.Returns .info{display: flex;align-items: center; justify-content: center; padding: 0.1rem;}
.Returns .img a{display: block;}
.Returns .img{width: 30%;box-shadow: 0 0 .05rem rgba(0,0,0,.1);flex-shrink: 0;}
.Returns .img .pic{ padding-bottom: 100%; background-color: #fff;background-size: contain;}
.Returns .box{padding: 0.1rem 0 0 0; background-color: transparent;flex: 1;text-align: left; margin-left: 0.2rem;}
.Returns .box .title{color: var(--secondary-color);}
.Returns .box .desc{margin: 0;}
.Returns .all-btn{display: table; margin:  0.2rem auto 0; width: 2rem;text-align: center;}

.Return-list .list table{width: 100%;border: 1px solid #ddd;}
.Return-list .list table tr{border-bottom: 1px solid #ddd;}
.Return-list .list table tr:last-child{border-bottom: 0;}
.Return-list .list table tr td{border-right: 1px solid #ddd;text-align: center;height: .6rem;}
.Return-list .list table tr td:last-child{border-right: 0;}
.Return-list .list table tr th{border-right: 1px solid #ddd;height: .6rem;}
.Return-list .list table tr th:last-child{border-bottom: 0;}
.Return-list .list table tr td:nth-of-type(1){width: 35%;text-align: left;}
.Return-list .list table tr td .number{padding: 0 .2rem;font-size: .18rem;font-weight: bold;}
.Return-list .list table tr td .info{display: flex;padding: 0 .2rem;margin-top: .15rem;}
.Return-list .list table tr td .info .img{width: 35%;}
.Return-list .list table tr td .info .img .pic{width: 100%;padding-bottom: 100%;background-position: center;background-repeat: no-repeat;background-size: contain;}
.Return-list .list table tr td .info .box{margin-left: 5%;width: 60%;padding: 0;}
.Address .top-box{display: flex;justify-content: space-between;}
.Address .top-box .manage{display: flex;align-items: center;padding: .1rem .2rem;color: #fff;background-color: var(--secondary-color);border-radius: .1rem;cursor: pointer;}
.Address .top-box .manage:before{display: block;content: '';width: .3rem;height: .3rem;margin-right: .1rem;background-image: url('../images/manage.svg');background-size: 100%;}
.Address .top-box .new{display: flex;align-items: center;padding: .1rem .2rem;color: #fff;background-color: var(--secondary-color);border-radius: .3rem;cursor: pointer;}
.Address .top-box .new:before{display: block;content: '';width: .3rem;height: .3rem;margin-right: .1rem;background-image: url('../images/new.svg');background-size: 90%;background-position: center;background-repeat: no-repeat}
.Address .list{margin-top: .3rem;}
.Address .list ul li{position: relative;margin-bottom: .15rem;padding-bottom: .15rem;border-bottom: 1px dashed #ddd;}
.Address .list ul li .bottom-btn{display: none;margin-top: .2rem;justify-content: space-between;align-items: center;}
.Address .list ul li .bottom-btn .radio{position: relative;}
.Address .list ul li .bottom-btn .radio input{position: absolute;left: 0;top: 0;width: 100%;height: 100%;display: block;opacity: 0;z-index: 33;cursor: pointer;}
.Address .list ul li .bottom-btn .radio input + label{display: flex;align-items: center;}
.Address .list ul li .bottom-btn .radio input + label i{position: relative;margin-right: .05rem;display: block;width: .15rem;height: .15rem;border: 1px solid var(--secondary-color);box-sizing: border-box;border-radius: .15rem;}
.Address .list ul li .bottom-btn .radio input + label i:before{display: none;content: '';position: absolute;left: 0;top: 0;right: 0;bottom: 0;margin: auto;width: .09rem;height: .09rem;border-radius: .12rem;background-color: var(--secondary-color);z-index: 3;}
.Address .list ul li .bottom-btn .radio input:checked + label i:before{display: block;}
.Address .list ul li .bottom-btn .btn input{background-color: var(--secondary-color);color: #fff;border: 0;cursor: pointer;}
.Address .list ul li .bottom-btn .btn input:nth-of-type(1){margin-right: .1rem;}
.Address .list ul li.Top:after{display: block;content: '';position: absolute;right: 0;top: 0;width: .36rem;height: .36rem;background-image: url('../images/Top.svg');background-size: 100%;z-index: 3;}
.Address .list.mg ul li .bottom-btn{display: flex;}
.Popups{display: none;position: fixed;left: 50%;top: 50%;max-width: 5.6rem;width: 100%;transform: translate(-50%, -50%);z-index: 33;}
.Popups .Popups-box{padding: .3rem .2rem;background-color: #fff;box-sizing: border-box;box-shadow: 0 0 .15rem rgba(0, 0, 0, .26);}
.Popups .Popups-box ul li{margin-bottom: .15rem;}
.Popups .Popups-box ul li:last-child{margin-bottom: 0;}
.Popups .Popups-box ul li .name{font-size: .18rem;margin-bottom: .1rem;}
.Popups .Popups-box ul li .text{height: .45rem;width: 100%;padding: 0 .15rem;border: 1px solid #ddd;box-sizing: border-box;}
.Popups .Popups-box ul li .submit{width: 1.4rem;height: .45rem;color: #fff;background-color: var(--secondary-color);border-radius: .45rem;cursor: pointer;border: 0;margin: 0 auto;}
.Popups .close{position: absolute;right: .1rem;top: .1rem;width: .35rem;height: .35rem;background-image: url('../images/close.svg');background-size: 100%;cursor: pointer;z-index: 3;}







@media (max-width:768px){
   .Orders .list{overflow-y: hidden;}
   .Orders .list table{width: 7.6rem}
   .Returns .list{overflow-y: hidden;}
   .Returns .list table{width: 7.6rem}
   .Return-list .list{overflow-y: hidden;}
   .Return-list .list table{width: 7.6rem}
}


.list-evaluate ul{display: flex;flex-wrap: wrap;justify-content: space-between;margin-bottom: 0.2rem; }
/* .list-evaluate ul li{width: 48%;} */
.list-evaluate ul li b{margin-right: 0.1rem;}
.list-evaluate .table-list{background-color: #f9f9f9;border: 1px solid #ddd;table-layout: fixed;}
.list-evaluate .table-list  th{border-bottom: 1px solid #ddd;height: .5rem;}
.list-evaluate .table-list  td{border-bottom: 1px solid #ddd;padding: 0.1rem;text-align: center;}
.list-evaluate .table-list  td:not(:last-child),
.list-evaluate .table-list  th:not(:last-child){border-right: 1px solid #ddd;}
.list-evaluate .table-list .img a{display: block;margin: 0 auto; max-width: 1rem; width: 90%;}
.list-evaluate .table-list .img .pic{padding-bottom: 100%; background-size: contain; background-color: #fff;}
.list-evaluate .table-list .all-btn{display:inline-block;  line-height: 2; padding: 0 0.2rem;}
.list-evaluate .table-list  td:last-child{ width: 2rem;}
.list-evaluate .table-list  td:nth-child(2){text-align: left; padding-left: 0.2rem; padding-right: 0.2rem;}
@media (max-width:480px) {
   .list-evaluate .table-list .all-btn{padding: 0 0.1rem;}
}

.radio-group{display: flex;align-items: center; min-height: calc(45 / 16 * 1em);}
.radio-group label + label{margin-left: 0.3rem;}


body .el-table__body-wrapper {max-height: 5rem; overflow-y: auto; -webkit-overflow-scrolling: touch;}
body .el-table .cell {padding-right: 20px;}


/* 2025-11-06 */
.filter-title{padding: 10px 50px 10px 15px;margin: 0;position: relative;display:block;cursor:pointer;text-transform: none;background-color: #fff;font-weight:400;font-size: 90%;font-size:0.13rem;text-overflow:ellipsis;overflow:hidden;white-space: nowrap;}
.filter-title:hover{text-decoration: none;}
.filter-title:after{content:"\e900";position:absolute;font-size:20px;top:50%;right:10px;margin-top:-10px; line-height:1; font-family:"swt";}
@media only screen and (max-width:800px) {
.filter-title{padding:15px 0;}
}

/*  */
.PlasticPackaging{ padding:.3rem 0 .6rem;}
.PlasticPackaging .page-headline{ line-height:1.1; margin:0; font-weight:500;}


/*  */
.filter-group-count{display:none;}

.product-filter{ margin-top:.35rem;}
.product-filter .ul{ list-style:none; padding:0; margin:0;}
.product-filter .ul li{list-style:none;}
.product-filter .filter-menu{ display:none; margin-bottom:.2rem; justify-content:space-between;}
.product-filter .filter-menu .filter-menu-item{background-color:var(--secondary-color);box-shadow: 0 4px 8px 0 rgba(0,0,0,.14),0 4px 15px 0 rgba(0,0,0,.09);border-style: solid;border-width: 1px;border-color:var(--secondary-color);border-radius: 5px;color: #fff; width:48%; padding:.15rem 0; font-size:.22rem;}
.product-filter .filter-menu .filter-menu-item::before{font-family:'swt'; margin-right:.1rem;}
.product-filter .filter-menu .toggle-active-filters:before{content:"\e904";}
.product-filter .filter-menu .toggle-sort-order:before{content:"\e600";}

.product-filter .sort-order-content{ display:none; background:var(--white-color); padding:.2rem;}
.product-filter .sort-order-content input{ display:none;}
.product-filter .sort-order-content .sort-order-items{ margin-left:-2%;}
.product-filter .sort-order-content li{ display:inline-block; box-shadow:0 0 0 1px #cecece; max-width:100%; padding:.1rem; margin-bottom:2%; margin-left:2%;}

.product-filter .filter-group-content{position:absolute; left:0; top:100%; width:100%; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2); z-index:10; background:var(--white-color); padding:.1rem .15rem; display:none;}
.product-filter .filter-group-content input{ display:none;}
.product-filter .filter-group-content .filter-item{ font-size:.12rem; display:inline-block; margin-bottom:1%; margin-left:1%;}
.product-filter .filter-group-content label{display:inline-block;position:relative;top:0;left:0;padding:2px 6px;background-color:white;box-shadow:0 0 0 1px #CECECE;text-align:left;max-width:100%;word-break: break-word;cursor: pointer;}
.product-filter .filter-group-content label.on{background-color:green;}
.product-filter .filter-item-count{opacity:0.5;padding-left:3px;}
.product-filter .filter-item-count:before{content:"[";}
.product-filter .filter-item-count:after{content:"]";}
.product-filter .filter-groups{ display:-webkit-flex; display:flex; flex-wrap:wrap; margin-left:-1%;}
.product-filter .filter-groups>li{transition:padding 0.15s ease; margin-bottom:2px; width:19%; margin-left:1%; margin-bottom:1%; position:relative;}
.product-filter .filter-groups .filter-title{background-color:rgba(0,0,0,.05);}
.product-filter .filter-groups>li.filter-group-open .filter-group-content{ display:block;}
.product-filter .filter-groups>li.filter-group-open .filter-title{ background:var(--black-color); color:var(--white-color);}
.product-filter .filter-groups>li.filter-group-open .filter-title:after{content:"\e901";}

.product-box .ul{ list-style:none; margin:0; padding:0;}
.product-list{ display:-webkit-flex; display:flex; flex-wrap:wrap;}
.product-list li{ width:19%; margin-right:1.25%; margin-bottom:1.25%; background:var(--white-color); overflow:hidden; position:relative;}
.product-list li .pic{ position: relative;}
.product-list li:nth-child(5n){ margin-right:0;}
.product-list li .pic figure{ padding-bottom:100%;}
.product-list li .pic img{ position:absolute; left:0; top:0; object-fit:contain;}
.product-list li .pic img.hover{ opacity:0;}
.product-list li .text{ color:#222; padding:10px; line-height:1.2;}
.product-list li .text .tit{ margin-bottom:.15rem; font-size:.2rem; text-align:center;}
.product-list li .text h3{ margin:.05rem 0; font-weight:500; font-size:.16rem; text-align:center;}
.product-list li .text .description{ margin:.05rem 0; text-align:center; font-size:.14rem;text-overflow: ellipsis;overflow: hidden;white-space: nowrap;white-space: normal;display: -webkit-box;-webkit-line-clamp:2;-webkit-box-orient: vertical;overflow-wrap: break-word;}
.product-list li .text .price{ font-size:.14rem; margin:.1rem 0; text-align:center;}
.product-list li .text .price .amount{ font-size:.22rem;}
.product-list li .option{ margin-bottom:.15rem;}
.product-list li .add-collect{position: absolute;right: 0;bottom: 0; width: 0.48rem;height: 0.48rem;display: flex;align-items: center;justify-content: center; font-size: var(--font-size__20);color: var(--primary-color); cursor:pointer;}
.product-list li .pic:hover img{ opacity:0;}
.product-list li .pic:hover img.hover{ opacity:1;}
.one-column-text .right-align{float:right;margin: 0 0 10px 10px;}
.one-column-text h2{ font-weight:500; margin:1em 0 0;}
.one-column-text p{ margin:.6em 0 0 0;}
.one-column-text .table{border: 1px solid #eee;table-layout: fixed;width: 100%;margin-bottom: 20px;}
.one-column-text .table th {font-weight: 700;padding: 5px;background: #efefef;border: 1px solid #ddd}
.one-column-text .table td {padding: 5px 10px;border: 1px solid #eee;text-align: left}
.one-column-text .table tbody tr:nth-child(odd) {background:#fff}
.one-column-text .table tbody tr:nth-child(even){background:#F7F7F7}
.one-column-text ul{padding:0;}
.one-column-text li{list-style:none;padding-left:20px;position: relative; margin:.05rem 0;}
.one-column-text li:before{content:"•";position:absolute;top:0;left:0;line-height:1.4em; display:inline-block;}
.category-description a{color:#405aa7;}
.category-description a:hover{color:#e4002b;}
.one-column-text .faq h3{ margin:1em 0 0; font-size:.2rem; color:#333; font-weight:500;}
.blog-latest-posts-block h2{ text-align:center; margin:0 0 .2rem; font-weight:500; font-size:.32rem;}
.blog-latest-posts-block ul{padding:0;}
.blog-latest-posts-block li{list-style:none;}
.blog-latest-posts-block .columns{ display:-webkit-flex; display:flex; flex-wrap:wrap;}
.blog-latest-posts-block .columns .blog-item{background-color:white;list-style:none;display:-webkit-flex;display:flex; flex-wrap:wrap; margin-bottom:20px;margin-left:20px;width: calc(20% - 20px); align-content:space-between;}
.blog-latest-posts-block .columns .blog-item .post-top-info-list{font-size:0.14rem;letter-spacing: 0.05em;line-height: 1.2em;opacity: 0.5;padding-bottom: 10px; text-align:center;}
.blog-latest-posts-block .columns .blog-item .post-content{ padding:.1rem; word-break:break-word; text-align:center;}
.blog-latest-posts-block .columns .blog-item .entry-title{ line-height:1.35; text-align:center; font-weight:500; font-size:.2rem; margin:0;}
.blog-latest-posts-block .columns .blog-item p{margin:0;}
.blog-latest-posts-block .columns .blog-item .preamble{ margin-top:.1rem;}
.blog-latest-posts-block .columns .blog-item .postmeta-group{ width:100%; padding:.2rem 0; font-size:.14rem; text-align:center;}
.blog-latest-posts-block .columns .blog-item .postmeta-group a{ color:#999;}
.blog-latest-posts-block .columns .blog-item a:hover{color:#e4002b;}

@media only screen and (max-width:640px) {
.prod-option{ display:none;}
.product-list{ padding:0 .3rem !important;}
.product-list li{ width:100%; margin-bottom:4%;}
.blog-latest-posts-block .columns .blog-item{ width:calc(50% - 10px); margin-left:10px;}
.product-filter{ padding:0 .3rem; margin-bottom:.4rem;}
.product-filter .filter-menu{ display:-webkit-flex; display:flex; margin-bottom:0;}
.product-filter .filter-groups{ display:none;}
.product-filter .filter-groups>li{ width:100%;}
.product-filter .filter-groups .filter-title{ padding:.2rem; font-size:13px;}
.product-filter .filter-group-content{ position:inherit;}
.product-filter .filter-group-content .filter-item{ font-size:12px;}
}