html{font-family: "微软雅黑";}

b{font-weight: normal;}
html,
body{-webkit-touch-callout: none;-webkit-text-size-adjust: none;-webkit-tap-highlight-color: rgba(0, 0, 0, 0);background-color: #fff;}
nav,
article,
aside,
details,
main,
header,
footer,
section,
fieldset,
figcaption,
figure{display: block;}

header,
section,
footer{position: relative;}
ol,
ul{list-style: none;}
input,
button,
textarea{border: 0;margin: 0;padding: 0;font-size: 1em;line-height: 1em;/*-webkit-appearance:none;*/background-color: rgba(0, 0, 0, 0);}
span{display: inline-block;}
a:active,
a:hover{outline: 0;}
a,
a:visited{text-decoration: none;}
.fl{float: left;}
.fr{float: right}
label,
.wordWrap{word-wrap: break-word;word-break: break-all;}
table{border-collapse: collapse;border-spacing: 0;}
td,
th{padding: 0;}
.clearfix:after{content: ' ';display: block;clear: both;visibility: hidden;line-height: 0;height: 0;}
.loading_more{display: block;height: 1.5em;width: 100%;}
.loading_more:before{display: inline-block;vertical-align: text-bottom;content: ' ';height: 16px;width: 16px;margin-right: 6px;background: url(../image/loading_more.gif) no-repeat center;-webkit-background-size: contain;background-size: contain;}
.marginTop30{margin-top: 30px;}
.marginTopFooter30{margin: 30px 0px}
.paddingTopFooter30{padding: 30px 0px}
.loading_more:after{content: '加载更多';}
.publicCon{width: 1200px;min-width: 1200px;margin: 0 auto}
/**清除**/.clearHidden{clear: both;}




/*************/




/* ============================================================
  EFFECT 5 - ICON BORDER ANIMATE
============================================================ */
#effect-5 .overlay {
  top: 0;
  bottom: 22px;
  left: 0;
  right: 0;
  opacity: 0;
  font-size: 18px;
}
#effect-5 .overlay a.expand {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  margin: auto;
  width: 100%;
  height: 100%;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
  border-radius: 0;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}
#effect-5 .img.hover .overlay {
  opacity: 1;
}
#effect-5 .img.hover .overlay a.expand {
  width: 80%;
  margin: 10px auto;
  font-size: 18px;
  height: 40px;
  font-weight: normal;
  line-height: 40px;
  border: 1px solid #fff;
/*   -webkit-border-radius: 30px;
-moz-border-radius: 30px;
-ms-border-radius: 30px;
-o-border-radius: 30px;
border-radius: 30px; */
}

/* ============================================================
  EFFECT 6 - ICON BOUNCE IN
============================================================ */
#effect-6 .overlay {
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  opacity: 0;
}
#effect-6 .overlay a.expand {
  left: 0;
  right: 0;
  top: 0;
  margin: 0 auto;
  opacity: 0;
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
}
#effect-6 .img.hover .overlay {
  opacity: 1;
}
#effect-6 .img.hover .overlay a.expand {
  top: 50%;
  margin-top: -30px;
  opacity: 1;
}

/* ------------------------------------------------------------ *\
|* ------------------------------------------------------------ *|
|* Media Queries
|* ------------------------------------------------------------ *|
\* ------------------------------------------------------------ */
@media only screen and (max-width: 1100px) {
  .effects {
    padding-left: 5px;
  }
  .effects .img {
    width: 50%;
  }
  .effects .img:nth-child(n) {
    margin-right: 5px;
  }
  .effects .img:first-child {
    margin-left: 0;
  }
  .effects .img:nth-child(2n-1) {
    margin-left: -5px;
  }
  .effects .img:nth-child(2n) {
    margin-right: 0;
  }
  .effects .img:last-child {
    margin-right: 0;
  }
}
@media only screen and (max-width: 520px) {
  .effects .img {
    width: 100%;
  }
  .effects .img:nth-child(n) {
    margin-right: 0;
  }
  .effects .img:first-child {
    margin-left: 0;
  }
  .effects .img:nth-child(2n-1) {
    margin-left: 0;
  }
  .effects .img:nth-child(2n) {
    margin-right: 0;
  }
  .effects .img:last-child {
    margin-right: 0;
  }
  .effects .img img {
    margin: 0 auto;
  }
}







.banner{text-align: center}
.banner img{width: 100%}







/*************888888/
 * 
 */
.produtList{padding:13px 0px 0px 0px; margin-left:7px;}
.produtList ul {overflow: hidden;}
.produtList ul li{display: block;float: left;width: 280px;padding-bottom: 19px;background: url(../images/listbg.png) no-repeat center bottom;margin-right:22px;position: relative;}
.produtList .prt{margin-right:0px;}
.produtList ul li img{width: 100%;}
.produtList ul li .overlaySpan{position: absolute;top: 0px;height: 93%;/*background: #000;*/left: 0px;margin-bottom: 20px;width: 280px;filter:alpha(opacity:80); /*实现IE背景透明background-color: rgba(0,0,0,.8);*/filter:alpha(opacity:80);opacity:0.8;display: none;}
.produtList ul li .overlaySpan a{display:inline-block;width: 200px;margin:20px auto;margin-left:40px;text-align: center;border: 1px solid #fff;font-size: 16px;color:#fff;line-height: 30px;}

