﻿/*****通用编码******/
body,div,ul,ol,li,dl,dt,dd,h1,h2,h3,h4,h5,h6,input{margin:0px;padding:0px;}
*html{background-image:url(about:blank);background-attachment:fixed;}/*解决IE6下滚动抖动的问题*/
img{border:none;}
body {color: #656565; font:12px/1.5 宋体,Arial,sans-serif; width:100%; min-width:1000px;}
ul,ol,li,form, dl {list-style: none;}
p{margin:0px; padding:0px;}
a{text-decoration: none;color:#656565;}
a:hover {}
div{ margin:0 auto;}
@media (max-width:760px){
    *{box-sizing:border-box;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;}
    body{min-width: 100%;}
}
/*模块编码*/
.fl {float: left;}
.fr {float: right;}
.pr{ position:relative;}
.clear {clear: both; overflow:hidden;}
.hidden{ display:none;}
.clearfix:after {clear: both;content: " ";display: block;height: 0;}
#header{ width:100%; overflow:hidden; margin:0 auto; }
.top{ width:100%; height:38px; line-height:38px; background:#2c353e; overflow:hidden;}
.tel{ width:1200px; height:100%; margin:0 auto; text-align:right;}
.tel img{ padding-top:10px; float:right; margin-right:6px;}
.tel a,.tel samp{ float:right; margin-right:20px; font-family:"微软雅黑"; font-size:14px; color:#f5f4f2;}
.header{ width:1200px; height:120px; margin:0 auto;}
.logo{ width:366px; height:54px; background:url(../images/logo.jpg) no-repeat center; float:left; overflow:hidden; margin-top:34px;}
.logo a{ display:block; width:100%; height:100%; text-indent:-99999em;}
.nav{ width:725px; float:right; height:100%; overflow:hidden;}
.nav ul{ height:120px; width:750px;}
.nav ul li{ width:112px; height:120px; float:left; overflow:hidden; line-height:120px; text-align:center; margin-right:10px;}
.nav ul li a{ display:block; width:100%; height:100%; font-family:"微软雅黑"; font-size:16px; color:#0373a5;}
.nav ul li a:hover{ background:#0373a5; color:#ffffff;}
nav{display: none}
@media(max-width: 760px){
    .top{display: none}
    .header{position: fixed;left: 0;top: 0;width: 100%;z-index: 11;background: #fff;box-shadow: 0 2px 4px rgba(0,0,0,.2);-webkit-box-shadow: 0 2px 4px rgba(0,0,0,.2);-ms-box-shadow: 0 2px 4px rgba(0,0,0,.2);height: 60px;}
    .logo{height: 50px;margin-top: 5px;width: 70%;background-size: contain;background-position:left center }
    /*Header button*/
    .Header-botton{margin-right:2%;margin-top:5px;position:relative; height:50px;width:30px;cursor:pointer;display: block}
    .Header-botton:after,.Header-botton:before{position:absolute;left:0;width:100%;height:2px;background:#000;content:"";transition:ease 0.5s;-webkit-transition:ease 0.5s;-moz-transition:ease 0.5s;-o-transition:ease 0.5s;}
    .Header-botton:after{bottom:13px;}
    .Header-botton:before{top:13px;}
    .Header-botton span{display:block;height:2px;width:100%;background:#000;position:absolute;top:50%;left:0;border-radius:2px;margin-top:-1px;transition:ease 0.5s;-webkit-transition:ease 0.5s;-moz-transition:ease 0.5s;-o-transition:ease 0.5s;}
    .Header-botton.active:after{transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-ms-transform:rotate(-45deg);-o-transform:rotate(-45deg);transform-origin:0 100%;-webkit-transform-origin:0 100%;-ms-transform-origin:0 100%;-moz-transform-origin:0 100%;-o-transform-origin:0 100%;left:5px;bottom:13px;}
    .Header-botton.active:before{transform:rotate(45deg);-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform-origin:0 100%;-webkit-transform-origin:0 100%;-ms-transform-origin:0 100%;-moz-transform-origin:0 100%;-o-transform-origin:0 100%;top:13px;left:5px;}
    .Header-botton.active span{opacity:0}
    .nav{display: none}
    nav{display: block;position: fixed;left: 0;top:-150%;width: 100%;height: auto;background: #0373a4;z-index: 9;}
    nav a{display: block;line-height: 34px;border-bottom: solid 1px #03648f;border-top: solid 1px #4fb9e7;color: #fff;text-align: center;font-size: 14px;}
    nav.active{top: 60px}
}

.banner{ width:100%; overflow:hidden; margin:0 auto;}
.swap {width:100%;height:500px;margin:0 auto;position:relative;z-index:1;}
#slider {list-style:none;width:100%;height:100%;margin:0;padding:0;}
#slider li {width:100%;height:500px;display:none;position:absolute;}
#naviSlider {list-style:none;margin:0 auto;text-align:right;margin-top:-20px;position:relative;z-index:2;width:1200px; height:20px;}
#naviSlider li {height:6px;width:50px;cursor:pointer;display:inline-block;background:#f5f4f2; margin-right:9px;*display:inline;*margin-left:9px;}
#naviSlider li.on{background:#0373a5;}
@media(max-width: 760px){
    .banner{margin-top: 60px;height: auto !important;min-height: 200px;background-size: auto 100% !important}
    .swap{height: 200px}
    #slider li{height: 200px;background-size: auto 100% !important}
    #naviSlider{width: 100%}
}

#main{ width:100%; margin:0 auto; overflow:hidden;}
.div{ width:100%; height:110px; overflow:hidden; text-align:center; font-family:"微软雅黑";}
.div span{ display:block; width:165px; height:40px; line-height:40px; padding-top:20px; margin:0 auto; font-size:24px; color:#2c353e; border-bottom:solid 1px #932c2d;}
.div samp{ display:block; line-height:25px; height:25px; color:#94875d; font-size:14px;}
.prod{ width:1200px; height:265px; overflow:hidden; margin:0 auto;}
#arrLeft{float:left;}
#arrRight{ float:right;}
.pointer{ padding-top:55px; cursor:pointer;}
#scrollbox { width:1100px; float:left; margin-left:10px;}
#scrollbox ul {overflow:hidden;}
#scrollbox ul li {FLOAT:left;width:270px;_width:270px;height:256px;_height:265px;vertical-align:top;overflow:hidden; margin-right:10px;}
#scrollbox ul li a{ display:block; width:100%; height:100%;}
#scrollbox ul li a img{ border-bottom:solid 6px #0373a5;}
#scrollbox ul li a .por{ width:100%; height:74px; background:#0373a5; overflow:hidden; margin-top:-139px; position:relative; z-index:10; display:none;}
#scrollbox ul li a .por img{ border-bottom:solid 0; float:right; padding:19px 28px 0 0;}
#scrollbox ul li a .por samp{ float:left; display:block; width:135px; height:74px; line-height:74px; text-align:center; overflow:hidden; font-family:"微软雅黑"; font-size:20px; color:#ffffff;}
#scrollbox ul li a:hover .por{ display:block;}
#scrollbox ul li span{ display:block; height:65px; line-height:65px; width:100%; text-align:center; overflow:hidden; font-family:"微软雅黑"; font-size:18px; color:#2c353e;}
.Home-prod{display: none}
@media(max-width: 760px){
    .div span{height: auto}
    #scrollbox{display: none}
    #arrRight,#arrLeft{display: none}
    .prod{width: 100%;height: auto;margin-bottom: 15px;}
    .Home-prod{display: block}
    .Home-prod li {FLOAT:left;width:calc(50% - 5px);vertical-align:top;overflow:hidden; margin-right:10px;margin-bottom: 10px;}
    .Home-prod li:nth-child(2n){float: right;margin-right: 0}
    .Home-prod li a{ display:block; width:100%; height:100%;}
    .Home-prod li a img{ border-bottom:solid 6px #0373a5;height: auto !important;max-width: 100%;max-height: 140px;}
    .Home-prod li a .por{ display: none}
    .Home-prod li span{display: block;font-size: 14px;color: #333;text-align: center;margin-top: 10px;text-overflow: ellipsis;white-space: nowrap;overflow: hidden}
}


.about{ width:100%; height:410px; background:#f5f4f2;}
.dl{ width:1200px; margin:0 auto;}
.dl dt{ width:440px; height:270px; float:left;}
.dl dd{ width:725px; height:270px; float:right;}
.dl dd p{ width:725px; height:210px; line-height:30px; overflow:hidden; text-indent:2em; font-family:"微软雅黑"; font-size:14px; color:#323232; text-align:justify;}
.dl dd a{ display:block; width:168px; height:48px; border:solid 1px #0373a5; line-height:48px; text-align:center; margin-top:10px; font-family:"微软雅黑"; font-size:16px; color:#0373a5;}
.main{ width:1200px; margin:0 auto; overflow:hidden;}
@media(max-width: 760px){
    .dl{width: 100%}
    .dl dt{width: 100%;height: auto !important}
    .dl dt img{max-width: 100%;height: auto !important}
    .dl dd{width: 100%;height: auto !important;margin-top: 20px;}
    .dl dd p{width: 100%}
    .main{width: 100%}
    .dl dd a{margin:15px auto}
}

.siper{ width:1260px; overflow:hidden;}
.siper li{ width:570px; height:85px; margin:0 60px 30px 0; float:left; overflow:hidden;}
.siper li dt{ float:left; width:85px; height:85px; text-align:center; line-height:85px; background:#0373a5; font-family:"微软雅黑"; font-size:24px; color:#ffffff;}
.siper li dd{ float:right; width:485px; height:85px; background:#f5f4f2; overflow:hidden;}
.siper li dd p{ padding:18px; line-height:25px; font-family:"微软雅黑"; font-size:14px; color:#2c353e;}
@media(max-width: 760px){
    .siper{width: 100%}
    .siper li{width: 100%}
    .siper li dd{width: calc(100% - 85px)}
    .siper li dd p{padding: 5px}
}

#footer{ width:100%; margin:0 auto; overflow:hidden; background:#2c353e;}
.copy{ text-align:center; line-height:30px; padding:18px 0; font-family:"微软雅黑";  font-size:14px; color:#ffffff;}
.copy a{ margin:0 1em; color:#ffffff;}

.path{ width:100%; height:32px; line-height:32px; background:#dbdbdb;font-family:"微软雅黑"; color:#666666; }
.path p{ width:1200px; margin:0 auto; } 
.path a{color:#666666; }
.left{ width:250px; float:left; overflow:hidden; padding:30px 0;}
.right{ width:918px; float:right; border:solid 1px #dcdcdc; overflow:hidden; margin:30px 0;}
.sidebar{ width:250px; height:73px; line-height:73px; text-align:center; background:#0373a5; font-family:"微软雅黑"; font-size:24px; color:#ffffff; overflow:hidden;}
.sidebar samp{ font-size:16px; color:#004969; margin-left:8px;}
.subnav{ width:100%; background:#e7e7e7;}
.subnav li{ width:250px; height:56px; text-align:center; line-height:56px; overflow:hidden;}
.subnav li a{ display:block; width:100%; height:100%; font-family:"微软雅黑"; font-size:14px; color:#000000;}
.subnav li a:hover{ background:url(../images/sider_03.jpg) no-repeat center; color:#94875d;}
.content{ padding:30px; line-height:2em; font-family:"微软雅黑"; font-size:14px; color:#666666;}
@media (max-width: 760px) {
    .left{width: 100%;margin: 10px auto;padding: 0}
    .sidebar{display: none}
    .subnav{width: 100%;height: auto;padding: 0;border: none;background: none}
   .subnav li{width: 33.33%;background-image: none;line-height: 34px;height: auto;padding: 5px;float: left}
   .subnav li a{display: block;border: solid 1px #0373a5;color: #0373a5;text-indent: 0;text-align: center;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}
   .subnav li a:hover{background: #0373a5;color: #fff;}
    .right{width: 100%;margin:15px auto auto;border: none;border-top: solid 1px #ddd;}
    .path span{display: none}
    .path samp{margin-right: 0;width: 100%}
    .content{width: 100%;padding:20px 0;}
    .content img{max-width: 100%;height: auto !important}
}

.lsit{ width:912px; padding:30px 0 12px 20px; overflow:hidden;}
.lsit li{ width:270px; margin-right:34px; float:left;}
.lsit li span{ display:block; width:270px; height:200px;}
.lsit li span a{ display:block; width:268px; height:198px; border:solid 1px #c4c4c4;}
.lsit li span a:hover{ border:solid 1px #0775a6;}
.lsit li samp{ display:block; width:270px; height:50px; line-height:50px; text-align:center; overflow:hidden;}
.lsit li samp a{ font-family:"微软雅黑"; font-size:14px; color:#2c353e;}
@media(max-width: 760px){
    .lsit{width: 100%;padding: 20px 0 20px}
    .lsit li{width: calc(50% - 5px);margin-right: 10px;}
    .lsit li:nth-child(2n){margin-right: 0;float: right}
    .lsit li span{width: 100%;height: 140px;}
    .lsit li span a{width: 100%;height: 140px;overflow: hidden}
    .lsit li span img{max-width: 100%;height: auto;width: 100%}
    .lsit li samp{width: 100%;text-align: center;text-overflow: ellipsis;white-space: nowrap;overflow: hidden}
}

.pikachoose { width:554px; position:relative; float:left; margin:30px 0 20px 20px;}
.pika-thumbs li{ width: 114px; height:84px; overflow: hidden;float:left; list-style-type: none;cursor: pointer; margin-bottom:6px;}
.pika-thumbs li .clip {position:relative;width: 112px; height:82px; border:solid 1px #c4c4c4;text-align: center; vertical-align: middle; overflow: hidden;}
.pika-thumbs li .clip img{width: 112px; height:82px;}

.pika-stage{ width:428px; height:316px; float:left; border:solid 1px #c3c3c3;}

.pika-stage {position: relative; text-align:center; height:316px;}
.pika-stage img{ width:428px; height:316px;}
.pika-stage .caption {position: absolute; width:428px; height:40px; font-family:"微软雅黑"; font-size:14px; color:#ffffff; bottom:0px; right:0px; line-height:40px;}
.pika-stage .caption p {padding: 0; margin: 0; line-height: 14px;}
.pika-imgnav a {position: absolute; text-indent: -5000px; display: block;z-index:3;}
.pika-imgnav a.previous {display:none; height: 100%; width: 50px; top: 10px; left: 10px;cursor:pointer;}

.pika-textnav {width:114px; height:316px;overflow: hidden; position:absolute; margin-left:440px; margin-top:-316px;}
.pika-textnav a { text-indent:-9999em;}
.pika-textnav a.previous {display:block; width:114px; height:23px; overflow:hidden; background:url(../images/ma_05.jpg) no-repeat center; cursor:pointer;}
.pika-textnav a.next {display:block; width:114px; height:23px; overflow:hidden; background:url(../images/ma_11.jpg) no-repeat center;cursor:pointer; margin-top:272px;}

.pika-tooltip{font-size:12px;position:absolute;color:white;padding:3px; border:3px solid black;}
.pika-counter{position: absolute;bottom: 45px;left:15px;color:white;font-size:11px;padding:3px;-moz-border-radius: 5px;border-radius:5px; text-indent:-999999em;}	
.pika-loader{ color:white; width:60px; font-size:11px; padding:5px 3px; text-align:right; position:absolute; top:15px; right:15px; }

#pikame{width:114px;height:264px; overflow:hidden;}
.jcarousel-skin-pika{position:absolute;top:27px;right:0px;}
.jcarousel-skin-pika .jcarousel-container-vertical { width:114px;height: 264px; overflow:hidden;}
.jcarousel-skin-pika .jcarousel-clip-vertical { width:114px; height: 264px;}

.poe{ float:right; width:320px; padding-top:25px; font-family:"微软雅黑"; font-size:14px; color:#000000; line-height:28px;}
.cont{ clear:both; overflow:hidden; padding:0 20px 20px 20px; line-height:2em; font-family:"微软雅黑"; font-size:14px; color:#666666;}
@media(max-width:760px){
    .pikachoose{width: 100%;height: auto;margin: 20px auto}
    .pika-stage{width: 100%;height: auto;overflow: hidden}
    .jcarousel-skin-pika{position: initial;top: auto;left: auto;float: left}
    .jcarousel-skin-pika .jcarousel-container-vertical{width: 100%;height: auto}
    .jcarousel-skin-pika .jcarousel-clip-vertical{width: 100%;height: auto}
    #pikame{width: 100%;height: auto !important;top: 0 !important}
    .pika-thumbs li{width: 20%;overflow: hidden;height: 56px}
    .pika-thumbs li .clip{width: 100%;height: 56px}
    .pika-thumbs li .clip img{max-width: 100%}
    .poe{width: 100%;padding:15px 0;border-top: solid 1px #ddd;border-bottom: solid 1px #ddd}
    .cont{padding:20px 0;margin-top: 15px;}
    .cont img{max-width: 100%;height: auto !important}
}