@charset "utf-8";
/* CSS Document */
html, body {font-size: 12px;margin: 0px;padding: 0px;text-decoration: none;font-family:"Arial";background: #fff;text-align: center;-webkit-text-size-adjust: none;}
a {	color: #666666;text-decoration: none;outline: 0px none; star:expression(this.onFocus=this.blur());}
a:hover, a:active { color: #c90a22;}
* { 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 { width:100%;max-width:1200px;color: #ccc;font-size: 14px;text-align: left;padding: 50px 0px; margin:0px auto;}
html::-webkit-scrollbar-track {box-shadow: inset 0 0 6px rgba(0,0,0,0.3);background-color: #ddd;}
html::-webkit-scrollbar {width: 8px;background-color: #ddd;}
html::-webkit-scrollbar-thumb {background-color:#999;}
.fl-left{ float:left;}
.fl-right{ float:right;}


/*

head

-----------------------------------------------------------------*/
#head{ position:fixed; z-index:1000; width:100%; height:60px; background:#fff; box-shadow:0 1px 2px rgba(0,0,0,.2); transition:all .35s;}
#head .logo{position:absolute; left:50%; top:0; width:50%; height:60px; line-height:60px; margin-left:-25%; text-align:center; transition:all .35s;}
#head .logo a{ display:block;}
#head .logo img{ height:22px; width:auto; transition:all .35s;}
#head .menu{position:absolute; right:20px; top:0; height:60px; line-height:60px; cursor:pointer; transition:all .35s;}
#head .menu img{ height:30px; width:auto; opacity:.4; transition:all .35s;}
#head .search{position:absolute; left:20px; top:0; height:60px; line-height:60px; cursor:pointer; transition:all .35s;}
#head .search img{ height:30px; width:auto; opacity:.4; transition:all .35s;}
/* end*/



/*

menu

-----------------------------------------------------------------*/
#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:0px auto; 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;}

@media only screen and (max-width: 320px){
  #menu .catalog>a .name{font-size:12px;}
}
/* end*/

/*

search

-----------------------------------------------------------------*/
#search{display:none;width:90%;height:40px;padding:10px 5%;background-color:rgba(0,0,0,.6);position:absolute;top:60px;left:0px;z-index:999;}
#search input[type="text"]{float:left;height:40px;line-height:26px;padding-left:15px;width:75%;border:none;background-color:#fff;color:#999;box-sizing:border-box;overflow:hidden;}
input::-webkit-input-placeholder, textarea::-webkit-input-placeholder {color: #ccc;}
#search button{float:right;width:25%;height:40px;border:none;background:#e62129 url(../images/search.png) no-repeat center center;  background-size:auto 50%;color:#fff;border-left:1px solid #ddd;cursor:pointer;box-sizing:border-box;overflow:hidden;}

/* end*/






/*

banner

-----------------------------------------------------------------*/
#banner{position:relative;background:#eee;height:auto; padding-top:60px; overflow:hidden; transition:all .35s;}
#banner .swiper-container{width:100%; height:100%;}
#banner .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;}
#banner .swiper-slide img{max-width:100%; height:auto;}
#banner .swiper-button-prev,#banner .swiper-button-next{width:30px; height:30px; background-size:30px 30px; transition:all .2s;}
#banner .swiper-button-prev,#banner .swiper-container-rtl .swiper-button-prev{background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAx0lEQVRoge3aMQrCQBRF0Y+4DxuX4VKzB7fgCrKBVDa2dilzLaKFiYIzIP85vlMGAu9CijBJhBCgYzYCh+w9VYCeZ33J/dtvDSsBDBGxX1w+Z2ypBgysDdm7ijhChSNUOEKFI1Q4QsWbiKKXwFTADri+iOiyt33sHjE6IpsjVDhChSOUsD6ykYnYZA9I0cyjFeEYXY5R5RhVLcZcmoiJaOQE5cExqhyjyjGqHKPKMar+IeaYvasKcFqE/M4XriXmH88mKn48uwHHhY37FtUzgAAAAABJRU5ErkJggg==');}
#banner .swiper-button-next,#banner .swiper-container-rtl .swiper-button-next{background-image:url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAvklEQVRoge3aMQrCQBCF4cWLeAZ7j5o7eAVPkAuksrG1S+mfQkSM2WJEnLfL+7pAAvNDijDZUgKAIzDzMESelQKMvBuzZ3raBe+/rK4PwPSrYf4KmPjkmHSOUeUYVY5R5RhVvcWsPzKbjhk2Ym7APnu2sErM7JhsjlHlGFWOUVWJCa2aousgq+ni1XKECkeocISKniOurUW0v0lxhApHqHCECkeocISKXiJOzUeUsvkH6pw901d4HTy7I3bwbAFEQY4GwbRw2gAAAABJRU5ErkJggg==');}
#banner .swiper-button-prev:hover,#banner .swiper-button-next:hover{opacity:.6;}
#banner img{max-width:100%; height:auto;}

#banner .path{position:absolute; left:0; bottom:0; width:90%; height:35px;line-height:35px; padding:0 5%; text-align:left; font-size:12px; color:#666; background:rgba(255,255,255,.8);}
#banner .path>a{ color:#666;}
#banner .path>.A{ color:#e62129;}

/* end*/



/*

main

-----------------------------------------------------------------*/
#main>.news{ width:90%; margin:0 auto; padding:20px 0;border-top:1px solid #eee;}
#main>.news>.title{ position:relative; font-size: 20px;line-height: 50px; font-weight: 700;letter-spacing: 0px;}
#main>.news>.title:after{ position:absolute; z-index:3; left:50%; bottom:0; width:10%;height:2px; margin-left:-5%; background:#e62129; content:'';}
#main>.news>.wrap{ width:100%; margin:0 auto; padding:60px 0;}
#main>.news .focus{ width:100%; height:auto; margin-bottom:20px;}
#main>.news .focus a{position:relative; display:block;}
#main>.news .focus a:after{position:absolute; z-index:2; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,0) url("../images/news-mask.png") repeat-x; background-position:0 100%; content:''; transition:all .2s;}
#main>.news .focus a>.container{position:absolute; z-index:3; left:0; bottom:20px; width:100%; height:100px; text-align:left; transition:all .35s;}
#main>.news .focus a>.container>.time{ width:90%; margin:0 auto; padding-top:20px; font-size:12px; color:rgba(255,255,255,.7);}
#main>.news .focus a>.container>.time>img{ height:16px; width:auto; margin-right:6px; opacity:.7;}
#main>.news .focus a>img{ width:100%;height:auto;}
#main>.news .focus a>.container>.name{ position:relative; width:90%; margin:0 auto; padding:10px 0; font-size:16px; color:#fff;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
#main>.news .focus a>.container>.name:after{ position:absolute; z-index:1; left:0; bottom:0; width:0; height:3px; background:#e62129; content:''; transition:all .35s;}
#main>.news .focus a:hover .container{height:130px;}
#main>.news .focus a:hover:after{ background:rgba(0,0,0,.3) url("../images/news-mask.png") repeat-x; background-position:0 110%;}
#main>.news .focus a:hover .name:after{ width:150px;}
#main>.news .focus .swiper-pagination {text-align:right!important; width:96%; bottom:20px;}
#main>.news .focus .swiper-pagination-bullet {width: 10px!important;height: 10px!important;background: #fff!important;opacity:.5!important;}
#main>.news .focus .swiper-pagination-bullet-active {background: #e62129!important; opacity:1!important;}
#main>.news .list{  margin:0 auto;}
#main>.news .list a{ display:block; padding:2% 0; border-bottom:1px solid #eee; transition:all .35s;}
#main>.news .list a:last-of-type{ border:0 !important;}
#main>.news .list a .time{ position:relative; width:18%; padding-top:10px; background:#e62129; border:1px solid #e62129; text-align:center;transition:all .35s;}
#main>.news .list a .time h2{ display:block; font-size:24px; font-weight:normal;color:#fff;}
#main>.news .list a .time h3{ display:block;font-size:12px; font-weight:normal; padding:10px 0; color:#fff;}
#main>.news .list a .container{ width:76%; text-align:left;}
#main>.news .list a .container>.name{ display:block; padding:10px 0; font-size:14px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap; font-weight:bold;}
#main>.news .list a .container>.text{ font-size:12px; height:40px; color:#999; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden; line-height:18px;}
#main>.hotproduct{ width:100%; margin:0 auto; padding:20px 0; background:url("../images/main-hotproduct-bg.jpg") no-repeat; background-size:100% 100%;}
#main>.hotproduct>.title{ position:relative; font-size: 20px;line-height: 50px; font-weight: 700;letter-spacing: 0px;}
#main>.hotproduct>.title:after{ position:absolute; z-index:3; left:50%; bottom:0; width:10%;height:2px; margin-left:-5%; background:#e62129; content:'';}
#main>.hotproduct>.container{ position:relative; width:88%; margin:40px auto;border:1px solid #ddd;}
#main>.hotproduct>.container a{ position:relative; display:block; background:#fff; padding:0 20px;}
#main>.hotproduct>.container a:after{position:absolute; z-index:2; right:0; bottom:0; width:30px; height:30px; background:#e62129 url("../images/hotpro-more.png") no-repeat; background-size:20px auto; background-position:50% 50%; content:'';}
#main>.hotproduct>.container a>.img{ position:relative; width:100%; margin:0 auto; overflow:hidden;}
#main>.hotproduct>.container a>.img:after{position:relative; z-index:9; left:0; bottom:20px; width:100%; font-size:12px; color:#999; text-align:center; content:attr(data-name);}
#main>.hotproduct>.container a>.img>img{ width:100%; height:auto; transition:all 2s;}
#main>.hotproduct>.container a>.name{ padding-bottom:20px; font-size:14px; font-weight:700; color:#333;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
#main>.hotproduct>.container a>.text{ margin:0 auto; height:50px; font-size:14px; color:#999; line-height:22px;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden;}
#main>.hotproduct>.container .swiper-button-next, #main>.hotproduct>.container .swiper-button-prev {  position: absolute;top: 50%;width: 16px!important;height: 26px!important;margin-top: -13px!important;z-index: 10;cursor: pointer;-moz-background-size: 16px 26px!important;-webkit-background-size: 16px 26px!important;background-size: 16px 26px!important;background-position: center;background-repeat: no-repeat;background-color:rgba(0,0,0,.5);padding:10px 5px;}
#main>.hotproduct>.container .swiper-button-prev{ left:0 !important;}
#main>.hotproduct>.container .swiper-button-next{ right:0 !important;}
#main>.certificate{ width:100%; margin:0 auto; padding:20px 0; background:#eee;}
#main>.certificate>.title{ position:relative; font-size: 20px;line-height: 50px; font-weight: 700;letter-spacing: 0px;}
#main>.certificate>.title:after{ position:absolute; z-index:3; left:50%; bottom:0; width:10%;height:2px; margin-left:-5%; background:#e62129; content:'';}
#main>.certificate>.text{margin:0 auto; padding:15px; font-size:14px; color:#666; line-height:20px;}
#main>.certificate>.icon{ position:relative; width:70%; margin:0 auto;}
#main>.certificate>.icon>img{ width:50px; height:auto; margin-bottom:10px; margin-right:10px;}
#main>.certificate>.more{ padding:20px 0;}
#main>.certificate>.more>a{ position:relative; display:inline-block; padding:12px 32px 12px 0; color:#fff; font-size:14px; background:#e62129; border-radius:5px; overflow:hidden; transition:all .35s;}
#main>.certificate>.more>a>img{ height:17px; width:auto; margin:0 20px 0 16px; opacity:.5;}
#main>.certificate>.more>a:after{position:absolute; z-index:1; left:0; top:0; width:46px; height:100%; background:rgba(0,0,0,.1); content:''; transition:all .35s;}
#main>.certificate>.more>a:hover:after{ width:100%;}
/* end*/









/*

navpart

-----------------------------------------------------------------*/
#navpart{ position:relative; width:100%; height:auto; margin:0 auto; background:#e62129; border-bottom:1px solid #eee; transition:all .35s;}
#navpart>.title{ padding:0px 20px; text-align:left; text-transform:uppercase; height:50px; line-height:50px; color:#fff; font-size:14px;}
#navpart>.btn{position:absolute; z-index:3; right:20px; width:50px; height:50px; line-height:50px; text-align:center;}
#navpart>.btn>img{height:25px; width:auto; transition:all .35s;}
#navpart>.A>img{transform:rotate(180deg);}
#navpart>.container{ display:none; position:absolute; z-index:99; left:0; top:50px; width:100%; background:rgba(0,0,0,.6);}
#navpart>.container>a{ display:block; border-bottom:1px solid rgba(255,255,255,.1); color:#fff; font-size:14px; padding:15px 20px; text-align:left;}
/* end*/

/*

title

-----------------------------------------------------------------*/
#title{position:relative; width:90%; padding:0px 5%; text-transform:uppercase; text-align:left;font-size:18px; font-weight:bold; color:#333; height:50px; line-height:50px; margin:30px auto 0px auto; border-bottom:1px solid #ddd;}
#title:after{ position:absolute; z-index:9; left:5%; bottom:0px; width:40px; height:2px; background:#e62129; content:'';}
@media only screen and (max-width: 320px){
  #title{font-size:16px;}
}
/* end*/


/*

about

-----------------------------------------------------------------*/
#about{ width:90%; margin:0px auto; padding:50px 0;}
#about>.slogan{ background:#e5ecf0; padding:5%; text-align:left;}
#about>.slogan h1{ position:relative; display:block; padding:10px 0; text-transform:uppercase;font-size:36px; color:#e62129;}
#about>.slogan h3{ display:block; padding:5px 0; font-size:18px; font-weight:normal; color:#888;}
#about .text{ padding-top:20px; font-size:14px; line-height:25px; color:#666; text-align:left;}
#about .text p{ margin-bottom:20px;}
#about .img{ width:100%; margin:0 auto;}
#about .img>img{ width:100%; height:auto;}
/* end*/



/*

certificate

-----------------------------------------------------------------*/
#certificate{ width:90%; margin:0px auto; padding:50px 0;}
#certificate>.list{ margin:0 auto;}
#certificate>.list a{ display:block; float:left; width:38%; padding:5%; margin-bottom:5%; border:1px solid #eee;text-align:center;}
#certificate>.list a:nth-child(odd){float:right!important;}
#certificate>.list a>img{width:100%; height:auto; margin:0 auto 10px auto;}
#certificate>.list a>.name{ text-align:center; font-size:12px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
/* end*/



/*

video

-----------------------------------------------------------------*/
#video{ width:90%; margin:0px auto; padding-top:50px;}
#video>.list{ margin:0px auto; padding:10px 0;}
#video>.list>a{position:relative; width:48%; display:block; float:left; margin-bottom:5%;}
#video>.list>a:nth-of-type(even){float:right;}
#video>.list>a .img{width:100%; height:auto; margin:0 auto; overflow:hidden;}
#video>.list>a .img>img{ width:100%; height:auto; transition:all .35s;}
#video>.list>a .name{ position:absolute; z-index:9; left:0; bottom:0; width:90%; padding:10px 5%; line-height:16px; color:#fff;font-size:12px; text-align:left; background:url("../images/video-mask.png") repeat-x; background-position:left top; background-size:100% 100%;}
#video>.list>a .name>img{ display:block; height:20px;}
#video>.list>a:hover .img>img{transform:scale(1.1);}
#video>.view{ margin:0 auto;}
#video>.view>.title{ text-align:center;font-size:20px; color:#333;}
#video>.view>.time{ border-bottom:1px solid #eee; font-size:12px; color:#999; text-align:center; padding:15px 0;}
#video>.view>.content{ padding:50px 0; text-align:center; margin:0 auto;}
#video>.view>.content>video{ background:#111; margin:0 auto;}
#video>.view>.pageurl{ margin:0 auto; padding:50px 0 100px 0; border-top:1px solid #eee;}
#video>.view>.pageurl>a{ display:inline-block; margin:0 5px; background:#e62129; border:1px solid #e62129; border-radius:3px; color:#fff; padding:8px 20px; transition:all .35s;}
#video>.view>.pageurl>a:hover{ color:#e62129; background:none;}

/* end*/



/*

manufacturing_process

-----------------------------------------------------------------*/
#manufacturing_process{ width:90%; margin:0px auto; padding-top:50px;}
#manufacturing_process>.list{ margin:0px auto; padding:10px 0;}
#manufacturing_process>.list>a{position:relative; width:48%; display:block; float:left; margin-bottom:5%;}
#manufacturing_process>.list>a:nth-of-type(even){float:right;}
#manufacturing_process>.list>a .img{width:100%; height:auto; margin:0 auto; overflow:hidden;}
#manufacturing_process>.list>a .img>img{ width:100%; height:auto; transition:all .35s;}
#manufacturing_process>.list>a .name{ position:absolute; z-index:9; left:0; bottom:0; width:90%; padding:10px 5%; line-height:16px; color:#fff;font-size:12px; text-align:left; background:url("../images/video-mask.png") repeat-x; background-position:left top; background-size:100% 100%;}
#manufacturing_process>.list>a .name>img{ display:block; height:20px;}
#manufacturing_process>.list>a:hover .img>img{transform:scale(1.1);}

/* end*/


/*

news
-----------------------------------------------------------------*/
#news{ width:90%; margin:0px auto; padding:50px 0;}
#news>.hot{ background:#eee; margin:0 auto;}
#news>.hot .img{ width:100%; overflow:hidden;}
#news>.hot .img img{ width:100%; height:auto;}
#news>.hot .container{ width:90%; padding:5%; text-align:left;}
#news>.hot .container .name{ position:relative; padding:10px 0; margin:10px auto; font-weight:700; font-size:24px; color:#333;}
#news>.hot .container .name:after{position:absolute; z-index:23; left:0; bottom:0; width:10%; height:2px; background:#e62129; content:''; transition:all .35s;}
#news>.hot .container .text{ padding:15px 0; font-size:14px; color:#666; line-height:20px;}
#news>.hot .container .more{ text-align:left;}
#news>.hot .container .more>a{ display:inline-block; font-size:14px; color:#fff; background:#e62129; padding:10px 20px;transition:all .35s;}
#news>.hot .swiper-pagination {text-align: right; right:20px!important; left:auto; bottom:20px;}
#news>.hot .swiper-pagination-bullet {width: 12px;height: 12px;}
#news>.hot .swiper-pagination-bullet-active {background: #e62129;}
#news>.list{  margin:0 auto;}
#news>.list a{ display:block; padding:2% 0; border-bottom:1px solid #eee; transition:all .35s;}
#news>.list a:last-of-type{ border:0 !important;}
#news>.list a .time{ position:relative; width:18%; padding-top:10px; border:1px solid #ddd; text-align:center;transition:all .35s;}
#news>.list a .time h2{ display:block; font-size:24px; font-weight:normal;color:#e62129;}
#news>.list a .time h3{ display:block;font-size:12px; font-weight:normal; padding:10px 0; color:#e62129;}
#news>.list a .container{ width:76%; text-align:left;}
#news>.list a .container>.name{ display:block; padding:10px 0; font-size:14px;overflow: hidden;text-overflow:ellipsis;white-space: nowrap; font-weight:bold;}
#news>.list a .container>.text{ font-size:12px; height:40px; color:#999; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 2;overflow: hidden; line-height:18px;}
#news>.view{ margin:0 auto;}
#news>.view>.title{ text-align:center;font-size:20px; color:#333; padding:0 50px;}
#news>.view>.time{ border-bottom:1px solid #eee; font-size:12px; color:#999; text-align:center; padding:15px 0;}
#news>.view>.content{ padding:50px 0; text-align:left; font-size:14px; line-height:24px; color:#666; margin:0 auto;}
#news>.view>.content img{max-width:100%; height:auto; margin-bottom:5%;}
#news>.view>.pageurl{ margin:0 auto; padding:50px 0 100px 0; border-top:1px solid #eee;}
#news>.view>.pageurl>a{ display:inline-block; margin:0 5px; background:#e62129; border:1px solid #e62129; border-radius:3px; color:#fff; padding:8px 20px; transition:all .35s;}
#news>.view>.pageurl>a:hover{ color:#e62129; background:none;}

/* end*/



/*

partners

-----------------------------------------------------------------*/
#product{width:90%; margin:0px auto; padding:50px 0;}
#product>.title{ font-size:24px; font-weight:bold; color:#333; text-align:left; border-bottom:1px solid #ccc; padding:15px; margin-bottom:5%;}
#product>.keys{ font-size:16px; color:#999; text-align:left; border-bottom:1px solid #ccc; padding:15px 5px; margin-bottom:5%;}
#product>.keys>strong{ color:#ff0000;}
#product>.list a{ position:relative; display:block; float:left; width:45.6%; padding:5px 2% 10px 2%; border:1px solid #ddd; margin-left:-1px; margin-top:-1px; text-align:center; overflow:hidden; transition:all .35s;}
#product>.list a .img{ width:100%;}
#product>.list a .img>img{ width:100%; height:auto;}
#product>.list a .name{ width:100%; margin:0 auto; padding:10px 0; text-align:center; font-size:18px; color:#676767; transition:all .35s;}
#product>.list a .text{ color:#999; height:70px; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 4;overflow: hidden; font-size:12px;line-height:18px;}
#product>.list a:hover .name{ color:#e62129;}
#product>.view{ margin:0 auto;}
#product>.view>.title{ border:1px solid #ddd;background:#f7f7f7; padding:10px; text-align:center; color:#e62129; font-size:16px; font-weight:700; margin:0 auto;}
#product>.view .focus {position:relative; width:100%; overflow:hidden; margin:20px auto;}
#product>.view .focus img{ width:100%; height:auto;}
#product>.view .focus .swiper-pagination-bullet-active {opacity: 1;background: #e62129;}
#product>.view .application>.title{ border-bottom:1px solid #ddd; text-align:left; padding:10px 0;font-size:14px;font-weight:700; color:#333;}
#product>.view .application>.text{ padding:15px 0; text-align:left; line-height:20px;color:#676767; font-size:12px;}
#product>.view .certificate{ text-align:left;}
#product>.view .certificate>img{ height:36px; width:auto; margin-right:6px; margin-bottom:6px;}
#product>.view .tags .tagtit{ border-bottom:1px solid #ddd; text-align:left; padding:10px 0;font-size:14px;font-weight:700; color:#333;}
#product>.view .tags .tagcon{ padding:15px 0; text-align:left; line-height:20px;color:#676767; font-size:12px;}
#product>.view .tags .tagcon p{ margin-bottom:35px;}
#product>.view .tags .tagcon img{ max-width:100%; height:auto;}
#product>.view .tags .tagcon table{ width:100%!important; border-top:1px solid #eee; border-right:1px solid #eee;}
#product>.view .tags .tagcon table tr:first-child{ background:#e62129; color:#fff;}
#product>.view .tags .tagcon table tr:first-child>td{position:relative; font-weight:bold; font-size:14px; color:#fff;}
#product>.view .tags .tagcon table td img{ width:100%; height:auto;}
#product>.view .tags .tagcon table td a{ text-decoration:underline;}
#product>.view .tags .tagcon td{ padding:5px; font-size:12px; border-left:1px solid #eee; border-bottom:1px solid #eee;}
#product>.view .tableWap{position:relative; overflow:hidden; overflow-x:auto;}
#product>.view>.pageurl{ margin:0 auto; padding:50px 0 100px 0; border-top:1px solid #eee;}
#product>.view>.pageurl>a{ display:inline-block; margin:0 5px; background:#e62129; border:1px solid #e62129; border-radius:3px; color:#fff; padding:8px 20px; transition:all .35s;}
#product>.view>.pageurl>a:hover{ color:#e62129; background:none;}
/* end*/




/*

partners

-----------------------------------------------------------------*/
#partners{width:90%; margin:0px auto; padding-top:50px;}
#partners>.container{ width:100%; text-align:left; margin:0 auto; background:#eee;}
#partners>.container>.text{ padding:5%;width:90%; text-align:left; font-size:12px; color:#666; line-height:21px;}
#partners>.container>.text h2{ color:#333; font-size:20px; margin-bottom:10px;}
#partners>.container>.img{ width:100%;}
#partners>.container>.img>img{ width:100%; height:auto;}
#partners>.list{ margin:0 auto; padding:30px 0;}
#partners>.list a{ position:relative; display:block; width:90%; padding:2% 4.8%; border:1px solid #eee; margin-top:-1px;}
#partners>.list a:last-of-type:after{ width:0!important;}
#partners>.list a>.img{ margin:0 auto; padding-top:10px; text-align:left;}
#partners>.list a>.img>img{ width:100%;height:auto;}
#partners>.list a>.text{ padding:10px 0; text-align:center; font-size:12px; color:#333; line-height:20px;}
#partners>.list a>.more{ padding:0; text-align:left;}
#partners>.list a>.more>span{ display:inline-block; padding:6px 10px; font-size:12px; background:#eee; color:#666; transition:all .35s;}
#partners>.list a:hover .more>span{ background:#e62129; color:#fff;}
/* end*/


/*

solutions

-----------------------------------------------------------------*/
#solutions{ width:90%; margin:0px auto; padding:50px 0;}
#solutions>.list{ width:100%; margin:0px auto;}
#solutions>.list a{ position:relative; display:block; width:100%; height:auto; overflow:hidden; margin-bottom:4%;}
#solutions>.list a>img{ width:100%; height:auto; transition:all 1s;}
#solutions>.list a>.name{position:absolute; z-index:9; left:0; bottom:0; width:100%; height:30px; line-height:30px; font-size:14px; color:#fff; background:rgba(0,0,0,.6);transition:all .35s;}
#solutions>.list a:hover .name{ background:#e62129;}
#solutions>.list a:hover img{ transform:scale(1.2) rotate(5deg);}
#solutions>.view{ margin:0 auto;}
#solutions>.view>.title{ text-align:center;font-size:20px; color:#333; padding:0 50px;}
#solutions>.view>.img{ border-bottom:1px solid #eee; text-align:center; padding:15px 0;}
#solutions>.view>.img>img{max-width:100%; height:auto;}
#solutions>.view>.content{ padding:50px 0; text-align:left; font-size:14px; line-height:24px; color:#666; margin:0 auto;}
#solutions>.view>.content ul{ padding:20px 0;}
#solutions>.view>.content ul>li{ display:inline-block; border:1px solid #ddd; vertical-align:middle; text-align:center; padding:10px; margin:0 10px 12px 0;}
#solutions>.view>.content ul>li img{max-width:100%;height:auto;}
#solutions>.view>.pageurl{ margin:0 auto; padding:50px 0 100px 0; border-top:1px solid #eee;}
#solutions>.view>.pageurl>a{ display:inline-block; margin:0 5px; background:#e62129; border:1px solid #e62129; border-radius:3px; color:#fff; padding:8px 20px; transition:all .35s;}
#solutions>.view>.pageurl>a:hover{ color:#e62129; background:none;}
/* end*/



/*

download

-----------------------------------------------------------------*/
#download{width:90%; margin:0px auto; padding-top:50px;}
#download>.list-tr{ background:#666;}
#download>.list-tr div{ position:relative; float:left; width:30%; height:40px; line-height:40px; color:#fff; font-size:12px;text-align:center;}
#download>.list-tr div:after{position:absolute; z-index:9; right:-1px; top:0; width:1px; height:100%; background:#fff; content:'';}
#download>.list-tr div.td1{ width:66%;text-align:left; padding:0 2%;}
#download>.list-tr div.td2:after{ width:0!important;}
#download>.list-td{ margin:0px auto;}
#download>.list-td a{display:block;border-bottom:1px solid #e7e7e7; transition:all .35s;}
#download>.list-td a:last-of-type{ border:0 !important;}
#download>.list-td div{ position:relative; float:left; width:30%; height:40px; line-height:40px; color:#7f7f7f;overflow: hidden;text-overflow:ellipsis;white-space: nowrap; font-size:12px;text-align:center;}
#download>.list-td div.td1{ width:66%;text-align:left; padding:0 2%;}
#download>.list-td a:hover{ background:#f7f7f7;}
#download>.view{ padding:5%; text-align:left;}
#download>.view>a{ display:block; text-align:center; border:1px solid #ddd; margin-bottom:5%; font-size:12px; padding:10px 0; text-align:center; transition:all .35s;}
#download>.view>a img{ display:block; height:24px; width:auto; margin:0 auto;}
#download>.view>a:hover{ text-decoration:underline;}
/* end*/


/*

feedback

-----------------------------------------------------------------*/
#feedback{ width:90%; margin:0px auto; padding:50px 0;}
#feedback>.text{ margin:0 auto; text-align:left; font-size:12px; color:#999; line-height:20px;}
#feedback>.container{ text-align:left;}
#feedback>.container dl{ margin:0 auto;}
#feedback>.container dt{display:block; padding:5px 0; color:#666; font-size:14px;}
#feedback>.container dt span{ color:#ff0000;}
#feedback>.container dd{display:block;}
#feedback>.container dd input{ -webkit-appearance:none; border:1px solid #ddd; padding:0 2%; width:95%; height:25px; line-height:25px; margin-bottom:8px;}
#feedback>.container dd textarea{ -webkit-appearance:none; border:1px solid #ddd; width:95%; padding:2%; line-height:18px; margin-bottom:8px;}
#feedback>.container dd.button input{ -webkit-appearance:none; width:100%; height:32px; line-height:32px; background:#666; border:0!important; border-radius:3px; color:#fff;font-size:12px;}
/* end*/


/*

contact us

-----------------------------------------------------------------*/
#contact{ width:100%; margin:0px auto; padding-top:50px;}
#contact>.wrap{width:90%; margin:0 auto; padding-bottom:30px;}
#contact .img{ width:100%;text-align:left;}
#contact .img>img{width:100%; height:auto;}
#contact .container{ width:100%; text-align:left;}
#contact .container>.name{ padding:15px 0; font-size:20px; font-weight:bold; color:#e62129; text-transform:uppercase;}
#contact .container>.text{ font-size:14px; line-height:20px;color:#666;}
#contact .container>.tips{ margin-top:20px; color:#6490ef; line-height:20px; display:inline-block; border:1px dashed #ddd; border-radius:5px; padding:20px;}
#contact>.map{ width:100%; height:400px; margin:0 auto;}

@media only screen and (max-width: 1460px){
  #contact>.wrap{ max-width:1260px;}
}
/* end*/






/*

page

-----------------------------------------------------------------*/
#page{ width:90%; margin:0px auto;border-top:1px solid #ddd; padding:20px 0 50px 0;}
#page a{ display:inline-block; margin:0 2px; border:1px solid #ddd; border-radius:100%; width:24px; height:24px; line-height:24px; vertical-align:middle; color:#999; font-size:12px;}
#page a.A{ background:#e62129; color:#ffffff !important; border:1px solid #e62129;}


/* end*/

/*

kefu

-----------------------------------------------------------------*/
#kefu{ position:fixed; z-index:999; right:20px; bottom:20px; width:50px; height:50px; background:rgba(0,170,240,.5); transition:all .35s;}
#kefu span{ display:block; position:relative; width:50px; height:50px; margin:0 auto;overflow:hidden;}
#kefu img{ position:absolute; left:0; top:-100%; width:100%; height:auto; margin:0 auto;}
#kefu a{ display:block;}
#kefu a:hover{background:rgba(0,170,240,.9);}
/* end*/


/*

foot

-----------------------------------------------------------------*/
#foot{position:relative; width:100%; background:#f5f5f5; font-size:14px; line-height:24px; color:#666; margin:0px auto;}
#foot:after{ position:absolute; z-index:2; left:0; top:0; height:1px; width:100%;background:#eee; content:'';}
#foot:before{ position:absolute; z-index:44; left:50%; top:0; width:20%; height:1px; margin-left:-10%; background:#e62129; content:'';}
#foot>.copyright{ width:90%; padding:20px 5%; text-align:center; background:#fff; font-size:14px; line-height:24px; color:#666; margin:0px auto;}
#foot>.copyright a{ display:block; color:#999; font-size:12px;}


/* end*/