﻿.pro-cate-wrap{border-bottom:1px solid #E6E6E6}
.pro-cate-wrap .pro-cate-list{overflow-x:auto;overflow-y:hidden;text-align:center;white-space:nowrap}
@media(min-width:769px){
.pro-cate-wrap .pro-cate-list::-webkit-scrollbar{width:6px;height:6px}
.pro-cate-wrap .pro-cate-list::-webkit-scrollbar-track{border-radius:0;background:#FFF}
.pro-cate-wrap .pro-cate-list::-webkit-scrollbar-thumb{border-radius:5px;background-color:#CCCCCC75}
.pro-cate-wrap .pro-cate-list::-webkit-scrollbar-thumb:hover{background-color:var(--color)}}
.pro-cate-wrap li{display:inline-block;width:10%;background-size:cover;background-repeat:no-repeat;background-position:center;position:relative}
.pro-cate-wrap li a{width:100%;height:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;background-color:#FFFFFF;transition:background .3s;padding:20px 0}
.pro-cate-wrap li .cate-img{width:80px;height:80px;border-radius:50%;border:1px solid #E6E6E6;overflow:hidden}
.pro-cate-wrap li .cate-img img{display:block;width:100%;height:100%;-o-object-fit:cover;object-fit:cover;border-radius:50%}
.pro-cate-wrap li .cate-name{padding:5px 5px 0px 5px;font-size:var(--fontsize14);line-height:1.3;text-align:center;text-transform:capitalize;display:-webkit-box;text-overflow:ellipsis;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2;white-space:pre-wrap}
.pro-cate-wrap li:hover a{background-color:var(--color)}
.pro-cate-wrap li:hover .cate-name{color:#FFFFFF}
@media(max-width:1024px){.pro-cate-wrap li{width:120px}
.pro-cate-wrap li a{justify-content:flex-start;padding:12px 0}
.pro-cate-wrap li .cate-name{margin-top:0px;line-height:1.2;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;white-space:pre-wrap}}
.pro-list li .pro-info .title{text-align:center}