fix: add responsive margins to banner swiper arrows

Arrow styling:
- Size: 50px × 50px (larger, easier to click)
- Color: white with blue hover effect (#1e73be)
- Hover animation: scale(1.1) + color transition

Responsive positioning:
- Desktop (> 1200px): 40px from edges (matches site padding)
- Tablet (768px - 1199px): 20px from edges
- Mobile (< 768px): Hidden (use swipe gesture)

Also fixed:
- Banner height: auto → 500px (consistent)
- Slide image: object-fit: cover (proper scaling)
- Slide dimensions: 100% × 100% (full coverage)

Co-authored-by: Qwen-Coder <qwen-coder@alibabacloud.com>

src/view/HomePage.vue

@@ -190,16 +190,61 @@ export default {
 
 #swiper .banner-swiper {
   width: 100%;
-  height: auto;
+  height: 500px;
+}
+
+#swiper .banner-swiper .swiper-slide {
+  width: 100%;
+  height: 100%;
 }
 
 #swiper .banner-swiper .swiper-slide img {
-  max-width: 100%;
-  background-size: cover;
+  width: 100%;
+  height: 100%;
+  object-fit: cover;
 }
 
-#swiper .banner-swiper .swiper-slide {
-  position: relative;
+/* Swiper 导航箭头 */
+#swiper .banner-swiper .swiper-button-prev,
+#swiper .banner-swiper .swiper-button-next {
+  color: #fff;
+  width: 50px;
+  height: 50px;
+  transition: all 0.3s ease;
+}
+
+#swiper .banner-swiper .swiper-button-prev:hover,
+#swiper .banner-swiper .swiper-button-next:hover {
+  color: #1e73be;
+  transform: scale(1.1);
+}
+
+/* 桌面端箭头边距 */
+@media (min-width: 1200px) {
+  #swiper .banner-swiper .swiper-button-prev {
+    left: 40px !important;
+  }
+  #swiper .banner-swiper .swiper-button-next {
+    right: 40px !important;
+  }
+}
+
+/* 平板端箭头边距 */
+@media (min-width: 768px) and (max-width: 1199px) {
+  #swiper .banner-swiper .swiper-button-prev {
+    left: 20px !important;
+  }
+  #swiper .banner-swiper .swiper-button-next {
+    right: 20px !important;
+  }
+}
+
+/* 移动端隐藏箭头 */
+@media (max-width: 767px) {
+  #swiper .banner-swiper .swiper-button-prev,
+  #swiper .banner-swiper .swiper-button-next {
+    display: none;
+  }
 }
 
 #swiper .banner-swiper .swiper-slide-title {