display: flex;
        flex-direction: row-reverse;
        margin-top: 18/@px-unit;
        .apply-button {
            margin-left: 8/@px-unit;
        }
    }
}
.track-time-hover-popover {
    .ant-popover-inner-content {
        color: @font-color;
    }
    
}
.track-time-popover {
    color: @font-color;
    .ant-popover-inner-content {
        padding-right: 10/@px-unit;
    }
    a {
        margin-left: 8/@px-unit;
        margin-right: 8/@px-unit;
    }
    .time-popover-content {
        display: flex;
        align-items: center;
        .confirm-icon {
            color: @font-color;
            margin-left: 14/@px-unit;
            font-size: 24/@px-unit;
            cursor: pointer;
        }
        .delete-icon {
            color: @font-color;
            margin-left: 8/@px-unit;
            font-size: 24/@px-unit;
            cursor: pointer;
        }
        .confirm-icon, .delete-icon {
            &:hover {
                color: #40A9FF;
            }
            &:active {
                color: #096DD9;
            }
        }
    }
    .start-timer-picker, .end-timer-picker {
        .ant-time-picker-panel-combobox {
            display: flex;
        }
    }
}
.passwordInput-security {
    -webkit-text-security:disc;
    -moz-text-security:disc;
    -ms-text-security:disc;
}


@schedule-dividerColorNo9: @SddDividerColor; //分割线颜色
@schedule-inputBorderColorNo10: @SddInputBorderColor; // 输入框边框
@schedule-listBorderColorNo8: @SddListBorderColor; // 计划表边框颜色
@schedule-successColorNo19: @SddSuccessColor; // 时间条颜色
@schedule-warnColorNo18: @SddWarnColor; // 警告条颜色
@schedule-errorColorNo17: @SddErrorColor; // 报警条颜色
@schedule-textColorNo5: @SddTextColor; // 文本颜色

._ScheduleComponent_{
    padding: 16/@px-unit;
    user-select: none;
    .align-center {
        text-align: center
    }
    .ant-card-body{
        padding: 15/@px-unit 24/@px-unit 15/@px-unit 24/@px-unit;
    }
    .slider-container{
        position: relative;
    }
    .btnContainer{
        float: right;
        button:nth-child(1) {
            margin-right: 10/@px-unit;
        }
    }
    // 时间尺的样式
    .timeplan-ruler {
        height: 14/@px-unit;
        position: relative;
        font-size: 12/@px-unit;
        div{
            display: inline-block;
            height: 5/@px-unit;
            border-left: 1/@px-unit solid #555;
        }
        div:last-child {
            border-right: 1/@px-unit solid #555;
            .ruler-text{
                margin-left: 0/@px-unit;
            }
            
        }
        .ruler-text{
            position: absolute;
            bottom: 15/@px-unit;
            margin-left: -5/@px-unit;
            white-space: nowrap;
            font: 11/@px-unit/1 sans-serif; 
        }
        .hour{
            height: 10/@px-unit;
        }
    }

    .main-container {
        border: 1/@px-unit solid @schedule-dividerColorNo9;
        box-sizing: border-box;
        margin: 0;
        padding: 9/@px-unit 0 4/@px-unit 0;
        overflow: hidden;
        .label{
            float: left;
            height: 100%;
            line-height: 45/@px-unit;
            padding-left: 10/@px-unit; 
        }
        .slider-container {
            float: left;
        }
        .copyBtn{
            >span{
                width: 100%;
                overflow: hidden;
                text-overflow: ellipsis;
                white-space: nowrap;
                word-wrap: normal;
            }
            // float: left;
            // height: 45/@px-unit;
            // line-height: 45/@px-unit;
            display: inline-block;
            width: 100%;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
            word-wrap: normal;
        }
    .dayplan {
        position: relative;
        height: 8/@px-unit;
        margin-bottom: 8/@px-unit;
        border: 1/@px-unit solid @schedule-inputBorderColorNo10; 
        background-color: @schedule-listBorderColorNo8;
        cursor: pointer;
        box-sizing: border-box;
        .handle{
            position: absolute;
            width: 12/@px-unit;
            height: 12/@px-unit;
            margin-top: -3/@px-unit;
            margin-left: -7/@px-unit;
            background-color: #fff;
            border: solid 2/@px-unit #91d5ff;
            border-radius: 50%;
            -webkit-box-shadow: 0;
            box-shadow: 0;
            cursor: pointer;
            -webkit-transition: border-color .3s,-webkit-box-shadow .6s,-webkit-transform .3s cubic-bezier(.18, .89, .32, 1.28);
            transition: border-color .3s,-webkit-box-shadow .6s,-webkit-transform .3s cubic-bezier(.18, .89, .32, 1.28);
            transition: border-color .3s,box-shadow .6s,transform .3s cubic-bezier(.18, .89, .32, 1.28);
            transition: border-color .3s,box-shadow .6s,transform .3s cubic-bezier(.18, .89, .32, 1.28),-webkit-box-shadow .6s,-webkit-transform .3s cubic-bezier(.18, .89, .32, 1.28);
            &:hover {
                border-color: #46a6ff;
            }
        }
        .onlyNormal-handle {
            height: 16/@px-unit;
            width: 16/@px-unit;
            z-index: 1;
        }
        .track{
            position: absolute;
            height: 100%;
            &.green  {
                background:@schedule-successColorNo19;
            }
            &.yellow  {
                background:@schedule-warnColorNo18;
            }
            &.red {
                background:@schedule-errorColorNo17;
            }
			&.red-1 {
                background-color: #f54117;
            }
            &.green-2 {
                background-color: #0a9c02;
            }
            &.green-3 {
                background-color: #03aeac;
            }
            &.orange-1 {
                background-color: #ff7e16;
            }
            &.orange-2 {
                background-color: #fcac15;
            }
            &.orange-3 {
                background-color: #bc7c00;
            }
            &.blue-1 {
                background-color: #1890ff;
            }
            &.blue-2 {
                background-color: #2238c7;
            }
            &.purple-1 {
                background-color: #ac0dce;
            }
            &.purple-2 {
                background-color: #6e52fe;
            }
        }
        :focus {
            outline: none;
        }
    }
        .onlyNormal-dayplan{
            height: 12/@px-unit;
            margin-top: 16/@px-unit;
        }
        

    }
    
    //事件类型头部的样式
    .header{
        height: 50/@px-unit;
        line-height: 50/@px-unit;
        margin-bottom: 20/@px-unit;
        // width: 880/@px-unit;
        .status-container{
            margin-bottom: 20/@px-unit;
            float: left;
            .circle {
                content: '';
                height: 10/@px-unit;
                width: 10/@px-unit;
                display: inline-block;
                border-radius: 5/@px-unit;
                margin:0 10/@px-unit;
                &.green  {
                    background:@schedule-successColorNo19;
                }
                &.yellow  {
                    background:@schedule-warnColorNo18;
                }
                &.red {
                    background:@schedule-errorColorNo17;
                }
            }
            p {
                display: inline;
            }
        }
        .button-container{
            float: right
        }
    }
    .onlyNormal-header{
        .status-container {
            display: none
        }
    } 
   
}
.tip{
    .ant-tooltip-arrow{
        border-bottom-color:@schedule-inputBorderColorNo10;
        border-top-color: @schedule-inputBorderColorNo10
    }
    .ant-tooltip-inner{
        color: @schedule-textColorNo5;
        background-color:#FFF;
        padding: 0 8/@px-unit;
    }
    .timer-input{
        width: 20/@px-unit;
        min-width: 10/@px-unit;
        float: left;
        height: 30/@px-unit;
        text-align: center;
    }
}
.timeSchedule-drawer{
    button:nth-child(1) {
        margin-right: 20/@px-unit;
    }
    .ant-drawer-body{
        .btnContainer{
            margin-top: 40/@px-unit;
            // text-align: right;
        }
    }
}
.timeSchedule-modal {
    .ant-modal-body {
        max-width: 100%;
    }
    .timeSchedule-checkboxGroup-wrapper {
        .ant-checkbox-wrapper {
            height: 32/@px-unit;
            padding: 4/@px-unit 4/@px-unit 4/@px-unit 0;
        }
        .ant-checkbox-wrapper + .ant-checkbox-wrapper {
            margin-left: 0;
        }
    }
}
.timer-box {
    height: 30/@px-unit;
    display: inline-block;
    .ant-input{
        padding:4/@px-unit 0/@px-unit
    }
    .timer-input{
        background-color:#FFF;
        width: 20/@px-unit;
        min-width: 10/@px-unit;
        float: left;
        height: 30/@px-unit;
        text-align: center;
        border-radius: 0;
        border-left: none;
        border-right: none;
        border: none;
        &:focus{
            border: transparent;
        }
    }
    .timer-point{
        float: left;
        vertical-align: baseline;
        margin:0;
        padding: 3/@px-unit;
        background-color: #FFF;
        height: 30/@px-unit;
        font-weight: bold;
    }
}
.timer-box-area {
    display: inline-block;
    margin: 0;
    vertical-align: 9/@px-unit;
}
.timer-box-label {
    margin: 0;
    line-height: 30/@px-unit;
}
.red-1-options {
    display: inline-block;
    width: 12/@px-unit;
    height: 12/@px-unit;
    margin-right: 5/@px-unit;
    border-radius: 2/@px-unit;
    background-color: #f54117;
}
.green-options {
    display: inline-block;
    width: 12/@px-unit;
    height: 12/@px-unit;
    margin-right: 5/@px-unit;
    border-radius: 2/@px-unit;
    background-color: @schedule-successColorNo19;
}
.green-2-options {
    display: inline-block;
    width: 12/@px-unit;
    height: 12/@px-unit;
    margin-right: 5/@px-unit;
    border-radius: 2/@px-unit;
    background-color: #0a9c02;
}
.green-3-options {
    display: inline-block;
    width: 12/@px-unit;
    height: 12/@px-unit;
    margin-right: 5/@px-unit;
    border-radius: 2/@px-unit;
    background-color: #03aeac;
}

.orange-1-options {
    display: inline-block;
    width: 12/@px-unit;
    height: 12/@px-unit;
    margin-right: 5/@px-unit;
    border-radius: 2/@px-unit;
    background-color: #ff7e16;
}
.orange-2-options {
    display: inline-block;
    width: 12/@px-unit;
    height: 12/@px-unit;
    margin-right: 5/@px-unit;
    border-radius: 2/@px-unit;
    background-color: #fcac15;
}
.orange-3-options {
    display: inline-block;
    width: 12/@px-unit;
    height: 12/@px-unit;
    margin-right: 5/@px-unit;
    border-radius: 2/@px-unit;
    background-color: #bc7c00;
}

.blue-1-options {
    display: inline-block;
    width: 12/@px-unit;
    height: 12/@px-unit;
    margin-right: 5/@px-unit;
    border-radius: 2/@px-unit;
    background-color: #1890ff;
}

.blue-2-options {
    display: inline-block;
    width: 12/@px-unit;
    height: 12/@px-unit;
    margin-right: 5/@px-unit;
    border-radius: 2/@px-unit;
    background-color: #2238c7;
}

.purple-1-options {
    display: inline-block;
    width: 12/@px-unit;
    height: 12/@px-unit;
    margin-right: 5/@px-unit;
    border-radius: 2/@px-unit;
    background-color: #ac0dce;
}

.purple-2-options {
    display: inline-block;
    width: 12/@px-unit;
    height: 12/@px-unit;
    margin-right: 5/@px-unit;
    border-radius: 2/@px-unit;
    background-color: #6e52fe;
}
.modalOptions-header {
    margin-bottom: 10/@px-unit;
}
.modalOptions-badge-container {
    float: left;
    margin-left: 3/@px-unit;
    margin-right: 3/@px-unit;
}

@tableHeaderBackgroundColor: @tableHeaderBgColor; // 表格头部背景色
@tableContentBgColor : @SddContentBgColor;// 表格背景色
@tableContentHoverBgColor: @tableRowHoverColor; //表格行hover色
@tableRowSelectedBackgroundColor: @tableRowSelBgColor; //表格行选中色
@tableBodyBorderColor: @SddListBorderColor; // 表格边框颜色
@evenPatternColor: @tableZebraEvenPatternColor; // 表格斑马纹颜色
@oddPatternColor: @SddContentBgColor; // 非斑马纹颜色
@buttonNormalColor: @SddBtnNormalColor;  // 表格按钮正常状态颜色
@buttonNormalColor1: @buttonNormalColorNo2; // 表格过滤按钮正常状态颜色
._Table_ {
    .table-action-bar {
        // height: 32/@px-unit;
        margin-bottom: 16/@px-unit;
        overflow: hidden;
        background-color: @tableContentBgColor;
        .left-bars {
            float: left;
            line-height: 0;
            .button-groups {
                display: inline-block;
                height: 32/@px-unit;
                line-height: 32/@px-unit;
                overflow: hidden;
                // .ant-btn {
                //     padding: 0 12/@px-unit;
                //     margin-left: 12/@px-unit;
                //     &:first-of-type {
                //         margin-left: 0/@px-unit;
                //     }
                // }
            }
            .table-title {
                display: inline-block;
                max-width: 120/@px-unit;
                line-height: 32/@px-unit;
                height: 32/@px-unit;
                margin-right: 12/@px-unit;
                overflow: hidden;
                text-overflow:ellipsis;
                white-space: nowrap;
            }
        }
        .right-bars {
            // height: 100%;
            float: right;
            button.filterColumn {
                height: 32/@px-unit;
                padding: 0/@px-unit 12/@px-unit;
                background-color: @tableContentBgColor;
                color: @buttonNormalColor;
            }
        }
    }
    .ant-table-body, .ant-table-content {
        .ant-table-thead {
            tr {
                // line-height: 44/@px-unit;
                // height: 44/@px-unit;
                th {
                    // border-top: 1/@px-unit solid @tableBodyBorderColor;;
                    background-color: @tableHeaderBackgroundColor;
                    // padding: inherit;
                    // padding-left: 12/@px-unit;
    
                }
            }
        }
        .ant-table-tbody {
            tr{
                // line-height: 44/@px-unit;
                td {
                    // padding: inherit;
                    // padding-left: 12/@px-unit;
    
                }
                &.ZD-showZebraPattern:nth-of-type(even) {
                    background-color: @evenPatternColor;
                }
                &.ZD-showZebraPattern:nth-of-type(odd) {
                    background-color: @oddPatternColor;
                }
                &:hover:not(.ant-table-expanded-row):not(.ant-table-row-selected):not(.ant-table-placeholder) > td {
                    background-color: @tableContentHoverBgColor;
                }
            }
            tr.ZD-selected-row {
                background-color: @tableRowSelectedBackgroundColor;
            }

            tr.ZD-highlight-row {
                background-color: @tableRowSelectedBackgroundColor;
            }

            tr.ZD-showZebraPattern.ZD-selected-row {
                background-color: @tableRowSelectedBackgroundColor;
            }

            tr.ZD-showZebraPattern.ZD-highlight-row {
                background-color: @tableRowSelectedBackgroundColor;
            }

            tr.ZD-hideRowBorder:not(:last-of-type) { 
                td {
                    border-bottom: none;
                }
            }
            // tr.ZD-hideRowBorder {
            //     td {
            //         border-bottom: none;
            //     }
            // }
        }

        .react-resizable {
            position: relative;
            background-clip: padding-box;
        }
          
        .react-resizable-handle {
            position: absolute;
            width: 10/@px-unit;
            height: 100%;
            bottom: 0;
            right: -5/@px-unit;
            cursor: col-resize;
            z-index: 1;
        }
        .editable-cell-value-wrap {
            padding: 5/@px-unit 12/@px-unit;
            cursor: pointer;
            &:hover {
                border: 1px solid @tableBodyBorderColor;
                padding: 4/@px-unit 11/@px-unit;
            }
        }
    }

    // .m-table-showEmpty {
    //     .ant-empty,  .ant-empty-normal{
    //         display: none;
    //     }
    // }
    .m-table-showEmpty {
        .ant-table-placeholder{
            display: none;
        }
    }

    .mask {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        opacity: 0;
        z-index: 1049;
    }
    tr.drop-over-downward td {
        border-bottom: 2px dashed #1890ff !important;
    }
      
    tr.drop-over-upward td {
        border-top: 2px dashed #1890ff !important;
    }
}
.ant-table-filter-dropdown-link.confirm {
    width: 48/@px-unit;
    height: 24/@px-unit;
    text-align: center;
    font-family: Microsoft YaHei;
    background-color: @buttonNormalColor;
    border-radius: 4/@px-unit;
	font-size: 12/@px-unit;
	font-weight: normal;
	font-stretch: normal;
	line-height: 24/@px-unit;
	letter-spacing: 0/@px-unit;
    color: @tableContentBgColor;  
      
    float: right;
}
.ant-table-filter-dropdown-link.clear {
    width: 48/@px-unit;
    height: 24/@px-unit;
	font-family: Microsoft YaHei;
	font-size: 12/@px-unit;
	font-weight: normal;
	font-stretch: normal;
	line-height: 24/@px-unit;
	letter-spacing: 0/@px-unit;
	color: @buttonNormalColor1;
    float: left;
}


.@{tabs-prefix-cls} {
  &-bottom {
    border-top: 2/@px-unit solid #f3f3f3;
  }

  &-bottom &-content {
    width: 100%;
  }

  &-bottom &-bar {
    border-top: 1/@px-unit solid #f3f3f3;
  }

  &-bottom &-nav-container-scrolling {
    padding-left: 32/@px-unit;
    padding-right: 32/@px-unit;
  }

  &-bottom &-nav-scroll {
    width: 99999/@px-unit;
  }

  &-bottom &-nav-swipe {
    position: relative;
    left: 0;
    .@{tabs-prefix-cls}-nav {
      display: flex;
      flex: 1;
      width: 100%;
      .@{tabs-prefix-cls}-tab {
        display: flex;
        flex-shrink: 0;
        margin-right: 0;
        padding: 8/@px-unit 0;
        justify-content: center;
      }
    }
  }
  &-bottom &-nav-wrap {
    width: 100%;
  }

  &-bottom &-content-animated {
    flex-direction: row;

    .@{tabs-prefix-cls}-tabpane {
      width: 100%;
    }
  }

  &-bottom &-tab-next {
    right: 2/@px-unit;

    &-icon:before {
      content: ">";
    }
  }

  &-bottom &-tab-prev {
    left: 0;
    &-icon:before {
      content: "<";
    }
  }

  &-bottom &-tab-prev, &-bottom &-tab-next {
    margin-right: -2/@px-unit;
    width: 32/@px-unit;
    height: 100%;
    top: 0;
    text-align: center;
  }

  &-bottom &-ink-bar {
    height: 2/@px-unit;
    top: 3/@px-unit;
    left: 0;
  }

  &-bottom &-tab {
    float: left;
    height: 100%;
    margin-right: 30/@px-unit;
  }

  &-bottom &-tabpane-inactive {
    height: 0;
    overflow: hidden;
  }
}

.@{tabs-prefix-cls} {
  box-sizing: border-box;
  position: relative;
  overflow: hidden;

  &-bar, &-nav-container {
    font-size: 14/@px-unit;
    line-height: 1.5;
    box-sizing: border-box;
    overflow: hidden;
    position: relative;
    white-space: nowrap;
    outline: none;
    zoom: 1;
    transition: padding .45s;
  }

  &-ink-bar {
    z-index: 1;
    position: absolute;
    box-sizing: border-box;
    margin-top: -3/@px-unit;
    background-color: #108ee9;
    transform-origin: 0 0;

    width: 0;
    height: 0;

    &-animated {
      transition:
        transform @effect-duration @easing-in-out,
        left @effect-duration @easing-in-out,
        top @effect-duration @easing-in-out,
        height @effect-duration @easing-in-out,
        width @effect-duration @easing-in-out;
    }
  }

  &-tab-prev, &-tab-next {
    user-select: none;
    z-index: 1;
    line-height: 36/@px-unit;
    cursor: pointer;
    border: none;
    background-color: transparent;
    position: absolute;

    &-icon {
      position: relative;
      display: inline-block;
      font-style: normal;
      font-weight: normal;
      font-variant: normal;
      line-height: inherit;
      vertical-align: baseline;
      text-align: center;
      text-transform: none;
      font-smoothing: antialiased;
      text-stroke-width: 0;
      font-family: sans-serif;

      &:before {
        display: block;
      }
    }
  }

  &-tab-btn-disabled {
    cursor: default;
    color: #ccc;
  }

  &-nav-wrap {
    overflow: hidden;
  }

  &-nav {
    box-sizing: border-box;
    padding-left: 0;
    position: relative;
    margin: 0;
    float: left;
    list-style: none;
    display: inline-block;
    transform-origin: 0 0;

    &-animated {
      transition: transform 0.5s @easing-in-out;
    }

    &:before, &:after {
      display: table;
      content: " ";
    }

    &:after {
      clear: both;
    }
  }

  &-tab {
    box-sizing: border-box;
    position: relative;
    display: block;
    transition: color @effect-duration @easing-in-out;
    padding: 8/@px-unit 20/@px-unit;
    font-weight: 500;
    cursor: pointer;

    &:hover {
      color: #23c0fa;
    }
  }

  &-tab-active {
    &, &:hover {
      color: #108ee9;
      cursor: default;
      // fix chrome render
      transform: translateZ(0);
    }
  }

  &-tab-disabled {
    cursor: default;
    color: #ccc;
    &:hover {
      color: #ccc;
    }
  }

  &-content {
    zoom: 1;

    .@{tabs-prefix-cls}-tabpane {
      overflow: hidden;
    }

    &-animated {
      transition: transform @effect-duration @easing-in-out,
                  margin-left @effect-duration @easing-in-out,
                  margin-top @effect-duration @easing-in-out;
      display: flex;
      will-change: transform;

      .@{tabs-prefix-cls}-tabpane {
        flex-shrink: 0;
      }
    }
  }

  .no-flexbox &-content {
    transform: none !important;
    overflow: auto;
  }

  .no-csstransitions &-tabpane-inactive,
  .no-flexbox &-tabpane-inactive,
  &-content-no-animated &-tabpane-inactive {
    display: none;
  }
}

.@{tabs-prefix-cls} {
  &-left {
    border-right: 2/@px-unit solid #f3f3f3;
  }

  &-left &-bar {
    float: left;
    height:100%;
    margin-right: 10/@px-unit;
    border-right: 1/@px-unit solid #f3f3f3;
  }
  &-left &-nav-container {
    height:100%;
  }
  &-left &-nav-container-scrolling {
    padding-top: 32/@px-unit;
    padding-bottom: 32/@px-unit;
  }

  &-left &-nav-wrap {
    height: 100%;
  }

  &-left &-content-animated {
    flex-direction: column;

    .@{tabs-prefix-cls}-tabpane {
      height: 100%;
    }
  }

  &-left &-nav-scroll {
    height: 99999/@px-unit;
  }

  &-left &-nav-swipe {
    position: relative;
    top: 0;
    .@{tabs-prefix-cls}-nav {
      display: flex;
      flex: 1;
      flex-direction: column;
      height: 100%;
      .@{tabs-prefix-cls}-tab {
        display: flex;
        flex-shrink: 0;
        justify-content: center;
      }
    }
  }

  &-left &-tab-prev, &-left &-tab-next {
    margin-top: -2/@px-unit;
    height: 0;
    line-height: 32/@px-unit;
    width: 0;
    display: block;
    text-align: center;
    opacity: 0;
    transition: width .3s, height .3s, opacity .3s;
  }

  &-top &-tab-arrow-show,
  &-left &-tab-arrow-show,
  &-bottom &-tab-arrow-show,
  &-right &-tab-arrow-show {
    opacity: 1;
    width: 100%;
    height: 32/@px-unit;
  }

  &-left &-tab-next {
    bottom: 0;
    &-icon {
      transform: rotate(90deg);
      filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
    }
    &-icon:before {
      content: ">";
    }
  }

  &-left &-tab-prev {
    top: 2/@px-unit;
    &-icon {
      transform: rotate(270deg);
      filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    }
    &-icon:before {
      content: ">";
    }
  }

  &-left &-ink-bar {
    width: 2/@px-unit;
    right: 0;
    top: 0;
  }

  &-left &-tab {
    padding: 16/@px-unit 24/@px-unit;
  }
}

.@{tabs-prefix-cls} {
  &-right {
    border-left: 2/@px-unit solid #f3f3f3;
  }

  &-right &-bar {
    float: right;
    height: 100%;
    margin-left: 10/@px-unit;
    border-left: 1/@px-unit solid #f3f3f3;
  }
  &-right &-nav-container {
    height:100%;
  }
  &-right &-nav-container-scrolling {
    padding-top: 32/@px-unit;
    padding-bottom: 32/@px-unit;
  }

  &-right &-nav-wrap {
    height: 100%;
  }

  &-right &-nav-scroll {
    height: 99999/@px-unit;
  }

  &-right &-nav-swipe {
    position: relative;
    .@{tabs-prefix-cls}-nav {
      display: flex;
      flex: 1;
      flex-direction: column;
      height: 100%;
      .@{tabs-prefix-cls}-tab {
        display: flex;
        flex-shrink: 0;
        justify-content: center;
      }
    }
  }

  &-right &-tab-prev, &-right &-tab-next {
    margin-top: -2/@px-unit;
    height: 0;
    width: 0;
    display: block;
    text-align: center;
    line-height: 32/@px-unit;
    opacity: 0;
    transition: width .3s, height .3s, opacity .3s;
  }


  &-top &-tab-arrow-show {
    opacity: 1;
    width: 100%;
    height: 32/@px-unit;
  }

  &-right &-tab-next {
    bottom: 0;
    &-icon {
      transform: rotate(90deg);
      filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
    }
    &-icon:before {
      content: ">";
    }
  }

  &-right &-tab-prev {
    top: 2/@px-unit;
    &-icon {
      transform: rotate(270deg);
      filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=3);
    }
    &-icon:before {
      content: ">";
    }
  }

  &-right &-content-animated {
    flex-direction: column;

    .@{tabs-prefix-cls}-tabpane {
      height: 100%;
    }
  }

  &-right &-ink-bar {
    width: 2/@px-unit;
    left: 0;
    top: 0;
  }

  &-right &-tab {
    padding: 16/@px-unit 24/@px-unit;
  }
}

.@{tabs-prefix-cls} {
  &-top {
    border-bottom: 2/@px-unit solid #f3f3f3;
  }

  &-top &-content {
    width: 100%;
  }

  &-top &-bar {
    border-bottom: 1/@px-unit solid #f3f3f3;
  }

  &-top &-nav-container-scrolling {
    padding-left: 32/@px-unit;
    padding-right: 32/@px-unit;
  }

  &-top &-nav-scroll {
    width: 99999/@px-unit;
  }

  &-top &-nav-swipe {
    position: relative;
    left: 0;
    .@{tabs-prefix-cls}-nav {
      display: flex;
      flex: 1;
      width: 100%;
      .@{tabs-prefix-cls}-tab {
        display: flex;
        flex-shrink: 0;
        margin-right: 0;
        padding: 8/@px-unit 0;
        justify-content: center;
      }
    }
  }

  &-top &-nav-wrap {
    width: 100%;
  }

  &-top &-content-animated {
    flex-direction: row;
    .@{tabs-prefix-cls}-tabpane {
      width: 100%;
    }
  }

  &-top &-tab-next {
    right: 2/@px-unit;

    &-icon:before {
      content: ">";
    }
  }

  &-top &-tab-prev {
    left: 0;
    &-icon:before {
      content: "<";
    }
  }

  &-top &-tab-prev, &-top &-tab-next {
    margin-right: -2/@px-unit;
    width: 0;
    height: 0;
    top: 0;
    text-align: center;
    opacity: 0;
    transition: width .3s, height .3s, opacity .3s;
  }

  &-top &-tab-arrow-show {
    opacity: 1;
    width: 32/@px-unit;
    height: 100%;
  }

  &-top &-ink-bar {
    height: 2/@px-unit;
    bottom: 0;
    left: 0;
  }

  &-top &-tab {
    float: left;
    height: 100%;
    margin-right: 30/@px-unit;
  }

  &-top &-tabpane-inactive {
    height: 0;
    overflow: hidden;
  }
}

@tabs-prefix-cls: rc-tabs;

@easing-in-out: cubic-bezier(0.35, 0, 0.25, 1);

@effect-duration: .3s;











.colorMenu_box {
    float: left;
    margin-top: 4px;
    border-radius: 2px;
    width: 14px;
    height: 14px;

    &.skyBlue {
        background: @skin-blue;
    }

    &.blue {
        background: @skin-blue;
    }
}



body:-ms-fullscreen { 
    overflow-y: auto;
}
.homeside-enter, .homeside-appear {
    opacity: 0;
}
.homeside-enter-active, .homeside-appear-active { 
    opacity: 1;
    transition: opacity 200ms ease-in;
}
.homeside-enter-done {
    opacity: 1;
}
.homeside-exit {
    opacity: 1;
}

.homeside-exit-active {
    opacity: 0;
    transition: opacity 200ms ease-in;
}

.homeside-exit-done {
    opacity: 0;
}
.clearfix {
    &::after {
      content: ".";            
      display: block;        
      height: 0;
      visibility: hidden;  
      clear: both;   
    }
}
.topMenus {
    // background-color:@topMenuTabColor;
    -webkit-animation-name: arcSlideUpIn;
    animation-name: arcSlideUpIn;
    top:63/@px-unit !important;
    min-width: 130/@px-unit;
    position: fixed;
    &.AlarmEventContentDropdown {
        .ant-dropdown-menu {
            background-color: #ffffff;
            color: #272727;
        }
    }
    .ant-dropdown-menu {
        color:rgba(255, 255, 255, 0.45);
        background-color: rgba(0, 21, 41, 0.8);
	    box-shadow: 0 8/@px-unit 16/@px-unit 0 rgba(0, 0, 0, 0.16);
	    border-radius: 3/@px-unit;
        .ant-dropdown-menu-item {
            padding: 0 14/@px-unit;
            overflow: hidden;
            font-size: 14/@px-unit;
            line-height: 40/@px-unit;
            // -o-text-overflow: ellipsis;
            // text-overflow: ellipsis;
            color: inherit;
            .anticon {
                margin-right: 8/@px-unit;
                font-size: 20/@px-unit;
                vertical-align: text-top;
            }
            .ant-badge {
                margin-left: 2/@px-unit;
                margin-top: -16/@px-unit;
            }
            // .ant-badge {
            //     color: @topMenuTabColor;
            //     &:hover{
            //         color: @topMenuTabActiveColor
            //     }
            // }
        }
        .ant-dropdown-menu-item-active {
            color: @baseColor;
            background-color: initial;
        }
        .ant-dropdown-menu-item:hover {
            color: @baseColor;
            background-color: initial;
        }
        .ant-dropdown-menu-item-selected {
            color: @baseColor;
            background-color: initial;
        }
    }
}
.topMenusMore {
    .ant-dropdown-menu {
        width: 620/@px-unit;
        display:inline-block;
    }
    .ant-dropdown-menu-item {
        width: 150/@px-unit;
        float: left;
        clear: none;
    }
}
@keyframes arcSlideUpIn {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 0.8;
    }
  }
.tab-menu-button {
    position: relative;
    .ant-badge-count {
        min-width: 14px;
        width: auto;
        height: 14px;
        line-height: 14px;
        border-radius: 10px;
        padding: 0 3px;
    }
    .ant-badge-dot {
        position: absolute;
        top: 0;
        right: 0;
        transform: translate(-10px, 18px);
        transform-origin: 100% 0%;
        z-index: 1;
        width: 6px;
        height: 6px;
        background-color: #f5222d;
        border-radius: 100%;
        box-shadow: 0 0 0 1px;
    }
}
.systemSet {
    width: auto;
    background: transparent;
}
.ant-dropdown-menu-title-content {
    word-break: normal;
}

.TabMenu{
    line-height: 64px;
    width: 100%;
    .ant-tabs.ant-tabs-card .ant-tabs-tab-active{
        background-color: transparent;
        border:none;
        .ant-tabs-tab-btn {
            color:@topMenuTabActiveColor;
        }
    }
    .ant-tabs.ant-tabs-card .ant-tabs-tab {
        background-color: transparent;
        border:none;
        text-align: center;
        line-height: 64px;
        height: 64px;
        width: auto;
        box-sizing: border-box;
        margin-right: 10px;
        padding: 0px;
        margin-left: 10px;
    }
    .ant-tabs-nav {
        border: none;
        color:@topMenuTabColor;
        margin-bottom: 0;
        &::before {
            border-bottom: 0;
        }
    }
    .ant-tabs.ant-tabs-card .ant-tabs-nav-container{
        height:64px;
    }
    .ant-tabs-nav-container {
        line-height: 64px;
    }
    .ant-tabs-tab-next{
        height: 64px;
        color:@tabArrowColor;
        &:hover{
            color:@tabArrowHoverColor;
        }
    }
    .ant-tabs-tab-prev{
        height: 64px;
        color:@tabArrowColor;
        &:hover{
            color:@tabArrowHoverColor;
        }
    }
    .anticon-close{
        opacity: 0;
        color:@tabCloseColor;
    }
    .ant-tabs-tab {
        &:hover .anticon-close{
            opacity: 1;
        }
    }
    .ant-tabs.ant-tabs-card .ant-tabs-tab .ant-tabs-close-x{
        color:@tabCloseColor;
    }
}
.tab-menu{
    width: 100%;
    background-color:@tabBackGroundColor;
    color:@topMenuTabColor;
    line-height: 64px;
    height:64px;
    z-index: 1000;
    position: fixed;
    min-width:800px;
    width:100%;
    .tab-menu-right{
        float: right;
        height: 64px;
        overflow: hidden;
        text-align:right;
        .anticon {
            font-size: 18px;
            svg {
                position: relative;
                top: 2px;
            }
        }
    }
    .ant-tabs-nav .ant-tabs-tab:hover {
        color: @tabMenuTabHoverColor;
    }
    .ant-divider {
        height: 16px;
        background: @tabDividerColor;
    }
    .ant-divider.ant-divider-vertical {
        width: 1 / @px-unit;
        height: 16 / @px-unit;
        background-color: #334454;
        margin: 0;
    }
    i:hover{
        color:@tabMenuTabHoverColor;
    }
    .myicon-topFullScreen {
        width: 40px;
        height: 64px;
        line-height: 64px;
        box-sizing: border-box;
    }
}
.tab-menu-button{
    width: 45px;
    box-sizing: border-box;
    border: none;
    background-color:@tabBackGroundColor;
    outline: none;
    line-height: 64px;
    cursor: pointer;
    &:hover{
        color:@tabMenuTabHoverColor;
    }
    &:last-child {
        text-align: center;
        display: inline-block;
        margin-right: 0;
    }
    .ant-badge {
        color: #B5BAC1;
        &:hover{
            color:@tabMenuTabHoverColor;
        }
    }
}

.tab-menu-button-lang {
    padding-left: 3/@px-unit;
}

.tab-menu-button-color {
    padding-right: 3/@px-unit;
}

.tab-menu-button-admin{
    border: none;
    padding: 0;
    background-color:@tabBackGroundColor;
    outline: none;
    line-height: 19px;
    cursor: pointer;
    margin: 0 12/@px-unit;
    &:hover{
        color:@tabMenuTabHoverColor;
    }
}
.tab-menu-home{
    text-align: center;
    float: left;
    cursor: pointer;
    line-height: 64px;
    padding: 0 32/@px-unit 0 20/@px-unit;
    &:hover {
        color: @tabMenuTabHoverColor;
    }
    .icon{
        margin-right: 14 / @px-unit;
        margin-bottom: 3 / @px-unit;
    }
    .sign{
        display: inline-block;
        font-size: 16 / @px-unit;
        color: #fff;
    }
}
.tab-menu-homeIconLine{
    float: left;
    line-height: 64px;
}

.tab-menu-homeIcon{
    text-align: center;
    cursor: pointer;
    float: left;
    width: 64px;
    box-sizing: border-box;
    line-height: 64px;
    &:hover {
        color: @tabMenuTabHoverColor;
    }
    .anticon {
        font-size: 20/@px-unit;
    }
}

@keyframes arcSlideUpIn {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 0.8;
    }
  }

.tab-menu-button-admin{
    border: none;
    padding: 0;
    background-color:@tabBackGroundColor;
    outline: none;
    line-height: 64px;
    cursor: pointer;
    &:hover{
        color:@tabMenuTabHoverColor;
    }
}

.MenuView_item{
    width: 33%;
    display: inline-block;
    cursor: pointer;
    padding: 50/@px-unit 20/@px-unit 0 20/@px-unit;
    transition:  background-color 1500ms;
    -moz-transition: background-color 1500ms;
    -o-transition: background-color 1500ms;
    -webkit-transition: background-color 1500ms;
}
.MenuView_item:hover{
    background-color: @MenuViewItemHoverColor;
    transition:  background-color 1500ms;
    -moz-transition: background-color 1500ms;
    -o-transition: background-color 1500ms;
    -webkit-transition: background-color 1500ms;
    color: @primary-color;
}
.MenuView_ViewItem{
    text-align: center;
    justify-content: center;
    margin-bottom: 16/@px-unit;
    .icon{
      display: inline-block !important;
    }
    &:last-child{
      margin-bottom: 0;
    }
    &:nth-child(3){
        margin-bottom: 12/@px-unit;
    }
}
._MenuView_ {
    position: relative;
    .pagination {
        position: absolute;
        z-index: 20;
        bottom: 45/@px-unit;
        width: 100%;
        text-align: center;
      }
    .swiper-pagination-switch {
        display: inline-block;
        width: 12/@px-unit;
        height: 12/@px-unit;
        border-radius: 50%;
        background: @MenuViewPageSwitch;
        margin: 0 10/@px-unit;
        opacity: 0.8;
        border: transparent;
        cursor: pointer;
    }
    .swiper-active-switch {
        background: @MenuViewActivePageSwitch;
        width: 16/@px-unit;
        height: 16/@px-unit;
    }
    .swiper-slide-padding {
        padding:30/@px-unit 30/@px-unit 10/@px-unit 30/@px-unit;
    }
    .model {
        position: fixed;
        top: 0;
        left: 4vw;
        z-index: 2;
        display: block;
    }
    .bg {
        display: block;
        position: fixed;
        top: -180/@px-unit;
        left: -100/@px-unit;
        z-index: 1;
        width: 130%;
        height: 600/@px-unit;
        transform:rotate(-8.6deg);
        background: linear-gradient(#4b2dff,#338dfe);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4b2dff', endColorstr='#338dfe',GradientType=0 );
    }
    .bg_img {
        position: fixed;
        top: 0;
        right: 0;
        z-index: 1;
        display: block;
    }
    .meteor {
        height: 490/@px-unit;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
    }
}

._MenuView_Carousel{
    background-color: @MenuViewBackGroundColor;
    width: 77%;
    margin: 0 auto;
    z-index: 100;
    position: absolute;
    left: 0;
    right: 0;
    top: 90/@px-unit;
    height: 800/@px-unit;
    .swiper-wrapper{
      margin-top: 0;
      .swiper-slide{
          font-size: 0; //去掉子元素上下间距
          >div{
              padding: 46/@px-unit 47/@px-unit 0 !important;
          }
      }
  }
}
.MenuView_ViewItem_title{
    font-size: 20/@px-unit;
    font-weight: bold;
}
.MenuView_ViewItem_underLine {
    height: 2/@px-unit;
    width: 35/@px-unit;
    background-color: @MenuViewItemLineColor;
    border-radius: 5/@px-unit;
    margin: 0 auto;
}
.MenuView_ViewItem_message{
    word-wrap:break-word;
    word-break:break-all;
    overflow: hidden;
    height: 70/@px-unit;
    color:@MenuViewItemMessageColor;
    font-size: 14/@px-unit;
}
.ant-carousel .slick-slider {
  z-index: 3;
  margin-top: 8vh;
}
._MenuView_ .ant-carousel .slick-dots li.slick-active button {
    background-color: @MenuViewItemHoverColor;
}
._MenuView_ .ant-carousel .slick-dots li button {
    background-color: @MenuViewCarouselColor;
}

@media screen and (max-height:900px)  {
    ._MenuView_Carousel {
      height: 686/@px-unit !important;
    }
    .MenuView_item {
      padding: 31/@px-unit 20/@px-unit 0 20/@px-unit !important;
    }
    .MenuView_ViewItem {
      margin-bottom: 10/@px-unit !important;
    }
    .MenuView_ViewItem_message {
      height: 60/@px-unit;
      margin-bottom: 0;
    }
    ._MenuView_ .pagination{
        bottom: 32/@px-unit;
    }
  }
.swiper-container {
	overflow:hidden;
	direction:ltr;
	-webkit-backface-visibility:hidden;
	-moz-backface-visibility:hidden;
	-ms-backface-visibility:hidden;
	-o-backface-visibility:hidden;
	backface-visibility:hidden;
	/* Fix of Webkit flickering */
	z-index:1;
}
.swiper-wrapper {
    position:relative;
    margin-top: -10px;
	width:100%;
	-webkit-transition-property:-webkit-transform, left, top;
	-webkit-transition-duration:0s;
	-webkit-transform:translate3d(0px,0,0);
	-webkit-transition-timing-function:ease;
	
	-moz-transition-property:-moz-transform, left, top;
	-moz-transition-duration:0s;
	-moz-transform:translate3d(0px,0,0);
	-moz-transition-timing-function:ease;
	
	-o-transition-property:-o-transform, left, top;
	-o-transition-duration:0s;
	-o-transform:translate3d(0px,0,0);
	-o-transition-timing-function:ease;
	-o-transform:translate(0px,0px);
	
	-ms-transition-property:-ms-transform, left, top;
	-ms-transition-duration:0s;
	-ms-transform:translate3d(0px,0,0);
	-ms-transition-timing-function:ease;
	
	transition-property:transform, left, top;
	transition-duration:0s;
	transform:translate3d(0px,0,0);
	transition-timing-function:ease;

	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}
.swiper-free-mode > .swiper-wrapper {
	-webkit-transition-timing-function: ease-out;
	-moz-transition-timing-function: ease-out;
	-ms-transition-timing-function: ease-out;
	-o-transition-timing-function: ease-out;
	transition-timing-function: ease-out;
	margin: 0 auto;
}
.swiper-slide {
	float: left;
	-webkit-box-sizing: content-box;
	-moz-box-sizing: content-box;
	box-sizing: content-box;
}

/* IE10 Windows Phone 8 Fixes */
.swiper-wp8-horizontal {
	-ms-touch-action: pan-y;
}
.swiper-wp8-vertical {
	-ms-touch-action: pan-x;
}


.side-button{
    background-color:transparent;
    border:none;
    outline: none;
}

.sideMenu {
    height:100%;
    background-color:@sideMenuBackGroundColor;
    padding: 10px 0;
    overflow-y: auto;
    .ant-menu-item {
        .anticon {
            margin-right: 10px;
            font-size: 20px;
            vertical-align: text-top;
        }
        a {
            display: inline!important;
        }
    }
    .ant-menu-inline > .ant-menu-item, .ant-menu-inline > .ant-menu-submenu > .ant-menu-submenu-title {
        height: 48px;
        line-height: 48px;
    }
    .ant-menu-sub.ant-menu-inline > .ant-menu-item {
        height: 40px;
        line-height: 40px;
    }
}
.sideMenu .ant-menu:not(.ant-menu-horizontal) .ant-menu-item-selected{
    background-color: @sideMenuSelectedColor;
    color:@primary-color;
}
.sideMenu .ant-menu-item:hover, .ant-menu-item-active, .ant-menu:not(.ant-menu-inline) .ant-menu-submenu-open, .ant-menu-submenu-active, .ant-menu-submenu-title:hover{
    color:@primary-color;
}
.sideMenu .ant-menu-submenu-arrow::before{
    background-color:@sideMenuSelectedColor
}
.sideMenu .sideMenuBody{
    height:100%;
    border-right:none;
    background-color:@sideMenuBackGroundColor
}

.ant-menu-inline .ant-menu-item, .ant-menu-inline .ant-menu-submenu-title {
    width: 100%;
}


.m-main-page {
    padding: 16px;
    margin-left: 240px;
    background: @main_background_color;
}
.m-main-page-contgent {
    background: @secondNavBgColorNo13;
    min-height: calc(100vh - 96px);
    height: 100%;
}
._SideView_ {
    min-width:800px;
    display: block;
    .ant-tabs-nav {
        margin: 0;
    }
}


._SideTabView_ {
    padding-left: 20/@px-unit;
    .ant-tabs {
        //tabs闪烁
        width: 100%;
    }
}


.float-left {
  float: left;
}

.float-right {
  float: right;
}

.image-box {
  height: 15px;
  line-height: 15px;
  width: 15px;
  padding: 0;
  margin: 0;
  text-align: center;
  box-sizing: border-box;
  font-size: 12px !important;
}

.p-disabled {
  border: 1px solid #d9d9d9;
}

.vertical-width1 {
   width: 15px;
 }
.vertical-width2 {
  width: 30px;
}
.vertical-width3 {
  width: 45px;
}
.vertical-width4 {
  width: 60px;
}
.vertical-width5 {
  width: 75px;
}

.across-height1 {
  height: 15px;
}
.across-height2 {
  height: 30px;
}
.across-height3 {
  height: 45px;
}
.across-height4 {
  height: 60px;
}
.across-height5 {
  height: 75px;
}

.special-width {
  width: 35px;
}

.special-height {
  height: 35px;
}

.margin-l {
  margin-left: 5px;
}

.margin-b {
  margin-bottom: 5px;
}

//Modal 组件在页面外
.copyModal{
    .ant-modal{
        width: 456 / @font-size-normal;
    }
    .ant-checkbox-group-item {
        width: 120 / @font-size-normal;
        line-height: 40 / @font-size-normal;
    }
}



._DepthFocus_{