/* pages/tabber/home/index.wxss */ page{ padding-bottom: 50rpx; } .infoBoxs{ position: fixed; width: 512rpx; height: 153rpx; z-index: 20; } .infoBoxs .close{ width: 30rpx; height: 30rpx; border: 1px solid red; position: absolute; right: 40rpx; top: 50rpx; } .topBg { width: 750rpx; height: 536rpx; position: relative; z-index: 1; } .topBg .contioner { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); } .topBg .contioner .tit { color: #191C27; width: 240rpx; height: 60rpx; display: block; margin: auto; } .topBg .contioner .tips { margin: 30rpx auto; font-size: 32rpx; color: #191C27; letter-spacing: 6rpx; } .shoppingBoxs { width: 702rpx; height: 168rpx; background: #FFFFFF; box-shadow: 0px 10rpx 16rpx 0px rgba(17, 48, 105, 0.04), 0px -10px 16px 0px rgba(17, 48, 105, 0.04); border-radius: 12rpx; position: absolute; left: 50%; bottom: -15%; transform: translate(-50%, 0%); padding: 24rpx; } .shoppingBoxs .le .content { line-height: 48rpx; display: flex; flex-direction: column; margin-left: 25rpx; } .shoppingBoxs .le .content .tit { font-size: 28rpx; font-weight: 500; color: #191C27; } .shoppingBoxs .le .content .message { font-size: 24rpx; color: #999999; } .shoppingBoxs .le .content .tags { font-size: 22rpx; color: #4699FF; height: 30rpx; width: 78rpx; background: #E8F2FF; border-radius: 2rpx; text-align: center; line-height: 30rpx; } .shoppingBoxs .le .pic { width: 120rpx; height: 120rpx; } .shoppingBoxs .lr { position: relative; width: 100rpx; } .shoppingBoxs .lr::before { content: ''; display: block; width: 2rpx; height: 100%; background: #E9E9E9; position: absolute; left: 0; top: 0; } .shoppingBoxs .lr .icon { width: 40rpx; height: 40rpx; display: block; margin: auto; } .shoppingBoxs .lr .tips { font-size: 24rpx; color: #666666; text-align: center; margin-top: 10rpx; } .mainBoxs { padding: 120rpx 65rpx; } .mainBoxs .mainItem .icon { width: 48rpx; height: 48rpx; display: block; margin: auto; } .mainBoxs .mainItem .text { font-size: 24rpx; text-align: center; color: #191C27; margin-top: 15rpx; } .btns { margin: auto; width: 686rpx; height: 98rpx; box-shadow: 0px 10rpx 20rpx 0px rgba(35, 107, 248, 0.2); border-radius: 49rpx; text-align: center; line-height: 98rpx; font-size: 32rpx; font-weight: 500; position: relative; } .btns.skyBlue { background: linear-gradient(270deg, #467FFF 0%, #4699FF 100%); color: #FFFFFF; } .btns.gray { color: #FFFFFF; background: #CCCCCC; } .btns .tips { height: 38rpx; background: #FF663D; border-radius: 19rpx 19rpx 19rpx 0px; position: absolute; right: 0; top: -20rpx; font-size: 22rpx; color: #FFFFFF; padding: 0 8rpx; } .footerBoxs { width: 700rpx; height: 110rpx; position: relative; margin: 80rpx auto; padding: 0 20rpx; } .footerBoxs .bag { width: 80rpx; height: 80rpx; } .footerBoxs .le .tit { font-size: 28rpx; font-weight: 500; color: #191C27; } .footerBoxs .le .tit text { color: #FF663D; } .footerBoxs .le .dot { width: 24rpx; height: 24rpx; } .footerBoxs .lr { width: 136rpx; height: 48rpx; background: #FF663D; border-radius: 25rpx; color: #fff; line-height: 48rpx; text-align: center; font-size: 24rpx; font-weight: 500; color: #FFFFFF; } .footerTips { position: fixed; z-index: 10; left: 0; bottom: 0; width: 750rpx; height: 104rpx; background: #FDFCEC; padding: 0 24rpx; } .footerTips .tips { width: 32rpx; height: 32rpx; } .footerTips .message { font-size: 24rpx; color: #FF663D; line-height: 30rpx; width: 660rpx; }