diff --git a/app/components/pages/about/LearnMoreCard.vue b/app/components/pages/about/LearnMoreCard.vue
index 49eb285..df119ce 100644
--- a/app/components/pages/about/LearnMoreCard.vue
+++ b/app/components/pages/about/LearnMoreCard.vue
@@ -90,4 +90,18 @@
   .icon {
     padding: 10px;
   }
+
+  @media (max-width: 768px) {
+    .learn-more-wrapper {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+      width: 100%;
+    }
+
+    .learn-more-card {
+      width: 80%;
+      min-width: 0;
+    }
+  }
 </style>
diff --git a/app/pages/about/index.vue b/app/pages/about/index.vue
index 37ce79a..ee510db 100644
--- a/app/pages/about/index.vue
+++ b/app/pages/about/index.vue
@@ -25,7 +25,7 @@
         <learn-more-card
           :title="$t('navigation.address')"
           :icon="ElIconMapLocation"
-          :href="getAutoMappedService"
+          :to="$localePath('/locate?lng=120.123&lat=30.231&name=xxx')"
         />
       </div>
     </div>
@@ -95,4 +95,12 @@
     align-items: center;
     margin-top: 1rem;
   }
+
+  @media (max-width: 768px) {
+    .button-group {
+      align-items: center;
+      margin-left: 0;
+      gap: 0.5rem;
+    }
+  }
 </style>
diff --git a/app/pages/locate.vue b/app/pages/locate.vue
new file mode 100644
index 0000000..79ad95e
--- /dev/null
+++ b/app/pages/locate.vue
@@ -0,0 +1,12 @@
+<template>
+  <div>redirecting...</div>
+</template>
+
+<script setup lang="ts">
+  onMounted(async () => {
+    const platform = await getAutoMappedService();
+
+    // // ✔ 移动端能正常跳转
+    window.location.href = platform;
+  });
+</script>