|
|
@@ -2,10 +2,20 @@
|
|
|
h2,
|
|
|
h3,
|
|
|
h4,
|
|
|
-h5 {
|
|
|
+h5,
|
|
|
+p {
|
|
|
margin: 0;
|
|
|
padding: 0;
|
|
|
}
|
|
|
+.font72 {
|
|
|
+ font-size: 3.75vw;
|
|
|
+}
|
|
|
+.font60 {
|
|
|
+ font-size: 3.125vw;
|
|
|
+}
|
|
|
+.font24 {
|
|
|
+ font-size: 1.25vw;
|
|
|
+}
|
|
|
.index-page {
|
|
|
width: 100%;
|
|
|
}
|
|
|
@@ -13,9 +23,19 @@ h5 {
|
|
|
position: relative;
|
|
|
width: 100%;
|
|
|
height: 42.135vw;
|
|
|
- background: url('../images//index/banner.png') no-repeat;
|
|
|
+ background: url('../../images/home/banner.png') no-repeat;
|
|
|
background-size: 100% 100%;
|
|
|
z-index: 3;
|
|
|
+ display: flex;
|
|
|
+ flex-direction: column;
|
|
|
+ justify-content: center;
|
|
|
+ align-items: center;
|
|
|
+ color: #ffffff;
|
|
|
+}
|
|
|
+
|
|
|
+.index-page .banner p {
|
|
|
+ margin-bottom: 0.76vw;
|
|
|
+ letter-spacing: -1.5px;
|
|
|
}
|
|
|
|
|
|
.index-page .getApp {
|
|
|
@@ -23,21 +43,21 @@ h5 {
|
|
|
width: 100%;
|
|
|
height: 41.67vw;
|
|
|
margin-top: -5.73vw;
|
|
|
- background: url('../images//index/getApp.png') no-repeat;
|
|
|
+ background: url('../../images/home/getApp.png') no-repeat;
|
|
|
background-size: 100% 100%;
|
|
|
}
|
|
|
|
|
|
.index-page .getApp .where {
|
|
|
padding-top: 14.58vw;
|
|
|
margin-left: 12.5vw;
|
|
|
- font-size: 60px;
|
|
|
+ font-size: 3.125vw;
|
|
|
color: #242a30;
|
|
|
}
|
|
|
|
|
|
.index-page .getApp .answer {
|
|
|
margin-top: 1.18vw;
|
|
|
margin-left: 12.5vw;
|
|
|
- font-size: 24px;
|
|
|
+ font-size: 1.25vw;
|
|
|
color: #959799;
|
|
|
}
|
|
|
|
|
|
@@ -80,7 +100,7 @@ h5 {
|
|
|
|
|
|
.index-page .take-out .food-answer {
|
|
|
text-align: center;
|
|
|
- font-size: 24px;
|
|
|
+ font-size: 1.25vw;
|
|
|
color: #242a30;
|
|
|
margin-top: 1.18vw;
|
|
|
}
|
|
|
@@ -137,23 +157,25 @@ h5 {
|
|
|
}
|
|
|
|
|
|
.index-page .take-out .take-out-body .take-out-title {
|
|
|
- font-size: 72px;
|
|
|
+ font-size: 3.75vw;
|
|
|
text-shadow: 13.5px 23.38px 54px 0px rgba(3, 3, 3, 0.38);
|
|
|
font-weight: 500;
|
|
|
}
|
|
|
|
|
|
.index-page .take-out .take-out-body .about {
|
|
|
- font-size: 24px;
|
|
|
+ font-size: 1.25vw;
|
|
|
font-weight: 500;
|
|
|
width: 15.208vw;
|
|
|
letter-spacing: -0.6px;
|
|
|
text-shadow: 13.5px 23.38px 54px 0px rgba(3, 3, 3, 0.38);
|
|
|
+ margin-bottom: 1.82vw;
|
|
|
}
|
|
|
|
|
|
.index-page .take-out .take-out-body p {
|
|
|
font-size: 16px;
|
|
|
font-weight: 400;
|
|
|
letter-spacing: -0.4px;
|
|
|
+ margin-bottom: 2.19vw;
|
|
|
}
|
|
|
|
|
|
.index-page .take-out .take-out-body .toway {
|
|
|
@@ -164,12 +186,12 @@ h5 {
|
|
|
.index-page .map {
|
|
|
width: 100%;
|
|
|
height: 56.25vw;
|
|
|
- background: url('../images/index/map.png') no-repeat;
|
|
|
+ background: url('../../images/home/map.png') no-repeat;
|
|
|
background-size: 100% 100%;
|
|
|
}
|
|
|
|
|
|
.index-page .map h1 {
|
|
|
- font-size: 72px;
|
|
|
+ font-size: 3.75vw;
|
|
|
font-weight: 400;
|
|
|
color: #018cfb;
|
|
|
padding-top: 7.708vw;
|
|
|
@@ -178,12 +200,14 @@ h5 {
|
|
|
|
|
|
.index-page .map p {
|
|
|
width: 42.71vw;
|
|
|
- font-size: 24px;
|
|
|
+ font-size: 1.25vw;
|
|
|
font-weight: 500;
|
|
|
color: #242a30;
|
|
|
line-height: 30px;
|
|
|
margin-left: 12.448vw;
|
|
|
word-break: break-all;
|
|
|
+ margin-bottom: 3.125vw;
|
|
|
+ margin-top: 1.35vw;
|
|
|
}
|
|
|
|
|
|
.index-page .map .select {
|
|
|
@@ -203,7 +227,7 @@ h5 {
|
|
|
text-align: center;
|
|
|
line-height: 2.81vw;
|
|
|
color: #fff;
|
|
|
- font-size: 24px;
|
|
|
+ font-size: 1.25vw;
|
|
|
font-weight: 600;
|
|
|
z-index: 3;
|
|
|
}
|
|
|
@@ -232,3 +256,20 @@ h5 {
|
|
|
.index-page .map .select .pull-box .pull-item:last-child {
|
|
|
border: none;
|
|
|
}
|
|
|
+
|
|
|
+@media screen and (max-width: 960px) {
|
|
|
+ .font72 {
|
|
|
+ font-size: 9.6vw;
|
|
|
+ }
|
|
|
+ .font60 {
|
|
|
+ font-size: 8vw;
|
|
|
+ }
|
|
|
+ .font24 {
|
|
|
+ font-size: 3.2vw;
|
|
|
+ }
|
|
|
+ .index-page .banner {
|
|
|
+ height: 89.2vw;
|
|
|
+ background: url('../../images//home/phone/banner-pho.png') no-repeat;
|
|
|
+ background-size: 100% 100%;
|
|
|
+ }
|
|
|
+}
|
wmaple
