.trending{
  margin-top:20px;
  position:relative;
  z-index:10;
}
.trending-fixed{
  position:fixed;
  display:none;
  z-index:99;
  margin-top:0;
}
.trending-title{
  display:flex;
  width:100%;
  align-items:center;
}
.trending-title-left{
  font-size: 24px;
  font-weight: 900;
  color: var(--trending-font-color);
  flex:none;
}
.trending-title-right{
  height:3px;
  background:var(--trending-font-color);
  margin-left:5px;
  flex:1;
}
.trending-list{
  margin-top:14px;
}
.trending-list-unit{
  width:100%;
  display:flex;
  padding-left:14px;
  padding-right:9px;
  height:107px;
  box-shadow: 0px 2px 4px  rgba(0, 0, 0, 0.25);
  align-items:center;
  background-color:var(--bg-color);
}
.trending-list-unit-code{
  flex:none;
  font-size: 28px;
  font-weight: 900;
  color: var(--trending-font-color);
}
.trending-list-unit:first-of-type .trending-list-unit-code{
  color: rgba(209, 0, 0, 1);
}
.trending-list-unit:nth-child(2) .trending-list-unit-code{
  color: rgba(250, 92, 0, 1);
}
.trending-list-unit:nth-child(3) .trending-list-unit-code{
  color: rgba(242, 190, 0, 1);
}
.trending-list-unit .common-story-list-unit-title{
  font-weight: 500;
  flex:1;
  margin-left:13px;
  height:unset;
}
@media ( max-width:1099px ) {
  .trending-title-right{
    display:none;
  }
}
@media ( max-width:767px ){
  .trending-title-right{
    display:block;
  }
}