@charset "utf-8";
/*
表格-list
c1 序号
c-topic 标题
c3 文号
c4 日期
c5 按钮
demo：
<div class="table-list-box nseq ot">
  <ul class="table-list res-xs none clearfix">
    <li class="head">
      <div class="c1">需要</div>
      <div class="c-topic">标题</div>
      <div class="c3">文号</div>
      <div class="c4">日期</div>
      <div class="c5">按钮</div>
    </li>
  </ul>
  <ul class="table-list res-xs clearfix">
    <li>
      <div class="c-topic">
        <a target="_blank" class="elli-s" title="关于实施文化惠民工程的建议" href="" >关于实施文化惠民工程的建议</a>
      </div>
      <div class="c5"><span>2023-10-24</span></div>
    </li>
  </ul>
</div>
**/
.table-list.none{display: block;}
.table-list li{position:relative; padding-top: .625em; padding-bottom: .625em; transition: all .3s; -webkit-transition: all .3s; border-bottom: 1px dashed #ddd;}
.table-list li div{position: absolute; top: 50%; display: block; margin-top: -.8em; line-height: 1.6em; text-align: center;}
.table-list li.head{font-size: 1.125em; font-weight: bold; border-bottom-color: #ccc; border-bottom-style: solid;}
.table-list li.head div{color: #005293!important;}
.table-list li.head div .elli-s{display: inline-block;}
.table-list li .c-topic{position: relative; top: auto; margin-top: 0 !important; text-align: left;}
.table-list.none{display: block;}

.table-list-box{margin-bottom: 20px;}
.table-list-box .table-list li{padding-top: .6em; padding-bottom: .6em; padding-right: 37em; padding-left: 5em; font-size: 1em; border-bottom: none;}
.table-list-box .table-list li div{color: inherit;}
.table-list-box .table-list li.head{padding-top: .3125em; padding-bottom: .3125em; border-bottom: none; background: #EBF1FA; color: inherit;}
.table-list-box .table-list li.head div{ line-height: 2em; margin-top: -1.25em;}
.table-list-box .table-list li.head div.c5 br{display: none;}
.table-list-box .table-list li .c1{left: .5em; width: 4em;}
.table-list-box .table-list li .c3{right: 21.5em; width: 14em;}
.table-list-box .table-list li .c4{right: 12em; width: 8em;}
.table-list-box .table-list li .c5{right: .5em; width: 10em;}
.table-list-box .table-list li .c5 a{display: inline-block; width: 80px; height: 30px; margin-top: -3px; color: #fff; line-height: 30px; text-align: center; background-color: #3791ed; background-image: linear-gradient(to right,#4ca9fc,#2d85e6); border-radius: 20px; cursor: pointer; transition: all .3s;}
.table-list-box .table-list li .c5 a:hover{color: #daebff;}
.table-list-box .table-list li .c-time{color: #999999;}
/* .table-list-box .table-list li:nth-child(even){background: #f5faff;} */
.table-list-box.nseq .table-list li{padding-left: 2em;}
.table-list-box.ot .table-list li{padding-right: 8em;}
@media (max-width:1500px) {
  .table-list-box{margin-bottom: 10px;}	
}
@media (max-width:1280px) {
  .table-list-box .table-list li{padding-right: 32em; padding-left: 4em;}
  .table-list-box .table-list li .c1{left: .5em; width: 3em;}
  .table-list-box .table-list li .c3{right: 16.5em; width: 14em;}
  .table-list-box .table-list li .c4{right: 8em; width: 8em;}
  .table-list-box .table-list li .c5{right: .5em; width: 7em; line-height: 1.25em !important;}
  .table-list-box .table-list li.head div.c5 br{display: block;}
}
@media (max-width:991px){
  .table-list-box .table-list li{padding-right: 18em; padding-left: .5em;}
  .table-list-box .table-list li .c1{display: none;}	
  .table-list-box .table-list li .c3{display: none;}
}
@media (max-width:768px){
  .table-list.res-xs.none{display: none;}
  .table-list.res-xs li{padding: 1em 1.25em !important; font-size: .875em; border-bottom: none;}
  .table-list.res-xs li div{position: static; display: block; margin-top: .25em; width: auto; text-align: left;}
  .table-list.res-xs li:nth-child(even){background-color: #f8f8f8;}
  .table-list.res-xs li .c-topic{font-size: 1em; font-weight: bold; margin-top: 0; margin-bottom: .875em;}
  .table-list.res-xs li .c-topic a{white-space: normal;}

  .table-list-box .table-list li{padding-right: 0; padding-left: 0 !important; background: none !important; border-bottom: 1px dashed #ddd;}
  .table-list-box .table-list li div{margin-top: .5em;}
  .table-list-box .table-list li .c3{display: block; width: 100%;}
  .table-list-box .table-list li .c3 span{white-space: normal;}	
  .table-list-box .table-list li .c4{display: inline-block; width: auto;}
  .table-list-box .table-list li .c5{position: absolute; top: auto; right: 0; bottom: 1em; margin-top: 0; text-align: right;}
  .table-list-box .table-list li .c5 a{width: 68px; height: 26px; line-height: 26px; font-size: .875em;}
}
@media (max-width: 640px){
  .table-list.res-640.none{display: none;}
  .table-list.res-640 li{padding: 1em 1.25em !important; font-size: .875em; border-bottom: none;}
  .table-list.res-640 li div{position: static; display: block; margin-top: .25em; width: auto !important; text-align: left;}
  .table-list.res-640 li:nth-child(even){background-color: #f8f8f8;}
  .table-list.res-640 li .c-topic{font-size: 1em; font-weight: bold; margin-top: 0; margin-bottom: .875em;}
  .table-list.res-640 li .c-topic a{white-space: normal;}
}