    }
    .label-normal-behind{
        padding-left: 0;
    }
    ._Mobile_ .noteSend .list {
        margin-top: 14px;
        margin-bottom: 14px;
        border: 1px solid #d9d9d9;
        border-radius: 4px;
        min-height: 200px;
        padding: 6px;
    }
    ._Mobile_ .noteSend .action button {
        width: 55px;
        margin-bottom: 10px;
    }
    ._Mobile_ .ant-form-item {
        margin-bottom: 0;
    }
    ._Mobile_ .noteSend .list .active {
        background: #1890ff;
        color: #fff;
    }
    ._Mobile_ .has-error .ant-form-explain {
        margin-left: 30%;
    }
}



// 拨号设置 - 样式
._CDMA_ {
  color: @font-color;
  // background: @baseColor;
  // padding: 16px;
  .ant-form {
    padding: unset !important;
  }

  .ant-form-item {
    margin-bottom: 7px;
  }
  .labelSelect-label-dark,.LabelIP-label-dark,.LabelInput-label-dark, .labelText-label-dark, .LabelSwitch-label-dark {
    color: @font-color;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .ant-form-item-label,
  .LabelInput-label-Col,
  .labelSelect-label-Col,
  .labelText-label-Col,
  .Input-label,
  .LabelIP-label-Col,
  .LabelSwitch-label-Col {
    text-align: left;
    // padding-left: 15px;
    line-height: 32px;
  }
  .labelText-label-Text,
  .ant-form-item-control {
    line-height: 32px;
  }
  .LabelInput-behind-dark {
    margin-bottom: 0px;
  }
  .bold {
    text-align: left;
    padding-left: 15px;
    font-weight: bold;
  }
  .net-label{
    text-align: left;
    // padding-left: 15px;
    // padding-right: 10px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
  }
  .ant-progress-bg {
    // background-size: 40px 40px;
    background-color: #FFC669;
    background-image: none;
  }
  // 信号图标与文字间距
  .icon {
    margin-right: 10px;
  }
  .fn-padl15 {
    padding-left: 15px;
  }
  .ant-radio-button-wrapper-checked {
    color: #fff;
    background: #1890FF;
  }
  .detect-mode {
    .ant-form-explain {
      margin-left: 0 !important;
    }
  }
  .advanced-parameter {
    width: 635px;
    border: 1px solid @border-color;
    margin: 10px 0 15px 15px;
    .ant-collapse-content-box {
      padding: 16px 16px 16px 0;
    }
    .ant-card-body {
      padding: 16px 16px 16px 0 !important;;
    }
    .ant-form-explain {
      margin-left: 25%;
    }
    .ant-card-head {
      background-color: #fafafa;
    }
  }
  .net-type-enable {
    margin-left: 10px;
    margin-bottom: 0;
    line-height: 32px;
    .label-normal-container {
      padding: unset !important;
    }
    .sdd-swtich-contianer {
      display: flex;
      align-items: center;
    }
  }
}
.slotInput {
    .label-normal-behind {
        margin-left: 10px;
    }
    .labelText-wrapper > div {
        display: flex;
    }
}



._FourGVTA_ {
    #FlowStatComponent {
        // padding: 16px;
        position: relative;
        .Top Button:last-child {
            position: absolute;
            right: 16px;
            top: 0px;
        }
        // 套餐提醒设置
        .PackageReminderSettings {
            color: @font-color;
            .LabelInput-label-dark {
                overflow: hidden;
                white-space: nowrap;
                text-overflow: ellipsis;
            }
        }
        // 图表样式
        .chartContainer {
            .handleBar {
                position: relative;
                z-index: 1000;
            }
            .export {
                color: @export-color;
                text-align: right;
                cursor: pointer;
                position: absolute;
                right: 50px;
                top: 80px;
                z-index: 1;
            }
            .chartType {
                position: relative;
                top: 120px;
                .chart-type {
                    float: left;
                    text-align: center;
                    width: 40px;
                    height: 32px;
                    line-height: 32px;
                    border: 1px solid @border-color;
                    cursor: pointer;
                    z-index: 1;
                }
                .left {
                    border-radius: 4px 0 0 4px;
                }
                .right {
                    border-radius: 0 4px 4px 0;
                }
                .active {
                    border: 1px solid  @export-color;
                    color: @export-color;
                }
                .showNumber {
                    float: right;
                    right: 42px;
                    text-align: right;
                    z-index: 1;
                    .ant-checkbox-blue {
                        .ant-checkbox-inner {
                            background-color: #1890FF;
                            border-color: #1890FF;
                        }
                    }
                }
            }
            .Chart {
                width: 100%;
                height: 500px;
                margin-top: 20px;
            }
        }
        // 右下角提示语
        .chartsTip {
            float: right;
            margin-left: 16px;
        }
        .Bottom {
            margin-top: 60px;
            .ant-card-body {
                text-align: center;
                font-weight: 800;
                padding-right: 32px;
                .swapIcon {
                    height: 40px;
                    width: 40px;
                    border-radius: 50%;
                    background-color: @export-color;
                    color: @white;
                    font-size: 30px;
                    line-height: 40px;
                    display: inline-block;
                    .anticon-swap {
                        transform: rotate(-90deg);
                    }
                }
                .swapData {
                    margin-left: 20px;
                    font-size: 20px;
                }
            }
        }
    }
}

._FourGVTA_ {
  // 公共样式
  .operation {
    margin: 20px 0 10px 10px;
    Button {
      margin-right: 10px;
    }
  }
  .fn-marr10 {
    margin-right: 10px;
  }
  .ant-divider-horizontal {
    margin: 10px 0 !important;
  }
}


// 手机设置 - 样式
._PHONE_ {
  color: @font-color;
  // background: @baseColor;
  padding: 0 15px;

  .ant-form-item {
    margin-bottom: 7px;
  }
  .labelSelect-label-dark,.LabelIP-label-dark,.LabelInput-label-dark, .labelText-label-dark, .LabelSwitch-label-dark {
    color: @font-color;
  }
  .LabelInput-label-Col,
  .labelSelect-label-Col,
  .labelText-label-Col,
  .macInput-label,
  .ipInput-label,
  .LabelIP-label-Col,
  .LabelSwitch-label-Col {
    text-align: left;
    padding-left: 15px;
  }

  .LabelInput-behind-dark {
    margin-bottom: 0px;
  }

  .bold {
    text-align: left;
    padding-left: 15px;
    font-weight: bold;
  }
  
  .receivers {
    min-height: 30px;
    max-height: 90px;
    // margin-bottom: 10px;
    // border: 1px #000 solid;
    overflow-y: scroll;
    width: 65%;

    .label-normal-container  {
      padding: 0 !important;
    }

    li {
      // display: flex;
      // height: 30px;
      // line-height: 30px;
      // // padding-left: 10px;
      // overflow: hidden;

      // label {
      //   overflow: hidden;
      //   text-overflow: ellipsis;
      //   white-space: nowrap;
      //   float: left;
      //   min-width: calc(90% - 30px);
      //   max-width: 150px;
      // }

      .error {
        color: @error-color;
      }

      .success {
        color: @success-color;
      }
    }
  }
  // 滚动条整体样式
  .receivers::-webkit-scrollbar {
    // 高宽分别对应横竖滚动条的尺寸
    width: 5px;
    height: 5px;
  }
  // 滚动条里面小方块
  .receivers::-webkit-scrollbar-thumb {
      border-radius: 2px;
      box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
      background: rgba(0,0,0,0.2);
  }
  // 滚动条里面轨道
  // .receivers::-webkit-scrollbar-track {
  //   box-shadow: inset 0 0 5px rgba(0,0,0,0.2);
  //   border-radius: 0;
  //   background: rgba(0,0,0,0.1);
  // }
  .label-normal-behind {
    margin-left: 10px;
  }
}

._tabbar_{
    height: calc(80vh - 64px);
    // background-color: @baseColor;
    // border-right:1px solid @topMenuColor; 
    .wrapper{
        width:100%;
        transition:all 0.3s;
        cursor: pointer;
        line-height: 40px;
        &.active {
            background-color:@tab-active-color;
            color:@export-color;
            .anticon {
                color: #272727;
            }
            .myicon:hover {
                color: #1890ff;
            }
        }
        .left {
            width:20px;
            float: left;
            height:100%;
        }
        .right{
            float: left;
        }
        p{
            margin:0;
        }
    }
    .editable-cell-value-wrap {
        max-width: 150px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
        cursor: pointer;
        border: 1px solid transparent;
        line-height: 35px;
    }
    .editable-row:hover .editable-cell-value-wrap {
        border: 1px solid #d9d9d9;
        border-radius: 4px;
    }
    .addButton {
        margin:5px auto;
    }
}
._ScheduleDialog_{
    .ant-modal-footer{
        height: 54px;
    }
    .ant-modal .ant-modal-footer .ant-btn {
    float:right;
    margin-left: 10px;  
    }
    // 新增时间表 - 小语种过长...展示
    .customBtn {
        max-width: 160px;
        display: flex;
        span {
            margin: auto;
            overflow: hidden;
            text-overflow: ellipsis;
            white-space: nowrap;
        }
    }
    .ant-form-item-label {
        padding-top: unset;
    }
    .timeSchedule-drawer {
        position: fixed !important;
        top: unset !important;
        left: 0 !important;
        height: unset;
    }
    .ant-drawer-top.ant-drawer-open, .ant-drawer-bottom.ant-drawer-open {
        height: 100% !important;
    }
    .mainBody {
        border-bottom: 1px solid #e8e8e8;
    }
    ._ScheduleComponent_ .main-container .copyBtn {
        float: unset;
        line-height: unset;
    }
}
.ScheduleDialogEmpty{
    text-align: center;
}


._Ftp_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    
    .ant-form-item {
        margin-bottom: 0
    }
    .LabelIP-container{
        margin: 0px;
    }
}
._GateMainten_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    .statist-detail, .ir-status {
        display: flex;
        .occupy {
            width: 108px;
        }
        .desc {
            flex: 1 1 auto;
        }
    }
    .ir-status {
        .desc {
            width: calc(100% - 108px);
        }
        .ant-table-body {
            height: 360px;
        }
        .ant-empty-normal {
            margin: 135px 0;
        }
    }
    .desc-item {
        .colbox {
            display: flex;
            padding: 20px;
            background-color: rgba(0, 0, 0, 0.04);
        }
        .icon {
            margin-top: 6px;
        }
        .desc {
            margin-left: 16px;
            .count {
                font-size: 20px;
                font-weight: bold;
                &.abnormal {
                    color: red;
                }
            }
        }
    }
}

._Gb_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    padding: 16px;
}



._SGCC_ {
    // padding: 16px;
    background: #fff;
    .LabelIP-ip-input__item {
        width: 25%;
        display: inline-block;
        .LabelIPinput {
            width: calc(100% - 5px);
        }
    }
    .LabelIP-label-Col {
        text-align: left;
    }
    .LabelIP-container {
        margin: 0;
    }
    h3 {
        font-size: 14px;
        font-weight: bold;
    }
    .list-box {
        position: relative;
        margin-bottom: 28px;
        .list-content {
            position: absolute;
            width: 600px;
        }
    }
    .fn-linHei30 {
        line-height: 30px;
    }
    > .ant-row, .ant-modal-body > .ant-row {
        margin-bottom: 10px;
    }
    .info-item {
        margin-bottom: 24px;

        .ant-card-head {
            min-height: 14px;
        }
        .ant-card-head-title {
            font-weight: 700;
            font-size: 14px;
            padding: 8px 0;
        }
        .ant-card-body {
            padding: 12px 24px;
        }
    }
    .info-item + .info-item {
        border-top: 1px solid @listBorderColorNo8;
        padding-top: 16px;
    }
    .info-text {
        margin-bottom: 25px; 
    }
    .ant-tooltip-inner {
        color: #fff;
    }
    .labelSlider-center {
        margin: 0;
    }
    .ant-card {
        margin-top: 16px;
    }
}
._GroupTime_ {
    .ant-form-item {
        margin-bottom: 10px!important;
    }
    .ant-checkbox-wrapper + .ant-checkbox-wrapper {
        margin-left: 0px;
    }
    .ant-picker {
        width: 100%;
    }
}

._Guide_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    padding: 16px;
    .ant-modal-body {
        max-height: 720px;
        overflow: auto;
    }
}
._HolidayGroup_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    .btnDel{
        margin-left: 20px;
    }
}

.HolidayManage-Modal {
    .ant-form-item {
        margin-bottom: 16px !important;
    }
    ._ScheduleComponent_ {
        padding: 0;
    }
}
.holiday-group-config-modal {
    .ant-form-item {
        margin-bottom: 16px !important;
    }
}
.PlanManage-Modal {
    .ant-form-item {
        margin-bottom: 16px !important;
    }
    ._ScheduleComponent_ {
        padding: 0;
    }
    ._NewScheduleComponent_ {
        padding: 0;
        .main-container .label {
            visibility: hidden;
        }
    }
    ._new_schedule_public_component_ {
        padding: 0;
    }
}


._HolidayTemplate_ {
    // 页面组件特有的CSS，
    // UI组件的样式在UI组件组内内部
    // 不同通用样式存放在 style/common.less中
    padding-top: 0 !important; //为了不eslint告警写一个
    padding-bottom: 0 !important;
    padding-left: 0 !important;
    margin: 0 !important;
    min-width: 1250px;
    height: 100%;
    .fixed-button {
        margin: 26px 0 0 140px;
    }
    .m-form-control {
        margin-left: 0;
    }
    .wrapper {
        .headWrapper {
            padding-right: 16px;
        }
        width: 100%;
        height: 100%;
        display: flex;
        .ant-alert-message {
            color: @skin-blue;
        }
        .icons {
            cursor: pointer;
            &:nth-child(1) {
                vertical-align: -1px;
            }
        }
        .icons-disabled {
            color: rgba(0, 0, 0, 0.25);
            cursor: not-allowed;
        }
        .icon-remove {
            color: rgba(0, 0, 0, 0.25);
            font-size: 20px;
            &:hover {
                cursor: pointer;
                color: @btnNormalColorNo1;
            }
        }
        .timetemplateGroup {
            border-right: 1px solid @dividerColorNo9;
            flex: 0 0 260px;
            .search {
                margin-top: 16px;
                margin-bottom: 16px;
                height: 30px;
            }
            .templist {
                display: flex;
                flex-direction: column;
                height: 620px;
                max-height: 620px;
                overflow-y: auto;
                flex-wrap: nowrap;
                .templist-empty {
                    height: 100%;
                    display: flex;
                    justify-content: center;
                    align-items: center;
                    color: @disableColorNo7;
                }
            }
            .hiddenIcon {
                visibility: hidden;
            }
            .templist-li {
                height: 40px;
                cursor: pointer;
                line-height: 40px;
                &:hover {
                    background-color: @secondNavHoverColorNo14;
                }
                &.isactive {
                    background-color: @secondNavHoverColorNo14;
                }
                .templist-li-icon {
                    float: right;
                    height: 40px;
                    line-height: 40px;
                    margin-right: 9px;
                    margin-top: 2px;
                }
                .templistLi-span {
                    width: 160px;
                    margin-left: 5px;
                    overflow: hidden;
                    text-overflow: ellipsis;
                    white-space: nowrap;
                    display: inline-block;
                    vertical-align: top;
                }
            }
        }
        .timetemplateDetail {
            @labeltimeWidth: 140px;
            padding-left: 16px;
            max-width: 980px;
            .formitemheader {
                margin-top: 20px;
            }
            .formitem {
                margin-bottom: 16px !important;
            }
            .ant-form-item-label {
                width: @labeltimeWidth;
            }
            .ant-form-item-control {
                width: 600px;
            }
            .timeWrap {
                width: 804px;
                display: inline-block;
                border-radius: 4px;
                border: solid 1px @inputBorderColorNo10;
            }

            .ant-tabs {
                overflow: visible;
            }
            .ant-tabs-tab:nth-child(1) {
                margin-left: 50px;
            }
            .ant-tabs-tab:nth-child(2) {
                margin-left: 100px;
            }
            .ant-table {
                margin-top: 0;
                border: 1px solid @inputBorderColorNo10;
            }
            .icon {
                font-size: 20px;
                cursor: pointer;
            }
            ._ScheduleComponent_ {
                padding-left: 0px;
                padding-right: 0px;
            }
            .ant-table-body {
                overflow-y: auto!important;
            }
        }
    }
    .ant-table-body {
        min-height: 240px;
    }
    .ant-table-tbody > tr:last-child > td {
        border-bottom: unset;
    }
    .ant-table-wrapper {
        margin-top: 16px;
    }
}
.HolidayTemplate-addHoliday {
    .ant-input-number {
        width: 100%;
    }
    .ant-form-item {
        margin-bottom: 16px !important;
    }
}

.holiday-group-config {
    .ant-table-tbody > tr > td .myicon-copy {
    margin-right: 10px;
}
}
.holiday-group-config-modal {
    .ant-form-item {
        margin-bottom: 16px !important;
    }
    .ant-table-tbody > tr > td .myicon-copy {
        margin-right: 10px;
    }
    .ant-checkbox-group div {
        margin-top: 10px;
    }
}
.holiday-group-config-copyto-modal {
    .wrap {
        margin-top: 10px;
        padding: 10px;
        border: 1px solid #D7D7D7;
    }
    .ant-input-group-wrapper {
        width: 200px;
    }
    .ant-checkbox-group div {
        margin-top: 10px;
    }
}
._mobile_home_ {
    position: relative;
    min-height: 100vh;
    background-color: #F0F2F5;
    .homebg {
        position: absolute;
        left: 0;
        right: 0;
        top: 0;
        height: 375px;
        //background-image: url('/static/media/homebg.png');
        background-color: #00a335;
        //background-size: cover;
        z-index: 0;
    }
    .fn-mart10 {
        margin-top: 10px;
    }
    // .adm-grid-item {
    //     height: 100px;
    //     display: flex;
    //     justify-content: center;
    //     align-items: center;
    //     background-color: #f1f1f1;
    // }
    .test {
        width: 750px;
    }
    #main {
        position: relative;
    }
    .home-main {
        position: relative;
        .home-contant {
            position: relative;
            padding-bottom: 20px;
            .header {
                height: 44px;
                line-height: 44px;
                text-align: center;
                color: #ffffff;
                .user-svg{
                    position: absolute;
                    left: 10px;
                    top: 5px;
                    font-size: 24px;
                    fill: #ffffff;
                }
            }
    
        }
        .popup-all-menus {
            .menus-wrap {
                height: calc(100vh - 45px);
                overflow-y: auto;
                background-color: #F0F2F5;
                .menus-list:last-child {
                    margin-bottom: 50px;
                }
            }
        }
        .m-sections {
            padding: 15px;
            margin-bottom: 16px;
            margin-left: 3.5%;
        }
        .door-status {
            text-align: center;
        }
        .status-desc {
            margin-top: 10px;
            font-size: 14px;
            color: #1f1f1f;
        }
        .doorStatus {
            .adm-card-header {
                height: 40px;
                padding-top: 0px;
                padding-bottom: 10px;
            }
            .adm-space {
                font-size: 24px;
            }
        }
        .doorIcon {
            font-size: 62px;
        }
        .door-actions {
            margin-top: 40px;
            margin-bottom: 15px;
            display: flex;
            justify-content: space-around;
            align-items: center;
            flex-wrap: wrap;
            &.flex2 {
                .action-btn {
                    margin-bottom: 10px;
                    flex: 0 0 50%;
                }
            }
        }
        
        .action-btn-icon {
            position: relative;
            height: 48px;
            display: flex;
            justify-content: center;
           
            .action-icon.active {
                display: none;
            }
        }
       
        .action-btn {
            text-align: center;
            width: 22%;
            &:active, &.active {
                .action-icon {
                    display: none;
                    &.active {
                        display: block;
                    }
                }
            }
            .m-text-ellipsis {
                margin-top: 8px;
                display: inline-block;
                width: 100%;
                font-size: 14px;
            }
        }
       
        .menus-list {
            padding-bottom: 20px;
            text-align: center;
            .adm-card-header {
                padding-top: 0;
                padding-bottom: 10px;
            }
            .menu-desc {
                font-size: 14px;
                color: "#1f1f1f";
            }
        }
        .flex {
            display: flex;
            justify-content: flex-start;
        }
        .flex-wrap {
            flex-wrap: wrap;
        }
        .flex-2 {
            margin-bottom: 8px;
            width: 50%;
            .menu-desc {
                font-size: 12px;
            }
        }
        .flex-3 {
            margin-bottom: 8px;
            width: 33.33%;
        }
        .flex-4 {
            margin-bottom: 8px;
            width: 25%;
        }
        // .menu-icon {
        //     font-size: 44px;
        // }
        .version-info {
            color: #1f1f1f;
            .adm-card-header {
                margin-bottom: 16px;
            }
            .sn, .softversion {
                padding: 16px;
                width: 100%;
                height: 73px;
                font-size: 16px;
                font-weight: bold;
                box-sizing: border-box;
                background-size: cover;
            }
            .title {
                margin-bottom: 8px;
                font-size: 14px;
                font-weight: 200;
            }
            .sn {
                margin-bottom: 12px;
                background-color: #00a335;
                color:#fff;
                //background-image: url('/static/media/snbg.png');
            }
            .softversion {
                background-color: #00a335;
                color:#fff;
                //background-image: url('/static/media/versionbg.png');
            }

        }
    }
    .all-menu {
        padding-bottom: 80px;
        .m-sections {
            padding-bottom: 20px;
            
        }
        .adm-card-header {
            margin-left: 16px;
        }
        .adm-card-body {
            text-align: center;
        }
        .flex {
            display: flex;
            justify-content: flex-start;
        }
        .flex-wrap {
            flex-wrap: wrap;
        }
        .flex-2 {
            margin-bottom: 8px;
            width: 50%;
            .menu-desc {
                font-size: 12px;
            }
        }
        .flex-3 {
            margin-bottom: 8px;
            width: 33.33%;
        }
        .flex-4 {
            margin-bottom: 8px;
            width: 25%;
        }
    }
}
.home-user-info-actions-popup {
    .adm-popup-body {
        background-color: #f9fcff;
    }
    .userinfo-bg {
        // position: absolute;
        // left: 0;
        // top: 0;
        // right: 0;
        // height: 320px;
        // background-image: url('/static/media/userinfobg.png');
        // background-size: cover;
        width: 100%;
        height: 100vh;
        background: url('/static/media/bg.png');
        background-size: cover;
        position: absolute;
    }
    .userinfo {
        position: relative;
        margin-top: 172px;
        z-index: 10;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
        .user-avatar {
            width: 200px;
            margin-bottom: 20px;
        }
        .username {
            color: #fff;
            font-weight: 400;
            font-size: 22px;
        }
        
    }
    .userItems{
        margin-top:50px;
        .adm-list-item-content-arrow{
            color:#1f1f1f
        }
        .userItems-content{
            margin-left:10px;
        }
        .userItems-qrcodeSvg{
            vertical-align: -2px;
        }
    }
    .adm-list-body,.adm-list-item{
        background-color: inherit;
    }
    .logout-wrap {
        position: absolute;
        bottom: 20px;
        left: 0;
        width: 100%;
        text-align: center;
    }
}
.home-user-info-qrcode-actions-popup{
        .codeContainer{
            display: flex;
            
            .codeContainer-qrcode{
                padding:16px;
                margin:auto;
                margin-top:100px;
                background-color: #ffffff;
            }
        }
        
    
}

.MenuView_ViewItem .titleIcon {
    display: inline-block;
    width: 144px;
    height: 144px;
    box-sizing: border-box;
    // background: url('/static/media/icon2.png');
}
.tab-menu-home {
    .tab-menu-logo-icon {
        margin-right: 10px;
        display: inline-block;
        vertical-align: -5px;
        width: 24px;
        height: 24px;
        background-position: -50px 0;
        background-image: url('/static/media/logo.c88c93b5.png');
    }
}
// logo组件
.header-logo-component{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: center;
    height: 64px;
    .tab-menu-logo-logo {
        display: inline-block;
        width: 162px;
        height: 30px;
        //background-image: url('/static/media/web_logo.679fb283.png');
        overflow: hidden;
        background-size: cover;
        img{
            width:100%;
            height:100%;
            display: block;
        }
    }
    .sign {
        font-size: 16px;
        color: #fff;
        line-height: 20px;
        margin-right: 10px;
    }
}
.home-bg {
    .modal {
        position: fixed;
        top: 0;
        left: 4vw;
        z-index: 2;
        display: block;
    }
    .bg_img{
        position: fixed;
        top: 0px;
        right: 0;
        z-index: 1;
        display: block;
    }
    .bg{
        display: block;
        position: fixed;
        top: -180px;
        left: -100px;
        z-index: 1;
        width: 130%;
        height: 600px;
        transform:rotate(-8.6deg);
        background: linear-gradient(#4b2dff,#483bff 20%, #434eff 40%, #3c69fe 60%, #3587fe 80%, #338dfe);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4b2dff', endColorstr='#338dfe',GradientType=0 );
    }
    .meteor {
        height: 490px;
        width: 100%;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 2;
    }
}
.ChangePwd{
    .ant-form-item-has-error .ant-form-item-explain,
    .ant-form-item-explain {
        margin-left: 130px;
    }
}
.dropdown-menu-list {
    .ant-menu-dark.ant-menu-vertical .ant-menu-item {
        margin: 0;
    }
}
// .topMenus .highlight{
//     background: @export-color;
//     color:#fff
// }
// .top-menu-more {
//     .ant-dropdown-menu {
//         width: 620px;
//         border-color:#001529;
//         background-color: #001529r;
//         opacity: 0.9;
//         color:#a6adb4;
//         display: flex;
//         justify-content: flex-start;
//         flex-wrap: wrap;
//     }
//     .ant-dropdown-menu-item {
//         // width: 150px;
//         // flex-shrink: 1;
//         // float: left;
//         flex: 0 0 155px;
//         padding: 10px 5px;
//     }
// }
// .topMenus {
//     .ant-dropdown-menu {
//         border-color:#001529;
//         background-color: #001529r;
//         color:#a6adb4;
//         .ant-dropdown-menu-item {
//             margin-bottom: 8px;
//             height: 40px;
//             margin-top: 4px;
//             padding: 0 16px;
//             overflow: hidden;
//             font-size: 14px;
//             line-height: 40px;
//             // -o-text-overflow: ellipsis;
//             // text-overflow: ellipsis;
//             color: inherit;
//             .anticon {
//                 margin-right:10px;
//             }
//             .ant-badge {
//                 color:#a6adb4;
//                 &:hover{
//                     color: #ffffff;
//                 }
//             }
//         }
//         .ant-dropdown-menu-item-active {
//             color: #fff;
//         }
//         .ant-dropdown-menu-item:hover {
//             background-color: transparent;
//         }
//         .ant-dropdown-menu-item-selected {
//             background-color: #001529!important;
//             color:#001529!important;
//         }
//     }
// }
.lang-menu-more{
    .ant-menu {
         width: 570px;
         margin-right: 10px;
     }
     .ant-menu-item {
         width: 190px;
         float: left;
     }
 }
.home-vtnc {
    display: flex;
    flex-direction: column;
    height: calc(100vh - 64px - 16px * 2);
    margin: 16px;

    & > .main {
        background-color: #fff;
        padding: 32px;
        margin-bottom: 16px;
        display: flex;
    }
    .dev-list {
        height: 100%;
        background-color: #fff;
        padding: 24px 32px;
        display: flex;
        flex-direction: column;

        .ant-btn-link {
            padding: 0;
            border: none;
        }
    }
    .ant-spin-nested-loading,
    .ant-spin-container {
        height: 100%;
    }
}

.main-vtnc {
    & > div > div[class^="_"] {
        height: calc(100vh - 64px - 16px * 2);
        margin: 16px;
        padding: 24px 32px;
        background-color: #fff;
    }
    .sideView-header {
        min-width: 1432px;
    }
}

.home-add-user-steps {
    width: 466px;
    margin: 0 auto 40px;

    .step-title {
        display: inline-block;
        max-width: 150px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
}
.muti-add-user-info {
    display: flex;
    flex-direction: column;
    // flex: 0 0 370px;
    height: 560px;
}
.select-set-vto {
    display: flex;
    flex-direction: column;
    // flex: 1;
    height: 560px;

    .status-wrap {
        .ant-progress-line {
            width: 155px;
        }
    }

    .ant-btn {
        padding: 4px 6px;
    }
}
.menu-item-vtnc {
    flex:1;
    height: 112px;
    border-radius: 4px;
    position: relative;
    cursor: pointer;

    .content {
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;

        .info {
            display: flex;
            align-items: center;
    
            & > span:first-child {
                display: inline-block;
                height: 36px;
            }
        }
        .bgIcon {
            position: absolute;
            top: 0;
            right: 0;
        }
    }

    & + & {
        margin-left: 32px;
    }

    .disable-cover {
        position: absolute;
        top: 0;
        width: 100%;
        height: 100%;
        // background-color: #ccc;
        opacity: 0.7;
        cursor: not-allowed;
    }
}
._HttpAuthCtrl_ {
    .ant-form-item {
        margin-bottom: 8px !important;

        .ant-form-item-label {
            flex: 0 0 180px;
            max-width: unset;
        }
        .ant-form-item-control {
            flex: 0 0 220px;
            max-width: unset;
        }
    }
}

._IEE802_ {
    .ant-form-item {
        margin-bottom: 8px !important;

       
    }
    .ant-table-title {
        padding: 8px 16px;
    }
    .ant-table.ant-table-bordered > .ant-table-container > .ant-table-content > table {
        border-bottom: 1px solid @borderColor;
    }
}

._ImageMode_ {
    &row {
        margin-top: 20px;
    }

    &label {
        display: inline-block;
        width: 160px;
        margin-right: 10px;
        text-align: right;
    }

    &select {
        width: 200px;
    }

    &btn {
        margin-right: 10px;

        &_offset {
            margin-left: 0px;
        }
    }
}
._ImagePlayback_ {
    .ant-tabs-bar {
        margin-bottom: 0;
    }
    .ant-tabs-nav {
        margin-bottom: 0;
    }
    .ant-tabs-nav-wrap {
        background: #ffffff;
        padding: 0 16px;
    }
    .ant-tabs-content > div {
        box-sizing: border-box;

        .tab-content {
            height: 100%;
            padding: 16px 0;
        }
        .schedule {
            padding: 15px;
            height: 100%;
            .ant-spin-nested-loading {
                min-height: 100%;
                background: #ffffff;
            }
        }
        .storage {
            width: 100%;
            min-height: calc(100vh - 138px);
            background: #ffffff;
        }
        .control {
            width: 100%;
            height: calc(100vh - 138px);
            background: #ffffff;
            overflow: auto;
        }
        &.ant-tabs-tabpane:first-child {
            height: calc(100vh - 110px);
            .tab-content.search-content{
                padding-left: 0;
                padding-right: 0;
                height: 100%;
            }
        }
    }
    .rc-tabs-content {
        .control,.storage {
            width: 100%;
            min-height: calc(100vh - 138px);
            background: #ffffff;
        }
        .search {
            height: calc(100vh - 138px);
            background: #ffffff;
            .touchbar .voice {
                margin-top: 0;
            }
        }
    }
    .rc-tabs-nav-wrap {
        background: #ffffff;
    }

    .list-item {
        margin-bottom: 10px;
        line-height: 32px;
        &:last-child {
            margin-bottom: 0;
        }
    }
    .fn-border {
        border: 1px solid #e8e8e8;
    }
    .fn-center {
        margin-top: 200px;
    }
    .LabelInput-label-Col, .labelSelect-label-Col {
        text-align: left;
        label {
            color: #272727;
        }
    }
    .full{
        position: fixed;
        left: 0;
        top: 0;
        background: #e8e8e8;
        width: 100%;
        height: 100vh;
        z-index: 1000;
    }
    .activeImg{
        text-align: center;
        height: calc(100% - 46px);
        background: #e8e8e8;
        padding: 16px 0;
        user-select:none;
        .ant-col {
            display: flex;
            align-items: center;
            justify-content: center;
            height: 100%;
        }
        .handleImg {
            cursor: pointer;
            .anticon {
                width: 36px;
                height: 80px;
                line-height: 90px;
                border-radius: 4px;
                background: #000;
                opacity: 0.5;
                svg path:last-child {
                    fill: #ccc;
                }
                &:hover {
                    color: #1890ff;
                    svg path:last-child {
                        fill: #1890ff;
                    }
                }
            }
        }
        img{
            border: none;
            width: 100%;
            max-height: 100%;
        }
    }
    .handle{
        background: #D8DADA;
        padding: 7px 0;
        text-align: center;
        .center{
            padding: 5px 0;
            display: inline-block;
            background: #CDCDCD;
            .active {
                color: #1890ff;
            }
        }
        .fullScreen{
            margin-top: 5px;
            float: right;
            padding-right: 0;
        }
        span{
            display: inline-block;
            padding: 0 20px;
            cursor: pointer;
            i{
                font-size: 18px;
            }
        }
    }
    .detail-list {
        .type {
            padding-left: 16px;
            cursor: pointer;
        }
        .active, .type:hover {
            background: #e6f7ff;
            color: #1890ff;
        }
        .record-time {
            font-size: 12px;
            color: #8f8f8f;
            display: block;
            margin-top: -10px;
        }
    }
    .search {
        width: 200%;
        height: 100%;
        transition: all 0.3s;
        .playbtn svg {
            margin: 7px 0 0 2px;
        }
        &.toRight {
            margin-left: -100%;
        }
        .search-play, .search-list {
            width: 50%;
            height: 100%;
            float: left;
            padding: 0 16px;
            > div {
                height: 100%;
                background: #ffffff;
            }
        }
        .operation {
            float: left;
            width: 240px;
            height: 100%;
            border-right: 1px solid #e8e8e8;
        }
        .result {
            position: relative;
            float: left;
            width: calc(100% - 240px);
            height: 100%;
            overflow-x: hidden;
        }
        .title {
            padding-left: 10px;
            line-height: 40px;
            border-bottom: 1px solid #e8e8e8;
        }
        .device-list {
            border-bottom: 1px solid #e8e8e8;
            .channels {
                overflow-y: auto;
                margin-top: 10px;
                height: 260px;
            }
            .channel-list {
                padding-left: 20px;
                line-height: 35px;
                .ant-checkbox-wrapper {
                    color: #272727;
                }
            }
            .myicon-boll {
                font-size: 16px;
            }
        }
        .actions {
            width: 200px;
            margin-left: 20px;
        }
        .normalBtn {
            color: #272727;
            &:hover {
                color: #1890ff;
            }
        }
        
        .greyBtn {
            color: #8f8f8f!important;
        }
        .play-list-title-back {
            cursor: pointer;
        }
        .backLabel {
            // margin-right: 90px;
        }
        .playbtn {
            position: absolute;
            left: 50%;
            top: 50%;
            margin-top: -51px;
            margin-left: -35px;
            width: 70px;
            height: 70px;
            cursor: pointer;
            span {
                position: absolute;
                left: 50%;
                top: 50%;
                margin-left: -15px;
                margin-top: -15px;
                display: inline-block;
                width: 30px;
                height: 30px;
                background: rgba(0,0,0,0.5);;
                border-radius: 50%;
                line-height: 30px;
                text-align: center;
                color: #fff;

            }
            svg {
                width: 14px;
                height: 14px;
            }
        }
        .result-list {
            width: 100%;
            height: calc(100% - 140px);
            overflow-y: auto;
            .ant-spin {
                position: absolute;
                left:  50%;
                top: 50%;
                margin-left: -10px;
                margin-top: -12.5px;
            }
            .result-item {
                position: relative;
                margin-left: 16px;
                margin-top: 10px;
                float: left;
                width: calc(14.29% - 18.65px);
                .imgbox {
                    display: inline-block;
                    width: 100%;
                    min-height: 50px;
                    box-sizing: border-box;
                    &.selected {
                        outline: 2px solid #1890ff;
                    }
                    img {
                        width: 100%;
                        height: auto;
                    }
                }
                .type {
                    font-size: 14px;
                    height: 21px;
                    white-space: nowrap;
                    text-overflow: ellipsis;
                    overflow: hidden;
                }
                .playtime {
                    position: absolute;
                    right: 10px;
                    bottom: 45px;
                    font-size: 12px;
                    color:#fff;
                    label {
                        vertical-align: 2px;
                    }
                }
                .time {
                    color: #8f8f8f;
                    font-size: 12px;
                }
                .result-item-checkbox {
                    position: absolute;
                    left: 6px;
                    top: 3px;
                }
                .ant-checkbox-wrapper + span {
                    padding-right: 0px;
                    padding-left: 0px;
                }
                .lock {
                    position: absolute;
                    right: 10px;
                    top: 10px;
                    color: #fcac15;
                    svg {
                        width: 16px;
                        height: 16px;
                    }
                }

            }
        }
        .ant-pagination {
            float: right;
            margin-right: 20px;
        }
        .play-list {
            width: 240px;
            height: 100%;
            line-height: 30px;
            float: left;
            ul {
                height: calc(100% - 40px);
                overflow-y: auto;
            }
            li {
                height: 60px;
                padding-left: 16px;
                font-size: 13px;
                cursor: pointer;
                &:first-child {
                    margin-top: 10px;
                }
                &.active, &:hover {
                    background: #e6f7ff;
                    color: #1890ff;
                }
                div {
                    font-size: 12px;
                    color: #8f8f8f;
                    margin-left: 12px;
                    margin-top: -5px;
                }
            }
            
        }
        .play-list-title {
            padding-left: 10px;
            line-height: 40px;
            height: 40px;
            color: #1890ff;
            border-bottom: 1px solid #e8e8e8;
        }
        .play-content {
            width: calc(100% - 240px);
            height: 100%;
            overflow: hidden;
        }
        .my-video {
            height: calc(100% - 80px);
            min-height: 64vh;
        }
        .touchbar {
            position: relative;
            height: 40px;
            background: #f0f2f5;
            .center {
                position: absolute;
                left: 50%;
                top: 5px;
                margin-left: -202px;
                width: 404px;
                height: 30px;
                background: #ffffff;
                border-radius: 4px;
                color: #272727;
            }
            .btns {
                width: 18px;
                margin-top: 4px;
                cursor: pointer;
                &:first-child {
                    margin-left: 25px;
                }
                svg {
                    width: 20px!important;
                    height: 16px!important;
                    &:hover {
                        color: #1890ff;
                    }
                }
                &.myicon-play3 svg{
                    width: 20px!important;
                    height: 16px!important;
                }
                &.myicon-fullscreen svg {
                    width: 20px;
                    height: 20px;
                }
                &.myicon-sound2 {
                    margin-left: 10px;
                }
                .myicon-download2, .myicon-fullscreen {
                    visibility: hidden;
                }
            }
            .voice {
                display: inline-block;
                vertical-align: middle;
                width: 110px;
                margin: 0;
                margin-top: -7px;
                margin-left: 10px;
            }
            .ant-slider-track {
                background: #1890ff;
            }
        }
        .timeBox {
            position: relative;
            .ant-popover {
                min-width: 66px;
            }
        }
        .timelime {
            height: 40px;
        }
        .right {
            float: right;
            font-size: 20px;
        }
    }
    .control {
        height: 100%;
        .fn-divider {
            border-bottom: 1px solid #e8e8e8;
        }
    }
    .storage {
        height: 100%;
        padding: 16px;
        .LabelInput-label-Col, .labelSelect-label-Col, .labelSwitch-label-Col {
            text-align: left;
            label {
                color: #272727;
            }
        }
        .session {
            margin-bottom: 10px;
            padding-bottom: 10px;
        }
    }
    
    .actions-btn {
        margin-left: 25px;
    }
    // .video-box.full .video-content {
    //     width: 50%;
    //     left: 50%;
    // }
    .search-selections {
        margin-top: 20px;
        .actions {
            margin-bottom: 15px;
        }
    }
    .fn-margin-right20 {
        margin-right: 20px;
    }
    .playtime-icon {