/* 框架样式 */
 body {
            /* height: 2000px; */
        }   
        .header {
            height: 115px;
            /* border: 1px solid #ec0f0f; */
            position: fixed;
            top:0;
            left: 20px;
            right: 20px;
            background-color: #f3f4f7;
            padding-top: 20px;
        }
        .header .header-content {
            height: 75px;
            background-color: #fff;
            border-radius: 10px;
        }
        .sidebar-menu {
            width: 260px;
            position: fixed;
            top: 115px;
            left: 20px;
            bottom: 20px;
            background-color: #fff;
            border-radius: 10px;
            z-index: 11;
        }

        .main {
            /* height: 1000px; */
            /* background-color: #fff; */
            margin: 115px 20px 0 300px;  
            /* border: 1px solid #ec0f0f;      */
        }
        .main-part1 {
            /* min-height: 200px; */
            /* background-color: khaki; */
            overflow: hidden;
        }
        .common-width {
            width: calc(100% + 20px);
            /* min-height: 100px; */
            /* border: 1px solid #4f06c5; */
            
        }
        .common-width .col {
            /* border:#4f06c5 1px solid; */
            padding-right: 20px;
            margin-bottom: 20px;
        }
        .common-width .col .col-contents {
            /* height: 100px; */
            background-color: #fff;
            border-radius: 10px;
        }  

/* 头部菜单样式 */
.header-content{
            display:flex;
            align-items: center;
        }
        .header-content .menu{
            /* border: 1px solid #210dd4; */
        }
        .header-content .logo {
            margin-left: 32px;
            margin-right: 22px;
        }
        .header-content .menu ul{
            display: flex;
        }
        /* .header-content .menu ul li{
            margin: 0 20px;
        } */
        .header-content .menu ul li a{
            display: block;
            padding: 18px 10px;
            /* border: 1px solid #e70a0a; */
            color: #040407de;
            /* font-size: 16px;
            text-decoration: none; */
            border-radius: 8px;
            transition: all 0.3s ease;
        }
        .header-content .menu ul li a:hover{
            background-color: #efe8ff ;
            color: #9c71fc ;
            
        }
        .header-content .menu .icon-fenlei{
            font-size: 26px;
            color: #0a0a0ae0;
            display: none;
        }  
/* main-part1样式  */
 .col .col-contents {
            padding: 30px;
        }
        .common-title {
            font-size: 20px;
            color:#5b5b80;
        }
        .main-top .text {
            display: flex;
            justify-content: space-between;
            /* border: 1px solid #e40a0a; */
            align-items: center;
            margin-top: 30px;
            margin-bottom: 20px;
        }
        .main-top .text .txt {
            font-size: 16px;
            color: #c5c5c5;
        }
        .main-top .text .number {
            font-size: 32px;
        }
        .main-top .more {
            /* display: inline-block;
            margin-top: 20px; */
            color: #9c71fc;
            font-size: 16px;
        }

/* main-part2样式 */ 
 table.orders{
            width: 100%;
            margin-top: 23px;
            /*均分宽度 单行文本溢出必须加上弹性布局才能显示省略号
            内容放不下时不会撑宽而是溢出
             */
            table-layout: fixed;
            /* border: 1px solid #cc1212; */
        }
        table.orders th.width40{
            width: 40%;            
        }
        table.orders th,
        table.orders td{
            height: 58px;
            /* border: 1px solid #cc1212; */
            text-align: center;
        }
        table.orders tr td{
            border-bottom: 1px solid #9b9b9b;
            /* 单行文本溢出显示省略号 */
            text-overflow:ellipsis;
            white-space:nowrap;
            overflow:hidden; 
        }
        table.orders tr td img{
            border-radius: 50%;
            vertical-align: middle;
            margin-right: 10px;
        }
        .col .col-contents{
            /* border: 1px solid #ce1313; */
            height: 100%;
        }
        .col .col-contents .common-title{
            /* margin-bottom: 42px; */
        } 
        .col .col-contents .remeikecheng{
            margin-top: 24px;
            display: flex;
        }
        .remeikecheng .kc{  
            margin-left: 16px;
            height: 50px;
            line-height: center;
        }
        .remeikecheng .kc .kcname{
            font-size: 14px;
            height: 26px;
            margin-top: 6px;
            margin-bottom: 6px;

        }
        .remeikecheng .kc .kccount{
            font-size: 12px;
            color:#c3c3c3;
            height: 20px;

        }

/* main-part3样式 */
.img-wrap{
            /* background-color: brown; */
            margin-top: 23px;
            position: relative;
        }
        .img-wrap img{
            position: absolute;
            width: 100%;
            height: 100%;
            object-fit: cover;         
            top: 0;
            left: 0;
        }
        
        .bl452-254{
            padding-top: calc(254/452*100%);
        }
        .main-part3 .info{
            line-height: 25px;
            margin-top: 25px;
            font-size: 16px;          
        }
        .main-part3 .course-row{
            margin-top: 20px;
        }
        .row .col-item{
            /* border: 1px solid #e40c0c; */
            padding-top: 50px;
        }
        .course-menu .col-item a{
            display: flex;
            align-items: center;
            color: #5b5b5b;
        }
        .course-menu .col-item .icon{
            /* display: block; */
            width: 40px;
            height: 40px;
            margin-right: 15px;
            /* background-color: aqua; */
            border-radius: 10px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        .course-menu .col-item .icon img{
            width: 26px;
        }
/* main-part4样式  */
/* echats必须设置min-height，否则会出现滚动条 */
        .min400{
            min-height: 400px;
        }   
 /* 侧边导航栏样式 */
.sidebar-menu{
            padding: 20px;
        }
         .menu-item{
            /* border: 1px solid #e20a0a; */
            margin-bottom: 10px;
            height: 40px;
            overflow: hidden;
            transition: height 0.5s ease;
        }
        .menu-item.active{
            /* height: auto; */
        }
        
        .menu-item .menu-item-title {
            height: 40px;
            /* background-color: khaki; */
            display: flex;
            align-items: center;
            font-size: 16px;
            color: #00000a;
            background-image: url('../images/箭头.png');
            background-repeat: no-repeat;
            background-position: 95% center;
            padding-right: 20px;
            /* position: relative;
        } */
            /* justify-content: center; */
        }
        .menu-item .menu-item-title .iconfont {
            font-size: 16px;
            color: #00000a;
            margin-left: 7px;
            margin-right: 12px ;
            /* background-color: #ec0f0f; */
        }
        .menu-item.active .menu-item-title{
            background-color: #f77080;
            color: #fcf7f7;
            background-image: url('../images/r-jiantou1.png@2x.png');
        }
        .menu-item.active .menu-item-title .iconfont{
            color: #fcf7f7;
        }
        /* .menu-item .menu-item-title .iconfont {
            font-size: 24px;
            color: #5b5b80;
        }
        .menu-item .menu-item-title .title-txt {
            margin-left: 10px;
            font-size: 16px;
            color: #5b5b80;
        } */
        .menu-item ul{
            margin-top: 10px;
            /* padding-left: 20px; */
        }
        
        .menu-item ul li{
            height: 39px;
            line-height: 39px;
            /* border: 1px solid #e90a0a; */
            padding-left: 40px;
            /* background-color: #f5f5f5; */
            font-size: 14px;
            /* color: #00000a; */
            background: url('../images/dot.svg')  no-repeat 13px center;


        }
        .menu-item ul li a{
            color: #00000a;
            text-decoration: none;
        }
        .menu-item ul li a:hover{
            background-color: #e90a0a;
            color: #fff;
        }
        .menu-item ul li.active{
            background-color: #e90a0a;
            color: #fff;
        }
        .menu-item ul li.active a{
            color: #fff;
        }
        .menu-item ul li.active:before{
            content: "";
            position: absolute;
            top: 0;
            left: 0;
            width: 37px;
            height: 39px;
            background-color: #e90a0a;
        }
        .menu-item ul li.active:after{
            content: "";
            position: absolute;
            top: 0;
        }
        .close-button
        {
            display: none;
        }