/*new*/
.news-bg  {position: relative; width: 100%; height:auto; display:block; margin:0; padding: 0; text-align:center;  vertical-align:middle;}
.news-box{ max-width: 960px; margin: 70px auto; }
/* ==========================================
 ##### News
========================================== */
.news { margin:2% auto;   padding: 20px 0; }
.news figure{ margin:2% auto;   padding: 20px 0; }
.news li { display: block; margin: 10px 0 0; width: 100%; font-size: 0; border: 1px solid #ebebeb; border-bottom-width: 2px; }
.news li span { display: block; }
.news li .img { display: inline-block; position: relative; margin-right: 15px; width: 80px; height: 100px; overflow: hidden; vertical-align: middle; background: #f2f2f2 url("../images/default_210x185.png") center center no-repeat; -webkit-background-size: contain; -o-background-size: contain; background-size: contain; }
.news li .img img { position: absolute; top: 50%; left: 50%; width:auto; height: 40%; transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); -moz-transform: translate(-50%, -50%); -webkit-transform: translate(-50%, -50%); }
.news li .main { display: inline-block; padding: 5px 0; width: calc(100% - 95px); font-size: 1rem; vertical-align: middle; -webkit-transition: all 0.2s ease-in-out; -moz-transition: all 0.2s ease-in-out; -o-transition: all 0.2s ease-in-out; transition: all 0.2s ease-in-out; }
.news li .top { padding-right: 10px; font-size: 0; color: #333; }
.news li .date { display: inline-block; font-size: 0.875rem; vertical-align: middle; }
.news li .b-line { display: inline-block; position: relative; width: 20px; height: 10px; vertical-align: middle; }
.news li .b-line:before { pointer-events: none; content: ""; position: absolute; top: 50%; left: 50%; margin-left: -3px; margin-top: -1px; width: 6px; height: 1px; background-color: #777; }
.news li .cate { display: inline-block;  padding: 2px; font-size: 0.875rem; color: #fff; letter-spacing: 1px; vertical-align: middle; border:solid 1px #1f328c; background:#1f328c;}
.news li .title { min-height: 53px; overflow: hidden; padding: 20px 10px 20px 0; font-size: 1.125rem; font-weight: 700; color: #000; }
.news li .title:before{ display: none;}

.news li .more { display: none; position: relative; padding: 20px 0 25px; color: #c60b4f; font-size: 0.875rem; text-align: right; text-align: center; }
.news li .more:before { pointer-events: none; content: ""; position: absolute; bottom: 0; right: 50%; width: 1px; height: 20px; background-color: #c60b4f; }
.news .bg-box {  background-image: linear-gradient(180deg, #fff 0%, #e2edf6 60%, #fff 100%);  }
.news .bg-box2 { padding: 15px 0; background-color: #fff; border: 1px solid #f4f5f9; box-shadow: 0px 5px 10px rgba(31, 50, 140,.2);  ;  }
.news .bg-box3 { padding: 5px;  }
.news .view-top { padding: 0 15px 15px; border-bottom: 1px solid #f4f5f9; }
.news .view-top .date { padding: 5px 0 0; color: #777; }
.news .left-block, .news .right-block { padding: 5px; }
.news .right-block { padding: 0 5px 5px; }
.news .left-block .title { font-size: 1.125rem; }
.news .left-block .title:before{ display: none;}
.news .btn-box { display: block; width: 80%; margin: auto; }

@media (min-width:768px) {
  .news li { margin: 10px; width: calc(33.33% - 40px); text-align: center; display:inline-block; }
  .news li .img { display: block; margin: 0; width: 100%; height: auto; }
  .news li .img img { position: static; top: auto; left: auto; width: 100%; height: auto; transform: translate(0, 0); -ms-transform: translate(0, 0); -moz-transform: translate(0, 0); -webkit-transform: translate(0, 0); }
  .news li .main { display: block; padding: 20px 20px 0; width: 100%; }
  .news li .more { display: block; }
  .news .view-top { padding: 10px 25px 25px; }
  .news .view-top .title { font-size: 2.375rem; }
  .news .btn-box { display: block; width: 100%; margin: auto; }
}
@media (min-width:1024px) {
  .news li:hover .main { background-color: #f9b706; }
  .news li:hover .top { color: #e4abc0; }
  .news li:hover .title { color: #fff; }
  .news li:hover .more { color: #fff; }
  .news li:hover .b-line:before { background-color: #e4abc0; }
  .news li:hover .more:before { background-color: #fff; }
  .news .bg-box { margin-bottom: 70px; font-size: 0; direction: rtl; }
  .news .left-block { display: inline-block; padding: 30px 30px 30px 0; width: calc(100% - 170px); font-size: 1rem; vertical-align: top; direction: ltr; }
  .news .right-block { display: inline-block; padding: 30px; width: 170px; vertical-align: top; direction: ltr; }
  .news .bg-box3 { padding: 0; }
  .news .btn-box { padding: 0; }
  .news .edit-wrap { padding: 20px; }
}
@media (min-width:1366px) {
  .news li { margin: 20px; width: calc(33.33% - 80px); }
}
@media (min-width:1600px) {
  .news li { margin: 20px 40px; width: calc(33.33% - 100px); }
}