@charset "utf-8";
html,
body,
div,
span,
applet,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
a,
abbr,
acronym,
address,
big,
cite,
code,
del,
dfn,
em,
font,
img,
ins,
kbd,
q,
s,
samp,
small,
strike,
strong,
sub,
sup,
tt,
var,
b,
u,
i,
center,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 14px;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
fieldset,
img {
  border: 0;
}
address,
caption,
cite,
code,
dfn,
em,
strong,
th,
var {
  font-style: normal;
  font-weight: normal;
}
ol,
ul {
  list-style: none;
}
caption,
th {
  text-align: left;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 200%;
  font-weight: normal;
}
:focus {
  outline: 0;
}
a {
  text-decoration: none;
  color: #333;
}
a:hover,
a:active,
a:focus {
  text-decoration: none;
}
a:hover img {
  border: none;
}
textarea {
  resize: none;
}
/* == pubilc == */
/* clearfix  */
.clearfix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
.clearfix {
  *zoom: 1;
}
.clearfix {
  display: block;
}
/* margin and padding */
/* m-left-top-right-bottom  */
.mg5 {
  margin: 5px;
}
.mg10 {
  margin: 10px;
}
.mg15 {
  margin: 15px;
}
.mg20 {
  margin: 20px;
}
.mg25 {
  margin: 25px;
}
.mg30 {
  margin: 30px;
}
.mg35 {
  margin: 35px;
}
.mg40 {
  margin: 40px;
}
/* m-left  */
.mgl5 {
  margin-left: 5px;
}
.mgl10 {
  margin-left: 10px;
}
.mgl15 {
  margin-left: 15px;
}
.mgl20 {
  margin-left: 20px;
}
.mgl25 {
  margin-left: 25px;
}
.mgl30 {
  margin-left: 30px;
}
/* m-right  */
.mgr5 {
  margin-right: 5px;
}
.mgr10 {
  margin-right: 10px;
}
.mgr15 {
  margin-right: 15px;
}
.mgr20 {
  margin-right: 20px;
}
.mgr25 {
  margin-right: 25px;
}
.mgr30 {
  margin-right: 30px;
}
/* m-top  */
.mgt5 {
  margin-top: 5px;
}
.mgt10 {
  margin-top: 10px;
}
.mgt15 {
  margin-top: 15px;
}
.mgt20 {
  margin-top: 20px;
}
.mgt25 {
  margin-top: 25px;
}
.mgt30 {
  margin-top: 30px;
}
/* m-bottom  */
.mgb10 {
  margin-bottom: 10px;
}
.mgb15 {
  margin-bottom: 15px;
}
.mgb20 {
  margin-bottom: 20px;
}
.mgb25 {
  margin-bottom: 25px;
}
.mgb30 {
  margin-bottom: 30px;
}
.mgb40 {
  margin-bottom: 40px;
}
/* m-left-right  */
.mglr5 {
  margin-left: 5px;
  margin-right: 5px;
}
.mglr10 {
  margin-left: 10px;
  margin-right: 10px;
}
.mglr15 {
  margin-left: 15px;
  margin-right: 15px;
}
.mglr20 {
  margin-left: 20px;
  margin-right: 20px;
}
.mglr25 {
  margin-left: 25px;
  margin-right: 25px;
}
.mglr30 {
  margin-left: 30px;
  margin-right: 30px;
}
/* m-top-bottom  */
.mgtb5 {
  margin-top: 5px;
  margin-bottom: 5px;
}
.mgtb10 {
  margin-top: 10px;
  margin-bottom: 10px;
}
.mgtb15 {
  margin-top: 15px;
  margin-bottom: 15px;
}
.mgtb20 {
  margin-top: 20px;
  margin-bottom: 20px;
}
.mgtb25 {
  margin-top: 25px;
  margin-bottom: 25px;
}
.mgtb30 {
  margin-top: 30px;
  margin-bottom: 30px;
}
/* p-left-top-right-bottom  */
.pd5 {
  padding: 5px;
}
.pd10 {
  padding: 10px;
}
.pd15 {
  padding: 15px;
}
.pd20 {
  padding: 20px;
}
.pd25 {
  padding: 25px;
}
.pd30 {
  padding: 30px;
}
.pd35 {
  padding: 35px;
}
.pd40 {
  padding: 40px;
}
/* p-left  */
.pdl5 {
  padding-left: 5px;
}
.pdl10 {
  padding-left: 10px;
}
.pdl15 {
  padding-left: 15px;
}
.pdl20 {
  padding-left: 20px;
}
.pdl25 {
  padding-left: 25px;
}
.pdl30 {
  padding-left: 30px;
}
.pdl110 {
  padding-left: 110px;
}
/* p-right  */
.pdr5 {
  padding-right: 5px;
}
.pdr10 {
  padding-right: 10px;
}
.pdr15 {
  padding-right: 15px;
}
.pdr20 {
  padding-right: 20px;
}
.pdr25 {
  padding-right: 25px;
}
.pdr30 {
  padding-right: 30px;
}
/* p-top  */
.pdt5 {
  padding-top: 5px;
}
.pdt10 {
  padding-top: 10px;
}
.pdt15 {
  padding-top: 15px;
}
.pdt20 {
  padding-top: 20px;
}
.pdt25 {
  padding-top: 25px;
}
.pdt30 {
  padding-top: 30px;
}
.pdt40 {
  padding-top: 40px;
}
/* p-bottom  */
.pdb10 {
  padding-bottom: 10px;
}
.pdb15 {
  padding-bottom: 15px;
}
.pdb20 {
  padding-bottom: 20px;
}
.pdb25 {
  padding-bottom: 25px;
}
.pdb30 {
  padding-bottom: 30px;
}
.pdb50 {
  padding-bottom: 50px;
}
/* p-left-right  */
.pdlr5 {
  padding-left: 5px;
  padding-right: 5px;
  _padding-right: 3px;
}
.pdlr6 {
  padding-left: 6px;
  padding-right: 6px;
  _padding-right: 4px;
}
.pdlr78 {
  padding-left: 7px;
  padding-right: 8px;
}
.pdlr10 {
  padding-left: 10px;
  padding-right: 10px;
}
.pdlr15 {
  padding-left: 15px;
  padding-right: 15px;
}
.pdlr20 {
  padding-left: 20px;
  padding-right: 20px;
}
.pdlr25 {
  padding-left: 25px;
  padding-right: 25px;
}
.pdlr30 {
  padding-left: 30px;
  padding-right: 30px;
}
.pdlr69 {
  padding-left: 6px;
  padding-right: 9px;
}
/* p-top-bottom  */
.pdtb5 {
  padding-top: 5px;
  padding-bottom: 5px;
}
.pdtb10 {
  padding-top: 10px;
  padding-bottom: 10px;
}
.pdtb15 {
  padding-top: 15px;
  padding-bottom: 15px;
}
.pdtb20 {
  padding-top: 20px;
  padding-bottom: 20px;
}
.pdtb25 {
  padding-top: 25px;
  padding-bottom: 25px;
}
.pdtb30 {
  padding-top: 30px;
  padding-bottom: 30px;
}
.pdtb40 {
  padding-top: 40px;
  padding-bottom: 40px;
}
/* width */
.w1200 {
  width: 1200px;
  margin: 0 auto;
}
.w1400 {
  width: 1400px;
  margin: 0 auto;
}
.w1000 {
  width: 1000px;
  margin: 0 auto;
}
.w980 {
  width: 980px;
  margin: 0 auto;
}
.w960 {
  width: 960px;
  margin: 0 auto;
}
.w958 {
  width: 958px;
  margin: 0 auto;
}
.w775 {
  width: 775px;
}
.w765 {
  width: 765px;
}
.w190 {
  width: 190px;
}
.w200 {
  width: 200px;
}
.w500 {
  width: 500px;
}
.w450 {
  width: 450px;
}
.w300 {
  width: 300px;
}
.w546 {
  width: 546px;
}
.w496 {
  width: 496px;
}
.w556 {
  width: 556px;
}
.w210 {
  width: 210px;
}
.w220 {
  width: 220px;
}
.w200 {
  width: 200px;
}
.w722 {
  width: 722px;
}
.w720 {
  width: 720px;
}
.w738 {
  width: 738px;
}
.w150 {
  width: 150px;
}
.w570 {
  width: 570px;
}
.w320 {
  width: 320px;
}
.w147 {
  width: 147px;
}
.w744 {
  width: 744px;
}
.w160 {
  width: 160px;
}
.w820 {
  width: 820px;
}
.w660 {
  width: 660px;
}
.w758 {
  width: 758px;
}
.w760 {
  width: 760px;
}
.h132 {
  height: 132px;
}
.w80 {
  width: 80px;
}
.w170 {
  width: 170px;
}
.w120 {
  width: 120px;
}
.w785 {
  width: 785px;
}
.h20 {
  height: 20px;
}
.w768 {
  width: 768px;
}
.w380 {
  width: 380px;
}
.w790 {
  width: 790px;
}
/*--------------------------------------------------------------# Animations--------------------------------------------------------------*/
@-webkit-keyframes shapeMover {
  0%,
  100% {
    -webkit-transform: perspective(400px) translateY(0) rotate(0deg) translateZ(0px) translateX(0);
    transform: perspective(400px) translateY(0) rotate(0deg) translateZ(0px) translateX(0);
  }
  50% {
    -webkit-transform: perspective(400px) rotate(-45deg) translateZ(20px) translateY(20px) translateX(20px);
    transform: perspective(400px) rotate(-45deg) translateZ(20px) translateY(20px) translateX(20px);
  }
}
@keyframes shapeMover {
  0%,
  100% {
    -webkit-transform: perspective(400px) translateY(0) rotate(0deg) translateZ(0px) translateX(0);
    transform: perspective(400px) translateY(0) rotate(0deg) translateZ(0px) translateX(0);
  }
  50% {
    -webkit-transform: perspective(400px) rotate(-45deg) translateZ(20px) translateY(20px) translateX(20px);
    transform: perspective(400px) rotate(-45deg) translateZ(20px) translateY(20px) translateX(20px);
  }
}
@-webkit-keyframes bubbleMover {
  0% {
    -webkit-transform: translateY(0px) translateX(0) rotate(0);
    transform: translateY(0px) translateX(0) rotate(0);
  }
  30% {
    -webkit-transform: translateY(30px) translateX(50px) rotate(15deg);
    transform: translateY(30px) translateX(50px) rotate(15deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
  }
  50% {
    -webkit-transform: translateY(50px) translateX(100px) rotate(45deg);
    transform: translateY(50px) translateX(100px) rotate(45deg);
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
  }
  80% {
    -webkit-transform: translateY(30px) translateX(50px) rotate(15deg);
    transform: translateY(30px) translateX(50px) rotate(15deg);
    -webkit-transform-origin: left top;
    transform-origin: left top;
  }
  100% {
    -webkit-transform: translateY(0px) translateX(0) rotate(0);
    transform: translateY(0px) translateX(0) rotate(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
  }
}
@keyframes bubbleMover {
  0% {
    -webkit-transform: translateY(0px) translateX(0) rotate(0);
    transform: translateY(0px) translateX(0) rotate(0);
  }
  30% {
    -webkit-transform: translateY(30px) translateX(50px) rotate(15deg);
    transform: translateY(30px) translateX(50px) rotate(15deg);
    -webkit-transform-origin: center center;
    transform-origin: center center;
  }
  50% {
    -webkit-transform: translateY(50px) translateX(100px) rotate(45deg);
    transform: translateY(50px) translateX(100px) rotate(45deg);
    -webkit-transform-origin: right bottom;
    transform-origin: right bottom;
  }
  80% {
    -webkit-transform: translateY(30px) translateX(50px) rotate(15deg);
    transform: translateY(30px) translateX(50px) rotate(15deg);
    -webkit-transform-origin: left top;
    transform-origin: left top;
  }
  100% {
    -webkit-transform: translateY(0px) translateX(0) rotate(0);
    transform: translateY(0px) translateX(0) rotate(0);
    -webkit-transform-origin: center center;
    transform-origin: center center;
  }
}
/*--font--*/
@font-face {
  font-family: 'iconfont';
  /* Project id 2637425 */
  src: url('//at.alicdn.com/t/font_2637425_1eip9uxel3k.woff2?t=1647397452932') format('woff2'), url('//at.alicdn.com/t/font_2637425_1eip9uxel3k.woff?t=1647397452932') format('woff'), url('//at.alicdn.com/t/font_2637425_1eip9uxel3k.ttf?t=1647397452932') format('truetype');
}
.iconfont {
  font-family: "iconfont" !important;
  font-size: 16px;
  font-style: normal;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-width: 0.2px;
  -moz-osx-font-smoothing: grayscale;
}
.text-of {
  overflow: hidden;
  -o-text-overflow: ellipsis;
  text-overflow: ellipsis;
  white-space: nowrap;
}
html,
body {
  height: auto;
  width: 100%;
  color: #333;
  min-width: 1400px;
  background-color: #f5f7fa;
  /*position: relative;*/
}
/*--zui--*/
.btn:focus {
  outline: unset !important;
  outline-offset: unset !important;
}
.popover {
  border: 0;
  background: #f9fcff;
  -webkit-box-shadow: 3px 3px 6px #d4d8e4;
  box-shadow: 3px 3px 6px #d4d8e4;
  border-radius: 8px;
}
.popover .arrow {
  border-bottom-color: #eceef5 !important;
}
.popover .arrow::after {
  border-bottom-color: #eceef5 !important;
}
.popover .popover-title {
  text-align: center;
  background: #eceef5;
  border-bottom: 1px solid #f3f5f7;
}
/*暂无数据*/
.no-data-tip {
  height: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
}
.no-data-tip img {
  margin-bottom: 50px;
}
.no-data-tip p {
  color: #9199a1;
  font-size: 18px;
}
.xgplayer-skin-default .xgplayer-progress-played {
  background-image: -o-linear-gradient(311deg, #7abaff 0%, #007aff 100%) !important;
  background-image: linear-gradient(139deg, #7abaff 0%, #007aff 100%) !important;
}
.xgplayer-skin-default .xgplayer-drag {
  background-image: -webkit-gradient(linear, left top, left bottom, from(#007aff), to(#7abaff)) !important;
  background-image: -o-linear-gradient(top, #007aff 0%, #7abaff 100%) !important;
  background-image: linear-gradient(to bottom, #007aff 0%, #7abaff 100%) !important;
}
/*渐变色线条*/
.line hr {
  position: relative;
  width: 100%;
  height: 1px;
  margin-top: 32px;
  margin-bottom: 32px;
  background-image: -webkit-gradient(linear, left top, right top, from(#007fff), color-stop(rgba(255, 0, 0, 0.3)), color-stop(hsla(0, 0%, 100%, 0.1)), color-stop(rgba(255, 0, 0, 0.3)), to(#007fff));
  background-image: -o-linear-gradient(left, #007fff, rgba(255, 0, 0, 0.3), hsla(0, 0%, 100%, 0.1), rgba(255, 0, 0, 0.3), #007fff);
  background-image: linear-gradient(90deg, #007fff, rgba(255, 0, 0, 0.3), hsla(0, 0%, 100%, 0.1), rgba(255, 0, 0, 0.3), #007fff);
  border-width: 0;
  overflow: visible;
}
/*背景图蒙层示例*/
.test {
  background-image: -webkit-gradient(linear, right top, left top, from(rgba(176, 42, 42, 0.16)), color-stop(18.45%, rgba(176, 42, 42, 0.56)), color-stop(49.67%, rgba(176, 42, 42, 0.8)), color-stop(82.52%, rgba(176, 42, 42, 0.56)), color-stop(99.7%, rgba(176, 42, 42, 0.196364)), color-stop(99.71%, rgba(189, 40, 40, 0)), color-stop(99.72%, rgba(203, 56, 55, 0)), color-stop(99.73%, rgba(203, 56, 55, 0.16))), url(https://static.npmjs.com/abf53a3….png);
  background-image: -o-linear-gradient(right, rgba(176, 42, 42, 0.16) 0%, rgba(176, 42, 42, 0.56) 18.45%, rgba(176, 42, 42, 0.8) 49.67%, rgba(176, 42, 42, 0.56) 82.52%, rgba(176, 42, 42, 0.196364) 99.7%, rgba(189, 40, 40, 0) 99.71%, rgba(203, 56, 55, 0) 99.72%, rgba(203, 56, 55, 0.16) 99.73%), url(https://static.npmjs.com/abf53a3….png);
  background-image: linear-gradient(270deg, rgba(176, 42, 42, 0.16) 0%, rgba(176, 42, 42, 0.56) 18.45%, rgba(176, 42, 42, 0.8) 49.67%, rgba(176, 42, 42, 0.56) 82.52%, rgba(176, 42, 42, 0.196364) 99.7%, rgba(189, 40, 40, 0) 99.71%, rgba(203, 56, 55, 0) 99.72%, rgba(203, 56, 55, 0.16) 99.73%), url(https://static.npmjs.com/abf53a3….png);
}
.test2 {
  background: -o-linear-gradient(#77b5ff 15px, rgba(119, 181, 255, 0.85) 32px, rgba(119, 181, 255, 0.6) 50px, rgba(119, 181, 255, 0) 70px, rgba(119, 181, 255, 0));
  background: linear-gradient(#77b5ff 15px, rgba(119, 181, 255, 0.85) 32px, rgba(119, 181, 255, 0.6) 50px, rgba(119, 181, 255, 0) 70px, rgba(119, 181, 255, 0));
}
.test3 {
  background: -o-linear-gradient(#77b5ff 15px, rgba(119, 181, 255, 0.85) 32px, rgba(119, 181, 255, 0.6) 50px, rgba(119, 181, 255, 0) 70px, transparent);
  background: linear-gradient(#77b5ff 15px, rgba(119, 181, 255, 0.85) 32px, rgba(119, 181, 255, 0.6) 50px, rgba(119, 181, 255, 0) 70px, transparent);
}
