@charset "utf-8";
/* CSS Document */

html {font-size:62.5%;}
body, h1, h2, h3, h4, h5, h6, hr, p,blockquote,dl, dt, dd, ul, ol, li,pre,
form, fieldset, legend, button, input, textarea,
th, td,img{border:medium none;margin: 0;padding: 0;list-style-type: none;}

body,button, input, select, textarea {font: 12px/1.5 '微软雅黑',tahoma, Srial, helvetica, sans-serif;}
h1, h2, h3, h4, h5, h6 { font-size: 100%; }

#header em{font-style:normal;}
#header ul,#header ol{ list-style: none; }
#header a { text-decoration: none; }
#header a:hover { text-decoration: none;  }
body,.ui-overlay-h{margin:0 auto;position:relative;background:#fff;}
#header input, img {vertical-align: middle;}
body,html{margin:0 auto;}
#header img {border:0 none;vertical-align:top;}
* {margin:0;padding:0;text-shadow:none;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}
#header .blank{height:8px;clear:both;}
#header .blank20{height:20px;clear:both;}
#header .clearfix:after,#header .clear:before{
	display:table;
	content:'';
	}
#header .clearfix:after{
	clear:both;
	overflow:hidden;
	}
#header .clearfix{
	zoom:1;
	}
#header .relative {position:relative;}
#header .absolute {position:absolute;}
#header .float_left {float:left;}
#header .float_right {float:right;}



#header {
	width: 100%;
	min-width: 320px;
	height: 60px;
	background-color: #ffffff;
	position: relative
}

#header .showMenu {
	left: 3%;
	top: 50%;
	display: block;
	width: 40px;
	height: 40px;
	margin-top: -20px;
	z-index: 1001;
}
#header .showMenu a {
	display: block;
	width: 40px;
	height: 40px;
	position: relative;
	outline: none;
}

/**/
.showMenu a:before, .showMenu a:after {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	height: 8px;
	width: 100%;
	z-index: -1;
	
	
	-moz-transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	background-color: #6a7380;
	margin-top: -4px;
}
.showMenu a:before {
	-moz-transform: translateY(-10px);
	-o-transform: translateY(-10px);
	-ms-transform: translateY(-10px);
	-webkit-transform: translateY(-10px);
	transform: translateY(-10px);
}
.showMenu a:after {
	-moz-transform: translateY(10px);
	-o-transform: translateY(10px);
	-ms-transform: translateY(10px);
	-webkit-transform: translateY(10px);
	transform: translateY(10px);
}
.hideMenu a:before {
	-moz-transform: rotate(90deg) rotate(45deg);
	-o-transform: rotate(90deg) rotate(45deg);
	-ms-transform: rotate(90deg) rotate(45deg);
	-webkit-transform: rotate(90deg) rotate(45deg);
	transform: rotate(90deg) rotate(45deg);
}
.hideMenu a:after {
	-moz-transform: rotate(90deg) rotate(-45deg);
	-o-transform: rotate(90deg) rotate(-45deg);
	-ms-transform: rotate(90deg) rotate(-45deg);
	-webkit-transform: rotate(90deg) rotate(-45deg);
	transform: rotate(90deg) rotate(-45deg);
}


#header .logo {
	display:block;
	left: 25%;
	/* top: 25%; */
	display: block;
	width: 80%;
	height: 60px;
	/* margin-left: -159px; */
	/* margin-top: -21px; */
	background: url(../images/logo.png) no-repeat;
}
#header .topTell {
	right: 3%;
	top: 50%;
	display: block;
	width: 47px;
	height: 47px;
	margin-left: -23px;
	margin-top: -23px;
	background: url(../images/top_tell.png) no-repeat;
}
#header .shake {-webkit-animation:shake 0.2s ease-in-out  6  alternate;-moz-animation:shake 0.2s ease-in-out  6  alternate;-o-animation:shake 0.2s ease-in-out  6  alternate;animation:shake 0.2s ease-in-out  6  alternate;}

@-webkit-keyframes shake{
	0% {
		-moz-transform:rotate(8deg);
		-webkit-transform:rotate(8deg);
		transform:rotate(8deg);
		}
	100% {
		-moz-transform:rotate(-8deg);
		-webkit-transform:rotate(-8deg);
		transform:rotate(-8deg);
		}
	}
@-moz-keyframes shake {
		0% {
		-moz-transform:rotate(8deg);
		-webkit-transform:rotate(8deg);
		transform:rotate(8deg);
		}
	100% {
		-moz-transform:rotate(-8deg);
		-webkit-transform:rotate(-8deg);
		transform:rotate(-8deg);
		}
	}
@-o-keyframes shake {
		0% {
		-moz-transform:rotate(8deg);
		-webkit-transform:rotate(8deg);
		transform:rotate(8deg);
		}
	100% {
		-moz-transform:rotate(-8deg);
		-webkit-transform:rotate(-8deg);
		transform:rotate(-8deg);
		}
	}
@keyframes shake {
		0% {
		-moz-transform:rotate(8deg);
		-webkit-transform:rotate(8deg);
		transform:rotate(8deg);
		}
	100% {
		-moz-transform:rotate(-8deg);
		-webkit-transform:rotate(-8deg);
		transform:rotate(-8deg);
		}
	}

#header .menulist {width:100%;}
#header .menulist h3 {wdith:100%;height:80px;font-size:30px;color:#fff;font-weight:500;padding-top:20px;padding-left:22px;}
#header .menulist ul {width:100%;border-bottom:1px solid #6a7380;}
#header .menulist ul li {width:100%;float:left;height:78px;overflow:hidden;line-height:78px;font-size:26px;text-align:center;color:#9097a0;border-top:1px solid #6a7380;}
#header .menulist ul li a {display:block;float:left;height:78px;color:#9097a0;border-right:1px solid #6a7380;border-right:1px solid #6a7380;}
#header .menulist ul li a:nth-child(4n) {border-right:none}
#header .popMenu {display:none;}
#header .menulists {position:absolute;width:100%;}
#header .menuBtn {width:100%;height:80px;line-height:80px;text-align:center;font-size:26px;color:#424b59; background-color:#242c37;cursor:pointer;position:relative; -webkit-perspective: 1200px;
    -moz-perspective: 1200px;
    -ms-perspective: 1200px;
    -o-perspective: 1200px;
    perspective: 1200px;
	-webkit-transform-style: preserve-3d;
    -moz-transform-style: preserve-3d;
    -ms-transform-style: preserve-3d;
    -o-transform-style: preserve-3d;
    transform-style: preserve-3d;}
#header .menuBtn span {display:inline-block; font-size:1.5rem;color:#fff;font-weight:bold;}
#header .menuBtn.active i {-moz-transform:rotateX(180deg);-webkit-transform:rotateX(180deg);transform:rotateX(180deg);}
#header .menuBtn i {position:absolute;left:50%;top:50%;margin-top:-3px;margin-left:60px;display:block;width:17px;height:12px; background:url(../images/down.png) no-repeat;-moz-transition:all 0.6s linear 0s;-webkit-transition:all 0.6s linear 0s;transition:all 0.6s linear 0s;}
#header .call_number {display:block;width:97%;margin:20px auto;}
#header .address_info {width:100%;height:306px; background:url(../images/addressbg.png) no-repeat center; -moz-background-size:100% 100%;-webkit-background-size:100% 100%;background-size:100% 100%;margin:20px auto;}
#header .address_pic1 {left:0;top:66px;width:280px;height:190px; background:url(../images/address_pic1.png) no-repeat;}
#header .address_pic2 {right:54px;top:56px;width:342px;height:134px; background:url(../images/address_pic2.png) no-repeat;}
#header .address_online {right:209px;top:200px;width:187px;height:64px; background:url(../images/hmap.png) no-repeat;}
#header .hAbout {right:10px;top:200px;width:187px;height:64px; background:url(../images/habout.png) no-repeat;}
#header .copyRight {width:100%;margin:0 auto 160px;}
#header .copyRight p {font-size:24px;color:#babdc1;text-align:center;overflow:hidden;}
#header .copyRight p:nth-child(n+2){font-size:14px;}
#header .copyRight p span {width:100%;display:inline-block;margin:0 auto;}
#header .scrollTop { position:fixed; bottom:116px; right:0; width:13%; }


 @media screen and (min-width:320px) and (max-width:900px) {
#header {
	height: 60px;
}

#header .showMenu {
	width: 24px;
	height: 24px;
	margin-top: -12px;
	--moz-background-size:100% 100%;
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%;
}
#header .showMenu a {
	width: 24px;
	height: 24px;
}
#header .showMenu a {
	display: block;
	width: 24px;
	height: 24px;
	position: relative;
}
#header .showMenu a:before, .showMenu a:after {
/*	background:url(../images/close_sm.png) no-repeat center center;*/
	
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	height: 4px;
	width: 100%;
	z-index: -1;
	
	-moz-transition: all 0.3s ease 0s;
	-o-transition: all 0.3s ease 0s;
	-webkit-transition: all 0.3s ease 0s;
	transition: all 0.3s ease 0s;
	background-color: #6a7380;
	margin-top: -2px;
	
}
#header .showMenu a:before {
	-moz-transform: translateY(-5px);
	-o-transform: translateY(-5px);
	-ms-transform: translateY(-5px);
	-webkit-transform: translateY(-5px);
	transform: translateY(-5px);
}
#header .showMenu a:after {
	-moz-transform: translateY(5px);
	-o-transform: translateY(5px);
	-ms-transform: translateY(5px);
	-webkit-transform: translateY(5px);
	transform: translateY(5px);
}
#header .hideMenu a:before {
	-moz-transform: rotate(90deg) rotate(45deg);
	-o-transform: rotate(90deg) rotate(45deg);
	-ms-transform: rotate(90deg) rotate(45deg);
	-webkit-transform: rotate(90deg) rotate(45deg);
	transform: rotate(90deg) rotate(45deg);
}
#header .hideMenu a:after {
	-moz-transform: rotate(90deg) rotate(-45deg);
	-o-transform: rotate(90deg) rotate(-45deg);
	-ms-transform: rotate(90deg) rotate(-45deg);
	-webkit-transform: rotate(90deg) rotate(-45deg);
	transform: rotate(90deg) rotate(-45deg);
}
#header .logo {
	width: 80%;
	height: 60px;

	left:25%;
	margin-left:-40px;
	-moz-background-size: 100% 100%;
	-webkit-background-size: 100% 100%;
	background-size: auto 100%;
	background-position:center center;
}
#header .topTell {
	width: 24px;
	height: 24px;
	margin-top: -12px;
	-moz-background-size: 100% 100%;
	-webkit-background-size: 100% 100%;
	background-size: 100% 100%;
}
#header .menulist h3 {height:40px;font-size:15px;padding-left:11px;padding-top:10px;}
#header .menulist ul li {height:39px;font-size:13px;line-height:39px;}
#header .menuBtn {height:40px;line-height:40px;font-size:13px;}
#header .menuBtn i {width:9px;height:6px;margin-left:30px;-moz-background-size:100% 100%;-webkit-background-size:100% 100%;background-size:100% 100%;}
#header .address_info {width:100%;height:153px;}
#header .address_pic1 {top:33px;width:140px;height:95px;-moz-background-size:100% 100%;-webkit-background-size:100% 100%;background-size:100% 100%;}
#header .address_pic2 {right:28px;top:28px;width:171px;height:67px;-moz-background-size:100% 100%;-webkit-background-size:100% 100%;background-size:100% 100%;}
#header .address_online {right:105px;top:100px;width:94px;height:32px;-moz-background-size:100% 100%;-webkit-background-size:100% 100%;background-size:100% 100%;}
#header .hAbout {right:6px;top:100px;width:94px;height:32px;-moz-background-size:100% 100%;-webkit-background-size:100% 100%;background-size:100% 100%;}
		.sea_btn {
			display: flex;
			justify-content: center;
			background:#ffe4db;
		}
		.sea_btn a {
			width: 60%;
			background-color: #b92823;
			padding: 5px 10px;
			text-align: center;
			border-radius: 15px;
			font-size: 2rem;
			margin: 10px 0;
			color: white
		}
#header .copyRight {width:100%;margin:0 auto 80px;}
}


@media screen and (min-width:360px) and (max-width:409px){
		#header .address_info {height:172px;}
		#header .address_pic1 {width:156px;height:106px;top:36px;}
		#header .address_pic2 {right:21px;width:192px;height:75px;top:31px;}
		#header .address_online {right:118px;width:105px;height:35px;top:112px;}
		#header .hAbout { width:105px;height:35px;top:112px;}
		#header .copyRight {margin-bottom:89px;}
	}
@media screen and (min-width:410px) and (max-width:900px){
		#header .address_info {height:196px;}
		#header .address_pic1 {width:179px;height:121px;top:42px;}
		#header .address_pic2 {right:20px;width:218px;height:85px;top:35px;}
		#header .address_online {right:126px; width:112px;height:40px;top:128px;}
		#header .hAbout { right:7px; width:112px;height:40px;top:128px;}
		#header .copyRight {margin-bottom:96px;}
	}