@charset "utf-8";
* { margin: 0; padding: 0; list-style: none;}
body { min-width: 1360px; min-height: 100vh; font-size: 12px; font-family: Microsoft YAHEI,Arial,Helvetica,sans-serif; color: #333; margin: 0 auto; background: linear-gradient(#eff4fb,#fff);}
a { color: #333; text-decoration: none;}
a:hover { color: #5f479a; text-decoration: none;}

.clear { clear: both;}
.warp { width: 90%; min-width: calc(1300px - 10%); margin: 0 auto; padding: 0 5%;} 
#VCode { cursor: pointer;}
input[type=button],input[type=submit],input[type=file],button { cursor: pointer; -webkit-appearance: none;}
textarea { -webkit-appearance: none;}
::-webkit-input-placeholder { color: #333;} 
:-moz-placeholder { color: #333;} 
::-moz-placeholder { color: #333;}
:-ms-input-placeholder { color: #333;} 

/*头部*/
.heads { width: 100%; height: 80px; box-shadow: 0 0 10px rgba(106,104,158,0.08); box-sizing: border-box; background: #fff;}
.heads .logo { float: left; max-width: 70%; height: 50px; margin: 15px 0;}
.heads .logo img { display: block; height: 100%;}
.heads .logn { float: right; height: 80px;}
.heads .logn span { display: block; line-height: 80px; font-size: 16px; color: #141414;}
.heads .logn .lst { height: 60px; cursor: pointer; padding: 20px 20px 0 0; background: url(../images/hx00.png) no-repeat right center; position: relative;}
.heads .logn .lst img { display: block; width: 40px; height: 40px; border-radius: 50%; overflow: hidden; background: #eee;}
.heads .logn .lst p { display: none; width: 120px; box-shadow: 0 5px 10px rgba(106,104,158,0.08); background: #fff; position: absolute; top: 80px; right: 0; z-index: 2;}
.heads .logn .lst p a { display: block; width: 100%; height: 40px; line-height: 40px; font-size: 12px; color: #999; text-align: center; border-top: 1px solid #f4f4f4; -webkit-transition: all .5s ease; transition: all .5s ease;}
.heads .logn .lst p a:hover { color: #333;}
.heads .logn .lst:hover p { display: block;}

/*脚部*/
.footer { width: 100%; font-size: 14px; color: rgba(255,255,255,0.75); background: #5f479a;}
.footer .lst { padding: 35px 10px;}
.footer .lst a { color: rgba(255,255,255,0.75); -webkit-transition: all .5s ease; transition: all .5s ease;}
.footer .lst a:hover { color: #fff;}
.footer .lst .lft { float: left; width: 400px;}
.footer .lst .lft .log { width: 100%; height: 50px; margin: 10px 0 25px 0; overflow: hidden;}
.footer .lst .lft .log img { display: block; height: 100%;}
.footer .lst .lft p { display: flex; flex-direction: row; line-height: 25px; font-size: 14px; margin-bottom: 10px;}
.footer .lst .lft p span { display: block; width: 45px;}
.footer .lst .lft p b { display: block; width: 200px; font-weight: 500;}
.footer .lst .rgt { float: right; width: 560px; padding-top: 10px;}
.footer .lst .rgt li { float: left; width: 165px;}
.footer .lst .rgt li h3 { width: 100%; height: 45px; line-height: 45px; font-weight: 500; font-size: 18px; color: #fff;}
.footer .lst .rgt li a { display: block; height: 30px; line-height: 30px; font-size: 14px;}
.footer .lst .rgt .img { display: flex; flex-direction: row; float: right; width: 230px; margin-top: 100px;}
.footer .lst .rgt .img img { display: block; width: 100px; height: 100px; margin-left: 15px; background: #fff;}
.footer .copy { line-height: 30px; margin: 0 10px; padding: 15px 0; border-top: 1px solid rgba(255,255,255,0.1);}
.footer .copy p a { color: rgba(255,255,255,0.75);}
.footer .copy span { display: inline-block; color: rgba(255,255,255,0.4); margin-right: 20px; position: relative;}
.footer .copy span::after { display: block; content: ""; width: 1px; height: 10px; background: rgba(255,255,255,0.35); position: absolute; right: -14px; top: 11px;}
.footer .copy span:last-child::after { display: none;}
.footer .copy span a { color: rgba(255,255,255,0.4); -webkit-transition: all .5s ease; transition: all .5s ease;}
.footer .copy span a:hover { color: rgba(255,255,255,0.75);}

/***************首页***************/
.index { width: 100%; padding: 2.5vw 0; background: url(../images/hx01.png) no-repeat center top / 100%;}
.index .topnam { width: 100%; text-align: center; letter-spacing: 2px; margin-bottom: 2.5vw;}
.index .topnam h1 { width: 100%; height: 4.5vw; line-height: 4.5vw; font-size: 3vw; color: #141414;}
.index .topnam p { width: 100%; height: 2.5vw; line-height: 2.5vw; font-size: 1.2vw; color: #75808a;}
.index li { float: left; width: calc(100% / 4 - 20px); text-align: center; margin: 0 10px; padding: 6vw 0; background-repeat: no-repeat; background-position: left top; background-size: 100%;}
.index li a { display: block; padding: 0 2.5vw;}
.index li h4 { width: 100%; height: 3vw; line-height: 3vw; font-weight: 500; font-size: 1.8vw;}
.index li h4 i { font-style: normal; color: rgba(0,0,0,0.8); text-transform: Uppercase;}
.index li img { display: block; width: 118px; height: 118px; margin: 4vw auto 0.5vw auto;}
.index li h1 { width: 100%; height: 4vw; line-height: 5vw; font-size: 2vw; color: rgba(255,255,255,0.2); letter-spacing: 4px; overflow: hidden; position: relative;}
.index li h1 b { display: block; width: 100%; height: 3.5vw; line-height: 3.5vw; position: absolute; top: 0; left: 0; z-index: 2;}
.index li p { width: 100%; height: 3vw; line-height: 1.5vw; font-size: 0.85vw; color: rgba(0,0,0,0.5); margin-bottom: 1vw;}
.index li span { display: block; width: 90%; height: 3vw; line-height: 3vw; font-size: 1vw; color: #fff; letter-spacing: 2px; margin: 0 auto; border-radius: 0.5vw; box-shadow: 0 0 15px rgba(255,255,255,0.15) inset; -webkit-transition: all .5s ease; transition: all .5s ease;}
.index li:hover span { border-radius: 1vw;}
.index .lt01 { background-image: url(../images/hx02.png);}
.index .lt01 h4,
.index .lt01 h1 b { color: #3f3bb0;}
.index .lt01 span { background: #4e4abc;}
.index .lt02 { background-image: url(../images/hx04.png);}
.index .lt02 h4,
.index .lt02 h1 b { color: #914412;}
.index .lt02 span { background: #c0652a;}
.index .lt03 { background-image: url(../images/hx06.png);}
.index .lt03 h4,
.index .lt03 h1 b { color: #41258d;}
.index .lt03 span { background: #5734b7;}
.index .lt04 { background-image: url(../images/hx08.png);}
.index .lt04 h4,
.index .lt04 h1 b { color: #8f2328;}
.index .lt04 span { background: #a5292f;}
@media screen and (max-width: 1680px) {
	.index li { padding: 5.5vw 0;}
	.index li img { margin-top: 3vw;}
}
@media screen and (max-width: 1600px) {
	.index li img { width: 95px; height: 95px; margin-top: 4vw;}
}
@media screen and (max-width: 1400px) {
	.index li { padding: 5.3vw 0;}
	.index li p { font-size: 0.9vw;}
	.index li img { margin-top: 3vw;}
}
@media screen and (max-width: 1280px) { 
	.index li { padding: 6vw 0;}
	.index li img { margin-top: 4vw;}	
}

/*管理端弹框*/
.mgtank { display: none; width: 100%; height: 100vh; background: rgba(0,0,0,0.6); position: fixed; left: 0; top: 0; z-index: 999;}
.mgtank .msg { width: 450px; min-height: 350px; margin: auto; padding: 10px 20px 30px 20px; border-radius: 10px; overflow: hidden; background: #fff url(../images/hx10.png) no-repeat 0 0; position: absolute; top: 50%; right: 0; left: 0; z-index: 2; transform: translateY(-50%);}
.mgtank .msg::after { display: block; content: ""; width: 200px; height: 245px; background: url(../images/hx13.png) no-repeat 0 0; position: absolute; right: 0; bottom: 0; z-index: 1;}
.mgtank .msg h3 { height: 40px;line-height: 40px; font-size: 20px; color: #141414; letter-spacing: 2px;}
.mgtank .msg .close { width: 40px; height: 40px; cursor: pointer; position: absolute; top: 10px; right: 10px; z-index: 2; -webkit-transition: all .5s ease; transition: all .5s ease;}
.mgtank .msg .close::after { display: block; content: "+"; width: 40px; height: 40px; line-height: 40px; font-size: 28px; color: #141414; text-align: center; -webkit-transform-origin: 50%; transform-origin: 50%; -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; top: 0; right: 0; bottom: 0; left: 0; z-index: 2;}
.mgtank .msg .close:hover { transform: rotate(360deg);}
.mgtank .msg .lst { width: 100%; position: relative; z-index: 3;}
.mgtank .msg .lst li { float: none; width: 325px; height: 50px; margin: 25px auto 0 auto; padding: 5px; border: 1px solid #5f479a; border-radius: 35px; overflow: hidden; background: rgba(171,111,210,0.4); -webkit-transition: all .5s ease; transition: all .5s ease;}
.mgtank .msg .lst li a { display: block; height: 50px; line-height: 50px; font-size: 18px; color: #fff; text-align: center; border-radius: 25px; overflow: hidden; background: #5f479a; position: relative;}
.mgtank .msg .lst li a::before,
.mgtank .msg .lst li a::after { display: block; content: ""; width: 30px; height: 50px; background-repeat: no-repeat; background-position: center; position: absolute; top: 0;}
.mgtank .msg .lst li a::before { background-image: url(../images/hx11.png); left: 10%;}
.mgtank .msg .lst li a::after { background-image: url(../images/hx12.png); right: 10%;}
.mgtank.on { display: block;}

/***************教师端***************/
.teachs { width: 100%; padding: 2.5vw 0; background: url(../images/hx14.png) no-repeat right top;}
.teachs .topnam { width: 100%; text-align: center; letter-spacing: 2px; margin-bottom: 2.5vw;}
.teachs .topnam h1 { width: 100%; height: 4vw; line-height: 4vw; font-size: 2vw; color: #141414;}
.teachs .topnam .tabs { width: 650px; height: 50px; margin: 20px auto 0 auto; padding: 2px; border-radius: 30px; overflow: hidden; background: linear-gradient(#7c41f9,#ac8df7);}
.teachs .topnam .tabs li { float: left; width: calc(100% / 4); height: 50px; border-radius: 30px; position: relative;}
.teachs .topnam .tabs li::before,
.teachs .topnam .tabs li::after { display: none; content: ""; width: 55px; height: 50px; background-repeat: no-repeat; background-position: 0 0; position: absolute; z-index: 1;}
.teachs .topnam .tabs li::before { background-image: url(../images/hx15.png); left: 0; bottom: 0;}
.teachs .topnam .tabs li::after { background-image: url(../images/hx16.png); right: 0; top: 0;}
.teachs .topnam .tabs li a { display: flex; flex-direction: row; justify-content: center; line-height: 50px; font-size: 20px; color: #fff; position: relative; z-index: 2;}
.teachs .topnam .tabs li a span { display: block; padding-left: 30px; background-repeat: no-repeat; background-position: left center;}
.teachs .topnam .tabs li.on { background: #fff;}
.teachs .topnam .tabs li.on::before,
.teachs .topnam .tabs li.on::after { display: block;}
.teachs .topnam .tabs li.on a { color: #6b30e7;}
.teachs .topnam .tabs .nm01 a span { background-image: url(../images/hx17.png);}
.teachs .topnam .tabs .nm01.on a span { background-image: url(../images/hx17h.png);}
.teachs .topnam .tabs .nm02 a span { background-image: url(../images/hx18.png);}
.teachs .topnam .tabs .nm02.on a span { background-image: url(../images/hx18h.png);}
.teachs .topnam .tabs .nm03 a span { background-image: url(../images/hx19.png);}
.teachs .topnam .tabs .nm03.on a span { background-image: url(../images/hx19h.png);}
.teachs .topnam .tabs .nm04 a span { background-image: url(../images/hx20.png);}
.teachs .topnam .tabs .nm04.on a span { background-image: url(../images/hx20h.png);}

.teachs .count { width: 100%;}
.teachs .count li { float: left; width: calc(100% / 4 - 19px); margin: 0 25px 25px 0; border-radius: 10px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff;}
.teachs .count li:last-child { margin-right: 0;}
.teachs .count li a { display: flex; flex-direction: row; padding: 25px;}
.teachs .count li img { display: block; width: 68px; height: 68px; margin-right: 25px;}
.teachs .count li .msg { flex: 1 1 0%;}
.teachs .count li .msg h3 { width: 100%; height: 48px; line-height: 45px; font-size: 40px; color: #141414;}
.teachs .count li .msg p { width: 100%; height: 20px; line-height: 20px; font-size: 15px; color: #75808A;}

.teachs .threstuct,
.teachs .threquick,
.teachs .threnews { float: left; width: calc(100% / 3 - 67px); margin: 0 25px 25px 0; padding: 25px; border-radius: 10px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff;}
.teachs .threstuct .tit,
.teachs .threquick .tit,
.teachs .threnews .tit { width: 100%; height: 30px; line-height: 30px;}
.teachs .threstuct .tit h3,
.teachs .threquick .tit h3,
.teachs .threnews .tit h3 { float: left; font-size: 18px; color: #141414;}
.teachs .threstuct .tit p,
.teachs .threquick .tit p,
.teachs .threnews .tit p { float: right; font-size: 16px; color: #6b30e7; padding-right: 25px; background: url(../images/hx93.jpg) no-repeat right center;}
.teachs .threquick .tit { position: relative;}
.teachs .threquick .tit p { cursor: pointer; position: relative; z-index: 10;}
.teachs .threquick .tit .manage-box { display: none; position: fixed; left: 50%; top: 50%; transform: translate(-50%, -50%); width: 400px; padding: 20px; background: #fff; border-radius: 8px; box-shadow: 0 2px 12px 0 rgba(0,0,0,.1); z-index: 9999;}
.teachs .threquick .tit .manage-overlay { display: none; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.5); z-index: 9998;}
.teachs .threquick .tit .manage-overlay.show { display: block;}
.teachs .threquick .tit .manage-box.show { display: block;}
.teachs .threquick .tit .manage-box .item-list { max-height: 300px; overflow-y: auto; display: flex; flex-wrap: wrap;}
.teachs .threquick .tit .manage-box .item { width: 50%; display: flex; align-items: center; margin-bottom: 15px; box-sizing: border-box; padding-right: 10px;}
.teachs .threquick .tit .manage-box .item img { width: 20px; height: 20px; margin-right: 8px; border-radius: 4px; object-fit: contain;}
.teachs .threquick .tit .manage-box .item input[type="checkbox"] { appearance: none; -webkit-appearance: none; width: 16px; height: 16px; border: 1px solid #dcdfe6; border-radius: 2px; outline: none; position: relative; transition: all 0.3s;
    margin-right: 10px; cursor: pointer; flex-shrink: 0;}
.teachs .threquick .tit .manage-box .item input[type="checkbox"]:checked { border-color: #6b30e7; background-color: #6b30e7;}
.teachs .threquick .tit .manage-box .item input[type="checkbox"]:checked::after { content: ""; width: 4px; height: 8px; border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg); position: absolute; left: 4px; top: 1px;}
.teachs .threquick .tit .manage-box .item label { font-size: 14px; color: #333; cursor: pointer; user-select: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; line-height: 24px;}
.teachs .threquick .tit .manage-box .btns { display: flex; justify-content: flex-end; margin-top: 20px; padding-top: 15px; border-top: 1px solid #ebeef5; width: 100%;}
.teachs .threquick .tit .manage-box .btns span { display: inline-block; padding: 0 15px; height: 28px; line-height: 28px; border-radius: 3px; font-size: 12px; cursor: pointer; margin-left: 10px; transition: all 0.3s;}
.teachs .threquick .tit .manage-box .btns .cancel { border: 1px solid #dcdfe6; color: #606266; background: #fff;}
.teachs .threquick .tit .manage-box .btns .cancel:hover { color: #6b30e7; border-color: #c6b2f6; background-color: #f4ebff;}
.teachs .threquick .tit .manage-box .btns .save { background: #6b30e7; color: #fff; border: 1px solid #6b30e7;}
.teachs .threquick .tit .manage-box .btns .save:hover { background: #5a26c4; border-color: #5a26c4;}
.teachs .threstuct li { float: left; width: calc(50% - 10px); text-align: center; margin: 20px 20px 0 0; border-radius: 8px; overflow: hidden; background: rgba(107,48,231,0.05);}
.teachs .threstuct li:nth-child(2n) { margin-right: 0;}
.teachs .threstuct li a { display: block; padding: 15px;}
.teachs .threstuct li h3 { width: 100%; height: 50px; line-height: 50px; font-size: 32px; color: #141414;}
.teachs .threstuct li p { width: 100%; height: 25px; line-height: 25px; font-size: 14px; color: #75808a;}
.teachs .threquick li { float: left; width: calc(100% / 3 - 13.5px); text-align: center; margin: 30px 20px 0 0;}
.teachs .threquick li:nth-child(3n) { margin-right: 0;}
.teachs .threquick li img { display: block; width: 60px; height: 60px; margin: 0 auto 5px auto;}
.teachs .threquick li p { width: 100%; height: 30px; line-height: 35px; font-size: 15px; color: #141414; overflow: hidden; -webkit-transition: all .5s ease; transition: all .5s ease;}
.teachs .threquick li:hover p { color: #6b30e7;}
.teachs .threnews { margin-right: 0;}
.teachs .threnews .tit { margin-bottom: 10px;}
.teachs .threnews li { height: 47px; line-height: 47px; padding-right: 50px; border-bottom: 1px dashed #eee; position: relative;}
.teachs .threnews li::after { display: block; content: ""; width: 5px; height: 5px; border-top: 1px solid #333; border-right: 1px solid #333; -webkit-transform-origin: 50%; transform-origin: 50%; -webkit-transform: rotate(45deg); transform: rotate(45deg); position: absolute; right: 2px; top: 21px; -webkit-transition: all .5s ease; transition: all .5s ease;}
.teachs .threnews li a { display: block; font-size: 16px; color: #141414; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: all .5s ease; transition: all .5s ease;}
.teachs .threnews li:hover::after { border-color: #6b30e7;}
.teachs .threnews li:hover a { color: #6b30e7;}

.teachs .todos { padding: 25px; border-radius: 10px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff;}
.teachs .todos .tit { width: 100%; height: 30px; line-height: 30px;}
.teachs .todos .tit h3 { float: left; font-size: 18px; color: #141414;}
.teachs .todos .tit p { float: right; font-size: 16px; color: #141414; padding-left: 30px; background: url(../images/hx49.png) no-repeat left center;}
.teachs .todos table { width: 100%;}
.teachs .todos table th,
.teachs .todos table td { line-height: 25px; padding: 10px;}
.teachs .todos table th { font-weight: 500; font-size: 16px; color: #979ea8; border-bottom: 2px solid #e8eaec;}
.teachs .todos table td { border-bottom: 1px dashed #ddd;}
.teachs .todos table td p { display: block; line-height: 25px; font-size: 15px; color: #262833;}
.teachs .todos table td .type { display: flex; flex-direction: row; align-items: center; width: 100%;}
.teachs .todos table td .type i { display: block; width: 40px; height: 40px; background-repeat: no-repeat; background-position: center;}
.teachs .todos table td .type .zy { background-image: url(../images/hx50.png);}
.teachs .todos table td .type .cs { background-image: url(../images/hx51.png);}
.teachs .todos table td .type .dc { background-image: url(../images/hx52.png);}
.teachs .todos table td .type span { display: block; height: 30px; line-height: 30px; font-size: 12px; color: #6b30e7; margin-left: 5px; padding: 0 10px; border-radius: 15px; overflow: hidden; background: #f4ebff;}
.teachs .todos table td .bars { width: 100%;}
.teachs .todos table td .bars .top { display: flex; flex-direction: row; justify-content: space-between; width: 100%; height: 25px; line-height: 25px; margin-bottom: 5px;}
.teachs .todos table td .bars .top span { font-size: 14px; color: #70748c;}
.teachs .todos table td .bars .top p { font-weight: bold; font-size: 14px; color: #262833;}
.teachs .todos table td .bars .botm { display: flex; flex-direction: row; width: 100%; height: 8px; border-radius: 4px; overflow: hidden; background: #f5f5f7;}
.teachs .todos table td .bars .botm span { display: block; height: 8px; border-radius: 4px; overflow: hidden; background: #6b30e7;}
.teachs .todos table td .num { width: 100%; text-align: center;}
.teachs .todos table td .num b { display: block; width: 100%; height: 30px; line-height: 30px; font-size: 24px; color: #262833;}
.teachs .todos table td .num span { display: block; width: 100%; height: 20px; line-height: 20px; font-size: 13px; color: #979ea8;}
.teachs .todos table td a { display: block; width: 25px; height: 25px; margin: 0 auto; background: url(../images/hx53.png) no-repeat center;}
.teachs .todos .heds { width: 100%;}
.teachs .todos .lsts { width: 100%; height: 600px; overflow-y: scroll; scrollbar-width: none;}
.teachs .todos .lsts::-webkit-scrollbar { width: 0; height: 0;}

.teachs .todos .tit { position: relative;}
.teachs .todos .tit .chose { cursor: pointer; position: relative; z-index: 10;}
.teachs .todos .tit .filter-box { display: none; width: 300px; padding: 20px; border-radius: 8px; box-shadow: 0 5px 10px 0 rgba(0,0,0,0.1); background: #fff; position: absolute; top: 35px; right: 0; z-index: 999;}
.teachs .todos .tit .filter-box.show { display: block;}
.teachs .todos .tit .filter-box .item { margin-bottom: 15px;}
.teachs .todos .tit .filter-box .item:last-child { margin-bottom: 0;}
.teachs .todos .tit .filter-box .item label { display: block; font-size: 14px; color: #606266; margin-bottom: 8px;}
.teachs .todos .tit .filter-box .item input,
.teachs .todos .tit .filter-box .item select { width: 100%; height: 32px; line-height: 32px; border: 1px solid #dcdfe6; border-radius: 4px; padding: 0 10px; box-sizing: border-box; font-size: 13px; color: #606266;}
.teachs .todos .tit .filter-box .item input:focus,
.teachs .todos .tit .filter-box .item select:focus { border-color: #6b30e7; outline: 0;}
.teachs .todos .tit .filter-box .btns { display: flex; justify-content: flex-end; margin-top: 20px; padding-top: 15px; border-top: 1px solid #ebeef5;}
.teachs .todos .tit .filter-box .btns span { display: inline-block; padding: 0 15px; height: 28px; line-height: 28px; border-radius: 3px; font-size: 12px; cursor: pointer; margin-left: 10px;}
.teachs .todos .tit .filter-box .btns .reset { border: 1px solid #dcdfe6; color: #606266;}
.teachs .todos .tit .filter-box .btns .submit { background: #6b30e7; color: #fff; border: 1px solid #6b30e7;}
 
.teachs .courrlst { width: 100%;}
.teachs .courrlst .lanms { display: flex; flex-direction: row; height: 50px; padding: 0 30px;}
.teachs .courrlst .lanms a { display: block; line-height: 50px; font-size: 16px; color: #75808a; margin: 0 40px; padding: 0 10px 0 40px; background-repeat: no-repeat; background-position: 10px center; background-size: 22px; position: relative;}
.teachs .courrlst .lanms a::before,
.teachs .courrlst .lanms a::after { display: none; content: ""; width: 40px; height: 50px; background-repeat: no-repeat; background-position: center; position: absolute; top: 0;}
.teachs .courrlst .lanms a::before { background-image: url(../images/hx94.png); left: -40px;}
.teachs .courrlst .lanms a::after { background-image: url(../images/hx95.png); right: -40px;}
.teachs .courrlst .lanms .on { color: #141414; background-color: #fff;}
.teachs .courrlst .lanms .on::before,
.teachs .courrlst .lanms .on::after { display: block;}
.teachs .courrlst .lanms .lm01 { background-image: url(../images/hx34.png);}
.teachs .courrlst .lanms .on.lm01 { background-image: url(../images/hx34h.png);}
.teachs .courrlst .lanms .lm02 { background-image: url(../images/hx35.png);}
.teachs .courrlst .lanms .on.lm02 { background-image: url(../images/hx35h.png);}
.teachs .courrlst .lanms .lm03 { background-image: url(../images/hx36.png);}
.teachs .courrlst .lanms .on.lm03 { background-image: url(../images/hx36h.png);}
.teachs .courrlst .lanms .lm04 { background-image: url(../images/hx37.png);}
.teachs .courrlst .lanms .on.lm04 { background-image: url(../images/hx37h.png);}

.teachs .courrlst .nr { padding: 30px; border-radius: 10px; overflow: hidden; background: #fff;}
.teachs .courrlst .nr .chose { width: 100%; margin-bottom: 30px;}
.teachs .courrlst .nr .chose li { display: flex; flex-direction: row; float: left; height: 50px; margin-right: 30px; position: relative;}
.teachs .courrlst .nr .chose li::after { display: block; content: ""; width: 0; height: 0; border-style: solid; border-width: 5px 5px 0 5px; border-color: #333 transparent transparent transparent; position: absolute; right: 15px; top: 23px;}
.teachs .courrlst .nr .chose li label { display: block; line-height: 50px; font-size: 16px; color: #000; margin-right: 10px;}
.teachs .courrlst .nr .chose li select { flex: 1 1 0%; width: 240px; height: 48px; line-height: 48px; font-size: 16px; color: #000; padding: 0 15px; border: 1px solid #dee2e6; border-radius: 25px; overflow: hidden; background: #fff; appearance: none; -moz-appearance: none; -webkit-appearance: none;}

.teachs .courrlst .nr .lst { width: 100%;}
.teachs .courrlst .nr .lst li { float: left; width: calc(100% / 5 - 16px); margin: 0 20px 20px 0; border-radius: 10px; box-shadow: 0 2px 40px rgba(106,104,158,0.1); overflow: hidden; background: #fff;}
.teachs .courrlst .nr .lst li:nth-child(5n) { margin-right: 0;}
.teachs .courrlst .nr .lst li a { display: block; padding: 10px;}
.teachs .courrlst .nr .lst li .img { display: flex; flex-direction: row; justify-content: center; align-items: center; width: 100%; height: 170px; border-radius: 10px; overflow: hidden; background: #e6ecfa;}
.teachs .courrlst .nr .lst li .img img { display: block; max-width: 100%; height: 170px; -webkit-transition: all .5s ease; transition: all .5s ease;}
.teachs .courrlst .nr .lst li .msg { width: 100%; height: 125px; margin: 10px 5px 0 5px;}
.teachs .courrlst .nr .lst li .msg h3 { width: 100%; height: 35px; line-height: 35px; font-weight: 500; font-size: 16px; color: #141414; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: all .5s ease; transition: all .5s ease;}
.teachs .courrlst .nr .lst li .msg p { width: 100%; height: 25px; line-height: 25px; font-size: 14px; color: #75808a; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.teachs .courrlst .nr .lst li .msg span { display: inline-block; height: 25px; line-height: 25px; font-size: 12px; margin-top: 10px; padding: 0 10px; border-radius: 4px; overflow: hidden;}
.teachs .courrlst .nr .lst li .msg .cor01 { color: #6b30e7; background: #f4ebff;}
.teachs .courrlst .nr .lst li .msg .cor02 { color: #eb880e; background: #fff5e2;}
.teachs .courrlst .nr .lst li:hover .img img { transform: scale(0.9,0.9);}
.teachs .courrlst .nr .lst li:hover .msg h3 { color: #6b30e7;}
.teachs .courrlst .nr .mores { width: 181px; height: 49px; line-height: 49px; text-align: center; margin: 20px auto 0 auto; background: url(../images/hx38.png) no-repeat center;}
.teachs .courrlst .nr .mores span { display: inline-block; font-size: 18px; color: #fff; padding-right: 25px; background: url(../images/hx23.png) no-repeat right center;}

.teachs .teaids { display: flex; flex-direction: row; width: 100%;}
.teachs .teaids .lft { display: flex; flex-direction: row; width: 32%;}
.teachs .teaids .lft ul { display: block; width: 100%;}
.teachs .teaids .lft li { height: calc(50% - 10px); margin-bottom: 20px; border: 3px solid #fff; border-radius: 10px; box-sizing: border-box; box-shadow: 0 5px 40px rgba(106,104,158,0.08); background: #fff url(../images/hx21.png) no-repeat 5px 15px; position: relative;}
.teachs .teaids .lft li::after { display: none; content: ""; width: 0; height: 0; border-style: solid; border-width: 12px 0 12px 14px; border-color: transparent transparent transparent #6b30e7; position: absolute; right: -17px; bottom: 10px;}
.teachs .teaids .lft li:last-child { margin-bottom: 0;}
.teachs .teaids .lft li a { display: flex; flex-direction: row; align-items: center; height: 100%; padding: 0 35px;}
.teachs .teaids .lft li .nr { width: 100%;}

.teachs .teaids .lft li .nr h3 { display: flex; flex-direction: row; width: 100%;}
.teachs .teaids .lft li .nr h3 i { display: block; width: 55px; height: 55px; line-height: 55px; font-weight: 500; font-style: normal; font-size: 38px; color: #6b30e7; text-align: center; margin-right: 10px; border: 1px solid rgba(107,48,231,0.1); border-radius: 1px; background: rgba(255,255,255,0.4);}
.teachs .teaids .lft li .nr p { width: 100%; line-height: 30px; font-size: 16px; color: #75808a; margin: 10px 0 35px 0;}
.teachs .teaids .lft li .nr .btn { display: flex; flex-direction: row; justify-content: center; width: 165px; height: 45px; line-height: 45px; border-radius: 4px; overflow: hidden; background: #6b30e7; -webkit-transition: all .5s ease; transition: all .5s ease;}
.teachs .teaids .lft li .nr .btn span { display: block; font-size: 16px; color: #fff; padding-right: 25px; background: url(../images/hx23.png) no-repeat right center;}
.teachs .teaids .lft li:hover .nr .btn { border-radius: 25px;}
.teachs .teaids .lft li.on { border-color: #6b30e7; background-color: #f4ebff; background-image: url(../images/hx22.png);}
.teachs .teaids .lft li.on::after { display: block;}
.teachs .teaids .rgt { flex: 1 1 0%; margin-left: 25px;}
.teachs .teaids .rgt .img { width: 100%; border-radius: 10px; overflow: hidden;}
.teachs .teaids .rgt .img img { display: block; width: 100%;}
.teachs .teaids .rgt ul { display: flex; flex-direction: row; width: 100%;}
.teachs .teaids .rgt li { flex: 1 1 0%; display: block; text-align: center; margin: 25px 25px 0 0; border-radius: 10px; box-shadow: 0 5px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff;}
.teachs .teaids .rgt li:last-child { margin-right: 0;}
.teachs .teaids .rgt li a { display: block; padding: 30px 15px;}
.teachs .teaids .rgt li img { display: block; width: 56px; height: 56px; margin: 0 auto 15px auto;}
.teachs .teaids .rgt li p { width: 100%; height: 25px; line-height: 25px; font-size: 15px; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: all .5s ease; transition: all .5s ease;}
.teachs .teaids .rgt li:hover p { color: #6b30e7;}

.teachs .analysis { width: 100%;}
.teachs .analysis .lft { float: left; width: 320px; border-radius: 10px; box-sizing: border-box; box-shadow: 0 5px 40px rgba(106,104,158,0.08); background: #fff;}
.teachs .analysis .lft li { padding: 15px 25px; border-bottom: 1px solid #eff4fb;}
.teachs .analysis .lft li:last-child { border-bottom: none;}
.teachs .analysis .lft li .tim { height: 40px; line-height: 40px; font-size: 18px; color: #000; padding-left: 20px; position: relative;}
.teachs .analysis .lft li .tim::after { display: block; content: ""; width: 0; height: 0; border-style: solid; border-width: 5px 5px 0 5px; border-color: #000 transparent transparent transparent; border-radius: 10px; overflow: hidden; position: absolute; left: 0; top: 18px;}
.teachs .analysis .lft li .lts { width: 100%; margin-bottom: 10px;}
.teachs .analysis .lft li .lts h3 { height: 35px; line-height: 35px; font-size: 16px; color: #333; margin-left: 20px; padding-left: 20px; position: relative;}
.teachs .analysis .lft li .lts h3::after { display: block; content: ""; width: 0; height: 0; border-style: solid; border-width: 5px 5px 0 5px; border-color: #000 transparent transparent transparent; border-radius: 10px; overflow: hidden; position: absolute; left: 0; top: 15px;}
.teachs .analysis .lft li .lts .lt { margin-top: 5px; border: 1px solid #fafafa; border-radius: 10px; overflow: hidden; position: relative; -webkit-transition: all .5s ease; transition: all .5s ease;}
.teachs .analysis .lft li .lts .lt::after { display: block; content: ""; width: 5px; height: 5px; margin: auto; border-radius: 50%; background: #6b30e7; position: absolute; left: 21px; top: 0; bottom: 0;}
.teachs .analysis .lft li .lts .lt a { display: block; padding: 10px 20px 10px 40px;}
.teachs .analysis .lft li .lts .lt p { width: 100%; height: 25px; line-height: 25px; font-size: 15px; color: #141414; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: all .5s ease; transition: all .5s ease;}
.teachs .analysis .lft li .lts .lt span { display: block; height: 25px; line-height: 25px; font-size: 14px; color: #75808a; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.teachs .analysis .lft li .lts .lt:hover { border-color: #6b30e7;}
.teachs .analysis .lft li .lts .lt.on { border-color: #6b30e7; background: #f4ebff;}
.teachs .analysis .lft li .lts .lt:hover p,
.teachs .analysis .lft li .lts .lt.on p { color: #6b30e7;}
.teachs .analysis .rgt { float: right; width: calc(100% - 345px);}
.teachs .analysis .rgt .numb { width: 100%;}
.teachs .analysis .rgt .numb li { float: left; width: calc(100% / 3 - 17px); margin: 0 25px 25px 0; border-radius: 10px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff;}
.teachs .analysis .rgt .numb li:last-child { margin-right: 0;}
.teachs .analysis .rgt .numb li a { display: flex; flex-direction: row; padding: 20px;}
.teachs .analysis .rgt .numb li img { display: block; width: 68px; height: 68px; margin-right: 15px;}
.teachs .analysis .rgt .numb li .msg { flex: 1 1 0%;}
.teachs .analysis .rgt .numb li .msg h3 { width: 100%; height: 48px; line-height: 45px; font-size: 40px; color: #141414;}
.teachs .analysis .rgt .numb li .msg p { width: 100%; height: 20px; line-height: 20px; font-size: 15px; color: #75808A;}

.teachs .analysis .rgt .tit { width: 100%; height: 30px; line-height: 30px; margin-bottom: 15px; position: relative;}
.teachs .analysis .rgt .tit h3 { float: left; font-size: 18px; color: #141414;}
.teachs .analysis .rgt .tit p { float: right; font-size: 16px; color: #6b30e7; padding-right: 25px; background: url(../images/hx93.jpg) no-repeat right center;}

.teachs .analysis .rgt .kngraph { float: left; width: calc(50% - 52.5px); margin-bottom: 25px; padding: 20px; border-radius: 10px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff;}
.teachs .analysis .rgt .kngraph li { float: left; width: calc(30% - 10px); margin-left: 10px; border-radius: 10px; background: #f8f9fa;}
.teachs .analysis .rgt .kngraph li a { display: flex; flex-direction: row; height: 68px; padding: 16px 10px;}
.teachs .analysis .rgt .kngraph li img { display: block; width: 68px; height: 68px; margin-right: 15px;}
.teachs .analysis .rgt .kngraph li .msg { flex: 1 1 0%; text-align: center;}
.teachs .analysis .rgt .kngraph li .msg h3 { width: 100%; height: 40px; line-height: 40px; font-size: 30px; color: #141414;}
.teachs .analysis .rgt .kngraph li .msg p { width: 100%; height: 20px; line-height: 20px; font-size: 14px; color: #75808A;}
.teachs .analysis .rgt .kngraph li:first-child { width: 40%; margin-left: 0;}
.teachs .analysis .rgt .kngraph li:first-child .msg { text-align: left;}

.teachs .analysis .rgt .leapros { float: right; width: calc(50% - 52.5px); margin-bottom: 25px; padding: 20px; border-radius: 10px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff;}
.teachs .analysis .rgt .leapros .chart-box { display: flex; align-items: center; justify-content: center; width: 100%; height: 100px; overflow: hidden;}
.teachs .analysis .rgt .leapros .chart-box .tupu { width: 200px; height: 100px;}
.teachs .analysis .rgt .leapros .chart-box .info { width: 180px; text-align: center; margin-top: 20px;}
.teachs .analysis .rgt .leapros .chart-box .info .num { height: 55px; line-height: 55px; font-size: 38px; font-weight: 800; color: #141414;}
.teachs .analysis .rgt .leapros .chart-box .info .label { height: 25px; line-height: 25px; font-size: 14px; color: #75808a;}

.teachs .analysis .rgt .leamotvs { float: left; width: calc(50% - 52.5px); margin-bottom: 25px; padding: 20px; border-radius: 10px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff;}
.teachs .analysis .rgt .leamotvs .tupus { display: flex; flex-direction: row; justify-content: space-between; width: 100%; height: 220px; position: relative;}
.teachs .analysis .rgt .leamotvs .tupus::after { display: block; content: ""; width: 0; height: 100%; margin: auto; border-right: 1px dashed #e9ecef; position: absolute; top: 0; right: 0; bottom: 0; left: 0;}
.teachs .analysis .rgt .leamotvs .tupus .tp { width: 48%; height: 220px; overflow: hidden;}
.teachs .analysis .rgt .leamotvs .tupus .botm { display: flex; justify-content: space-around; pointer-events: none; width: 100%; height: 30px; line-height: 30px; position: absolute; left: 0; bottom: 0;}
.teachs .analysis .rgt .leamotvs .tupus .botm span { display: block; width: 48%; font-size: 14px; color: #75808a; text-align: center;}

.teachs .analysis .rgt .leamotvs li { float: left; width: calc(50% - 50px); margin: 20px 20px 0 0; padding: 15px 20px; border-radius: 10px; overflow: hidden; background: #f8f9fa;}
.teachs .analysis .rgt .leamotvs li:last-child { margin-right: 0;}
.teachs .analysis .rgt .leamotvs li p { height: 30px; line-height: 30px; font-size: 14px; color: #75808a; padding-left: 30px; background-repeat: no-repeat; background-position: left center;}
.teachs .analysis .rgt .leamotvs li h3 { height: 30px; line-height: 30px; font-size: 24px; color: #141414; padding-left: 30px;}
.teachs .analysis .rgt .leamotvs li:first-child p { background-image: url(../images/hx56.png);}
.teachs .analysis .rgt .leamotvs li:last-child p { background-image: url(../images/hx57.png);}

.teachs .analysis .rgt .leativs { float: right; width: calc(50% - 52.5px); margin-bottom: 25px; padding: 20px; border-radius: 10px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff;}
.teachs .analysis .rgt .leativs li { float: left; width: calc(50% - 59.5px); text-align: center; margin: 0 15px 15px 0; padding: 25px; border: 1px solid #e8eaec ; border-radius: 10px; overflow: hidden;}
.teachs .analysis .rgt .leativs li:last-child { margin-right: 0;}
.teachs .analysis .rgt .leativs li img { display: block; width: 48px; height: 48px; margin: 0 auto 10px auto;}
.teachs .analysis .rgt .leativs li p { width: 100%; height: 40px; line-height: 40px; font-size: 14px; color: #262833;}
.teachs .analysis .rgt .leativs li h3 { width: 100%; height: 25px; line-height: 25px; font-size: 20px; color: #262833;}
.teachs .analysis .rgt .leativs .cql { padding: 40.5px 25px; border: 1px solid #e8eaec ; border-radius: 10px; overflow: hidden;}
.teachs .analysis .rgt .leativs .cql p { display: flex; flex-direction: row; justify-content: space-between; width: 100%; height: 30px; line-height: 30px;}
.teachs .analysis .rgt .leativs .cql p span { display: block; font-size: 16px; color: #262833;}
.teachs .analysis .rgt .leativs .cql p b { display: block; font-size: 24px; color: #141414;}
.teachs .analysis .rgt .leativs .cql .bar { display: flex; flex-direction: row; width: 100%; height: 12px; margin-top: 15px; border-radius: 6px; overflow: hidden; background: #e9ecef;}
.teachs .analysis .rgt .leativs .cql .bar span { display: block; height: 100%; border-radius: 6px; overflow: hidden; background: #b539e3;}

.teachs .analysis .rgt .studpic { padding: 20px; border-radius: 10px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff;}
.teachs .analysis .rgt .studpic .chose { display: flex; flex-direction: row; float: right; width: 260px; height: 35px; position: absolute; top: -2px; right: 0;}
.teachs .analysis .rgt .studpic .chose::after { display: block; content: ""; width: 0; height: 0; border-style: solid; border-width: 5px 5px 0 5px; border-color: #333 transparent transparent transparent; position: absolute; right: 10px; top: 15px;}
.teachs .analysis .rgt .studpic .chose label { display: block; line-height: 35px; font-size: 14px; color: #75808a; margin-right: 5px;}
.teachs .analysis .rgt .studpic .chose select { flex: 1 1 0%; height: 33px; line-height: 33px; font-size: 14px; color: #000; padding: 0 15px; border: 1px solid #dee2e6; border-radius: 25px; overflow: hidden; background: #fff; appearance: none; -moz-appearance: none; -webkit-appearance: none;}

.teachs .analysis .rgt .studpic table { width: 100%;}
.teachs .analysis .rgt .studpic table th,
.teachs .analysis .rgt .studpic table td { line-height: 25px; padding: 10px 20px;}
.teachs .analysis .rgt .studpic table th { font-weight: 500; font-size: 14px; color: #141414; background: #f1f3f5;}
.teachs .analysis .rgt .studpic table td { font-size: 15px; color: #262833; text-align: center; border-bottom: 1px solid #f1f3f5;}
.teachs .analysis .rgt .studpic table td .nam { width: 100%;}
.teachs .analysis .rgt .studpic table td .nam img { float: left; width: 35px; height: 35px; margin-top: 5px; border-radius: 50%; overflow: hidden;}
.teachs .analysis .rgt .studpic table td .msg { float: right; width: calc(100% - 45px); text-align: left;}
.teachs .analysis .rgt .studpic table td .msg p { width: 100%; height: 25px; line-height: 25px; font-size: 14px; color: #141414; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.teachs .analysis .rgt .studpic table td .msg span { display: block; width: 100%; height: 20px; line-height: 20px; font-size: 12px; color: #75808a;}
.teachs .analysis .rgt .studpic table td .bars { display: flex; flex-direction: row; justify-content: space-between; align-items: center; width: 100%; height: 40px;}
.teachs .analysis .rgt .studpic table td .bars .bar { flex: 1 1 0%; display: flex; flex-direction: row; height: 10px; margin-top: 2px; border-radius: 5px; overflow: hidden; background: #f1f3f5;}
.teachs .analysis .rgt .studpic table td .bars .bar span { display: block; height: 10px; border-radius: 5px; overflow: hidden; background: #6b30e7;}
.teachs .analysis .rgt .studpic table td .bars p { line-height: 40px; font-size: 16px; color: #141414; margin-left: 20px;}

/***************学生端***************/
.students { width: 100%; padding: 2.5vw 0; background: url(../images/hx62.png) no-repeat center top;}
.students .tit { width: 100%; height: 30px; line-height: 30px; margin-bottom: 15px;}
.students .tit h3 { float: left; font-size: 18px; color: #141414;}
.students .tit p { display: flex; flex-direction: row; float: right;}
.students .tit p span { display: block; font-size: 15px; color: #5c6cff; padding-left: 20px; background: url(../images/hx89.png) no-repeat left center;}
.students .tit p select { height: 30px; line-height: 30px; font-size: 15px; color: #5c6cff; margin-left: 20px; padding-right: 5px; border: none; overflow: hidden; background: #fff;}
.students .backs { display: inline-block; height: 40px; line-height: 40px; font-size: 16px; color: #141414; margin-bottom: 25px; padding: 0 24px 0 45px; text-align: center; border-radius: 20px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff; position: relative; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .backs::after { display: block; content: ""; width: 6px; height: 6px; border-left: 1px solid #333; border-bottom: 1px solid #333; -webkit-transform-origin: 50%; transform-origin: 50%; -webkit-transform: rotate(45deg); transform: rotate(45deg); border-radius: 0 0 0 2px; overflow: hidden; position: absolute; left: 25px; top: 18px; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .backs:hover { color: #fff; background: #4153f9;}
.students .backs:hover::after { border-color: #fff;}

.students .topnam { width: 100%; text-align: center; letter-spacing: 2px; margin-bottom: 2.5vw;}
.students .topnam h1 { width: 100%; height: 4vw; line-height: 4vw; font-size: 2vw; color: #141414;}
.students .topnam p { display: flex; flex-direction: row; justify-content: center; width: 100%; height: 2vw; line-height: 2vw; letter-spacing: 0;}
.students .topnam p span { display: block; font-size: 1vw; color: #75808A; margin: 0 20px;}
.students .topnam .tabs { width: 500px; margin: 30px auto 0 auto; padding: 2px; border-radius: 30px; overflow: hidden; background: linear-gradient(#4153f9,#8D98f7);}
.students .topnam .tabs li { float: left; width: calc(100% / 3); height: 50px; border-radius: 30px; position: relative;}
.students .topnam .tabs li::before,
.students .topnam .tabs li::after { display: none; content: ""; width: 55px; height: 50px; background-repeat: no-repeat; background-position: 0 0; position: absolute; z-index: 1;}
.students .topnam .tabs li::before { background-image: url(../images/hx15h.png); left: 0; bottom: 0;}
.students .topnam .tabs li::after { background-image: url(../images/hx16h.png); right: 0; top: 0;}
.students .topnam .tabs li a { display: flex; flex-direction: row; justify-content: center; line-height: 50px; font-size: 20px; color: #fff; position: relative; z-index: 2;}
.students .topnam .tabs li a span { display: block; padding-left: 30px; background-repeat: no-repeat; background-position: left center;}
.students .topnam .tabs li.on { background: #fff;}
.students .topnam .tabs li.on::before,
.students .topnam .tabs li.on::after { display: block;}
.students .topnam .tabs li.on a { color: #5c6cff;}
.students .topnam .tabs .nm01 a span { background-image: url(../images/hx17.png);}
.students .topnam .tabs .nm01.on a span { background-image: url(../images/hx17s.png);}
.students .topnam .tabs .nm02 a span { background-image: url(../images/hx63.png);}
.students .topnam .tabs .nm02.on a span { background-image: url(../images/hx63h.png);}
.students .topnam .tabs .nm03 a span { background-image: url(../images/hx64.png);}
.students .topnam .tabs .nm03.on a span { background-image: url(../images/hx64h.png);}

.students .count { width: 100%;}
.students .count li { float: left; width: calc(100% / 3 - 17px); margin: 0 25px 25px 0; border-radius: 10px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff; position: relative;}
.students .count li:last-child { margin-right: 0;}
.students .count li:last-child:after { display: block; content: ""; width: 8px; height: 8px; margin: auto; border-top: 1px solid #333; border-right: 1px solid #333; border-radius: 0 2px 0 0; -webkit-transform-origin: 50%; transform-origin: 50%; -webkit-transform: rotate(45deg); transform: rotate(45deg); overflow: hidden; position: absolute; right: 30px; top: 0; bottom: 0; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .count li a { display: flex; flex-direction: row; padding: 25px;}
.students .count li img { display: block; width: 80px; height: 80px; margin-right: 20px;}
.students .count li .msg { flex: 1 1 0%;}
.students .count li .msg p { width: 100%; height: 40px; line-height: 40px; font-size: 20px; color: #141414; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .count li .msg h3 { display: flex; flex-direction: row; width: 100%; height: 40px; line-height: 40px; font-weight: 500; font-size: 16px; color: #75808a;}
.students .count li .msg h3 b { display: block; font-size: 30px; color: #141414; margin-right: 10px;}
.students .count li .msg h3 span { line-height: 25px; font-size: 14px; margin-top: 10px;}
.students .count li:hover .msg p { color: #4153f9;}
.students .count li:last-child:hover:after { border-color: #4153f9;}

.students .twosmytdo { float: left; width: calc(50% - 62.5px); height: 350px; padding: 25px; border-radius: 10px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); background: #fff;}
.students .twosmytdo .top { width: 100%;}
.students .twosmytdo .top li { display: flex; flex-direction: row; justify-content: center; align-items: center; float: left; width: calc(100% / 3 - 13px); height: 40px; line-height: 40px; font-size: 14px; color: #141414; margin-right: 15px; border: 1px solid #e9ecef; border-radius: 25px; background: #fff;}
.students .twosmytdo .top li:last-child { margin-right: 0;}
.students .twosmytdo .top li b { display: block; font-size: 16px; margin: 0 10px;}
.students .twosmytdo .top li .red { color: #ea2d1e;}
.students .twosmytdo .top li .yell { color: #eb880e;}
.students .twosmytdo .top li .bule { color: #1a70ea;}
.students .twosmytdo .top li i { display: block; width: 15px; height: 15px; line-height: 15px; font-style: normal; font-size: 12px; color: #fff; text-align: center; border-radius: 50%; background: #ea2d1e;}
.students .twosmytdo .lst { width: 100%; height: 245px; margin-top: 19px; overflow-y: scroll; scrollbar-width: none;}
.students .twosmytdo .lst::-webkit-scrollbar { width: 0; height: 0;}
.students .twosmytdo .lst .no-data { text-align: center; padding: 30px; color: #999; font-size: 14px;}
.students .twosmytdo .lst .item-box { margin-bottom: 20px; padding-left: 30px; position: relative;}
.students .twosmytdo .lst .item-box:last-child { margin-bottom: 0;}
.students .twosmytdo .lst .item-box::after { display: block; content: ""; width: 6px; height: 6px; margin: auto; border-radius: 50%; overflow: hidden; background: #adb5bd; position: absolute; left: 5px; top: 0; bottom: 0;}
.students .twosmytdo .lst .item-box:nth-child(1)::after { background: #ea2d1e;}
.students .twosmytdo .lst .item-box:nth-child(2)::after { background: #eb880e;}
.students .twosmytdo .lst .item-box:nth-child(3)::after { background: #1a70ea;}
.students .twosmytdo .lst .item-box h3 { display: flex; flex-direction: row; align-items: center; width: 100%; height: 25px; line-height: 25px; font-weight: 500; font-size: 15px; color: #141414; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .twosmytdo .lst .item-box h3 span { display: block; height: 18px; line-height: 19px; font-size: 10px; color: #1a70ea; margin-right: 10px; padding: 0 5px; border: 1px solid #a2c5f9; border-radius: 4px; overflow: hidden; background: #e6f4ff;}
.students .twosmytdo .lst .item-box p { display: flex; flex-direction: row; justify-content: space-between; width: 100%; height: 25px; line-height: 25px; font-size: 12px; color: #75808a;}
.students .twosmytdo .lst .item-box p span { display: flex; flex-direction: row; align-items: center;}
.students .twosmytdo .lst .item-box p span i { display: block; font-style: normal; margin-right: 20px;}
.students .twosmytdo .lst .item-box p span .red { color: #ea2d1e;}
.students .twosmytdo .lst .item-box p span .yell { color: #eb880e;}
.students .twosmytdo .lst .item-box p span .bule { color: #1a70ea;}
.students .twosmytdo .lst .item-box p span .dtj { height: 20px; line-height: 20px; font-size: 11px; color: #eb880e; padding: 0 5px; border: 1px solid #fad2a0; border-radius: 10px; background: #fff5e2;}
.students .twosmytdo .lst .item-box p b { float: right; font-weight: 500;}
.students .twosmytdo .lst .item-box:hover h3 { color: #4153f9;}

.students .twosmytdo .tit { position: relative;}
.students .twosmytdo .tit .chose { cursor: pointer; color: #6b30e7; font-size: 14px;}
.students .twosmytdo .tit .filter-box { display: none; width: 300px; padding: 20px; border-radius: 8px; box-shadow: 0 5px 10px 0 rgba(0,0,0,0.1); background: #fff; position: absolute; top: 35px; right: 0; z-index: 999;}
.students .twosmytdo .tit .filter-box.show { display: block;}
.students .twosmytdo .tit .filter-box .item { margin-bottom: 15px;}
.students .twosmytdo .tit .filter-box .item:last-child { margin-bottom: 0;}
.students .twosmytdo .tit .filter-box .item label { display: block; font-size: 14px; color: #606266; margin-bottom: 8px;}
.students .twosmytdo .tit .filter-box .item input,
.students .twosmytdo .tit .filter-box .item select { width: 100%; height: 32px; line-height: 32px; border: 1px solid #dcdfe6; border-radius: 4px; padding: 0 10px; box-sizing: border-box; font-size: 13px; color: #606266;}
.students .twosmytdo .tit .filter-box .item input:focus,
.students .twosmytdo .tit .filter-box .item select:focus { border-color: #6b30e7; outline: 0;}
.students .twosmytdo .tit .filter-box .btns { display: flex; justify-content: flex-end; margin-top: 20px; padding-top: 15px; border-top: 1px solid #ebeef5;}
.students .twosmytdo .tit .filter-box .btns span { display: inline-block; padding: 0 15px; height: 28px; line-height: 28px; border-radius: 3px; font-size: 12px; cursor: pointer; margin-left: 10px;}
.students .twosmytdo .tit .filter-box .btns .reset { border: 1px solid #dcdfe6; color: #606266;}
.students .twosmytdo .tit .filter-box .btns .submit { background: #6b30e7; color: #fff; border: 1px solid #6b30e7;}

.students .twoscouring { float: right; width: calc(50% - 62.5px); height: 350px; padding: 25px; border-radius: 10px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff;}
.students .twoscouring .swiper-container { min-height: 250px;}
.students .twoscouring .swiper-slide { width: 230px;}
.students .twoscouring .swiper-slide .img { width: 230px; height: 190px; border-radius: 10px; overflow: hidden;}
.students .twoscouring .swiper-slide .img img { display: block; width: 100%; min-height: 190px; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .twoscouring .swiper-slide .msg { padding: 0 10px;}
.students .twoscouring .swiper-slide .msg h3 { width: 100%; height: 50px; line-height: 50px; font-weight: 500; font-size: 16px; color: #141414; margin-bottom: 15px; border-bottom: 1px solid #e9ecef; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .twoscouring .swiper-slide .msg p { height: 25px; line-height: 25px; font-size: 12px; color: #75808a; padding-left: 25px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; background-repeat: no-repeat; background-position: left center; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .twoscouring .swiper-slide .msg .ren { background-image: url(../images/hx90.png);}
.students .twoscouring .swiper-slide .msg .tim { background-image: url(../images/hx91.png);}
.students .twoscouring .swiper-slide:hover .img img { transform: scale(1.1,1.1);}
.students .twoscouring .swiper-slide:hover .msg h3 { color: #4153f9;}

.students .thstyles { float: left; width: 35%; height: 880px; margin-top: 25px; padding: 25px; border-radius: 10px; box-sizing: border-box; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff;}
.students .thstyles .tups { width: 100%; height: 340px; overflow: hidden;}
.students .thstyles .lst { width: 100%; height: 445px; overflow-y: scroll; scrollbar-width: none;}
.students .thstyles .lst::-webkit-scrollbar { width: 0; height: 0;}
.students .thstyles .lst li { margin-top: 10px; padding: 10px 20px; border: 1px solid #e9ecef; border-radius: 12px; overflow: hidden;}
.students .thstyles .lst li h3 { display: flex; flex-direction: row; align-items: center; width: 100%; height: 30px; line-height: 30px; font-weight: 500; font-size: 16px; color: #5c6cff;}
.students .thstyles .lst li h3 span { display: block; font-size: 14px; color: #262833; margin: 0 10px;}
.students .thstyles .lst li h3 i { display: block; height: 20px; line-height: 20px; font-style: normal; font-size: 12px; padding: 0 10px; border-radius: 10px; overflow: hidden;}
.students .thstyles .lst li h3 .veryStrong { color: #f85353; background: #feeeee;}
.students .thstyles .lst li h3 .strong { color: #f28500; background: #fff5e5;}
.students .thstyles .lst li h3 .balance { color: #1a70ea; background: #e6f4ff;}
.students .thstyles .lst li h3 .low { color: #1fb41f; background: #e9f9e9;}
.students .thstyles .lst li h3 .veryLow { color: #909399; background: #f4f4f5;}
.students .thstyles .lst li p { line-height: 22px; font-size: 12px; color: #75808a; margin-top: 5px;}

.students .thmotvas { float: left; width: 35%; margin: 25px 25px 0 25px; padding: 25px; border-radius: 10px; box-sizing: border-box; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff;}
.students .thmotvas .img { width: 100%; height: 260px; text-align: center; padding: 40px 0; position: relative;}
.students .thmotvas .img img { display: block; width: 170px; height: 180px; margin: 0 auto 30px auto;}
.students .thmotvas .img b { display: block; height: 35px; line-height: 35px; font-weight: 500; font-size: 18px; color: #fff; letter-spacing: 2px; margin: auto; position: absolute; left: 0; right: 0; top: 163px; z-index: 2;}
.students .thmotvas .img span { display: inline-block; height: 40px; line-height: 40px; font-size: 16px; color: #1a70ea; padding: 0 20px; border-radius: 25px; overflow: hidden; background: #eff6ff;}
.students .thmotvas .msg { height: 445px; line-height: 30px; font-size: 14px; color: #75808a; text-align: justify; overflow-y: scroll; scrollbar-width: none;}
.students .thmotvas .msg::-webkit-scrollbar { width: 0; height: 0;}
.students .thmotvas .msg img { max-width: 100%; height: auto !important;}

.students .threxpers { float: right; width: calc(30% - 100px); height: 455px; margin: 25px 0; padding: 25px; border-radius: 10px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff;}
.students .threxpers .lst { width: 100%; height: 410px; overflow-y: scroll; scrollbar-width: none;}
.students .threxpers .lst::-webkit-scrollbar { width: 0; height: 0;}
.students .threxpers .lst li { width: 100%; margin-bottom: 10px; border-radius: 8px; overflow: hidden; background: #f8f9fa;}
.students .threxpers .lst li:last-child { margin-bottom: 0;}
.students .threxpers .lst li a { display: flex; flex-direction: row; justify-content: space-between; padding: 10px 15px;}
.students .threxpers .lst li .msg { flex: 1 1 0%;}
.students .threxpers .lst li .msg h3 { width: 100%; height: 25px; line-height: 25px; font-weight: 500; font-size: 16px; color: #141414; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .threxpers .lst li .msg p { width: 100%; height: 25px; line-height: 25px; font-size: 14px; color: #75808a; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.students .threxpers .lst li .grad { width: 60px; height: 50px; line-height: 40px; font-weight: bold; font-size: 30px; color: #ea2d1e; text-align: center; padding-right: 5px; overflow: hidden; background: url(../images/hx92.png) no-repeat center bottom;}
.students .threxpers .lst li:hover .msg h3 { color: #4153f9;}

.students .thrnews { float: right; width: calc(30% - 100px); height: 300px; padding: 25px; border-radius: 10px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff;}
.students .thrnews .tit a { display: block; float: right; width: 40px; height: 30px; position: relative;}
.students .thrnews .tit a::after { display: block; content: ""; width: 8px; height: 8px; margin: auto; border-top: 1px solid #333; border-right: 1px solid #333; -webkit-transform-origin: 50%; transform-origin: 50%; -webkit-transform: rotate(45deg); transform: rotate(45deg); border-radius: 0 2px 0 0; overflow: hidden; position: absolute; right: 2px; top: 0; bottom: 0;}
.students .thrnews li { width: 100%; height: 50px; line-height: 50px; border-bottom: 1px dashed #e9ecef;}
.students .thrnews li a { display: block; width: 100%; font-size: 16px; color: #141414; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .thrnews li:hover a { color: #4153f9;}

.students .ailearn { padding: 30px; border-radius: 10px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff; position: relative;}
.students .ailearn h1 { width: 100%; height: 30px; line-height: 30px; font-size: 20px; color: #262833; margin-bottom: 20px;}
.students .ailearn li { float: left; width: calc(100% / 5 - 18.5px); margin: 0 20px 20px 0; border: 1px solid #e8eaec; border-radius: 10px; overflow: hidden;}
.students .ailearn li:nth-child(5n) { margin-right: 0;}
.students .ailearn li a { display: block; padding: 15px;}
.students .ailearn li img { display: block; float: left; width: 48px; height: 48px;}
.students .ailearn li .msg { float: right; width: calc(100% - 65px);}
.students .ailearn li .msg h3 { width: 100%; height: 25px; line-height: 25px; font-weight: 500; font-size: 17px; color: #262833; margin-bottom: 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .ailearn li .msg p { width: 100%; height: 45px; line-height: 22px; font-size: 13px; color: #70748c; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;}

.students .digitals { width: 100%;}
.students .digitals .nam { display: flex; flex-direction: row; justify-content: center; align-items: center; width: 100%; height: 30px; line-height: 30px; background: #fff;}
.students .digitals .nam img { display: block; width: 28px; height: 28px; margin-right: 10px;}
.students .digitals .nam span { display: block; font-weight: bold; font-size: 22px; color: #141414;}
.students .digitals .nr { padding: 25px; border-radius: 0 0 10px 10px; overflow: hidden; box-shadow: 0 5px 10px rgba(106,104,158,0.025); background: #fff;}
.students .digitals .nr .lst { overflow-y: scroll; scrollbar-width: none;}
.students .digitals .nr .lst::-webkit-scrollbar { width: 0; height: 0;}
.students .digitals .nr .lst .top { width: 100%;}
.students .digitals .nr .lst .top li { margin-bottom: 15px; border: 1px solid #e9ecef; border-radius: 10px; overflow: hidden; background: #fff; position: relative; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .digitals .nr .lst .top li::after { display: block; content: ""; width: 8px; height: 8px; margin: auto; border-top: 1px solid #333; border-right: 1px solid #333; -webkit-transform-origin: 50%; transform-origin: 50%; -webkit-transform: rotate(45deg); transform: rotate(45deg); border-radius: 0 2px 0 0; overflow: hidden; position: absolute; right: 25px; top: 0; bottom: 0; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .digitals .nr .lst .top li a { display: block; padding: 20px;}
.students .digitals .nr .lst .top li img { display: block; float: left; width: 56px; height: 56px;}
.students .digitals .nr .lst .top li .msg { float: right; width: calc(100% - 65px);}
.students .digitals .nr .lst .top li .msg h3 { width: 100%; height: 35px; line-height: 30px; font-weight: 500; font-size: 18px; color: #141414; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .digitals .nr .lst .top li .msg p { width: 100%; height: 20px; line-height: 20px; font-size: 13px; color: #75808a; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.students .digitals .nr .lst .top li:hover,
.students .digitals .nr .lst .top li:hover::after { border-color: #4153f9;}
.students .digitals .nr .lst .top li:hover .msg h3 { color: #4153f9;}
.students .digitals .nr .lst .botm { width: 100%; margin-top: 25px;}
.students .digitals .nr .lst .botm h3 { width: 100%; height: 35px; line-height: 35px; font-weight: 500; font-size: 14px; color: #75808a; margin-bottom: 20px;}
.students .digitals .nr .lst .botm li { float: left; width: calc(100% / 4); text-align: center; margin-bottom: 20px;}
.students .digitals .nr .lst .botm li img { display: block; width: 24px; height: 24px; margin: 0 auto 5px auto;}
.students .digitals .nr .lst .botm li p { width: 100%; height: 25px; line-height: 25px; font-size: 13px; color: #75808a; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .digitals .nr .lst .botm li:hover p { color: #4153f9 !important;}
.students .digitals .srmarts,
.students .digitals .selfplatfs,
.students .digitals .resplatfs { float: left; box-sizing: border-box; background-repeat: no-repeat; background-size: 100%;}
.students .digitals .srmarts { width: 30%; margin-top: 75px; padding: 4% 0 25px 2.5%; overflow: hidden; background-image: url(../images/hx65.png); background-position: right top;}
.students .digitals .srmarts .nr .lst { height: 500px;}
.students .digitals .selfplatfs { width: 40%; padding: 4% 2.5% 0 2.5%; border-radius: 0 0 10px 10px; background-image: url(../images/hx72.png); background-position: center top;}
.students .digitals .selfplatfs .nr .lst { height: 575px;}
.students .digitals .selfplatfs .nr .lst .botm li img { width: 56px; height: 56px; margin-bottom: 10px;}
.students .digitals .selfplatfs .nr .lst .botm li p { font-size: 14px; color: #141414;}
.students .digitals .resplatfs { width: 30%; margin-top: 75px; padding: 4% 2.5% 0 0; background-image: url(../images/hx80.png); background-position: left top;}
.students .digitals .resplatfs .nr .lst { height: 500px;}

.students .learnport { width: 100%;}
.students .learnport .tops { display: flex; flex-direction: row; justify-content: space-between; width: 100%; height: 50px;}
.students .learnport .tops .tab { display: flex; flex-direction: row; width: 40%;}
.students .learnport .tops .tab a { display: block; line-height: 50px; margin-right: 30px; position: relative;}
.students .learnport .tops .tab a::after { display: none; content: ""; width: 52px; height: 26px; background: url(../images/hx84.png) no-repeat left top; position: absolute; left: 0; top: 0; z-index: 1;}
.students .learnport .tops .tab a span { display: block; font-size: 20px; color: #75808a; position: relative; z-index: 2;}
.students .learnport .tops .tab .on::after { display: block;}
.students .learnport .tops .tab .on span { color: #141414;}

.students .learnport .tops .chose { max-width: 60%;}
.students .learnport .tops .chose li { display: flex; flex-direction: row; float: left; height: 50px; margin-left: 30px; position: relative;}
.students .learnport .tops .chose li::after { display: block; content: ""; width: 0; height: 0; border-style: solid; border-width: 5px 5px 0 5px; border-color: #333 transparent transparent transparent; position: absolute; right: 15px; top: 23px;}
.students .learnport .tops .chose li label { display: block; line-height: 50px; font-size: 16px; color: #000; margin-right: 10px;}
.students .learnport .tops .chose li select { flex: 1 1 0%; width: 240px; height: 48px; line-height: 48px; font-size: 16px; color: #000; padding: 0 15px; border: 1px solid #dee2e6; border-radius: 25px; overflow: hidden; background: #fff; appearance: none; -moz-appearance: none; -webkit-appearance: none;}

.students .learnport .lst { width: 100%; margin-top: 15px;}
.students .learnport .lst li { float: left; width: calc(100% / 2 - 63px); margin: 0 25px 25px 0; padding: 25px; border-radius: 10px; box-shadow: 0 4px 40px rgba(106,104,158,0.08); overflow: hidden; background: #fff;}
.students .learnport .lst li:nth-child(2n) { margin-right: 0;}
.students .learnport .lst li .nam { width: 100%;}
.students .learnport .lst li .nam img { display: block; float: left; width: 65px; height: 65px; border-radius: 10px; overflow: hidden;}
.students .learnport .lst li .nam .msg { float: right; width: calc(100% - 80px);}
.students .learnport .lst li .nam .msg h3 { width: 100%; height: 35px; line-height: 35px; font-size: 24px; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .learnport .lst li .nam .msg p { display: flex; flex-direction: row; width: 100%; height: 30px;}
.students .learnport .lst li .nam .msg p span { display: block; line-height: 30px; font-size: 15px; color: #75808a; margin-right: 30px; position: relative;}
.students .learnport .lst li .nam .msg p span::after { display: block; content: ""; width: 1px; height: 10px; background: #dee2e6; position: absolute; right: -15px; top: 11px;}
.students .learnport .lst li .center { display: flex; flex-direction: row; width: 100%; margin: 20px 0;}
.students .learnport .lst li .center .bars { flex: 1 1 0%; display: flex; flex-direction: row; align-items: center; justify-content: space-between; height: 42px; line-height: 42px;}
.students .learnport .lst li .center .bars p { flex: 1 1 0%; display: flex; flex-direction: row; width: 100%; height: 8px; border-radius: 4px; overflow: hidden; background: #e8eeff;}
.students .learnport .lst li .center .bars p span { display: block; height: 8px; border-radius: 4px; overflow: hidden; background: #5c6cff;}
.students .learnport .lst li .center .bars b { display: block; font-weight: 500; font-size: 24px; color: #5c6cff; margin: 0 30px;}
.students .learnport .lst li .center .btn { display: block; height: 40px; border: 1px solid #5c6cff; border-radius: 25px; overflow: hidden; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .learnport .lst li .center .btn span { display: block; height: 36px; line-height: 36px; font-size: 14px; color: #fff; margin: 2px 3px 2px 3px; padding: 0 35px 0 20px; border-radius: 20px; overflow: hidden; background: #5c6cff url(../images/hx85.png) no-repeat 80px center; -webkit-transition: all .5s ease; transition: all .5s ease;}
.students .learnport .lst li .lft { display: flex; flex-direction: row; float: left; width: calc(100% - 220px); padding: 15px 0; border-radius: 10px; overflow: hidden; background: #f8f9fa;}
.students .learnport .lst li .lft .lt { width: calc(100% / 4); height: 60px; line-height: 25px; font-size: 14px; color: #75808a; text-align: center;}
.students .learnport .lst li .lft .lt b { display: block; height: 35px; line-height: 35px; font-size: 24px; color: #141414;}
.students .learnport .lst li .rgt { float: right; width: 200px; padding: 15px 20px; box-sizing: border-box; border-radius: 10px; overflow: hidden; background: #f8f9fa;}
.students .learnport .lst li .rgt p { width: 100%; height: 30px; line-height: 30px; font-size: 14px; color: #75808a;}
.students .learnport .lst li .rgt p span { color: #141414;}
.students .learnport .lst li .nam:hover .msg h3 { color: #4153f9;}
.students .learnport .lst li .center .btn:hover,
.students .learnport .lst li .center .btn:hover span { border-radius: 4px;}

/*************** 子页公用 *******************/
.fl { float: left;}
.fr { float: right;}
.content { margin: 25px 0; padding: 25px; box-shadow: 0 0 10px rgba(106,104,158,0.08); border-radius: 10px; overflow: hidden; background: #fff;}

/*详情页公用*/
.lh { min-height: 300px; line-height: 30px; font-size: 14px; color: #75808a; text-align: justify;}
.lh img { max-width: 100%; height: auto !important;}
.serchms { font-size: 20px; line-height: 60px; color: #333; text-align: center;}

.show_h3 { margin-bottom: 20px; padding-bottom: 10px; border-bottom: 1px solid #eee; position: relative;}
.show_h3 h3 { line-height: 40px; font-size: 22px; color: #333;}
.show_h3 p { line-height: 25px; font-size: 12px; color: #75808a;}
.show_h3 p span { margin-right: 25px;}
.show_sxp { line-height: 25px; font-size: 14px; color: #75808a; margin-top: 30px; padding-top: 20px; border-top: 1px solid #eee;}
.show_sxp p { width: 45%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.show_sxp a { color: #75808a; -webkit-transition: all .5s ease; transition: all .5s ease;}
.show_sxp .fr { text-align: right;}
.show_sxp a:hover { color: #5f479a;}

/*分页*/
.scott { overflow: hidden; text-align: center; letter-spacing: 2px; margin: 30px auto;}
.scott li { display: inline-block; line-height: 35px; margin: 0 5px; border-radius: 4px; -webkit-transition: all .5s ease; transition: all .5s ease;}
.scott a,
.scott span { display: block; padding: 0px 15px; font-size: 14px; cursor: pointer;}
.scott li:hover a,
.scott li:hover span,
.scott .active span { color: #fff;}
.el-pagination { text-align: center; padding: 20px 0 !important;}
.el-pagination.is-background .btn-prev { margin-left: 0 !important;}
.el-pagination.is-background .btn-prev,
.el-pagination.is-background .btn-next,
.el-pagination.is-background .el-pager li { height: 35px; line-height: 35px; padding: 0 15px; border: 1px solid #eee; background: #fff !important;}

/*课程列表*/
.chosenav { padding: 35px 0; background: linear-gradient(90deg,#dde9fd,#f0f5fb 45%);}
.chosenav .tits { width: 100%; margin-bottom: 20px;}
.chosenav .tits h3 { float: left; height: 40px; line-height: 40px; font-size: 26px; color: #030303;}
.chosenav .tits .srch { float: right; height: 38px; line-height: 38px; font-size: 14px; color: #666; padding: 0 15px; border: 1px solid #e8eaec; border-radius: 4px; overflow: hidden; background: #fff;}
.chosenav .tits .srch input { float: left; width: 180px; line-height: 38px; font-size: 12px; color: #979ea8; padding: 0 10px; border: none; background: #fff;}
.chosenav .srch .btn { width: 40px; background: #70748c url(../images/cd18.png) no-repeat center center;}
.chosenav li { width: 100%; line-height: 30px; margin-top: 15px;}
.chosenav li span { float: left; width: 80px; font-weight: bold; font-size: 16px; color: #333;}
.chosenav li p { float: right; width: calc(100% - 90px);}
.chosenav li p a { display: inline-block; font-size: 14px; color: #333; padding: 0 15px; margin-left: 10px;}
.chosenav li p .on { border-radius: 15px;}
.chosenav li p span { display: inline-block; float: none; font-weight: 500; font-size: 14px; cursor: pointer; text-align: center;}
.chosenav li p .el-popover__reference {}

.el-popover { height: 55vh;}
.el-popover .el-popover__title { line-height: 30px; font-weight: bold; padding-bottom: 10px; border-bottom: 1px solid #eee;}
.el-popover .search-box { width: 500px; position: absolute; right: 12px; top: 6px; z-index: 9;}

.el-popover .lsts { width: 100%; height: calc(55vh - 58px); overflow-y: scroll; scrollbar-width: none;}
.el-popover .lsts::-webkit-scrollbar { width: 0; height: 0;}
.el-popover .lsts a { display: inline-block; line-height: 30px; font-size: 12px; color: #777; margin: 0 10px 10px 0; padding: 0 10px; border: 1px solid #ddd; border-radius: 4px;}
.el-popover .el-input { width: calc(100% - 60px);}
.el-popover .el-button { width: 56px; padding: 11px 20px;}
.el-popover .el-button .el-icon-search::before { color: #fff;}


.sorts { width: 100%; margin-bottom: 25px;}
.sorts a { display: block; float: left; height: 35px; line-height: 35px; font-size: 14px; color: #333; padding: 0 25px; margin-left:-1px; border: 1px solid #e4e4e4; -webkit-transition: all .5s ease; transition: all .5s ease;}

.coulist { width: 100%;}
.coulist li { float: left; width: calc(100% / 4 - 12px); margin: 0 16px 20px 0; border-radius: 4px; box-shadow: 0 2px 8px rgba(0,0,0,0.05); overflow: hidden; background: #fff; -webkit-transition: all .5s ease; transition: all .5s ease;}
.coulist li:nth-child(4n) { margin-right: 0;}
.coulist li a { display: block; width: 100%;}
.coulist li .img { width: 100%; height: 180px; border-radius: 8px 8px 0 0; overflow: hidden; position: relative;}
.coulist li .img i { display: inline-block; min-width: 50px; height: 30px; line-height: 30px; font-size: 12px; color: #fff; font-style: normal; text-align: center; border-radius: 0 0 8px 0; position: absolute; left:-1px; top:-1px; z-index: 2;}
.coulist li .img .cor1 { background: #4892f6;}
.coulist li .img .cor2 { background: #20bec8;}
.coulist li .img .cor3 { background: #f46e52;}
.coulist li .img img { display: block; width: 100%; height: 100%; -webkit-transition: all .5s ease; transition: all .5s ease;}
.coulist li .msg { padding: 15px;}
.coulist li .msg h3 { height: 50px; line-height: 25px; font-weight: bold; font-size: 16px; color: #000; overflow: hidden;}
.coulist li .msg span { display: block; height: 21px; line-height: 21px; font-size: 14px; color: #737373; padding-left: 25px; margin: 15px 10px 15px 0; background: url(../images/cd07.png) no-repeat left top; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.coulist li .msg p { display: inline-block; height: 25px; line-height: 25px; font-size: 12px; color: #737373; padding-right: 10px; border: 1px solid #e8eaec; border-radius: 3px; overflow: hidden;}
.coulist li .msg p i { display: inline-block; font-style: normal; color: #fff; padding: 0 10px;}
.coulist li .msg p .bg1 { background: #ff9700;}
.coulist li .msg p .bg2 { background: #f46e52;}
.coulist li .msg p .bg3 { background: #59be30;}
.coulist li .msg p .bg4 { background: #979ea8;}
.coulist li .mgs { padding: 10px 15px;}
.coulist li .mgs h3 { line-height: 30px; font-weight: bold; font-size: 16px; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.coulist li .mgs p { height: 50px; margin-top: 5px;}
.coulist li .mgs p span { display: block; height: 25px; line-height: 25px; font-size: 13px; color: #bbb;}
.coulist li .mgs p span b { font-weight: 500; color: #666;}
.coulist li:hover { transform: translateY(-7px);}
.coulist li:hover .img img { transform: scale(1.02,1.02);}

.lstnr { margin-top: 10px;}
.lstnr li { width: 285px; margin: 5px 20px 15px 0;}
.lstnr li:nth-child(4n) { margin-right: 0;}
.lstnr li .img { width: 285px; height: 170px;}
.lstnr li .img i { width: 80px; height: 25px; line-height: 25px; font-size: 12px; margin-top: 10px;}
.lstnr li .msg {  height: 90px; padding: 5px 15px 10px 15px;}
.lstnr li .msg h3 { line-height: 30px; font-size: 16px; margin: 5px 0;}
.lstnr li .msg p { float: none; max-width: 100%;}
.lstnr li .msg p span { line-height: 22px; font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}

.nocours { width: 100%; margin: 60px auto; padding-top: 140px; background: url(../images/not-comment.png) no-repeat center top;}
.nocours p { line-height: 30px; font-size: 16px; color: #999; text-align: center;}

/*资源列表*/
.sourlst { width: 100%;}
.sourlst li { float: left; width: calc(100% / 4 - 12px); margin: 0 16px 20px 0; border-radius: 4px; box-shadow: 0 2px 8px rgba(0,0,0,0.08); overflow: hidden; background: #fff; position: relative; -webkit-transition: all .5s ease; transition: all .5s ease;}
.sourlst li:nth-child(4n) { margin-right: 0;}
.sourlst li a { display: block; padding: 15px;}
.sourlst li a i { display: block; width: 50px; height: 25px; line-height: 25px; font-size: 12px; color: #fff; font-style: normal; text-align: center; border: 1px solid #fff; border-radius: 0 0 8px 0; position: absolute; left:-1px; top:-1px; z-index: 2;}
.sourlst li a .cor1 { background: #20bec8;}
.sourlst li a .cor2 { background: #f46e52;}
.sourlst li .img { width: 100%; height: 135px; overflow: hidden; background-repeat: no-repeat; background-position: center;}
.sourlst li .bgs1 { background-color: rgba(72,146,246,0.08); background-image: url(../images/cd08.png);}
.sourlst li .bgs2 { background-color: rgba(255,167,0,0.08); background-image: url(../images/cd09.png);}
.sourlst li .bgs3 { background-color: rgba(32,190,200,0.08); background-image: url(../images/cd10.png);}
.sourlst li .bgs4 { background-color: rgba(116,66,225,0.08); background-image: url(../images/cd11.png);}
.sourlst li .bgs5 { background-color: rgba(35,172,57,0.08); background-image: url(../images/cd12.png);}
.sourlst li .bgs6 { background-color: rgba(177,224,36,0.08); background-image: url(../images/cd13.png);}
.sourlst li .bgs7 { background-color: rgba(88,120,180,0.08); background-image: url(../images/cd14.png);}
.sourlst li .bgs8 { background-color: rgba(42,113,235,0.08); background-image: url(../images/cd15.png);}
.sourlst li .msg { padding-top: 15px;}
.sourlst li .msg h3 { height: 50px; line-height: 25px; font-weight: bold; font-size: 16px; color: #000; word-break: break-all; overflow: hidden;}
.sourlst li .msg span { display: block; float: left; height: 20px; line-height: 20px; font-size: 12px; color: #4d525c; margin: 15px 5px 10px 0; padding: 0 10px; border: 1px solid #dbdee6; border-radius: 10px;}
.sourlst li .msg p { height: 25px; line-height: 25px; font-size: 12px; color: #6c717d; overflow: hidden;}
.sourlst li .msg p i { display: inline-block; font-style: normal; width: 4px; height: 4px; border-radius: 4px; margin: 0 10px; background: #b1b5bf; position: relative; top: 12px;}
.sourlst li:hover { transform: translateY(-7px);}
.sourlst li:hover .img img { transform: scale(1.02,1.02);}
.sourlst li .video { background-color: rgba(72,146,246,0.08); background-image: url(../images/video.png);}
.sourlst li .ppt { background-color: rgba(255,167,0,0.08); background-image: url(../images/ppt.png);}
.sourlst li .image { background-color: rgba(32,190,200,0.08); background-image: url(../images/image.png);}
.sourlst li .mp3 { background-color: rgba(116,66,225,0.08); background-image: url(../images/mp3.png);}
.sourlst li .xls { background-color: rgba(35,172,57,0.08); background-image: url(../images/xls.png);}
.sourlst li .doc { background-color: rgba(42,113,235,0.08); background-image: url(../images/doc.png);}
.sourlst li .audio { background-color: rgba(177,224,36,0.08); background-image: url(../images/audio.png);}
.sourlst li .document { background-color: rgba(255,167,0,0.08); background-image: url(../images/document.png);}
.sourlst li .evercam { background-color: rgba(32,190,200,0.08); background-image: url(../images/evercam.png);}
.sourlst li .link { background-color: rgba(32,190,200,0.08); background-image: url(../images/link.png);}
.sourlst li .file { background-color: rgba(72,146,246,0.08); background-image: url(../images/file.png);}
.sourlst li .flash { background-color: rgba(244,110,82,0.08); background-image: url(../images/flash.png);}
.sourlst li .pdf { background-color: rgba(255,82,93,0.08); background-image: url(../images/pdf.png);}
.sourlst li .scorm { background-color: rgba(88,120,180,0.08); background-image: url(../images/scorm.png);}

/*新闻列表*/
.newlist { width: 100%;}
.newlist li { margin-bottom: 15px; padding: 0 0 15px 15px; border-bottom: 1px solid #eee; position: relative; -webkit-transition: all .5s ease; transition: all .5s ease;}
.newlist li::after { display: block; content: ""; width: 6px; height: 6px; border-radius: 50%; background: #5f479a; position: absolute; left: 0; top: 14.5px;}
.newlist li h3 { width: 100%; height: 35px; line-height: 35px; font-size: 16px; color: #141414; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: all .5s ease; transition: all .5s ease;}
.newlist li p { width: 100%; line-height: 25px; font-size: 13px; color: #75808a; margin-bottom: 10px;}
.newlist li span { display: block; line-height: 25px; font-size: 12px; color: #75808a;}
.newlist li:hover h3 { color: #5f479a;}

/*教师列表*/
.teach { width: 100%;}
.teach li { float: left; width: calc(100% / 4 - 15px); margin: 0 20px 20px 0; -webkit-transition: all .5s ease; transition: all .5s ease;}
.teach li:nth-child(4n) { margin-right: 0;}
.teach li .img { width: 100%; height: 195px; text-align: center; overflow: hidden; background: #eee;}
.teach li .img img { display: inline-block; height: 100%; -webkit-transition: all .5s ease; transition: all .5s ease;}
.teach li h3 { line-height: 25px; font-weight: 500; font-size: 16px; color: #333; margin-top: 10px; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; -webkit-transition: all .5s ease; transition: all .5s ease;}
.teach li p { line-height: 25px; font-size: 12px; color: #999; text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.teach li:hover .img img { transform: scale(1.1,1.1);}

/*搜索*/
.sercher { line-height: 30px; padding: 10px 20px; border-top: 1px solid #f4f4f4; background: #fff;}
.sercher p { font-size: 14px; color: #999;}
.sercher p a { margin-right: 10px;}
.sercher p a:hover,.sercher p .act { font-weight: bold;}