.main.data-v-55aaaa9b { height: 100vh; width: 100%; position: relative; } .main .leftArrow.data-v-55aaaa9b { width: 24px; height: 24px; position: absolute; left: 16px; z-index: 99999999999; } .main .leftArrow .img.data-v-55aaaa9b { width: 100%; height: 100%; } .main .mapBox.data-v-55aaaa9b { position: absolute; top: 0; left: 0; width: 100%; height: 40vh; } .main .mapBox .map.data-v-55aaaa9b { width: 100%; height: 40vh; } .main .mapBox .ydBox.data-v-55aaaa9b { width: 40px; height: 40px; background: #fff; border-radius: 50%; position: absolute; bottom: 40px; left: 16px; display: flex; align-items: center; justify-content: center; } .main .mapBox .ydBox .ydIcon.data-v-55aaaa9b { width: 30px; height: 30px; } .main .list.data-v-55aaaa9b { width: 100%; height: calc(60vh + 20px); box-sizing: border-box; -webkit-transform: translateY(-20px); transform: translateY(-20px); background: #f2f4f5; position: absolute; top: 40vh; } .main .list .top.data-v-55aaaa9b { width: 100%; height: 74px; padding: 0 16px; box-sizing: border-box; background: #fff; box-shadow: 0 4px 4px 0 rgba(22,0,2,0.04); } .main .list .top .topImg.data-v-55aaaa9b { display: flex; justify-content: center; } .main .list .top .topImg .packUp.data-v-55aaaa9b { width: 26px; height: 5px; margin-top: 8px; } .main .list .top .search.data-v-55aaaa9b { width: 100%; height: 36px; background: #f2f4f5; border-radius: 4px; margin-top: 13px; box-sizing: border-box; padding: 8px 24rpx; display: flex; align-items: center; } .main .list .top .search .left.data-v-55aaaa9b { width: 40%; position: relative; } .main .list .top .search .left .pick .box.data-v-55aaaa9b { display: flex; align-items: center; } .main .list .top .search .left .pick .box .picker.data-v-55aaaa9b { font-size: 14px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #160002; line-height: 20px; } .main .list .top .search .left .pick .box .selectIcon.data-v-55aaaa9b { width: 15px; height: 15px; margin-left: 6px; } .main .list .top .search .left.data-v-55aaaa9b:after { content: ''; width: 2px; height: 20px; position: absolute; right: 0; top: 0; background: #e1dfdf; } .main .list .top .search .right.data-v-55aaaa9b { width: 100%; } .main .list .top .search .right .searchText.data-v-55aaaa9b { font-size: 14px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #a69e9f; line-height: 20px; } .main .list .serviceList.data-v-55aaaa9b { width: 100%; height: calc(100% - 90px); box-sizing: border-box; padding: 0 16px; overflow-y: auto; background: #fff; } .main .list .serviceList .serviceItem.data-v-55aaaa9b { width: 100%; padding: 12px; box-sizing: border-box; background: #fff; border-radius: 8rpx; border: 2rpx solid #f5f6f7; margin-bottom: 12px; } .main .list .serviceList .serviceItem .topItem.data-v-55aaaa9b { display: flex; justify-content: space-between; align-items: center; } .main .list .serviceList .serviceItem .topItem .leftItem.data-v-55aaaa9b { display: flex; align-items: center; } .main .list .serviceList .serviceItem .topItem .leftItem .title.data-v-55aaaa9b { font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 32rpx; color: #130f05; line-height: 44rpx; text-align: left; font-style: normal; margin-right: 12rpx; } .main .list .serviceList .serviceItem .topItem .leftItem .typeBox.data-v-55aaaa9b { background: #fef7e5; border-radius: 8rpx; padding: 0 8rpx; font-size: 24rpx; font-family: PingFangSC, PingFang SC; font-weight: 400; color: #ba922f; line-height: 40rpx; margin-left: 16rpx; } .main .list .serviceList .serviceItem .topItem .box.data-v-55aaaa9b { display: flex; align-items: center; } .main .list .serviceList .serviceItem .topItem .box .imgBox.data-v-55aaaa9b { width: 28px; height: 28px; margin-right: 16px; border-radius: 50%; background: #f5f6f7; display: flex; align-items: center; justify-content: center; } .main .list .serviceList .serviceItem .topItem .box .imgBox .icon.data-v-55aaaa9b { width: 32rpx; height: 32rpx; } .main .list .serviceList .serviceItem .distance.data-v-55aaaa9b { font-size: 12px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #786b6c; line-height: 18px; } .main .list .serviceList .serviceItem .distance .number.data-v-55aaaa9b { color: #d7000f; margin: 0 2px; } .main .list .serviceList .serviceItem .info.data-v-55aaaa9b { display: flex; align-items: center; margin-top: 4px; } .main .list .serviceList .serviceItem .info .time.data-v-55aaaa9b { font-size: 12px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #786b6c; line-height: 18px; } .main .list .serviceList .serviceItem .info .infoIcon.data-v-55aaaa9b { width: 24rpx; height: 24rpx; margin-right: 8rpx; } .main .list .serviceList .serviceItem .info .addressBox.data-v-55aaaa9b, .main .list .serviceList .serviceItem .info .time.data-v-55aaaa9b { display: flex; align-items: center; width: 100%; } .main .list .serviceList .serviceItem .info .addressBox .distance.data-v-55aaaa9b, .main .list .serviceList .serviceItem .info .time .distance.data-v-55aaaa9b { color: #130f05; margin-right: 4rpx; } .main .list .serviceList .serviceItem .info .addressBox .line.data-v-55aaaa9b, .main .list .serviceList .serviceItem .info .time .line.data-v-55aaaa9b { width: 1px; height: 24rpx; background: #e7e7e6; margin: 0 16rpx; } .main .list .serviceList .serviceItem .info .addressBox .address.data-v-55aaaa9b, .main .list .serviceList .serviceItem .info .time .address.data-v-55aaaa9b { font-size: 12px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #786b6c; line-height: 18px; } .main .list .serviceList .serviceItem .typeList.data-v-55aaaa9b { margin-top: 8px; display: flex; align-items: center; } .main .list .serviceList .serviceItem .typeList .typeItem.data-v-55aaaa9b { width: 40rpx; height: 40rpx; margin-right: 16rpx; } .main .list .serviceList .inBottom.data-v-55aaaa9b { width: 100%; display: flex; align-items: center; justify-content: center; } .main .list .serviceList .inBottom .bottomText.data-v-55aaaa9b { font-family: PingFangSC, PingFang SC; font-weight: 400; font-size: 26rpx; color: #d0d0d0; line-height: 40rpx; text-align: justify; font-style: normal; position: relative; padding: 6rpx 0; } .main .list .serviceList .inBottom .bottomText.data-v-55aaaa9b::after { content: ''; width: 30vw; height: 2rpx; background: #e0e0e0; position: absolute; left: -32vw; top: 50%; } .main .list .serviceList .inBottom .bottomText.data-v-55aaaa9b::before { content: ''; width: 30vw; height: 2rpx; background: #e0e0e0; position: absolute; right: -32vw; top: 50%; }