移动端适配

src/pages/contact-us/index.vue

@@ -27,12 +27,13 @@
 
 <style scoped lang="less">
 	.contact-us {
+		--bg-height: 514px;
 		> * {
 			position: relative;
 			z-index: 1;
 		}
 		> .bg {
-			height: 514px;
+			height: var(--bg-height);
 			width: 100%;
 			object-fit: cover;
 			position: fixed;
@@ -40,7 +41,7 @@
 			z-index: 0;
 		}
 		> .header {
-			height: 514px;
+			height: var(--bg-height);
 			display: flex;
 			align-items: center;
 			justify-content: center;
@@ -84,5 +85,22 @@
 				max-width: 860px;
 			}
 		}
+		@media (max-width: 800px) {
+			--bg-height: 239px;
+			> .header {
+				> h1 {
+					font-size: 40px;
+					margin-bottom: 20px;
+				}
+			}
+			> .contact {
+				> .iconfont {
+					font-size: 36px;
+				}
+			}
+			> .contact-input {
+				padding: 60px 20px;
+			}
+		}
 	}
 </style>