diff --git a/nuxt-demo/app/pages/case/details.vue b/nuxt-demo/app/pages/case/details.vue
index 3bb896b..5eecd4d 100644
--- a/nuxt-demo/app/pages/case/details.vue
+++ b/nuxt-demo/app/pages/case/details.vue
@@ -27,7 +27,20 @@
         </div>
       </div>
       <div class="case_main_wrap">
-        234
+        <div class="new_main">
+          <div class="title">
+            <h2>安全生产事故 | 900余人被疏散！广西一糖厂产生大量刺激性烟雾</h2>
+          </div>
+          <div class="main">
+            <p>
+              5月20日19时50分许，广西百色市田东县南华糖业有限公司二糖厂存放的约12吨消毒剂(三氯异氰尿酸)因近期暴雨天气受潮发生反应，产生大量烟雾，散发出刺激性气味。
+            </p>
+            <p>田东县迅速反应，及时处置，保护群众生命财产安全。第一时间组成工作组及时对二糖厂生活区和周边居民共900多人进行疏散，在该县体育馆设置临时安置点，为群众提供矿泉水、口罩、席子、被子等物资。</p>
+            <p>在百色市生态环境、应急、消防等部门的现场指导下，组织田东县应急、消防、生态环境、卫生健康等部门及专家开展现场处置工作。至21日凌晨2时20分许，现场已无烟雾产生，所有三氯异氰尿酸已安全转移，周边区域烟雾均已消散。疏散的群众已全部安全返回。</p>
+            <p>生态环境部门21日2时50分完成现场监测，7个监测点位中背景点厂界东北420米(上风向)氨气浓度为0.47mg/m³，其余点位扣除背景点后氨气均未检出，符合《恶臭污染物排放标准》(GB 14554-93)表1标准限值要求;所有点位氯气均未检出，符合《大气污染物综合排放标准》(GB 16297-1996)表1无组织排放监控限值要求，事故未对周边环境产生不良影响。</p>
+            <p>近期，广西多地遭遇特大暴雨导致多处地段发生内涝暴雨过后仍不能放松警惕防潮、防事故、防次生灾害……这些安全注意事项一起来看↓↓↓危化品储存　　夏季高温、雷雨、台风等极端天气容易对危险化学品安全生产造成不利影响。企业要加强危险化学品储罐、仓库的安全管理，严禁超量储存、违规混存、超高堆放、野蛮装卸等行为。　　有效落实危险化学品仓库防雨、防潮、防雷电措施，特别是受潮易自燃或分解有毒气体的危险化学品，要严格按标准规范入库储存，严禁露天存放，严禁与禁忌物混合储存。　　加强防雷、防静电设施的巡检和维护，按规定定期检测，确保防雷、防静电设施完好有效。</p>
+          </div>
+        </div>
       </div>
     </div>
     <AppFoot/>
@@ -98,64 +111,46 @@ const industries = ["全部", "冶金", "机械", "军工", "民爆", "环保",
             }
           }
         }
-
       }
-
     }
-
-    .case_main_wrap{
-      width: 1400px;
-      margin: 30px auto;
-      position: relative;
-      display: flex;
-      flex-wrap: wrap;
-
-      .item{
-        width: 440px;
+      .new_main{
+        width: 1400px;
+        margin: 20px auto 20px;
         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;
-          background: url("@/assets/images/img17.png") no-repeat top center;
-          border-radius: 20px;
-        }
-        .info{
-          background: #ffffff;
-          padding: 20px;
-          border-radius: 20px;
-          margin-top: -40px;
-          .title{
-            font-size: 18px;
-            text-align: left;
-            margin-bottom: 20px;
-            color: #222222;
+        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;
           }
-          .text{
-            font-size: 14px;
-            color: #575d63;
-          }
-          .details{
-            color: #1d78ff;
-            text-align: right;
-            font-size: 14px;
-            margin-top: 20px;
+          img{
+            margin: 0 auto;
+            max-width: 100%;
           }
         }
+
       }
     }
 
 
-  }
+
 }
 
 </style>
diff --git a/nuxt-demo/app/pages/case/index.vue b/nuxt-demo/app/pages/case/index.vue
index 7a9b619..dd3b565 100644
--- a/nuxt-demo/app/pages/case/index.vue
+++ b/nuxt-demo/app/pages/case/index.vue
@@ -27,54 +27,66 @@
         </div>
       </div>
       <div class="case_main_wrap">
-        <div class="item">
-          <div class="img"></div>
-          <div class="info">
-            <div class="title">秦皇岛港股份有限公司</div>
-            <div class="text">把危险化学品安全摆在防范化解重大风险的突出位置，推进新一代信息技术和危险化学品安全生产深度融合，实现数字化转型...</div>
-            <div class="details">了解详情 ></div>
+        <NuxtLink to="/case/details">
+          <div class="item">
+            <div class="img"></div>
+            <div class="info">
+              <div class="title">秦皇岛港股份有限公司</div>
+              <div class="text">把危险化学品安全摆在防范化解重大风险的突出位置，推进新一代信息技术和危险化学品安全生产深度融合，实现数字化转型...</div>
+              <div class="details">了解详情 ></div>
+            </div>
           </div>
-        </div>
-        <div class="item">
-          <div class="img"></div>
-          <div class="info">
-            <div class="title">秦皇岛港股份有限公司</div>
-            <div class="text">把危险化学品安全摆在防范化解重大风险的突出位置，推进新一代信息技术和危险化学品安全生产深度融合，实现数字化转型...</div>
-            <div class="details">了解详情 ></div>
+        </NuxtLink>
+        <NuxtLink to="/case/details">
+          <div class="item">
+            <div class="img"></div>
+            <div class="info">
+              <div class="title">秦皇岛港股份有限公司</div>
+              <div class="text">把危险化学品安全摆在防范化解重大风险的突出位置，推进新一代信息技术和危险化学品安全生产深度融合，实现数字化转型...</div>
+              <div class="details">了解详情 ></div>
+            </div>
           </div>
-        </div>
-        <div class="item">
-          <div class="img"></div>
-          <div class="info">
-            <div class="title">秦皇岛港股份有限公司</div>
-            <div class="text">把危险化学品安全摆在防范化解重大风险的突出位置，推进新一代信息技术和危险化学品安全生产深度融合，实现数字化转型...</div>
-            <div class="details">了解详情 ></div>
+        </NuxtLink>
+        <NuxtLink to="/case/details">
+          <div class="item">
+            <div class="img"></div>
+            <div class="info">
+              <div class="title">秦皇岛港股份有限公司</div>
+              <div class="text">把危险化学品安全摆在防范化解重大风险的突出位置，推进新一代信息技术和危险化学品安全生产深度融合，实现数字化转型...</div>
+              <div class="details">了解详情 ></div>
+            </div>
           </div>
-        </div>
-        <div class="item">
-          <div class="img"></div>
-          <div class="info">
-            <div class="title">秦皇岛港股份有限公司</div>
-            <div class="text">把危险化学品安全摆在防范化解重大风险的突出位置，推进新一代信息技术和危险化学品安全生产深度融合，实现数字化转型...</div>
-            <div class="details">了解详情 ></div>
+        </NuxtLink>
+        <NuxtLink to="/case/details">
+          <div class="item">
+            <div class="img"></div>
+            <div class="info">
+              <div class="title">秦皇岛港股份有限公司</div>
+              <div class="text">把危险化学品安全摆在防范化解重大风险的突出位置，推进新一代信息技术和危险化学品安全生产深度融合，实现数字化转型...</div>
+              <div class="details">了解详情 ></div>
+            </div>
           </div>
-        </div>
-        <div class="item">
-          <div class="img"></div>
-          <div class="info">
-            <div class="title">秦皇岛港股份有限公司</div>
-            <div class="text">把危险化学品安全摆在防范化解重大风险的突出位置，推进新一代信息技术和危险化学品安全生产深度融合，实现数字化转型...</div>
-            <div class="details">了解详情 ></div>
+        </NuxtLink>
+        <NuxtLink to="/case/details">
+          <div class="item">
+            <div class="img"></div>
+            <div class="info">
+              <div class="title">秦皇岛港股份有限公司</div>
+              <div class="text">把危险化学品安全摆在防范化解重大风险的突出位置，推进新一代信息技术和危险化学品安全生产深度融合，实现数字化转型...</div>
+              <div class="details">了解详情 ></div>
+            </div>
           </div>
-        </div>
-        <div class="item">
-          <div class="img"></div>
-          <div class="info">
-            <div class="title">秦皇岛港股份有限公司</div>
-            <div class="text">把危险化学品安全摆在防范化解重大风险的突出位置，推进新一代信息技术和危险化学品安全生产深度融合，实现数字化转型...</div>
-            <div class="details">了解详情 ></div>
+        </NuxtLink>
+        <NuxtLink to="/case/details">
+          <div class="item">
+            <div class="img"></div>
+            <div class="info">
+              <div class="title">秦皇岛港股份有限公司</div>
+              <div class="text">把危险化学品安全摆在防范化解重大风险的突出位置，推进新一代信息技术和危险化学品安全生产深度融合，实现数字化转型...</div>
+              <div class="details">了解详情 ></div>
+            </div>
           </div>
-        </div>
+        </NuxtLink>
       </div>
     </div>
     <AppFoot/>
@@ -156,6 +168,9 @@ const industries = ["全部", "冶金", "机械", "军工", "民爆", "环保",
       position: relative;
       display: flex;
       flex-wrap: wrap;
+      a{
+        text-decoration: none;
+      }
 
       .item{
         width: 440px;
diff --git a/nuxt-demo/app/pages/solution/index.vue b/nuxt-demo/app/pages/solution/index.vue
index 3132145..dd85c86 100644
--- a/nuxt-demo/app/pages/solution/index.vue
+++ b/nuxt-demo/app/pages/solution/index.vue
@@ -348,7 +348,7 @@ const block2Items = [
         background: #ffffff;
         border-style: solid;
         border-width: 1px;
-        border-color: rgb(181, 202, 238);
+        border-color: rgb(231 240 255);
         border-radius: 6px;
         background-image: -moz-linear-gradient( 120deg, rgb(238,245,255) 0%, rgb(255,255,255) 100%);
         background-image: -webkit-linear-gradient( 120deg, rgb(238,245,255) 0%, rgb(255,255,255) 100%);