@charset "utf-8";
/* CSS Document */
html,body {	min-height: 100vh;	padding: 0;	margin: 0;	font-size: 16px;
font-family:PingFangSC-Regular, sans-serif,"microsoft yahei", "arial", "Helvetica", "Helvetica Neue";
color: #333; line-height: 1.5;	text-align: center; 
-webkit-tap-highlight-color:rgba(0,0,0,0);}
input,textarea {font-family:PingFangSC-Regular, sans-serif,"microsoft yahei", "arial", "Helvetica", "Helvetica Neue";color: #000;
outline:none;}
input:focus,textarea:focus { outline: none; }
ul,li {	list-style: none;
	padding: 0;
	margin: 0;
}
h1,h2,h3,h4,h5,h6,p,dl,dd,dt {
	margin: 0;
	padding: 0;
}
a {
	text-decoration: none;
	color: #333;
}
a:hover {
	color: #333;
	text-decoration: none;
}
a img {	border: 0;}
input::-webkit-input-placeholder { color: #a4a5a7;}
input::-moz-placeholder {color: #a4a5a7;}
input:-ms-input-placeholder {color: #a4a5a7;}

.wrap { max-width: 828px; margin: 0 auto;  padding:49px 0 78px;}
.wrapm { max-width: 828px; margin: 0 auto;  padding:9.25em 0 62px;}
.main { margin: 0 1.6em;}

.header { overflow: hidden; width: 100%; height: 49px;
background-color: #eb4255; color: #fff;
position: fixed; z-index: 900; top: 0; left: 0; }
.header_h { height: auto;}
.header .con {height: 100%; display: flex; 
justify-content: space-between; align-items: center;}
.header .conr { position: relative; z-index: 0; height: 100%; height: 49px; }
.header .conr .gobackBtn { position: absolute; top: 50%; left: 1em; 
margin-top: -0.5em;
background-image:url(../imgs/arr8.png) ;}
.header .conr .name { line-height: 49px; margin: 0 2em;}
.header .conr .nameLeft { font-size: 1.1em; text-align: left; line-height: 49px; margin: 0 2.3em;}
.header .city { margin-left: 1em; background: url(../imgs/arr.png) right center no-repeat;
background-size:auto 0.5em; padding-right: 0.9em;
white-space:nowrap; *white-space:nowrap;}
.header .bell { margin-right: 1em; width: 1.12em; height: 1.12em; 
background: url(../imgs/bell.png) center center no-repeat;
background-size:contain;}
.header .searchBox { height: 2em; line-height: 2em; margin: 0 1em; flex: 1; 
background-color: rgba(255,255,255,0.2);
-moz-border-radius:0.1em; -webkit-border-radius:0.1em; border-radius:0.1em;
display: flex; justify-content: space-between; align-items: center;}
.header .searchBox form { width: 100%; height: 100%; display: flex; 
justify-content: space-between; align-items: center;}
.header .searchBox .searchPic { width: 1em; height: 1em;
background: url(../imgs/search.png) center center no-repeat;
background-size:contain; margin-left: 0.8em; margin-right: 0.7em;}
.header .searchBox .btnScan {width: 1em; height: 1em;
background: url(../imgs/scan.png) center center no-repeat;
background-size:contain;margin-right: 0.7em;margin-left: 0.7em;}
.header .searchBox .input { background-color: transparent; color: #fff;
	flex: 1; border: 0; outline-width: 0;
}
.header .searchBox .input::-webkit-input-placeholder { color: #fff;}
.header .searchBox .input::-moz-placeholder {color: #fff;}
.header .searchBox .input:-ms-input-placeholder {color: #fff;}
.header .title { font-size: 1.2em;}

.header .btnSearchI { margin-left: 2.1em; width: 1em; height: 1em; 
/*background: url(../imgs/search2.png) center center no-repeat;*/
background-size:contain;}

.header .btnCart { margin-right: 1.6em; width: 1.12em; height: 1.12em; 
background: url(../imgs/cart.png) center center no-repeat;
background-size:contain; display: block; cursor: pointer;}

.numBox { color: #fff; text-align: center; height: 90px;}
.numBox .numTit { padding-top: 0.5em; font-size: 0.9em;}
.numBox .num { margin-top: 0.1em; font-size: 1.6em;}
.con { max-width: 828px; margin: 0 auto;}


/*首页轮播*/
/*banner 焦点图 */
.bannerBox .swiper-slide { width: 100%; position: relative; z-index: 0;
padding-top: 80%;}
.bannerBox .swiper-slide a {display: block; position: absolute; left: 0;
 top:0; width: 100%; height: 100%; cursor: pointer;}
.bannerBox .swiper-slide img { width: 100%; height: 100%; object-fit: cover;}
.bannerBox .swiper-container-horizontal>.swiper-pagination-bullets, 
.swiper-pagination-custom, .swiper-pagination-fraction { bottom: 0.7em;}
.bannerBox .swiper-container-horizontal>.swiper-pagination-bullets 
.swiper-pagination-bullet { margin: 0 0.4em;}
.bannerBox .swiper-pagination-bullet { vertical-align: middle; width: 0.5em; height: 0.5em;
-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
background:#c8c4c3;
filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0; }
.bannerBox .swiper-pagination-bullet-active { background-color: #646560;
	filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0; 
}

/*首页导航 */
.navBox .swiper-slide { position: relative; z-index: 0;
 display: flex; justify-content: space-around; align-items: center;
 padding: 1.3em 0 2em;}
.navBox .swiper-slide .navitem { margin: 0 4%; width: 92%; height: 100%;
display: flex; justify-content: space-around; align-items: center;
}
.navBox .swiper-slide a {display: block; cursor: pointer; text-align: center;}
.navBox .swiper-slide a .pic { margin: 0 auto; display: block; width: 2.56em; height: 2.56em;
object-fit: contain;}
.navBox .swiper-slide a .name { margin-top: 0.8em; display: block; font-size: 0.8em;}
.navBox .swiper-container-horizontal>.swiper-pagination-bullets, 
.swiper-pagination-custom, .swiper-pagination-fraction { bottom: 0;}
.navBox .swiper-pagination { display: flex; justify-content: center; align-items: center;}
.navBox .swiper-pagination .swiper-pagination-bullet:first-child {
-moz-border-topleft-radius:1.5em; -webkit-border-topleft-radius:1.5em; border-topleft-radius:1.5em;
-moz-border-bottomleft-radius:1.5em; -webkit-border-bottomleft-radius:1.5em; border-bottomleft-radius:1.5em;
}
.navBox .swiper-pagination .swiper-pagination-bullet:last-child {
	-moz-border-topright-radius:1.5em; -webkit-border-topright-radius:1.5em; border-topright-radius:1.5em;
	-moz-border-bottomright-radius:1.5em; -webkit-border-bottomright-radius:1.5em; border-bottomright-radius:1.5em;
}
.navBox .swiper-container-horizontal>.swiper-pagination-bullets 
.swiper-pagination-bullet { margin: 0;}
.navBox .swiper-pagination-bullet { vertical-align: middle; width: 1.3em; height: 0.3em;
-moz-border-radius:0; -webkit-border-radius:0; border-radius:0;
background:#c8c4c3;
filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;
-moz-border-radius:1.5em; -webkit-border-radius:1.5em; border-radius:1.5em;
}
.navBox .swiper-pagination-bullet-active { background-color: #646560;
	filter:alpha(opacity=100);-moz-opacity:1.0; opacity:1.0;
}

/*新品推荐*/
.newspeBox { color: #646560; padding: 2.7em 0 0;}
.newspeBox .title { font-size: 1.2em;}
.newspeBox .title2 { margin-top: 0.8em; font-size: 0.9em;}

.proList ul { margin-top: 1.1em;border-top: 1px solid #e6e6e6;
	display: flex; justify-content: space-between; align-items: stretch; flex-wrap: wrap;
}
.proList li { border-bottom: 1px solid #e6e6e6;
	width:50% ; position: relative; z-index: 0; background-color: #f7f7f7;
}
.proList li:nth-child(2n+1)::after { position: absolute; 
 right: 0; top: 0; width: 1px; height: 100%;
	display: block; content: ""; background-color: #e6e6e6;
}
.proList .pic { padding-top: 100%; position: relative; z-index: 0; display: block; background-color: #fff;}
.proList .pic img { position: absolute; left: 0; top: 0; width: 100%; width: 100%;
object-fit: cover;}
.proList .txt { padding: 0.5em 0.56em 0.55em; text-align: left; 
}
.proList .name { color: #5e5e5e; font-size: 0.9em;
height: 1.5em; line-height: 1.5;
overflow:hidden;text-overflow:ellipsis; white-space:nowrap; *white-space:nowrap;}
.proList .intro { margin-top: 0.3em; font-size: 0.7em; color: #949494;
height: 1.5em; line-height: 1.5;
overflow:hidden;text-overflow:ellipsis; white-space:nowrap; *white-space:nowrap;}
.proList .price { margin-top: 0.5em; font-size: 1.1em; color: #d93c5a;}
.proList .price span { font-size: 0.66em;}
.proList .label {margin-top: 0.2em;  font-size: 0.65em;
}
.proList .label span { margin-right: 0.5em; color: #d93c5a; display: inline-block; 
border: 1px solid #d93c5a; padding: 0 0.4em; max-width:9em;
overflow:hidden;text-overflow:ellipsis; white-space:nowrap; *white-space:nowrap;
-moz-border-radius:0.3em; -webkit-border-radius:0.3em; border-radius:0.3em;}

/*相聚绿创*/
.gatherBox { padding: 1.4em 0 0;}
.gatherBox .title { display: flex; justify-content: center; align-items: center; font-size: 1.2em;}
.gatherBox .title span {}
.gatherBox .title img { margin-right: 1em; width: 1.3em; height: 1.3em;}
.gatherBox .picBig { margin-top: 1.3em;}
.gatherBox .picBig img { display: block; width: 100%; height: auto;}
.gatherBox .proList ul { margin-top: 0;}
.gatherBox  .searchTitle { text-align: left; margin: -0.5em 1em 0;
 padding-bottom: 0.6em; font-size: 1.3em;}

.cateTitle { margin: 0 0.5em 0; text-align: left; font-size: 2em; color: #474747;}
.cateTab { line-height: 3em; color: #9a9a9a; text-align: left; margin: 1em 1em 0;}
.cateTab li { position: relative; z-index: 0; cursor: pointer; margin-right: 1.5em; display: inline-block; }
.cateTab li.cur{ color: #d93c5a;}
.cateTab li.cur::after { display: block; content: ""; position: absolute; left: 0; right: 0; bottom: 0;
height: 3px; background-color: #d93c5a;}
.cateTab li.btnPrice { padding-right: 1em;
background: url(../imgs/arr5.png) right center no-repeat;
background-size: auto 1.1em ;
}
.cateTab li.up {background-image: url(../imgs/arr6.png);}
.cateTab li.down {background-image: url(../imgs/arr7.png);}

/*绿创经典*/
.clasBox { padding: 1.8em 0 0;}
.clasBox .title { display: flex; justify-content: center; align-items: center; font-size: 1.2em;}
.clasBox .title span {}
.clasBox .title img { margin-right: 1em; width: 1.3em; height: 1.3em;}

.clasBox .list { margin-top: 1.3em; border-top: 1px solid #e6e6e6;
	display: flex; justify-content: space-between; align-items: stretch; flex-wrap: wrap;}
.clasBox .list1 { position: relative; z-index: 0; width: 50%; border-bottom: 1px solid #e6e6e6;}
.clasBox .list1::after { position: absolute; 
 right: 0; top: 0; width: 1px; height: 100%;
	display: block; content: ""; background-color: #e6e6e6;
}
.clasBox .list1 {}
.clasBox .list1 li { display: flex; width: 100%; height: 100%;
 justify-content: space-around; align-items: stretch; flex-direction: column;}
 .clasBox .list1 ul { height: 100%;}
.clasBox .list1 .pic { padding-top:67.7%; position: relative; z-index: 0; background-color: #fff;}
.clasBox .list1 .pic img { position: absolute; left: 0; top: 0; width: 100%; width: 100%;
object-fit: cover;}
.clasBox .list1 .txt { padding: 0.5em 0.56em 0.55em; text-align: left; 
}
.clasBox .list1 .name { color: #5e5e5e; font-size: 0.9em;
height: 1.5em; line-height: 1.5;
overflow:hidden;text-overflow:ellipsis; white-space:nowrap; *white-space:nowrap;}
.clasBox .list1 .intro { margin-top: 0.3em; font-size: 0.7em; color: #949494;
height: 1.5em; line-height: 1.5;
overflow:hidden;text-overflow:ellipsis; white-space:nowrap; *white-space:nowrap;}
.clasBox .list1 .price { margin-top: 0.5em; font-size: 1.1em; color: #d93c5a;}
.clasBox .list1 .price span { font-size: 0.66em;}

.clasBox .list2 { width: 50%;border-bottom: 1px solid #e6e6e6; }

.clasBox .list2 .pic { margin: -2em 0 0 auto; width: 46.9%; padding-top:42.7%; position: relative; z-index: 0;
 background-color: #fff;}
.clasBox .list2 .pic img { position: absolute; left: 0; top: 0; width: 100%; width: 100%;
object-fit: cover;}
.clasBox .list2 .txt { padding: 0.5em 0.56em 0; text-align: left; }
.clasBox .list2 li:first-child .txt { padding-top: 0.8em;}
.clasBox .list2 .name { color: #5e5e5e; font-size: 0.9em;
height: 1.5em; line-height: 1.5;
overflow:hidden;text-overflow:ellipsis; white-space:nowrap; *white-space:nowrap;}
.clasBox .list2 .intro { margin-top: 0; font-size: 0.7em; color: #949494;
height: 1.5em; line-height: 1.5;
overflow:hidden;text-overflow:ellipsis; white-space:nowrap; *white-space:nowrap;}
.clasBox .list2 .price { margin-top: 0.5em; font-size: 1.1em; color: #d93c5a;}
.clasBox .list2 .price span { font-size: 0.66em;}
.clasBox ul { margin-top: 0;}




/*个人中心*/
.header_user { overflow: hidden; width: 100%;
background: #212121; /* Old browsers */
color: #fff;
position: fixed; z-index: 900; top: 0; left: 0;
}
.header_user .con {}
.header_user .btnUser {
margin-left: auto; width: 1.5em; height: 1.5em; 
background:#1c1c1c url(../imgs/set.png) center center no-repeat;
background-size:cover;
-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
}
.header_user .btnSet { margin-top: 1em; margin-right: 0.9em; margin-left: auto;
width:1.4em; height: 1.4em; 
background:url(../imgs/set.png) center center no-repeat;
background-size:contain;
}
.header_user .user { margin: 1em 2em 0; text-align: left;
 display: flex; justify-content:space-between;align-items: flex-start;}
.header_user .user .pic { position: relative; z-index: 0; width:3.4em; height: 3.4em; 
-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%; overflow: hidden;}
.header_user .user .pic .edit { position: absolute; bottom: 0; left: 0; right: 0;
 background-color: #424242; color: #fff; line-height: 1.3; 
 padding: 0.5em 0 0.6em; display: block; font-size: 0.4em; text-align: center;}
.header_user .user .pic img { width: 100%; display: block; height: 100%; object-fit: cover;}
.header_user .user .txt { margin-top: 1em; margin-left: 0.6em;  flex: 1;}
.header_user .user .level {  font-size: 1.8em; font-weight: bold;}
.header_user .user .state {  font-size: 1.1em; font-weight: bold;}
.header_user .user .name { margin-top: 1em; font-size: 0.7em;}
.header_user .user .tel { margin-top: 0.4em;font-size: 0.7em;}
.header_user .user .info { margin-top: 1em;font-size: 0.7em;}
.header_user .user .info ul { display: flex;  text-align: center;
justify-content: flex-start; align-items: flex-start;}
.header_user .user .info li { margin-right: 3.2em;}
.header_user .user .info b {display: block; font-weight: normal;}
.header_user .user .info i { display: block; font-style: normal;}
.header_user .user a { color: #fff;}
 
.incomeBoxW { max-width: 828px; margin: 0 auto;}
.incomeBox { margin: 1em 0.9em 0; background-color: #e0394d; color: #fff;
 -moz-border-top-left-radius:0.6em; -webkit-border-top-left-radius:0.6em; border-top-left-radius:0.6em;
 -moz-border-top-right-radius:0.6em; -webkit-border-top-right-radius:0.6em; border-top-right-radius:0.6em;
 padding: 1em 1.2em 1.8em;
 display: flex; justify-content: space-between; align-items:center;
 }
.incomeBox .txt { text-align: left;}
.incomeBox .pic { margin-right: 0.3em;}
.incomeBox .pic img{ display: block; width: 2.5em; height: 2.5em;}
.incomeBox .btnView { margin-top: -2em; line-height: 1.8em; padding: 0.1em 1em 0;
font-size: 0.8em; color: #e94055; background-color: #fefefe;
-moz-border-radius:1em; -webkit-border-radius:1em; border-radius:1em;}
 
.userMain {  position: relative; z-index: 901; background-color: #f7f7f7; 
 padding:0 0 62px; margin:17em auto 0; max-width: 828px;}
.userMain::before {display: block; content: ""; width: 100%; height: 1em;
position: absolute; top: -1em; left: 0;
 background: url(../imgs/line.png) center center no-repeat;
 background-size:100% 100%;
}

/*个人中心 订单管理 */
.orderBox { margin: 0.8em 1em 0; padding:0.8em 1em 1.2em; background-color: #fff;
-moz-border-radius:0.4em; -webkit-border-radius:0.4em; border-radius:0.4em;}
.orderBox .title { padding-bottom: 0.8em; border-bottom: 1px solid #ededed; display: flex; justify-content: space-between; align-items: center;}
.orderBox .more { display: inline-block;
 color: #8d8d8d; font-size: 0.9em; padding-right: 0.7em;
 background: url(../imgs/arr3.png) right center no-repeat;
 background-size: auto 0.8em ;}
.orderList ul { margin: 1.4em 1% 0; display: flex; 
justify-content: space-between; align-items: flex-start;}
.orderList .pic {display: block;}
.orderList .pic img { display: block; margin: 0 auto; width: 1.6em; height:1.6em;}
.orderList .name { display: block; margin-top: 0.4em; font-size: 0.8em; color: #333;}

/*个人中心 积分 基金*/
.scoreBox { padding-top: 0.9em;  margin: 0 1em 0;} 
.scoreBox ul {display: flex; justify-content: space-between; align-items: stretch;}
.scoreBox ul li {flew:1; width: 50%; margin-right: 0.5em;  color: #fff6be; 
-moz-border-radius:0.4em; -webkit-border-radius:0.4em; border-radius:0.4em;
background: #6d6d6f url(../imgs/memb_bg.png) center center no-repeat;
background-size:cover;}
.scoreBox ul li:nth-child(2) { color: #a84c25;margin-right: 0;margin-left: 0.5em;
background: #f9d9a8 url(../imgs/club_bg.png) center center no-repeat;
background-size:cover;}
.scoreBox ul .item {color: #fff6be; cursor: pointer; flex: 1; padding: 0.7em 0.8em 0.6em 1.3em;
display: flex; justify-content: space-between; align-items: flex-end;}
.scoreBox ul li:nth-child(2) .item {color: #a84c25;}
.scoreBox ul .txt {text-align: left;}
.scoreBox ul .name { }
.scoreBox ul .num { margin-top: 0.1em; }
.scoreBox ul .arrow { width: 1em; height: 1em; color: #747273;  background-color: #fff;
-moz-border-radius:50%; -webkit-border-radius:50%; border-radius:50%;
line-height: 1em; display: flex; align-items: center; justify-content: center;}
.scoreBox ul li:nth-child(2) .arrow { color: #f3cf9f;}

.userNav { margin-top: 0.3em; margin: 0 1em; text-align: left;}
.userNav li .item { position: relative; z-index: 0;
 margin: 0.5em auto 0; padding:0.8em 4.2em 0.8em 1.3em; background-color: #fff;
-moz-border-radius:0.4em; -webkit-border-radius:0.4em; border-radius:0.4em;
display: flex; justify-content: space-between; align-items: center;}
.userNav li a { flex: 1; display: block; cursor: pointer;
display: flex; justify-content: space-between; align-items: center;}
.userNav li .btn {flex: 1; display: block; cursor: pointer;
display: flex; justify-content: space-between; align-items: center;}
.userNav li li { margin-left: 2.9em;}
.userNav li li a { margin-top: 0.34em;}
.userNav li li:first-child a {margin-top: 0.5em;}
.userNav .pic { width: 1.8em; height: 1.8em;}
.userNav li li .pic {width: 1.3em; height: 1.3em;}
.userNav .pic img { width: 100%; height: 100%; object-fit: contain; overflow: hidden;}
.userNav .txt { color: #020202; flex: 1; font-size: 0.9em; margin-left: 1.4em;}
.userNav li li .txt { font-size: 0.8em; margin-top: 0.1em; line-height: 2em;}
.userNav .arrow { position: absolute; right: 0; top: 0;
 width: 4.2em; height: 100%;
 background: url(../imgs/arr3.png) center center no-repeat;
 background-size: auto 0.8em }
 .userNav li.show>.item>.arrow {transform: rotate(90deg);
-ms-transform: rotate(90deg); /* IE 9 */
-webkit-transform: rotate(90deg); /* Safari and Chrome */}
 .userNav li ul { display: none;}
 .userNav li.show ul { display: block;}

/*个人中心 我的服务*/
.serBox { margin: 1.2em 1em 0;}
.serBox .title { text-align: left;}
.serBox .title .name {} 
.serBox ul { margin: 0 -2% 0; display: flex;  flex-wrap: wrap;
justify-content: flex-start; align-items: flex-start;}
.serBox li { margin-top: 1.8em; width: 25%;}
.serBox li .pic {display: block;}
.serBox li .pic img { display: block; margin: 0 auto; width: 1.9em; height:1.9em;}
.serBox li .name { display: block; margin-top: 0.5em; font-size: 0.9em; color: #333;}