@charset "utf-8";
/* CSS Document */
html, body {font-size: 12px;margin: 0px;padding: 0px;text-decoration: none;overflow-x:hidden;font-family:"微软雅黑";background: #fff;-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: #0067ae;text-decoration: none; }
* { margin: 0px;padding: 0px;list-style: none;}
table { border-collapse: collapse;}
ul, li {list-style: none;border: 0 none;padding: 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: 0 !important; height: 0 !important;}
#noData, .noData {color: #ccc;font-size: 14px;text-align: left;padding: 50px 0px;}
.fl-left{ float:left;}
.fl-right{ float:right;}
#banner{position:relative;background:#fff; height:auto; overflow:hidden;margin-top: 80px;border-bottom:10px solid #0067ae; transition:all .35s;}
#banner .wave{position:absolute; z-index:2;left:0; bottom:0;}
#banner .wave>img{ width:100%; height:auto;}
#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%;}
#banner .swiper-pagination{ bottom:50px;}
#banner .swiper-pagination-bullet{width:12px; height:12px; background:#fff; border:2px solid #fff; opacity:1; transition:all .2s;}
#banner .swiper-pagination-bullet:hover{opacity:.5;}
#banner .swiper-pagination-bullet-active{background:none; border:2px solid #0067ae;opacity:1 !important;}
/*
navpart
-----------------------------------------------------------------*/
#navpart{ position:relative; width:100%; max-width:1200px; height:auto; margin:0 auto; }
#navpart>.wrap{ position:absolute; z-index:4; right:0; top:-50px; width:100%; text-align:right;}
#navpart>.wrap>a{ position:relative; display:inline-block; font-size:14px; padding:0 20px; height:40px; line-height:40px; background:rgba(255,255,255,.9); transition:all .35s;}
#navpart>.wrap>.A{ background:#0067ae!important; box-shadow:0 0 0 rgba(0,0,0,0)!important; color:#ffffff !important;}
#navpart>.wrap>.A:after{position:absolute; left:0; top:-5px; width:100%; height:5px; background:#0067ae; content:''; transition:all .35s;}
#navpart>.wrap>a:hover{ background:rgba(255,255,255,1);}
@media only screen and (max-width: 1460px){
#navpart{ max-width:1200px;}
}
/* end*/
/*
position
-----------------------------------------------------------------*/
#position{ position:relative; width:100%; height:auto; margin:0 auto; background:#eee;}
#position>.wrap{ width:100%; max-width:1200px; margin:0 auto; padding:15px 0; text-align:right; color:#999;}
#position>.wrap>a{ display:inline-block; font-size:14px; color:#999;}
#position>.wrap>a>img{ height:25px; width:auto; opacity:.7;}
#position>.wrap>a.A{ color:#0067ae;}
@media only screen and (max-width: 1460px){
#position>.wrap{ max-width:1200px;}
}
/* end*/
/*
title
-----------------------------------------------------------------*/
#title{ position:relative;width:100%; max-width:1200px; padding:50px 0px; background:url("../images/title-bar.png") repeat-x; background-position: center center; margin:0px auto; text-align:left;}
#title h2{ position:relative; display:inline-block; margin:0 0 0 10px; padding:0px 15px;font-size:30px; font-weight:bold; color:#000; background:#fff;}
#title .logoname{position:absolute; right:5px; bottom:35px; opacity:.1;}
@media only screen and (max-width: 900px){
#title{ width:90%;}
#title h2{ font-size:25px;}
#title .logoname{ height:12px; width:auto;}
}
/* end*/
/*
about
-----------------------------------------------------------------*/
#about{ width:100%; margin:0 auto; padding-top:50px;}
#about>.profile{ width:100%;max-width:1200px; margin:0 auto;}
#about>.profile>.img{width:55%; text-align:left;}
#about>.profile>.img>img{width:100%; height:auto;}
#about>.profile>.container{width:40%; text-align:left;}
#about>.profile>.container .slogan{ padding:20px 0;}
#about>.profile>.container .slogan h3{ display:block; padding:10px 0; color:#0067ae;font-size:16px;font-weight:normal;}
#about>.profile>.container .slogan h1{ display:block; padding:0; font-size:36px; line-height:46px; color:#111;}
#about>.profile>.container .text{ padding:20px 0;}
#about>.profile>.container .text>p{ margin-bottom:20px; font-size:16px; color:#999; line-height:24px;}
#about>.profile>.container .more{ padding:0; text-align:left;}
#about>.profile>.container .more>a{ display:inline-block; border:2px solid #e4e4e4;border-radius:3px; padding:15px 25px; color:#0067ae; font-size:14px; transition:all .35s;}
#about>.profile>.container .more>a:hover{ background:#e4e4e4; color:#fff;}
#about>.scale{ width:100%;max-width:1200px; margin:50px auto; padding-top:30px; border-top:1px solid #efefef;}
#about>.scale>.item{ display:inline-block; float:left; width:20%; margin:0 2%; text-align:center;}
#about>.scale>.item>.wrap{ height:130px; margin:0 auto;}
#about>.scale>.item .number{ font-size:80px; color:#0067ae;}
#about>.scale>.item .title{ position:relative; padding:10px 0; color:#444;font-size:24px;}
#about>.scale>.item .title:after{ position:absolute; z-index:1;left:50%; bottom:0; width:30%; height:1px; margin-left:-15%; background:#eee; content:'';}
#about>.scale>.item .text{ padding-top:30px; font-size:14px; color:#999; line-height:20px;}
#about>.process{ width:100%;max-width:1200px; margin:50px auto; border-top:1px solid #efefef;}
#about>.process>.title{ padding:80px 0; text-align:center; font-size:28px; color:#333;}
#about>.process .container{ width:80%; margin:0 auto;}
#about>.process .container .swiper-pagination{position:relative!important; padding:50px 0;}
#about>.process .container .swiper-pagination-bullet { width: 12px;height: 12px;}
#about>.process .container .swiper-pagination-bullet-active { opacity: 1; background: #0067ae;}
#about>.certificate{ position:relative; margin:0 auto; height:360px;}
#about>.certificate>.container{ position:relative; width:50%; height:100%; background:url("../images/certificate-bg.jpg") no-repeat; background-size:100% 100%;}
#about>.certificate>.container>.wrap{ position:absolute; right:10%; top:22%; width:40%; text-align:center;}
#about>.certificate>.container .title{ padding:10px 0; font-size:28px; color:rgba(255,255,255,1);}
#about>.certificate>.container .text{ font-size:14px; line-height:24px; color:rgba(255,255,255,.8);}
#about>.certificate>.container .more{ padding:20px 0;}
#about>.certificate>.container .more>a{ position:relative; display:inline-block; padding:12px 32px 12px 0; color:#666; font-size:14px; background:#f9f9f9; border-radius:5px; overflow:hidden; transition:all .35s;}
#about>.certificate>.container .more>a>img{ height:17px; width:auto; margin:0 20px 0 16px; opacity:.5;}
#about>.certificate>.container .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;}
#about>.certificate>.container .more>a:hover:after{ width:100%;}
#about>.certificate>.icon{ position:relative; width:50%; height:100%; background:#e5ecf0;}
#about>.certificate>.icon>.wrap{ position:absolute; left:10%; top:22%; width:40%; text-align:left;}
#about>.certificate>.icon>.wrap>img{ width:80px; height:auto; margin-bottom:10px; margin-right:10px;}
@media only screen and (max-width: 1460px){
#about>.profile{ max-width:1200px;}
#about>.scale{ max-width:1200px;}
#about>.process{ max-width:1200px;}
#about>.certificate>.icon>.wrap{ width:50%;}
#about>.certificate>.icon>.wrap>img{ width:70px;}
}
/* end*/
/*园所分布*/
#branch1{margin-bottom:30px;}
#search_term select{width:140px;height:30px;margin-top:40px;}
#branch1 li{width:580px;height:228px;margin-top:30px;padding-top:14px;background:#f6f6f6;border:solid 1px #dddddd;float:left;margin-right:40px;}
#branch1 li:nth-child(2n+2){margin-right:0px;}
#branch1 li img{float:left;margin:0px 15px; width:300px; height:200px;}
.text_barnch{width:216px;margin-right:10px;float:right; line-height: 30px;}
.text_barnch h3{font-size:19px;color:#e57919;line-height:30px;}
.text_barnch p{font-size:14px;color:#999;line-height:24px;}
.text_barnch h4{font-size:14px;color:#666;line-height:26px;}
.text_detail{background:url(../images/83_03.png) no-repeat;width:93px;height:30px;float:right;margin-right:10px;margin-top:10px;}
/*
profile
-----------------------------------------------------------------*/
#profile{ width:100%; max-width:1200px; margin:0 auto; padding:50px 0 80px;}
#profile>.slogan{ background:#e4ebf7;}
#profile>.slogan>.text{ width: 100%;padding: 3% 5%;text-align: left;font-size: 14px;line-height: 30px;}
#profile>.slogan>.text h1{ position:relative; display:block; padding:10px 0; text-transform:uppercase;font-size:60px; color:#0067ae;}
#profile>.slogan>.text h1:after{position:absolute; left:0; bottom:0; width:20%; height:2px; background:#0067ae; content:'';}
#profile>.slogan>.text h3{ display:block; padding:20px 0; font-size:24px; font-weight:normal; color:#888;}
#profile>.slogan>.img{width:50%;}
#profile>.slogan>.img img{ width:100%;height:auto; margin-top: -80px;}
#profile>.container{ padding:40px 0;text-align:left; font-size:16px; line-height:24px; color:#666;}
#profile>.container>p{margin-bottom:30px;}
#profile>.container>p>strong{ font-size:20px; color:#333;}
.showpic{width:1200px;display:table; margin:80px 0 20px;}
.showpic ul{margin:0px; padding:0px;}
.showpic ul li{width:25%; float:left;}
.showpic ul li:nth-child(4n+4){margin-right:0px;}
.showpic ul li img{width:100%;}
@media only screen and (max-width: 1460px){
#profile{ max-width:1200px;}
}
/* end*/
/*
certificate
-----------------------------------------------------------------*/
#certificate{ width:100%; max-width:1200px; margin:0 auto; padding:0px 0 50px;}
#certificate>.list{ width:100%; margin:0px auto;}
#certificate>.list a{position:relative;display:block; float:left; width:19.9%; height:320px; overflow:hidden; margin-left:-1px; margin-top:-1px;border:1px solid #eee;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;}
#certificate>.list a:after{ position:absolute; z-index:2; left:0; top:0; width:100%; height:50%; font-size:14px; opacity:0; background:rgba(0,0,0,.5) url("../images/icon-zoom-magnifier.png") no-repeat 50% 40%; content:attr(data-name); text-align:center;padding-top:65%; color:#fff; transition:all .35s;}
#certificate>.list a img{ display:block; width:60%; height:auto;}
#certificate>.list a .name{ position:absolute; z-index:2; left:0; bottom:0; opacity:1; width:100%; height:40px; line-height:40px; font-size:14px; text-align:center;overflow: hidden;text-overflow:ellipsis;white-space: nowrap; transition:all .35s;}
#certificate>.list a:hover:after{ opacity:1;}
#certificate>.list a:hover .name{ opacity:0;}
@media only screen and (max-width: 1460px){
#certificate{ max-width:1200px;}
}
.gallery:after{content:'';display:block;height:2px;margin:.5em 0 1.4em; }
.gallery img{width:80%; text-align:center;}
.gallery a{width:23%;display:inline-block;overflow:hidden;margin:14px 1%; text-align:center; float:left;box-shadow: 0 0px 1px rgba(0, 0, 0, 0.3);padding:20px 0; height:402px;}
.gallery a:hover{box-shadow: 0 0px 1px rgba(43, 94, 186, 1);}
.gallery span{height:50px; line-height:50px; width:100%; display:table; text-align:center; font-size:16px; color:#000;}
.baguetteBoxOne{width:100%;margin:0 auto}
/* end*/
/*
manufacturing process
-----------------------------------------------------------------*/
#manufacturing_process{ width:100%; max-width:1200px; margin:0 auto; padding:50px 0;}
#manufacturing_process>.text{ font-size:14px; color:#999; text-align:left; padding-bottom:20px; border-bottom:1px solid #eee; margin-bottom:20px;}
#manufacturing_process>.container{ margin:0 auto; padding:20px 0;}
@media only screen and (max-width: 1460px){
#manufacturing_process{ max-width:1200px;}
}
/* end*/
/*
video
-----------------------------------------------------------------*/
#video{ width:100%; max-width:1200px; margin:0 auto; padding:50px 0;}
#video>.list{ margin:0px auto; padding:10px 0;}
#video>.list>a{position:relative; display:block;float:left; width:30%; margin-right:3.35%; margin-bottom:3.35%;}
#video>.list>a:nth-child(3n){ margin-right:0!important;}
#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:30px; color:#fff;font-size:16px; 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;}
#video>.list>a:hover .img>img{transform:scale(1.1);}
#video>.view{ margin:0 auto;}
#video>.view>.title{ text-align:center;font-size:25px; color:#333; padding:0 50px;}
#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>.url{ width:90%; text-align:left;}
#video>.view>.pageurl>.url a{ display:block; padding:3px 0; font-size:14px; color:#999; transition:all .35s;}
#video>.view>.pageurl>.url a:hover>span{ color:#0067ae; text-decoration:underline;}
#video>.view>.pageurl>.back{ width:10%; padding:5px 0; text-align:center;}
#video>.view>.pageurl>.back>a{ display:block; font-size:14px; border:2px solid #0067ae; border-radius:3px; color:#0067ae; padding:12px 30px; transition:all .35s;}
#video>.view>.pageurl>.back>a:hover{ background:#0067ae; color:#fff;}
@media only screen and (max-width: 1460px){
#video{ max-width:1200px;}
}
/* end*/
/*
product
-----------------------------------------------------------------*/
#product{ width:100%; max-width:1200px; margin:0 auto; padding:0px 0 50px;}
#product>.catalog{ margin:0 auto;}
#product>.catalog>.item{ border:2px solid #eee; margin-bottom:3%;}
#product>.catalog>.item .title{ position:relative; padding:20px 0; width:40%; height:100px; text-align:center; margin:0 auto;}
#product>.catalog>.item .title>.icon{ position:relative; display:inline-block;vertical-align:middle; width:100px;height:100px; margin-right:10px; overflow:hidden;}
#product>.catalog>.item .title>.icon img{ position:absolute; top:0; left:0; width:100%; height:auto; opacity:.4;}
#product>.catalog>.item .title>.name{ display:inline-block; vertical-align:middle; font-size:25px; font-weight:bold; color:#0067ae; height:100px; line-height:100px;}
#product>.catalog>.item .title:after{position:absolute; z-index:3; left:50%; bottom:0; width:10%; height:2px; margin-left:-5%; background:#eee; content:'';}
#product>.catalog>.item .list{ margin:0px auto; padding:30px 50px;}
#product>.catalog>.item .list a{ position:relative; display:block; float:left; width:16%; padding:10px 2% 20px 2%; margin-bottom:5%; overflow:hidden; transition:all .35s;}
#product>.catalog>.item .list a:after{ position:absolute; z-index:3; left:0;top:0; width:99%; height:99%; border:1px solid #ccc; box-shadow:0 3px 10px rgba(0,0,0,.1); opacity:0; content:''; transition:all .35s;}
#product>.catalog>.item .list a:before{position:absolute; z-index:9; right:1px; bottom:-30px; width:30px;height:30px; background:#0067ae url("../images/icon-plus-white.png") no-repeat; background-size:20px auto; background-position:50% 50%; content:''; transition:all .35s;}
#product>.catalog>.item .list a .img{ width:100%;}
#product>.catalog>.item .list a .img>img{ width:100%; height:auto;}
#product>.catalog>.item .list a .name{ width:100%; margin:0 auto; padding:10px 0; text-align:center; font-size:18px; color:#676767; transition:all .35s;}
#product>.catalog>.item .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>.catalog>.item .list a:hover .name{ color:#0067ae;}
#product>.catalog>.item .list a:hover:after{ opacity:1;}
#product>.catalog>.item .list a:hover:before{ bottom:2px;}
#product>.products{ margin:0 auto;}
#product>.products>.prolist{ width:20%; text-align:center; padding-bottom:10%;}
#product>.products>.prolist a{ position:relative; display:block; text-align:left; font-size:14px; color:#444; padding:15px;background:#eee; margin-bottom:2px;}
#product>.products>.prolist a>.img{ position:relative; display:block; float:left; width:50px; height:50px; margin-right:6px; vertical-align:middle; overflow:hidden;}
#product>.products>.prolist a>.img>img{ position:absolute; left:0; top:0; width:100%; opacity:.6;}
#product>.products>.prolist a>.name{ float:left; width:92%; font-size:16px; line-height:50px; overflow: hidden; text-overflow:ellipsis;white-space: nowrap;}
#product>.products>.prolist a.A{ background:#0067ae!important; color:#ffffff !important;}
#product>.products>.prolist a.A:after{position:absolute; z-index:3; top:50%; right:-17px; width:17px;height:26px; margin-top:-13px; background:url("../images/prolist-arrow.png") no-repeat; content:'';}
#product>.products>.prolist a.A>.img>img{ top:-50px; opacity:1;}
#product>.products>.prolist a:hover{ color:#0067ae; background:#e1eafa;}
#product>.products .container{width:75%;}
#product>.products .container>.title{ font-size:24px; font-weight:bold; color:#333; text-align:left; border-bottom:1px solid #ccc; padding:15px; margin-bottom:5%;}
#product>.products .container>.keys{ font-size:18px; font-weight:bold; color:#333; text-align:left; border-bottom:1px solid #ccc; padding:15px; margin-bottom:5%;}
#product>.products .container>.keys>strong{ color:#ff0000;}
#product>.products .container>.list a{ position:relative; display:block; float:left; width:33%; padding:5px 2% 10px 2%; margin-bottom:5%; text-align:center; overflow:hidden; transition:all .35s;}
#product>.products .container>.list a:after{ position:absolute; z-index:3; left:0;top:0; width:99%; height:99%; border:1px solid #ccc; box-shadow:0 3px 10px rgba(0,0,0,.1); opacity:0; content:''; transition:all .35s;}
#product>.products .container>.list a:before{position:absolute; z-index:9; right:1px; bottom:-30px; width:30px;height:30px; background:#0067ae url("../images/icon-plus-white.png") no-repeat; background-size:20px auto; background-position:50% 50%; content:''; transition:all .35s;}
#product>.products .container>.list a .img{ width:100%;}
#product>.products .container>.list a .img>img{ width:100%; height:auto;}
#product>.products .container>.list a .name{ width:100%; margin:0 auto; padding:10px 0; text-align:center; font-size:18px; color:#676767; transition:all .35s;}
#product>.products .container>.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>.products .container>.list a:hover .name{ color:#0067ae;}
#product>.products .container>.list a:hover:after{ opacity:1;}
#product>.products .container>.list a:hover:before{ bottom:2px;}
#product>.view>.prolist{ width:10%; text-align:center; padding-bottom:10%;}
#product>.view>.prolist a{ position:relative; display:block; font-size:14px; color:#444; padding:20px;background:#eee; margin-bottom:2px;}
#product>.view>.prolist a>.img{ position:relative; display:block; width:90px; height:90px; margin:0 auto; overflow:hidden;}
#product>.view>.prolist a>.img>img{ position:absolute; left:0; top:0; width:100%; opacity:.6;}
#product>.view>.prolist a.A{ background:#0067ae!important; color:#ffffff !important;}
#product>.view>.prolist a.A:after{position:absolute; z-index:3; top:50%; right:-17px; width:17px;height:26px; margin-top:-13px; background:url("../images/prolist-arrow.png") no-repeat; content:'';}
#product>.view>.prolist a.A>.img>img{ top:-90px; opacity:1;}
#product>.view>.prolist a:hover{ color:#0067ae; background:#ffebec;}
#product>.view>.container{ width:80%; text-align:left;}
#product>.view>.container .name{font-size:30px; font-weight:700; padding:20px 0; color:#333;}
#product>.view>.container .wrap{}
#product>.view>.container .focus {position:relative; width:50%; min-height:400px; padding:20px 0;}
#product>.view>.container .focus .gallery{ margin:0 auto; width:500px; height:auto;}
#product>.view>.container .focus .gallery img{ width:100%; height:auto;}
#product>.view>.container .focus .gallery-thumbs{width:80%; box-sizing: border-box; margin:0 auto;}
#product>.view>.container .focus .gallery-thumbs .swiper-slide{ height: 100%;}
#product>.view>.container .focus .gallery-thumbs img {cursor:pointer;width:80%; height:auto; border:1px solid #ddd;}
#product>.view>.container .focus .gallery-thumbs .swiper-slide-active>img {border:1px solid #0067ae;}
#product>.view>.container .content{ width:40%; padding:10% 5%;text-align:left;}
#product>.view>.container .content .application{ margin:0 auto; padding:10px 0;}
#product>.view>.container .content .application>.title{ position:relative; padding:10px 0; font-size:18px; font-weight:700; color:#333;}
#product>.view>.container .content .application>.title:after{position:absolute; z-index:3; left:0; bottom:0; width:10%; height:2px; background:#0067ae; content:'';}
#product>.view>.container .content .application>.text{ padding:20px 0; font-size:14px; color:#999; line-height:20px;}
#product>.view>.container .content .btn{ padding:30px 0; text-align:left;}
#product>.view>.container .content .btn>a{display:inline-block; background:#0067ae; border-radius:3px; padding:15px 30px; color:#fff; font-size:16px; transition:all .35s;}
#product>.view>.container .content .btn>a:hover{ background:#ff6600;}
#product>.view>.container .content .certificate{ margin:0 auto;}
#product>.view>.container .content .certificate>img{ display:inline-block; height:60px;width:auto;}
#product>.view>.container .tags{ margin:0px auto; padding:30px 0}
#product>.view>.container .tags .tagtit{text-align:left; padding:0 10px; background:url("../images/tagtit-bg.png") repeat-x; background-position:left bottom;}
#product>.view>.container .tags .tagtit a{ display:inline-block; padding:15px 30px; color:#666; font-size:16px;border:1px solid #ddd; border-bottom:0 !important; transition:all .35s;}
#product>.view>.container .tags .tagtit a:hover{color:#0067ae;}
#product>.view>.container .tags .tagtit .A{ font-weight:700; color:#0067ae;background:#fff;}
#product>.view>.container .tags .tagcon{ display:none; padding:30px 0; line-height:25px;color:#676767; font-size:14px;}
#product>.view>.container .tags h1{ width: 100%; background: #0067ae; color: #fff;margin: 20px 0; display: table; height: 50px;line-height: 50px; font-size: 18px; text-indent: 10px;}
#product>.view>.container .tags .tagcon p{ margin-bottom:35px;}
#product>.view>.container .tags .tagcon img{ max-width:100%; height:auto;}
#product>.view>.container .tags .tagcon table{ width:100%!important; border-top:1px solid #eee; border-right:1px solid #eee;}
#product>.view>.container .tags .tagcon table tr:first-child{ background:#fafafa; color:#333;}
#product>.view>.container .tags .tagcon table tr:first-child>td{position:relative; font-weight:bold; font-size:16px; color:#999;}
#product>.view>.container .tags .tagcon table td img{ max-width:100%; height:auto;}
#product>.view>.container .tags .tagcon table td a{ text-decoration:underline;}
#product>.view>.container .tags .tagcon td{ padding:10px; font-size:12px; border-left:1px solid #eee; border-bottom:1px solid #eee;}
#product>.view>.container .pageurl{ padding:50px 0; text-align:right;}
#product>.view>.container .pageurl>a{ display:inline-block; margin-left:10px; border:1px solid #ddd; border-radius:3px; font-size:14px; padding:15px 30px; transition:all .35s;}
#product>.view>.container .pageurl>a.back{ background:#0067ae!important; border:1px solid #0067ae; color:#fff!important;}
#product>.view>.container .pageurl>a.no{ color:#ddd!important;}
@media only screen and (max-width: 1460px){
#product{ max-width:1200px;}
}
/* end*/
/*
solutions
-----------------------------------------------------------------*/
#solutions{ width:100%; max-width:1200px; margin:0 auto; padding:50px 0;}
#solutions>.list{ width:100%; margin:0px auto;}
#solutions>.list a{ position:relative; display:block; float:left; width:49%; height:auto; overflow:hidden; margin-bottom:2%;}
#solutions>.list a:after{position:absolute; z-index:2; left:0; bottom:0; width:100%; height:50px; content:''; background:rgba(255,255,255,.4);transition:all .35s;}
#solutions>.list a:nth-child(even){ float:right!important;}
#solutions>.list a>img{ width:100%; height:auto; transition:all 1s;}
#solutions>.list a>.name{position:absolute; z-index:9; left:5%; bottom:0; padding:0 30px; height:50px; line-height:50px; font-size:16px; color:#fff; background:rgba(0,0,0,.6);transition:all .35s;}
#solutions>.list a:hover .name{ background:#0067ae;}
#solutions>.list a:hover img{ transform:scale(1.2) rotate(5deg);}
#solutions>.view{ margin:0 auto;}
#solutions>.view>.title{ text-align:center;font-size:25px; color:#333; padding:0 50px;}
#solutions>.view>.img{ border-bottom:1px solid #eee; text-align:center; padding:15px 0;}
#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>.pageurl{ margin:0 auto; padding:50px 0 100px 0; border-top:1px solid #eee;}
#solutions>.view>.pageurl>.url{ width:90%; text-align:left;}
#solutions>.view>.pageurl>.url a{ display:block; padding:3px 0; font-size:14px; color:#999; transition:all .35s;}
#solutions>.view>.pageurl>.url a:hover>span{ color:#0067ae; text-decoration:underline;}
#solutions>.view>.pageurl>.back{ width:10%; padding:5px 0; text-align:center;}
#solutions>.view>.pageurl>.back>a{ display:block; font-size:14px; border:2px solid #0067ae; border-radius:3px; color:#0067ae; padding:12px 30px; transition:all .35s;}
#solutions>.view>.pageurl>.back>a:hover{ background:#0067ae; color:#fff;}
@media only screen and (max-width: 1460px){
#solutions{ max-width:1200px;}
}
/* end*/
/*
news
-----------------------------------------------------------------*/
#news{ width:100%; max-width:1200px; margin:0 auto; padding:50px 0 50px;}
#news>.hot{ background:#eee; margin:0 auto;}
#news>.hot .img{ width:40%; overflow:hidden;}
#news>.hot .img img{ width:100%; height:auto;}
#news>.hot .container{ width:50%; 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:#0067ae; 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:#999; background:rgba(255,255,255,.3); border:1px solid rgba(255,255,255,.8); padding:10px 20px;transition:all .35s;}
#news>.hot .container .more>a:hover{ color:#0067ae; border:1px solid #0067ae;}
#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: #0067ae;}
#news>.list{ margin:0 auto;}
#news>.list a{ display:block; padding:2% 0; border-bottom:1px solid #eee; transition:all .35s;}
#news>.list a .time{ position:relative; width:10%; padding:10px 0; border:1px solid #ddd; text-align:center;transition:all .35s;}
#news>.list a .time h2{ display:block; font-size:60px; font-weight:normal;color:#0067ae;}
#news>.list a .time h3{ display:block;font-size:18px; font-weight:normal; padding:10px 0; color:#0067ae;}
#news>.list a .container{ width:85%; text-align:left;}
#news>.list a .container>.name{ display:block; padding:10px 0; font-size:18px; font-weight:bold;}
#news>.list a .container>.text{ font-size:14px; color:#999; line-height:25px;}
#news>.view{ margin:0 auto;}
#news>.view>.title{ text-align:center;font-size:25px; 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>.url{ width:90%; text-align:left;}
#news>.view>.pageurl>.url a{ display:block; padding:3px 0; font-size:14px; color:#999; transition:all .35s;}
#news>.view>.pageurl>.url a:hover>span{ color:#0067ae; text-decoration:underline;}
#news>.view>.pageurl>.back{ width:10%; padding:5px 0; text-align:center;}
#news>.view>.pageurl>.back>a{ display:block; font-size:14px; border:2px solid #0067ae; border-radius:3px; color:#0067ae; padding:12px 30px; transition:all .35s;}
#news>.view>.pageurl>.back>a:hover{ background:#0067ae; color:#fff;}
@media only screen and (max-width: 1460px){
#news{ max-width:1200px;}
}
/* end*/
/*
partners
-----------------------------------------------------------------*/
#partners{width:100%; max-width:1200px; margin:0 auto; padding:50px 0;}
#partners>.container{ width:100%; text-align:left; margin:0 auto; background:#eee;}
#partners>.container>.text{ padding:5%;width:40%; text-align:left; font-size:14px; color:#666; line-height:21px;}
#partners>.container>.text h2{ color:#333; font-size:20px; margin-bottom:10px;}
#partners>.container>.img{ width:45%; text-align:right;}
#partners>.container>.img>img{ width:100%; height:auto;}
#partners>.list{ margin:0 auto; padding:30px 0;}
#partners>.list a{ position:relative; display:block; float:left; width:19%; padding:2% 3%;}
#partners>.list a:after{position:absolute; z-index:2; right:0; top:0; width:1px; height:100%; background:#eee; content:'';}
#partners>.list a:last-of-type:after{ width:0!important;}
#partners>.list a>.img{ margin:0 auto; text-align:left;}
#partners>.list a>.img>img{ width:100%;height:auto;}
#partners>.list a>.text{ padding:10px 0; text-align:left; font-size:12px; color:#333; line-height:20px; font-weight:bold;}
#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:#0067ae; color:#fff;}
@media only screen and (max-width: 1460px){
#partners{ max-width:1200px;}
}
/* end*/
/*
download
-----------------------------------------------------------------*/
#download{width:100%; max-width:1200px; margin:0 auto; padding:0px 0 100px;}
#download>.img{ width:30%;}
#download>.img>img{ width:100%;height:auto;}
#download>.container{ width:65%;text-align:left;}
#download>.container .list{ margin:0 auto; padding-bottom:80px;}
#download>.container .list>a{display:block; height:50px; line-height:50px; padding:0 20px; border:1px solid #ddd; margin-bottom:15px; transition:all .35s;}
#download>.container .list>a>div{float:left; width:15%; text-align:center; color:#999;font-size:14px;}
#download>.container .list>a>div.td1{ width:70%; font-size:16px; color:#666; text-align:left;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
#download>.container .list>a img{ height:25px; width:auto;}
#download>.container .list>a:hover{ background:#eee;}
#download>.container .list>a:hover .td1{ color:#0067ae;}
#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: 1460px){
#download{ max-width:1200px;}
}
/* end*/
/*
feedback
-----------------------------------------------------------------*/
#feedback{width:100%; max-width:1200px; margin:0 auto; padding:0px 0 100px;}
#feedback>.wrap{ text-align:left; background:#eee; width:50%; float:left;}
#feedback>.wrap .text{ width:90%; padding:10% 5%; color:#999; font-size:18px; line-height:30px;}
#feedback>.wrap .img{ width:100%;}
#feedback>.wrap .img>img{ width:100%; height:auto;}
#feedback>.container{ width:48%; text-align:left; margin:0 2% 0 0; height:590px; border:1px solid #e8e8e8; padding:80px 0; float:left;}
#feedback>.container form{ margin:0px auto; text-align:left;}
#feedback>.container form { margin: 0px auto; text-align: left;}
#feedback>.container form dl { width: 100%; text-align: left; padding: 0px;}
#feedback>.container form dl dt { width: 90px; font-size: 14px; line-height: 28px; color: #666; text-align: left;}
#feedback>.container form dl dt, #feedback>.container form dl dd { padding: 8px 0px;}
#feedback>.container form dl dt span { color: #ff0000; padding-left: 6px;}
#feedback>.container form dl dd { padding-left: 90px; margin-top: -40px;}
#feedback>.container form dl dd select { width: auto; font-size: 14px; font-family: Arial; color: #666; padding: 5px 20px; border: 1px solid #ddd; cursor: pointer; margin-right: 10px;}
#feedback>.container form dl input, #feedback>.container form dl textarea {padding: 0px 20px; font-family: Arial; border: 1px solid #ddd; color: #888; font-size: 14px; border-radius:3px; margin-right: 20px;}
#feedback>.container form dl input { width: 45%; height: 30px;}
#feedback>.container form dl textarea {width: 96%; height: 120px; border: 1px solid #ddd; overflow: auto; padding: 20px 2%;}
#feedback>.container form dl #checksn { width: 10%;}
#feedback>.container form dl .button input { width: auto; height: 45px; line-height: 45px; border: none; color: #fff; padding: 0px 35px; cursor: pointer; font-weight: bold; background:#0067ae; border-radius:3px; font-size: 16px; margin: 15px auto; transition:all .35s;}
#feedback>.container form dl .button input:hover{ background:#666;}
@media only screen and (max-width: 1460px){
#feedback{ max-width:1200px;}
}
/* end*/
/*
contact us
-----------------------------------------------------------------*/
#contact{ width:100%; margin:0 auto;}
#contact>.wrap{ max-width:1200px; margin:0 auto; padding:0px 0 100px 0;}
#contact .img{ width:45%;text-align:left;}
#contact .img>img{width:100%; height:auto;}
#contact .container{ width:50%; text-align:left;}
#contact .container>.name{ padding:15px 0; font-size:30px; font-weight:bold; color:#333; text-transform:uppercase;}
#contact .container>.text{ font-size:14px; line-height:24px;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:600px; margin:0 auto;}
@media only screen and (max-width: 1460px){
#contact>.wrap{ max-width:1200px;}
}
/* end*/
/*
page
-----------------------------------------------------------------*/
#page{ margin:0 auto; padding-bottom:80px;text-align:center;}
#page>a{display:inline-block; width:36px; height:36px; line-height:36px; margin:0 5px; font-size:14px; text-align:center; background:#f7f7f7; border:1px solid #eee;border-radius:3px; transition:all .35s;}
#page>a:hover{ background:#fff;}
#page>a.A{ background:#0067ae; border:1px solid #0067ae; color:#fff;}
.page{ margin:0 auto; padding-bottom:80px;text-align:center;}
.page>a{display:inline-block; width:36px; height:36px; line-height:36px; margin:0 5px; font-size:14px; text-align:center; background:#f7f7f7; border:1px solid #eee;border-radius:3px; transition:all .35s;}
.page>a:hover{ background:#fff;}
.page>a.A{ background:#0067ae; border:1px solid #0067ae; color:#fff;}
/* end*/
/*
kefu
-----------------------------------------------------------------*/
#kefu{ position:fixed; z-index:999; right:0; top:50%; margin-top:-45px; width:90px; height:90px; 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; padding:20px;}
#kefu a:hover{background:rgba(0,170,240,.9);}
/* end*/