diff --git a/src/main/webapp/templates/1/default/_files/css/main.css b/src/main/webapp/templates/1/default/_files/css/main.css
index b91d3bb..6687ec5 100644
--- a/src/main/webapp/templates/1/default/_files/css/main.css
+++ b/src/main/webapp/templates/1/default/_files/css/main.css
@@ -285,8 +285,6 @@
 .news_container{
   width: 1400px;
   margin: 80px auto 0;
-
-
   .title{
     text-align: center;
     .tit{
@@ -807,6 +805,7 @@ font-size: 16px;
 /*新闻中心*/
 .new_container {
   background: #f6f8fa;
+  padding-bottom:20px;
 
   .banner {
     width: 100%;
@@ -931,7 +930,6 @@ font-size: 16px;
 
   .new_container_detail {
       width: 100%;
-
       .breadcrumb{
       width:1400px;
       margin:0 auto;
@@ -969,7 +967,6 @@ font-size: 16px;
         .main{
           padding: 20px 0;
           color: #666666;
-
           p{
             text-indent: 2rem;
             line-height: 2;
@@ -982,24 +979,29 @@ font-size: 16px;
         }
         .bottom{
           width: 100%;
+          margin-top:20px;
           .item{
             padding: 20px;
             box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
             margin-bottom: 20px;
             cursor: pointer;
             font-size: 14px;
+
             .previous{
               font-size: 14px;
               margin-bottom: 20px;
+              width:80px;
             }
             .title{
               font-size: 14px;
             }
             .info{
               width: 100%;
-              display: flex;
-              justify-content: space-between;
               color: #666666;
+              a{
+              color: #666666;
+              text-decoration: none;
+              }
             }
             &:hover{
               box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
@@ -1009,4 +1011,878 @@ font-size: 16px;
       }
 
     }
-}
\ No newline at end of file
+}
+
+/*政策法规*/
+.wenku_container {
+  background: #f6f8fa;
+  .banner {
+    width: 100%;
+    height: 320px;
+    background: url("../img/falv_banner.png") no-repeat top center;
+    .banner_main {
+      width: 1400px;
+      margin: 0 auto;
+      padding-top: 135px;
+      h2 {
+        font-size: 60px;
+        color: #ffffff;
+        margin: 0;
+        padding: 0;
+      }
+      p {
+        margin: 0;
+        color: #ffffff;
+      }
+    }
+  }
+  .new_container {
+    width: 100%;
+
+ .top {
+      width: 100%;
+      height: 60px;
+      background: #ffffff;
+
+      .wrap {
+        width: 1400px;
+        margin: 0 auto;
+        display: flex;
+
+
+        .list {
+          font-size: 16px;
+          line-height: 60px;
+          cursor: pointer;
+          position: relative;
+          margin-right: 40px;
+          a{
+          color:#222222;
+          text-decoration: none;
+
+          }
+
+          &.active {
+            color: #006aff;
+            &:before {
+              opacity: 1;
+            }
+          }
+
+          &:before {
+            content: "";
+            position: absolute;
+            left: 0;
+            bottom: 0;
+            border-bottom: 3px solid #006aff;
+            width: 100%;
+            opacity: 0;
+          }
+          &:hover {
+            color: #006aff;
+            &:before {
+              opacity: 1;
+            }
+          }
+        }
+      }
+    }
+  .new_main{
+      width: 1400px;
+      margin: 20px auto 0;
+     padding-bottom:20px;
+      a{
+        text-decoration: none;
+      }
+      .wrap{
+        width: 100%;
+        background: #ffffff;
+        padding: 20px;
+        border-radius: 4px;
+        margin-bottom: 20px;
+        .item{
+          display: flex;
+
+          .info{
+
+            flex:1;
+            .title{
+              font-size: 18px;
+              color: #222222;
+              a{
+              color:#222222;}
+            }
+            .text{
+              margin-top: 10px;
+              a{
+               color: #696969;
+               font-size: 14px;
+              }
+            }
+            .time{
+              color: #999999;
+              margin-top: 10px;
+              display: flex;
+              align-items: center;
+              span{
+                padding-left: 5px;
+              }
+            }
+
+            .float-left{
+              a{
+              color:#666;
+              }
+            }
+          }
+        }
+        &:hover{
+          box-shadow: 0 8px 30px rgba(45, 104, 255, 0.15)
+        }
+      }
+    }
+  }
+
+    .new_container_detail {
+        width: 100%;
+        .breadcrumb{
+        width:1400px;
+        margin:0 auto;
+        background:none;
+        padding:0;
+        margin-top:10px;
+
+        .list-inline{
+        margin:0 ! important;
+        padding:0! important;
+
+        }
+        }
+
+
+        .new_main{
+          width: 1400px;
+          margin: 10px auto 20px;
+          background: #ffffff;
+          min-height: 600px;
+          border-radius: 4px;
+          box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
+          padding: 20px 50px;
+          border-top: 3px solid #1d78ff;
+
+          .title{
+            width: 100%;
+            border-bottom: 1px solid #eeeeee;
+            padding-bottom: 20px;
+
+            .time{
+              color: #999999;
+            }
+          }
+          .main{
+            padding: 20px 0;
+            color: #666666;
+            p{
+              text-indent: 2rem;
+              line-height: 2;
+              font-size: 14px;
+            }
+            img{
+              margin: 0 auto;
+              max-width: 100%;
+            }
+          }
+          .bottom{
+            width: 100%;
+            margin-top:20px;
+            .item{
+              padding: 20px;
+              box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
+              margin-bottom: 20px;
+              cursor: pointer;
+              font-size: 14px;
+
+              .previous{
+                font-size: 14px;
+                margin-bottom: 20px;
+                width:80px;
+              }
+              .title{
+                font-size: 14px;
+              }
+              .info{
+                width: 100%;
+                color: #666666;
+                a{
+                color: #666666;
+                text-decoration: none;
+                }
+              }
+              &:hover{
+                box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
+              }
+            }
+          }
+        }
+
+      }
+
+
+}
+
+/*产品*/
+
+.case_container{
+  background: #f6f8fa;
+  .banner {
+    width: 100%;
+    height: 320px;
+    background: url("../img/case_banner.png") no-repeat top center;
+    .banner_main {
+      width: 1400px;
+      margin: 0 auto;
+      padding-top: 135px;
+      h2 {
+        font-size: 60px;
+        color: #ffffff;
+        margin: 0;
+        padding: 0;
+      }
+      p {
+        margin: 0;
+        color: #ffffff;
+      }
+    }
+  }
+  .case_main{
+    width: 100%;
+    padding-bottom: 50px;
+    .top{
+      background: #ffffff;
+      height: 60px;
+      padding-top: 20px;
+
+      .top_wrap{
+        width: 1400px;
+        margin: 0 auto;
+        display: flex;
+        align-items: center;
+        .title{
+          margin-right: 20px;
+          .line{
+            color: #999999;
+            margin-left: 20px;
+          }
+        }
+        .num{
+          display: flex;
+          .item{
+            color: #666666;
+            margin-right: 20px;
+            a{
+            color:#222222;
+            text-decoration: none;
+            padding: 6px 30px;
+            border-radius: 50px;
+            cursor: pointer;
+
+            &.active{
+             background: #2e57e9;
+             color: #ffffff;
+             }
+              &:hover{
+              background: #2e57e9;
+              color: #ffffff;
+              }
+
+            }
+
+          }
+        }
+
+      }
+
+    }
+
+    .case_main_wrap{
+      width: 1400px;
+      margin: 30px auto;
+      position: relative;
+      display: flex;
+      flex-wrap: wrap;
+      a{
+        text-decoration: none;
+      }
+
+      .item{
+        width: 440px;
+        background: #ffffff;
+        border-radius: 16px;
+        margin: 10px;
+        box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
+        transition: all 0.4s ease;
+        cursor: pointer;
+        &:hover{
+          transform: translateY(-8px);
+          box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
+        }
+        .img{
+          width: 100%;
+          height: 250px;
+
+          img{
+          width: 100%;
+                    height: 250px;
+                    border-radius: 20px 20px 0 0;
+          }
+        }
+        .info{
+          background: #ffffff;
+          padding: 20px;
+          border-radius: 20px;
+          margin-top: -40px;
+          position:relative;
+          z-index:9999;
+
+          .title{
+            font-size: 18px;
+            text-align: left;
+            margin-bottom: 20px;
+            color: #222222;
+
+          }
+          .text{
+            font-size: 14px;
+            color: #575d63;
+          }
+          .details{
+            color: #1d78ff;
+            text-align: right;
+            font-size: 14px;
+            margin-top: 20px;
+          }
+        }
+      }
+    }
+
+.page{
+width:1400px;
+margin:0 auto;
+}
+  }
+}
+
+
+
+
+
+
+.case_container_detail{
+  background: #f6f8fa;
+  .banner {
+    width: 100%;
+    height: 320px;
+    background: url("../img/case_banner.png") no-repeat top center;
+    .banner_main {
+      width: 1400px;
+      margin: 0 auto;
+      padding-top: 135px;
+      h2 {
+        font-size: 60px;
+        color: #ffffff;
+        margin: 0;
+        padding: 0;
+      }
+      p {
+        margin: 0;
+        color: #ffffff;
+      }
+    }
+  }
+
+  .breadcrumb{
+  width:1400px;
+  margin:0 auto;
+  background:none;
+  padding:0;
+  }
+  .case_main{
+    width: 100%;
+    padding-bottom: 50px;
+    .top{
+      background: #ffffff;
+      height: 60px;
+      padding-top: 20px;
+
+      .top_wrap{
+        width: 1400px;
+        margin: 0 auto;
+        display: flex;
+        align-items: center;
+        .title{
+          margin-right: 20px;
+          .line{
+            color: #999999;
+            margin-left: 20px;
+          }
+        }
+        .num{
+          display: flex;
+          .item{
+            color: #666666;
+            padding: 6px 30px;
+            border-radius: 50px;
+            cursor: pointer;
+            margin-right: 20px;
+            &.active{
+              background: #2e57e9;
+              color: #ffffff;
+            }
+            &:hover{
+              background: #2e57e9;
+              color: #ffffff;
+            }
+          }
+        }
+      }
+    }
+      .new_main{
+        width: 1400px;
+        margin: 0px auto 20px;
+        background: #ffffff;
+        min-height: 600px;
+        border-radius: 4px;
+        box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
+        padding: 20px 50px;
+        border-top: 3px solid #1d78ff;
+
+        .title{
+          width: 100%;
+          border-bottom: 1px solid #eeeeee;
+          padding-bottom: 20px;
+          text-align: center;
+
+
+        }
+        .main{
+          padding: 20px 0;
+          color: #666666;
+
+          p{
+            text-indent: 2rem;
+            line-height: 2;
+            font-size: 16px;
+          }
+          img{
+            margin: 0 auto;
+            max-width: 100%;
+          }
+        }
+
+      }
+    }
+
+
+
+}
+
+
+/*网上公开*/
+.public_container {
+  background: #f6f8fa;
+
+  .banner {
+    width: 100%;
+    height: 320px;
+    background: url("../img/ziyuan_banner.png") no-repeat top center;
+    .banner_main {
+      width: 1400px;
+      margin: 0 auto;
+      padding-top: 135px;
+      h2 {
+        font-size: 60px;
+        color: #ffffff;
+        margin: 0;
+        padding: 0;
+      }
+      p {
+        margin: 0;
+        color: #ffffff;
+      }
+    }
+  }
+  .new_container {
+    width: 1400px;
+    margin: 20px auto 0;
+    display: flex;
+    .left{
+      width: 250px;
+      box-sizing: border-box;
+      background: #ffffff;
+      border-radius: 4px;
+      .top{
+        width: 100%;
+        background: #3f79ff;
+        text-align: center;
+        color: #ffffff;
+        line-height: 40px;
+        border-radius: 4px 4px 0 0;
+        font-weight: bold;
+      }
+      .main{
+        padding: 10px;
+        .list{
+          margin-bottom: 5px;
+          border-radius: 4px;
+          border-left: 4px solid #ffffff;
+          a{
+                    cursor: pointer;
+                    color: #222222;
+                    display:block;
+                    text-decoration: none;
+                    border-radius:4px;
+                    padding:10px;
+                    font-size: 14px;
+          }
+          &:hover{
+            background: #e4ecff;
+            color: #3f79ff;
+            border-left: 4px solid #3f79ff;
+          }
+
+        }
+         .active{
+                          background: #e4ecff;
+                          border-left: 4px solid #3f79ff;
+                          color: #3f79ff;
+                          }
+
+
+        &:last-child{
+          border-bottom: none;
+        }
+      }
+    }
+    .right_main{
+      flex: 1;
+      margin-left: 20px;
+      background: #ffffff;
+      padding: 10px;
+      font-size: 14px;
+
+
+
+      a{
+        color: #222222;
+        text-decoration: none;
+      }
+      .wrap{
+        width: 100%;
+        border-bottom: 1px dashed #eeeeee;
+        padding: 20px 10px;
+        box-sizing: border-box;
+        display: flex;
+        justify-content: space-between;
+        cursor: pointer;
+        .time{
+          color: #999999;
+        }
+
+      }
+      .wrap_list{
+      margin-bottom:20px;}
+    }
+    .right_main1{
+     flex: 1;
+          margin-left: 20px;
+          background: #ffffff;
+          padding: 10px;
+          border-top: 4px solid #1d78ff;
+          border-radius: 4px 4px 0 0;
+
+          .top{
+                  text-align: center;
+                  border-bottom: 1px solid #eeeeee;
+                  padding-bottom: 10px;
+
+                  .title{
+                    font-weight: bold;
+                    font-size: 1.5em;
+                  }
+                  .time{
+                    color: #999999;
+                    font-size: 14px;
+                    margin-top: 10px;
+                  }
+                }
+
+                .new_main{
+
+                        .title{
+                          width: 100%;
+                          border-bottom: 1px solid #eeeeee;
+                          padding-bottom: 20px;
+                          font-size: 1.5em;
+                          text-align: center;
+
+                          .time{
+                            color: #999999;
+                          }
+                        }
+                        .main{
+                          padding: 20px 0;
+                          color: #666666;
+                          p{
+                            text-indent: 2rem;
+                            line-height: 2;
+                            font-size: 14px;
+                          }
+                          img{
+                            margin: 0 auto;
+                            max-width: 100%;
+                          }
+                        }
+                        .bottom{
+                          width: 100%;
+                          margin-top:20px;
+                          .item{
+                            padding: 20px;
+                            box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
+                            margin-bottom: 20px;
+                            cursor: pointer;
+                            font-size: 14px;
+
+                            .previous{
+                              font-size: 14px;
+                              margin-bottom: 20px;
+                              width:80px;
+                            }
+                            .title{
+                              font-size: 14px;
+                            }
+                            .info{
+                              width: 100%;
+                              color: #666666;
+                              a{
+                              color: #666666;
+                              text-decoration: none;
+                              }
+                            }
+                            &:hover{
+                              box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
+                            }
+                          }
+                        }
+                      }
+
+
+
+
+
+
+          }
+  }
+}
+
+
+.about_container{
+background: #f6f8fa;
+  .banner{
+    width: 100%;
+    height: 320px;
+    background: url("../img/about_banner.png") no-repeat top center;
+    .banner_main{
+      width: 1400px;
+      margin: 0 auto;
+      padding-top: 135px;
+      h2{
+        font-size: 60px;
+        color: #014ea0;
+        margin: 0;
+        padding: 0;
+      }
+      p{
+        margin: 0;
+        color: #323232;
+      }
+    }
+  }
+
+
+
+  .new_container {
+    width: 1400px;
+    margin: 20px auto 0;
+    display: flex;
+    .left{
+      width: 250px;
+      box-sizing: border-box;
+      background: #ffffff;
+      border-radius: 4px;
+      .top{
+        width: 100%;
+        background: #3f79ff;
+        text-align: center;
+        color: #ffffff;
+        line-height: 40px;
+        border-radius: 4px 4px 0 0;
+        font-weight: bold;
+      }
+      .main{
+        padding: 10px;
+        .list{
+          margin-bottom: 5px;
+          border-radius: 4px;
+          border-left: 4px solid #ffffff;
+          a{
+                    cursor: pointer;
+                    color: #222222;
+                    display:block;
+                    text-decoration: none;
+                    border-radius:4px;
+                    padding:10px;
+                    font-size: 14px;
+          }
+          &:hover{
+            background: #e4ecff;
+            color: #3f79ff;
+            border-left: 4px solid #3f79ff;
+          }
+
+        }
+         .active{
+                          background: #e4ecff;
+                          border-left: 4px solid #3f79ff;
+                          color: #3f79ff;
+                          }
+
+
+        &:last-child{
+          border-bottom: none;
+        }
+      }
+    }
+    .right_main{
+      flex: 1;
+      margin-left: 20px;
+      background: #ffffff;
+      padding: 10px;
+      font-size: 14px;
+      border-top: 4px solid #1d78ff;
+      border-radius: 4px 4px 0 0;
+
+      a{
+        color: #222222;
+        text-decoration: none;
+      }
+      .wrap{
+        width: 100%;
+        border-bottom: 1px dashed #eeeeee;
+        padding: 20px 10px;
+        box-sizing: border-box;
+        display: flex;
+        justify-content: space-between;
+        cursor: pointer;
+        .time{
+          color: #999999;
+        }
+
+      }
+      .wrap_list{
+      margin-bottom:20px;}
+    }
+    .right_main1{
+     flex: 1;
+          margin-left: 20px;
+          background: #ffffff;
+          padding: 10px;
+          border-top: 4px solid #1d78ff;
+          border-radius: 4px 4px 0 0;
+
+          .top{
+                  text-align: center;
+                  border-bottom: 1px solid #eeeeee;
+                  padding-bottom: 10px;
+
+                  .title{
+                    font-weight: bold;
+                    font-size: 1.5em;
+                  }
+                  .time{
+                    color: #999999;
+                    font-size: 14px;
+                    margin-top: 10px;
+                  }
+                }
+
+                .new_main{
+
+                        .title{
+                          width: 100%;
+                          border-bottom: 1px solid #eeeeee;
+                          padding-bottom: 20px;
+                          font-size: 1.5em;
+                          text-align: center;
+
+                          .time{
+                            color: #999999;
+                          }
+                        }
+                        .main{
+                          padding: 20px 0;
+                          color: #666666;
+                          p{
+                            text-indent: 2rem;
+                            line-height: 2;
+                            font-size: 14px;
+                          }
+                          img{
+                            margin: 0 auto;
+                            max-width: 100%;
+                          }
+                        }
+                        .bottom{
+                          width: 100%;
+                          margin-top:20px;
+                          .item{
+                            padding: 20px;
+                            box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
+                            margin-bottom: 20px;
+                            cursor: pointer;
+                            font-size: 14px;
+
+                            .previous{
+                              font-size: 14px;
+                              margin-bottom: 20px;
+                              width:80px;
+                            }
+                            .title{
+                              font-size: 14px;
+                            }
+                            .info{
+                              width: 100%;
+                              color: #666666;
+                              a{
+                              color: #666666;
+                              text-decoration: none;
+                              }
+                            }
+                            &:hover{
+                              box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
+                            }
+                          }
+                        }
+                      }
+
+          }
+  }
+
+
+}
+
+.message_container{
+width:1400px;
+ margin:0 auto;
+}
+
+
diff --git a/src/main/webapp/templates/1/default/article.html b/src/main/webapp/templates/1/default/article.html
index e585544..90663a1 100644
--- a/src/main/webapp/templates/1/default/article.html
+++ b/src/main/webapp/templates/1/default/article.html
@@ -15,92 +15,57 @@
   <link rel="stylesheet" href="${files}/vendor/photoswipe/dist/default-skin/default-skin.css">
   <script src="${files}/vendor/photoswipe/dist/photoswipe.min.js"></script>
   <script src="${files}/vendor/photoswipe/dist/photoswipe-ui-default.min.js"></script>
-  <style>
-    .article-content img{
-      max-width: 100%;
-    }
-  </style>
+
 </head>
 <body>
 [#include 'inc_header.html'/]
 [#include 'inc_message_box.html'/]
-<div class="bg-gray-200">
-  <div class="container">
-    <nav class="row" aria-label="breadcrumb">
-      <ol class="col list-inline my-2">
+<div class="new_container">
+  <div class="banner">
+    <div class="banner_main">
+      <h2>新闻中心</h2>
+      <p>安全第一 预防为主 综合治理</p>
+    </div>
+  </div>
+  <div class="new_container_detail">
+    <nav class="breadcrumb">
+      <ol class="list-inline">
         <li class="list-inline-item"><a href="${site.url}">首页</a></li>
         [#list channel.paths as c]
-          <li class="list-inline-item">/</li>
-          <li class="list-inline-item">[@A bean=c/]</li>
+        <li class="list-inline-item">/</li>
+        <li class="list-inline-item">[@A bean=c/]</li>
         [/#list]
       </ol>
     </nav>
-  </div>
-</div>
-<div class="container mt-4">
-  <div class="row">
-    <div class="col-lg-8">
-      <h3 class="cm-ff-yh">${article.title}</h3>
-      [#if article.tags?size gt 0]
-      <div class="mt-2">
-        [#list article.tags as tag]
-        <a href="${dy}/tag/${tag.id?c}" class="ml-1"><span class="badge badge-secondary">${tag.name}</span></a>
+    <div class="new_main">
+      <div class="title">
+        <h4>${article.title}</h4>
+        <div class="time">
+          ${format(article.publishDate, 'yyyy-MM-dd HH:mm')}
+          [#if article.source??]<span class="ml-2">${article.source}</span>[/#if]
+          [#if article.author??]<span class="ml-2">${article.author}</span>[/#if]
+          <i class="ml-2 far fa-eye"></i> <span id="views"></span>
+          <script>
+            axios.get('${api}/article/view/${article.id?c}').then(function (response) {
+              $('#views').text(response.data);
+            });
+          </script>
+        </div>
+      </div>
+
+      [#if article.imageList?size > 0]
+      <div class="pt-2">
+        [#list article.imageList as image]
+        <figure class="figure mt-3">
+          <img src="${image.url}" class="figure-img img-fluid gallery-img" alt="${image.description}">
+          <figcaption><span class="mr-2"><strong>${image_index+1}</strong>/${article.imageList?size}</span>${image.description}</figcaption>
+        </figure>
         [/#list]
       </div>
       [/#if]
-      <div class="mt-2 pb-2 border-bottom small text-muted">
-        <span>${format(article.publishDate, 'yyyy-MM-dd HH:mm')}</span>
-        [#if article.source??]<span class="ml-2">${article.source}</span>[/#if]
-        [#if article.author??]<span class="ml-2">${article.author}</span>[/#if]
-        <i class="ml-2 far fa-eye"></i> <span id="views"></span>
-        <script>
-          axios.get('${api}/article/view/${article.id?c}').then(function (response) {
-            $('#views').text(response.data);
-          });
-        </script>
+      <div class="main">
+        [#noescape]${article.text!}[/#noescape]
       </div>
-      [#if article.video??]
-        <div class="mt-4">
-          <video style="max-width:100%;" controls>
-            <source src="${article.video}" type="video/mp4">
-            您的浏览器不支持视频(Video)标签。
-          </video>
-        </div>
-      [/#if]
-      [#if article.audio??]
-        <div class="mt-4">
-          <audio style="width:100%;" controls>
-            <source src="${article.audio}">
-            您的浏览器不支持音频(Audio)标签
-          </audio>
-        </div>
-      [/#if]
-      [#if article.imageList?size > 0]
-        <div class="pt-2">
-          [#list article.imageList as image]
-            <figure class="figure mt-3">
-              <img src="${image.url}" class="figure-img img-fluid gallery-img" alt="${image.description}">
-              <figcaption><span class="mr-2"><strong>${image_index+1}</strong>/${article.imageList?size}</span>${image.description}</figcaption>
-            </figure>
-          [/#list]
-        </div>
-      [/#if]
-      <div class="mt-4 article-content">[#noescape]${article.text!}[/#noescape]</div>
-      [#if article.fileList?size > 0]
-        <div class="mt-4 bg-light">附件下载</div>
-        <ul class="mt-2 list-unstyled small">
-          [#list article.fileList as file]
-            <li><i class="fas fa-download text-primary"></i> <a class="article-download">${file.name}</a></li>
-          [/#list]
-        </ul>
-        <script>
-          axios.get('${api}/article/download-params/${article.id?c}').then(function (response) {
-            $('.article-download').each(function (index, element) {
-              $(element).attr('href', '${dy}/download-file/${article.id?c}/' + index + '?' + response.data)
-            });
-          })
-        </script>
-      [/#if]
       <div class="lead d-flex justify-content-center text-info">
         <div class="cm-pointer" onclick="voteUp()"><i class="far fa-thumbs-up"></i> <span id="ups"></span></div>
         <div class="cm-pointer ml-4" onclick="voteDown()"><i class="far fa-thumbs-down"></i> <span id="downs"></span></div>
@@ -136,74 +101,27 @@
         });
       </script>
 
-      <ul class="mt-4 list-unstyled">
+      <div class="bottom">
         [@ArticleNext id=article.id order=article.order channelId=article.channelId isDesc=article.channel.orderDesc; bean]
-          <li class="text-truncate mt-2">
-            <strong>上一条：</strong>[#if bean??][@A bean=bean class="cm-link"/][#else]没有了[/#if]
-          </li>
+        <div class="item">
+          <div class="previous">上一条：</div>
+          <div class="info"> [#if bean??][@A bean=bean class="cm-link"/][#else]没有了[/#if]</div>
+        </div>
         [/@ArticleNext]
         [@ArticlePrev id=article.id order=article.order channelId=article.channelId isDesc=article.channel.orderDesc; bean]
-          <li class="text-truncate mt-2">
-            <strong>下一条：</strong>[#if bean??][@A bean=bean class="cm-link"/][#else]没有了[/#if]
-          </li>
-        [/@ArticlePrev]
-      </ul>
-
-      <h5 class="mt-4 border-bottom"><span class="cm-block-head-bottom">相关新闻</span></h5>
-      [@EsArticleList q=article.title excludeId=article.id limit=5; list]
-        <ul class="list-unstyled mt-3">
-          [#list list as bean]
-            <li class="text-truncate mt-2">[@A bean=bean class="cm-link"/]</li>
-          [/#list]
-        </ul>
-      [/@EsArticleList]
-    </div>
-    [#include 'inc_right.html'/]
-  </div>
-</div>
-
-<!-- Root element of PhotoSwipe. Must have class pswp. -->
-<div class="pswp" tabindex="-1" role="dialog" aria-hidden="true">
-  <!-- Background of PhotoSwipe. It's a separate element as animating opacity is faster than rgba(). -->
-  <div class="pswp__bg"></div>
-  <!-- Slides wrapper with overflow:hidden. -->
-  <div class="pswp__scroll-wrap">
-    <!-- Container that holds slides. PhotoSwipe keeps only 3 of them in the DOM to save memory. Don't modify these 3 pswp__item elements, data is added later on. -->
-    <div class="pswp__container">
-      <div class="pswp__item"></div>
-      <div class="pswp__item"></div>
-      <div class="pswp__item"></div>
-    </div>
-    <!-- Default (PhotoSwipeUI_Default) interface on top of sliding area. Can be changed. -->
-    <div class="pswp__ui pswp__ui--hidden">
-      <div class="pswp__top-bar">
-        <!--  Controls are self-explanatory. Order can be changed. -->
-        <div class="pswp__counter"></div>
-        <button class="pswp__button pswp__button--close" title="Close (Esc)"></button>
-        <!--<button class="pswp__button pswp__button&#45;&#45;share" title="Share"></button>-->
-        <button class="pswp__button pswp__button--fs" title="Toggle fullscreen"></button>
-        <button class="pswp__button pswp__button--zoom" title="Zoom in/out"></button>
-        <!-- Preloader demo https://codepen.io/dimsemenov/pen/yyBWoR -->
-        <!-- element will get class pswp__preloader--active when preloader is running -->
-        <div class="pswp__preloader">
-          <div class="pswp__preloader__icn">
-            <div class="pswp__preloader__cut">
-              <div class="pswp__preloader__donut"></div>
-            </div>
-          </div>
+        <div class="item">
+          <div class="previous">下一条：</div>
+          <div class="info">[#if bean??][@A bean=bean class="cm-link"/][#else]没有了[/#if]</div>
         </div>
-      </div>
-      <div class="pswp__share-modal pswp__share-modal--hidden pswp__single-tap">
-        <div class="pswp__share-tooltip"></div>
-      </div>
-      <button class="pswp__button pswp__button--arrow--left" title="Previous (arrow left)"></button>
-      <button class="pswp__button pswp__button--arrow--right" title="Next (arrow right)"></button>
-      <div class="pswp__caption">
-        <div class="pswp__caption__center"></div>
+        [/@ArticlePrev]
       </div>
     </div>
+    </div>
   </div>
-</div>
+
+
+
+
 
 <script>
   var initPhotoSwipeFromDOM = function (gallerySelector) {
diff --git a/src/main/webapp/templates/1/default/article_about.html b/src/main/webapp/templates/1/default/article_about.html
new file mode 100644
index 0000000..68559db
--- /dev/null
+++ b/src/main/webapp/templates/1/default/article_about.html
@@ -0,0 +1,43 @@
+<!doctype html>
+[#escape x as (x)!?html]
+<html lang="zh-CN">
+<head>
+  <meta charset="utf-8">
+  <title>${channel.title} - ${site.title}</title>
+  <meta name="keywords" content="${channel.seoKeywords}">
+  <meta name="description" content="${channel.seoDescription}">
+  <meta name="_csrf" content="${_csrf.token}"/>
+  <meta name="_csrf_header" content="${_csrf.headerName}"/>
+  [#include 'inc_meta.html'/]
+  [#include 'inc_css.html'/]
+  [#include 'inc_js.html'/]
+</head>
+<body>
+[#include 'inc_header.html'/]
+[#include 'inc_message_box.html'/]
+<div class="bg-gray-200">
+  <div class="container">
+    <nav class="row" aria-label="breadcrumb">
+      <ol class="col list-inline my-2">
+        <li class="list-inline-item"><a href="${site.url}">首页</a></li>
+        [#list channel.paths as c]
+        <li class="list-inline-item">/</li>
+        <li class="list-inline-item">[@A bean=c/]</li>
+        [/#list]
+      </ol>
+    </nav>
+  </div>
+</div>
+<div class="container mt-4">
+  <div class="row">
+    <div class="col-lg-12">
+      <h3 class="cm-ff-yh">${channel.name}2343</h3>
+      <div class="mt-4 article-content">[#noescape]${channel.text!}[/#noescape]</div>
+    </div>
+  </div>
+</div>
+[#include 'inc_footer.html'/]
+<script>axios.get('${api}/channel/view/${channel.id?c}');</script>
+</body>
+</html>
+[/#escape]
diff --git a/src/main/webapp/templates/1/default/article_product.html b/src/main/webapp/templates/1/default/article_product.html
index 4e3598f..6a28748 100644
--- a/src/main/webapp/templates/1/default/article_product.html
+++ b/src/main/webapp/templates/1/default/article_product.html
@@ -12,70 +12,36 @@
 </head>
 <body>
 [#include 'inc_header.html'/]
-<div class="bg-gray-200">
-  <div class="container">
-    <nav class="row" aria-label="breadcrumb">
-      <ol class="col list-inline my-2">
-        <li class="list-inline-item"><a href="${site.url}">首页</a></li>
-        [#list channel.paths as c]
+
+<div class="case_container_detail">
+  <div class="banner">
+    <div class="banner_main">
+      <h2>合作案例</h2>
+      <p>安全第一 预防为主 综合治理</p>
+    </div>
+  </div>
+  <div class="case_main">
+    <div class="breadcrumb">
+      <nav class="row" aria-label="breadcrumb">
+        <ol class="col list-inline my-2">
+          <li class="list-inline-item"><a href="${site.url}">首页</a></li>
+          [#list channel.paths as c]
           <li class="list-inline-item">/</li>
           <li class="list-inline-item">[@A bean=c/]</li>
-        [/#list]
-      </ol>
-    </nav>
-  </div>
-</div>
-<div class="container mt-4">
-  <div class="row">
-    <div class="col-md-4 mt-2">
-      <img class="img-fluid" src="${article.image}">
-    </div>
-    <div class="col-md-8 mt-2">
-      <h5 class="cm-ff-yh">${article.title}</h5>
-      <div class="mt-3 pb-3 border-bottom text-muted">
-        <span>${format(article.publishDate, 'yyyy-MM-dd HH:mm')}</span>
-        <i class="ml-2 far fa-eye"></i> <span id="views"></span>
-        <script>
-          axios.get('${api}/article/view/${article.id?c}').then(function (response) {
-            $('#views').text(response.data);
-          });
-        </script>
-      </div>
-      <div class="mt-3">
-        <div class="mt-3"><span class="text-muted mr-2">优惠价</span><span class="text-danger">￥<span class="h3">${article.customs['price']}</span></span></div>
-        <div class="mt-3"><span class="text-muted mr-2">厂商指导价</span><span>￥${article.customs['guidePrice']}</span></div>
-      </div>
-    </div>
-  </div>
-
-  <div class="row">
-    <div class="col">
-      <h5 class="border-bottom mt-4"><span class="cm-block-head-bottom">商品介绍</span></h5>
-      <div class="article-content mt-3">[#noescape]${article.text!}[/#noescape]</div>
-      <h5 class="border-bottom mt-4"><span class="cm-block-head-bottom">规格参数</span></h5>
-      <div class="article-content mt-3">[#noescape]${article.customs['specifications']!}[/#noescape]</div>
-      <script>$('.article-content img').addClass('img-fluid');</script>
-      <ul class="mt-4 pt-2 list-unstyled border-top">
-        [@ArticleNext id=article.id order=article.order channelId=article.channelId isDesc=article.channel.orderDesc; bean]
-          <li class="text-truncate mt-2">
-            <strong>上一条：</strong>[#if bean??][@A bean=bean class="cm-link"/][#else]没有了[/#if]
-          </li>
-        [/@ArticleNext]
-        [@ArticlePrev id=article.id order=article.order channelId=article.channelId isDesc=article.channel.orderDesc; bean]
-          <li class="text-truncate mt-2">
-            <strong>下一条：</strong>[#if bean??][@A bean=bean class="cm-link"/][#else]没有了[/#if]
-          </li>
-        [/@ArticlePrev]
-      </ul>
-
-      <h5 class="mt-4 border-bottom"><span class="cm-block-head-bottom">相关新闻</span></h5>
-      [@EsArticleList q=article.title excludeId=article.id limit=5; list]
-        <ul class="list-unstyled mt-3">
-          [#list list as bean]
-            <li class="text-truncate mt-2">[@A bean=bean class="cm-link"/]</li>
           [/#list]
-        </ul>
-      [/@EsArticleList]
+        </ol>
+      </nav>
+    </div>
+
+    <div class="case_main_wrap">
+      <div class="new_main">
+        <div class="title">
+          <h2>${article.title}</h2>
+        </div>
+        <div class="main">
+          [#noescape]${article.text!}[/#noescape]
+        </div>
+      </div>
     </div>
   </div>
 </div>
diff --git a/src/main/webapp/templates/1/default/article_public.html b/src/main/webapp/templates/1/default/article_public.html
new file mode 100644
index 0000000..92f450d
--- /dev/null
+++ b/src/main/webapp/templates/1/default/article_public.html
@@ -0,0 +1,75 @@
+<!doctype html>
+[#escape x as (x)!?html]
+<html lang="zh-CN">
+<head>
+  <meta charset="utf-8">
+  <title>${channel.title} - ${site.title}</title>
+  <meta name="keywords" content="${channel.seoKeywords}">
+  <meta name="description" content="${channel.seoDescription}">
+  [#include 'inc_meta.html'/]
+  [#include 'inc_css.html'/]
+  [#include 'inc_js.html'/]
+</head>
+<body>
+[#include 'inc_header.html'/]
+<div class="public_container">
+  <div class="banner">
+    <div class="banner_main">
+      <h2>网上公开</h2>
+      <p>安全第一 预防为主 综合治理</p>
+    </div>
+  </div>
+  <div class="new_container">
+    <div class="left">
+      <div class="top">网上公开</div>
+      <div class="main">
+        [#assign parent = channel.parent!channel/]
+        [@ChannelList parentId=parent.id isNav='true'; list]
+        [#list list as bean]
+        <div class="list [#if channel.id == bean.id]active[#else][/#if]"><a href="${bean.url}">${bean.name}</a></div>
+        [/#list]
+        [/@ChannelList]
+      </div>
+    </div>
+    <div class="right_main1">
+      <div class="new_main">
+        <div class="title">
+         ${article.title}
+        </div>
+        <div class="main">
+          [#noescape]${article.text!}[/#noescape]
+        </div>
+
+        <div class="bottom">
+          [@ArticleNext id=article.id order=article.order channelId=article.channelId isDesc=article.channel.orderDesc; bean]
+          <div class="item">
+            <div class="previous">上一条：</div>
+            <div class="info"> [#if bean??][@A bean=bean class="cm-link"/][#else]没有了[/#if]</div>
+          </div>
+          [/@ArticleNext]
+          [@ArticlePrev id=article.id order=article.order channelId=article.channelId isDesc=article.channel.orderDesc; bean]
+          <div class="item">
+            <div class="previous">下一条：</div>
+            <div class="info">[#if bean??][@A bean=bean class="cm-link"/][#else]没有了[/#if]</div>
+          </div>
+          [/@ArticlePrev]
+        </div>
+      </div>
+
+    </div>
+
+  </div>
+
+</div>
+
+
+
+
+
+
+
+[#include 'inc_footer.html'/]
+<script>axios.get('${api}/channel/view/${channel.id?c}');</script>
+</body>
+</html>
+[/#escape]
diff --git a/src/main/webapp/templates/1/default/article_wenku.html b/src/main/webapp/templates/1/default/article_wenku.html
index cdd8430..7e0e922 100644
--- a/src/main/webapp/templates/1/default/article_wenku.html
+++ b/src/main/webapp/templates/1/default/article_wenku.html
@@ -13,7 +13,6 @@
   [#include 'inc_js.html'/]
   <link rel="stylesheet" href="${files}/vendor/pdfjs-dist/legacy/web/pdf_viewer.css">
   <style>
-
     #viewerWrapper {
       position: relative;
       width: 100%;
@@ -39,10 +38,16 @@
 <body tabindex="1">
 [#include 'inc_header.html'/]
 [#include 'inc_message_box.html'/]
-<div class="bg-gray-200">
-  <div class="container">
-    <nav class="row" aria-label="breadcrumb">
-      <ol class="col list-inline my-2">
+<div class="wenku_container">
+  <div class="banner">
+    <div class="banner_main">
+      <h2>政策法规</h2>
+      <p>安全第一 预防为主 综合治理</p>
+    </div>
+  </div>
+  <div class="new_container_detail">
+    <nav class="breadcrumb">
+      <ol class="list-inline">
         <li class="list-inline-item"><a href="${site.url}">首页</a></li>
         [#list channel.paths as c]
         <li class="list-inline-item">/</li>
@@ -50,236 +55,246 @@
         [/#list]
       </ol>
     </nav>
-  </div>
-</div>
-<div class="container mt-4">
-  <div class="row">
-    <div class="col">
-      <h3 class="cm-ff-yh">${article.title}</h3>
-      <div class="mt-3 pb-2 border-bottom text-muted">
-        <span>${format(article.publishDate, 'yyyy-MM-dd HH:mm')}</span>
-        [#if article.source??]<span class="ml-2">${article.source}</span>[/#if]
-        [#if article.author??]<span class="ml-2">${article.author}</span>[/#if]
-        <i class="ml-2 far fa-eye"></i> <span id="views"></span>
-        <script>
-          request.get('${api}/article/view/${article.id?c}').then(function (response) {
-            $('#views').text(response.data);
-          });
-        </script>
-      </div>
-      [#if article.doc??]
-      <div id="fullContainer" class="mt-3 text-center bg-secondary border">
-        <div id="toolbar" class="position-relative sticky-top p-1">
-          <button class="btn btn-outline-light" onclick="pdfViewer.decreaseScale()">-</button>
-          <button class="btn btn-outline-light ml-2" onclick="pdfViewer.increaseScale()">+</button>
-          <button id="fullscreenButton" class="btn btn-outline-light ml-2" onclick="fullscreen()">全屏</button>
-          <button id="exitFullscreenButton" class="btn btn-outline-light ml-2 cm-hidden" onclick="exitFullscreen()">退出</button>
+    <div class="new_main">
+      <div class="title">
+        <h2>${article.title}</h2>
+        <div class="time">
+          ${format(article.publishDate, 'yyyy-MM-dd HH:mm')}
+          [#if article.source??]<span class="ml-2">${article.source}</span>[/#if]
+          [#if article.author??]<span class="ml-2">${article.author}</span>[/#if]
+          <i class="ml-2 far fa-eye"></i> <span id="views"></span>
+          <script>
+            axios.get('${api}/article/view/${article.id?c}').then(function (response) {
+              $('#views').text(response.data);
+            });
+          </script>
+
+
         </div>
-        <div id="viewerWrapper" class="bg-secondary viewerWrapperNormal">
-          <div id="viewerContainer" tabindex="0">
-            <div id="viewer" class="pdfViewer"></div>
+      </div>
+
+      <div class="container mt-4">
+        <div class="row">
+          <div class="col">
+            [#if article.doc??]
+            <div id="fullContainer" class="mt-3 text-center bg-secondary border">
+              <div id="toolbar" class="position-relative sticky-top p-1">
+                <button class="btn btn-outline-light" onclick="pdfViewer.decreaseScale()">-</button>
+                <button class="btn btn-outline-light ml-2" onclick="pdfViewer.increaseScale()">+</button>
+                <button id="fullscreenButton" class="btn btn-outline-light ml-2" onclick="fullscreen()">全屏</button>
+                <button id="exitFullscreenButton" class="btn btn-outline-light ml-2 cm-hidden" onclick="exitFullscreen()">退出</button>
+              </div>
+              <div id="viewerWrapper" class="bg-secondary viewerWrapperNormal">
+                <div id="viewerContainer" tabindex="0">
+                  <div id="viewer" class="pdfViewer"></div>
+                </div>
+              </div>
+            </div>
+            <script type="module">
+              import * as pdfjsLib from '${files}/vendor/pdfjs-dist/legacy/build/pdf.mjs';
+              import * as pdfjsViewer from '${files}/vendor/pdfjs-dist/legacy/web/pdf_viewer.mjs';
+
+              if (!pdfjsLib.getDocument || !pdfjsViewer.PDFViewer) {
+                alert("Please build the pdfjs-dist library");
+              }
+
+              // The workerSrc property shall be specified.
+              pdfjsLib.GlobalWorkerOptions.workerSrc =
+                "${files}/vendor/pdfjs-dist/legacy/build/pdf.worker.mjs";
+
+              // Some PDFs need external cmaps.
+              const CMAP_URL = "${files}/vendor/pdfjs-dist/cmaps/";
+              const CMAP_PACKED = true;
+
+              const DEFAULT_URL = "${article.doc}";
+              const ENABLE_XFA = true;
+              const SEARCH_FOR = ""; // try "Mozilla";
+
+              // PDF.js 4.x: sandbox is now in /build, not /legacy/build
+              const SANDBOX_BUNDLE_SRC = "${files}/vendor/pdfjs-dist/build/pdf.sandbox.js";
+
+              const container = document.getElementById("viewerContainer");
+
+              const eventBus = new pdfjsViewer.EventBus();
+
+              // (Optionally) enable hyperlinks within PDF files.
+              const pdfLinkService = new pdfjsViewer.PDFLinkService({
+                eventBus,
+              });
+
+              // (Optionally) enable find controller.
+              const pdfFindController = new pdfjsViewer.PDFFindController({
+                eventBus,
+                linkService: pdfLinkService,
+              });
+
+              // (Optionally) enable scripting support.
+              const pdfScriptingManager = new pdfjsViewer.PDFScriptingManager({
+                eventBus,
+                sandboxBundleSrc: SANDBOX_BUNDLE_SRC,
+              });
+
+              // PDF.js 4.x: PDFViewer now requires a "renderer" option, default is "canvas"
+              const pdfViewer = new pdfjsViewer.PDFViewer({
+                container,
+                eventBus,
+                linkService: pdfLinkService,
+                findController: pdfFindController,
+                scriptingManager: pdfScriptingManager,
+                renderer: "canvas"
+              });
+              pdfLinkService.setViewer(pdfViewer);
+              pdfScriptingManager.setViewer(pdfViewer);
+
+              eventBus.on("pagesinit", function () {
+                pdfViewer.currentScaleValue = "page-width";
+                if (SEARCH_FOR) {
+                  eventBus.dispatch("find", {type: "", query: SEARCH_FOR});
+                }
+              });
+
+              // Loading document.
+              const loadingTask = pdfjsLib.getDocument({
+                url: DEFAULT_URL,
+                cMapUrl: CMAP_URL,
+                cMapPacked: CMAP_PACKED,
+                enableXfa: ENABLE_XFA,
+              });
+              (async function () {
+                const pdfDocument = await loadingTask.promise;
+                pdfViewer.setDocument(pdfDocument);
+                pdfLinkService.setDocument(pdfDocument, null);
+              })();
+
+              // Expose pdfViewer for zoom controls
+              window.pdfViewer = pdfViewer;
+
+              // Initialize fullscreen functionality
+              var fullContainer = document.getElementById('fullContainer');
+              var viewerWrapper = document.getElementById('viewerWrapper');
+
+              // 进入全屏
+              window.fullscreen = function() {
+                if (fullContainer.requestFullscreen) {
+                  fullContainer.requestFullscreen();
+                } else if (fullContainer.mozRequestFullScreen) {
+                  fullContainer.mozRequestFullScreen();
+                } else if (fullContainer.webkitRequestFullscreen) {
+                  fullContainer.webkitRequestFullscreen();
+                } else if (fullContainer.msRequestFullscreen) {
+                  fullContainer.msRequestFullscreen();
+                }
+              };
+
+              // 退出全屏
+              window.exitFullscreen = function() {
+                if (document.exitFullscreen) {
+                  document.exitFullscreen();
+                } else if (document.mozCancelFullScreen) {
+                  document.mozCancelFullScreen();
+                } else if (document.webkitExitFullscreen) {
+                  document.webkitExitFullscreen();
+                } else if (document.msExitFullscreen) {
+                  document.msExitFullscreen();
+                }
+              };
+
+              function isFullscreen() {
+                return !!(document.fullscreenElement || document.mozFullScreen || document.webkitIsFullScreen || document.msFullscreenElement);
+              }
+
+              function _fullscreenChange() {
+                if (isFullscreen()) {
+                  $('#fullscreenButton').hide();
+                  $('#exitFullscreenButton').show();
+                  $(fullContainer).addClass('overflow-auto');
+                  $(viewerWrapper).addClass('viewerWrapperFull').removeClass('viewerWrapperNormal');
+                  $('#viewerContainer').focus();
+                } else {
+                  $('#fullscreenButton').show();
+                  $('#exitFullscreenButton').hide();
+                  $(fullContainer).removeClass('overflow-auto');
+                  $(viewerWrapper).addClass('viewerWrapperNormal').removeClass('viewerWrapperFull');
+                }
+              }
+
+              function _addFullscreenChangeListeners() {
+                window.addEventListener("fullscreenchange", _fullscreenChange);
+                window.addEventListener("mozfullscreenchange", _fullscreenChange);
+                window.addEventListener("webkitfullscreenchange", _fullscreenChange);
+                window.addEventListener("MSFullscreenChange", _fullscreenChange);
+              }
+
+              _addFullscreenChangeListeners();
+            </script>
+            [/#if]
+            <div class="mt-4" id="articleText">[#noescape]${article.text!}[/#noescape]</div>
+            <div class="lead d-flex justify-content-center text-info">
+              <div class="cm-pointer" onclick="voteUp()"><i class="far fa-thumbs-up"></i> <span id="ups"></span></div>
+              <div class="cm-pointer ml-4" onclick="voteDown()"><i class="far fa-thumbs-down"></i> <span id="downs"></span></div>
+            </div>
+            <script>
+              function voteUp() {
+                fetchCsrf().then(function () {
+                  request.post('${api}/article/up/${article.id?c}').then(function (response) {
+                    if (response.data <= 0) {
+                      alert("您已经参与过一次！");
+                      return;
+                    }
+                    $('#ups').text(response.data);
+                  });
+                });
+              }
+
+              function voteDown() {
+                fetchCsrf().then(function () {
+                  request.post('${api}/article/down/${article.id?c}').then(function (response) {
+                    if (response.data <= 0) {
+                      alert("您已经参与过一次！");
+                      return;
+                    }
+                    $('#downs').text(response.data);
+                  });
+                });
+              }
+
+              request.get('${api}/article/buffer/${article.id?c}').then(function (response) {
+                $('#ups').text(response.data.ups);
+                $('#downs').text(response.data.downs);
+              });
+              $('#articleText img').addClass('img-fluid');
+            </script>
+
+
           </div>
         </div>
       </div>
-      <script type="module">
-        import * as pdfjsLib from '${files}/vendor/pdfjs-dist/legacy/build/pdf.mjs';
-        import * as pdfjsViewer from '${files}/vendor/pdfjs-dist/legacy/web/pdf_viewer.mjs';
 
-        if (!pdfjsLib.getDocument || !pdfjsViewer.PDFViewer) {
-          alert("Please build the pdfjs-dist library");
-        }
-
-        // The workerSrc property shall be specified.
-        pdfjsLib.GlobalWorkerOptions.workerSrc =
-          "${files}/vendor/pdfjs-dist/legacy/build/pdf.worker.mjs";
-
-        // Some PDFs need external cmaps.
-        const CMAP_URL = "${files}/vendor/pdfjs-dist/cmaps/";
-        const CMAP_PACKED = true;
-
-        const DEFAULT_URL = "${article.doc}";
-        const ENABLE_XFA = true;
-        const SEARCH_FOR = ""; // try "Mozilla";
-
-        // PDF.js 4.x: sandbox is now in /build, not /legacy/build
-        const SANDBOX_BUNDLE_SRC = "${files}/vendor/pdfjs-dist/build/pdf.sandbox.js";
-
-        const container = document.getElementById("viewerContainer");
-
-        const eventBus = new pdfjsViewer.EventBus();
-
-        // (Optionally) enable hyperlinks within PDF files.
-        const pdfLinkService = new pdfjsViewer.PDFLinkService({
-          eventBus,
-        });
-
-        // (Optionally) enable find controller.
-        const pdfFindController = new pdfjsViewer.PDFFindController({
-          eventBus,
-          linkService: pdfLinkService,
-        });
-
-        // (Optionally) enable scripting support.
-        const pdfScriptingManager = new pdfjsViewer.PDFScriptingManager({
-          eventBus,
-          sandboxBundleSrc: SANDBOX_BUNDLE_SRC,
-        });
-
-        // PDF.js 4.x: PDFViewer now requires a "renderer" option, default is "canvas"
-        const pdfViewer = new pdfjsViewer.PDFViewer({
-          container,
-          eventBus,
-          linkService: pdfLinkService,
-          findController: pdfFindController,
-          scriptingManager: pdfScriptingManager,
-          renderer: "canvas"
-        });
-        pdfLinkService.setViewer(pdfViewer);
-        pdfScriptingManager.setViewer(pdfViewer);
-
-        eventBus.on("pagesinit", function () {
-          pdfViewer.currentScaleValue = "page-width";
-          if (SEARCH_FOR) {
-            eventBus.dispatch("find", {type: "", query: SEARCH_FOR});
-          }
-        });
-
-        // Loading document.
-        const loadingTask = pdfjsLib.getDocument({
-          url: DEFAULT_URL,
-          cMapUrl: CMAP_URL,
-          cMapPacked: CMAP_PACKED,
-          enableXfa: ENABLE_XFA,
-        });
-        (async function () {
-          const pdfDocument = await loadingTask.promise;
-          pdfViewer.setDocument(pdfDocument);
-          pdfLinkService.setDocument(pdfDocument, null);
-        })();
-
-        // Expose pdfViewer for zoom controls
-        window.pdfViewer = pdfViewer;
-
-        // Initialize fullscreen functionality
-        var fullContainer = document.getElementById('fullContainer');
-        var viewerWrapper = document.getElementById('viewerWrapper');
-
-        // 进入全屏
-        window.fullscreen = function() {
-          if (fullContainer.requestFullscreen) {
-            fullContainer.requestFullscreen();
-          } else if (fullContainer.mozRequestFullScreen) {
-            fullContainer.mozRequestFullScreen();
-          } else if (fullContainer.webkitRequestFullscreen) {
-            fullContainer.webkitRequestFullscreen();
-          } else if (fullContainer.msRequestFullscreen) {
-            fullContainer.msRequestFullscreen();
-          }
-        };
-
-        // 退出全屏
-        window.exitFullscreen = function() {
-          if (document.exitFullscreen) {
-            document.exitFullscreen();
-          } else if (document.mozCancelFullScreen) {
-            document.mozCancelFullScreen();
-          } else if (document.webkitExitFullscreen) {
-            document.webkitExitFullscreen();
-          } else if (document.msExitFullscreen) {
-            document.msExitFullscreen();
-          }
-        };
-
-        function isFullscreen() {
-          return !!(document.fullscreenElement || document.mozFullScreen || document.webkitIsFullScreen || document.msFullscreenElement);
-        }
-
-        function _fullscreenChange() {
-          if (isFullscreen()) {
-            $('#fullscreenButton').hide();
-            $('#exitFullscreenButton').show();
-            $(fullContainer).addClass('overflow-auto');
-            $(viewerWrapper).addClass('viewerWrapperFull').removeClass('viewerWrapperNormal');
-            $('#viewerContainer').focus();
-          } else {
-            $('#fullscreenButton').show();
-            $('#exitFullscreenButton').hide();
-            $(fullContainer).removeClass('overflow-auto');
-            $(viewerWrapper).addClass('viewerWrapperNormal').removeClass('viewerWrapperFull');
-          }
-        }
-
-        function _addFullscreenChangeListeners() {
-          window.addEventListener("fullscreenchange", _fullscreenChange);
-          window.addEventListener("mozfullscreenchange", _fullscreenChange);
-          window.addEventListener("webkitfullscreenchange", _fullscreenChange);
-          window.addEventListener("MSFullscreenChange", _fullscreenChange);
-        }
-
-        _addFullscreenChangeListeners();
-      </script>
-      [/#if]
-      <div class="mt-4" id="articleText">[#noescape]${article.text!}[/#noescape]</div>
-      <div class="lead d-flex justify-content-center text-info">
-        <div class="cm-pointer" onclick="voteUp()"><i class="far fa-thumbs-up"></i> <span id="ups"></span></div>
-        <div class="cm-pointer ml-4" onclick="voteDown()"><i class="far fa-thumbs-down"></i> <span id="downs"></span></div>
-      </div>
-      <script>
-        function voteUp() {
-          fetchCsrf().then(function () {
-            request.post('${api}/article/up/${article.id?c}').then(function (response) {
-              if (response.data <= 0) {
-                alert("您已经参与过一次！");
-                return;
-              }
-              $('#ups').text(response.data);
-            });
-          });
-        }
-
-        function voteDown() {
-          fetchCsrf().then(function () {
-            request.post('${api}/article/down/${article.id?c}').then(function (response) {
-              if (response.data <= 0) {
-                alert("您已经参与过一次！");
-                return;
-              }
-              $('#downs').text(response.data);
-            });
-          });
-        }
-
-        request.get('${api}/article/buffer/${article.id?c}').then(function (response) {
-          $('#ups').text(response.data.ups);
-          $('#downs').text(response.data.downs);
-        });
-        $('#articleText img').addClass('img-fluid');
-      </script>
-
-      <ul class="mt-4 list-unstyled">
+      <div class="bottom">
         [@ArticleNext id=article.id order=article.order channelId=article.channelId isDesc=article.channel.orderDesc; bean]
-        <li class="text-truncate mt-2">
-          <strong>上一条：</strong>[#if bean??][@A bean=bean class="cm-link"/][#else]没有了[/#if]
-        </li>
+        <div class="item">
+          <div class="previous">上一条：</div>
+          <div class="info"> [#if bean??][@A bean=bean class="cm-link"/][#else]没有了[/#if]</div>
+        </div>
         [/@ArticleNext]
         [@ArticlePrev id=article.id order=article.order channelId=article.channelId isDesc=article.channel.orderDesc; bean]
-        <li class="text-truncate mt-2">
-          <strong>下一条：</strong>[#if bean??][@A bean=bean class="cm-link"/][#else]没有了[/#if]
-        </li>
+        <div class="item">
+          <div class="previous">下一条：</div>
+          <div class="info">[#if bean??][@A bean=bean class="cm-link"/][#else]没有了[/#if]</div>
+        </div>
         [/@ArticlePrev]
-      </ul>
-
-      <h5 class="mt-4 border-bottom"><span class="cm-block-head-bottom">相关新闻</span></h5>
-      [@EsArticleList q=article.title excludeId=article.id limit=5; list]
-      <ul class="list-unstyled mt-3">
-        [#list list as bean]
-        <li class="text-truncate mt-2">[@A bean=bean class="cm-link"/]</li>
-        [/#list]
-      </ul>
-      [/@EsArticleList]
+      </div>
     </div>
   </div>
 </div>
+
+
+
+
+
+
+
+
 [#include 'inc_footer.html'/]
 </body>
 </html>
diff --git a/src/main/webapp/templates/1/default/channel_about.html b/src/main/webapp/templates/1/default/channel_about.html
index 7059846..42ee461 100644
--- a/src/main/webapp/templates/1/default/channel_about.html
+++ b/src/main/webapp/templates/1/default/channel_about.html
@@ -14,27 +14,30 @@
 </head>
 <body>
 [#include 'inc_header.html'/]
-[#include 'inc_message_box.html'/]
-<div class="bg-gray-200">
-  <div class="container">
-    <nav class="row" aria-label="breadcrumb">
-      <ol class="col list-inline my-2">
-        <li class="list-inline-item"><a href="${site.url}">首页</a></li>
-        [#list channel.paths as c]
-        <li class="list-inline-item">/</li>
-        <li class="list-inline-item">[@A bean=c/]</li>
-        [/#list]
-      </ol>
-    </nav>
-  </div>
-</div>
-<div class="container mt-4">
-  <div class="row">
-    <div class="col-lg-12">
-      <h3 class="cm-ff-yh">${channel.name}</h3>
-      <div class="mt-4 article-content">[#noescape]${channel.text!}[/#noescape]</div>
+<div class="about_container">
+  <div class="banner">
+    <div class="banner_main">
+      <h2>铸诚信  安天下</h2>
+      <p>安全第一 预防为主 综合治理</p>
     </div>
   </div>
+<div class="new_container">
+  <div class="left">
+    <div class="top">关于秦安</div>
+    <div class="main">
+      [#assign parent = channel.parent!channel/]
+      [@ChannelList parentId=parent.id isNav='true'; list]
+      [#list list as bean]
+      <div class="list [#if channel.id == bean.id]active[#else][/#if]"><a href="${bean.url}">${bean.name}</a></div>
+      [/#list]
+      [/@ChannelList]
+    </div>
+  </div>
+  <div class="right_main">
+    <h3 class="cm-ff-yh">${channel.name}</h3>
+    <div>[#noescape]${channel.text!}[/#noescape]</div>
+  </div>
+</div>
 </div>
 [#include 'inc_footer.html'/]
 <script>axios.get('${api}/channel/view/${channel.id?c}');</script>
diff --git a/src/main/webapp/templates/1/default/channel_product.html b/src/main/webapp/templates/1/default/channel_product.html
index 9219b9a..573f5f9 100644
--- a/src/main/webapp/templates/1/default/channel_product.html
+++ b/src/main/webapp/templates/1/default/channel_product.html
@@ -12,60 +12,60 @@
 </head>
 <body>
 [#include 'inc_header.html'/]
-<div class="bg-gray-200">
-  <div class="container">
-    <nav class="row" aria-label="breadcrumb">
-      <ol class="col list-inline my-2">
-        [#assign parent = channel.parent!channel/]
-        <li class="list-inline-item"><a class="btn btn-sm [#if parent.id == channel.id]btn-primary[#else]btn-link[/#if]" href="${parent.url}">全部</a></li>
-        [@ChannelList parentId=parent.id; list]
-        [#list list as bean]
-        <li class="list-inline-item"><a class="btn btn-sm [#if channel.id == bean.id]btn-primary[#else]btn-link[/#if]" href="${bean.url}">${bean.name}</a></li>
-        [/#list]
-        [/@ChannelList]
-      </ol>
-    </nav>
+<div class="case_container">
+  <div class="banner">
+    <div class="banner_main">
+      <h2>合作案例</h2>
+      <p>安全第一 预防为主 综合治理</p>
+    </div>
   </div>
-</div>
-<div class="container mt-2">
-  <div class="row">
-    <div class="col">
-      [#if channel.children?size <= 0]
-      <div>
-        [#assign customsQueryMap={}/]
-        [#list channel.articleModel.fieldList?filter(field->['radio','checkbox','select','multipleSelect']?seqContains(field.type)) as field]
-        <div class="py-1 border-bottom">
-          [#assign param=field.code+'Key'/]
-          <a href="${addParam(channel.url, channel.dynamicUrl, param)}" class="btn btn-sm[#if !Params[param]??] btn-secondary[#else] btn-link text-reset[/#if]">全部${field.name}</a>
-          [@DictList typeId=field.dictTypeId; list]
-          [#list list as dict]
-          <a href="${addParam(channel.url, channel.dynamicUrl, param, dict.value)}" class="btn btn-sm [#if Params[param]! == dict.value]btn-secondary[#else]btn-link text-reset[/#if]">${dict.name}</a>
-          [/#list]
-          [/@DictList]
+  <div class="case_main">
+    <div class="top">
+      <div class="top_wrap">
+        <div class="title">行业 <span class="line">|</span> </div>
+        <div class="num">
+              [#assign parent = channel.parent!channel/]
+              <div class="item"><a class="[#if parent.id == channel.id]active[#else]btn-link[/#if]" href="${parent.url}">全部</a></div>
+              [@ChannelList parentId=parent.id; list]
+              [#list list as bean]
+              <div class="item"><a class="[#if channel.id == bean.id]active[#else]btn-link[/#if]" href="${bean.url}">${bean.name}</a></div>
+              [/#list]
+              [/@ChannelList]
         </div>
-        [#assign customsQueryMap=customsQueryMap + {'ArrayEQ_@articleExt-mainsJson$'+param+(field.dataType == 'number')?string('_Int',''): Params[param]!}/]
-        [/#list]
       </div>
-      [/#if]
+    </div>
+    <div class="case_main_wrap">
       [@ArticlePage channelId=channel.id isIncludeSubChannel='true' Q_=customsQueryMap orderBy=channel.orderDesc?string("sticky_desc,order_desc","sticky_desc,order_asc"); pagedList]
-      <div class="row mx-n1 mb-3">
-        [#list pagedList.content as bean]
-        <div class="col-lg-3 col-6 px-1 mt-3">
-          <div class="card">
-            <div class="p-3 text-center" style="height:180px;"><img src="${bean.image}" class="mw-100 mh-100" alt="${bean.title}"></div>
-            <div class="card-body p-2">
-              <div class="card-text text-truncate">[@A bean=bean class="text-reset stretched-link"]${bean.title}[/@A]</div>
-              <div class="card-text text-danger h5 mt-2"><small>￥</small>${bean.customs['price']}</div>
+      [#list pagedList.content as bean]
+        <div class="item">
+            <div class="img"><img src="${bean.image}" width="100%" height="100%"  alt="${bean.title}"></div>
+            <div class="info">
+              <div class="title">[@A bean=bean class="text-reset stretched-link"]${bean.title}[/@A]</div>
+              <div class="text">把危险化学品安全摆在防范化解重大风险的突出位置，推进新一代信息技术和危险化学品安全生产深度融合，实现数字化转型...</div>
+              <div class="details">了解详情 ></div>
             </div>
-          </div>
         </div>
         [/#list]
-      </div>
+    </div>
+    <div class="page">
       [#include 'inc_page.html'/]
       [/@ArticlePage]
     </div>
   </div>
+
 </div>
+
+
+
+
+
+
+
+
+
+
+
+
 [#include 'inc_footer.html'/]
 <script>axios.get('${api}/channel/view/${channel.id?c}');</script>
 </body>
diff --git a/src/main/webapp/templates/1/default/channel_test.html b/src/main/webapp/templates/1/default/channel_test.html
index cf547ae..efea0df 100644
--- a/src/main/webapp/templates/1/default/channel_test.html
+++ b/src/main/webapp/templates/1/default/channel_test.html
@@ -12,66 +12,50 @@
 </head>
 <body>
 [#include 'inc_header.html'/]
-<div class="bg-gray-200">
-  <div class="container">
-    <nav class="row" aria-label="breadcrumb">
-      <ol class="col list-inline my-2">
+<div class="public_container">
+  <div class="banner">
+    <div class="banner_main">
+      <h2>网上公开</h2>
+      <p>安全第一 预防为主 综合治理</p>
+    </div>
+  </div>
+  <div class="new_container">
+    <div class="left">
+      <div class="top">网上公开</div>
+      <div class="main">
         [#assign parent = channel.parent!channel/]
-        <li class="list-inline-item"><a class="btn btn-sm [#if parent.id == channel.id]btn-primary[#else]btn-link[/#if]" href="${parent.url}">全部</a></li>
         [@ChannelList parentId=parent.id isNav='true'; list]
         [#list list as bean]
-        <li class="list-inline-item"><a class="btn btn-sm [#if channel.id == bean.id]btn-primary[#else]btn-link[/#if]" href="${bean.url}">${bean.name}</a></li>
+        <div class="list [#if channel.id == bean.id]active[#else][/#if]"><a href="${bean.url}">${bean.name}</a></div>
         [/#list]
         [/@ChannelList]
-      </ol>
-    </nav>
-  </div>
-</div>
-<div class="container mt-3">
-  <div class="row">
-    <div class="col-lg-8">
-      <div>
-        [#assign customsQueryMap={}/]
-        [#list channel.articleModel.fieldList?filter(field->['radio','checkbox','select','multipleSelect']?seqContains(field.type)) as field]
-        <div class="py-1 border-bottom">
-          [#assign param=field.code+'Key'/]
-          <a href="${addParam(channel.url, channel.dynamicUrl, param)}" class="btn btn-sm[#if !Params[param]??] btn-secondary[#else] btn-link text-reset[/#if]">全部${field.name}</a>
-          [@DictList typeId=field.dictTypeId; list]
-          [#list list as dict]
-          <a href="${addParam(channel.url, channel.dynamicUrl, param, dict.value)}" class="btn btn-sm [#if Params[param]! == dict.value]btn-secondary[#else]btn-link text-reset[/#if]">${dict.name}</a>
-          [/#list]
-          [/@DictList]
-        </div>
-        [#assign customsQueryMap=customsQueryMap + {'ArrayEQ_@articleExt-mainsJson$'+param+(field.dataType != 'string')?string('_Int',''): Params[param]!}/]
-        [/#list]
       </div>
-      [@ArticlePage channelId=channel.id isIncludeSubChannel="true" Q_=customsQueryMap orderBy=channel.orderDesc?string("sticky_desc,order_desc","sticky_desc,order_asc"); pagedList]
-      <ul class="list-unstyled">
-        [#list pagedList.content as bean]
-        <li class="mt-3 media border-bottom position-relative pb-3">
-          [#if bean.image??][@A bean=bean class="mr-3"]<img src="${bean.image}" class="rounded-sm cm-media-img" alt="${bean.title}">[/@A][/#if]
-          <div class="media-body">
-            <p class="mt-0 mb-1">[@A bean=bean class="cm-link text-decoration-none"/]</p>
-            <p class="text-muted d-none d-sm-block mb-2">
-              [@A bean=bean class="text-reset small text-decoration-none"]${substring(bean.description,60,'...')}[/@A]
-            </p>
-            <div class="small text-muted mt-3 clearfix">
-              <div class="float-left">
-                <span>[#list bean.channel.paths as c][@A bean=c/][#if c_has_next] > [/#if][/#list]</span>
-                <i class="ml-2 far fa-eye"></i> ${bean.views}
+    </div>
+    <div class="right_main">
+          <div class="wrap_list" >
+            [@ArticlePage channelId=channel.id isIncludeSubChannel="true" Q_=customsQueryMap orderBy=channel.orderDesc?string("sticky_desc,order_desc","sticky_desc,order_asc"); pagedList]
+              [#list pagedList.content as bean]
+              <div class="wrap">
+                <div class="title">[@A bean=bean class="cm-link text-decoration-none"/]</div>
+                <div class="time">${format(bean.publishDate, 'yyyy-MM-dd')}</div>
               </div>
-              <div class="float-right"><i class="ml-2 far fa-clock"></i> ${format(bean.publishDate, 'yyyy-MM-dd')}</div>
-            </div>
+              [/#list]
           </div>
-        </li>
-        [/#list]
-      </ul>
       [#include 'inc_page.html'/]
       [/@ArticlePage]
+
     </div>
-    [#include 'inc_right.html'/]
+
   </div>
+
 </div>
+
+
+
+
+
+
+
 [#include 'inc_footer.html'/]
 <script>axios.get('${api}/channel/view/${channel.id?c}');</script>
 </body>
diff --git a/src/main/webapp/templates/1/default/channel_wenku.html b/src/main/webapp/templates/1/default/channel_wenku.html
index 0ea56a3..4a9faed 100644
--- a/src/main/webapp/templates/1/default/channel_wenku.html
+++ b/src/main/webapp/templates/1/default/channel_wenku.html
@@ -12,66 +12,82 @@
 </head>
 <body>
 [#include 'inc_header.html'/]
-<div class="bg-gray-200">
-  <div class="container">
-    <nav class="row" aria-label="breadcrumb">
-      <ol class="col list-inline my-2">
-        [#assign parent = channel.parent!channel/]
-        <li class="list-inline-item"><a class="btn btn-sm [#if parent.id == channel.id]btn-primary[#else]btn-link[/#if]" href="${parent.url}">全部</a></li>
-        [@ChannelList parentId=parent.id; list]
-        [#list list as bean]
-        <li class="list-inline-item"><a class="btn btn-sm [#if channel.id == bean.id]btn-primary[#else]btn-link[/#if]" href="${bean.url}">${bean.name}</a></li>
-        [/#list]
-        [/@ChannelList]
-      </ol>
-    </nav>
+<div class="wenku_container">
+<div class="banner">
+  <div class="banner_main">
+    <h2>政策法规</h2>
+    <p>安全第一 预防为主 综合治理</p>
   </div>
 </div>
-<div class="container mt-3">
-  <div class="row">
-    <div class="col">
-      <div>
-        [#assign customsQueryMap={}/]
-        [#list channel.articleModel.fieldList?filter(field->['radio','checkbox','select','multipleSelect']?seqContains(field.type)) as field]
-        <div class="py-1 border-bottom">
-          [#assign param=field.code+'Key'/]
-          <a href="${addParam(channel.url, channel.dynamicUrl, param)}" class="btn btn-sm[#if !Params[param]??] btn-secondary[#else] btn-link text-reset[/#if]">全部${field.name}</a>
-          [@DictList typeId=field.dictTypeId; list]
-          [#list list as dict]
-          <a href="${addParam(channel.url, channel.dynamicUrl, param,dict.value)}"
-             class="btn btn-sm [#if Params[param]! == dict.value]btn-secondary[#else]btn-link text-reset[/#if]">${dict.name}</a>
-          [/#list]
-          [/@DictList]
-        </div>
-        [#assign customsQueryMap=customsQueryMap + {'ArrayEQ_@articleExt-mainsJson$'+param+(field.dataType != 'string')?string('_Int',''): Params[param]!}/]
-        [/#list]
-      </div>
-      [@ArticlePage channelId=channel.id isIncludeSubChannel='true' Q_=customsQueryMap orderBy=channel.orderDesc?string("sticky_desc,order_desc","sticky_desc,order_asc"); pagedList]
-      <ul class="list-unstyled">
-        [#list pagedList.content as bean]
-        <li class="mt-3 media border-bottom position-relative pb-3">
-          [#if bean.image??][@A bean=bean class="mr-3"]<img src="${bean.image}" class="rounded-sm img-thumbnail cm-media-img" alt="${bean.title}">[/@A][/#if]
-          <div class="media-body">
-            <p class="mt-0 mb-1">[@A bean=bean class="cm-link text-decoration-none"/]</p>
-            <p class="text-muted d-none d-sm-block mb-2">
-              [@A bean=bean class="text-reset small text-decoration-none"]${substring(bean.description,60,'...')}[/@A]
-            </p>
-            <div class="small text-muted mt-3 clearfix">
-              <div class="float-left">
-                <span>[#list bean.channel.paths as c][@A bean=c/][#if c_has_next] > [/#if][/#list]</span>
-                <i class="ml-2 far fa-eye"></i> ${bean.views}
-              </div>
-              <div class="float-right"><i class="ml-2 far fa-clock"></i> ${format(bean.publishDate, 'yyyy-MM-dd')}</div>
-            </div>
-          </div>
-        </li>
-        [/#list]
-      </ul>
-      [#include 'inc_page.html'/]
-      [/@ArticlePage]
+<div class="new_container">
+  <div class="top">
+    <div class="wrap">
+      [#assign parent = channel.parent!channel/]
+      <div class="list [#if parent.id == channel.id]active[#else][/#if]"><a  href="${parent.url}">全部</a></div>
+      [@ChannelList parentId=parent.id isNav='true'; list]
+      [#list list as bean]
+      <div class="list [#if channel.id == bean.id]active[#else][/#if]"><a  href="${bean.url}">${bean.name}</a></div>
+      [/#list]
+      [/@ChannelList]
     </div>
   </div>
+  <div class="new_main">
+    <div>
+      [#assign customsQueryMap={}/]
+      [#list channel.articleModel.fieldList?filter(field->['radio','checkbox','select','multipleSelect']?seqContains(field.type)) as field]
+      <div class="py-1 border-bottom">
+        [#assign param=field.code+'Key'/]
+        <a href="${addParam(channel.url, channel.dynamicUrl, param)}" class="btn btn-sm[#if !Params[param]??] btn-secondary[#else] btn-link text-reset[/#if]">全部${field.name}</a>
+        [@DictList typeId=field.dictTypeId; list]
+        [#list list as dict]
+        <a href="${addParam(channel.url, channel.dynamicUrl, param,dict.value)}"
+           class="btn btn-sm [#if Params[param]! == dict.value]btn-secondary[#else]btn-link text-reset[/#if]">${dict.name}</a>
+        [/#list]
+        [/@DictList]
+      </div>
+      [#assign customsQueryMap=customsQueryMap + {'ArrayEQ_@articleExt-mainsJson$'+param+(field.dataType != 'string')?string('_Int',''): Params[param]!}/]
+      [/#list]
+    </div>
+    <div class=" mt-3">
+      <div class="row">
+        <div class="col">
+          [@ArticlePage channelId=channel.id isIncludeSubChannel='true' Q_=customsQueryMap orderBy=channel.orderDesc?string("sticky_desc,order_desc","sticky_desc,order_asc"); pagedList]
+          [#list pagedList.content as bean]
+          <div class="wrap">
+
+            <div class="item">
+              [#if bean.image??][@A bean=bean class="mr-3"]<img src="${bean.image}" class="rounded-sm img-thumbnail cm-media-img" alt="${bean.title}">[/@A][/#if]
+              <div class="info">
+                <p class="title">[@A bean=bean class="cm-link text-decoration-none"/]</p>
+                <p class="time">
+                  [@A bean=bean class="text-reset small text-decoration-none"]${substring(bean.description,60,'...')}[/@A]
+                </p>
+                <div class="small text-muted mt-3 clearfix">
+                  <div class="float-left">
+                    <span>[#list bean.channel.paths as c][@A bean=c/][#if c_has_next] > [/#if][/#list]</span>
+                    <i class="ml-2 far fa-eye"></i> ${bean.views}
+                  </div>
+                  <div class="float-right"><i class="ml-2 far fa-clock"></i> ${format(bean.publishDate, 'yyyy-MM-dd')}</div>
+                </div>
+              </div>
+            </div>
+
+          </div>
+          [/#list]
+          [#include 'inc_page.html'/]
+          [/@ArticlePage]
+        </div>
+      </div>
+    </div>
+
+
+  </div>
 </div>
+</div>
+
+
+
+
 [#include 'inc_footer.html'/]
 <script>axios.get('${api}/channel/view/${channel.id?c}');</script>
 </body>
diff --git a/src/main/webapp/templates/1/default/channer_about1.html b/src/main/webapp/templates/1/default/channer_about1.html
new file mode 100644
index 0000000..07f899e
--- /dev/null
+++ b/src/main/webapp/templates/1/default/channer_about1.html
@@ -0,0 +1,50 @@
+<!doctype html>
+[#escape x as (x)!?html]
+<html lang="zh-CN">
+<head>
+  <meta charset="utf-8">
+  <title>${channel.title} - ${site.title}</title>
+  <meta name="keywords" content="${channel.seoKeywords}">
+  <meta name="description" content="${channel.seoDescription}">
+  <meta name="_csrf" content="${_csrf.token}"/>
+  <meta name="_csrf_header" content="${_csrf.headerName}"/>
+  [#include 'inc_meta.html'/]
+  [#include 'inc_css.html'/]
+  [#include 'inc_js.html'/]
+</head>
+<body>
+[#include 'inc_header.html'/]
+<!--<div class="bg-gray-200">-->
+<!--  <div class="container">-->
+<!--    <nav class="row" aria-label="breadcrumb">-->
+<!--      <ol class="col list-inline my-2">-->
+<!--        <li class="list-inline-item"><a href="${site.url}">首页</a></li>-->
+<!--        [#list channel.paths as c]-->
+<!--        <li class="list-inline-item">/</li>-->
+<!--        <li class="list-inline-item">[@A bean=c/]</li>-->
+<!--        [/#list]-->
+<!--      </ol>-->
+<!--    </nav>-->
+<!--  </div>-->
+<!--</div>-->
+<!--<div class="container mt-4">-->
+<!--  <div class="main">-->
+<!--    [#assign parent = channel.parent!channel/]-->
+<!--    [@ChannelList parentId=parent.id isNav='true'; list]-->
+<!--    [#list list as bean]-->
+<!--    <div class="list [#if channel.id == bean.id]active[#else][/#if]"><a href="${bean.url}">${bean.name}</a></div>-->
+<!--    [/#list]-->
+<!--    [/@ChannelList]-->
+<!--  </div>-->
+<!--  <div class="row">-->
+<!--    <div class="col-lg-12">-->
+<!--      <h3 class="cm-ff-yh">${channel.name}2343</h3>-->
+<!--      <div class="mt-4 article-content">[#noescape]${channel.text!}[/#noescape]</div>-->
+<!--    </div>-->
+<!--  </div>-->
+<!--</div>-->
+[#include 'inc_footer.html'/]
+<script>axios.get('${api}/channel/view/${channel.id?c}');</script>
+</body>
+</html>
+[/#escape]
diff --git a/src/main/webapp/templates/1/default/part_article_items.html b/src/main/webapp/templates/1/default/part_article_items.html
index d4549b2..9ede67e 100644
--- a/src/main/webapp/templates/1/default/part_article_items.html
+++ b/src/main/webapp/templates/1/default/part_article_items.html
@@ -19,11 +19,6 @@
       </div>
     </div>
   </li>
-
-
-
-
-
   [#if !bean_has_next]
     <script>lastArticleDate = '${bean.publishDate.format()}'</script>
   [/#if]
diff --git a/src/main/webapp/templates/1/default/sys_message_board.html b/src/main/webapp/templates/1/default/sys_message_board.html
index c6026f2..a30fc01 100644
--- a/src/main/webapp/templates/1/default/sys_message_board.html
+++ b/src/main/webapp/templates/1/default/sys_message_board.html
@@ -10,11 +10,21 @@
   [#include 'inc_js.html'/]
 </head>
 <body>
+<div class="about_container">
+  <div class="banner">
+    <div class="banner_main">
+      <h2>留言板</h2>
+      <p>安全第一 预防为主 综合治理</p>
+    </div>
+  </div>
+</div>
+
+
 [#-- 用于当前栏目高亮显示 --]
 [#assign channelAlias='message-board'/]
 [#assign headerShadow=true/]
 [#include 'inc_header.html'/]
-<div class="container">
+<div class="message_container">
   <div class="row">
     <div class="col mt-1">
       <div class="d-flex align-items-center py-1 border-bottom">
diff --git a/src/main/webapp/templates/1/default/sys_message_board_form.html b/src/main/webapp/templates/1/default/sys_message_board_form.html
index eafda1b..d0f3230 100644
--- a/src/main/webapp/templates/1/default/sys_message_board_form.html
+++ b/src/main/webapp/templates/1/default/sys_message_board_form.html
@@ -15,7 +15,15 @@
 [#assign channelAlias='message-board'/]
 [#assign headerShadow=true/]
 [#include 'inc_header.html'/]
-<div class="container">
+<div class="about_container">
+  <div class="banner">
+    <div class="banner_main">
+      <h2>留言板</h2>
+      <p>安全第一 预防为主 综合治理</p>
+    </div>
+  </div>
+</div>
+<div class="message_container">
   <div class="row">
     <div class="col mt-3">
       <div class="d-flex align-items-center py-1 border-bottom">