@charset "utf-8";
/*public css*/

*{ margin: 0; padding:0; }
*,*:before,*:after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box; 
}
html,body{ 
	margin:0; 
	padding:0; 
	width:100%; 
	height:100%; 
	font-size:10px; 
	font-family: "Microsoft YaHei","Segoe UI", "Lucida Grande", Helvetica, Arial,sans-serif; 
	text-size-adjust: none;
}

a{ text-decoration:none;}

header,section,footer,.myheader,.banner,.vrbox,.myfooter,.imgbanner{ width:100%; overflow:hidden; }
.nav-ul,.itmes-box,.product,.cases,.content,.news,.contqy{ width:100%; margin:0 auto; }

body.fixed{ overflow: hidden;}
.bgh{ width: 100%; height: 100%; position: fixed;  left: -1000px; top:0; background: #000; opacity: 0.7; z-index: 9;}
.bgh.opened{ left: 0;}

header {width: 100%; height: 60px; background: #fff; position: fixed; top:0; left:0; z-index:9; }
header .logo{ margin-left: 2%;}
.navtop{ width: 2.5rem; height: 2rem; position: fixed; top: 1.5rem; right: 1rem; z-index: 99;}
.navtop span{ display: block; width: 100%; height: 2px;background: #666; position: absolute; left: 0; -webkit-transition: .4s; -moz-transition: .4s; -ms-transition: .4s; -o-transition: .4s; transition: .4s;}
.navtop span:nth-child(1){ top: 0;}
.navtop span:nth-child(2){ top: 50%; margin-top: -1px;}
.navtop span:nth-child(3){ bottom: 0;}
.navtop_too span:nth-child(1){ -webkit-transform-origin: right; -moz-transform-origin: right; -ms-transform-origin: right; -o-transform-origin: right; transform-origin: right; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(-45deg);}
.navtop_too span:nth-child(2){ opacity: 0;}
.navtop_too span:nth-child(3){ -webkit-transform-origin: right; -moz-transform-origin: right; -ms-transform-origin: right; -o-transform-origin: right; transform-origin: right; -webkit-transform: rotate(-45deg); -moz-transform: rotate(-45deg); -ms-transform: rotate(-45deg); -o-transform: rotate(-45deg); transform: rotate(45deg);}

nav.menu{ width: 100%; height: 100%; position: fixed; right: -1000px; top: 0; z-index:11; width: 100%; overflow: hidden; background: #fff;}
nav.menu.opened{ right: -20%;}
nav.menu ul{ margin: 60px auto; padding: 0; overflow-y: auto; }
nav.menu ul li {
	width: 100%;
	border-bottom: 1px solid #eee;
	font-size: 1.6rem;
	line-height: 50px;
	color: #666;
	padding-left: 20px;
}
nav.menu ul li a { color: #666;}


.myfooter{ width: 100%; margin:0;}
.myfooter .botnav{ width: 100%; background:#3665ff; color: #fff; text-align: center; overflow: hidden; position: fixed; bottom: 0; z-index: 999;}
.myfooter .botnav ul{ width: 100%; padding: 0;}
.myfooter .botnav ul li{ width: 50%;float: left; list-style: none; text-align: center; padding: 2px 0;}
.myfooter .botnav ul li img{ width: 30px; height: 30px;}
.myfooter .botnav ul li p{ font-size: 1.5rem; margin:0;}
.myfooter .botnav ul li a{ color: #fff;}

.telph{ display: none; width: 40px; height: 40px; position: fixed; right: .1rem; bottom: 100px; z-index: 9; background:#3665ff; border-radius: 30px; opacity: .8; -webkit-opacity: .8;}
.telph img{ width: 100%; height: 100%; }

.gray{ background:#f6f6f6;}
.clearfloat:after{ display:block; content:""; visibility:inherit; clear:both;}
.clearfloat{ zoom:1;}

/* Clearfix hack by Nicolas Gallagher: http://nicolasgallagher.com/micro-clearfix-hack/ */
.clearfix:before,
.clearfix:after {
	content: " ";
	display: table;
}

.clearfix:after {
	clear: both;
}

a,.bgh,nav.menu{ -webkit-transition: .4s; -moz-transition: .4s; -ms-transition: .4s; -o-transition: .4s; transition: .4s; text-decoration:none;}
div,p{ cursor:default;}
a p{ cursor:pointer;}