/** * Web二雪 * 趁时光不老 努力活成自己想要成为的样子 */ .active_content { background-color: #fff; box-sizing: border-box; padding-bottom: 10rpx; } .active_cover { width: 100%; height: 300rpx; position: relative; overflow: hidden; padding-bottom: 0; } .active_cover_bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 0; } .active_type_icon { position: absolute; top: 0; left: 0; background-color: #ffcc00; color: #4a1900; padding: 4rpx 20rpx; border-radius: 10rpx 0 20rpx 0; font-size: 24rpx; z-index: 1; } .active_title { margin-top: 30rpx; padding: 0 30rpx; color: #333; font-weight: 600; font-size: 32rpx; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } .active_des { margin-top: 14rpx; padding: 0 30rpx; color: #666; font-size: 24rpx; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } .active_time { margin-top: 14rpx; /* padding: 0 10rpx; */ color: #666; font-size: 26rpx; /* overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; */ } .active_time image { width: 30rpx; position: relative; bottom: -6rpx; right: 0; margin-left: 30rpx; margin-right: 4rpx; } .active_line { margin: 20rpx 20rpx 0 20rpx; border-bottom: solid 1rpx #f7f7f7; } .active_bottom { display: flex; flex-direction: row; justify-content: space-between; align-items: center; box-sizing: border-box; font-size: 40rpx; font-weight: 600; color: #333; padding: 0 30rpx; margin-top: 20rpx; } .active_bottom span { color: #999; font-size: 24rpx; padding-left: 10rpx; font-weight: normal; } .active_detail { padding: 20rpx; background-color: #fff; margin-top: 20rpx; } .active_detail_html { padding: 20rpx; background-color: #fff; margin-top: 20rpx; width: 100%; box-sizing: border-box; overflow: hidden; padding-bottom: 150rpx; } .active_detail_html img { width: 100%; } .active_nav { color: #333; font-weight: 600; font-size: 32rpx; padding-bottom: 30rpx; } /* 立即报名 */ .active_now_act { margin-top: 20rpx; display: flex; flex-direction: row; justify-content: space-between; align-items: center; box-sizing: border-box; font-size: 34rpx; font-weight: 600; color: #333; background-color: #fff; padding: 20rpx 30rpx; position: fixed; bottom: 0; width: 100%; height: 120rpx; } .active_now_act span { margin-left: 60rpx; flex: 1; display: inline-block; background-color: #378fff; color: #fff; font-size: 30rpx; border-radius: 50rpx; padding: 20rpx 100rpx; text-align: center; font-weight: 600; } .acted span { background-color: #999; } .active_be_sure { width: 100%; height: 100%; position: fixed; top: 0; left: 0; display: flex; flex-direction: row; justify-content: center; align-items: center; box-sizing: border-box; z-index: 1; } .active_be_sure .bg { background-color: rgba(0, 0, 0, 0.6); position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 2; } .active_be_sure .content { width: 600rpx; background-color: #fff; position: relative; z-index: 3; border-radius: 20rpx; text-align: center; padding-bottom: 30rpx; } .active_be_sure .content .active_cover { width: 100%; height: 360rpx; border-radius: 20rpx 20rpx 0 0; } .active_be_sure .content .txt1 { font-size: 36rpx; font-weight: 600; color: #333; padding-top: 40rpx; } .active_be_sure .content .txt2 { padding-top: 20rpx; font-size: 24rpx; color: #999; } .active_be_sure .content .txt3 { font-size: 32rpx; color: #fff; background-color: #378fff; font-weight: 600; width: 70%; margin-left: 15%; box-sizing: border-box; padding: 20rpx 30rpx; border-radius: 50rpx; margin-top: 30rpx; } .active_be_sure .content .txt4 { font-size: 26rpx; color: #999; padding: 20rpx 30rpx; } img { max-width: 100%; }