/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section, main {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
a{ list-style:none;text-decoration:none;font:inherit; }

html{font-size:10px}
@media screen and (min-width:321px) and (max-width:375px){html{font-size:11px}}
@media screen and (min-width:376px) and (max-width:414px){html{font-size:12px}}
@media screen and (min-width:415px) and (max-width:639px){html{font-size:15px}}
@media screen and (min-width:640px) and (max-width:719px){html{font-size:20px}}
@media screen and (min-width:720px) and (max-width:749px){html{font-size:22.5px}}
@media screen and (min-width:750px) and (max-width:799px){html{font-size:23.5px}}
@media screen and (min-width:800px){html{font-size:25px}}


header{ position:fixed;top:0;left:0;width:100%;height:85px;background:rgba(255,255,255,0.6);z-index:99; }
header .logo{ float:left;height:45px;margin:20px 0;margin-left:50px; }
header .logo img{ height:45px !important; }
header nav{float:right;height:35px;margin: 25px 20px 25px 0;overflow: visible;}
header nav ul li a{ font-size:0.65rem;color:#545454; }
header nav ul{ float:right; }
header nav li{ float:left;height:35px;line-height:35px;margin: 0 5px;padding:0 10px;position:relative;text-align:center;overflow:visible;}
header nav li:before{ content:"";display:block;width:calc(100% - 20px);height:0;border-bottom:2px solid rgba(0,0,0,0);position:absolute;left:10px;bottom: -5px; }
header nav li a.nav{}
header nav li a span{}
header nav li dl{width: calc(100% + 20px);height:0;margin-left: -10px;overflow:hidden;}
header nav li dl dd{background: rgba(255,255,255,0.6);overflow: hidden;padding: 0 10px;position:relative;}
header nav li dl dd:before{content:"";display:block;width:calc(100% - 20px);height:0;border-bottom: 1px dotted #e5ddd3;position:absolute;left:10px;bottom:0;}
header nav li dl dd:last-child:before{ display:none; }
header nav li dl dd:last-child{ padding-bottom:15px; }
header nav li dl dd:first-child{ padding-top:15px; }
header nav li dl dd a{ font-size: 0.6rem; }
header nav li dl dd:hover a{ color:#bb3c3c;; }
header nav li:hover{ background:url(../img/hover_nav.jpg) center center; }
header nav li:hover a.nav{ color:#FFF; }
header nav li:hover dl{ height:380px;transition:all 1s;padding:10px 0;  }
header nav li.navdown a{ color:#0f8eb2; }
header nav li.navdown:before{border-bottom: 2px solid #0f8eb2;}
header nav li.navdown a.nav{ }
header nav li.navdown dl{}
header .lang { float: right;margin: 28px 20px 25px 0; }
header .lang span{ display:none; }
header .lang a{ color: #0e8cb4;display:none; }
header .lang a:last-of-type{ display:block;font-size: 16px;line-height: 35px;padding-left:35px; background:url(../img/earth.png)no-repeat center left;background-size:22px 22px; }


.bottomNav{ display:none }
.menu-button { position: fixed; top: 10px; right: 10px; padding: 15px; cursor: pointer;display:none;  }
.menu-button.cross{ -webkit-transform:translateX(-280px);transform:translateX(-280px); }
.menu-button .bar:nth-of-type(1) { margin-top: 0px; }
.menu-button .bar:nth-of-type(3) { margin-bottom: 0px; }
.bar{ position: relative;display: block;width: 50px;height: 5px;margin: 10px auto;background-color: #0d90af;border-radius: 10px;-webkit-transition: .3s;transition: .3s; }
.menu-button:hover .bar:nth-of-type(1) { -webkit-transform: translateY(1.5px) rotate(-4.5deg); -ms-transform: translateY(1.5px) rotate(-4.5deg); transform: translateY(1.5px) rotate(-4.5deg); }
.menu-button:hover .bar:nth-of-type(2) { opacity: .9; }
.menu-button:hover .bar:nth-of-type(3) { -webkit-transform: translateY(-1.5px) rotate(4.5deg); -ms-transform: translateY(-1.5px) rotate(4.5deg); transform: translateY(-1.5px) rotate(4.5deg); }
.cross .bar:nth-of-type(1) { -webkit-transform: translateY(15px) rotate(-45deg); -ms-transform: translateY(15px) rotate(-45deg); transform: translateY(15px) rotate(-45deg); }
.cross .bar:nth-of-type(2) { opacity: 0; }
.cross .bar:nth-of-type(3) { -webkit-transform: translateY(-15px) rotate(45deg); -ms-transform: translateY(-15px) rotate(45deg); transform: translateY(-15px) rotate(45deg); }
.cross:hover .bar:nth-of-type(1) { -webkit-transform: translateY(13.5px) rotate(-40.5deg);-ms-transform: translateY(13.5px) rotate(-40.5deg); transform: translateY(13.5px) rotate(-40.5deg); }
.cross:hover .bar:nth-of-type(2) { opacity: .1; }
.cross:hover .bar:nth-of-type(3) { -webkit-transform: translateY(-13.5px) rotate(40.5deg); -ms-transform: translateY(-13.5px) rotate(40.5deg); transform: translateY(-13.5px) rotate(40.5deg); }
.copyright{ width:100%;height:50px;line-height:50px;font-size:14px;color:#e3e3e3;text-align:center;position:fixed;left:0;bottom:0;z-index:99;background:url(../img/copyright.jpg);background-size:100% auto; }
.page-down {position: fixed;width: 1rem;height: 2.5rem;background: url(../img/down_f.png);-webkit-background-size: 100% 100%;background-size: 100% 100%;left: 50%;margin-left: -0.08rem;bottom: 60px;z-index: 2;}
#Top{width:51px;height:51px;position:fixed;right: 20px;bottom: 0px;background:url(../img/top.png)no-repeat top center;z-index:999;cursor:pointer;}
#Top:hover{ background-position:0 -51px; }

.footnav{float: left;padding: 0 2rem;}
.footnav ul li{display:inline-block;font-size: 0.5rem;padding: 0 1rem;}
.footnav ul li a{ color:#FFF; }

.float_phone{ width:80px;height:240px;position:fixed;top:45%;right:20px;z-index:99; }
.float_phone img{ width:100%; }
.float_phone .En{ display:none; }

@media screen and (max-width: 1024px) {
	.menu-button{ display:block; }
	body{ -webkit-transform:translateX(0);transform:translateX(0);-webkit-transition: .5s; transition: .5s; }
	body.left{ -webkit-transform:translateX(280px);transform:translateX(280px);-webkit-transition: .5s; transition: .5s; }
	header nav{float:none;height:100%;margin:0;overflow: scroll;position:fixed;top:0;left:0;width:280px;background: url(../img/nav_bg.png)no-repeat bottom right #FFF;background-size:120%;-webkit-transform:translateX(-100%);transform:translateX(-100%);-webkit-transition: .5s; transition: .5s; }
	header nav ul{ float:none;width:100%;border-bottom:1px solid rgba(15, 142, 178, 0.3); }
	header nav li { float:none;width:100%;height:auto;line-height:normal;margin:0;padding:0 15px;box-sizing:border-box;position:relative;text-align:left;overflow:visible;border-top:1px solid rgba(15, 142, 178, 0.3); }
 	header nav ul li a { font-size: 0.7rem; line-height: 2rem; color: #545454; }
 	header nav li:before{ display:none; }
 	header nav li i{ -webkit-transform:rotate(-180deg);-ms-transform:rotate(-180deg);transform:rotate(-180deg);-webkit-transition: .5s; transition: .5s; }
 	header nav li.open i{ -webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg);-webkit-transition: .5s; transition: .5s; }
 	header nav li dl{ height:auto;display:none; }

 	header nav li:hover{ background:none; }
	header nav li:hover a.nav{ color:#0f8eb2; }
	header nav li:hover dl{ height:auto;transition:none;padding:0;  }

	header nav li i{display: block;background:url(../img/nav_btn.png)no-repeat center center;background-size: 100% 100%;width: 0.9rem;height: 0.5rem;position: absolute;top: 0.75rem;right:15px;}

	header .lang { position: fixed; top: 25px; right: 100px; margin: 0; }
	.bottomNav{display:block;margin-top: 25px;width: 90%;background: rgba(0,0,0,0.1);}
	.bottomNav ul{ border: none; }
	.bottomNav ul li{ border: none; }
	.bottomNav ul li a{ font-size:0.8rem; }

	.footnav{ display:none; }
}
@media screen and (max-width: 768px) {
	header .logo { float: left; height: 45px; margin: 20px 0; margin-left: 20px; }
	body.left header .logo{ display:none; }
	header nav ul li a { font-size: 1.6rem; line-height: 4rem; }
	header nav li i { width: 1.8rem; height: 1rem; top: 1.5rem; }
	header nav li dl dd a { font-size: 1.4rem; }
	.bottomNav ul li a{ font-size:1.2rem; }
	#Top{ right:10px;bottom:10px;}
	.float_phone { display:none; }
}