﻿*{ margin:0;padding:0; list-style:none; box-sizing:border-box; outline:0; }
html{ font-size:16px; -webkit-tap-highlight-color: transparent; }
body{ font-family: 'Microsoft Yahei',"Lucida Grande", "Hiragino Sans GB", "Hiragino Sans GB W3"; font-size:0.875rem; background-color:rgb(243,243,243); color:#333; text-align:center; }
a{ text-decoration:none; }
.fx{ display:flex; }
.fc{ flex-direction:column; }
.f1{ flex:1; }
.xl{ justify-content:flex-start; }
.xc{ justify-content:center; }
.xr{ justify-content:flex-end; }
.jsb{ justify-content:space-between; }
.yt{ align-items:flex-start; }
.yc{ align-items:center; }
.yb{ align-items:flex-end; }
.w100{ width:100%; }
.h100{ height:100%; }
input[type='text'],input[type='number'],select{ appearance:none; height:2rem; background:#fff; border:1px solid #aaa; border-radius:3px;padding:0.1875rem; font-size:0.875rem; }
[v-cloak]{ display:none; }
.app{ margin:0 auto; text-align:left; width:100%;  }

/*index banner*/
.swiper-container{
    width:100%;
    height: 275px;
    overflow: hidden;
}

.swiper-container1{
        width:500px;
    height: 500px;
}

.swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    display: flex;
    justify-content: center;
    align-items: center;
}
.banner .item a{ display:flex; width:100%; height:100%; background-position:center; background-size:cover; background-repeat:no-repeat; }

/*通用*/
.cbox{
    background: #fff;
    box-shadow: 0px 0px 1px #eee;
    border-radius: 4px;
    border-bottom: 1px solid #ddd;
    margin:10px 5px 0;
}

.shop{ height:130px; padding:10px 0; }
.shop .left{ width:100px; margin-left:10px; }
.shop .left img{ width:100px; height:100px; border-radius:50%; overflow: hidden;}
.shop .center{ height:100%; padding:0 30px; }
.shop .center h4{ font-size:22px; color:#fb00cf; line-height:1.5em; }
.shop .center p{ font-size:16px; color:#666; line-height:1.5em; }
.shop .right{}
.shop .left{}

.index-nav{ overflow:hidden; padding:10px; }
.index-nav .item{ width:48%; float:left; border-radius: 5px; padding:10px; background-repeat: no-repeat; background-position: top 6px right 5px; }
.index-nav .item:nth-child(2n) { float:right; }
.index-nav .item h3{ line-height:2em; }
.index-nav .item p{ color:#fff; }
.index-nav .item.buy{ background-color:#eb3a0f; color:#fff; background-image:url(../image/sub_1.png); }
.index-nav .item.order{ background-color:#295ae7; color:#fff; background-image:url(../image/sub_3.png);  }
.index-nav .item.order p{ color:#fff; }

.indexhot-title{ border-bottom:1px solid #ccc; line-height:36px; padding:0 10px; margin:0 5px; }
.indexhot-title span{ color:#666; }
.indexhot-list{ overflow:hidden; }
.indexhot-list .item{ width:50%; padding:5px; float:left;  }
.indexhot-list .item .inner{ border-radius:5px; overflow:hidden; display:block;box-shadow: 0 0 8px 0 #e1e1e1; padding:8px; }
.indexhot-list .item .inner a .img{ width:100%; height:0; padding-top:100%; background-repeat:no-repeat; background-position:center; background-size:cover;border-radius:5px; overflow:hidden; }
.indexhot-list .item .inner a .name{ color:#333; box-sizing: content-box; padding:3px 0; overflow: hidden;
text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2;-webkit-box-orient: vertical; height:2.625rem; line-height:1.5em; font-size:0.875rem;}
.indexhot-list .item .inner .price{ line-height:1.5em; }
.indexhot-list .item .inner .price span{ color:#333; }
.indexhot-list .item .inner .price b{ font-weight:normal; color:rgb(0,204,51); }

.bottom-nav{ text-align:center; padding:10px 0; border-top:1px solid #ddd; margin-top:10px; }
.bottom-nav a{ color:#666; font-weight:bold; display:inline-block; margin-left:20px; }
.bottom-nav a:first-child{ margin-left:0; }
.copyright{ text-align:center; padding:10px; color:#666; }

footer{ position:fixed; z-index:200; left:0; bottom:0; height:60px; width: 100%; background: linear-gradient(to bottom, #FFFFFF, #EAEAEA); box-shadow: -1px -1px 3px #ccc; }
footer ul{ display:flex; width:100%; height:100%; }
footer ul li{ flex:1; height:100%;  }
footer ul li a{ width:100%; height:100%; color:#333; position:relative; }
footer ul li a img{ width:25px; margin-bottom:2px; }
footer ul li a b{  font-weight:normal; }
footer ul li a span{  font-weight:bold; color:#f90000; position:absolute; left:50%; top:5px; transform: translateX(15px); }



/*列表，分类*/
.listcate-cate{ overflow:hidden; background-color:rgb(243,243,243); position: sticky; top: 0; width:100%; left:0; z-index:10; border-bottom:1px solid #ddd;  padding:5px; position: fixed;}
.listcate-cate .item{ padding:5px; float:left; }
.listcate-cate .item span{ display:flex; height:26px; line-height: 1em; align-items: center; padding:0 10px; border-radius: 5px; background: #fff; font-size:16px; user-select:none; }
.listcate-cate .item span.active{ background-color:#62C462; color:#fff; }
/*产品列表*/
.listcate-list{ overflow:hidden; margin-top: 70px }
.listcate-list .item{ margin:5px 10px; background: #fff; box-shadow: 0px 0px 1px #eee; border-radius: 4px; border-bottom: 1px solid #ddd; margin:10px 5px 0;  padding:8px; }
.listcate-list .item .litpic{ width:140px;  border-radius: 4px; overflow: hidden; }
.listcate-list .item .litpic a{ display:block; height:0; padding-top:100%; background-repeat: no-repeat; background-size:cover; background-position: center; transition:all ease .2s; }
/*.listcate-list .item .litpic a:hover{ transform: scale(1.1); }*/
.listcate-list .item .right{ padding-left:10px; }
.listcate-list .item .right h1{ font-size:0.875rem; line-height:1.5em; font-weight:normal;}
.listcate-list .item .right h1 a{ color:#000; }
.listcate-list .item .right p{ padding:10px 0; }
.listcate-list .item .right p b{ color:Red; }
.listcate-list .item .right p span{ color:#333; }
.listcate-list .item .right .bjq{ cursor:default; user-select:none; position:relative; }
.listcate-list .item .right .bjq span{ display:flex; align-items: center; justify-content: center; width:18px; height:26px; border-radius: 80px; background-image: linear-gradient(to bottom, #62C462, #51A351); font-weight:bold; color:#fff; line-height:1em; }
.listcate-list .item .right .bjq .inp{ padding:0 6px; }
.listcate-list .item .right .bjq .inp input{ appearance:none; background:#fff; height:26px; border-radius:13px; border:1px solid #ddd; width:50px; text-align:center; }
/*产品列表，一行两个*/
.listcate-list2{}
.listcate-list2 .item{ float:left; width:calc(50% - 10px); flex-direction:column; }
.listcate-list2 .item:nth-child(2n){ float:right; }
.listcate-list2 .item .litpic{ width:100%; }
.listcate-list2 .item .right{ padding: 0 0px; }
.listcate-list2 .item .right h1{}
.listcate-list2 .item .right h1 a{ overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; height: 2.625rem; line-height: 1.5em; font-size: 0.875rem; }
/*空*/
.empty{ font-size:30px; color:#e1e1e1; line-height:1em; padding:50px 0; }




