/*--公共--*/

/*--公共--*/
.commontitle{ padding-top:50px; text-align:center; padding-left:15px; padding-right:15px;}
.commontitle h3{ font-size:24px; color:#333; line-height:30px; padding-bottom:10px;font-family:Arial, Helvetica, sans-serif; position:relative; font-weight:bold;}
.commontitle h3 i{ position:absolute; bottom:0px; height:2px; background:#c80000; width:46px; left:50%; margin-left:-23px;}
.commontitle h4{ font-size:20px;color:#333; font-weight:bold; padding-top:12px; line-height:30px; padding-bottom:4px;}
.commontitle p{ font-size:14px; color:#333;}
.commontitle p.color666{ color:#666;}


.indexProducts{ background:#f8f8f8; margin-top:80px; padding-bottom:60px;}
.indexProducts ul{ padding-top:60px; padding-left:1px;}
.indexProducts ul li{ padding:0px; border:1px solid #eeeeee; background:#fff; margin-left:-1px; min-height:320px; text-align:center; position:relative; margin-top:-1px;}
.indexProducts ul li a{ display:block; position:absolute; top:0px; left:0px; right:0px; bottom:0px; z-index:99; background:#fff; padding-top:60px;}
.indexProducts ul li a h4{transition:all .2s linear 0.2s;-moz-transition:all .2s linear 0.2s;-webkit-transition:all .2s linear 0.2s;-o-transition:all .2s linear 0.2s;-ms-transition:all .2s linear 0.2s;font-size:16px; color:#333; padding-top:45px; position:relative;}
.indexProducts ul li a h4 i{ display:block; width:30px; height:2px; background:#c6c6c6; position:absolute; left:50%; margin-left:-15px; top:20px;}
.indexProducts ul li a p{transition:all .2s linear 0.2s;-moz-transition:all .2s linear 0.2s;-webkit-transition:all .2s linear 0.2s;-o-transition:all .2s linear 0.2s;-ms-transition:all .2s linear 0.2s;font-size:12px; color:#666; padding-top:15px;}
.indexProducts ul li a img{ display:block; margin:0px auto; max-width:80%;}
.indexProducts ul li a img.show{display:block;}
.indexProducts ul li a img.hide{display:none;}
.indexProducts ul li img.more{ position:absolute; top:50%; left:50%; margin-left:-24px; margin-top:-6px;}
.indexProducts ul li span{ display:block; position:absolute; top:0px; height:0px; left:0px; right:0px;transition:all .2s linear 0.2s;-moz-transition:all .2s linear 0.2s;-webkit-transition:all .2s linear 0.2s;-o-transition:all .2s linear 0.2s;-ms-transition:all .2s linear 0.2s;}

.indexProducts ul li:hover{z-index:9;}
.indexProducts ul li:hover a{ background:none;}
.indexProducts ul li:hover a h4{ color:#fff;}
.indexProducts ul li:hover a p{color:#fff;}
.indexProducts ul li:hover span{ background:#c80000; height:100%;}

.indexProducts ul li:hover a img.show{display:none !important;}
.indexProducts ul li:hover a img.hide{display:block !important;}

.indexProducts ul li em{ position:absolute;background:#c80000;transition:all .2s linear;-moz-transition:all .2s linear;-webkit-transition:all .2s linear;-o-transition:all .2s linear;-ms-transition:all .2s linear;}
.indexProducts ul li em.top{ height:1px;width:0%; top:0px; left:0px;}
.indexProducts ul li em.left{ height:0%;width:1px; left:0px; bottom:0px;}
.indexProducts ul li em.right{ height:0%;width:1px; right:0px; top:0px;}
.indexProducts ul li em.bottom{ height:1px;width:0%; bottom:0px; right:0px;}

.indexProducts ul li:hover em.top{ height:1px;width:100%; top:0px; left:0px;}
.indexProducts ul li:hover em.left{ height:100%;width:1px; left:0px; bottom:0px;}
.indexProducts ul li:hover em.right{ height:100%;width:1px; right:0px; top:0px;}
.indexProducts ul li:hover em.bottom{ height:1px;width:100%; bottom:0px; right:0px;}

.indexProducts .col-sm-3{width: 24%;}

@media (min-width: 768px) {
	.indexProducts ul li a h4{ font-size:18px;}
	.indexProducts ul li a p{ font-size:14px;}	
}
@media (min-width: 1260px) {
  .container {
    width: 1242px;
  }
}
@media (max-width : 420px) {/* 单行，240px,320px,375px,384px,414px */
	.indexProducts .col-sm-3{width: 50%;}
}