@charset "utf-8";
html{ font-size: 62.5%; }
/*html body, header {max-width: 750px;margin: 0 auto; font-size: 1.6rem;}*/
html body, header {font-size: 1.6rem;}
/* 背景色*/
.bg-gray{ background-color: #f2f2f2; }
.bg-white{ background-color: #fff; }
.bg-purple{ background-color: #7300ab;}

.top-fixed{ position: fixed; top: 0; width: 100%; z-index: 99999;max-width: 750px;}
.fixed-roll{ position: sticky; position: -webkit-sticky; top: 0;z-index: 2;}

.line{ background-color: #eaeaea; height: 0.5rem;}

/* 响应式图片*/
.img-responsive{ display: block; max-width: 100%; height: auto; }
.index-cont{
	max-width: 750px;margin: 0 auto;
}
.index-top .banner img{
/*	width:1902px;*/
	width:100%;
}
.index-top .banner{
	width:100%;
}
@media screen and (max-width: 750px){
	.index-top{
		max-width:750px
	}
	.index-top .banner img{width:100%;max-width: 750px}
}
body{
	background: #e2eafa;
}
/* 头部*/
.search-box{ display: flex; width: 100%; padding: 2% 0;}
.search-box .search-input{ align-self: center; width: 63%; margin: 0 1%; position: relative;}
.search-box .search-input input{ width: 100%;border-radius: 1.5rem; text-indent: 2rem;  font-size: 1.6rem;}
.search-box .search-icon01{ width: 25%; margin-left: 1%; background: url("../images/icon/logo.png") no-repeat; background-size: 100% 100%;}
.search-box .search-icon01 a, .search-box .search-login a{ display: inline-block; width: 100%; height: 100%;}
.search-box .search-icon02{ position:absolute; top:0.4rem;left:2%;}
.search-box .search-icon02 img{ height: 2rem; display: block;}
.search-box .search-login{ width: 8%; background: url("../images/icon/search-user.svg") no-repeat; background-size: 100% 100%;}
.search-box .search-input .layui-input{ height: 32px;}

/* 登录*/
.login .logo{ width: 8rem; height:10rem; margin: 8rem auto 1.5rem;}
.login .logo img{ width: 100%; height: 100%;}
.login .form{ margin: 2.5rem auto 2rem; width: 90%;}
.login .form input{ border-width: 0 0 1px 0; padding: 0.8rem; }
.login .form .layui-form-item{ position: relative;}
.login .form .code{ border-left: 0.2rem solid #e6e6e6; display: inline-block; height: 2rem; line-height: 2rem; padding: 0 0.8rem; position: absolute; right: 0; top: 0.8rem;}

.login .btn-area{ margin: 2rem 0;}
.login .btn-area button{ background-color: #f42f2f; border-radius: 5rem; width: 100%; opacity: .5;}
.login .hint{ margin-top: 2rem; font-size: 1.2rem; color: #737373; margin: 0 auto; width: 90%;}

/*头部*/
.header{position:relative;width:100%;height:4rem; line-height: 4rem; background:#fff;border-bottom:1px solid #e0e0e0;}
.header h1{font-size:1.6rem;color:#333;display:block;text-align:center;}
.header a{position: absolute;top:0;display:block;height:4rem;line-height:4rem;}
.header a.back{left:0.8rem;}
.header a.back span{display:inline-block;width:2.5rem;height:2.5rem;margin:0.8rem 0.5rem;}
.header a.icon-home{ right: 0.8rem; }

/* 复选*/
input[type="checkbox"]{-webkit-appearance:none;outline: none;}
input.check{background:url(../images/icon/radio_none.png) no-repeat center left;background-size:2rem 2rem;position:absolute;top:50%;left:0.8rem;margin-top:-1.8rem;width:2rem;height:3.5rem;}
input.check:checked{background:url(../images/icon/radio_show.png) no-repeat center left;background-size:2rem 2rem;}
input.goodsCheck:checked{background:url(../images/icon/radio_show.png) no-repeat center left;background-size:2rem 2rem;}
input.check:checked{background:url(../images/icon/radio_show.png) no-repeat center left;background-size:2rem 2rem;}
.checked{background:url(../images/icon/radio_show.png) no-repeat left center;background-size:2rem 2rem;position:absolute;top:50%;left:1.5rem;margin-top:-1.8rem;width:2rem;height:3.5rem;}

/* 计算*/
.shop-arithmetic{ width:9rem; box-sizing:border-box; white-space:nowrap; border:1px solid #e0e0e0; border-radius: 0.2rem; height: 3rem; line-height: 3rem; display: flex; justify-content: space-between; align-items: center; align-self: center;}
.shop-arithmetic a{display:inline-block;width:2.5rem;height:2.5rem; line-height:2.5rem; text-align:center;}
.shop-arithmetic .minus{border-right:1px solid #e0e0e0;}
.shop-arithmetic .failed{color:#d1d1d1;}
.shop-arithmetic .plus{border-left:1px solid #e0e0e0;}
.shop-arithmetic .num{width:10rem;text-align:center;border:none;display: inline-block; box-sizing:border-box;vertical-align:top;margin:0 -0.6rem;}

/* 脚注*/
.footer{ padding-bottom: 4.8rem;}
.footer ul{ border-top: 1px solid #e5e5e5; border-bottom: 1px solid #e5e5e5; box-sizing: border-box; display: flex; justify-content: center; padding: 3% 5%; width: 100%;}
.footer ul li{ width: 22%; float: left; text-align: center; padding: 0 0.5rem; position: relative;}
.footer ul li:after{ content: ""; display: inline-block; height: 70%; width: 1px; background-color: #d7d7d7; position: absolute; right: 0; top: 15%;}
.footer ul li:last-child:after{ width: 0; }
.footer .copy{ text-align: center; }
.footer .copy p, .footer .copy p a{ font-size: 1.2rem; color: #848689; padding: 0.5rem 0; }

/* 底部导航*/
.footerBar{ position: fixed; bottom: 0; border-top: 1px solid #d6d6d6; display: inline-block; font-size: 1.4rem; width: 100%; max-width: 750px;}
.footerBar a{ width: 25%; float: left; text-align: center; padding: 0.3rem 0;}
.footerBar span{ color: #3d3d3d; display: block;}
.footerBar .selected{ color: #7300ab;}
.footerBar .icon{ width: 2rem; height: 2rem; margin: 0 auto;}
.footerBar .icon-home{ background: url(../images/icon/index.png) no-repeat; background-size: 100%;}
.footerBar .icon-list{ background: url(../images/icon/list.png) no-repeat; background-size: 100%; }
.footerBar .icon-brand{ background: url(../images/icon/brand.png) no-repeat; background-size: 100%;}
.footerBar .icon-user{ background: url(../images/icon/user.png) no-repeat; background-size: 100%;}

.footerBar .icon-home-selectd{ background: url(../images/icon/index-selected.png) no-repeat; background-size: 100%;}
.footerBar .icon-list-selectd{ background: url(../images/icon/list-selected.png) no-repeat; background-size: 100%;}
.footerBar .icon-brand-selectd{ background: url(../images/icon/brand-selected.png) no-repeat; background-size: 100%;}
.footerBar .icon-user-selectd{ background: url(../images/icon/user-selected.png) no-repeat; background-size: 100%;}

/* 商品列表标题*/
.goods{ padding: 0.8rem;}
.goods .goods-tit{ text-align: center; padding:0.5rem 0.5rem 0.8rem; display: flex; justify-content: center; align-items: center;}
.goods .goods-tit.big-tit{ color: #2e2e2e; font-size: 1.8rem; font-weight: bold; }
.goods .goods-tit.small-tit{ color: #4f4f4f; font-size: 1.4rem; }
.goods .goods-tit .string{ display: inline-block; width: 2rem; margin: 0 0.8rem;}
.goods .goods-tit.big-tit .string{ background-color: #2e2e2e; height: 0.2rem; }
.goods .goods-tit.small-tit .string{ background-color: #eaeaea; height: 1px; }

/* 商品列表-2列*/
.goods-col .content{ width: 100%;}
.goods-col .list{ background-color: #fff; border-radius: 0.4rem; width: 48%; margin: 1%; display: inline-block;}
.goods-col .list:nth-child(odd) { margin-left: 0; }
.goods-col .list:nth-child(even){ margin-right: 0; }
.goods-col .list .pic{ width: 100%;}
.goods-col .list .pic img{ border-radius: 0.4rem 0.4rem 0 0; width: 100%;}
.goods-col .list .text{ padding: 0 0.8rem;}
.goods-col .list .text div{ margin: 0.5rem 0;}
.goods-col .list .caption{ font-size: 1.4rem; height: 3.7rem; line-height: 1.85rem; text-overflow: -o-ellipsis-lastline; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical;}
.goods-col .list .tag{ white-space: nowrap; overflow: hidden;}
.goods-col .list .tag span{ border: 1px dotted #f42f2f; border-radius:0.4rem; color: #f42f2f; display: inline-block; font-size: 1.2rem; padding: 0 0.2rem; margin-right: 0.3rem;}
.goods-col .list .price{ display: flex; align-items: center; padding: 0.5rem 0;}
.goods-col .list .price .p1{ color: #f42f2f; font-size: 1.6rem; flex: 1;}
.goods-col .list .price .p2{ color: #bdbdbd; font-size: 1.2rem; text-decoration:line-through; padding-left: 0.5rem;}

/* 404页面*/
.page-404{ color: #939393; margin:10rem auto 0; text-align:center; width: 70%;}
.page-404 i{ font-size: 25rem;}
.page-404 .t1{ font-size:1.7rem; color:#111; margin:0.2rem 0;}
.page-404 .t2{ display: flex; justify-content: space-between; margin-top: 3rem;}
.page-404 .t2 a{ border: 1px solid #e0e0e0; border-radius: 0.5rem; padding:0.5rem 2rem}