diff --git a/src/main/resources/static/assets/web/css/index.css b/src/main/resources/static/assets/web/css/index.css
index 79004d0..f09db73 100644
--- a/src/main/resources/static/assets/web/css/index.css
+++ b/src/main/resources/static/assets/web/css/index.css
@@ -1,4 +1,4 @@
-.header{width:100%;height:550px;min-width:1200px;position:relative;background:url(../images/header-bg-2.png) no-repeat center;background-size:100% 100%}
+.header{width:100%;height:550px;min-width:1200px;position:relative;background:url(../images/header-bg-2.png) no-repeat center;background-size:1920px 100%}
 .date{overflow:hidden;width:1200px;margin:0 auto;height:40px;line-height:40px;font-size:12px;color:#000}
 .date span{color:#b09158}
 .day{float:left;}
@@ -93,29 +93,45 @@
 
 
 /*-------二级页面--------*/
-.child-header{background:url(../images/child-header.jpg) no-repeat center;background-size:100% 100%}
+.child-header{background:url(../images/child-header.jpg) no-repeat center;background-size:1920px 100%}
 .child-header .date{color:#fff}
-.page-container{width:1200px;margin:20px auto;box-shadow:0 0 10px #ddd;padding:15px;box-sizing:border-box}
+.page-container{width:1200px;margin:20px auto;}
 .page-container:after{content:'';display:block;clear:both}
-.page-left{width:220px;padding-right:25px;box-sizing:border-box;float:left}
-.page-left-title{padding-bottom:10px;border-bottom:1px solid #ddd;font-size:18px;color:#585858}
+.page-left{padding: 65px 0 15px;background:url('../images/tab-bg.png') no-repeat center;background-size:100% 100%;width:220px;box-sizing:border-box;float:left}
+.page-left-title{padding-bottom:20px;padding-left:25px;font-weight:bold;border-bottom:2px solid #fff;font-size:22px;color:#fff}
 .page-left-tab{padding:0 15px;margin-top:10px}
-.page-left-tab li{line-height:30px;padding-left:20px;position:relative;font-size:18px;color:#000;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
-.page-left-tab li.active{color:#bb1511}
-.page-left-tab li:after{content:'';display:block;width:6px;height:6px;border-radius:50%;background:#000;position:absolute;top:50%;left:0;margin-top:-3px}
-.page-left-tab li.active:after{background:#bb1511}
-.page-right{float:right;width:950px;padding-left:20px;border-left:1px solid #ddd;box-sizing:border-box}
-.page-right-title{padding-bottom:10px;border-bottom:1px solid #ddd;font-size:18px;color:#bb1511}
+.page-left-tab li{line-height:30px;padding: 10px 0 10px 20px;border-bottom:1px solid #6FC2E9;position:relative;font-size:18px;color:#fff;cursor:pointer;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
+.page-left-tab li:last-child{border:none;}
+.page-left-tab li.active{color:#FFF94F}
+.page-left-tab li:after{content:'';display:block;width:6px;height:6px;border-radius:50%;background:#fff;position:absolute;top:50%;left:0;margin-top:-3px}
+.page-left-tab li.active:after{background:#FFF94F}
+.page-right{float:right;width:950px;padding-left:20px;}
+.page-right-title{margin-bottom:40px;position:relative;font-size: 28px;color: #333;text-align: center}
 .page-list>ul{min-height:500px}
-.page-list>ul>li{height:45px;line-height:45px;font-size:18px}
-.page-list>ul>li a{display:inline-block;max-width:75%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#000}
+.page-list>ul>li{overflow: hidden;padding: 20px 0;border-bottom: 1px solid #eee;font-weight: bold;margin-bottom: 20px;}
+.page-list>ul>li a{margin-bottom:10px;font-size:22px;color:#333;display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
+.page-list>ul>li p{font-weight:normal;color: #808080;font-size: 14px;line-height: 25px;}
+.page-list>ul>li span{color: #D60000;display: block;margin-top: 10px;font-weight: normal;}
 .page-list>ul>li a:hover{color:#bb1511}
-.page-list>ul>li span{float:right;color:#666}
 .pager{width:100%;margin:20px auto;text-align:center;font-size:0}
 .pager span{display:inline-block;padding:0 15px;line-height:25px;color:#676767;border:1px solid #d2d2d2;font-size:18px;margin:0 5px;vertical-align:middle;cursor:pointer}
 .pager ul{display:inline-block;overflow:hidden;vertical-align:middle}
 .pager>ul>li{width:45px;line-height:25px;float:left;margin-right:10px;border:1px solid #d2d2d2;cursor:pointer;text-align:center;font-size:18px;color:#676767}
 .pager>ul>li.active{background:#bb1511;color:#fff;border:1px solid #bb1511}
 .loading{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);background:rgba(255,255,255,.6);padding:30px;border-radius:10px;box-shadow:0 0 17px #dedede}
-.page-right-full{width:100%;border:none}
+.page-right-full{width:100%;border:none;padding-left: 0}
 .location{width:1200px;margin:20px auto 0}
+.page-right-title:before,.page-news-title:before{content: '';display: block;width:500px;height: 1px;background: #DCDCDC;position: absolute;top:50%;left:0;}
+.page-right-title:after,.page-news-title:after{content: '';display: block;width:500px;height: 1px;background: #DCDCDC;position: absolute;top:50%;right:0;}
+.news-date{width:90px;float:left;text-align: center;padding: 15px 0;border: 1px solid #e5e5e5;}
+.news-date p{font-size: 16px;color: #7C8392}
+.news-date span{font-size: 36px;color: #7C8392}
+.news-right-info{float:right;width:1080px;}
+.news-right-info a{font-size: 20px;font-weight: bold;color: #333;display: block;margin-bottom: 10px;}
+.news-right-info p{font-size: 14px;color: #808080;line-height: 25px;}
+.news-right-info a.link-btn{width: 110px;height: 34px;background: #D60000;border-radius: 2px;font-size: 14px;color: #fff;text-align: center;line-height: 34px;margin-bottom: 0;margin-top: 10px}
+.news-right-info a.link-btn:hover{color: #fff}
+.page-news-title{position:relative;font-size:28px;color: #333;font-weight:bold;width: 1200px;margin: 20px auto 40px;text-align: center;}
+
+
+
diff --git a/src/main/resources/static/assets/web/images/tab-bg.png b/src/main/resources/static/assets/web/images/tab-bg.png
new file mode 100644
index 0000000..27cd03e
Binary files /dev/null and b/src/main/resources/static/assets/web/images/tab-bg.png differ
diff --git a/src/main/resources/static/route/web/news-list-column.html b/src/main/resources/static/route/web/news-list-column.html
index 0fa69d7..d2aa1ec 100644
--- a/src/main/resources/static/route/web/news-list-column.html
+++ b/src/main/resources/static/route/web/news-list-column.html
@@ -70,11 +70,15 @@
             <span v-if="page.articleTypeId == '79da7965-1bff-4471-babe-7874474cb418'">学习园地</span>
         </div>
 
+        <div class="page-news-title" v-if="page.articleTypeId == '04988903-8948-4645-9024-6c97f770c8d7'">党纪法规</div>
+        <div class="page-news-title" v-if="page.articleTypeId == '68167be6-3dbd-49d3-a956-d07e3e4384e5'">警示教育</div>
+        <div class="page-news-title" v-if="page.articleTypeId == '79da7965-1bff-4471-babe-7874474cb418'">学习园地</div>
+
         <div class="page-container">
             <div class="page-left">
-                <div class="page-left-title" v-if="page.articleTypeId == '04988903-8948-4645-9024-6c97f770c8d7'">党纪法规</div>
-                <div class="page-left-title" v-if="page.articleTypeId == '68167be6-3dbd-49d3-a956-d07e3e4384e5'">警示教育</div>
-                <div class="page-left-title" v-if="page.articleTypeId == '79da7965-1bff-4471-babe-7874474cb418'">学习园地</div>
+                <div class="page-left-title" v-if="page.articleTypeId == '04988903-8948-4645-9024-6c97f770c8d7'">党纪法规分类</div>
+                <div class="page-left-title" v-if="page.articleTypeId == '68167be6-3dbd-49d3-a956-d07e3e4384e5'">警示教育分类</div>
+                <div class="page-left-title" v-if="page.articleTypeId == '79da7965-1bff-4471-babe-7874474cb418'">学习园地分类</div>
                 <div class="page-left-tab">
                     <ul v-cloak>
                         <li v-for="tab in tabList" :class="{active: page.articleClassifyId == tab.dataId}" @click="changeTab(tab.dataId,tab.dataName)">{{tab.dataName}}</li>
@@ -82,11 +86,11 @@
                 </div>
             </div>
             <div class="page-right" v-cloak>
-                <div class="page-right-title">{{pageTitle}}</div>
                 <div class="page-list" v-cloak>
                     <ul v-cloak>
                         <li v-for="news in newsList">
                             <a :href="'route/web/detail.html?contentId=' + news.articleContentId" :title="news.articleContentTitle">{{news.articleContentTitle}}</a>
+                            <p>{{news.articleContentSubTitle}}</p>
                             <span>{{news.articleContentPublishTime}}</span>
                         </li>
                     </ul>
diff --git a/src/main/resources/static/route/web/news-list.html b/src/main/resources/static/route/web/news-list.html
index 052994c..e97eaec 100644
--- a/src/main/resources/static/route/web/news-list.html
+++ b/src/main/resources/static/route/web/news-list.html
@@ -78,8 +78,15 @@
             <div class="page-list" v-cloak>
                 <ul v-cloak>
                     <li v-for="news in newsList">
-                        <a :href="'route/web/detail.html?contentId=' + news.articleContentId" :title="news.articleContentTitle">{{news.articleContentTitle}}</a>
-                        <span>{{news.articleContentPublishTime}}</span>
+                        <div class="news-date">
+                            <p>{{news.articleContentPublishTime}}</p>
+                            <span style="margin:0">{{news.articleContentPublishDate}}</span>
+                        </div>
+                        <div class="news-right-info">
+                            <a :href="'route/web/detail.html?contentId=' + news.articleContentId" :title="news.articleContentTitle">{{news.articleContentTitle}}</a>
+                            <p>{{news.articleContentSubTitle}}</p>
+                            <a :href="'route/web/detail.html?contentId=' + news.articleContentId" class="link-btn">查看详情</a>
+                        </div>
                     </li>
                 </ul>
                 <div class="pager" v-if="page.totalPage > 1">
@@ -154,6 +161,11 @@
                 var self = this
                 self.isLoading = true
                 top.restAjax.get(top.restAjax.path('api/articlecontent/listpage-publish', []), self.page, null, function(code, data) {
+                    for (let i = 0; i < data.rows.length; i++) {
+                        var splitResult = data.rows[i].articleContentPublishTime.split('-')
+                        data.rows[i].articleContentPublishTime = splitResult[0] + '-' + splitResult[1]
+                        data.rows[i]['articleContentPublishDate'] = splitResult[2]
+                    }
                     console.log(data)
                     self.newsList = data.rows
                     self.page.page = data.page