body{position: absolute;top: 0;right: 0}
#section{max-width: 1200px;margin: 0 auto}
  
#header{ 
   box-sizing: border-box;
   padding: 0 20px;
   height: 100px;width: 100%;position: fixed;z-index: 200;background: #fff;top: 0
 }

#header .con{margin:0 auto; max-width: 1200px}

#header .logo{float: left;margin-top: 29px;line-height: 22px;font-size: 12px;}
#header .pcNavs{float: right;}

#header .logo .slogan{display:block;float: left;margin-top: 8px;margin-left: 15px;line-height: 22px;font-size: 12px;}
#header .logo .slogan img{vertical-align: middle;}

#header .logo a{display: block;float: left;}
#header .logo a img{vertical-align: bottom;max-width: 100%;border: none;} 

#header .pcNavs{line-height: 22px;}
#header .pcNavs>ul>li{float: left;margin-left:40px;margin-top: 20px;position: relative;margin-bottom: 40px;}

#header .pcNavs>ul>li>a.active{border-bottom: 1px solid #987fde;color: #987fde}
#header .pcNavs>ul>li>a{font-size: 16px;color: #666;padding:20px 0; display: block;margin-bottom: 20px;}


#header .pcNavs>ul>li:hover>a{color: #987fde;border-bottom: 1px solid #987fde;}

#header .hambao{float: right;margin-top: 40px;}
#header .hambao i{font-size: 26px;color:#666}

#header  .navContent{position:absolute;top: 0px;right:-260px}
#header  .navContent {height: 100%;display: none;}
#header  .navContent ul{height: auto;}
#header  .navContent ul li{width:260px;white-space: nowrap;}

#header  .navContent #close{position: absolute;left: -38px;top:40px;}
#header  .navContent #close i{font-size: 26px;color: #666;}

#header  .navContent>ul>li>a{padding-left: 30px;line-height: 50px;font-size: 16px;display: block;background: #fff;border-bottom: 1px solid #e7e2f6;color: #666;padding: 0 20px; width: 260px;box-sizing: border-box;} 
#header  .navContent>ul>li.active>a{border-bottom: 1px solid #e7e2f6;background: #987fde;color: #fff;}
#header  .navContent>ul>li>a:hover{border-bottom: 1px solid #e7e2f6;background: #987fde;color: #fff;}
 .pcNavs{display: block;}
 .hambao{display: none;}

.height{height: 100px;width: 100%;}
.pcNavs > ul > li ul {
    position: absolute;
    width: 172px;
    background: #fff;
    top: 80px;
}
.pcNavs > ul > li ul{display: none;}
.pcNavs > ul > li:hover>ul{display: block;}
.pcNavs > ul > li ul a{
    display: block;
    line-height: 40px;
    font-size: 12px;
    color: #666;
    padding: 0 20px;
    
}
.pcNavs > ul > li ul a:hover {
    background: #987fde;
    color: #fff;
}
.secondList li {height: 40px;}
.secondList li a{ 
    padding: 0 20px;
    padding-left: 50px;
    font-size: 14px;
    display: block;
    line-height: 40px;
    font-size: 12px;
    color: #666;
    
}
.secondList li a:hover {
    background: #987fde;
    color: #fff;
}

@media screen and (max-width: 1230px){

   #header .pcNavs>ul>li{
    margin-left: 20px;
} 

@media (max-width: 768px){
	.height{height:50px;}
	#header {height: 50px;padding: 0 0;}
	#header .con{width: 96%}
	#header .logo{margin-top: 10px;}
	#header .hambao{margin-top: 14px;margin-right: 4px;}
    
	#header .logo a {width: 120px;}  
	#header .logo .slogan img{vertical-align: top}
    #header  .navContent #close{position: absolute;left: -30px;top:14px;}

         
        
    


 }         

 
     
	

 @media screen and (max-width:1024px) {
      .pcNavs{display: none;}
      .hambao{display: block;} 

      
     

 }
 @media screen and (max-width: 580px){
	#header .logo .slogan{display: none;}
 }