@media (max-width: 980px){
  .header-bar{height: auto; min-height: 30px; line-height: 1.7;}
  .header-bar .bar-left{ display: block; text-align: center; padding: 3px; }
  .header-bar .links-wrap{float: inherit; text-align: center; border-top: 1px solid rgba(255,255,255,.2); padding: 3px;}
  .top-header .menu-list{ width: 100%; height: 0%;position: fixed; overflow: hidden; top: 0px; left: 0; padding-top: 0;z-index: 2;line-height: normal;  background: rgba(0,0,0,.5);}
  .top-header .menu-list.show{  height: 100%;display: block;transition: height 0.3s; }
  .top-header .menu-list ul.navbar-nav{width: 50%; height: 100%; margin: 0; padding: 50px 0;display: inline-block;}
  .top-header .navbar-nav li{ flex: none; }
  .top-header .menu-list .navbar-nav li a{ padding: 15px 30px; border-bottom: 1px solid rgba(255,255,255,0.1); color: #fff;  }
  .top-header .menu-list .navbar-nav li a:hover,.top-header .menu-list .navbar-nav li a:focus{ background: rgba(255,255,255,.2); }
  .top-header .language-item{position: absolute; left: 20px; top: 20px; line-height: normal; z-index: 5;}

  .navbar-toggle {display: block; margin-right: 0;}

  .navbar-menu .navbar-nav > li > a{padding:0 10px; }
  .navbar-menu .ut-search-box .form-control{width: 180px;}
  .container{width: 100%;}
  .ut-header h2:before{width: 90%;margin: 0 -45%;}

 .slides-box{padding-top: 0;height:220px !important;}
 .slides-box .content-wrap .text{left: 12%;}
 .slides-box .content-wrap .text h3{font-size: 48px;}
    
    
}
@media (max-width: 768px){
  .top-header .container{height: auto;}
  .top-header .fw-top-searchbox{ width: 100%; clear: both; background: #f2f2f2; padding: 5px; margin:10px 0 15px; }
  
  .recommend-pro-list li{ width: 50%; }
 .ut-ally-company .news-protext-list li{ width: 33%; }

 .sub-menu li{ width: 22%;  }
 .ut-page-banner .banner .text{margin-top: 3%;}
 .ut-contact-intro > ul > li{width: 100%; margin-bottom: 30px;}
 

 .main-box .container > .title:after{width: 60%; margin-left: -30%;}


  .ut-product-details .ut-aside-menu{display: none;}
  .ut-product-details .details-info{width: 100%; padding:30px 0 0 ;}
  .ut-product-details .details-info .title .operation{width:100%; text-align: center; float: inherit; display: block; background: #f2f2f2; padding: 5px; border-radius: 3px; margin-bottom: 15px; }
  .ut-product-details .photo-list .pro-img,
  .ut-product-details .photo-list{width: 100%;}
  .ut-complain-intro .complain-info{padding: 20px; width: 90%;}
 .ut-complain-intro .fw-form-compose li,
 .ut-complain-intro .fw-form-compose .textarea{position:initial; width: 100%; padding-right: 0;}

 .slides-box .content-wrap .text h3{font-size: 30px; background-position: right bottom!important;}
}


@media (max-width: 480px){
  .header-bar .bar-left{display: none;}
  .top-header .logo{background-size: 100% auto; width: 160px; margin-top: 0px; height: 30px;}
  
  #scroller ul{height: 240px;}
  
  .ut-ally-company .news-protext-list li{ width:50%; }

  .sub-menu li{ width: 45%;}
 .slides-box .content-wrap .text h3{font-size: 24px;}
 .slides-box .content-wrap .text h3 span:last-child{padding-left: 0;}
  
}