style(subscribe): 适配移动端套餐列表

src/components/subscribe-plan-list/index.scss

@@ -738,19 +738,73 @@
     }
 
     .plan-grid-container {
-      justify-content: flex-start;
-      overflow-x: auto;
-      padding-bottom: 8px;
+      justify-content: center;
+      overflow-x: visible;
+      padding-bottom: 0;
     }
 
     .plan-grid {
-      grid-template-columns: repeat(4, 313px);
-      width: max-content;
-      justify-content: flex-start;
+      grid-template-columns: minmax(0, 1fr);
+      width: min(100%, 360px);
+      justify-content: center;
     }
 
     .plan_grid_item {
-      width: 313px;
+      width: 100%;
+    }
+  }
+}
+
+@media (max-width: 480px) {
+  .plans {
+    .plans__points-row {
+      margin-bottom: 36px;
+    }
+
+    .billing_cycle {
+      width: 100%;
+      height: 49px;
+      gap: 6px;
+    }
+
+    .billing_cycle__tab {
+      flex: 1 1 0;
+      width: auto;
+      min-width: 0;
+      height: 37px;
+    }
+
+    .billing_cycle__label {
+      font-size: 14px;
+    }
+
+    .plan-grid {
+      width: 100%;
+    }
+
+    .plan_item__header {
+      min-height: 0;
+      padding: 18px;
+      border-radius: 22px;
+    }
+
+    .plan_item__features {
+      padding-right: 18px;
+      padding-left: 18px;
+      border-radius: 22px;
+    }
+
+    .plan_item__highlight-frame,
+    .plan_item__highlight-content {
+      border-radius: 22px;
+    }
+
+    .plan_item__highlight-label {
+      border-radius: 21px 21px 0 0;
+    }
+
+    .plan_points {
+      width: 100%;
     }
   }
-}
+}