/*pad*/

img {
    max-width: 100%;
}

.gh {
    height: 24px;
    width: 26px;
    position: absolute;
    transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -webkit-transition: all 0.5s cubic-bmezier(0.7, 0, 0.3, 1) 0s;
    -ms-transition: all 0.5s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    cursor: pointer;
    z-index: 9999;
    display: none;
}

.selected .gh {
    transform: rotate(90deg);
}

.gh a {
    background-color: #fff;
    display: block;
    margin: 0 auto;
    height: 2px;
    margin-top: -1px;
    position: relative;
    top: 50%;
    transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    width: 100%;
    border-radius: 2px;
}

.gh a:after {
    width: 100%;
}

.gh a:before {
    width: 100%;
}

.gh a:after,
.gh a:before {
    background-color: #fff;
    content: "";
    display: block;
    height: 2px;
    left: 0;
    position: absolute;
    transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -webkit-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
    -ms-transition: all 0.3s cubic-bezier(0.7, 0, 0.3, 1) 0s;
}

.gh a:after {
    top: 9px;
}

.gh a:before {
    top: -9px;
}

.selected .gh a:after,
.selected .gh a:before {
    top: 0;
}

.selected .gh a:before {
    transform: translateY(0px) rotate(-45deg);
    -webkit-transform: translateY(0px) rotate(-45deg);
    -ms-transform: translateY(0px) rotate(-45deg);
    background: #fff;
    width: 100%;
}

.selected .gh a:after {
    transform: translateY(0px) rotate(45deg);
    -webkit-transform: translateY(0px) rotate(45deg);
    -ms-transform: translateY(0px) rotate(45deg);
    background: #fff;
    width: 100%;
}

.selected .gh a {
    background-color: transparent !important;
}



@media only screen and (max-width:1340px) {
	html{
		font-size:16px;
	}
	
}

@media only screen and (max-width:1100px) {
	html{
		font-size:14px;
	}
	
	
}

@media only screen and (max-width:960px) {
   html{
   	font-size:18px;
   }
   .header .wrap{
	   display: flex;
	   justify-content: space-between;
	   padding: 0 20px;
	   align-items: center;
   }
   .header{
	   padding: 15px 0;
   }
   .naver{
	   position: static;
   }
   .header .logo{
	   position: relative;
	   z-index: 11;
   }
   .header .wrap ul{
	   position: absolute;
	   left: 0;right: 0;
	   top: 0;
	   background: #000;
	   padding-top: 60px;
	   padding-bottom: 20px;
	   display: none;
   }
   .naver .chen{
		position: relative;z-index: 11;
		margin-right: 50px;
   }
   .naver li{
	   display: block;
   }
   .wrap{
	   width: auto;
	   padding: 0 20px;
   }
   .header .logo{
	   margin: 0;width: 12rem;
   }
   .gh{
	   display: block;
	   right: 20px;
	   top:17px;
   }
   .naver li a{
	   line-height: 40px;
	   text-align: left;
	   padding: 0 15px;
   }
   .naver li dl{
	   background: none;
	   padding: 0 12px
   }
   .naver li dd a{
	   border-color: #000 !important;
	   color: #fff;
	   line-height: 36px;
   }
   .naver li{
	   margin: 0;
   }
   .naver li i{
	   position: absolute;
	   right: 0;top: 0;width: 40px;
	   height: 40px;
	   background: url(../images/uico1-1.png) no-repeat center;
	   transition:all 0.3s;
	   -ms-transition:all 0.3s;  /* IE 9 */
	   -moz-transition:all 0.3s;     /* Firefox */
	   -webkit-transition:all 0.3s; /* Safari 和 Chrome */
	   -o-transition:all 0.3s;
   }
    .naver li i.on{
		transform:rotate(90deg);
	}
     .naver li dd a:hover{
		 color: #fff;
	 }
   .naver li .nli{
	   position: static;
	   width: auto;
	   background: none;
	   padding: 0;
   }
   .uban{
	   height: 200px;
   }
   .utit h2{
	   font-size: 24px;
   }
   .utit h3{
	   font-size: 20px;
	   margin-top: -0.8em;
   }
   .news{
	   padding: 30px 0;
   }
   .news .list a{
	   display: block;
   }
   .news .list .pic{
	   width: auto !important;
	   height: auto !important;
   }
   .news .list .text{
	   width: auto !important;
	   padding: 0 10px 15px;
   }
   .news .list .text h2{
	   font-size: 20px !important;
	   line-height: 60px;
   }
   .about .hd{
	   padding: 30px 0 0;
   }
   .about .hd .flxa{
	   display: block;
   }
   .about .hd .flxa .pic{
	   width:auto;
	   margin: 0 auto;
	   height: auto;
   }
   .about .hd .flxa .text{
	   width: auto;
   }
   .about .hd .flxa .text h2{
	   margin-top: 5px;
	   font-size: 22px;
   }
   .about .hd .flxa .text ul li{
	   float: none !important;
	   width: auto !important;
   }
   .about .hd .flxa .text ul::after{
	   display: none;
   }
   .fxph{
	   display: none;
   }
   .about{
	   padding-bottom: 40px;
   }
   .case{
	   padding: 30px 0;
   }
   .case .wrap li{
	   float: none !important;
	   width: auto !important;
	   margin: 0 0 20px 0;
   }
   .case .wrap li .pic{
	   width: auto;
	   height: auto;
   }
   .case ul{
	   margin-top: 0;
   }
   .case .utit{
	   margin-bottom: 20px;
   }
   .contact .bd .forms{
	   padding: 10px;
   }
   .contact .hd li{
	   width: 50%;
	   margin-bottom: 20px;
   }
   .contact .hd li h4{
	   font-size: 18px;
   }
   .contact .hd{
	   padding: 30px 0 10px;
   }
   .contact .bd .forms li{
	   display: block;margin: 0;
   }
   .contact .bd .forms li .fli{
	   width: auto;margin: 0;margin-bottom: 10px;
   }
   .contact .bd .forms li dd{
	   float: none;margin: 0 0 10px;
   }
   .contact .bd .forms li .selecx{
	   float: none;margin: 0 0 10px;width:100%;
   }
   .contact .bd .forms li dd .txt3,
   .contact .bd .forms li dd .txt2{
	   width: 100%;margin: 0;
   }
   .contact .bd .pic{
	   padding:60px 0;
   }
   .contact{
	   padding: 30px 0;
   }
   .ftab{
	   display: none;
   }
   .footer{
	   padding: 30px 0 ;
   }
   .footer .copyright{
	   margin-top: 10px;
   }
   .lipin .wrap{
	   padding: 30px 20px;
	   display: block;
   }
   .lipin .tab{
	   width: auto;
   }
   .lipin .rts{
	   width: auto;
	   margin-top: 20px;
   }
   .lipin .rts .list li{
	   float: none;
	   width: auto;
	   margin: 0 0 10px 0 ;
   }
   .lipin .rts .list li .pic{
	   height: auto;
   }
   .newsdel .btn{
	   display: block;
   }
   .newsdel .btn a{
	   max-width: 100%;
   }
   .newsdel{
	   padding-bottom: 30px;
   }
   .newsdel .hd h1{
	   font-size: 20px;
   }
   .product .list li{
	   float: none !important;
	   width: auto;
	   margin: 0 0 10px 0;
   }
   .product .list li a{
	   display: block;
   }
   .product .list li .pic{
	   height: auto;width: auto;
   }
   .product .list li .text{
	   width: auto;
   }
   .product .list li .text p{
	   height: auto;
	   margin: 5px 0;
   }
   .product{
	   padding: 30px 0;
   }
   .productdel .hd{
	   display: block;
   }
   .productdel .hd .pic{
	   height: auto;width: auto;
   }
   .productdel .hd .text{
	   width: auto;
	   padding: 10px;
   }
   .productdel .hd .text h1{
	   margin: 0;
	   line-height: 60px;
	   font-size: 20px;
   }
   .banner video{
	   height:50vh ;
   }
   .banner .wrap{
	   position: static;
	   margin: 30px 0;
   }
   .banner h4{
	   color: #000;
	   margin-bottom: 10px;
   }
   .banner h5 i{
	   color: #666;
   }
   .index .copyright a{
	   color: #666;
   }
   .index .copyright{
	   position: static;
   }
   .bans{
	   display: none;
   }
   .webbans{
		display: block;
   }
   
   
   
}