@charset "utf-8";
/* CSS Document */


* { margin: 0; padding: 0; }
html, body { width: 100%;     font-family: "微软雅黑"; font-size: 14px; }
img { border:none ;   text-align-last: center;    vertical-align: middle; max-width: 100%;}
a { color:#333;text-decoration:none; }
a:hover { color:#333 ;text-decoration:none;}
ul { list-style:none;}
li{ list-style-type :none;}
.clear {clear:both;    float: none!important;    background: none;    width: 0 !important;    height: 0 !important;}
.fl {    float: left;    display: inline;}
.fr {    float: right;    display: inline;}

span{white-space: nowrap;overflow: hidden;text-overflow: ellipsis;}

.w1200{ width:1200px; margin: 0 auto;}
.swiper-container {
      width: 100%;
      height: 100%;
      margin-left: auto;
      margin-right: auto;
    }

    .swiper-slide {
      text-align: center;
      font-size: 18px;
      background: #fff;
      height: calc((100% - 30px) / 2);

      /* Center slide text vertically */
      display: -webkit-box;
      display: -ms-flexbox;
      display: -webkit-flex;
      display: flex;
      -webkit-box-pack: center;
      -ms-flex-pack: center;
      -webkit-justify-content: center;
      justify-content: center;
      -webkit-box-align: center;
      -ms-flex-align: center;
      -webkit-align-items: center;
      align-items: center;
    }

/* ------------------                 header                --------------------------------------      */
/*    top  head    */
.top_tel{    color: #d8322a;    font-weight: bold; position: absolute; right: 0; line-height: 24px; font-style: 16px;}
.header .w1200{ position: relative; }
.header{   width: 100%;  background: #fff; height: 90px; }
.header .logo{ float: left; }
.header .logo img{ width: 70%; margin: 13px 0 0 0;}
.header ul{ float: right; }
.header ul li{ float:left; line-height: 87px; height: 87px; margin: 0 8px;}
.header ul li a{ color: #000; font-size: 15px; padding: 0 20px;}
.header ul li:hover a,.header ul li.on a{  display: block; color: #da2417; border-bottom: 3px solid #da2417; }
.header ul li.search{margin:0 0 0 20px;}

#search{ display:none; position:fixed; z-index:1001; left:0; top:0%; width:100%; height:100%; background:rgba(204,204,204,.8); overflow:hidden;}
#search>form{position:absolute; top:30%; width:800px; height:50px; border:2px solid #da2417; border-radius:10px; background:#fff;left: 0; right: 0; margin: 0 auto;}
#search input[type="text"]{outline: medium;float:left;height:50px;line-height:50px;width:78%; padding:0 5%;border:none; font-family:"微软雅黑"; font-size:14px; background:none;color:#777;box-sizing:border-box;overflow:hidden;}
#search input::-webkit-input-placeholder{ color:#ccc;}
#search button{	float:right;width:12%;height:50px;border:none; opacity:.8;background:url(../img/icon-search.png) no-repeat center center;background-size:auto 25px;cursor:pointer;box-sizing:border-box;overflow:hidden;}


  .m_head{ display: none;}
	#menu { display: none;}
@media Only screen and (max-width: 768px) {
	.w1200{ width:90%; margin: 0 auto;}
    .header{ display: none;}
	.m_head{ display: block;  height: 50px;}
	.m_head .logo{  height: 100%;float: left; }
	.m_head .meu{ height:100%; float: right;}
	.m_head .logo img{ height:90%; margin: 5% 0; }
	.m_head .meu img{ height:100%; }
	
	#menu {display:block;position:fixed;z-index: 1001;right: -100%;top: 0px;width: 100%;height: 100%;background:#444;}
    #menu .close { width:80%;margin:30px auto 0px auto; text-align:right;cursor: pointer;}
    #menu .close img { width: 20px; height: auto;}
    #menu .catalog{ width:70%; margin:0 auto; padding: 10% 0px 1% 0;}
    #menu .catalog>a{ position:relative; display:block; height:auto; margin-bottom:10px;}
    #menu .catalog>a:after{position:absolute; z-index:2; left:5px; top:5px; width:96%; height:80%; border:1px solid rgba(255,255,255,.2); content:'';}
    #menu .catalog>a img{ width:100%;height:auto;}
    #menu .catalog>a .name{position:absolute; left:0; width:100%; height:60%; text-align:center; padding-top:10%; color:#fff; font-size:16px;}
    #menu ul {width:70%;margin:50px auto 0; overflow: hidden;}
    #menu ul>li { position:relative;display: block;padding: 15px 0px;text-align: left;margin: 0px auto;border-bottom: 1px solid rgba(255,255,255,.2);}
    #menu ul>li img{position:absolute;z-index:9;right:10px;top:18px;width:18px;height:auto; opacity:.5;}
    #menu ul>li>a {display:block; color:#fff; font-size: 14px;padding:0px 5px;}
    #menu ul>li.A>a{ color:#fff !important;}
    #menu ul>li>div{ display:none; padding:10px 0px;}
    #menu ul>li>div a{display:block;padding:5px;font-size:12px; color:#999;}
    #menu .language{ width:70%;margin:0px auto; text-align:left;}
    #menu .language h3{ display:block; margin-bottom:5px; font-size:12px; font-weight:normal; color:rgba(255,255,255,.8);}
    #menu .language a{ display:inline-block;}
    #menu .language img{ height:30px; width:auto;}
    .m_head .top_tel1{    color: #d8322a;    font-weight: bold;  line-height: 24px; font-style: 16px; float: right; margin: 0 20px 0 0;}
}


/* ------------------                 header                --------------------------------------      */
/* ------------------                 banner                --------------------------------------      */


.banner{ width:100%; position: relative;}
.banner > img{     width: 100%!important;}
.banner img{     width: auto;}
.banner .swiper-slide img{ width:100%; height: auto;}
.swiper-pagination-bullet-active {    opacity: 1;    background: #a9261e!important;}
.banner h2{top: 40%; left: 0%; right: 0; font-size: 36px; color: #fff; position: absolute; text-align: center; }
.banner h2 span{ display: block; font-size: 14px; margin: 10px 0 0; }

@media Only screen and (max-width: 768px) {
.banner{   overflow: hidden;}
.banner img{     height:100%; width: auto;}
.banner h2{ display: none; }
}

/* ------------------                 banner                --------------------------------------      */
/* ------------------                 black1                --------------------------------------      */


.black1{  background: url(../img/bj.jpg) no-repeat; padding: 100px 0 85px;  }
.black1 h2{ text-align: center; color: #135fbd; font-size: 24px; margin:  0 0 50px 0;} 
.black1 h2 span{ display:block; font-size: 16px; line-height: 24px; color: #ccc; font-weight: 300; margin: 10px 0 0;}
.black1_left{ width:40%; float: left;}
.black1_left img{  max-width: 100%; text-align: center;     display: block;}
.black1_right{ width:58%; float: right;}
.black1_right span{white-space:inherit;}
.black1_right h3{ color: #fff; font-weight: bold; font-size: 24px; margin: 10px 0 30px; border-bottom: 1px solid #fff; padding: 0 0 20px}
.black1_right p{ line-height: 32px; color: #fff; width: 100%} 

@media Only screen and (max-width: 768px) {
	
	.black1 .w1200{ width:90%; margin:  0 auto;}
	.black1 { background: url(../img/bj.jpg) no-repeat #183e7f; background-position: center;   }
	.black1_left{  width:100%; float: right;text-align: center; margin: 0 auto;    display: block;}
	.black1_left img{  width: 100%; margin: 30px 0 0;}
	.black1_right{ width:100%; float: left;}
	.black1_right p{ width: 100%} 
}


/* ------------------                 black1                --------------------------------------      */
/* ------------------                 black2               --------------------------------------      */


.black2{ margin:0px 0;  padding: 80px 0; background: #f6f6f6;}
.black2 h2{ text-align: center; color: #000; font-size: 24px; margin:  0 0 50px 0; position: relative; } 
.black2 h2 span{ display:block; font-size: 16px; line-height: 24px; color: #ccc; font-weight: 300; margin: 30px 0 0;}
.black2 h2 span:after{position:absolute; z-index:2; left:0; right: 0; margin: 0 auto; bottom:36px; width:50px; height:2px; background: #1e326f; content:'';}
.black2 ul{}
.black2 li{ width: calc((100% - 60px)/4); float: left; margin: 0 20px 20px 0; position: relative; background: #fff;}
.black2 li:nth-child(4n){margin: 0 0px 20px 0;}
.black2 li a{ border: 1px #ccc solid; display: block; background: #fff;}
.black2 li img{   transform: scale(1);}
.black2 li span{ position: absolute; top: 0; left: 0; right: 0; text-align: center; line-height: 32px; background: #135fbd; color: #fff; width: 60%; margin: 0 auto;}
.black2 li:hover span{ background: #a9261e; }


@media Only screen and (max-width: 768px) {
	
	.black2 .w1200{ width:90%; margin:  0 auto;}
	.black2 li{ width: calc((100% - 20px)/2); float: left; margin: 0 20px 20px 0; position: relative;}
	.black2 li:nth-child(2n){margin: 0 0px 20px 0;}
	.black2 li span{}
		.black2 li span {
     position: inherit; 
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    line-height: 32px;
    background: none; 
    color: #000;
    width: 90%;
    margin: 0 auto;
    display: block;
}
}

/* ------------------                 black2               --------------------------------------      */
/* ------------------                 black3               --------------------------------------      */

.black3{ margin:0px 0;  padding: 80px 0; background: #F5F5F5;}
.black3 h2{ text-align: center; color: #000; font-size: 24px; margin:  0 0 50px 0; position: relative;} 
.black3 h2 span{ display:block; font-size: 16px; line-height: 24px; color: #1e326f; font-weight: 300; margin: 30px 0 0;}
.black3 h2 span:after{position:absolute; z-index:2; left:0; right: 0; margin: 0 auto; bottom:36px; width:50px; height:2px; background: #1e326f; content:'';}

.black3 .news_left{ float: left; width: calc(49% - 60px);  padding: 30px; background: #fff; min-height: 500px; }
.black3 .news_left .news_one{  }
.black3 .news_left .news_one a{ }
.black3 .news_left .news_one img{ margin: 0 0 10px; }
.black3 .news_left .news_one h3{ line-height: 32px; font-size: 16px; padding: 5px 5px 0 5px;}
.black3 .news_left .news_one span{ float: right; font-size: 14px;   }
.black3 .news_left .news_one p{ line-height: 20px; font-size: 14px; overflow: hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient: vertical; padding: 0 5px 5px 5px; min-height: 40px;}
.black3 .news_left .news_one:hover{ background: #ccc; }

.black3 .news_left .news_two{ padding: 5px; }
.black3 .news_left .news_two a{}
.black3 .news_left .news_two h3{ line-height: 32px; font-size: 16px; color: #183e7d; }
.black3 .news_left .news_two span{ float: right; font-size: 14px;  }
.black3 .news_left .news_two p{ line-height: 20px; font-size: 14px; overflow: hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient: vertical; min-height: 40px; }
.black3 .news_left .news_two:hover{ background: #ccc; }

.black3 .news_right{ float: right;  width: calc(49% - 60px);  padding: 30px; background: #fff;  min-height: 500px;  }
.black3 .news_right ul{}
.black3 .news_right li{  border-bottom: 1px solid #ccc;  margin: 20px 0 0; }
.black3 .news_right li:nth-child(1){ margin: 0; }
.black3 .news_right li a{ padding: 10px; display: block; border-bottom: 4px solid #fff; }
.black3 .news_right h3{  line-height: 24px; font-size: 16px; color: #183e7d;      padding: 0 0 18px; }
.black3 .news_right span{    float: left;    line-height: 20px;    margin: 0 11px 0 0;  font-size: 16px; color: #333; }
.black3 .news_right span i{ display: block; font-style: normal; font-size: 12px; color: #bfd6ff }
.black3 .news_right p{ min-height: 40px; line-height: 20px; font-size: 14px; overflow: hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 2;  -webkit-box-orient: vertical;}

.black3 .news_right li:hover{ background: #ccc; border-bottom: 1px solid #1e326f; }
.black3 .news_right li:hover a{ background: #ccc; border-bottom: 4px solid #1e326f; }
.black3 .news_right li:hover i{ color: #fff; }


@media Only screen and (max-width: 768px) {
	
	.black3 .w1200{ width:90%; margin:  0 auto;}
	.black3 .news_left{ width: calc(100% - 60px); padding-bottom: 0; }
	.black3 .news_right{ width:calc(100% - 60px); padding-top: 0;}
}

/* ------------------                 black3               --------------------------------------      */
/* ------------------                 black4              --------------------------------------      */

.black4{ margin:0px 0;  padding: 80px 0; background: #FFF; position: relative;}
.black4 h2{ text-align: center; color: #000; font-size: 24px; margin:  0 0 50px 0; position: relative;} 
.black4 h2 span{ display:block; font-size: 16px; line-height: 24px; color: #1e326f; font-weight: 300; margin: 30px 0 0;}
.black4 h2 span:after{position:absolute; z-index:2; left:0; right: 0; margin: 0 auto; bottom:36px; width:50px; height:2px; background: #1e326f; content:'';}

.black4 .swiper-slide img{ width: 100%; height: 350px;  }
.black4 .swiper-slide:nth-child(n+9){margin-top: 30px!important;}
.black4 .swiper-slide:nth-child(1){margin-top: 0px!important;}
.black4 .swiper-slide:nth-child(2){margin-top: 0px!important;}
.black4 .swiper-slide:nth-child(3){margin-top: 0px!important;}
.black4 .swiper-slide:nth-child(4){margin-top: 0px!important;}
.black4 .swiper-slide:nth-child(5){margin-top: 0px!important;}
.black4 .swiper-slide:nth-child(6){margin-top: 0px!important;}
.black4 .swiper-slide:nth-child(7){margin-top: 0px!important;}
.black4 .swiper-slide:nth-child(8){margin-top: 0px!important;}

.black4 .swiper-button-next{right: 12%;}
.black4 .swiper-button-prev{left: 12%;}


.black4 .swiper-container-horizontal>.swiper-pagination-bullets{ bottom: 10px;    left: 0;    width: 100%; }
@media Only screen and (max-width: 768px) {
	
	.black4 .w1200{ width:90%; margin:  0 auto;}
.black4 .swiper-slide img{ height: auto; }
}

/* ------------------                 black4               --------------------------------------      */
/* ------------------                 footer              --------------------------------------      */


.foot{ width:100%; position: relative; background: #214081; padding: 60px 0 0px;}
.foot li{ width: calc(100% / 5); float: left; }
.foot li h2{ font-weight: 600;  color: #fff; padding: 0 0 20px; margin: 0 0 20px; position: relative;}
.foot li h2:after{position:absolute; z-index:2; left:0px; bottom:0px; width:30px; height:2px; content:''; background: #fff;} 
.foot li a{ color: #fff; width: 100%; display: block; line-height: 28px;}
.foot li p{ color: #fff; width: 100%; display: block; line-height: 28px;}
.foot img{ width: 80px; }
.foot_ico{ line-height: 32px; border-top:1px solid #fff; margin: 30px 0 0; color: #fff;}

.link a{ line-height: 36px; display: initial; margin: 0 16px 0 0;}


@media Only screen and (max-width: 768px) {
	.foot {padding: 0px 0 0px;}
	.foot .w1200{ width:90%; margin:  0 auto;}
	.foot ul{ display: none;}
	.foot_ico{ margin:14px 0; border-top:0px solid #fff;}
}

/* ------------------                 footer              --------------------------------------      */
/* ------------------                 dq              --------------------------------------      */

.dq {  display: block;  border-bottom: 1px solid #eee;  }
.dq span{  padding: 0 0 0 30px; background: url( ../img/dq.png) no-repeat left center; background-size: 25px;  line-height: 36px; }
.dq a{ margin: 0 10px; }

@media Only screen and (max-width: 768px) {
	.dq { width:100%; margin:  0 auto;}
	.dq .w1200{ width:90%; margin:  0 auto;    display: inline-grid;}
}

/* ------------------                 dq              --------------------------------------      */
/* ------------------                 meun_left              --------------------------------------      

.meun_left{ width:22%; float: left;}
.meun_left .meun_tit{ background: #135fbd; border-radius: 15px 15px 0 0;}
.meun_left .meun_tit img{ margin:0 auto; padding: 10px 0; display: block; }

.meun_left ul{}
.meun_left li{ border-top: 2px solid #fff; background: #333;}
.meun_left li a{ color: #fff; line-height:46px; display: block; font-size: 14px; padding: 0 24px; }
.meun_left li a i{ color: #fff; line-height:46px; display: block; float: right;  }
.meun_left li:hover{ background:#fff;  }
.meun_left li:hover a{ color:#000;}
.meun_left li.on{ background:#fff;  }
.meun_left li.on a{ color:#000;}
.meun_tel{  border-top: 2px solid #fff; background: #135fbd; color: #fff; text-align: center; padding: 20px 0;  }
.meun_tel span{ background: url(../img/tel.png) no-repeat left center; background-size: 40px; padding: 0 0 0 50px; height: 50px; line-height: 50px; display: block;display: inline-block; font-size: 18px;}


@media Only screen and (max-width: 768px) {
	.meun_tit { display: none; }
	.meun_left ul{}
	.meun_tel{ display:none;}
	.meun_left{ width: 100%; float:none;}
	.cont .w1200{ width:90%; margin:  0 auto;}
	
	.meun_left li a{ color: #fff; line-height:46px; display: block; font-size: 14px; padding: 0 24px; }
	.meun_left li a i{ color: #fff; line-height:46px; display: block; float: right;  }
	.meun_left li:hover{ background:#fff;  }
	.meun_left li:hover a{ color:#000;}
	.meun_left li.on{ background:#fff;  }
	.meun_left li.on a{ color:#000;}
	
}
 ------------------                 meun_left              --------------------------------------      */
/* ------------------                 fenye              --------------------------------------      */

.fenye{ width: 100%; margin:50px auto;    text-align: center;}
.fenye a{    border: #ddd solid 1px;    color: #000000;    margin:0 8px;    padding:8px 13px;}
.fenye a:hover {border: 1px solid #fff; background: #135fbd; color: #fff;}
.fenye a.page-num-current{border: 1px solid #fff; background: #135fbd; color: #fff;}
.fenye .page-status{ display:none;}
@media Only screen and (max-width: 768px) {	
.fenye a {    border: #ddd solid 1px;    color: #000000;    margin: 0 5px;    padding: 3px 7px;}
}	
/* ------------------                 fenye              --------------------------------------      */
/* ------------------                 product              --------------------------------------      */
/*
.pro{ width: 100%; float: right; margin: 30px 0;}
.pro ul{ margin: 0px 0;}
.pro li{ width: calc((100% - 60px) / 4); margin: 0 20px 20px 0; float: left; position: relative;}
.pro li:nth-child(4n){ margin: 0 0 20px;}
.pro a{}
.pro li img{ width: 100%; transform: scale(0.8, 0.8); }
.pro li span{     display: block;    background: #eee; text-align: center; line-height: 36px;}
*/

.pro ul{margin: 50px 0 0 ;}
.pro li{ width: calc((100% - 60px)/4); float: left; margin: 0 20px 20px 0; position: relative;}
.pro li:nth-child(4n){margin: 0 0px 20px 0;}
.pro li a{ border: 1px #ccc solid; display: block; background: #ccc;}
.pro li img{ width: 100%; }
.pro li span{ position: absolute; top: 0; left: 0; right: 0; text-align: center; line-height: 32px; background: #135fbd; color: #fff; width: 60%; margin: 0 auto;}
.pro li:hover span{ background: #a9261e; }


@media Only screen and (max-width: 768px) {
	
	.pro .w1200{ width:90%; margin:  0 auto;}
	.pro li{ width: calc((100% - 20px)/2); float: left; margin: 0 20px 20px 0; position: relative;}
	.pro li:nth-child(2n){margin: 0 0px 20px 0;}
	.pro li span{/*white-space:inherit;*/}
	.pro li span {
       position: inherit; 
    top: 0;
    left: 0;
    right: 0;
    text-align: center;
    line-height: 32px;
    background: none; 
    color: #000;
    width: 90%;
    margin: 0 auto;
    display: block;
}
	
}



.pro_top{ margin: 50px 0;     padding: 40px;
box-shadow: 1px 15px 59px 0px rgba(123,123,123,0.25);
-webkit-box-shadow: 1px 15px 59px 0px rgba(123,123,123,0.25);
-moz-box-shadow: 1px 15px 59px 0px rgba(123,123,123,0.25);}
.pro_left{ width:40%; float: left;}
.pro_left img{ width:100%;}
.pro_right{ width:54%;float: right; padding: 10px 2%}
.pro_right h2{ font: 16px;}
.pro_right p{ margin: 10px 0; color: #666;    line-height: 24px; }
.pro_tt h3{ line-height:42px; padding: 0 0 0 20px;    background: #eee;    color: #333;margin: 0 0 20px;}
.pro_right a{ padding: 0 10px; line-height: 32px; background: #e30c0c; color: #fff;  display: table;}
.pro_tt span{ white-space:inherit; }
	@media Only screen and (max-width: 768px) {
		
		.pro{ width:100%; margin:  30px auto 0; float:none;  border: 00;    padding: 0px;}
		.pro ul{ margin: 20px 0 0 0;}
		.pro li{ width: calc((100% - 20px) / 2); margin: 0 20px 20px 0; float: left; position: relative;}
		.pro li:nth-child(2n){ margin: 0 0 20px;}		
		.pro_left{ width:100%; float: none;margin: 00px auto 20px;}
		.pro_right{ width:100%;float: none; padding: 0;}
		.pro_right p{  }
		.bigimg{ display: none; }
		.zoomdiv{ display: none;    background: none!important;    border: none!important; }
		.jqZoomPup{ display: none; }
		
	}
/* ------------------                 product              --------------------------------------      */
/* ------------------                 case              --------------------------------------      */


.case{ width: 100%; float: right;}
.case ul{ margin: 50px 0;}
.case li{ width: calc((100% - 60px) / 4); margin: 0 20px 20px 0; float: left; position: relative;}
.case li:nth-child(4n){ margin: 0 0 20px;}
.case a{}
.case li img{ width: 100%;max-height:300px;}
.case li span{     display: block;    background: #eee; text-align: center; line-height: 36px;}

	
	@media Only screen and (max-width: 768px) {
		
		.case{ width:100%;margin:  30px auto 0;float:none;}
		.case li{ width: calc((100% - 20px) / 2); margin: 0 20px 20px 0; float: left; position: relative;}
		.case li:nth-child(2n){ margin: 0 0 20px;}	
		.case li img{ width: 100%;max-height: 250px;}
	}
	
/* ------------------                 case              --------------------------------------      */
/* ------------------                 about              --------------------------------------      */

.about{ width: 100%; color: #333; margin: 50px 0 100px 0;}
.about_one { margin: 80px 0 10px;  }
.about_one h3{ line-height: 56px; border-bottom: 1px solid #eee; font-size:24px; font-weight: normal; text-align: center; }

.about_left{ width: 46%; float: left; }
.about_left img{width:100%; margin: 0 auto; text-align: center; margin: 50px auto; display: block;}

.about_right{ width: 50%; float: right;  margin: 50px auto; }
.about_right p{ line-height: 32px;}

.about_one ul{ margin: 20px 0;  }


.about_one ul{ margin: 80px 0 100px;}
.about_one li{ width: calc((100% - 80px) / 5); margin: 0 20px 20px 0; float: left; position: relative;}
.about_one li:nth-child(5n){ margin: 0 0 20px;}
.about_one li img{width: 100%;}

	@media Only screen and (max-width: 768px) {
		.about_cont{  }
		.about{ width:100%; margin:  30px auto 100px;float:none;}
		
		.about_left{ width: 100%; float: none; }
		.about_left img{width:100%; margin: 0 auto; text-align: center; margin: 50px auto; display: block;}

		.about_right{ width: 100%; float: none; }
		.about_right h2{ width: 100%; margin: 0 0 30px; }
		
		.about_one li{ width: calc((100% - 20px) / 2); margin: 0 20px 20px 0; float: left; position: relative;}
		.about_one li:nth-child(2n){ margin: 0 0 20px;}
		.about_one li:nth-child(5){ display: none;}

	}
	
/* ------------------                 about              --------------------------------------      */

/* ------------------                 news              --------------------------------------      */

.news{ width: 100%; float: right; margin: 50px 0;}
.news ul{margin: 50px 0;}
.news li{ width: calc((100% - 60px) / 4); margin: 0 20px 20px 0; float: left; position: relative;}
.news li:nth-child(4n){ margin: 0 0 20px;}
.news a{}
.news li img{ width: 100%; float: none; margin: 0 0 0 0;     max-height: 170px;}
.news .news_tt{ width:100%; float: none;}
.news .news_tt span{ line-height: 36px; font-size: 16px;width: 100%;    display: block;}
.news .news_tt p{ color: #ccc; line-height: 24px;min-height: 72px;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 3;
	overflow: hidden;}

.news h2{ text-align: center; line-height: 36px; }
.news .font{  text-align: center; line-height: 36px; border-bottom: 1px dashed #ccc;}
.news .font span{ margin: 0 20px;}
.news .news_cont{ margin: 30px 0 0 0;}
.news .news_cont span{ white-space:inherit; }

.sxy{ margin: 50px 0; line-height: 36px; border-top:1px dashed #ccc; position: relative; padding: 0 10px; }
.sxy a{display: block;}
.sxy a.a3{ position: absolute; top: 10px; right: 10px; display: block; padding: 4px 24px; border-radius: 10px;background:#135fbd;  color: #fff; }
@media Only screen and (max-width: 768px) {
		
		.news{ width:100%; margin:  30px auto 0;float:none;}
		.news li{ width: calc((100% - 20px) / 2); margin: 0 20px 20px 0; float: left; position: relative;}
		.news li:nth-child(2n){ margin: 0 0 20px;}
		.news li img{ width: 100%; float: left; margin: 0 2% 0 0; }
		.news .news_tt{ width:100%; float: right;}
		.news .news_tt span{ line-height: 36px; font-size: 16px;}
		.news .news_tt p{ color: #ccc; line-height: 24px;}
		.sxy{padding:0;}
	}
/* ------------------                 contact              --------------------------------------      */


.contact_cont .w1200{ margin: 50px auto; }	
.contact_left{ width: 50%; float: left;}
.email_input{ width: 50%; float: left; }
@media Only screen and (max-width: 768px) {
		
		.contact_cont .w1200{ width:90%;  margin: 50px auto; }	
		.contact_left{ width: 100%; float: left;}
		.email{ width:100%; float: right;}
	}
/* ------------------                 contact              --------------------------------------      */
/* ------------------                 news              --------------------------------------      */




.email{ width:50%; float: right;}
.email h3{    font-size: 18px; color: rgb(190, 0, 0);  }
.email form{ margin:0px auto; text-align:left;}
.email form { margin: 0px auto; text-align: left;}
.email form dl { width: 100%; text-align: left; padding: 0px;}
.email form dl dt { width: 90px; font-size: 14px; line-height: 28px; color: #666;  text-align: left;}
.email form dl dt, .email form dl dd { padding: 8px 0px;}
.email form dl dt span { color: #ff0000; padding-left: 6px;}
.email form dl dd { padding-left: 90px;  margin-top: -40px;}
.email form dl dd select { width: auto; font-size: 14px;  font-family: Arial;  color: #666;  padding: 5px 20px;  border: 1px solid #ddd;  cursor: pointer;  margin-right: 10px;}
.email form dl input, .email form dl textarea {padding: 0px 20px;  font-family: Arial; border: 1px solid #ddd; color: #888;  font-size: 14px; border-radius:3px; margin-right: 20px;}
.email form dl input { width: 60%; height: 30px;}
.email form dl textarea {width: 96%; height: 120px; border: 1px solid #ddd; overflow: auto;  padding: 20px 2%;}
.email form dl #checksn { width: 10%;}
.email form dl .button input { width: auto; height: 45px; line-height: 45px; border: none; color: #fff; padding: 0px 35px; cursor: pointer; font-weight: bold; background:#a92614; border-radius:3px; font-size: 16px; margin: 15px auto; transition:all .35s;}
.email form dl .button input:hover{ background:#666;}

@media Only screen and (max-width: 768px) {
		
		.email{ width:100%; margin:  30px auto 0;float:none;}
	}


/* ------------------                 product              --------------------------------------      */

#preview{}
#preview .jqzoom{position:relative;display:block;overflow:hidden;width: 100%;height: 300px;}
#preview .jqzoom img{position: absolute;width: auto;height: 100%;left: 50%;-ms-transform: translateX(-50%);-webkit-transform: translateX(-50%);transform: translateX(-50%);top: 0;}

.zoomdiv{z-index:100;position:absolute;background:#ffffff;border:1px solid #E5E5E5;display:none;text-align:center;overflow:hidden;}
.zoomdiv img{width:1613px;height:1000px;position:absolute;left:50%;margin-left: -510px; max-width: none;}
.jqZoomPup{z-index:10;visibility:hidden;position:relative;border:1px solid #1E5AAE;background:#ffffff;opacity: 0.5;cursor:crosshair;}

@media Only screen and (max-width: 768px) {
#preview .jqzoom {max-height: 300px;}
#preview .jqzoom img {height: auto;}
}