page { background: #F3F3F3; color: #333; padding:30rpx 48rpx; } view,text{ box-sizing: border-box; color:#333; font-size: 28rpx; } .calc-btn{ width: 654rpx; height: 60rpx; background: #3D7FFF linear-gradient(270deg, rgba(0,202,255,0.5) 0%, rgba(9,175,255,0.5) 100%); border-radius: 60rpx; color: #FFFFFF; line-height: 60rpx; text-align: center; margin:40rpx 0; } .calc-result{ width: 654rpx; height: 196rpx; background: #FFFFFF; border-radius: 26rpx; display: flex; align-items: center; justify-content: space-between; margin-bottom:20rpx; } .result-item{ flex:1; display: flex; flex-direction: column; align-items:center; } .result-item image{ width:64rpx; height:64rpx; margin-bottom:10rpx; } .result-item .number{ font-size: 32rpx; height: 46rpx; line-height: 46rpx; } .result-item .desc{ color: #999999; line-height: 28rpx; font-size: 20rpx; line-height:28rpx ; } .calc-item{ display: flex; align-items: center; margin-bottom:10rpx; height:40rpx; } .calc-tip{ color:#FF4D4F; padding-top:10rpx; } .calc-title{ font-size: 30rpx; margin:0 16rpx 0 6rpx; } .select-result{ background: #FFFFFF; border-radius: 8rpx; border: 1rpx solid #D9D9D9; width:280rpx; height: 44rpx; line-height: 42rpx; font-size: 20rpx; padding-left:14rpx; } .schedule-block{ width: 654rpx; background: #FFFFFF; border-radius: 24rpx; padding:28rpx 8rpx 54rpx 16rpx; } .schedule-detail{ display:flex; } .detail-left{ display: flex; flex-direction: column; align-items: flex-end; } .detail-left .month{ height: 40rpx; line-height: 40rpx; margin-bottom:4rpx; } .detail-left .amount{ color: #999999; line-height: 30rpx; font-size: 22rpx; } .detail-link{ width:44rpx; display: flex; flex-direction: column; align-items: center; padding-top:16rpx; margin-bottom:-16rpx; } .detail-link .circle{ width: 14rpx; height: 14rpx; background: #FFFFFF; border: 1rpx solid #E5E5E5; border-radius: 14rpx; } .detail-link .line{ margin-top:6rpx; width: 2rpx; height: 135rpx; background: #E5E5E5; border-radius: 1rpx; } .detail-right{ flex:1; display: flex; flex-wrap: wrap; margin-left:-20rpx; } .detail-right .date-item{ width:110rpx; text-align: center; margin-bottom:16rpx; } .date-item .date{ color: #42C056; line-height: 42rpx; height: 42rpx; margin-bottom:8rpx; font-size: 30rpx; font-weight: 600; } .date-item .date-tips{ color: #999999; line-height: 24rpx; line-height: 24rpx; font-size:18rpx; } .date-item .date.isOther{ color:#333; } .date-item .date.isNone{ color: #FA7878; } .date-item .date-tips.isNone{ color: #C06969; }