.sort_box{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
}
.sort_name{
  padding:0 20px;
  min-width:150px;
  font-size:20px;
  line-height:var(--height);
  color:#333!important;
  text-align:center;
  overflow:hidden;
  text-overflow:ellipsis;
  display:block;
  white-space:nowrap;
  text-decoration: none!important;
  outline:none!important;
  transition:all 0.5s;
  background:linear-gradient(to right,#00a1fe,#00a1fe) no-repeat;
  background-size:0 100%;
}
.sort_list:last-child{
  margin-right:0;
}
.sort_name:hover{
  background-size:100% 100%;
  color:#fff!important;
}
.sort_name.sort_click{
  background:var(--color);
  color:#fff!important;
}
@media(max-width:768px){
  .sort_box{
    width:100%;
    background-color:rgba(243, 242, 242, 1);
  }
  .sort_name{
    font-size:14px;
    line-height:44px;
    padding:0 10px;
    min-width:114px;
  }
}