H5_module/service/live/live - 副本.css

.top{width: 100%;}
.top image{width: 100%;}
.banner {overflow: hidden;position: relative;border-radius: 16rpx;margin: 15rpx 30rpx 30rpx;}
.banner .swiper, .banner .swiper image,.banner-img image {width: 100%;height: 276rpx;border-radius: 16rpx;overflow: hidden;}
.dots {align-items: center;justify-content: center;position: absolute;left: 0;right: 0;bottom: 20rpx;}
.dot {background: rgba(255,255,255,.7);width: 12rpx;height: 12rpx;border-radius: 6rpx;margin: 0 4rpx;transition: all .2s ease;}
.dot.active {background: #fff;width: 37rpx;}
.cons{position: relative;z-index: 5;}
.box{background: #fff;padding: 20rpx 0;margin: 0 30rpx 30rpx;border-radius: 20rpx;}
.title{font-size: 36rpx;color: #333;margin: 10rpx 30rpx 0;}
.more{font-size: 24rpx;color: #999;}
.more image{width: 16rpx;height: 27rpx;margin-left: 8rpx;}
.live-list{padding: 0 30rpx;}
.live-list .li{padding: 30rpx 0;border-bottom: 1rpx solid #EAECEE;align-items: flex-start;}
.live-list .li:last-child{border-bottom: none;}
.live-img{width: 250rpx;height: 170rpx;border-radius: 5rpx;overflow: hidden;position: relative;margin-right: 28rpx;}
.live-pic{width: 100%;height: 100%;}
.live-sta{position: absolute;top: 0;left: 0;height: 40rpx;background: linear-gradient(280deg, #E0C29A 0%, #FCF7F1 100%);font-size: 23rpx;color: #AB7E43;
border-radius: 2rpx 0 4rpx 0;padding: 0 14rpx;}
.live-sta image{width: 23rpx;height: 23rpx;margin-right: 5rpx;}
.live-sta.end{background: #D8D8D8;color: #666;}
.live-tit{font-size: 30rpx;color: #333;}
.live-bri{font-size: 24rpx;color: #999;margin-top: 12rpx;}
.live-bri text{color: var(--mina);}
.live-opt{margin-top: 35rpx;}
.userimg{width: 48rpx;height: 48rpx;border-radius: 50%;margin-right: 10rpx;}
.username{font-size: 24rpx;color: #555;}
.live-btn{margin-left: 20rpx;width: 138rpx;height: 50rpx;background: linear-gradient(90deg, #E0C29A 0%, #B18347 100%);border-radius: 50rpx;font-size: 24rpx;color: #fff;text-align: center;line-height: 50rpx;}
.act-list .li{border-bottom: 10rpx solid #F8F8F8;padding: 35rpx 30rpx 0;}
.act-list .li:last-child{border-bottom: none;}
.infos{padding-bottom: 22rpx;border-bottom: 1rpx solid #E8E8E8;}
.imgbox{width: 270rpx;height: 174rpx;border-radius: 6rpx;overflow: hidden;position: relative;margin-right: 25rpx;}
.imgbox image{width: 100%;height: 100%;border-radius: 6rpx;}
.tag{display: block;height: 30rpx;border-radius: 6rpx 15rpx 15rpx 0;font-size: 20rpx;color: #fff;padding: 0 15rpx;position: absolute;top: 0;left: 0;background: #31a8fa;line-height: 30rpx;}
.act-tit{font-size: 28rpx;color: #00;line-height: 38rpx;height: 76rpx;margin-bottom: 65rpx;}
.area{font-size: 24rpx;color: #999;}
.area text{margin-right: 10rpx;}
.money{font-size: 30rpx;color: #FF1919;}
.money text{font-size: 18rpx;}
.stas{padding: 19rpx 0;}
.tag-box{font-size: 24rpx;color:#999;/* line-height: 56rpx; */}
.tag-box text{margin-right: 15rpx;}
.act-btn{width: 160rpx;height: 56rpx;background: linear-gradient(90deg, #E0C29A 0%, #B18347 100%);border-radius: 28rpx;font-size: 26rpx;color: #fff;text-align: center;line-height: 56rpx;}


.tab{padding: 0 30rpx 30rpx;margin-top: 20rpx;}
.tab .li{height: 48rpx;background: #F7F7F7;border-radius: 24rpx;font-size: 24rpx;color: #000;padding: 0 19rpx;margin-right: 25rpx;line-height: 48rpx;}
.tab .li:last-child{margin-right: 0;}
.tab .li.active{background: var(--mina);color: #fff;}
.course-list{padding: 0 30rpx;flex-wrap: wrap;}
.course-list .li{width: 300rpx;margin: 0 30rpx 30rpx 0;}
.course-list .li:nth-child(2n){margin-right: 0;}
.course-pic{border-radius: 5rpx;width: 100%;height: 204rpx;}
.course-tit{font-size: 30rpx;color: #333;margin-top: 15rpx;}
.course-bri{font-size: 24rpx;color: #999;margin-top: 10rpx;}
.course-price{font-size: 36rpx;color: #FE0419;margin-top: 15rpx;}
.course-price text{font-size: 24rpx;}