page{ /* padding-top: 72rpx; */ background: #fff; } .headerFixed { width: 100%; height: auto; overflow: hidden; padding: 10rpx 0rpx 0rpx; position: sticky; top: 0rpx; left: 0rpx; background-color: #fff; z-index: 9; /* box-shadow: 0px 2rpx 2rpx 2rpx rgba(0, 0, 0, 0.01); */ } .filterTab { width: 100%; height: 70rpx; display: flex; box-sizing: border-box; padding: 0px 20rpx; } .filterleft { width: 80%; display: flex; align-items: center; } .filterleft > view { display: inline-block; padding: 0rpx 20rpx; height: 100%; line-height: 70rpx; font-size: 30rpx; font-weight: 700; } .activeItem { position: relative; } .activeItem::after { content: " "; width: 35rpx; height: 10rpx; background-color: #35D7FF; position: absolute; bottom: 0px; left: 50%; transform: translateX(-50%); border-radius: 5rpx; } .filterright { width: 20%; display: flex; align-items: center; justify-content: flex-end; } .filterinput { width: 95%; height: 80rpx; margin: 10rpx auto 10rpx; border: 2rpx solid #f2f2f2; border-radius: 40rpx; display: flex; align-items: center; box-sizing: border-box; padding: 0rpx 30rpx; } .filterinput > input { flex: 1; height: 100%; } .filterinput > view { width: 80rpx; text-align: right; border-left: 2rpx solid #f2f2f2; } .bwidth100 { width: 100%; height: 66rpx; position: fixed; top: 0; left: 0; z-index: 98; background-color: #FFFFFF; } .searchbox { width: 15%; height: 100%; float: left; display: flex; align-items: center; justify-content: center; position: relative; } .caseline { width: 2rpx; height: 36rpx; background-color: #DDDDDD; position: absolute; left: 0px; } .caseimg { top: 13rpx; width: 40rpx; height: 40rpx; } .progress { display: block; width: 85%; height: 66rpx; line-height: 66rpx; padding: 5rpx 0; box-shadow: 0px 4rpx 7rpx 0px rgba(62, 85, 255, 0.06); } .progress view { display: block; width: 46%; height: 56rpx; line-height: 56rpx; text-align: center; margin-right: 24rpx; } .progress view.nowordertit { color: #249EFB; } .publicpraisebox { padding: 0 20rpx 100rpx; } .progress-box-item { width: 100%; background-color: #fff; padding: 40rpx 0rpx; display: flex; overflow: hidden; border-radius: 8rpx; border-bottom: 2rpx solid #f2f2f2; } .progress-left { width: 260rpx; height: 200rpx; position: relative; border-radius: 15rpx; overflow: hidden; } .progress-left-text { position: absolute; width: 100%; height: 40rpx; background-color: rgba(0, 0, 0, 0.4); z-index: 2; bottom: 0rpx; color: #fff; font-size: 24rpx; text-align: center; line-height: 40rpx; } .progress-left-img { width: 100%; height: 100%; object-fit: cover; } .progress-right { flex: 1; display: inline-block; padding-left: 20rpx; overflow: hidden; } .progress-right-title, .progress-right-address { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .mtb10 { margin: 10rpx 0rpx; } .progress-right-area { width: 100%; overflow-x: auto; white-space: nowrap; padding: 4rpx 0rpx; } .progress-right-area > view { font-style: normal; display: inline-block; padding: 2rpx 10rpx 0rpx; background-color: #FFEDED; margin-right: 10rpx; color: #C66D59; border-radius: 4rpx; } .p-r-img1 { width: 40rpx; height: 40rpx; background-color: #EEF4FF; border-radius: 50%; display: flex; justify-content: center; align-items: center; } .p-r-img1 image { width: 20rpx; height: 20rpx; } .flex { display: flex; } .flex-sub { flex: 1; } .align-center { align-items: center; } .justify-between { justify-content: space-between; } .justify-end { justify-content: flex-end; } .p-r-img1 { width: 40rpx; height: 40rpx; background-color: #EEF4FF; border-radius: 50%; display: flex; justify-content: center; align-items: center; } .p-r-img1 image { width: 20rpx; height: 20rpx; } .fontw700 { font-weight: 700; } .font32 { font-size: 32rpx; } .font28 { font-size: 28rpx; } .font24 { font-size: 24rpx; } .font20 { font-size: 20rpx; } .font22 { font-size: 22rpx; } .colorCECECE { color: #CECECE; } .color424242 { color: #424242; } .color45ADFF { color: #45ADFF; } .color989898 { color: #989898; } .mt10 { margin-top: 10rpx; } .ml20 { margin-left: 20rpx; } .ml10 { margin-left: 10rpx; } .p-r-sc { display: block; width: 20rpx; height: 20rpx; margin-right: 8rpx; } .p-r-share { display: block; width: 20rpx; height: 20rpx; margin-right: 8rpx; } .p-r-sc { display: block; width: 20rpx; height: 20rpx; margin-right: 8rpx; } .uploadBuild { width: 80rpx; background-color: #249EFB; color: #fff; position: fixed; right: 0rpx; bottom: 40%; display: flex; flex-direction: column; align-items: center; justify-content: center; border-top-left-radius: 40rpx; border-bottom-left-radius: 40rpx; padding: 20rpx 0rpx; z-index: 9; } .uploadBuild > image { width: 40rpx; } .uploadBuild > view { writing-mode: vertical-lr; font-size: 28rpx; letter-spacing: 6rpx; margin-top: 5rpx; } .caselayerbox { display: block; width: 100%; height: 100%; background: transparent; position: fixed; z-index: 99; left: 0; bottom: 0; } .caselayer { display: block; width: 100%; max-height: 60%; position: absolute; top: 66rpx; left: 0; background-color: #FFFFFF; box-shadow: 0 -4rpx 20rpx 0 rgba(36, 158, 251, 0.23); border-radius: 10rpx 10rpx 0 0; overflow: hidden; /* padding-top: 70rpx; padding-bottom: calc(constant(safe-area-inset-bottom)) !important; /* ios < 11.2*/ /* padding-bottom: calc(env(safe-area-inset-bottom)) !important; */ /* ios >= 11.2*/ } .speechcraftfiltratetit { display: block; width: 100%; height: 88rpx; padding: 0 40rpx; box-sizing: border-box; background: #fff; } .speechcraftfiltratetit input { display: block; width: 540rpx; height: 66rpx; background: #F0F4F7; position: relative; top: 11rpx; border-bottom: 1px solid #bfbfbf; text-align: left; padding-left: 40rpx; box-sizing: border-box; border-radius: 33rpx; border-width: 0; } .speechcraftfiltratetit view { position: absolute; top: 0; right: 40rpx; line-height: 88rpx; font-size: 28rpx; }