.topBg { top: 0; left: 0; width: 100%; height: auto; } .vipC { padding-bottom: calc(180rpx + env(safe-area-inset-bottom)); } .vipC .vipInfoC { margin: 0 25rpx; } .vipC .vipInfoC .bg { width: 100%; height: auto; } .vipC .vipInfoC .infoC { top: 130rpx; left: 38rpx; } .vipC .vipInfoC .infoC .title { font-size: 40rpx; font-weight: bold; color: #556B87; } .vipC .vipInfoC .infoC .tips { font-size: 28rpx; font-weight: 500; color: #65758A; } .vipC .vipInfoC .infoC.vip .title { color: #AB3D1A; } .vipC .vipInfoC .infoC.vip .tips { color: #AB3D1A; } .vipC .vipProfitIntroC { background-color: white; margin-top: -70rpx; padding-top: 40rpx; border-radius: 20rpx 20rpx 0 0; } .vipC .vipProfitIntroC .titleC .icon { width: 54rpx; height: auto; } .vipC .vipProfitIntroC .titleC .title { margin: 0 20rpx; font-size: 50rpx; font-weight: bold; color: #222; } .vipC .vipProfitIntroC .titleC.research { margin-top: 50rpx; } .vipC .vipProfitIntroC .titleC.decision { margin-top: 30rpx; } .vipC .vipProfitIntroC .titleC.privilege { margin-top: 40rpx; } .vipC .vipProfitIntroC .subtitle { font-size: 24rpx; color: #888; text-align: center; } .vipC .vipProfitIntroC .stepC { margin: 16rpx 25rpx 0; } .vipC .vipProfitIntroC .stepC .num { background-color: #EDEEF1; margin-right: 25rpx; width: 50rpx; line-height: 50rpx; border-radius: 50%; font-size: 24rpx; font-weight: bold; color: #5C6473; text-align: center; } .vipC .vipProfitIntroC .stepC .step { font-size: 24rpx; color: #5C6473; } .vipC .vipProfitIntroC .stepC .step .impormant { font-weight: bold; } .vipC .vipProfitIntroC .stepC .step .impormant.vip { color: #F97316; } .vipC .vipProfitIntroC .picList { padding: 0 25rpx; margin-top: 34rpx; } .vipC .vipProfitIntroC .picList .pic { margin-right: 20rpx; } .vipC .vipProfitIntroC .picList .pic .icon { width: 100%; height: auto; } .vipC .vipProfitIntroC .picList .pic:last-child { margin-right: 0; } .vipC .vipProfitIntroC .questionC { margin-top: 40rpx; } .vipC .vipProfitIntroC .questionC .title { font-size: 45rpx; font-weight: bold; color: #222; text-align: center; } .vipC .vipProfitIntroC .questionC .iconListC { margin-top: 46rpx; padding: 0 23rpx 0 59rpx; } .vipC .vipProfitIntroC .questionC .iconListC .icon { margin-right: 56rpx; width: 235rpx; height: auto; } .vipC .vipProfitIntroC .questionC .iconListC .list .item { background-color: #EDEDED; margin-bottom: 15rpx; line-height: 70rpx; border-radius: 35rpx; font-size: 24rpx; color: #555; text-align: center; } .vipC .vipProfitIntroC .questionC .iconListC .list .item.vip { background-color: #FFEBDB; color: #F97316; } .vipC .vipProfitIntroC .introC { display: flex; box-shadow: 0px 0px 9rpx 0px rgba(0, 0, 0, 0.1); margin: 24rpx 25rpx 0; padding: 40rpx 20rpx 20rpx 33rpx; line-height: 1.5rem; border-radius: 10rpx; font-size: 24rpx; color: #555; } .vipC .vipProfitIntroC .introC .icon { margin-top: 92rpx; width: 251rpx; height: auto; } .vipC .vipProfitIntroC .introC.operatingDecision { padding-bottom: 11rpx; } .vipC .vipProfitIntroC .introC.operatingDecision .icon { margin-top: 116rpx; width: 249rpx; height: auto; } .vipC .vipProfitIntroC .privilegeList { margin: 24rpx 25rpx 0; padding: 20rpx 0; box-shadow: 0px 0px 9rpx 0px rgba(0, 0, 0, 0.1); border-radius: 10rpx; } .vipC .vipProfitIntroC .privilegeList .item { padding: 20rpx 0; width: calc(100%/3); } .vipC .vipProfitIntroC .privilegeList .item .icon { margin-bottom: 10rpx; width: 91rpx; height: auto; } .vipC .vipProfitIntroC .privilegeList .item .title { font-size: 26rpx; font-weight: bold; color: #242323; } .vipC .vipProfitIntroC .privilegeList .item .tips { margin-top: 6rpx; font-size: 22rpx; color: #555; } .vipC .vipProfitIntroC .privilegeList.vip { box-shadow: 0px 0px 9px 0px rgba(249, 115, 22, 0.4); } .vipC .vipProfitIntroC .bottomTitle { margin-top: 80rpx; font-size: 45rpx; font-weight: bold; color: #222; text-align: center; } .vipC .vipProfitIntroC .bottomTips { font-size: 24rpx; color: #888; text-align: center; } .lookMealC { background-color: #F97316; margin: 0 25rpx; left: 0; right: 0; bottom: calc(20rpx + env(safe-area-inset-bottom)); line-height: 80rpx; border-radius: 20rpx; font-size: 26rpx; font-weight: 500; color: white; text-align: center; }