@media only screen and (min-width:1301px) { 
.box-shodow{box-shadow:0 1px 9px rgba(0,0,0,.1)}
.hc-product{width:100%;margin:0 auto;text-align:center;padding:20px 0 0}
.hc-product .product-list{width:1200px;margin:0 auto}
.hc-product .product-list ul>li{width:280px;margin-right:22px;background-color:#fff;display:inline-block;margin-bottom:50px;transition:.4s;padding-bottom:25px}
.hc-product .product-list ul>li img{width:280px;}
.hc-product .product-list ul>li h3{color:#666;line-height:45px;font-weight:500;font-size:17px;margin:0 20px;position:relative}
.hc-product .product-list ul>li h3::before{content:"";height:1px;width:0%;background-color:#fff;position:absolute;top:50%;left:50%;transition:.4s}
.hc-product .product-list ul>li h3 span{display:inline-block;font-size:17px;background-color:#fff;padding:0 15px;position:relative;transition:.4s}
.hc-product .product-list ul>li:hover h3 span{background-color:#00a0e9}
.hc-product .product-list ul li:hover h3::before{background-color:#58ccce;width:100%;left:0}
.hc-product .product-list ul>li .pan{margin-right:160px}
.hc-product .product-list ul>li li{width:75px;height:26px;line-height:26px;color:#fff;border-radius:3px;display:inline-block;padding-bottom:0;margin-top:0;margin-bottom:0;margin:0 5px;font-size:12px}
.product-list ul>li li.cyan{background-color:#00a0e9}
.product-list ul>li li.blue{background-color:#009cfe}
.product-list ul>li li.violet{background-color:#00a0e9}
.hc-product .product-list ul>li:hover{background:#00a0e9;box-shadow:0 2px 9px rgba(0,0,0,.21)}
.hc-product .product-list ul>li:hover li{background:#fff;color:#00a0e9}
.hc-product .product-list ul>li:hover h3{color:#fff}
.hc-product .product-list ul>li:hover .pan{background-color:#efefef;opacity:.4;width:105px}
.hc-product .product-list ul li:nth-child(4n){margin-right:0!important}
}
@media only screen and (min-width:1041px) and (max-width:1300px) {
.box-shodow{box-shadow:0 2px 9px rgba(0,0,0,.1)}
.hc-product{width:100%;margin:0 auto;text-align:center;padding:50px 0 35px}
.hc-product .product-list{width:96%;margin:0 auto}
.hc-product .product-list ul>li{width:31.333%;margin-right:2%;background-color:#fff;display:inline-block;margin-bottom:38px;transition:.4s;padding-bottom:22px}
.hc-product .product-list ul>li img{width:100%;}
.hc-product .product-list ul>li h3{color:#666;line-height:45px;font-weight:500;font-size:17px;margin:0 20px;position:relative}
.hc-product .product-list ul>li h3::before{content:"";height:1px;width:0%;background-color:#fff;position:absolute;top:50%;left:50%;transition:.4s}
.hc-product .product-list ul>li h3 span{display:inline-block;font-size:17px;background-color:#fff;padding:0 15px;position:relative;transition:.4s}
.hc-product .product-list ul>li:hover h3 span{background-color:#00a0e9}
.hc-product .product-list ul li:hover h3::before{background-color:#58ccce;width:100%;left:0}
.hc-product .product-list ul>li .pan{margin-right:160px}
.hc-product .product-list ul>li li{width:75px;height:26px;line-height:26px;color:#fff;border-radius:3px;display:inline-block;padding-bottom:0;margin-top:0;margin-bottom:0;margin:0 5px;font-size:12px}
.product-list ul>li li.cyan{background-color:#00a0e9}
.product-list ul>li li.blue{background-color:#009cfe}
.product-list ul>li li.violet{background-color:#00a0e9}
.hc-product .product-list ul>li:hover{background:#00a0e9;box-shadow:0 2px 9px rgba(0,0,0,.21)}
.hc-product .product-list ul>li:hover li{background:#fff;color:#00a0e9}
.hc-product .product-list ul>li:hover h3{color:#fff}
.hc-product .product-list ul>li:hover .pan{background-color:#efefef;opacity:.4;width:105px}
.right-0{margin-right:0!important}
}
@media only screen and (min-width:640px) and (max-width:1040px) {
.box-shodow{box-shadow:0 5px 9px rgba(0,0,0,.1)}
.hc-product{width:100%;margin:0 auto;text-align:center;padding:30px 0 35px}
.hc-product .product-list{width:96%;margin:0 auto}
.hc-product .product-list ul>li{width:46%;margin:0 2%; float: left;background-color:#fff;display:inline-block;margin-bottom:28px;transition:.4s;padding-bottom:22px}
.hc-product .product-list ul>li img{width:100%;}
.hc-product .product-list ul>li h3{color:#666;line-height:45px;font-weight:500;font-size:17px;margin:0 20px;position:relative}
.hc-product .product-list ul>li h3::before{content:"";height:1px;width:0%;background-color:#fff;position:absolute;top:50%;left:50%;transition:.4s}
.hc-product .product-list ul>li h3 span{display:inline-block;font-size:16px;background-color:#fff;padding:0 15px;position:relative;transition:.4s}
.hc-product .product-list ul>li:hover h3 span{background-color:#00a0e9}
.hc-product .product-list ul li:hover h3::before{background-color:#58ccce;width:100%;left:0}
.hc-product .product-list ul>li .pan{margin-right:160px}
.hc-product .product-list ul>li li{ height:26px;line-height:26px;color:#fff;border-radius:3px;display:inline-block; padding:0 15px; padding-bottom:0;margin-top:0;margin-bottom:0;margin:0 3px;font-size:12px; width: auto; float: none;}
.product-list ul>li li.cyan{background-color:#00a0e9}
.product-list ul>li li.blue{background-color:#009cfe}
.product-list ul>li li.violet{background-color:#00a0e9}
.hc-product .product-list ul>li:hover{background:#00a0e9;box-shadow:0 2px 9px rgba(0,0,0,.21)}
.hc-product .product-list ul>li:hover li{background:#fff;color:#00a0e9}
.hc-product .product-list ul>li:hover h3{color:#fff}
.hc-product .product-list ul>li:hover .pan{background-color:#efefef;opacity:.4;width:105px}
}
@media only screen and (min-width:375px) and (max-width:639px) {
.box-shodow{box-shadow:0 2px 9px rgba(0,0,0,.1)}
.hc-product{width:100%;margin:0 auto;text-align:center;padding:25px 0 20px}
.hc-product .product-list{width:92%;margin:0 auto}
.hc-product .product-list ul>li{width:100%;float: left;background-color:#fff;display:inline-block;margin-bottom:18px;transition:.4s;padding-bottom:18px}
.hc-product .product-list ul>li img{width:100%;}
.hc-product .product-list ul>li h3{color:#666;line-height:45px;font-weight:500;font-size:17px;margin:0 20px;position:relative;white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hc-product .product-list ul>li h3::before{content:"";height:1px;width:0%;background-color:#fff;position:absolute;top:50%;left:50%;transition:.4s}
.hc-product .product-list ul>li h3 span{display:inline-block;font-size:16px;background-color:#fff;padding:0 15px;position:relative;transition:.4s}
.hc-product .product-list ul>li:hover h3 span{background-color:#00a0e9}
.hc-product .product-list ul li:hover h3::before{background-color:#58ccce;width:100%;left:0}
.hc-product .product-list ul>li .pan{margin-right:160px}
.hc-product .product-list ul>li li{ height:26px;line-height:26px;color:#fff;border-radius:3px;display:inline-block; padding:0 15px; padding-bottom:0;margin-top:0;margin-bottom:0;margin:0 3px;font-size:12px; width: auto; float: none;}
.product-list ul>li li.cyan{background-color:#00a0e9}
.product-list ul>li li.blue{background-color:#009cfe}
.product-list ul>li li.violet{background-color:#00a0e9}
.hc-product .product-list ul>li:hover{background:#00a0e9;box-shadow:0x 2px 9px rgba(0,0,0,.21)}
.hc-product .product-list ul>li:hover li{background:#fff;color:#00a0e9}
.hc-product .product-list ul>li:hover h3{color:#fff}
.hc-product .product-list ul>li:hover .pan{background-color:#efefef;opacity:.4;width:105px}
.product-list::after{content: ""; width:100%; display:block; clear:both;}
}
@media only screen and (min-width:320px) and (max-width:374px) {
.box-shodow{box-shadow:0 2px 9px rgba(0,0,0,.1)}
.hc-product{width:100%;margin:0 auto;text-align:center;padding:25px 0 20px}
.hc-product .product-list{width:92%;margin:0 auto}
.hc-product .product-list ul>li{width:100%;float: left;background-color:#fff;display:inline-block;margin-bottom:18px;transition:.4s;padding-bottom:18px}
.hc-product .product-list ul>li img{width:100%;}
.hc-product .product-list ul>li h3{color:#666;line-height:45px;font-weight:500;font-size:17px;margin:0 20px;position:relative;white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.hc-product .product-list ul>li h3::before{content:"";height:1px;width:0%;background-color:#fff;position:absolute;top:50%;left:50%;transition:.4s}
.hc-product .product-list ul>li h3 span{display:inline-block;font-size:16px;background-color:#fff;padding:0 15px;position:relative;transition:.4s}
.hc-product .product-list ul>li:hover h3 span{background-color:#00a0e9}
.hc-product .product-list ul li:hover h3::before{background-color:#58ccce;width:100%;left:0}
.hc-product .product-list ul>li .pan{margin-right:160px}
.hc-product .product-list ul>li li{ height:26px;line-height:26px;color:#fff;border-radius:3px;display:inline-block; padding:0 15px; padding-bottom:0;margin-top:0;margin-bottom:0;margin:0 3px;font-size:12px; width: auto; float: none;}
.product-list ul>li li.cyan{background-color:#00a0e9}
.product-list ul>li li.blue{background-color:#009cfe}
.product-list ul>li li.violet{background-color:#00a0e9}
.hc-product .product-list ul>li:hover{background:#00a0e9;box-shadow:0 2px 9px rgba(0,0,0,.21)}
.hc-product .product-list ul>li:hover li{background:#fff;color:#00a0e9}
.hc-product .product-list ul>li:hover h3{color:#fff}
.hc-product .product-list ul>li:hover .pan{background-color:#efefef;opacity:.4;width:105px}
.product-list::after{content: ""; width:100%; display:block; clear:both;}
}