.article{
  display: flex;
  flex-direction: column;
  justify-content: center;
}

#article-content{
  padding-bottom: 10px !important;
}


.article .article-item{
  margin-bottom: 20px;
  width:100%;
  height:185px;

  display: flex;
  flex-direction: row;
}

.article .article-item:hover{
  box-shadow: 10px 10px 30px 5px  rgba(180,180,181, 0.5);

  transition:box-shadow 0.5s ;
  -o-transition: box-shadow 0.5s ; /*兼容parsto内核*/
  -moz-transition: box-shadow 0.5s ; /*兼容gecko内核*/
  -webkit-transition: box-shadow 0.5s ; /*兼容webkit内核*/
}

.article .article-item .pic{
  width:350px;
  object-fit: cover;
}

.article .article-item .info{
  flex:1;
  margin-top:25px;
  margin-left: 30px;
  margin-right: 30px;

  display: flex;
  flex-direction: column;
  align-items:center;


  position: relative;
}

.article .article-item .info .a-title{
  width:100%;

  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;

  font-size: 20px;
  line-height: 30px;
}

.article .article-item .info .a-date{
  width:100%;

  font-size: 14px;
  line-height: 25px;
}

.article .article-item .info .a-desc{
  margin-top: 20px;
  width:100%;

  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.a-tool{
  width: 100%;
  bottom: 20px;
  position: absolute;
}

.article .article-item .info .a-tool .a-button{
  height: 20px;
  margin-top: 5px;
  float: left;
}

.article .article-item .info .a-tool .a-arrow{
  height: 30px;
  float: left;
  visibility: hidden;
}

.article .article-item:hover .info .a-tool .a-arrow{
  visibility: visible;
  transition:visibility 0.5s ;
  -o-transition: visibility 0.5s ; /*兼容parsto内核*/
  -moz-transition: visibility 0.5s ; /*兼容gecko内核*/
  -webkit-transition: visibility 0.5s ; /*兼容webkit内核*/
}

.article-button-more{
  color: rgba(99,103,113, 0.5);
  padding-top: 10px;
  padding-bottom: 10px;
  margin-bottom: 20px !important;
}


.article-detail-header{
  background-color: #f4f4f4;
}

.article-detail-content{
  margin-top: 40px !important;
  margin-bottom: 40px !important;
}

.article-detail-content img,.article-detail-content video{
  width:90%;
  height:auto;
  margin: 0 auto;
}

