.banner{ width: 100%; margin: 0upx auto 30upx; position: relative; } .swiper, .swiper image{ width: 100%; height: 700upx; } .backLeft{ position: fixed; width: 60upx; height: 60upx; left: 30upx; top: 30upx; z-index: 999; } .bannerIndex{ display: flex; justify-content: center; align-items: center; position: absolute; right: 10upx; bottom: 10upx; z-index: 999; font-size: 26upx; background-color: black; color: #ffffff; padding: 10upx 22upx; border-radius: 50upx; opacity: .8; } .gTitle{ padding: 10upx 20upx; position: relative; } .collect{ position: absolute; right: 30upx; bottom: 14upx; width: 52upx; height: 52upx; } .collect image{ width: 100%; height: 100%; } .gTitle view:nth-child(1){ font-size: 30upx; font-weight: 700; margin-bottom: 20upx; } .gTitle view:nth-child(2){ font-size: 26upx; display: flex; align-items: center; } .gTitle view text:nth-child(1), .gTitle view text:nth-child(2){ color: #F75451; font-weight: 700; } .gTitle view text:nth-child(2){ font-size: 36upx; margin: 0 10upx 0 10upx; } .gInfo-title{ width: 100%; text-align: center; font-size: 30upx; font-weight: 700; margin: 50upx 0 20upx; } .gInfo{ padding-bottom: 110upx; font-size: 28upx; } .gBtn{ width: 100%; height: 100upx; position: fixed; left: 0; display: flex; bottom: 0; z-index: 99; background-color: #ffffff; border-top: 1px solid #f5e2e2; font-size: 24upx; } .gBtn image{ width: 44upx; height: 44upx; margin: 0 auto; display: block; } .gBtn .gBtn-view{ display: flex; justify-content: center; align-items: center; } .gBtn-view{ width: 20%; } .gBtn-buy{ width: 60%; display: flex; justify-content: center; align-items: center; } .gBtn-buy text{ width: 88%; height: 78upx; border-radius: 50upx; background-color: #4766FE; color: #ffffff; display: flex; justify-content: center; align-items: center; font-size: 30upx; letter-spacing: 5upx; }