@charset "utf-8";
/* CSS Document */
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td { margin:0; padding:0; }
h1,h2,h3,h4,h5,h6{font-weight: normal;}
BODY {FONT:14px/1.75 "Microsoft YaHei", arial,sans-serif; COLOR: #666;  background:#fff;min-width: 1200px; overflow-x: hidden;}
A {COLOR: #333; TEXT-DECORATION: none}
P{COLOR: #666;}
A:hover {TEXT-DECORATION: none}
A IMG {BORDER-BOTTOM-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-TOP-STYLE: none; BORDER-LEFT-STYLE: none}
DIV {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
UL {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
LI {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
P {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
FORM {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
EM {FONT-STYLE: normal; FONT-WEIGHT: normal}
TABLE {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
DT {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
DL {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
DD {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
FORM {PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
TR {PADDING-BOTTOM: 0px; LIST-STYLE-TYPE: none; MARGIN: 0px; PADDING-LEFT: 0px; PADDING-RIGHT: 0px; PADDING-TOP: 0px}
.cl{HEIGHT: 0px; CLEAR: both;}
.jz{margin:0 auto;}
.fl{FLOAT: left}
.fr{FLOAT: right}
.c{*zoom:1;}
.c:after{content: ""; display: block; height: 0; clear: both;}
.txt-c{text-align: center;}
.txt-r{text-align: right;}
.col-white{color: #fff;}
/* CSS Document */

/*产品展示*/
.index-title{padding: 60px 0 40px;}
.index-title strong{display: block; font-size: 28px; line-height: 28px; color: #333333; margin-bottom: 10px}
.index-title h2{display: block; font-size: 14px; line-height: 14px; color: #808080; text-transform: uppercase; height: 35px; position: relative;}
.index-title h2:after{position: absolute; content: ''; background: #023793; bottom: 0; width: 38px; height: 3px; left: 50%; margin-left: -19px}

.product{margin-bottom: 10px;}
.pro-btn ul{text-align: center; margin-bottom: 40px}
.pro-btn ul li{display: inline-block; margin: 0 px;font-size: 12px; line-height: 39px; color: #333333; background: url(../images/pro-btn.png) no-repeat center; width: 13.5%; position: relative; cursor: pointer;}
.pro-btn ul li:before,.pro-btn ul li:after{position: absolute; content: ''; background: #fff; width: 16px; height: 1px; top: 19px; opacity: 0}
.pro-btn ul li:before{left: 33px;}
.pro-btn ul li:after{right: 33px;}
.pro-btn ul li.on {background: url(../images/pro-btn-on.png) no-repeat center; color: #fff;}
.pro-btn ul li.on:before,.pro-btn ul li.on:after{}
.pro-btn ul li:hover {background: url(../images/pro-btn-on.png) no-repeat center; color: #fff;}
.pro-btn ul li:hover:before,.pro-btn ul li:hover:after{}
.product-list{overflow: hidden;}
.product-list ul{}
.product-list ul li{float: left; width:24%; margin-right:1.3%;  position: relative; margin-bottom: 20px}
.product-list ul li:nth-child(4){ float:right; margin-right:0px;}
.product-list ul li:nth-child(8){ float:right; margin-right:0px;}
.product-list ul li .pic{width: 100%; overflow: hidden; border: solid 1px #d9d9d9; margin-bottom: 2px;}
.product-list ul li .pic img{display: block; -webkit-transition: opacity 1s, -webkit-transform 1s; transition: opacity 1s, transform 1s; -webkit-backface-visibility: hidden;backface-visibility: hidden;opacity: 1;}
.product-list ul li:hover .pic img{-webkit-transform: scale3d(1.1,1.1,1);transform: scale3d(1.1,1.1,1);-webkit-transition: opacity 1s, -webkit-transform 1s;transition: opacity 1s, transform 1s;-webkit-backface-visibility: hidden;backface-visibility: hidden;}
.product-list ul li h3{display: block; ; font-size: 14px; line-height: 40px; color: #666666; text-align: center; background: #e6e6e6;}

/* Shutter Out Horizontal */
.hvr-shutter-out-horizontal {
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px rgba(0, 0, 0, 0);
  -webkit-backface-visibility: hidden;
  backface-visibility: hidden;
  -moz-osx-font-smoothing: grayscale;
  position: relative;
  -webkit-transition-property: color;
  transition-property: color;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  color: #fff;
}
.hvr-shutter-out-horizontal:before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: #0066cc;
  -webkit-transform: scaleX(0);
  transform: scaleX(0);
  -webkit-transform-origin: 50%;
  transform-origin: 50%;
  -webkit-transition-property: transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  transition-duration: 0.3s;
  -webkit-transition-timing-function: ease-out;
  transition-timing-function: ease-out;
}
.product-list ul li:hover .hvr-shutter-out-horizontal,.hvr-shutter-out-horizontal:focus,.hvr-shutter-out-horizontal:active {
  color: white;
}
.product-list ul li:hover .hvr-shutter-out-horizontal:before,.hvr-shutter-out-horizontal:focus:before,.hvr-shutter-out-horizontal:active:before {
  -webkit-transform: scaleX(1);
  transform: scaleX(1);
}