/* subpages/communitySelfInsp/pages/synthesis/synthesis.wxss */ page { width: 100%; min-height: 100vh; overflow-y: scroll; background-color: #f7f7f7; } .top20{ margin-top: 20rpx; } .header { width: 100%; height: 464rpx; /* position: fixed; top: 0; left: 0; z-index: 1000; */ overflow: hidden; } .blue{ color: #3A80E7 ; } .red{ color: #FF502E; } .header .header-bg { width: 100%; height: 444rpx; position: absolute; height: 100%; z-index: -997; } .header .navigation { width: 100%; display: flex; align-items: center; justify-content: center; color: #333333; font-size: 32rpx; position: relative; z-index: 100; } .gray{ color:#999 ; font-size: 28rpx; } .font32{ font-size: 32rpx; } .back{ width: 30rpx; height: 30rpx; margin-left: 20rpx; position: absolute; margin-top: 20rpx; border-radius: 0rpx; z-index: 101; } .header .content{ margin: 140rpx 0 0 69rpx; } .header .content .h2{ font-size: 44rpx; font-family: PingFang SC; font-weight: 800; color: #333333; margin-bottom: 40rpx; width: 330rpx; } .header .content .tag{ width: 170rpx; height: 50rpx; position: relative; line-height: 48rpx; font-size: 28rpx; font-family: PingFang SC; font-weight: 500; color: #FFFFFF; padding-left: 35rpx; } .header .content .tag image { width: 170rpx; height: 50rpx; position: absolute; top: 0; left: 0; z-index: -888; } .body{ padding: 0 20rpx; box-sizing: border-box; position: relative; top: -30rpx; overflow: hidden; } .body .top .bg{ position: absolute; top: 0; width: 100%; height: 200rpx; z-index: -996; } .body .top .top_box{ display: flex; justify-content: space-around; } .body .top .top_box>view{ width: 50%; height: 200rpx; display: flex; flex-direction: column; justify-content: center; align-items: center; position: relative; top: 20rpx; color: #666666; } .body .top .top_box>view b{ font-size: 50rpx; } .body .top .top_box>view .tagB, .body .top .top_box>view .tagR { position: relative; } .body .top .top_box>view .tagB::after{ display: inline-block; content: ''; width:18rpx; height: 18rpx; background-color: #3A80E7; position: absolute; left: -30rpx; top: 10rpx; } .body .top .top_box>view .tagR::after{ display: inline-block; content: ''; width:18rpx; height: 18rpx; background-color: #FF502E ; position: absolute; left: -30rpx; top: 10rpx; } .body .bto{ border-radius: 10rpx; background-color: #fff; padding: 30rpx; margin-top: 20rpx; } .body .bto .th .tr{ color: #333333; } .body .bto .tr{ display: flex; justify-content: space-around; align-items: center; height: 90rpx; color: #666666; } .body .bto .tr_bg{ background-color: #f0f5fd; } .body .bto .tr .td{ width: 25%; text-align: center; } .body .bto .tr .td image{ width: 24rpx; height: 24rpx; } .mask { background-color: rgba(0, 0, 0, 0.5); width: 100%; height: 100%; position: fixed; top: 0; left: 0; bottom: 0; right: 0; padding: 0 70rpx; box-sizing: border-box; display: flex; justify-content: center; align-items: center; } .mask .bg-box{ position: relative; width: 100%; min-height: 400rpx; display: flex; background-image: url('https://elink-esua-epdc.oss-cn-qingdao.aliyuncs.com/epmet/test/internal/20231007/e094eeeeb2e6406daa18530b648d973d.png'); background-size: 100% 100%; background-position: center; padding:90rpx 90rpx 60rpx; box-sizing: border-box; align-items: center; justify-content: center; flex-direction: column; } .bg-box .cancle{ position: absolute; right: -20rpx; top: -20rpx; width: 26rpx; height: 26rpx; } .bg-box .mask_btn{ padding:23rpx 60rpx; text-align: center; color: #fff; background: linear-gradient(87deg, #81B5FB 0%, #3E92FF 100%); border-radius:43rpx ; margin-top: 40rpx; } .bg-box .qrCodeImg{ border-radius: 20rpx; } .bto_btn{ display: flex; padding: 0 20rpx 30rpx; } .btn_blue , .btn_yellow{ border-radius: 40rpx; color: #fff; width: fit-content; padding:20rpx; font-size: 32rpx; font-family: PingFang SC; font-weight: bold; } .btn_blue{ background: linear-gradient(87deg, #81B5FB 0%, #3E92FF 100%); } .btn_yellow{ margin-left: 20rpx !important; background: linear-gradient(87deg, #ff793c 0%, #fb9d5b 100%); }