.hot-box{
  flex:1;
  display:flex;
  flex-direction:column;
}
.hot-box-list{
  margin-left:auto;
  margin-right:auto;
  flex:1;
  margin-top:10px;
  display:flex;
  flex-direction:column;
}
.hot-box-list-unit{
  flex:1;
  display:flex;
  align-items:center;
  width:100%;
  padding-right:clamp(10px,2.1vw,21px);
}
.hot-box-list-unit-left{
  color: #737172;
  line-height: clamp(14px, 2.2vw, 22px);
  font-size: clamp(14px, 2.2vw, 22px);
  width:clamp(15px,3vw,35px);
  text-align:center;
  margin-right:5px;
  flex:none;
}
.hot-box-list-unit .story-list-unit-title{
  flex:1;
  height:unset;
}
.hot-box-list-unit:nth-child(-n+3) .hot-box-list-unit-left{
  color: #b5020e;
  font-weight: bold;
  font-style: italic;
}
.hot-box-content{
  margin-top:clamp(10px,3.1vw,31px);
  flex:1;
  display:flex;
  flex-direction:column;
  padding:clamp( 10px,1.4vw,14px ) 0 clamp(10px,2vw,20px);
  box-shadow: 0px 0px 9px 2px 
		rgba(116, 116, 116, 0.28);
	border-radius: 5px;
}
.hot-box-content-title{
  flex:none;
  margin-left:7px;
}
.hot-box-content-title-img{
  width:clamp(15px,2.9vw,29px);
}
.hot-box-content-title-text{
  color: #c20a16;
  font-size: clamp( 12px,2.4vw,24px );
  margin-left:6px;
}
@media (max-width:576px){
  .hot-box-list-unit-left {
    line-height: clamp(1px, 5.8vw, 22px);
    font-size: clamp(1px, 5.8vw, 22px);
    width: clamp(1px, 7vw, 35px);
  }
  .hot-box-content{
    width:calc(100% - clamp(1px, 1.87vw, 20px)*2);
    margin-left:auto;
    margin-right:auto;
    box-shadow: unset;
    margin-top:clamp( 1px,6vw,30px );
  }
  .hot-box-content .story-list-unit-title{
    -webkit-line-clamp: 2;
  }
  .hot-box-content-title{
    margin-left:0;
  }
  .hot-box-content-title-img{
    width:clamp(1px,4.17vw,24px);
  }
  .hot-box-content-title-text{
    font-size: clamp(1px, 4.66vw, 24px);
  }
  .hot-box-list-unit{
    padding-right:0;
    margin-top:clamp(5px,3vw,14px);
  }
  .hot-box-list{
    margin-top:0;
  }
}