@charset "utf-8";
/*全局定义*/
html{box-sizing:border-box;-ms-text-size-adjust:none;-webkit-text-size-adjust:none;text-size-adjust:none;font-size:100px;}
*,*::before,*::after{box-sizing:inherit;}
body,dl,dd,ul,ol,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,hr,thead,tbody,tfoot,th,td,button{margin:0;padding:0;}
ul,ol{list-style:none;}
a{text-decoration:none;color:#333;-webkit-tap-highlight-color:transparent;}
a:hover{color:#e60012;}
body{font-size:0.24rem;line-height:1.5em;color:#333;background:#C8C8C8;font-family:'MicrosoftYaHei','微软雅黑','STHeitiSC',sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;}
button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;vertical-align:baseline;border:none;background:transparent;outline:none;}
button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}
button[disabled],input[disabled]{cursor:default;}
input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}
input[type="search"]{-webkit-appearance:textfield;box-sizing:content-box;}
input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}
b,strong{font-weight:bold;}
i,em{font-style:normal;}
img{border:0 none;max-width:100%;height:auto;vertical-align:middle;}
table{border-collapse:collapse;border-spacing:0;}
.clearfix::after{content:"";display:table;clear:both;}

.common-tit{ height:0.8rem; line-height:0.8rem; box-sizing:border-box; overflow:hidden; zoom:1; }
.common-tit .tit{ float:left; font-size:0.36rem; color:#333; font-weight: bold; }
.common-tit .change-btn{width:1.28rem;float:right;cursor:pointer;display:flex;align-items:center;justify-content:space-between; font-size: 0.28rem; color: #999; }
.common-tit .change-btn i{width:0.32rem;height:0.32rem;display:inline-block;vertical-align:middle;background:url(../images/change_btn.png) no-repeat;background-size:0.3rem auto;}
.common-tit  a.more{float:right; font-size:0.24rem; padding-right:0.1rem; color:#999;}
.common-tit  a.more:hover{color:#e60012;}
.container{width:100%;padding:0 0.3rem;box-sizing:border-box;margin:0 auto;min-height:calc(100vh - 3rem);position:relative;z-index:1;overflow:hidden;}
.viewport{width:100%;  max-width:750px; margin:0 auto; background:#f3f4f8;}

/* --- Header --- */
.header{height:1.1rem;background-color:#fff;display:flex;align-items:center;position:sticky;top:0;z-index:100;border-bottom:1px solid #eee; justify-content: space-between;}
.header .logo{width:2.2rem; height:1.1rem; background:url(../images/logo.png) no-repeat 0.35rem center; background-size:1.7rem auto; display: inline-block;z-index:2; }
.header .search-bar{flex:1;background-color:#f2f2f2;width:3.75rem; height:0.66rem; line-height: 0.66rem; border-radius:0.4rem;padding:0 0.3rem;position: relative;}
.header .search-bar .search-input{background:transparent;border:none;outline:none;font-size:0.26rem;width:100%;color:#666;}
.header .search-bar .search-input::placeholder{color:#999;}
.header .search-bar .search-btn{width:0.64rem; height:0.64rem; cursor:pointer; display:inline-block; background:url(../images/search-icon.png) no-repeat center center; background-size:0.35rem; text-indent:-9999px; position:absolute;border:none; box-sizing:border-box; right:0.1rem; top:0;}
.header .menu-btn{width:0.9rem; height:1.1rem; background:url(../images/menu-icon.png) no-repeat 0.13rem center; background-size:0.36rem auto; cursor: pointer;z-index:2;}
.header .back{width:0.9rem;height:1.1rem;display:block;background:url(../images/back-icon.png) no-repeat 0.35rem center;background-size:0.24rem auto;text-indent:-9999px;z-index:2;}
.header .title{width:100%;height:1.1rem;overflow:hidden;position:absolute;top:0;left:0;z-index:0;display:flex;align-items:center;gap:0.1rem;justify-content:center; padding: 0 0.9rem 0 2.2rem;}
.header .title img{max-width:0.96rem; height:0.72rem;vertical-align:middle;margin-right:0.1rem;border-radius:0.1rem;}
.header .top-brand-info{font-size:0.24rem;line-height:1.5;}
.header .top-brand-info h1{max-width: 2.6rem; font-size:0.32rem;height:0.34rem;line-height:0.32rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.header .top-brand-info p{font-size:0.2rem;color:#999;padding-top:0.04rem;}
.header .top-brand-info span{color:#e60012;padding-left:0.1rem;font-weight:bold;}


/*侧滑导航*/
.top-nav{background:rgba(255,255,255,0.98);position:fixed;top:0;left:-85%;width:85%;height:100%;z-index:10002;transition:all 0.3s cubic-bezier(0.16,1,0.3,1);overflow-y:auto;padding-top:1.4rem;border-radius:0 0.6rem 0.6rem 0;}
.top-nav.active{left:0;}
.nav-close-btn{position:absolute;top:0.4rem;right:0.4rem;font-size:0.6rem;color:#666;cursor:pointer;width:0.8rem;height:0.8rem;line-height:0.72rem;text-align:center;border-radius:0.4rem;background-color:rgba(0,0,0,0.05);transition:all 0.3s ease;;}
.nav-close-btn:active{background-color:rgba(0,0,0,0.1);transform:scale(0.95);}
.nav-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.5);backdrop-filter:blur(0.04rem);z-index:2001;opacity:0;visibility:hidden;transition:all 0.3s ease;}
.nav-overlay.active{opacity:1;visibility:visible;}
.top-nav ul{overflow:hidden;zoom:1;padding:0.2rem 0.6rem; display: flex;    flex-wrap: wrap; gap: 0.4rem;}
.top-nav ul li{ height:0.8rem;line-height:0.8rem; font-size: 0.32rem;}
.top-nav ul li a{display:block; display: flex;align-items: center;}
.top-nav ul li.cur{border-left: 0.04rem solid #e60012; background-color: rgba(0, 0, 0, 0.03); border-radius:0.1rem;}

.top-nav ul li .icon { width:0.7rem; height:0.7rem; display:inline-block; text-indent:-9999px; }
.top-nav ul li .icon1 { background: url(../images/nav_icon.png) no-repeat;  background-size:0.7rem auto; }
.top-nav ul li .icon2 { background: url(../images/nav_icon.png) no-repeat 0 -6.48rem; background-size:0.7rem auto;}
.top-nav ul li .icon3 { background: url(../images/nav_icon.png) no-repeat 0 -1.44rem; background-size:0.7rem auto;}
.top-nav ul li .icon4 { background: url(../images/nav_icon.png) no-repeat 0 -2.16rem; background-size:0.7rem auto;}
.top-nav ul li .icon5 { background: url(../images/nav_icon.png) no-repeat 0 -2.88rem; background-size:0.7rem auto;}
.top-nav ul li .icon6 { background: url(../images/nav_icon.png) no-repeat 0 -3.6rem; background-size:0.7rem auto;}
.top-nav ul li .icon7 { background: url(../images/nav_icon.png) no-repeat 0 -4.32rem; background-size:0.7rem auto;}
.top-nav ul li .icon8 { background: url(../images/nav_icon.png) no-repeat 0 -5.04rem; background-size:0.7rem auto;}
.top-nav ul li .icon9 { background: url(../images/nav_icon.png) no-repeat 0 -5.76rem; background-size:0.7rem auto;}
.top-nav ul li .icon10 { background: url(../images/nav_icon.png) no-repeat 0 -0.72rem; background-size:0.7rem auto;}
.top-nav ul li .icon11 { background: url(../images/nav_icon.png) no-repeat 0 -7.2rem; background-size:0.7rem auto;}
.top-nav ul li .icon12 { background: url(../images/nav_icon.png) no-repeat 0 -7.92rem; background-size:0.7rem auto;}


/*幻灯片*/
.focus{ width:100%;  margin:0 auto; position:relative; overflow:hidden; background: #fff; }
.focus .hd{ width:100%; height:0.22rem; position:absolute; z-index:1; bottom:0.12rem; text-align:center; }
.focus .hd ul{ display:inline-block; height:0.1rem; padding:0.06rem 0.1rem; vertical-align:top;}
.focus .hd ul li{display:inline-block; width:0.16rem; height:0.1rem; -webkit-border-radius:0.1rem; -moz-border-radius:0.1rem; border-radius:0.1rem; background:#000; opacity:0.7; margin:0 0.04rem; vertical-align:top; overflow:hidden; text-indent:-9999px;}
.focus .hd ul .on{background:#fff;opacity:0.7;width:0.32rem;}
.focus .bd{width:6.7rem; height:2.8rem; margin:0 auto; position:relative; z-index:0;border-radius: 0.2rem; overflow: hidden;margin-top: 0.28rem;}
.focus .bd li { position:relative; width:6.7rem; height:2.8rem; overflow:hidden; }
.focus .bd li img{ width:6.7rem; height:2.8rem; }
.focus .bd li a{ -webkit-tap-highlight-color:rgba(0, 0, 0, 0); }


/* 最新滚动品牌 */
.latest-scroll-box{background:#fff;padding:0.3rem 0.4rem; display:flex;align-items:center; margin-bottom: 0.2rem;}
.latest-scroll-label{width:0.75rem; height: 0.55rem; background: url(../images/latest-title.png) no-repeat left center; background-size: 0.66rem auto ; margin-right:0.15rem;}
.latest-scroll-content{flex:1;height:0.4rem;overflow:hidden;position:relative;}
.latest-scroll-content ul{position:absolute;top:0;left:0;width:100%;margin:0;padding:0;transition: transform 0.3s ease-in-out;}
.latest-scroll-content li{height:0.4rem;line-height:0.4rem;font-size:0.32rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;list-style:none;}
.latest-scroll-content em{ color:#e60012; padding-left: 0.2rem;}

/*推荐品牌*/
.brand-recommend{background:#fff; padding:0.1rem 0.4rem 0.3rem; margin-bottom: 0.2rem;}
.brand-recommend .bd{padding-top: 0.1rem; }
.brand-recommend .bd ul{ display: flex; flex-wrap: wrap;justify-content: space-between;}
.brand-recommend .bd li{margin:0 0 0.4rem 0;}
.brand-recommend .bd .img-show{ width:3.14rem; height:1.91rem; border-radius: 0.12rem; overflow: hidden;}
.brand-recommend .bd .img-show img{width:3.14rem; height:1.91rem;}
.brand-recommend .bd .tit{ height:0.8rem; line-height:0.8rem; font-size:0.32rem; overflow:hidden;  color:#333}
.brand-recommend .bd .count{color:#999;}
.brand-recommend .bd .price{zoom: 1;}
.brand-recommend .bd .price em{color:#e60012; font-size:0.32rem;}
.brand-recommend .bd .price .btn{float: right; background-image: linear-gradient(288deg, rgba(255, 95, 2, 1) 0%, rgba(254, 10, 1, 1) 100%);box-shadow: 0px 0.04rem 0.16rem rgba(254, 16, 1, 0.31);border-radius: 0.24rem;  width:1rem;height:0.44rem; line-height: 0.44rem; text-align: center; color: #fff; }
.hidden{ display: none !important;}


/*品牌优选*/
.brand-hot{background:#fff; padding: 0.1rem 0.4rem 0.3rem; margin-bottom: 0.2rem;}
.brand-hot .bd li{position:relative; padding:0.32rem 0; box-sizing: border-box; background: #fff; border-radius: 0.1rem; border-bottom: 0.02rem solid #f3f0f1;}
.brand-hot .bd li:first-child{ padding-top: 0.1rem;}
.brand-hot .bd li:last-child{ border-bottom: none;}
.brand-hot .bd li a{ display:block; zoom:1;}
.brand-hot .bd .img-show{ width:2.5rem; height:1.52rem; float:left; margin-right:0.3rem; position:relative;  border-radius: 0.12rem; overflow: hidden;}
.brand-hot .bd .img-show img{ width:2.5rem; height:1.52rem;}

.brand-hot .bd .detail{ padding-left:2.8rem; height: 1.52rem; position: relative;}
.brand-hot .bd .detail .tit{ font-size:0.32rem; font-weight:bold; height:0.44rem; color: #333; overflow:hidden;  }
.brand-hot .bd .detail .cate{ padding:0.1rem 0;}
.brand-hot .bd .detail .cate em{ color: #5c5c5c; background: #f3f3f3;   padding:0.05rem 0.3rem; border-radius: 0.2rem;}
.brand-hot .bd .detail .price{color:#e60012; font-size:0.32rem; padding-top: 0.1rem;}
.brand-hot .bd .detail .btn{display: block; position:absolute; right:0; bottom:0.1rem; background-image: linear-gradient(288deg, rgba(255, 95, 2, 1) 0%, rgba(254, 10, 1, 1) 100%); box-shadow: 0px 0.04rem 0.16rem rgba(254, 16, 1, 0.31); border-radius: 0.24rem;  width:1rem;height:0.44rem; line-height: 0.44rem; text-align: center; color:#fff; }

.load-more{margin-top:0.2rem;padding-bottom:0.6rem;text-align:center;}
.load-more a{background:#fff;border:0.02rem solid #eee;color:#666; width: 4.15rem; height: 0.7rem; line-height: 0.68rem; border-radius:0.4rem;font-size:0.28rem; display: block; margin: 0 auto;}


/*footer*/
.footer{background:#FFF; color:#999;}
.footer .link-box{text-align:center; height:0.7rem; line-height:0.7rem;  border-bottom: 0.02rem solid #eee; padding-top: 0.02rem;}
.footer .link-box a{display:inline-block; height:0.32rem; line-height:0.32rem; padding:0 0.3rem; text-align:center; color: #666; font-size: 0.32rem; border-right: 0.02rem solid #eee; }
.footer .link-box a:last-child{ border-right: none;}
.footer .copyright{text-align:center; line-height:0.4rem; padding:0.1rem 0 0.2rem; }
.footer .copyright a{color:#999;}

.path{ line-height:0.36rem; padding:0.12rem 0.4rem; color:#999; overflow:hidden;}
.path a{color:#999;}
.path a:hover{ color:#e60012;}

/*分页*/
.page{padding:0.4rem 0;text-align:center;}
.pagination{display:inline-flex;margin:0;padding:0;list-style:none;border-radius:0.08rem;}
.page-item{margin:0 0.05rem;}
.page-link{display:flex;align-items:center;justify-content:center;min-width:0.6rem;height:0.6rem;padding:0 0.16rem;font-size:0.28rem;color:#333;background-color:#fff;border:0.02rem solid #ddd;border-radius:0.08rem;text-decoration:none;transition:all 0.2s ease;}
.page-item:hover .page-link{color:#e60012;background-color:#f8f9fa;border-color:#e60012;}
.page-item.active .page-link{color:#fff;background-color:#e60012;border-color:#e60012;}
.page-item.disabled .page-link{color:#999; border: none; background: none; min-width:0.2rem;padding:0;}

/*在线留言*/
.msg{background:#FDECE8;border-top:2px solid #FCC4B6;border-bottom:1px solid #FCC4B6;padding:0 0.4rem 0.2rem;margin-bottom:0.2rem;}
.msg .hd{height:1rem;line-height:1rem;font-weight:bold;font-size:0.36rem;color:#e60012;}
.msg .bd li{padding-bottom:0.24rem;overflow:hidden;zoom:1;position:relative;}
.msg .bd li:nth-child(3){padding-bottom:0.1rem;}
.msg .bd li:nth-child(4){padding-bottom:0.4rem;}
.msg .bd .label{position:absolute;left:0.24rem;top:0.24rem;font-size:0.3rem;color:#333;}
.msg .bd .msg-input{border:0.02rem solid #D6D6D6;padding-left:1rem;width:100%;font-size:0.28rem;height:0.88rem;line-height:0.88rem;border-radius:0.1rem;box-sizing:border-box;background:#fff;}
.msg .bd .msg-textarea{border:0.02rem solid #D6D6D6;width:100%;height:1.8rem;line-height:1.5;padding:0.2rem 0 0.2rem 1rem;border-radius:0.1rem;box-sizing:border-box;background:#fff;font-size:0.28rem;}
.msg .bd .msg-select-wrap{border:0.02rem solid #D6D6D6;background:#fff;padding-left:1rem;width:100%;height:0.88rem;line-height:0.88rem;border-radius:0.1rem;box-sizing:border-box;}
.msg .bd .msg-select{border:none;width:100%;height:0.33rem;line-height:0.33rem;color:#666;font-size:0.28rem;}
.msg .bd .msg-input::placeholder,.msg .bd .msg-textarea::placeholder,.msg .bd .msg-select::placeholder{color:#999;}
.msg .bd .submit-btn{height:0.88rem;line-height:0.88rem;font-size:0.32rem;text-align:center;width:100%;background:#e60012;border-radius:0.44rem;color:#fff;border:none;}
.msg .bd .submit-btn:hover,.msg .bd .submit-btn:active{background:#d4362c;}
.msg .bd .quick-message-buttons{display:flex;flex-wrap:wrap;gap:0.1rem;}
.msg .bd .quick-msg-btn{background:#fff;border:0.02rem solid #D6D6D6;border-radius:0.1rem;padding:0.15rem 0.15rem;font-size:0.24rem;color:#666;cursor:pointer;flex:1;min-width:calc(50% - 0.05rem);text-align:center;}
.msg .bd .quick-msg-btn:hover{background:#f0f0f0;border-color:#ccc;}
.msg .bd .msg-tips{text-align:center;color:#E63726;padding-bottom:0.1rem;font-size:0.32rem;}
.msg .bd .msg-input.error{border-color:#e60012;}
.msg .bd .error-message{color:#e60012;font-size:0.28rem;padding:0.05rem;}


/**********404*********/
.error404-wrapper{width:100%;min-height:calc(100vh - 3.2rem);display:flex;align-items:center;justify-content:center;}
.error404{background:url(../images/404.jpg) no-repeat center;background-size:5.63rem auto;height:4.2rem;width:100%;}
.error404 .tip-area{padding:3.7rem 0 0 0;text-align:center;}
.error404 .btn-area{text-align:center;}
.error404 .tip-area p{color:#666;}
.error404 .tip-area font{color:#e60013;}

@media screen and (min-width:320px) and (max-width:359px){ 
	html{font-size:100px;} 
} 
@media screen and (min-width:360px) and (max-width:374px){ 
	html{font-size:112.5px;}
} 
@media screen and (min-width:375px) and (max-width:385px){ 
	html{font-size:117.188px;}
} 
@media screen and (min-width:386px) and (max-width:392px){ 
	html{font-size:120.625px;}
} 
@media screen and (min-width:393px) and (max-width:400px){ 
	html{font-size:122.813px;}
} 
@media screen and (min-width:401px) and (max-width:413px){ 
	html{font-size:125.313px;}
} 
@media screen and (min-width:414px) and (max-width:639px){ 
	html{font-size:129.375px;}
} 
@media screen and (min-width:640px){ 
	html{font-size:200px;}
}