.banner-news { height: 300px; background-position: center; background-repeat: no-repeat; background-image: url('../image/banner-news.png');}

.news-list ul { margin-bottom: 30px;}
.news-list ul li { border-bottom: solid 1px #DDDDDD; padding: 20px 0px;}
.news-list ul li:after { display: block; content: ''; clear: both;}
.news-list ul li img { width: 250px; height:150px; float: left; border: solid 1px #DDD; padding: 2px;}
.news-list ul li div { margin-left: 280px;}
.news-list ul li div .title { display: block; font-weight: 600; font-size: 24px; color: #333; padding: 5px 0px 15px 0px;}
.news-list ul li div .title:hover { color: #d63636;}
.news-list ul li div p { height: 80px;}
.news-list ul li div p a { color: #696969; line-height: 26px;}
.news-list ul li div p a:hover {color: #d63636;}
.news-list ul li div span { display: block; height: 30px; line-height: 30px; font-size: 14px; color: #696969; font-weight: 550;}

.news-page { margin: 30px auto; height: 10px;}
.news-page>div>a,.news-page>div>b{
    position: relative;
    float: left;
    padding: 6px 12px;
    margin-left: -1px;
    line-height: 1.42857143;
    color: #337ab7;
    text-decoration: none;
    background-color: #fff;
    border: 1px solid #ddd;
}


.news-body { padding: 50px 0px;}
.news-body>.content>h1 { display:block; color: #000; text-align: center; margin-bottom: 40px;}
.news-body>.content>ul { display: table; margin: auto;}
.news-body>.content>ul>li { display: table-cell; padding-right: 30px; color: #6F6F6F;}
.news-body>.content>ul>li>label { padding-right: 10px;}
.news-body>.content>.detail { min-height: 300px; border-top: solid 1px #DCDCDC; margin-top: 50px; padding: 30px 60px; text-align: left; font-size: 14px; line-height: 24px;}

@media(max-width:640px){
    .banner-news { height: 200px; background-position: center; background-repeat: no-repeat; background-image: url('../image/banner-news.png');}

    .news-list ul { margin-bottom: 30px;}
    .news-list ul li { border-bottom: solid 1px #DDDDDD; padding: 20px;}
    .news-list ul li:after { display: block; content: ''; clear: both;}
    .news-list ul li img { width: 120px; height:72px; float: left; border: solid 1px #DDD; padding: 2px;}
    .news-list ul li div { margin-left: 130px;}
    .news-list ul li div .title { display: block; font-weight: 600; font-size: 14px; color: #333; padding: 5px 0px 15px 0px;}
    .news-list ul li div .title:hover { color: #d63636;}
    .news-list ul li div p { display: none; height: 80px;}
    .news-list ul li div p a { color: #696969; line-height: 26px;}
    .news-list ul li div p a:hover {color: #d63636;}
    .news-list ul li div span { display: none; height: 30px; line-height: 30px; font-size: 12px; color: #696969; font-weight: 400;}

    .news-page { margin: 30px auto; height: 10px;}

    .news-body { padding: 20px 20px;}
    .news-body>.content>h1 { display:block; color: #000; text-align: center; margin-bottom: 10px; font-size: 18px; line-height: 24px;}
    .news-body>.content>ul { display: table; margin: auto;}
    .news-body>.content>ul>li { display: table-cell; padding-right: 10px; color: #6F6F6F; font-size: 12px;}
    .news-body>.content>ul>li>label { padding-right: 3px;}
    .news-body>.content>.detail { min-height: 300px; border-top: solid 1px #DCDCDC; margin-top: 20px; padding: 20px; text-align: left; font-size: 14px; line-height: 24px;}
    .news-body>.content>.detail img { max-width: 80%;}
}