:root {
	--theme-color: #2681FF;
	--theme-color-opacity-0-5: rgba(38,129,255,0.05);
	--theme-color-opacity-1: rgba(38,129,255,0.1);
	--theme-color-opacity-5: rgba(38,129,255,0.5);
	--theme-color-opacity-8: rgba(38,129,255,0.8);
}

.font-theme{
  color: var(--theme-color);
}

.font-theme-force{
  color: var(--theme-color)!important;
}

/* 清除内外边距 */
body,
h1,
h2,
h3,
h4,
h5,
h6,
hr,
p,
blockquote,
dl,
dt,
dd,
ul,
ol,
li,
pre,
fieldset,
button,
input,
textarea,
th,
td {
  margin: 0;
  padding: 0;
}

address,
cite,
dfn,
em,
var {
  font-style: normal;
}

/* 将斜体扶正 */
/* 重置列表元素 */
ul,
li,
ol {
  list-style: none;
}

/* 重置文本格式元素 */

a:hover {
  text-decoration: none;
}

q:before,
q:after {
  content: '';
}

/* 重置表单元素 */
fieldset {
  border: none;
}

/* img 搭车：让链接里的 img 无边框 */
/* 注：optgroup 无法扶正 */
button,
input,
select,
textarea {
  font-size: 100%;
  /* 使得表单元素在 ie 下能继承字体大小 */
}

/*字体图标*/
@font-face {
  font-family: 'icomoon';
  src: url('../../../common/fonts/icomoon.eot?iufg09');
  src: url('../../../common/fonts/icomoon.eot?iufg09#iefix') format('embedded-opentype'),
    url('../../../common/fonts/icomoon.ttf?iufg09') format('truetype'),
    url('../../../common/fonts/icomoon.woff?iufg09') format('woff'),
    url('../../../common/fonts/icomoon.svg?iufg09#icomoon') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face{
  font-family: 'PingFangSC-Semibold';
  src: url('../../../common/fonts/PingFang_SC_Semibold.ttf');
  font-weight: normal;
  font-style: normal;
}

@font-face{
  font-family: 'PingFangSC-Regular';
  src: url('../../../common/fonts/PingFang_SC_Regular.ttf');
  font-weight: normal;
  font-style: normal;
}

@font-face{
  font-family: 'PingFangSC-Thin';
  src: url('../../../common/fonts/PingFang_SC_Thin.ttf');
  font-weight: normal;
  font-style: normal;
}

[class^="icon-"],
[class*=" icon-"] ,
[class^="el-tree-node"]{
  font-family: 'icomoon' !important;
  speak-as: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

.icon-person:before {
  content: "\e900";
}

.icon-search:before {
  content: "\e901";
}

.icon-classify:before {
  content: "\e902";
}

.icon-exit:before {
  content: "\e903";
}

.icon-collection:before {
  content: "\e904";
}

.icon-close:before {
  content: "\e905";
}

.icon-collected:before {
  content: "\e906";
}

.icon-complete:before {
  content: "\e907";
}

.icon-upload:before {
  content: "\e908";
}

.icon-schedule:before {
  content: "\e909";
}

.icon-allcourse:before {
  content: "\e90a";
}

.icon-switch:before {
  content: "\e90b";
}

.icon-calendar:before {
  content: "\e90c";
}

.icon-record:before {
  content: "\e90d";
}

.icon-play:before {
  content: "\e90e";
}

.icon-download:before {
  content: "\e90f";
}

.icon-minus:before {
  content: "\e910";
}

.icon-plus:before {
  content: "\e911";
}

.icon-video:before {
  content: "\e912";
}

.icon-text:before {
  content: "\e913";
}

.icon-minsize:before {
  content: "\e914";
}

.icon-delete:before {
  content: "\e915";
}

.icon-uploadFile:before {
  content: "\e916";
}

.icon-picture:before {
  content: "\e917";
}

.icon-completeFill:before {
  content: "\e918";
}

.icon-newFolder:before {
  content: "\e919";
}

.icon-folder:before {
  content: "\e91a";
}

.icon-suspended:before {
  content: "\e91b";
}

.icon-checked:before {
  content: "\e91c";
}

.icon-start:before {
  content: "\e91d";
}

.icon-other:before {
  content: "\e91e";
}

.icon-move:before {
  content: "\e91f";
}

.icon-copy:before {
  content: "\e920";
}

.icon-rename:before {
  content: "\e921";
}

.icon-swf .path1:before {
  content: "\e922";
  color: rgb(159, 160, 166);
}

.icon-swf .path2:before {
  content: "\e923";
  margin-left: -1.3330078125em;
  color: rgb(159, 160, 166);
}

.icon-swf .path3:before {
  content: "\e924";
  margin-left: -1.3330078125em;
  color: rgb(188, 21, 21);
}

.icon-swf .path4:before {
  content: "\e925";
  margin-left: -1.3330078125em;
  color: rgb(255, 255, 255);
}

.icon-refresh:before {
  content: "\e926";
}

.icon-drawer:before {
  content: "\e927";
}

.icon-layers:before {
  content: "\e928";
}

.icon-numofpeople:before {
  content: "\e929";
}

.icon-sign:before {
  content: "\e92a";
}

.icon-sign2:before {
  content: "\e92b";
}

.icon-label:before {
  content: "\e92c";
}

.icon-signSuccess:before {
  content: "\e92d";
}

.icon-worrySign:before {
  content: "\e92e";
}

.icon-sweepYard:before {
  content: "\e92f";
}

.icon-arrowTop:before {
  content: "\e930";
}

.icon-arrowRight:before {
  content: "\e931";
}

.icon-arrowBottom:before {
  content: "\e932";
}

.icon-arrowLeft:before {
  content: "\e933";
}

.icon-classAddr:before {
  content: "\e934";
}

.icon-teacher:before {
  content: "\e935";
}

.icon-classTime:before {
  content: "\e936";
}

.icon-grade:before {
  content: "\e937";
}

.icon-class:before {
  content: "\e938";
}

.icon-classmates:before {
  content: "\e939";
}

.icon-collegeName:before {
  content: "\e93a";
}

.icon-professionalName:before {
  content: "\e93b";
}

.icon-signFailure:before {
  content: "\e93c";
}

.icon-alreadySigned:before {
  content: "\e93d";
}

.icon-maximize:before {
  content: "\e93e";
}

.icon-home:before {
  content: "\e93f";
}

.icon-building1:before {
  content: "\e940";
}

.icon-building2:before {
  content: "\e941";
}

.icon-building3:before {
  content: "\e942";
}

.icon-Time:before {
  content: "\e943";
}

.icon-ClassroomId:before {
  content: "\e944";
}

.icon-CourseName:before {
  content: "\e945";
}

.icon-Teacher:before {
  content: "\e946";
}

.icon-MoreAndMore:before {
  content: "\e947";
}

.icon-Crowd:before {
  content: "\e948";
}

.icon-FullScroll:before {
  content: "\e949";
}

.icon-apply:before {
  content: "\e94a";
}

.icon-personal-information:before {
  content: "\e94b";
}

.icon-room:before {
  content: "\e94c";
}

.icon-goBack:before {
  content: "\e94d";
}

.icon-recordFile:before {
  content: "\e94e";
}

.icon-connection:before {
  content: "\e94f";
}

.icon-live:before {
  content: "\e950";
}

.icon-arrowDown:before {
  content: "\e951";
}

.icon-arrowUp:before {
  content: "\e952";
}

.icon-coursewareLive:before {
  content: "\e953";
}

.icon-weixin:before {
  content: "\e954";
}

.icon-jsty:before {
  content: "\e955";
}


/*浮动与清除浮动*/
.left {
  float: left;
}

.right {
  float: right;
}

.clearfix:after {
  content: "";
  display: block;
  height: 0;
  clear: both;
}

.clearfix {
  zoom: 1;
}

/*字体大小*/
.font-12 {
  font-size: 12px;
}

.font-13 {
  font-size: 13px;
}

.font-14 {
  font-size: 14px;
}

.font-15 {
  font-size: 15px;
}

.font-16 {
  font-size: 16px;
}

.font-18 {
  font-size: 18px;
}

.font-18-force {
  font-size: 18px!important;
}

.font-19 {
  font-size: 19px;
}

.font-20 {
  font-size: 20px;
}

.font-21 {
  font-size: 21px;
}

.font-21-force{
  font-size: 21px!important;
}

.font-22 {
  font-size: 22px;
}

.font-24 {
  font-size: 24px;
}

.font-24-force {
  font-size: 24px!important;
}

.font-26 {
  font-size: 26px;
}

.font-28 {
  font-size: 28px;
}

.font-30 {
  font-size: 30px;
}

.font-32 {
  font-size: 32px;
}

.font-35{
  font-size: 35px;
}

.font-40{
  font-size: 40px;
}


/*字体颜色*/
.font-white {
  color: #fff;
}

.font-blue {
  color: var(--theme-color);
}

.font-ccc {
  color: #ccc;
}

.font-bbb {
  color: #bbb;
}

.font-ddd {
  color: #ddd;
}

.font-666 {
  color: #666666;
}

.font-333 {
  color: #333333;
}
.font-444 {
  color: #444444;
}
.font-555 {
  color: #555555;
}

.font-888 {
  color: #888888;
}

.font-999 {
  color: #999999;
}
.font-lightBlue {
  color: var(--theme-color);
}

/*字体加粗*/
.f-weight {
  font-weight: bold;
}
.f-weight-300 {
  font-weight: 300;
}
.f-normal{
  font-weight: normal;
}

/* 斜体 */
.f-italic {
  font-style: italic;
}

/*背景颜色*/
.bg-gray {
  background: #b8c0cc;
}

.bg-black-303030 {
  background-color: #303030;
}

.bg-blue {
  background: var(--theme-color);
}

.bg-lightblue {
  background: #00b4db;
}

.bg-f4f4f4 {
  background: #f4f4f4;
}

span.bg-blue:hover,
a.bg-blue:hover {
  background: #237ac1;
}

/*.icon-close:hover{*/
/*color: var(--theme-color);*/
/*}*/
.bg-white {
  background: #fff;
}

/*内边距*/
.p-1 {
  padding: 1px;
}

.p-5 {
  padding: 5px;
}

.p-10 {
  padding: 10px;
}

.p-15 {
  padding: 15px;
}

.p-20 {
  padding: 20px;
}

.p-30 {
  padding: 30px;
}

.p-t-1 {
  padding-top: 1px;
}

.p-t-30 {
  padding-top: 30px;
}

.p-t-b-1 {
  padding-top: 1px;
  padding-bottom: 1px;
}

.p-t-b-5 {
  padding-top: 5px;
  padding-bottom: 5px;
}

.p-t-b-8 {
  padding-top: 8px;
  padding-bottom: 8px;
}

.p-t-b-10 {
  padding-top: 10px;
  padding-bottom: 10px;
}

.p-t-b-15 {
  padding-top: 15px;
  padding-bottom: 15px;
}

.p-t-b-20 {
  padding-top: 20px;
  padding-bottom: 20px;
}

.p-t-b-30 {
  padding-top: 30px;
  padding-bottom: 30px;
}

.p-l-r-5 {
  padding-right: 5px;
  padding-left: 5px;
}

.p-l-r-7 {
  padding-right: 7px;
  padding-left: 7px;
}

.p-l-r-10 {
  padding-right: 10px;
  padding-left: 10px;
}

.p-l-r-15 {
  padding-right: 15px;
  padding-left: 15px;
}

.p-l-r-20 {
  padding-right: 20px;
  padding-left: 20px;
}

.p-l-r-25 {
  padding-right: 25px;
  padding-left: 25px;
}

.p-l-r-30 {
  padding-right: 30px;
  padding-left: 30px;
}

.p-l-5 {
  padding-left: 5px;
}

.p-l-10 {
  padding-left: 10px;
}

.p-l-15 {
  padding-left: 15px;
}

.p-l-20 {
  padding-left: 20px;
}

.p-l-25 {
  padding-left: 25px;
}

.p-l-30 {
  padding-left: 30px;
}

.p-l-35 {
  padding-left: 35px;
}

.p-l-50 {
  padding-left: 50px;
}

.p-l-45 {
  padding-left: 45px;
}

.p-l-67 {
  padding-left: 67px;
}

.p-r-2 {
  padding-right: 2px;
}

.p-r-5 {
  padding-right: 5px;
}

.p-r-10 {
  padding-right: 10px;
}

.p-r-15 {
  padding-right: 15px;
}

.p-r-20 {
  padding-right: 20px;
}

.p-r-40 {
  padding-right: 40px;
}

.p-r-80 {
  padding-right: 80px;
}

.p-t-5 {
  padding-top: 5px;
}

.p-t-6 {
  padding-top: 6px;
}

.p-t-10 {
  padding-top: 10px;
}

.p-t-15 {
  padding-top: 15px;
}

.p-t-20 {
  padding-top: 20px;
}

.p-t-30 {
  padding-top: 30px;
}

.p-b-5 {
  padding-bottom: 5px;
}

.p-b-10 {
  padding-bottom: 10px;
}

.p-b-15 {
  padding-bottom: 15px;
}

.p-b-20 {
  padding-bottom: 20px;
}

.p-n {
  padding: 0;
}

.p-l-n {
  padding-left: 0;
}

.p-r-n {
  padding-right: 0;
}

.p-b-n {
  padding-bottom: 0;
}

.p-t-n {
  padding-top: 0;
}

/*外边距*/
.m-4 {
  margin: 4px;
}

.m-5 {
  margin: 5px;
}

.m-8 {
  margin: 8px;
}

.m-10 {
  margin: 10px;
}

.m-15 {
  margin: 15px;
}

.m-20 {
  margin: 20px;
}

.m-30 {
  margin: 30px;
}

.m-l-1 {
  margin-left: 1px;
}

.m-l-2 {
  margin-left: 2px;
}

.m-l-5 {
  margin-left: 5px;
}

.m-l-10 {
  margin-left: 10px;
}

.m-l-r-5 {
  margin-right: 5px;
  margin-left: 5px;
}

.m-l-r-10 {
  margin-right: 10px;
  margin-left: 10px;
}

.m-l-r-20 {
  margin-right: 20px;
  margin-left: 20px;
}

.m-l-15 {
  margin-left: 15px;
}

.m-l-20 {
  margin-left: 20px;
}

.m-l-30 {
  margin-left: 30px;
}

.m-l-40 {
  margin-left: 40px;
}

.m-l-50 {
  margin-left: 50px;
}

.m-r-3 {
  margin-right: 3px;
}

.m-r-5 {
  margin-right: 5px;
}

.m-r-8 {
  margin-right: 8px;
}

.m-r-10 {
  margin-right: 10px;
}

.m-r-15 {
  margin-right: 15px;
}

.m-r-20 {
  margin-right: 20px;
}

.m-r-50 {
  margin-right: 50px;
}

.m-t-1 {
  margin-top: 1px;
}

.m-t-3 {
  margin-top: 3px;
}

.m-t-5 {
  margin-top: 5px;
}

.m-t-8 {
  margin-top: 8px;
}

.m-t-10 {
  margin-top: 10px;
}

.m-t-15 {
  margin-top: 15px;
}

.m-t-20 {
  margin-top: 20px;
}

.m-t-30 {
  margin-top: 30px;
}

.m-t-40 {
  margin-top: 40px;
}

.m-t-50 {
  margin-top: 50px;
}

.m-t-b-5 {
  margin-top: 5px;
  margin-bottom: 5px;
}

.m-t-b-10 {
  margin-top: 10px;
  margin-bottom: 10px;
}

.m-t-b-15 {
  margin-top: 15px;
  margin-bottom: 15px;
}

.m-t-b-20 {
  margin-top: 20px;
  margin-bottom: 20px;
}

.m-t-b-30 {
  margin-top: 30px;
  margin-bottom: 30px;
}

.m-t-b-50 {
  margin-top: 50px;
  margin-bottom: 50px;
}

.m-b-5 {
  margin-bottom: 5px;
}

.m-b-10 {
  margin-bottom: 10px;
}

.m-b-15 {
  margin-bottom: 15px;
}

.m-b-20 {
  margin-bottom: 20px;
}

.m-b-30 {
  margin-bottom: 30px;
}

.m-b-35 {
  margin-bottom: 35px;
}

.m-n {
  margin: 0;
}

.m-l-n {
  margin-left: 0;
}

.m-r-n {
  margin-right: 0;
}

.m-b-n {
  margin-bottom: 0;
}

.m-t-n {
  margin-top: 0;
}

/*圆角*/
.b-r-50 {
  border-radius: 50%;
  overflow: hidden;
}

.b-r-5 {
  border-radius: 5px;
}

.b-r-8 {
  border-radius: 8px;
}

.b-r-10 {
  border-radius: 10px;
}

.b-r-t-r-5 {
  border-radius: 5px 5px 0 0;
}

.b-r-b-l-5 {
  border-radius: 0 0 5px 5px;
}

.b-r-t-r-8 {
  border-radius: 8px 8px 0 0;
}

.b-r-b-l-8 {
  border-radius: 0 0 8px 8px;
}

.b-r-t-r-10 {
  border-radius: 10px 10px 0 0;
}

.b-r-b-l-10 {
  border-radius: 0 0 10px 10px;
}

/*定位*/
.absolute-t-l {
  position: absolute;
  top: 0;
  left: 0;
}

.absolute-t-r {
  position: absolute;
  top: 0;
  right: 0;
}

.absolute-b-l {
  position: absolute;
  bottom: 0;
  left: 0;
}

.absolute-b-r {
  position: absolute;
  bottom: 0;
  right: 0;
}

.absolute-center {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
}

.fixed-center {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

/*边框*/
.border-none {
  border: none;
}

.border-ddd {
  border: 1px solid #dddddd;
}

.border-t-b-ddd {
  border-top: 1px solid #dddddd;
  border-bottom: 1px solid #dddddd;
}

.border-t-ddd {
  border-top: 1px solid #dddddd;
}

.border-r-ddd {
  border-right: 1px solid #dddddd;
}

.border-b-ddd {
  border-bottom: 1px solid #dddddd;
}

.border-b-eee {
  border-bottom: 1px solid #eeeeee;
}

.border-l-ddd {
  border-left: 1px solid #dddddd;
}


.border-l-r-ddd {
  border-left: 1px solid #dddddd;
  border-right: 1px solid #dddddd;
}

.border-l-ddd-3 {
  border-left: 3px solid #dddddd;
}

/*  */
.border-f2 {
  border: 1px solid #f2f2f2;
}

.border-t-b-f2 {
  border-top: 1px solid #f2f2f2;
  border-bottom: 1px solid #f2f2f2;
}

.border-t-f2 {
  border-top: 1px solid #f2f2f2;
}

.border-r-f2 {
  border-right: 1px solid #f2f2f2;
}

.border-b-f2 {
  border-bottom: 1px solid #f2f2f2;
}

.border-l-f2 {
  border-left: 1px solid #f2f2f2;
}


.border-l-r-f2 {
  border-left: 1px solid #f2f2f2;
  border-right: 1px solid #f2f2f2;
}

.border-l-f2-3 {
  border-left: 3px solid #f2f2f2;
}


.border-blue {
  border: 1px solid var(--theme-color);
}

.border-l-blue-3 {
  border-left: 3px solid var(--theme-color);
}

.border-l-lightBlue-3 {
  border-left: 3px solid var(--theme-color);
}

#timeTable td.border-l-r-blue {
  border-left: 1px solid var(--theme-color);
  border-right: 1px solid var(--theme-color);
}

.border-t-b-blue {
  border-top: 1px solid var(--theme-color);
  border-bottom: 1px solid var(--theme-color);
}

.border-b-blue-3 {
  border-bottom: 3px solid var(--theme-color);
}


.border-b-blue {
  border-bottom: 1px solid var(--theme-color);
}



.border-b-666 {
  border-bottom: 1px solid #666666;
}

/*字体一排显示不下隐藏*/
.text-hidden {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

/*字体两排显示不下隐藏*/
.font-2-hidden {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  display: -moz-box;
  -moz-line-clamp: 2;
  -moz-box-orient: vertical;
  overflow: hidden;
  word-break: break-all;
}

.font-3-hidden {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  display: -moz-box;
  -moz-line-clamp: 3;
  -moz-box-orient: vertical;
  overflow: hidden;
  word-break: break-all;
}

.font-4-hidden {
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  display: -moz-box;
  -moz-line-clamp: 4;
  -moz-box-orient: vertical;
  overflow: hidden;
  word-break: break-all;
}

.font-5-hidden {
  display: -webkit-box;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  display: -moz-box;
  -moz-line-clamp: 5;
  -moz-box-orient: vertical;
  overflow: hidden;
  word-break: break-all;
}
.font-6-hidden {
  display: -webkit-box;
  -webkit-line-clamp: 6;
  -webkit-box-orient: vertical;
  display: -moz-box;
  -moz-line-clamp: 6;
  -moz-box-orient: vertical;
  overflow: hidden;
  word-break: break-all;
}
.font-7-hidden {
  display: -webkit-box;
  -webkit-line-clamp: 7;
  -webkit-box-orient: vertical;
  display: -moz-box;
  -moz-line-clamp: 7;
  -moz-box-orient: vertical;
  overflow: hidden;
  word-break: break-all;
}

.font-8-hidden {
  display: -webkit-box;
  -webkit-line-clamp: 8;
  -webkit-box-orient: vertical;
  display: -moz-box;
  -moz-line-clamp: 8;
  -moz-box-orient: vertical;
  overflow: hidden;
  word-break: break-all;
}

/*display*/

/*子元素上下左右居中*/
.el-block-center {
  display: flex;
  align-items: center;
  justify-content: center;
}

.el-block-space-between {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.el-inline-center {
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.el-vertical-center {
  display: flex;
  align-items: center;
}

.el-inline-vertical-center {
  display: inline-flex;
  align-items: center;
}

.el-inline-space-between {
  display: inline-flex;
  align-items: center;
  justify-content: space-between;
}

.flex {
  flex: 1;
}

.flex-wrap {
  display: flex;
  flex-wrap: wrap;
}

.flex-column {
  display: flex;
  flex-direction: column;
}

.flex-inline-column {
  display: inline-flex;
  flex-direction: column;
}

/*鼠标手型*/
.m-pointer {
  cursor: pointer;
}

.m-not-allowed {
  cursor: not-allowed;
}

/*  */
.v-align-1{
  vertical-align: 1px;
}

/*背景图片大小自适应,位置居中*/
.bg-img-adaptive-box {
  width: 100%;
  padding-top: 56.25%;
  overflow: hidden;
  background-size: cover;
  background-position: center;
}

/*图片大小自适应,位置居中*/
.img-adaptive {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  overflow: hidden;
}

.img-adaptive>img {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.btn {
  padding: 7px 18px;
}

.highlight:hover span {
  color: var(--theme-color);
}

.ofit-cover{
  object-fit: cover;
}

/*元素大小*/
.absolutely {
  width: 100%;
  height: 100%;
}

.full-screen {
  width: 100vw;
  height: 100vh;
}

.w-half {
  display: inline-block;
  width: 50%;
}

div.nav-route a {
  display: inline-block;
  color: #666;
  font-size: 16px;
  line-height: 60px;
  text-decoration: none;
}

div.nav-route a:focus,
div.nav-route a:hover {
  color: var(--theme-color);
}

.no-data-prompt {
  width: 100%;
  line-height: 6;
  color: #ccc;
  font-size: 16px;
}

.scrollbar::-webkit-scrollbar {
  width: 5px;
  height: 30px;
  background-color: #666666;
}

.scrollbar::-webkit-scrollbar-track {
  background-color: #383838;
}

.scrollbar::-webkit-scrollbar-thumb {
  height: 30px;
  background-color: #666;
}


.hbscrollbar::-webkit-scrollbar {
  width: 5px;
  height: 30px;
}

.hbscrollbar::-webkit-scrollbar-track {
  background-color: #ddd;
  border-radius: 5px;
  display: none;
}

.hbscrollbar::-webkit-scrollbar-thumb {
  height: 30px;
  background-color: #ddd;
  border-radius: 5px;
}

.pcscrollbar::-webkit-scrollbar {
  width: 5px;
  height: 30px;
  background-color: #ddd;
}

.pcscrollbar::-webkit-scrollbar-track {
  background-color: #606266;
  border-radius: 5px;
  display: none;
}

.pcscrollbar::-webkit-scrollbar-thumb {
  height: 30px;
  background-color: #909090;
  border-radius: 5px;
}

.text-container {
  padding-right: 0;
  padding-left: 0;
}


/* 背景渐变色 */
.b-gradient-1{
  background: #282537;
  background-image: -webkit-radial-gradient(top, circle cover, #3c3b52 0%, #252233 80%);
  background-image: -moz-radial-gradient(top, circle cover, #3c3b52 0%, #252233 80%);
  background-image: -o-radial-gradient(top, circle cover, #3c3b52 0%, #252233 80%);
}
.b-gradient-2{
  background: -moz-radial-gradient(0% 100%, ellipse cover, rgba(104,128,138,.4) 10%,rgba(138,114,76,0) 40%),
  -moz-linear-gradient(top, rgba(57,173,219,.25) 0%, rgba(42,60,87,.4) 100%), 
  -moz-linear-gradient(-45deg, #670d10 0%, #092756 100%);
  background: -webkit-radial-gradient(0% 100%, ellipse cover, rgba(104,128,138,.4) 10%,rgba(138,114,76,0) 40%), 
  -webkit-linear-gradient(top, rgba(57,173,219,.25) 0%,rgba(42,60,87,.4) 100%), 
  -webkit-linear-gradient(-45deg, #670d10 0%,#092756 100%);
  background: -o-radial-gradient(0% 100%, ellipse cover, rgba(104,128,138,.4) 10%,rgba(138,114,76,0) 40%), 
  -o-linear-gradient(top, rgba(57,173,219,.25) 0%,rgba(42,60,87,.4) 100%), 
  -o-linear-gradient(-45deg, #670d10 0%,#092756 100%);
  background: -webkit-radial-gradient(0% 100%, ellipse cover, rgba(104,128,138,.4) 10%,rgba(138,114,76,0) 40%), 
  linear-gradient(to bottom, rgba(57,173,219,.25) 0%,rgba(42,60,87,.4) 100%), 
  linear-gradient(135deg, #670d10 0%,#092756 100%);
}
.b-gradient-3{
  background-image: linear-gradient(#8b9da9, #fff6e4);
  box-shadow: inset 0 0 100px hsla(0,0%,0%,.3);
}
.b-gradient-4{
  background: radial-gradient(ellipse at top left, rgba(105,155,200,1) 0%,rgba(181,197,216,1) 57%);
}
.b-gradient-5{
  background-image: linear-gradient(45deg, rgba(194, 233, 221, 0.5) 1%, rgba(104, 119, 132, 0.5) 100%), 
  linear-gradient(-45deg, #494d71 0%, rgba(217, 230, 185, 0.5) 80%);
}
.b-gradient-6{
  background: linear-gradient(135deg, rgba(244,226,156,0) 0%,rgba(59,41,58,1) 100%), 
  linear-gradient(to right, rgba(244,226,156,1) 0%,rgba(130,96,87,1) 100%);
}

/* 按钮 */
.btn-hover{
  background-size: 300% 100%;
  transition: all .4s ease-in-out;
  text-align: center;
  border: none;
  outline: none;
  cursor: pointer;
}

.btn-hover.color-1 {
  background-image: linear-gradient(to right, #25aae1, #40e495, #30dd8a, #2bb673);
  box-shadow: 0 4px 15px 0 rgb(49 196 190 / 75%);
}

.btn-hover.color-2 {
  background-image: linear-gradient(to right, #f5ce62, #e43603, #fa7199, #e85a19);
  box-shadow: 0 4px 15px 0 rgb(229 66 10 / 75%);
}

.btn-hover.color-3 {
  background-image: linear-gradient(to right, #667eea, #764ba2, #6B8DD6, #8E37D7);
  box-shadow: 0 4px 15px 0 rgb(116 79 168 / 75%);
}

.btn-hover.color-4 {
  background-image: linear-gradient(to right, #fc6076, #ff9a44, #ef9d43, #e75516);
  box-shadow: 0 4px 15px 0 rgb(252 104 110 / 75%);
}

.btn-hover.color-5 {
  background-image: linear-gradient(to right, #0ba360, #3cba92, #30dd8a, #2bb673);
  box-shadow: 0 4px 15px 0 rgb(23 168 108 / 75%);
}

.btn-hover.color-6 {
  background-image: linear-gradient(to right, #009245, #FCEE21, #00A8C5, #D9E021);
  box-shadow: 0 4px 15px 0 rgb(83 176 57 / 75%);
}

.btn-hover.color-7 {
  background-image: linear-gradient(to right, #6253e1, #852D91, #A3A1FF, #F24645);
  box-shadow: 0 4px 15px 0 rgb(126 52 161 / 75%);
}

.btn-hover.color-8 {
  background-image: linear-gradient(to right, #29323c, #485563, #2b5876, #4e4376);
  box-shadow: 0 4px 15px 0 rgb(45 54 65 / 75%);
}

.btn-hover.color-9 {
  background-image: linear-gradient(to right, #25aae1, #4481eb, #04befe, #3f86ed);
  box-shadow: 0 4px 15px 0 rgb(65 132 234 / 75%);
}

.btn-hover.color-10 {
  background-image: linear-gradient(to right, #ed6ea0, #ec8c69, #f7186a , #FBB03B);
  box-shadow: 0 4px 15px 0 rgb(236 116 149 / 75%);
}

.btn-hover.color-11 {
  background-image: linear-gradient(to right, #eb3941, #f15e64, #e14e53, #e2373f);
  box-shadow: 0 5px 15px rgb(242 97 103 / 40%);
}

.btn-hover:hover {
  background-position: 100% 0;
  /* animation: btncolorMove 0.8s infinite; */
}

.btn-hover:focus{
  outline: none;
}

@keyframes btncolorMove {
  100% {
    background-position: 100% 0;
  }
}

/* --------自定义动画-------- */

.custom-fade-enter-active{
  -webkit-animation:custom-fade-in .3s;
  animation:custom-fade-in .3s
}
.custom-fade-leave-active{
  -webkit-animation:custom-fade-out .3s;
  animation:custom-fade-out .3s
}
@-webkit-keyframes custom-fade-in{
  0%{
    -webkit-transform:translate3d(0,-20px,0);
    transform:translate3d(0,-20px,0);
    opacity:0
  }
  to{
    -webkit-transform:translateZ(0);
    transform:translateZ(0);
    opacity:1
  }
}
@keyframes custom-fade-in{
  0%{
    -webkit-transform:translate3d(0,-20px,0);
    transform:translate3d(0,-20px,0);
    opacity:0
  }
  to{
    -webkit-transform:translateZ(0);
    transform:translateZ(0);
    opacity:1
  }
}
@-webkit-keyframes custom-fade-out{
  0%{
    -webkit-transform:translateZ(0);
    transform:translateZ(0);
    opacity:1
  }
  to{
    -webkit-transform:translate3d(0,-20px,0);
    transform:translate3d(0,-20px,0);
    opacity:0
  }
}
@keyframes custom-fade-out{
  0%{
    -webkit-transform:translateZ(0);
    transform:translateZ(0);
    opacity:1
  }
  to{
    -webkit-transform:translate3d(0,-20px,0);
    transform:translate3d(0,-20px,0);
    opacity:0
  }
}

.num-font-family{
  font-family: tahoma,arial,Hiragino Sans GB,\\5B8B\4F53,sans-serif;
}
