.contain{
	width: 100%;
}
.contain-fixed{
	width: 100%;
	position: fixed;
	top:0;
}
.body-hidden{
	height: 100%;
	overflow: hidden;
}
/*搜索*/
.search-bg{
    height: 6rem;
    background: #f6f5f3 url(../images/user-bg.png) no-repeat center center;
    background-size: cover;
    border-radius:0;
}
.search img{
	width: auto;
	height: 0.75rem;
	margin:0.5rem;
}
.search{
	margin:0.65rem 3.2% 1.15rem;
	height: 1.75rem;
	border-radius: 2rem;
	background: #fff;
	display: flex;
}
.search input{
	width: 100%;
	height: 1.75rem;
	line-height: 1.75rem;
	font-size: 0.6rem;
}





/*升降序*/
.sort{
	width:100%;
	overflow: hidden;
	background: #fff;
	box-shadow:0 0rem 0.2rem 0 rgba(214,214,214,.42);
}
.volume{
	width:81%; 
	line-height: 2.5rem;
}
.volume li{
	float: left;
	width: 25%;
	text-align: center;
	font-size: 0.65rem;
}
.sort-a{
	height: 2.5rem;
	position: relative;
}
.sort-a span{
	float: left;
}
.sort-aa{
	position: absolute;
	left: 0;
	right: 0;
	margin: 0 auto;
	width: 2rem;
}
.volume li img{
	width: 0.6rem;
	vertical-align: middle;
	margin-left: 0.2rem;
}
.view{
	width: 18%;
	padding-right: 0.85rem;
	text-align: center;
}
.view-line{
	width: 100%;
	height: 0.85rem;
	line-height: 0.85rem;
	margin:0.825rem 0;
	border-left: 1px solid #b2b2b2;
	text-align: right;
}
.view img{
	width: 0.85rem;
	vertical-align: middle;
}
.sort-tb{
	width: 0.3rem;
	line-height: 0;
	float: left;
	margin: 1rem 0 1rem 0.3rem;
}
.iocn-top{
	display: inline-block;
	width: 0.4rem;
	height: 0.3rem;
	background:url('../images/top.png') no-repeat;
	background-size: 0.3rem;
}
.iocn-bottom{
	display: inline-block;
	width: 0.4rem;
	height: 0.3rem;
	background:url('../images/bottom.png') no-repeat;
	background-size: 0.3rem;
}
.sort-a.active .iocn-top{
	background:url('../images/toped.png') no-repeat;
	background-size: 0.3rem;
}
.sort-a.active2 .iocn-bottom{
	background:url('../images/bottomed.png') no-repeat;
	background-size: 0.3rem;
}
.sort-a.active em{
	color: #d81e06;
}









/*商品*/
.product{
	background: #f7f7f7;
	padding:0 0.6rem ;
	margin-top: 0.4rem;
}
.product ul{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.product li{
	width: 48.5%;
	background: #fff;
	margin-bottom: 0.4rem;
	border-radius: 0.5rem;
	overflow: hidden;
}
.product-img{
	width: 100%;
	/*height: 7rem;*/
	overflow: hidden;
}
.product-img img{
	width: 100%;
	/*height: 7rem;*/
}
.product-infor{
	line-height: 0.75rem;
	padding: 0.2rem 0.5rem 0.5rem 0.5rem;  
}
.product-tit{
	font-size: 0.6rem;
	line-height: 0.75rem;
	height: 1.5rem;
	overflow : hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
}
.product-amount{
	font-size: 0.65rem;
	color: #f30000;
	margin-top: 0.3rem;
}
.product-amount .car{
	width: 1.1rem;
	margin-top: 0.2rem;
}
.product-amount .discount{
	font-size: 0.4rem;
	margin-top: 0.2rem;
}
.product-amount div{
	width: 80%;
    overflow: hidden;
}
.product-amount div p{
	height: 0.75rem;
	overflow: hidden;
	text-overflow:ellipsis;
	white-space: nowrap;
}
.product-amount .money{
	color: #f30000;
	font-size: 0.65rem;
}
.product-amount del{
	color: #6f6f6f;
	font-size: 0.45rem;
}
.product-amount .money em{
	font-size: 0.36rem;
	font-weight: bold;
}




/*产品横向*/
.transverse {
	background: #fff;
	margin-top: 0.4rem;
	padding: 0;
}
.transverse li{
	width: 100%;
	padding: 0.55rem 0.6rem;
    background: #fff;
    margin-bottom: 0;
}
.transverse li a{
	width: 100%;
	/*display: inline-block;*/
	/*display: flex;*/
}
.transverse .product-img{
	float: left;
	width: 6.85rem;
	height: 6.65rem;
	overflow: hidden;
	border-radius: 0.2rem;
	margin-right: 0.75rem;
}
.transverse .product-img img{
	width: 6.85rem;
	height: 6.65rem;
}
.transverse .product-infor{
	padding: 0;
	margin-right: 1rem;
}
.transverse .product-tit{
	line-height: 1rem;
	height: 2rem;
	margin-top: 0.5rem;
}
.transverse .product-amount{
	line-height: 1rem;
	height: 2rem;
	margin-top: 1.7rem;
}





/*筛选*/
.filter-mask {
    height: 100%;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 998;
    background: rgba(0,0,0,0.5);
    transform: translateX(105%);
    transition: all 0s ease 0;
}
.filter-mask.show {
    transform: translateX(0px);
    transition-delay: 0s;
}

.filter{
	position: fixed;
    width:77%;
    min-width: 14rem;
    height: 100%;
    right: 0;
    top: 0;
    margin: 0;
/*    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);*/
    height: 100%;
    /*height: calc(100% + 60px);*/
    /*height: -moz-calc(100%);*/
    /*padding-bottom: 60px;*/
    background-color: #fff;
    z-index: 999;
    overflow-y: auto;
   /* will-change: transform;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-transform: translateX(105%);*/
    transform: translateX(105%);
    transition:all 0.5s ease 0s;
    border-radius: 0.5rem 0 0 0.5rem;
}
.filter.show{
	transform: translateX(0px);
	transition-delay: 0s;
}
.filter-grade{
	padding:0 0.6rem;
	border-bottom: 0.35rem solid #f6f5f3;
}
.filter-grade-title{
	line-height: 2rem;
	font-size: 0.65rem;
}
.filter-grade-title i{
	float: right;
	padding: 1rem;
	background: url(../images/open.png) no-repeat center center;
    background-size: 0.5rem;
}
.retract .filter-grade-title i{
	background: url(../images/right.png) no-repeat center center;
    background-size: 0.3rem;
}
.retract .filter-grade-body{
	display: none;
}
.filter-grade-body{
	overflow: hidden;
	padding: 0 0 0.25rem 0;
}
.filter-grade-body li{
	width: 30%;
	height: 1.5rem;
	line-height: 1.5rem;
	background: #f6f5f3;
	border-radius: 2rem;
	margin-bottom: 0.55rem;
	margin-left: 5%;
	text-align: center;
	float: left;
	font-size: 0.55rem;
	color: #000000;
	overflow: hidden;
	text-overflow:ellipsis;
	white-space: nowrap;
}
.filter-grade-body li:nth-child(3n+1) {
    margin-left: 0;
}
.filter-grade-body li.filter-active{
	color: #f39700;
	background: #fdeacc;
	border:1px solid #fbd9a3;
}

.filt{
	width: 100%;
	height: 100%;
	position: relative;
}
.filter-btn{
	width: 100%;
	padding: 0.4rem 0.6rem;
	background: #fff;
	display: flex;
	justify-content: space-between;
	overflow: hidden;
	position: absolute;
	bottom: 0;
	left: 0;
}
.filter-btn button{
	width: 48%;
	height: 1.8rem;
	font-size: 0.6rem;
	float: left;
	background: #fff;
	border: 1px solid #7f7f7f;
	border-radius: 2rem;
}
.filter-btn .que{
	background: #f39700;
	color: #fff;
	border:none;
}
.filt .outer{
	overflow-y: scroll;
	width: 100%;
	height: 100%;
	position: absolute;
	padding-top: 0.6rem;
}
.minimum{
	display: flex;
	margin-bottom: 1rem;
}
.minimum input{
	height: 1.45rem;
	text-align: center;
	font-size: 0.55rem;
	border-radius: 2rem;
	background: #f6f5f3;
	width: 48%;
	float: left;
}
.minimum i{
	display: inline-block;
	float: left;
	width: 0.85rem;
	min-width: 0.85rem;
	height: 1.45rem;
	background:url('../images/line.png') no-repeat center center;
	background-size:0.5rem;

}