/* --------PC菜单导航-------- */
.index_top{ width:100%; padding:22px 0; overflow:hidden; transition:all 0.5s; position:fixed; top:0; z-index:1000000; background-color:#333;filter:alpha(opacity=60);-moz-opacity:0.6; opacity: 0.6;}
#logo{ width:235px; height:67px; overflow:hidden; float:left; }
#index_top_ul1{ margin-left:200px;}
#index_top_ul1 li{ float:right; padding:0 2%; height:60px; overflow:hidden; line-height:65px; font-size:16px; color:#FFF;  }
#index_top_ul1 li:first-child{ padding-right:0;}
#index_top_ul1 li img{ width:38%; cursor:pointer; display:inline-block;}
#index_top_ul1 li:hover h4{ margin-top:-44px !important;}
#index_top_ul1 li h4{ line-height:100% !important; overflow:hidden; transition:all 0.3s;}
#index_top_ul1 li h4 p{ margin:25px 0;}
#index_top_ul1 li h4 p:nth-child(2){ color:#00aa88;}

#index_top_ul1 li.sel{ color:#00aa88;}

.xian{ width:1.3% !important; display:inline-block; margin:0 9%}
#dh{ background:url(../images/dianhua01.png) left center no-repeat; color:#00aa88; background-size:20%; padding-left:4%;}
.index_li_hover{ color:#00aa88 !important; }

/*手机导航*/
.mobile-inner{ display:none; }


/*微信弹窗*/
.float_ewm{ display:none; transition:all 1s; width:154px; height:180px; text-align:center; padding:10px; overflow:hidden; position:fixed; top:7% ; right:10%; z-index:1000000000 }
.float_ewm h4{ padding:1% 0; color:#FFF;}
#float_ewm{ display:block; width:100%; }


@media (min-width: 768px) and (max-width:1024px) {
/* ------平板导航-------  */
.index_top{ width:100%; padding:22px 3%; overflow:hidden; transition:all 0.5s; position:fixed; top:0; z-index:1000000; }

#logo{ width:150px; height:57px; overflow:hidden; float:left; }
#index_top_ul1{ margin-left:150px;}
#index_top_ul1 li{ float:right; padding:0 2%; height:50px; overflow:hidden; line-height:55px; font-size:14px; color:#FFF;  }
#index_top_ul1 li:first-child{ padding-right:0;}
#index_top_ul1 li img{ width:30%; cursor:pointer; display:inline-block;}
#index_top_ul1 li:hover h4{ margin-top:-42px !important;}
#index_top_ul1 li h4{font-size:14px; line-height:100% !important; overflow:hidden; transition:all 0.3s;}
#index_top_ul1 li h4 p{ margin:20px 0;}
#index_top_ul1 li h4 p:nth-child(2){ color:#00aa88;}
.xian{ width:1.3% !important; display:inline-block; margin:0 8%}
#dh{ background:url(../images/dianhua01.png) left center no-repeat; color:#00aa88; background-size:18%; padding-left:2%;}


/*手机导航*/
.mobile-inner{ display:none; }

}

@media (max-width: 767px) {
/*导航*/
.index_top{ display:none;}

/*手机导航*/
.mobile-inner{
	display:block;
	width: 100%;
	margin-right: auto;
	margin-left: auto;
	background-color: #fafafa;
	position: relative;
	z-index:1000000 !important;
}

.mobile-inner-header{
	z-index:1000000 !important;
	width: 100%;
	height:56px;
	background-color: #333;
	position: absolute;
	top: 0px;
	left: 0px;
}
.mobilelogo{ position:absolute; left:10px; top:8px;}
.mobilelogo img{ height:40px;}
.mobile-inner-header-icon{
	color: #ffffff;
	height: 50px;
	font-size:25px;
	text-align: center;
	float:right;
	width: 50px;
	position: relative;
	-webkit-transition: background 0.5s;
	-moz-transition: background 0.5s;
	-o-transition: background 0.5s;
	transition: background 0.5s;
}
.mobile-inner-header-icon:hover{
	background-color: rgba(255,255,255,0.2);
	cursor: pointer;
}
.mobile-inner-header-icon span{
	position: absolute;
	left: calc((100% - 25px) / 2);
	top: calc((100% - 1px) / 2);
	width: 25px;
	height: 1px;
	background-color: rgba(255,255,255,1);
}
.mobile-inner-header-icon span:nth-child(1){
transform: translateY(4px) rotate(0deg);
	}
.mobile-inner-header-icon span:nth-child(2){
transform: translateY(-4px) rotate(0deg);
	}
	



	
.mobile-inner-header-icon-click span:nth-child(1){
	animation-duration: 0.5s;
	animation-fill-mode: both;
	animation-name: clickfirst;
	}		
.mobile-inner-header-icon-click span:nth-child(2){
	animation-duration: 0.5s;
	animation-fill-mode: both;
	animation-name: clicksecond;
	}
	


@keyframes clickfirst {
  0% {
	  transform: translateY(4px) rotate(0deg);
	  
  }

  100% {
    transform: translateY(0) rotate(45deg);
  }
}	



@keyframes clicksecond {
  0% {
	  transform: translateY(-4px) rotate(0deg);
  }

  100% {
    transform: translateY(0) rotate(-45deg);
  }
}	

.mobile-inner-header-icon-out span:nth-child(1){
	animation-duration: 0.5s;
	animation-fill-mode: both;
	animation-name: outfirst;
	}		
.mobile-inner-header-icon-out span:nth-child(2){
	animation-duration: 0.5s;
	animation-fill-mode: both;
	animation-name: outsecond;
	}

@keyframes outfirst {
  0% {
    transform: translateY(0) rotate(-45deg);
  }

  100% {
    transform: translateY(-4px) rotate(0deg);
  }
}	



@keyframes outsecond {
  0% {
    transform: translateY(0) rotate(45deg);
  }

  100% {
    transform: translateY(4px) rotate(0deg);
  }
}

.mobile-inner-nav{
	background-color: rgba(0,0,0,0.9);
	width: 100%;
	position: absolute;
	top: 50px;
	left: 0px;
	padding-top: 30px;
	padding-bottom:60px;
	display: none;
}
.mobile-inner-nav a{
	display: inline-block;
	line-height: 50px;
	text-decoration: none;
	width: 80%;
	margin-left: 10%;
	color: #FFFFFF;
	border-bottom: solid 1px rgba(255,255,255,0.3);
	-webkit-transition: all 0.5s;
	-moz-transition: all 0.5s;
	-o-transition: all 0.5s;
	transition: all 0.5s;
	font-weight:300;
}
.mobile-inner-nav a:hover{
	color: rgba(255,255,255,0.4);
	border-bottom: solid 1px rgba(255,255,255,0.2);
}

	
}