/* 漂浮窗 */ .wander { position: fixed; right: 0; top: 26%; background-color: #ffffff; border-radius: 60rpx 0 0 60rpx; height: 150rpx; width: 120rpx; } .wander::after { position: absolute; left: -15rpx; top: -15rpx; background-color: rgba(255, 255, 255, .3); content: ''; width: calc(100% + 30rpx); height: calc(100% + 30rpx); z-index: 0; border-radius: 60rpx 0 0 60rpx; } .wander-cont { padding: 25rpx 25rpx 25rpx 35rpx; box-sizing: border-box; position: absolute; z-index: 2; width: 100%; height: 100%; left: 0; top: 0; text-align: center; } .wander-icon { width: 54rpx; } .wander-name { color: #12428f; padding-top: 5rpx; font-weight: 300; font-size: 26rpx; } /* 第一屏幕 */ .indexBack { position: relative; width: 100%; height: 100vh; } .indexBack-img { position: absolute; width: 100%; height: 100%; } .indexText { position: absolute; bottom: 30rpx; left: 0; text-align: center; width: 100%; } .indexText-name { color: #fff; display: inline-block; border-radius: 50rpx; text-shadow: 2rpx 2rpx 10rpx rgba(0, 0, 0, .3); font-size: 28rpx; } .indexText-arrow { width: 36rpx; height: 36rpx; display: block; margin: 15rpx auto 0; animation: bounce-down 2s linear infinite; } @keyframes bounce-down { 25% { transform: translateY(-4px); } 50%, 100% { transform: translateY(0); } 75% { transform: translateY(4px); } } /* 步骤提示 */ .indexSingle { width: 100%; } .indexSingle-img { width: 100%; display: block; } /* 按钮 */ .testBtn { text-align: center; } .testBtn-go { margin: 50rpx 0 100rpx; background-image: linear-gradient(to right, #3d7dfe, #6b9fff); border: 14rpx solid #bdd3ff; display: inline-block; color: #fff; line-height: 90rpx; width: 75%; border-radius: 110rpx; }