

#news {
	width: 100%;
    min-width: 300px;
    min-height: calc(100% - 150px);
	background: #333 url("../image/news-bg.jpg");
	background-size: cover;
}

#news .container {
	width: 1200px;
	margin: 0 auto;
	padding: 100px 20px;
}

#news .container .news-item {
	width: 1000px;
	height: 200px;
	margin: 0 auto;
	background: #FFF;
    margin-top: 40px;
}

#news .container .news-item a {
    display: block;
    padding: 20px;
    height: 160px;
    -webkit-transition: all .1s;
    -moz-transition: all .1s;
    transition: all .1s;
}

#news .container .news-item:first-child {
	margin-top: 0;
}

#news .container .news-item a:hover {
    background: rgba(255, 255, 255, .8);
    box-shadow: 3px 3px 20px rgba(0, 0, 0, .12);
}

#news .container .news-item a .img {
    width: 235px;
    height: 160px;
    background: #EEE;
    float: left;
}

#news .container .news-item a .img img {
    width: 100%;
    height: 100%;
}

#news .container .news-item a .cons {
    width: 700px;
    height: 160px;
    margin-left: 25px;
    float: left;
    position: relative;
}

#news .container .news-item a .cons .title {
    display: block;
    font-size: 16px;
    padding: 8px 0 0 0;
    color: #235DAD;
}

#news .container .news-item a .cons .time {
    display: block;
    color: #999;
    padding: 6px 0 13px 0;
    border-bottom: 1px solid #EEE;
}

#news .container .news-item a .cons .con {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    line-height: 2;
    margin-top: 10px;
    color: #CCC;
}

#news .container .news-item a .cons .more {
    display: inline-block;
    background: url("../image/more.png") no-repeat 70px center;
    width: 70px;
    height: 26px;
    line-height: 26px;
    border: 0px none;
    color: #ccc;
    position: absolute;
    right: 5px;
    bottom: 0;
}

@media only screen and (max-width: 1200px) {
    #news .container {
        width: 80%;        
    }

    #news .container .news-item {
        width: 100%;
    }

    #news .container .news-item a .cons {
        width: calc(100% - 260px);
    }
}


@media only screen and (max-width: 800px) {
    #news .container .news-item a .img {
        display: none;
    }

    #news .container .news-item a .cons {
        width: 90%;
    }    
}
