diff --git a/src/assets/img/home/banner-slogan.gif b/src/assets/img/home/banner-slogan.gif
index 706ce42..666680f 100644
Binary files a/src/assets/img/home/banner-slogan.gif and b/src/assets/img/home/banner-slogan.gif differ
diff --git a/src/assets/img/home/pvp-btn.png b/src/assets/img/home/pvp-btn.png
index d495912..ef36951 100644
Binary files a/src/assets/img/home/pvp-btn.png and b/src/assets/img/home/pvp-btn.png differ
diff --git a/src/components/about/IntroductionBanner.vue b/src/components/about/IntroductionBanner.vue
index 81f03a7..c7aea07 100644
--- a/src/components/about/IntroductionBanner.vue
+++ b/src/components/about/IntroductionBanner.vue
@@ -45,7 +45,7 @@
   .banner-boder {
     position: absolute;
     left: 0;
-    bottom: 0;
+    bottom: -1px;
   }
   .introduction-bg {
     position: absolute;
diff --git a/src/components/about/LatestNews.vue b/src/components/about/LatestNews.vue
index e23d761..cd0debb 100644
--- a/src/components/about/LatestNews.vue
+++ b/src/components/about/LatestNews.vue
@@ -147,8 +147,8 @@ function handleScroll() {
     font-size: 200px;
     font-family: "Big John";
     font-weight: 400;
-    color: #e6e6e6;
-    opacity: 0.3;
+    color: #eeeeee;
+    // opacity: 0.3;
     z-index: -1;
   }
   .latest-news-bg {
diff --git a/src/components/about/Roadmap.vue b/src/components/about/Roadmap.vue
index 013d5f7..7d687bb 100644
--- a/src/components/about/Roadmap.vue
+++ b/src/components/about/Roadmap.vue
@@ -15,11 +15,11 @@
       id="bgTest"
       :style="{ transform: 'translateY(' + -positionY1 + 'px)' }"
     >
-      The Team
+   Roadmap
     </div>
 
     <div class="content">
-      <div class="title">Roadmap</div>
+      <div class="content-title">Roadmap</div>
       <div class="title-boder">
         <img src="@/assets/img/about/roadmap-title-boder.png" alt="" />
       </div>
@@ -152,7 +152,7 @@ function handleScroll() {
   .history-bottom-boder {
     position: absolute;
     left: 0;
-    bottom: 0;
+    bottom: -1px;
     right: 0;
     width: 100%;
     height: 116px;
@@ -169,19 +169,20 @@ function handleScroll() {
     font-size: 210px;
     font-family: "Big John";
     font-weight: 400;
-    color: #173637;
-    opacity: 0.3;
+    color: #1e645e;
+    // opacity: 0.3;
     z-index: -1;
   }
   .content {
     width: 1440px;
     margin: 0 auto;
-    .title {
+    .content-title {
       padding-top: 110px;
       font-size: 48px;
       font-family: "Big John";
       font-weight: 400;
       color: #ffffff;
+      margin-left: 66px;
     }
     .title-boder {
       width: 695px;
diff --git a/src/components/about/VisionMission.vue b/src/components/about/VisionMission.vue
index 07762f3..9273442 100644
--- a/src/components/about/VisionMission.vue
+++ b/src/components/about/VisionMission.vue
@@ -112,7 +112,7 @@ function handleScroll() {
   .banner-boder {
     position: absolute;
     left: 0;
-    bottom: 0;
+    bottom: -1px;
   }
   .vision-title {
     position: absolute;
@@ -121,8 +121,8 @@ function handleScroll() {
     font-size: 210px;
     font-family: "Big John";
     font-weight: 400;
-    color: #e6e6e6;
-    opacity: 0.8;
+    color: #eeeeee;
+ 
     z-index: -1;
   }
   .vidion-bg {
diff --git a/src/components/about/Whitepaper.vue b/src/components/about/Whitepaper.vue
index 59723a0..3009e8e 100644
--- a/src/components/about/Whitepaper.vue
+++ b/src/components/about/Whitepaper.vue
@@ -51,8 +51,7 @@
   .whitepaper-bottom-boder {
     position: absolute;
     left: 0;
-
-    bottom: 0;
+    bottom: -10px;
     right: 0;
     width: 100%;
     height: 234px;
@@ -67,6 +66,7 @@
     margin: 0 auto;
     .title {
       font-size: 48px;
+      margin-left: 66px;
       font-family: "Big John";
       font-weight: 400;
       color: #ffffff;
diff --git a/src/components/home/Banner.vue b/src/components/home/Banner.vue
index d589960..9522b02 100644
--- a/src/components/home/Banner.vue
+++ b/src/components/home/Banner.vue
@@ -84,25 +84,27 @@ import Slogan from "./Slogan.vue";
   .posters {
     position: absolute;
     left: 50%;
-    bottom: 60px;
+    bottom: 40px;
     z-index: 9;
     margin-bottom: 12px;
     margin-top: 74px;
-    width: 10%;
+    width:15px;
+    height: 90px;
     transform: translate(-50%, -50%);
     display: flex;
     flex-direction: column;
     justify-content: center;
     .poster {
-      width: 100%;
-      height: 23px;
+      width: 15px;
+      height: 12px;
       background-image: url("@/assets/img/home/poster.png");
       background-repeat: no-repeat;
-      background-position: center 0;
+      background-position: center center;
       background-color: transparent;
-      background-size: auto;
+      background-size: contain;
       -webkit-animation-name: arrow;
       animation-name: arrow;
+      margin-bottom: 4px;
       -webkit-animation-duration: 1.5s;
       animation-duration: 1.5s;
       -webkit-animation-timing-function: linear;
@@ -116,12 +118,12 @@ import Slogan from "./Slogan.vue";
       animation-delay: 0s;
     }
     .poster-tow {
-      top: 12px;
+      top: 18px;
       -webkit-animation-delay: 0.5s;
       animation-delay: 0.5s;
     }
     .poster-there {
-      top: 24px;
+      top: 64px;
       -webkit-animation-delay: 1s;
       animation-delay: 1s;
     }
@@ -149,7 +151,7 @@ import Slogan from "./Slogan.vue";
     width: 100%;
     z-index: 3;
     position: absolute;
-    bottom: 0;
+    bottom: -1px;
     img {
       width: 100%;
       height: auto;
diff --git a/src/components/home/GameGallerp.vue b/src/components/home/GameGallerp.vue
index 2c3a1a2..8eb1c77 100644
--- a/src/components/home/GameGallerp.vue
+++ b/src/components/home/GameGallerp.vue
@@ -118,7 +118,7 @@ function handleScroll() {
   }
   .gallerp-bottom-boder {
     position: absolute;
-    bottom: 0;
+    bottom: -1px;
     width: 100%;
     // height: 100%;
     img {
@@ -133,7 +133,7 @@ function handleScroll() {
     text-align: center;
     font-size: 190px;
     font-family: "Big John";
-    color: #e09162;
+    color: #ec7f64;
     line-height: 30px;
     // opacity: 0.3;
     z-index: 1;
diff --git a/src/components/home/HeroSwiper.vue b/src/components/home/HeroSwiper.vue
index dd6a23f..506a053 100644
--- a/src/components/home/HeroSwiper.vue
+++ b/src/components/home/HeroSwiper.vue
@@ -15,7 +15,6 @@
             </div>
           </XyzTransitionGroup>
         </div>
-
         <div><img src="" alt="" /></div>
       </div>
       <div class="hero-right">
diff --git a/src/components/home/TabBar.vue b/src/components/home/TabBar.vue
index cc511a9..1ee731e 100644
--- a/src/components/home/TabBar.vue
+++ b/src/components/home/TabBar.vue
@@ -45,7 +45,7 @@ function handactiveTab(index) {
   flex-direction: column;
   background: none;
   font-family: "Big John";
-  color: #000101;
+  color: #0f6569;
   text-transform: uppercase;
   font-size: 16px;
   font-weight: bold;
diff --git a/src/components/home/WhatCebg.vue b/src/components/home/WhatCebg.vue
index 70ddb80..9709361 100644
--- a/src/components/home/WhatCebg.vue
+++ b/src/components/home/WhatCebg.vue
@@ -174,7 +174,7 @@ function handleScroll() {
     z-index: 1;
     font-size: 180px;
     font-family: "Big John";
-    color: #327AA7;
+    color: #309699;
     line-height: 30px;
      opacity: 0.8;
     -webkit-user-select: none;