.Box{ min-height: 100vh; } #myVideo{ width: 100%; height: 420rpx; position: relative; } .rich_text{ width: 100%; height: 100%; } .rich_text p{ width: 100%; } .coverPay{ /* width: 200rpx; */ padding: 0 20rpx; height: 90rpx; line-height: 90rpx; text-align: center; border-radius: 40rpx; background-color: #07E881; color: #ffffff; position: absolute; left: 40%; top: 293rpx; z-index: 1000000; } .noCoverPay{ /* width: 200rpx; */ padding: 0 20rpx; height: 90rpx; line-height: 90rpx; text-align: center; border-radius: 40rpx; background-color: rgba(255, 255, 255, 0.3); color: #ffffff; position: absolute; left: 40%; top: 293rpx; z-index: 1000000; } .showContBox { margin: 20rpx ; } .titleBox{ float: left; width: 80%; } .title{ color: #ffffff; font-size: 32rpx; font-family: PingFang SC; font-weight: bold; height: 40rpx; line-height: 40rpx; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; } .classBox{ margin: 20rpx 0; color: #ffffff; } .courseLogo{ float: left; width: 40rpx; height: 40rpx; } .classNum{ margin: 0 20rpx; float: left; } .heatLogo{ width: 35rpx; height: 40rpx; margin-left: 50rpx; float: left; } .heatNum{ margin-left: 20rpx; float: left; } .collectBox{ float: left; width: 20%; height: 120rpx; text-align: center; } .collect{ width: 50rpx; height: 50rpx; } .payBox{ width: 95%; margin: auto; background-image: -webkit-linear-gradient(left, #103930, #121620); } .payNum{ font-size: 36rpx; color: #FC4758; font-family: OPPOSans; font-weight: 400; height: 80rpx; float: left; line-height: 80rpx; } .payF{ height: 80rpx; float: left; line-height: 80rpx; margin-left: 20rpx; color: #FC4758; } .columnBox{ margin: 20rpx 0; } .columnB_a{ font-family: OPPOSans; font-weight: 800; color: #FFFFFF; font-size: 32rpx; margin: 0 20rpx; border-bottom: 4rpx solid #07E881; padding-bottom: 6rpx; } .introduce{ float: left; font-family: OPPOSans; padding: 20rpx 20px; margin-left: 50rpx; font-size: 30rpx; font-weight: 500; } .catalogue{ font-family: OPPOSans; float: left; padding: 20rpx 20px; margin: 0 20rpx; font-size: 30rpx; font-weight: 500; } .userParticularsBox{ border-radius: 20rpx; background-color: #293145; } .userBox{ /* float: left; */ margin: 40rpx 20rpx 20rpx 20rpx; } .userDescribe{ float: left; margin: 20rpx; color: #9DA8C4; font-family: OPPOSans; font-weight: 400; } .userLogo{ height: 120rpx; width: 120rpx; float: left; border-radius: 50%; } .userNameBox{ margin-left: 40rpx; float: left; } .userName{ float: left; color: #FFFFFF; font-family: OPPOSans; font-weight: 500; font-size: 30rpx; padding: 0 20rpx; } .attention{ float: left; border-radius: 20rpx; line-height: 40rpx; height: 40rpx; border: 1rpx solid #07E881; background: rgba(7, 232, 129, 0.12); color: #07E881; padding: 2rpx 20rpx; } .classifyItem{ text-align: center; background: #141825; border: 1rpx solid #666D80; border-radius: 18rpx; float: left; padding: 6rpx 10rpx; margin: 10rpx; } .extend{ width: 20rpx; height: 40rpx; float: right; margin: 20rpx 40rpx 0 0; } .richtextBox{ margin-top: 40rpx; min-height: 120rpx; } .add{ width: 140rpx; height: 140rpx; position: fixed; right: 0; bottom: 274rpx; } .addBox{ padding: 0 40rpx; /* width: 90%; */ height: 100rpx; background: linear-gradient(0deg, #2A3042, #464D61); box-shadow: 0px 6px 20px 0px rgba(0, 0, 0, 0.93); border-radius: 49rpx; position: fixed; left: 100%; bottom: 300rpx; } .addBox-transition { transition: all 0.5s; } .addBox-moved { left: 5%; } @keyframes addBox-ani { from { left: 100%; } to { left: 5%; } } .addBox-animation { animation: addBox-ani 1s alternate infinite; } .goruzu{ float: left; } .video{ width: 70rpx; height: 70rpx; float: left; margin-left: 40rpx; margin-top: 15rpx; } .checkImg{ width: 70rpx; height: 70rpx; float: left; margin-left: 80rpx; margin-top: 10rpx; } .issue{ float: left; font-size: 30rpx; font-family: OPPOSans; font-weight: bold; color: #FFFFFF; line-height: 100rpx; margin-left: 10rpx; } .xian{ height: 70rpx; width: 2rpx; background-color: rgba(255, 255, 255, 0.3); border-radius: 1px; float: left; margin-left: 80rpx; margin-top: 15rpx; } .shareBox{ width: 100%; position: fixed; left: 0; bottom: 0; height: 100rpx; background: #141928; } .shareImg{ margin-top: 5rpx; float: left; width: 40rpx; height: 40rpx; margin-top: 25rpx; margin-left: 40rpx; } .shareText{ float: left; margin-top: 20rpx; margin-left: 20rpx; color: #ffffff; width: 70rpx; height: 50rpx; font-size: 28rpx; } .xuxian{ width: 1rpx; height: 28rpx; background: #8790A8; opacity: 0.4; float: left; margin-top: 30rpx; margin-left: 60rpx; } .consult{ float: left; width: 40rpx; height: 40rpx; margin-top: 25rpx; margin-left: 40rpx; line-height: 40rpx; } .service{ float: left; margin-top: 25rpx; margin-left: 10rpx; color: #ffffff; width: 100rpx; padding: 0; height: 50rpx; background-color: #141928; font-size: 28rpx; } .service span{ display: block; width: 100%; height: 100%; } .shopping{ margin-top: 15rpx; height: 80rpx; line-height: 80rpx; text-align: center; float: left; padding: 0 60rpx; background: linear-gradient(-4deg, #4EE09D, #02C96E); border-radius: 50rpx; margin-left: 80rpx; color: #FFFFFF; font-size: 32rpx; font-family: OPPOSans; } .nOshopping{ margin-top: 15rpx; height: 80rpx; line-height: 80rpx; text-align: center; float: left; padding: 0 60rpx; background-color: rgba(255, 255, 255, 0.1); border-radius: 50rpx; margin-left: 80rpx; color: #FFFFFF; font-size: 32rpx; font-family: OPPOSans; } .h3Img{ width: 40rpx; height: 40rpx; float: left; margin-left: 20rpx; } .h3{ float: left; margin-left: 20rpx; font-family: OPPOSans; font-weight: 500; color: #FFFFFF; } .playLsitBox{ margin: 40rpx 20rpx; } .transmitImg{ width: 70rpx; height: 70rpx; float: left; margin: 15rpx auto; } .timeBox{ float: left; width: 400rpx; margin-left: 20rpx; color: #FFFFFF; } .curriculumBox{ margin-top: 20rpx; } .time{ float: left; width: 30rpx; height: 30rpx; margin-top: 20rpx; } .timeText{ font-family: OPPOSans; font-weight: 500; color: #6E768A; margin-top: 15rpx; margin-left: 10rpx; float: left; } .yuan{ float: left; width: 30rpx; height: 30rpx; margin-top: 20rpx; margin-left: 100rpx; } .then{ font-family: OPPOSans; font-weight: 500; color: #07E881; margin-top: 15rpx; margin-left: 10rpx; float: left; } .timeBoxTitle_a{ color: #07E881; } .timeBoxTitle{ color: #ffffff; } .try{ float: left; width: 60rpx; height: 40rpx; margin-left: 80rpx; margin-top: 20rpx; } .shuo{ float: left; width: 30rpx; height: 30rpx; margin-left: 80rpx; margin-top: 15rpx; } .hit{ height: 120rpx; } /* .shadow{ position: absolute; right: 0; top: 20px; height: 80rpx; width: 120rpx; } */ .purchaseBox{ float: left; width: 96%; overflow-y: hidden; overflow-x: auto; white-space: nowrap; display:-webkit-box; -webkit-box-orient:horizontal; margin-top: 20rpx; margin-left: 2%; height: 120rpx; } .purchaseBox::-webkit-scrollbar { display: none; } .anthology_a{ width: 220rpx; height: 70rpx; padding: 10rpx 10rpx; border-radius: 20rpx; border: 1rpx solid #07E881; color: #07E881; display: inline-block; text-align: center; margin-left: 20rpx; overflow:hidden; display: flex; align-items: center; justify-content: center; } .anthology{ width: 220rpx; padding: 10rpx 10rpx; border-radius: 20rpx; text-align: center; display: inline-block; border: 1rpx solid #7A8399; color: #7A8399; height: 70rpx; margin-left: 20rpx; margin-top: 20rpx 0; overflow:hidden; display: flex; align-items: center; justify-content: center; } .anthologyItem{ text-align: c; width: 220rpx; /* height: 70rpx; */ overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; font-size: 24rpx; /* text-indent: 0; */ } .more{ width: 20rpx; height: 40rpx; float: left; margin-top: 30rpx; margin-left: 40rpx; } .compilationsBox{ width: 100%; height: 60vh; position: fixed; background-color: #0E1119; z-index: 100000; bottom: 0; left: 0; } .aaClassBox{ width: 88%; float: left; } .pack{ width: 5%; height: 20rpx; float: right; margin-top: 30rpx; margin-right: 40rpx; } .anthologyText{ float: left; font-family: OPPOSans; font-weight: 500; color: #FFFFFF; font-size: 32rpx; margin: 20rpx; } .xiao{ font-size: 28rpx; float: left; margin-top: 20rpx; } .Num{ float: 20rpx; float: left; font-size: 34rpx; color: #ffffff; margin-top: 20rpx; margin-left: 10rpx; margin-right: 10rpx; } .number_a{ width: 90rpx; float: left; padding: 10rpx 20rpx; border: 1px solid #07E881;; margin: 0 30rpx; border-radius: 50rpx; text-align: center; color: #07E881; } .numberBox{ margin: 30rpx 0; } .number{ width: 90rpx; float: left; padding: 10rpx 20rpx; border: 1px solid #7A8399; margin: 0 30rpx; border-radius: 50rpx; text-align: center; } .bfLogo{ width: 100rpx; height: 100rpx; float: left; margin: 10rpx 20rpx; } .classnameBox{ float: left; } .classname{ width: 560rpx; font-size: 30rpx; color: #ffffff; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; margin-top: 10rpx; } .classname_a{ width: 560rpx; font-size: 30rpx; color: #07E881; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:1; margin-top: 10rpx; } .purchaseTitle{ color: #ffffff; font-size: 32rpx; font-family: PingFang SC; font-weight: bold; padding: 10rpx 0; } .purchaseXian{ width: 60rpx; height: 5rpx; margin-left: 4rpx; background-color: #ffffff; } .issueBox{ width: 96%; /* padding: 20rpx; */ background-color: #111827; margin: 20rpx auto; overflow: hidden; border-radius: 20rpx; } .issueTitle{ font-size: 30rpx; color: #ffffff; font-family: PingFang SC; margin: 20rpx 20rpx 10rpx 20rpx; } .answer{ color: #535E75; font-size: 24rpx; margin: 10rpx 20rpx 20rpx 20rpx; } .answer::before{ content: "´ð£º"; color: #07E881; } button::after { border: none; } button { background-color: transparent; padding-left: 0; padding-right: 0; line-height:inherit; } button { border-radius:0; }