diff --git a/public/static/img/logo-dark.png b/public/static/img/logo-dark.png
index c4bf473..e57d2d5 100644
Binary files a/public/static/img/logo-dark.png and b/public/static/img/logo-dark.png differ
diff --git a/public/static/img/logo-light.png b/public/static/img/logo-light.png
index c4bf473..e57d2d5 100644
Binary files a/public/static/img/logo-light.png and b/public/static/img/logo-light.png differ
diff --git a/src/assets/bottomBg.png b/src/assets/bottomBg.png
new file mode 100644
index 0000000..b02558f
Binary files /dev/null and b/src/assets/bottomBg.png differ
diff --git a/src/assets/css/common.css b/src/assets/css/common.css
index 0f20334..6632db4 100644
--- a/src/assets/css/common.css
+++ b/src/assets/css/common.css
@@ -73,7 +73,7 @@ a:focus {
 }
 .wrapper1518 {
   width: 1518rem;
-  margin: 0 auto 0 0;
+  margin: 0 auto;
 }
 .wrapper1680 {
   width: 1680rem;
diff --git a/src/assets/topBg.png b/src/assets/topBg.png
new file mode 100644
index 0000000..9223cc6
Binary files /dev/null and b/src/assets/topBg.png differ
diff --git a/src/components/NavBar.vue b/src/components/NavBar.vue
index 214dde9..ffb3798 100644
--- a/src/components/NavBar.vue
+++ b/src/components/NavBar.vue
@@ -152,6 +152,7 @@
     padding: 28rem 60rem;
     box-sizing: border-box;
     transition: background-color 0.3s;
+    height: 158rem;
   }
   .nav-left {
     width: 0;
@@ -220,6 +221,7 @@
   /* theme-dark --- start */
   .nav-bar-dark {
     color: #ffffff;
+    background-image: url('@/assets/topBg.png');
   }
   .nav-bar-dark .nav-submenus > div {
     background-color: rgba(255, 255, 255, 0.98);
diff --git a/src/views/About/CompanyIntroduction/Index.vue b/src/views/About/CompanyIntroduction/Index.vue
index 3cbdd02..9c7804a 100644
--- a/src/views/About/CompanyIntroduction/Index.vue
+++ b/src/views/About/CompanyIntroduction/Index.vue
@@ -41,7 +41,6 @@
           name="fade-slide-left"
         >
           <img
-            v-show="item.offsetLevel >= 0"
             :src="item.imgSrc"
             alt=""
             style="width:1165rem;height:720rem;"
@@ -52,7 +51,6 @@
           name="fade-slide-right"
         >
           <img
-            v-show="item.offsetLevel >= 0"
             :src="item.imgSrc"
             alt=""
             style="width:1165rem;height:720rem;"
@@ -61,7 +59,6 @@
         <div class="content">
           <transition name="fade-slide-bottom">
             <div
-              v-show="item.offsetLevel >= 0"
               class="content-type"
             >
               {{ item.type }}
@@ -69,7 +66,6 @@
           </transition>
           <transition name="fade-slide-bottom">
             <div
-              v-show="item.offsetLevel >= 0"
               class="content-title"
               style="--tde:0.3s;"
             >
@@ -78,7 +74,6 @@
           </transition>
           <transition name="fade-slide-bottom">
             <div
-              v-show="item.offsetLevel >= 0"
               class="content-main"
               v-html="item.content"
               style="--tde: 0.6s;"
@@ -86,14 +81,13 @@
           </transition>
           <transition name="fade-slide-bottom">
             <div
-              v-show="item.offsetLevel >= 0"
               style="--tde:0.8s;width: 66rem; height: 4rem; background-color: #FFAE00;margin-top:40rem;"
             ></div>
           </transition>
         </div>
       </div>
     </div>
-    <div
+    <!-- <div
       class="screen5"
       id="screen5"
     >
@@ -133,7 +127,7 @@
           />
         </div>
       </div>
-    </div>
+    </div> -->
     <!-- <div class="screen6">
       <div class="wrapper1680">
         <div class="title">
@@ -285,22 +279,22 @@ export default {
       if (v >= this.screen2.offsets[i2]) {
         this.screen2.offsetLevel = i2;
       }
-      const i3 = this.screen3.offsetLevel + 1;
-      if (v >= this.screen3.offsets[i3]) {
-        this.screen3.offsetLevel = i3;
-      }
-      const i4 = this.screen4.offsetLevel + 1;
-      if (v >= this.screen4.offsets[i4]) {
-        this.screen4.offsetLevel = i4;
-      }
-      const i5 = this.screen5.offsetLevel + 1;
-      if (v >= this.screen5.offsets[i5]) {
-        this.screen5.offsetLevel = i5;
-      }
-      const i6 = this.screen6.offsetLevel + 1;
-      if (v >= this.screen6.offsets[i6]) {
-        this.screen6.offsetLevel = i6;
-      }
+      // const i3 = this.screen3.offsetLevel + 1;
+      // if (v >= this.screen3.offsets[i3]) {
+      //   this.screen3.offsetLevel = i3;
+      // }
+      // const i4 = this.screen4.offsetLevel + 1;
+      // if (v >= this.screen4.offsets[i4]) {
+      //   this.screen4.offsetLevel = i4;
+      // }
+      // const i5 = this.screen5.offsetLevel + 1;
+      // if (v >= this.screen5.offsets[i5]) {
+      //   this.screen5.offsetLevel = i5;
+      // }
+      // const i6 = this.screen6.offsetLevel + 1;
+      // if (v >= this.screen6.offsets[i6]) {
+      //   this.screen6.offsetLevel = i6;
+      // }
     },
     $route () {
       if (this.$route.hash) {
@@ -502,7 +496,7 @@ export default {
   margin-top: 90rem;
 }
 .screen4{
-  margin-top: 90rem;
+  margin: 90rem 0;
 }
 .screen-list .wrapper1920 {
   height: 100%;
diff --git a/src/views/Business/CapitalServices/Index.vue b/src/views/Business/CapitalServices/Index.vue
index b6d185b..feebd90 100644
--- a/src/views/Business/CapitalServices/Index.vue
+++ b/src/views/Business/CapitalServices/Index.vue
@@ -4,12 +4,21 @@
       <div style="height:104rem;"></div>
     </div>
     <div class="screen2">
-      <div class="wrapper1680">
+      <div class="wrapper1680"> 
         <transition name="fade-slide-bottom">
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:53rem;--l:0rem;--c:#ff0000;"
+            style="--l:0rem;--t:93rem;--r:8rem;--w:950rem;--fs:22rem;--lh:30rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:justify;--tde:0.6s;"
+          >
+            {{ screen2.contentCn }}
+          </div>
+        </transition>
+        <transition name="fade-slide-bottom">
+          <div
+            v-show="screen2.show"
+            class="text-posi-abs"
+            style="--t:53rem;--r:0rem;--c:#ff0000;"
           >
             {{ screen2.title }}
           </div>
@@ -18,25 +27,16 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:99rem;--l:0rem;--fs:72rem;--c:#111111;--ff:MicrosoftYaHeiLight;--tde:0.3s;"
+            style="--t:99rem;--r:0rem;--fs:72rem;--c:#111111;--ff:MicrosoftYaHeiLight;--tde:0.3s;"
           >
             资本服务
           </div>
         </transition>
-        <transition name="fade-slide-bottom">
-          <div
-            v-show="screen2.show"
-            class="text-posi-abs"
-            style="--t:93rem;--r:8rem;--w:650rem;--fs:22rem;--lh:30rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:justify;--tde:0.6s;"
-          >
-            {{ screen2.contentCn }}
-          </div>
-        </transition>
         <transition name="fade-slide-bottom">
           <div
             v-show="screen2.show"
             class="image-posi-abs"
-            style="--l:1rem;--t:447rem;--w:1680rem;--h:620rem;--tde:0.9s;"
+            style="--l:1rem;--t:320rem;--w:1680rem;--h:620rem;--tde:0.9s;"
           >
             <img
               :src="screen2.imageSrc"
@@ -531,7 +531,7 @@ export default {
 }
 .screen2 {
   position: relative;
-  height: 1186rem;
+  height: 1030rem;
   background-color: #ffffff;
 }
 .screen2 .wrapper1680 {
@@ -545,6 +545,7 @@ export default {
   position: relative;
   height: 1260rem;
   background-color: #ffffff;
+  display: none;
 }
 .screen3 .wrapper1680 {
   height: 100%;
@@ -611,6 +612,7 @@ export default {
   position: relative;
   height: 1286rem;
   background-color: #FFFFFF;
+  display: none;
 }
 .screen4 .wrapper1680 {
   padding: 124rem 0;
@@ -671,6 +673,7 @@ export default {
   position: relative;
   height: 733rem;
   background-color: #ffffff;
+  display: none;
 }
 .screen5 .wrapper1680 {
   height: 100%;
@@ -708,6 +711,7 @@ export default {
   position: relative;
   height: 800rem;
   background-color: rgb(245, 244, 249);
+  display: none;
 }
 .screen6 .wrapper1680 {
   height: 100%;
diff --git a/src/views/Business/Commercial/Index.vue b/src/views/Business/Commercial/Index.vue
index 8750fd2..53231eb 100644
--- a/src/views/Business/Commercial/Index.vue
+++ b/src/views/Business/Commercial/Index.vue
@@ -6,43 +6,23 @@
     <div class="screen2">
       <div class="wrapper1680">
         <transition name="fade-slide-bottom">
-          <div
-            v-show="screen2.show"
-            class="text-posi-abs"
-            style="--t:53rem;--l:0rem;--c:#ff0000;"
-          >
+          <div v-show="screen2.show" class="text-posi-abs" style="--t:53rem;--r:0rem;--c:#ff0000;">
             {{ screen2.title }}
           </div>
         </transition>
         <transition name="fade-slide-bottom">
-          <div
-            v-show="screen2.show"
-            class="text-posi-abs"
-            style="--t:99rem;--l:0rem;--fs:72rem;--c:#111111;--ff:MicrosoftYaHeiLight;--tde:0.3s;"
-          >
+          <div v-show="screen2.show" class="text-posi-abs" style="--t:99rem;--r:0rem;--fs:72rem;--c:#111111;--ff:MicrosoftYaHeiLight;--tde:0.3s;">
             商业服务
           </div>
         </transition>
         <transition name="fade-slide-bottom">
-          <div
-            v-show="screen2.show"
-            class="text-posi-abs"
-            style="--t:93rem;--r:8rem;--w:650rem;--fs:22rem;--lh:30rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:justify;--tde:0.6s;text-indent: 1.5em;"
-          >
+          <div v-show="screen2.show" class="text-posi-abs" style="--l:0rem;--t:93rem;--r:8rem;--w:950rem;--fs:22rem;--lh:30rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:justify;--tde:0.6s;text-indent: 1.5em;">
             {{ screen2.contentCn }}
           </div>
         </transition>
         <transition name="fade-slide-bottom">
-          <div
-            v-show="screen2.show"
-            class="image-posi-abs"
-            style="--l:1rem;--t:447rem;--w:1680rem;--h:620rem;--tde:0.9s;"
-          >
-            <img
-              :src="screen2.imageSrc"
-              alt=""
-              style="width:100%;height:100%;"
-            >
+          <div v-show="screen2.show" class="image-posi-abs" style="--l:1rem;--t:320rem;--w:1680rem;--h:620rem;--tde:0.9s;">
+            <img :src="screen2.imageSrc" alt="" style="width:100%;height:100%;">
           </div>
         </transition>
       </div>
@@ -50,56 +30,29 @@
     <div class="screen3">
       <div class="wrapper1680">
         <transition name="fade-slide-bottom">
-          <div
-            v-show="screen3.offsetLevel >= 0"
-            class="text-posi-abs"
-            style="--t:115rem;--r:0rem;--w:100%;--fs:42rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:center;"
-          >
+          <div v-show="screen3.offsetLevel >= 0" class="text-posi-abs" style="--t:115rem;--r:0rem;--w:100%;--fs:42rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:center;">
             {{ screen3.titleCn }}
           </div>
         </transition>
         <transition name="fade-slide-bottom">
-          <div
-            v-show="screen3.offsetLevel >= 0"
-            class="text-posi-abs"
-            style="--t:197rem;--r:0rem;--w:100%;--fs:20rem;--lh:35rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:center;--tde:0.3s;"
-          >
+          <div v-show="screen3.offsetLevel >= 0" class="text-posi-abs" style="--t:197rem;--r:0rem;--w:100%;--fs:20rem;--lh:35rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:center;--tde:0.3s;">
             {{ screen3.contentCn }}
           </div>
         </transition>
         <div class="list-wrapper">
-          <div
-            v-for="(item, index) in screen3.list"
-            :key="item.id"
-            class="list-item"
-          >
+          <div v-for="(item, index) in screen3.list" :key="item.id" class="list-item">
             <transition name="scale">
-              <div
-                v-show="screen3.offsetLevel >= 0"
-                class="list-img"
-                :style="`--tde:${0.6 + index * 0.05}s;`"
-              >
-                <img
-                  :src="item.imageurl"
-                  alt=""
-                >
+              <div v-show="screen3.offsetLevel >= 0" class="list-img" :style="`--tde:${0.6 + index * 0.05}s;`">
+                <img :src="item.imageurl" alt="">
               </div>
             </transition>
             <transition name="fade-slide-bottom">
-              <div
-                v-show="screen3.offsetLevel >= 0"
-                class="list-title"
-                :style="`--tde:${0.9 + index * 0.05}s;`"
-              >
+              <div v-show="screen3.offsetLevel >= 0" class="list-title" :style="`--tde:${0.9 + index * 0.05}s;`">
                 {{ item.businessName }}
               </div>
             </transition>
             <transition name="fade-slide-bottom">
-              <div
-                v-show="screen3.offsetLevel >= 0"
-                class="list-content"
-                :style="`--tde:${1.2 + index * 0.05}s;`"
-              >
+              <div v-show="screen3.offsetLevel >= 0" class="list-content" :style="`--tde:${1.2 + index * 0.05}s;`">
                 {{ item.titleChinese }}
               </div>
             </transition>
@@ -109,16 +62,9 @@
     </div>
     <div class="screen4">
       <div class="wrapper1680">
-        <div
-          v-for="(item, index) in screen4.list"
-          :key="item.id"
-          class="list-item"
-        >
+        <div v-for="(item, index) in screen4.list" :key="item.id" class="list-item">
           <transition :name="'curtain-' + (index % 2 === 0 ? 'right' : 'left')">
-            <div
-              class="content-wrapper"
-              :style="`--tdu:0.5s;--initial:#f5f5f8;`"
-            >
+            <div class="content-wrapper" :style="`--tdu:0.5s;--initial:#f5f5f8;`">
               <div class="title">
                 {{ item.businessName }}
               </div>
@@ -128,15 +74,8 @@
             </div>
           </transition>
           <transition :name="'curtain-' + (index % 2 === 0 ? 'right' : 'left')">
-            <div
-              class="image-wrapper"
-              :style="`--tdu:0.5s;--tde:0.5s;--initial:#f5f5f8;`"
-            >
-              <img
-                :src="item.imageurl"
-                alt=""
-                style="width:100%;height:100%;"
-              >
+            <div class="image-wrapper" :style="`--tdu:0.5s;--tde:0.5s;--initial:#f5f5f8;`">
+              <img :src="item.imageurl" alt="" style="width:100%;height:100%;">
             </div>
           </transition>
         </div>
@@ -144,367 +83,376 @@
     </div>
     <div class="screen5">
       <div class="wrapper1680">
-        <div
-          class="box-posi-abs"
-          style="--t:90rem;--w:100%;--h:1rem;"
-        >
+        <div class="box-posi-abs" style="--t:90rem;--w:100%;--h:1rem;">
           <div class="split-line"></div>
         </div>
-        <div
-          class="image-posi-abs"
-          style="--l:1rem;--r:1rem;--t:180rem;--w:1680rem;--h:550rem;"
-        >
-          <img
-            :src="screen5.joinUs.imageSrc"
-            alt=""
-            style="width:100%;height:100%;"
-          >
+        <div class="image-posi-abs" style="--l:1rem;--r:1rem;--t:180rem;--w:1680rem;--h:550rem;">
+          <img :src="screen5.joinUs.imageSrc" alt="" style="width:100%;height:100%;">
         </div>
         <transition name="fade-slide-left">
-          <div
-            class="text-posi-abs"
-            style="--t:333rem;--l:118rem;--fs:30rem;--c:#ffffff;"
-          >
+          <div class="text-posi-abs" style="--t:333rem;--l:118rem;--fs:30rem;--c:#ffffff;">
             {{ screen5.joinUs.title }}
           </div>
         </transition>
-        <div
-          class="text-posi-abs"
-          style="--t:402rem;--l:117rem;--w:536rem;--fs:16rem;--lh:24rem;--c:#ffffff;--ff:MicrosoftYaHeiLight;--ta:justify;"
-        >
+        <div class="text-posi-abs" style="--t:402rem;--l:117rem;--w:536rem;--fs:16rem;--lh:24rem;--c:#ffffff;--ff:MicrosoftYaHeiLight;--ta:justify;">
           {{ screen5.joinUs.contentCn }}
         </div>
-        <div
-          class="text-posi-abs"
-          style="--l:118rem;--t:523rem;--w:209rem;--h:57rem;--fs:24rem;--lh:57rem;--ff:MicrosoftYaHeiSemiBold;--ta:center;background-color:#ffffff;border-radius:28rem;cursor: pointer;"
-          @click="$router.push('/recruit/socialRecruit')"
-        >
+        <div class="text-posi-abs" style="--l:118rem;--t:523rem;--w:209rem;--h:57rem;--fs:24rem;--lh:57rem;--ff:MicrosoftYaHeiSemiBold;--ta:center;background-color:#ffffff;border-radius:28rem;cursor: pointer;" @click="$router.push('/recruit/socialRecruit')">
           <span class="join-btn-text">JOIN US</span>
         </div>
       </div>
     </div>
-    <FootBar
-      id="myfooter"
-      theme="dark"
-    ></FootBar>
+    <FootBar id="myfooter" theme="dark"></FootBar>
   </div>
 </template>
 
 <script>
-import { mapMutations, mapState } from 'vuex';
-import FootBar from '@/components/FootBar.vue';
-export default {
-  components: { FootBar },
-  data () {
-    return {
-      screen2: {
-        show: false,
-        title: '',
-        contentCn: '',
-        imageSrc: '',
-      },
-      screen3: {
-        offsets: [800],
-        offsetLevel: -1,
-        titleCn: '',
-        contentCn: '',
-        list: [],
-      },
-      screen4: {
-        offsets: [1700, 2000],
-        offsetLevel: -1,
-        list: [],
-      },
-      screen5: {
-        offsets: [2900, 3900],
-        offsetLevel: -1,
-        keyCase: {
+  import { mapMutations, mapState } from 'vuex';
+  import FootBar from '@/components/FootBar.vue';
+  export default {
+    components: { FootBar },
+    data() {
+      return {
+        screen2: {
+          show: false,
           title: '',
           contentCn: '',
+          imageSrc: ''
         },
-        plateList: [],
-        joinUs: {
-          title: '',
+        screen3: {
+          offsets: [800],
+          offsetLevel: -1,
+          titleCn: '',
           contentCn: '',
-          imageSrc: '',
+          list: []
         },
+        screen4: {
+          offsets: [1700, 2000],
+          offsetLevel: -1,
+          list: []
+        },
+        screen5: {
+          offsets: [2900, 3900],
+          offsetLevel: -1,
+          keyCase: {
+            title: '',
+            contentCn: ''
+          },
+          plateList: [],
+          joinUs: {
+            title: '',
+            contentCn: '',
+            imageSrc: ''
+          }
+        }
+      };
+    },
+    computed: {
+      ...mapState({
+        scrollTop: state => state.scroll.scrollTop,
+        webScale: state => state.web.scale
+      })
+    },
+    watch: {
+      scrollTop(val) {
+        const v = val / this.webScale;
+        const i3 = this.screen3.offsetLevel + 1;
+        if (v >= this.screen3.offsets[i3]) {
+          this.screen3.offsetLevel = i3;
+        }
+        const i4 = this.screen4.offsetLevel + 1;
+        if (v >= this.screen4.offsets[i4]) {
+          this.screen4.offsetLevel = i4;
+        }
+        const i5 = this.screen5.offsetLevel + 1;
+        if (v >= this.screen5.offsets[i5]) {
+          this.screen5.offsetLevel = i5;
+        }
       },
-    };
-  },
-  computed: {
-    ...mapState({
-      scrollTop: state => state.scroll.scrollTop,
-      webScale: state => state.web.scale,
-    }),
-  },
-  watch: {
-    scrollTop (val) {
-      const v = val / this.webScale;
-      const i3 = this.screen3.offsetLevel + 1;
-      if (v >= this.screen3.offsets[i3]) {
-        this.screen3.offsetLevel = i3;
-      }
-      const i4 = this.screen4.offsetLevel + 1;
-      if (v >= this.screen4.offsets[i4]) {
-        this.screen4.offsetLevel = i4;
-      }
-      const i5 = this.screen5.offsetLevel + 1;
-      if (v >= this.screen5.offsets[i5]) {
-        this.screen5.offsetLevel = i5;
+      $route() {
+        if (this.$route.hash) {
+          this.forceScroll({
+            top: document.getElementById(this.$route.hash.slice(1)).offsetTop,
+            behavior: 'smooth'
+          });
+        }
       }
     },
-    $route () {
+    mounted() {
       if (this.$route.hash) {
         this.forceScroll({
           top: document.getElementById(this.$route.hash.slice(1)).offsetTop,
-          behavior: 'smooth',
+          behavior: 'smooth'
         });
       }
     },
-  },
-  mounted () {
-    if (this.$route.hash) {
-      this.forceScroll({
-        top: document.getElementById(this.$route.hash.slice(1)).offsetTop,
-        behavior: 'smooth',
-      });
+    created() {
+      this.$event.$emit('nav-theme', 'light');
+      this.getScreen2Data();
+      this.getScreen3Data();
+      this.getScreen3ListData();
+      this.getScreen4ListData();
+      this.getScreen5JoinusData();
+    },
+    methods: {
+      ...mapMutations(['forceScroll', 'setScrollTop']),
+      async getScreen2Data() {
+        try {
+          const res = await this.$request.get('/official/index/list', {
+            params: {
+              pageNum: 1,
+              pageSize: 1,
+              captionName: '业务范围/商业服务/主要内容'
+            }
+          });
+          this.screen2.title = res.rows[0].businessName;
+          this.screen2.contentCn = res.rows[0].titleChinese;
+          this.screen2.imageSrc = res.rows[0].imageurl;
+          this.screen2.show = true;
+        } catch (error) {}
+      },
+      async getScreen3Data() {
+        try {
+          const res = await this.$request.get('/official/index/list', {
+            params: {
+              pageNum: 1,
+              pageSize: 1,
+              captionName: '业务范围/商业服务/项目描述'
+            }
+          });
+          this.screen3.titleCn = res.rows[0].businessName;
+          this.screen3.contentCn = res.rows[0].titleChinese;
+        } catch (error) {}
+      },
+      async getScreen3ListData() {
+        try {
+          const res = await this.$request.get('/official/index/list', {
+            params: {
+              pageNum: 1,
+              pageSize: 6,
+              captionName: '业务范围/商业服务/项目案例'
+            }
+          });
+          this.screen3.list = res.rows.sort((a, b) => a.orders - b.orders);
+        } catch (error) {}
+      },
+      async getScreen4ListData() {
+        try {
+          const res = await this.$request.get('/official/index/list', {
+            params: {
+              pageNum: 1,
+              pageSize: 2,
+              captionName: '业务范围/商业服务/技术支持'
+            }
+          });
+          this.screen4.list = res.rows.sort((a, b) => a.orders - b.orders);
+        } catch (error) {}
+      },
+      async getScreen5JoinusData() {
+        try {
+          const res = await this.$request.get('/official/index/list', {
+            params: {
+              pageNum: 1,
+              pageSize: 1,
+              captionName: '业务范围/商业服务/joinus'
+            }
+          });
+          this.screen5.joinUs.title = res.rows[0].businessName;
+          this.screen5.joinUs.contentCn = res.rows[0].titleChinese;
+          this.screen5.joinUs.imageSrc = res.rows[0].imageurl;
+        } catch (error) {}
+      }
     }
-  },
-  created () {
-    this.$event.$emit('nav-theme', 'light');
-    this.getScreen2Data();
-    this.getScreen3Data();
-    this.getScreen3ListData();
-    this.getScreen4ListData();
-    this.getScreen5JoinusData();
-  },
-  methods: {
-    ...mapMutations(['forceScroll', 'setScrollTop']),
-    async getScreen2Data () {
-      try {
-        const res = await this.$request.get(
-          '/official/index/list',
-          { params: { pageNum: 1, pageSize: 1, captionName: '业务范围/商业服务/主要内容' } },
-        );
-        this.screen2.title = res.rows[0].businessName;
-        this.screen2.contentCn = res.rows[0].titleChinese;
-        this.screen2.imageSrc = res.rows[0].imageurl;
-        this.screen2.show = true;
-      } catch (error) {}
-    },
-    async getScreen3Data () {
-      try {
-        const res = await this.$request.get(
-          '/official/index/list',
-          { params: { pageNum: 1, pageSize: 1, captionName: '业务范围/商业服务/项目描述' } },
-        );
-        this.screen3.titleCn = res.rows[0].businessName;
-        this.screen3.contentCn = res.rows[0].titleChinese;
-      } catch (error) {}
-    },
-    async getScreen3ListData () {
-      try {
-        const res = await this.$request.get(
-          '/official/index/list',
-          { params: { pageNum: 1, pageSize: 6, captionName: '业务范围/商业服务/项目案例' } },
-        );
-        this.screen3.list = res.rows.sort((a, b) => a.orders - b.orders);
-      } catch (error) {}
-    },
-    async getScreen4ListData () {
-      try {
-        const res = await this.$request.get(
-          '/official/index/list',
-          { params: { pageNum: 1, pageSize: 2, captionName: '业务范围/商业服务/技术支持' } },
-        );
-        this.screen4.list = res.rows.sort((a, b) => a.orders - b.orders);
-      } catch (error) {}
-    },
-    async getScreen5JoinusData () {
-      try {
-        const res = await this.$request.get(
-          '/official/index/list',
-          { params: { pageNum: 1, pageSize: 1, captionName: '业务范围/商业服务/joinus' } },
-        );
-        this.screen5.joinUs.title = res.rows[0].businessName;
-        this.screen5.joinUs.contentCn = res.rows[0].titleChinese;
-        this.screen5.joinUs.imageSrc = res.rows[0].imageurl;
-      } catch (error) {}
-    },
-  },
-};
+  };
 </script>
 
 <style scoped>
-.page-construction {
-  width: 100%;
-}
-.screen1 {
-  position: relative;
-  z-index: 1;
-  background-color: #ffffff;
-}
-.screen2 {
-  position: relative;
-  height: 1186rem;
-  background-color: #ffffff;
-}
-.screen2 .wrapper1680 {
-  height: 100%;
-  box-sizing: border-box;
-  position: relative;
-  border-bottom: 1rem solid;
-  border-image: radial-gradient(circle, rgba(193, 200, 221, 1), rgba(191, 199, 222, 1), rgba(195, 203, 223, 1), rgba(175, 185, 208, 1)) 1 1;
-}
-.screen3 {
-  position: relative;
-  height: 850rem;
-  background-color: #ffffff;
-}
-.screen3 .wrapper1680 {
-  height: 100%;
-  position: relative;
-}
-.screen3 .list-wrapper {
-  position: absolute;
-  top: 400rem;
-  width: 100%;
-  display: flex;
-  flex-wrap: wrap;
-  padding: 0px 140rem;
-  box-sizing: border-box;
-}
-.screen3 .list-item {
-  margin: 0 58rem;
-  width: 234rem;
-  height: 330rem;
-  margin-bottom: 90rem;
-  display: flex;
-  flex-direction: column;
-  align-items: center;
-  justify-content: center;
-  cursor: pointer;
-}
-.screen3 .list-item:hover {
-  transform: scale(1.1, 1.1);
-}
-.screen3 .list-img {
-  width: 150rem;
-  height: 150rem;
-  margin-bottom: 40rem;
-}
-.screen3 .list-title {
-  text-align: center;
-  font-size: 20rem;
-  line-height: 1;
-  color: #111111;
-  margin-bottom: 26rem;
-}
-.screen3 .list-content {
-  width: 280rem;
-  white-space: normal;
-  text-align: center;
-  font-family: MicrosoftYaHeiLight;
-  font-size: 14rem;
-  line-height: 22rem;
-  color: #333333;
-}
-.screen4 {
-  position: relative;
-  height: 1286rem;
-  background-color: #F5F5F8;
-}
-.screen4 .wrapper1680 {
-  padding: 124rem 0;
-}
-.screen4 .list-item {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-}
-.screen4 .list-item:nth-of-type(2n-1) {
-  flex-direction: row;
-}
-.screen4 .list-item:nth-of-type(2n) {
-  flex-direction: row-reverse;
-}
-.screen4 .list-item + .list-item {
-  margin-top: 52rem;
-}
-.screen4 .content-wrapper {
-  width: 755rem;
-}
-.screen4 .content-wrapper .title {
-  padding: 0 1rem;
-  font-family: MicrosoftYaHeiLight;
-  font-size: 42rem;
-  color: #111111;
-  margin-bottom: 36rem;
-}
-.screen4 .content-wrapper .content {
-  padding: 5rem;
-  font-family: MicrosoftYaHeiLight;
-  font-size: 20rem;
-  line-height: 36rem;
-  text-indent: 1.5em;
-}
-.screen4 .list-item:nth-of-type(2n) .content-wrapper {
-  display: flex;
-  flex-direction: column;
-  align-items: flex-start;
-}
-.screen4 .list-item:nth-of-type(2n) .content-wrapper .content {
-  text-align: left;
-}
-.screen4 .image-wrapper {
-  width: 752rem;
-  height: 510rem;
-  border-radius: 20rem;
-  overflow: hidden;
-}
-.screen4 .image-wrapper img {
-  width: 100%;
-  height: 100%;
-  transition: transform 0.4s;
-}
-.screen4 .image-wrapper:hover img {
-  transform: scale(1.1);
-}
-.screen5 {
-  position: relative;
-  height: 823rem;
-  background-color: #ffffff;
-}
-.screen5 .wrapper1680 {
-  height: 100%;
-  position: relative;
-}
-.screen5 .plate-wrapper {
-  display: flex;
-  justify-content: space-between;
-}
-.screen5 .plate-item {
-  width: 325rem;
-  height: 302rem;
-  position: relative;
-  cursor: pointer;
-  border-radius: 20rem;
-}
-.screen5 .plate-item:hover {
-  overflow: hidden;
-  box-shadow: 8rem 8rem 25rem 3rem #5E5E5E11;
-}
-.screen5 .plate-item:hover img {
-  transition: transform 0.4s;
-  transform: scale(1.1, 1.1);
-}
-.screen5 .split-line {
-  border-bottom: 1rem solid;
-  border-image: radial-gradient(circle, rgba(193, 200, 221, 1), rgba(191, 199, 222, 1), rgba(195, 203, 223, 1), rgba(175, 185, 208, 1)) 1 1;
-}
-.screen5 .join-btn-text {
-  background-image: linear-gradient(90deg, #FF0300, #FFAA05);
-  background-clip: text;
-  color: transparent;
-}
+  .page-construction {
+    width: 100%;
+  }
+  .screen1 {
+    position: relative;
+    z-index: 1;
+    background-color: #ffffff;
+  }
+  .screen2 {
+    position: relative;
+    height: 1030rem;
+    background-color: #ffffff;
+  }
+  .screen2 .wrapper1680 {
+    height: 100%;
+    box-sizing: border-box;
+    position: relative;
+    border-bottom: 1rem solid;
+    border-image: radial-gradient(
+        circle,
+        rgba(193, 200, 221, 1),
+        rgba(191, 199, 222, 1),
+        rgba(195, 203, 223, 1),
+        rgba(175, 185, 208, 1)
+      )
+      1 1;
+  }
+  .screen3 {
+    position: relative;
+    height: 850rem;
+    background-color: #ffffff;
+    display: none;
+  }
+  .screen3 .wrapper1680 {
+    height: 100%;
+    position: relative;
+  }
+  .screen3 .list-wrapper {
+    position: absolute;
+    top: 400rem;
+    width: 100%;
+    display: flex;
+    flex-wrap: wrap;
+    padding: 0px 140rem;
+    box-sizing: border-box;
+  }
+  .screen3 .list-item {
+    margin: 0 58rem;
+    width: 234rem;
+    height: 330rem;
+    margin-bottom: 90rem;
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    cursor: pointer;
+  }
+  .screen3 .list-item:hover {
+    transform: scale(1.1, 1.1);
+  }
+  .screen3 .list-img {
+    width: 150rem;
+    height: 150rem;
+    margin-bottom: 40rem;
+  }
+  .screen3 .list-title {
+    text-align: center;
+    font-size: 20rem;
+    line-height: 1;
+    color: #111111;
+    margin-bottom: 26rem;
+  }
+  .screen3 .list-content {
+    width: 280rem;
+    white-space: normal;
+    text-align: center;
+    font-family: MicrosoftYaHeiLight;
+    font-size: 14rem;
+    line-height: 22rem;
+    color: #333333;
+  }
+  .screen4 {
+    position: relative;
+    height: 1286rem;
+    background-color: #f5f5f8;
+    display: none;
+  }
+  .screen4 .wrapper1680 {
+    padding: 124rem 0;
+  }
+  .screen4 .list-item {
+    display: flex;
+    align-items: center;
+    justify-content: space-between;
+  }
+  .screen4 .list-item:nth-of-type(2n-1) {
+    flex-direction: row;
+  }
+  .screen4 .list-item:nth-of-type(2n) {
+    flex-direction: row-reverse;
+  }
+  .screen4 .list-item + .list-item {
+    margin-top: 52rem;
+  }
+  .screen4 .content-wrapper {
+    width: 755rem;
+  }
+  .screen4 .content-wrapper .title {
+    padding: 0 1rem;
+    font-family: MicrosoftYaHeiLight;
+    font-size: 42rem;
+    color: #111111;
+    margin-bottom: 36rem;
+  }
+  .screen4 .content-wrapper .content {
+    padding: 5rem;
+    font-family: MicrosoftYaHeiLight;
+    font-size: 20rem;
+    line-height: 36rem;
+    text-indent: 1.5em;
+  }
+  .screen4 .list-item:nth-of-type(2n) .content-wrapper {
+    display: flex;
+    flex-direction: column;
+    align-items: flex-start;
+  }
+  .screen4 .list-item:nth-of-type(2n) .content-wrapper .content {
+    text-align: left;
+  }
+  .screen4 .image-wrapper {
+    width: 752rem;
+    height: 510rem;
+    border-radius: 20rem;
+    overflow: hidden;
+  }
+  .screen4 .image-wrapper img {
+    width: 100%;
+    height: 100%;
+    transition: transform 0.4s;
+  }
+  .screen4 .image-wrapper:hover img {
+    transform: scale(1.1);
+  }
+  .screen5 {
+    position: relative;
+    height: 823rem;
+    background-color: #ffffff;
+    display: none;
+  }
+  .screen5 .wrapper1680 {
+    height: 100%;
+    position: relative;
+  }
+  .screen5 .plate-wrapper {
+    display: flex;
+    justify-content: space-between;
+  }
+  .screen5 .plate-item {
+    width: 325rem;
+    height: 302rem;
+    position: relative;
+    cursor: pointer;
+    border-radius: 20rem;
+  }
+  .screen5 .plate-item:hover {
+    overflow: hidden;
+    box-shadow: 8rem 8rem 25rem 3rem #5e5e5e11;
+  }
+  .screen5 .plate-item:hover img {
+    transition: transform 0.4s;
+    transform: scale(1.1, 1.1);
+  }
+  .screen5 .split-line {
+    border-bottom: 1rem solid;
+    border-image: radial-gradient(
+        circle,
+        rgba(193, 200, 221, 1),
+        rgba(191, 199, 222, 1),
+        rgba(195, 203, 223, 1),
+        rgba(175, 185, 208, 1)
+      )
+      1 1;
+  }
+  .screen5 .join-btn-text {
+    background-image: linear-gradient(90deg, #ff0300, #ffaa05);
+    background-clip: text;
+    color: transparent;
+  }
 </style>
diff --git a/src/views/Business/Construction/Index.vue b/src/views/Business/Construction/Index.vue
index 6fea0a4..958bd79 100644
--- a/src/views/Business/Construction/Index.vue
+++ b/src/views/Business/Construction/Index.vue
@@ -9,7 +9,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:53rem;--l:0rem;--c:#ff0000;"
+            style="--t:53rem;--r:0rem;--c:#ff0000;"
           >
             {{ screen2.title }}
           </div>
@@ -18,7 +18,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:99rem;--l:0rem;--fs:72rem;--c:#111111;--ff:MicrosoftYaHeiLight;--tde:0.3s;"
+            style="--t:99rem;--r:0rem;--fs:72rem;--c:#111111;--ff:MicrosoftYaHeiLight;--tde:0.3s;"
           >
             基础设施
           </div>
@@ -27,7 +27,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:93rem;--r:8rem;--w:650rem;--fs:22rem;--lh:30rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:justify;--tde:0.6s;text-indent: 1.5em;"
+            style="--l:0rem;--t:93rem;--r:8rem;--w:950rem;--fs:22rem;--lh:30rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:justify;--tde:0.6s;text-indent: 1.5em;"
           >
             {{ screen2.contentCn }}
           </div>
@@ -36,7 +36,7 @@
           <div
             v-show="screen2.show"
             class="image-posi-abs"
-            style="--l:1rem;--t:447rem;--w:1680rem;--h:620rem;--tde:0.9s;"
+            style="--l:1rem;--t:320rem;--w:1680rem;--h:620rem;--tde:0.9s;"
           >
             <img
               :src="screen2.imageSrc"
@@ -346,7 +346,7 @@ export default {
 }
 .screen2 {
   position: relative;
-  height: 1186rem;
+  height: 1030rem;
   background-color: #ffffff;
 }
 .screen2 .wrapper1680 {
@@ -360,6 +360,7 @@ export default {
   position: relative;
   height: 850rem;
   background-color: #ffffff;
+  display: none;
 }
 .screen3 .wrapper1680 {
   height: 100%;
@@ -413,6 +414,7 @@ export default {
   position: relative;
   height: 1286rem;
   background-color: #F5F5F8;
+  display: none;
 }
 .screen4 .wrapper1680 {
   padding: 124rem 0;
@@ -474,6 +476,7 @@ export default {
   position: relative;
   height: 823rem;
   background-color: #ffffff;
+  display: none;
 }
 .screen5 .wrapper1680 {
   height: 100%;
diff --git a/src/views/Business/EnergyEnvironment/Index.vue b/src/views/Business/EnergyEnvironment/Index.vue
index e0a76fb..e3c0fee 100644
--- a/src/views/Business/EnergyEnvironment/Index.vue
+++ b/src/views/Business/EnergyEnvironment/Index.vue
@@ -9,7 +9,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:53rem;--l:0rem;--c:#ff0000;"
+            style="--t:53rem;--r:0rem;--c:#ff0000;"
           >
             {{ screen2.title }}
           </div>
@@ -18,7 +18,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:99rem;--l:0rem;--fs:72rem;--c:#111111;--ff:MicrosoftYaHeiLight;--tde:0.3s;"
+            style="--t:99rem;--r:0rem;--fs:72rem;--c:#111111;--ff:MicrosoftYaHeiLight;--tde:0.3s;"
           >
             能源环保
           </div>
@@ -27,7 +27,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:93rem;--r:8rem;--w:650rem;--fs:22rem;--lh:30rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:justify;--tde:0.6s;text-indent: 1.5em;"
+            style="--l:0rem;--t:93rem;--r:8rem;--w:950rem;--fs:22rem;--lh:30rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:justify;--tde:0.6s;text-indent: 1.5em;"
           >
             {{ screen2.contentCn }}
           </div>
@@ -36,7 +36,7 @@
           <div
             v-show="screen2.show"
             class="image-posi-abs"
-            style="--l:1rem;--t:447rem;--w:1680rem;--h:620rem;--tde:0.9s;"
+            style="--l:1rem;--t:320rem;--w:1680rem;--h:620rem;--tde:0.9s;"
           >
             <img
               :src="screen2.imageSrc"
@@ -347,7 +347,7 @@ export default {
 }
 .screen2 {
   position: relative;
-  height: 1186rem;
+  height: 1030rem;
   background-color: #ffffff;
 }
 .screen2 .wrapper1680 {
@@ -361,6 +361,7 @@ export default {
   position: relative;
   height: 850rem;
   background-color: #ffffff;
+  display: none;
 }
 .screen3 .wrapper1680 {
   height: 100%;
@@ -414,6 +415,7 @@ export default {
   position: relative;
   height: 1286rem;
   background-color: #F5F5F8;
+  display: none;
 }
 .screen4 .wrapper1680 {
   padding: 124rem 0;
@@ -475,6 +477,7 @@ export default {
   position: relative;
   height: 823rem;
   background-color: #ffffff;
+  display: none;
 }
 .screen5 .wrapper1680 {
   height: 100%;
diff --git a/src/views/Business/FutureAgriculture/Index.vue b/src/views/Business/FutureAgriculture/Index.vue
index 693bcb9..0b5a9e3 100644
--- a/src/views/Business/FutureAgriculture/Index.vue
+++ b/src/views/Business/FutureAgriculture/Index.vue
@@ -9,7 +9,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:53rem;--l:0rem;--c:#ff0000;"
+            style="--t:53rem;--r:0rem;--c:#ff0000;"
           >
             {{ screen2.title }}
           </div>
@@ -18,7 +18,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:99rem;--l:0rem;--fs:72rem;--c:#111111;--ff:MicrosoftYaHeiLight;--tde:0.3s;"
+            style="--t:99rem;--r:0rem;--fs:72rem;--c:#111111;--ff:MicrosoftYaHeiLight;--tde:0.3s;"
           >
             农业发展
           </div>
@@ -27,7 +27,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:93rem;--r:8rem;--w:650rem;--fs:22rem;--lh:30rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:justify;--tde:0.6s;text-indent: 1.5em;"
+            style="--l:0rem;--t:93rem;--r:8rem;--w:950rem;--fs:22rem;--lh:30rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:justify;--tde:0.6s;text-indent: 1.5em;"
           >
             {{ screen2.contentCn }}
           </div>
@@ -36,7 +36,7 @@
           <div
             v-show="screen2.show"
             class="image-posi-abs"
-            style="--l:1rem;--t:447rem;--w:1680rem;--h:620rem;--tde:0.9s;"
+            style="--l:1rem;--t:320rem;--w:1680rem;--h:620rem;--tde:0.9s;"
           >
             <img
               :src="screen2.imageSrc"
@@ -346,7 +346,7 @@ export default {
 }
 .screen2 {
   position: relative;
-  height: 1186rem;
+  height: 1030rem;
   background-color: #ffffff;
 }
 .screen2 .wrapper1680 {
@@ -360,6 +360,7 @@ export default {
   position: relative;
   height: 850rem;
   background-color: #ffffff;
+  display: none;
 }
 .screen3 .wrapper1680 {
   height: 100%;
@@ -413,6 +414,7 @@ export default {
   position: relative;
   height: 1286rem;
   background-color: #F5F5F8;
+  display: none;
 }
 .screen4 .wrapper1680 {
   padding: 124rem 0;
@@ -474,6 +476,7 @@ export default {
   position: relative;
   height: 823rem;
   background-color: #ffffff;
+  display: none;
 }
 .screen5 .wrapper1680 {
   height: 100%;
diff --git a/src/views/Business/GlobalSupplyChain/Index.vue b/src/views/Business/GlobalSupplyChain/Index.vue
index e6b3825..a9bb5a3 100644
--- a/src/views/Business/GlobalSupplyChain/Index.vue
+++ b/src/views/Business/GlobalSupplyChain/Index.vue
@@ -9,7 +9,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:53rem;--l:0rem;--c:#ff0000;"
+            style="--t:53rem;--r:0rem;--c:#ff0000;"
           >
             {{ screen2.title }}
           </div>
@@ -18,7 +18,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:99rem;--l:0rem;--fs:72rem;--c:#111111;--ff:MicrosoftYaHeiLight;--tde:0.3s;"
+            style="--t:99rem;--r:0rem;--fs:72rem;--c:#111111;--ff:MicrosoftYaHeiLight;--tde:0.3s;"
           >
             供应链管理
           </div>
@@ -27,7 +27,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:93rem;--r:8rem;--w:650rem;--fs:22rem;--lh:30rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:justify;--tde:0.6s;text-indent: 1.5em;"
+            style="--l:0rem;--t:93rem;--r:8rem;--w:950rem;--fs:22rem;--lh:30rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:justify;--tde:0.6s;text-indent: 1.5em;"
           >
             {{ screen2.contentCn }}
           </div>
@@ -36,7 +36,7 @@
           <div
             v-show="screen2.show"
             class="image-posi-abs"
-            style="--l:1rem;--t:447rem;--w:1680rem;--h:620rem;--tde:0.9s;"
+            style="--l:1rem;--t:320rem;--w:1680rem;--h:620rem;--tde:0.9s;"
           >
             <img
               :src="screen2.imageSrc"
@@ -425,7 +425,7 @@ export default {
 }
 .screen2 {
   position: relative;
-  height: 1186rem;
+  height: 1030rem;
   background-color: #ffffff;
 }
 .screen2 .wrapper1680 {
@@ -439,6 +439,7 @@ export default {
   position: relative;
   height: 1300rem;
   background-color: #ffffff;
+  display: none;
 }
 .screen3 .wrapper1680 {
   height: 100%;
@@ -492,6 +493,7 @@ export default {
   position: relative;
   height: 1286rem;
   background-color: #F5F5F8;
+  display: none;
 }
 .screen4 .wrapper1680 {
   padding: 124rem 0;
@@ -553,6 +555,7 @@ export default {
   position: relative;
   height: 823rem;
   background-color: #ffffff;
+  display: none;
 }
 .screen5 .wrapper1680 {
   height: 100%;
@@ -590,6 +593,7 @@ export default {
   position: relative;
   height: 800rem;
   background-color: rgb(245, 244, 249);
+  display: none;
 }
 .screen6 .wrapper1680 {
   height: 100%;
diff --git a/src/views/Business/HealthIndustry/Index.vue b/src/views/Business/HealthIndustry/Index.vue
index 6663975..cc281f5 100644
--- a/src/views/Business/HealthIndustry/Index.vue
+++ b/src/views/Business/HealthIndustry/Index.vue
@@ -9,7 +9,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:53rem;--l:0rem;--c:#ff0000;"
+            style="--t:53rem;--r:0rem;--c:#ff0000;"
           >
             {{ screen2.title }}
           </div>
@@ -18,7 +18,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:99rem;--l:0rem;--fs:72rem;--c:#111111;--ff:MicrosoftYaHeiLight;--tde:0.3s;"
+            style="--t:99rem;--r:0rem;--fs:72rem;--c:#111111;--ff:MicrosoftYaHeiLight;--tde:0.3s;"
           >
             大健康产业
           </div>
@@ -27,7 +27,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:93rem;--r:8rem;--w:650rem;--fs:22rem;--lh:30rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:justify;--tde:0.6s;text-indent: 1.5em;"
+            style="--l:0rem;--t:93rem;--r:8rem;--w:950rem;--fs:22rem;--lh:30rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:justify;--tde:0.6s;text-indent: 1.5em;"
           >
             {{ screen2.contentCn }}
           </div>
@@ -36,7 +36,7 @@
           <div
             v-show="screen2.show"
             class="image-posi-abs"
-            style="--l:1rem;--t:447rem;--w:1680rem;--h:620rem;--tde:0.9s;"
+            style="--l:1rem;--t:320rem;--w:1680rem;--h:620rem;--tde:0.9s;"
           >
             <img
               :src="screen2.imageSrc"
@@ -346,7 +346,7 @@ export default {
 }
 .screen2 {
   position: relative;
-  height: 1186rem;
+  height: 1030rem;
   background-color: #ffffff;
 }
 .screen2 .wrapper1680 {
@@ -360,6 +360,7 @@ export default {
   position: relative;
   height: 850rem;
   background-color: #ffffff;
+  display: none;
 }
 .screen3 .wrapper1680 {
   height: 100%;
@@ -413,6 +414,7 @@ export default {
   position: relative;
   height: 1286rem;
   background-color: #F5F5F8;
+  display: none;
 }
 .screen4 .wrapper1680 {
   padding: 124rem 0;
@@ -474,6 +476,7 @@ export default {
   position: relative;
   height: 823rem;
   background-color: #ffffff;
+  display: none;
 }
 .screen5 .wrapper1680 {
   height: 100%;
diff --git a/src/views/Business/HighTech/Index.vue b/src/views/Business/HighTech/Index.vue
index 9c29e41..08c6e93 100644
--- a/src/views/Business/HighTech/Index.vue
+++ b/src/views/Business/HighTech/Index.vue
@@ -9,7 +9,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:53rem;--l:0rem;--c:#ff0000;"
+            style="--t:53rem;--r:0rem;--c:#ff0000;"
           >
             {{ screen2.title }}
           </div>
@@ -18,7 +18,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:99rem;--l:0rem;--fs:72rem;--c:#111111;--ff:MicrosoftYaHeiLight;--tde:0.3s;"
+            style="--t:99rem;--r:0rem;--fs:72rem;--c:#111111;--ff:MicrosoftYaHeiLight;--tde:0.3s;"
           >
             高新技术
           </div>
@@ -27,7 +27,7 @@
           <div
             v-show="screen2.show"
             class="text-posi-abs"
-            style="--t:93rem;--r:8rem;--w:650rem;--fs:22rem;--lh:30rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:justify;--tde:0.6s;text-indent: 1.5em;"
+            style="--l: 0rem;--t:93rem;--r:8rem;--w:950rem;--fs:22rem;--lh:30rem;--c:#111111;--ff:MicrosoftYaHeiLight;--ws:pre-line;--ta:justify;--tde:0.6s;text-indent: 1.5em;"
           >
             {{ screen2.contentCn }}
           </div>
@@ -36,7 +36,7 @@
           <div
             v-show="screen2.show"
             class="image-posi-abs"
-            style="--l:1rem;--t:447rem;--w:1680rem;--h:620rem;--tde:0.9s;"
+            style="--l:1rem;--t:320rem;--w:1680rem;--h:620rem;--tde:0.9s;"
           >
             <img
               :src="screen2.imageSrc"
@@ -385,7 +385,7 @@ export default {
 }
 .screen2 {
   position: relative;
-  height: 1186rem;
+  height: 1030rem;
   background-color: #ffffff;
 }
 .screen2 .wrapper1680 {
@@ -399,6 +399,7 @@ export default {
   position: relative;
   height: 1300rem;
   background-color: #ffffff;
+  display: none;
 }
 .screen3 .wrapper1680 {
   height: 100%;
@@ -461,6 +462,7 @@ export default {
   position: relative;
   height: 1286rem;
   background-color: #F5F5F8;
+  display: none;
 }
 .screen4 .wrapper1680 {
   padding: 124rem 0;
@@ -522,6 +524,7 @@ export default {
   position: relative;
   height: 823rem;
   background-color: #ffffff;
+  display: none;
 }
 .screen5 .wrapper1680 {
   height: 100%;
diff --git a/src/views/Home/Index.vue b/src/views/Home/Index.vue
index 82945f3..df2bc45 100644
--- a/src/views/Home/Index.vue
+++ b/src/views/Home/Index.vue
@@ -101,7 +101,7 @@
             <span v-if="screen3.currentIndicator >= 0">{{ screen3.carouselData[screen3.currentIndicator].titleChinese }}</span>
           </div>
         </transition>
-        <transition name="fade-slide-left">
+        <!-- <transition name="fade-slide-left">
           <div
             v-show="screen3.offsetLevel >= 0"
             class="text-posi-abs"
@@ -109,12 +109,12 @@
           >
             {{ screen3.currentIndicator > -1 ? screen3.carouselData[screen3.currentIndicator].titleEnglish : '' }}
           </div>
-        </transition>
+        </transition> -->
         <transition name="fade-slide-right">
           <div
             v-show="screen3.offsetLevel >= 0"
             class="box-posi-abs"
-            style="--l:460rem;--t:324rem;--w:880rem;--h:552rem;--tde:0.3s;"
+            style="--l:0rem;--t:324rem;--w:1680rem;--h:752rem;--tde:0.3s;"
           >
             <BusinessCarousel
               :carouselData="screen3.carouselData"
@@ -359,14 +359,17 @@ export default {
 }
 .screen1 .indicator-wrapper {
   position: absolute;
-  bottom: 100rem;
+  bottom: 0;
   left: 0;
   right: 0;
   margin: auto;
   width: 100%;
+  height: 293rem;    
+  padding-top: 193rem;
   max-width: 1920rem;
   z-index: 100;
   color: #ffffff;
+  background-image: url("@/assets/bottomBg.png");
 }
 .screen2 {
   height: 1080rem;
@@ -404,7 +407,7 @@ export default {
   stroke-dashoffset: 0;
 }
 .screen3 {
-  height: 1055rem;
+  height: 1155rem;
   background-color: #ffffff;
   overflow: hidden;
 }
diff --git a/src/views/Home/components/BusinessCarousel.vue b/src/views/Home/components/BusinessCarousel.vue
index dcf984b..91ba18b 100644
--- a/src/views/Home/components/BusinessCarousel.vue
+++ b/src/views/Home/components/BusinessCarousel.vue
@@ -1,55 +1,25 @@
 <template>
   <div class="business-carousel">
-    <div
-      v-if="current > -1"
-      class="carousel-viewer"
-    >
-      <div
-        class="carousel-prev"
-        :class="{ 'transition-prev': transitionMode === 'prev' }"
-      >
-        <img
-          :src="prevCarousel.imageurl"
-          alt=""
-        >
-      </div>
-      <div
-        class="carousel-current"
-        :class="{ ['transition-' + transitionMode]: transitionMode }"
-      >
-        <img
-          :src="currentCarousel.imageurl"
-          alt=""
-          style="cursor: pointer;"
-          @click="$router.push(currentCarousel.twLink)"
-        >
-      </div>
-      <div
-        class="carousel-next"
-        :class="{ ['transition-' + transitionMode]: transitionMode }"
-      >
-        <img
-          :src="nextCarousel.imageurl"
-          alt=""
-        >
-      </div>
-      <div
-        class="carousel-next"
-        style="cursor: pointer;"
-        title="点击切换下一张"
-        @click="handleNext"
-      ></div>
-      <div
-        class="carousel-next-2"
-        :class="{ 'transition-next': transitionMode === 'next' }"
-      >
-        <img
-          :src="nextCarousel2.imageurl"
-          alt=""
-        >
+    <div v-if="current > -1" class="carousel-viewer">
+      <img v-if="transitionMode === 'prev'" :class="{ 'carousel-operator-disabled': transitionMode }" src="/static/img/home/PaginationPrevSolid.png" alt="" style="width: 44rem;height: 44rem;position: absolute;z-index: 1;top: 354rem;left: -64rem;">
+      <img v-else :class="{ 'carousel-operator-disabled': transitionMode }" src="/static/img/home/PaginationPrevLinearity.png" alt="" style="width: 44rem;height: 44rem;position: absolute;z-index: 1;top: 354rem;left: -64rem;" @click="handlePrev">
+      <!-- <div class="carousel-prev" :class="{ 'transition-prev': transitionMode === 'prev' }">
+        <img :src="prevCarousel.imageurl" alt="">
+      </div> -->
+      <div class="carousel-current" :class="{ ['transition-' + transitionMode]: transitionMode }">
+        <img :src="currentCarousel.imageurl" alt="" style="cursor: pointer;" @click="$router.push(currentCarousel.twLink)">
       </div>
+      <!-- <div class="carousel-next" :class="{ ['transition-' + transitionMode]: transitionMode }">
+        <img :src="nextCarousel.imageurl" alt="">
+      </div> -->
+      <!-- <div class="carousel-next" style="cursor: pointer;" title="点击切换下一张" @click="handleNext"></div>
+      <div class="carousel-next-2" :class="{ 'transition-next': transitionMode === 'next' }">
+        <img :src="nextCarousel2.imageurl" alt="">
+      </div> -->
+      <img v-if="transitionMode === 'next'" :class="{ 'carousel-operator-disabled': transitionMode }" src="/static/img/home/PaginationNextSolid.png" alt="" style="width: 44rem;height: 44rem;position: absolute;z-index: 1;top: 354rem;right: -64rem;">
+      <img v-else :class="{ 'carousel-operator-disabled': transitionMode }" src="/static/img/home/PaginationNextLinearity.png" alt="" style="width: 44rem;height: 44rem;position: absolute;z-index: 1;top: 354rem;right: -64rem;" @click="handleNext">
     </div>
-    <div
+    <!-- <div
       v-if="current > -1"
       class="carousel-text-viewer"
     >
@@ -90,323 +60,303 @@
       >
         <span>{{ nextCarousel4.businessName }}</span>
       </div>
-    </div>
-    <div
-      v-if="carouselData.length > 0"
-      class="carousel-operator"
-    >
+    </div> -->
+    <!-- <div v-if="carouselData.length > 0" class="carousel-operator">
       <div class="carousel-operator-left">
-        <img
-          v-if="transitionMode === 'prev'"
-          :class="{ 'carousel-operator-disabled': transitionMode }"
-          src="/static/img/home/PaginationPrevSolid.png"
-          alt=""
-          style="width: 44rem;height: 44rem;"
-        >
-        <img
-          v-else
-          :class="{ 'carousel-operator-disabled': transitionMode }"
-          src="/static/img/home/PaginationPrevLinearity.png"
-          alt=""
-          style="width: 44rem;height: 44rem;"
-          @click="handlePrev"
-        >
-        <img
-          v-if="transitionMode === 'next'"
-          :class="{ 'carousel-operator-disabled': transitionMode }"
-          src="/static/img/home/PaginationNextSolid.png"
-          alt=""
-          style="width: 44rem;height: 44rem;"
-        >
-        <img
-          v-else
-          :class="{ 'carousel-operator-disabled': transitionMode }"
-          src="/static/img/home/PaginationNextLinearity.png"
-          alt=""
-          style="width: 44rem;height: 44rem;"
-          @click="handleNext"
-        >
+        <img v-if="transitionMode === 'prev'" :class="{ 'carousel-operator-disabled': transitionMode }" src="/static/img/home/PaginationPrevSolid.png" alt="" style="width: 44rem;height: 44rem;">
+        <img v-else :class="{ 'carousel-operator-disabled': transitionMode }" src="/static/img/home/PaginationPrevLinearity.png" alt="" style="width: 44rem;height: 44rem;" @click="handlePrev">
+        <img v-if="transitionMode === 'next'" :class="{ 'carousel-operator-disabled': transitionMode }" src="/static/img/home/PaginationNextSolid.png" alt="" style="width: 44rem;height: 44rem;">
+        <img v-else :class="{ 'carousel-operator-disabled': transitionMode }" src="/static/img/home/PaginationNextLinearity.png" alt="" style="width: 44rem;height: 44rem;" @click="handleNext">
       </div>
-    </div>
+    </div> -->
   </div>
 </template>
 
 <script>
-export default {
-  props: {
-    carouselData: { type: Array, required: true },
-    current: { type: Number, required: true },
-  },
-  computed: {
-    currentCarousel () {
-      return this.carouselData[this.current];
+  export default {
+    props: {
+      carouselData: { type: Array, required: true },
+      current: { type: Number, required: true }
     },
-    prevCarousel () {
-      return this.carouselData[(this.current + this.carouselData.length - 1) % this.carouselData.length];
+    computed: {
+      currentCarousel() {
+        return this.carouselData[this.current];
+      },
+      prevCarousel() {
+        return this.carouselData[
+          (this.current + this.carouselData.length - 1) % this.carouselData.length
+        ];
+      },
+      nextCarousel() {
+        return this.carouselData[(this.current + 1) % this.carouselData.length];
+      },
+      nextCarousel2() {
+        return this.carouselData[(this.current + 2) % this.carouselData.length];
+      },
+      nextCarousel3() {
+        return this.carouselData[(this.current + 3) % this.carouselData.length];
+      },
+      nextCarousel4() {
+        return this.carouselData[(this.current + 4) % this.carouselData.length];
+      }
     },
-    nextCarousel () {
-      return this.carouselData[(this.current + 1) % this.carouselData.length];
+    data() {
+      return {
+        transitionMode: ''
+      };
     },
-    nextCarousel2 () {
-      return this.carouselData[(this.current + 2) % this.carouselData.length];
-    },
-    nextCarousel3 () {
-      return this.carouselData[(this.current + 3) % this.carouselData.length];
-    },
-    nextCarousel4 () {
-      return this.carouselData[(this.current + 4) % this.carouselData.length];
-    },
-  },
-  data () {
-    return {
-      transitionMode: '',
-    };
-  },
-  methods: {
-    handlePrev () {
-      if (this.transitionMode) return;
-      const current = this.current;
-      this.transitionMode = 'prev';
-      setTimeout(() => {
-        this.transitionMode = '';
-        this.$emit('update:current', current ? current - 1 : this.carouselData.length - 1);
-      }, 500);
-    },
-    handleNext () {
-      if (this.transitionMode) return;
-      const current = this.current;
-      this.transitionMode = 'next';
-      setTimeout(() => {
-        this.transitionMode = '';
-        this.$emit('update:current', current === this.carouselData.length - 1 ? 0 : current + 1);
-      }, 500);
-    },
-  },
-};
+    methods: {
+      handlePrev() {
+        if (this.transitionMode) return;
+        const current = this.current;
+        this.transitionMode = 'prev';
+        setTimeout(() => {
+          this.transitionMode = '';
+          this.$emit(
+            'update:current',
+            current ? current - 1 : this.carouselData.length - 1
+          );
+        }, 500);
+      },
+      handleNext() {
+        if (this.transitionMode) return;
+        const current = this.current;
+        this.transitionMode = 'next';
+        setTimeout(() => {
+          this.transitionMode = '';
+          this.$emit(
+            'update:current',
+            current === this.carouselData.length - 1 ? 0 : current + 1
+          );
+        }, 500);
+      }
+    }
+  };
 </script>
 
 <style scoped>
-.business-carousel {
-  width: 100%;
-  height: 100%;
-}
-.carousel-viewer {
-  width: 100%;
-  height: 100%;
-  position: relative;
-}
-.carousel-viewer img {
-  width: 100%;
-  height: 100%;
-}
-.carousel-viewer > div {
-  position: absolute;
-  border-radius: 50rem;
-  overflow: hidden;
-}
-.carousel-prev {
-  left: 50%;
-  top: 50%;
-  width: 0;
-  height: 0;
-  opacity: 0;
-}
-.carousel-prev.transition-prev {
-  left: 0;
-  top: 0;
-  width: 100%;
-  height: 100%;
-  opacity: 1;
-  transition: all 0.5s;
-}
-.carousel-current {
-  left: 0;
-  top: 0;
-  width: 100%;
-  height: 100%;
-  opacity: 1;
-  overflow: hidden;
-}
-.carousel-current img {
-  transition: transform 0.4s;
-}
-.carousel-current:hover img {
-  transform: scale(1.1);
-}
-.carousel-current.transition-prev {
-  left: calc(100% + 60rem);
-  top: 0;
-  width: 100%;
-  height: 100%;
-  transition: all 0.5s;
-}
-.carousel-current.transition-next {
-  left: 50%;
-  top: 50%;
-  width: 0;
-  height: 0;
-  opacity: 0;
-  transition: all 0.5s;
-}
-.carousel-next {
-  left: calc(100% + 60rem);
-  top: 0;
-  width: 100%;
-  height: 100%;
-  cursor: pointer;
-}
-.carousel-next:hover{
-  box-shadow: rgba(28, 28, 30, 0.08) 0rem 0rem 2rem 0rem, rgba(28, 28, 30, 0.08) 0rem 8rem 16rem 0rem;
-}
-.carousel-next.transition-prev {
-  left: calc(200% + 120rem);
-  top: 0;
-  width: 100%;
-  height: 100%;
-  transition: all 0.5s;
-}
-.carousel-next.transition-next {
-  left: 0;
-  top: 0;
-  width: 100%;
-  height: 100%;
-  transition: all 0.5s;
-}
-.carousel-next-2 {
-  left: calc(200% + 120rem);
-  top: 0;
-  width: 100%;
-  height: 100%;
-}
-.carousel-next-2.transition-next {
-  left: calc(100% + 60rem);
-  top: 0;
-  width: 100%;
-  height: 100%;
-  transition: all 0.5s;
-}
-.carousel-text-viewer {
-  position: absolute;
-  left: calc(100% + 60rem);
-  top: -250rem;
-  width: fit-content;
-  height: 50rem;
-}
-.carousel-text-viewer > div {
-  white-space: nowrap;
-  height: 50rem;
-  line-height: 50rem;
-  font-size: 18rem;
-  color: #000000;
-  font-weight: 500;
-  position: absolute;
-}
-.carousel-text-prev {
-  left: 0;
-  top: 0;
-  opacity: 0;
-}
-.carousel-text-prev.transition-prev {
-  left: 0;
-  top: 0;
-  opacity: 1;
-  transition: all 0.5s;
-}
-.carousel-text-current {
-  left: 0;
-  top: 0;
-  opacity: 1;
-}
-.carousel-text-current.transition-prev {
-  left: 0;
-  top: 100%;
-  opacity: 0.6;
-  transition: all 0.5s;
-}
-.carousel-text-current.transition-next {
-  left: 0;
-  top: 0;
-  opacity: 0;
-  transition: all 0.5s;
-}
-.carousel-text-next {
-  left: 0;
-  top: 100%;
-  opacity: 0.6;
-  cursor: pointer;
-}
-.carousel-text-next.transition-prev {
-  left: 0;
-  top: 200%;
-  opacity: 0.4;
-  transition: all 0.5s;
-}
-.carousel-text-next.transition-next {
-  left: 0;
-  top: 0;
-  opacity: 1;
-  transition: all 0.5s;
-}
-.carousel-text-next-2 {
-  left: 0;
-  top: 200%;
-  opacity: 0.4;
-}
-.carousel-text-next-2.transition-prev {
-  left: 0;
-  top: 300%;
-  opacity: 0.2;
-  transition: all 0.5s;
-}
-.carousel-text-next-2.transition-next {
-  left: 0;
-  top: 100%;
-  opacity: 0.6;
-  transition: all 0.5s;
-}
-.carousel-text-next-3 {
-  left: 0;
-  top: 300%;
-  opacity: 0.2;
-}
-.carousel-text-next-3.transition-prev {
-  left: 0;
-  top: 400%;
-  opacity: 0;
-  transition: all 0.5s;
-}
-.carousel-text-next-3.transition-next {
-  left: 0;
-  top: 200%;
-  opacity: 0.4;
-  transition: all 0.5s;
-}
-.carousel-text-next-4 {
-  left: 0;
-  top: 400%;
-  opacity: 0;
-}
-.carousel-text-next-4.transition-next {
-  left: 0;
-  top: 300%;
-  opacity: 0.2;
-  transition: all 0.5s;
-}
-.carousel-operator {
-  position: absolute;
-  top: calc(100% + 58rem);
-  left: 0;
-  width: 100%;
-  display: flex;
-  justify-content: space-between;
-}
-.carousel-operator img {
-  cursor: pointer;
-}
-.carousel-operator-left img {
-  margin-right: 14rem;
-}
-.carousel-operator-disabled {
-  cursor: not-allowed;
-}
+  .business-carousel {
+    width: 100%;
+    height: 100%;
+  }
+  .carousel-viewer {
+    width: 100%;
+    height: 100%;
+    position: relative;
+  }
+  .carousel-viewer img {
+    width: 100%;
+    height: 100%;
+  }
+  .carousel-viewer > div {
+    position: absolute;
+    border-radius: 50rem;
+    overflow: hidden;
+  }
+  .carousel-prev {
+    left: 50%;
+    top: 50%;
+    width: 0;
+    height: 0;
+    opacity: 0;
+  }
+  .carousel-prev.transition-prev {
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    opacity: 1;
+    transition: all 0.5s;
+  }
+  .carousel-current {
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    opacity: 1;
+    overflow: hidden;
+  }
+  .carousel-current img {
+    transition: transform 0.4s;
+  }
+  .carousel-current:hover img {
+    transform: scale(1.1);
+  }
+  .carousel-current.transition-prev {
+    left: calc(100% + 60rem);
+    top: 0;
+    width: 100%;
+    height: 100%;
+    transition: all 0.5s;
+  }
+  .carousel-current.transition-next {
+    left: 50%;
+    top: 50%;
+    width: 0;
+    height: 0;
+    opacity: 0;
+    transition: all 0.5s;
+  }
+  .carousel-next {
+    left: calc(100% + 60rem);
+    top: 0;
+    width: 100%;
+    height: 100%;
+    cursor: pointer;
+  }
+  .carousel-next:hover {
+    box-shadow: rgba(28, 28, 30, 0.08) 0rem 0rem 2rem 0rem,
+      rgba(28, 28, 30, 0.08) 0rem 8rem 16rem 0rem;
+  }
+  .carousel-next.transition-prev {
+    left: calc(200% + 120rem);
+    top: 0;
+    width: 100%;
+    height: 100%;
+    transition: all 0.5s;
+  }
+  .carousel-next.transition-next {
+    left: 0;
+    top: 0;
+    width: 100%;
+    height: 100%;
+    transition: all 0.5s;
+  }
+  .carousel-next-2 {
+    left: calc(200% + 120rem);
+    top: 0;
+    width: 100%;
+    height: 100%;
+  }
+  .carousel-next-2.transition-next {
+    left: calc(100% + 60rem);
+    top: 0;
+    width: 100%;
+    height: 100%;
+    transition: all 0.5s;
+  }
+  .carousel-text-viewer {
+    position: absolute;
+    left: calc(100% + 60rem);
+    top: -250rem;
+    width: fit-content;
+    height: 50rem;
+  }
+  .carousel-text-viewer > div {
+    white-space: nowrap;
+    height: 50rem;
+    line-height: 50rem;
+    font-size: 18rem;
+    color: #000000;
+    font-weight: 500;
+    position: absolute;
+  }
+  .carousel-text-prev {
+    left: 0;
+    top: 0;
+    opacity: 0;
+  }
+  .carousel-text-prev.transition-prev {
+    left: 0;
+    top: 0;
+    opacity: 1;
+    transition: all 0.5s;
+  }
+  .carousel-text-current {
+    left: 0;
+    top: 0;
+    opacity: 1;
+  }
+  .carousel-text-current.transition-prev {
+    left: 0;
+    top: 100%;
+    opacity: 0.6;
+    transition: all 0.5s;
+  }
+  .carousel-text-current.transition-next {
+    left: 0;
+    top: 0;
+    opacity: 0;
+    transition: all 0.5s;
+  }
+  .carousel-text-next {
+    left: 0;
+    top: 100%;
+    opacity: 0.6;
+    cursor: pointer;
+  }
+  .carousel-text-next.transition-prev {
+    left: 0;
+    top: 200%;
+    opacity: 0.4;
+    transition: all 0.5s;
+  }
+  .carousel-text-next.transition-next {
+    left: 0;
+    top: 0;
+    opacity: 1;
+    transition: all 0.5s;
+  }
+  .carousel-text-next-2 {
+    left: 0;
+    top: 200%;
+    opacity: 0.4;
+  }
+  .carousel-text-next-2.transition-prev {
+    left: 0;
+    top: 300%;
+    opacity: 0.2;
+    transition: all 0.5s;
+  }
+  .carousel-text-next-2.transition-next {
+    left: 0;
+    top: 100%;
+    opacity: 0.6;
+    transition: all 0.5s;
+  }
+  .carousel-text-next-3 {
+    left: 0;
+    top: 300%;
+    opacity: 0.2;
+  }
+  .carousel-text-next-3.transition-prev {
+    left: 0;
+    top: 400%;
+    opacity: 0;
+    transition: all 0.5s;
+  }
+  .carousel-text-next-3.transition-next {
+    left: 0;
+    top: 200%;
+    opacity: 0.4;
+    transition: all 0.5s;
+  }
+  .carousel-text-next-4 {
+    left: 0;
+    top: 400%;
+    opacity: 0;
+  }
+  .carousel-text-next-4.transition-next {
+    left: 0;
+    top: 300%;
+    opacity: 0.2;
+    transition: all 0.5s;
+  }
+  .carousel-operator {
+    position: absolute;
+    top: calc(100% + 58rem);
+    left: 0;
+    width: 100%;
+    display: flex;
+    justify-content: space-between;
+  }
+  .carousel-operator img {
+    cursor: pointer;
+  }
+  .carousel-operator-left img {
+    margin-right: 14rem;
+  }
+  .carousel-operator-disabled {
+    cursor: not-allowed;
+  }
 </style>
diff --git a/src/views/Invest/BusinessPartner/Index.vue b/src/views/Invest/BusinessPartner/Index.vue
index ba3b4d0..77d0ea2 100644
--- a/src/views/Invest/BusinessPartner/Index.vue
+++ b/src/views/Invest/BusinessPartner/Index.vue
@@ -185,21 +185,21 @@
                 </el-col>
               </el-row>
               <el-row>
-                <el-col :span="12">
+                <el-col :span="9">
                   <el-form-item label="遵守标准">
                     <el-checkbox-group v-model="form.complianceStandards">
                       <el-checkbox v-for="(item, index) in standardsList" :key="'standards' + index" :label="item.label" :value="item.value" />
                     </el-checkbox-group>
                   </el-form-item>
                 </el-col>
-                <el-col :span="7">
+                <el-col :span="11">
                   <el-form-item label="产品已获得的认证">
                     <el-checkbox-group :max="1" v-model="form.productCertification">
                       <el-checkbox v-for="(item, index) in authenticationList" :key="'authentication' + index" :label="item.label" :value="item.value" />
                     </el-checkbox-group>
                   </el-form-item>
                 </el-col>
-                <el-col :span="5">
+                <el-col :span="4">
                   <el-form-item label="" label-width="0rem">
                     <el-input v-show="form.productCertification[0] == '其他说明'" v-model="form.otherNotes" placeholder="请输入其他说明" />
                   </el-form-item>
diff --git a/src/views/Invest/CooperationOffer/Index.vue b/src/views/Invest/CooperationOffer/Index.vue
index 39909db..0033e88 100644
--- a/src/views/Invest/CooperationOffer/Index.vue
+++ b/src/views/Invest/CooperationOffer/Index.vue
@@ -136,7 +136,7 @@
         <div class="wrapper1680">
           <div class="remarks">
             <span>如果您有【产业/产品/项目】需要策划操盘、资源导入、资本加持，如果您需要拓展华北、华东、华南或者国际市场，请填写申请表或者发送您的合作方案至以下</span>
-            <a>邮箱：Info@futurestar.cc</a>
+            <a>邮箱：Info@cnkhp.com</a>
             <span>若您的来信真实、完整、有效，我们将在5个工作日内给予回复，期待您的加入!</span>
           </div>
         </div>
@@ -187,12 +187,12 @@ export default {
         children: [
           { value: '资本服务' },
           { value: '高新技术' },
-          { value: '能源环保' },
-          { value: '全球供应链' },
-          { value: '商业发展' },
-          { value: '未来农业' },
-          { value: '健康产业' },
+          { value: '大健康产业' },
           { value: '基础设施' },
+          { value: '能源环保' },
+          { value: '供应链管理' },
+          { value: '农业发展' },
+          { value: '商业服务' },
         ],
       },
       share: {