﻿@charset "utf-8";
.nav0016_box{
	width:100%;
	height: 10vh;
	background: var(--FontWhiColor);
}

.nav0016{ 
	width:73vw;
	width:var(--mainwidth);
	height:100%; 
	margin:auto; 
	position:relative;
	display: flex;
	justify-content: space-between;
}
.nav0016head_logo{ 
	 height:6vh; 
	margin-top:2vh; 
	overflow: hidden;
}
.nav0016head_logo img{ 
	cursor:pointer;
	height:6vh; 
	width:auto;
}
.nav0016head_right{
	display: flex;
	justify-content: space-between;
}

.nav0016nav{  
	height:100%;
}


.nav0016nav_1{ 
	display:inline-block; 
	height:100%;  
	margin-right:3.5rem; 
	position:relative;
}
.nav0016nav_1 a{ 
	display:block; 
	cursor:pointer; 
	font-size:1.125rem; 
	color:var(--FontOneColor);  
	height:10vh; 
	line-height:10vh;  
	-webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
}


.nav0016nav_1 a:hover{ color:var(--OneColor);}
.nav0016nav_1 a.nav0016nav_1_a{ color: var(--OneColor);}
.nav0016nav_1:hover .nav0016nav_1_warp{ height:auto;}
.nav0016nav_1:hover .nav_con{ opacity:1; margin-top: 0px;}

.nav0016nav_1_warp{
	width:180%;
	height: 0px;
	overflow: hidden;
	position: absolute;
	top: 100%;
	left: -40%;
	-webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
	box-shadow: 0 10px 40px rgba(0,0,0,.06);
	z-index: 2;
}
.nav_con{
	width: 100%;
	height: auto;
	padding: 10px 10px;
	opacity:0;
	margin-top: 10px;
	background: var(--FontWhiColor);
	-webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
}
.nav_con a{
	display: block;
	width: 100%;
	text-align: center;
	font-size: 1rem;
	line-height: 1.3rem;
	padding: 5px 0px;
	height: auto;
}


.nav0016tel{
	height: 10vh;
	line-height: 10vh;
	margin-left: 4.5rem;
}
.nav0016tel i{
	font-size: 1.375rem;
	color: var(--FontOneColor);
	margin-right: 5px;
}
.nav0016tel>a>span{
	display: inline-block;
	color: var(--FontOneColor);
	font-size: 1.375rem;
	font-family: Arial;
	-webkit-transition: all 0.5s;
    -moz-transition: all 0.5s;
    transition: all 0.5s;
	 -webkit-background-clip: text;    /*按文字裁剪*/
    -webkit-text-fill-color: transparent;    /*文字的颜色使用背景色*/
    background-color:var(--FontOneColor);    /*设置一个背景色*/
    background-image: -webkit-linear-gradient(-45deg, rgba(0, 0, 0, 0.6) 30%,rgba(255, 255, 255, 0.8) 50%, rgba(0, 0, 0, 0.6) 70%);        /*设置渐变的背景，按对角线渐变*/
    background-blend-mode: hard-light;    /*设置背景为混合模式下的强光模式*/
    background-size: 200%;
    -webkit-animation: shine 4s infinite;    /*给背景添加动画改变位置*/
	
}

@-webkit-keyframes shine {

    from {background-position: 100%;}
    to {background-position: 0;}

}

.menubtn{
	display: none;
}

@media screen and (max-width:1023px)and (min-width:300px){
.nav0016_box {
    height: 8vh;
	    position: relative;
    z-index: 9;
}	
	
	.nav0016{ 
	width:100vw;
	height:100%; 
	margin:auto; 
	position:relative;
	display: flex;
	justify-content: space-between;
}
.nav0016head_logo{ 
	width:50%;
	height: 100%;
	font-size: 0px;
	margin-top:0vh; 
	margin-left: 2%;
}
.nav0016head_logo img{ 
	height: 4vh;
	margin-top: 2vh;
}
.nav0016head_right{
	display: block;
	width:0%;
	height:auto;
		justify-content: center;
		flex-direction: column;
		position: absolute;
		right: 0%;
		overflow: hidden;
		opacity: 0;
		border-top: 1px #e5e5e5 solid;
		top: 100%;
	-webkit-transition: all 0.5s;
		-moz-transition: all 0.5s;
		transition: all 0.5s;
		background: var(--FontWhiColor);
}

.nav0016nav{  
	height:100%;
}


.nav0016nav_1{ 
	display:block; 
	height:auto;  
	margin-right:0rem; 
	width: 94%;
	margin: 0 auto;
	position:relative;
}
.nav0016nav_1 a{ 
	display: block;
	font-size: 1.25rem;
	height: 40px;
	line-height: 40px;
	padding-left: 2%;
	border-bottom: 1px solid rgba(0,0,0,0.1);
	}

.nav0016nav_1_warp{
	width:100%;
	height:0;
	overflow: hidden;
	position: relative;
	top: 0vh;
	left: -0%;
}
.nav0016nav_con{
	width: 100%;
	height: auto;
	padding: 0px 0;
	opacity:0;
	margin-top: 0px;
}

.nav0016nav_con a{
	display: block;
	height: 40px;
    line-height: 40px;
	text-align: left;
    border-bottom: 1px solid rgba(0,0,0,0.1);
    padding-left: 8%;
	font-size: 1.125rem;
	position: relative;
}
.nav0016nav_con a:after {
    content: "";
    width: 2px;
    height: 14px;
    position: absolute;
    left: 4%;
    top: 13px;
}	
	
	

.nav0016tel{
	margin-left: 4%;
}
	.nav0016tel i{
		font-size: 1.625rem;
		margin-right: 10px;
	}
.nav0016tel>span{
	font-size: 1.625rem;
	
}


	.menubtn{
		width: 25px;
		position: relative;
		right: 2vw;
		left: auto;
		top: calc(4vh - 10px);
		display: block;
	cursor: pointer;
	}
	/* nav-icon-5 */
	.nav-icon-5{  width: 25px; z-index: 20;  height: 18px; position: absolute;  cursor: pointer; margin-right: 0;}
	.nav-icon-5 span{  background-color:var(--OneColor);  position: absolute;  border-radius:3px;  transition: 0.3s cubic-bezier(.8, .5, .2, 1.4);  width:100%;  height: 2px;  transition-duration: 500ms}
	.nav-icon-5 span:nth-child(1){  top:0px;  left: 0px;}
	.nav-icon-5 span:nth-child(2){  top:8px;  left: 0px;  opacity:1;}
	.nav-icon-5 span:nth-child(3){  bottom:0px;  left: 0px;}
	.nav-icon-5:not(.open):hover span:nth-child(1){  transform: rotate(0deg) scaleY(1.1);}
	.nav-icon-5:not(.open):hover span:nth-child(2){  transform: rotate(0deg) scaleY(1.1);}
	.nav-icon-5:not(.open):hover span:nth-child(3){  transform: rotate(0deg) scaleY(1.1);}
	.nav-icon-5.open span:nth-child(1){  transform: rotate(45deg);  top: 8px;}
	.nav-icon-5.open span:nth-child(2){  opacity:0;}
	.nav-icon-5.open span:nth-child(3){  transform: rotate(-45deg);  top: 8px;}

	.top_bei{
		 display: none;
		width: 100%;
		height:100vh;
		background: rgba(0,0,0,0.5);
		position: fixed;
		top: 0;
		z-index: 3;
	}	
	
	

	
}