
.container{
  top: 1.05rem;
}
.article-box{
  width: 6.9rem;
  margin: 0 auto;
  background-color: #fff;
  box-shadow:0px 0px 43px 0px rgba(0, 0, 0, 0.11);
}

.main-article {
  position: relative;
  width: 100%;
  height: 4.22rem;

}

.main-article .img {
  width: 100%;
  height: 100%;
}
.main-article .info {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  padding: 0.3rem 0.2rem;
  color: #fff;
}
.main-article .title {
  font-size: 0.3rem;
  width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-bottom: .1rem;
}
.main-article .name {
  font-size: 0.22rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.main-article .time {
  font-size: 0.22rem;
}
.article-list{
  margin-bottom: .85rem;
}
.article-item{
  padding: .3rem .3rem .4rem;
  border-bottom: 1px solid #E5E5E5;
}
.article-item:last-of-type{
  border-bottom: none;
}

.article-item .img {
  width: 2.49rem;
  height: 1.57rem;
}
.article-item .info {
  width: 2.84rem;
}
.article-item .title {
  font-size: 0.3rem;
  width: 100%;
  color:#272727;
  font-size: .3rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  
}
.article-item .name {
  font-size: 0.22rem;
  background-color: #3D93FF;
  border-radius: 0.05rem;
  border: none;
  color: #fff;
  padding: 0.14rem;
}
.article-item .time {
  margin-top: .2rem;
  margin-bottom: .3rem;
  font-size: 0.22rem;
  color: #ABABAB;
}<!--0.00010800361633301-->