.community-box { display: flex; flex-direction: column; align-items: center; justify-content: center; } .community-content { width: 620rpx; background: #fff; border-radius: 10rpx; position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-start; margin: 30px auto; overflow: hidden; z-index: 1001; } .community-content-title { position: relative; font-size: 30rpx; width: 100%; box-sizing: border-box; text-align: center; padding: 20rpx; } .community-content-change { color: #4facfe; margin-left: 15rpx; } .community-content-tip { color: #666; font-size: 32rpx; line-height: 1.6; padding: 20rpx; } .community-content-tip .item { border: 1rpx solid #ccc; padding: 10rpx; margin-bottom: 20rpx; border-radius: 10rpx; } .community-content-tip .item-l { min-width: 110rpx; max-width: 150rpx; text-align: center; } .community-content-tip .item-l .type { font-size: 24rpx; background-color: #4facfe; color: #fff; border-radius: 3px; padding: 3rpx 5rpx; } .community-content-tip .item-l .type.green { background-color: green; } .community-content-tip .item-r { flex: 1; margin-left: 5px; } .community-content-tip .item-ft { width: 20rpx; } .community-content-tip .item-ft .img { width: 20rpx; } .community-content-tip .item { display: flex; align-items: center; } .community-content-tip .img { width: 80rpx; height: 80rpx; border-radius: 50%; } .community-content-tip .name { font-weight: bold; color: #333; } .community-content-tip .address { color: #999; font-size: 28rpx; } .community-box .closeBtn { width: 80rpx; height: 80rpx; margin: 0 auto; } .distance { font-size: 24rpx; color: #f75451; font-weight: normal; }