@charset "utf-8";
/* CSS Document */
html, body {font-size: 12px;margin: 0px;padding: 0px;text-decoration: none;font-family: "微软雅黑";background: #fff;text-align: center;-webkit-text-size-adjust: none;}
a {	color: #444;text-decoration: none;outline: 0px none; star:expression(this.onFocus=this.blur());}
a:hover, a:active { color: #e6212a;}
* { margin: 0px;padding: 0px;list-style: none;}
table {	border-collapse: collapse;}
ul, li {list-style: none;border: 0 none;padding: 0px;}
form {margin: 0px;}
img {border: 0px none;text-align-last: center;vertical-align: middle; _azimuth:expression(this.pngSet?this.pngSet=true:(this.nodeName == "IMG" && this.src.toLowerCase().indexOf('.png')>-1?(this.runtimeStyle.backgroundImage = "none", this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.src + "', sizingMethod='image')", this.src = "images/blank.gif"):(this.origBg = this.origBg? this.origBg :this.currentStyle.backgroundImage.toString().replace('url("', '').replace('")', ''), this.runtimeStyle.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + this.origBg + "', sizingMethod='crop')", this.runtimeStyle.backgroundImage = "none")), this.pngSet=true);}
center {text-align: left;	color: #999;height: 50px;}
#dhtmltooltip {z-index: 100;visibility: hidden;	position: absolute;text-align: left;border: 1px solid #ccc;}
#clear, .clear {clear: both;float: none!important;background: none;width: inherit !important;	height: inherit !important;}
#noData, .noData {color: #ccc;font-size: 14px;text-align: left;padding: 50px 0px;}
.fl-left{ float:left;}
.fl-right{ float:right;}

/*   

head

-----------------------------------------------------------------*/
#head { position:relative; z-index:999; width:100%; height:82px; background:#fff; margin:0 auto;}
#head .wrap{ width:90%; max-width:1140px; margin:0 auto;}
#head .logo{width:250px; text-align:left; line-height:82px;}
#head .menu{ width:800px; text-align:right;}
#head .menu ul{height:82px; line-height:82px;}
#head .menu ul>li{ display:inline-block; text-align:center;}
#head .menu ul>li:last-of-type a{ padding-right:0 !important;}
#head .menu ul>li>a{position:relative; padding:0px 16px;font-size:16px; color:#444; text-align:center; line-height:82px; display:inline-block; transition:all .25s;}
#head .menu ul>li>a img{ height:18px; width:auto; -webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%);filter: gray;}
#head .menu ul>li>a img:hover{ -webkit-filter: grayscale(0);-moz-filter: grayscale(0);-ms-filter: grayscale(0);-o-filter: grayscale(0);filter: grayscale(0);}
#head .menu ul>li>a:after{ position:absolute; z-index:999; left:50%; bottom:0; margin-left:-8px; width: 0;height: 0;border-left: 10px solid transparent;border-right: 10px solid transparent;border-top: 10px solid #fff; content:''; transition:all .35s;}
#head .menu ul>li:last-of-type a:after{margin-left:-2px;}
#head .menu ul>li>a:hover{color:#e6212a;}
#head .menu ul>li.A>a:after{bottom:-10px;}
#head .menu ul>li.A>a{ color:#e6212a !important;}
#head .menu ul>li.A>a img{-webkit-filter: grayscale(0);-moz-filter: grayscale(0);-ms-filter: grayscale(0);-o-filter: grayscale(0);filter: grayscale(0);}
#head .menu ul>li>div{position:absolute; z-index:100; left:0; top:82px; width:100%; height:80px; background:#eee; overflow:hidden; display:none; transition:top .35s;}
#head .menu .box-wrap{ width:90%; max-width:1140px; line-height:82px; margin:0 auto; text-align:left;}
#head .menu ul>li>div a{ display:inline-block; font-size:16px; color:#777; margin:0 14px; transition:all .35s;}
#head .menu ul>li>div a:hover{ color:#e6212a;}
#head .menu ul>li>div #search{ border:1px solid #ddd; border-radius:10px; width:99.8%; height:40px; margin-top:20px; background:#fff;}
#head .menu ul>li>div #search input[type="text"]{outline: medium;float:left;height:40px;line-height:40px;width:78%; padding:0 5%;border:none; font-family:微软雅黑; background:none;color:#777;box-sizing:border-box;overflow:hidden;}
#head .menu ul>li>div #search input::-webkit-input-placeholder, #head .menu ul>li>div #search textarea::-webkit-input-placeholder { color:#ccc;}
#head .menu ul>li>div #search button{	float:right;width:12%;height:40px;border:none; opacity:.8;background:url(../images/go.png) no-repeat center center;background-size:auto 18px;cursor:pointer;box-sizing:border-box;overflow:hidden;}
#head .menu .s1{ width:700px; padding-left:385px;}
#head .menu .s2{ width:980px; padding-left:250px;}
#head .menu .s3{ width:700px; padding-left:585px;}
#head .menu .s4{ width:400px; padding-left:685px;}
#head .menu .s5{ width:930px; padding-right:265px; text-align:right;}
#head .menu .s6{ width:1030px; padding-right:165px; text-align:right;}
#head .menu .s7{ width:1100px; padding-right:40px; text-align:right;}
#head .menu .s8{ width:400px; padding-left:740px; text-align:right;}
#head .wap{ display:none;}
#wap{display:none;}

@media only screen and (max-width: 1280px) {
  #head { position:fixed; left:0; top:0; height:60px; border-bottom:1px solid #ccc;}
  #head .logo{width:40%;line-height:60px;}
  #head .logo img{ height:25px; width:auto;}
  #head .menu{ display:none;}
  #head .wap{ display:block; width:60%; text-align:right; line-height:60px;}
  #head .wap>a{ display:inline-block; margin-left:12px;}
  #head .wap>a img{ height:25px; width:auto;}

  #wap{ display:block; position:fixed; z-index:99; left:0; top:60px; width:100%;}
  #wap>.search{ display:none; background:rgba(0,40,40,.8);padding:20px;}
  #wap>.search form{ border:1px solid #ddd; border-radius:5px; width:99.8%; height:40px; background:#fff;}
  #wap>.search input[type="text"]{outline: medium;float:left;height:40px;line-height:40px;width:78%; padding:0 5%;border:none; font-family:微软雅黑; background:none;color:#777;box-sizing:border-box;overflow:hidden;}
  #wap>.search input::-webkit-input-placeholder, #head .menu ul>li>div #search textarea::-webkit-input-placeholder { color:#ccc;}
  #wap>.search button{float:right;width:12%;height:40px;border:none; opacity:.8;background:url(../images/go.png) no-repeat center center;background-size:auto 18px;cursor:pointer;box-sizing:border-box;overflow:hidden;}

  #wap>.language{ display:none; width:14%; float:right; background:#eee;}
  #wap>.language>a{display:block; padding:8px 0; font-size:14px; color:#999; border-bottom:1px solid #ddd;}

  #wap>.menu{ display:block; position:fixed; left:-100%;top:60px;width: 100%;height: 100%; background:#eee; overflow:hidden;}
  #wap>.menu>ul{ width:90%; margin:0 auto; padding:20px 0;}
  #wap>.menu>ul>li{display:block; width:100%; text-align:left;}
  #wap>.menu>ul>li>a{ display:block; width:100%; padding:25px 0; font-size:16px; color:#444; margin:0px auto; text-align:left; border-bottom:1px solid rgba(0,0,0,.2); background:url("../images/icon-plus.png") no-repeat; background-position:98% 50%; background-size:26px auto;}
  #wap>.menu>ul>li.A>a{ color:#e6212a !important; background:url("../images/icon-minus.png") no-repeat; background-position:98% 50%; background-size:26px auto;}
  #wap>.menu>ul>li>div{ display:none; padding:10px 0px; width:100%; margin:0px auto;}
  #wap>.menu>ul>li>div a{display:block;padding:5px 0;font-size:16px; color:#999;}
}

@media only screen and (max-width: 420px) {
  #head { height:40px;}
  #head .logo{width:40%;line-height:40px;}
  #head .logo img{ height:18px;}
  #head .wap{ width:40%; line-height:40px;}
  #head .wap>a img{ height:18px;}

  #wap{ top:40px;}
  #wap>.search{ padding:15px;}
  #wap>.search form{ height:30px;}
  #wap>.search input[type="text"]{height:30px;line-height:30px;}
  #wap>.search button{height:30px;background-size:auto 18px;}

  #wap>.language{ width:20%;}
  #wap>.language>a{font-size:12px;}

  #wap>.menu{ top:40px;}
  #wap>.menu>ul>li>a{ padding:10px 0; font-size:14px; background-size:18px auto;}
  #wap>.menu>ul>li.A>a{ background-size:18px auto;}
  #wap>.menu>ul>li>div a{font-size:14px;}

}

/* end*/




/*

banner

-----------------------------------------------------------------*/
#banner { max-width: 100%; height:auto; position: relative; z-index: 1; background:#eee; overflow: hidden; margin: 0px auto;}
#banner .tit{ position:absolute; z-index:9; left:50%; top:50%; width:1140px; height:60px; margin-top:0px; margin-left:-570px; text-align:left;font-size:30px; color:#fff; transition:all .35s;}
#banner .path{ position:absolute; z-index:9; left:50%; bottom:0; width:1160px; height:60px; line-height:60px; margin-left:-580px; text-align:left;font-size:14px; color:#888; background:#fff; transition:all .35s;}
#banner .path a{font-size:14px; color:#888; transition:all .35s;}
#banner .path a:first-child{ margin-left:12px;}
#banner .path a:hover{ color:#e62128;}
#banner .path>.back{position:absolute; z-index:1; right:25px; top:15px; width:105px; height:35px; line-height:35px; text-align:center; font-size:14px; color:#e6212a; border:1px solid #e6212a; border-radius:30px;}
#banner .path>.back:hover{ border:1px solid #e62128;}
#banner .swiper-pagination{ bottom:38px;}
#banner .swiper-pagination-bullet {width: 14px;height: 14px;background: #fff; opacity:1;}
#banner .swiper-pagination-bullet-active { background: #e6212a;}
#banner .swiper-slide .phoneimg{ display:none;}

@media only screen and (max-width: 1280px) {
  #banner { margin-top:60px;overflow:inherit;}
  #banner .tit{ width:93.75%; margin-left:-45%; font-size:20px;}
  #banner .path{ width:93.75%; height:40px; line-height:40px; margin-left:-46.8%; text-align:left;font-size:12px;}
  #banner .swiper-slide img{max-width:100%; height:auto;}
}
@media only screen and (max-width: 780px) {
  #banner { margin-top:40px;}
  #banner .tit{ height:30px; margin-top:-10px; font-size:16px;}
  #banner .path{ bottom:-40px;}
 /* #banner .swiper-slide .pcimg{margin: auto; overflow: hidden; display:none; max-width: 100%;}*/
  #banner .swiper-slide .pcimg{display:none;}
  #banner .swiper-slide .phoneimg{display:block;}
  #banner .swiper-pagination{ bottom:10px;}
  #banner .swiper-pagination-bullet {width: 10px;height: 10px;}
}
@media only screen and (max-width: 420px) {
  #banner .tit, #banner .path{ display:none;}
}
/* end*/


/*

main

-----------------------------------------------------------------*/
#main{ width:100%; height:auto; margin:0 auto;}
#main .product{ width:90%; max-width:1140px; margin:0px auto; padding:50px 0;}
#main .product .title{ margin:0 auto; text-align:center;}
#main .product .title>h2{ display:block; padding:5px 0; font-family:"Arial"; font-size:36px; font-weight:bold; text-transform:uppercase; color:#444;}
#main .product .title>h3{ display:block; font-size:30px;font-weight:normal; color:#444;}
#main .product .container{width:100%; margin:0 auto; padding-top:80px;}
#main .product .container>.item{ float:left; width:20%; text-align:center;}
#main .product .container>.item a{ display:block; transition:all .35s;}
#main .product .container>.item .icon{ position:relative; display:block; width:220px; height:220px; margin:0 auto; overflow:hidden;}
#main .product .container>.item .icon>img{position:absolute; z-index:1; left:0; top:0; width:100%; height:auto;}
#main .product .container>.item .name{ font-size:16px; color:#444; text-align:center; transition:all .35s; padding-top:20px;}
#main .product .container>.item a:hover .name{ color:#e6212a;}
/*#main .product .container>.item a:hover .icon>img{ top:-110px;}*/
#main .product .container>.item a:hover{transform: translateY(-6px);}
#main .product .container>.more{ display:none;}

@media only screen and (max-width: 420px) {

	#main .product .container>.item .icon{ position:relative; display:block; width:120px; height:120px; margin:0 auto; overflow:hidden; }

		}

#main .search{ position:relative; width:100%; height:490px; overflow:hidden;background-image:url("../images/search-bg.jpg");background-repeat:no-repeat;background-position:center;background-attachment:fixed;background-size:cover;-webkit-background-size:cover;margin:0 auto;}
#main .search .text{ position:relative; z-index:99; width:90%; max-width:1140px; padding-top:90px; margin:0 auto;text-align:center;}
#main .search .text .en{ font-family:"Arial"; font-size:24px; text-transform:uppercase; color:#fff;}
#main .search .text .en>h1{ font-size:55px; font-weight:normal; text-transform:none;}
#main .search .text .cn{ padding:10px 0; font-size:18px; color:#fff;}
#main .search .container{ position:relative; z-index:99; width:400px; padding-top:120px; margin:0 auto; transition:all .35s;}
#main .search .container #mainsearch{ width:99.8%; height:55px; border:1px solid #fff; border-radius:30px; overflow:hidden; transition:all .35s;}
#main .search .container #mainsearch input[type="text"]{outline: medium;float:left;height:55px;line-height:55px;width:78%; padding:0 10%;border:none; font-family:微软雅黑; background:none;color:#fff;font-size:18px; box-sizing:border-box;overflow:hidden;}
#main .search .container #mainsearch input::-webkit-input-placeholder, #main .search .container #mainsearch textarea::-webkit-input-placeholder { color:#fff;}
#main .search .container #mainsearch button{float:right;width:18%;height:55px;border:none; opacity:.8;background:url(../images/go-white.png) no-repeat center center;background-size:auto 24px;cursor:pointer;box-sizing:border-box;overflow:hidden;}
#main .search .container #mainsearch:hover{ background:rgba(225,255,255,.1);}
#main .search .container #mainsearch:hover button{opacity:1;background: rgba(255,255,255,1) url(../images/go-dark.png) no-repeat center center;background-size:auto 24px;}

#main .newpro{ width:90%; max-width:1140px; height:auto; margin:0 auto; padding-top:40px; padding-bottom:40px;}
#main .newpro .img{ width:52%; max-width:500px; height:auto;}
#main .newpro .img>img{ width:100%; height:auto;}
#main .newpro .container{ width:48%; max-width:550px; padding-top:45px; text-align:left;}
#main .newpro .container>.name{ padding:25px 0; border-bottom:1px solid #b8b6b6; font-size:24px; color:#444;}
#main .newpro .container>.text{ margin:25px 0; height:180px; padding:0 10px 0 0; font-size:14px; line-height:30px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 6;overflow: hidden;}
#main .newpro .container>.more{ padding:10px 0; text-align:left;}
#main .newpro .container>.more a{ display:inline-block; padding:7px 40px; color:#fff;font-size:18px; background:#e6212a; border:1px solid #e6212a; border-radius:30px; transition:all .35s;}
#main .newpro .container>.more a:hover{ background:none; color:#e6212a;}
#main .newpro .swiper-pagination{ bottom:0px;}
#main .newpro .swiper-pagination-bullet {width: 14px;height: 14px;background: #c4c4c4; opacity:1;}
#main .newpro .swiper-pagination-bullet-active { background: #e6212a;}

#main .solution{ width:100%; margin:0px auto; padding:50px 0; background:#f4f4f4;}
#main .solution .title{ margin:0 auto; text-align:center;}
#main .solution .title>h2{ display:block; padding:5px 0; font-family:"Arial"; font-size:36px;font-weight:bold; text-transform:uppercase; color:#444;}
#main .solution .title>h3{ display:block; font-size:30px;font-weight:normal; color:#444;}
#main .solution .container{ position:relative; width:90%; max-width:1140px; margin:70px auto 0 auto;}
#main .solution .container>.item-left{  width:67.7%; float:left;}
#main .solution .container>.item-left .s1{ margin-bottom:4px;}
#main .solution .container>.item-left .s2{ width:100%;}
#main .solution .container>.item-left .s2>a{ width:49.7%;}
#main .solution .container>.item-left .s2>a:first-of-type{ float:left;}
#main .solution .container>.item-left .s2>a:last-of-type{float:right;}
#main .solution .container>.item-right{position:absolute; z-index:1; right:0; top:0; width:32%; height:100%; overflow:hidden;}
#main .solution .container>.item-right .img span{ display:block; width:100%; height:100%; background-position: center;background-size: cover; transition: all 0.2s;}
#main .solution .container>.item-right .more{ display:none;}
#main .solution .container img{width:100%; height:auto;transition: all 0.2s linear;}
#main .solution .container a{ position:relative; display:block; width:100%;height:100%; overflow:hidden;}
#main .solution .container a:after{position:absolute; z-index:2; left:0; top:0; width:90%; height:100%; padding:5%; text-align:left;font-size:24px; color:#fff; background-position:50% 45%; background-size:auto 70px; content:attr(data-title); transition:all .35s;}
#main .solution .container a:hover:after{background:rgba(247,66,72,.8) url("../images/icon-zoom-plus.png") no-repeat; background-position:50% 45%; background-size:auto 70px;}
#main .solution .container a:hover img{transform:scale(1.1);}
#main .solution .container>.item-right a:hover span{transform:scale(1.1);}

#main .news{ width:90%; max-width:1140px; margin:0px auto; padding:50px 0;}
#main .news .title{ margin:0 auto; text-align:center;}
#main .news .title>h2{ display:block; padding:5px 0; font-family:"Arial"; font-size:36px;font-weight:bold; text-transform:uppercase; color:#444;}
#main .news .title>h3{ display:block; font-size:30px;font-weight:normal; color:#444;}
#main .news .container{ position:relative; width:100%; margin:80px auto 0 auto;}
#main .news .container>.focus{ width:100%;margin:0 auto;}
#main .news .container>.focus .content{ width:49%; text-align:left; overflow:hidden;}
#main .news .container>.focus .img{ width:49%; overflow:hidden;}
#main .news .container>.focus .img img{ width:100%;height:auto;}
#main .news .container>.focus .tit{ font-size:24px; font-weight:bold; color:#777;}
#main .news .container>.focus .list{ padding:0;}
#main .news .container>.focus .list>a{ display:block; padding-top:24px;}
#main .news .container>.focus .list>a .name{ padding:24px 0; font-size:24px; color:#e6212a; overflow: hidden;text-overflow:ellipsis;white-space: nowrap; transition:all .35s;}
#main .news .container>.focus .list>a .text{ height:70px; font-size:14px;color:#444; line-height:24px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;}
#main .news .container>.list{ padding:80px 0 40px 0;}
#main .news .container>.list>a{ position:relative; display:block;float:left; width:48%; margin-bottom:40px;}
#main .news .container>.list>a:nth-of-type(2n){float:right;}
#main .news .container>.list>a .time{ width:60px; text-align:center;}
#main .news .container>.list>a .time>.day{ width:60px; height:60px; background:#999;border-radius:3px; text-align:center; overflow:hidden; color:#fff; font-size:14px; transition:all .35s;}
#main .news .container>.list>a .time>.day>span{ display:block; padding-top:5px; font-size:24px;}
#main .news .container>.list>a .time>.year{ padding:8px 0; font-size:14px; color:#999;}
#main .news .container>.list>a .content{  width:86%; text-align:left;}
#main .news .container>.list>a .content>.name{ padding-bottom:20px; font-size:18px; color:#444;overflow: hidden;text-overflow:ellipsis;white-space: nowrap; transition:all .35s;}
#main .news .container>.list>a .content>.text{ font-size:14px; color:#444; line-height:20px; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}
#main .news .container>.list>a:hover .time>.day{ background:#e6212a;}
#main .news .container>.list>a:hover .name{color:#e6212a;}

#main .news .more{ padding:20px 0; text-align:center;}
#main .news .more>a{ display:inline-block; padding:12px 36px; font-size:18px; color:#e6212a; border:1px solid #e6212a; border-radius:50px; transition:all .35s;}
#main .news .more>a:hover{ background:#e6212a; color:#fff;transform: translateY(-6px);}


@media only screen and (max-width: 1280px){
  #main .newpro .container{ padding-top:40px;}
  #main .newpro .container>.text{ margin:10px 0; height:120px; -webkit-line-clamp:4;}

  #main .solution .container a:after{font-size:20px;}

  #main .news .container>.focus .list>a .name{ padding:10px 0; font-size:20px;}
  #main .news .container>.focus .list>a .text{ height:60px; line-height:20px;}
  #main .news .container>.list>a .content{width:82%;}
  #main .news .container>.list>a .content>.name{ padding-bottom:16px;}


}

@media only screen and (max-width: 780px){
  #main .search{background-attachment: scroll!important;}
  #main .search .container{ width:80%; padding-top:60px;}

  #main .newpro{ height:auto; padding:30px 0;}
  #main .newpro .img{ width:50%;}
  #main .newpro .container{ width:50%; padding-top:20px;}
  #main .newpro .container>.text{ margin:10px 0; height:60px; -webkit-line-clamp:2;}
  #main .newpro .container>.more a{ padding:7px 30px;}
  #main .newpro .swiper-pagination{ bottom:0px;}

  #main .solution .container>.item-left{ width:100%; float:none!important;}
  #main .solution .container>.item-right{ position:relative; right:auto; top:4px; width:100%; height:260px; overflow:hidden;}
  #main .solution .container>.item-right a{ width:49.7%; max-width:380px;}
  #main .solution .container>.item-right .img{ float:left;}
  #main .solution .container>.item-right .more{ display:block!important; float:right; background:#e6212a url("../images/icon-more.png") no-repeat; background-position:50% 50%; background-size:100px auto; transition:all .35s;}
  #main .solution .container>.item-right .more:hover{ background:#e62128 url("../images/icon-more.png") no-repeat;background-position:50% 50%; background-size:100px auto;}
  #main .solution .container>.item-right .more:after{ display:none!important;}

  #main .news .container>.focus .content{ width:100%; float:none!important;}
  #main .news .container>.focus .tit{ padding-top:30px;}
  #main .news .container>.focus .img{ width:100%; float:none!important;}
  #main .news .container>.list{ padding:40px 0;border-top:2px solid #eee; margin-top:40px;}
  #main .news .container>.list>a{ float:none!important; width:100%;}

}

@media only screen and (max-width: 420px) {
  #main .product .title>h2{ font-size:21px;}
  #main .product .title>h3{ font-size:18px;}

  #main .product .container{ padding-top:0px !important; margin-top:40px; background:#eee;}
  #main .product .container>.item{ width:49.6%; background:#fff; border:1px solid #ddd; margin-left:-1px; margin-top:-1px;}
 
  #main .product .container>.item .name{ font-size:12px; padding-bottom:20px; }
  #main .product .container>.more{ display:block; float:left; position:relative; width:49.7%; height:100%; background:#eee;}
  #main .product .container>.more a{ position:absolute; left:0; display:block; width:100%; height:100%; font-size:12px; color:#e6212a; transition:all .35s;}
  #main .product .container>.more a img{ display:block; margin:40px auto 10px auto;}

  #main .search{ height:420px;}
  #main .search .text .en{ font-size:16px;}
  #main .search .text .en>h1{ font-size:36px; padding:10px 0;}
  #main .search .text .cn{font-size:16px;}
  #main .search .container{ width:80%; padding-top:40px;}
  #main .search .container #mainsearch input[type="text"]{ width:75%; font-size:14px;}
  #main .search .container #mainsearch button{width:25%;;}

  #main .newpro .img{ width:80%; float:none!important; text-align:center; margin:0 auto;}
  #main .newpro .container{ width:100%;float:none!important; margin:0 auto; padding-top:0px!important;}
  #main .newpro .container>.name{ padding:0!important; text-align:center; border-bottom:0px !important; font-size:16px;}
  #main .newpro .container>.text{ display:none;}
  #main .newpro .container>.more{text-align:center; padding-bottom:30px;}
  #main .newpro .container>.more a{ padding:3px 8px;font-size:12px; margin:0 auto;}
  #main .newpro .swiper-pagination-bullet {width: 10px;height: 10px;}
  #main .newpro .swiper-pagination{ bottom:0px;}

  #main .solution .title>h2{ font-size:21px;}
  #main .solution .title>h3{ font-size:18px;}
  #main .solution .container{ margin-top:40px;}
  #main .solution .container a:after{font-size:16px;background-size:auto 36px;}
  #main .solution .container a:hover:after{background-size:auto 36px;}
  #main .solution .container>.item-right{ height:125px;}
  #main .solution .container>.item-right .more{ background-size:50px auto;}
  #main .solution .container>.item-right .more:hover{ background-size:50px auto;}

  #main .news .title>h2{ font-size:21px;}
  #main .news .title>h3{ font-size:18px;}
  #main .news .container{ margin-top:40px;}
  #main .news .container>.focus .tit{ font-size:18px;}
  #main .news .container>.focus .list>a .name{ font-size:16px;}
  #main .news .container>.focus .list>a .text{ height:40px; font-size:12px; line-height:20px;-webkit-line-clamp: 2;}

  #main .news .container>.list>a .time{ width:50px;}
  #main .news .container>.list>a .time>.day{ width:50px; height:50px; font-size:12px;}
  #main .news .container>.list>a .time>.day>span{ padding-top:2px; font-size:20px;}

  #main .news .container>.list>a .time>.year{ padding:3px 0; font-size:12px;}
  #main .news .container>.list>a .content{  width:80%;}
  #main .news .container>.list>a .content>.name{ padding-bottom:10px; font-size:16px;}
  #main .news .container>.list>a .content>.text{ font-size:12px; line-height:18px; -webkit-line-clamp: 2;}

  #main .news .more{ padding:0!important;}
  #main .news .more>a{ padding:10px 30px; font-size:14px;}

}





/* end*/




/*

path

-----------------------------------------------------------------*/
#path{ width:100%; height:60px; margin:0 auto;background:#f3f3f3; transition:all .35s;}
#path .wrap{ width:90%; max-width:1140px; line-height:60px; margin:0 auto; font-size:14px; color:#444; text-align:left;}
#path .wrap a{ color:#444; transition:all .35s;}
#path .wrap a:hover{color:#e6212a;}


@media only screen and (max-width: 420px) {
  #path{display:none;}
}

/* end*/

/*

title

-----------------------------------------------------------------*/
#title{ width:100%; max-width:1140px; padding:30px 0; margin:0 auto; font-size:30px; font-weight:bold; color:#444; text-align:left;}
#title>span{ color:#e6212a; font-size:28px;}

@media only screen and (max-width: 1280px) {
  #title{ width:93.75%;}
}
@media only screen and (max-width: 760px) {
  #title{ font-size:24px;}
}
@media only screen and (max-width: 420px) {
  #title{padding:10px 0 20px 0; font-size:20px;}
}
/* end*/

/*

navpart

-----------------------------------------------------------------*/
#navpart{ width:100%; max-width:1140px; padding:40px 0; margin:0 auto;}
#navpart>.wap{ display:none;}
#navpart>ul{ display:block; margin:0 auto; text-align:left;}
#navpart>ul>li{ position:relative; width:auto; height:70px; line-height:70px; float:left; text-align:center; background:#777; border-right: 1px solid #262626; border-left: 1px solid #9e9e9e; transition:all .35s;}
#navpart>ul>li:first-of-type{ border-left:0!important;}
#navpart>ul>li:last-of-type{ border-right:0!important;}
#navpart>ul>li>a{ display:block; color:#fff;font-size:18px;}
#navpart>ul>li:hover{ background:#e62128;border-right: 1px solid #960409;border-left: 1px solid #ff6f74;}
#navpart>ul>li.A{ background:#e62128; border-right: 1px solid #960409; border-left: 1px solid #ff6f74;}
#navpart>ul>li.A:after{position:absolute; z-index:2; left:50%; bottom:-18px; width:33px; height:18px; margin-left:-17px; background:url("../images/navpart-arrow.png") no-repeat; content:'';}
#navpart>ul.w2>li{ width:49.8%;}
#navpart>ul.w3>li{ width:33.1%;}
#navpart>ul.w4>li{ width:24.7%;}

@media only screen and (max-width: 1280px) {
  #navpart{ width:93.75%;}
  #navpart>ul>li{ height:50px; line-height:50px;}
}

@media only screen and (max-width: 760px) {
  #navpart{ margin-top:10px;}
  #navpart>ul>li{ height:40px; line-height:40px;}
  #navpart>ul>li>a{font-size:16px;}
  #navpart>ul>li.A:after{bottom:-11px; width:20px; height:11px; margin-left:-10px; background-size:20px 11px!important;}

}
@media only screen and (max-width: 420px) {
  #navpart{ padding:20px 0;}
  #navpart>.wap{ display:block; height:40px; line-height:40px; background:#e62128; box-shadow:0 2px 2px rgba(0,0,0,.1) inset;}
  #navpart>.wap>.tit{ font-size:14px; color:#fff; padding:0 5%;}
  #navpart>.wap>.btn{ width:50px; height:40px; border-left:1px solid rgba(0,0,0,.1);}
  #navpart>.wap>.btn img{ height:21px; width:auto;}
  #navpart>.wap>.A{ background:#777;}
  #navpart>ul{ display:none;}
  #navpart>ul>li{ width:90% !important; height:40px; line-height:40px; padding:0 5%; float:none!important; text-align:left; background:#777; border-right:0 !important; border-left:0 !important; border-bottom: 1px solid #262626; border-top: 1px solid #9e9e9e;}
  #navpart>ul>li:first-of-type{ border-top:0 !important;}
  #navpart>ul>li>a{font-size:14px; background:url("../images/navpart-arrow-next.png") no-repeat; background-position:100% 50%;}
  #navpart>ul>li.A{ background-color:#777!important;}
  #navpart>ul>li.A:after{ opacity:0 !important;}

}

/* end*/


/*

inside

-----------------------------------------------------------------*/
#inside{ width:100%; max-width:1140px; height:auto; padding-bottom:100px; margin:0 auto; transition:all .35s;}
#inside>.navpart{ width:210px; text-align:left; padding-bottom:100px; transition:all .35s;}
#inside>.navpart>.container{ padding:0;text-align:left;}
#inside>.navpart>.container a{ position:relative; display:block; font-size:18px; height:60px; line-height:60px; color:#444; padding:0 10px; border-bottom:1px solid #eee; overflow:hidden; transition:all .35s;}
#inside>.navpart>.container a:after{ position:absolute; z-index:1; left:0; top:0; width:0; height:100%; color:#fff; font-size:18px; background:#54c2b9 url("../images/navpart-arrow-next.png") no-repeat; background-position:87% 50%; content:attr(data-title); text-align:left; overflow:hidden; transition:all .35s;}
#inside>.navpart>.container a:hover:after,#inside>.navpart>.container .A:after{ width:100%;padding-left:10px;}
#inside>.content{ width:850px; padding:0; text-align:left; transition:all .35s;}
#inside>.prolist{ width:24%; text-align:left; padding-bottom:100px; transition:all .35s;}
#inside>.prolist>.container{ padding:0;}
#inside>.prolist>.container>ul{ width:100%; margin:0 auto; padding:0;}
#inside>.prolist>.container>ul>li{ display:block; width:100%; text-align:left; margin-top:-1px;}
#inside>.prolist>.container>ul>li>a{ position:relative; display:block; border:1px solid #eee; height:60px; line-height:60px; padding:0 10px; background:#fff url("../images/navpart-arrow-down.png") no-repeat; background-position:95% 50%; font-size:18px; color:#444; margin:0px auto; text-align:left; }
#inside>.prolist>.container>ul>li.A>a{ border:1px solid #e62128; background:#e62128 url("../images/navpart-arrow-up.png") no-repeat; background-position:95% 50%; color:#fff;}
#inside>.prolist>.container>ul>li>div{ display:none; padding:15px; border-left:1px solid #eee; border-right:1px solid #eee; margin:0px auto; background:#f5f5f5;}
#inside>.prolist>.container>ul>li>div a{display:block;padding:5px 0;font-size:14px; color:#444; transition:all .35s;}
#inside>.prolist>.container>ul>li>div a:hover{ color:#e62128;}
#inside>.prolist>.container>ul>li>div .A{ color:#e62128; font-weight:bold;}
#inside>.procontent{ width:76%; padding:0; text-align:left; transition:all .35s;}

@media only screen and (max-width: 1280px) {
  #inside>.navpart{ display:none!important;}
  #inside>.prolist{ display:none!important;}
  #inside>.content{ width:100%; float:none!important;}
  #inside>.procontent{ width:100%; float:none!important;}
}

@media only screen and (max-width: 420px) {
  #inside>.content{ padding:20px 0;}

}
/* end*/




/*

about

-----------------------------------------------------------------*/
#about{ width:100%; max-width:1140px; margin:0 auto; padding-bottom:100px; text-align:left;}
#about>.img{width:33%; text-align:right;}
#about>.img>img{ width:100%; height:auto;}
#about>.container{ width:62%; text-align:left;}
#about>.container .profile{ font-size:14px; color:#666; line-height:24px;}
#about>.container .profile>p{ margin-bottom:30px;}
/*#about>.container .culture{ padding:40px 0; text-align:left; color:#666; font-size:14px;}*/
#about>.container .culture{ text-align:left; color:#666; font-size:14px;}
#about>.container .culture>h3{ display:block; padding:5px 0;color:#e6212a;font-size:18px; font-weight:bold;}
#about>.container .culture>p{ margin-bottom:20px;}

@media only screen and (max-width: 1280px) {
  #about{width:93.75%;}
}
@media only screen and (max-width: 760px) {
  #about>.img{width:100%;;float:none!important;}
  #about>.container{ width:100%; float:none!important; }
  #about>.container .profile{padding-top:20px; font-size:13px;}
  #about>.container .culture{ padding:0px 0; font-size:13px;}
}
@media only screen and (max-width: 420px) {
  #about>.container .culture>h3{ font-size:16px;}

}
/* end*/





/*

honor

-----------------------------------------------------------------*/
#honor{ width:100%; max-width:1140px; margin:0 auto; padding-bottom:100px; text-align:left;}
#honor>.container{ border-top:1px solid #d8d8d8; padding:15px 0 70px 0;}
#honor>.container>.type{ width:33%; font-size:24px; color:#444; text-align:left;}
#honor>.container>.list{ width:67%; text-align:left;}
#honor>.container>.list>a{ display:block;width:50%; float:left; padding:5px 0; font-size:14px; color:#666; overflow: hidden;text-overflow:ellipsis;white-space: nowrap; transition:all .35s;}
#honor>.container>.list>a:hover{ color:#e62128;}

@media only screen and (max-width: 1280px) {
  #honor{width:93.75%;}
}
@media only screen and (max-width: 760px) {
  #honor>.container>.type{ width:23%; font-size:20px;}
  #honor>.container>.list{ width:77%;}
}
@media only screen and (max-width: 420px) {
  #honor>.container>.type{  width:90%; float:none!important; font-size:18px; margin-bottom:10px;}
  #honor>.container>.list{ width:100%; float:none!important;}
  #honor>.container>.list>a{ display:block;width:100%; float:none!important; font-size:13px;}

}

/* end*/


/*

history

-----------------------------------------------------------------*/
#history{ width:100%; max-width:1140px; margin:0 auto; padding-bottom:100px; text-align:left;}
#history>.container{ border-top:1px solid #d8d8d8; padding:15px 0 70px 0;}
#history>.container>.title{width:33%; text-align:left;}
#history>.container>.title>.time{ padding:5px 0; font-size:30px; font-weight:bold; font-family:"Arial"; color:#c8c8c8;}
#history>.container>.title>.subtitle{ color:#e6212a; font-size:18px;font-weight:bold;}
#history>.container>.title>.text{ padding:5px 0; font-size:14px; color:#666;}
#history>.container>.content{ width:67%; text-align:left;font-size:14px; color:#666; line-height:24px;}
#history>.container>.content>span.years{padding-right:35px;}

@media only screen and (max-width: 1280px) {
  #history{width:93.75%;}
}
@media only screen and (max-width: 420px) {
  #history>.container>.title{ position:relative; width:100%; float:none!important; margin-bottom:20px;}
  #history>.container>.title:after{position:absolute; z-index:1; left:0; bottom:-6px; width:60px; height:2px; background:#e6212a; content:'';}
  #history>.container>.title>.time{ padding:5px 0; font-size:20px;}
  #history>.container>.title>.subtitle{ font-size:14px;}
  #history>.container>.title>.text{ font-size:12px;}
  #history>.container>.content{ width:100%; float:none!important;font-size:13px; line-height:18px;}
  #history>.container>.content>span.years{ display:block; padding:10px 0 0 0!important; margin-top:10px; border-top:1px dotted #ddd;}
  #history>.container>.content>span.years:first-of-type{ border:0!important;}
}
/* end*/




/*

product

-----------------------------------------------------------------*/
#prolist{ position:relative; display:none;}
#product{ width:100%; max-width:1140px; margin:0 auto; padding-bottom:100px; text-align:left;}
#product>.prolist{ width:24%; text-align:left; padding-bottom:100px; transition:all .35s;}
#product>.prolist>.container{ padding:0;}
#product>.prolist>.container>ul{ width:100%; margin:0 auto; padding:0;}
#product>.prolist>.container>ul>li{ display:block; width:100%; text-align:left; margin-top:-1px;}
#product>.prolist>.container>ul>li>a{ position:relative; display:block; border:1px solid #eee; height:60px; line-height:60px; padding:0 10px; background:#fff url("../images/navpart-arrow-down.png") no-repeat; background-position:95% 50%; font-size:18px; color:#444; margin:0px auto; text-align:left; }
#product>.prolist>.container>ul>li.A>a{ border:1px solid #df0024; background:#df0024 url("../images/navpart-arrow-up.png") no-repeat; background-position:95% 50%; color:#fff;}
#product>.prolist>.container>ul>li>div{ display:none; padding:15px; border-left:1px solid #eee; border-right:1px solid #eee; margin:0px auto; background:#f5f5f5;}
#product>.prolist>.container>ul>li>div a{display:block;padding:5px 0;font-size:14px; color:#444; transition:all .35s;}
#product>.prolist>.container>ul>li>div a:hover{ color:#df0024;}
#product>.prolist>.container>ul>li>div .A{ color:#df0024; font-weight:bold;}
#product>.container{ width:76%; padding:0; text-align:left; transition:all .35s;}
#product>.container .noData{ padding:20px 50px;}
#product>.container .list{ margin:0px auto;}
#product>.container .list>a{position:relative;display:block; float:left; width:33%; height:350px; overflow:hidden;border:1px solid #eee; margin-top:-1px; margin-left:-1px; text-align:center; overflow:hidden; transition:all .35s;}
#product>.container .list>a>.img{ display:block; width:94%; height:auto; margin:0 auto;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;}
#product>.container .list>a>.img img{ width:100%; height:auto;}
#product>.container .list>a>.name{ padding:30px 10px; text-align:center; font-size:15px; color:#444; overflow: hidden;text-overflow:ellipsis;white-space: nowrap; transition:all .35s;}
#product>.container .list>a:hover .name{ color:#df0024;}
#proview{ width:90%; max-width:1140px; height:auto; padding-bottom:100px; margin:0 auto; transition:all .35s;}
#proview>.title{ padding:30px 0; margin:20px auto 0 auto; font-size:28px; color:#df0024; text-align:left;}
#proview>.container{ position:relative; margin:0 auto;}
#proview>.container>.img-box{position:absolute; z-index:1; right:0; top:20px; width:350px; height:350px; overflow:hidden;}
#proview>.container>.img-box .swiper-container{ width:100%; height:100%; margin:0 auto;}
#proview>.container>.img-box .swiper-slide{ width:100%; height:100%; overflow:hidden; text-align:center; 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;}
#proview>.container>.img-box .swiper-slide img{width:100%; height:auto;}
#proview>.container>.img-box .swiper-pagination{ bottom:0px;}
#proview>.container>.img-box .swiper-pagination-bullet {width: 10px;height: 10px;background: #c4c4c4; opacity:1;}
#proview>.container>.img-box .swiper-pagination-bullet-active { background: #df0024;}
#proview>.container>.content{ margin:0 auto;transition:all .35s;}
#proview>.container .tag{ border-top:1px solid #e7e7e7; padding:30px 0 50px 0; text-align:left;}
#proview>.container .tag>.tagtit{ width:23%; font-size:24px; color:#444;transition:all .35s;}
#proview>.container .tag>.tagcon{ text-align:left; width:42%; font-size:14px; color:#444; line-height:24px;transition:all .35s;}

@media only screen and (max-width: 1280px){
  #product{width:93.75%;}
  #product>.prolist{ width:26%;}
  #product>.container{ width:74%;}
  #product>.container .noData{ padding:20px 0!important;}
  #product>.container .list>a{height:280px;}
  #product>.container .list>a>.name{ padding:20px 10px;}
  #proview>.container>.img-box{width:300px; height:300px;}
}
@media only screen and (max-width: 780px){
  #product>.container .list>a{width:49.6%; height:310px;}
  #proview>.title{ text-align:center;}
  #proview>.container>.img-box{ position:relative;right:auto; top:0; padding-bottom:20px; width:100%; height:auto; margin:0 auto;}
  #proview>.container .tag>.tagtit{ font-size:20px;}
  #proview>.container .tag>.tagcon{ width:77%;}
}
@media only screen and (max-width: 420px){
  #prolist{ width:93.75%; display:block;padding:20px 0; margin:10px auto 0 auto;}
  #prolist>.wap{ display:block; height:40px; line-height:40px; background:#e62128; box-shadow:0 2px 2px rgba(0,0,0,.1) inset;}
  #prolist>.wap>.tit{ font-size:14px; color:#fff; padding:0 5%;}
  #prolist>.wap>.btn{ width:50px; height:40px; border-left:1px solid rgba(0,0,0,.1);}
  #prolist>.wap>.btn img{ height:21px; width:auto;}
  #prolist>.wap>.A{ background:#777;}
  #prolist>ul{ display:none;}
  #prolist>ul>li{ width:100%; text-align:left; background:#777; border-bottom: 1px solid #262626; border-top: 1px solid #9e9e9e;}
  #prolist>ul>li:first-of-type{ border-top:0 !important;}
  #prolist>ul>li>a{ display:block; color:#fff; padding:15px 5%; font-size:14px; background:url("../images/navpart-arrow-down.png") no-repeat; background-position:95% 50%;}
  #prolist>ul>li.A>a{ background:#eee url("../images/navpart-arrow-up.png") no-repeat; background-position:95% 50%; color:#e62128;}
  #prolist>ul>li>div{ display:none; padding:15px 5%; background:#eee; border-top:1px solid #ddd;}
  #prolist>ul>li>div>a{ display:block; font-size:12px; color:#444; padding:5px 0;}
  #prolist>ul>li>div>.A{ color:#e62128;}
  #product>.prolist{ display:none;}
  #product>.container{ width:100%;}
  #product>.container .list>a{width:49.7%;height:230px;}
  #proview>.title{ font-size:18px;}
  #proview>.container .tag>.tagtit{ float:none!important; width:100%; font-size:16px; font-weight:bold; margin-bottom:10px;}
  #proview>.container .tag>.tagcon{ float:none!important; width:100%;}
}
@media only screen and (max-width: 320px) {
  #product>.container .list a{width:99.6%; height:auto;}
  #product>.container .list>a>.img{ width:80%;}
  #product>.container .list>a>.name{padding:10px; font-size:12px;}
  #proview>.container .tag>.tagtit{ font-size:14px;}
  #proview>.container .tag>.tagcon{ font-size:12px; line-height:20px;}
}


/* end*/

/*

search

-----------------------------------------------------------------*/
#search{ width:100%; max-width:1140px; margin:0 auto; text-align:left;}
#search .noData{ padding:20px 50px;}
#search .list{ margin:0px auto;}
#search .list>a{position:relative;display:block; float:left; width:24.9%; height:350px; overflow:hidden;border:1px solid #eee; margin-top:-1px; margin-left:-1px; text-align:center; overflow:hidden; transition:all .35s;}
#search .list>a>.img{ display:block; width:94%; height:auto; margin:0 auto;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;}
#search .list>a>.img img{ width:100%; height:auto;}
#search .list>a>.name{ padding:30px 10px; text-align:center; font-size:15px; color:#444; overflow: hidden;text-overflow:ellipsis;white-space: nowrap; transition:all .35s;}
#search .list>a:hover .name{ color:#e6212a;}

/* end*/






/*

news

-----------------------------------------------------------------*/
#focus{width:100%; max-width:1140px; margin:0 auto; padding-bottom:90px;}
#focus .swiper-container {width: 100%;height: 380px;margin-left: auto;margin-right: auto;}
#focus .swiper-slide{position:relative;}
#focus .focus-img {width:555px; height:380px;}
#focus .focus-img a{display:block;}
#focus .focus-img img{ width:100%; height:auto;}
#focus .focus-img .container{ position:absolute; left:0; bottom:0; color:#fff; text-align:left; width:100%; height:auto; padding:10px 0; background:rgba(0,0,0,.7);}
#focus .focus-img .container span.name{ display:block; width:90%; margin:0 auto; padding-bottom:10px; font-size:20px;}
#focus .focus-img .container span.text{ display:block; width:90%; margin:0 auto; font-size:14px; line-height:24px;}
#focus .focus-list {width:555px; height:380px; text-align:left;}
#focus .focus-list .name{ font-size:24px; color:#e6212a;}
#focus .focus-list .time{position:absolute; right:0; top:20px; color:#888; font-size:14px;}
#focus .focus-list .text{ padding:12px 0; font-size:14px; line-height:21px; color:#666;}
#focus .swiper-pagination {text-align:right!important; width:96%;}
#focus .swiper-pagination-bullet {width: 12px!important;height: 12px!important;background: #fff!important;opacity: 1!important;}
#focus .swiper-pagination-bullet-active {background: #e6212a!important;}

#news{ width:100%; max-width:1140px; margin:0 auto; text-align:left;}
#news .list{ padding:0; margin:0 auto;}
#news .list>a{ position:relative; display:block;margin-bottom:40px;}
#news .list>a .time{ width:60px; text-align:center;}
#news .list>a .time>.day{ width:60px; height:60px; background:#999;border-radius:3px; text-align:center; overflow:hidden; color:#fff; font-size:14px; transition:all .35s;}
#news .list>a .time>.day>span{ display:block; padding-top:5px; font-size:24px;}
#news .list>a .time>.year{ padding:8px 0; font-size:14px; color:#999;}
#news .list>a .content{  width:92%; text-align:left;}
#news .list>a .content>.name{ padding-bottom:20px; font-size:18px; color:#444;overflow: hidden;text-overflow:ellipsis;white-space: nowrap; transition:all .35s;}
#news .list>a .content>.text{ font-size:14px; color:#444; line-height:20px; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}
#news .list>a:hover .time>.day{ background:#e6212a;}
#news .list>a:hover .name{color:#e6212a;}
#newsview{ width:100%; max-width:1140px; height:auto; padding-bottom:100px; margin:0 auto; transition:all .35s;}
#newsview>.title{ padding:70px 0 20px 0; margin:0 auto; font-size:24px; color:#e6212a; text-align:left;}
#newsview>.time{ text-align:left; color:#888; font-size:14px;}
#newsview>.container{ position:relative; margin:0 auto; padding:50px 0;}
#newsview>.container>.text{ width:75%; padding-right:35px; padding-bottom:100px; border-right:1px solid #e7e7e7; text-align:left; font-size:14px; color:#444; line-height:24px;}
#newsview>.container>.text table{ width:100%; border-left:1px solid #e7e7e7;border-top:1px solid #e7e7e7;}
#newsview>.container>.text table td{ border-right:1px solid #e7e7e7;border-bottom:1px solid #e7e7e7; padding:10px;}
#newsview>.container>.text img{max-width:100%; height:auto;}
#newsview>.container>.text .tableWap{ overflow:hidden; overflow-x:auto;}
#newsview>.container>.other{ width:20%; text-align:left;}
#newsview>.container>.other h2{ display:block; font-size:24px; font-weight:normal; color:#e6212a;}
#newsview>.container>.other .list{ padding:10px 0; text-align:left;}
#newsview>.container>.other .list>a{ display:block; font-size:14px; color:#666; line-height:20px; padding-bottom:30px; transition:all .35s;}
#newsview>.container>.other .list>a:hover{ color:#e6212a; text-decoration:underline;}
#newsview>.container>.other .paper{ padding:10px 0; text-align:left;}
#newsview>.container>.other .paper>a{ display:inline-block; margin-top:10px; padding:10px; border:1px solid #eee; box-shadow:0 1px 3px rgba(0,0,0,.1);}
#newsview>.container>.other .paper>a img{ width:100%; height:auto;}

@media only screen and (max-width: 1280px){
  #news{ width:93.75%;}
  #focus{width:93.75%; padding-bottom:50px;}
  #news .list>a .content{width:82%;}
  #news .list>a .content>.name{ padding-bottom:16px;}
  #newsview{ width:93.75%;}
}

@media only screen and (max-width: 780px){
  #focus{padding-bottom:20px!important;}
  #focus .focus-img {width:100%; height:auto;}
  #focus .focus-list {display:none!important;}
  #news .list{ padding:40px 0;border-top:2px solid #eee; margin-top:40px;}
  #news .list>a{ float:none!important; width:100%;}
  #newsview>.title{ text-align:center;}
  #newsview>.time{ text-align:center;}
  #newsview>.container>.text{ float:none!important; width:100%; padding-right:0px !important; padding-bottom:0px!important; border-right:0px!important;}
  #newsview>.container>.other{ display:none;}
}

@media only screen and (max-width: 420px) {
  #focus .focus-img .container span.name{ font-size:16px;}
  #focus .focus-img .container span.text{ font-size:12px; line-height:20px;}
  #news .list>a .time{ width:50px;}
  #news .list>a .time>.day{ width:50px; height:50px; font-size:12px;}
  #news .list>a .time>.day>span{ padding-top:2px; font-size:20px;}
  #news .list>a .time>.year{ padding:3px 0; font-size:12px;}
  #news .list>a .content{  width:80%;}
  #news .list>a .content>.name{ padding-bottom:10px; font-size:16px;}
  #news .list>a .content>.text{ font-size:12px; line-height:18px; -webkit-line-clamp: 2;}
}
/* end*/


/*

network

-----------------------------------------------------------------*/
#network{ width:100%; max-width:1140px; margin:0 auto; padding-bottom:100px; text-align:left;}
#network>.img{width:33%; padding-bottom:100px; text-align:right;}
#network>.img>img{ width:100%; height:auto;}
#network>.container{ width:62%; text-align:left;}
#network>.container>.text{ font-size:14px; color:#666; line-height:24px;}
#network>.container>.map{padding:70px 0 20px 0;}
#network>.container>.map>img{ max-width:100%; height:auto;}
#network>.container>.salse{padding-bottom:100px;}
#network>.container>.salse>h3{ display:block; margin:0 auto; text-align:left; padding-bottom:10px; font-size:18px; color:#e6212a;}
#network>.container>.salse>.item{ float:left; font-size:14px; color:#666; line-height:24px; padding-right:100px;}


@media only screen and (max-width: 1280px) {
  #network{width:93.75%;}
}
@media only screen and (max-width: 760px) {
  #network>.img{width:100%;;float:none!important;padding-bottom:0 !important;}
  #network>.container{ width:100%; float:none!important; padding:10px 0; }
  #network>.container>.salse{padding-bottom:0px!important; padding-top:40px;}
  #network>.container>.salse>.item{ float:none!important; padding-right:0px!important;}
}
@media only screen and (max-width: 420px) {
  #network>.container>.salse>h3{ font-size:16px;}
}
/* end*/



/*

support

-----------------------------------------------------------------*/
#support{ width:100%; max-width:1140px; margin:0 auto; padding-bottom:100px; text-align:left;}
#support>.img{width:33%; padding-bottom:100px; text-align:right;}
#support>.img>img{ width:100%; height:auto;}
#support>.container{ width:62%; text-align:left;}
#support>.container>.text{ font-size:14px; color:#666; line-height:24px;}
#support>.container>.text>p{ padding-bottom:25px;}
#support>.container>.text span.tel{ color:#e6212a;}
#support>.container>.after-sales{padding:80px 0;}
#support>.container>.after-sales>.item{ float:left; text-align:center; font-size:14px; color:#666; line-height:24px; padding-right:50px;}
#support>.container>.after-sales>.item>img{ display:block; margin:0 auto 8px auto;}
#support>.container>.range{ text-align:left;}
#support>.container>.range>h3{ display:block; margin:0 auto; text-align:left; padding-bottom:10px; font-size:18px; color:#e6212a;}
#support>.container>.range>.item{ float:left; font-size:14px; color:#666; line-height:24px; padding-right:100px;}


@media only screen and (max-width: 1280px) {
  #support{width:93.75%;}
}
@media only screen and (max-width: 760px) {
  #support>.img{width:100%;;float:none!important;padding-bottom:0 !important;}
  #support>.container{ width:100%; float:none!important; padding:10px 0; }
  #support>.container>.after-sales{padding:40px 0;}
  #support>.container>.after-sales>.item{ width:33%; padding-right:0!important;}
}
@media only screen and (max-width: 420px) {
  #support>.container>.range>h3{ font-size:16px;}
}
@media only screen and (max-width: 320px) {
  #support>.container>.text span.tel{ display:block; color:#e6212a;}
}
/* end*/






/*

solution

-----------------------------------------------------------------*/
#solution{ width:100%; max-width:1140px; margin:0 auto; text-align:left;}
#solution>a{ display:block; padding:3%;}
#solution>a:nth-child(2n){ background:#f3f3f3;}
#solution .img{ width:20%; text-align:left;}
#solution .img>img{width:100%; height:auto;}
#solution .container{ width:75%;text-align:left;}
#solution .container>.name{ padding:15px 0; font-size:20px; color:#444;}
#solution .container>.text{ padding:10px 0; text-align:left; color:#999; font-size:14px; line-height:24px;}
#solution .container>.more{ padding:20px 0; text-align:left;}
#solution .container>.more>span{ background:none; border:1px solid #ccc; font-size:12px; color:#e62128; padding:6px 20px; transition:all .35s;}
#solution>a:hover .more>span{ background:#e62128; border:1px solid #e62128; color:#fff;}
#solution>a:hover .name{color:#e62128;}

#solutionview{ width:90%; max-width:1140px; height:auto; padding-bottom:100px; margin:0 auto; transition:all .35s;}
#solutionview>.title{  padding:30px 0; margin:0 auto; font-size:30px; font-weight:bold; color:#444; text-align:left;}
#solutionview>.container{ position:relative; margin:0 auto;}
#solutionview>.container>.time{ padding:10px 0; text-align:center; color:#999; font-size:12px;}
#solutionview>.container>.img{ padding:20px 0; text-align:center;}
#solutionview>.container>.img>img{max-width:100%; height:auto; margin:0 auto;}
#solutionview>.container>.content{ padding-bottom:50px; text-align:left; font-size:14px; color:#444; line-height:24px;}
#solutionview>.container>.content>.text{ padding-bottom:70px; font-size:14px; color:#666; line-height:20px;}
#solutionview>.container>.content>.title{ padding:10px 0; margin:10px auto; font-size:24px; color:#e6212a; border-bottom:1px solid #dedede;}
#solutionview>.container>.content>.distribution{ text-align:center; padding:10px 0;}
#solutionview>.container>.content>.case{ text-align:left; padding:10px 0;}
#solutionview>.container>.content table{ width:100%; border-left:1px solid #e7e7e7;border-top:1px solid #e7e7e7;}
#solutionview>.container>.content table td{ border-right:1px solid #e7e7e7;border-bottom:1px solid #e7e7e7; padding:10px;}
#solutionview>.container>.content img{max-width:100%; height:auto;}
#solutionview>.container>.content .tableWap{ overflow:hidden; overflow-x:auto;}
#solutionview>.pageurl{ padding:20px 0; text-align:center; border-top:1px solid #e7e7e7;}
#solutionview>.pageurl>a{ display:inline-block; padding:0px 20px; font-size:14px; font-weight:bold; color:#444;}
#solutionview>.pageurl>a>span{ font-weight:normal; color:#666; transition:all .35s;}
#solutionview>.pageurl>a:hover span{ color:#e62128;}



@media only screen and (max-width: 1280px){
  #solution{ width:93.75%; }
}

@media only screen and (max-width: 760px){
  #solutionview>.container>.content>.text{ font-size:13px; padding-bottom:30px!important;}
  #solutionview>.container>.content>.title{ font-size:16px!important;}
  #solutionview>.pageurl>a{ width:42%;overflow: hidden; text-overflow:ellipsis;white-space: nowrap;}
}

@media only screen and (max-width: 420px){
  #solution .img{ width:100%; float:none!important;}
  #solution .container{ width:100%;float:none!important;}
  #solutionview>.title{ padding:20px 0; font-size:18px;}
  #solutionview>.pageurl>a{ width:auto; border:1px solid #e7e7e7;padding:5px 15px; font-size:12px; font-weight:normal; margin:0 5px;}
  #solutionview>.pageurl>a>span{ display:none!important;}
}

@media only screen and (max-width: 320px) {
  #solution .container>.name{font-size:16px;}
  #solution .container>.text{ font-size:12px; line-height:20px;}
  #solutionview>.container>.text{ font-size:12px; line-height:20px;}
}

/* end*/







/*

download

-----------------------------------------------------------------*/
#download{ width:100%; max-width:1140px; margin:0 auto; text-align:left;}
#download>.img{width:33%; padding-bottom:100px; text-align:right;}
#download>.img>img{ width:100%; height:auto;}
#download>.container{ width:62%; text-align:left;}
#download>.container>.list-tr{ background:#e62128;}
#download>.container>.list-tr div{ position:relative; float:left; width:25%; height:40px; line-height:40px; color:#fff; font-size:16px;text-align:center;}
#download>.container>.list-tr div:after{position:absolute; z-index:9; right:0; top:0; width:1px; height:100%; background:#fff; content:'';}
#download>.container>.list-tr div.td1{ width:46%;text-align:left; padding:0 2%;}
#download>.container>.list-td{ margin:0px auto;}
#download>.container>.list-td a{display:block;border-bottom:1px solid #e7e7e7; transition:all .35s;}
#download>.container>.list-td div{ position:relative; float:left; width:25%; height:40px; line-height:40px; color:#7f7f7f;overflow: hidden;text-overflow:ellipsis;white-space: nowrap; font-size:14px;text-align:center;}
#download>.container>.list-td div.td1{ width:46%;text-align:left; padding:0 2%;}
#download>.container>.list-td a:hover{ background:#f7f7f7;}
#download>.view{ padding:5%; text-align:left;}
#download>.view>a{ display:block; font-size:14px; padding:5px 0; transition:all .35s;}
#download>.view>a img{ height:24px; width:auto; margin-right:6px;}
#download>.view>a:hover{ text-decoration:underline;}

@media only screen and (max-width: 1280px){
  #download{ width:93.75%; }
}
@media only screen and (max-width: 760px) {
  #download>.img{width:100%;;float:none!important; padding-bottom:0 !important;}
  #download>.container{ width:100%; float:none!important; padding:10px 0; }
}
@media only screen and (max-width: 420px){
  #download>.container>.list-tr div{height:30px; line-height:30px; font-size:14px;}
  #download>.container>.list-td div{font-size:12px;}
}

/* end*/



/*

question

-----------------------------------------------------------------*/
#question{ width:100%; max-width:1140px; margin:0 auto; text-align:left;}
#question>.list{ margin:0 auto;}
#question .list>a{ display:block; margin-bottom:20px; transition:all .35s;}
#question .list>a .name{font-size:18px; color:#444; overflow: hidden; text-overflow:ellipsis; white-space: nowrap; transition:all .35s;}
#question .list>a .name>img{ height:20px; width:auto; margin-right:6px;}
#question .list>a .time{padding:5px 32px;font-size:12px; color:#e62128;}
#question .list>a:hover .name{ color:#e6212a;}

#questionview{ width:90%; max-width:1140px; height:auto; padding-bottom:100px; margin:0 auto; transition:all .35s;}
#questionview>.title{ padding:30px 0; margin:20px auto 0 auto; font-size:28px; color:#e62128; text-align:center;}
#questionview>.container{ position:relative; margin:0 auto;}
#questionview>.container>.time{ padding:10px 0; text-align:center; color:#999; font-size:12px;}
#questionview>.container>.text{ padding-bottom:50px; text-align:left; font-size:14px; color:#444; line-height:24px;}
#questionview>.container>.text table{ width:100%; border-left:1px solid #e7e7e7;border-top:1px solid #e7e7e7;}
#questionview>.container>.text table td{ border-right:1px solid #e7e7e7;border-bottom:1px solid #e7e7e7; padding:10px;}
#questionview>.container>.text img{max-width:100%; height:auto;}
#questionview>.container>.text .tableWap{ overflow:hidden; overflow-x:auto;}
#questionview>.pageurl{ padding:20px 0; text-align:center; border-top:1px solid #e7e7e7;}
#questionview>.pageurl>a{ display:inline-block; padding:0px 20px; font-size:14px; font-weight:bold; color:#444;}
#questionview>.pageurl>a>span{ font-weight:normal; color:#666; transition:all .35s;}
#questionview>.pageurl>a:hover span{ color:#e62128;}

@media only screen and (max-width: 1280px){
  #question{ width:93.75%; }
}

@media only screen and (max-width: 780px){
  #questionview>.pageurl>a{ width:42%;overflow: hidden; text-overflow:ellipsis;white-space: nowrap;}
}

@media only screen and (max-width: 420px){
  #question .list>a .name{font-size:16px;}
  #question .list>a .name>img{ height:16px;}
  #question .list>a .time{padding:5px 25px;}

  #questionview>.title{ padding:20px 0; font-size:18px;}
  #questionview>.pageurl>a{ width:auto; border:1px solid #e7e7e7;padding:5px 15px; font-size:12px; font-weight:normal; margin:0 5px;}
  #questionview>.pageurl>a>span{ display:none!important;}
}

@media only screen and (max-width: 320px) {
  #questionview>.container>.text{ font-size:12px; line-height:20px;}

}

/* end*/








/*

talent

-----------------------------------------------------------------*/
#talent{ width:100%; max-width:1140px; margin:0 auto; padding-bottom:100px; text-align:left;}
#talent>.img{width:33%; padding-bottom:100px; text-align:right;}
#talent>.img>img{ width:100%; height:auto;}
#talent>.container{ width:62%; text-align:left;}
#talent>.container>.text{ font-size:14px; color:#666; line-height:24px;}
#talent>.container>.text>h3{ display:block; margin:0 auto; text-align:left; padding-bottom:10px; font-size:18px; color:#e6212a;}
#talent>.container>.text>.item{font-size:14px; color:#666; line-height:24px;}
#talent>.container>.text p{ padding-bottom:30px;}
#talent>.container>.text img{ max-width:100%; height:auto;}

@media only screen and (max-width: 1280px) {
  #talent{width:93.75%;}
}
@media only screen and (max-width: 760px) {
  #talent>.img{width:100%;;float:none!important;padding-bottom:0 !important;}
  #talent>.container{ width:100%; float:none!important; padding:10px 0; }
}
@media only screen and (max-width: 420px) {
  #talent>.container>.text>h3{ font-size:16px;}
}
/* end*/




/*

jobs

-----------------------------------------------------------------*/
#jobs{ width:100%; max-width:1140px; margin:0 auto; text-align:left;}
#jobs>.list-tr {background:#e7e7e7;}
#jobs>.list-tr div{ position:relative; float:left; width:auto; height:40px; line-height:40px; color:#444; font-size:16px;text-align:center;}
#jobs>.list-tr div:after{position:absolute; z-index:9; right:0; top:0; width:2px; height:100%; background:#fff; content:'';}
#jobs>.list-tr .td1 {width:36%;padding: 0px 2%;text-align: left;}
#jobs>.list-tr .td2 {width:12%;}
#jobs>.list-tr .td3 {width:12%;}
#jobs>.list-tr .td4 {width:12%;}
#jobs>.list-tr .td5 {width:12%;}
#jobs>.list-tr .td6 {width:12%;}
#jobs>.list-tr .td6:after{display:none;}
#jobs>.list-td {margin: 0px auto;height: 40px;padding: 5px 0px;border-bottom: 1px solid #eee;}
#jobs>.list-td.A div {color:#e6212a;}
#jobs>.list-td div{ position:relative; float:left; width:auto; height:40px; line-height:40px; color:#666; cursor:pointer; font-size:14px;text-align:center;}
#jobs>.list-td .td1 {width:36%;padding: 0px 2%;text-align: left;}
#jobs>.list-td .td2 {width:12%;}
#jobs>.list-td .td3 {width:12%;}
#jobs>.list-td .td4 {width:12%;}
#jobs>.list-td .td5 {width:12%;}
#jobs>.list-td .td6 {width:12%;}
#jobs>.list-td .td6 .btn {display: inline-block; text-align:center; cursor: pointer;}
#jobs>.list-td .td6 .btn img{ height:18px; width:auto; -webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%); opacity:.3; transition:all .35s;}
#jobs>.list-td .td6 .btn:hover img{ -webkit-filter: grayscale(0);-moz-filter: grayscale(0);-ms-filter: grayscale(0);-o-filter: grayscale(0);filter: grayscale(0); opacity:1;}
#jobs>.list-son {display: none;background: #f7f7f7;padding: 20px;font-size:14px; text-align: left;color: #666;}
#jobs>.list-son .text{ padding-bottom:20px;}
#jobs>.list-son .text>.item{ float:left; line-height:24px; padding-right:70px;}
#jobs>.list-son .tag {padding-bottom: 20px;line-height: 21px; color:#666;}
#jobs>.list-son .tag h4 {display: block; font-weight:normal; padding: 5px 0px;}

@media only screen and (max-width: 1280px){
  #jobs{ width:93.75%; }
}

@media only screen and (max-width: 780px){
  #jobs>.list-tr div{ font-size:14px;}
  #jobs>.list-td div{font-size:12px;}
  #jobs>.list-son {padding:10px;font-size:12px;}
}

@media only screen and (max-width: 420px){
  #jobs>.list-tr .td1 {width:48%;}
  #jobs>.list-tr .td2 { display:none;}
  #jobs>.list-tr .td3 {width:24%;}
  #jobs>.list-tr .td4 { display:none;}
  #jobs>.list-tr .td5 { display:none;}
  #jobs>.list-tr .td6 {width:24%;}
  #jobs>.list-td .td1 {width:48%;}
  #jobs>.list-td .td2 { display:none;}
  #jobs>.list-td .td3 {width:24%;}
  #jobs>.list-td .td4 { display:none;}
  #jobs>.list-td .td5 { display:none;}
  #jobs>.list-td .td6 {width:24%;}
}
/* end*/












/*

page

-----------------------------------------------------------------*/

#page{ width:100%; max-width:1140px; margin:0px auto; padding:40px 0;font-size:14px; color:#999; text-align:center;}
#page a{ display:inline-block; width:32px; height:32px; line-height:32px; margin:0 5px; border:1px solid #fff; border-radius:50%; color:#999;}
#page a:hover, #page .A{color:#e6212a;border:1px solid #e6212a;}

@media only screen and (max-width: 1280px){
  #page{ width:93.75%;}
}

@media only screen and (max-width: 780px){
  #page{ text-align:center;}
}

/* end*/



/*

foot

-----------------------------------------------------------------*/
#foot{ width:100%; margin:0 auto;background:#ececec;}
#foot .wrap{ position:relative; width:90%; max-width:1140px; padding:50px 0; margin:0 auto;}
#foot .nav-left{ width:86%; text-align:left;}
#foot .nav-left>ul{ width:100%;}
#foot .nav-left>ul>li{ display:block; float:left; width:auto; padding-right:40px;}
#foot .nav-left>ul>li:last-of-type{ padding-right:0 !important;}
#foot .nav-left>ul>li>a{ display:block; font-size:18px; color:#555;}
#foot .nav-left>ul>li>div{ padding-top:30px;}
#foot .nav-left>ul>li>div>a{ display:block; padding:5px 0; font-size:14px; color:#555; transition:all .35s}
#foot .nav-left>ul>li>div>a:hover{ color:#e6212a;}
#foot .nav-left>ul>li>div>p{padding:5px 0; font-size:14px; color:#555; }
#foot .nav-right{ width:14%; text-align:right;}
#foot .nav-right .gotop{ padding-bottom:65px;}
#foot .nav-right .gotop>a{ display:block; font-size:18px; color:#555;}
#foot .nav-right .gotop>a>img{ margin-right:6px;}
#foot .nav-right .qrcode{position:relative;}
#foot .nav-right .qrcode img{ width:104px; height:auto;}
#foot .nav-right .qrcode .tips{ position:absolute; right:120px; bottom:0; width:120px; line-height:25px; font-size:14px; color:#555; text-align:left;}

@media only screen and (max-width: 1280px){
  #foot .nav-left{ width:100%; float:none!important;}
  #foot .nav-left>ul>li{float:none; width:100%; padding-right:0 !important;}
  #foot .nav-left>ul>li>a{ padding:15px 0; font-size:16px; border-bottom:1px solid rgba(255,255,255,.5);}
  #foot .nav-left>ul>li{ display:none;}
  #foot .nav-left>ul>li.tel{display:block!important;}
  #foot .nav-left>ul>li.tel div{ padding-top:10px;}
  #foot .nav-left>ul>li.tel p{font-size:12px;}

  #foot .nav-right{ position:absolute; right:0; bottom:50px; float:none!important;}
  #foot .nav-right .gotop{ padding:10px 0 !important;}
  #foot .nav-right .gotop>a{ font-size:16px;}


}

@media only screen and (max-width: 420px){
  #foot .nav-left>ul>li>a{ font-size:16px;}
  #foot .nav-right{ position:relative; right:auto; bottom:auto; width:100%; text-align:left!important;}
  #foot .nav-right .gotop{ padding:40px 0px !important;}
  #foot .nav-right .qrcode img{ width:30%; height:auto;}
  #foot .nav-right .qrcode .tips{ position:absolute; right:auto; left:35%; bottom:0; width:120px; line-height:25px; font-size:14px; color:#555; text-align:left;}
}

/* end*/



/*

foot

-----------------------------------------------------------------*/

#copyright{ width:100%; margin:0 auto; background:#e6212a;}
#copyright .wrap{ width:90%; max-width:1140px; margin:0 auto; font-size:14px; text-align:left; color:#fff; height:auto; padding:30px 0;}
#copyright .wrap a{ display:inline-block; color:#fff; padding:0 6px; transition:all .35s;}
#copyright .wrap a:hover{ text-decoration:underline;}
@media only screen and (max-width: 1280px){
  #copyright .wrap{ font-size:12px; padding:20px 0;}

}

/* end*/

.links {
  border-top: 1px solid #e8e8e8;
  padding-top: 10px;
  margin-top: 5%;
  text-align:left;
}
.links span {
  width: 5%;
  max-width: 60px;
  float: left;
  background: url(../images/link_bg.jpg) no-repeat left top;
  display: block;

  line-height: 32px;
  color: #333333;
  font-size: 14px;
}
.links .link_a {
  width: 94%;
  float: right;
  line-height: 32px;
}
.links .link_a a {
  display: inline-block;
  padding: 0px 5px;
  line-height: 32px;
  font-size: 14px;
  color: #666;
}
.links .link_a a:hover {
  color: #df0024;
}
@media (max-width: 768px) {
  .links span {
    width: 10%;
    float: left;
  }
  .links .link_a {
    width: 84%;
    float: right;
  }
}
@media (max-width: 640px) {
  .links span {
    width: 100%;
  }
  .links .link_a {
    width: 100%;
  }
}


.clearfix {
	_zoom: 1;
}

.clearfix:after {
	clear: both;
	content: '.';
	display: block;
	width: 0;
	height: 0;
	visibility: hidden;
}
/* end*/