.video_detail_container { padding: 20px; min-height: 100vh; background: #f7f7f7; .el-main { padding: 7px 8px; background: #fff; } .aside_header { background: white; display: flex; flex-direction: column; justify-content: flex-end; padding: 24px 16px 0 16px; margin-bottom: 16px; } .el-aside { background: white; padding: 0; margin-bottom: 0; margin-right: 16px; } .aside_header span { margin-top: 5px; width: 84px; height: 22px; font-size: 16px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: #343434; line-height: 22px; } .aside_header span:first-child { width: 173px; height: 27px; background: linear-gradient(180deg, #ffffff 0%, var(--themeColor) 100%); opacity: 0.5; } .video_wrap { border-bottom: 10px solid #f7f7f7; } .video_wrap video { width: 100%; height: 566px; } .text { padding-left: 32px; } .text span { cursor: pointer; width: 64px; font-size: 16px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 600; color: #343434; margin-right: 16px; position: relative; padding: 32px 0 25px 0; display: inline-block; } .video_info { width: 100%; height: 172px; background: #ffffff; border-radius: 4px; padding-top: 28px; padding-left: 32px; font-size: 14px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 500; color: #343434; } .info_active::after { content: ""; width: 0px; height: 0px; border-width: 10px; border-style: solid; border-color: transparent transparent var(--themeColor) transparent; position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); } .video_info { border-top: 4px solid var(--themeColor); border-radius: 4px 4px 0px 0px; } .summary_tit { margin-bottom: 16px; } .vis_totle { display: flex; flex-direction: row; align-items: center; } .vis_totle img { margin-right: 6px; } .introduce .introduce_tit { height: 20px; font-size: 14px; font-family: PingFangSC-Medium, PingFang SC; font-weight: 600; color: #343434; line-height: 20px; margin-bottom: 12px; } .introduce_con { height: 66px; font-size: 14px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #727272; line-height: 22px; } .teacher_info { display: flex; flex-direction: column; align-items: center; } .teacher_ach_info { display: flex; flex-wrap: wrap; } .teacher_ach_info .ach_item { margin-bottom: 4px; flex: 50%; height: 20px; font-family: PingFangSC-Regular, PingFang SC; font-weight: 400; color: #797979; line-height: 20px; font-size: 14px; } .el-tree { overflow: scroll; height: 600px; scroll-margin: 20px; overflow-x: hidden; } ::-webkit-scrollbar { width: 4px; } ::-webkit-scrollbar-thumb { -webkit-box-shadow: inset 0 0 1px rgba(136, 136, 136, 0.3); background-color: rgb(238, 241, 245); } }