<template>
<view class="page flex-col">
<view class="outer1 flex-col justify-between">
<view class="mod1 flex-col">
<view class="box1 flex-col">
<view class="group2 flex-row">
<view class="outer2">
<text class="word1">北京国贸银泰中心店</text>
<text class="word2"></text>
</view>
<view class="outer3 flex-col"></view>
</view>
<view class="group3">
<text class="word3">距您</text>
<text class="txt2">132m</text>
</view>
<view class="group4 flex-row">
<view class="box2 flex-col">
<view class="bd4 flex-row">
<view class="mod2 flex-col">
<view class="wrap1 flex-col">
<view class="group5 flex-col"></view>
</view>
</view>
<view class="TextGroup1 flex-col">
<view class="bd5 flex-col justify-between">
<view class="group6">
<text class="info1">HI</text>
<text class="word4">！</text>
<text class="word5">小黑山羊</text>
</view>
<text class="word6">希望你今天，明天，天天都开心~</text>
</view>
</view>
<view class="mod3 flex-col"></view>
</view>
</view>
<text class="word7">请您尽快登陆</text>
</view>
</view>
</view>
<view class="mod4 flex-col">
<view class="section1 flex-row justify-between">
<view class="box3 flex-row">
<text class="txt3">新鲜果咖</text>
<text class="txt4">平淡黑咖</text>
<text class="word8">风味拿铁</text>
<text class="word9">每日特价</text>
<view class="main1 flex-col">
<view class="layer1 flex-col"></view>
</view>
</view>
<view class="box4 flex-col">
<text class="info2">每日特价</text>
<view class="mod5 flex-row justify-between">
<view class="block1 flex-col justify-between">
<view class="mod6 flex-col">
<view class="wrap2 flex-col"></view>
</view>
<view class="mod7 flex-col">
<view class="outer5 flex-col"></view>
</view>
</view>
<view class="block2 flex-col">
<text class="txt5">冰茶咖啡</text>
<view class="block3 flex-row justify-between">
<view class="box5 flex-col">
<text class="txt6">YYDS</text>
</view>
<view class="box6 flex-col">
<text class="txt7">店内招牌</text>
</view>
</view>
<view class="block4 flex-row">
<text class="info3">茶叶与咖啡豆的完美碰撞</text>
<view class="mod8 flex-col">
<view class="outer6 flex-col"></view>
<view class="outer7 flex-col"></view>
</view>
</view>
<view class="block5 flex-row">
<view class="bd6">
<text class="info4">¥</text>
<text class="word10">8.8</text>
</view>
<text class="word11">¥10</text>
<view class="bd7 flex-col"></view>
</view>
</view>
</view>
<view class="mod9 flex-row justify-between">
<view class="mod10 flex-col justify-between">
<view class="layer2 flex-col">
<view class="main2 flex-col"></view>
</view>
<view class="layer3 flex-col">
<view class="box7 flex-col"></view>
</view>
</view>
<view class="mod11 flex-col">
<text class="word12">黑巧克力</text>
<view class="layer4 flex-row justify-between">
<view class="main3 flex-col">
<text class="word13">YYDS</text>
</view>
<view class="main4 flex-col">
<text class="word14">重糖患者</text>
</view>
</view>
<view class="layer5 flex-row">
<text class="info5">比利时进口巧克力也挺丝滑</text>
<view class="group7 flex-col">
<view class="group8 flex-col"></view>
<view class="group9 flex-col"></view>
</view>
</view>
<view class="layer6 flex-row">
<view class="box8">
<text class="word15">¥</text>
<text class="info6">10</text>
</view>
<text class="word16">¥15</text>
<view class="box9 flex-col"></view>
</view>
</view>
</view>
<view class="mod12 flex-row">
<view class="box10 flex-col">
<view class="main5 flex-col"></view>
</view>
<view class="ImageText1 flex-col">
<view class="layer7 flex-row">
<view class="layer8 flex-col"></view>
<view class="layer9 flex-col">
<text class="txt8">YYDS</text>
</view>
<view class="TextGroup2 flex-col">
<view class="main6 flex-col justify-between">
<text class="txt9">甜妹松饼拿铁</text>
<text class="txt10">其实你就是馋我酥饼</text>
</view>
</view>
<view class="layer10 flex-col">
<text class="info7">松饼超软</text>
</view>
</view>
</view>
<view class="box11">
<text class="txt11">¥</text>
<text class="txt12">12.8</text>
</view>
<text class="txt13">¥10</text>
<view class="box12 flex-col"></view>
<view class="box13 flex-col">
<view class="box14 flex-col"></view>
<view class="box15 flex-col"></view>
</view>
</view>
<view class="mod13 flex-row">
<view class="outer8 flex-col">
<view class="wrap3 flex-col"></view>
</view>
<view class="ImageText2 flex-col">
<view class="block6 flex-row">
<view class="group10 flex-col"></view>
<view class="group11 flex-col">
<text class="info8">YYDS</text>
</view>
<view class="TextGroup3 flex-col">
<view class="mod14 flex-col justify-between">
<text class="word17">甜妹松饼拿铁</text>
<text class="txt14">其实你就是馋我酥饼</text>
</view>
</view>
<view class="group12 flex-col">
<text class="word18">松饼超软</text>
</view>
</view>
</view>
<view class="outer9">
<text class="txt15">¥</text>
<text class="word19">12.8</text>
</view>
<text class="word20">¥10</text>
<view class="outer10 flex-col"></view>
<view class="outer11 flex-col">
<view class="bd8 flex-col"></view>
<view class="bd9 flex-col"></view>
</view>
</view>
<view class="mod15 flex-row">
<view class="layer11 flex-col">
<view class="outer12 flex-col"></view>
<view class="outer13 flex-col"></view>
</view>
<view class="ImageText3 flex-col">
<view class="box16 flex-row">
<view class="mod16 flex-col"></view>
<view class="mod17 flex-col">
<text class="info9">YYDS</text>
</view>
<view class="TextGroup4 flex-col">
<view class="mod18 flex-col justify-between">
<text class="word21">甜妹松饼拿铁</text>
<text class="word22">其实你就是馋我酥饼</text>
</view>
</view>
<view class="mod19 flex-col">
<text class="word23">松饼超软</text>
</view>
</view>
</view>
<view class="layer12">
<text class="txt16">¥</text>
<text class="txt17">12.8</text>
</view>
<text class="info10">¥10</text>
<view class="layer13 flex-col"></view>
<view class="layer14 flex-col">
<view class="outer14 flex-col"></view>
<view class="outer15 flex-col"></view>
</view>
</view>
</view>
</view>
</view>
<view class="outer16 flex-col">
<view class="layer15 flex-row justify-between">
<view class="ImageText4 flex-col">
<view class="bd10 flex-col justify-between">
<view class="outer17 flex-col">
<view class="outer18 flex-row justify-between">
<view class="wrap4 flex-col"></view>
<view class="wrap5 flex-col"></view>
</view>
<view class="outer19 flex-col"></view>
</view>
<view class="TextGroup5 flex-col">
<text class="info11">菜单</text>
</view>
</view>
</view>
<view class="ImageText5 flex-col">
<view class="block7 flex-col justify-between">
<view class="outer20 flex-col">
<view class="mod20 flex-col justify-between">
<image
class="label1"
referrerpolicy="no-referrer"
src="/static/lanhu_shouyedengluzhuangtai/SketchPngc52cb4f7025cfa7ad4e75e95c99771e8e16a17deaea09fe57e2956857c3e6609.png"
/>
<image
class="icon1"
referrerpolicy="no-referrer"
src="/static/lanhu_shouyedengluzhuangtai/SketchPnge6268df04a479b2ab61b46139407d58df847b1b73ab0e2bd8867ab4b7c3482ab.png"
/>
<image
class="icon2"
referrerpolicy="no-referrer"
src="/static/lanhu_shouyedengluzhuangtai/SketchPngc52cb4f7025cfa7ad4e75e95c99771e8e16a17deaea09fe57e2956857c3e6609.png"
/>
</view>
</view>
<view class="TextGroup6 flex-col">
<text class="word24">订单</text>
</view>
</view>
</view>
<view class="layer16 flex-col">
<image
class="icon3"
referrerpolicy="no-referrer"
src="/static/lanhu_shouyedengluzhuangtai/SketchPngba77e6fbbbbf5bfd7f79e7d28b8f9bc95f68d68391a45703ea932a6c2a36e0ea.png"
/>
<view class="group13 flex-col"></view>
<text class="word25">我的</text>
</view>
</view>
<view class="section2 flex-col"></view>
</view>
</view>
</view>
</view>
</template>
<script>
export default {
data() {
return {
constants: {}
};
},
methods: {}
};
</script>
<style lang='scss' scoped>
body * {
box-sizing: border-box;
flex-shrink: 0;
}
body {
font-family: PingFangSC-Regular, Roboto, Helvetica Neue, Helvetica, Tahoma,
Arial, PingFang SC-Light, Microsoft YaHei;
}
button {
margin: 0;
padding: 0;
border: 1px solid transparent;
outline: none;
background-color: transparent;
}
button:active {
opacity: 0.6;
}
.flex-col {
display: flex;
flex-direction: column;
}
.flex-row {
display: flex;
flex-direction: row;
}
.justify-start {
display: flex;
justify-content: flex-start;
}
.justify-center {
display: flex;
justify-content: center;
}
.justify-end {
display: flex;
justify-content: flex-end;
}
.justify-evenly {
display: flex;
justify-content: space-evenly;
}
.justify-around {
display: flex;
justify-content: space-around;
}
.justify-between {
display: flex;
justify-content: space-between;
}
.align-start {
display: flex;
align-items: flex-start;
}
.align-center {
display: flex;
align-items: center;
}
.align-end {
display: flex;
align-items: flex-end;
}
</style>
<script>
export default {
data() {
return {
constants: {}
};
},
methods: {}
};
</script>
<style lang="scss" scoped>
.page {
background-color: rgba(242, 242, 242, 1);
position: relative;
width: 750rpx;
overflow: hidden;
.outer1 {
width: 750rpx;
.mod1 {
height: 376rpx;
background: url(../../static/lanhu_shouyedengluzhuangtai/banner.png) 100% no-repeat;
width: 750rpx;
background-size: cover;
.box1 {
width: 708rpx;
height: 344rpx;
margin: 32rpx 0 0 32rpx;
.group2 {
width: 708rpx;
height: 62rpx;
margin-top: 36rpx;
.outer2 {
width: 372rpx;
height: 62rpx;
overflow-wrap: break-word;
font-size: 0;
font-family: PingFangSC-Semibold;
text-align: left;
line-height: 62rpx;
.word1 {
width: 372rpx;
height: 62rpx;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 28rpx;
font-family: PingFangSC-Semibold;
text-align: left;
line-height: 62rpx;
overflow: hidden;
text-overflow: ellipsis;
}
.word2 {
width: 372rpx;
height: 62rpx;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 32rpx;
font-family: PingFangSC-Semibold;
text-align: left;
white-space: nowrap;
line-height: 62rpx;
}
}
.outer3 {
width: 10rpx;
height: 22rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng7c37b72b3689e1f67a52214660e47c3086698c46f62dc33c045022601cd7b0f6.png) -2rpx -2rpx
no-repeat;
margin: 22rpx 0 0 -106rpx;
}
}
.group3 {
width: 498rpx;
height: 46rpx;
overflow-wrap: break-word;
font-size: 0;
text-align: left;
white-space: nowrap;
line-height: 46rpx;
margin-left: 2rpx;
.word3 {
width: 498rpx;
height: 46rpx;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 24rpx;
text-align: left;
white-space: nowrap;
line-height: 46rpx;
}
.txt2 {
width: 498rpx;
height: 46rpx;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 24rpx;
font-family: ArialMT;
text-align: left;
white-space: nowrap;
line-height: 46rpx;
}
}
.group4 {
width: 624rpx;
height: 88rpx;
margin: 110rpx 0 0 32rpx;
.box2 {
height: 88rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng3359b1902d1bac07ebd12e6a4a882d5e20a992d0bcb172076a8670f1bc59d857.png) -8rpx -2rpx
no-repeat;
width: 624rpx;
.bd4 {
width: 578rpx;
height: 54rpx;
margin: 14rpx 0 0 22rpx;
.mod2 {
box-shadow: 0px 2px 4px 0px rgba(50, 50, 50, 0.25);
height: 48rpx;
margin-top: 6rpx;
width: 50rpx;
.wrap1 {
background-color: rgba(255, 114, 193, 1);
border-radius: 2px;
z-index: 164;
position: relative;
width: 50rpx;
height: 48rpx;
overflow: hidden;
.group5 {
z-index: 165;
position: absolute;
left: -20rpx;
top: 12rpx;
width: 88rpx;
height: 78rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng17917073ab15b5d0229e48fe15cfcfc41073dd88f50cfa8d14d68254be5ae23d.png) -18rpx -18rpx
no-repeat;
}
}
}
.TextGroup1 {
height: 54rpx;
margin-left: 20rpx;
width: 232rpx;
.bd5 {
width: 232rpx;
height: 54rpx;
.group6 {
width: 120rpx;
height: 28rpx;
overflow-wrap: break-word;
font-size: 0;
font-family: ArialMT;
text-align: left;
white-space: nowrap;
line-height: 28rpx;
.info1 {
width: 120rpx;
height: 28rpx;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 20rpx;
font-family: ArialMT;
text-align: left;
white-space: nowrap;
line-height: 28rpx;
}
.word4 {
width: 120rpx;
height: 28rpx;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 20rpx;
text-align: left;
white-space: nowrap;
line-height: 28rpx;
}
.word5 {
width: 120rpx;
height: 28rpx;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 20rpx;
font-family: PingFangSC-Medium;
text-align: left;
white-space: nowrap;
line-height: 28rpx;
}
}
.word6 {
width: 232rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 16rpx;
text-align: left;
white-space: nowrap;
line-height: 22rpx;
margin-top: 4rpx;
display: block;
}
}
}
.mod3 {
width: 8rpx;
height: 12rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng0f76f37a1d3259a42926a7d41a406e6577ed9a866f5a2ff9a6b00ff2211a2f55.png) -2rpx -2rpx
no-repeat;
margin: 36rpx 0 0 268rpx;
}
}
}
.word7 {
width: 96rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(255, 255, 255, 1);
font-size: 16rpx;
text-align: left;
white-space: nowrap;
line-height: 22rpx;
display: block;
margin: 46rpx 442rpx 0 -538rpx;
}
}
}
}
.mod4 {
background: #fff;
width: 750rpx;
flex: 1;
overflow: hidden;
.section1 {
width: 682rpx;
margin: 24rpx 0 0 32rpx;
.box3 {
width: 122rpx;
height: 1052rpx;
margin-top: 8rpx;
.txt3 {
width: 122rpx;
height: 34rpx;
overflow-wrap: break-word;
color: rgba(102, 102, 102, 1);
font-size: 24rpx;
text-align: left;
white-space: nowrap;
line-height: 34rpx;
margin-top: 546rpx;
display: block;
}
.txt4 {
width: 122rpx;
height: 34rpx;
overflow-wrap: break-word;
color: rgba(102, 102, 102, 1);
font-size: 24rpx;
text-align: left;
white-space: nowrap;
line-height: 34rpx;
display: block;
margin: 238rpx 0 0 -122rpx;
}
.word8 {
width: 122rpx;
height: 34rpx;
overflow-wrap: break-word;
color: rgba(102, 102, 102, 1);
font-size: 24rpx;
text-align: left;
white-space: nowrap;
line-height: 34rpx;
display: block;
margin: 392rpx 0 0 -122rpx;
}
.word9 {
width: 122rpx;
height: 34rpx;
overflow-wrap: break-word;
color: rgba(0, 0, 0, 1);
font-size: 24rpx;
font-family: PingFangSC-Semibold;
text-align: left;
white-space: nowrap;
line-height: 34rpx;
display: block;
margin: 84rpx 0 0 -122rpx;
}
.main1 {
height: 1052rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng96dddf378503baab3bd60d8b561c2eed41d0310f786535d0ffe8eb408177132e.png)
0rpx -2rpx no-repeat;
margin-left: -2rpx;
width: 2rpx;
.layer1 {
width: 2rpx;
height: 170rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPngb4dc18dfb7ea75c3f92ee865c167ea766766c7078f38ac0439f251758dec1dc2.png) -2rpx -2rpx
no-repeat;
}
}
}
.box4 {
width: 532rpx;
height: 1100rpx;
.info2 {
width: 140rpx;
height: 44rpx;
overflow-wrap: break-word;
color: rgba(0, 0, 0, 1);
font-size: 32rpx;
font-family: PingFangSC-Semibold;
text-align: left;
white-space: nowrap;
line-height: 44rpx;
display: block;
}
.mod5 {
width: 518rpx;
height: 164rpx;
margin: 36rpx 0 0 14rpx;
.block1 {
width: 140rpx;
height: 140rpx;
margin-top: 4rpx;
.mod6 {
background-color: rgba(229, 240, 250, 1);
border-radius: 2px 2px 0px 0px;
height: 92rpx;
width: 140rpx;
.wrap2 {
width: 26rpx;
height: 24rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPngd089fdf2f242c6a0b4d898a07e49621219f76eaf8983a034f72558f085a0b9d3.png)
100% no-repeat;
margin: 12rpx 0 0 14rpx;
}
}
.mod7 {
background-color: rgba(204, 226, 245, 1);
border-radius: 0px 0px 2px 2px;
z-index: 66;
position: relative;
width: 140rpx;
height: 48rpx;
.outer5 {
z-index: 71;
position: absolute;
left: 42rpx;
top: -50rpx;
width: 58rpx;
height: 82rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPngff00cd9eff288cacbffda368bff87769fb508c93628e7a51161c82725eefedd5.png) -2rpx
0rpx no-repeat;
}
}
}
.block2 {
width: 344rpx;
height: 164rpx;
.txt5 {
width: 122rpx;
height: 40rpx;
overflow-wrap: break-word;
color: rgba(0, 0, 0, 1);
font-size: 28rpx;
font-family: PingFangSC-Medium;
text-align: left;
white-space: nowrap;
line-height: 40rpx;
display: block;
}
.block3 {
width: 142rpx;
height: 24rpx;
margin-top: 8rpx;
.box5 {
border-radius: 2px;
height: 24rpx;
border: 1px solid rgba(0, 110, 207, 1);
width: 56rpx;
.txt6 {
width: 54rpx;
height: 18rpx;
overflow-wrap: break-word;
color: rgba(0, 110, 207, 1);
font-size: 16rpx;
font-family: ArialMT;
text-align: left;
white-space: nowrap;
line-height: 18rpx;
display: block;
margin: 4rpx 0 0 6rpx;
}
}
.box6 {
border-radius: 2px;
height: 24rpx;
border: 1px solid rgba(0, 110, 207, 1);
width: 76rpx;
.txt7 {
width: 64rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(0, 110, 207, 1);
font-size: 16rpx;
text-align: left;
white-space: nowrap;
line-height: 22rpx;
margin-left: 6rpx;
display: block;
}
}
}
.block4 {
width: 344rpx;
height: 40rpx;
margin-top: 4rpx;
.info3 {
width: 324rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(102, 102, 102, 1);
font-size: 20rpx;
text-align: left;
white-space: nowrap;
line-height: 20rpx;
margin-top: 8rpx;
display: block;
}
.mod8 {
background-color: rgba(0, 110, 207, 1);
border-radius: 50%;
z-index: 77;
height: 40rpx;
margin-left: -20rpx;
width: 40rpx;
position: relative;
.outer6 {
width: 20rpx;
height: 2rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng2904e2150fa193b8a60e670aaf5aec7a1159ec18405417da57513c710c4d895d.png) -4rpx -2rpx
no-repeat;
margin: 20rpx 0 0 10rpx;
}
.outer7 {
z-index: 87;
position: absolute;
left: 18rpx;
top: 10rpx;
width: 2rpx;
height: 20rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng036f58d8112d922474cdc0bd307aecfa33a88f1cb62c327961a99bace4b1ddd2.png) -2rpx -2rpx
no-repeat;
}
}
}
.block5 {
width: 100rpx;
height: 32rpx;
margin: 16rpx 0 0 2rpx;
.bd6 {
width: 56rpx;
height: 32rpx;
overflow-wrap: break-word;
font-size: 0;
letter-spacing: 0.8999999761581421px;
font-family: Arial-BoldMT;
text-align: left;
white-space: nowrap;
line-height: 32rpx;
.info4 {
width: 56rpx;
height: 32rpx;
overflow-wrap: break-word;
color: rgba(235, 95, 23, 1);
font-size: 24rpx;
font-family: Arial-BoldMT;
text-align: left;
white-space: nowrap;
line-height: 32rpx;
}
.word10 {
width: 56rpx;
height: 32rpx;
overflow-wrap: break-word;
color: rgba(235, 95, 23, 1);
font-size: 28rpx;
font-family: Arial-BoldMT;
text-align: left;
white-space: nowrap;
line-height: 32rpx;
}
}
.word11 {
width: 34rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(102, 102, 102, 1);
font-size: 20rpx;
font-family: ArialMT;
text-align: left;
white-space: nowrap;
line-height: 22rpx;
display: block;
margin: 8rpx 0 0 6rpx;
}
.bd7 {
width: 26rpx;
height: 2rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng1c017a8cb59a2d43e0570f34485bff061bf646b7a3ea1eec1f3bb716500d5232.png) -2rpx
0rpx no-repeat;
margin: 18rpx 0 0 -22rpx;
}
}
}
}
.mod9 {
width: 518rpx;
height: 164rpx;
margin: 48rpx 0 0 14rpx;
.mod10 {
width: 140rpx;
height: 140rpx;
margin-top: 8rpx;
.layer2 {
background-color: rgba(229, 240, 250, 1);
border-radius: 2px 2px 0px 0px;
height: 92rpx;
width: 140rpx;
.main2 {
width: 26rpx;
height: 26rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPngc2859809ba04d688c15203dc80c4daaef06c7b22ea6ef5f85c31ec056acc5314.png)
100% no-repeat;
margin: 10rpx 0 0 14rpx;
}
}
.layer3 {
background-color: rgba(204, 226, 245, 1);
border-radius: 0px 0px 2px 2px;
z-index: 67;
position: relative;
width: 140rpx;
height: 48rpx;
.box7 {
z-index: 75;
position: absolute;
left: 38rpx;
top: -54rpx;
width: 64rpx;
height: 88rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng2c1fef72263ff6c129630ab369c0c72dbe65046fffe820ac4e25dc1c38286ea6.png)
100% no-repeat;
}
}
}
.mod11 {
width: 344rpx;
height: 164rpx;
.word12 {
width: 122rpx;
height: 40rpx;
overflow-wrap: break-word;
color: rgba(0, 0, 0, 1);
font-size: 28rpx;
font-family: PingFangSC-Medium;
text-align: left;
white-space: nowrap;
line-height: 40rpx;
display: block;
}
.layer4 {
width: 142rpx;
height: 24rpx;
margin-top: 8rpx;
.main3 {
border-radius: 2px;
height: 24rpx;
border: 1px solid rgba(0, 110, 207, 1);
width: 56rpx;
.word13 {
width: 54rpx;
height: 18rpx;
overflow-wrap: break-word;
color: rgba(0, 110, 207, 1);
font-size: 16rpx;
font-family: ArialMT;
text-align: left;
white-space: nowrap;
line-height: 18rpx;
display: block;
margin: 4rpx 0 0 6rpx;
}
}
.main4 {
border-radius: 2px;
height: 24rpx;
border: 1px solid rgba(0, 110, 207, 1);
width: 76rpx;
.word14 {
width: 64rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(0, 110, 207, 1);
font-size: 16rpx;
text-align: left;
white-space: nowrap;
line-height: 22rpx;
display: block;
margin: 4rpx 0 0 6rpx;
}
}
}
.layer5 {
width: 344rpx;
height: 40rpx;
margin-top: 8rpx;
.info5 {
width: 324rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(102, 102, 102, 1);
font-size: 20rpx;
text-align: left;
white-space: nowrap;
line-height: 20rpx;
margin-top: 4rpx;
display: block;
}
.group7 {
background-color: rgba(0, 110, 207, 1);
border-radius: 50%;
z-index: 78;
height: 40rpx;
margin-left: -20rpx;
width: 40rpx;
position: relative;
.group8 {
width: 20rpx;
height: 2rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng2904e2150fa193b8a60e670aaf5aec7a1159ec18405417da57513c710c4d895d.png) -4rpx -2rpx
no-repeat;
margin: 20rpx 0 0 10rpx;
}
.group9 {
z-index: 88;
position: absolute;
left: 18rpx;
top: 10rpx;
width: 2rpx;
height: 20rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng036f58d8112d922474cdc0bd307aecfa33a88f1cb62c327961a99bace4b1ddd2.png) -2rpx -2rpx
no-repeat;
}
}
}
.layer6 {
width: 90rpx;
height: 32rpx;
margin: 12rpx 0 0 2rpx;
.box8 {
width: 48rpx;
height: 32rpx;
overflow-wrap: break-word;
font-size: 0;
letter-spacing: 0.8999999761581421px;
font-family: Arial-BoldMT;
text-align: left;
white-space: nowrap;
line-height: 32rpx;
.word15 {
width: 48rpx;
height: 32rpx;
overflow-wrap: break-word;
color: rgba(235, 95, 23, 1);
font-size: 24rpx;
font-family: Arial-BoldMT;
text-align: left;
white-space: nowrap;
line-height: 32rpx;
}
.info6 {
width: 48rpx;
height: 32rpx;
overflow-wrap: break-word;
color: rgba(235, 95, 23, 1);
font-size: 28rpx;
font-family: Arial-BoldMT;
text-align: left;
white-space: nowrap;
line-height: 32rpx;
}
}
.word16 {
width: 34rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(102, 102, 102, 1);
font-size: 20rpx;
font-family: ArialMT;
text-align: left;
white-space: nowrap;
line-height: 22rpx;
display: block;
margin: 8rpx 0 0 4rpx;
}
.box9 {
width: 26rpx;
height: 2rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng1c017a8cb59a2d43e0570f34485bff061bf646b7a3ea1eec1f3bb716500d5232.png) -2rpx
0rpx no-repeat;
margin: 20rpx 0 0 -22rpx;
}
}
}
}
.mod12 {
width: 518rpx;
height: 164rpx;
margin: 52rpx 0 0 14rpx;
.box10 {
background-color: rgba(204, 226, 245, 1);
border-radius: 0px 0px 2px 2px;
z-index: 68;
position: relative;
width: 140rpx;
height: 48rpx;
margin-top: 96rpx;
.main5 {
z-index: 76;
position: absolute;
left: 40rpx;
top: -60rpx;
width: 72rpx;
height: 92rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPngdbaa2591eaa6ed2bf68fdc790cf6d1fc4dec81f35256d6209dd3ad474e77996c.png) -2rpx -2rpx
no-repeat;
}
}
.ImageText1 {
height: 106rpx;
margin-left: -140rpx;
width: 498rpx;
.layer7 {
width: 498rpx;
height: 106rpx;
.layer8 {
background-color: rgba(229, 240, 250, 1);
border-radius: 2px 2px 0px 0px;
width: 140rpx;
height: 92rpx;
margin-top: 4rpx;
}
.layer9 {
border-radius: 2px;
height: 24rpx;
border: 1px solid rgba(0, 110, 207, 1);
width: 56rpx;
margin: 48rpx 0 0 34rpx;
.txt8 {
width: 54rpx;
height: 18rpx;
overflow-wrap: break-word;
color: rgba(0, 110, 207, 1);
font-size: 16rpx;
font-family: ArialMT;
text-align: left;
white-space: nowrap;
line-height: 18rpx;
display: block;
margin: 4rpx 0 0 6rpx;
}
}
.TextGroup2 {
height: 106rpx;
margin-left: -56rpx;
width: 324rpx;
.main6 {
width: 324rpx;
height: 106rpx;
.txt9 {
width: 194rpx;
height: 40rpx;
overflow-wrap: break-word;
color: rgba(0, 0, 0, 1);
font-size: 28rpx;
font-family: PingFangSC-Medium;
text-align: left;
white-space: nowrap;
line-height: 40rpx;
display: block;
}
.txt10 {
width: 324rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(102, 102, 102, 1);
font-size: 20rpx;
text-align: left;
white-space: nowrap;
line-height: 20rpx;
margin-top: 44rpx;
display: block;
}
}
}
.layer10 {
border-radius: 2px;
height: 24rpx;
border: 1px solid rgba(0, 110, 207, 1);
width: 76rpx;
margin: 48rpx 182rpx 0 -258rpx;
.info7 {
width: 64rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(0, 110, 207, 1);
font-size: 16rpx;
text-align: left;
white-space: nowrap;
line-height: 22rpx;
margin-left: 6rpx;
display: block;
}
}
}
}
.box11 {
width: 70rpx;
height: 32rpx;
overflow-wrap: break-word;
font-size: 0;
letter-spacing: 0.8999999761581421px;
font-family: Arial-BoldMT;
text-align: left;
white-space: nowrap;
line-height: 32rpx;
margin: 132rpx 0 0 -322rpx;
.txt11 {
width: 70rpx;
height: 32rpx;
overflow-wrap: break-word;
color: rgba(235, 95, 23, 1);
font-size: 24rpx;
font-family: Arial-BoldMT;
text-align: left;
white-space: nowrap;
line-height: 32rpx;
}
.txt12 {
width: 70rpx;
height: 32rpx;
overflow-wrap: break-word;
color: rgba(235, 95, 23, 1);
font-size: 28rpx;
font-family: Arial-BoldMT;
text-align: left;
white-space: nowrap;
line-height: 32rpx;
}
}
.txt13 {
width: 34rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(102, 102, 102, 1);
font-size: 20rpx;
font-family: ArialMT;
text-align: left;
white-space: nowrap;
line-height: 22rpx;
display: block;
margin: 140rpx 0 0 8rpx;
}
.box12 {
width: 26rpx;
height: 2rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng1c017a8cb59a2d43e0570f34485bff061bf646b7a3ea1eec1f3bb716500d5232.png) -2rpx
0rpx no-repeat;
margin: 150rpx 0 0 -22rpx;
}
.box13 {
background-color: rgba(0, 110, 207, 1);
border-radius: 50%;
z-index: 79;
height: 40rpx;
width: 40rpx;
position: relative;
margin: 74rpx 0 0 186rpx;
.box14 {
width: 20rpx;
height: 2rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng2904e2150fa193b8a60e670aaf5aec7a1159ec18405417da57513c710c4d895d.png) -4rpx -2rpx
no-repeat;
margin: 20rpx 0 0 10rpx;
}
.box15 {
z-index: 89;
position: absolute;
left: 18rpx;
top: 10rpx;
width: 2rpx;
height: 20rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng036f58d8112d922474cdc0bd307aecfa33a88f1cb62c327961a99bace4b1ddd2.png) -2rpx -2rpx
no-repeat;
}
}
}
.mod13 {
width: 518rpx;
height: 164rpx;
margin: 48rpx 0 0 14rpx;
.outer8 {
background-color: rgba(204, 226, 245, 1);
border-radius: 0px 0px 2px 2px;
z-index: 69;
position: relative;
width: 140rpx;
height: 48rpx;
margin-top: 100rpx;
.wrap3 {
z-index: 72;
position: absolute;
left: 42rpx;
top: -52rpx;
width: 58rpx;
height: 82rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPngff00cd9eff288cacbffda368bff87769fb508c93628e7a51161c82725eefedd5.png) -2rpx
0rpx no-repeat;
}
}
.ImageText2 {
height: 106rpx;
margin-left: -140rpx;
width: 498rpx;
.block6 {
width: 498rpx;
height: 106rpx;
.group10 {
background-color: rgba(229, 240, 250, 1);
border-radius: 2px 2px 0px 0px;
width: 140rpx;
height: 92rpx;
margin-top: 8rpx;
}
.group11 {
border-radius: 2px;
height: 24rpx;
border: 1px solid rgba(0, 110, 207, 1);
width: 56rpx;
margin: 48rpx 0 0 34rpx;
.info8 {
width: 54rpx;
height: 18rpx;
overflow-wrap: break-word;
color: rgba(0, 110, 207, 1);
font-size: 16rpx;
font-family: ArialMT;
text-align: left;
white-space: nowrap;
line-height: 18rpx;
display: block;
margin: 4rpx 0 0 6rpx;
}
}
.TextGroup3 {
height: 106rpx;
margin-left: -56rpx;
width: 324rpx;
.mod14 {
width: 324rpx;
height: 106rpx;
.word17 {
width: 194rpx;
height: 40rpx;
overflow-wrap: break-word;
color: rgba(0, 0, 0, 1);
font-size: 28rpx;
font-family: PingFangSC-Medium;
text-align: left;
white-space: nowrap;
line-height: 40rpx;
display: block;
}
.txt14 {
width: 324rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(102, 102, 102, 1);
font-size: 20rpx;
text-align: left;
white-space: nowrap;
line-height: 20rpx;
margin-top: 44rpx;
display: block;
}
}
}
.group12 {
border-radius: 2px;
height: 24rpx;
border: 1px solid rgba(0, 110, 207, 1);
width: 76rpx;
margin: 48rpx 182rpx 0 -258rpx;
.word18 {
width: 64rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(0, 110, 207, 1);
font-size: 16rpx;
text-align: left;
white-space: nowrap;
line-height: 22rpx;
display: block;
margin: 4rpx 0 0 6rpx;
}
}
}
}
.outer9 {
width: 70rpx;
height: 32rpx;
overflow-wrap: break-word;
font-size: 0;
letter-spacing: 0.8999999761581421px;
font-family: Arial-BoldMT;
text-align: left;
white-space: nowrap;
line-height: 32rpx;
margin: 132rpx 0 0 -322rpx;
.txt15 {
width: 70rpx;
height: 32rpx;
overflow-wrap: break-word;
color: rgba(255, 82, 0, 1);
font-size: 24rpx;
font-family: Arial-BoldMT;
text-align: left;
white-space: nowrap;
line-height: 32rpx;
}
.word19 {
width: 70rpx;
height: 32rpx;
overflow-wrap: break-word;
color: rgba(255, 82, 0, 1);
font-size: 28rpx;
font-family: Arial-BoldMT;
text-align: left;
white-space: nowrap;
line-height: 32rpx;
}
}
.word20 {
width: 34rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(102, 102, 102, 1);
font-size: 20rpx;
font-family: ArialMT;
text-align: left;
white-space: nowrap;
line-height: 22rpx;
display: block;
margin: 140rpx 0 0 8rpx;
}
.outer10 {
width: 26rpx;
height: 2rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng1c017a8cb59a2d43e0570f34485bff061bf646b7a3ea1eec1f3bb716500d5232.png) -2rpx
0rpx no-repeat;
margin: 152rpx 0 0 -22rpx;
}
.outer11 {
background-color: rgba(0, 110, 207, 1);
border-radius: 50%;
z-index: 80;
height: 40rpx;
width: 40rpx;
position: relative;
margin: 78rpx 0 0 186rpx;
.bd8 {
width: 20rpx;
height: 2rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng2904e2150fa193b8a60e670aaf5aec7a1159ec18405417da57513c710c4d895d.png) -4rpx -2rpx
no-repeat;
margin: 20rpx 0 0 10rpx;
}
.bd9 {
z-index: 90;
position: absolute;
left: 18rpx;
top: 8rpx;
width: 2rpx;
height: 20rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng91aa44b8509fd1936a279bea269b39e53c0c9b42785bdc1a3ca29be8544de258.png) -2rpx -2rpx
no-repeat;
}
}
}
.mod15 {
width: 518rpx;
height: 164rpx;
margin: 52rpx 0 0 14rpx;
.layer11 {
background-color: rgba(204, 226, 245, 1);
border-radius: 0px 0px 2px 2px;
z-index: 70;
position: relative;
width: 140rpx;
height: 48rpx;
margin-top: 96rpx;
.outer12 {
z-index: 73;
position: absolute;
left: 42rpx;
top: -50rpx;
width: 58rpx;
height: 82rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPngff00cd9eff288cacbffda368bff87769fb508c93628e7a51161c82725eefedd5.png) -2rpx
0rpx no-repeat;
}
.outer13 {
z-index: 74;
position: absolute;
left: 42rpx;
top: 34rpx;
width: 58rpx;
height: 82rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng52d2fb134bec9567c73b49df822eb7ac25ffca7934f45ddbe05e47e4df934cb4.png) -2rpx
0rpx no-repeat;
}
}
.ImageText3 {
height: 106rpx;
margin-left: -140rpx;
width: 498rpx;
.box16 {
width: 498rpx;
height: 106rpx;
.mod16 {
background-color: rgba(229, 240, 250, 1);
border-radius: 2px 2px 0px 0px;
width: 140rpx;
height: 92rpx;
margin-top: 4rpx;
}
.mod17 {
border-radius: 2px;
height: 24rpx;
border: 1px solid rgba(0, 110, 207, 1);
width: 56rpx;
margin: 48rpx 0 0 34rpx;
.info9 {
width: 54rpx;
height: 18rpx;
overflow-wrap: break-word;
color: rgba(0, 110, 207, 1);
font-size: 16rpx;
font-family: ArialMT;
text-align: left;
white-space: nowrap;
line-height: 18rpx;
display: block;
margin: 4rpx 0 0 6rpx;
}
}
.TextGroup4 {
height: 106rpx;
margin-left: -56rpx;
width: 324rpx;
.mod18 {
width: 324rpx;
height: 106rpx;
.word21 {
width: 194rpx;
height: 40rpx;
overflow-wrap: break-word;
color: rgba(0, 0, 0, 1);
font-size: 28rpx;
font-family: PingFangSC-Medium;
text-align: left;
white-space: nowrap;
line-height: 40rpx;
display: block;
}
.word22 {
width: 324rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(102, 102, 102, 1);
font-size: 20rpx;
text-align: left;
white-space: nowrap;
line-height: 20rpx;
margin-top: 44rpx;
display: block;
}
}
}
.mod19 {
border-radius: 2px;
height: 24rpx;
border: 1px solid rgba(0, 110, 207, 1);
width: 76rpx;
margin: 48rpx 182rpx 0 -258rpx;
.word23 {
width: 64rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(0, 110, 207, 1);
font-size: 16rpx;
text-align: left;
white-space: nowrap;
line-height: 22rpx;
margin-left: 6rpx;
display: block;
}
}
}
}
.layer12 {
width: 70rpx;
height: 32rpx;
overflow-wrap: break-word;
font-size: 0;
letter-spacing: 0.8999999761581421px;
font-family: Arial-BoldMT;
text-align: left;
white-space: nowrap;
line-height: 32rpx;
margin: 132rpx 0 0 -322rpx;
.txt16 {
width: 70rpx;
height: 32rpx;
overflow-wrap: break-word;
color: rgba(255, 82, 0, 1);
font-size: 24rpx;
font-family: Arial-BoldMT;
text-align: left;
white-space: nowrap;
line-height: 32rpx;
}
.txt17 {
width: 70rpx;
height: 32rpx;
overflow-wrap: break-word;
color: rgba(255, 82, 0, 1);
font-size: 28rpx;
font-family: Arial-BoldMT;
text-align: left;
white-space: nowrap;
line-height: 32rpx;
}
}
.info10 {
width: 34rpx;
height: 22rpx;
overflow-wrap: break-word;
color: rgba(102, 102, 102, 1);
font-size: 20rpx;
font-family: ArialMT;
text-align: left;
white-space: nowrap;
line-height: 22rpx;
display: block;
margin: 140rpx 0 0 8rpx;
}
.layer13 {
width: 26rpx;
height: 2rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng1c017a8cb59a2d43e0570f34485bff061bf646b7a3ea1eec1f3bb716500d5232.png) -2rpx
0rpx no-repeat;
margin: 150rpx 0 0 -22rpx;
}
.layer14 {
background-color: rgba(0, 110, 207, 1);
border-radius: 50%;
z-index: 81;
height: 40rpx;
width: 40rpx;
position: relative;
margin: 76rpx 0 0 186rpx;
.outer14 {
width: 20rpx;
height: 2rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng2904e2150fa193b8a60e670aaf5aec7a1159ec18405417da57513c710c4d895d.png) -4rpx -2rpx
no-repeat;
margin: 20rpx 0 0 10rpx;
}
.outer15 {
z-index: 91;
position: absolute;
left: 18rpx;
top: 10rpx;
width: 2rpx;
height: 20rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng036f58d8112d922474cdc0bd307aecfa33a88f1cb62c327961a99bace4b1ddd2.png) -2rpx -2rpx
no-repeat;
}
}
}
}
}
}
}
.outer16 {
height: 100rpx;
background: #fff;
width: 750rpx;
justify-content: flex-center;
.layer15 {
width: 484rpx;
height: 72rpx;
margin: 16rpx 0 0 134rpx;
.ImageText4 {
height: 72rpx;
width: 40rpx;
.bd10 {
width: 40rpx;
height: 72rpx;
.outer17 {
z-index: 102;
height: 40rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng9dac1ededdcbfb3698e608f01ad3f40e0b50ecdc02d7b3f1ece9017772cc2a64.png) -2rpx -2rpx
no-repeat;
margin-left: 6rpx;
width: 28rpx;
position: relative;
.outer18 {
width: 24rpx;
height: 12rpx;
margin: 12rpx 0 0 2rpx;
.wrap4 {
width: 12rpx;
height: 12rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng9d7929525607f3c666d410523c3a1faaca4971ce3416d416f1513048a491dee3.png)
100% no-repeat;
}
.wrap5 {
width: 12rpx;
height: 12rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng9d7929525607f3c666d410523c3a1faaca4971ce3416d416f1513048a491dee3.png)
100% no-repeat;
}
}
.outer19 {
z-index: 103;
position: absolute;
left: -2rpx;
top: 4rpx;
width: 32rpx;
height: 4rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPngc59c621b1f5d2aea02293b4d01e5937e5426e505ae697ab18ec9ed4a3cb4e350.png) -2rpx -2rpx
no-repeat;
}
}
.TextGroup5 {
height: 28rpx;
margin-top: 4rpx;
width: 40rpx;
.info11 {
width: 40rpx;
height: 28rpx;
overflow-wrap: break-word;
color: rgba(0, 110, 207, 1);
font-size: 20rpx;
font-family: PingFangSC-Medium;
text-align: left;
white-space: nowrap;
line-height: 28rpx;
display: block;
}
}
}
}
.ImageText5 {
height: 72rpx;
width: 40rpx;
.block7 {
width: 40rpx;
height: 72rpx;
.outer20 {
border-radius: 2px;
height: 40rpx;
border: 1px 0, 0 rgba(151, 151, 151, 1);
margin-left: 4rpx;
width: 32rpx;
.mod20 {
width: 24rpx;
height: 22rpx;
margin: 8rpx 0 0 4rpx;
.label1 {
width: 24rpx;
height: 2rpx;
}
.icon1 {
width: 14rpx;
height: 2rpx;
margin-top: 8rpx;
}
.icon2 {
width: 24rpx;
height: 2rpx;
margin-top: 8rpx;
}
}
}
.TextGroup6 {
height: 28rpx;
margin-top: 4rpx;
width: 40rpx;
.word24 {
width: 40rpx;
height: 28rpx;
overflow-wrap: break-word;
color: rgba(0, 0, 0, 1);
font-size: 20rpx;
text-align: left;
white-space: nowrap;
line-height: 28rpx;
display: block;
}
}
}
}
.layer16 {
width: 40rpx;
height: 72rpx;
.icon3 {
width: 20rpx;
height: 20rpx;
margin-left: 10rpx;
}
.group13 {
width: 32rpx;
height: 18rpx;
background: url(/static/lanhu_shouyedengluzhuangtai/SketchPng75eab42b94db0cddc30f434333d0ca3adbd1c053ee007fd0b39c6d7fb108c39c.png)
100% no-repeat;
margin: 2rpx 0 0 4rpx;
}
.word25 {
width: 40rpx;
height: 28rpx;
overflow-wrap: break-word;
color: rgba(0, 0, 0, 1);
font-size: 20rpx;
text-align: left;
white-space: nowrap;
line-height: 28rpx;
margin-top: 4rpx;
display: block;
}
}
}
}
}
</style>