diff --git a/src/Layout/tabbar/index.vue b/src/Layout/tabbar/index.vue
index b89c439..dcaea22 100644
--- a/src/Layout/tabbar/index.vue
+++ b/src/Layout/tabbar/index.vue
@@ -2,37 +2,28 @@
   <div :class="!flog ? 'tabbar' : 'tabbar-active'">
     <div class="container">
       <div class="left">
-        <div class="logo-box">
-          <div class="lesson">
-            <img :src="logoUrl" alt="" v-default-image="LOGO"/>
-            <!-- <img src="../../assets/images/LOGO.png" alt=""> -->
-          </div>
-        </div>
-
-        <div class="menu">
-          <el-menu
-            :default-active="$route.path"
-            class="el-menu-demo"
-            mode="horizontal"
-            :ellipsis="false"
-          >
-            <Item :menu-list="constRouter.children" />
-          </el-menu>
-          <!-- <ul>
-            <li v-for="(item, index) in constRouter.children" :key="index">
-              {{ item.meta.title }}
-            </li>
-          </ul> -->
-        </div>
+        <!-- <div class="logo-box">
+          <div class="lesson"> -->
+            <!-- <img :src="logoUrl" alt="" v-default-image="LOGO"/> -->
+            河南省青少年阅读大赛
+            <!-- <img src="../../assets/images/LOGO.png" alt =""> -->
+          <!-- </div>
+        </div> -->
       </div>
+      <div class="menu">
+          <div @click="$router.push('/')">首页</div>
+          <div @click="$router.push('/')">赛事流程</div>
+          <div @click="$router.push('/')">优秀作品</div>
+          <div @click="$router.push('/')">相关资讯</div>
+        </div>
       <div class="right" v-if="!useUserStore.token">
-        <div
+        <!-- <div
           class="registered gradient"
           @click="$router.push('/login?registered=true')"
         >
           注册
-        </div>
-        <div class="login" @click="$router.push('/login')">登录</div>
+        </div> -->
+        <div class="login" @click="$router.push('/login')">登录/注册</div>
       </div>
       <div class="right" v-else>
         <div class="avater">
@@ -112,29 +103,33 @@ watch(
 </script>
 
 <style lang="scss" scoped>
-.logo-box {
-  display: flex;
-  align-items: center;
-  column-gap: 20px;
-  .logo {
-    width: 50px;
+// .logo-box {
+//   display: flex;
+//   align-items: center;
+//   column-gap: 20px;
+//   .logo {
+//     width: 50px;
 
-    img {
-      width: 100%;
-      height: 100%;
-    }
-  }
+//     img {
+//       width: 100%;
+//       height: 100%;
+//     }
+//   }
 
-  .lesson {
-    font-size: 30px;
-    font-weight: bolder;
-    color: #1d2129;
-    img {
-      width: 40px;
-      height: 40px;
-    }
-  }
-}
+//   .lesson {
+//     margin-top: 60px;
+//     margin-left: 220px;
+//     width: 300px;
+//     height: 40px;
+//     font-family: Microsoft YaHei, Microsoft YaHei;
+//     font-weight: bold;
+//     font-size: 30px;
+//     color: #333333;
+//     text-align: left;
+//     font-style: normal;
+//     text-transform: none;
+//   }
+// }
 
 .tabbar {
   position: fixed;
@@ -184,15 +179,47 @@ watch(
 }
 
 .container {
+  background: url('../../assets/images/banner1.png') no-repeat;
+  background-size: cover;
+  width: 100%;
   height: 100%;
   display: flex;
   align-items: center;
-  justify-content: space-between;
-  margin: 0 auto;
-  width: $base-container-width;
+  // justify-content: space-between;
+  justify-content:center;
+  // padding-top: 40px;
+  gap: 150px;
+  // margin: 0 auto;
+  // width: $base-container-width;
   .left {
-    display: flex;
-    align-items: center;
+    // display: flex;
+    // align-items: center;
+    font-family: Microsoft YaHei, Microsoft YaHei;
+    font-weight: bold;
+    font-size: 30px;
+    color: #333333;
+    text-align: center;
+    // padding-left: 10%;
+  }
+  .menu {
+      padding: 10px 40px; /* 上下内边距为10px，左右内边距为20px */
+      display: flex; /* 使用Flex布局 */
+      align-items: center; /* 垂直居中对齐子元素 */
+      font-size: 18px;
+      justify-content: space-between; /* 子元素之间的间距均匀分布 */
+      background-color: #f8f9fa; /* 设置背景颜色 */
+      height: 71px; /* 设置固定高度 */
+      width: 580px;
+      border-radius: 30px; /* 设置圆角 */
+      // margin-top: 60px;
+      margin-left: 100px; /* 将容器推到右边 */
+      // margin-right: 50px; /* 确保右边没有外边距 */
+      cursor: pointer;  /* 鼠标悬停时显示为手型 */
+      color: #333333;
+      font-family: Microsoft YaHei UI, Microsoft YaHei UI;
+      font-weight: bold;
+      font-style: normal;
+      text-transform: none;
   }
   .right {
     display: flex;
@@ -209,9 +236,22 @@ watch(
       color: #fff;
     }
     .login {
-      color: #1d2129;
+      color: #f2f3f3;
       margin-left: 20px;
+      // margin-top: 60px;
+      // margin-right: 217px;
       border: 1px solid #e5e6eb;
+      background-color: #61B327;
+      border-radius: 30px;
+      padding: 13px 10px; /* 增加内边距，使按钮内容与边框之间有更多空间 */
+      font-size: 18px; /* 增加字体大小 */
+      font-family: Microsoft YaHei UI, Microsoft YaHei UI;
+      font-weight: bold;
+      // font-style: normal;
+      // text-transform: none;
+      // margin-left: 100px;
+      width: 189px;
+      height: 73px;
     }
     .avater {
       width: 35px;
@@ -225,68 +265,7 @@ watch(
       margin-right: 20px;
     }
   }
-  .menu {
-    position: relative;
-    padding: 0 20px;
-    height: 100%;
-    display: flex;
-    align-items: center;
-
-    ul {
-      display: flex;
-      align-items: center;
-
-      li {
-        padding: 12px 20px;
-        color: #1d2129;
-        font-size: 14px;
-        cursor: pointer;
-        transition: all 0.2s;
-        position: relative;
-      }
-
-      li:hover {
-        color: #0033f7;
-        transform: translateY(-5px);
-      }
-
-      .active::before {
-        content: ' ';
-        display: block;
-        position: absolute;
-        top: 0px;
-        left: 50%;
-        transform: translateX(-50%);
-        width: 5px;
-        height: 5px;
-        border-radius: 50%;
-        background-color: #fff;
-      }
-    }
-
-    .entry {
-      position: absolute;
-      top: 5px;
-      right: 30px;
-      display: flex;
-      align-content: center;
-
-      div {
-        // padding: 5px;
-        margin: 5px;
-        margin-right: 0;
-        padding: 0 10px;
-        border-right: 1px solid #fff;
-        color: #fff;
-        font-size: 14px;
-        cursor: pointer;
-      }
-
-      div:last-child {
-        border-right: none;
-      }
-    }
-  }
+  
 
   .logo {
     // height: 100%;
diff --git a/src/assets/images/banner1.png b/src/assets/images/banner1.png
index 74fec2d..ddb0d15 100644
Binary files a/src/assets/images/banner1.png and b/src/assets/images/banner1.png differ
diff --git a/src/assets/images/banner2.png b/src/assets/images/banner2.png
index c3ce726..fe635dc 100644
Binary files a/src/assets/images/banner2.png and b/src/assets/images/banner2.png differ
diff --git a/src/assets/images/bg10.png b/src/assets/images/bg10.png
new file mode 100644
index 0000000..4c179bc
Binary files /dev/null and b/src/assets/images/bg10.png differ
diff --git a/src/assets/images/bg11.png b/src/assets/images/bg11.png
new file mode 100644
index 0000000..3a5660d
Binary files /dev/null and b/src/assets/images/bg11.png differ
diff --git a/src/assets/images/bg12.png b/src/assets/images/bg12.png
new file mode 100644
index 0000000..2605227
Binary files /dev/null and b/src/assets/images/bg12.png differ
diff --git a/src/assets/images/bg13.png b/src/assets/images/bg13.png
new file mode 100644
index 0000000..8d531ae
Binary files /dev/null and b/src/assets/images/bg13.png differ
diff --git a/src/assets/images/bg14.png b/src/assets/images/bg14.png
new file mode 100644
index 0000000..ecc16ff
Binary files /dev/null and b/src/assets/images/bg14.png differ
diff --git a/src/assets/images/bg15.png b/src/assets/images/bg15.png
new file mode 100644
index 0000000..2b609ef
Binary files /dev/null and b/src/assets/images/bg15.png differ
diff --git a/src/assets/images/bg16.png b/src/assets/images/bg16.png
new file mode 100644
index 0000000..d0fa710
Binary files /dev/null and b/src/assets/images/bg16.png differ
diff --git a/src/assets/images/bg17.png b/src/assets/images/bg17.png
new file mode 100644
index 0000000..bef6449
Binary files /dev/null and b/src/assets/images/bg17.png differ
diff --git a/src/assets/images/bg18.png b/src/assets/images/bg18.png
new file mode 100644
index 0000000..ef120c8
Binary files /dev/null and b/src/assets/images/bg18.png differ
diff --git a/src/assets/images/bg19.png b/src/assets/images/bg19.png
new file mode 100644
index 0000000..0b33a83
Binary files /dev/null and b/src/assets/images/bg19.png differ
diff --git a/src/assets/images/bg3.png b/src/assets/images/bg3.png
new file mode 100644
index 0000000..3011485
Binary files /dev/null and b/src/assets/images/bg3.png differ
diff --git a/src/assets/images/bg4.png b/src/assets/images/bg4.png
new file mode 100644
index 0000000..56c5bbf
Binary files /dev/null and b/src/assets/images/bg4.png differ
diff --git a/src/assets/images/bg5.png b/src/assets/images/bg5.png
new file mode 100644
index 0000000..a7a786a
Binary files /dev/null and b/src/assets/images/bg5.png differ
diff --git a/src/assets/images/bg6.png b/src/assets/images/bg6.png
new file mode 100644
index 0000000..42acb26
Binary files /dev/null and b/src/assets/images/bg6.png differ
diff --git a/src/assets/images/bg7.png b/src/assets/images/bg7.png
new file mode 100644
index 0000000..7704ced
Binary files /dev/null and b/src/assets/images/bg7.png differ
diff --git a/src/assets/images/bg8.png b/src/assets/images/bg8.png
new file mode 100644
index 0000000..7ec439a
Binary files /dev/null and b/src/assets/images/bg8.png differ
diff --git a/src/assets/images/bg9.png b/src/assets/images/bg9.png
new file mode 100644
index 0000000..b3a7e7e
Binary files /dev/null and b/src/assets/images/bg9.png differ
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index 9810f2c..6bf05a7 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -1,46 +1,138 @@
 <template>
-  <div class="container-1420" v-if="isLoading">
+  <div class="container">
     <div class="banner">
-      <div class="title">{{ reacProjectList[0].compName }}火热报名中</div>
-      <div class="description">
-        <div v-html="reacProjectList[0].compInfo"></div>
+      <div class="banner-left">
+        <div style="font-size: 20px;color:#56A80B;">参赛对象：全省中小学生（含中职、高职）</div>
+        <div style="font-size: 58px;margin-top: 30px;">在读书中享受乐趣、感悟人生、获得成长</div>
+        <div class="application" @click="toDetail(reacProjectList[0].id)">
+          立即报名
+        </div>
+      </div>
+      <div class="banner-right" />
+    </div>
+    <div class="banner-bottom">
+      <div class="one"><img src="../../assets/images/bg3.png" style="width: 84px;">
+        <div style="margin-left: 20px;">
+          <div class="top">300</div>
+          <div class="bottom">参与学校</div>
+        </div>
       </div>
-      <div
-        class="application gradient"
-        @click="toDetail(reacProjectList[0].id)"
-      >
-        立即报名
+      <div class="two"><img src="../../assets/images/bg4.png" style="width: 84px;">
+        <div style="margin-left: 20px;">
+          <div class="top">20,000+</div>
+          <div class="bottom">报名人数</div>
+        </div>
+      </div>
+      <div class="three"><img src="../../assets/images/bg5.png" style="width: 84px;">
+        <div style="margin-left: 20px;">
+          <div class="top">10,000+</div>
+          <div class="bottom">提交作品</div>
+        </div>
+      </div>
+      <div class="four"><img src="../../assets/images/bg6.png" style="width: 84px;">
+        <div style="margin-left: 20px;">
+          <div class="top">1,00,000+</div>
+          <div class="bottom">浏览人数</div>
+        </div>
+      </div>
+    </div>
+    <!-- 赛事流程 -->
+    <div class="process">
+      <div class="process-1">EVENT SCHEDULE</div>
+      <div class="process-2">赛事流程</div>
+      <div class="process-3">大赛以线上线下相结合的形式展开，分为初赛（市级赛）、复赛（省级赛）和总决赛</div>
+      <div class="process-bottom">
+        <div class="bottom-1"><img src="../../assets/images/bg7.png" style="width: 100px;padding: 0px,71px,25px;">
+          <div>
+            <div class="text-top">启动仪式</div>
+            <div class="text-bottom">2025年3月29日</div>
+          </div>
+        </div>
+        <div class="bottom-2"><img src="../../assets/images/bg8.png"
+            style="width: 40px;padding-top: 25px; padding-bottom: 31px;">
+          <div>
+            <div class="text-top">初赛</div>
+            <div class="text-bottom">2025年4月1日-2025年5月31日</div>
+          </div>
+        </div>
+        <div class="bottom-3"><img src="../../assets/images/bg8.png"
+            style="width: 40px;padding-top: 25px; padding-bottom: 31px;">
+          <div>
+            <div class="text-top">复赛</div>
+            <div class="text-bottom">2025年6月1日-6月20日</div>
+          </div>
+        </div>
+        <div class="bottom-4"><img src="../../assets/images/bg8.png"
+            style="width: 40px;padding-top: 25px; padding-bottom: 31px;">
+          <div>
+            <div class="text-top">总决赛暨颁奖典礼</div>
+            <div class="text-bottom">2025年8月（地点另行通知）</div>
+          </div>
+        </div>
+      </div>
+    </div>
+    <!-- 赛事内容 -->
+    <div class="content">
+      <div class="content-1">EVENT CONTENT</div>
+      <div class="content-2">赛事内容</div>
+      <div class="content-3">大赛共设四个竞赛单元，原则上每竞赛单元每人限提交一件作品，可以兼报多个单元</div>
+      <div class="content-bottom">
+        <div class="info"><img src="../../assets/images/bg9.png" class="cover">
+          <div class="info-text">好书推荐分享<br><img src="../../assets/images/bg18.png"></div>
+        </div>
+        <div class="info"><img src="../../assets/images/bg10.png" class="cover">
+          <div class="info-text">写作征文大赛<br><img src="../../assets/images/bg18.png"></div>
+        </div>
+        <div class="info"><img src="../../assets/images/bg11.png" class="cover">
+          <div class="info-text">中华经典朗诵大赛<br><img src="../../assets/images/bg18.png"></div>
+        </div>
+        <div class="info"><img src="../../assets/images/bg12.png" class="cover">
+          <div class="info-text">阅读主题绘画活动<br><img src="../../assets/images/bg18.png"></div>
+        </div>
+      </div>
+    </div>
+    <!-- 赛事资讯 -->
+    <div class="new">
+      <div class="new-1">EVENT NEWS</div>
+      <div class="new-2">赛事资讯</div>
+      <div class="new-3">比赛相关实时新闻资讯一览</div>
+      <div class="new-list">
+          <div class="new-title"><img src="../../assets/images/bg14.png" class="new-icon">大赛公告
+          <img src="../../assets/images/bg18.png"></div>
+          <div class="new-title"><img src="../../assets/images/bg17.png" class="new-icon">大赛指导
+          <img src="../../assets/images/bg13.png"></div>
+          <div class="new-title"><img src="../../assets/images/bg15.png" class="new-icon">大赛风采
+          <img src="../../assets/images/bg13.png"></div>
+          <div class="new-title"><img src="../../assets/images/bg16.png" class="new-icon">更多
+          <img src="../../assets/images/bg13.png"></div>
+      </div>
+      <div class="new-info">
+          <div class="date">2025年8月<img src="../../assets/images/bg19.png"></div>
+          <div class="title">阅读主题绘画活动</div>
+          <div class="detail">你覅欧安会安徽建瓯市发哈和贫穷服务哈珀微服务波i文化法国被列为客户让我【齐奥佩你跑了后宫妃嫔维权案和评价为哦评估和片</div>
       </div>
     </div>
-    <!-- 比赛列表 -->
-
     <!-- 新闻列表 -->
-    <div class="news-list">
+    <!-- <div class="news-list">
       <div class="news-title">
         <div class="top">
           <div>新闻资讯</div>
           <div @click="router.push('/news')">
-            <el-icon><ArrowRightBold /></el-icon>
+            <el-icon>
+              <ArrowRightBold />
+            </el-icon>
           </div>
-        </div>
+        </div> -->
         <!-- <div class="bottom">30+项目登陆后报名</div> -->
-      </div>
+      <!-- </div>
       <div class="newa-panel">
         <div class="tab">
-          <div
-            :class="active === index ? 'item active gradient' : 'item'"
-            v-for="(item, index) in newList"
-            :key="index"
-            @click="toggleTab(item, index)"
-          >
+          <div :class="active === index ? 'item active gradient' : 'item'" v-for="(item, index) in newList" :key="index"
+            @click="toggleTab(item, index)">
             {{ item.name }}
           </div>
-          <div
-            class="item"
-        
-            @click="router.push('/news')"
-          >
-           更多
+          <div class="item" @click="router.push('/news')">
+            更多
           </div>
         </div>
         <div class="newa-main">
@@ -49,27 +141,27 @@
           </div>
           <div class="right">
             <div class="title">{{ newInfo.name }}</div>
-            <div class="description">
+            <div class="description"> -->
               <!-- 我是新闻描述,我是新闻描述,我是新闻描述 -->
-            </div>
+            <!-- </div>
             <div class="newa-main-list">
               <ul>
                 <li v-for="item in childrenNewList" :key="item.id" @click="toNewsDetail(item.id)">
                   <div class="info">
                     {{ item.title }}
                   </div>
-                  <div class="time">{{ item.createTime }}</div>
-                  
+                  <div class="time">{{ item.createTime }}</div> -->
+
                   <!-- <div class="name">
                     {{ item.createBy_dictText }}
                   </div> -->
-                </li>
+                <!-- </li>
               </ul>
             </div>
           </div>
         </div>
       </div>
-    </div>
+    </div> -->
   </div>
 </template>
 
@@ -145,7 +237,7 @@ const childrenNewList = ref<any>([])
 const getNewInfo = async (id: any) => {
   const res: any = await queryEssayListApi(id)
   childrenNewList.value = res.result.records
- // console.log(childrenNewList, 'childrenNewList')
+ console.log(childrenNewList, 'childrenNewList')
 }
 
 // 切换tab
@@ -164,120 +256,334 @@ export default {
 .banner {
   position: relative;
   width: 100%;
-  height: 692px;
-  // background: radial-gradient(
-  //   circle,
-  //   rgba(131, 255, 197, 1) 0%,
-  //   rgba(255, 255, 255, 1) 50%
-  // );
+  height: 930px;
   background: url('../../assets/images/banner1.png') no-repeat;
   background-size: cover;
   display: flex;
-  flex-direction: column;
-  justify-content: center;
+  justify-content: center; 
   align-items: center;
-  .title {
-    font-size: 50px;
-    font-weight: 600;
-    color: #333333;
+
+  .banner-left {
+    width: 573px;
+    height: 384px;
+    padding-right: auto;
+    padding-left: auto;
+  
+    .application {
+      width: 300px;
+      height: 60px;
+      margin-left: 60px;
+      text-align: center;
+      line-height: 60px;
+      font-size: 20px;
+      color: #fff;
+      cursor: pointer;
+      margin-top: 100px;
+      // background-color: #61B327;
+      background-image: linear-gradient(to right, #9AD34A, #61B327);
+      border-radius: 30px;
+    }
+  }
+  .banner-right{
+    width: 670px;
+    height: 545px;
+    background: url('../../assets/images/banner2.png') no-repeat;
+    background-size: cover;
+    padding-right: auto;
+  }
+  
+}
+.banner-bottom{
+    width: 100%;
+    height: 184px;
+    display: flex;
+    justify-content: space-evenly;
+    align-items: center;
+
+    .one,.two,.three,.four{
+      width: 188px;
+      height: 84px;
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+
+      .top{
+        flex-direction: column; 
+        width: 62px;
+        height: 40px;
+        font-family: Public Sans, Public Sans;
+        font-weight: 600;
+        font-size: 32px;
+        color: #1B1D1F;
+        line-height: 40px;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+      }
+      .bottom{
+        width: 80px;
+        height: 28px;
+        font-family: Microsoft YaHei, Microsoft YaHei;
+        font-weight: bold;
+        font-size: 20px;
+        color: #A2BDAA;
+        line-height: 28px;
+        text-align: left;
+        font-style: normal;
+        text-transform: none;
+      }
+    }
+    .one{
+      margin-left: 270px;
+    }
+    .four{
+      margin-right: 270px;
+    }
   }
-  .description {
-    width: 1074px;
+
+.process{
+  width: 100%;
+  height: 676px;
+  background: #F6FBF9;
+  padding-top: 132px;
+  // padding-bottom: 134px;
+
+  .process-1{
+    margin-bottom: 10px;
+    width:100%;
+    height: 24px;
+    font-family: Montserrat, Montserrat;
+    font-weight: bold;
+    font-size: 14px;
+    color: #56A80B;
+    line-height: 24px;
     text-align: center;
-    font-size: 20px;
-    color: #666;
-    margin-top: 37px;
-    line-height: 32px;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    display: -webkit-box;
-    -webkit-line-clamp: 2;
-    -webkit-box-orient: vertical;
+    font-style: normal;
+    text-transform: none;
   }
-  .application {
-    width: 272px;
-    height: 64px;
+  .process-2{
+    width:100%;
+    margin-bottom: 10px;
+    font-family: Microsoft YaHei, Microsoft YaHei;
+    font-weight: bold;
+    font-size: 46px;
+    color: #252B42;
+    line-height: 50px;
     text-align: center;
-    line-height: 64px;
-    border-radius: 10px;
-    font-size: 24px;
-    color: #fff;
-    cursor: pointer;
-    margin-top: 50px;
+    font-style: normal;
+    text-transform: none;
   }
-  .nav-title {
-    position: absolute;
-    bottom: 0;
-    color: #1e2033;
-    .top {
-      font-size: 40px;
-      font-weight: 600;
-      text-align: center;
-    }
-    .bottom {
-      font-size: 16px;
-      text-align: center;
-      margin-top: 10px;
+  .process-3{
+    width: 100%;
+    height: 20px;
+    font-family: Microsoft YaHei, Microsoft YaHei;
+    font-weight: 400;
+    font-size: 14px;
+    color: #737373;
+    line-height: 20px;
+    text-align: center;
+    font-style: normal;
+    text-transform: none;
+  }
+  .process-bottom{
+    padding-top: 110px;
+    display: flex;
+    justify-content: center;
+    align-items: center;
+    gap: 130px;
+    .bottom-1,.bottom-2,.bottom-3,.bottom-4{
+      flex-direction: column; 
+      display: flex;
+      justify-content: space-between;
+      align-items: center;
+
+      .text-top{
+        flex-direction: column; 
+        height: 48px;
+        font-family: Microsoft YaHei, Microsoft YaHei;
+        font-weight: bold;
+        font-size: 24px;
+        color: #252B42;
+        text-align: center;
+        font-style: normal;
+        text-transform: none;
+      }
+      .text-bottom{
+        font-family: Microsoft YaHei-Regular;
+        font-weight: Regular;
+        font-size: 20px;
+        color: #252B42;
+        text-align: center;
+        font-style: normal;
+        text-transform: none;
+      }
     }
   }
 }
-.race-list {
-  position: relative;
-  width: 100%;
-  display: grid;
-  grid-template-columns: repeat(4, 1fr);
-  grid-template-rows: repeat(2, 1fr);
-  // gap: 10px;
-  margin-top: 40px;
-  .item {
-    width: 340px;
-    height: 360px;
-    // background-color: pink;
-    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.06);
-    cursor: pointer;
-    border-radius: 10px;
-    transition: all 0.2s;
-    .image {
-      width: 100%;
-      height: 194px;
-      img {
+.content{
+  height: 676px;
+  padding-top: 132px;
+  padding-left: 350px;
+  .content-1{
+    margin-bottom: 10px;
+    font-weight: bold;
+    font-size: 14px;
+    color: #56A80B;
+    line-height: 24px;
+    text-align: left;
+  }
+  .content-2{
+    margin-bottom: 10px;
+    font-family: Microsoft YaHei, Microsoft YaHei;
+    font-weight: bold;
+    font-size: 46px;
+    color: #252B42;
+    line-height: 50px;
+    text-align: left;
+  }
+  .content-3{
+    font-family: Microsoft YaHei, Microsoft YaHei;
+    font-weight: 400;
+    font-size: 14px;
+    color: #737373;
+    line-height: 20px;
+    text-align: left;
+  }
+  .content-bottom{
+    padding-top: 80px;
+    display: flex;
+    justify-content: left;
+    align-items: center;
+    gap: 50px;
+    .info{
+      flex-direction: column;
+      width: 280px;
+      height: 325px;
+      border-radius: 22px;
+      background-color: #f7f6f6;
+      
+      .cover{
         width: 100%;
-        height: 100%;
-      }
-    }
-    .reac-info {
-      padding: 0 8px;
-      .reac-title {
-        margin-top: 19px;
-        color: #c9c9c9;
-        font-size: 12px;
+        // height: 186px;
       }
-      .reac-project {
-        font-size: 16px;
-        font-weight: 600;
-        color: #333333;
-        margin-top: 10px;
+      .info-text{
+        // flex-direction: column;
+        padding-top: 25px;
+        font-family: Microsoft YaHei, Microsoft YaHei;
+        font-weight: bold;
+        font-size: 22px;
+        color: #1B1D1F;
+        line-height: 29px;
+        text-align: center;
       }
-      .time {
-        font-size: 14px;
-        color: #8c8b8b;
-        margin-top: 40px;
+      img{
+        width: 50px;
       }
-    }
+    }    
   }
-  .item:hover {
-    transform: translateY(-5px);
+}
+.new{
+  // height: 1090px;
+  padding-bottom: 80px;
+  padding-top: 132px;
+  padding-left: 350px;
+  background-color: #d9d9d927 ;
+  .new-1{
+    margin-bottom: 10px;
+    font-weight: bold;
+    font-size: 14px;
+    color: #56A80B;
+    line-height: 24px;
+    text-align: left;
   }
-  .item:nth-child(n) {
-    margin-top: 20px;
+  .new-2{
+    margin-bottom: 10px;
+    font-family: Microsoft YaHei, Microsoft YaHei;
+    font-weight: bold;
+    font-size: 46px;
+    color: #252B42;
+    line-height: 50px;
+    text-align: left;
   }
-  .more {
-    position: absolute;
-    right: 20px;
-    top: -20px;
-    color: #0bd7c6;
-    cursor: pointer;
+  .new-3{
+    font-family: Microsoft YaHei, Microsoft YaHei;
+    font-weight: 400;
     font-size: 14px;
+    color: #737373;
+    line-height: 20px;
+    text-align: left;
+  }
+  .new-list{
+    padding-top: 80px;
+    display: flex;
+    justify-content: left;
+    align-items: center;
+    gap: 50px;
+
+    .new-title{
+      width: 310px;
+      height: 74px;
+      border-radius: 22px;
+      background-color: #ffffff;
+      padding: 15px;
+      font-family: Microsoft YaHei, Microsoft YaHei;
+      font-size: 20px;
+      color: #000000;
+      line-height: 28px;
+      display: flex;
+      align-items: center; 
+      gap: 20px;
+      .new-icon{
+          width: 38px;
+        }
+      img{
+        width: 50px;
+        margin-left: 30px;
+      }
+    }
+  }
+  .new-info{
+    margin-top: 80px;
+    padding: 32px;
+    width: 580px;
+    height: 260px;
+    background-color: #ffffff;
+    justify-content: center;
+    border-radius: 22px;
+
+    .date{
+      font-family: Microsoft YaHei, Microsoft YaHei;
+      font-weight: bold;
+      font-size: 24px;
+      color: #333333;
+      line-height: 32px;
+      text-align: left;
+      display: flex;
+      align-items: center; 
+      gap: 350px;
+      // padding-right: 50px;
+      img{
+        text-align:right;
+        width: 40px;
+        height: 29px;
+      }
+    }
+    .title{
+      font-family: Microsoft YaHei, Microsoft YaHei;
+      font-weight: bold;
+      font-size: 22px;
+      color: #333333;
+      line-height: 47px;
+      text-align: left;
+    }
+    .detail{
+      font-family: Microsoft YaHei, Microsoft YaHei;
+      font-weight: 400;
+      font-size: 16px;
+      color: #292D33;
+      line-height: 30px;
+      text-align: left;
+    }
   }
 }
 .news-list {