@charset "utf-8";
* {box-sizing:border-box; }

html, body, applet, object, blockquote,
a, abbr, acronym, address, big, cite, span, p,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol,
ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td{padding:0; margin:0; font-size:14px; line-height:24px; font-family:Arial, sans-serif}
.table, .table th, .table td{border-collapse:collapse; border:1px solid #bdc4c9; text-align:center; }
:focus { outline:0;}
html,body { border: 0; padding: 0; margin: 0; background: #fffcf2; color:black; }
div{ text-align: center; text-align: -webkit-center; background-repeat: no-repeat; background-position:center top; overflow: hidden; }
main { max-width: 1920px; margin: 0 auto; overflow: hidden; }
h1, h2, h3 { margin-top: 2rem; }
p { margin-bottom: 1.5rem; } 
a { color: #007bff; text-decoration: none; transition: color 0.3s ease; }
a:hover { text-decoration: none; }
.topspan{ margin-left:43px; font-size: 20px; color:#000; line-height: 25px; display: inline-block; } 
.topspanxy{ margin-left:20px; font-size: 20px; background: #ff7800; padding: 0px 20px; border-radius: 20px; display: inline-block; line-height: 33px; color: #fff; }
/* .topspan:hover{ border-bottom: 2px solid #ff7800; } */
.topspan.active{ border-bottom: 2px solid #ff7800; }
.buttomspan{ margin-right:43px; font-size: 18px; color:#a02800; line-height: 20px; display: inline-block; font-weight: 300;}

.headerpage span, .footerpage .span-href{ cursor: pointer }

.footer-box{ text-align:left; width:1030px; line-height:24px; margin:0 auto; }
.footer-a{ font-family: monospace; unicode-bidi: isolate;text-decoration: none; }
.footer-a:hover { text-decoration: none; }
.footer-text-color{ font-size:18px; font-weight:300; color:#a02800; }

.icspan{ height:94px; position: sticky; background: #ffecd2; margin-bottom: 2px; border-radius: 2px; cursor: pointer; }
.icspan .imgl{ position: absolute; top: 20px; left: 20px;}
.icspan .imgr{ display:none; position: absolute; top: 11px; right: 0; }
.icspanactive{ background: #ff7800; }
.icspanactive .imgr{ display:inline; }
.icspanactive span{ color:#fff !important; }

.prompt-message{width: auto;position: fixed;z-index: 9999;top: 50%;left: 50%;transform: translate(-50%, -50%);background: rgba(0,0,0,0.8);color: #fff;padding: 10px 20px;border-radius: 4px;z-index: 1000;}

/* 学员中心页 */
.content_box {display: flex;flex-direction: column;align-items: center; }
.banner{ width: 100%;min-height: 200px;background: url('/img/pc/stucenter/img_1.png'); }
.course{ width: 100%;background: #fff8e5;overflow: unset; }
.course .center{ margin: 0 auto; width: 1170px;height: 100%;position: relative;display: flex;justify-content: space-between; }
.course .center .clist{ width: 264px;height: auto;border-radius: 20px;background: #fff8e5; }
.clist .title{ min-height: 40px;background: #fff;line-height: 40px;text-align: center;font-weight: 600;font-size: 16px; }
.course_item{ padding: 8px;overflow: auto; }
.course .center .cinfo{ width: 618px;height: 100%;overflow-y: auto;border-radius: 20px;background: url('../img/pc//stucenter/img_2.png') no-repeat center center;background-color: #fff8e5;display: flex;flex-direction: column; }
.cinfo .classeslist ul{ height: 100%;display: flex;flex-wrap: wrap;align-content: flex-start; overflow: auto;padding: 15px 5px;justify-content: space-between; }
/* 滚动条样式 */
.course_item .mescroll::-webkit-scrollbar, .classeslist ul::-webkit-scrollbar {width: 8px; /* 滚动条宽度 */}
.course_item .mescroll::-webkit-scrollbar-track, .classeslist ul::-webkit-scrollbar-track {background: #f1f1f1; /* 滚动条轨道背景色 */}
.course_item .mescroll::-webkit-scrollbar-thumb, .classeslist ul::-webkit-scrollbar-thumb {background-color: #cecece; /* 滚动条滑块颜色 */border-radius: 5px; /* 滚动条滑块圆角 */}
.course_item .mescroll::-webkit-scrollbar-thumb:hover, .classeslist ul::-webkit-scrollbar-thumb:hover {background-color: #cecece; /* 滚动条滑块悬停时颜色 */}
.stuinfo::-webkit-scrollbar{width: 0px; /* 滚动条宽度 */}
/* 滚动条样式 */
.cinfo .title{ min-height: 40px;background: #fff;line-height: 40px;text-align: center;font-weight: 600;font-size: 16px; }
.course .center .stuinfo{ position:relative;width: 264px;height: auto;overflow-y: auto;border-radius: 20px;/* background: #fff8e5;box-shadow: 0 0 10px #fff0d8; */ }
.stuinfo .infobox{ height: 158px;background: #fff;border-radius: 20px;margin-bottom: 16px;display: flex;align-items: center;justify-content: center; }
.stuinfo .logout{ display: none;margin-top: 6px;font-size: 10px;background: #808080;color: #fff;border: none;border-radius: 4px;cursor: pointer;}
.avatar img{ width: 96px;height: 96px;border-radius: 50%; }
.area{ margin-left: 10px;width: 116px;height: 100px;display: flex;flex-direction: column;justify-content: center; }
.area .nickname{ height: 35px !important; line-height: 35px; font-size: 30px;margin-bottom: 10px;font-weight: 800;overflow: hidden;max-width: 116px;white-space: nowrap;text-overflow: ellipsis; }
.area .account{ font-size: 10px;background: #ff7800;color: #fff;border-radius: 4px;cursor: pointer; }
.stuinfo .notice{position: relative;text-align: left;height: 115px;background: #fff;margin-bottom: 16px;border-radius: 20px; }
.notice div{display: flex;justify-content: flex-start;align-items: center;position: relative;z-index: 99;padding:10px;background-color: #fff;}
.notice p{position: absolute;top: 34px;padding: 10px;}
.notice .text{ position: relative;top: -6px; }
.stuinfo .databox{ height: auto;background: #fff;border-radius: 20px;margin-bottom: 15px; }
.concat img{ cursor: pointer;width: 150px;height: 40px; }
.overlay {display: none;position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0, 0, 0, 0.5);z-index: 999;}
.modal,.modal2 {display: none;position: fixed;top: 50%;left: 50%;transform: translate(-51%, -51%);background-color: white;padding: 20px;z-index: 1000;box-shadow: 0 0 10px rgba(0, 0, 0, 0.3);}
.modal,.modal2{ width: 376px;height: 316px;border-radius: 5px;padding: 15px;}
.modal textarea{border: 1px solid #ff6400;width: 100%;min-width: 346px;width: 346px;}
.modal h2,.modal2 h2{margin-top: 0;}
.modal2 div{position: relative;}
.modal2 div img{position: absolute;left: 16px;top: 10px;}
.modal2 input{padding-left: 55px;width: 346px;height: 50px;margin-bottom: 15px;border: 1px solid #ff6400;border-radius: 5px;;font-size: 16px;}
.modal2 .phone{cursor: not-allowed;}
.modal #submit-message, .modal2 .editpwd{width: 140px;height:40px;background-color: #ff6400;border: 1px solid #ff6400;background-color: #ff6400;color: #fff;border-radius: 5px;font-size: 16px;}
.modal #close-modal,.modal2 .close{position: absolute;top: 10px;right: 10px;background: #ff5000;width: 20px;height: 20px;text-align: center;line-height: 20px;color: #fff;cursor: pointer;}
.guidebox { display: none; justify-content: center; align-items: center; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 10000; }
.guidebox img { max-width: 100vw;max-height: 100vh;object-fit: contain; }
/**分页样式*/
.l-page {height: 70px; margin-top: 15px;margin-bottom: 15px;text-align: left;}
.l-page .active{background-color: #ff7800;;border: 1px solid #ff7800;color: #fff;}
.l-page a,.l-page span{overflow: auto;line-height: 44px;margin: 0 3px;padding: 4px 14px;border: 1px solid #dddddd;color: #636363;font-size: 14px;border-radius: 2px;text-decoration: none;}
.l-page a,.l-page span:hover{color: #636363;}
.l-page a.active:hover,.l-page span.active:hover {color: #fff;}
/* 全局模态框样式 */
#confirmModal {display: none; /* 初始状态隐藏 */position: fixed;top: 50%;left: 50%;transform: translate(-51%, -51%);z-index: 1050; /* 可根据需要调整 */overflow: hidden;height: 274px;}
.modal-header{font-size: 20px;font-weight: 600;}
.modal-dialog {width: 100%;height: 100%;}

.modal-content {position: relative;display: flex;flex-direction: column;background-color: #fff;background-clip: padding-box;pointer-events: auto;}
.modal-body{height: 146px;font-size: 18px;line-height: 146px;}
.modal-content button{width: 140px;height:40px;background-color: #ff6400;border: 1px solid #ff6400;background-color: #ff6400;color: #fff;border-radius: 5px;font-size: 16px;}
.modal-content #cancelBtn{background-color: #b6b6b6;border: 1px solid #b6b6b6;}
.logincontent{padding: 50px 20px;position: relative;-webkit-box-sizing: border-box;box-sizing: border-box;background-image: url(../img/pc/student/login_bg.png);background-repeat: no-repeat;background-size: cover;min-height: calc(100vh - 80px);}
.login-form {margin: 0 auto;width: 560px;max-width: 100%;padding: 25px 0;position: relative;-webkit-box-sizing: border-box;box-sizing: border-box;border-radius: 4px;z-index: 2;}
@media screen and (min-height: 550px) {.login-form {position: absolute;top: 40%;left: 50%;-webkit-transform: translateX(-50%);transform: translateX(-50%);margin-top: -220px;}}
.login-title{width: 388px;height: 137px;background-image: url(../img/pc/student/login_title.png);}
.login-box{width: 560px;height: 430px;padding: 63px 60px 20px;margin-top: 35px;background-color: #fff;border-radius: 8px;display: flex;flex-direction: column;align-items: center;}
.login-method{overflow: unset;display: flex;width: 100%;height: auto;margin-bottom: 46px;justify-content: space-around;font-size: 22px;}
.login-method div{overflow: unset;cursor: default;}
.login-method .active{color: #ff5000;position: relative;}
.login-method .active::after{content: "";position: absolute;transform: translate(0px, 5px);inset: 100% 0px 0px;background-color: #ff5000;bottom: -5px;left: 0;}
#getCode{cursor:default;width: auto;padding: 0 10px;font-size: 18px;display: flex;justify-content: center;align-items: center;background-color: #fff;color: #425fda;border: 1px solid #425fda;height: 40px;margin-right: 5px;border-radius: 5px;}
.fw-input {position: relative;font-size: 14px;width: 100%;border: 1px solid #ff6400;border-radius: 4px;margin-bottom: 20px;line-height: 35px;}
.input-prefix {width: 35px;height: 35px;position: absolute;left: 5px;top: 4px;}
.icon-phone {background: url(../img/pc/student/phone.png) center no-repeat;background-size: 25px 25px;}
.icon-pwd {background: url(../img/pc/student/pwd.png) center no-repeat;background-size: 25px 25px;}
.input-inner {display: inline-block;width: 100%;}
.input-inner input{width: 100%;padding: 10px;border: 0px;box-sizing: border-box;height: 46px;font-size: 18px;}
.input-inner input, .input-inner select {padding-left: 40px;}
.agreebox {text-align: left;width: 100%;margin-left: 20px;display: flex;align-items: center;}
.agreebox-chkbox{height: 15px;width: 15px;color: #606266;font-weight: 500;font-size: 14px;margin-right: 5px;position: relative;cursor: pointer;display: inline-block;white-space: nowrap;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;}
.checkbox__input{white-space: nowrap;cursor: pointer;outline: none;display: inline-block;line-height: 1;position: relative;}
.checkbox__inner {display: inline-block;position: relative;top: -2px;border: 1px solid #ddd;border-radius: 2px;-webkit-box-sizing: border-box;box-sizing: border-box;width: 14px;height: 14px;background-color: #fff;z-index: 1;-webkit-transition: border-color .25s cubic-bezier(.71,-.46,.29,1.46), background-color .25s cubic-bezier(.71,-.46,.29,1.46);transition: border-color .25s cubic-bezier(.71,-.46,.29,1.46), background-color .25s cubic-bezier(.71,-.46,.29,1.46);}
.checkbox__input.is-checked .checkbox__inner {background-color: #ff5000;border-color: #ff5000;}
.checkbox__input.is-checked .checkbox__inner:after {-webkit-transform: rotate(45deg) scaleY(1);transform: rotate(45deg) scaleY(1);}
.checkbox__inner:after {-webkit-box-sizing: content-box;box-sizing: content-box;content: "";border: 1px solid #fff;border-left: 0;border-top: 0;height: 7px;left: 4px;position: absolute;top: 1px;-webkit-transform: rotate(45deg) scaleY(0);transform: rotate(45deg) scaleY(0);width: 3px;-webkit-transition: -webkit-transform .15s ease-in .05s;transition: -webkit-transform .15s ease-in .05s;transition: transform .15s ease-in .05s;transition: transform .15s ease-in .05s, -webkit-transform .15s ease-in .05s;-webkit-transform-origin: center;transform-origin: center;}
.checkbox__original {opacity: 0;outline: none;position: absolute;margin: 0;width: 0;height: 0;z-index: -1;}

.agreebox a { color: #aaa; }
.agreebox a:hover { text-decoration: none; }
.submit-btn{padding: 10px 20px;background: #ff5000;color: #fff;border: none;border-radius: 4px;cursor: pointer;width: 100%;margin-top: 33px;height: 48px;}
#overlay {position: absolute;display: none;z-index: 100;left: 0;top: 0;width: 100%;height: 100%;overflow: auto;background-color: rgba(0,0,0,0.4);justify-content: center;align-items: center;}
#agreementContent {background-color: #fefefe;margin: 15% auto;padding: 20px; border: 1px solid #888;width: 80%; height: 60%;display: flex;flex-direction: column;}
#agreementContent .header{height: 40px;display: flex;justify-content: center;position: relative;}
#agreementContent .header #userdeal{font-size: 20px;font-weight: bolder;}
#agreementContent .header #closeAgreement{position: absolute;right: 5px;background: #ff5000;width: 20px;height: 20px;text-align: center;line-height: 20px;color: #fff;cursor: pointer;}
#agreementContent .header #closeAgreement:hover{background: #ff5000a8;}
#agreementContent p{height: calc(100% - 40px);overflow-y: auto;padding: 10px;text-align: left;}

/* 空课程课次骨架屏 */
.empty{
    background-image: linear-gradient(90deg, #fff 25%, #e6e6e6 37%, #fff 63%);
    background-size: 400% 100%;
    background-position: 100% 50%;
    animation: skeleton-screen-loading 1.4s ease infinite;
}
@keyframes skeleton-screen-loading {
    0% {
        background-position: 100% 50%;
    }
    100% {
        background-position: 0 50%;
    }
}