diff --git a/src/chain/blockchain.ts b/src/chain/blockchain.ts
index 442e281..de42e76 100644
--- a/src/chain/blockchain.ts
+++ b/src/chain/blockchain.ts
@@ -148,7 +148,11 @@ export class Blockchain {
 
   public async connect(isManual = false) {
     if (isMobile()) {
-      this.walletType = 2
+      if (hasMetamask()) {
+        this.walletType = 1
+      } else {
+        this.walletType = 2
+      }
     } else {
       if (hasMetamask()) {
         if (isManual && !this.walletType) {
diff --git a/src/components/core/ChainModal.vue b/src/components/core/ChainModal.vue
index c2e30cf..68f3417 100644
--- a/src/components/core/ChainModal.vue
+++ b/src/components/core/ChainModal.vue
@@ -1,7 +1,7 @@
 <template>
-  <div class="chain-modal" v-if="modalShow">
+  <div class="chain-modal" v-if="modalShow" :class="{'mobile': mobile}">
     <div class="modal-bg" @click="cancelSelect"></div>
-    <div class="modal-content">
+    <div class="modal-content" :class="{'mobile': mobile}">
       <div class="modal-title">
         You need to connect to supported network
       </div>
@@ -24,6 +24,7 @@ import { Component, Vue } from 'vue-property-decorator'
 import { EventBus, NEED_CHANGE_CHAIN, SHOW_CHAIN_MODAL } from '@/utils/event-bus'
 import ChainManager from '@/chain/ChainManager'
 import { ALL_PROVIDERS } from '@/configs/config_chain'
+import { AppModule, DeviceType } from '@/store/modules/app'
 
 @Component({
   name: 'ChainModal',
@@ -41,6 +42,10 @@ export default class ChainModal extends Vue {
     return [...new ChainManager().availableChains.values()]
   }
 
+  get mobile() {
+    return AppModule.device === DeviceType.Mobile
+  }
+
   get currentDatas() {
     if (this.dataType === 0) {
       return ALL_PROVIDERS
@@ -128,6 +133,9 @@ export default class ChainModal extends Vue {
     margin: auto;
     display: flex;
     flex-direction: column;
+    &.mobile{
+      width: 100vw;
+    }
     .modal-title{
       background-color: rgb(255, 255, 255);
       color: black;
diff --git a/src/components/index/DesktopFooter.vue b/src/components/index/DesktopFooter.vue
index 9061878..49428c1 100644
--- a/src/components/index/DesktopFooter.vue
+++ b/src/components/index/DesktopFooter.vue
@@ -46,20 +46,16 @@
     </div>
     <div class="copy-right">
       Copyright &copy; CEBG. All rights reserved.
-      <chain-modal></chain-modal>
     </div>
   </footer>
 </template>
 
 <script lang="ts">
 import { Component, Vue } from 'vue-property-decorator'
-import ChainModal from '@/components/core/ChainModal.vue'
 
 @Component({
   name: 'DesktopFooter',
   components: {
-    ChainModal
-
   }
 })
 export default class extends Vue {
diff --git a/src/components/layout/BaseFooter.vue b/src/components/layout/BaseFooter.vue
index 1028383..b87e991 100644
--- a/src/components/layout/BaseFooter.vue
+++ b/src/components/layout/BaseFooter.vue
@@ -2,6 +2,7 @@
   <div class="">
     <desktop-footer v-if="!mobile" :class="{'resize': autoSize}" ></desktop-footer>
     <mobile-footer v-if="mobile"></mobile-footer>
+    <chain-modal></chain-modal>
   </div>
 </template>
 <script lang="ts">
@@ -9,10 +10,12 @@ import { Component, Vue, Prop } from 'vue-property-decorator'
 import { AppModule, DeviceType } from '@/store/modules/app'
 import DesktopFooter from '@/components/index/DesktopFooter.vue'
 import MobileFooter from '@/components/mobile/main/MobileFooter.vue'
+import ChainModal from '@/components/core/ChainModal.vue'
 
 @Component({
   name: 'Footer',
   components: {
+    ChainModal,
     MobileFooter,
     DesktopFooter
   }
diff --git a/src/configs/config_chain.ts b/src/configs/config_chain.ts
index 7b8242e..1a20166 100644
--- a/src/configs/config_chain.ts
+++ b/src/configs/config_chain.ts
@@ -25,7 +25,7 @@ export const ALL_PROVIDERS = [
   }
 ]
 
-export const AVAILABLE_CHAINS = env === 'production' ? [321] : [322, 97]
+export const AVAILABLE_CHAINS = env === 'production' ? [321] : [322]
 
 export const OFFICE_ACCOUNT = env === 'production'
   ? '0x565edA4ef351EB78F03B8AfCb6dCF02E29cAD62e'
diff --git a/src/views/mobile/Gameplay.vue b/src/views/mobile/Gameplay.vue
index a200c84..2d3178e 100644
--- a/src/views/mobile/Gameplay.vue
+++ b/src/views/mobile/Gameplay.vue
@@ -3,7 +3,7 @@
     <mobile-header current-section="gameplay"></mobile-header>
     <video-section></video-section>
     <data-cell v-for="data in currentCell" :key="data.title" :data="data"></data-cell>
-    <mobile-footer></mobile-footer>
+    <base-footer></base-footer>
   </div>
 </template>
 
@@ -14,11 +14,12 @@ import { ITabData } from '@/components/tokenomic/TabBar.vue'
 import DataCell from '@/components/gameplay/DataCell.vue'
 import MobileHeader from '@/components/mobile/main/MobileHeader.vue'
 import MobileFooter from '@/components/mobile/main/MobileFooter.vue'
+import BaseFooter from '@/components/layout/BaseFooter.vue'
 
 @Component({
   name: 'MobileGameplay',
   components: {
-    MobileFooter,
+    BaseFooter,
     MobileHeader,
     DataCell,
     VideoSection
diff --git a/src/views/mobile/Index.vue b/src/views/mobile/Index.vue
index d381a53..3b0650f 100644
--- a/src/views/mobile/Index.vue
+++ b/src/views/mobile/Index.vue
@@ -6,7 +6,7 @@
     <hero-section></hero-section>
     <investors-section></investors-section>
     <partner-section></partner-section>
-    <mobile-footer></mobile-footer>
+    <base-footer></base-footer>
   </div>
 </template>
 <script lang="ts">
@@ -18,10 +18,12 @@ import HeroSection from '@/components/index/HeroSection.vue'
 import InvestorsSection from '@/components/index/InvestorsSection.vue'
 import MobileFooter from '@/components/mobile/main/MobileFooter.vue'
 import PartnerSection from '@/components/index/PartnerSection.vue'
+import BaseFooter from '@/components/layout/BaseFooter.vue'
 
 @Component({
   name: 'MobileIndex',
   components: {
+    BaseFooter,
     PartnerSection,
     MobileFooter,
     InvestorsSection,
diff --git a/src/views/mobile/NFT.vue b/src/views/mobile/NFT.vue
index 310a67e..3dbf389 100644
--- a/src/views/mobile/NFT.vue
+++ b/src/views/mobile/NFT.vue
@@ -5,7 +5,7 @@
     <nft-section @dialog-show="showInfo(0)" ></nft-section>
     <weapon-section @dialog-show="showInfo(1)"></weapon-section>
     <chip-section @dialog-show="showInfo(2)"></chip-section>
-    <mobile-footer></mobile-footer>
+    <base-footer></base-footer>
     <nft-info :dialog-show="infoShow" :type="infoType" @dialog-show="infoShowStatusChange"></nft-info>
   </div>
 </template>
@@ -19,10 +19,12 @@ import ChipSection from '@/components/nft/ChipSection.vue'
 import NftInfo from '@/components/nft/NftInfo.vue'
 import MobileHeader from '@/components/mobile/main/MobileHeader.vue'
 import MobileFooter from '@/components/mobile/main/MobileFooter.vue'
+import BaseFooter from '@/components/layout/BaseFooter.vue'
 
 @Component({
   name: 'MobileNft',
   components: {
+    BaseFooter,
     MobileFooter,
     MobileHeader,
     NftInfo,
diff --git a/src/views/mobile/Roadmap.vue b/src/views/mobile/Roadmap.vue
index bd9a1d8..35d560a 100644
--- a/src/views/mobile/Roadmap.vue
+++ b/src/views/mobile/Roadmap.vue
@@ -7,7 +7,7 @@
       </div>
       <progress-map></progress-map>
     </div>
-    <mobile-footer></mobile-footer>
+    <base-footer></base-footer>
   </div>
 </template>
 
@@ -16,10 +16,12 @@ import { Component, Vue } from 'vue-property-decorator'
 import ProgressMap from '@/components/roadmap/ProgressMap.vue'
 import MobileFooter from '@/components/mobile/main/MobileFooter.vue'
 import MobileHeader from '@/components/mobile/main/MobileHeader.vue'
+import BaseFooter from '@/components/layout/BaseFooter.vue'
 
 @Component({
   name: 'MobileRoadmap',
   components: {
+    BaseFooter,
     MobileHeader,
     MobileFooter,
     ProgressMap
diff --git a/src/views/mobile/Team.vue b/src/views/mobile/Team.vue
index a7a6d23..c879967 100644
--- a/src/views/mobile/Team.vue
+++ b/src/views/mobile/Team.vue
@@ -15,7 +15,7 @@
         <advisor-member v-for="(d, i) in advisors" :data="d" :key="i"></advisor-member>
       </div>
     </div>
-    <mobile-footer></mobile-footer>
+    <base-footer></base-footer>
   </div>
 </template>
 
@@ -27,10 +27,12 @@ import TeamMember from '@/components/team/Member.vue'
 import MobileHeader from '@/components/mobile/main/MobileHeader.vue'
 import MobileFooter from '@/components/mobile/main/MobileFooter.vue'
 import AdvisorMember from '@/components/team/AdvisorMember.vue'
+import BaseFooter from '@/components/layout/BaseFooter.vue'
 
 @Component({
   name: 'MobileTeam',
   components: {
+    BaseFooter,
     AdvisorMember,
     MobileFooter,
     MobileHeader,
diff --git a/src/views/mobile/Tokenomic.vue b/src/views/mobile/Tokenomic.vue
index 9c27a43..28da50b 100644
--- a/src/views/mobile/Tokenomic.vue
+++ b/src/views/mobile/Tokenomic.vue
@@ -10,7 +10,7 @@
     <tab-cec v-show="activeTab==='cec'"></tab-cec>
     <tab-ceg v-show="activeTab==='ceg'"></tab-ceg>
     <tab-allocation v-show="activeTab==='allocation'" ></tab-allocation>
-    <mobile-footer></mobile-footer>
+    <base-footer></base-footer>
   </div>
 </template>
 
@@ -25,10 +25,12 @@ import TabAllocation from '@/components/tokenomic/TabAllocation.vue'
 import MobileHeader from '@/components/mobile/main/MobileHeader.vue'
 import MobileFooter from '@/components/mobile/main/MobileFooter.vue'
 import { AppModule, DeviceType } from '@/store/modules/app'
+import BaseFooter from '@/components/layout/BaseFooter.vue'
 
 @Component({
   name: 'MobileTokenomic',
   components: {
+    BaseFooter,
     MobileFooter,
     MobileHeader,
     TabAllocation,