
div.screen{
	width:320px;
	height:560px;	
	overflow:hidden;
	position:absolute; 
	top:180px; 
	left:50%;
  margin-left:-160px;
	background:#31558a;
}

.list{margin-top:36px; text-align:left;}
.item{
	height:115px;
	margin-top:30px 0;
	padding-left:115px;
	clear:both;
}
.item .img, .item span{background:#214273; border-radius:3px;}
.item .img{float:left; width:71px; height:71px; margin-left:-93px;}
.item span{height:11px; width:180px; margin-bottom:19px; float:left;}
.item span:nth-of-type(3){width:75px; margin-botom:0;}

div.burger {
	height: 30px; 
	width: 40px;
	position: absolute;
	top: 11px; 
	left: 21px;
	cursor: pointer;	
}
	div.x,
	div.y,
	div.z {
		position: absolute; margin: auto;
		top: 0px; bottom: 0px;		
		background: #000;
		border-radius:2px;z-index: 9999999;
		-webkit-transition: all 200ms ease-out;
		   -moz-transition: all 200ms ease-out;
		    -ms-transition: all 200ms ease-out;
		     -o-transition: all 200ms ease-out;
		        transition: all 200ms ease-out;
	}		
	div.x, div.y, div.z { height: 3px; width: 26px; }
	div.y{top: 18px;}
	div.z{top: 37px;}
	div.collapse{
		top: 20px;
		background:#4a89dc;
		-webkit-transition: all 70ms ease-out;
		   -moz-transition: all 70ms ease-out;
		    -ms-transition: all 70ms ease-out;
		     -o-transition: all 70ms ease-out;
		        transition: all 70ms ease-out;
	}
	 
	
	div.rotate30{
		-ms-transform: rotate(30deg); 
    	-webkit-transform: rotate(30deg); 
	    transform: rotate(30deg);	
		-webkit-transition: all 50ms ease-out;
		   -moz-transition: all 50ms ease-out;
		    -ms-transition: all 50ms ease-out;
		     -o-transition: all 50ms ease-out;
		        transition: all 50ms ease-out;					
	}
	div.rotate150{
		-ms-transform: rotate(150deg); 
    	-webkit-transform: rotate(150deg); 
	    transform: rotate(150deg);	
		-webkit-transition: all 50ms ease-out;
		   -moz-transition: all 50ms ease-out;
		    -ms-transition: all 50ms ease-out;
		     -o-transition: all 50ms ease-out;
		        transition: all 50ms ease-out;					
	}
	
	div.rotate45{
		-ms-transform: rotate(45deg); 
    	-webkit-transform: rotate(45deg); 
	    transform: rotate(45deg);	
		-webkit-transition: all 100ms ease-out;
		   -moz-transition: all 100ms ease-out;
		    -ms-transition: all 100ms ease-out;
		     -o-transition: all 100ms ease-out;
		        transition: all 100ms ease-out;					
	}
	div.rotate135{
		-ms-transform: rotate(135deg); 
    	-webkit-transform: rotate(135deg); 
	    transform: rotate(135deg);	
		-webkit-transition: all 100ms ease-out;
		   -moz-transition: all 100ms ease-out;
		    -ms-transition: all 100ms ease-out;
		     -o-transition: all 100ms ease-out;
		        transition: all 100ms ease-out;					
	}

div.navbar{height:73px;background:#385e97;}

div.circle{	

	opacity:1;
	-webkit-transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	   -moz-transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	    -ms-transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	     -o-transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	        transition: all 300ms cubic-bezier(0.000, 0.995, 0.990, 1.000);	
}
div.circle.expand{
	width:1200px;
	height:1600px;
	top: -560px;
	left: -565px; 	
	-webkit-transition: all 400ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	   -moz-transition: all 400ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	    -ms-transition: all 400ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	     -o-transition: all 400ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	        transition: all 400ms cubic-bezier(0.000, 0.995, 0.990, 1.000);					
	
}
div.menu {

	    width: 100%;margin-top: 100px;
	position: absolute;
	top: 0px; left: 0px;
}
div.menu ul li {
	list-style: none;
	
	    float: left;
  
    margin-bottom: 5px;
    margin-top: 5px;
	opacity:0;
	width:100%;float: left;
	text-align:center;
	font-size:0px;
	-webkit-transition: all 70ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	   -moz-transition: all 70ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	    -ms-transition: all 70ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	     -o-transition: all 70ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	        transition: all 70ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
}
div.menu ul li a {
	color:#4a89dc;
	text-transform:uppercase;
	text-decoration:none;	font-size: 14px;
	letter-spacing:3px;			
}

div.menu li.animate{
	font-size:21px;
	opacity:1;
	-webkit-transition: all 150ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	   -moz-transition: all 150ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	    -ms-transition: all 150ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	     -o-transition: all 150ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
	        transition: all 150ms cubic-bezier(0.000, 0.995, 0.990, 1.000);
}
div.menu li.animate em{opacity: 1;
    margin-top: -3.5px;
    filter: alpha(opacity=100);
    left: auto;    position: absolute;
    right: 5%;
    bottom: auto;
    top: 50%;
    border: 7px solid #666;
    border-color: #666 transparent transparent transparent;}
.ac{
    float: left;
}
.yincang
{
padding-left: 0px;
    display: block;}
.yincang a{display: block;
    padding-left: 1em!important;
    color: #333!important;    text-align: left!important;
    padding: 0px 10%!important;font-size: 14px;
    position: relative!important;
  
    line-height: 3!important;}
 .navlist {z-index: 100; background:rgba(255,255,255,1);  display:none;  opacity:1; border-radius:0.5em;  box-shadow:0px 0px 1em rgba(0,0,0,0.1); float: left;
  
    margin-bottom: 5px;
    margin-top: 5px;}
 .navlist ul {overflow:hidden; padding-right:2em; padding-top:0.875em; }
 .navlist ul li { padding:0px; display:inline-block; padding-left:3.375em; }
 .navlist ul li a{display:block; padding-left:1em; color:#333;  position:relative; text-align:center; line-height:3;  }
 .navlist ul li a:before { position:absolute; content:""; left:0px; width:0.5em; height:0.5em; border-radius:50%; background:#fff; top:50%; margin-top:-0.25em; transition:0.5s all; -webkit-transition:0.5s all; -ms-transition:0.5s all; -o-transition:0.5s all; }
 .navlist ul li a:hover { color:#f0bd00; text-decoration:underline;  }
 .navlist ul li a:hover:before { background:#f0bd00; }
.navlist {  width:100%;  }
 .navlist ul li a { text-align:left; padding:0px 10%; }
.animate.active:first-child a {
 color: #fcc800;	
}

.burger.open ~ .menu li {
  display: block;
}

header {
    position: fixed;
    z-index: 998;
    top: 0;
    left: 0;
    right: 0;
    background-color: #FFF;
    height: 30px;
    border-bottom: solid 1px #EEE;
    padding: 5px 5px 15px 5px;
}
/*.dhtb{*/

/*    margin-left: 20%;*/
/*    margin-top: -3px;*/
/*    width: 150px;*/

/*}*/
  .nav-menu {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 999;
    background-color: rgba(0, 0, 0, 0.3);
   display: none;
  }

  nav.menu.opened {
    right: 0
  }

  nav.menu {
    position: absolute;
    right: -70%;
    top: 0;
    bottom: 0;
    width: 70%;
    background-color: #fff;
    -webkit-transition: left 200ms cubic-bezier(0.000, 0.655, 0.000, 1);
    -webkit-transition: left 200ms cubic-bezier(0.025, 0.685, 0.000, 0.990);
    -moz-transition: left 200ms cubic-bezier(0.025, 0.685, 0.000, 0.990);
    -o-transition: left 200ms cubic-bezier(0.025, 0.685, 0.000, 0.990);
    transition: left 200ms cubic-bezier(0.025, 0.685, 0.000, 0.990)
  }

  .image-round {
    border-radius: 60px;
    width: 70px;
    height: 70px;
    border: 3px solid #fff;
  }

  nav.menu .nav-header span {
        display: block;
    color: #2a3e75;
    font-weight: 900;
    line-height: 30px;
    letter-spacing: 2px;
    text-shadow: 1px 1px 0 #fff, -1px 1px 0 #fff, 1px -1px 0 #fff, -1px -1px 0 #fff;
  }

  nav.menu .nav-header a {
    color: #2eb18d
  }

 nav.menu .nav-header {
    height: 20%;
    text-align: center;
    padding: 10px 0;
    background: url(/images/dhbg.png) no-repeat;
    background-position: center;
    background-size: cover;
}
.fa-search:before {
    content: url(/images/dhss.png);
}
.fa-times:before {
    content: url(/images/dhgb.png);
}
.fa-arrow-right:before {
    content: url(/images/dhjt.png);
}
.fa-angle-up:before {
    content: url(/images/dhup.png);
}
.fa-angle-down:before {
    content: url(/images/dhdown.png);
}
  nav .nav-container {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 25%;
    overflow: auto
  }

  nav.menu ul {
    list-style: none;
    padding: 0;
    margin: 0
  }

  nav.menu ul li {
    display: block;
    width: 100%
  }

  nav.menu ul.main-menu > li.active {
    background-color: #f5f5f5
  }

  nav.menu ul.main-menu > li.active > ul {
    display: block
  }

  nav.menu ul.main-menu > li ul li.active {
    background-color: rgba(0, 0, 0, 0.2)
  }

  nav.menu ul.main-menu > li > a {
   display: block;
    color: #4c4b4b;
    padding: 5% 15% 2% 20%;

    font-weight: normal;
  }

  nav.menu ul.main-menu > li.active i {
    color: #2eb18d !important
  }

  nav.menu ul.main-menu > li > a > i {
    display: inline-block;
    width: 30px;
    font-size: 18px;
    color: #777
  }

  nav.menu ul.main-menu > li > a > img {
    width: 20px;
    margin-right: 10px;
    display: inline-block;
    position: relative;
    top: 5px
  }

  nav.menu ul.main-menu > li > a > span {
    display: inline-block;
    float: right;
    opacity: .5
  }

  nav.menu ul.main-menu > li ul {
    display: none
  }

  nav.menu ul.main-menu > li li a {
    display: block;
    color: #4c4b4b;
 padding: 5% 15% 2% 20%;
    font-weight: 400
  }
  .navi-menu-button {
       width: 40px;
    height: 40px;
    float: left;    top: 70px;
    position: relative;
    cursor: pointer;

  }

  .navi-menu-button em {
    width: 24px;
    height: 2px;
    background-color: #4c4c4c;
    display: block;
    position: absolute;
    border-radius: 30px;
    right: 0;
    -webkit-transition: all 200ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
    -moz-transition: all 200ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
    -o-transition: all 200ms cubic-bezier(0.250, 0.250, 0.750, 0.750);
    transition: all 200ms cubic-bezier(0.250, 0.250, 0.750, 0.750)
  }

  .navi-menu-button em:nth-child(1) {
    top: 7px;
    width: 24px
  }

  .navi-menu-button em:nth-child(2) {
    top: 14px
  }

  .navi-menu-button em:nth-child(3) {
    top: 24px;
    width: 24px
  }

  .navi-menu-button.focused em:nth-child(1) {
    -ms-transform: rotate(-45deg);
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
    top: 14px
  }

  .navi-menu-button.focused em:nth-child(2) {
    width: 0
  }

  .navi-menu-button.focused em:nth-child(3) {
    -ms-transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    top: 14px
  }
  nav.menu {
    width: 60%;
  }

/*  搜索
*/
  .search-button {
        width: 40px;
    height: 40px;
    text-align: center;
    line-height: 30px;
    cursor: pointer;
    font-size: 16px;
    display: inline-block;
    float: left;

    margin: 0 auto;
  }

  .clear {
    clear: both
  }

  .search-form {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    z-index: 1000;
    background-color: rgba(255, 255, 255, 0.9);
    overflow: auto;
    display: none
  }

  .search-form .search-input {
    margin: 20% 10% 5%;
    position: relative
  }

  .search-form .form-element {
    border: solid 1px #EEE;
    padding: 0 10px;
    border-radius: 3px;
    -webkit-box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.1);
    border-bottom-width: 2px
  }

  .search-form .form-element:focus {
    border-bottom-color: #ff7854
  }

  .search-form .search-input-btn {
    position: absolute;
    width: 37px;
    height: 37px;
    right: 1px;
    top: 1px;
    background-color: #FFF;
    border: 0;
    line-height: 37px;
    text-align: center
  }

  .search-form .search-input-btn:hover, .search-form .search-input-btn:focus {
    color: #ff7854
  }

  .search-form .recent-search, .search-form .popular-search {
    padding: 0 20px;
    margin-bottom: 20px
  }

  .search-form .search-tag {
    display: inline-block;
    padding: 4px 12px;
    background-color: #FFF;
    border: solid 1px #DDD;
    font-weight: 400;
    border-radius: 15px;
    margin: 0 5px 5px 0
  }

  .search-form .search-tag:hover, .search-form .search-tag:focus {
    border-color: #2eb18d;
    color: #2eb18d
  }

  .search-form .search-group-title {
    margin: 0;
    padding: 0;
    margin-bottom: 6px
  }

  .search-form .close-search-form {
    position: absolute;
    right: 20px;
    top: 20px;
    display: block;
    width: 30px;
    height: 30px;
    text-align: center;
    line-height: 30px;
    border: solid 1px #ccc;
    border-radius: 3px;
    cursor: pointer
  }

  .search-form .close-search-form:focus, .search-form .close-search-form:hover {
    background-color: #ff7854;
    color: #FFF
  }

  .search-result-header {
    background-color: #FFF;
    margin: -10px -10px 10px -10px;
    -webkit-box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.1);
    -moz-box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.1);
    box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.1);
    position: relative
  }

  .search-result-header.fix-searchbar {
    position: fixed;
    top: 60px;
    left: 0;
    right: 0;
    padding: 0 10px;
    z-index: 100
  }

  .search-result-header.fix-searchbar + .search-result-container {
    padding-top: 30px
  }

  .search-result-header .form-element {
    padding: 0 10px
  }

  .search-result-header.fix-searchbar .search-result-btn {
    right: 10px
  }

  .search-result-header .search-result-btn {
    position: absolute;
    right: 0;
    top: 0;
    height: 38px;
    width: 38px;
    border: 0;
    background-color: #FFF;
    overflow: hidden;
    outline: 0;
    cursor: pointer
  }

  .search-result-header .search-result-btn:focus, .search-result-header .search-result-btn:hover {
    color: #2eb18d
  }
  .form-element {
    padding-left: 24px
  }

  .form-element {
    display: block;
    width: 100%;
    border: 0;
    border-bottom: solid 1px #EEE;
    height: 40px;
    outline: 0;
    line-height: 40px;
    background-color: #FFF
  }

.navi-menu-button{display:none;}
 @media  (max-width: 480px) {
      /* 根据需要设置样式 */
      
      
      .tx-footer{display:none;} 
      .tx-center{line-height: 60px;/*padding-bottom:80px;*/}
      .navi-menu-button{display:block}
      .navi-menu-button{height: 40px;width: 40px;position: absolute;top: 15%;left: 11px;cursor: pointer;}
      
      body {
  overflow-x: hidden;
  touch-action: pan-y;
}          .title em{padding-bottom: 1px;}
      .contdaohang{    padding-right: 10px;}
      .tx-footer-main .contact, .downs p{display:none;}
       .xxx{width:280px!important;float:right!important;}
      .title{margin-bottom: 3px;}
      .title h1{margin-bottom: 0px}
      .tx-head-logo img{width:150px;float:right;}
      .tx-head-logo{width:343px;float:right;}
      .tx-head-navs{display:none;}
      .burger{display:block!important;}
      div.menu{display:block!important;}.wav {display: none;}
    }
    .burger{display:none;}
div.menu{display:none;}




@media screen and (min-width: 768px) and (max-width: 1280px) {  
    .tx-footer-down{padding: 20px 0;}
    .tx-footer{}
 
    .wav {display: none;}
    .footer_popup {display: none;}
  /* 在这里编写适用于中等大小设备的CSS样式 */
  body {overflow-x: hidden;touch-action: pan-y;}
      .navi-menu-button{display:block}
  .navi-menu-button{height: 40px;width: 40px;position: absolute;top: 31px;left: 11px;cursor: pointer;}
  .contdaohang{padding-right: 12px;}
  .tx-product-main .swiper-slide .img{height: 116px;overflow: hidden;}
  .tx-head-logo img{width:150px;float:right;}
  .xxx{width:220px!important;float:right!important;}
      .tx-head-logo{width:300px;float:right;}.tx-head-logo:before{    background: none;}
      .tx-head-navs{display:none;}
      .burger{display:block!important;}
      div.menu{display:block!important;}
    
      .burger:not(.open) + .menu-two {
  display: none;
}
}



.xxx1{width:200px;}
.xxx{width:280px;}