.navigation{ position: fixed; top: 0; left: 0; z-index: 99; width: 100%; height: 90rpx; background-color: transparent; transition: .2s; } .navigation.active { background-color: transparent; } .navigation-arrow { width: 44rpx; height: 44rpx; margin: 20rpx 15rpx 0 20rpx; } /* 兑换 */ .recruit-title { width: 100%; } .recruit, .clockIn { margin: 10rpx 0; position: relative; width: 100%; z-index: 9; } .recruit-back { position: absolute; left: 0; top: 0; width: 100%; } .recruit-cont { width: 100%; position: absolute; left: 0; top: 0; } .recruit-padding { padding: 0 30rpx; box-sizing: border-box; } .recruit-block { background-color: #5390f4; border-radius: 50rpx; padding: 20rpx; box-sizing: border-box; margin: 30rpx 0 50rpx; } .recruit-border { border: 4rpx solid #000000; border-radius: 50rpx; padding: 30rpx 20rpx; box-sizing: border-box; } .goodsCont-item { position: relative; overflow: hidden; width: 100%; padding-top: 100%; } .goodsCont-item-back, .goodsCont-item-cont { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .goodsCont-item-photo { width: 100%; display: block; } .goodsCont-item-price { position: relative; padding-top: 15%; } .goodsCont-item-price-back, .goodsCont-item-price-cont { position: absolute; left: 0; top: 0; width: 100%; height: 100%; } .goodsCont-item-price-back { display: block; } .goodsCont-item-price-cont { padding: 14rpx 40rpx; box-sizing: border-box; display: flex; } .goodsCont-item-price-text { font-size: 22rpx; } .goodsCont-item-price-left { flex: 1; line-height: 64rpx; font-weight: 600; } .goodsCont-item-price-white { color: #ffffff; } .goodsCont-item-price-number { font-size: 24rpx; } .goodsCont-item-price-number text { font-weight: 600; font-size: 40rpx; padding-left: 6rpx; } .goodsCont-item-price-right { width: 26%; text-align: center; line-height: 66rpx; } .recruit-bottom { position: relative; height: 180rpx; } .recruit-bottom-img { position: absolute; left: 0; bottom: 0; width: 100%; display: block; } .recruit-bottom-text { position: absolute; left: 0; bottom: 40rpx; width: 100%; z-index: 9; color: #ffffff; text-align: center; font-size: 28rpx; } .recruit-btn { position: relative; margin: 60rpx 0 100rpx; height: 100rpx; } .recruit-btn-img, .recruit-btn-text { position: absolute; left: 0; top: 0; width: 100%; } .recruit-btn-text { color: #ffffff; text-align: center; line-height: 100rpx; font-size: 34rpx; } .siteTop { color: #ffffff; display: flex; line-height: 80rpx; padding: 0 20rpx; box-sizing: border-box; font-size: 34rpx; } .siteTop-img { width: 48rpx; margin: 15rpx 30rpx 0 0; } .siteTop-name text { font-size: 36rpx; margin-right: 40rpx; display: inline-block; } .siteText { font-size: 30rpx; padding: 0 100rpx; box-sizing: border-box; color: #ffffff; line-height: 50rpx; opacity: .92; position: relative; margin-bottom: 15rpx; } .siteTop-arrow { position: absolute; top: 0; width: 34rpx; right: 20rpx; } /* 弹出 */ .refertoEject { position: fixed; width: 100vw; height: 100vh; left: 0; top: 0; background-color: rgba(0, 0, 0, .6); z-index: 1000; display: none; } .refertoEject.active { display: block; } .refertoCont { -webkit-box-orient: vertical; -webkit-box-pack: center; position: fixed; left: 0; right: 0; top: 0; bottom: 0; z-index: 10000; padding: 0 10%; box-sizing: border-box; text-align: center; display: none; } .refertoCont.active { display: -webkit-box; } .refertoCont-name { width: 100%; text-align: center; margin-top: -50rpx; margin-bottom: 60rpx; } .refertoCont-name text { display: inline-block; background-color: #84c83a; color: #ffffff; line-height: 84rpx; border-radius: 100rpx; padding: 0 60rpx; font-weight: 600; box-shadow: 0 4rpx 10rpx rgba(83, 134, 24, 1); } .refertoCont-close { width: 68rpx; display: block; margin: 0 auto; }