﻿.news_left {
 box-sizing: border-box;
}

.news_left>div {
 position: relative;
}

.news_left h2 {
 width: 100%;
 position: absolute;
 bottom: 0;
 height: 35px;
 padding-left: 20px;
 font-size: 16px;
 line-height: 35px;
 box-sizing: border-box;
 background: url(/Content/Areas/Common/images/Article/op_bg.png)
}

.news_left h2 a {
 color: #fff;
 display: block;
 box-sizing: border-box;
 padding: 0 20px;
 white-space: nowrap;
 text-overflow: ellipsis;
 overflow: hidden;
}

.news_left a img {
 width: 100%;
 height: 455px;
}

.news_right {
 box-sizing: border-box;
 padding-left: 20px;
}

.news_right>div {
 box-sizing: border-box;
 padding-left: 30px;
 border-left: 2px dashed #ddd;
}

.news_right li {
 position: relative;
 cursor: pointer;
}

.news_right li a.detail {
 display: none;
}

.news_right li .span-date {
 font-size: 18px;
 float: left;
 margin-right: 30px;
}

.news_right li p {
 color: #666;
}

.news_right li .span-date b {
 display: block;
 font-size: 60px;
}

.news_right li .title_type {
 font-size: 20px;
 padding: 20px 0px 30px;
 display: block;
}

.news_right li::after {
 content: "";
 width: 18px;
 height: 18px;
 position: absolute;
 display: block;
 background: url(/Sites/Uploaded/UserUpLoad/20180807/20180807180326.png) no-repeat center center;
 left: -40px;
 top: 20px;
}

.news_right li:hover::after {
 background: url(/Sites/Uploaded/UserUpLoad/20180807/20180807181556.png) no-repeat center center;
}

.news_right li:hover p {
 color: #28b5a9;
}

.news_right li:hover .span-date {
 color: #28b5a9;
}

.news_right li:hover a {
 color: #28b5a9;
}

@media screen and (max-width:1366px) {
 .main {
 width: 100%;
 margin-bottom: 40px;
 }
 .news_right {
 height: 280px;
 overflow: hidden;
 }
 .news_right li .title_type {
 line-height: 30px;
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
 display: block;
 margin-bottom: 6px;
 font-size: 16px;
 padding: 0;
 }
 .news_right li .span-date b {
 font-size: 50px;
 }
 .news_left a img {
 height: 280px;
 }
}

@media screen and (max-width:768px) {
 .news_right{
 height: auto;
 }
 .col-md-6 {
 width: 100%;
 }
 .news_left {
 display: none;
 }
}

@media screen and (max-width:500px) {
 .news_right li{
 margin-bottom: 10px;
 }
 .news_right li .title_type {
 height: 50px;
 line-height: 20px;
 overflow : hidden;
 text-overflow: ellipsis;
 display: -webkit-box;
 -webkit-line-clamp: 2;
 -webkit-box-orient: vertical;
 white-space: normal;
 }
} 