*,
*::before,
*::after{
	-webkit-box-sizing:border-box;
	-moz-box-sizing:border-box;
	box-sizing:border-box;
}
body{	
	font-family:"Microsoft YaHei",微软雅黑;
}

a{display:block;width:100%;height:100%;}

.menu-opener, .menu-opener:hover, .menu-opener.active, .menu-opener-inner, .menu-opener-inner::before, .menu-opener-inner::after, .menu, .menu.active,.menu-inner{
	-webkit-transition:500ms height;
	-o-transition:500ms height;
	transition:500ms height;
}

.menu-opener{
	cursor:pointer;
	height:30px;
	position:absolute;
	top:2%;
	right:3%;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
	width:25px;
}
.menu-opener:hover, .menu-opener.active{}

.menu-opener-inner{
	background:#2a93eb;
	height:2px;
	margin: 5px auto ;
	width:100%;
	position: relative;
}
.menu-opener-inner::before, .menu-opener-inner::after{
	background:#2a93eb;
	content:'';
	display:block;
	height:2px;
	width:100%;
	margin-top: 3px;
}
.menu-opener-inner::before{
	-webkit-transform:translateY(-0.75rem);
	-ms-transform:translateY(-0.75rem);
	transform:translateY(-0.75rem);
	position: absolute;
	top: -2px;
}
.menu-opener-inner::after{
	-webkit-transform:translateY(0.25rem);
	-ms-transform:translateY(0.25rem);
	transform:translateY(0.25rem);
	position: absolute;
	top: 2px;
}
.menu-opener-inner.active{background:transparent;}
.menu-opener-inner.active::before{
	-webkit-transform:translateY(-0.1rem) rotate(-45deg);
	-ms-transform:translateY(-0.1rem) rotate(-45deg);
	transform:translateY(-0.1rem) rotate(-45deg);
}
.menu-opener-inner.active::after{
	-webkit-transform:translateY(-0.4rem) translateX(0rem) rotate(45deg);
	-ms-transform:translateY(-0.4rem) translateX(0rem) rotate(45deg);
	transform:translateY(-0.4rem) translateX(0rem) rotate(45deg);
}
.menu{
	background:#fafafa;
	color:#666666;
	height:0px;
	-webkit-user-select:none;
	-moz-user-select:none;
	-ms-user-select:none;
	user-select:none;
	width:0rem;
	z-index:-1;
	opacity: 0;
}
.menu.active{
	width:-webkit-calc(100% - 0rem);
	width:calc(100% - 0rem);
	opacity: 1;height:240px;
}
.menu.active .menu-link{color:#666666;}
.menu-inner{
	height:100%;
	list-style-type:none;
	margin:0;
	padding:0;
}
.menu-link{
	font-size:1.6rem;
	height:40px;
	text-align:center;
	text-decoration:none;
}
.menu-link span:hover{background: #2a93eb;color: #FFFFFF;}
.menu-on{background: #2a93eb;}
.menu-on span{color: #FFFFFF;}
.menu-link span{margin:auto;display:block;height: 40px;line-height: 40px;}

