
.contentTop {height: 100%;margin-top: 50px; justify-content: space-between;}

/* circleTable */
.circleTable {background-color: #f1f1f1;  height: 370px; width: 790px;}
.banner-box {width: 100%; height: 370px; background-color: #fff;}
.banner-box .banner{width: 100%;position: relative;border-radius: 8px;}
.banner-box .banner img {width: 100%;height: 240px;position: relative;border-radius: 8px;}
.banner-box .banner h2{font-family: PingFang SC, PingFang SC;font-weight: 500;font-size: 16px;color: #2A3341;line-height: 22px; padding: 24px 24px 12px;}
.banner-box .banner p{font-family: PingFang SC, PingFang SC;font-weight: 400;font-size: 14px;color: #7A7A7A;line-height: 24px; padding: 0 24px;}
.prev { display: block; z-index: 1; text-align: center; color: rgb(255, 255, 255); position: absolute; border-radius: 5px; background: rgba(0, 0, 0, 0.3); line-height: 44px;  top: 34%;}
.next { display: block; z-index: 10; color: rgb(255, 255, 255); text-align: center; position: absolute; background: rgba(0, 0, 0, 0.3); border-radius: 5px; line-height: 44px; top: 34%;}
.prev i, .next i { font-size: 22px; font-weight: bold; margin:0}
.swiper-pagination-bullet{width: 10px !important; height: 10px !important; background-color: #fff !important;}
.swiper-pagination-bullets{width: 90px !important;padding: 3px;left: 50% !important;/* margin-left: -35px !important; */transform: translateX(-50%) !important;/* background-color: rgba(0,0,0,.3) !important; */border-radius: 24px !important;bottom: 107px !important;}

/* login */
.login {background: #f1f1f1 url(/statics/images/loginBg.png) center top no-repeat;height: 370px;}
.loginBox{width: 336px;height: 315px;background: #FFFFFF;border-radius: 4px 4px 0px 4px; margin: 42px 22px 0; position: relative;box-sizing: border-box; padding: 44px 44px 0;}
.tx{width: 46px;height: 46px;background: linear-gradient( 180deg, #FCDAAB 0%, #ED9200 100%);border-radius: 0px 0px 0px 0px;border: 4px solid #FFFFFF; position: absolute; left: 50%; margin-left: -23px; border-radius: 50%; top: -20px;padding: 7px;box-sizing: border-box;}
.loginBox h1{font-family: PingFang SC, PingFang SC;font-weight: 400;font-size: 16px;color: #262626;text-align: center; margin-bottom: 24px;}
.loginBox input[type="text"]{width: 238px;height: 40px;line-height: 40px; background: #F5F5F5;border-radius: 4px 4px 4px 4px; outline: none; border: none; padding-left: 10px; margin-bottom: 20px; color: #333;}
.loginBox input::placeholder{color: #2A3341;}
.loginBox button{width: 248px;height: 32px;background: linear-gradient( 95deg, #FFC064 0%, #EE980D 100%);border-radius: 4px 4px 4px 4px; outline: none; border: none;font-family: PingFang SC, PingFang SC;font-weight: 500;font-size: 12px;color: #FFFFFF; margin-top: 30px;}
/* hotVideo */
.hotVideo {background: #FAFAFA;  height: 345px; position: relative; width: 380px; min-width: 380px;}
.hotVideo ul{margin: 70px 24px 0 20px;}
.hotVideo ul li{margin-bottom: 20px;}
.hotVideo ul li .video{position: relative; width: 93px; min-width: 93px; margin-right: 10px; height: 62px; overflow: hidden;}
.hotVideo ul li .video img{width: 93px; height: 62px;}
.hotVideo ul li .video .mask{background-color: rgba(0,0,0,.2); position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.hotVideo ul li .video .mask i{font-size: 20px; color: #fff; position: absolute; display: block; left: 50%; top:50%;transform: translate(-50%,-50%);}
.hotVideo ul li:hover .video .mask{background-color: rgba(0,0,0,.1);}
.hotVideo ul li h2{font-family: PingFang SC, PingFang SC;font-weight: 400;font-size: 16px;color: #2A3341;line-height: 16px;margin-bottom: 7px; max-width: 233px;}
.hotVideo ul li p{height: 44px;font-family: PingFang SC, PingFang SC;font-weight: 400;font-size: 14px;color: #7A7A7A;line-height: 22px; height: 44px;-webkit-line-clamp: 2; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical;}

/* course */
.course {background-color: #fafafa;}
.midBanner{height: 160px; overflow: hidden;}

.special{display: flex; gap: 30px;}
.special div{background: #f1f1f1;flex: 1;overflow: hidden;}
.special div:hover{transform: translateY(-5px);}
.titles{font-family: PingFang SC, PingFang SC;font-weight: 500;font-size: 20px;color: #2A3341;line-height: 24px;}
.titles b{width: 4px;height: 20px;background: #43A591;border-radius: 0px 0px 0px 0px; display: inline-block; vertical-align: middle; margin-right: 10px;}
.titles a{font-family: PingFang SC, PingFang SC;font-weight: 500;font-size: 16px;color: #43A591;line-height: 24px;}

.masterData {display: flex;}
.masterInr{background: #FAFAFA; margin-bottom: 10px;}
.masterInr:last-child{margin-bottom: 0;}
.masterInr .teacher{margin-right: 20px;width: 136px;height: 136px; overflow: hidden;}
.masterInr .teacher img{width: 136px;}
.masterInr h2{font-family: PingFang SC, PingFang SC;font-weight: 500;font-size: 16px;color: #262626;line-height: 16px; margin-top: 20px; margin-bottom: 10px;}
.masterInr p{width: 614px;font-family: PingFang SC, PingFang SC;font-weight: 400;font-size: 12px;color: #7A7A7A;
line-height: 18px; margin-bottom: 12px; height: 36px;-webkit-line-clamp: 2; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical;}
.masterInr .left{background: #F5F5F7;height: 23px; align-items: center;}
.masterInr .check{height: 12px;background: linear-gradient( 95deg, #FFC064 0%, #EE980D 100%);border-radius: 2px 2px 2px 2px;font-weight: 400;font-size: 8px;color: #FFFFFF;text-align: center;padding: 0 3px;}
.masterInr .join{width: 42px;height: 12px;background: #43A591;border-radius: 2px 2px 2px 2px;font-weight: 400;font-size: 8px;color: #FFFFFF; text-align: center; margin: 0 4px;}
.masterData .masterInr .time{font-family: PingFang SC, PingFang SC;font-weight: 400;font-size: 12px;color: #7A7A7A;line-height: 18px;}

.masterList{height: 120px;box-sizing: border-box;padding: 30px 37px;background: #FAFAFA;margin-top: 30px;display: flex;flex-wrap: wrap;gap: 33px 14px;overflow: hidden;position: relative;}
.masterList a{font-family: PingFang SC, PingFang SC;font-weight: 400;font-size: 16px;color: #262626;line-height: 16px;}
.masterList .more{position: absolute;right: 20px;top: 83px;color: #7A7A7A;}
.masterTalk{display: flex; gap:30px}
.masterTalk .talk{min-height: 200px; background: #f1f1f1; flex: 1;}
.masterTalk .talk .videoImg{width: 277px; height: 200px; overflow: hidden; position: relative;}
.masterTalk .talk .videoImg img{width: 277px; height: 200px;}
.masterTalk .talk  .mask{position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: -10; background: rgba(0,0,0,.5);}
.masterTalk .talk  .mask i{ font-size: 30px; color: #fff; position: absolute; top: 50%; margin-top: -15px; left: 50%; margin-left: -15px;}
.masterTalk .talk:hover .mask{z-index: 10;}
.masterTalk .talk h1{font-family: PingFang SC, PingFang SC;font-weight: 500;font-size: 16px;color: #2A3341;line-height: 16px;}
.masterTalk .talk h3{font-family: PingFang SC, PingFang SC;font-weight: 400;font-size: 12px;color: #2A3341;line-height: 14px;}
.masterTalk .talk article{height: 54px;font-family: PingFang SC, PingFang SC;font-weight: 400;font-size: 12px;color: #7A7A7A;line-height: 18px;-webkit-line-clamp: 3; text-overflow: ellipsis; overflow: hidden; display: -webkit-box; -webkit-box-orient: vertical;}
.forums{display: flex; gap:30px}
.forums .forum{min-height: 200px; background: #f1f1f1; flex: 1;}
.forums .forum .imgShow{width: 380px; height: 195px; overflow: hidden;}
.forums .forum:hover .imgShow img{transform: scale(1.2);}
.forums .forum h3 {font-weight: 500;font-size: 16px;line-height: 22px;color: #262626;}
.forums .forum p{font-weight: 400;font-size: 14px;color: #7A7A7A;line-height: 28px;max-width: 350px;}
.forums .forum a i{font-size: 20px; color: var(--primary);}
.forums .forum .date{font-size: 32px;}
.forums .forum .point,.forums .forum .month{font-weight: 400;font-size: 11px;color: #7A7A7A;margin: 0;line-height: 44px;margin-left: 11px;}
.forums .forum .date{font-size: 30px; line-height: 30px; margin-bottom: 5px; color: var(--primary); font-weight: 600;font-family: PingFang SC, PingFang SC;}
.forums .forum .month{margin-bottom: 20px; color: #7A7A7A;}

.schools {display: flex;}
.tx {
    width: 46px;
    height: 46px;
    background: linear-gradient( 180deg, #FCDAAB 0%, #ED9200 100%);
    border-radius: 0px 0px 0px 0px;
    border: 4px solid #FFFFFF;
    position: absolute;
    left: 50%;
    margin-left: -23px;
    border-radius: 50%;
    top: -20px;
    padding: 7px;
    box-sizing: border-box;
}

