:root{
	--red: #DA251D;
	--yellow: #FFAF37;
	--blue: #0A86EA;
	--dark-blue: #0668b7;

	--light-border: #ddd;

	--light-box-shadow: 0 .1em .3em rgba(0, 0, 0, .1);
	--medium-box-shadow: 0 0 1em rgba(0, 0, 0, .1);

}

html,body{
	font-family:"微软雅黑";

}
input[type="text"],input[type="tel"],input[type="number"],input[type="email"],select{
	-webkit-appearance:none;
	-moz-appearance:none;
	appearance:none;
}

a:hover,a:focus{
	text-decoration:none;
}
.true-body{
	margin: 50px 0;
	overflow: hidden;
}
.top-bar{
	position:fixed;
	top:0px;
	background:#FEFEFE;
	height:50px;
	width:100%;
	z-index:999;
	-webkit-box-shadow:0px 1px 2px rgba(120,120,120,.3);
	box-shadow:0px 1px 2px rgba(120,120,120,.3);
}
.top-bar img{
	margin-top: 0px;
    margin-left: 15px;
}

.search-block{
	margin-top:1rem;
	width:100%;
	border-radius:3px;
	background-color:#FFFFFF;
}
.search-block input{
	border-radius:3px;
}
.search-menu{
	bottom:-100vh;
	z-index:1000000000;
}
.search-menu-open{
	bottom:0vh;
}


.top-arrow{
	position:fixed;
	top:24px;
	right:22px;
	display:block;
	width:10px;
	height:10px;
	border-left:2px #484848 solid;
	border-bottom:2px #484848 solid;
	-webkit-transition:all 400ms cubic-bezier(0.86, 0, 0.07, 1);
	-o-transition:all 400ms cubic-bezier(0.86, 0, 0.07, 1);
	transition:all 400ms cubic-bezier(0.86, 0, 0.07, 1);
	-webkit-transform:rotate(-45deg);
	-ms-transform:rotate(-45deg);
	-o-transform:rotate(-45deg);
	transform:rotate(-45deg);
}
.top-arrow-open{
	-webkit-transform:rotate(135deg);
	-ms-transform:rotate(135deg);
	-o-transform:rotate(135deg);
	transform:rotate(135deg);
}
.menu,.search-menu{
	position:fixed;
	left:0px;
	width:100%;
	height:100%;
	padding:20px;
	background:#FFFFFF;
	font-size:18px;
	-webkit-transition-property:top,bottom;
	-o-transition-property:top,bottom;
	transition-property:top,bottom;
	-webkit-transition-duration:400ms;
	-o-transition-duration:400ms;
	transition-duration:400ms;
	-webkit-transition-timing-function:cubic-bezier(0.86, 0, 0.07, 1);
	-o-transition-timing-function:cubic-bezier(0.86, 0, 0.07, 1);
	transition-timing-function:cubic-bezier(0.86, 0, 0.07, 1);
	-webkit-transform:transition3d(0,0,0);
	-ms-transform:transition3d(0,0,0);
	-o-transform:transition3d(0,0,0);
	transform:transition3d(0,0,0);
}
.menu{
	overflow:auto;
	top:-100vh;
	padding-top:80px;
	z-index:999999;
}
.menu-open{
	top:0px;
}
.menu a{
	float:left;
	display:block;
	width:100%;
	height:48px;
	line-height:48px;
	color:#484848;
}
.menu-line{
	float:left;
	width:100%;
	margin:16px 0;
	border-bottom:1px #DBDBDB solid;
}
.close-icon{
	position:relative;
	display:block;
	height:20px;
	width:20px;
}
.close-icon span{
	display:block;
	position:absolute;
	top:9px;
	width:20px;
	height:2px;
	background:#333333;
}
.close-icon-x{
	-webkit-transform:rotate(45deg);
	-ms-transform:rotate(45deg);
	-o-transform:rotate(45deg);
	transform:rotate(45deg);
}
.close-icon-y{
	-webkit-transform:rotate(315deg);
	-ms-transform:rotate(315deg);
	-o-transform:rotate(315deg);
	transform:rotate(315deg);
}
.search-text .input-group{
	margin-top:20px;
	border:#EBEBEB 1px solid;
	border-radius:3px;
}

.input-group{
	width:100%;
}
.input-group input{
	width:100%;
	height:36px;
	line-height:36px;
	padding:10px 0;
	padding-left:10px;
	padding-right:16px;
	border:1px #FFFFFF solid;
	font-size:16px;
	color:#484848;
	outline:none;

}
.input-group label{
	display:block;
	position:absolute;
	top:8px;
	right:10px;
}
.input-group label img{
	width:20px;
}

.search-body{
	height:calc(100% - 78px);
	overflow:auto;
}
.search-label,.search-hot{
	margin-top:20px;
	font-size:14px;
	color:#0A86EA;
}
.search-label .search-title,.search-hot .search-title{
	font-weight:bold;
}
.search-label-list,.search-hot-list,.search-category-list{
	overflow:hidden;
}
.search-label-list a,.search-category-list a{
	float:left;
	margin:10px 10px 0 0;
	padding:5px;
	border-radius:3px;
	color:#333333;
	background:#EBEBEB;
}
.search-hot-item{
	float:left;
	width:calc(50% - 5px);
	height:100px;
	margin-top:10px;
	border-radius:3px;
	background-size:cover;
	background-position:center;
	background-repeat:no-repeat;
}
.search-hot-item:nth-child(even){
	margin-left:10px;
}
.search-hot-item a{
	display:block;
	width:100%;
	height:100%;
	line-height:100px;
	border-radius:3px;
	font-size:24px;
	text-align:center;
	color:#FFFFFF;
	background-color:rgba(0,0,0,.3);
}
.about-me{
	position:fixed;
	left:0px;
	bottom:0px;
	width:100%;
	height:50px;
	background:#0a86ea;
	z-index:99999;
}
.about-me-back{
	display:block;
	position:absolute;
	left:10px;
	top:5px;
	width:auto;
	height:40px;
	line-height:40px;
	font-size:18px;
	color:#FFFFFF;
}
.about-me-back:focus,.about-me-back:active,.about-me-back:visited{
	color:#FFFFFF;
}
.about-me-img{
	position:absolute;
	right:10px;
	top:5px;
	width:40px;
	height:40px;
	border:2px #FFFFFF solid;
	border-radius:40px;
	background-position:center;
	background-size:cover; 
}
.about-me-name{
	position:absolute;
	right:55px;
	top:5px;
	height:40px;
	line-height:20px;
	color:#FFFFFF;
}

.shop-about-me{
	border-top:1px #eeeeee solid;
	position:fixed;
	left:0px;
	bottom:0px;
	width:100%;
	height:50px;
	background:white;
	z-index:99999;
}

/* 通用标题样式 */
.page-title{
    margin-top: 0;
    margin-bottom: 1.5em;
	font-size: 1.25em;
	text-align: center;
	position: relative;
}
.page-title:after{
	content: "";
	background: var(--blue);
	height: 2px;
	width: 2em;
	display: block;
	margin: auto;
	margin-top: .5em;
}

/* 通用颜色设定 */
.text-red{
	color: var(--red);
}
.text-yellow{
	color: var(--yellow);
}
.text-blue{
	color: var(--blue);
}