﻿/*
#navpart{background:#f9f9f9;margin:0 auto;}
#navpart>.wrap{ width:90%;max-width:1360px; padding:30px 0; text-align:center; margin:0 auto;}
#navpart a{ position:relative; display:inline-block; padding:10px 40px; font-size:16px; color:#444; margin:0 5px; border:1px solid #ddd; background:#fff; transition:all .35s;}
#navpart a:hover{ border:1px solid rgba(208,2,28,1); color:rgba(208,2,28,1);}
#navpart a.A{ background:rgba(208,2,28,1); border:1px solid rgba(208,2,28,1); color:#fff;}
#navpart a.A:after{ position:absolute;z-index:8; left:50%; bottom:-11px; margin-left:-12px; width:0;height:0;border-right:12px solid transparent;border-left:12px solid transparent;border-top:10px solid rgba(208,2,28,1); content:'';}
*/

#navpart{ position:fixed;z-index:999; right:20px;top:30%; width:100px; background:#666;}
#navpart>.gotop{margin:0 auto; position:relative; width:100%; height:80px;}
#navpart>.gotop>a{display:block; height:100%; background:#e33b50 url("../images/icon-gotop-navpart.png") no-repeat; background-position:50% 50%; background-size:auto 40px;}
#navpart>.kefu{margin:0 auto; position:relative; z-index:55; width:100%;height:80px;}
#navpart>.kefu>.btn{ position:relative;z-index:55; display:block; height:80px; text-align:center; cursor:pointer; background:#d0021c url("../images/icon-kefu.png") no-repeat; background-position:50% 50%; background-size:34px auto; transition:all .35s;}
#navpart>.kefu>.container{position:absolute; display:none; z-index:4; right:100px;top:0; height:310px;padding-top:20px; background:#fff; box-shadow:0 7px 5px rgba(0,0,0,.1);}
#navpart>.kefu>.container>.qrcode{display:block; width:280px; background:#fef9f9; padding:20px 0; text-align:center;}
#navpart>.kefu>.container>.qrcode .qr{ display:inline-block; width:110px;padding:0 6px; border-left:1px solid #e6e6e6;}
#navpart>.kefu>.container>.qrcode .qr:first-child{ border:0 !important;}
#navpart>.kefu>.container>.qrcode .qr>img{ width:100%; height:auto;}
#navpart>.kefu>.container>.qrcode p{font-size:12px; padding-top:5px; color:#93959c;}
#navpart>.kefu>.container>.service{ display:block; width:80%;margin:0 auto; text-align:center; border-bottom:1px dotted #eee;}
#navpart>.kefu>.container>.service>.tit{font-size:14px; color:#333;}
#navpart>.kefu>.container>.service>.tit>img{margin-right:10px;}
#navpart>.kefu>.container>.service>.con{ padding:6px 0 10px 0; color:#d0021c; font-size:20px; font-weight:bold;}
#navpart>.kefu>.container>.order{ display:block; padding:20px 0; text-align:center; border-bottom:1px solid #eee;}
#navpart>.kefu>.container>.order>a{display:inline-block; color:#01AAED; font-size:14px; transition:all .35s;}
#navpart>.kefu>.container>.order img{height:36px; width:auto; margin-right:10px;}
#navpart>.kefu>.container>.order>a:hover{transform:scale(1.1)}
#navpart>.btn{display:none;}
#navpart>.nav{ position:relative; z-index:88; margin:0 auto;}
#navpart>.nav>.close{ display:none;}
#navpart>.nav>.container{padding:6px 0;}
#navpart>.nav>.container>a{ position:relative; display:block;padding:15px 0; text-align:center; font-size:14px; color:#fff; transition:all .35s;}
#navpart>.nav>.container>a:hover{ background:rgba(255,255,255,.1);}
#navpart>.nav>.container>a.A{background:rgba(255,255,255,.2);}
#navpart>.nav>.container>a.A:after{ display:none; position:absolute;z-index:8; left:-10px; top:50%; margin-top:-20px; width:0;height:0;border-top:20px solid transparent;border-bottom:20px solid transparent;border-right:10px solid rgba(255,255,255,.4); content:'';}

@media only screen and (max-width: 960px){
  #navpart{ top:auto; right:30px; bottom:30px;width:60px; background:none;}
  #navpart>.btn{ display:block; margin:10px auto; position:relative; width:100%; height:60px;}
  #navpart>.btn>a{display:block; height:100%; background:#d0021c url("../images/icon-navpart.png") no-repeat; background-position:50% 50%; background-size:auto 40px;border-radius:100%;}
  #navpart>.kefu{display:none;}
  #navpart>.gotop{height:60px;}
  #navpart>.gotop>a{background-color:rgba(0,0,0,.3); border-radius:100%;}
  #navpart>.nav{display:none; position:fixed;z-index:99; left:0;bottom:0; width:100%;height:40%; background:#666;}
  #navpart>.nav>.close{ display:block;padding:10px; text-align:right;}
  #navpart>.nav>.close>a{display:inline-block; width:20px; height:20px; cursor:pointer; background:url("../images/icon-close.png") no-repeat; background-size:100% auto; background-position:50% 50%;}
  #navpart>.nav>.container{ height:70%;overflow-x:hidden; overflow-y:auto;}
}
@media only screen and (max-width: 420px){
  #navpart{ right:20px; bottom:20px;width:50px;}
  #navpart>.btn{ width:50px; height:50px; line-height:50px;}
  #navpart>.btn>a{background-size:auto 32px;}
  #navpart>.gotop{width:50px; height:50px; line-height:50px;}
  #navpart>.gotop>a{background-size:auto 32px;}
}

#title{margin:0 auto; transition:all .35s;}
#title>.wrap{ width:90%;max-width:1360px; padding:20px 0; text-align:left; font-size:24px; font-family:'微软雅黑'; font-weight:bold; color:#333; margin:0 auto;}
#title.active {transform: translateX(-220px);}
@media only screen and (max-width: 960px){
  #title>.wrap{padding-bottom:0 !important;}
}
@media only screen and (max-width: 780px){
  #title>.wrap{ font-size:24px;}
}
@media only screen and (max-width: 520px){
  #title>.wrap{ font-size:24px;}
}


#about{ margin:0 auto; padding:20px 0;overflow:hidden;}
#about>.img{width:50%; text-align:left;}
#about>.img>img{width:100%;height:auto;}
#about>.container{ width:35%;padding:2% 10% 2% 5%; text-align:left;}
#about>.container>.slogan{ display:none; position:relative; margin:20px 0;font-family:"Arial Black"; font-size:60px; text-transform:uppercase; color:#f9f9f9;}
#about>.container>.slogan>span{ position:absolute;z-index:9; left:0;top:0; width:100%; text-align:left; font-size:30px; font-weight:600; color:#222;}
#about>.container>.text{ font-size:16px; line-height:28px; color:#666;}
#about>.container>.text>p{margin-bottom:20px; text-indent: 2em;}
#about>.container>.stress{ padding:30px 0; text-align:left;}
#about>.container>.stress>.item{ position:relative; display:inline-block; width:140px;height:140px; margin-right:30px; color:#d0021c; text-align:center;}
#about>.container>.stress>.item>.num{ position:relative;z-index:9; font-size:20px; font-weight:bold; padding-top:28px;transition:all .35s;}
#about>.container>.stress>.item>.num>span{ display:inline-block; font-size:45px;letter-spacing:-2px;}
#about>.container>.stress>.item>.txt{position:relative;z-index:9; font-size:16px; font-weight:bold; transition:all .35s;}
#about>.container>.stress>.item>.br{ position:absolute;z-index:1;left:0;top:0; width:100%;height:100%; background:#f7f7f7; border-radius:100%; box-shadow: 0 0 0 4px #f7f7f7; box-sizing:border-box;animation: fadeInUp .3s; animation-timing-function: ease-in; transition:all .35s;}
#about>.container>.stress>.item:nth-child(1)>.br{ animation-duration:.3s;}
#about>.container>.stress>.item:nth-child(2)>.br{ animation-duration:.8s;}
#about>.container>.stress>.item:nth-child(3)>.br{animation-duration:1s;}
#about>.container>.stress>.item:hover{ color:#d0021c;}
#about>.container>.stress>.item:hover .br:after {pointer-events: none;position: absolute;width: 100%;height: 100%;border-radius: 50%;top: -5px;left: -5px;padding: 0;z-index: 10;border: 5px dashed #d0021c;content:'';box-sizing: content-box;-webkit-animation: spinAround 9s linear infinite;-moz-animation: spinAround 9s linear infinite; animation: spinAround 9s linear infinite;}
#about>.container>.stress>.item:hover .br {box-shadow: 0 0 0 0 transparent;background:#fff;-webkit-transition: box-shadow .2s;-moz-transition: box-shadow .2s; transition: box-shadow .2s;}
#about>.container>.stress>.item:hover .num{transform:scale(0.9);}

@-webkit-keyframes spinAround {
  from {
    -webkit-transform:rotate(0deg)
  }
  to {
    -webkit-transform:rotate(360deg)
  }
}
@-moz-keyframes spinAround {
  from {
    -moz-transform:rotate(0deg)
  }
  to {
    -moz-transform:rotate(360deg)
  }
}
@keyframes spinAround {
  from {
    transform:rotate(0deg)
  }
  to {
    transform:rotate(360deg)
  }
}
@media only screen and (max-width: 1500px){
  #about>.container>.stress>.item{ width:130px;height:130px; margin-right:20px;}
  #about>.container>.stress>.item>.num>span{ font-size:42px;}
}
@media only screen and (max-width: 1340px){
  #about>.container>.stress>.item{ width:120px;height:120px;}
  #about>.container>.stress>.item>.num>span{ font-size:38px;}

}
@media only screen and (max-width: 1280px){
  #about>.container>.stress>.item{ width:116px;height:116px; margin-right:15px;}
  #about>.container>.stress>.item>.num>span{ font-size:36px;}
}
@media only screen and (max-width: 1160px){
  #about>.container>.stress>.item{ width:110px;height:110px; margin-bottom:15px;}
  #about>.container>.stress>.item>.num{padding-top:22px;}
  #about>.container>.stress>.item>.num>span{ font-size:32px;}
  #about>.container>.stress>.item>.txt{font-size:15px;}

}
@media only screen and (max-width: 960px){
  #about>.img{ float:none; width:100%;}
  #about>.container{ float:none; width:86%;padding:2% 0!important; margin:0 auto;}
  #about>.container>.slogan{ text-align:center;}
  #about>.container>.slogan>span{ text-align:center;}
  #about>.container>.stress{ text-align:center;}
  #about>.container>.stress>.item{ width:130px;height:130px; margin-right:20px;}
  #about>.container>.stress>.item>.num>span{ font-size:42px;}
}
@media only screen and (max-width: 780px){
  #about{ padding:20px 0 50px 0;}
}
@media only screen and (max-width: 560px){
  #about>.container>.stress>.item{ width:110px;height:110px; margin-bottom:15px;}
  #about>.container>.stress>.item>.num>span{ font-size:32px;}
}
@media only screen and (max-width: 420px){
  #about>.container>.slogan{ font-size:36px;}
  #about>.container>.slogan>span{ font-size:20px;}
  #about>.container>.stress>.item{ width:80px;height:80px; margin-bottom:15px;}
  #about>.container>.stress>.item>.num{padding-top:16px;}
  #about>.container>.stress>.item>.num>span{ font-size:26px;}
  #about>.container>.stress>.item>.txt{font-size:13px;}
}


#contact{ position:relative; margin:0 auto; padding:20px 0; }
#contact>.contactus{width:96%;max-width:1360px;margin:0 auto 40px auto; padding:30px 0; border:1px solid #eee;border-radius:3px;}
#contact>.contactus .tit{ font-size:14px; color:#444;}
#contact>.contactus .tel{ padding-bottom:10px; font-size:24px; color:#1b5698;}
#contact>.contactus .tips{ font-size:12px; color:#ccc;}
#contact>.contactus .con{ font-size:16px; color:#666;}
#contact>.contactus>.map{ width:61%; text-align:center; min-height: 300px;}
#contact>.contactus>.contact{ width:28.3%; padding:20px 5%; text-align:left; border-left:1px solid #eee;}
#contact>.contactus>.contact>.con>p{ position:relative; display:block;padding:8px 0 8px 38px;}
#contact>.contactus>.contact>.con>p img{ position:absolute;z-index:1; left:0;top:6px; height:28px; width:auto;}
#contact>.contactus>.contact>.con>h2{padding-left: 38px; margin-bottom:16px;}

@media only screen and (max-width: 780px){
#contact>.contactus>.map{height:auto; min-height:auto;}
  #contact>.contactus>.map{width:100%}
  #contact>.contactus>.map img{max-width:100%}
#contact>.contactus>.fl{float:none}
#contact>.contactus>.contact{width:100%}
}


#production{ position:relative; width:96%; max-width:1360px; margin:0 auto; padding:0px 0 50px; }
#production>.list{  margin:0 auto;}
#production>.list>ul{ margin:0 auto;}
#production>.list>ul>li{position:relative;display:block; float:left; width:21.2%; overflow:hidden; padding:1%; margin-right:2%; margin-bottom:2%; border:1px solid #eee;text-align:center;}
#production>.list>ul>li:nth-of-type(4n){ margin-right:0 !important;}
#production>.list>ul>li>a>.img{ position:relative; margin:0 auto; overflow:hidden;}
#production>.list>ul>li>a>.img>img{ width:100%; height:auto; transition:all 1s;}
#production>.list>ul>li>a>.tit{ padding:15px 10px; font-size:16px; text-align:center; overflow: hidden;text-overflow:ellipsis;white-space: nowrap; transition:all .35s;}
#production>.list>ul>li>a:hover .img>img{transform:scale(1.1);}
#production>.loadmore{ width:90%;max-width:1360px; padding:50px 0;margin:0 auto; text-align:center;}
#production>.loadmore>a{display:inline-block; padding:10px 90px; font-size:18px; color:#666; border:1px solid #ddd; border-radius:50px; transition:all .35s;}
#production>.loadmore>a:hover{ background:#1b5698; border:1px solid #1b5698; color:#fff;}

@media only screen and (max-width: 1080px){
  #production>.list>ul>li{width:29.7%;}
  #production>.list>ul>li:nth-of-type(4n){ margin-right:2% !important;}
  #production>.list>ul>li:nth-of-type(3n){ margin-right:0 !important;}

}
@media only screen and (max-width: 780px){
  #production{padding-top: 20px;}
  #production>.list>ul>li{width:29.6%;}
  #production>.list>ul>li>a>.tit{ font-size:14px;}

}
@media only screen and (max-width: 580px){
  #production>.list>ul>li{ width:46.5%; margin-right:0 !important;}
  #production>.list>ul>li:nth-of-type(even){ float:right;}
  #production>.list>ul>li:nth-of-type(4n){ margin-right:0 !important;}
  #production>.list>ul>li:nth-of-type(3n){ margin-right:0 !important;}
}


#news{width:100%; margin:20px auto; padding-bottom:20px;}
#news>.list{ margin:0px auto;overflow:hidden;}
#news>.list>ul{margin:0 auto;}
#news>.list>ul>li{display:block;margin:0 auto; transition:all .35s;}
#news>.list>ul>li>a{ position:relative; display:block; width:96%; max-width:1360px;padding:50px 0; margin:0 auto; transition:all .35s;}
#news>.list>ul>li>a:after{ position:absolute;z-index:3;left:0;bottom:0; width:100%;height:1px; background:#eee;content:''; transition:all .35s;}
#news>.list>ul>li:last-child a:after{opacity:0;}
#news>.list>ul>li>a .img{ width:30%; text-align:left; overflow:hidden;}
#news>.list>ul>li>a .img>img{width:100%; height:auto; transition:all 1s;}
#news>.list>ul>li>a .con{width:50%;text-align:left; padding:0 5%;}
#news>.list>ul>li>a .con>.tit{ font-size:24px; color:#333;overflow: hidden;text-overflow:ellipsis; white-space: nowrap; transition:all .35s;}
#news>.list>ul>li>a .con>.txt{ margin:20px 0; height:75px; line-height:26px; font-size:16px; color:#999;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;overflow: hidden;}
#news>.list>ul>li>a .con>.more{ text-align:left;}
#news>.list>ul>li>a .con>.more>span{ display:inline-block;padding:8px 30px; font-size:16px; color:#1b5698; border:1px solid #1b5698; border-radius:30px;transition:all .35s;}
#news>.list>ul>li>a .time{ width:10%; color:#1b5698; text-align:right;}
#news>.list>ul>li>a .time>.dm{ font-size:32px;}
#news>.list>ul>li>a .time>.yy{ font-size:18px;}
#news>.list>ul>li:hover{ background:#eee;}
#news>.list>ul>li:hover a:after{ background:none;}
#news>.list>ul>li:hover .con>.more>span{ margin-left:6px; color:#fff; background:#1b5698;}
#news>.list>ul>li>a .img:hover img{transform:scale(1.1);}
#news>.loadmore{ width:90%;max-width:1360px; padding:50px 0;margin:0 auto; border-top:1px solid #eee; text-align:center;}
#news>.loadmore>a{display:inline-block; padding:10px 90px; font-size:18px; color:#666; border:1px solid #ddd; border-radius:50px; transition:all .35s;}
#news>.loadmore>a:hover{ background:#1b5698; border:1px solid #1b5698; color:#fff;}
#news>.view{ width:96%;max-width:1360px;margin:0 auto;}
#news>.view>.title{ font-size:32px;font-weight:normal;padding:20px; text-align:center;}
#news>.view>.time{text-align:center; font-size:16px; color:#999;padding:0 20px 20px 20px; border-bottom:1px solid #eee;}
#news>.view>.content{margin:0 auto; width:80%; max-width:1360px;padding:50px 0;}
#news>.view>.content{ font-size:16px; line-height:28px; color:#666;}
#news>.view>.content>p{margin-bottom:20px;}
#news>.view>.content img{max-width:100%;height:auto;}
#news>.view>.content table{ border-top:1px solid #ddd; border-left:1px solid #ddd;margin:0px auto; width:99.6%;}
#news>.view>.content table td{ color:#666; font-size:14px; padding:8px; text-align:center; border-right:1px solid #ddd; border-bottom:1px solid #ddd;}
#news>.view>.content .tableWap{ overflow:hidden; overflow-x:auto;}
#news>.view>.pageurl{margin:0 auto;padding:50px;font-size:14px;}
#news>.view>.pageurl>.prev, #news>.view>.pageurl>.next{ width:40%; padding:5px; text-align:left; border-bottom:1px solid #aaa;overflow: hidden;text-overflow:ellipsis; white-space: nowrap;}
#news>.view>.pageurl strong{font-weight:normal; font-size:16px;color:#999;}



@media only screen and (max-width: 960px){
  #news>.list>ul>li>a .con>.tit{ font-size:22px;}
  #news>.list>ul>li>a .con>.txt{ height:40px; line-height:21px; font-size:14px;-webkit-line-clamp:2;}
  #news>.list>ul>li>a .con>.more>span{ padding:6px 26px; font-size:13px;}
  #news>.list>ul>li>a .time>.dm{ font-size:28px;}
  #news>.list>ul>li>a .time>.yy{ font-size:16px;}
  #news>.view>.title{ font-size:28px;}
}

@media only screen and (max-width: 780px){
  #news>.list>ul>li>a{padding:0px 0px 20px;}
  #news>.list>ul>li>a .con>.tit{ font-size:20px;}
  #news>.list>ul>li>a .con>.txt{ margin:10px 0;}
  #news>.list>ul>li>a .con>.more>span{font-size:12px;}
  #news>.list>ul>li>a .time>.dm{ font-size:24px;}
  #news>.list>ul>li>a .time>.yy{ font-size:14px; line-height: 20px;}

}

@media only screen and (max-width: 640px){
  #news>.list>ul>li>a .img{ float:none; width:100%;}
  #news>.list>ul>li>a .con{ float:none; width:100%;padding:20px 0;}
  #news>.list>ul>li>a .con>.tit{ font-size:22px;}
  #news>.list>ul>li>a .con>.txt{ margin:20px 0;}
  #news>.list>ul>li>a .con>.more>span{font-size:14px;}
  #news>.list>ul>li>a .time{ float:none; width:100%;}
  #news>.list>ul>li>a .time>.dm{ font-size:28px;}
  #news>.list>ul>li>a .time>.yy{ font-size:16px;}
  #news>.view>.title{ font-size:20px; padding:10px; line-height: 1.2em}
  #news>.view>.time{font-size:13px;}
  #news>.view>.content{ font-size:14px; line-height:24px; color:#666; width:100%; padding: 10px;}
  #news>.view>.content table td{font-size:12px; padding:5px; }
  #news>.view>.pageurl{padding:30px 15px;font-size:12px;}
  #news>.view>.pageurl>.prev, #news>.view>.pageurl>.next{ float:none; width:100%; padding:5px; box-sizing:border-box;}

}
/*END*/




#product{ margin:0 auto; }
#product>.catalog{width:96%;max-width:1360px; clear:both; margin:30px auto;}
#product>.catalog>.item{position:relative; z-index:1; display:block;float:left; width:32%; margin:0 2% 2% 0;}
#product>.catalog>.item:nth-child(3n){margin-right:0 !important;}
#product>.catalog>.item .tit{padding:15px; text-align:left;border:1px solid #eee; border-bottom:0 !important;}
#product>.catalog>.item .tit>a{ position:relative; display:block; font-size:20px; font-weight:700; color:#333; transition:all .35s; line-height:30px;}
#product>.catalog>.item .tit>a>span{ display:inline-block; width:30px;height:30px; line-height:30px; overflow:hidden; float:left; text-align:center; margin-right:10px; background:#1b5698; color:#fff; transition:all .35s;}
#product>.catalog>.item .img{ text-align:left;margin:0 auto;padding:0 15px;border-left:1px solid #eee;border-right:1px solid #ddd;}
#product>.catalog>.item .img img{width:100%; height:auto;}
#product>.catalog>.item .con{position:relative; width:100%; height:168px;}
#product>.catalog>.item .con>.list{padding:15px; background:#fff; border:1px solid #eee; border-top:0 !important; text-align:left;height:135px; overflow:hidden;}
#product>.catalog>.item .con>.list>a{ position:relative; display:block; padding:4px 0; font-size:16px; color:#555; transition:all .35s;}
#product>.catalog>.item .con>.list>a:after{position:absolute;z-index:1;left:0;top:7px; width:2px;height:0; background:#1b5698; content:''; transition:all .35s;}
#product>.catalog>.item .con>.list>a:hover{ color:#1b5698; padding-left:12px;}
#product>.catalog>.item .con>.list>a:hover:after{height:50%;}
#product>.catalog>.item:hover .tit>a{ color:#1b5698;}


#product>.product{width:96%;max-width:1360px; margin:0 auto;}
#product>.product>.container{margin:0 auto; padding:20px 0;}
#product>.product>.container>.path{ width:60%; text-align:left;color:#1b5698; font-size:20px;}
#product>.product>.container>.path>img{height:36px; width:auto; margin-right:5px;}
#product>.product>.container>.path>a{ position:relative; display:inline-block;padding:0 3px; font-weight:bold; color:#1b5698; transition:all .35s;}
#product>.product>.container>.path>a:hover{opacity:.5;}
#product>.product>.container>.back{width:20%; text-align:right;}
#product>.product>.container>.back>a{background:#1b5698; border:1px solid #1b5698; border-radius:50px; color:#fff;padding:6px 20px; font-size:14px; transition:all .35s;}
#product>.product>.container>.back>a:hover{ background:none; color:#1b5698;}
#product>.product>.list{margin:0 auto;}
#product>.product>.list>ul{margin:0 auto;}
#product>.product>.list>ul>li{position:relative;display:block; float:left; width:21.2%; overflow:hidden; padding:1%; margin-right:2%; margin-bottom:2%; border:1px solid #eee; transition:all .35s;}
#product>.product>.list>ul>li:nth-of-type(4n){ margin-right:0 !important;}
#product>.product>.list>ul>li>a{display:block;}
#product>.product>.list>ul>li>a .img{ text-align:center; transition:all .35s;}
#product>.product>.list>ul>li>a .img>img{ width:100%;height:auto;}
#product>.product>.list>ul>li>a .tit{ padding:0 50px; text-align:left;font-size:18px; color:#666;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;}
#product>.product>.list>ul>li>a .more{ padding:10px 50px 20px 50px; color:#1b5698;font-size:14px;}
#product>.product>.list>ul>li>a .more>img{display:inline-block; margin-left:6px; height:18px; width:auto; transition:all .35s;}
#product>.product>.list>ul>li>a:hover .more>img{ padding-left:4px;}
#product>.product>.list>ul>li>a:hover .img{transform:translateY(-6px)}
#product>.product>.list>ul>li:hover{ box-shadow:0 3px 8px rgba(0,0,0,.1);}
#product>.product>.loadmore{ width:90%;max-width:1360px; padding:50px 0;margin:0 auto; text-align:center;}
#product>.product>.loadmore>a{display:inline-block; padding:10px 90px; font-size:18px; color:#666; border:1px solid #ddd; border-radius:50px; transition:all .35s;}
#product>.product>.loadmore>a:hover{ background:#1b5698; border:1px solid #1b5698; color:#fff;}


#product>.view{margin:0 auto; position:relative;}
#product>.view .title{font-size: 22px; color: #333;height: 30px; line-height: 30px; margin-bottom: 15px;}
#product>.view .line{width:40px; height: 3px; display: block; background: #333; margin-bottom: 25px;}
#product>.view>.container{ width:90%;max-width:1360px;margin:0 auto;overflow:hidden;}
#product>.view .focus{ position:relative; width:34%; text-align:center;}
#product>.view .focus img{ width:100%;height:auto;}

/*放大镜*/
#showbox { background:#eee; border:1px solid #eee; margin-top: 20px;}
#showbox span { background:url(../images/whitebg.png) repeat;}
#showsum { left:25px; margin-top:10px;}
#showsum span { border:1px solid #ddd;}
#showsum span.sel { border:1px solid #f60;}
.showpage { width:400px; position:relative;}
.showpage a { display:block; width:15px; border:1px solid #ddd; height:60px; line-height:60px; background:#eee; text-align:center; font-size:18px; position:absolute; left:0; top:-62px; text-decoration:none; color:#999;}
.showpage a#shownext { left:auto; right:0;}
.showpage a:hover { background:#ccc; color:#777;}

#product>.view .con{ width:60%; padding:50px 20px 0 20px; text-align:left;}
#product>.view .con>.tit{ font-size:20px; color:#1b5698;}
#product>.view .con>.txt{ padding:20px 0; width:80%; font-size:16px; color:#666; line-height:25px;}
#product>.view .con>.txt>p{ margin-bottom:20px;}
#product>.view .more{}
#product>.view .more>a{display: block; float: left; width: 46%!important; background: #1b5698; padding: 12px 10px; font-size: 16px; color: #fff; text-align: center; border: 0; cursor: pointer;}
#product>.view .procont{width:96%;max-width:1360px; padding:50px 0;margin:0 auto;}
#product>.view .procont img{max-width:100%}
#product>.view>.pageurl{ width:96%;max-width:1360px; padding:50px 0;margin:0 auto; border-top:1px solid #eee; text-align:center;}
#product>.view>.pageurl>a{display:inline-block; padding:10px 90px; font-size:18px; color:#666; border:1px solid #ddd; border-radius:50px; transition:all .35s;}
#product>.view>.pageurl>a:hover{ background:#1b5698; border:1px solid #1b5698; color:#fff;}

@media only screen and (max-width: 1080px){
  #product>.catalog>.item .tit>a{ font-size:18px;}
  #product>.catalog>.item .con>.list>a{ font-size:14px;}
  #product>.solution .swiper-container a{font-size:14px;}
  #product>.view .title{ bottom:-60px;}
  #product>.view .container{ padding-top:100px;}
  #product>.view .container>.con>.txt{ width:90%; font-size:14px; line-height:20px;}
}

@media only screen and (max-width: 960px){
  #product>.catalog>.item .tit>a{ font-size:16px;}
  #product>.catalog>.item .tit>a>span{ width:25px;height:25px; line-height:25px;}
  #product>.catalog>.item .con>.list>a{ font-size:13px;}
  #product>.product>.list>ul>li{width:29.4%;}
  #product>.product>.list>ul>li:nth-of-type(4n){ margin-right:2% !important;}
  #product>.product>.list>ul>li:nth-of-type(3n){ margin-right:0 !important;}
  #product>.view .title{ font-size:25px; bottom:-60px;}

}
@media only screen and (max-width: 780px){
  #product>.catalog>.item{width:49%; float:left; margin-bottom:2%;margin-right:0 !important;}
  #product>.catalog>.item:nth-child(3n){margin-right:0 !important;}
  #product>.catalog>.item:nth-child(2n){float:right;}
  #product>.product>.container>.path{font-size:16px;}
  #product>.product>.container>.path>img{height:30px; }
  #product>.product>.container>.back>a{ border-radius:30px;padding:6px 20px; font-size:12px;}
  #product>.product>.list>ul>li>a .tit{ padding:0 20px; text-align:center;font-size:16px;}
  #product>.product>.list>ul>li>a .more{ padding:10px 20px 20px 20px; text-align:center;}
  #product>.view .title{ font-size:25px; bottom:0; text-align:center;}
  #product>.view .container{ float:none; width:100%; padding-top:0;}
  #product>.view .focus{ float:none; width:100%;}
 
}

@media only screen and (max-width: 640px){
  #product>.isnew>.item{ width:100%; float:none; margin-bottom:2%;}
  #product>.isnew>.item:nth-child(2n){float:none;}
  #product>.catalog>.item{float:none; width:100%; margin:0 0 2% 0;}
  #product>.catalog>.item:nth-child(3n){margin-right:0 !important;}
  #product>.catalog>.item:nth-child(2n){float:none;}
  #product>.catalog>.item .con{ height:auto!important;}
  #product>.catalog>.item .con>.list{height:auto!important;}
  #product>.product>.container>.path{ width:100%;}
  #product>.product>.container>.path{font-size:14px;}
  #product>.product>.container>.path>img{height:25px; }
  #product>.product>.container>.back{ float:none; width:30%; padding-top:50px; text-align:left;}
  #product>.product>.container>.back>a{padding:6px 12px;}
  #product>.product>.list>ul>li{width:46.4%; margin-right:0 !important;}
  #product>.product>.list>ul>li:nth-of-type(4n){ margin-right:0 !important;}
  #product>.product>.list>ul>li:nth-of-type(3n){ margin-right:0 !important;}
  #product>.product>.list>ul>li:nth-of-type(2n){ float:right;}
 

  #quickmenu{ display:none;}
}
@media only screen and (max-width: 560px){
 
}

@media only screen and (max-width: 420px){
  #product>.product>.list>ul>li>a .tit{ font-size:14px;}
  #product>.product>.list>ul>li>a .more{ font-size:12px;}
  #product>.product>.list>ul>li>a .more>img{ margin-left:3px; height:14px;}
  #product>.product>.list>ul>li{ float:none!important; width:100%; margin-right:0 !important;}
}


#order{ margin:0 auto;}
#order>table{width:96%; max-width: 1360px; margin:30px auto; background: #f2f2f2; border-collapse: inherit;}
#order>table th{height: 60px; line-height: 60px; background: #1b5698; color:#fff; font-size: 14px; text-align: center;}
#order>table th:nth-child(1){width:10%; text-align: center;}
#order>table th:nth-child(2){width:10%;}
#order>table th:nth-child(3){width:70%; text-align: left; padding-left: 10px;}
#order>table th:nth-child(4){width:10%;}
#order>table td{background: #fff;}
#order>table td:nth-child(1){text-align: center;}
#order>table td:nth-child(3){padding-left: 10px;}
#order>table td:nth-child(4){text-align: center;}
#order>table img{max-width:100%}

#order>.feedback{border-top:1px solid #eee;margin:0 auto; padding:50px 0; }
#order>.feedback>.title{text-align:center;margin:0 auto;}
#order>.feedback>.title>.tit{ font-size:30px;}
#order>.feedback>.title>.tip{ padding:20px 0; font-size:16px; color:#999;}
#order>.feedback>.container{ width:96%;max-width:1360px;margin:0 auto; padding:50px 0;}
#order>.feedback>.container .item{ display:block; padding:12px 0;}
#order>.feedback>.container .code{ position:relative;}
#order>.feedback>.container input{ display:inline-block; box-sizing:border-box; width:100%;height:auto;padding:15px;-webkit-appearance:none; border:1px solid #ccc; color:#666;text-align:left;}
#order>.feedback>.container input::-webkit-input-placeholder{ color:#999;}
#order>.feedback>.container textarea{ display:block;box-sizing:border-box; width:100%;height:auto;padding:15px;-webkit-appearance:none;  font-family:"微软雅黑"; line-height:20px; border:1px solid #ccc; color:#666;text-align:left;}
#order>.feedback>.container textarea::-webkit-input-placeholder{ color:#999;}
#order>.feedback>.container .w30{width:30%;}
#order>.feedback>.container .w50{width:48%;}
#order>.feedback>.container .w100{width:100%; clear:both}
#order>.feedback>.container #checkimg{display:inline-block; position:absolute;z-index:3; top:50%; right:10px; margin-top:-13px; cursor:pointer;}
#order>.feedback>.container .submit{ float:right; display:inline-block; box-sizing:border-box; width:46%!important; background:#d0021c;padding:12px 10px; font-size:16px; color:#fff; text-align:center; border:0; cursor:pointer; width:50%;}
#order>.feedback>.container .reset{ float:left;display:inline-block; box-sizing:border-box;width:46%!important; background:#666;padding:12px 10px;font-size:16px; color:#fff; text-align:center; border:0; cursor:pointer; width:50%;}
#order>.partner{margin:0 auto; padding:50px 0; display:none; }
#order>.partner>.title{text-align:center;margin:0 auto;}
#order>.partner>.title>.tit{ font-size:30px;}
#order>.partner>.container{ width:90%;max-width:1100px;margin:0 auto; padding:50px 0;}
#order>.partner>.container img{max-width:100%;height:auto;}



.pagination{text-align: center; margin-bottom: 24px;}

.page_list{text-align: right; margin-bottom: 30px;}
.page {
  display:inline-block;
  font: 16px/28px 'å¾®è½¯é›…é»‘', sans-serif;
  *display:inline;
  :1;
  *zoom:1;}
.page span,.page strong {
  float:left;}
.page a,
.page span.disabled,
.page strong {
  background:#FFF;
  border:1px solid #CCC;
  color:#333;
  float:left;
  font: 16px/24px  'å¾®è½¯é›…é»‘', sans-serif;
  margin-right:5px;
  min-width:15px;
  padding:4px 8px;
  text-align:center;
  vertical-align:middle;
  white-space:nowrap;
  _width:15px;}
  .page strong{background:#e30212; color:#fff; }
.page a:hover {
  border:1px solid #e30212;
  color:#e30212;
  text-decoration:none;}
.page span.disabled {
  background:#FFF;
  border:1px solid #CCC;
  color:#CCC;}
.page span.ellipsis {
  float:left;
  font: 16px/24px 'å¾®è½¯é›…é»‘', sans-serif;
  line-height:22x;
  margin-right:5px;}
.page .page_txt {
  line-height:20px;
  float:right;
  width:auto;}
.page a.page-curpage {
  background:#e30212;
  border:1px solid #e30212;
  color:#FFF;
  font-weight:bold;}
.page input {
  font: 14px Verdana;
  padding:0 0 0 1px;
  width:40px;
  height:14px;}
