diff --git a/README.md b/README.md
index f5db2a2..ad608d3 100644
--- a/README.md
+++ b/README.md
@@ -1,6 +1,7 @@
-# Nuxt 3 Minimal Starter
+# 项目CDN配置
+1.修改nuxt.config.ts中的 cdnDomain
 
-Look at the [Nuxt 3 documentation](https://nuxt.com/docs/getting-started/introduction) to learn more.
+2.修改assets/css/common.scss中的定义数据
 
 ## Setup
 
diff --git a/app.vue b/app.vue
index 4b22a9b..63ca371 100644
--- a/app.vue
+++ b/app.vue
@@ -1,14 +1,14 @@
 <template>
-   <n-config-provider :locale="zhCN">
-  <AppHeader />
-  <NuxtPage />
-  <AppFooter/>
+  <n-config-provider :locale="zhCN">
+    <AppHeader />
+    <NuxtPage />
+    <AppFooter />
   </n-config-provider>
 </template>
 
 <script lang="ts" setup>
-  import { NConfigProvider } from 'naive-ui'
-  import { zhCN, dateZhCN } from 'naive-ui'
+import { NConfigProvider } from 'naive-ui'
+import { zhCN, dateZhCN } from 'naive-ui'
 import $api from '@/service/webRequest'
 import { useStore } from '~/store'
 import { useI18n } from 'vue-i18n'
@@ -28,7 +28,6 @@ onMounted(() => {
 </script>
 
 <style>
-
 #__nuxt {
   height: 100%;
   width: 100%;
diff --git a/assets/css/common.scss b/assets/css/common.scss
index bd6213e..1aac570 100644
--- a/assets/css/common.scss
+++ b/assets/css/common.scss
@@ -1,3 +1,32 @@
 @tailwind base;
 @tailwind components;
-@tailwind utilities;
\ No newline at end of file
+@tailwind utilities;
+
+:root {
+    --bg-t2: url('https://cdn.web.0rui.cn/img/t2.png');
+    --bg-c: url('https://cdn.web.0rui.cn/img/bg-c.png');
+    --m1: url('https://cdn.web.0rui.cn/img/m1.png');
+    --bg-b: url('https://cdn.web.0rui.cn/img/bg-b.png');
+    --bg-4: url('https://cdn.web.0rui.cn/img/bg-4.png');
+    --bg-5: url('https://cdn.web.0rui.cn/img/bg-5.png');
+    --qall: url('https://cdn.web.0rui.cn/img/qall.png');
+    --close: url('https://cdn.web.0rui.cn/img/close.png');
+    --t1a: url('https://cdn.web.0rui.cn/img/about/t1a.png');
+    --t1b: url('https://cdn.web.0rui.cn/img/about/t1b.png');
+    --ruanzhu: url('https://cdn.web.0rui.cn/img/about/ruanzhu.png');
+    --allpeople: url('https://cdn.web.0rui.cn/img/allpeople.png');
+    --lianxiyp: url('https://cdn.web.0rui.cn/img/lianxiyp.png');
+    --bg-s: url('https://cdn.web.0rui.cn/img/customer/bg-s.png');
+    --service_023: url('https://cdn.web.0rui.cn/img/service_023.png');
+    --service_033: url('https://cdn.web.0rui.cn/img/service_033.png');
+    --service_048: url('https://cdn.web.0rui.cn/img/service_048.png');
+    --service_033: url('https://cdn.web.0rui.cn/img/service_033.png');
+    --service_051: url('https://cdn.web.0rui.cn/img/service_051.png');
+    --content_top: url('https://cdn.web.0rui.cn/img/content_top.png');
+    --video: url('https://cdn.web.0rui.cn/img/video.png');
+    --wechat1: url('https://cdn.web.0rui.cn/img/wechat1.png');
+    --newstop: url('https://cdn.web.0rui.cn/img/societyduty/newstop.png');
+  }
+  //   const cdnUrl = useCdn()
+
+  //   ${cdnUrl}
\ No newline at end of file
diff --git a/assets/index.css b/assets/index.scss
similarity index 88%
rename from assets/index.css
rename to assets/index.scss
index 6a62fc5..7f9f635 100644
--- a/assets/index.css
+++ b/assets/index.scss
@@ -13,8 +13,7 @@
 
 .box_1 {
   width: 100%;
-  height: 38px;
-  margin: 32px 0 0 0px;
+  height: 90px;
   justify-content: center;
 }
 
@@ -24,87 +23,45 @@
 }
 
 .text_1 {
-  width: 64px;
-  height: 16px;
-  overflow-wrap: break-word;
+  height: 90px;
+  line-height: 90px;
   color: rgba(255, 255, 255, 0.5);
   font-size: 16px;
-  font-family: Microsoft YaHei UI-Regular;
-  font-weight: NaN;
-  text-align: left;
-  white-space: nowrap;
-  line-height: 16px;
-  margin: 5px 0 0 381px;
-}
+  position: relative;
+  overflow: hidden;
+  padding: 0px 20px;
+  &:hover {
+    color: #ffffff;
+    height: 100%;
+    opacity: 1;
+    
+    &:before {
+      height: 100%;
+      opacity: 1;
+    }
+  }
 
-.text_2 {
-  width: 83px;
-  height: 16px;
-  overflow-wrap: break-word;
-  color: rgba(255, 255, 255, 0.5);
-  font-size: 16px;
-  font-family: Microsoft YaHei UI-Regular;
-  font-weight: NaN;
-  text-align: left;
-  white-space: nowrap;
-  line-height: 16px;
-  margin: 5px 0 0 41px;
-}
+  &:before {
+    content: '';
+    position: absolute;
+    bottom: 0;
+    left: 0;
+    display: block;
+    width: 100%;
+    height: 0;
+    opacity: 0;
+    background: #FC7428;
+    transition: all 0.5s ease-in-out;
+    z-index: 1;
+  }
 
-.text_3 {
-  width: 83px;
-  height: 16px;
-  overflow-wrap: break-word;
-  color: rgba(255, 255, 255, 0.5);
-  font-size: 16px;
-  font-family: Microsoft YaHei UI-Regular;
-  font-weight: NaN;
-  text-align: left;
-  white-space: nowrap;
-  line-height: 16px;
-  margin: 5px 0 0 32px;
-}
-
-.text_4 {
-  width: 78px;
-  height: 16px;
-  overflow-wrap: break-word;
-  color: rgba(255, 255, 255, 0.5);
-  font-size: 16px;
-  font-family: Microsoft YaHei UI-Regular;
-  font-weight: NaN;
-  text-align: left;
-  white-space: nowrap;
-  line-height: 16px;
-  margin: 5px 0 0 35px;
-}
-
-.text_5 {
-  width: 78px;
-  height: 16px;
-  overflow-wrap: break-word;
-  color: rgba(255, 255, 255, 0.5);
-  font-size: 16px;
-  font-family: Microsoft YaHei UI-Regular;
-  font-weight: NaN;
-  text-align: left;
-  white-space: nowrap;
-  line-height: 16px;
-  margin: 5px 0 0 37px;
-}
-
-.text_6 {
-  width: 64px;
-  height: 16px;
-  overflow-wrap: break-word;
-  color: rgba(255, 255, 255, 0.5);
-  font-size: 16px;
-  font-family: Microsoft YaHei UI-Regular;
-  font-weight: NaN;
-  text-align: left;
-  white-space: nowrap;
-  line-height: 16px;
-  margin: 5px 0 0 44px;
+  a {
+    position: relative;
+    z-index: 2;
+    display: block;
+    width: 100%;
+    height: 100%;
+  }
 }
 
 .image-wrapper_1 {
@@ -144,7 +101,7 @@
 .group_3 {
   width: 100%;
   height: 681px;
-  background: url(public/img/bg-c.png) 100% no-repeat;
+  background: var(--bg-c) 100% no-repeat;
   background-size: 100% 100%;
   gap: 150px;
 }
@@ -155,8 +112,6 @@
   }
 }
 
-.group_4 {}
-
 .text-group_1 {
   width: 256px;
   height: 65px;
@@ -203,6 +158,7 @@
   padding-right: 40px;
   cursor: pointer;
 }
+
 .text_11 {
   color: rgba(34, 34, 34, 1);
   font-size: 22px;
@@ -260,8 +216,8 @@
 
 .section_1 {
   height: 508px;
-  background: url(public/img/t2.png) 100% no-repeat;
-  background-size: 100% 100%;
+  background: var(--bg-t2) no-repeat;
+  background-size: 100%;
   width: 549px;
   z-index: 10;
 }
@@ -282,8 +238,9 @@
   left: 50%;
   transform: translate(-50%, -50%);
 }
-.image_5s{
-  background:url(public/img/m1.png);
+
+.image_5s {
+  background: var(--m1);
   width: 549px;
   height: 508px;
   z-index: 1;
@@ -296,7 +253,7 @@
   position: relative;
   width: 100%;
   height: 991px;
-  background: url(public/img/bg-b.png) 100% no-repeat;
+  background: var(--bg-b) 100% no-repeat;
   background-size: 100% 100%;
   justify-content: flex-center;
 }
@@ -307,7 +264,7 @@
   font-weight: 700;
   text-align: center;
   white-space: nowrap;
-  margin:70px 0px 10px 0px;
+  margin: 70px 0px 10px 0px;
 }
 
 .text_15 {
@@ -323,23 +280,26 @@
 }
 
 .section_2s {
-  background-image: linear-gradient( 180deg, rgba(108, 169, 255, 0.2) 0%, rgba(255,255,255,0.2) 49%);
+  background-image: linear-gradient(180deg, rgba(108, 169, 255, 0.2) 0%, rgba(255, 255, 255, 0.2) 49%);
   border-radius: 8px 8px 8px 8px;
   height: 745px;
-  background-color:#ffffff; 
+  background-color: #ffffff;
 }
-.section_2sa{
-  background-image: linear-gradient( 180deg, rgba(252, 116, 40, 0.2) 0%, rgba(255,255,255,0.2) 49%);
+
+.section_2sa {
+  background-image: linear-gradient(180deg, rgba(252, 116, 40, 0.2) 0%, rgba(255, 255, 255, 0.2) 49%);
   border-radius: 8px 8px 8px 8px;
   height: 745px;
-  background-color:#ffffff;
+  background-color: #ffffff;
 }
+
 .group_6 {
   height: 154px;
   width: 615px;
   position: relative;
   color: #0256FF;
 }
+
 .group_6s {
   color: #FC7428;
   height: 154px;
@@ -377,6 +337,7 @@
   margin-top: 10px;
   width: 44px;
 }
+
 .image-wrapper_3s {
   height: 120px;
   width: 120px;
@@ -386,7 +347,8 @@
   width: 44px;
   height: 44px;
 }
-.label_1s{
+
+.label_1s {
   width: 120px;
   height: 120px;
 }
@@ -435,13 +397,6 @@
   width: 44px;
 }
 
-.group_8 {
-  height: 40px;
-  background: url(./img/MasterDDSSlicePNG1a5e6e684737749502d58f77fa993ad5.png) 100% no-repeat;
-  background-size: 100% 100%;
-  width: 40px;
-  margin: 2px 0 0 2px;
-}
 
 .group_9 {
   width: 18px;
@@ -454,11 +409,13 @@
   height: 63px;
   cursor: pointer;
 }
-.text-group_3:hover .text_18{
-  color: #0256FF!important;
+
+.text-group_3:hover .text_18 {
+  color: #0256FF !important;
 }
-.text-group_3:hover .text_19{
-  color: #0256FF!important;
+
+.text-group_3:hover .text_19 {
+  color: #0256FF !important;
 }
 
 .text-group_3_3 {
@@ -466,11 +423,13 @@
   height: 63px;
   cursor: pointer;
 }
-.text-group_3_3:hover .text_18{
-  color: #FC7428!important;
+
+.text-group_3_3:hover .text_18 {
+  color: #FC7428 !important;
 }
-.text-group_3_3:hover .text_19{
-  color: #FC7428!important;
+
+.text-group_3_3:hover .text_19 {
+  color: #FC7428 !important;
 }
 
 .text_18 {
@@ -503,15 +462,16 @@
   background-color: #EEEEEE;
   width: 524px;
   height: 1px;
-  margin-left:30px;
-  margin-top:30px;
+  margin-left: 30px;
+  margin-top: 30px;
 }
+
 .group_10s {
   background-color: #77A5FF;
   width: 524px;
   height: 1px;
   opacity: 0.2;
-  margin:0 30px;
+  margin: 0 30px;
 }
 
 .group_11 {
@@ -651,7 +611,7 @@
   font-weight: 700;
   text-align: center;
   white-space: nowrap;
-  margin:70px 0px 10px 0px;
+  margin: 70px 0px 10px 0px;
 }
 
 .group_14 {
@@ -672,25 +632,29 @@
   margin-top: 30px;
   position: relative;
 }
+
 @media screen and (max-width: 1440px) {
   .dswper {
     width: 100%;
   }
 }
-.dswper_left{
+
+.dswper_left {
   position: absolute;
   top: 50%;
   left: 10%;
   transform: translate(-50%, -50%);
   z-index: 100;
 }
-.dswper_right{
+
+.dswper_right {
   position: absolute;
   top: 50%;
   right: 7.5%;
   transform: translate(-50%, -50%);
   z-index: 100;
 }
+
 .text_25 {
   overflow-wrap: break-word;
   color: #222222;
@@ -999,7 +963,7 @@
 }
 
 .text-wrapper_11 {
-  margin-top:10px;
+  margin-top: 10px;
   text-align: center;
 }
 
@@ -1310,16 +1274,6 @@
   margin: 10px 0 0 22px;
 }
 
-.image-wrapper_6 {
-  height: 800px;
-  background: url(./img/MasterDDSSlicePNG48f5ba5dc080bccf7accff651d995da0.png) 100% no-repeat;
-  background-size: 100% 100%;
-  width: 1200px;
-  position: absolute;
-  left: -1545px;
-  top: 1765px;
-}
-
 .image_10 {
   width: 100px;
   height: 4px;
@@ -1329,14 +1283,15 @@
 .box_17 {
   width: 100%;
   height: 490px;
-  background: url(public/img/bg-4.png) 100% no-repeat;
+  background: var(--bg-4) 100% no-repeat;
   background-size: 100% 100%;
   justify-content: flex-center;
 }
+
 .box_18 {
   width: 100%;
   height: 465px;
-  background: url(public/img/bg-5.png) 100% no-repeat;
+  background: var(--bg-5) 100% no-repeat;
   background-size: 100% 100%;
   justify-content: flex-center;
 }
@@ -1570,11 +1525,13 @@
   margin: 0 auto;
   margin-top: 30px;
 }
-@media screen  and (max-width: 1440px){
+
+@media screen and (max-width: 1440px) {
   .group_29 {
     width: 87%;
   }
 }
+
 .image-wrapper_7 {
   box-shadow: 0px 4px 10px 0px rgba(228, 228, 228, 1);
   background-color: rgba(255, 255, 255, 1);
@@ -1815,9 +1772,10 @@
   background-color: rgba(216, 216, 216, 0.2);
   width: 63%;
   height: 1px;
-  margin:  0 auto;
+  margin: 0 auto;
   margin-top: 32px;
 }
+
 @media screen and (max-width: 1440px) {
   .group_31 {
     width: 94%;
@@ -1828,7 +1786,7 @@
   width: 100%;
   height: 125px;
   margin: 29px 0 44px 0px;
-  justify-content:center;
+  justify-content: center;
 }
 
 .text-wrapper_14 {
@@ -1987,45 +1945,48 @@ button:active {
   display: flex;
   align-items: flex-end;
 }
+
 .three-line-ellipsis {
-	display: -webkit-box;
-	/* 使用弹性盒模型 */
-	-webkit-box-orient: vertical;
-	/* 内容垂直排列 */
-	-webkit-line-clamp: 3;
-	/* 限制显示的行数 */
-	overflow: hidden;
-	/* 隐藏超出部分 */
-	text-overflow: ellipsis;
-	/* 超出部分显示省略号 */
-	word-break: break-all;
-	/* 允许单词内换行（可选） */
-}
-.one-line-ellipsis {
-	display: -webkit-box;
-	/* 使用弹性盒模型 */
-	-webkit-box-orient: vertical;
-	/* 内容垂直排列 */
-  -webkit-line-clamp: 1;
-	/* 限制显示的行数 */
-	overflow: hidden;
-	/* 隐藏超出部分 */
-	text-overflow: ellipsis;
-	/* 超出部分显示省略号 */
-	word-break: break-all;
-	/* 允许单词内换行（可选） */
-}
-.two-line-ellipsis{
   display: -webkit-box;
-	/* 使用弹性盒模型 */
-	-webkit-box-orient: vertical;
-	/* 内容垂直排列 */
+  /* 使用弹性盒模型 */
+  -webkit-box-orient: vertical;
+  /* 内容垂直排列 */
+  -webkit-line-clamp: 3;
+  /* 限制显示的行数 */
+  overflow: hidden;
+  /* 隐藏超出部分 */
+  text-overflow: ellipsis;
+  /* 超出部分显示省略号 */
+  word-break: break-all;
+  /* 允许单词内换行（可选） */
+}
+
+.one-line-ellipsis {
+  display: -webkit-box;
+  /* 使用弹性盒模型 */
+  -webkit-box-orient: vertical;
+  /* 内容垂直排列 */
+  -webkit-line-clamp: 1;
+  /* 限制显示的行数 */
+  overflow: hidden;
+  /* 隐藏超出部分 */
+  text-overflow: ellipsis;
+  /* 超出部分显示省略号 */
+  word-break: break-all;
+  /* 允许单词内换行（可选） */
+}
+
+.two-line-ellipsis {
+  display: -webkit-box;
+  /* 使用弹性盒模型 */
+  -webkit-box-orient: vertical;
+  /* 内容垂直排列 */
   -webkit-line-clamp: 2;
-	/* 限制显示的行数 */
-	overflow: hidden;
-	/* 隐藏超出部分 */
-	text-overflow: ellipsis;
-	/* 超出部分显示省略号 */
-	word-break: break-all;
-	/* 允许单词内换行（可选） */
+  /* 限制显示的行数 */
+  overflow: hidden;
+  /* 隐藏超出部分 */
+  text-overflow: ellipsis;
+  /* 超出部分显示省略号 */
+  word-break: break-all;
+  /* 允许单词内换行（可选） */
 }
\ No newline at end of file
diff --git a/components/AppFooter.vue b/components/AppFooter.vue
index 5c86581..2d9ab75 100644
--- a/components/AppFooter.vue
+++ b/components/AppFooter.vue
@@ -2,19 +2,31 @@
   <!-- PC端布局 -->
   <div class="group_30 flex-col pc-footer">
     <div class="text-wrapper_13 flex-row">
-      <span class="text_67">企业首页</span>
-      <span class="text_68">产品&amp;服务</span>
-      <span class="text_69">灵睿&amp;我们</span>
-      <span class="text_70">客户&amp;评价</span>
-      <span class="text_71">社会&amp;责任</span>
-      <span class="text_72">联系我们</span>
+      <NuxtLink to="/">
+        <span class="text_67">企业首页</span>
+      </NuxtLink>
+      <NuxtLink to="/proServices/">
+        <span class="text_68">产品&amp;服务</span>
+      </NuxtLink>
+      <NuxtLink to="/aboutUs/">
+        <span class="text_69">灵睿&amp;我们</span>
+      </NuxtLink>
+      <NuxtLink to="/customerReviews/">
+        <span class="text_70">客户&amp;评价</span>
+      </NuxtLink>
+      <NuxtLink to="/societyDuty/">
+        <span class="text_71">社会&amp;责任</span>
+      </NuxtLink>
+      <NuxtLink to="/concatUs/">
+        <span class="text_72">加入我们</span>
+      </NuxtLink>
       <span class="text_73">联系电话：400-080-0379</span>
     </div>
     <div class="group_31 flex-col"></div>
     <div class="group_32 flex-row">
       <div class="text-wrapper_14 flex-col">
         <span class="text_74">
-          洛阳灵睿网络技术有限公司|洛阳网络公司|洛阳网络推广|洛阳易站通总代理|洛阳微客红包|洛阳微信营销
+          洛阳灵睿网络技术有限公司|洛阳网络公司|洛阳网络推广|洛阳易站通总代理|洛阳本地自媒体|洛阳短视频
         </span>
         <span class="text_75">法律顾问：河南森合律师事务机构</span>
         <span class="text_76">
@@ -60,7 +72,7 @@
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/index.css';
+@import '@/assets/index.scss';
 
 /* PC端默认样式保持不变 */
 .mobile-footer {
diff --git a/components/AppHeader.vue b/components/AppHeader.vue
index 171abcc..bb0c236 100644
--- a/components/AppHeader.vue
+++ b/components/AppHeader.vue
@@ -1,43 +1,52 @@
 <template>
   <div class="page flex-col">
-    <div class="group_1 flex-col">
-      <div class="flex-row" :class="route.name=='info-id'?'box_1 box_1_info':'box_1'">
-        <img v-if="route.name!='info-id'" class="image_1" referrerpolicy="no-referrer" src="public/img/logo.png" />
-        <img v-if="route.name=='info-id'" class="image_1" referrerpolicy="no-referrer" src="public/img/logo1.png" />
+    <div class="group_1 flex-col" :class="[(isScrolled || isHovered) && route.name != 'info-id' ? 'topfix' : '']"
+      @mouseenter="isScrolled = true;" @mouseleave="checkBoxHeight()">
+      <div class="flex-row" :class="route.name == 'info-id' ? 'box_1 box_1_info' : 'box_1'">
+        <img v-if="route.name != 'info-id' && !isScrolled" class="image_1" referrerpolicy="no-referrer"
+          :src="`${cdnUrl}/img/logo.png`" />
+        <img v-if="route.name != 'info-id' && isScrolled" class="image_1" referrerpolicy="no-referrer"
+          :src="`${cdnUrl}/img/logo1.png`" />
+        <img v-if="route.name == 'info-id'" class="image_1" referrerpolicy="no-referrer"
+          :src="`${cdnUrl}/img/logo1.png`" />
         <!-- Desktop Navigation -->
         <div class="desktop-nav">
-          <span :class="route.name=='info-id'?'text_black text_1':'text_1'">
-            <NuxtLink to="/" :class="{ 'active': route.path === '/' }">
+          <div data-title="企业首页"
+            :class="[route.name == 'info-id' ? 'text_black text_1' : 'text_1', { 'text_black': isScrolled }]">
+            <NuxtLink to="/" :class="[route.path === '/' ? 'active' : '']">
               企业首页
             </NuxtLink>
-          </span>
-          <span :class="route.name=='info-id'?'text_black text_2':'text_2'">
-          <NuxtLink to="/proServices/" :class="{ 'active': route.path === '/proServices/' || route.path === '/proServices_con/' ||  route.path === '/proServices_con'  ||  route.path === '/proServices' }">
-            产品&amp;服务
-          </NuxtLink>
-          </span>
-          <span :class="route.name=='info-id'?'text_black text_3':'text_3'">
-          <NuxtLink to="/aboutUs/" :class="{ 'active': route.path === '/aboutUs/' || route.path === '/aboutUs' }">
-            灵睿&amp;我们
-          </NuxtLink>
-          </span>
-          <span :class="route.name=='info-id'?'text_black text_4':'text_4'">
-          <NuxtLink to="/customerReviews/" :class="{ 'active': route.path === '/customerReviews/' || route.path === '/customerReviews' }">
-            客户&amp;评价
-          </NuxtLink>
-          </span>
-          <span :class="route.name=='info-id'?'text_5_info':'text_5'">
-            <NuxtLink to="/societyDuty/" :class="{ 'active': route.path === '/societyDuty/' || route.path === '/societyDuty' || route.path === '/societyDutyNew/' || route.path === '/societyDutyNew' }">
+          </div>
+          <div :class="[route.name == 'info-id' ? 'text_black text_1' : 'text_1', { 'text_black': isScrolled }]">
+            <NuxtLink to="/proServices_con/"
+              :class="[route.path === '/proServices/' || route.path === '/proServices_con/' || route.path === '/proServices_con' || route.path === '/proServices' ? 'active' : '']">
+              产品&amp;服务
+            </NuxtLink>
+          </div>
+          <div :class="[route.name == 'info-id' ? 'text_black text_1' : 'text_1', { 'text_black': isScrolled }]">
+            <NuxtLink to="/aboutUs/" :class="[route.path === '/aboutUs/' || route.path === '/aboutUs' ? 'active' : '']">
+              灵睿&amp;我们
+            </NuxtLink>
+          </div>
+          <div :class="[route.name == 'info-id' ? 'text_black text_1' : 'text_1', { 'text_black': isScrolled }]">
+            <NuxtLink to="/customerReviews/"
+              :class="[route.path === '/customerReviews/' || route.path === '/customerReviews' ? 'active' : '']">
+              客户&amp;评价
+            </NuxtLink>
+          </div>
+          <div :class="[route.name == 'info-id' ? 'text_black text_1' : 'text_1', { 'text_black': isScrolled }]">
+            <NuxtLink to="/societyDutyNew/"
+              :class="[route.path === '/societyDuty/' || route.path === '/societyDuty' || route.path === '/societyDutyNew/' || route.path === '/societyDutyNew' ? 'active' : '']">
               社会&amp;责任
             </NuxtLink>
-          </span>
-          <span :class="route.name=='info-id'?'text_black text_6':'text_6'">
-          <NuxtLink to="/concatUs/" :class="{ 'active': route.path === '/concatUs/' || route.path === '/concatUs'}">
-            加入我们
-          </NuxtLink>
-          </span>
+          </div>
+          <div :class="[route.name == 'info-id' ? 'text_black text_1' : 'text_1', { 'text_black': isScrolled }]">
+            <NuxtLink to="/concatUs/"
+              :class="[route.path === '/concatUs/' || route.path === '/concatUs' ? 'active' : '']">
+              加入我们
+            </NuxtLink>
+          </div>
         </div>
-
         <!-- Mobile Hamburger Button -->
         <div class="mobile-menu-btn" @click="toggleMobileMenu">
           <div class="hamburger" :class="{ 'is-active': isMobileMenuOpen }">
@@ -47,7 +56,6 @@
           </div>
         </div>
       </div>
-
       <!-- Mobile Navigation -->
       <div class="mobile-nav" v-if="isMobileMenuOpen">
         <span class="mobile-nav-item">企业首页</span>
@@ -58,49 +66,108 @@
         <span class="mobile-nav-item">联系我们</span>
       </div>
     </div>
+    <transition name="fade-scale">
+      <div v-if="scrollTop > 1000" class="back-to-top">
+        <img @click="openTop()" :src="`${cdnUrl}/img/get_top.png`" alt="返回顶部" />
+      </div>
+    </transition>
   </div>
 </template>
 
 <script lang="ts" setup>
-import { ref } from 'vue'
+import { ref, onMounted, onUnmounted } from 'vue'
 import { useRoute } from 'vue-router'
 import { useI18n } from 'vue-i18n'
 import { useStore } from '~/store'
-
+const cdnUrl = useCdn()
 const store = useStore()
 const route = useRoute()
 const { locale } = useI18n()
 const isMobileMenuOpen = ref(false)
+const isScrolled = ref(false)
+const isHovered = ref(false)
+const scrollTop = ref(0);
+const handleScroll = () => {
+  isScrolled.value = window.scrollY > 0;
+  scrollTop.value = window.scrollY;
+}
+
+onMounted(() => {
+  window.addEventListener('scroll', handleScroll)
+  // 初始化时检查一次滚动位置
+  handleScroll()
+})
+
+const checkBoxHeight = () => {
+  if (window.scrollY == 0) {
+    isScrolled.value = false;
+  }
+}
+
+onUnmounted(() => {
+  window.removeEventListener('scroll', handleScroll)
+})
 
 const toggleMobileMenu = () => {
   isMobileMenuOpen.value = !isMobileMenuOpen.value
 }
+const openTop = () => {
+  //返回顶部
+  window.scrollTo(0, 0);
+}
 
 console.log(route)
 </script>
 
 <style lang="scss" scoped>
-@import '@/assets/index.css';
+@import '@/assets/index.scss';
+
+.group_1 {
+  transition: all 0.3s ease-in-out;
+  background-color: transparent;
+}
 
 .box_1 {
   justify-content: center;
   padding: 0 20px;
   align-items: center;
   position: relative;
+  transition: all 0.3s ease-in-out;
+}
+
+.topfix {
+  background: rgba(255, 255, 255, 1);
+  -webkit-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
+  -moz-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
+  -o-box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
+  box-shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.2);
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  z-index: 1000;
+  transition: all 0.3s ease-in-out;
+  transform: translateY(0);
+  opacity: 1;
+}
+
+.group_1:not(.topfix) {
+  background-color: transparent;
+  box-shadow: none;
+  transform: translateY(0);
+  opacity: 1;
 }
 
 .desktop-nav {
   display: flex;
   align-items: center;
   gap: 20px;
+  padding-left: 150px;
 
   @media (max-width: 768px) {
     display: none;
   }
 }
-.desktop-nav_top{
-
-}
 
 .mobile-menu-btn {
   display: none;
@@ -188,36 +255,68 @@ console.log(route)
   }
 }
 
+.text_black {
+  color: #000000;
+  transition: color 0.1s ease-in-out;
+}
 
-.desktop-nav {
-  span:hover {
+.text_black_w {
+  color: #ffffff;
+  font-weight: 600;
+  transition: color 0.3s ease-in-out;
+}
+
+.text_5_info {
+  background-color: #FC7428;
+  height: 90px !important;
+  line-height: 90px !important;
+  padding: 0 20px;
+  color: #ffffff !important;
+  text-align: center;
+  transition: all 0.3s ease-in-out;
+}
+
+.box_1_info {
+  height: 90px !important;
+  margin: 0px !important;
+  transition: all 0.3s ease-in-out;
+}
+
+.image_1 {
+  transition: all 0.3s ease-in-out;
+}
+
+.back-to-top {
+  position: fixed;
+  bottom: 20%;
+  right: 20px;
+  z-index: 1000;
+  
+  img {
+    height: 60px;
     cursor: pointer;
-    color: #fff;
-  }
-  a{
-    cursor: pointer;
-    &.active{
-      color: #fff;
+    transition: transform 0.3s ease;
+    
+    &:hover {
+      transform: scale(1.1);
     }
   }
-  
 }
-.text_black{
-  color: #000000!important;
+
+.fade-scale-enter-active,
+.fade-scale-leave-active {
+  transition: all 0.3s ease;
 }
-.text_5_info{
-  	background-color: #FC7428;
-	height: 70px !important;
-	width: 120px !important;
-	line-height: 70px !important;
-	padding: 0px 20px !important;
-  margin-left: 30px;
-  color: #ffffff!important;
-  text-align: center;
+
+.fade-scale-enter-from,
+.fade-scale-leave-to {
+  opacity: 0;
+  transform: scale(0.8);
 }
-.box_1_info {
-	height: 50px !important;
-	margin: 0px !important;
-	padding-top: 20px !important;
+
+.fade-scale-enter-to,
+.fade-scale-leave-from {
+  opacity: 1;
+  transform: scale(1);
 }
 </style>
diff --git a/components/CdnImageExample.vue b/components/CdnImageExample.vue
deleted file mode 100644
index e69de29..0000000
diff --git a/composables/useCdn.ts b/composables/useCdn.ts
new file mode 100644
index 0000000..060fe90
--- /dev/null
+++ b/composables/useCdn.ts
@@ -0,0 +1,4 @@
+export const useCdn = () => {
+  const nuxtApp = useNuxtApp()
+  return nuxtApp.$cdnUrl
+} 
\ No newline at end of file
diff --git a/nuxt.config.ts b/nuxt.config.ts
index 7883af2..06e5b1e 100644
--- a/nuxt.config.ts
+++ b/nuxt.config.ts
@@ -2,6 +2,11 @@
 import { defineNuxtConfig } from 'nuxt/config'
 
 export default defineNuxtConfig({
+  runtimeConfig: {
+    public: {
+      cdnDomain: 'https://cdn.web.0rui.cn'
+    }
+  },
   app: {
     baseURL:'/web/',
   },
diff --git a/pages/aboutUs.vue b/pages/aboutUs.vue
index 63b47de..e6535ac 100644
--- a/pages/aboutUs.vue
+++ b/pages/aboutUs.vue
@@ -4,22 +4,22 @@
 		<div class="group_666" style="position: relative;height: 550px;">
 			<swiper class="swiper-container h-full" @swiper="onSwiperNews" v-bind="swiperOptionsNews">
 				<swiper-slide>
-					<img src="public/img/abus.png" style="width: 100%;">
+					<img :src="`${cdnUrl}/img/abus.png`" style="width: 100%;">
 				</swiper-slide>
 				<swiper-slide>
-					<img src="public/img/abus.png" style="width: 100%;">
+					<img :src="`${cdnUrl}/img/abus.png`" style="width: 100%;">
 				</swiper-slide>
 			</swiper>
 			<!-- <div style="position: absolute;bottom: 50px;left: 0;width: 100%;z-index: 100;">
 				<div class="flex-row justify-center align-center">
 					<div>
-						<img src="public/img/left.png" alt="">
+						<img :src="`${cdnUrl}/img/left.png" alt="">
 					</div>
 					<div style="margin: 0px 20px;">
-						<img src="public/img/morse.png" alt="">
+						<img :src="`${cdnUrl}/img/morse.png" alt="">
 					</div>
 					<div>
-						<img src="public/img/right.png" alt="">
+						<img :src="`${cdnUrl}/img/right.png" alt="">
 					</div>
 				</div>
 			</div> -->
@@ -35,7 +35,8 @@
 						<div class="text-group_1 flex-col justify-between" style="width: 100%;">
 							<span class="text_7" style="width: 432px;position: relative;">
 								洛阳灵睿网络技术有限公司
-								<img src="public/img/about/xing.png" alt="" style="position: absolute;top: -10px; right: 0;"/>
+								<img :src="`${cdnUrl}/img/about/xing.png`" alt=""
+									style="position: absolute;top: -10px; right: 0;" />
 							</span>
 							<span class="text_8" style="width: 100%;color: #3D3D3D;">
 								智慧信息化与数字内容服务领航者
@@ -48,49 +49,58 @@
 						<span class="textss13">
 							专注互联网领域，发散新媒体创思，执着深耕口碑服务，扎实落地品牌内容，共创新信息化与内容服务业态。
 						</span>
-						<div class="group_28 flex-row  justify-between numberTopBox" style="width: 592px;text-align: center;">
+						<div class="group_28 flex-row  justify-between numberTopBox"
+							style="width: 592px;text-align: center;">
 							<div class="text-group_9 flex-col justify-between" style="width: auto;height: 80px;">
 								<span class="text_55" style="font-size: 32px;text-align: center;width: auto;">
 									<n-number-animation :duration="5000" ref="numberAnimationInstRef" :active="false"
 										:from="0" :to="1000"></n-number-animation>+</span>
 								<span class="">服务客户</span>
 							</div>
-							
-							
+
+
 							<div class="text-group_10 flex-col justify-between" style="width: auto;height: 80px;">
-								<span class="text_58" style="font-size: 32px;text-align: center;width: auto;"><n-number-animation :duration="5000"
-										ref="numberAnimationInstRefKH" :active="false" :from="0"
+								<span class="text_58"
+									style="font-size: 32px;text-align: center;width: auto;"><n-number-animation
+										:duration="5000" ref="numberAnimationInstRefKH" :active="false" :from="0"
 										:to="19"></n-number-animation>年</span>
-								<span class="">技术沉淀</span>	
+								<span class="">技术沉淀</span>
 							</div>
 
 							<div class="text-group_11 flex-col justify-between" style="width: auto;height: 80px;">
-								<span class="text_61" style="font-size: 32px;text-align: center;width: auto;"><n-number-animation :duration="5000"
-										ref="numberAnimationInstRefJS" :active="false" :from="0"
+								<span class="text_61"
+									style="font-size: 32px;text-align: center;width: auto;"><n-number-animation
+										:duration="5000" ref="numberAnimationInstRefJS" :active="false" :from="0"
 										:to="100"></n-number-animation>+</span>
-								<span class="">覆盖行业</span>	
+								<span class="">覆盖行业</span>
 							</div>
-							
-							
+
+
 							<div class="text-group_12 flex-col justify-between" style="width: auto;height: 80px;">
-								<span class="text_64" style="font-size: 32px;text-align: center;width: auto;"><n-number-animation :duration="5000"
-										ref="numberAnimationInstRefHY" :active="false" :from="0"
+								<span class="text_64"
+									style="font-size: 32px;text-align: center;width: auto;"><n-number-animation
+										:duration="5000" ref="numberAnimationInstRefHY" :active="false" :from="0"
 										:to="30"></n-number-animation>+</span>
 								<span class="">技术团队</span>
 							</div>
-							
+
 						</div>
 					</div>
 				</div>
 				<div class="flex rongyu1s bottomBox">
-					<div class="flex" style="width: 13%;align-items: center;">
-						<img style="margin-left: 20px;" src="/public/img/about/jiangbei.png" alt="">
+					<div class="flex" style="width: 14%;align-items: center;">
+						<img style="margin-left: 20px;" :src="`${cdnUrl}/img/about/jiangbei.png`" alt="">
 						<span class="spanst">荣誉标签：</span>
 					</div>
-					<div class="flex" style="width: 87%;justify-content: space-between;">
-						<span class="spans">中国电子商务协会工业电商委员会河南分会单位</span>
-						<span class="spans">新华网、人民网、今日头条新闻联络中心</span>
-						<span class="spans" style="margin-right:20px;">灵睿与郑州、洛阳等地的网信以及网监系统保持长期合作获。</span>
+					<div class="flex" style="width: 85%;overflow: hidden;">
+						<n-marquee>
+							<div class="spans" style="margin-right: 50px;display: inline-block;">中国电子商务协会工业电商委员会河南分会单位
+							</div>
+							<div class="spans" style="display: inline-block;margin-right: 50px;">新华网、人民网、今日头条新闻联络中心
+							</div>
+							<div class="spans" style="display: inline-block;margin-right: 50px;">
+								灵睿与郑州、洛阳等地的网信以及网监系统保持长期合作获</div>
+						</n-marquee>
 					</div>
 				</div>
 			</div>
@@ -103,15 +113,16 @@
 						<div class="text-group_1 flex-col justify-between" style="width: 100%;">
 							<span class="text_7" style="width: 242px;position: relative;">
 								睿创团队介绍
-								<img src="public/img/about/xing.png" alt="" style="position: absolute;top: -10px; right: 0;"/>
+								<img :src="`${cdnUrl}/img/about/xing.png`" alt=""
+									style="position: absolute;top: -10px; right: 0;" />
 							</span>
 						</div>
 
 						<span class="text_12" style="height: auto;font-size: 14px;">
 							灵睿基因一直是一群年轻的青年人组成，我们致力打造专业的团队化运营模式，集合程序猿、设计狗、运营喵的创作者联盟。年轻不是资本，敢重新定义年轻才是，在互联网领域，我们致力做一支专业，积极，上进的年轻团队；80后主导，90后主力，00后紧随。以“为客户创造价值 用互联网思维打造品牌”为使命。以“正直诚信、实干勇敢、协作共赢、创业精神”为价值观。努力发展，破茧成蝶。
 						</span>
-						
-						
+
+
 					</div>
 
 					<div class="group_5 flex-col justify-center align-center rightBox">
@@ -120,23 +131,21 @@
 				</div>
 			</div>
 		</div>
-		<div class="box_7 flex-col" style="background: url(public/img/about/ruanzhu.png) 100% no-repeat;;">
+		<div class="box_7 flex-col">
 			<span class="text_24 topBox">著作权和荣誉证书</span>
 			<span class="text_15 topBox">Company&nbsp;environment</span>
-
-
 			<div class="dswper" style="margin-top: 30px;">
-				<swiper ref="swiper_exp" :slidesPerView="5" loop :loopedSlides="3" :autoplay="true" centeredSlides
-					:modules="modules" :watchSlidesProgress="true" @swiper="onSwiperExp" >
-					<swiper-slide v-for="(item,index) in 21" :key="index" style="padding: 0 10px;">
+				<swiper ref="swiper_exp" :slidesPerView="5" loop :loopedSlides="3" :autoplay="{ delay: 2000 }"
+					centeredSlides :modules="modules" :watchSlidesProgress="true" @swiper="onSwiperExp">
+					<swiper-slide v-for="(item, index) in 21" :key="index" style="padding: 0 10px;">
 						<img :src="`/img/about/${item}.jpg`" style="width: 100%;">
 					</swiper-slide>
 				</swiper>
 				<!-- <div class="dswper_left">
-					<img src="public/img/opl.png">
+					<img :src="`${cdnUrl}/img/opl.png">
 				</div>
 				<div class="dswper_right">
-					<img src="public/img/opr.png">
+					<img :src="`${cdnUrl}/img/opr.png">
 				</div> -->
 				<div class="flex-row justify-center align-center absolute w-full bottom-[-50px]" style="gap: 30px;">
 					<div v-for="(_, index) in 3" :key="index" style="width: 25px; height: 5px;"
@@ -152,7 +161,7 @@
 			<div class="group_29 grid grid-cols-6 gap-6 mr-auto">
 				<div class="bottom_imgs topSj"></div>
 				<!-- <div v-for="item in 18" class="">
-					<img class="image_11 topSj" referrerpolicy="no-referrer" src="public/img/q1.png" />
+					<img class="image_11 topSj" referrerpolicy="no-referrer" :src="`${cdnUrl}/img/q1.png" />
 				</div> -->
 			</div>
 		</div>
@@ -165,7 +174,7 @@ import { nextTick, ref } from 'vue'
 import 'swiper/css'
 import { Autoplay, Navigation, Pagination, Scrollbar, A11y, EffectCoverflow, EffectFade } from "swiper/modules";
 import ScrollReveal from 'scrollreveal';
-import { NNumberAnimation } from 'naive-ui'
+import { NNumberAnimation, NMarquee } from 'naive-ui'
 let modules = [Autoplay, A11y, EffectCoverflow, EffectFade];
 
 import "swiper/css";
@@ -181,6 +190,7 @@ import $api from '@/service/webRequest'
 import { useI18n } from 'vue-i18n'
 import { useStore } from '~/store'
 const { locale } = useI18n()
+const cdnUrl = useCdn()
 
 let newsSwiper: any = null
 const onSwiperNews = (swiper: any) => {
@@ -202,7 +212,7 @@ const swiperOptionsNews = {
 		prevEl: '#swipen_next',
 	},
 }
-const activeSlideIndex=ref(0);
+const activeSlideIndex = ref(0);
 let vesSwiper: any = null
 const onSwiperExp = (swiper: any) => {
 	vesSwiper = swiper
@@ -216,7 +226,7 @@ const swiper_exp = ref();
 
 // 新闻数据
 onMounted(() => {
-		animate()
+	animate()
 })
 const numberAnimationInstRef = ref()
 const numberAnimationInstRefKH = ref()
@@ -296,9 +306,9 @@ const animate = () => {
 }
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 @import "@/assets/animate/animate.min.css";
-@import "@/assets/index.css";
+@import "@/assets/index.scss";
 
 :deep(.dswper .swiper-slide-next) {
 	transform: translate3d(0px, 0px, -507px) rotateX(0deg) rotateY(0deg) scale(1) !important;
@@ -323,7 +333,7 @@ const animate = () => {
 }
 
 .bottom_imgs {
-	background: url(/public/img/qall.png);
+	background: var(--qall);
 	width: 1230px;
 	height: 272px;
 	background-size: 100%;
@@ -333,27 +343,29 @@ const animate = () => {
 
 .section_1sa {
 	height: 410px;
-	background: url(/public/img/about/t1a.png) 100% no-repeat;
+	background: var(--t1a) 100% no-repeat;
 	width: 576px;
 	z-index: 10;
 }
+
 .section_1sb {
 	height: 410px;
-	background: url(/public/img/about/t1b.png) 100% no-repeat;
+	background: var(--t1b) 100% no-repeat;
 	width: 576px;
 	z-index: 10;
 }
 
 
-.textss13{
+.textss13 {
 	width: 584px;
-    font-weight: 600;
-    font-size: 14px;
-    color: #768597;
-    line-height: 22px;
-    font-family: Microsoft YaHei UI-Regular;
+	font-weight: 600;
+	font-size: 14px;
+	color: #768597;
+	line-height: 22px;
+	font-family: Microsoft YaHei UI-Regular;
 }
-.rongyu1s{
+
+.rongyu1s {
 	width: 63%;
 	height: 68px;
 	background: #F8F8F8;
@@ -361,7 +373,8 @@ const animate = () => {
 	align-items: center;
 	margin: 0 auto;
 	margin-bottom: 70px;
-	.spanst{
+
+	.spanst {
 		width: 90px;
 		height: 32px;
 		font-family: Microsoft YaHei UI, Microsoft YaHei UI;
@@ -374,7 +387,8 @@ const animate = () => {
 		text-transform: none;
 		margin-left: 20px;
 	}
-	.spans{
+
+	.spans {
 		// width: px;
 		height: 21px;
 		font-family: Microsoft YaHei UI, Microsoft YaHei UI;
@@ -387,4 +401,12 @@ const animate = () => {
 		text-transform: none;
 	}
 }
+
+.n-marquee {
+	width: 100%;
+}
+
+.box_7 {
+	background: var(--ruanzhu) 100% no-repeat;
+}
 </style>
diff --git a/pages/concatUs.vue b/pages/concatUs.vue
index 0644d92..6d971de 100644
--- a/pages/concatUs.vue
+++ b/pages/concatUs.vue
@@ -4,22 +4,22 @@
 		<div class="group_666" style="position: relative;height: 550px;">
 			<swiper class="swiper-container h-full" @swiper="onSwiperNews" v-bind="swiperOptionsNews">
 				<swiper-slide>
-					<img src="public/img/joinus.png" style="width: 100%;">
+					<img :src="`${cdnUrl}/img/joinus.png`" style="width: 100%;">
 				</swiper-slide>
 				<swiper-slide>
-					<img src="public/img/joinus.png" style="width: 100%;">
+					<img :src="`${cdnUrl}/img/joinus.png`" style="width: 100%;">
 				</swiper-slide>
 			</swiper>
 			<!-- <div style="position: absolute;bottom: 50px;left: 0;width: 100%;z-index: 100;">
 				<div class="flex-row justify-center align-center">
 					<div>
-						<img src="public/img/left.png" alt="">
+						<img :src="`${cdnUrl}/img/left.png" alt="">
 					</div>
 					<div style="margin: 0px 20px;">
-						<img src="public/img/morse.png" alt="">
+						<img :src="`${cdnUrl}/img/morse.png" alt="">
 					</div>
 					<div>
-						<img src="public/img/right.png" alt="">
+						<img :src="`${cdnUrl}/img/right.png" alt="">
 					</div>
 				</div>
 			</div> -->
@@ -42,12 +42,12 @@
 						</span>
 						<div class="flex" style="margin-top: 40px;">
 							<span class="text_13s">
-								<img src="public/img/telphone.png" alt="" class="imgs">
-								联系电话：15503791530
+								<img :src="`${cdnUrl}/img/telphone.png`" alt="" class="imgs">
+								联系电话：17603796680
 							</span>
 							<span class="text_13s">
-								<img src="public/img/wechat.png" alt="" class="imgs">
-								微信：15503791530
+								<img :src="`${cdnUrl}/img/wechat.png`" alt="" class="imgs">
+								微信：17603796680
 							</span>
 						</div>
 					</div>
@@ -105,7 +105,7 @@ import $api from '@/service/webRequest'
 import { useI18n } from 'vue-i18n'
 import { useStore } from '~/store'
 const { locale } = useI18n()
-
+const cdnUrl = useCdn()
 let newsSwiper: any = null
 const onSwiperNews = (swiper: any) => {
 	newsSwiper = swiper
@@ -238,9 +238,9 @@ const animate = () => {
 }
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 @import "@/assets/animate/animate.min.css";
-@import "@/assets/index.css";
+@import "@/assets/index.scss";
 
 :deep(.dswper .swiper-slide-next) {
 	transform: translate3d(0px, 0px, -507px) rotateX(0deg) rotateY(0deg) scale(1) !important;
@@ -263,29 +263,9 @@ const animate = () => {
 	transition: 6s linear;
 	transform: scale(1, 1);
 }
-
-.bottom_imgs {
-	background: url(/public/img/qall.png);
-	width: 1230px;
-	height: 272px;
-	background-size: 100%;
-}
-
-.content_box {
-	background: url(/public/img/m1.png);
-	;
-	width: 561px;
-	height: 521px;
-	z-index: 1;
-	position: absolute;
-	right: -12px;
-	bottom: -13px;
-	background-size: 100%;
-}
-
 .section_1s {
 	height: 360px;
-	background: url(public/img/allpeople.png) 100% no-repeat;
+	background: var(--allpeople) 100% no-repeat;
 	background-size: 100% 100%;
 	width: 585px;
 	z-index: 10;
@@ -356,7 +336,7 @@ const animate = () => {
 .box_18s {
 	width: 387px;
 	height: 149px;
-	background: url(public/img/lianxiyp.png) 100% no-repeat;
+	background: var(--lianxiyp) 100% no-repeat;
 	z-index: 10;
 	justify-content: center;
 	//   align-items: center;
diff --git a/pages/customerReviews.vue b/pages/customerReviews.vue
index ddc06ff..53dcee1 100644
--- a/pages/customerReviews.vue
+++ b/pages/customerReviews.vue
@@ -4,25 +4,12 @@
 		<div class="group_666" style="position: relative;height: 600px;">
 			<swiper class="swiper-container h-full" @swiper="onSwiperNews" v-bind="swiperOptionsNews">
 				<swiper-slide>
-					<img src="public/img/customer/topnav.png" style="width: 100%;">
+					<img :src="`${cdnUrl}/img/customer/topnav.png`" style="width: 100%;">
 				</swiper-slide>
 				<swiper-slide>
-					<img src="public/img/customer/topnav.png" style="width: 100%;">
+					<img :src="`${cdnUrl}/img/customer/topnav.png`" style="width: 100%;">
 				</swiper-slide>
 			</swiper>
-			<!-- <div style="position: absolute;bottom: 50px;left: 0;width: 100%;z-index: 100;">
-				<div class="flex-row justify-center align-center">
-					<div>
-						<img src="public/img/left.png" alt="">
-					</div>
-					<div style="margin: 0px 20px;">
-						<img src="public/img/morse.png" alt="">
-					</div>
-					<div>
-						<img src="public/img/right.png" alt="">
-					</div>
-				</div>
-			</div> -->
 		</div>
 		<div class="box_11 flex-col bottom_imgss">
 			<div class="text-wrapper_10" style="margin-top: 70px;">
@@ -36,7 +23,7 @@
 
 				<div class="box_con flex-col" v-for="(item, index) in lists" :key="index">
 					<div class="align-center" style="justify-content: center;margin-top: 10px;">
-						<img width="257px" height="169px" :src="`/img/customer/${index}.png`" alt="">
+						<img width="257px" height="169px" :src="`${cdnUrl}/img/customer/${index}.png`" alt="">
 					</div>
 					<div class="flex-col"
 						style="justify-content: center;margin-top: 10px;border-top: 1px solid #EEEEEE;">
@@ -75,7 +62,7 @@ import $api from '@/service/webRequest'
 import { useI18n } from 'vue-i18n'
 import { useStore } from '~/store'
 const { locale } = useI18n()
-
+const cdnUrl = useCdn()
 let newsSwiper: any = null
 const onSwiperNews = (swiper: any) => {
 	newsSwiper = swiper
@@ -198,7 +185,7 @@ const animate = () => {
 
 <style lang="scss" scoped>
 @import "@/assets/animate/animate.min.css";
-@import "@/assets/index.css";
+@import "@/assets/index.scss";
 
 
 
@@ -217,7 +204,7 @@ const animate = () => {
 }
 
 .bottom_imgss {
-	background: url(/public/img/customer/bg-s.png);
+	background: var(--bg-s);
 	height: 837px;
 	background-size: 100%;
 }
diff --git a/pages/index.vue b/pages/index.vue
index 35be414..d38a18a 100644
--- a/pages/index.vue
+++ b/pages/index.vue
@@ -4,26 +4,26 @@
 		<div class="group_666" style="position: relative;height: 100vh;">
 			<swiper class="swiper-container h-full" @swiper="onSwiperNews" v-bind="swiperOptionsNews">
 				<swiper-slide>
-					<img src="public/img/banner.png" style="width: 100%;">
+					<img :src="`${cdnUrl}/img/banner.png`" style="width: 100%;">
 				</swiper-slide>
 				<swiper-slide>
-					<img src="public/img/banner2.png" style="width: 100%;">
+					<img :src="`${cdnUrl}/img/banner2.png`" style="width: 100%;">
 				</swiper-slide>
 				<swiper-slide>
 					<video class="video_1" autoplay="autoplay" loop="loop" muted="muted" playsinline="playsinline"
-						src="public/img/1212.mp4"></video>
+						:src="`${cdnUrl}/img/1212.mp4`"></video>
 				</swiper-slide>
 			</swiper>
 			<div style="position: absolute;bottom: 50px;left: 0;width: 100%;z-index: 100;">
 				<div class="flex-row justify-center align-center">
 					<div>
-						<img src="public/img/left.png" alt="">
+						<img :src="`${cdnUrl}/img/left.png`" alt="">
 					</div>
 					<div style="margin: 0px 20px;">
-						<img src="public/img/morse.png" alt="">
+						<img :src="`${cdnUrl}/img/morse.png`" alt="">
 					</div>
 					<div>
-						<img src="public/img/right.png" alt="">
+						<img :src="`${cdnUrl}/img/right.png`" alt="">
 					</div>
 				</div>
 			</div>
@@ -78,7 +78,7 @@
 						class="group_5 flex-col justify-center align-center rightBox cursor-pointer">
 						<div class="section_1 flex-col">
 							<div class="image-wrapper_2 flex-col">
-								<img class="image_5" referrerpolicy="no-referrer" src="public/img/bf.png" />
+								<img class="image_5" referrerpolicy="no-referrer" :src="`${cdnUrl}/img/bf.png`" />
 							</div>
 						</div>
 						<div class="content_box"></div>
@@ -95,7 +95,7 @@
 				<div class="flex-row justify-center align-center" style="margin-top: 30px;">
 					<div class="leftBox section_2s flex-col" style="margin-right: 30px;">
 						<div class="group_6 flex-col">
-							<div class="box_6 flex-row align-center justify-between">
+							<div class="box_6 flex-row align-center" style="width: 100%;">
 								<div class="text-group_2 flex-col justify-between">
 									<span class="text_17" style="color: #0256FF;">
 										专业技术服务
@@ -105,7 +105,7 @@
 									</span>
 								</div>
 								<div class="image-wrapper_3s flex-col align-center">
-									<img class="label_1s" referrerpolicy="no-referrer" src="public/img/u1s.png" />
+									<img class="label_1s" referrerpolicy="no-referrer" :src="`${cdnUrl}/img/u1s.png`" />
 								</div>
 
 							</div>
@@ -113,7 +113,7 @@
 						<div class="group_10s flex-col"></div>
 						<div class="group_7 flex-row justify-between">
 							<div class="image-wrapper_5 flex-col">
-								<img class="label_3" referrerpolicy="no-referrer" src="public/img/aiyingyong.png" />
+								<img class="label_3" referrerpolicy="no-referrer" :src="`${cdnUrl}/img/aiyingyong.png`" />
 							</div>
 							<div class="text-group_3 flex-col justify-between">
 								<span class="text_18">AI应用与落地</span>
@@ -125,7 +125,7 @@
 						<div class="group_10 flex-col"></div>
 						<div class="group_7 flex-row justify-between">
 							<div class="image-wrapper_5 flex-col">
-								<img class="label_3" referrerpolicy="no-referrer" src="public/img/kaifapeizhi.png" />
+								<img class="label_3" referrerpolicy="no-referrer" :src="`${cdnUrl}/img/kaifapeizhi.png`" />
 							</div>
 							<div class="text-group_3 flex-col justify-between">
 								<span class="text_18">定制软件开发</span>
@@ -138,7 +138,7 @@
 						<div class="group_7 flex-row justify-between">
 							<div class="image-wrapper_5 flex-col">
 								<img class="label_3" referrerpolicy="no-referrer"
-									src="public/img/a-yunweishuju1x.png" />
+									:src="`${cdnUrl}/img/a-yunweishuju1x.png`" />
 							</div>
 							<div class="text-group_3 flex-col justify-between">
 								<span class="text_18">IT运维服务</span>
@@ -151,7 +151,7 @@
 						<div class="group_7 flex-row justify-between">
 							<div class="image-wrapper_5 flex-col">
 								<img class="label_3" referrerpolicy="no-referrer"
-									src="public/img/wangluoanquanshebei.png" />
+									:src="`${cdnUrl}/img/wangluoanquanshebei.png`" />
 							</div>
 							<div class="text-group_3 flex-col justify-between">
 								<span class="text_18">网络与信息安全</span>
@@ -164,7 +164,7 @@
 						<div class="group_7 flex-row justify-between">
 							<div class="image-wrapper_5 flex-col">
 								<img class="label_3" referrerpolicy="no-referrer"
-									src="public/img/yekuogongdianfangan.png" />
+									:src="`${cdnUrl}/img/yekuogongdianfangan.png`" />
 							</div>
 							<div class="text-group_3 flex-col justify-between">
 								<span class="text_18">智慧化解决方案</span>
@@ -177,7 +177,7 @@
 
 					<div class="rightBox section_2sa flex-col">
 						<div class="group_6s flex-col">
-							<div class="box_6 flex-row align-center justify-between">
+							<div class="box_6 flex-row align-center" style="width: 100%;">
 								<div class="text-group_2 flex-col justify-between">
 									<span class="text_17">
 										内容创作与运营
@@ -187,7 +187,7 @@
 									</span>
 								</div>
 								<div class="image-wrapper_3s flex-col align-center">
-									<img class="label_1s" referrerpolicy="no-referrer" src="public/img/u1.png" />
+									<img class="label_1s" referrerpolicy="no-referrer" :src="`${cdnUrl}/img/u1.png`" />
 								</div>
 
 							</div>
@@ -195,7 +195,7 @@
 						<div class="group_10s flex-col"></div>
 						<div class="group_7 flex-row justify-between">
 							<div class="image-wrapper_5 flex-col">
-								<img class="label_3" referrerpolicy="no-referrer" src="public/img/quanmeiti.png" />
+								<img class="label_3" referrerpolicy="no-referrer" :src="`${cdnUrl}/img/quanmeiti.png`" />
 							</div>
 							<div class="text-group_3_3 flex-col justify-between">
 								<span class="text_18">全媒体推广解决方案</span>
@@ -207,7 +207,7 @@
 						<div class="group_10 flex-col"></div>
 						<div class="group_7 flex-row justify-between">
 							<div class="image-wrapper_5 flex-col">
-								<img class="label_3" referrerpolicy="no-referrer" src="public/img/pingpai.png" />
+								<img class="label_3" referrerpolicy="no-referrer" :src="`${cdnUrl}/img/pingpai.png`" />
 							</div>
 							<div class="text-group_3_3 flex-col justify-between">
 								<span class="text_18">品牌账号代运营</span>
@@ -219,7 +219,7 @@
 						<div class="group_10 flex-col"></div>
 						<div class="group_7 flex-row justify-between">
 							<div class="image-wrapper_5 flex-col">
-								<img class="label_3" referrerpolicy="no-referrer" src="public/img/xianshang.png" />
+								<img class="label_3" referrerpolicy="no-referrer" :src="`${cdnUrl}/img/xianshang.png`" />
 							</div>
 							<div class="text-group_3_3 flex-col justify-between">
 								<span class="text_18">线上线下活动策划</span>
@@ -231,7 +231,7 @@
 						<div class="group_10 flex-col"></div>
 						<div class="group_7 flex-row justify-between">
 							<div class="image-wrapper_5 flex-col">
-								<img class="label_3" referrerpolicy="no-referrer" src="public/img/news.png" />
+								<img class="label_3" referrerpolicy="no-referrer" :src="`${cdnUrl}/img/news.png`" />
 							</div>
 							<div class="text-group_3_3 flex-col justify-between">
 								<span class="text_18">互联网新闻发布</span>
@@ -243,7 +243,7 @@
 						<div class="group_10 flex-col"></div>
 						<div class="group_7 flex-row justify-between">
 							<div class="image-wrapper_5 flex-col">
-								<img class="label_3" referrerpolicy="no-referrer" src="public/img/daren.png" />
+								<img class="label_3" referrerpolicy="no-referrer" :src="`${cdnUrl}/img/daren.png`" />
 							</div>
 							<div class="text-group_3_3 flex-col justify-between">
 								<span class="text_18">IP孵化与达人合作</span>
@@ -265,15 +265,9 @@
 				<swiper ref="swiper_exp" :slidesPerView="2" loop  :autoplay="false" 
 					:modules="modules" :watchSlidesProgress="true" @swiper="onSwiperExp">
 					<swiper-slide v-for="(item, index) in 14" :key="index">
-						<img :src="`/img/home_al/op${item}.png`" style="width: 585px;height: 300px;    margin: 0 auto;">
+						<img :src="`${$cdnUrl}/img/home_al/op${item}.png`" style="width: 585px;height: 300px;    margin: 0 auto;">
 					</swiper-slide>
 				</swiper>
-				<!-- <div class="dswper_left">
-					<img src="public/img/opl.png">
-				</div>
-				<div class="dswper_right">
-					<img src="public/img/opr.png">
-				</div> -->
 				<div class="flex-row justify-center align-center absolute w-full bottom-[-50px]" style="gap: 30px;">
 					<div v-for="(_, index) in 3" :key="index" style="width: 20px; height: 5px;"
 						:style="{ backgroundColor: activeSlideIndex === index ? '#fc7428' : '#C1C1C1' }">
@@ -396,7 +390,7 @@
 			<div class="abs popCont pop_video_cont">
 				<a @click="videoShow = false" class="abs pop_video_close closePop"></a>
 				<video x5-playsinline="" playsinline="" webkit-playsinline="" preload=""
-					x5-video-orientation="portraint" controls="" autoplay src="public/img/222.mp4"
+					x5-video-orientation="portraint" controls="" autoplay :src="`${cdnUrl}/img/222.mp4`"
 					draggable="true"></video>
 			</div>
 		</div>
@@ -424,6 +418,8 @@ import * as swiperAni from '@/assets/animate/animate.js'
 import $api from '@/service/webRequest'
 import { useI18n } from 'vue-i18n'
 import { useStore } from '~/store'
+const cdnUrl = useCdn()
+
 const { locale } = useI18n()
 
 const typeId = ref(1);
@@ -626,9 +622,9 @@ const openUrl = (id) => {
 }
 </script>
 
-<style lang="scss">
+<style lang="scss" scoped>
 @import "@/assets/animate/animate.min.css";
-@import "@/assets/index.css";
+@import "@/assets/index.scss";
 
 :deep(.dswper .swiper-slide-next) {
 	transform: translate3d(0px, 0px, -507px) rotateX(0deg) rotateY(0deg) scale(1) !important;
@@ -653,12 +649,14 @@ const openUrl = (id) => {
 }
 
 .bottom_imgs {
-	background: url(/public/img/qall.png);
+	background: var(--qall);
+	width: 1230px;
+	height: 272px;
 	background-size: 100%;
 }
 
 .content_box {
-	background: url(/public/img/m1.png);
+	background: var(--m1);
 	width: 561px;
 	height: 521px;
 	z-index: 1;
@@ -773,7 +771,7 @@ const openUrl = (id) => {
 	right: -75px;
 	width: 50px;
 	height: 50px;
-	background: url('/public/img/close.png') no-repeat 0 0;
+	background: var(--close) no-repeat 0 0;
 	background-size: 100% auto;
 	border: 6px solid #979797;
 }
diff --git a/pages/info/[id].vue b/pages/info/[id].vue
index 76c7d30..a9e38b9 100644
--- a/pages/info/[id].vue
+++ b/pages/info/[id].vue
@@ -1,6 +1,6 @@
 <template>
 	<div style="width: 100%;">
-		<div style="height:71px;background-color: #ffffff;"></div>
+		<div style="height:90px;background-color: #ffffff;"></div>
 		<div style="background-color: #F8F8F8;padding: 30px;">
 			<div style="width: 60%;min-height: 500px;margin: 0 auto;background-color: #ffffff;padding: 30px;">
 				<div style="font-size: 32px;font-weight: 700;color: #323232;">{{ info.title }}</div>
@@ -58,7 +58,7 @@ const delWeb = () => {
 
 <style lang="scss">
 @import "@/assets/animate/animate.min.css";
-@import "@/assets/index.css";
+@import "@/assets/index.scss";
 
 .info_content img {
 	width: 80% !important;
diff --git a/pages/phone_index.vue b/pages/phone_index.vue
index dfc8dbc..aff2ed0 100644
--- a/pages/phone_index.vue
+++ b/pages/phone_index.vue
@@ -472,7 +472,7 @@ const animate = () => {
 
 <style lang="scss">
 @import "@/assets/animate/animate.min.css";
-@import "@/assets/index.css";
+@import "@/assets/index.scss";
 
 /* 移动端通用样式 */
 body.is-mobile {
diff --git a/pages/proServices.vue b/pages/proServices.vue
index f48cbfd..d66ddca 100644
--- a/pages/proServices.vue
+++ b/pages/proServices.vue
@@ -4,38 +4,25 @@
 		<div class="group_666" style="position: relative;height: 600px;">
 			<swiper class="swiper-container h-full" @swiper="onSwiperNews" v-bind="swiperOptionsNews">
 				<swiper-slide>
-					<img src="public/img/service.png" style="width: 100%;">
+					<img :src="`${cdnUrl}/img/service.png`" style="width: 100%;">
 				</swiper-slide>
 				<swiper-slide>
-					<img src="public/img/service.png" style="width: 100%;">
+					<img :src="`${cdnUrl}/img/service.png`" style="width: 100%;">
 				</swiper-slide>
 			</swiper>
-			<!-- <div style="position: absolute;bottom: 50px;left: 0;width: 100%;z-index: 100;">
-				<div class="flex-row justify-center align-center">
-					<div>
-						<img src="public/img/left.png" alt="">
-					</div>
-					<div style="margin: 0px 20px;">
-						<img src="public/img/morse.png" alt="">
-					</div>
-					<div>
-						<img src="public/img/right.png" alt="">
-					</div>
-				</div>
-			</div> -->
 		</div>
 		<div class="group_2 flex-col"
 			style="background-color: #ffffff;overflow: unset;position: relative;height: 735px;">
-			<img src="public/img/service_01.png" style="width: 100%;position: absolute;top: -30px;z-index: 10;">
+			<img :src="`${cdnUrl}/img/service_01.png`" style="width: 100%;position: absolute;top: -30px;z-index: 10;">
 			<div class="service_top1">
-				<div style="cursor: pointer;">
-					<NuxtLink to="/proServices_con/">
-             			内容创作与运营
-            		</NuxtLink>
-				</div>
-				<div style="cursor: pointer;">
+				<NuxtLink to="/proServices_con/" style="cursor: pointer;width: 50%;text-align: center;">
+					<div>
+						内容创作与运营
+					</div>
+				</NuxtLink>
+				<div style="cursor: pointer;width: 50%;text-align: center;">
 					<div style="color: #0256FF;margin-bottom: 20px;">专业技术服务</div>
-					<div style="background-color: #0256FF;width:40%;height: 8px;margin: 0 auto;"></div>
+					<div style="background-color: #0256FF;width:10%;height: 8px;margin: 0 auto;"></div>
 				</div>
 			</div>
 			<div class="service-01" style="text-align: center;padding-top: 70px;z-index: 30;">
@@ -47,7 +34,7 @@
 					<div class="service_top1_width">
 						<div class="reveal-left" style="display: flex;flex-direction: row;align-items: center;">
 							<div>
-								<img src="public/img/service_012.png" style="width:22px;height: 22px;">
+								<img :src="`${cdnUrl}/img/service_012.png`" style="width:22px;height: 22px;">
 							</div>
 							<div style="font-size: 18px;font-weight: 700;margin-left: 10px;">项目介绍和业务描述</div>
 						</div>
@@ -60,21 +47,21 @@
 							<div style="display: flex;flex-direction: row;justify-content: space-between;">
 								<div class="service-1" style="display: flex;flex-direction: row;align-items: center;">
 									<div>
-										<img src="public/img/service_013.png" style="width:32px;height: 32px;">
+										<img :src="`${cdnUrl}/img/service_013.png`" style="width:32px;height: 32px;">
 									</div>
 									<div style="width: 105px;font-size: 14px;font-weight: 400;margin-left: 15px;">
 										多模态输入与智能处理</div>
 								</div>
 								<div class="service-1" style="display: flex;flex-direction: row;align-items: center;">
 									<div>
-										<img src="public/img/service_014.png" style="width:32px;height: 32px;">
+										<img :src="`${cdnUrl}/img/service_014.png`" style="width:32px;height: 32px;">
 									</div>
 									<div style="width: 105px;font-size: 14px;font-weight: 400;margin-left: 15px;">
 										联网搜索增强与分层服务</div>
 								</div>
 								<div class="service-1" style="display: flex;flex-direction: row;align-items: center;">
 									<div>
-										<img src="public/img/service_015.png" style="width:32px;height: 32px;">
+										<img :src="`${cdnUrl}/img/service_015.png`" style="width:32px;height: 32px;">
 									</div>
 									<div style="width: 105px;font-size: 14px;font-weight: 400;margin-left: 15px;">
 										私有化知识库与RAG技术</div>
@@ -84,21 +71,21 @@
 								style="margin-top: 40px;display: flex;flex-direction: row;justify-content: space-between;">
 								<div class="service-1" style="display: flex;flex-direction: row;align-items: center;">
 									<div>
-										<img src="public/img/service_016.png" style="width:32px;height: 32px;">
+										<img :src="`${cdnUrl}/img/service_016.png`" style="width:32px;height: 32px;">
 									</div>
 									<div style="width: 105px;font-size: 14px;font-weight: 400;margin-left: 15px;">
 										高并发与稳定性优化</div>
 								</div>
 								<div class="service-1" style="display: flex;flex-direction: row;align-items: center;">
 									<div>
-										<img src="public/img/service_017.png" style="width:32px;height: 32px;">
+										<img :src="`${cdnUrl}/img/service_017.png`" style="width:32px;height: 32px;">
 									</div>
 									<div style="width: 105px;font-size: 14px;font-weight: 400;margin-left: 15px;">
 										全链路安全与商业化支持</div>
 								</div>
 								<div class="service-1" style="display: flex;flex-direction: row;align-items: center;">
 									<div>
-										<img src="public/img/service_018.png" style="width:32px;height: 32px;">
+										<img :src="`${cdnUrl}/img/service_018.png`" style="width:32px;height: 32px;">
 									</div>
 									<div style="width: 105px;font-size: 14px;font-weight: 400;margin-left: 15px;">
 										模型生态扩展接入更多模型</div>
@@ -108,21 +95,21 @@
 								style="margin-top: 40px;display: flex;flex-direction: row;justify-content: space-between;">
 								<div class="service-1" style="display: flex;flex-direction: row;align-items: center;">
 									<div>
-										<img src="public/img/service_019.png" style="width:32px;height: 32px;">
+										<img :src="`${cdnUrl}/img/service_019.png`" style="width:32px;height: 32px;">
 									</div>
 									<div style="width: 105px;font-size: 14px;font-weight: 400;margin-left: 15px;">
 										知识库智能化升级</div>
 								</div>
 								<div class="service-1" style="display: flex;flex-direction: row;align-items: center;">
 									<div>
-										<img src="public/img/service_020.png" style="width:32px;height: 32px;">
+										<img :src="`${cdnUrl}/img/service_020.png`" style="width:32px;height: 32px;">
 									</div>
 									<div style="width: 105px;font-size: 14px;font-weight: 400;margin-left: 15px;">
 										边缘计算协同部署轻量化模型</div>
 								</div>
 								<div class="service-1" style="display: flex;flex-direction: row;align-items: center;">
 									<div>
-										<img src="public/img/service_021.png" style="width:32px;height: 32px;">
+										<img :src="`${cdnUrl}/img/service_021.png`" style="width:32px;height: 32px;">
 									</div>
 									<div style="width: 105px;font-size: 14px;font-weight: 400;margin-left: 15px;">
 										垂直领域深度适配多行业应用</div>
@@ -131,7 +118,7 @@
 						</div>
 					</div>
 					<div class="service_top1_width" style="text-align: center;">
-						<img src="public/img/service_022.png" style="width:100%;height: 100%;">
+						<img :src="`${cdnUrl}/img/service_022.png`" style="width:100%;height: 100%;">
 					</div>
 				</div>
 			</div>
@@ -145,12 +132,12 @@
 			<div
 				style="display: flex;flex-direction: row;align-items: center;justify-content: center;width: 100%;gap: 30px;margin-top: 30px;">
 				<div class="service_center_01" style="width: 30%;">
-					<img src="public/img/service_024.png" style="width:100%;height: 100%;">
+					<img :src="`${cdnUrl}/img/service_024.png`" style="width:100%;height: 100%;">
 				</div>
 				<div class="service_center_02">
 					<div style="display: flex;flex-direction: row;align-items: center;">
 						<div>
-							<img src="public/img/service_012.png" style="width:22px;height: 22px;">
+							<img :src="`${cdnUrl}/img/service_012.png`" style="width:22px;height: 22px;">
 						</div>
 						<div style="color: #222222;font-size: 18px;font-weight: 700;margin-left: 10px;">项目介绍和业务描述</div>
 					</div>
@@ -159,17 +146,17 @@
 					</div>
 					<div
 						style="display: flex;flex-direction: row;align-items: center;justify-content: space-between;width: 100%;margin-top: 30px;">
-						<div>
-							<img src="public/img/service_025.png" style="width:135px;">
+						<div class="dz_img">
+							<img :src="`${cdnUrl}/img/service_025.png`" style="width:135px;">
 						</div>
-						<div>
-							<img src="public/img/service_026.png" style="width:135px;">
+						<div class="dz_img">
+							<img :src="`${cdnUrl}/img/service_026.png`" style="width:135px;">
 						</div>
-						<div>
-							<img src="public/img/service_027.png" style="width:135px;">
+						<div class="dz_img">
+							<img :src="`${cdnUrl}/img/service_027.png`" style="width:135px;">
 						</div>
-						<div>
-							<img src="public/img/service_028.png" style="width:135px;">
+						<div class="dz_img">
+							<img :src="`${cdnUrl}/img/service_028.png`" style="width:135px;">
 						</div>
 					</div>
 				</div>
@@ -183,7 +170,7 @@
 			<div
 				style="display: flex;flex-direction: row;align-items: center;justify-content: center;width: 100%;gap: 30px;margin-top: 40px;">
 				<div class="service-yw" style="position: relative;">
-					<img src="public/img/service_029.png" style="width:275px;">
+					<img :src="`${cdnUrl}/img/service_029.png`" style="width:275px;">
 					<div style="position: absolute;bottom: 0px;left: 0px;width: 100%;height: 100%;padding: 30px;">
 						<div style="font-size: 18px;font-weight: 700;color: #3D3D3D;">安全防护</div>
 						<div style="font-weight: 400;color: #768597;font-size: 14px;margin-top: 10px;">
@@ -191,7 +178,7 @@
 					</div>
 				</div>
 				<div class="service-yw" style="position: relative;">
-					<img src="public/img/service_030.png" style="width:275px;">
+					<img :src="`${cdnUrl}/img/service_030.png`" style="width:275px;">
 					<div style="position: absolute;bottom: 0px;left: 0px;width: 100%;height: 100%;padding: 30px;">
 						<div style="font-size: 18px;font-weight: 700;color: #3D3D3D;">漏洞修复</div>
 						<div style="font-weight: 400;color: #768597;font-size: 14px;margin-top: 10px;">
@@ -199,7 +186,7 @@
 					</div>
 				</div>
 				<div class="service-yw" style="position: relative;">
-					<img src="public/img/service_031.png" style="width:275px;">
+					<img :src="`${cdnUrl}/img/service_031.png`" style="width:275px;">
 					<div style="position: absolute;bottom: 0px;left: 0px;width: 100%;height: 100%;padding: 30px;">
 						<div style="font-size: 18px;font-weight: 700;color: #3D3D3D;">安全加固</div>
 						<div style="font-weight: 400;color: #768597;font-size: 14px;margin-top: 10px;">ios和Android应用防调试
@@ -207,7 +194,7 @@
 					</div>
 				</div>
 				<div class="service-yw" style="position: relative;">
-					<img src="public/img/service_032.png" style="width:275px;">
+					<img :src="`${cdnUrl}/img/service_032.png`" style="width:275px;">
 					<div style="position: absolute;bottom: 0px;left: 0px;width: 100%;height: 100%;padding: 30px;">
 						<div style="font-size: 18px;font-weight: 700;color: #3D3D3D;">实时监控</div>
 						<div style="font-weight: 400;color: #768597;font-size: 14px;margin-top: 10px;">
@@ -224,11 +211,11 @@
 			<div class="service-wl-a" style="display: flex;justify-content: center;gap: 30px;margin-top: 40px;">
 				<div class="service-wl">
 					<div style="position: absolute;">
-						<img src="public/img/service_034.png" style="width:100%;height: 100%;">
+						<img :src="`${cdnUrl}/img/service_034.png`" style="width:100%;height: 100%;">
 					</div>
 					<div style="display: flex;align-items: center;padding:30px 30px 20px 30px;">
 						<div style="z-index: 10;">
-							<img src="public/img/service_035.png" style="width:36px;height: 36px;">
+							<img :src="`${cdnUrl}/img/service_035.png`" style="width:36px;height: 36px;">
 						</div>
 						<div style="font-size: 18px;color: #3D3D3D;font-weight: 700;z-index: 10;margin-left: 20px;">
 							Android应用加固</div>
@@ -238,11 +225,11 @@
 				</div>
 				<div class="service-wl">
 					<div style="position: absolute;">
-						<img src="public/img/service_034.png" style="width:100%;height: 100%;">
+						<img :src="`${cdnUrl}/img/service_034.png`" style="width:100%;height: 100%;">
 					</div>
 					<div style="display: flex;align-items: center;padding:30px 30px 20px 30px;">
 						<div style="z-index: 10;">
-							<img src="public/img/service_036.png" style="width:36px;height: 36px;">
+							<img :src="`${cdnUrl}/img/service_036.png`" style="width:36px;height: 36px;">
 						</div>
 						<div style="font-size: 18px;color: #3D3D3D;font-weight: 700;z-index: 10;margin-left: 20px;">
 							IOS应用加固</div>
@@ -253,11 +240,11 @@
 				</div>
 				<div class="service-wl">
 					<div style="position: absolute;">
-						<img src="public/img/service_034.png" style="width:100%;height: 100%;">
+						<img :src="`${cdnUrl}/img/service_034.png`" style="width:100%;height: 100%;">
 					</div>
 					<div style="display: flex;align-items: center;padding:30px 30px 20px 30px;">
 						<div style="z-index: 10;">
-							<img src="public/img/service_037.png" style="width:36px;height: 36px;">
+							<img :src="`${cdnUrl}/img/service_037.png`" style="width:36px;height: 36px;">
 						</div>
 						<div style="font-size: 18px;color: #3D3D3D;font-weight: 700;z-index: 10;margin-left: 20px;">
 							防调试</div>
@@ -269,11 +256,11 @@
 			<div class="service-wl-b" style="display: flex;justify-content: center;gap: 30px;margin-top: 30px;">
 				<div class="service-wl">
 					<div style="position: absolute;">
-						<img src="public/img/service_034.png" style="width:100%;height: 100%;">
+						<img :src="`${cdnUrl}/img/service_034.png`" style="width:100%;height: 100%;">
 					</div>
 					<div style="display: flex;align-items: center;padding:30px 30px 20px 30px;">
 						<div style="z-index: 10;">
-							<img src="public/img/service_038.png" style="width:36px;height: 36px;">
+							<img :src="`${cdnUrl}/img/service_038.png`" style="width:36px;height: 36px;">
 						</div>
 						<div style="font-size: 18px;color: #3D3D3D;font-weight: 700;z-index: 10;margin-left: 20px;">
 							防篡改</div>
@@ -283,11 +270,11 @@
 				</div>
 				<div class="service-wl">
 					<div style="position: absolute;">
-						<img src="public/img/service_034.png" style="width:100%;height: 100%;">
+						<img :src="`${cdnUrl}/img/service_034.png`" style="width:100%;height: 100%;">
 					</div>
 					<div style="display: flex;align-items: center;padding:30px 30px 20px 30px;">
 						<div style="z-index: 10;">
-							<img src="public/img/service_039.png" style="width:36px;height: 36px;">
+							<img :src="`${cdnUrl}/img/service_039.png`" style="width:36px;height: 36px;">
 						</div>
 						<div style="font-size: 18px;color: #3D3D3D;font-weight: 700;z-index: 10;margin-left: 20px;">
 							防窃取</div>
@@ -297,11 +284,11 @@
 				</div>
 				<div class="service-wl">
 					<div style="position: absolute;">
-						<img src="public/img/service_034.png" style="width:100%;height: 100%;">
+						<img :src="`${cdnUrl}/img/service_034.png`" style="width:100%;height: 100%;">
 					</div>
 					<div style="display: flex;align-items: center;padding:30px 30px 20px 30px;">
 						<div style="z-index: 10;">
-							<img src="public/img/service_040.png" style="width:36px;height: 36px;">
+							<img :src="`${cdnUrl}/img/service_040.png`" style="width:36px;height: 36px;">
 						</div>
 						<div style="font-size: 18px;color: #3D3D3D;font-weight: 700;z-index: 10;margin-left: 20px;">
 							防逆向</div>
@@ -323,7 +310,7 @@
 					:style="{ left: `${left1}px`, top: `${top1}px` }"
 					style="position: absolute;border-radius: 8px;width: 277px;height: 428px;padding: 30px;">
 					<div v-if="mousindex != 1">
-						<img src="public/img/service_041.png" style="width: 38px;height: 38px;">
+						<img :src="`${cdnUrl}/img/service_041.png`" style="width: 38px;height: 38px;">
 					</div>
 					<div style="font-size: 18px;font-weight: 700;margin-top: 20px;">
 						监控系统
@@ -335,7 +322,7 @@
 					<div v-if="mousindex == 1" style="margin-top: 30px;">
 						<div style="display: flex;align-items: center;">
 							<div>
-								<img src="public/img/service_049.png" style="width: 32px;height: 32px;">
+								<img :src="`${cdnUrl}/img/service_049.png`" style="width: 32px;height: 32px;">
 							</div>
 							<div style="font-size: 14px;font-weight: 400;margin-left: 20px;">
 								监控回溯
@@ -343,7 +330,7 @@
 						</div>
 						<div style="display: flex;align-items: center;margin-top: 30px;">
 							<div>
-								<img src="public/img/service_050.png" style="width: 32px;height: 32px;">
+								<img :src="`${cdnUrl}/img/service_050.png`" style="width: 32px;height: 32px;">
 							</div>
 							<div style="font-size: 14px;font-weight: 400;margin-left: 20px;">
 								人员轨迹
@@ -356,7 +343,7 @@
 					:style="{ left: `${left2}px`, top: `${top2}px` }"
 					style="position: absolute;border-radius: 8px;width: 277px;height: 196px;padding: 30px;">
 					<div v-if="mousindex != 2">
-						<img src="public/img/service_042.png" style="width: 38px;height: 38px;">
+						<img :src="`${cdnUrl}/img/service_042.png`" style="width: 38px;height: 38px;">
 					</div>
 					<div style="font-size: 18px;font-weight: 700;margin-top: 20px;">
 						门禁系统
@@ -368,7 +355,7 @@
 					<div v-if="mousindex == 2" style="margin-top: 30px;">
 						<div style="display: flex;align-items: center;">
 							<div>
-								<img src="public/img/service_052.png" style="width: 32px;height: 32px;">
+								<img :src="`${cdnUrl}/img/service_052.png`" style="width: 32px;height: 32px;">
 							</div>
 							<div style="font-size: 14px;font-weight: 400;margin-left: 20px;">
 								人脸识别
@@ -376,7 +363,7 @@
 						</div>
 						<div style="display: flex;align-items: center;margin-top: 30px;">
 							<div>
-								<img src="public/img/service_053.png" style="width: 32px;height: 32px;">
+								<img :src="`${cdnUrl}/img/service_053.png`" style="width: 32px;height: 32px;">
 							</div>
 							<div style="font-size: 14px;font-weight: 400;margin-left: 20px;">
 								id卡
@@ -384,7 +371,7 @@
 						</div>
 						<div style="display: flex;align-items: center;margin-top: 30px;">
 							<div>
-								<img src="public/img/service_054.png" style="width: 32px;height: 32px;">
+								<img :src="`${cdnUrl}/img/service_054.png`" style="width: 32px;height: 32px;">
 							</div>
 							<div style="font-size: 14px;font-weight: 400;margin-left: 20px;">
 								蓝牙检测
@@ -392,7 +379,7 @@
 						</div>
 						<div style="display: flex;align-items: center;margin-top: 30px;">
 							<div>
-								<img src="public/img/service_055.png" style="width: 32px;height: 32px;">
+								<img :src="`${cdnUrl}/img/service_055.png`" style="width: 32px;height: 32px;">
 							</div>
 							<div style="font-size: 14px;font-weight: 400;margin-left: 20px;">
 								停车管理系统
@@ -405,7 +392,7 @@
 					:style="{ left: `${left3}px`, top: `${top3}px` }"
 					style="position: absolute;border-radius: 8px;width: 277px;height: 196px;padding: 30px;">
 					<div v-if="mousindex != 3">
-						<img src="public/img/service_043.png" style="width: 38px;height: 38px;">
+						<img :src="`${cdnUrl}/img/service_043.png`" style="width: 38px;height: 38px;">
 					</div>
 					<div style="font-size: 18px;font-weight: 700;margin-top: 20px;">
 						充电系统
@@ -417,7 +404,7 @@
 					<div v-if="mousindex == 3" style="margin-top: 30px;">
 						<div style="display: flex;align-items: center;">
 							<div>
-								<img src="public/img/service_056.png" style="width: 32px;height: 32px;">
+								<img :src="`${cdnUrl}/img/service_056.png`" style="width: 32px;height: 32px;">
 							</div>
 							<div style="font-size: 14px;font-weight: 400;margin-left: 20px;">
 								充电桩
@@ -425,7 +412,7 @@
 						</div>
 						<div style="display: flex;align-items: center;margin-top: 30px;">
 							<div>
-								<img src="public/img/service_057.png" style="width: 32px;height: 32px;">
+								<img :src="`${cdnUrl}/img/service_057.png`" style="width: 32px;height: 32px;">
 							</div>
 							<div style="font-size: 14px;font-weight: 400;margin-left: 20px;">
 								安全警告
@@ -438,7 +425,7 @@
 					:style="{ left: `${left4}px`, top: `${top4}px` }"
 					style="position: absolute;border-radius: 8px;width: 277px;height: 196px;padding: 30px;">
 					<div v-if="mousindex != 4">
-						<img src="public/img/service_044.png" style="width: 38px;height: 38px;">
+						<img :src="`${cdnUrl}/img/service_044.png`" style="width: 38px;height: 38px;">
 					</div>
 					<div style="font-size: 18px;font-weight: 700;margin-top: 20px;">
 						水电收费系统
@@ -450,7 +437,7 @@
 					<div v-if="mousindex == 4" style="margin-top: 30px;">
 						<div style="display: flex;align-items: center;">
 							<div>
-								<img src="public/img/service_058.png" style="width: 32px;height: 32px;">
+								<img :src="`${cdnUrl}/img/service_058.png`" style="width: 32px;height: 32px;">
 							</div>
 							<div style="font-size: 14px;font-weight: 400;margin-left: 20px;">
 								物业缴费
@@ -458,7 +445,7 @@
 						</div>
 						<div style="display: flex;align-items: center;margin-top: 30px;">
 							<div>
-								<img src="public/img/service_059.png" style="width: 32px;height: 32px;">
+								<img :src="`${cdnUrl}/img/service_059.png`" style="width: 32px;height: 32px;">
 							</div>
 							<div style="font-size: 14px;font-weight: 400;margin-left: 20px;">
 								报修
@@ -466,7 +453,7 @@
 						</div>
 						<div style="display: flex;align-items: center;margin-top: 30px;">
 							<div>
-								<img src="public/img/service_060.png" style="width: 32px;height: 32px;">
+								<img :src="`${cdnUrl}/img/service_060.png`" style="width: 32px;height: 32px;">
 							</div>
 							<div style="font-size: 14px;font-weight: 400;margin-left: 20px;">
 								投诉处理
@@ -479,7 +466,7 @@
 					:style="{ left: `${left5}px`, top: `${top5}px` }"
 					style="position: absolute;border-radius: 8px;width: 277px;height: 196px;padding: 30px;">
 					<div v-if="mousindex != 5">
-						<img src="public/img/service_045.png" style="width: 38px;height: 38px;">
+						<img :src="`${cdnUrl}/img/service_045.png`" style="width: 38px;height: 38px;">
 					</div>
 					<div style="font-size: 18px;font-weight: 700;margin-top: 20px;">
 						养老系统
@@ -491,7 +478,7 @@
 					<div v-if="mousindex == 5" style="margin-top: 30px;">
 						<div style="display: flex;align-items: center;">
 							<div>
-								<img src="public/img/service_061.png" style="width: 32px;height: 32px;">
+								<img :src="`${cdnUrl}/img/service_061.png`" style="width: 32px;height: 32px;">
 							</div>
 							<div style="font-size: 14px;font-weight: 400;margin-left: 20px;">
 								烟感警报
@@ -499,7 +486,7 @@
 						</div>
 						<div style="display: flex;align-items: center;margin-top: 30px;">
 							<div>
-								<img src="public/img/service_062.png" style="width: 32px;height: 32px;">
+								<img :src="`${cdnUrl}/img/service_062.png`" style="width: 32px;height: 32px;">
 							</div>
 							<div style="font-size: 14px;font-weight: 400;margin-left: 20px;">
 								摄像头人物摔倒提示
@@ -507,7 +494,7 @@
 						</div>
 						<div style="display: flex;align-items: center;margin-top: 30px;">
 							<div>
-								<img src="public/img/service_063.png" style="width: 32px;height: 32px;">
+								<img :src="`${cdnUrl}/img/service_063.png`" style="width: 32px;height: 32px;">
 							</div>
 							<div style="font-size: 14px;font-weight: 400;margin-left: 20px;">
 								防丢手环
@@ -515,7 +502,7 @@
 						</div>
 						<div style="display: flex;align-items: center;margin-top: 30px;">
 							<div>
-								<img src="public/img/service_064.png" style="width: 32px;height: 32px;">
+								<img :src="`${cdnUrl}/img/service_064.png`" style="width: 32px;height: 32px;">
 							</div>
 							<div style="font-size: 14px;font-weight: 400;margin-left: 20px;">
 								护理请求传感器
@@ -528,7 +515,7 @@
 					:style="{ left: `${left6}px`, top: `${top6}px` }"
 					style="position: absolute;border-radius: 8px;width: 277px;height: 196px;padding: 30px;">
 					<div v-if="mousindex != 6">
-						<img src="public/img/service_046.png" style="width: 38px;height: 38px;">
+						<img :src="`${cdnUrl}/img/service_046.png`" style="width: 38px;height: 38px;">
 					</div>
 					<div style="font-size: 18px;font-weight: 700;margin-top: 20px;">
 						租房系统
@@ -540,7 +527,7 @@
 					<div v-if="mousindex == 6" style="margin-top: 30px;">
 						<div style="display: flex;align-items: center;">
 							<div>
-								<img src="public/img/service_065.png" style="width: 32px;height: 32px;">
+								<img :src="`${cdnUrl}/img/service_065.png`" style="width: 32px;height: 32px;">
 							</div>
 							<div style="font-size: 14px;font-weight: 400;margin-left: 20px;">
 								托管出租
@@ -553,7 +540,7 @@
 					:style="{ left: `${left7}px`, top: `${top7}px` }"
 					style="position: absolute;border-radius: 8px;width: 277px;height: 196px;padding: 30px;">
 					<div v-if="mousindex != 7">
-						<img src="public/img/service_047.png" style="width: 38px;height: 38px;">
+						<img :src="`${cdnUrl}/img/service_047.png`" style="width: 38px;height: 38px;">
 					</div>
 					<div style="font-size: 18px;font-weight: 700;margin-top: 20px;">
 						更多方案联系我们
@@ -574,7 +561,7 @@
 				</div>
 				<div class="service-container">
 					<div v-for="(item, index) in serviceList" class="service-item">
-						<img :src="`/img/service_000${index + 1}.png`" style="width: 28px;height: 28px;">
+						<img :src="`${cdnUrl}/img/service_000${index + 1}.png`" style="width: 28px;height: 28px;">
 						<div style="margin-left: 10px;font-size: 16px;font-weight: 400;">{{ item.name }}</div>
 					</div>
 				</div>
@@ -605,6 +592,7 @@ import $api from '@/service/webRequest'
 import { useI18n } from 'vue-i18n'
 import { useStore } from '~/store'
 const { locale } = useI18n()
+const cdnUrl = useCdn()
 
 const serviceList = ref([
 	{ name: '需求分析与规划' },
@@ -1057,7 +1045,7 @@ const swiperOptionsNews = {
 
 // 新闻数据
 onMounted(() => {
-		animate()
+	animate()
 })
 const animate = () => {
 	const sr = ScrollReveal();
@@ -1139,7 +1127,7 @@ const animate = () => {
 
 <style scoped lang="scss">
 @import "@/assets/animate/animate.min.css";
-@import "@/assets/index.css";
+@import "@/assets/index.scss";
 
 :deep(.dswper .swiper-slide-next) {
 	transform: translate3d(0px, 0px, -507px) rotateX(0deg) rotateY(0deg) scale(1) !important;
@@ -1150,7 +1138,7 @@ const animate = () => {
 }
 
 .service_023 {
-	background: url(/public/img/service_023.png) no-repeat center center;
+	background: var(--service_023) no-repeat center center;
 	width: 100%;
 	height: 100%;
 	background-size: 100%;
@@ -1160,7 +1148,7 @@ const animate = () => {
 }
 
 .service_033 {
-	background: url(/public/img/service_033.png) no-repeat center center;
+	background: var(--service_033) no-repeat center center;
 	width: 100%;
 	height: 100%;
 	background-size: 100%;
@@ -1168,7 +1156,7 @@ const animate = () => {
 }
 
 .service_bottom {
-	background: url('public/img/service_048.png') no-repeat center center;
+	background: var(--service_048) no-repeat center center;
 	background-size: 100%;
 	color: #ffffff !important;
 }
@@ -1179,7 +1167,7 @@ const animate = () => {
 }
 
 .service_051 {
-	background: url('public/img/service_051.png') no-repeat center center;
+	background: var(--service_051) no-repeat center center;
 	background-size: 100%;
 	color: #ffffff !important;
 	height: 640px;
@@ -1287,13 +1275,16 @@ const animate = () => {
 	z-index: 30;
 	color: #ffffff;
 }
-.service_center_02{
+
+.service_center_02 {
 	width: 30%;
 }
+
 @media (max-width: 1440px) {
-	.service_center_02{
+	.service_center_02 {
 		width: 40%;
 	}
+
 	.service_top1 {
 		padding-top: 16px;
 	}
@@ -1318,8 +1309,18 @@ const animate = () => {
 	.service-container {
 		margin: 30px 0px 0px 140px;
 	}
-	.service-item{
+
+	.service-item {
 		padding: 14px;
 	}
 }
+.service-1:hover{
+	color: rgb(2, 86, 255);
+	cursor: pointer;
+}
+.dz_img:hover{
+	cursor: pointer;
+	transition: all 0.3s ease;
+	transform: scale(1.05)
+}
 </style>
diff --git a/pages/proServices_con.vue b/pages/proServices_con.vue
index 9371947..9aa3594 100644
--- a/pages/proServices_con.vue
+++ b/pages/proServices_con.vue
@@ -4,39 +4,39 @@
 		<div class="group_666" style="position: relative;height: 600px;">
 			<swiper class="swiper-container h-full" @swiper="onSwiperNews" v-bind="swiperOptionsNews">
 				<swiper-slide>
-					<img src="public/img/services1.png" style="width: 100%;">
+					<img :src="`${cdnUrl}/img/services1.png`" style="width: 100%;">
 				</swiper-slide>
 				<swiper-slide>
-					<img src="public/img/services1.png" style="width: 100%;">
+					<img :src="`${cdnUrl}/img/services1.png`" style="width: 100%;">
 				</swiper-slide>
 			</swiper>
 			<!-- <div style="position: absolute;bottom: 50px;left: 0;width: 100%;z-index: 100;">
 				<div class="flex-row justify-center align-center">
 					<div>
-						<img src="public/img/left.png" alt="">
+						<img :src="`${cdnUrl}/img/left.png" alt="">
 					</div>
 					<div style="margin: 0px 20px;">
-						<img src="public/img/morse.png" alt="">
+						<img :src="`${cdnUrl}/img/morse.png" alt="">
 					</div>
 					<div>
-						<img src="public/img/right.png" alt="">
+						<img :src="`${cdnUrl}/img/right.png" alt="">
 					</div>
 				</div>
 			</div> -->
 		</div>
 		<div class="group_2 flex-col"
 			style="background-color: #ffffff;overflow: unset;position: relative;height: 629px;">
-			<img src="public/img/service_01s.png" style="width: 100%;position: absolute;top: -30px;z-index: 10;">
+			<img :src="`${cdnUrl}/img/service_01s.png`" style="width: 100%;position: absolute;top: -30px;z-index: 10;">
 			<div class="service_top1">
-				<div style="cursor: pointer;">
+				<div style="cursor: pointer;width: 50%;text-align: center;">
 					<div style="color: #FC7428;margin-bottom: 20px;">内容创作与运营</div>
-					<div style="background-color: #FC7428;width:40%;height: 8px;margin: 0 auto;"></div>
+					<div style="background-color: #FC7428;width:10%;height: 8px;margin: 0 auto;"></div>
 				</div>
-				<div style="cursor: pointer;">
-					<NuxtLink to="/proServices/">
+				<NuxtLink to="/proServices/" style="cursor: pointer;width: 50%;text-align: center;">
+					<div >
 						专业技术服务
-					</NuxtLink>
-				</div>
+					</div>
+				</NuxtLink>
 			</div>
 			<div class="service-01" style="text-align: center;padding-top: 70px;z-index: 30;">
 				<div style="font-size: 34px;font-weight: 700;">全媒体推广解决方案</div>
@@ -46,7 +46,7 @@
 				<div style="display: flex;flex-direction: row;justify-content: center;width: 100%;gap: 30px;">
 					<div class="service_center_01s">
 						<span class="service_center_01s_title">
-							<img src="public/img/content_ds.png" alt="" style="margin-right: 10px;">
+							<img :src="`${cdnUrl}/img/content_ds.png`" alt="" style="margin-right: 10px;">
 							覆盖各大主流平台
 						</span>
 						<span class="service_center_01s_text">定制【流量矩阵+内容策略+效果追踪】一体化方案</span>
@@ -54,7 +54,7 @@
 					</div>
 					<div class="service_center_01s">
 						<span class="service_center_01s_title">
-							<img src="public/img/content_xx.png" alt="" style="margin-right: 10px;">
+							<img :src="`${cdnUrl}/img/content_xx.png`" alt="" style="margin-right: 10px;">
 							平台搭建
 						</span>
 						<span class="service_center_01s_text">抖音、视频号、快手、B站、微信公众号、小红书等一站式布局</span>
@@ -62,7 +62,7 @@
 					</div>
 					<div class="service_center_01s">
 						<span class="service_center_01s_title">
-							<img src="public/img/content_yy.png" alt="" style="margin-right: 10px;">
+							<img :src="`${cdnUrl}/img/content_yy.png`" alt="" style="margin-right: 10px;">
 							精准运营
 						</span>
 						<span class="service_center_01s_text">行业大数据分析+账号定位+内容持续输出+流量裂变模型+账号运营变现</span>
@@ -72,7 +72,7 @@
 				<div style="margin-top: 30px;text-align: center;width: 100%;">
 					<span class="more_bot">
 						<span style="cursor: pointer;">了解更多解决方案</span>
-						<img src="public/img/moreright.png" alt=""
+						<img :src="`${cdnUrl}/img/moreright.png`" alt=""
 							style="margin-left: 15px;width: 10px;cursor: pointer;">
 					</span>
 				</div>
@@ -86,16 +86,16 @@
 				<div style="font-size: 34px;font-weight: 700;">品牌账号代运营</div>
 				<div class="flex-row justify-center align-center" style="margin-top: 30px;">
 					<div @click="openType(1)" :class="typeIndex == 1 ? 'video_wechat' : 'video_platform'">
-						<img v-if="typeIndex == 1" src="public/img/con_1.png" alt=""
+						<img v-if="typeIndex == 1" :src="`${cdnUrl}/img/con_1.png`" alt=""
 							style="margin-right: 10px;height: 24px;width: 24px;">
-						<img v-else src="public/img/mp4_video.png" alt=""
+						<img v-else :src="`${cdnUrl}/img/mp4_video.png`" alt=""
 							style="margin-right: 10px;height: 24px;width: 24px;">
 						视频平台
 					</div>
 					<div @click="openType(2)" :class="typeIndex == 2 ? 'video_wechat' : 'video_platform'">
-						<img v-if="typeIndex == 1" src="public/img/con_2.png"
+						<img v-if="typeIndex == 1" :src="`${cdnUrl}/img/con_2.png`"
 							style="margin-right: 10px;height: 24px;width: 24px;">
-						<img v-else src="public/img/video_wechat.png"
+						<img v-else :src="`${cdnUrl}/img/video_wechat.png`"
 							style="margin-right: 10px;height: 24px;width: 24px;">
 						微信账号
 					</div>
@@ -107,7 +107,7 @@
 				<div v-if="typeIndex == 2" @mouseenter="bgSet(index)" class="service-yw" style="position: relative;"
 					v-for="(item, index) in wchatList" :key="index">
 					<img :src="`/img/media/${index + 1}.png`" style="width:216px;">
-					<img v-if="!item.isShow" src="public/img/media/buttom.png"
+					<img v-if="!item.isShow" :src="`${cdnUrl}/img/media/buttom.png`"
 						style="width: 216px;position: absolute;bottom: 0px;">
 					<div v-if="!item.isShow" style="position: absolute;bottom: 0;color: #FFFFFF;padding: 15px;">
 						<div style="font-size: 17px;font-weight: 600;">{{ item.name }}</div>
@@ -120,7 +120,7 @@
 								style="width: 100%;height: 100%;display: flex;flex-direction: column;justify-content: center;align-items: center;">
 								<div style="width: 100%;text-align: center;padding: 15px;color: #ffffff;">
 									<div>
-										<img :src="`/img/media/a${index + 1}.png`"
+										<img :src="`${cdnUrl}/img/media/a${index + 1}.png`"
 											style="width:90px;height: 90px;margin: 0 auto;">
 									</div>
 									<div style="font-size: 16px;font-weight: 600;margin-top: 10px;">{{ item.title }}
@@ -135,7 +135,7 @@
 				<div v-if="typeIndex == 1" @mouseenter="bgSetVideo(index)" class="service-yw"
 					style="position: relative;" v-for="(item, index) in videoList" :key="index">
 					<img :src="`/img/media/b${index + 1}.png`" style="width:255px;">
-					<img v-if="!item.isShow" src="public/img/media/buttom2.png"
+					<img v-if="!item.isShow" :src="`${cdnUrl}/img/media/buttom2.png`"
 						style="width: 255px;position: absolute;bottom: 0px;">
 					<div v-if="!item.isShow" style="position: absolute;bottom: 0;color: #FFFFFF;padding: 15px;">
 						<div style="font-size: 17px;font-weight: 600;">{{ item.name }}</div>
@@ -148,7 +148,7 @@
 								style="width: 100%;height: 100%;display: flex;flex-direction: column;justify-content: center;align-items: center;">
 								<div style="width: 100%;text-align: center;padding:0px 15px;color: #ffffff;">
 									<div>
-										<img :src="`/img/media/v${index + 1}.png`"
+										<img :src="`${cdnUrl}/img/media/v${index + 1}.png`"
 											style="width:80px;height: 80px;margin: 0 auto;">
 									</div>
 									<div style="font-size: 16px;font-weight: 600;margin-top: 10px;">{{ item.title }}
@@ -168,7 +168,7 @@
 		<div class="flex justify-center align-center bottom-3s"
 			style="padding-top: 50px;z-index: 30;background-color: #f8f8f8;height: 559px;">
 			<div>
-				<img src="public/img/media/leftpeo.png" alt="">
+				<img :src="`${cdnUrl}/img/media/leftpeo.png`" alt="">
 			</div>
 			<div class="flex-col">
 				<div class="flex-col">
@@ -178,15 +178,15 @@
 				<div style="width: 568px;height: 1px;background: #EEEEEE;margin-top: 40px;"></div>
 				<div>
 					<div class="flex justify-center mediat3">
-						<img src="public/img/media/left1.png" alt="">
+						<img :src="`${cdnUrl}/img/media/left1.png`" alt="">
 						创意驱动，精准执行，从构思到落地，打通线上线下资源，一站式策划沉浸式活动，引爆品牌传播声量。
 					</div>
 					<div class="flex justify-center mediat3">
-						<img src="public/img/media/left2.png" alt="">
+						<img :src="`${cdnUrl}/img/media/left2.png`" alt="">
 						线上活动：聚焦行业热点打造爆款话题 （话题营销+直播连麦+裂变传播）助力品牌实现社交裂变传播，激活私域流量池。
 					</div>
 					<div class="flex justify-center mediat3">
-						<img src="public/img/media/left3.png" alt="">
+						<img :src="`${cdnUrl}/img/media/left3.png`" alt="">
 						线下活动：全案服务涵盖发布会、快闪店、行业峰会等多元形式，提供从创意策划、资源整合、现场执行到效果追踪的全流程专业落地解决方案。
 					</div>
 				</div>
@@ -203,11 +203,11 @@
 				<div style="width: 568px;height: 1px;background: #EEEEEE;margin-top: 40px;"></div>
 				<div>
 					<div class="flex justify-center mediat3">
-						<img src="public/img/media/right1.png" alt="">
+						<img :src="`${cdnUrl}/img/media/right1.png`" alt="">
 						整合全网权威渠道，依托海量优质媒体资源，定制新闻发布策略，以专业视角与高效执行，让您的新闻迅速抢占舆论高地，第一时间触达目标受众。
 					</div>
 					<div class="flex justify-center mediat3">
-						<img src="public/img/media/right2.png" alt="">
+						<img :src="`${cdnUrl}/img/media/right2.png`" alt="">
 						权威媒体资源覆盖人民网、新浪、网易等、科技等垂直领域媒体，形成多渠道传播矩阵，深度触达目标受众，强化品牌公信力与行业影响力。
 					</div>
 					<div class="flex justify-center">
@@ -245,7 +245,7 @@
 				</div>
 			</div>
 			<div>
-				<img src="public/img/media/rightpeo.png" alt="">
+				<img :src="`${cdnUrl}/img/media/rightpeo.png`" alt="">
 			</div>
 		</div>
 		<div class="flex" style="padding-top: 50px;z-index: 30;background-color: #ffffff;height: 592px;width: 100%;">
@@ -258,30 +258,33 @@
 				</div>
 			</div>
 			<div style="background: url(/img/media/botright.png)100% 100% no-repeat;width: 50%;">
-				<div style="flex-direction:column;display: flex;justify-content: center;;height: 542px;color: #FFFFFF;padding-left: 70px;">
+				<div
+					style="flex-direction:column;display: flex;justify-content: center;;height: 542px;color: #FFFFFF;padding-left: 70px;">
 					<div>
 						<div style="display: flex;align-items: center;">
-							<img src="public/img/media/left.png" style="width: 32px;">
+							<img :src="`${cdnUrl}/img/media/left.png`" style="width: 32px;">
 							<div style="font-size: 18px;font-weight: 700;padding-left: 25px;">从0到1打造现象级IP</div>
 						</div>
 						<div style="color: #FFFFFF;padding:10px 0px 0px 57px;">
 							<div style="font-size: 14px;font-weight: 400;">联动本地头部达人精准引爆同城流量，合作ROI高达1:8</div>
 						</div>
 					</div>
-					<div style="background-color: rgba(216, 216, 216, 0.5);width: 60%;height: 1px;margin: 50px 0px;"></div>
+					<div style="background-color: rgba(216, 216, 216, 0.5);width: 60%;height: 1px;margin: 50px 0px;">
+					</div>
 					<div>
 						<div style="display: flex;align-items: center;">
-							<img src="public/img/media/left.png" style="width: 32px;">
+							<img :src="`${cdnUrl}/img/media/left.png`" style="width: 32px;">
 							<div style="font-size: 18px;font-weight: 700;padding-left: 25px;">IP打造</div>
 						</div>
 						<div style="color: #FFFFFF;padding:10px 0px 0px 57px;">
 							<div style="font-size: 14px;font-weight: 400;">从人设定位到变现全链路服务</div>
 						</div>
 					</div>
-					<div style="background-color: rgba(216, 216, 216, 0.5);width: 60%;height: 1px;margin: 50px 0px;"></div>
+					<div style="background-color: rgba(216, 216, 216, 0.5);width: 60%;height: 1px;margin: 50px 0px;">
+					</div>
 					<div>
 						<div style="display: flex;align-items: center;">
-							<img src="public/img/media/left.png" style="width: 32px;">
+							<img :src="`${cdnUrl}/img/media/left.png`" style="width: 32px;">
 							<div style="font-size: 18px;font-weight: 700;padding-left: 25px;">达人资源</div>
 						</div>
 						<div style="color: #FFFFFF;padding:10px 0px 0px 57px;">
@@ -316,7 +319,7 @@ import $api from '@/service/webRequest'
 import { useI18n } from 'vue-i18n'
 import { useStore } from '~/store'
 const { locale } = useI18n()
-
+const cdnUrl = useCdn()
 const wchatList = ref([
 	{ name: '微信底部菜单搭建', desc: '让底部菜单成为品牌的亮眼名片', title: '汝南县妇幼保健院', content: '将deep seek AI问诊功能搭建在医院底部菜单，提高医院就诊效率50%。', isShow: false },
 	{ name: '内容采编', desc: '专业采编团队深挖品牌亮点', title: '河南科技大学第一附属医院', content: '《女博士养成记》原创文章平均每篇阅读量破5万+，整个系列阅读量破30万+。', isShow: false },
@@ -424,7 +427,7 @@ const animate = () => {
 
 <style scoped lang="scss">
 @import "@/assets/animate/animate.min.css";
-@import "@/assets/index.css";
+@import "@/assets/index.scss";
 
 :deep(.dswper .swiper-slide-next) {
 	transform: translate3d(0px, 0px, -507px) rotateX(0deg) rotateY(0deg) scale(1) !important;
@@ -435,7 +438,7 @@ const animate = () => {
 }
 
 .service_023 {
-	background: url(/public/img/service_023.png) no-repeat center center;
+	background: var(--service_023) no-repeat center center;
 	width: 100%;
 	height: 100%;
 	background-size: 100%;
@@ -445,7 +448,7 @@ const animate = () => {
 }
 
 .service_033 {
-	background: url(/public/img/service_033.png) no-repeat center center;
+	background: var(--service_033) no-repeat center center;
 	width: 100%;
 	height: 100%;
 	background-size: 100%;
@@ -453,7 +456,7 @@ const animate = () => {
 }
 
 .service_bottom {
-	background: url('public/img/service_048.png') no-repeat center center;
+	background: var(--service_048) no-repeat center center;
 	background-size: 100%;
 	color: #ffffff !important;
 }
@@ -464,7 +467,7 @@ const animate = () => {
 }
 
 .service_051 {
-	background: url('public/img/service_051.png') no-repeat center center;
+	background: var(--service_051) no-repeat center center;
 	background-size: 100%;
 	color: #ffffff !important;
 	height: 640px;
@@ -573,14 +576,18 @@ const animate = () => {
 }
 
 .service_center_01s {
-	background: url('/public/img/content_top.png') 100% no-repeat;
+	background: var(--content_top) 100% no-repeat;
 	width: 380px;
 	height: 196px;
 	display: flex;
 	flex-direction: column;
 	justify-content: start;
 	padding-left: 30px;
-
+	transition: all 0.3s ease;
+	&:hover {
+		transform: scale(1.05);
+		cursor: pointer;
+	}
 	.service_center_01s_title {
 		margin-top: 30px;
 		width: 180px;
@@ -643,7 +650,7 @@ const animate = () => {
 .video_platform {
 	width: 179px;
 	height: 48px;
-	background: url(public/img/video.png) 100% no-repeat;
+	background: var(--video) 100% no-repeat;
 	line-height: 44px;
 	font-family: Source Han Sans, Source Han Sans;
 	font-weight: 700;
@@ -660,7 +667,7 @@ const animate = () => {
 .video_wechat {
 	width: 185px;
 	height: 52px;
-	background: url(public/img/wechat1.png) 100% no-repeat;
+	background: var(--wechat1) 100% no-repeat;
 	line-height: 46px;
 	font-family: Source Han Sans, Source Han Sans;
 	font-weight: 700;
@@ -717,6 +724,10 @@ const animate = () => {
 		font-style: normal;
 		text-transform: none;
 		align-items: center;
+		&:hover{
+			color: #FC7428;
+			cursor: pointer;
+		}
 		img {
 			margin-right: 30px;
 		}
diff --git a/pages/societyDuty.vue b/pages/societyDuty.vue
index 54b5afa..b87cef9 100644
--- a/pages/societyDuty.vue
+++ b/pages/societyDuty.vue
@@ -4,25 +4,12 @@
 		<div class="group_666" style="position: relative;height: 600px;">
 			<swiper class="swiper-container h-full" @swiper="onSwiperNews" v-bind="swiperOptionsNews">
 				<swiper-slide>
-					<img src="public/img/societyduty/shehui.png" style="width: 100%;">
+					<img :src="`${cdnUrl}/img/societyduty/shehui.png`" style="width: 100%;">
 				</swiper-slide>
 				<swiper-slide>
-					<img src="public/img/societyduty/shehui.png" style="width: 100%;">
+					<img :src="`${cdnUrl}/img/societyduty/shehui.png`" style="width: 100%;">
 				</swiper-slide>
 			</swiper>
-			<!-- <div style="position: absolute;bottom: 50px;left: 0;width: 100%;z-index: 100;">
-				<div class="flex-row justify-center align-center">
-					<div>
-						<img src="public/img/left.png" alt="">
-					</div>
-					<div style="margin: 0px 20px;">
-						<img src="public/img/morse.png" alt="">
-					</div>
-					<div>
-						<img src="public/img/right.png" alt="">
-					</div>
-				</div>
-			</div> -->
 		</div>
 		<div class="box_11 flex-col bottom_imgss">
 			<!-- <div class="text-wrapper_10">
@@ -43,19 +30,11 @@
 					<div class="text_25">
 						<span style="color: rgb(252, 116, 40);">活动影集（部分）</span>
 						<div
-							style="    left: 20px;width: 100%;height: 1px;background-color: #fc7428;position: absolute;bottom: -21px;">
+							style="left: 20px;width: 100%;height: 1px;background-color: #fc7428;position: absolute;bottom: -21px;">
 						</div>
 					</div>
 					
 				</div>
-				<!-- <div class="flex-row justify-center align-center">
-					<div style="margin-right: 10px;">
-						<span class="text_32">更多案例</span>
-					</div>
-					<div>
-						<img src="public/img/anli.png" />
-					</div>
-				</div> -->
 				<div class="group_15" style="flex: 0 0 100%;"></div>
 			</div>
 			
@@ -63,7 +42,7 @@
 
 				<div class="box_con flex-col" v-for="(item,index) in lists" :key="index">
 					<div class="align-center"  style="justify-content: center;">
-						<img width="277px" height="189px" :src="`/img/societyduty/s${index+1}.png`" alt="">
+						<img width="277px" height="189px" :src="`${cdnUrl}/img/societyduty/s${index+1}.png`" alt="">
 					</div>
 					<div class="flex-col" style="justify-content: center;margin-top: 5px;">
 						<span class="text_tt">
@@ -103,7 +82,7 @@ import $api from '@/service/webRequest'
 import { useI18n } from 'vue-i18n'
 import { useStore } from '~/store'
 const { locale } = useI18n()
-
+const cdnUrl = useCdn()
 let newsSwiper: any = null
 const onSwiperNews = (swiper: any) => {
 	newsSwiper = swiper
@@ -135,13 +114,13 @@ const lists = ref([
 	{title: '21年西工硅巷青创加速营活动进行中'},
 	{title: '香港青英会15 周年、第16 届执委会暨第7屆理事会就职仪式'},
 	{title: '青年企业家助力河南高质量发展暨河南青年创新创业论坛'},
-	{title: '洛阳市青年联合会第九届委员会常务委员第一次会议'},
-	{title: '河南青年科技创新论坛'},
-	{title: '团省委省青联2023年新春送温暖慰问活动'},
 	{title: '郑州市儿童福利院慰问活动'},
+	{title: '河南青年科技创新论坛'},
 	{title: '洛阳市青年联合会第九届委员会常务委员第一次会议'},
+	{title: '团省委省青联2023年新春送温暖慰问活动'},
+	{title: '荥阳市乔楼镇付河村“扶贫助困 情系家乡”志愿活动'},
 	{title: '东方医院活动'},
-	{title: '中国青年梦想季活动-中国   '},
+	{title: '中国青年梦想季活动-中国'},
 	{title: '河南省青年企业家协会第十一届常务理事选举'}
 
 ]);
@@ -231,7 +210,7 @@ const animate = () => {
 
 <style lang="scss" scoped>
 @import "@/assets/animate/animate.min.css";
-@import "@/assets/index.css";
+@import "@/assets/index.scss";
 
 
 
diff --git a/pages/societyDutyNew.vue b/pages/societyDutyNew.vue
index 9054fd1..77e9eb7 100644
--- a/pages/societyDutyNew.vue
+++ b/pages/societyDutyNew.vue
@@ -4,33 +4,14 @@
 		<div class="group_666" style="position: relative;height: 600px;">
 			<swiper class="swiper-container h-full" @swiper="onSwiperNews" v-bind="swiperOptionsNews">
 				<swiper-slide>
-					<img src="public/img/societyduty/shehui.png" style="width: 100%;">
+					<img :src="`${cdnUrl}/img/societyduty/shehui.png`" style="width: 100%;">
 				</swiper-slide>
 				<swiper-slide>
-					<img src="public/img/societyduty/shehui.png" style="width: 100%;">
+					<img :src="`${cdnUrl}/img/societyduty/shehui.png`" style="width: 100%;">
 				</swiper-slide>
 			</swiper>
-			<!-- <div style="position: absolute;bottom: 50px;left: 0;width: 100%;z-index: 100;">
-				<div class="flex-row justify-center align-center">
-					<div>
-						<img src="public/img/left.png" alt="">
-					</div>
-					<div style="margin: 0px 20px;">
-						<img src="public/img/morse.png" alt="">
-					</div>
-					<div>
-						<img src="public/img/right.png" alt="">
-					</div>
-				</div>
-			</div> -->
 		</div>
 		<div class="box_11 flex-col bottom_imgss">
-			<!-- <div class="text-wrapper_10">
-				<span class="text_41">公司荣誉</span>
-			</div>
-			<div class="text-wrapper_11">
-				<span class="text_42">Company&nbsp;Honors&nbsp;</span>
-			</div> -->
 			<div class="group_14 flex-row justify-between align-center" style="flex-wrap: wrap;width: 1200px;padding-top: 30px;">
 				<div class="flex-row">
 					<div class="text_25">
@@ -46,22 +27,14 @@
 					</div>
 
 				</div>
-				<!-- <div class="flex-row justify-center align-center">
-					<div style="margin-right: 10px;">
-						<span class="text_32">更多案例</span>
-					</div>
-					<div>
-						<img src="public/img/anli.png" />
-					</div>
-				</div> -->
 				<div class="group_15" style="flex: 0 0 100%;"></div>
 			</div>
 
 			<div class="boxgs flex-row flex-wrap">
 				<div class="boxgs_top" style="display: flex;align-items: center;justify-content: center;">
 					<div style="position: relative;cursor: pointer;" @click="videoShow = true">
-						<img src="public/img/societyduty/det.png" style="width: 500px;height: 325px;">
-						<img src="public/img/societyduty/bf.png"
+						<img :src="`${cdnUrl}/img/societyduty/det.png`" style="width: 500px;height: 325px;">
+						<img :src="`${cdnUrl}/img/societyduty/bf.png`"
 							style="width: 50px;height: 50px;position: absolute;top: 45%;left: 0;right: 0;margin: 0 auto;">
 					</div>
 					<div style="width: 53%;padding-left: 30px;">
@@ -100,7 +73,7 @@
 							<div style="font-size: 14px;color: #FC7428;display: flex;align-items: center;">
 								<div>查看详情</div>
 								<div style="margin-left: 10px;">
-									<img src="public/img/societyduty/r.png" alt="">
+									<img :src="`${cdnUrl}/img/societyduty/r.png`" alt="">
 								</div>
 							</div>
 						</div>
@@ -117,14 +90,14 @@
 			<div class="abs popCont pop_video_cont">
 				<a @click="videoShow = false" class="abs pop_video_close closePop"></a>
 				<video x5-playsinline="" playsinline="" webkit-playsinline="" preload=""
-					x5-video-orientation="portraint" controls="" autoplay src="public/img/yue.mp4"
+					x5-video-orientation="portraint" controls="" autoplay :src="`${cdnUrl}/img/yue.mp4`"
 					draggable="true"></video>
 			</div>
 		</div>
 	</div>
 </template>
 
-<script lang="ts" setup>
+<script lang="ts" setup >
 import { NPagination } from 'naive-ui'
 import { Swiper, SwiperSlide } from 'swiper/vue'
 import { nextTick, ref } from 'vue'
@@ -150,7 +123,7 @@ import { useStore } from '~/store'
 const { locale } = useI18n()
 
 const videoShow = ref(false);
-
+const cdnUrl = useCdn()
 let newsSwiper: any = null
 const onSwiperNews = (swiper: any) => {
 	newsSwiper = swiper
@@ -284,7 +257,7 @@ const animate = () => {
 
 <style lang="scss" scoped>
 @import "@/assets/animate/animate.min.css";
-@import "@/assets/index.css";
+@import "@/assets/index.scss";
 
 ::v-deep .n-pagination .n-pagination-item:not(.n-pagination-item--disabled).n-pagination-item--active {
 	color: #ffffff;
@@ -331,7 +304,7 @@ const animate = () => {
 	margin-top: 30px;
 
 	.boxgs_top {
-		background: url(/img/societyduty/newstop.png) 100% 100% no-repeat;
+		background: var(--newstop) 100% 100% no-repeat;
 		width: 100%;
 		height: 385px;
 		border: 1px solid #FC7428;
@@ -374,4 +347,45 @@ const animate = () => {
 }
 
 
+.pop {
+	position: fixed;
+	top: 0;
+	left: 0;
+	width: 100%;
+	height: 100%;
+	background: rgba(0, 0, 0, .8);
+	z-index: 200;
+	display: none;
+}
+
+.popCont {
+	position: absolute;
+	top: 50%;
+	left: 50%;
+	transform: translate(-50%, -50%);
+}
+
+.pop_video_close {
+	border-radius: 50%;
+	position: absolute;
+	top: 0;
+	right: -75px;
+	width: 50px;
+	height: 50px;
+	background: var(--close) no-repeat 0 0;
+	background-size: 100% auto;
+	border: 6px solid #979797;
+}
+
+.pop_video_cont {
+	width: 600px;
+	border: 6px solid #979797;
+	background: #000;
+}
+
+.pop_video_cont video {
+	display: block;
+	width: 100%;
+	height: 100%;
+}
 </style>
diff --git a/plugins/cdn.ts b/plugins/cdn.ts
new file mode 100644
index 0000000..3f02e38
--- /dev/null
+++ b/plugins/cdn.ts
@@ -0,0 +1,34 @@
+import { defineNuxtPlugin } from '#app'
+
+export default defineNuxtPlugin((nuxtApp) => {
+  const config = useRuntimeConfig()
+  
+  // 定义全局变量
+  const cdnUrl = config.public.cdnDomain
+  console.log(cdnUrl);
+  
+  // 在客户端注入 CSS 变量
+  if (process.client) {
+    document.documentElement.style.setProperty('--cdn-domain', cdnUrl)
+  }
+  
+  // 只使用一种注入方式
+  return {
+    provide: {
+      cdnUrl
+    }
+  }
+})
+
+// 为了 TypeScript 支持
+declare module '#app' {
+  interface NuxtApp {
+    $cdnUrl: string
+  }
+}
+
+declare module '@vue/runtime-core' {
+  interface ComponentCustomProperties {
+    $cdnUrl: string
+  }
+} 
\ No newline at end of file
diff --git a/public/img/banner.png b/public/img/banner.png
index 00c0549..e7f2580 100644
Binary files a/public/img/banner.png and b/public/img/banner.png differ
diff --git a/public/img/get_top.png b/public/img/get_top.png
new file mode 100644
index 0000000..2165194
Binary files /dev/null and b/public/img/get_top.png differ