/*css reset*/
* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; -o-box-sizing: border-box; -ms-box-sizing: border-box;}
html,body,p{ padding: 0; margin: 0; font-family: "思源黑体","Source Han Sans CN","微软雅黑","Microsoft YaHei", "Helvetica Neue", Helvetica, STHeiTi, Arial, sans-serif;line-height: 1;}
ol, ul {list-style: none; padding: 0; margin: 0;}
blockquote, q {quotes: none;}
blockquote:before, blockquote:after, q:before, q:after {content: ''; content: none; }
table {border-collapse: collapse; border-spacing: 0;}
th,td { vertical-align: middle;padding: 0;}
a{text-decoration:none;	outline: none;hlbr:expression(this.onFocus=this.blur());}
input, select {vertical-align: middle;padding: 0;border: 0 none;}
img, iframe {border: none; text-decoration:none;}
img{vertical-align: top;}
strong {font-weight: bold;}
h1,h2,h3,h4,h5,h6{padding: 0; margin: 0;}
:focus {outline: 0;}
::-webkit-input-placeholder { /* WebKit browsers */
    color:    #999;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */
   color:    #999;
   opacity:  1;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */
   color:    #999;
   opacity:  1;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */
   color:    #999;
}
/*css common*/
.clearfix:after{content: "";display: block;clear: both;visibility: hidden;line-height: 0;height: 0;font-size:0;}
.clearfix{*zoom:1;}
html{margin: 0 auto;max-width: 1920px;}
html, body{height: 100%;}
.inner{
	width: 1200px;
	margin: 0 auto;
	max-width: 92%;
}
body{
	position: relative;
}
#main{
	min-height: 100%;
}
.mobile{
	display: none;
}
.web{
	display: inline-block;
}





#header{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 5;
}
#header .logo{
	width: 12.5%;
	margin-top: 3.52vh;
	margin-left: 7.1875%;
	float: left;
}
#header .nav{
	float: right;
	margin-top: 6.66vh;
	margin-right: 7.1875%;
	position: relative;
}
#header .nav .menu{
	border: 1px solid #fff;
	text-align: center;
	width: 100px;
	height: 40px;
	line-height: 38px;
	border-radius: 20px;
}
#header .nav .menu .line-box{
	display: inline-block;
	vertical-align: middle;
	width: 12px;
}
#header .nav .menu .line-box div{
	height: 2px;
	background-color: #fff;
	margin-bottom: 2px;
	position: relative;
	-webkit-animation: headerline 0.5s linear infinite alternate both;
	-moz-animation: headerline 0.5s linear infinite alternate both;
	-o-animation: headerline 0.5s linear infinite alternate both;
	animation: headerline 0.5s linear infinite alternate both;
}
#header .nav .menu .line-box div:nth-child(1){
	width: 75%;
}
#header .nav .menu .line-box div:nth-child(2){
	width: 25%;
}
#header .nav .menu .line-box div:nth-child(3){
	margin-bottom: 0;
	width: 50%;
}
@-webkit-keyframes headerline {
	100%{
		width: 100%;
	}
}
@-moz-keyframes headerline {
	100%{
		width: 100%;
	}
}
@-o-keyframes headerline {
	100%{
		width: 100%;
	}
}
@keyframes headerline {
	100%{
		width: 100%;
	}
}
#header .nav .menu .line-box div b{
	display: block;
	position: absolute;
	left: -3px;
	top: 0;
	background-color: #fff;
	width: 2px;
	height: 100%;
}
#header .nav .menu span{
	vertical-align: middle;
	font-size: 18px;
	color: #fff;
	margin-left: 0.5em;
}
#header .enter{
	display: none;
}
#header .sub-nav{
	box-shadow: 0 0 30px rgba(0,0,0,0.3);
	background-color: #fff;
	width: 238px;
	border-top-left-radius: 20px;
	border-bottom-left-radius: 20px;
	border: 2px solid #02321f;
	position: absolute;
	right: 0;
	top: 6.66vh;
	padding: 20px 0;
	display: none;
}
#header .sub-nav.fixed{
	position: fixed;
	top: 0;
	display: block;
}
#header .sub-nav.active{
	display: block;
}
#header .sub-nav li{
	margin-bottom: 16.8%;
	position: relative;
	padding-left: 8.4%;
}
#header .sub-nav li:last-child{
	margin-bottom: 0;
}
#header .sub-nav li a{
	font-size: 18px;
	color: #02321f;
}
#header .sub-nav li:hover a,#header .sub-nav li.active a{
	text-decoration: underline;
	font-weight: bold;
}
#header .sub-nav li img{
	position: absolute;
	right: 0;
	top: 50%;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	display: none;
}
#header .sub-nav li:hover img,#header .sub-nav li.active img{
	display: block;
}



.banner{
	position: relative;	
}
.banner .bg{
	width: 100%;
}
.banner .inner{
	width: 1520px;
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	flex-direction: row;
}
.banner .inner .text{
	width: 25.395%;
}



#footer{
	text-align: center;
	position: relative;
}
#footer .bg{
	width: 100%;
}
#footer p{
	font-size: 12px;
	color: #fff;
	opacity: 0.2;
	position: absolute;
	left: 0;
	right: 0;
	bottom: 22%;
}
#footer .img{
	position: absolute;
	right: 0;
	bottom: 0;
	width: 22.7%;
}




.sec1 .jump-box{
	width: 160px;
	position: absolute;
	right: 100%;
	top: 3px;
	margin-right: 10px;
	text-align: left;
}
.sec1 .jump-box a{
	margin-bottom: 10px;
	display: block;
	position: relative;
}
.sec1 .jump-box a img{
	width: 100%;
	opacity: 0;
}
.sec1 .jump-box a.active img{
	opacity: 1;
	-webkit-animation: jumpani 1s infinite both;
	-moz-animation: jumpani 1s infinite both;
	-o-animation: jumpani 1s infinite both;
	animation: jumpani 1s infinite both;
}
@-webkit-keyframes jumpani {
	100%{
		-webkit-transform: translateX(5%);
	}
}
@-moz-keyframes jumpani {
	100%{
		-moz-transform: translateX(5%);
	}
}
@-o-keyframes jumpani {
	100%{
		-o-transform: translateX(5%);
	}
}
@keyframes jumpani {
	100%{
		transform: translateX(5%);
	}
}
.sec1 .jump-box a p{
	font-size: 18px;
	color: #02321f;
	font-weight: bold;
	padding-left: 0.5em;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	-webkit-display: flex;
	-webkit-align-items: center;
	-webkit-justify-content: flex-start;
	-moz-display: flex;
	-moz-align-items: center;
	-moz-justify-content: flex-start;
	-o-display: flex;
	-o-align-items: center;
	-o-justify-content: flex-start;
	display: flex;
	align-items: center;
	justify-content: flex-start;
}
.sec1 .jump-box a.active p{
	color: #fff;
}


.totop{
	position: fixed;
	right: 3.23%;
	bottom: 40%;
	cursor: pointer;
	z-index: 10;
	display: none;
}
.totop.active{
	display: block;
}

@media only screen and (max-width:1023px){
	html { -webkit-text-size-adjust: 100%;-moz-text-size-adjust: 100%; -ms-text-size-adjust: 100%; -o-text-size-adjust: 100%; text-size-adjust: 100%;font-size: 16px;}
	body{
	   font-size: 62.5%;
	}
	.mobile{
		display: inline-block;
	}
	.web{
		display: none;
	}


	.banner .inner{
		width: 1520px;
		position: absolute;
		left: 0;
		right: 0;
		top: 0;
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: flex-start;
		flex-direction: row;
	}
	.banner .inner .text{
		width: 55.942%;
	}



	#footer p{
		font-size: 0.5625rem;
		bottom: 0.625rem;
		opacity: 0.5;
	}
	#footer .img{
		width: 32%;
	}


	#header .logo{
		width: 32%;
		margin-top: 1.3125rem;
		margin-left: 1.5625rem;
	}
	#header .nav{
		margin-top: 1.6875rem;
		margin-right: 1.875rem;
	}
	#header .nav .menu.mobile{
		width: 4.5rem;
		height: 1.8125rem;
		line-height: 1;
		border-radius: 0.90625rem;
		-webkit-display: inline-flex;
		-webkit-align-items: center;
		-webkit-justify-content: center;
		-webkit-flex-direction: row;
		-moz-display: inline-flex;
		-moz-align-items: center;
		-moz-justify-content: center;
		-moz-flex-direction: row;
		-o-display: inline-flex;
		-o-align-items: center;
		-o-justify-content: center;
		-o-flex-direction: row;
		display: inline-flex;
		align-items: center;
		justify-content: center;
		flex-direction: row;
	}
	#header .nav .menu .line-box{
		width: 0.5625rem;
	}
	#header .nav .menu .line-box div{
		height: 1px;
	}
	#header .nav .menu .line-box div b{
		left: -2px;
		width: 1px;
	}
	#header .nav .menu span{
		font-size: 0.8125rem;
	}
	#header .sub-nav{
		box-shadow: 0 0 0.9375rem rgba(0,0,0,0.3);
		width: 7rem;
		border-top-left-radius: 0.90625rem;
		border-bottom-left-radius: 0.90625rem;;
		border: 1px solid #02321f;
		padding: 1rem 0;
		top: 1.6875rem;
	}
	#header .sub-nav .close{
		width: 0.625rem;
		position: absolute;
		right: 0.625rem;
		top: 0.625rem;
		cursor: pointer;
	}
	#header .sub-nav li{
		margin-bottom: 1.125rem;
		padding-left: 0.625rem;
	}
	#header .sub-nav li a{
		font-size: 0.75rem;
	}
	#header .sub-nav li:hover img,#header .sub-nav li.active img{
		display: none;
	}

	.sec1 .jump-box{
		width: 100%;
		right: 0;
		top: -2.5rem;
		margin-right: 0;
		text-align: center;
	}
	.sec1 .jump-box a:last-child{
		margin-right: 0;
	}
	.sec1 .jump-box a{
		margin-bottom: 0;
		display: inline-block;
		vertical-align: top;
		margin-right: 0.25rem;
	}
	.sec1 .jump-box a img{
		width: 5.625rem;
		opacity: 0;
	}
	.sec1 .jump-box a.active img{
		opacity: 1;
	}
	.sec1 .jump-box a p{
		font-size: 0.625rem;
	}



	.totop{
		width: 1.9375rem;
		right: 1rem;
		bottom: 5rem;
	}
}