#category-wrap {width:100%; padding:30px 0;  margin:30px 0;}

.category {margin:0 auto; width:calc(100% - 20px); max-width:1240px; text-align:center; }
.category a { position:relative; border-radius:6px; background:#fff; border:1px solid #E5E5E5; font-size:18px; color:#9CA1A7; font-weight:400; display:inline-block; padding:14px 16px;   margin:2px 0;}
.category a:hover {color:#fff; background:#627492; font-weight:400;}
.category a.current {color:#fff; background:#4C4CFF; font-weight:400;}


 
.category a.num11 span{color:#FE337C;}

.category a:hover span {color:#fff;}
.category a:hover span u {color:#C7C7FF}
.category a.current span {color:#fff;}
.category a.current span u {color:#C7C7FF}



.category a span {position:absolute; bottom:-3px; left:0; right:0; margin:auto; width:40px; font-size:18px; padding:1px;  border-radius:4px; color:#627492;}
.category a span u {color:#ccc}


/*-----mobile------*/

@media screen and (max-width: 768px){
   #category-wrap {margin:20px 0 130px;}
}