/*产品页面列表*/
.product-list{width: 90%;margin: 50px auto 0;}
.product-list li{width: 23%;float: left;margin: 0 1% 20px;}
.product-list li figure{display: block;line-height: normal;overflow: hidden;position: relative;width: 100%;margin: 0;}
.product-list li figure img{display: block;width: 100%;height: auto;transition: 424ms linear;}
.product-list li figcaption{display: block;color: #333;font-size: 14px;line-height: normal;transition: 350ms;text-align: center; line-height:50px;}
.product-box .product-down{float: left;}
.product-list li figure mark{position: absolute;left: 0;top: 0;box-sizing: border-box;width: 100%;height: 100%;filter: alpha(opacity=20);z-index: 20;opacity: 0;transform: skewX(45deg);visibility: hidden;transition: 360ms;background-color: rgba(255,0,0,0.2);}
.product-list li figure mark b{display: block;width: 46px;height: 46px;position: absolute;left: 50%;top: 50%;margin-left: -23px;margin-top: -23px;z-index: 30;}
.product-list li figure mark b:before{content: "";width: 100%;height: 3px;background: #bb0900;position: absolute;left: 0;top: 23px;transform: translateX(-200px);-webkit-transform: translateX(-200px);-moz-transform: translateX(-200px);}
.product-list li figure mark b:after{content: "";width: 3px;height: 100%;background: #bb0900;position: absolute;left: 23px;top: 0;transform: translateY(-200px);-webkit-transform: translateY(-200px);-moz-transform: translateY(-200px);}
.product-list li figure mark:before{content: "";width: 100%;height: 0%;border-left: 3px solid #bb0900;border-right: 3px solid #bb0900;box-sizing: border-box;position: absolute;left: 0;top: 0;transition: 320ms;}
.product-list li figure mark:after{content: "";width: 0%;height: 100%;border-top: 3px solid #bb0900;border-bottom: 3px solid #bb0900;box-sizing: border-box;position: absolute;left: 0;top: 0;transition: 320ms;}
.product-list li:hover figure mark{opacity: 1;transform: skewX(0);visibility: visible;}
.product-list li:hover figure mark:before{height: 100%;transition: 330ms 200ms;}
.product-list li:hover figure mark:after{width: 100%;transition: 330ms 200ms;}
.product-list li:hover figure img{transform: scale(1.05);-webkit-transform: scale(1.05);-moz-transform: scale(1.05);}
.product-list li:hover figure mark b:before{transition: 355ms 180ms;transform: translateX(0);-webkit-transform: translateX(0);-moz-transform: translateX(0);}
.product-list li:hover figure mark b:after{transition: 355ms 240ms;transform: translateY(0);-webkit-transform: translateY(0);-moz-transform: translateY(0);}
.product-list li:hover figcaption{color: #bb0900;}