.fixed-top{ position: fixed; top: 0; left: 0; right: 0; padding: 0 30rpx 10rpx; background: #fff; } .fixed-tab{ padding: 30rpx 0; display: flex; overflow-x: auto; flex-wrap: wrap; } .tab-box{ flex-shrink: 0; width: 20%; text-align: center; padding: 0 10rpx; box-sizing: border-box; margin-bottom: 20rpx; } .tab-box image{ width: 80rpx; height: 80rpx; } .tab-title{ font-size: 30rpx; color: #242424; } .tab-box.active .tab-title{ color: #0956E0; } .select-tab{ display: flex; margin-bottom: 10rpx; } .select-box{ flex: 1; text-align: center; font-size: 32rpx; color: #122939; } .select-box.active{ color: #125CE1; } .venue{ margin-top: 420rpx; padding: 0 30rpx; } .venue-box{ box-shadow: 0px 2px 8px 0px rgba(35, 24, 21, 0.1); border-radius: 12rpx; border-radius:10rpx; overflow: hidden; margin-bottom: 15rpx; padding: 20rpx; background-color: #fff; } .venue-img, .venue-img image{ width: 220rpx; height: 155rpx; border-radius: 8rpx; } .venue-top{ padding-bottom: 25rpx; border-bottom: 1px solid #E5E5E5; display: flex; justify-content: space-between; } .venue-info{ width: 410rpx; } .name-distance{ display: flex; justify-content: space-between; height: 35rpx; line-height: 35rpx; } .name{ font-size: 32rpx; font-weight: bold; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .distance{ color: #999; font-size: 28rpx; } .time{ font-size: 28rpx; color: #122939; margin-top: 10rpx; } .time image{ width: 20rpx; height: 20rpx; } .select-area{ position: fixed; top: 0; bottom: 0; right: 0; left: 0; background: rgba(0,0,0,0.6); } .area-container{ background: #fff; padding: 15rpx 15rpx 0; font-size: 0; } .area-box{ display: inline-block; width: 32%; height: 60rpx; line-height: 60rpx; margin-bottom: 15rpx; margin-right: 2%; text-align: center; font-size: 30rpx; border: 1px solid #DDD; border-radius: 10rpx; box-sizing: border-box; padding: 0 10rpx; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .area-box.active{ border: #9F1512 1px solid; color: #9F1512; } .area-box:nth-child(3n){ margin-right: 0; } .position{ color: #999; font-size: 28rpx; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .venue-bottom{ padding-top: 20rpx; font-size: 28rpx; color: #122939; } .venue-bottom image{ width: 20rpx; height: 20rpx; }