@input-outline-offset: 0 0;
@input-icon-hover-color: fade(@black, 85%);
@input-disabled-color: @disabled-color;

// Mentions
// ---
@mentions-dropdown-bg: @component-background;
@mentions-dropdown-menu-item-hover-bg: @mentions-dropdown-bg;

// Select
// ---
@select-border-color: @border-color-base;
@select-item-selected-color: @text-color;
@select-item-selected-font-weight: 600;
@select-dropdown-bg: @component-background;
@select-item-selected-bg: @primary-1;
@select-item-active-bg: @item-hover-bg;
@select-dropdown-vertical-padding: @dropdown-vertical-padding;
@select-dropdown-font-size: @dropdown-font-size;
@select-dropdown-line-height: @dropdown-line-height;
@select-dropdown-height: 32px;
@select-background: @component-background;
@select-clear-background: @select-background;
@select-selection-item-bg: @background-color-base;
@select-selection-item-border-color: @border-color-split;
@select-single-item-height-lg: 40px;
@select-multiple-item-height: @input-height-base - @input-padding-vertical-base * 2; // Normal 24px
@select-multiple-item-height-lg: 32px;
@select-multiple-item-spacing-half: ceil((@input-padding-vertical-base / 2));
@select-multiple-disabled-background: @input-disabled-bg;
@select-multiple-item-disabled-color: #bfbfbf;
@select-multiple-item-disabled-border-color: @select-border-color;

// Cascader
// ---
@cascader-bg: @component-background;
@cascader-item-selected-bg: @primary-1;
@cascader-menu-bg: @component-background;
@cascader-menu-border-color-split: @border-color-split;

// Cascader
// ----
@cascader-dropdown-vertical-padding: @dropdown-vertical-padding;
@cascader-dropdown-edge-child-vertical-padding: @dropdown-edge-child-vertical-padding;
@cascader-dropdown-font-size: @dropdown-font-size;
@cascader-dropdown-line-height: @dropdown-line-height;

// Anchor
// ---
@anchor-bg: transparent;
@anchor-border-color: @border-color-split;
@anchor-link-top: 4px;
@anchor-link-left: 16px;
@anchor-link-padding: @anchor-link-top 0 @anchor-link-top @anchor-link-left;

// Tooltip
// ---
// Tooltip max width
@tooltip-max-width: 250px;
// Tooltip text color
@tooltip-color: #fff;
// Tooltip background color
@tooltip-bg: rgba(0, 0, 0, 0.75);
// Tooltip arrow width
@tooltip-arrow-width: 8px * sqrt(2);
// Tooltip distance with trigger
@tooltip-distance: @tooltip-arrow-width - 1px + 4px;
// Tooltip arrow color
@tooltip-arrow-color: @tooltip-bg;
@tooltip-border-radius: @border-radius-base;

// Popover
// ---
// Popover body background color
@popover-bg: @component-background;
// Popover text color
@popover-color: @text-color;
// Popover maximum width
@popover-min-width: 177px;
@popover-min-height: 32px;
// Popover arrow width
@popover-arrow-width: @tooltip-arrow-width;
// Popover arrow color
@popover-arrow-color: @popover-bg;
// Popover outer arrow width
// Popover outer arrow color
@popover-arrow-outer-color: @popover-bg;
// Popover distance with trigger
@popover-distance: @popover-arrow-width + 4px;
@popover-padding-horizontal: @padding-md;

// Modal
// --
@modal-header-padding-vertical: @padding-md;
@modal-header-padding-horizontal: @padding-lg;
@modal-body-padding: @padding-lg;
@modal-header-bg: @component-background;
@modal-header-padding: @modal-header-padding-vertical @modal-header-padding-horizontal;
@modal-header-border-width: @border-width-base;
@modal-header-border-style: @border-style-base;
@modal-header-title-line-height: 22px;
@modal-header-title-font-size: @font-size-lg;
@modal-header-border-color-split: @border-color-split;
@modal-header-close-size: @modal-header-title-line-height + 2 * @modal-header-padding-vertical;
@modal-content-bg: @component-background;
@modal-heading-color: @heading-color;
@modal-close-color: @text-color-secondary;
@modal-footer-bg: transparent;
@modal-footer-border-color-split: @border-color-split;
@modal-footer-border-style: @border-style-base;
@modal-footer-padding-vertical: 10px;
@modal-footer-padding-horizontal: 16px;
@modal-footer-border-width: @border-width-base;
@modal-mask-bg: fade(@black, 45%);
@modal-confirm-body-padding: 32px 32px 24px;
@modal-confirm-title-font-size: @font-size-lg;
@modal-border-radius: @border-radius-base;

// Progress
// --
@progress-default-color: @processing-color;
@progress-remaining-color: @background-color-base;
@progress-info-text-color: @progress-text-color;
@progress-radius: 100px;
@progress-steps-item-bg: #f3f3f3;
@progress-text-font-size: 1em;
@progress-text-color: @text-color; // This is for circle text color, should be renamed better
@progress-circle-text-font-size: 1em;
// Menu
// ---
@menu-inline-toplevel-item-height: 40px;
@menu-item-height: 40px;
@menu-item-group-height: @line-height-base;
@menu-collapsed-width: 80px;
@menu-bg: @component-background;
@menu-popup-bg: @component-background;
@menu-item-color: @text-color;
@menu-inline-submenu-bg: @background-color-light;
@menu-highlight-color: @primary-color;
@menu-highlight-danger-color: @error-color;
@menu-item-active-bg: @primary-1;
@menu-item-active-danger-bg: @red-1;
@menu-item-active-border-width: 3px;
@menu-item-group-title-color: @text-color-secondary;
@menu-item-vertical-margin: 4px;
@menu-item-font-size: @font-size-base;
@menu-item-boundary-margin: 8px;
@menu-item-padding-horizontal: 20px;
@menu-item-padding: 0 @menu-item-padding-horizontal;
@menu-horizontal-line-height: 46px;
@menu-icon-margin-right: 10px;
@menu-icon-size: @menu-item-font-size;
@menu-icon-size-lg: @font-size-lg;
@menu-item-group-title-font-size: @menu-item-font-size;

// dark theme
@menu-dark-color: @text-color-secondary-dark;
@menu-dark-danger-color: @error-color;
@menu-dark-bg: @layout-header-background;
@menu-dark-arrow-color: #fff;
@menu-dark-inline-submenu-bg: #000c17;
@menu-dark-highlight-color: #fff;
@menu-dark-item-active-bg: @primary-color;
@menu-dark-item-active-danger-bg: @error-color;
@menu-dark-selected-item-icon-color: @white;
@menu-dark-selected-item-text-color: @white;
@menu-dark-item-hover-bg: transparent;
// Spin
// ---
@spin-dot-size-sm: 14px;
@spin-dot-size: 20px;
@spin-dot-size-lg: 32px;

// Table
// --
@table-bg: @component-background;
@table-header-bg: @background-color-light;
@table-header-color: @heading-color;
@table-header-sort-bg: @background-color-base;
@table-body-sort-bg: #fafafa;
@table-row-hover-bg: @background-color-light;
@table-selected-row-color: inherit;
@table-selected-row-bg: @primary-1;
@table-body-selected-sort-bg: @table-selected-row-bg;
@table-selected-row-hover-bg: darken(@table-selected-row-bg, 2%);
@table-expanded-row-bg: #fbfbfb;
@table-padding-vertical: 16px;
@table-padding-horizontal: 16px;
@table-padding-vertical-md: (@table-padding-vertical * 3 / 4);
@table-padding-horizontal-md: (@table-padding-horizontal / 2);
@table-padding-vertical-sm: (@table-padding-vertical / 2);
@table-padding-horizontal-sm: (@table-padding-horizontal / 2);
@table-border-color: @border-color-split;
@table-border-radius-base: @border-radius-base;
@table-footer-bg: @background-color-light;
@table-footer-color: @heading-color;
@table-header-bg-sm: @table-header-bg;
@table-font-size: @font-size-base;
@table-font-size-md: @table-font-size;
@table-font-size-sm: @table-font-size;
@table-header-cell-split-color: rgba(0, 0, 0, 0.06);
// Sorter
// Legacy: `table-header-sort-active-bg` is used for hover not real active
@table-header-sort-active-bg: rgba(0, 0, 0, 0.04);
@table-fixed-header-sort-active-bg: hsv(0, 0, 96%);

// Filter
@table-header-filter-active-bg: rgba(0, 0, 0, 0.04);
@table-filter-btns-bg: inherit;
@table-filter-dropdown-bg: @component-background;
@table-expand-icon-bg: @component-background;
@table-selection-column-width: 32px;
// Sticky
@table-sticky-scroll-bar-bg: fade(#000, 35%);
@table-sticky-scroll-bar-radius: 4px;

// Tag
// --
@tag-border-radius: @border-radius-base;
@tag-default-bg: @background-color-light;
@tag-default-color: @text-color;
@tag-font-size: @font-size-sm;
@tag-line-height: 20px;

// TimePicker
// ---
@picker-bg: @component-background;
@picker-basic-cell-hover-color: @item-hover-bg;
@picker-basic-cell-active-with-range-color: @primary-1;
@picker-basic-cell-hover-with-range-color: lighten(@primary-color, 35%);
@picker-basic-cell-disabled-bg: rgba(0, 0, 0, 0.04);
@picker-border-color: @border-color-split;
@picker-date-hover-range-border-color: lighten(@primary-color, 20%);
@picker-date-hover-range-color: @picker-basic-cell-hover-with-range-color;
@picker-time-panel-column-width: 56px;
@picker-time-panel-column-height: 224px;
@picker-time-panel-cell-height: 28px;
@picker-panel-cell-height: 24px;
@picker-panel-cell-width: 36px;
@picker-text-height: 40px;
@picker-panel-without-time-cell-height: 66px;

// Calendar
// ---
@calendar-bg: @component-background;
@calendar-input-bg: @input-bg;
@calendar-border-color: @border-color-inverse;
@calendar-item-active-bg: @item-active-bg;
@calendar-column-active-bg: fade(@calendar-item-active-bg, 20%);
@calendar-full-bg: @calendar-bg;
@calendar-full-panel-bg: @calendar-full-bg;

// Carousel
// ---
@carousel-dot-width: 16px;
@carousel-dot-height: 3px;
@carousel-dot-active-width: 24px;

// Badge
// ---
@badge-height: 20px;
@badge-height-sm: 14px;
@badge-dot-size: 6px;
@badge-font-size: @font-size-sm;
@badge-font-size-sm: @font-size-sm;
@badge-font-weight: normal;
@badge-status-size: 6px;
@badge-text-color: @component-background;
@badge-color: @highlight-color;

// Rate
// ---
@rate-star-color: @yellow-6;
@rate-star-bg: @border-color-split;
@rate-star-size: 20px;
@rate-star-hover-scale: scale(1.1);

// Card
// ---
@card-head-color: @heading-color;
@card-head-background: transparent;
@card-head-font-size: @font-size-lg;
@card-head-font-size-sm: @font-size-base;
@card-head-padding: 16px;
@card-head-padding-sm: (@card-head-padding / 2);
@card-head-height: 48px;
@card-head-height-sm: 36px;
@card-inner-head-padding: 12px;
@card-padding-base: 24px;
@card-padding-base-sm: (@card-padding-base / 2);
@card-actions-background: @component-background;
@card-actions-li-margin: 12px 0;
@card-skeleton-bg: #cfd8dc;
@card-background: @component-background;
@card-shadow: 0 1px 2px -2px rgba(0, 0, 0, 0.16), 0 3px 6px 0 rgba(0, 0, 0, 0.12),
  0 5px 12px 4px rgba(0, 0, 0, 0.09);
@card-radius: @border-radius-base;
@card-head-tabs-margin-bottom: -17px;
@card-head-extra-color: @text-color;

// Comment
// ---
@comment-bg: inherit;
@comment-padding-base: @padding-md 0;
@comment-nest-indent: 44px;
@comment-font-size-base: @font-size-base;
@comment-font-size-sm: @font-size-sm;
@comment-author-name-color: @text-color-secondary;
@comment-author-time-color: #ccc;
@comment-action-color: @text-color-secondary;
@comment-action-hover-color: #595959;
@comment-actions-margin-bottom: inherit;
@comment-actions-margin-top: @margin-sm;
@comment-content-detail-p-margin-bottom: inherit;

// Tabs
// ---
@tabs-card-head-background: @background-color-light;
@tabs-card-height: 40px;
@tabs-card-active-color: @primary-color;
@tabs-card-horizontal-padding: (
    (@tabs-card-height - floor(@font-size-base * @line-height-base)) / 2
  ) - @border-width-base @padding-md;
@tabs-card-horizontal-padding-sm: 6px @padding-md;
@tabs-card-horizontal-padding-lg: 7px @padding-md 6px;
@tabs-title-font-size: @font-size-base;
@tabs-title-font-size-lg: @font-size-lg;
@tabs-title-font-size-sm: @font-size-base;
@tabs-ink-bar-color: @primary-color;
@tabs-bar-margin: 0 0 @margin-md 0;
@tabs-horizontal-gutter: 32px;
@tabs-horizontal-margin: 0 0 0 @tabs-horizontal-gutter;
@tabs-horizontal-margin-rtl: 0 0 0 32px;
@tabs-horizontal-padding: @padding-sm 0;
@tabs-horizontal-padding-lg: @padding-md 0;
@tabs-horizontal-padding-sm: @padding-xs 0;
@tabs-vertical-padding: @padding-xs @padding-lg;
@tabs-vertical-margin: @margin-md 0 0 0;
@tabs-scrolling-size: 32px;
@tabs-highlight-color: @primary-color;
@tabs-hover-color: @primary-5;
@tabs-active-color: @primary-7;
@tabs-card-gutter: 2px;
@tabs-card-tab-active-border-top: 2px solid transparent;

// BackTop
// ---
@back-top-color: #fff;
@back-top-bg: @text-color-secondary;
@back-top-hover-bg: @text-color;

// Avatar
// ---
@avatar-size-base: 32px;
@avatar-size-lg: 40px;
@avatar-size-sm: 24px;
@avatar-font-size-base: 18px;
@avatar-font-size-lg: 24px;
@avatar-font-size-sm: 14px;
@avatar-bg: #ccc;
@avatar-color: #fff;
@avatar-border-radius: @border-radius-base;
@avatar-group-overlapping: -8px;
@avatar-group-space: 3px;
@avatar-group-border-color: #fff;

// Switch
// ---
@switch-height: 22px;
@switch-sm-height: 16px;
@switch-min-width: 44px;
@switch-sm-min-width: 28px;
@switch-disabled-opacity: 0.4;
@switch-color: @primary-color;
@switch-bg: @component-background;
@switch-shadow-color: fade(#00230b, 20%);
@switch-padding: 2px;
@switch-inner-margin-min: ceil(@switch-height * 0.3);
@switch-inner-margin-max: ceil(@switch-height * 1.1);
@switch-sm-inner-margin-min: ceil(@switch-sm-height * 0.3);
@switch-sm-inner-margin-max: ceil(@switch-sm-height * 1.1);

// Pagination
// ---
@pagination-item-bg: @component-background;
@pagination-item-size: @height-base;
@pagination-item-size-sm: 24px;
@pagination-font-family: @font-family;
@pagination-font-weight-active: 500;
@pagination-item-bg-active: @component-background;
@pagination-item-link-bg: @component-background;
@pagination-item-disabled-color-active: @disabled-color;
@pagination-item-disabled-bg-active: @disabled-active-bg;
@pagination-item-input-bg: @component-background;
@pagination-mini-options-size-changer-top: 0px;

// PageHeader
// ---
@page-header-padding: @padding-lg;
@page-header-padding-vertical: @padding-md;
@page-header-padding-breadcrumb: @padding-sm;
@page-header-content-padding-vertical: @padding-sm;
@page-header-back-color: #000;
@page-header-ghost-bg: inherit;
@page-header-heading-title: @heading-4-size;
@page-header-heading-sub-title: 14px;
@page-header-tabs-tab-font-size: 16px;

// Breadcrumb
// ---
@breadcrumb-base-color: @text-color-secondary;
@breadcrumb-last-item-color: @text-color;
@breadcrumb-font-size: @font-size-base;
@breadcrumb-icon-font-size: @font-size-base;
@breadcrumb-link-color: @text-color-secondary;
@breadcrumb-link-color-hover: @text-color;
@breadcrumb-separator-color: @text-color-secondary;
@breadcrumb-separator-margin: 0 @padding-xs;

// Slider
// ---
@slider-margin: 10px 6px 10px;
@slider-rail-background-color: @background-color-base;
@slider-rail-background-color-hover: #e1e1e1;
@slider-track-background-color: @primary-3;
@slider-track-background-color-hover: @primary-4;
@slider-handle-border-width: 2px;
@slider-handle-background-color: @component-background;
@slider-handle-color: @primary-3;
@slider-handle-color-hover: @primary-4;
@slider-handle-color-focus: tint(@primary-color, 20%);
@slider-handle-color-focus-shadow: fade(@primary-color, 12%);
@slider-handle-color-tooltip-open: @primary-color;
@slider-handle-size: 14px;
@slider-handle-margin-top: -5px;
@slider-handle-margin-left: -5px;
@slider-handle-shadow: 0;
@slider-dot-border-color: @border-color-split;
@slider-dot-border-color-active: tint(@primary-color, 50%);
@slider-disabled-color: @disabled-color;
@slider-disabled-background-color: @component-background;

// Tree
// ---
@tree-bg: @component-background;
@tree-title-height: 24px;
@tree-child-padding: 18px;
@tree-directory-selected-color: #fff;
@tree-directory-selected-bg: @primary-color;
@tree-node-hover-bg: @item-hover-bg;
@tree-node-selected-bg: @primary-2;

// Collapse
// ---
@collapse-header-padding: @padding-sm @padding-md;
@collapse-header-padding-extra: 40px;
@collapse-header-bg: @background-color-light;
@collapse-content-padding: @padding-md;
@collapse-content-bg: @component-background;
@collapse-header-arrow-left: 16px;

// Skeleton
// ---
@skeleton-color: rgba(190, 190, 190, 0.2);
@skeleton-to-color: shade(@skeleton-color, 5%);
@skeleton-paragraph-margin-top: 28px;
@skeleton-paragraph-li-margin-top: @margin-md;
@skeleton-paragraph-li-height: 16px;
@skeleton-title-height: 16px;
@skeleton-title-paragraph-margin-top: @margin-lg;

// Transfer
// ---
@transfer-header-height: 40px;
@transfer-item-height: @height-base;
@transfer-disabled-bg: @disabled-bg;
@transfer-list-height: 200px;
@transfer-item-hover-bg: @item-hover-bg;
@transfer-item-selected-hover-bg: darken(@item-active-bg, 2%);
@transfer-item-padding-vertical: 6px;
@transfer-list-search-icon-top: 12px;

// Message
// ---
@message-notice-content-padding: 10px 16px;
@message-notice-content-bg: @component-background;
// Motion
// ---
@wave-animation-width: 6px;

// Alert
// ---
@alert-success-border-color: ~`colorPalette('@{success-color}', 3) `;
@alert-success-bg-color: ~`colorPalette('@{success-color}', 1) `;
@alert-success-icon-color: @success-color;
@alert-info-border-color: ~`colorPalette('@{info-color}', 3) `;
@alert-info-bg-color: ~`colorPalette('@{info-color}', 1) `;
@alert-info-icon-color: @info-color;
@alert-warning-border-color: ~`colorPalette('@{warning-color}', 3) `;
@alert-warning-bg-color: ~`colorPalette('@{warning-color}', 1) `;
@alert-warning-icon-color: @warning-color;
@alert-error-border-color: ~`colorPalette('@{error-color}', 3) `;
@alert-error-bg-color: ~`colorPalette('@{error-color}', 1) `;
@alert-error-icon-color: @error-color;
@alert-message-color: @heading-color;
@alert-text-color: @text-color;
@alert-close-color: @text-color-secondary;
@alert-close-hover-color: @icon-color-hover;
@alert-no-icon-padding-vertical: @padding-xs;
@alert-with-description-no-icon-padding-vertical: @padding-md - 1px;
@alert-with-description-padding-vertical: @padding-md - 1px;
@alert-with-description-padding: @alert-with-description-padding-vertical 15px
  @alert-with-description-no-icon-padding-vertical @alert-with-description-icon-size;
@alert-icon-top: 8px + @font-size-base * (@line-height-base / 2) - (@font-size-base / 2);
@alert-with-description-icon-size: 24px;

// List
// ---
@list-header-background: transparent;
@list-footer-background: transparent;
@list-empty-text-padding: @padding-md;
@list-item-padding: @padding-sm 0;
@list-item-padding-sm: @padding-xs @padding-md;
@list-item-padding-lg: 16px 24px;
@list-item-meta-margin-bottom: @padding-md;
@list-item-meta-avatar-margin-right: @padding-md;
@list-item-meta-title-margin-bottom: @padding-sm;
@list-customize-card-bg: @component-background;
@list-item-meta-description-font-size: @font-size-base;

// Statistic
// ---
@statistic-title-font-size: @font-size-base;
@statistic-content-font-size: 24px;
@statistic-unit-font-size: 24px;
@statistic-font-family: @font-family;

// Drawer
// ---
@drawer-header-padding: @padding-md @padding-lg;
@drawer-body-padding: @padding-lg;
@drawer-bg: @component-background;
@drawer-footer-padding-vertical: @modal-footer-padding-vertical;
@drawer-footer-padding-horizontal: @modal-footer-padding-horizontal;
@drawer-header-close-size: 56px;
@drawer-title-font-size: @font-size-lg;
@drawer-title-line-height: 22px;

// Timeline
// ---
@timeline-width: 2px;
@timeline-color: @border-color-split;
@timeline-dot-border-width: 2px;
@timeline-dot-color: @primary-color;
@timeline-dot-bg: @component-background;
@timeline-item-padding-bottom: 20px;

// Typography
// ---
@typography-title-font-weight: 600;
@typography-title-margin-top: 1.2em;
@typography-title-margin-bottom: 0.5em;

// Upload
// ---
@upload-actions-color: @text-color-secondary;

// Steps
// ---
@process-tail-color: @border-color-split;
@steps-nav-arrow-color: fade(@black, 25%);
@steps-background: @component-background;
@steps-icon-size: 32px;
@steps-icon-custom-size: @steps-icon-size;
@steps-icon-custom-top: 0px;
@steps-icon-custom-font-size: 24px;
@steps-icon-top: -0.5px;
@steps-icon-font-size: @font-size-lg;
@steps-icon-margin: 0 8px 0 0;
@steps-title-line-height: @height-base;
@steps-small-icon-size: 24px;
@steps-small-icon-margin: 0 8px 0 0;
@steps-dot-size: 8px;
@steps-dot-top: 2px;
@steps-current-dot-size: 10px;
@steps-description-max-width: 140px;
@steps-nav-content-max-width: auto;
@steps-vertical-icon-width: 16px;
@steps-vertical-tail-width: 16px;
@steps-vertical-tail-width-sm: 12px;

// Notification
// ---
@notification-bg: @component-background;
@notification-padding-vertical: 16px;
@notification-padding-horizontal: 24px;

// Result
// ---
@result-title-font-size: 24px;
@result-subtitle-font-size: @font-size-base;
@result-icon-font-size: 72px;
@result-extra-margin: 24px 0 0 0;

// Image
// ---
@image-size-base: 48px;
@image-font-size-base: 24px;
@image-bg: #f5f5f5;
@image-color: #fff;
@image-mask-font-size: 16px;
@image-preview-operation-size: 18px;
@image-preview-operation-color: @text-color-dark;
@image-preview-operation-disabled-color: fade(@image-preview-operation-color, 25%);

// Segmented
// ---
@segmented-bg: fade(@black, 4%);
@segmented-hover-bg: fade(@black, 6%);
@segmented-selected-bg: @white;
@segmented-label-color: fade(@black, 65%);
@segmented-label-hover-color: #262626;

/**
 * main.less规范
 *
 * 1、去除了IPC和IVSS中使用的不知含义的less变量，保留了个别几个必须的变量定义（比如@sdd-web/design中的变量textColorNo5）；
 * 2、变量名命名规范，有状态的必须带上N,A,D（分别代表 Normal， Active,  Disable）
 *    xxxBg[N,A,D]：背景色命名
 *    xxxBorder[N,A,D]：Border命名
 *    xxxSvg[N,A,D]：Icon命名
 *    xxxText[N,A,D]： 字体色命名
 *    xxxDivider： 分割线命名 *      
 * 3、采用4.0的变量归类方式，一种是组件类，一种是模块类；变量必须明确注释或明了每个变量实际控制的组件或具体业务地方 ；
 * 4、main.less中组件模块常见的颜色定义尽量采用less引用方式， 减少换肤时颜色的定义 ，关注定制的便捷性以及换肤速度；
 *
**/
/** 
 * 页面长度使用规则
 * 1.禁止使用px和rem作为单位，包括border的宽度
 * 2.使用 px/@px-unit 换算成rem：比如常规分辨率下是100px，在less中写100/@px-unit
 * 3.使用前先impot基础less变量：@import '~style/main.less'; 
 * 4.@px-unit的数值和@font-size-base的数值相同
*/
/*换肤列表的相关颜色*/
/* 以下是调整后最新定义 */
/* svg 颜色控制 */
/**组件类变量 start**/
/**组件类变量 end**/
/**模块类变量 start**/
/*login 登录*/
/*导航*/
/**导航下拉菜单**/
/*MenuView主页菜单*/
/* 预览 */
/*预览底部*/
/** 预览-语音对讲 */
/** 预览-紧急录影 */
/** 预览-云台 */
/** 预览-快捷预览 */
/** 预览-鱼眼 */
/** 预览-报警输出*/
/* 预览-左侧 */
/* 预览-中间 */
/* 预览-右侧 */
/* AI预览面板样式 */
/*回放时间轴*/
/**回放勾选的边框与钩子颜色**/
/*sideMenu二级导航*/
/**FixButton**/
/**表格单元格状态**/
/**spin**/
/**录像类型颜色定义**/
/**录制计划悬浮颜色**/
.sdd-checked-general .ant-checkbox-inner {
  background-color: #39d67f !important;
}
.sdd-checked-alarm .ant-checkbox-inner {
  background-color: #ff4f4f !important;
}
.sdd-checked-detect .ant-checkbox-inner {
  background-color: #e9d760 !important;
}
.sdd-checked-detectalarm .ant-checkbox-inner {
  background-color: #f1910a !important;
}
.sdd-checked-ivs .ant-checkbox-inner {
  background-color: #39adf6 !important;
}
.sdd-checked-jpg .ant-checkbox-inner {
  background-color: #3ae8f8 !important;
}
.sdd-checked-pos .ant-checkbox-inner {
  background-color: #788ae3 !important;
}
.sdd-checked-card .ant-checkbox-inner {
  background-color: #7debf7 !important;
}
/**模块类变量 end**/
/**@sdd-web/design**/
/**三方库的变量需要如下用标签包裹起来**/
/**antd**/
/**antd**/
.wifi_sign {
  display: inline-block;
  width: 20px;
  height: 20px;
}
/*人脸搜索*展示搜索页面的弹窗组件*/
/*车辆检测变量*/
/**回放勾选的边框与钩子颜色**/
.sdd-checked-orange .ant-checkbox-inner {
  border-color: #226894 !important;
  background-color: #f35900 !important;
}
.sdd-checked-orange::after {
  border-color: #226894;
}
.sdd-checked-yellow .ant-checkbox-inner {
  border-color: #226894 !important;
  background-color: #fdfc00 !important;
}
.sdd-checked-yellow::after {
  border-color: #226894;
}
.sdd-checked-green .ant-checkbox-inner {
  border-color: #226894 !important;
  background-color: #39d67f !important;
}
.sdd-checked-green::after {
  border-color: #226894;
}
.sdd-checked-red .ant-checkbox-inner {
  border-color: #226894 !important;
  background-color: #FF4F4F !important;
}
.sdd-checked-red::after {
  border-color: #226894;
}
.sdd-checked-blue .ant-checkbox-inner {
  border-color: #226894 !important;
  background-color: #009cfd !important;
}
.sdd-checked-blue .ant-checkbox-inner::after {
  border-color: #226894;
}
.report-icon {
  width: 100%;
  font-size: 200px !important;
  margin: auto;
}
/*info中的version页面*/
body {
  background: transparent;
}
#root,
body {
  height: 100%;
  word-break: keep-all;
  color: #a6aab2;
}
.ant-tabs {
  color: #a6aab2;
}
.ant-table .ant-table-thead th.ant-table-cell {
  word-break: normal;
}
i {
  cursor: pointer;
}
.MainPage {
  padding: 1.42857143rem;
}
::-webkit-scrollbar {
  width: 0.35714286rem;
  height: 0.35714286rem;
  cursor: pointer;
}
::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 0.42857143rem rgba(0, 0, 0, 0);
  box-shadow: inset 0 0 0.42857143rem rgba(0, 0, 0, 0);
}
::-webkit-scrollbar-thumb {
  border-radius: 0.28571429rem;
  background: #8f8f8f;
  -webkit-box-shadow: inset 0 0 0.42857143rem rgba(0, 0, 0, 0.1);
  box-shadow: inset 0 0 0.42857143rem rgba(0, 0, 0, 0.1);
}
::-webkit-scrollbar-thumb:hover {
  background: #272727;
}
::-webkit-scrollbar-thumb:active {
  background: #8f8f8f;
}
::-webkit-scrollbar-thumb:window-inactive {
  background: rgba(0, 0, 0, 0.2);
}
.m-width-f10 {
  width: calc(100% - 10rem) !important;
}
.m-width-auto {
  width: auto !important;
}
.m-width-15 {
  width: 1.07142857rem !important;
}
.m-width-20 {
  width: 1.42857143rem !important;
}
.m-width-24 {
  width: 1.71428571rem !important;
}
.m-width-25 {
  width: 1.78571429rem !important;
}
.m-width-30 {
  width: 2.14285714rem !important;
}
.m-width-40 {
  width: 2.85714286rem !important;
}
.m-width-45 {
  width: 3.21428571rem !important;
}
.m-width-50 {
  width: 3.57142857rem !important;
}
.m-width-54 {
  width: 3.85714286rem !important;
}
.m-width-60 {
  width: 4.28571429rem !important;
}
.m-width-65 {
  width: 4.64285714rem !important;
}
.m-width-84 {
  width: 6rem !important;
}
.m-width-70 {
  width: 5rem !important;
}
.m-width-52 {
  width: 3.71428571rem !important;
}
.m-width-80 {
  width: 5.71428571rem !important;
}
.m-width-85 {
  width: 6.07142857rem !important;
}
.m-width-90 {
  width: 6.42857143rem !important;
}
.m-width-95 {
  width: 6.78571429rem !important;
}
.m-width-100 {
  width: 7.14285714rem !important;
}
.m-width-105 {
  width: 7.85714286rem !important;
}
.m-width-110 {
  width: 7.85714286rem !important;
}
.m-width-118 {
  width: 8.42857143rem !important;
}
.m-width-120 {
  width: 8.57142857rem !important;
}
.m-width-124 {
  width: 8.85714286rem !important;
}
.m-width-126 {
  width: 9rem !important;
}
.m-width-130 {
  width: 9.28571429rem !important;
}
.m-width-132 {
  width: 9.42857143rem !important;
}
.m-width-138 {
  width: 9.85714286rem !important;
}
.m-width-140 {
  width: 10rem !important;
}
.m-width-144 {
  width: 10.28571429rem !important;
}
.m-width-148 {
  width: 10.57142857rem !important;
}
.m-width-150 {
  width: 10.71428571rem !important;
}
.m-width-156 {
  width: 11.14285714rem !important;
}
.m-width-160 {
  width: 11.42857143rem !important;
}
.m-width-168 {
  width: 12rem !important;
}
.m-width-170 {
  width: 12.14285714rem !important;
}
.m-width-175 {
  width: 12.5rem !important;
}
.m-width-180 {
  width: 12.85714286rem !important;
}
.m-width-184 {
  width: 13.14285714rem !important;
}
.m-width-190 {
  width: 13.57142857rem !important;
}
.m-width-200 {
  width: 14.28571429rem !important;
}
.m-width-213 {
  width: 15.21428571rem !important;
}
.m-width-215 {
  width: 15.35714286rem !important;
}
.m-width-220 {
  width: 15.71428571rem !important;
}
.m-width-224 {
  width: 16rem !important;
}
.m-width-230 {
  width: 16.42857143rem !important;
}
.m-width-240 {
  width: 17.14285714rem !important;
}
.m-width-250 {
  width: 17.85714286rem !important;
}
.m-width-260 {
  width: 18.57142857rem !important;
}
.m-width-276 {
  width: 19.71428571rem !important;
}
.m-width-280 {
  width: 20rem !important;
}
.m-width-300 {
  width: 21.42857143rem !important;
}
.m-width-310 {
  width: 22.14285714rem !important;
}
.m-width-320 {
  width: 22.85714286rem !important;
}
.m-width-330 {
  width: 23.57142857rem !important;
}
.m-width-360 {
  width: 25.71428571rem !important;
}
.m-width-372 {
  width: 26.57142857rem !important;
}
.m-width-480 {
  width: 34.28571429rem !important;
}
.m-width-510 {
  width: 36.42857143rem !important;
}
.m-width-545 {
  width: 38.92857143rem !important;
}
.m-width-600 {
  width: 42.85714286rem !important;
}
.m-width-648 {
  width: 46.28571429rem !important;
}
.m-width-910 {
  width: 65rem !important;
}
.m-width-3p {
  width: 3% !important;
}
.m-width-9p {
  width: 9% !important;
}
.m-width-10p {
  width: 10% !important;
}
.m-width-12p {
  width: 12% !important;
}
.m-width-20p {
  width: 20% !important;
}
.m-width-25p {
  width: 25% !important;
}
.m-width-30p {
  width: 30% !important;
}
.m-width-33p {
  width: 33% !important;
}
.m-width-40p {
  width: 40% !important;
}
.m-width-50p {
  width: 50% !important;
}
.m-width-55p {
  width: 55% !important;
}
.m-width-58p {
  width: 58% !important;
}
.m-width-60p {
  width: 60% !important;
}
.m-width-65p {
  width: 65% !important;
}
.m-width-70p {
  width: 70% !important;
}
.m-width-80p {
  width: 80% !important;
}
.m-width-100p {
  width: 100% !important;
}
.m-width-200p {
  width: 200% !important;
}
/* max-width */
.m-max-w-480 {
  max-width: 34.28571429rem !important;
}
/* min-width */
.m-minw-50 {
  min-width: 3.57142857rem !important;
}
.m-minw-70 {
  min-width: 5rem !important;
}
.m-minw-90 {
  min-width: 6.42857143rem !important;
}
/* height */
.m-height-0 {
  height: 0 !important;
}
.m-height-15 {
  height: 1.07142857rem !important;
}
.m-height-24 {
  height: 1.71428571rem !important;
}
.m-height-25 {
  height: 1.78571429rem !important;
}
.m-height-26 {
  height: 1.85714286rem !important;
}
.m-height-28 {
  height: 2rem !important;
}
.m-height-30 {
  height: 2.14285714rem !important;
}
.m-height-36 {
  height: 2.57142857rem !important;
}
.m-height-40 {
  height: 2.85714286rem !important;
}
.m-height-50 {
  height: 3.57142857rem !important;
}
.m-height-60 {
  height: 4.28571429rem !important;
}
.m-height-90 {
  height: 6.42857143rem !important;
}
.m-height-100 {
  height: 7.14285714rem !important;
}
.m-height-120 {
  height: 8.57142857rem !important;
}
.m-height-150 {
  height: 10.71428571rem !important;
}
.m-height-200 {
  height: 14.28571429rem !important;
}
.m-height-201 {
  height: 14.35714286rem !important;
}
.m-height-238 {
  height: 17rem !important;
}
.m-height-276 {
  height: 19.71428571rem !important;
}
.m-height-288 {
  height: 20.57142857rem !important;
}
.m-height-300 {
  height: 21.42857143rem !important;
}
.m-height-310 {
  height: 22.14285714rem !important;
}
.m-height-350 {
  height: 25rem !important;
}
.m-height-360 {
  height: 25.71428571rem !important;
}
.m-height-380 {
  height: 27.14285714rem !important;
}
.m-height-400 {
  height: 28.57142857rem !important;
}
.m-height-432 {
  height: 30.85714286rem !important;
}
.m-height-484 {
  height: 34.57142857rem !important;
}
.m-height-648 {
  height: 46.28571429rem !important;
}
.m-height-100p {
  height: 100%;
}
/* margin */
.m-m-a {
  margin: auto;
}
.m-m-0 {
  margin: 0 !important;
}
.m-m-20 {
  margin: 1.42857143rem !important;
}
.m-m-10 {
  margin: 0.71428571rem !important;
}
/* margin-right */
.m-mr-0 {
  margin-right: 0 !important;
}
.m-mr-5 {
  margin-right: 0.35714286rem !important;
}
.m-mr-6 {
  margin-right: 0.42857143rem !important;
}
.m-mr-10 {
  margin-right: 0.71428571rem !important;
}
.m-mr-12 {
  margin-right: 0.85714286rem !important;
}
.m-mr-15 {
  margin-right: 1.07142857rem !important;
}
.m-mr-20 {
  margin-right: 1.42857143rem !important;
}
.m-mr-24 {
  margin-right: 1.71428571rem !important;
}
.m-mr-30 {
  margin-right: 2.14285714rem !important;
}
.m-mr-36 {
  margin-right: 2.57142857rem !important;
}
.m-mr-40 {
  margin-right: 2.85714286rem !important;
}
.m-mr-100 {
  margin-right: 7.14285714rem !important;
}
.m-mr-140 {
  margin-right: 10rem !important;
}
.m-mr-186 {
  margin-right: 13.28571429rem !important;
}
.m-mr-200 {
  margin-right: 14.28571429rem !important;
}
.m-mr-250 {
  margin-right: 17.85714286rem !important;
}
.m-mr-f2 {
  margin-right: -0.14285714rem !important;
}
.m-mr-f6 {
  margin-right: -0.42857143rem !important;
}
.m-mr-f7 {
  margin-right: -0.5rem !important;
}
.m-mr-f10 {
  margin-right: -0.71428571rem !important;
}
.m-mr-f14 {
  margin-right: -1rem !important;
}
.m-mr-f15 {
  margin-right: -1.07142857rem !important;
}
.m-mr-f16 {
  margin-right: -1.14285714rem !important;
}
.m-mr-f17 {
  margin-right: -1.21428571rem !important;
}
.m-mr-f18 {
  margin-right: -1.28571429rem !important;
}
.m-mr-f23 {
  margin-right: -1.64285714rem !important;
}
.m-mr-f25 {
  margin-right: -1.78571429rem !important;
}
.m-mr-f27 {
  margin-right: -1.92857143rem !important;
}
/* margin-left */
.m-ml-0 {
  margin-left: 0 !important;
}
.m-ml-3 {
  margin-left: 0.21428571rem !important;
}
.m-ml-5 {
  margin-left: 0.35714286rem !important;
}
.m-ml-6 {
  margin-left: 0.42857143rem !important;
}
.m-ml-7 {
  margin-left: 0.5rem !important;
}
.m-ml-8 {
  margin-left: 0.57142857rem !important;
}
.m-ml-9 {
  margin-left: 0.64285714rem !important;
}
.m-ml-10 {
  margin-left: 0.71428571rem !important;
}
.m-ml-12 {
  margin-left: 0.85714286rem !important;
}
.m-ml-15 {
  margin-left: 1.07142857rem !important;
}
.m-ml-16 {
  margin-left: 1.14285714rem !important;
}
.m-ml-17 {
  margin-left: 1.21428571rem !important;
}
.m-ml-18 {
  margin-left: 1.28571429rem !important;
}
.m-ml-20 {
  margin-left: 1.42857143rem !important;
}
.m-ml-23 {
  margin-left: 1.64285714rem !important;
}
.m-ml-24 {
  margin-left: 1.71428571rem !important;
}
.m-ml-25 {
  margin-left: 1.78571429rem !important;
}
.m-ml-29 {
  margin-left: 2.07142857rem !important;
}
.m-ml-30 {
  margin-left: 2.14285714rem !important;
}
.m-ml-33 {
  margin-left: 2.35714286rem !important;
}
.m-ml-35 {
  margin-left: 2.5rem !important;
}
.m-ml-36 {
  margin-left: 2.57142857rem !important;
}
.m-ml-37 {
  margin-left: 2.64285714rem !important;
}
.m-ml-40 {
  margin-left: 2.85714286rem !important;
}
.m-ml-42 {
  margin-left: 3rem !important;
}
.m-ml-47 {
  margin-left: 3.35714286rem !important;
}
.m-ml-48 {
  margin-left: 3.42857143rem !important;
}
.m-ml-49 {
  margin-left: 3.5rem !important;
}
.m-ml-50 {
  margin-left: 3.57142857rem !important;
}
.m-ml-50-5 {
  margin-left: 3.60714286rem !important;
}
.m-ml-52 {
  margin-left: 3.71428571rem !important;
}
.m-ml-60 {
  margin-left: 4.28571429rem !important;
}
.m-ml-65 {
  margin-left: 4.64285714rem !important;
}
.m-ml-70 {
  margin-left: 5rem !important;
}
.m-ml-72 {
  margin-left: 5.14285714rem !important;
}
.m-ml-75 {
  margin-left: 5.35714286rem !important;
}
.m-ml-90 {
  margin-left: 6.42857143rem !important;
}
.m-ml-100 {
  margin-left: 7.14285714rem !important;
}
.m-ml-110 {
  margin-left: 7.85714286rem !important;
}
.m-ml-112 {
  margin-left: 8rem !important;
}
.m-ml-127 {
  margin-left: 9.07142857rem !important;
}
.m-ml-130 {
  margin-left: 9.28571429rem !important;
}
.m-ml-150 {
  margin-left: 10.71428571rem !important;
}
.m-ml-170 {
  margin-left: 12.14285714rem !important;
}
.m-ml-200 {
  margin-left: 14.28571429rem !important;
}
.m-ml-220 {
  margin-left: 15.71428571rem !important;
}
.m-ml-480 {
  margin-left: 34.28571429rem !important;
}
.m-ml-540 {
  margin-left: 38.57142857rem !important;
}
.m-ml-586 {
  margin-left: 41.85714286rem !important;
}
.m-ml-590 {
  margin-left: 42.14285714rem !important;
}
.m-ml-620 {
  margin-left: 44.28571429rem !important;
}
.m-ml-765 {
  margin-left: 54.64285714rem !important;
}
.m-ml-800 {
  margin-left: 57.14285714rem !important;
}
.m-ml-f1 {
  margin-left: -0.07142857rem !important;
}
.m-ml-f3 {
  margin-left: -0.21428571rem !important;
}
.m-ml-f4 {
  margin-left: -0.28571429p !important;
}
.m-ml-f5 {
  margin-left: -0.35714286p !important;
}
.m-ml-f6 {
  margin-left: -0.42857143rem !important;
}
.m-ml-f8 {
  margin-left: -0.57142857rem !important;
}
.m-ml-f9 {
  margin-left: -0.64285714rem !important;
}
.m-ml-f10 {
  margin-left: -0.71428571rem !important;
}
.m-ml-f13 {
  margin-left: -0.92857143rem !important;
}
.m-ml-f14 {
  margin-left: -1rem !important;
}
.m-ml-f15 {
  margin-left: -1.07142857rem !important;
}
.m-ml-f16 {
  margin-left: -1.14285714rem !important;
}
.m-ml-f17 {
  margin-left: -1.21428571rem !important;
}
.m-ml-f18 {
  margin-left: -1.28571429rem !important;
}
.m-ml-f20 {
  margin-left: -1.42857143rem !important;
}
.m-ml-f24 {
  margin-left: -1.71428571rem !important;
}
.m-ml-f30 {
  margin-left: -2.14285714rem !important;
}
.m-ml-f31 {
  margin-left: -2.21428571rem !important;
}
.m-ml-f32 {
  margin-left: -2.28571429rem !important;
}
.m-ml-f33 {
  margin-left: -2.35714286rem !important;
}
.m-ml-f60 {
  margin-left: -4.28571429rem !important;
}
/* margin-top */
.m-mt-0 {
  margin-top: 0 !important;
}
.m-mt-2 {
  margin-top: 0.14285714rem !important;
}
.m-mt-3 {
  margin-top: 0.21428571rem !important;
}
.m-mt-4 {
  margin-top: 0.28571429rem !important;
}
.m-mt-5 {
  margin-top: 0.35714286rem !important;
}
.m-mt-7 {
  margin-top: 0.5rem !important;
}
.m-mt-8 {
  margin-top: 0.57142857rem !important;
}
.m-mt-10 {
  margin-top: 0.71428571rem !important;
}
.m-mt-11 {
  margin-top: 0.78571429rem !important;
}
.m-mt-12 {
  margin-top: 0.85714286rem !important;
}
.m-mt-15 {
  margin-top: 1.07142857rem !important;
}
.m-mt-16 {
  margin-top: 1.14285714rem !important;
}
.m-mt-18 {
  margin-top: 1.28571429rem !important;
}
.m-mt-20 {
  margin-top: 1.42857143rem !important;
}
.m-mt-30 {
  margin-top: 2.14285714rem !important;
}
.m-mt-42 {
  margin-top: 3rem !important;
}
.m-mt-32 {
  margin-top: 2.28571429rem !important;
}
.m-mt-35 {
  margin-top: 2.5rem !important;
}
.m-mt-36 {
  margin-top: 2.57142857rem !important;
}
.m-mt-44 {
  margin-top: 3.14285714rem !important;
}
.m-mt-50 {
  margin-top: 3.57142857rem !important;
}
.m-mt-60 {
  margin-top: 4.28571429rem !important;
}
.m-mt-70 {
  margin-top: 5rem !important;
}
.m-mt-72 {
  margin-top: 5.14285714rem !important;
}
.m-mt-100 {
  margin-top: 7.14285714rem !important;
}
.m-mt-120 {
  margin-top: 8.57142857rem !important;
}
.m-mt-180 {
  margin-top: 12.85714286rem !important;
}
.m-mt-210 {
  margin-top: 15rem !important;
}
.m-mt-f2 {
  margin-top: -0.14285714rem !important;
}
.m-mt-f3 {
  margin-top: -0.21428571rem !important;
}
.m-mt-f4 {
  margin-top: -0.28571429rem !important;
}
.m-mt-f5 {
  margin-top: -0.35714286rem !important;
}
.m-mt-f6 {
  margin-top: -0.35714286rem !important;
}
.m-mt-f8 {
  margin-top: -0.57142857rem !important;
}
.m-mt-f9 {
  margin-top: -0.64285714rem !important;
}
.m-mt-f10 {
  margin-top: -0.71428571rem !important;
}
.m-mt-f12 {
  margin-top: -0.85714286rem !important;
}
.m-mt-f15 {
  margin-top: -1.07142857rem !important;
}
.m-mt-f20 {
  margin-top: -1.42857143rem !important;
}
.m-mt-f32 {
  margin-top: -2.28571429rem !important;
}
.m-mt-f40 {
  margin-top: -2.85714286rem !important;
}
/* margin-bottom */
.m-mb-0 {
  margin-bottom: 0 !important;
}
.m-mb-5 {
  margin-bottom: 0.35714286rem !important;
}
.m-mb-10 {
  margin-bottom: 0.71428571rem !important;
}
.m-mb-12 {
  margin-bottom: 0.85714286rem !important;
}
.m-mb-15 {
  margin-bottom: 1.07142857rem !important;
}
.m-mb-14 {
  margin-bottom: 1rem !important;
}
.m-mb-20 {
  margin-bottom: 1.42857143rem !important;
}
.m-mb-30 {
  margin-bottom: 2.14285714rem !important;
}
.m-mb-2 {
  margin-bottom: 1.71428571rem !important;
}
.m-mb-30 {
  margin-bottom: 2.14285714rem !important;
}
.m-mb-80 {
  margin-bottom: 5.71428571rem !important;
}
.m-mb-130 {
  margin-bottom: 9.28571429rem !important;
}
.m-p-0 {
  padding: 0 !important;
}
.m-p-5 {
  padding: 0.35714286rem !important;
}
.m-p-12 {
  padding: 0.85714286rem !important;
}
.m-p-15 {
  padding: 1.07142857rem !important;
}
/* padding-left */
.m-pl-0 {
  padding-left: 0 !important;
}
.m-pl-5 {
  padding-left: 0.35714286rem !important;
}
.m-pl-6 {
  padding-left: 0.42857143rem !important;
}
.m-pl-7 {
  padding-left: 0.5rem !important;
}
.m-pl-8 {
  padding-left: 0.57142857rem !important;
}
.m-pl-10 {
  padding-left: 0.71428571rem !important;
}
.m-pl-12 {
  padding-left: 0.85714286rem !important;
}
.m-pl-13 {
  padding-left: 0.92857143rem !important;
}
.m-pl-15 {
  padding-left: 1.07142857rem !important;
}
.m-pl-17 {
  padding-left: 1.21428571rem !important;
}
.m-pl-20 {
  padding-left: 1.42857143rem !important;
}
.m-pl-24 {
  padding-left: 1.71428571rem !important;
}
.m-pl-25 {
  padding-left: 1.78571429rem !important;
}
.m-pl-30 {
  padding-left: 2.14285714rem !important;
}
.m-pl-35 {
  padding-left: 2.5rem !important;
}
.m-pl-37 {
  padding-left: 2.64285714rem !important;
}
.m-pl-40 {
  padding-left: 2.85714286rem !important;
}
.m-pl-43 {
  padding-left: 3.07142857rem !important;
}
.m-pl-45 {
  padding-left: 3.21428571rem !important;
}
.m-pl-50 {
  padding-left: 3.57142857rem !important;
}
.m-pl-60 {
  padding-left: 4.28571429rem !important;
}
.m-pl-70 {
  padding-left: 5rem !important;
}
/* padding-right */
.m-pr-0 {
  padding-right: 0 !important;
}
.m-pr-5 {
  padding-right: 0.35714286rem !important;
}
.m-pr-6 {
  padding-right: 0.42857143rem !important;
}
.m-pr-8 {
  padding-right: 0.57142857rem !important;
}
.m-pr-10 {
  padding-right: 0.71428571rem !important;
}
.m-pr-12 {
  padding-right: 0.85714286rem !important;
}
.m-pr-15 {
  padding-right: 1.07142857rem !important;
}
.m-pr-30 {
  padding-right: 2.14285714rem !important;
}
.m-pr-40 {
  padding-right: 2.85714286rem !important;
}
.m-pr-84 {
  padding-right: 6rem !important;
}
.m-pr-114 {
  padding-right: 8.14285714rem !important;
}
/* padding-top */
.m-pt-0 {
  padding-top: 0;
}
.m-pt-12 {
  padding-top: 0.85714286rem !important;
}
.m-pt-24 {
  padding-top: 1.71428571rem !important;
}
.m-pt-1 {
  padding-top: 0.07142857rem !important;
}
.m-pt-3 {
  padding-top: 0.21428571rem !important;
}
.m-pt-5 {
  padding-top: 0.35714286rem !important;
}
.m-pt-8 {
  padding-top: 0.57142857rem !important;
}
.m-pt-10 {
  padding-top: 0.71428571rem !important;
}
.m-pt-15 {
  padding-top: 1.07142857rem !important;
}
.m-pt-20 {
  padding-top: 1.42857143rem !important;
}
.m-pt-35 {
  padding-top: 2.5rem !important;
}
/* padding-bottom */
.m-pb-0 {
  padding-bottom: 0 !important;
}
.m-pb-2 {
  padding-bottom: 0.14285714rem !important;
}
.m-pb-8 {
  padding-bottom: 0.57142857rem !important;
}
.m-pb-10 {
  padding-bottom: 0.71428571rem !important;
}
.m-pb-108 {
  padding-bottom: 7.71428571rem !important;
}
.m-pos-abs {
  position: absolute !important;
}
.m-pos-static {
  position: static !important;
}
.m-pos-r {
  position: relative !important;
}
/* top */
.m-top-0 {
  top: 0 !important;
}
.m-top-10 {
  top: 0.71428571rem !important;
}
.m-top-72 {
  top: 5.14285714rem !important;
}
.m-top-90 {
  top: 6.42857143rem !important;
}
.m-top-130 {
  top: 9.28571429rem !important;
}
/* bottom */
.m-bottom-0 {
  bottom: 0 !important;
}
.m-bottom-2-4 {
  bottom: 0.17142857rem !important;
}
.m-bottom-3 {
  bottom: 0.21428571rem !important;
}
/* left */
.m-left-0 {
  left: 0 !important;
}
.m-left-10p {
  left: 10% !important;
}
/* right */
.m-right-16 {
  right: 1.14285714rem !important;
}
.m-right-84 {
  right: 6rem !important;
}
.m-right-124 {
  right: 8.85714286rem !important;
}
.m-topmax {
  z-index: 10004 !important;
}
.m-float-none {
  float: none !important;
}
.m-float-left {
  float: left;
}
.m-float-right {
  float: right !important;
}
.m-clear-both {
  clear: both;
}
.m-clearfix:after {
  content: '\20';
  display: block;
  height: 0;
  clear: both;
}
.m-hor-center {
  position: absolute;
  left: 50%;
  transform: translate3d(-50%, 0, 0);
  -webkit-transform: translate3d(-50%, 0, 0);
}
.m-ver-center {
  position: absolute;
  top: 50%;
  transform: translate3d(0, -50%, 0);
  -webkit-transform: translate3d(0, -50%, 0);
}
.m-hor-ver-center {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate3d(-50%, -50%, 0);
  -webkit-transform: translate3d(-50%, -50%, 0);
}
/**字体相关*/
.m-fw-normal {
  font-weight: normal !important;
}
.m-fw-bold {
  font-weight: bold !important;
}
.m-fs-small {
  font-size: small;
}
.m-fs-15 {
  font-size: 1.07142857rem;
}
.m-fs-18 {
  font-size: 1.28571429rem;
}
.m-fs-43 {
  font-size: 3.07142857rem;
}
/* line-height */
.m-lh-24 {
  line-height: 1.71428571rem;
}
.m-lh-28 {
  line-height: 2rem;
}
.m-lh-30 {
  line-height: 2.14285714rem;
}
.m-lh-32 {
  line-height: 2.28571429rem;
}
.m-lh-35 {
  line-height: 2.5rem;
}
.m-lh-40 {
  line-height: 2.85714286rem !important;
}
/* 鼠标的css */
/* 默认 箭头 */
.m-cursor-default {
  cursor: default !important;
}
/* 手形 */
.m-cursor-pointer {
  cursor: pointer !important;
}
/* 十字 */
.m-cursor-crosshair {
  cursor: crosshair !important;
}
/* 移动 */
.m-cursor-move {
  cursor: move !important;
}
/* 文本 */
.m-cursor-text {
  cursor: text !important;
}
/* 等待 沙漏 */
.m-cursor-wait {
  cursor: wait !important;
}
/* 帮助 一个问号或者气球 */
.m-cursor-help {
  cursor: help !important;
}
/* 禁用 */
.m-cursor-notAllowed {
  cursor: not-allowed !important;
}
.m-vertical-top {
  vertical-align: top !important;
}
.m-vertical-middle {
  vertical-align: middle !important;
}
.m-vertical-bottom {
  vertical-align: bottom !important;
}
.m-vertical-text-bottom {
  vertical-align: text-bottom !important;
}
.m-text-center {
  text-align: center;
}
.m-text-left {
  text-align: left;
}
.m-text-right {
  text-align: right;
}
.m-inline-block {
  display: inline-block;
}
.m-visibility-hidden {
  visibility: hidden !important;
}
.m-display-hidden {
  display: none !important;
}
.m-display-show {
  display: '' !important;
}
.m-overflow-hidden {
  overflow: hidden !important;
}
.m-overflow-initial {
  overflow: initial !important;
}
.m-opacity-0 {
  opacity: 0;