page { background-color: #fff; } .header { display: flex; align-items: center; position: relative; z-index: 1; } .header_tit { flex: 1; text-align: center; position: relative; z-index: 0; } .header .u-icon { position: relative; z-index: 2; padding: 20rpx; margin-left: 10rpx; } .local { display: flex; align-items: center; font-size: 26rpx; color: #222222; box-sizing: border-box; padding: 20rpx; width: 100%; background-color: #fff; } #local { height: 30rpx; width: 28.08rpx; margin-right: 17rpx; } .u-icon { margin-left: 10rpx; } .search { background-color: #f6f7fb; padding: 20rpx 0; } .searchBox { width: 710rpx; height: 70rpx; background: #FFFFFF; border-radius: 100rpx 100rpx 100rpx 100rpx; margin: 0 auto; display: flex; box-sizing: border-box; align-items: center; padding-left: 30rpx; padding-right: 30rpx; } .searchBox image { width: 30rpx; height: 30rpx; margin-right: 16rpx; } .swiperBox { height: 350rpx; width: 100%; position: relative; } .swiper { height: 350rpx; width: 100%; /* position: relative; */ } .navList { display: flex; flex-wrap: wrap; box-sizing: border-box; height: 350rpx; width: 100%; padding: 30rpx 20rpx; background-color: #fff; margin-top: 20rpx; } .navItem { display: flex; flex-direction: column; align-items: center; justify-content: center; width: 116rpx; height: 105rpx; margin-right: 34rpx; margin-bottom: 43rpx; } .navItemImg { width: 70rpx; height: 70rpx; display: flex; justify-content: center; align-items: center; } .navItem image { width: 70rpx; height: 70rpx; } .navItem:nth-child(5n) { margin-right: 0; } .dot { display: flex; align-items: center; justify-content: center; margin-top: 20rpx; position: absolute; left: 50%; bottom: 25rpx; transform: translateX(-50%); } .dotItem { width: 8rpx; height: 8rpx; border-radius: 50%; background-color: #E6E6E6; margin-right: 5rpx; } .actives { width: 20rpx; height: 8rpx; background: #FF370B; border-radius: 10rpx 10rpx 10rpx 10rpx; } .scrollBox { background-color: #f6f7fb; padding-bottom: 25rpx; padding-top: 20rpx; } .scrollView { display: flex; align-items: center; flex-wrap: nowrap; padding: 0 14rpx; } .scroll-viewItem { display: flex; white-space: nowrap; height: 54rpx; background: #FFFFFF; border-radius: 10rpx 10rpx 10rpx 10rpx; border: 1rpx solid #FFFFFF; padding: 10rpx 18rpx; margin-right: 10rpx; position: relative; display: flex; align-items: center; } .scroll-viewItem image { width: 22rpx; height: 22rpx; position: absolute; left: 7rpx; top: 5rpx; } .btnList { width: 389rpx; height: 119rpx; background: #FFFFFF; border-radius: 100rpx 100rpx 100rpx 100rpx; position: fixed; left: 50%; transform: translateX(-50%); bottom: 200rpx; display: flex; align-items: center; justify-content: center; z-index: 2; } .btnList_after { width: 389rpx; height: 119rpx; filter: blur(8.600000381469727rpx); background: rgba(0, 0, 0, 0.3); border-radius: 100rpx 100rpx 100rpx 100rpx; position: fixed; left: 50%; transform: translateX(-50%); bottom: 200rpx; border-radius: 100rpx 100rpx 100rpx 100rpx; } .btn_left { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 22rpx; color: #000000; } .btn_left image { width: 47.97rpx; height: 44.79rpx; margin-bottom: 6rpx; } .btn_right { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 22rpx; color: #000000; } .btn_right image { height: 47rpx; width: 47rpx; margin-bottom: 6rpx; } .line { width: 1rpx; height: 82rpx; border-image: linear-gradient(90deg, rgba(255, 255, 255, 1), rgba(215, 215, 215, 1), rgba(255, 255, 255, 1)) 1 1; } .lines { background-color: #f5f7f9; height: 40rpx; width: 100%; } .merchantList { padding: 0 20rpx; width: 100%; box-sizing: border-box; } .merchantItem { display: flex; padding-top: 30px; padding-bottom: 30rpx; border-bottom: 1rpx solid #EBEBEB; ; } .merchantItem_left { width: 180rpx; height: 180rpx; border-radius: 20rpx 20rpx 20rpx 20rpx; overflow: hidden; margin-right: 24rpx; } .merchantItem_left image { width: 100%; height: 100%; } .merchantItem_right { flex: 1; } .merchantItem_right_tit { display: flex; align-items: center; justify-content: space-between; } .merchantItem_right_tit_left { font-size: 30rpx; color: #222222; } .merchantItem_right_tit_right { font-size: 24rpx; color: #555555; } .merchantItem_right_con { margin-top: 14rpx; display: flex; align-items: center; justify-content: space-between; } .merchangtItem_tag { font-size: 22rpx; color: #555555; padding: 5rpx 12rpx; white-space: nowrap; background: rgba(255, 81, 42, 0.1); border-radius: 100rpx 100rpx 100rpx 100rpx; display: inline-block; margin-top: 20rpx; margin-right: 10rpx; } .startList { display: flex; align-items: center; } .startList image { width: 22rpx; height: 22rpx; margin-right: 3rpx; } .merchantItem_right_con_right { display: flex; flex-direction: column; align-items: center; justify-content: center; font-size: 26rpx; color: #000000; } .merchantItem_right_con_right image { width: 32rpx; height: 28.59rpx; margin-bottom: 6rpx; } .merchantItem_right_add { font-size: 24rpx; color: #999999; margin-top: 14rpx; } .empty { display: flex; flex-direction: column; justify-content: center; align-items: center; font-weight: normal; font-size: 28rpx; color: #999999; margin-top: 110rpx; width: 100%; } .empty image { width: 366rpx; height: 226rpx; margin-bottom: 27rpx; }