.chaoti-os-ui-black {
  .el-button--primary, .el-button--default{
    color: #FFFFFF;
    background-color: #014757 !important;
    border-color: #008190 !important;
    opacity: 0.7;
  }
  .el-button--primary:focus, .el-button--primary:hover,.el-button--default:focus, .el-button--default:hover{
    border-color: #00E5FF !important;
    background-color: #014757 !important;
    opacity:1;
  }
  .el-button--primary.is-active, .el-button--primary.active,.el-button--default.is-active, .el-button--default.active{
    background-color: #008190 !important;
    border-color: #00E5FF !important;
    opacity: 0.7;
  }
  .el-button--primary.is-disabled, .el-button--primary.is-disabled.active, .el-button--primary.is-disabled:focus, .el-button--primary.is-disabled:hover,.el-button--default.is-disabled, .el-button--default.is-disabled.active, .el-button--default.is-disabled:focus, .el-button--default.is-disabled:hover{
    background-color: #014757 !important;
    border-color: #014757 !important;
    opacity: 0.6;
  }
  //空白按钮
  .el-button--primary.is-plain{
    color: #008190 !important;
    background: transparent !important;
    border-color: #008190 !important;
  }
  .el-button--primary.is-plain:focus, .el-button--primary.is-plain:hover{
    border-color: #00E5FF !important;
    color: #00E5FF !important;
  }
  .el-button--primary.is-plain.active{
    background: #014757 !important;
    color: #00E5FF !important;
    border-color:  #014757 !important;
  }
  .el-button--primary.is-plain.selected{
    background: #014757 !important;
    color: #00E5FF!important;
    border-color: #00E5FF !important;
  }
  .el-button--primary.is-plain.is-disabled, .el-button--primary.is-plain.is-disabled.active, .el-button--primary.is-plain.is-disabled:focus, .el-button--primary.is-plain.is-disabled:hover{
    color: #027282 !important;
    background-color: transparent !important;
    border-color: #014757 !important;
  }
  //文字按钮
  .el-button--text{
    color: #3D8BF9 !important;
    text-underline-offset: 12px;
    text-decoration: underline;
    font-weight: 400;
  }
  .el-button--text:focus, .el-button--text:hover{
    color: #6AA8FF !important;
  }
  .el-button--text.active,.el-button--text.selected{
    color: #3D8BF9 !important;
    text-decoration: none;
  }
  .el-button.is-disabled.el-button--text{
    color: #0F3F81 !important;
    text-decoration: none;
  }

  // 主要背景颜色
  .backgroundColor1{
    background: rgba(0, 37, 55,0.95);
  }
  .backgroundColor2{
    background: #002436;
  }
  .backgroundColor3{
    background: #002E43;
  }
  .backgroundColor4{
    background: #004362;
  }
  .backgroundColor5{
    background: #014757;
  }

  //边框颜色(border)
  .borderColor1{
    border-color: #00e5ff;
  }
  .borderColor2{
    border-color: #007583;
  }
  .borderColor3{
    border-color: #015d6c;
  }
  .borderColor4{
    border-color: #015d6c;
  }

  //正文文字颜色
  .fontColor1{
    color:#007e8c
  }
  .fontColor2{
    color:#00b5ca
  }
  .fontColor3{
    color:#00e5ff
  }
  .fontColor4{
    color:#c9ffff
  }

  //数据文字和状态文字颜色
  .DataFontColor1{
    color:#ac47e5
  }
  .DataFontColor2{
    color:#3d8bf9
  }
  .DataFontColor3{
    color:#00e863
  }
  .DataFontColor4{
    color:#ffcc00
  }
  .DataFontColor5{
    color:#ff881f
  }
  .DataFontColor6{
    color:#ee3f3f
  }

  //box边框色值
  .boxBorderColor1{
    background: linear-gradient(-45deg, #59c8ce 12px, transparent 0) bottom right,
    linear-gradient(45deg, #59c8ce 12px, transparent 0) bottom left,
    linear-gradient(135deg, #59c8ce 12px, transparent 0) top left,
    linear-gradient(-135deg, #59c8ce 12px, transparent 0) top right;
    border: solid 1px #007583;
    background-color: rgba(0, 37, 55, 0.95);
    box-shadow: 0px 0 8px rgba(0, 255, 255, 0.5) inset;
  }

  // radio样式
  .el-radio__label{
    color: #007e8c !important;
  }
  .el-radio__inner{
    border: 1px solid #008190 !important;
    background-color: transparent !important;
  }
  .el-radio__inner::after{
    width: 6px;
    height: 6px;
    background-color: #00E5FF;
  }
  .el-radio__input.is-checked+.el-radio__label{
    color: #00E5FF !important;
  }
  .el-radio__input.is-checked .el-radio__inner{
    border: 1px solid #00E5FF !important;
    background-color: transparent !important;
  }
  .el-radio.disabled{
    .el-radio__inner::after{
      background-color: #007e8c;
    }
    .el-radio__inner{
      border: 1px solid #008190 !important;
    }
    .el-radio__input.is-checked+.el-radio__label{
      color: #007e8c !important;
    }
  }

  //checkBox
  .el-checkbox__label{
    color: #007e8c !important;
  }
  .el-checkbox__inner{
    background: #001E2E !important;
    border: 1px solid #008190 !important;
  }
  .el-checkbox__inner::after{
    border:1px solid #00E5FF;
    box-sizing: content-box;
    content: "";
    border-left: 0;
    border-top: 0;
    height: 7px;
    left: 4px;
    position: absolute;
    top: 1px;
    transform: rotate(45deg) scaleY(0);
    width: 3px;
    transition: transform .15s ease-in .05s;
    transform-origin: center;
  }
  .el-checkbox__input.is-checked .el-checkbox__inner, .el-checkbox__input.is-indeterminate .el-checkbox__inner{
    background: #014757 !important;
    border: 1px solid #00E5FF !important;
  }
  .el-checkbox__input.is-checked+.el-checkbox__label{
    color: #00E5FF !important;
  }
  .el-checkbox.disabled{
    .el-checkbox__inner{
      background: transparent !important;
      border: 1px solid #007e8c !important;
    }
    .el-checkbox__input.is-checked .el-checkbox__inner, .el-checkbox__input.is-indeterminate .el-checkbox__inner{
      background: #001E2E !important;
      border: 1px solid #00505D !important;
    }
    .el-checkbox__input.is-disabled.is-checked .el-checkbox__inner::after{
      border-color: #215C6D !important;
    }
  }

  // input
  .el-input__inner,.el-textarea__inner{
    border: 1px solid #015D6C !important;
    background: #001E2E !important;
    color: #C9FFFF !important;
  }
  ::-webkit-input-placeholder { /* WebKit browsers */
    color: #007583 !important;
  }
  :-moz-placeholder { /* Mozilla  Firefox 4 to 18 */
    color: #007583 !important;
  }
  ::-moz-placeholder { /* Mozilla Firefox 19+ */
    color: #007583 !important;
  }
  :-ms-input-placeholder { /* Internet Explorer 10+ */
    color: #007583 !important;
  }
  .el-input__inner:hover,.el-textarea__inner:hover{
    border: 1px solid #00E5FF !important;
  }
  .el-input.readonly,.el-textarea.readonly{
    .el-input__inner,.el-textarea__inner{
      background: #002E43 !important;
      border: 1px solid #002E43 !important;
      color: #C9FFFF !important;
    }
  }
  .el-input.is-disabled .el-input__inner,.el-textarea.is-disabled .el-textarea__inner{
    background: #002436 !important;
    border: 1px solid #015D6C !important;
  }

  // 数字框
  .el-input-number__decrease{
    left: calc(100% - 80px);
  }
  .el-input-number__increase{
    right: 0px;
  }
  .el-input-number__decrease, .el-input-number__increase{
    top: 0px;
  }
  .el-input-number .el-input__inner{
    padding-left: 0px !important;
    padding-right: 80px !important;
    text-align: center !important;
    text-indent: 0rem;
  }
  .el-input-number__increase,.el-input-number__decrease{
    background: #014757 !important;
    border: 1px solid #008190 !important;
    color: #008695 !important;
  }
  .el-input-number .el-input__inner:hover{
    background: transparent !important;
    border: 1px solid #008190 !important;
  }
  .el-input-number__decrease:hover, .el-input-number__increase:hover{
    border: 1px solid #00E5FF !important;
    color: #00E5FF !important;
    background: #014757 !important;
  }
  .el-input-number.is-disabled .el-input-number__decrease, .el-input-number.is-disabled .el-input-number__increase{
    background: #014757 !important;
    color: #015D6C !important;
    border: 1px solid #015D6C !important;
  }

  //dropDown 下拉框
  .el-dropdown{
    color: #00b5ca !important;
    font-weight: 400 !important;
    i{
      color: #008190 !important;
    }
    .el-button--primary:focus, .el-button--primary{
      i{
        color: #008190 !important;
      }
    }
    .el-button--primary:focus, .el-button--primary:hover{
      color: #00b5ca !important;
      i{
        color: #00b5ca !important;
      }
    }
  }
  .el-dropdown-menu__item{
    color: #008695 !important;
    padding: 0 20px;
  }
  .el-dropdown-menu{
    background: #002436 !important;
    border: 1px solid #007583 !important;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12), 0px 0px 6px 0px rgba(0, 0, 0, 0.04);
  }
  .el-popper[x-placement^=bottom] .popper__arrow::after,.el-popper[x-placement^=bottom] .popper__arrow{
    border-bottom-color: #007583 !important;
  }
  .el-dropdown-menu__item:focus, .el-dropdown-menu__item:not(.is-disabled):hover{
    background: #00354E !important;
    color: #fff !important;
  }
  .el-dropdown-menu__item--divided:before{
    height: 1px;
    background-color: #007583 !important;
    margin: 0 -20px;
  }
  .el-dropdown-menu__item--divided{
    border: 1px solid #007583 !important;
  }
  .el-dropdown:hover{
    .el-button-group .el-button--primary:first-child,.el-button-group .el-button--primary:last-child{
      border-color: #00E5FF !important;
      background: #014757 !important;
    }
  }

  //select
  .el-select-dropdown{
    border: 1px solid #007583 !important;
    background: #002436 !important;
    text-indent: 1rem;
  }
  .el-select-dropdown__item{
    color: #007e8c !important;
  }
  .el-select-dropdown__item.hover, .el-select-dropdown__item:hover{
    background: #00354E !important;
    color: #00e5ff !important;
    .selectRight{
      color: #00e5ff !important;
    }
  }
  .el-select .el-input .el-select__caret{
    color: #028299 !important;
  }
  .el-input:hover{
    .el-input__icon{
      color: #00e5ff !important;
    }
    .el-icon-circle-close{
      color: #005A67 !important;
    }
  }
  .el-popper[x-placement^=top] .popper__arrow::after,.el-popper[x-placement^=top] .popper__arrow{
    border-top-color: #007583 !important;
  }
  .el-select-dropdown__item.is-disabled{
    color: #007e8c !important;
  }
  .el-tag.el-tag--info{
    background: #00354E;
    border: 1px solid #008190;
    color: #00e5ff !important;
  }
  .el-tag.el-tag--info .el-tag__close{
    color: #00BFD3;
    background: transparent;
  }
  .el-tag.el-tag--info .el-tag__close:hover{
    color: #051C2E;
    background: #00E5FF;
  }
  .el-select-dropdown__item.selected{
    color: #36D8A4 !important;
    background: transparent !important;
  }
  .el-select-dropdown__item:hover.selected{
    color: #36D8A4 !important;
    background: #014757 !important;
    .selectRight{
      color: #36D8A4 !important;
    }
  }
  .el-scrollbar__thumb{
    background: #005A67 ;
  }
  .selectLeft{
    float: left;
  }
  .selectRight{
    float: right; 
    color: #007e8c; 
    font-size: 13px;
    margin-right:12px;
  }
  .el-select-group__title{
    color: #00e5ff; 
    padding-left: 0px;
  }
  .el-select-group__wrap:not(:last-of-type)::after{
    height: 0px;
  }
  .el-select-group__wrap:not(:last-of-type){
    padding-bottom: 10px;
  }
  .el-select-group .el-select-dropdown__item{
    padding-left: 10px;
  }

  //Cascader级联关系
  .el-cascader__dropdown{
    background: #002436 !important;
    border: 1px solid #007583 !important;
  }
  .el-cascader-menu{
    color: #007e8c !important;
    border: 1px solid #007583 !important;
  }
  .el-cascader-node:not(.is-disabled):focus, .el-cascader-node:not(.is-disabled):hover{
    background: #014757 !important;
    color: #00b5ca !important;
  }
  .el-cascader-node.in-active-path, .el-cascader-node.is-active, .el-cascader-node.is-selectable.in-checked-path{
    background: #014757 !important;
    color: #00b5ca !important;
  }
  .el-input__prefix, .el-input__suffix{
    color: #027E95 !important;
  }

  // switch
  .el-switch{
    width: 50px;
  }
  .el-switch.is-checked .el-switch__core{
    background: rgba(0, 129, 144, 0.5);
    border: 1px solid #00E5FF;
  }
  .el-switch.is-checked .el-switch__core:after{
    background: #00E5FF;
  }
  .el-switch .el-switch__core{
    background: #001E2E;
    border: 1px solid #015D6C;
  }
  .el-switch .el-switch__core:after{
    background: #015D6C;
  }
  .el-switch.is-disabled .el-switch__core, .el-switch.is-disabled .el-switch__label{
    background-color: #00354E;
    border: none;
  }
  .el-switch.is-disabled .el-switch__core:after{
    background: #004362 !important;
  }
  .el-switch__label--right{
    position: absolute;
    left: -6px;
    top: 1px;
    visibility: hidden; 
  }
  .el-switch__label--left{
    position: absolute;
    right: -6px;
    top: 1px;
    visibility: hidden; 
  }
  .el-switch__label.el-switch__label--left.is-active{
    visibility: visible;
    color: #FFA2A2;
    z-index: 1;
  }
  .el-switch__label.el-switch__label--right.is-active{
    visibility: visible;
    color: #96FFC5;
    z-index: 0;
  }
  .elSwitchText.el-switch.is-checked .el-switch__core{
    background: rgba(19, 206, 102, 0.4);
    border: 1px solid #13CE66;
  }
  .elSwitchText.el-switch.is-checked .el-switch__core:after{
    background: #13CE66;
  }
  .elSwitchText.el-switch .el-switch__core{
    background: rgba(255, 55, 55, 0.4);
    border: 1px solid #FF3737;
  }
  .elSwitchText.el-switch .el-switch__core:after{
    background: #FF3737;
  }
  .elSwitchText.el-switch.is-disabled .el-switch__core{
    background: #003249;
    border: 1px solid #003249;
  }
  .elSwitchText.el-switch.is-disabled .el-switch__label{
    color: #007e8c;
    background: transparent;
  }

  //slider
  .el-slider__runway{
    background: #00333E;
  }
  .el-slider__bar{
    background: #00B5C9;
  }
  .el-slider__runway.disabled{
    background:  #00354E;
  }
  .el-slider__runway.disabled .el-slider__bar{
    background: #004362;
  }
  .el-slider__runway.disabled .el-slider__button{
    background: #004362;
    border: 3px solid #00354E;
  }
  .el-slider__button{
    border: 3px solid #00B5C9;
    background-color: #007384;
  }
  .el-tooltip__popper.is-dark{
    background: #014757 !important;
    color: #FFFFFF;
  }
  .el-slider__stop{
    background: #007384;
  }
  .el-slider.el-slider--with-input{
    .el-input-number__decrease{
      left: calc(100% - 64px);
    }
  }
  .el-tooltip__popper[x-placement^=top] .popper__arrow::after{
    border-top-color: #014757
  }
  .el-tooltip__popper[x-placement^=bottom] .popper__arrow::after{
    border-bottom-color: #014757
  }
  .el-tooltip__popper[x-placement^=left] .popper__arrow::after{
    border-left-color: #014757
  }
  .el-tooltip__popper[x-placement^=right] .popper__arrow::after{
    border-right-color: #014757
  }
  // TimePicker
  .el-date-editor{
    .el-input__prefix{
      left: calc(100% - 30px);
    }
  }
  .el-time-panel,.el-picker-panel{
    background: #002436;
    border: 1px solid #007583;
    box-shadow: 0px 2px 4px 0px rgba(0, 0, 0, 0.12), 0px 0px 6px 0px rgba(0, 0, 0, 0.04);
  }
  .el-time-range-picker__body{
    border: 1px solid #007583;
  }
  .el-time-spinner__item{
    color: #00B5CA;
  }
  .el-time-range-picker__header{
    color: #00e5ff;
  }
  .el-time-spinner__item.active:not(.disabled){
    color: #C9FFFF;
    background: #014757;
  }
  .el-time-spinner__item.active:not(.disabled):hover{
    background: #008190;
  }
  .el-scrollbar__bar.is-vertical>div{
    width: 0px;
  }
  .el-time-panel__footer{
    border-top:  1px solid #007583;
  }
  .el-time-panel__btn{
    color: #007e8c;
  }
  .el-time-panel__content::after, .el-time-panel__content::before{
    border: none;
  }
  .el-time-spinner__item:hover:not(.disabled):not(.active){
    background: #005467;
  }
  .el-time-panel__btn.confirm{
    color: #00b5ca;
  }
  .el-date-editor:hover {
    .el-input__prefix{
      display: none;
    }
  }
  .el-date-editor .el-range-input,.el-date-editor .el-range-separator{
    background: transparent;
    color: #C9FFFF;
  }
 
  .el-date-editor .el-range__icon,.el-range__close-icon{
    position: absolute;
    right: 10px;
    float: right;
    color: #005A67;
    display: block;
  }
  .el-date-editor:hover {
    .el-icon-time{
      display: none;
    }
    .el-date-editor .el-range__icon,.el-range__close-icon{
      color: #00E5FF;
    }
  }
  .time-select-item{
    color: #007e8c;
  }
  .time-select-item:hover{
    background: #00354E;
    color: #00b5ca;
  }
  .time-select-item.selected:not(.disabled){
    color: #C9FFFF;
    background: #014757;
  }

  // DatePicker
  .el-date-picker__header-label{
    color: #00E5FF;
  }
  .el-picker-panel__icon-btn{
    color: #00BFD3;
  }
  .el-date-table th,.el-date-picker__header--bordered,.el-date-range-picker__header{
    color: #00B5CA;
    border-bottom: none;
  }
  .el-date-table td.next-month, .el-date-table td.prev-month{
    color: #007e8c;
  }
  .available,.el-year-table td .cell,.el-month-table td .cell{
    color: #00b5ca;
  }
  .el-date-table td.today span{
    color: #FFFFFF !important;
  }
  .el-date-table td.available:hover{
    background: #004362;
    color: #00e5ff;
    border-radius: 0px;
  }
  .el-date-table td.current:not(.disabled) span{
    color: #FFFFFF;
    background: transparent;
  }
  .el-date-table td.current:not(.disabled){
    background: #008190;
  }
  .el-year-table td .cell:hover, .el-year-table td.current:not(.disabled) .cell,.el-month-table td.current:not(.disabled) .cell,.el-month-table td .cell:hover{
    background: #008190;
    color: #FFFFFF;
    border-radius: 0px;
  }
  .is-week-mode{
    .el-date-table__row:hover{
      td{
        color:#00e5ff !important;
        background: #00354E !important;
      }
      div{
        background: transparent !important;
      }
    }
  }
  .el-date-table__row.current{
    td{
      color:#00e5ff !important;
      background: #00354E !important;
    }
    div{
      background: transparent !important;
    }
   .start-date,.end-date{
      background: #008190 !important;
      color: #FFFFFF;
    }
  }
  .el-date-table td.end-date span, .el-date-table td.start-date span{
    background: transparent;
  }
  .el-picker-panel [slot=sidebar], .el-picker-panel__sidebar{
    background: #002E43;
    box-shadow: 1px 0px 0px 0px #015D6C;
    border-color: #015D6C;
    
  }
  .el-picker-panel__shortcut{
    color: #00b5ca;
  }
  .el-picker-panel__shortcut:hover{
    color: #00e5ff;
    background: #005A67;
  }
  .el-date-table td.disabled div{
    background: rgba(0, 37, 55,0.95);
    span{
      color: #007e8c;
    }
  }
  .el-date-range-picker__content.is-left{
    border-color: #015D6C;
  }
  .el-date-range-picker__content.is-left,.el-date-range-picker__content.is-right{
    td.available.in-range{
      color:#00e5ff !important;
      background: #00354E ;
    }
    div{
      background: transparent !important;
    }
   .in-range.start-date,.in-range.end-date{
      background: #008190 !important;
      color: #FFFFFF;
    }
  }

  //upload
  .el-upload__tip{
    color: #007e8c;
  }
  .el-upload-list__item-name{
    color: #00b5ca;
  }
  .el-upload-list__item-name [class^=el-icon]{
    color: #00E5FF;
  }
  .el-upload-list__item:hover{
    .el-upload-list__item-name{
      color: #C9FFFF !important;
    }
    .el-icon-close:before{
      color: #C9FFFF;
      content: "删除";
    }
    background: #003946;
    .el-upload-list__item-name [class^=el-icon]{
      color: #C9FFFF;
    }
  }
  .el-progress-bar__inner{
    background: linear-gradient(-90deg, #1CB6FF 0%, rgba(28, 182, 255, 0.2) 100%);
  }
  .el-progress__text,.el-upload-list__item .el-icon-upload-success{
    color: #00E5FF;
  }

  .flexs.upload-demo{
    display: flex;
    flex-direction:column-reverse;
  }
  .uploadFiexd{
    width: 100%;
    text-align: left;
    margin-top: 10px;
  }
  .el-upload-dragger{
    background: #002436;
    border: 1px solid #007583;
  }
  .el-upload-dragger .el-icon-upload{
    color: #014F60;
  }
  .el-upload-dragger .el-upload__text{
    color: #008695;
    em{
      color: #00e5ff;
      font-weight: 500;
    }
  }
  .el-upload-dragger:hover{
    background: #00354E;
    border: 1px solid #00B5C9;
    .el-upload-dragger .el-upload__text{
      color: #008695;
    }
  }
  .el-upload-dragger.is-dragover{
    background: #014757;
    border: 2px dotted #00B5C9;
  }
  .el-upload--picture-card{
    background: #002436;
    border: 1px solid #007583;
  }
  .el-upload--picture-card i{
    color: #008190;
  }
  .el-upload--picture-card:hover, .el-upload:focus{
    background: #00354E;
    border: 1px solid #00B5C9;
  }

  // rate
  .readBlue_1{
    .el-rate__item{
      .el-rate__icon.el-icon-star-on{
        color: #004750 !important;
      }
    }
  }
  .readBlue_2{
    .el-rate__item:nth-child(2),.el-rate__item:nth-child(3),.el-rate__item:nth-child(4),.el-rate__item:nth-child(5){
      .el-rate__icon.el-icon-star-on{
        color: #004750 !important;
      }
    }
  }
  .readBlue_3{
    .el-rate__item:nth-child(3),.el-rate__item:nth-child(4),.el-rate__item:nth-child(5){
      .el-rate__icon.el-icon-star-on{
        color: #004750 !important;
      }
    }
  }
  .readBlue_4{
   .el-rate__item:nth-child(4),.el-rate__item:nth-child(5){
      .el-rate__icon.el-icon-star-on{
        color: #004750 !important;
      }
    }
  }
  .readBlue_5{
    .el-rate__item:nth-child(5){
      .el-rate__icon.el-icon-star-on{
        color: #594700 !important;
      }
    }
  }
  .readYellow_1{
    .el-rate__item{
      .el-rate__icon.el-icon-star-on{
        color: #594700 !important;
      }
    }
  }
  .readYellow_2{
    .el-rate__item:nth-child(2),.el-rate__item:nth-child(3),.el-rate__item:nth-child(4),.el-rate__item:nth-child(5){
      .el-rate__icon.el-icon-star-on{
        color: #594700 !important;
      }
    }
  }
  .readYellow_3{
    .el-rate__item:nth-child(3),.el-rate__item:nth-child(4),.el-rate__item:nth-child(5){
      .el-rate__icon.el-icon-star-on{
        color: #594700 !important;
      }
    }
  }
  .readYellow_4{
   .el-rate__item:nth-child(4),.el-rate__item:nth-child(5){
      .el-rate__icon.el-icon-star-on{
        color: #594700 !important;
      }
    }
  }
  .readYellow_5{
    .el-rate__item:nth-child(5){
      .el-rate__icon.el-icon-star-on{
        color: #594700 !important;
      }
    }
  }

  //from
  .el-form-item__label{
    color: #007e8c;
  }
  .promptInfo{
    color: #007e8c;
  }
  .el-input .el-input__count .el-input__count-inner{
    background: transparent;
    color: #007e8c;
  }
  .el-form-item.is-error.is-required,.el-form-item.is-error,.el-form-item.is-error.is-required{
    .el-input__inner,.el-textarea__inner{
      border: 1px solid red !important;
    }
  }

  // table
  .el-table td.el-table__cell, .el-table th.el-table__cell.is-leaf{
    border-bottom: 1px solid #015d6c;
  }
  .el-table tr{
    background: #002436;
    color: #00b5ca;
  }
  .el-table th.el-table__cell{
    background: #002E43 !important;
    color: #FFFFFF;
  }
  tr.el-table__row--striped>td{
    background: #002E43 !important;
    color: #00b5ca;
  }
  .el-table__body tr:hover>td {
    background: #004362 !important;
  }
  .el-table--border::after, .el-table--group::after, .el-table::before{
    border-bottom: 1px solid #015d6c;
  }
  .el-table--border, .el-table--group{
    border: 1px solid #015d6c;
  }
  .el-table--border .el-table__cell, .el-table__body-wrapper .el-table--border.is-scrolling-left~.el-table__fixed{
    border-right: 1px solid #015d6c;
  }
  .el-table--border::after, .el-table--group::after, .el-table::before,.el-table__fixed-right::before, .el-table__fixed::before{
    background: #015d6c;
  }
  .warning-row{
    background: #002E43 !important;
  }
  .success-row{
    background: rgba(43, 36, 7 , 90%)  !important;  
  }
  .el-table--scrollable-y .el-table__body-wrapper{
    background:#003E51;
  }
  .el-table{
    ::-webkit-scrollbar {
      width:10px;
      height:10px; 
      background:transparent;
    } /*定义滚动条高宽及背景 高宽分别对应横竖滚动条的尺寸*/
    ::-webkit-scrollbar-track {
      background-color:#003E51;  
      width: 14px !important;
    } /*定义滚动条轨道 内阴影+圆角*/
    ::-webkit-scrollbar-thumb {
      background: linear-gradient(0deg, #02838B 0%, #2BF2FF 100%);
      width: 6px ;
      margin: auto;
      border-radius:6px;
    } /*定义滑块 内阴影+圆角*/
    .scrollbarHide ::-webkit-scrollbar{
      display: none;
    }
    .scrollbarShow ::-webkit-scrollbar{
      display: block;
    }
  }
  .el-table__body-wrapper tr:hover>td {
    background: #004362 !important;
  }
  .fixeds{
    .el-table__fixed{
      tr.el-table__row>td.el-table__cell{
        background: #002E43;
        box-shadow: 4px 0px 4px 0px rgba(0, 12, 27, 0.3);
      }
    }
  }
  
  //Badge
  .el-badge__content{
    background: rgba(255, 73, 73, 0.6);
    border: 1px solid #FF4949;
  }
  .el-badge{
    color: #00b5ca !important;
  }
  
  // tag
  .el-tag{
    background-color: #00354E;
    color: #007e8c !important;
    border: 1px solid #00354E;
    font-weight: 800 !important;
    .el-tag__close:hover{
      background: #008F91;
    }
  }
  .el-tag.el-tag--success{
    background: rgba(2, 255, 133, 0.2);
    border: 1px solid #00C063;
    color: #00C063 !important;
    .el-tag__close:hover{
      background: #00C063;
    }
  }
  .el-tag.el-tag--warning{
    background: rgba(255, 204, 0, 0.2);
    border: 1px solid #BA9500;
    color: #BA9500 !important;
    .el-tag__close:hover{
      background: #BA9500;
    }
  }
  .el-tag.el-tag--danger{
    background: rgba(255, 84, 88, 0.2);
    border: 1px solid #BF3134;
    color: #BF3134 !important;
    .el-tag__close:hover{
      background: #BF3134;
    }
  }
  .primary.el-tag.el-tag--light{
    background: rgba(28, 182, 255, 0.2);
    border: 1px solid #007BB6;
    color: #007BB6 !important;
    .el-tag__close:hover{
      background: #007BB6;
    }
  }
  
  //Pagination
  .el-pagination.is-background .btn-next.disabled, .el-pagination.is-background .btn-next:disabled, .el-pagination.is-background .btn-prev.disabled, .el-pagination.is-background .btn-prev:disabled, .el-pagination.is-background .el-pager li.disabled{
    background: #002E43;
    color: #00595E;
    border-color: transparent;
  }
  .el-pagination.is-background .btn-next, .el-pagination.is-background .btn-prev, .el-pagination.is-background .el-pager li{
    background: #014757;
    border: 1px solid #008190;
    color: #00b5ca;
  }
  .el-pagination.is-background .el-pager li:not(.disabled).active{
    background: #008190;
    color: #FFFFFF;
    border:1px solid #008190 !important;
  }
  .el-pagination.is-background .el-pager li:not(.disabled):hover{
    background: #005A67;
    border: 1px solid #00CDE4;
    color: #00b5ca;
  }
  .el-pagination__total{
    color: #00b5ca;
  }
  .el-pagination button:disabled{
    background: #002E43;
    color: #00595E;
    border-color:#002E43;
  }
  .el-pager li.active{
    background: #008190;
    color: #FFFFFF;
  }
  .totals{
    .el-pager li{
      background: #014757;
      border: 1px solid #008190;
      color: #00b5ca;
      border-radius: 2px;
      margin-right: 10px;
      &:first-child{
        margin-left: 10px;
      }
    }
    .el-pager li.active{
      background: #008190;
      color: #FFFFFF;
      border:1px solid #3C8BF9 !important;
    }
  }    
  .el-pagination .btn-next, .el-pagination .btn-prev{
    background: #014757;
    border: 1px solid #008190;
    color: #00B5C9;
  }
  .el-pager li:hover,.el-pagination button:hover{
    background: #005A67;
    border: 1px solid #00CDE4;
    color: #00CDE4;
  }
  .el-pagination button:disabled:hover{
    background: #002E43 !important;
    border: 1px solid #002E43 !important;
    color: #00595E !important;
  }
  .el-pagination__jump{
    color:#00CDE4 ;
  }
  .smallTotals{
     .btn-next,.btn-prev, button:disabled{
      background: transparent !important;
      border-color: transparent;
    }
    .el-pager li{
      color: #00b5ca;
      background: transparent !important;
      margin-right: 10px;
      &:first-child{
        margin-left: 10px;
      }
    }
    .el-pager li.active{
      background: #008190 !important;
      color: #FFFFFF;
    }
    .el-pager li:hover, button:hover{
      border: none;
      color: #FFFFFF;
    }
    button:disabled:hover{
      background: transparent !important;
      border: 1px solid transparent !important;
      color: #008190 !important;
    }
  }

  //card
  .el-card{
    background: #002E43;
    border: 1px solid #015D6C;
    border-radius: 0px 0px 6px 6px;
    box-shadow: 0px 0px 8px 0px rgba(0, 28, 68, 0.1);
    position: relative;
  }
  .box-card-number{
    display: block;
    padding: 0px;
    margin: 0px;
    width: 26px;
    height: 26px;
    line-height: 24px;
    color: #007e8c;
    text-align: center;
    border: 1px solid #015D6C;
    position: absolute;
    top: -1px;
    left: -1px;
    border-bottom-right-radius: 10px;
  }
  .el-card.is-always-shadow, .el-card.is-hover-shadow:focus, .el-card.is-hover-shadow:hover{
    background: #002E43;
    border: 1px solid #00E5FF;
    border-radius: 0px 0px 6px 6px;
    .box-card-number{
      border: 1px solid #00E5FF;
      color: #00b5ca;
    }
  }
  .box-card.active{
    background: #014757;
    border: 1px solid #00E5FF;
    border-radius: 0px 0px 6px 6px;
    .box-card-number{
      border: 1px solid #00E5FF;
      color: #00b5ca;
    }
  }

  //tree
  .el-tree{
    background: #002436;
    border: 1px solid #007583;
  }
  .el-tree-node__expand-icon,.el-tree-node__label{
    color: #009999;
  }
  .el-tree-node__content:hover{
    background: #00354E !important;
    .el-tree-node__expand-icon,.el-tree-node__label{
      color: #00e5ff;
    }
  }
  .el-tree-node__content{
    background-color: #002436 !important;
  }
  .el-tree-node.is-current > .el-tree-node__content{
    background-color: #00354E !important;
  }
  
  // progress
  .el-progress-bar__outer{
    background: #00191E;
    border: 1px solid #00313A;
  }
 
  .el-progress.is-success .el-progress-bar__inner{
    background: linear-gradient(90deg, rgba(0, 232, 99, 0.2) 0%, #00E863 100%);
  }
  .el-progress.is-exception .el-progress-bar__inner{
    background: linear-gradient(90deg, #EE3F3F 0%, rgba(238, 63, 63, 0.19) 100%);
  }
  .default{
    .el-progress-bar__inner{
      background: linear-gradient(-90deg, #3D8BF9 0%, rgba(61, 139, 249, 0.2) 100%);
    }
    .el-progress__text{
      color: #20A0FF;
    }
  }
  .el-progress-circle svg path:first-child{
    stroke: #00191E;
  }
  .default{
    .el-progress-circle svg path:last-child{
      stroke: #3D8BF9;
    }
  }
  .el-progress.is-success{
    .el-progress-circle svg path:last-child{
      stroke: #00E863;
    }
  }
  .el-progress.is-exception{
    .el-progress-circle svg path:last-child{
      stroke: #EE3F3F;
    }
  }

  //tabs
  .el-tabs__nav-wrap::after{
    background: #007583;
  }
  .el-tabs__active-bar{
    background: #00E5FF;
  }
  .el-tabs__item.is-active{
    color: #C9FFFF;
  }
  .el-tabs__item{
    color: #00b5ca;
  }
  .el-tabs__item:hover{
    color: #00e5ff;
  }
  .el-tabs--card>.el-tabs__header .el-tabs__item.is-active{
    border: none;
    background: #005A67 !important;
    border: 1px solid #008190;
    color: #C9FFFF;
  }
  .tabsAngle.el-tabs--card>.el-tabs__header .el-tabs__nav,
  .tabsRounded.el-tabs--card>.el-tabs__header .el-tabs__nav{
    border: none;
  }
  .tabsAngle.el-tabs--card>.el-tabs__header .el-tabs__item,.tabsRounded.el-tabs--card>.el-tabs__header .el-tabs__item{
    border: 1px solid #008190;
    margin-right:5px;
    background: transparent;
  }
  .el-tabs--card>.el-tabs__header{
    border-bottom:1px solid #007583;
  }
  .tabsAngle,.tabsRounded,.tabsBtns{
    .el-tabs__item:hover{
      background: #014757;
      border: 1px solid #008994;
      color: #00e5ff;
    }
  }
  .tabsRounded.el-tabs--card>.el-tabs__header .el-tabs__item{
    border-radius: 4px 4px 0px 0px !important;
  }
  .tabsBtns.el-tabs--card>.el-tabs__header .el-tabs__nav,.tabsBtns.el-tabs--card>.el-tabs__header .el-tabs__item{
    border: none;
  }
  .tabsBtns.el-tabs--card>.el-tabs__header{
    border-bottom: 1px solid transparent;
  }
  .tabsBtns.el-tabs--card > .el-tabs__header .el-tabs__item.is-active{
    border-top: 1px solid #00e5ff;
    color: #00e5ff !important;
  }
  .tabsBtns.el-tabs--card>.el-tabs__header .el-tabs__nav{
    border-bottom: 1px solid transparent;
  }
  .tabsBtns.el-tabs--card > .el-tabs__header .el-tabs__item{
    border: 1px solid #007583;
    border-right: none;
    &:last-child{
      border-right: 1px solid #007583;
    }
  }
  .tabsBtnsClose{
    .el-tabs__header .el-tabs__nav{
      border: none;
    }
   .el-tabs__header .el-tabs__item{
      border: none;
    }
    .el-tabs__item .el-icon-close:hover{
      color: #00333E;
      background: #00C9C9;
    }
    .el-tabs__item.is-active{
     background: #005A67;
     color: #C9FFFF;
     border-top-left-radius:5px;
     border-top-right-radius: 5px;
    }
  }
  .tabsBtnsCard{
    .el-tabs__header{
      margin: 0px;
    }
    .el-tabs__content{
      border: 1px solid #007583;
      background: #002E43;
      color: #00b5ca;
      border-top: 0px;
      border-bottom-left-radius: 6px;
      border-bottom-right-radius: 6px;
    }
  }

  //Breadcrumb 
  .el-breadcrumb__inner{
    color: #00b5ca;
  }
  .el-breadcrumb__separator{
    color: #00b5ca;
  }
  .el-breadcrumb__item:last-child .el-breadcrumb__inner, .el-breadcrumb__item:last-child .el-breadcrumb__inner a, .el-breadcrumb__item:last-child .el-breadcrumb__inner a:hover, .el-breadcrumb__item:last-child .el-breadcrumb__inner:hover{
    color: #C9FFFF;
  }
  .el-breadcrumb__inner:hover{
    color: #00e5ff;
    text-decoration: underline;
    text-underline-offset: 12px !important;
  }

  //Steps
  .el-step__title{
    font-size: 14px;
  }
  .iconSteps{
    .el-step__icon{
      background: transparent;
    }
    .el-step.is-horizontal .el-step__line{
      left: 38px;
    }
    .el-step__head.is-finish{
      .el-step__icon-inner{
        color: #1CB6FF;
      }
    }
    .el-step__head.is-process{
      .el-step__icon-inner{
        color:#004362;
      }
    }
  }
  .el-step__head.is-finish{
    .el-step__icon.is-text{
      background: #1CB6FF;
      color: #000;
      border: none;
    }
    .el-step__title.is-process{
      color: #1CB6FF;
    }
    .el-step__line{
      background: #1CB6FF;
    }
    &+.el-step__main{
      .el-step__title.is-finish,.el-step__description.is-finish{
        color: #1CB6FF;
      }
      
    }
  }
  .el-step__head.is-process{
    .el-step__icon.is-text{
      border: none;
      background: #004362;
      color: #00b5ca;
    }
    .el-step__line{
      background: #004362;
    }
    &+.el-step__main{
      .el-step__title.is-process,.el-step__description.is-process{
        color: #00e5ff;
      }
    }
  }
  .el-step__head.is-wait{
    .el-step__line{
      background: #004362;
    }
    .el-step__icon.is-text{
      border: 1px solid #004362;
      background: rgba(0, 37, 55, 0.95);
      color: #007e8c;
    }
    .el-step__icon-inner{
      color:#004362;
    }
    &+.el-step__main{
      .el-step__title.is-wait,.el-step__description.is-wait{
        color: #007e8c !important;
      }
    }
  }
  .sameColor{
    .el-step__head.is-finish{
      .el-step__icon.is-text{
        background: #00E5FF;
        color: #000;
        border: none;
      }
      .el-step__title.is-process{
        color: #00E5FF;
      }
      .el-step__icon-inner{
        color: #000;
      }
      &+.el-step__main{
        .el-step__title.is-finish{
          color: #00E5FF;
        }
      }
      .el-step__line{
        background: #00E5FF;
      }
    }
    .el-step__head.is-process{
      .el-step__icon.is-text{
        border: none;
        background: #004362;
        color: #00b5ca;
      }
      .el-step__line{
        background: #004362;
      }
    }
  }
  .el-step__head.is-success{
    .el-step__icon.is-text{
      background: #02FF85;
      border: none;
    }
    .el-step__icon-inner.is-status{
      color: #000;
    }
    .el-step__line{
      background: #02FF85;
    }
    &+.el-step__main{
      .el-step__title.is-success{
        color: #02FF85 !important;
      }
    }
  }
  .successSameColor{
    .el-step__head.is-success{
      .el-step__icon.is-text{
        background: #00E5FF;
        border: none;
      }
      .el-step__icon-inner.is-status{
        color: #000;
      }
      .el-step__line{
        background: #00E5FF;
      }
      &+.el-step__main{
        .el-step__title.is-success{
          color: #00E5FF !important;
        }
      }
    }
  }
  .el-step__head.is-error{
    .el-step__icon.is-text{
      border: none;
      background: #FF5458;
      color: #000;
    }
    .el-step__line{
      background: #004362;
    }
  }

  //alert
  .default.el-alert--warning.is-light{
    background: rgba(0, 229, 255, 0.5);
    color: rgba(255, 255, 255, 0.5);
    .el-alert__description{
      color: rgba(255, 255, 255, 0.5);
    }
  }
  .el-alert.is-light .el-alert__closebtn{
    color: #FFFFFF;
  }
  .el-alert--success.is-light{
    background: rgba(0, 232, 99, 0.5);
    color: rgba(255, 255, 255, 0.5);
    .el-alert__description{
      color: rgba(255, 255, 255, 0.5);
    }
  }
  .el-alert--info.is-light{
    background: rgba(61, 139, 249, 0.5);
    color: rgba(255, 255, 255, 0.5);
    .el-alert__description{
      color: rgba(255, 255, 255, 0.5);
    }
  }
  .el-alert--warning.is-light{
    background:  rgba(255, 204, 0, 0.5);
    color: rgba(255, 255, 255, 0.5);
    .el-alert__description{
      color: rgba(255, 255, 255, 0.5);
    }
  }
  .el-alert--error.is-light{
    background: rgba(238, 63, 63, 0.5);
    color: rgba(255, 255, 255, 0.5);
    .el-alert__description{
      color: rgba(255, 255, 255, 0.5);
    }
  }

  //Message
  .el-message__closeBtn{
    color: #FFFFFF;
    opacity: 0.4;
  }
  .el-message.el-message--info{
    background: #001E21 !important;
    border: 1px solid #00E5FF !important;
  }
  .el-message__content{
    color: #00E5FF;
  }
  .el-message .el-icon-info{
    color:#00E5FF;
  }
  .el-message--success{
    background: rgba(0, 35, 18, 0.9);
    border: 1px solid #00E863;
    .el-message__content{
      color: #00E863;
    }
    .el-message .el-icon-info{
      color:#00E863;
    }
  }
  .el-message--warning{
    background: rgba(35, 28, 0, 0.9);
    border: 1px solid #FFCC00;
    .el-message__content{
      color: #FFCC00;
    }
    .el-message .el-icon-info{
      color:#FFCC00;
    }
  }
  .el-message--error{
    background: rgba(39, 10, 11, 0.9);
    border: 1px solid #EE3F3F;
    .el-message__content{
      color: #EE3F3F;
    }
    .el-message .el-icon-info{
      color:#EE3F3F;
    }
  }
  .rightMessage{
    left:calc(100% - 220px);
  }

  //messageBox
  .el-message-box{
    background: rgba(0, 36, 54, 0.9);
    border: 1px solid #007583;
    box-shadow: 0px 2px 6px 0px rgba(0, 201, 201, 0.3);
  }
  .el-message-box__title{
    color: #C9FFFF;
  }
  .el-message-box__headerbtn .el-message-box__close{
    color: #008994;
  }
  .el-message-box__content{
    color: #00e5ff;
  }
  .btn-custom-cancel {
    float: right;
    margin-left: 10px;
  }

  //Notification
  .el-notification{
    background: #002436;
    border: 1px solid #007583;
    box-shadow: 0px 2px 6px 0px rgba(0, 201, 201, 0.3);
  }
  .el-notification__title{
    color: #C9FFFF;
  }
  .el-notification__content i{
    color: #00e5ff !important;
  }
  .el-notification__closeBtn{
    color: #008994;
  }
  .el-notification__content{
    color: #00e5ff !important;
  }
  .notifyInfo{
     .el-icon-info{
       color: #1CB6FF;
     }
  }
  .notifyInfoIcon{
    .el-icon-info,.el-icon-success,.el-icon-warning,.el-icon-error{
      color: #006371;
    }
  }
  
  //Popover
  .el-popover{
    background: rgba(0, 36, 54, 0.9);
    border: 1px solid #007583;
    box-shadow: 0px 2px 6px 0px rgba(0, 201, 201, 0.3);
    color: #00e5ff;
  }
  .el-popover__title{
    color: #C9FFFF;
  }

  //table的自定义组件
  .xTable {
    height: 100%;
    background-color: rgb(0, 47, 65);
    .thead {
      height: 2.2rem;
      line-height: 2.2rem;
      position: relative;
      margin-bottom: 0.8vh;
      .left,
      .right {
        position: absolute;
        top: -0.15rem;
        left: -8px;
        width: 18px;
        height: 2.4rem;
        background: url("./black/tbbt_l.png") no-repeat;
        background-size: 100% 100%;
        z-index: 1;
      }
      .left::before,
      .right::before {
        content: "";
        position: absolute;
        width: 13px;
        height: 2rem;
        top: 50%;
        transform: translateY(-50%);
        background-repeat: no-repeat;
        background-size: 100% 100%;
      }
      .left::before {
        right: 0;
      }
      .right::before {
        left: 0;
      }
      .right {
        left: auto;
        right: -8px;
        background-image: url("./black/tbbt_r.png");
      }
      .fields {
        background: url("./black/tabbg_rp.png") repeat-y;
        background-size: 100% 1px;
        display: flex;
        > div {
          flex: 1;
          font-size: 1rem;
          font-weight: bold;
          color: #00dcf5;
          > div {
            display: inline-block;
            padding: 0 10px;
            user-select: none;
            &.cursor {
              cursor: pointer;
            }
            i {
              display: inline-block;
              vertical-align: middle;
              margin-top: -0.2vh;
              width: 16px;
              height: 16px;
              background-repeat: no-repeat;
              background-size: 100% 100%;
            }
            i.desc {
              background-image: url("./black/sortPos.png")
            }
            i.asc {
              background-image:url("./black/sortOrd.png");
            }
          }
        }
        &.current {
          padding-right: 8px;
        }
      }
      &::before,
      &::after {
        position: absolute;
        content: "";
        height: 1px;
        width: 100%;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        background: url("./black/taborder_sx.png") no-repeat;
        background-size: 100% 1px;
      }
      &::after {
        bottom: 0;
        top: auto;
      }
    }
    .noData {
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 1.6vh;
    }
    .tbody,
    .noData {
      height: calc(100% - 13.5rem);
      background-color: rgb(0, 47, 65);
      border: 1px solid #007e87;
      overflow-y: auto;
      color: #00dcf5;
      .row {
        display: flex;
        height: 2.2rem;
        line-height: 2.2rem;
        font-size: 0.8rem;
        font-weight: bold;
        position: relative;
        border-bottom: 1px solid #007e87;
        &:first-child {
          border-bottom: none;
        }
        &:hover {
          background-color: #013e52;
        }
        &:first-of-type {
          &::before {
            display: none !important;
          }
        }
        &.current {
          background-color: rgb(0, 47, 65);
          &::before,
          &::after {
            position: absolute;
            content: "";
            top: 0;
            left: 0;
            height: 1px;
            width: 100%;
            background-color: #007e87;
          }
          &::after {
            top: auto;
            bottom: 0;
          }
          &:hover {
            background-color: #013e52;
          }
        }
        > div {
          flex: 1;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          span {
            padding: 2px 0;
            font-size: 0.8rem;
            color: #3d8bf9;
            font-weight: bold;
            cursor: pointer;
            margin: 0 5px;
            line-height: 1vh;
          }
          span:hover {
            text-decoration: underline;
          }
        }
        .btns {
          display: flex;
          flex-wrap: wrap;
          justify-content: center;
          align-items: center;
        }
      }
      &::-webkit-scrollbar {
        width: 10px;
        background-color: #eff2f7;
      }
      &::-webkit-scrollbar-track {
        width: 10px;
      }
      &::-webkit-scrollbar-thumb {
        background-color: #d3dae4;
        border-radius: 10px;
      }
    }
    .page {
      display: flex;
      justify-content: space-between;
      padding: 10px 0;
      .el-pagination {
        padding: 0;
      }
    }
  }

  //title
  .search_title {
    width: 50%;
    max-width: 200px;
    margin: auto;
    height: 2.3rem;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-bottom: 8px;
    box-sizing: border-box;
    color: #ffffff;
    background: url("./black/biaoti_bg.png") no-repeat;
    background-size: 100% 100%;
    font-size: 16px;
  }
  .jplvr_header {
    width: 100%;
    height: auto;
    text-align: center;
    background: url("./black/zbtbh_s.png") no-repeat;
    background-size: 100% 100%;
    height: 2rem;
    position: relative;
    .htClass {
      position: absolute;
      top: 0.2rem;
      left: 0rem;
      z-index: 20;
      width: 3.5rem;
      height: 1.6rem;
      background: url("./black/fanhui_icon.png") no-repeat;
      background-size: 100% 100%;
      cursor: pointer;
    }
    .htClass:hover {
      background: url("./black/fanhui_icon_anxia.png") no-repeat;
      background-size: 100% 100%;
      cursor: pointer;
    }
    .jplvr_title {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%,-50%);
      box-sizing: border-box;
      color: white;
      height: 2.4rem;
      line-height: 2.4rem;
      font-size: 1rem;
      padding: 0px 20px;
      
      background: url("./black/zbtc_rp.png") repeat-x center top;
      background-size: 100% 100%;
      .jplvr_title1{
        position: relative;
        width: 100%;
        height: 100%;
        background: url("./black/zbtd.png") no-repeat center bottom;
        background-size: 50px 5px;
        &::after{
          content: '';
          position: absolute;
          top: 0px;
          left: -30px;
          width: 10px;
          height: 100%;
          background: url("./black/zbta.png") no-repeat center center;
          background-size:100% 100% ;
        }
        &::before{
          content: '';
          position: absolute;
          top: 0px;
          right: -30px;
          width: 10px;
          height: 100%;
          background: url("./black/zbtb.png") no-repeat center center;
          background-size:100% 100% ;
        }
      }
      span {
        width: 1.2rem;
        height: 1.2rem;
        display: inline-block;
        vertical-align: top;
        margin-right: 10px;
      }
      .jplvr_title_span{
        margin: 0;
        padding: 0;
        display: inline-block;
      }
    }
  }
  .first_chart_title {
    width: 100%;
    height: 32px;
    line-height: 32px;
    text-align: center;
    background: url("./black/zbtbjx.png") no-repeat center center;
    background-size: 100% 2px;
    color: #FFFFFF;
    font-size: 14px;
    font-weight: 500;
    position: relative;
  }
  .first_chart_title_bg{
    span{
      padding: 6px 20px;
      background: url("./black/zbtbg_rp.png") repeat-x left top;
      background-size:100% 100%;
      position: relative;
      &::after{
        content: '';
        position: absolute;
        top: -1px;
        left: -8px;
        width: 8px;
        height: 34px;
        background: url("./black/zbta1.png") no-repeat center center;
        background-size:100% 100% ;
      }
      &::before{
        content: '';
        position: absolute;
        top:-1px;
        right: -8px;
        width: 8px;
        height: 34px;
        background: url("./black/zbtb1.png") no-repeat center center;
        background-size:100% 100% ;
      }
    }
  }


  //body样式表
  .boxBlock {
    position: relative;
    border-radius: 20px;
    background-repeat: no-repeat;
  }
  .boxTop {
    &::after {
      position: absolute;
      content: "";
      top: -1.4px;
      left: -1.4px;
      width: 40px;
      height: 40px;
      background: url("./black/mbbga.png") no-repeat center center;
      background-size: 100% 100%;
    }
  }
  .boxLeft {
    &::after {
      position: absolute;
      content: "";
      right: -1.4px;
      top: -1.4px;
      width: 40px;
      height: 40px;
      background: url("./black/mbbgb.png") no-repeat center center;
      background-size: 100% 100%;
    }
  
  }
  .boxBottom {
    &::after {
      position: absolute;
      content: "";
      right: -1.4px;
      bottom: -1.4px;
      width: 40px;
      height: 40px;
      background: url("./black/mbbgd.png") no-repeat center center;
      background-size: 100% 100%;
    }
  }
  .boxRight {
    &::after {
      position: absolute;
      content: "";
      left: -1.4px;
      bottom: -1.4px;
      width: 40px;
      height: 40px;
      background: url("./black/mbbgc.png") no-repeat center center;
      background-size: 100% 100%;
    }
  }

  //Dialog
  .el-dialog__header{
    background: url("./black/tc_repeatx.png") repeat-x center center;
    background-size: 100% 100%;
    text-align: left !important;
  }
  .el-dialog__title{
    color: #fff;
  }
  .el-dialog__headerbtn .el-dialog__close{
    color: #fff;
  }
  .el-dialog__body{
    background: #002436;
    box-shadow: 0px 0px 12px 0px rgba(11, 90, 124, 0.4);
  }
  .el-dialog__footer{
    background: #002436;
    border-top: 1px dashed #007583;
    text-align: center;
  }

}