.page { background-color: rgba(248,248,248,1.000000); position: relative; height: 100vh; overflow: hidden; } .block_1 { display: flex; justify-content: center; position: absolute; width: 100%; left: 0; bottom: 200rpx; } .box_1 { flex-direction: row; display: flex; justify-content: space-between; } .text-wrapper_1 { background-color: rgba(238,238,238,1.000000); border-radius: 24rpx; margin-top: 44rpx; display: flex; flex-direction: column; padding: 32rpx 158rpx 32rpx 156rpx; } .text_1 { overflow-wrap: break-word; color: rgba(136,136,136,1); font-size: 32rpx; letter-spacing: 0rpx; font-family: PingFangSC-Regular; font-weight: normal; text-align: right; white-space: nowrap; line-height: 32rpx; } .image_1 { width: 100rpx; height: 100rpx; margin-bottom: 40rpx; } .block_2 { background-color: rgba(255,255,255,1.000000); width: 750rpx; margin-top: -2rpx; flex-direction: row; display: flex; justify-content: space-between; padding: 14rpx 98rpx 12rpx 102rpx; } .image-text_1 { display: flex; flex-direction: column; } .label_1 { width: 48rpx; height: 48rpx; } .text-group_1 { overflow-wrap: break-word; color: rgba(136,136,136,1); font-size: 20rpx; font-family: PingFangSC-Regular; font-weight: normal; text-align: right; white-space: nowrap; line-height: 20rpx; align-self: center; margin-top: 4rpx; } .image-text_2 { display: flex; flex-direction: column; } .label_2 { width: 48rpx; height: 48rpx; } .text-group_2 { overflow-wrap: break-word; color: rgba(136,136,136,1); font-size: 20rpx; font-family: PingFangSC-Regular; font-weight: normal; text-align: right; white-space: nowrap; line-height: 20rpx; align-self: center; margin-top: 4rpx; } .image-text_3 { display: flex; flex-direction: column; } .label_3 { width: 48rpx; height: 48rpx; } .text-group_3 { overflow-wrap: break-word; color: rgba(136,136,136,1); font-size: 20rpx; font-family: PingFangSC-Regular; font-weight: normal; text-align: right; white-space: nowrap; line-height: 20rpx; margin: 4rpx 6rpx 0 2rpx; } .image_2 { width: 750rpx; height: 68rpx; } .block_3 { position: absolute; width: 100%; left: 0rpx; top: 0rpx; background-size: 100% 100%; padding-bottom: 232rpx; display: flex; flex-direction: column; } .image_3 { position: absolute; width: 100%; height: 100%; top: 0; left: 0; z-index: 0; } .section_1 { width: 430rpx; flex-direction: row; display: flex; justify-content: space-between; margin: 12rpx 12rpx 0 308rpx; } .text_2 { overflow-wrap: break-word; color: rgba(0,0,0,1); font-size: 34rpx; font-family: PingFangSC-Medium; font-weight: 500; text-align: right; white-space: nowrap; line-height: 40rpx; margin-top: 8rpx; } .image_4 { width: 174rpx; height: 64rpx; } .section_2 { flex-direction: row; display: flex; margin: 36rpx 24rpx 0 32rpx; position: relative; z-index: 1; margin-top: 200rpx; } .image_5 { box-sizing: border-box; width: 120rpx; height: 120rpx; margin-bottom: 48rpx; background-color: rgba(255,255,255,0.5); // padding: 20rpx; border-radius: 120rpx; overflow: hidden; // border: 4rpx solid rgba(255,255,255,1); image{ width: 100%; height: 100%; } } .block_4 { display: flex; flex-direction: column; margin: 4rpx 0 0 24rpx; } .text-group_4 { display: flex; flex-direction: column; } .text_3 { overflow-wrap: break-word; color: rgba(34,34,34,1); font-size: 36rpx; font-family: Alibaba-PuHuiTi-M; font-weight: normal; white-space: nowrap; line-height: 36rpx; // margin-right: 330rpx; } .text_4 { overflow-wrap: break-word; color: rgba(34,34,34,1); font-size: 28rpx; font-family: Alibaba-PuHuiTi-R; font-weight: normal; text-align: left; white-space: nowrap; line-height: 28rpx; margin-top: 24rpx; } .text_5 { overflow-wrap: break-word; color: rgba(96,98,102,1); font-size: 24rpx; font-family: Alibaba-PuHuiTi-R; font-weight: normal; text-align: left; white-space: nowrap; line-height: 24rpx; // margin: -76rpx 170rpx 0 88rpx; } .group_1 { margin-top: 22rpx; // width: 270rpx; // background-color: rgba(208,15,22,0.100000); border-radius: 50rpx; border: 1px solid rgba(255,255,255,1); padding-left: 20rpx; // flex-direction: row; width: 340rpx; height: 50rpx; display: inline-flex; box-sizing: border-box; // width: auto; justify-content: space-between; // margin: 22rpx 82rpx 0 0; } .success{ background-color: rgba(43, 164, 113, 0.1); .text-wrapper_2{ background-color: rgba(43, 164, 113, 1);; } .text-group_5{ color: rgba(43, 164, 113); } .thumbnail_1{ color: rgba(43, 164, 113); } } .waring{ background-color: rgba(227, 115, 24, 0.1); .text-wrapper_2{ background-color: rgba(227, 115, 24, 1); } .text-group_5{ color: rgba(227, 115, 24, 1); } .thumbnail_1{ color: rgba(227, 115, 24, 1); } } .danger{ background-color: rgba(208, 15, 22, 0.1); .text-wrapper_2{ background-color: rgba(208, 15, 22, 1); } .text-group_5{ color: rgba(208, 15, 22, 1); } .thumbnail_1{ color: rgba(208, 15, 22, 1); } } .image-text_4 { // width: 188rpx; // margin: 8rpx 0 8rpx 0; margin-top: 4rpx; } .thumbnail_1 { color: rgba(212,48,48,1); // transform: translateY(-2rpx); margin-right: 8rpx; // vertical-align: middle; } .text-group_5 { color: rgba(212,48,48,1); font-size: 24rpx; font-family: Alibaba-PuHuiTi-R; line-height: 26rpx; transform: translateY(-4rpx); } .text-wrapper_2 { border-radius: 28rpx; border: 1px solid rgba(255,255,255,1); display: flex; width: 80rpx; // height: 60rpx; align-items: center; justify-content: center; margin-left: 12rpx; } .text_6 { overflow-wrap: break-word; color: rgba(255,255,255,1); font-size: 24rpx; font-family: Alibaba-PuHuiTi-R; font-weight: normal; text-align: left; white-space: nowrap; line-height: 24rpx; } .label_4 { position: absolute; font-size: 44rpx; right: 0; top: 28rpx; } .section_3 { background-color: rgba(255,255,255,1.000000); border-radius: 16rpx; position: absolute; left: 24rpx; top: 408rpx; width: 702rpx; // height: 210rpx; display: flex; flex-direction: column; } .block_5 { background-color: rgba(255,255,255,0.010000); flex-direction: row; display: flex; justify-content: space-between; padding: 38rpx 32rpx 32rpx 32rpx; } .image-text_5 { width: 192rpx; flex-direction: row; display: flex; justify-content: space-between; } .thumbnail_2 { width: 40rpx; height: 40rpx; } .text-group_6 { overflow-wrap: break-word; color: rgba(51,51,51,1); font-size: 32rpx; letter-spacing: 0rpx; font-family: Alibaba-PuHuiTi-R; font-weight: normal; text-align: left; white-space: nowrap; line-height: 32rpx; margin-top: 4rpx; } .thumbnail_3 { margin: 4rpx 0 4rpx 0; // margin-right: 60rpx; font-size: 40rpx; opacity: 0.3; transform: translateY(-6rpx); } .block_6 { background-color: rgba(248,248,248,1.000000); height: 2rpx; width: 90%; margin-left: 5%; z-index: 1; position: absolute; top: 50%; left: 0; } .block_7 { background-color: rgba(255,255,255,0.010000); flex-direction: row; display: flex; justify-content: space-between; padding: 38rpx 32rpx 32rpx 32rpx; position: relative; z-index: 0; } .image-text_6 { width: 192rpx; flex-direction: row; display: flex; justify-content: space-between; } .thumbnail_4 { width: 40rpx; height: 40rpx; } .text-group_7 { overflow-wrap: break-word; color: rgba(51,51,51,1); font-size: 32rpx; letter-spacing: 0rpx; font-family: Alibaba-PuHuiTi-R; font-weight: normal; text-align: left; white-space: nowrap; line-height: 32rpx; margin-top: 4rpx; } .thumbnail_5 { width: 32rpx; height: 32rpx; margin: 4rpx 0 4rpx 0; } .noLogin{ transform: translateY(36rpx); } .emergency-access { position: fixed; right: 24rpx; bottom: 80rpx; width: 100rpx; height: 100rpx; z-index: 9999; border-radius: 120rpx; display: flex; align-items: center; justify-content: center; background: linear-gradient( 152deg, #FF7954 0%, #D43030 100%); box-shadow: 0rpx 2rpx 20rpx 0rpx rgba(236,89,68,0.21); text{ color: #fff; font-size: 48rpx; } }