diff --git a/src/assets/img/features/android_1.png b/src/assets/img/home/android_1.png
similarity index 100%
rename from src/assets/img/features/android_1.png
rename to src/assets/img/home/android_1.png
diff --git a/src/assets/img/features/apple_1.png b/src/assets/img/home/apple_1.png
similarity index 100%
rename from src/assets/img/features/apple_1.png
rename to src/assets/img/home/apple_1.png
diff --git a/src/assets/img/home/bg_1.png b/src/assets/img/home/bg_1.png
new file mode 100644
index 0000000..1c6a504
Binary files /dev/null and b/src/assets/img/home/bg_1.png differ
diff --git a/src/assets/img/home/bg_2.png b/src/assets/img/home/bg_2.png
new file mode 100644
index 0000000..f931029
Binary files /dev/null and b/src/assets/img/home/bg_2.png differ
diff --git a/src/assets/img/home/bg_3.png b/src/assets/img/home/bg_3.png
new file mode 100644
index 0000000..e3863d8
Binary files /dev/null and b/src/assets/img/home/bg_3.png differ
diff --git a/src/assets/img/home/download.png b/src/assets/img/home/download.png
new file mode 100644
index 0000000..1db1215
Binary files /dev/null and b/src/assets/img/home/download.png differ
diff --git a/src/assets/img/home/global.png b/src/assets/img/home/global.png
new file mode 100644
index 0000000..ec2448b
Binary files /dev/null and b/src/assets/img/home/global.png differ
diff --git a/src/assets/img/home/global_grey.png b/src/assets/img/home/global_grey.png
new file mode 100644
index 0000000..9f53a18
Binary files /dev/null and b/src/assets/img/home/global_grey.png differ
diff --git a/src/assets/img/features/google_1.png b/src/assets/img/home/google_1.png
similarity index 100%
rename from src/assets/img/features/google_1.png
rename to src/assets/img/home/google_1.png
diff --git a/src/assets/img/illustration_1.png b/src/assets/img/home/illustration_1.png
similarity index 100%
rename from src/assets/img/illustration_1.png
rename to src/assets/img/home/illustration_1.png
diff --git a/src/assets/img/home/illustration_2.png b/src/assets/img/home/illustration_2.png
new file mode 100644
index 0000000..50e8c94
Binary files /dev/null and b/src/assets/img/home/illustration_2.png differ
diff --git a/src/assets/img/home/illustration_3.png b/src/assets/img/home/illustration_3.png
new file mode 100644
index 0000000..9bf595e
Binary files /dev/null and b/src/assets/img/home/illustration_3.png differ
diff --git a/src/assets/img/home/illustration_4.png b/src/assets/img/home/illustration_4.png
new file mode 100644
index 0000000..0f90e7f
Binary files /dev/null and b/src/assets/img/home/illustration_4.png differ
diff --git a/src/assets/img/home/plus.png b/src/assets/img/home/plus.png
new file mode 100644
index 0000000..1ff712f
Binary files /dev/null and b/src/assets/img/home/plus.png differ
diff --git a/src/components/CommonFooter.vue b/src/components/CommonFooter.vue
index 994661b..ada65e2 100644
--- a/src/components/CommonFooter.vue
+++ b/src/components/CommonFooter.vue
@@ -1,254 +1,253 @@
 <template>
   <!-- colto-section -->
   <footer class="footer">
-    <div class="footer-upper-section">
-      <!-- logo -->
-      <div class="footer-upper-section-right">
-        <div class="footer-logo d-flex">
-          <div style="width: 190px; height: 91px">
-            <img
-              :src="appConfig.head_logo"
-              alt="logo"
-              style="width: 100%; height: 100%; object-fit: contain"
-            />
+    <div class="content">
+      <div class="footer-upper-section">
+        <!-- logo -->
+        <div class="footer-upper-section-top">
+          <div class="footer-logo">
+            <div style="width: 89px; height: 44px">
+              <img
+                :src="appConfig.head_logo"
+                alt="logo"
+                style="width: 100%; height: 100%; object-fit: contain"
+              />
+            </div>
+            <div style="color: #5B5B5B;font-size: 16px;">{{ appConfig.copyright }}</div>
           </div>
-          
         </div>
-      </div>
-      <div class="footer-upper-section-left">
-        <!-- service -->
-        <div class="service" v-if="service.length>0">
-          <div class="item" style="width: 100%;text-align: left">
-            <p
-              class="item_p"
-              style="
-                
-                font-size: 20px;
-                color: #444;
-                font-weight: 700;
-              "
-            >
-              {{ $t("common.service") }}
-            </p>
-            <p class="foot_p" >
-              <router-link :to="service[0].url">{{
-                service[0].label
-              }}</router-link>
-            </p>
-            <p class="foot_p" >
-              <router-link :to="service[1].url">{{
-                service[1].label
-              }}</router-link>
-            </p>
-            <p class="foot_p" >
-              <router-link :to="service[2].url">{{
-                service[2].label
-              }}</router-link>
-
-              <!--                <router-link :to="service[3].url">{{ service[3].label }}</router-link>-->
-            </p>
-            <!-- <p class="foot_p" >
-              <router-link :to="service[3].url">{{
-                service[3].label
-              }}</router-link>
-            </p> -->
+        <div class="footer-upper-section-lang">
+          <button class="lang_now" @click="toggleMenu">{{ nativeLang }}</button>
+          <div class="lang_menu" :class="showMenu?'show':'hide'">
+            <div class="item" v-for="(item1, index1) in langList" :key="index1">
+            {{ item1.label }}
+          </div>
           </div>
         </div>
+        <div class="footer-upper-section-list">
+          <!-- service -->
+          <div class="service" v-if="service.length>0">
+            <div class="item" style="width: 100%;text-align: left">
+              <p
+                class="item_p"
+                style="
+                  
+                  font-size: 20px;
+                  color: #fff;
+                "
+              >
+                {{ $t("common.service") }}
+              </p>
+              <p class="foot_p" >
+                <router-link :to="service[0].url">{{
+                  service[0].label
+                }}</router-link>
+              </p>
+              <p class="foot_p" >
+                <router-link :to="service[1].url">{{
+                  service[1].label
+                }}</router-link>
+              </p>
+              <p class="foot_p" >
+                <router-link :to="service[2].url">{{
+                  service[2].label
+                }}</router-link>
+
+                <!--                <router-link :to="service[3].url">{{ service[3].label }}</router-link>-->
+              </p>
+              <!-- <p class="foot_p" >
+                <router-link :to="service[3].url">{{
+                  service[3].label
+                }}</router-link>
+              </p> -->
+            </div>
+          </div>
+
+          <!-- college -->
+          <div class="college" style="margin:0 119px;" v-if="college.length>0">
+            <div class="item item1" style="width: 100%;text-align: left">
+              <p
+                class="item_p"
+                style="
+                  
+                  font-size: 20px;
+                  color: #fff;
+                "
+              >
+                {{ $t("common.college") }}
+              </p>
+              <p class="foot_p" >
+                <router-link :to="college[0].url">{{
+                  college[0].label
+                }}</router-link>
+              </p>
+              <p class="foot_p" >
+                <router-link :to="college[1].url">{{
+                  college[1].label
+                }}</router-link>
+              </p>
+              <p class="foot_p" >
+                <router-link :to="college[2].url">{{
+                  college[2].label
+                }}</router-link>
+              </p>
+              <p class="foot_p" >
+                <router-link :to="college[3].url">{{
+                  college[3].label
+                }}</router-link>
+              </p>
+            </div>
+          </div>
 
-        <!-- college -->
-        <div class="college" style="margin:0 119px;" v-if="college.length>0">
-          <div class="item item1" style="width: 100%;text-align: left">
+          <!-- email -->
+          <div class="item">
             <p
               class="item_p"
-              style="
-                
-                font-size: 20px;
-                color: #444;
-                font-weight: 700;
-              "
+              style="text-align: left; font-size: 20px; color: #fff"
             >
-              {{ $t("common.college") }}
-            </p>
-            <p class="foot_p" >
-              <router-link :to="college[0].url">{{
-                college[0].label
-              }}</router-link>
+              {{ $t("common.contactUs") }}
             </p>
-            <p class="foot_p" >
-              <router-link :to="college[1].url">{{
-                college[1].label
-              }}</router-link>
+            <p class="foot_p" style="font-size: 14px">
+              {{ $t("common.email") }}:
             </p>
-            <p class="foot_p" >
-              <router-link :to="college[2].url">{{
-                college[2].label
-              }}</router-link>
-            </p>
-            <p class="foot_p" >
-              <router-link :to="college[3].url">{{
-                college[3].label
-              }}</router-link>
+            <p class="foot_p" style="font-size: 14px;">
+              {{ email }}
             </p>
           </div>
-        </div>
 
-        <!-- email -->
-        <div class="item">
-          <p
-            class="item_p"
-            style="text-align: left; font-size: 20px; color: #444"
-          >
-            {{ $t("common.contactUs") }}
-          </p>
-          <p class="foot_p" style="font-size: 14px">
-            {{ $t("common.email") }}:
-          </p>
-          <p class="foot_p" style="font-size: 14px;">
-            {{ email }}
-          </p>
-        </div>
+          
 
-        
 
+          <!-- <div class="logo"> -->
+          <!-- <img src="../assets/img/logo1.png" alt="logo" style="width:208px;height:68px" /> -->
+          <!-- <div style="width: 90px; height: 91px">
+              <img
+                :src="appConfig.head_logo"
+                alt="logo"
+                style="width: 100%; height: 100%; object-fit: contain"
+              />
+            </div> -->
 
-        <!-- <div class="logo"> -->
-        <!-- <img src="../assets/img/logo1.png" alt="logo" style="width:208px;height:68px" /> -->
-        <!-- <div style="width: 90px; height: 91px">
-            <img
-              :src="appConfig.head_logo"
-              alt="logo"
-              style="width: 100%; height: 100%; object-fit: contain"
-            />
-          </div> -->
+          <!-- <span>{{$t('common.footerTips1')}}</span> -->
+          <!-- </div> -->
+          <!-- <span>{{ $t('common.footerTips1') }}</span> -->
+          <!-- <p class="foot_p">{{ $t('common.footerTips2', {name: appConfig.name}) }}</p> -->
+          <!-- <p class="foot_p">{{$t('appConfig.name')}}</p> -->
+          <!-- <p class="foot_p">{{ $t('common.footerTips3') }}</p> -->
+        </div>
 
-        <!-- <span>{{$t('common.footerTips1')}}</span> -->
-        <!-- </div> -->
-        <!-- <span>{{ $t('common.footerTips1') }}</span> -->
-        <!-- <p class="foot_p">{{ $t('common.footerTips2', {name: appConfig.name}) }}</p> -->
-        <!-- <p class="foot_p">{{$t('appConfig.name')}}</p> -->
-        <!-- <p class="foot_p">{{ $t('common.footerTips3') }}</p> -->
-      </div>
+        
 
-      
-
-      <!-- email -->
-      <!-- <div class="item" style="width:30%;margin-top: 74px;">
-                <p class="item_p" style="text-align: start; font-size:16px;">{{ $t("common.contactUs") }}</p>
-                <p class="foot_p" style="text-align: start; font-size:16px;">
-                    {{ $t("common.email") }}:{{ email }}
-                </p>
-                <div class="icon_foot">
-                    <img src="../assets/img/chat.png">
-                    <div class="icon_img" v-for="(item,index) in list" :key="item">
-                       <img :src="item.src"/>
-                    </div>
+        <!-- email -->
+        <!-- <div class="item" style="width:30%;margin-top: 74px;">
+                  <p class="item_p" style="text-align: start; font-size:16px;">{{ $t("common.contactUs") }}</p>
+                  <p class="foot_p" style="text-align: start; font-size:16px;">
+                      {{ $t("common.email") }}:{{ email }}
+                  </p>
+                  <div class="icon_foot">
+                      <img src="../assets/img/chat.png">
+                      <div class="icon_img" v-for="(item,index) in list" :key="item">
+                        <img :src="item.src"/>
+                      </div>
+                  </div>
+                  <p class="foot_p" style="width:100%">
+                    {{email}}
+                  </p>
+              </div> -->
+
+        <!-- <div class="container">
+                <div class="row"> -->
+        <!-- <div class="col-lg-2 col-md-3 mb-4">
+                <div class="footer-logo">
+                  <a href="#">
+                    <img :src="logo.imgurl" alt="img" class="img-responsive" />
+                    <img :src="appConfig.foot_logo" alt="logo" />
+                  </a>
                 </div>
-                <p class="foot_p" style="width:100%">
-                  {{email}}
-                </p>
-            </div> -->
-
-      <!-- <div class="container">
-              <div class="row"> -->
-      <!-- <div class="col-lg-2 col-md-3 mb-4">
-              <div class="footer-logo">
-                <a href="#">
-                  <img :src="logo.imgurl" alt="img" class="img-responsive" />
-                  <img :src="appConfig.foot_logo" alt="logo" />
-                </a>
-              </div>
-            </div> -->
-      <!-- 服务列表 -->
-      <!-- <div class="col-lg-1 col-md-3 mb-4">
-               <div class="footer-info-list">
-                 <h4>{{ $t("common.service") }}</h4>
-                 <ul>
-                   <li v-for="(item, index) in service" :key="index">
-                     <router-link :to="item.url">{{ item.label }}</router-link>
-                   </li>
-                 </ul>
-               </div>
-             </div> -->
-      <!-- 学院列表 -->
-      <!-- <div class="col-lg-1 col-md-3 mb-4">
-              <div class="footer-info-list">
-                <h4>{{ $t("common.college") }}</h4>
-                <ul>
-                  <li v-for="item in college" :key="item.id">
-                    <router-link :to="item.url">{{ item.label}}</router-link>
-                  </li>
-                </ul>
-              </div>
-            </div> -->
-
-      <!-- 联系我们 -->
-      <!-- <div class="col-lg-2 col-md-6">
-              <div class="footer-info-list">
-                <h4>{{$t('common.contactUs')}}</h4>
-                <ul class="contact-info">
-                  <li>
-                    {{ $t("common.email") }}:
-                    <span>{{email}}</span>
-                  </li>
-                  <li>
-                    Phone: <span>{{contactinfo.mobile}}</span>
-                  </li>
-                </ul>
-                <ul class="social-style-two">
-                  <li>
-                    <a href="#">
-                      <i class="fab fa-facebook-f"></i>
-                    </a>
-                  </li>
-                  <li>
-                    <a href="#">
-                      <i class="fab fa-twitter"></i>
-                    </a>
-                  </li>
-                  <li>
-                    <a href="#">
-                      <i class="fab fa-google-plus-g"></i>
-                    </a>
-                  </li>
-                  <li>
-                    <a href="#">
-                      <i class="fab fa-github"></i>
-                    </a>
-                  </li>
-                  <li>
-                    <a href="#">
-                      <i class="fab fa-linkedin-in"></i>
-                    </a>
-                  </li>
-                </ul>
-              </div>
-            </div> -->
-      <!-- <div class="col-lg-4 col-md-6 border-left">
-              <div class="pl-2 ">
-                <div class="mb-2">
-                  {{$t('common.footerTips1')}}
+              </div> -->
+        <!-- 服务列表 -->
+        <!-- <div class="col-lg-1 col-md-3 mb-4">
+                <div class="footer-info-list">
+                  <h4>{{ $t("common.service") }}</h4>
+                  <ul>
+                    <li v-for="(item, index) in service" :key="index">
+                      <router-link :to="item.url">{{ item.label }}</router-link>
+                    </li>
+                  </ul>
                 </div>
-                <div class="mb-2"> {{$t('common.footerTips2',{name:appConfig.name})}}</div>
-                <div class="mb-2">{{$t('common.footerTips3')}}</div>
-
-              </div>
-            </div> -->
-      <!-- </div> -->
-      <!-- </div> -->
-    </div>
-    <div class="footer-bottom">
-      <!-- 版权信息 -->
-      <div class="container">
-        <!-- <div class="footer-bottom-wrap">
-          &copy;
-          <div class="copyright-text text-center">
-            {{ appConfig.copyright }}
-          </div>
-        </div> -->
+              </div> -->
+        <!-- 学院列表 -->
+        <!-- <div class="col-lg-1 col-md-3 mb-4">
+                <div class="footer-info-list">
+                  <h4>{{ $t("common.college") }}</h4>
+                  <ul>
+                    <li v-for="item in college" :key="item.id">
+                      <router-link :to="item.url">{{ item.label}}</router-link>
+                    </li>
+                  </ul>
+                </div>
+              </div> -->
+
+        <!-- 联系我们 -->
+        <!-- <div class="col-lg-2 col-md-6">
+                <div class="footer-info-list">
+                  <h4>{{$t('common.contactUs')}}</h4>
+                  <ul class="contact-info">
+                    <li>
+                      {{ $t("common.email") }}:
+                      <span>{{email}}</span>
+                    </li>
+                    <li>
+                      Phone: <span>{{contactinfo.mobile}}</span>
+                    </li>
+                  </ul>
+                  <ul class="social-style-two">
+                    <li>
+                      <a href="#">
+                        <i class="fab fa-facebook-f"></i>
+                      </a>
+                    </li>
+                    <li>
+                      <a href="#">
+                        <i class="fab fa-twitter"></i>
+                      </a>
+                    </li>
+                    <li>
+                      <a href="#">
+                        <i class="fab fa-google-plus-g"></i>
+                      </a>
+                    </li>
+                    <li>
+                      <a href="#">
+                        <i class="fab fa-github"></i>
+                      </a>
+                    </li>
+                    <li>
+                      <a href="#">
+                        <i class="fab fa-linkedin-in"></i>
+                      </a>
+                    </li>
+                  </ul>
+                </div>
+              </div> -->
+        <!-- <div class="col-lg-4 col-md-6 border-left">
+                <div class="pl-2 ">
+                  <div class="mb-2">
+                    {{$t('common.footerTips1')}}
+                  </div>
+                  <div class="mb-2"> {{$t('common.footerTips2',{name:appConfig.name})}}</div>
+                  <div class="mb-2">{{$t('common.footerTips3')}}</div>
 
-        <div class="copyright-text text-center">
-          {{ appConfig.copyright }}
-        </div>
+                </div>
+              </div> -->
+        <!-- </div> -->
+        <!-- </div> -->
+      </div>
+      <div class="footer-right">
+        <div style="font-size: 20px;">{{ $t("homeNewText.cc1") }}</div>
+        <div class="jump_btn">{{ $t("homeNewText.cc2") }}</div>
+        <img src="" alt="" style="width: 120px;height: 120px;">
+        <div style="font-size: 16px; color: #9c9c9c;margin-top: 12px;">{{ $t("homeNewText.cc3") }}</div>
       </div>
     </div>
   </footer>
@@ -276,14 +275,92 @@ export default {
         { src: "https://www.rsncoin.com/static/flag/vk.png" },
         { src: "https://www.rsncoin.com/static/flag/youtube.jpg" },
       ],
+      langList: [
+        // {
+        //     value: "cn", // zh-CN
+        //     label: "简体中文"
+        // },
+        {
+          value: "en",
+          label: "English",
+          url: require("../assets/img/en.jpg"),
+        },
+        {
+          value: "kor",
+          label: "한국어",
+          url: require("../assets/img/kor.jpg"),
+        },
+        {
+          value: "de",
+          label: "Deutsch",
+          url: require("../assets/img/de.jpg"),
+        },
+        {
+          value: "fra",
+          label: "Français",
+          url: require("../assets/img/fra.jpg"),
+        },
+        {
+          value: "spa",
+          label: "Español",
+          url: require("../assets/img/spa.jpg"),
+        },
+        {
+          value: "it",
+          label: "Italiano",
+          url: require("../assets/img/it.jpg"),
+        },
+        {
+          value: "jp",
+          label: "日本語",
+          url: require("../assets/img/jp.jpg"),
+        },
+        {
+          value: "pt",
+          label: "Português",
+          url: require("../assets/img/pt.jpg"),
+        },
+        {
+          value: "tr",
+          label: "Turkey",
+          url: require("../assets/img/tr.jpg"),
+        },
+        {
+          value: "tw", // zh-TW
+          label: "繁体中文",
+          url: require("../assets/img/tw.jpg"),
+        },
+      ],
+      showMenu: false
     };
   },
   computed: {
     ...mapState({
       appConfig: "appConfig",
     }),
+    // 当前语言
+    nativeLang() {
+      let UALang;
+      // 检测中文简体和翻译
+      // if (navigator.language.startsWith("zh")) {
+      //     UALang = _.trimStart(navigator.language, "zh-").toLowerCase();
+      // } else {
+      UALang = "en"; // 其余英文
+      // }
+
+      let lang = localStorage.lang || UALang;
+      if (localStorage.getItem("lang") == null) {
+        // let localStorage.getItem("lang") = 'en';
+      }
+      this.langer = require("../assets/img/" + lang + ".jpg");
+      return this.langList.find((item) => item.value == lang).label;
+    },
   },
   methods: {
+    toggleMenu(e){
+      e.stopPropagation();
+      this.showMenu = !this.showMenu;
+    },
     getCollegeLinks() {
       College.getCategoryList()
         .then((list) => {
@@ -328,101 +405,150 @@ export default {
 
 <style scoped lang="scss">
 .footer {
-  background-color: #000;
+  background-color: #121212;
   border-top: none;
-  .footer-upper-section {
-  padding: 0;
-  display: flex;
-  align-items: center;
-  height: 324px;
-  // margin-left: 233px;
-  justify-content: center;
-  padding: 0 400px;
-  // background-color: #000;
-  .footer-upper-section-left {
+  
+  .content{
     display: flex;
     justify-content: space-between;
-    margin-left: 100px;
-  }
-  .footer-upper-section-right {
-    .footer-logo {
-      align-items: center;
-      justify-content: start;
-    }
+    align-items: center;
+    width: 1200px;
+    height: 560px;
+    margin: 0px auto;
   }
+  .footer-upper-section {
+      padding: 0px;
+
+      .footer-upper-section-lang{
+        width: 182px;height: 49px;
+        border-radius: 11px;
+        border: 1px solid #fff;
+        font-size: 16px;
+        margin: 37px 0px 31px;
+        position: relative;
+
+        .lang_now{
+          display: block;
+          text-align: center;
+          width: 100%;
+          line-height: 45px;
+          color: #fff;
+          background-color: transparent;
+          outline: none;
+          border: none;
+          position: relative;
+
+          &::before{
+            content: '';
+            position: absolute;
+            width: 24px;
+            height: 24px;
+            background-image: url("../assets/img/home/global_grey.png");
+            background-size: 100%;
+            left: 24px;
+            top: 12px;
+          }
+
+          &::after{
+            content: '';
+            position: absolute;
+            width: 8px;
+            height: 8px;
+            border-top: 1px solid transparent;
+            border-left: 1px solid #999;
+            border-right: 1px solid transparent;
+            border-bottom: 1px solid #999;
+            transform: rotate(-45deg);
+            right: 30px;
+            top: 18px;
+          }
+        }
+        .lang_menu{
+          position: absolute;
+          width: 182px;
+          height: 220px;
+          background-color: #fff;
+          border-radius: 10px;
+          overflow: scroll;
+          color: #101010;
+
+          &::-webkit-scrollbar { width: 0; height: 0; background-color: transparent;}
+          &::-webkit-scrollbar-track { background-color: transparent;}
+          &::-webkit-scrollbar-thumb { background-color: transparent;}
+
+          .item{
+            padding: 5px 10px;
+          }
+          
+          &.show{
+            display: block;
+          }
+          &.hide{
+            display: none;
+          }
+        }
+      }
+      .footer-upper-section-list {
+        display: flex;
+        justify-content: space-between;
+      }
+      .footer-upper-section-top {
+        .footer-logo {
+          
+        }
+      }
+
+      .item_left {
+        width: 454px;
+        //   margin-right: 300px;
+        .logo {
+          display: flex;
+          align-items: center;
+          color: #172636;
+          justify-content: space-between;
+          width: 100%;
+          font-size: 16px;
+        }
+      }
 
-  .item_left {
-    width: 454px;
-    //   margin-right: 300px;
-    .logo {
-      display: flex;
-      align-items: center;
-      color: #172636;
-      justify-content: space-between;
-      width: 100%;
-      font-size: 16px;
-    }
   }
 
-  // .item_right {
-  //   display: flex;
-  //   height: 99px;
-
-  //   .item {
-  //     // border-right: 1px solid #303D4B;
-  //     margin-right: 80px;
-  //     padding: 0 15px;
-
-  //     .item_p {
-  //     }
-  //   }
-
-  //   .item1 {
-  //     text-align: center;
-  //   }
-
-  //   .item2 {
-  //     padding-left: 64px;
-  //   }
-
-  //   .item:last-child {
-  //     border: none;
-  //   }
-  // }
-}
-
-.footer-bottom {
-  width: 100%;
-  height: 57px;
-  // background-color: rgba(0, 0, 0, 1);
-  text-align: center;
-  border: 1px solid rgba(46, 46, 46, 1);
-  .container {
-    width: 100%;
-    // height: 57px;
-    margin: 0 auto;
-    .copyright-text{
-      color: #444;
+  .footer-right{
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+
+    .jump_btn{
+      display: inline-block;
+      min-width: 200px;
+      height: 56px;
+      line-height: 56px;
+      text-align: center;
+      color: #101010;
+      background-color: #fff;
+      border-radius: 50px;
+      font-size: 20px;
+      padding: 0px 20px;
+      box-sizing: border-box;
+      margin: 46px 0px 42px;
     }
   }
-}
 
 }
 
 
 
-
 .foot_p {
-  color: #797979;
-  font-size: 14px;
+  color: #b5b5b5;
+  font-size: 16px;
   margin: 0;
 
   a:hover {
-    color: #797979;
+    color: #b5b5b5;
   }
 
   a:visited {
-    color: #797979;
+    color: #b5b5b5;
   }
 }
 
diff --git a/src/components/CommonHeader.vue b/src/components/CommonHeader.vue
index ab11eeb..937ca73 100644
--- a/src/components/CommonHeader.vue
+++ b/src/components/CommonHeader.vue
@@ -1,6 +1,6 @@
 <template>
     <header id="common-header" :class="[`light-bb`, hook]">
-        <nav class="navbar navbar-expand-lg" style="background-color: #141414;">
+        <nav class="navbar navbar-expand-lg" style="background-color: #121212;">
             <a class="navbar-brand" href="#/">
                 <img :src="appConfig.head_logo" alt="logo"/>
                 <!-- <img src="../assets/img/logo.png" alt="logo" style="width:102px;height:30px"/> -->
@@ -103,14 +103,14 @@
                     </li> -->
                     <li class="nav-item dropdown">
 
-                        <!-- <img src="../assets/img/hg.jpg" class="nav_img" style="max-width: 10%;"></img> -->
+                        
                         <!-- <div style="display: flex;" class="nav_title"> -->
 
                         <!--<img src="../assets/img/tw.jpg" mode="" class="nav_img" style="max-width: 10%;"></img>-->
 
                         <a class="nav-link dropdown-toggle" href="#" role="button" data-toggle="dropdown"
                            aria-haspopup="true" aria-expanded="false">
-
+                           <img src="../assets/img/home/global.png" class="nav_img" style="width: 24px;height: 24px;" />
                             {{ nativeLang }}</a>
                         <!-- <img src="../assets/img/hg.jpg" class="nav_img" style="max-width: 10%;"></img> -->
                         <!-- </div> -->
@@ -125,6 +125,20 @@
                             </div>
                         </div>
                     </li>
+                    <li class="nav-item dropdown">
+                        <a class="nav-link dropdown-toggle dropdown-download" href="#" role="button" data-toggle="dropdown"
+                           aria-haspopup="true" aria-expanded="false">
+
+                            <img src="../assets/img/home/download.png" alt="" style="width: 24px;height: 24px;">
+                        </a>
+
+                        <div class="dropdown-menu download">
+                          <div class="dropdown-item">
+                            <div>{{ $t("homeNewText.cc4") }}</div>
+                            <img src="" alt="">
+                          </div>
+                        </div>
+                    </li>
 
                     <template v-if="isLogin">
                         <li class="nav-item dropdown">
@@ -195,11 +209,11 @@
                     <template v-else>
                         <li class="nav-item dropdown no-login" style="width:auto">
                             <router-link to="/sign-in" class="btn btn-sm rounded-pill" href="#" tag="div"
-                                         role="button" style="margin:0 15px;color:#D1712E;border: 1px solid #D1712E;">{{ $t('common.sign_in') }}
+                                         role="button" style="margin:0 15px;color:#fff;">{{ $t('common.sign_in') }}
                             </router-link>
                             <router-link to="/sign-up"
                                          class="btn btn-sm rounded-pill" href="#"
-                                         tag="div" role="button" style="color:#fff;background-color: #D1712E;">{{ $t('common.sign_up') }}
+                                         tag="div" role="button" style="color:#fff;border: 1px solid #fff;border-radius: 50px !important;">{{ $t('common.sign_up') }}
                             </router-link>
                         </li>
                     </template>
@@ -604,7 +618,7 @@ color: #fff !important;
     width: 145px;
 
     .btn {
-      min-width: 70px;
+      min-width: 60px;
 
     }
     .btn-outline-light {
@@ -631,8 +645,8 @@ color: #fff !important;
   .nav-bar .router-link-active {
     // color: #c99445;
     // color: black;
-    color: #D1712E;
-    border-bottom: 2px solid #D1712E !important;
+    color: #fff;
+    border-bottom: 2px solid #fff !important;
     // background-color:rgba(53, 83, 210, 0.2) ;
   }
 
@@ -690,4 +704,27 @@ color: #fff !important;
   line-height: 50 rpx;
   text-align: right;
 }
+.dropdown-download::after{
+  content: none;
+}
+.dropdown-menu.download{
+  background-color: #fff;
+  width: 192px;height: 225px;
+  border-radius: 10px;
+  right: -68px;
+  top: 55px;
+  text-align: center;
+  .dropdown-item{
+    color: #101010;
+    line-height: 42px;
+
+    img{
+      width: 140px;
+      height: 140px;
+    }
+  }
+}
+.dropdown-menu.download::before{
+  content: none;
+}
 </style>
diff --git a/src/i18n.zip b/src/i18n.zip
deleted file mode 100644
index f44bd59..0000000
Binary files a/src/i18n.zip and /dev/null differ
diff --git a/src/i18n/en.json b/src/i18n/en.json
index c8e0de4..f079a3c 100644
--- a/src/i18n/en.json
+++ b/src/i18n/en.json
@@ -1156,53 +1156,31 @@
         "UseNow": "USE NOW"
     },
     "homeNewText": {
-        "aa1": "Start your cryptocurrency investment",
-        "aa2": "Safe, stable and efficient",
+        "aa1": "XXX数货币交易所",
+        "aa2": "更快、更好、更强",
         "aa3": "Register now",
         "aa4": "Start trading immediately",
+
         "aa5": "Popular cryptocurrencies",
         "aa6": "Digital Asset Quote Express",
         "aa7": "Currency",
         "bb1": "Latest price (USD)",
         "bb2": "24h increase",
         "bb3": "24h trading volume",
-        "bb4": "A cryptocurrency exchange worthy of users' trust",
-        "bb5": "Buy at AJcoin and trade over 100 cryptocurrencies",
-        "bb6": "Strong independent research and development capabilities",
-        "bb7": "Independently develop the third generation trading system from 0 to 1",
-        "bb8": "Create the ultimate trading experience with excellent performance",
-        "bb9": "Global layout",
-        "bb10": "Global elite gathering",
-        "bb11": "The team is distributed around the world",
-        "bb12": "Super spot",
-        "bb13": "Exclusive launch of spot cost price function",
-        "bb14": "Create a contract-level spot trading experience",
-        "bb15": "Top Security",
-        "bb16": "Risk Control",
-        "bb17": "Double means to protect the safety of your assets",
-        "bb18": "Perfect risk control system",
-        "bb19": "Double price liquidation protection mechanism",
-        "bb20": "Reduce the risk of user liquidation",
-        "bb21": "7*24 hours service",
-        "bb22": "1 minute response mechanism",
-        "bb23": "Serving global users around the clock",
 
-        "cc5": "Trade Anywhere",
-        "cc8": "Stay informed with our app and desktop client",
-        "cc6": "Scan the QR code",
-        "cc7": "Download Android/IOS App",
-        "dd1": "Unique trading experience",
-        "dd2": "A breakthrough tool for investing in cryptocurrencies",
-        "dd3": "Three major stop-profit and stop-loss functions",
-        "dd4": "AJcoin provides three modes: take profit and stop loss for all positions, take profit and stop loss for some positions, and take profit and stop loss at trigger price to help users control transaction risks",
-        "dd5": "Up to 50 different take profit and stop loss points",
-        "dd6": "Users can set take-profit and stop-loss points at any time in positions and pending orders to flexibly control risks; at the same time, it supports setting up to 50 take-profit and stop-loss orders for the same position with different numbers and prices, including limit orders. or market price order to meet users’ different investment strategies.",
-        "dd7": "Help Center",
-        "ee1": "Global Ranking",
-        "ee2": "users trust us",
-        "ee3": "Ultra-Low Fees",
-        "ee4": "Countries",
-        "ee5": "Start your cryptocurrency investment now",
-        "ee6": "Graphical verification"
+        "bb4": "数字货币交易，我们是专业的",
+        "bb5": "最低的手续费，最快捷的交易，强劲的API以及更多",
+        "bb6": "XXXAPP，创造无限可能",
+        "bb7": "初次交易？$5即可小试牛刀，XXX跟您一起步步登高",
+        "bb8": "下载扫描二维码",
+        "bb9": "您数字货币之旅的得力助手",
+        "bb10": "从数字货币交易体验到第一次购买NFT，XXX将助您轻松赚币",
+        "bb11": "走进XXX",
+        "bb12": "在我们世界级全球伙伴帮助下，了解XXX会是你最爱的数字货币交易APP",
+        "bb13": "常见问题",
+        "cc1": "XXX，随时随地交易",
+        "cc2": "立即交易",
+        "cc3": "扫码下载XXXAPP",
+        "cc4": "扫码下载APP"
     }
 }
diff --git a/src/i18n/kor.json b/src/i18n/kor.json
index 226eaee..cd22b17 100644
--- a/src/i18n/kor.json
+++ b/src/i18n/kor.json
@@ -1037,53 +1037,25 @@
         "m4":"주문 취소"
     },
     "homeNewText": {
-        "aa1": "암호화폐 투자를 시작하세요",
-        "aa2": "안전하고 안정적이며 효율적",
+        "aa1": "",
+        "aa2": "",
         "aa3": "지금 등록하세요",
         "aa4": "즉시 거래 시작",
-        "aa5": "인기 암호화폐",
-        "aa6": "디지털 자산 견적 익스프레스",
-        "aa7": "통화",
-        "bb1": "최신 가격(USD)",
-        "bb2": "24시간 증가",
-        "bb3": "24시간 거래량",
-        "bb4": "사용자의 신뢰를 받을 수 있는 암호화폐 거래소",
-        "bb5": "AJcoin 에서 구매하고 100개 이상의 암호화폐를 거래하세요",
-        "bb6": "강력한 독립적인 연구 개발 역량",
-        "bb7": "0에서 1까지 3세대 거래 시스템을 독립적으로 개발",
-        "bb8": "뛰어난 성능으로 최고의 거래 경험을 만들어 보세요",
-        "bb9": "전역 레이아웃",
-        "bb10": "글로벌 엘리트 모임",
-        "bb11": "팀은 전 세계에 분산되어 있습니다.",
-        "bb12": "슈퍼 스팟",
-        "bb13": "현물 원가 기능 독점 출시",
-        "bb14": "계약 수준의 현물 거래 경험을 만들어보세요",
-        "bb15": "최고 보안",
-        "bb16": "위험 제어",
-        "bb17": "이중은 자산의 안전을 보호한다는 의미입니다.",
-        "bb18": "완벽한 위험 관리 시스템",
-        "bb19": "이중 가격 청산 방지 메커니즘",
-        "bb20": "사용자 청산 위험 감소",
-        "bb21": "7*24시간 서비스",
-        "bb22": "1분 응답 메커니즘",
-        "bb23": "전 세계 사용자에게 24시간 내내 서비스 제공",
 
-        "cc5": "어디서나 거래하세요",
-        "cc8": "저희 앱과 데스크톱 클라이언트로 최신 정보를 받아보세요",
-        "cc6": "QR 코드를 스캔하세요",
-        "cc7": "Android/IOS 앱 다운로드",
-        "dd1": "독특한 거래 경험",
-        "dd2": "암호화폐 투자를 위한 획기적인 도구",
-        "dd3": "3가지 주요 손절매 및 손절매 기능",
-        "dd4": "AJcoin 는 세 가지 모드를 제공합니다. 모든 포지션에 대해 이익 실현 및 손실 중지, 일부 포지션에 대해 이익 실현 및 손실 중지, 트리거 가격에서 이익 실현 및 손실 중지를 제공하여 사용자가 거래 위험을 제어하는 ​​데 도움을 줍니다.",
-        "dd5": "최대 50개의 다양한 테이크프로핏 및 스톱로스 포인트",
-        "dd6": "사용자는 포지션 및 보류 주문에서 언제든지 이익 실현 및 손실 중지 지점을 설정하여 위험을 유연하게 제어할 수 있습니다. 또한 동일한 포지션에 대해 서로 다른 조건으로 최대 50개의 이익 실현 및 손실 중지 주문 설정을 지원합니다. 사용자의 다양한 투자 전략을 충족시키기 위해 지정가 주문 또는 시장 가격 주문을 포함한 숫자와 가격.",
-        "dd7": "도움말 센터",
-        "ee1": "글로벌 순위",
-        "ee2": "사용자들은 우리를 신뢰합니다",
-        "ee3": "초저렴한 수수료",
-        "ee4": "국가",
-        "ee5": "지금 암호화폐 투자를 시작하세요",
-        "ee6": "그래픽 검증"
+        "bb4": "",
+        "bb5": "",
+        "bb6": "",
+        "bb7": "",
+        "bb8": "",
+        "bb9": "",
+        "bb10": "",
+        "bb11": "",
+        "bb12": "",
+        "bb13": "",
+        "cc1": "",
+        "cc2": "",
+        "cc3": "",
+        "cc4": ""
+        
     }
 }
\ No newline at end of file
diff --git a/src/i18n/tw.json b/src/i18n/tw.json
index 43f51f4..7a8cc41 100644
--- a/src/i18n/tw.json
+++ b/src/i18n/tw.json
@@ -1083,53 +1083,32 @@
         "m4":"訂單取消"
     },
     "homeNewText": {
-        "aa1": "開啓你的加密貨幣投資",
-        "aa2": "安全、穩定、高效",
-        "aa3": "立即註冊",
+        "aa1": "XXX数货币交易所",
+        "aa2": "更快、更好、更强",
+        "aa3": "立即体验",
         "aa4": "立即開始交易",
+
         "aa5": "流行的加密貨幣",
         "aa6": "數位資產行情速遞",
         "aa7": "幣種",
         "bb1": "最新價（USD）",
         "bb2": "24h漲幅",
         "bb3": "24h成交量",
-        "bb4": "值得用戶信賴的加密貨幣交易所",
-        "bb5": "在AJcoin購買，交易100多種加密貨幣",
-        "bb6": "强大自主研發能力",
-        "bb7": "從0到1自主研發第三代交易系統",
-        "bb8": "打造卓越性能下的極緻交易體驗",
-        "bb9": "全球化佈局",
-        "bb10": "全球精英匯聚",
-        "bb11": "團隊分佈全球",
-        "bb12": "超級現貨",
-        "bb13": "獨家推出現貨成本價格功能",
-        "bb14": "打造合約級現貨交易體驗",
-        "bb15": "頂級安全保障",
-        "bb16": "風險控制",
-        "bb17": "雙重手段保障您的資產安全",
-        "bb18": "完善的風控體系",
-        "bb19": "雙價格強平保護機制",
-        "bb20": "降低用戶爆倉風險",
-        "bb21": "7*24小時服務",
-        "bb22": "1分鐘響應機制",
-        "bb23": "全天候服務全球用戶",
-        
-        "cc5": "隨處交易",
-        "cc8": "通過我們的應用程序和桌面客戶端隨時瞭解情況",
-        "cc6": "掃描二維碼",
-        "cc7": "下載 Android/IOS App",
-        "dd1": "獨特的交易經驗",
-        "dd2": "投資加密貨幣的突破性工具",
-        "dd3": "三大止盈止損功能",
-        "dd4": "AJcoin提供全部倉位止盈止損、部分倉位止盈止損、觸發價止盈止損三種模式，幫助用戶控制交易風險",
-        "dd5": "最多50個不同的止盈止損點位",
-        "dd6": "用戶可以在倉位、挂單中隨時設置止盈止損點位，靈活控制風險；同時支持針對同一倉位不同張數和價格設置多達50個止盈止損單，包括限價單或市價單，滿足用戶不同投資策略",
-        "dd7": "幫助中心",
-        "ee1": "Global  Ranking",
-        "ee2": "users trust us",
-        "ee3": "Ultra-Low Fees",
-        "ee4": "Countries",
-        "ee5": "立刻開啓你的加密貨幣投資",
-        "ee6": "圖形驗證"
+
+        "bb4": "数字货币交易，我们是专业的",
+        "bb5": "最低的手续费，最快捷的交易，强劲的API以及更多",
+        "bb6": "XXXAPP，创造无限可能",
+        "bb7": "初次交易？$5即可小试牛刀，XXX跟您一起步步登高",
+        "bb8": "下载扫描二维码",
+        "bb9": "您数字货币之旅的得力助手",
+        "bb10": "从数字货币交易体验到第一次购买NFT，XXX将助您轻松赚币",
+        "bb11": "走进XXX",
+        "bb12": "在我们世界级全球伙伴帮助下，了解XXX会是你最爱的数字货币交易APP",
+        "bb13": "常见问题",
+        "cc1": "XXX，随时随地交易",
+        "cc2": "立即交易",
+        "cc3": "扫码下载XXXAPP",
+        "cc4": "扫码下载APP"
+
     }
 }
diff --git a/src/views/home/index.vue b/src/views/home/index.vue
index f8c80c3..098586d 100644
--- a/src/views/home/index.vue
+++ b/src/views/home/index.vue
@@ -38,27 +38,8 @@
 
       <!-- 走马灯 -->
     </div>
-    <div style="display: none;">
-    <!-- <div class="marquee">
-      <div class="marquee-pargress d-flex">
-        <ul class="marquee-list d-flex" v-for="box in 4" :key="box">
-          <li class="item" v-for="item in homeList" :key="item.pair + '' + box">
-            <div class="price-info d-flex">
-              <div class="symbol" style="margin-right: 5px">
-                {{ item.pair }}
-              </div>
-              <div class="d-flex">
-                <span>{{ item.price }}</span>
-                <span :class="item.increase >= 0 ? 'increace' : 'decreace'">
-                  {{ item.increaseStr }}
-                </span>
-              </div>
-            </div>
-          </li>
-        </ul>
-      </div>
-    </div> -->
 
+    <div style="display: none;">
     <!-- 公告 -->
     <!-- <div class="notice container d-flex align-items-center">
         <div
@@ -358,19 +339,24 @@
     <div class="section illustration_area">
       <div class="left">
         <div class="title">{{ $t("homeNewText.aa1") }}</div>
-        <div class="title" style="margin-bottom: 75px;">{{ $t("homeNewText.aa2") }}</div>
+        <div class="title" style="margin-bottom: 42px;">{{ $t("homeNewText.aa2") }}</div>
         <router-link v-if="!isLogin" class="jump_btn" :to="{name:'signUp'}">
           {{ $t("homeNewText.aa3") }}
         </router-link>
         <router-link v-else class="jump_btn" :to="{name:'exchange'}">
           {{ $t("homeNewText.aa4") }}
         </router-link>
+        <div class="icon_box">
+          <img src="../../assets/img/home/illustration_2.png" alt="" style="width: 148px;">
+          <img src="../../assets/img/home/illustration_3.png" alt="" style="width: 215px;">
+          <img src="../../assets/img/home/illustration_4.png" alt="" style="width: 80px;">
+        </div>
       </div>
       <div class="right">
-        <img src="../../assets/img/illustration_1.png" alt="" style="width: 520px;height: 520px;">
+        <img src="../../assets/img/home/illustration_1.png" alt="" style="width: 293px;height: 626px;border: 1px solid #fff;">
       </div>
     </div>
-    <div class="market_table" v-if="marketList[0]">
+    <div class="market_table" v-if="marketList[0] && 0">
       <div style="font-size: 40px;font-weight: bold;width: 1200px;margin: auto;">{{ $t("homeNewText.aa5") }}</div>
       <div style="width: 1200px;font-size: 20px;color: #707275;margin: 20px auto;">{{ $t("homeNewText.aa6") }}</div>
       <div class="market_tr" style="color: #999;line-height: 60px;">
@@ -390,61 +376,92 @@
         
       </div>
     </div>
-
-    <!-- 适合所有人的加密货币交易所 -->
-    <div style="width: 1200px;font-size: 40px;font-weight: bold;margin: 0px auto;">{{ $t("homeNewText.bb4") }}</div>
-    <div style="width: 1200px;font-size: 20px;color: #707275;margin: 20px auto 50px;">{{ $t("homeNewText.bb5") }}</div>
-    <div class="card_area">
-      <div class="card_item">
-        <img src="../../assets/img/features/4.png" alt="">
-        <div style="font-size: 20px;color: #e7e7e7;margin-bottom:10px;">{{ $t("homeNewText.bb6") }}</div>
-        <div style="font-size: 14px;color: #707275;">{{ $t("homeNewText.bb7") }}</div>
-        <div style="font-size: 14px;color: #707275;">{{ $t("homeNewText.bb8") }}</div>
-      </div>
-      <div class="card_item">
-        <img src="../../assets/img/features/5.png" alt="">
-        <div style="font-size: 20px;color: #e7e7e7;margin-bottom:10px;">{{ $t("homeNewText.bb9") }}</div>
-        <div style="font-size: 14px;color: #707275;">{{ $t("homeNewText.bb10") }}</div>
-        <div style="font-size: 14px;color: #707275;">{{ $t("homeNewText.bb11") }}</div>
-      </div>
-      <div class="card_item">
-        <img src="../../assets/img/features/2.png" alt="">
-        <div style="font-size: 20px;color: #e7e7e7;margin-bottom:10px;">{{ $t("homeNewText.bb12") }}</div>
-        <div style="font-size: 14px;color: #707275;">{{ $t("homeNewText.bb13") }}</div>
-        <div style="font-size: 14px;color: #707275;">{{ $t("homeNewText.bb14") }}</div>
-      </div>
-      <div class="card_item">
-        <img src="../../assets/img/features/6.png" alt="">
-        <div style="font-size: 20px;color: #e7e7e7;margin-bottom:10px;">{{ $t("homeNewText.bb15") }}</div>
-        <div style="font-size: 14px;color: #707275;">{{ $t("homeNewText.bb16") }}</div>
-        <div style="font-size: 14px;color: #707275;">{{ $t("homeNewText.bb17") }}</div>
-      </div>
-      <div class="card_item">
-        <img src="../../assets/img/features/1.png" alt="">
-        <div style="font-size: 20px;color: #e7e7e7;margin-bottom:10px;">{{ $t("homeNewText.bb18") }}</div>
-        <div style="font-size: 14px;color: #707275;">{{ $t("homeNewText.bb19") }}</div>
-        <div style="font-size: 14px;color: #707275;">{{ $t("homeNewText.bb20") }}</div>
+    <div class="marquee" v-if="marketList[0]">
+      <div class="marquee-pargress d-flex">
+        <ul class="marquee-list d-flex" v-for="box in 4" :key="box+'box'">
+          <!-- <li class="item" v-for="item in homeList" :key="item.pair + '' + box"> -->
+          <li class="item" v-for="item in marketList[0].marketInfoList" :key="item.coin_name + '' + box">
+            <div class="price-info d-flex">
+              <div class="symbol" style="margin-right: 5px">
+                <!-- {{ item.pair }} -->
+                {{ item.coin_name }}
+              </div>
+              <div class="d-flex">
+                <span>${{ item.price||item.close }}</span>
+                <span :class="item.increase >= 0 ? 'increace' : 'decreace'">
+                  ({{ item.increaseStr }})
+                </span>
+              </div>
+            </div>
+          </li>
+        </ul>
       </div>
-      <div class="card_item">
-        <img src="../../assets/img/features/3.png" alt="">
-        <div style="font-size: 20px;color: #e7e7e7;margin-bottom:10px;">{{ $t("homeNewText.bb21") }}</div>
-        <div style="font-size: 14px;color: #707275;">{{ $t("homeNewText.bb22") }}</div>
-        <div style="font-size: 14px;color: #707275;">{{ $t("homeNewText.bb23") }}</div>
+    </div>
+
+    <!-- 数字货币交易 -->
+    <div class="title1 fn-center">{{ $t("homeNewText.bb4") }}</div>
+    <div class="title2 fn-center">{{ $t("homeNewText.bb5") }}</div>
+    <div class="web_area">
+      <img src="" alt="" style="width: 100%;height: 100%;">
+    </div>
+    <div class="APP_area">
+      <img src="" alt="" class="left">
+      <div>
+        <div style="width: 500px;font-size: 48px;line-height: 72px;">{{ $t("homeNewText.bb6") }}</div>
+        <div class="d-flex application">
+          <div class="app_icon">
+            <img src="../../assets/img/home/apple_1.png" alt="" class="icon">
+            <div>App Store</div>
+          </div>
+          <div class="app_icon">
+            <img src="../../assets/img/home/android_1.png" alt="" class="icon">
+            <div>Android</div>
+          </div>
+          <div class="app_icon">
+            <img src="../../assets/img/home/google_1.png" alt="" class="icon">
+            <div>Google Play</div>
+          </div>
+        </div>
+        <div style="color: #9a9a9a;font-size: 22px;">{{ $t("homeNewText.bb7") }}</div>
+        <img src="" alt="" style="width: 135px;height: 135px;margin: 23px 0px 10px;">
+        <div style="font-weight: bold;font-size: 22px;">{{ $t("homeNewText.bb8") }}</div>
       </div>
     </div>
 
+    <!-- 您数字货币之旅的得力助手 -->
+    <div class="title1 fn-center">{{ $t("homeNewText.bb9") }}</div>
+    <div class="title2 fn-center">{{ $t("homeNewText.bb10") }}</div>
+    <div class="travel_area">
+      <img src="../../assets/img/home/bg_2.png" alt="" style="width: 100%;height: 100%;">
+    </div>
+
+    <div class="title1">{{ $t("homeNewText.bb11") }}</div>
+    <div class="title2">{{ $t("homeNewText.bb12") }}</div>
+    <div class="learn_area">
+      <router-link :to="'/notice/'+helpList[0].id" class="learn_item">
+        <img src="../../assets/img/home/bg_3.png" alt="">
+      </router-link>
+      <router-link :to="'/notice/'+helpList[1].id" class="learn_item">
+        <img src="../../assets/img/home/bg_3.png" alt="">
+      </router-link>
+      <router-link :to="'/notice/'+helpList[2].id" class="learn_item">
+        <img src="../../assets/img/home/bg_3.png" alt="">
+      </router-link>
+      <!-- <div class="learn_item"><img src="../../assets/img/home/bg_3.png" alt=""></div>
+      <div class="learn_item"><img src="../../assets/img/home/bg_3.png" alt=""></div>
+      <div class="learn_item"><img src="../../assets/img/home/bg_3.png" alt=""></div> -->
+    </div>
+
     <!-- beginner's guide -->
-    <div style="width: 1200px;font-size: 40px;font-weight: 700;margin: 0px auto;">{{ $t("homeNewText.dd1") }}</div>
-    <div style="width: 1200px;font-size: 20px;color: #707275;margin: 0px auto;">{{ $t("homeNewText.dd2") }}</div>
-    <div class="lattest-news-section">
+    <div class="lattest-news-section" v-if="0">
       <div class="beginner service">
         <!-- 标题 -->
-        <div class="service-title" v-if="0">
+        <div class="service-title">
           <div
             class="text service-title-text1"
             style="font-size: 40px; font-weight: 700; line-height: 71px"
           >
-            {{ $t("homeNewText.dd1") }}
+            {{ '111' }}
           </div>
           <div class="dotfive d-flex">
             <div class="dotblue" v-for="item in 5" :key="item"></div>
@@ -465,10 +482,10 @@
               </div>
               <div class="text-box">
                 <div style="font-size: 28px;color: #e7e7e7;">
-                  {{ $t("homeNewText.dd3") }}
+                  {{ '111' }}
                 </div>
                 <div class="service-content-text1-info1 info" style="color: #707275;">
-                  {{ $t("homeNewText.dd4") }}
+                  {{ '111' }}
                 </div>
               </div>
             </div>
@@ -481,10 +498,10 @@
               </div>
               <div class="text-box">
                 <div style="font-size: 28px;color: #e7e7e7;">
-                  {{ $t("homeNewText.dd5") }}
+                  {{ '111' }}
                 </div>
                 <div class="service-content-text1-info1 info" style="color: #707275;">
-                  {{ $t("homeNewText.dd6") }}
+                  {{ '111' }}
                 </div>
               </div>
             </div>
@@ -502,7 +519,7 @@
         </div>
 
         <!-- colto-btn-group -->
-        <div v-if="0"
+        <div
           class="colto-btn-group"
           style="justify-content: center"
         >
@@ -521,7 +538,7 @@
             >{{ $t("common.register") }}
           </router-link>
         </div>
-        <div v-if="0" class="colto-btn-group">
+        <div class="colto-btn-group">
           <router-link
             tag="button"
             to="/exchange"
@@ -533,37 +550,7 @@
     </div>
 
     <!-- 背景径向渐变 -->
-    <div class="radial_bg">
-      <!-- 隨處交易 -->
-      <div style="width: 1200px;font-size: 40px;font-weight: bold;margin: 0px auto;">{{ $t("homeNewText.cc5") }}</div>
-      <div style="width: 1200px;font-size: 20px;color: #707275;margin: 0px auto;">{{ $t("homeNewText.cc8") }}</div>
-      <div class="build-box">
-        <div class="build-bottom d-flex">
-          <div class="build-left">
-            <div style="display: flex;margin: 114px auto 66px;">
-              <img src="../../assets/img/features/code.png" alt="" style="width: 135px;height: 135px;background-color: #000;margin-right: 33px;">
-              <div>
-                <div style="font-size: 22px;margin: 30px 0px 10px 0px;">{{ $t("homeNewText.cc6") }}</div>
-                <div style="color: #908F94;font-size: 18px;">{{ $t("homeNewText.cc7") }}</div>
-              </div>
-            </div>
-            <div style="display: flex;justify-content: space-between;padding: 0px 23px 0px 10px;">
-              <div><img src="../../assets/img/features/apple_1.png" alt=""></div>
-              <div style="margin-right: 5px;"><img src="../../assets/img/features/android_1.png" alt=""></div>
-              <div><img src="../../assets/img/features/google_1.png" alt=""></div>
-            </div>
-            <div style="display: flex;justify-content: space-between;margin-top: 12px;">
-              <div>App Store</div>
-              <div>Android</div>
-              <div>Google Play</div>
-            </div>
-          </div>
-          <!-- phone module -->
-          <div class="build-right">
-            <img src="../../assets/img/features/aj.png" alt="mobile application" />
-          </div>
-        </div>
-      </div>
+    <div class="radial_bg" v-if="0">
       <!-- number count -->
       <div class="num-info d-flex">
         <div class="num-info-count">
@@ -749,25 +736,15 @@
       </div>
     </div>
     
-    <!-- 幫助中心 -->
-    <div style="font-size: 42px;font-weight: bold;text-align: center;" v-if="0">{{ $t("homeNewText.dd7") }}</div>
-    <div class="help_area" v-if="0">
-      <router-link :to="'/notice/'+item.id" v-for="(item, index) in helpList" :key="index" class="help_item">
-        <div>{{ item.title }}</div>
+    <!-- 常见问题 -->
+    <div class="title1 fn-center">{{ $t("homeNewText.bb13") }}</div>
+    <div class="help_area">
+      <router-link :to="'/notice/'+item.id" v-for="(item, index) in helpList" :key="index+'help'" class="help_item">
+        <div style="color: #fff;">{{ item.title }}</div>
         <div class="arrow"></div>
       </router-link>
     </div>
-    <div style="padding-top: 30px;">
-      <div style="font-weight: bold;font-size: 40px;text-align: center;">{{ $t("homeNewText.ee5") }}</div>
-      <div style="margin: 20px auto 0px;display: flex;justify-content: center;">
-        <router-link v-if="!isLogin" class="jump_btn" :to="{name:'signUp'}">
-          {{ $t("homeNewText.aa3") }}
-        </router-link>
-        <router-link v-else class="jump_btn" :to="{name:'exchange-assets'}">
-          {{ $t("homeNewText.aa4") }}
-        </router-link>
-      </div>
-    </div>
+    
   </div>
 </template>
 
@@ -1144,7 +1121,7 @@ export default {
   <style lang="scss" scoped>
 #dowebok {
   // background: rgb(18, 19, 24) !important;
-  background-color: #000117 !important;
+  background-color: #000 !important;
   padding-bottom: 100px;
   .el_carousel {
     width: 100%;
@@ -1203,7 +1180,7 @@ path {
 }
 
 .section {
-  background-color: #221F28;
+  background-color: #000;
   //background-image:url(../../assets/img/index_banner_2.png);
   width: 100%;
   height: 660px;
@@ -1219,30 +1196,37 @@ path {
   }
 }
 .illustration_area{
+  width: 1200px;
+  margin: 133px auto 133px;
   display: flex;
-  justify-content: center;
+  justify-content: space-between;
   align-items: center;
-  background: #0D0D0D;
   .left{
     color: #fff;
-    margin-right: 120px;
 
     .title{
-      font-size: 56px;
-      width: 560px;
+      font-size: 60px;
+    }
+    .icon_box{
+      display: flex;justify-content: space-between;
+      align-items: center;
+      margin-top: 168px;
+
+      img{
+        margin-right: 57px;
+      }
     }
-    
   }
 }
 .jump_btn{
   display: inline-block;
   min-width: 200px;
-  height: 60px;
-  line-height: 60px;
+  height: 78px;
+  line-height: 78px;
   text-align: center;
-  color: #fff;
-  background-color: #D1712E;
-  border-radius: 10px;
+  color: #101010;
+  background-color: #fff;
+  border-radius: 50px;
   font-size: 20px;
   padding: 0px 20px;
   box-sizing: border-box;
@@ -1389,12 +1373,18 @@ path {
 .marquee {
   width: 100%;
   height: 60px;
+  margin-bottom: 150px;
+  background-image: url("../../assets/img/home/bg_1.png");
+  background-size: 100% 100%;
   .marquee-pargress {
     align-items: center;
     width: 100%;
     height: 60px;
     //   background: ("../../assets/img/bg/5.png") no-repeat !important;
-    background-size: 100% 100%;
+    // background-size: 100% 100%;
+  }
+  .marquee-list{
+    background: transparent;
   }
 
   li.item {
@@ -1623,37 +1613,6 @@ path {
   padding: 240px 0px 70px;
   margin-top: -80px;
 }
-//builed
-.build-box {
-  width: 100%;
-  text-align: center;
-  color: white;
-  margin-top: 50px;
-  .build-bottom {
-    justify-content: center;
-    .text-start {
-      text-align: start;
-    }
-    .build-left {
-      text-align: left;
-      margin-right: 45px;
-      width: 400px;
-
-      img{
-        width: 40px;
-        height: 40px;
-      }
-    }
-    .build-right {
-      width: 752px;
-      height: 506px;
-      .build-right img {
-        width: 100%;
-        height: 100%;
-      }
-    }
-  }
-}
 
 //banner-bottom
 .banner-bottom {
@@ -2108,52 +2067,87 @@ path {
 
 .help_area{
   width: 1200px;
-  // height: 500px;
-  margin: 50px auto 0px;
-  border-radius: 10px;
-  background-color: #312B3B;
-  font-size: 24px;
-  box-sizing: border-box;
-  padding: 20px 40px;
+  margin: 0px auto;
+  font-size: 34px;
 
   .help_item{
-    height: 90px;
+    height: 188px;
     display: flex;
     justify-content: space-between;
     align-items: center;
-    border-bottom: 1px solid #282828;
-  }
-  .help_item:nth-last-child(1){
-    border-bottom: none;
+    border-bottom: 1px solid #FEFEFE;
   }
 
   .arrow{
-    width: 24px;
-    height: 24px;
-    background-image: url("../../assets/img/arrow.png");
+    width: 60px;
+    height: 60px;
+    background-image: url("../../assets/img/home/plus.png");
     background-size: cover;
   }
 }
 
-.card_area{
-  // height: 164px;
-  width: 1200px;display: flex;justify-content: space-between;
-  margin: 50px auto 100px;
-  flex-wrap: wrap;
-  .card_item{
-    width: 366px;
-    border-radius: 10px;
-    // height: 100%;
-    box-sizing: border-box;
-    padding: 36px;
-    background-color: #1B1B1B;
-    margin-bottom: 50px;
+.title1{
+  width: 1200px;margin: 0px auto;
+  font-size: 48px;font-weight: bold;
+  color: #fff;
+}
+.title2{
+  width: 1200px;margin: 20px auto 100px;
+  font-size: 22px;color: #9a9a9a;
+}
+.web_area{
+  width: 1200px;
+  height: 717px;
+  margin: 0px auto 150px;
+}
+.APP_area{
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  margin: 0px auto 150px;
+  .left{
+    width: 304px;
+    height: 674px;
+    border: 1px solid #fff;
+    margin-right: 136px;
+  }
+  .application{
+    width: 500px;height: 82px;
+    border: 1px solid #fafafa;
+    border-radius: 100px;
+    margin: 17px 0px 27px;
+    color: #908F94;
+    font-size: 16px;
+    justify-content: space-around;
+    align-items: center;
 
+    .app_icon{
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+    }
+    .icon{
+      width: 40px;height: 40px;
+    }
+  }
+}
+.travel_area{
+  width: 1200px;
+  height: 322px;
+  margin: 0px auto 150px;
+}
+.learn_area{
+  width: 1200px;
+  height: 202px;
+  margin: 0px auto 123px;
+  display: flex;
+  justify-content: space-between;
+  .learn_item{
+    width: 380px;
+    height: 202px;
+    border-radius: 10px;
     img{
-      width: 220px;
-      height: 220px;
-      margin-left: 37px;
-      margin-bottom: 47px;
+      width: 100%;height: 100%;
     }
   }
 }