dh-c/dist/index.css

The front-end development engineers jimberton gulp react component

@charset "UTF-8";
/** *
  颜色值变量
*/
/** *
主题颜色
*/
/** *
  input 变量
*/
html, body {
  font-family: PingFang SC, Helvetica Neue, Helvetica, STHeitiSC-Light,WOL_SB,'Segoe UI Semibold','Segoe UI',Tahoma,Helvetica,sans-serif;
  font-size: 12px;
  color: #666666;
  background-color: #fff; }

a {
  color: #666666;
  background: transparent;
  text-decoration: none;
  outline: none;
  cursor: pointer;
  transition: color .3s ease; }

ul, ol {
  margin: 0;
  padding: 0;
  list-style: none; }

@font-face {
  font-family: "dhfont";
  src: url("./fonts/iconfont.eot");
  /* IE9*/
  src: url("./fonts/iconfont.eot?#iefix") format("embedded-opentype"), url("./fonts/iconfont.woff") format("woff"), url("./fonts/iconfont.ttf") format("truetype"), url("./fonts/iconfont.svg#dhfont") format("svg");
  /* iOS 4.1- */ }

@font-face {
  font-family: 'dhfont';
  /* project id 267870 */
  src: url("//at.alicdn.com/t/font_ljmntvnaaxde7b9.eot");
  src: url("//at.alicdn.com/t/font_ljmntvnaaxde7b9.eot?#iefix") format("embedded-opentype"), url("//at.alicdn.com/t/font_ljmntvnaaxde7b9.woff") format("woff"), url("//at.alicdn.com/t/font_ljmntvnaaxde7b9.ttf") format("truetype"), url("//at.alicdn.com/t/font_ljmntvnaaxde7b9.svg#dhfont") format("svg"); }

/*--缩放--**/
@-webkit-keyframes keyframesScale {
  0% {
    transform: scale(0); }
  100% {
    transform: scale(1); } }

@-moz-keyframes keyframesScale {
  0% {
    transform: scale(0); }
  100% {
    transform: scale(1); } }

@-o-keyframes keyframesScale {
  0% {
    transform: scale(0); }
  100% {
    transform: scale(1); } }

@keyframes keyframesScale {
  0% {
    transform: scale(0); }
  100% {
    transform: scale(1); } }

/*拉伸*/
@-webkit-keyframes keyframes_inline_start {
  0% {
    width: 0%; }
  100% {
    width: 100%; } }

@-moz-keyframes keyframes_inline_start {
  0% {
    width: 0%; }
  100% {
    width: 100%; } }

@-o-keyframes keyframes_inline_start {
  0% {
    width: 0%; }
  100% {
    width: 100%; } }

@keyframes keyframes_inline_start {
  0% {
    width: 0%; }
  100% {
    width: 100%; } }

.dh-icon {
  font-family: "dhfont" !important;
  display: inline-block;
  font-style: normal;
  vertical-align: baseline;
  text-align: center;
  text-transform: none;
  line-height: 1;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased; }

.dh-icon-list:before {
  content: "\e600"; }

.dh-icon-refresh:before {
  content: "\e601"; }

.dh-icon-filter:before {
  content: "\e69c"; }

.dh-icon-resource:before {
  content: "\e602"; }

.dh-icon-search:before {
  content: "\e611"; }

.dh-icon-share:before {
  content: "\e61a"; }

.dh-icon-wifi:before {
  content: "\e6f2"; }

.dh-icon-calendar:before {
  content: "\e62d"; }

.dh-icon-play:before {
  content: "\e604"; }

.dh-icon-close1:before {
  content: "\e629"; }

.dh-icon-jiaobiao:before {
  content: "\e66a"; }

.dh-icon-email:before {
  content: "\e69f"; }

.dh-icon-add:before {
  content: "\e6b9"; }

.dh-icon-picture-fill:before {
  content: "\e72c"; }

.dh-icon-edit:before {
  content: "\e644"; }

.dh-icon-plus-circle:before {
  content: "\e7b9"; }

.dh-icon-backward:before {
  content: "\e74d"; }

.dh-icon-forward:before {
  content: "\e74e"; }

.dh-icon-user:before {
  content: "\e61f"; }

.dh-icon-upload:before {
  content: "\e75d"; }

.dh-icon-minus:before {
  content: "\e6fe"; }

.dh-icon-destroy:before {
  content: "\e6db"; }

.dh-icon-ok:before {
  content: "\e650"; }

.dh-icon-close-circle:before {
  content: "\e83e"; }

.dh-icon-error:before {
  content: "\e63f"; }

.dh-icon-store:before {
  content: "\e7d7"; }

.dh-icon-round-down:before {
  content: "\e6c9"; }

.dh-icon-round-right:before {
  content: "\e6cd"; }

.dh-icon-radio-checked:before {
  content: "\e71f"; }

.dh-icon-radio:before {
  content: "\e72f"; }

.dh-icon-triup:before {
  content: "\e646"; }

.dh-icon-calculate:before {
  content: "\e652"; }

.dh-icon-success:before {
  content: "\e63c"; }

.dh-icon-key:before {
  content: "\e65c"; }

.dh-icon-warning:before {
  content: "\e685"; }

.dh-icon-tridown:before {
  content: "\e608"; }

.dh-icon-sharp:before {
  content: "\e726"; }

.dh-icon-table:before {
  content: "\e606"; }

.dh-icon-round-left:before {
  content: "\e689"; }

.dh-icon-round-up:before {
  content: "\e68d"; }

.dh-icon-remove:before {
  content: "\e755"; }

.dh-icon-picture:before {
  content: "\e7b7"; }

.dh-icon-home:before {
  content: "\e6b5"; }

.dh-icon-question-circle-o:before {
  content: "\e618"; }

.dh-icon-comment:before {
  content: "\e64a"; }

.dh-icon-list-circle:before {
  content: "\e60d"; }

.dh-icon-text:before {
  content: "\e607"; }

.dh-icon-location:before {
  content: "\e73a"; }

.dh-icon-point:before {
  content: "\e675"; }

.dh-icon-exit:before {
  content: "\e7cb"; }

.dh-icon-caozuo:before {
  content: "\e7b5"; }

.dh-icon-preview:before {
  content: "\e617"; }

.dh-icon-team:before {
  content: "\e89f"; }

.dh-icon-right:before {
  content: "\e621"; }

.dh-icon-up:before {
  content: "\e63d"; }

.dh-icon-down:before {
  content: "\e63e"; }

.dh-icon-left:before {
  content: "\e640"; }

.dh-icon-chat-trend:before {
  content: "\e625"; }

.dh-icon-loading:before {
  content: "\e648"; }

.dh-icon-setting:before {
  content: "\e60c"; }

.dh-icon-close:before {
  content: "\e7dc"; }

.dh-icon-lock:before {
  content: "\e701"; }

.dh-icon-checkbox:before {
  content: "\e610"; }

.dh-icon-link:before {
  content: "\e628"; }

.dh-icon-checkbox-checked:before {
  content: "\e65a"; }

.dh-icon-change:before {
  content: "\e620"; }

.dh-icon-date:before {
  content: "\e7a7"; }

.dh-icon-accAudit:before {
  content: "\e670"; }

.dh-icon-sass_people:before {
  content: "\e715"; }

.dh-icon-ok-circle:before {
  content: "\e8a0"; }

.dh-icon-tym-ol:before {
  content: "\e64b"; }

.dh-icon-file:before {
  content: "\e60a"; }

.dh-icon-Slider:before {
  content: "\e62a"; }

.dh-icon-link-circle:before {
  content: "\e615"; }

.dh-icon-plus:before {
  content: "\e616"; }

.dh-icon-revoke:before {
  content: "\e619"; }

.dh-icon-time-setting:before {
  content: "\e61b"; }

.dh-icon-calculate1:before {
  content: "\e61c"; }

.dh-icon-link-db:before {
  content: "\e61d"; }

.dh-icon-touping:before {
  content: "\e61e"; }

.dh-icon-resize-small:before {
  content: "\e623"; }

.dh-icon-resize-full:before {
  content: "\e624"; }

.dh-icon-form-warning:before {
  content: "\e626"; }

.dh-icon-clear-input:before {
  content: "\e627"; }

.dh-icon-sort-vertical-desc:before {
  content: "\e62b"; }

.dh-icon-sort-vertical-asc:before {
  content: "\e62c"; }

.dh-icon-sort-vertical-default:before {
  content: "\e62e"; }

.dh-icon-sort-horizontal-desc:before {
  content: "\e62f"; }

.dh-icon-sort-horizontal-asc:before {
  content: "\e630"; }

.dh-icon-sort-horizontal-default:before {
  content: "\e631"; }

.dh-icon-left-bold:before {
  content: "\e632"; }

.dh-icon-search-bold:before {
  content: "\e633"; }

.dh-icon-stretch:before {
  content: "\e634"; }

.dh-icon-sort-up:before {
  content: "\e635"; }

.dh-icon-sort-down:before {
  content: "\e636"; }

.dh-icon-prompt:before {
  content: "\e637"; }

.dh-icon-delet:before {
  content: "\e638"; }

.dh-icon-config-chart:before {
  content: "\e639"; }

.dh-icon-switch-chart:before {
  content: "\e63a"; }

.dh-icon-qingxie:before {
  content: "\e64c"; }

.dh-icon-zoom:before {
  content: "\e641"; }

.dh-icon-tym-ul:before {
  content: "\e6d9"; }

.dh-icon-bianjishuju1:before {
  content: "\e645"; }

.dh-icon-genghuanshuju1:before {
  content: "\e647"; }

.dh-icon-wenjianjia:before {
  content: "\e649"; }

.dh-icon-tym-bold:before {
  content: "\e64d"; }

.dh-icon-number:before {
  content: "\e603"; }

.dh-icon-column:before {
  content: "\e605"; }

.dh-icon-row:before {
  content: "\e609"; }

.dh-icon-ziyuan2:before {
  content: "\e60b"; }

.dh-icon-close-chamfer:before {
  content: "\e60e"; }

.dh-icon-double-left:before {
  content: "\e613"; }

.dh-icon-double-right:before {
  content: "\e614"; }

.dh-icon-shanchu:before {
  content: "\e60f"; }

.dh-icon-pinglun:before {
  content: "\e612"; }

.dh-icon-kuaizhao:before {
  content: "\e64e"; }

.dh-icon-zhuanfa:before {
  content: "\e64f"; }

.dh-icon-tupian:before {
  content: "\e651"; }

.dh-icon-notice:before {
  content: "\e653"; }

.dh-icon-member:before {
  content: "\e654"; }

.dh-icon-fanhui:before {
  content: "\e655"; }

.dh-icon-caidan:before {
  content: "\e657"; }

.dh-icon-gengduo:before {
  content: "\e658"; }

.dh-icon-bianjibiaoge:before {
  content: "\e659"; }

.dh-icon-newfilter:before {
  content: "\e65e"; }

.dh-icon-exchangetotable:before {
  content: "\e661"; }

.dh-icon-dropdown:before {
  content: "\e662"; }

.dh-icon-yujing:before {
  content: "\e65f"; }

.dh-icon-exchange:before {
  content: "\e622"; }

.dh-icon-database:before {
  content: "\e63b"; }

.dh-icon-style:before {
  content: "\e642"; }

.dh-icon-componentlist:before {
  content: "\e643"; }

.dh-icon-gongsi:before {
  content: "\e66b"; }

.dh-icon-quanjuyangshi:before {
  content: "\e656"; }

.dh-icon-dashboard:before {
  content: "\e65b"; }

.dh-icon-image:before {
  content: "\e65d"; }

.dh-icon-text2:before {
  content: "\e660"; }

.dh-icon-chart:before {
  content: "\e663"; }

.dh-icon-kuaizhao2:before {
  content: "\e664"; }

.dh-icon-shape:before {
  content: "\e665"; }

.dh-icon-copy:before {
  content: "\e666"; }

.dh-icon-qrcode:before {
  content: "\e667"; }

.dh-icon-mobile:before {
  content: "\e668"; }

.dh-icon-mail:before {
  content: "\e669"; }

.dh-icon-full:before {
  content: "\e66c"; }

.dh-btn {
  display: inline-block;
  padding: 0 16px;
  height: 36px;
  font-size: 14px;
  border-radius: 18px;
  color: #999999;
  border: 1px solid #d9d9d9;
  background-color: #ffffff;
  line-height: 1;
  white-space: nowrap;
  text-align: center;
  background-image: none;
  cursor: pointer;
  user-select: none;
  outline: none;
  box-sizing: border-box;
  -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
  transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); }
  .dh-btn.dh-btn-background-ghost {
    border: 1px solid #ffffff;
    background-color: transparent;
    color: #ffffff; }
  .dh-btn:hover {
    opacity: .7; }
  .dh-btn-prefix {
    margin-right: 8px; }
  .dh-btn-success {
    color: #ffffff;
    border: 1px solid transparent;
    background-color: #23c132; }
    .dh-btn-success.dh-btn-background-ghost {
      border: 1px solid #23c132;
      background-color: transparent;
      color: #23c132; }
  .dh-btn-danger {
    color: #ffffff;
    border: 1px solid transparent;
    background-color: #ff5a44; }
    .dh-btn-danger.dh-btn-background-ghost {
      border: 1px solid #ff5a44;
      background-color: transparent;
      color: #ff5a44; }
  .dh-btn-info {
    color: #ffffff;
    border: 1px solid transparent;
    background-color: #287dfb; }
    .dh-btn-info.dh-btn-background-ghost {
      border: 1px solid #287dfb;
      background-color: transparent;
      color: #287dfb; }
  .dh-btn-warning {
    color: #ffffff;
    border: 1px solid transparent;
    background-color: #fcc927; }
    .dh-btn-warning.dh-btn-background-ghost {
      border: 1px solid #fcc927;
      background-color: transparent;
      color: #fcc927; }
  .dh-btn-small {
    height: 24px;
    font-size: 12px;
    border-radius: 12px; }
  .dh-btn-circle {
    height: 36px;
    width: 36px;
    padding: 0;
    border-radius: 50%;
    overflow: hidden; }
    .dh-btn-circle.dh-btn-small {
      height: 24px;
      width: 24px;
      font-size: 12px; }
  .dh-btn-success[disabled], .dh-btn-danger[disabled], .dh-btn-info[disabled], .dh-btn-warning[disabled], .dh-btn-small[disabled], .dh-btn-circle[disabled] {
    color: #ccc;
    background-color: #f6f6f6;
    border: 1px solid #e6e6e6;
    cursor: not-allowed;
    opacity: 1; }

/* dropdown 颜色配置 */
@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px); }
  100% {
    opacity: 1;
    -webkit-transform: translateX(0); } }

@-moz-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -moz-transform: translateX(-20px); }
  100% {
    opacity: 1;
    -moz-transform: translateX(0); } }

.dh-dropdown {
  position: absolute;
  background-color: #ffffff;
  z-index: 1050; }
  .dh-dropdown-hidden {
    display: none; }
  .dh-dropdown-event {
    cursor: pointer; }
  .dh-dropdown-menu {
    box-shadow: 7px 6px 15px rgba(0, 0, 0, 0.15);
    outline: 0; }
    .dh-dropdown-menu-item {
      padding: 8px 16px;
      color: #666666;
      font-size: 12px;
      cursor: pointer;
      white-space: nowrap; }
      .dh-dropdown-menu-item > a {
        color: #666666; }
        .dh-dropdown-menu-item > a:hover {
          color: #333333; }
      .dh-dropdown-menu-item-divider {
        height: 1px;
        overflow: hidden;
        background-color: #e9e9e9;
        line-height: 0; }
      .dh-dropdown-menu-item-active {
        color: #333333;
        background-color: #f6f6f6; }
      .dh-dropdown-menu-item-selected {
        color: #23c132; }
        .dh-dropdown-menu-item-selected > a {
          color: #23c132; }
    .dh-dropdown-menu-hidden {
      display: none; }
    .dh-dropdown-menu-sub {
      position: absolute;
      left: 100%;
      top: 0;
      margin-left: 1px;
      background: #fff;
      -webkit-animation: fadeInLeft .2s .2s ease both;
      -moz-animation: fadeInLeft .2s .2s ease both; }
    .dh-dropdown-menu-submenu-vertical {
      position: relative; }
    .dh-dropdown-menu-submenu-title {
      padding: 8px 16px;
      color: #666666;
      font-size: 12px;
      cursor: pointer;
      white-space: nowrap; }
      .dh-dropdown-menu-submenu-title:hover {
        color: #333333;
        background-color: #f6f6f6; }
      .dh-dropdown-menu-submenu-title:after {
        font-family: dhfont !important;
        position: absolute;
        content: '\e621';
        right: 8px;
        color: #666666;
        display: inline-block;
        font-size: 12px; }

/** default style */
/** small style */
/** large style */
.dh-sort-icon {
  display: inline-block;
  width: 20px;
  height: 20px;
  line-height: 20px;
  text-align: left;
  margin-left: 5px;
  cursor: pointer; }
  .dh-sort-icon i {
    font-size: 12px;
    transform: scale(0.8);
    color: #d8d8d8;
    opacity: 0; }
    .dh-sort-icon i[role=active] {
      color: #999999;
      opacity: 1; }

.dh-table {
  position: relative;
  border: 1px solid #e6eaee;
  border-radius: 3px;
  height: 100%;
  overflow: auto; }
  .dh-table table {
    width: 100%; }
    .dh-table table thead {
      height: 40px;
      line-height: 40px; }
      .dh-table table thead th:hover .dh-table-ext {
        opacity: 1; }
      .dh-table table thead th:hover .dh-sort-icon i {
        opacity: 1; }
    .dh-table table tr {
      height: 40px;
      line-height: 40px;
      font-size: 14px; }
      .dh-table table tr td, .dh-table table tr th {
        text-align: left;
        font-weight: normal;
        border-bottom: 1px solid #e6eaee;
        padding-left: 4px;
        padding-right: 4px;
        color: #575f6d;
        white-space: nowrap;
        position: relative; }
      .dh-table table tr td {
        color: #333c48; }
      .dh-table table tr:last-child td {
        border-bottom: none; }
      .dh-table table tr:hover td {
        background: #e6eaee !important; }
  .dh-table .an-table-col-frozen {
    pointer-events: none; }
    .dh-table .an-table-col-frozen:before {
      content: '';
      display: block;
      position: absolute;
      left: 0;
      top: 0;
      width: 100%;
      height: 100%;
      background: rgba(248, 248, 248, 0.8); }
  .dh-table.dh-table-small thead {
    height: 32px;
    line-height: 32px; }
  .dh-table.dh-table-small tr {
    height: 32px;
    line-height: 32px;
    font-size: 12px; }
  .dh-table.dh-table-large thead {
    height: 60px;
    line-height: 60px; }
  .dh-table.dh-table-large tr {
    height: 60px;
    line-height: 60px; }
  .dh-table.dh-table-bordered table tr td, .dh-table.dh-table-bordered table tr th {
    border-right: 1px solid #e6eaee; }
    .dh-table.dh-table-bordered table tr td:last-child, .dh-table.dh-table-bordered table tr th:last-child {
      border-right: none; }
  .dh-table.dh-table-striped table tr:nth-child(even) td, .dh-table.dh-table-striped table th {
    background: #f8f9fa; }
  .dh-table.dh-table-striped table tr:nth-child(odd) td {
    background: #fff; }
  .dh-table-ext {
    position: absolute;
    text-align: center;
    right: 0px;
    top: 0px;
    opacity: 0;
    cursor: pointer; }

.dh-tinymce {
  width: 100%;
  height: 100%;
  background-color: #fff;
  min-height: 160px;
  padding: 8px;
  display: flex;
  flex-direction: column; }
  .dh-tinymce-btns {
    height: 38px;
    font-size: 20px;
    line-height: 38px;
    color: #999999; }
  .dh-tinymce-ctr {
    cursor: pointer; }
  .dh-tinymce-btns-barLine {
    border-bottom: 1px solid #ddd; }
  .dh-tinymce-edit {
    flex: 1;
    overflow: auto; }
  .dh-tinymce-footer {
    height: 36px;
    text-align: right;
    line-height: 36px; }
    .dh-tinymce-footer span {
      display: inline-block;
      width: 64px;
      text-align: center;
      color: #999999; }
      .dh-tinymce-footer span.not-allowed {
        cursor: not-allowed; }
        .dh-tinymce-footer span.not-allowed:hover {
          color: #999;
          background: transparent;
          cursor: not-allowed; }
      .dh-tinymce-footer span:hover {
        color: #23c132;
        background: rgba(35, 193, 50, 0.1);
        cursor: pointer; }
  .dh-tinymce .dh-upload {
    outline: none; }
    .dh-tinymce .dh-upload input {
      outline: none;
      border: none;
      background: none; }

.DraftEditor-root {
  position: relative; }

.public-DraftEditorPlaceholder-root {
  color: #9197a3;
  position: absolute;
  z-index: 0; }

.public-DraftEditorPlaceholder-hasFocus {
  color: #bdcec9; }

.DraftEditor-editorContainer {
  background-color: rgba(255, 255, 255, 0);
  border-left: .1px solid transparent;
  position: relative;
  z-index: 1; }

/* extend --begin */
.container .dh-tab-nav-container, .dh-tab .dh-tab-bar .dh-tab-nav-container, .dh-tab-diamond .dh-tab-bar .dh-tab-nav-container {
  overflow: hidden;
  white-space: nowrap;
  position: relative; }

/*mixin --bdgin */
.dh-tab {
  overflow: hidden; }
  .dh-tab .dh-tab-bar {
    border-bottom: 1px solid #d8dbe4;
    outline: 0; }
    .dh-tab .dh-tab-bar .dh-tab-nav {
      position: relative;
      display: inline-block;
      padding: 8px 0;
      transform-origin: 0 0; }
      .dh-tab .dh-tab-bar .dh-tab-nav .dh-tab-ink-bar {
        position: absolute;
        bottom: 0;
        height: 2px;
        background-color: #23c132;
        z-index: 1;
        transition: all cubic-bezier(0.23, 1, 0.32, 1) 0.3s;
        transform-origin: 0 0; }
    .dh-tab .dh-tab-bar .dh-tab-tab {
      transition: background-color .3s ease-out,color .3s ease-out;
      display: inline-block;
      padding: 0 12px;
      vertical-align: top;
      cursor: pointer;
      color: #999999;
      font-size: 12px; }
    .dh-tab .dh-tab-bar .dh-tab-tab-active {
      color: #666666; }

.dh-tab-diamond .dh-tab-bar {
  border-bottom: 1px solid #d8dbe4;
  outline: 0; }
  .dh-tab-diamond .dh-tab-bar .dh-tab-nav {
    position: relative;
    display: inline-block;
    padding: 8px 0;
    transform-origin: 0 0; }
    .dh-tab-diamond .dh-tab-bar .dh-tab-nav .dh-tab-ink-bar {
      position: absolute;
      bottom: 0;
      height: 2px;
      background-color: transparent;
      z-index: 1;
      transition: all cubic-bezier(0.23, 1, 0.32, 1) 0.3s;
      transform-origin: 0 0; }
  .dh-tab-diamond .dh-tab-bar .dh-tab-tab {
    height: 28px;
    line-height: 26px;
    border-radius: 14px;
    padding: 0 12px;
    border: 1px solid #e6e6e6; }
    .dh-tab-diamond .dh-tab-bar .dh-tab-tab:not(:nth-child(2)) {
      margin-left: 8px; }
  .dh-tab-diamond .dh-tab-bar .dh-tab-tab-active {
    background-color: #23c132;
    color: #fff; }

.dh-tab-content-animated {
  display: flex;
  will-change: transform; }
  .dh-tab-content-animated .dh-tab-tabpane {
    transition: opacity .3s ease-out;
    opacity: 1;
    width: 100%;
    display: block;
    flex-shrink: 0; }

/* --- s: sass extend method -- */
.inputNumberIcon {
  font-family: "dhfont" !important;
  display: inline-block;
  font-style: normal;
  vertical-align: baseline;
  text-align: center;
  text-transform: none;
  line-height: 1;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased; }

.inputNumber .dh-input-number-input, .dh-input-number .dh-input-number-input {
  width: 100%;
  text-align: left;
  outline: 0;
  -moz-appearance: textfield;
  -webkit-transition: all .3s linear;
  transition: all .3s linear;
  color: #999;
  border: 0;
  font-size: 12px;
  color: #333333;
  background: transparent; }
  .inputNumber .dh-input-number-input[disabled], .dh-input-number .dh-input-number-input[disabled] {
    cursor: not-allowed; }

/* --- e: sass extend method -- */
.dh-input-number {
  position: relative;
  padding: 4px 0;
  width: 100%;
  cursor: text;
  color: #999;
  background-color: transparent;
  background-image: none;
  -webkit-transition: all .3s;
  transition: all .3s;
  margin: 0;
  font-size: 12px;
  display: inline-block; }
  .dh-input-number:hover .dh-input-number-handler-wrap {
    opacity: 1; }
  .dh-input-number-handler-wrap {
    width: initial;
    background: transparent;
    position: absolute;
    top: 2px;
    right: 0;
    bottom: 2px;
    opacity: 0;
    -webkit-transition: opacity .24s linear .1s;
    transition: opacity .24s linear .1s; }
  .dh-input-number-handler {
    cursor: pointer;
    text-align: center;
    line-height: 0;
    height: 50%;
    overflow: hidden;
    position: relative;
    -webkit-transition: all .1s linear;
    transition: all .1s linear;
    display: block;
    width: 100%;
    color: #999; }
    .dh-input-number-handler:hover i {
      color: #666;
      font-size: 14px; }

.dh-input {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  border-bottom: 1px solid #e6e6e6;
  line-height: normal; }
  .dh-input-before {
    margin-right: 8px; }
  .dh-input-ater {
    margin-left: 8px; }
  .dh-input-warp {
    flex: 1;
    padding: 4px 0;
    line-height: 15px; }
    .dh-input-warp-inner {
      height: 100%;
      width: 100%;
      font-size: 12px;
      border: none;
      background: transparent;
      outline: 0;
      color: #333333; }
      .dh-input-warp-inner[disabled] {
        cursor: not-allowed; }
      .dh-input-warp-inner::-webkit-input-placeholder {
        /* WebKit browsers */
        color: #cccccc; }
      .dh-input-warp-inner:-moz-placeholder {
        /* Mozilla Firefox 4 to 18 */
        color: #cccccc; }
      .dh-input-warp-inner::-moz-placeholder {
        /* Mozilla Firefox 19+ */
        color: #cccccc; }
      .dh-input-warp-inner:-ms-input-placeholder {
        /* Internet Explorer 10+ */
        color: #cccccc; }
  .dh-input-bordered {
    position: absolute;
    width: 100%;
    height: 2px;
    bottom: -2px;
    left: 0;
    right: 0;
    transition: all 0.45s cubic-bezier(0.23, 1, 0.32, 1) 0ms;
    background-color: #23c132; }
  .dh-input-search {
    cursor: pointer;
    font-size: 16px; }

.dh-datasheet {
  position: relative;
  overflow: auto;
  height: 100%;
  border: 1px solid #cecece; }
  .dh-datasheet table {
    width: 100%;
    outline: none; }
    .dh-datasheet table tr {
      height: 28px;
      line-height: 28px; }
      .dh-datasheet table tr:nth-child(even) > td {
        background-color: #f7f8f9; }
      .dh-datasheet table tr:nth-child(odd) > td {
        background-color: #fff; }
      .dh-datasheet table tr th {
        height: 28px;
        line-height: 28px;
        font-size: 12px;
        border-right: 1px solid #cecece;
        border-bottom: 1px solid #cecece;
        background: #ECEFF1;
        color: #666666;
        white-space: pre;
        padding: 0 6px; }
      .dh-datasheet table tr td {
        box-sizing: border-box;
        font-size: 12px;
        height: 100%;
        margin: 0;
        padding: 0;
        border-right: 1px solid #cecece;
        border-bottom: 1px solid #cecece;
        overflow: hidden;
        text-align: left;
        text-overflow: ellipsis;
        white-space: nowrap;
        outline: none; }
        .dh-datasheet table tr td input.editable {
          padding: 0 6px;
          width: 100%;
          height: 100%;
          border: none;
          outline: none;
          background: none; }
        .dh-datasheet table tr td span {
          color: #333333;
          padding: 0 6px; }
      .dh-datasheet table tr td.selected {
        border: 2px solid #23C132; }

/* 配置 参数 */
.dh-message {
  position: fixed;
  top: 3%;
  z-index: 99999; }
  .dh-message-notice {
    position: relative;
    margin-bottom: 8px; }
  .dh-message-container {
    position: relative;
    padding: 12px;
    border-radius: 4px;
    background-color: #ffffff;
    font-size: 12px;
    color: #999999;
    overflow: hidden;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2); }
    .dh-message-container span {
      display: inline-block;
      vertical-align: middle; }
    .dh-message-container .dh-message-icon {
      position: absolute;
      margin-top: 2px; }
      .dh-message-container .dh-message-icon i {
        font-size: 14px; }
    .dh-message-container .dh-message-title {
      margin-left: 4px;
      color: #999999; }
    .dh-message-container .dh-message-desc {
      margin-left: 18px; }
    .dh-message-container .dh-message-success {
      color: #23c132; }
    .dh-message-container .dh-message-error {
      color: #f04134; }
    .dh-message-container .dh-message-warning {
      color: #ffbf00; }

.dh-tooltip {
  position: absolute;
  left: -9999px;
  top: -9999px;
  z-index: 1050;
  display: block;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.5; }
  .dh-tooltip-arrow {
    position: absolute;
    width: 10px;
    height: 10px;
    border: 1px solid rgba(31, 56, 88, 0.2);
    background-color: #fff;
    transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    box-shadow: 0 1px 4px 0 rgba(31, 56, 88, 0.15); }
  .dh-tooltip-content {
    background-color: #ffffff;
    border: 1px solid #e6e6e6;
    border-radius: 3px;
    box-shadow: 0 1px 4px 0 rgba(31, 56, 88, 0.15); }
  .dh-tooltip-hidden {
    display: none; }
  .dh-tooltip-inner {
    position: relative;
    z-index: 2;
    padding: 6px 16px;
    color: #666666;
    text-align: center;
    color: rgba(31, 56, 88, 0.8);
    text-decoration: none;
    border-radius: 3px;
    background-color: #fff; }
  .dh-tooltip-placement-left, .dh-tooltip-placement-leftBottom, .dh-tooltip-placement-leftTop {
    margin-left: -3px;
    padding: 0 6px; }
    .dh-tooltip-placement-left .dh-tooltip-arrow, .dh-tooltip-placement-leftBottom .dh-tooltip-arrow, .dh-tooltip-placement-leftTop .dh-tooltip-arrow {
      right: 2px; }
  .dh-tooltip-placement-leftTop .dh-tooltip-arrow {
    top: 8px; }
  .dh-tooltip-placement-left .dh-tooltip-arrow {
    top: 50%;
    margin-top: -4px; }
  .dh-tooltip-placement-leftBottom .dh-tooltip-arrow {
    bottom: 8px; }
  .dh-tooltip-placement-right, .dh-tooltip-placement-rightBottom, .dh-tooltip-placement-rightTop {
    margin-left: 3px;
    padding: 0 6px; }
    .dh-tooltip-placement-right .dh-tooltip-arrow, .dh-tooltip-placement-rightBottom .dh-tooltip-arrow, .dh-tooltip-placement-rightTop .dh-tooltip-arrow {
      left: 2px; }
  .dh-tooltip-placement-rightTop .dh-tooltip-arrow {
    top: 8px; }
  .dh-tooltip-placement-right .dh-tooltip-arrow {
    top: 50%;
    margin-top: -4px; }
  .dh-tooltip-placement-rightBottom .dh-tooltip-arrow {
    bottom: 8px; }
  .dh-tooltip-placement-top, .dh-tooltip-placement-topLeft, .dh-tooltip-placement-topRight {
    margin-top: -3px;
    padding: 6px 0; }
    .dh-tooltip-placement-top .dh-tooltip-arrow, .dh-tooltip-placement-topLeft .dh-tooltip-arrow, .dh-tooltip-placement-topRight .dh-tooltip-arrow {
      bottom: 2px; }
  .dh-tooltip-placement-top .dh-tooltip-arrow {
    left: 50%;
    margin-left: -6px; }
  .dh-tooltip-placement-topLeft .dh-tooltip-arrow {
    left: 12px; }
  .dh-tooltip-placement-topRight .dh-tooltip-arrow {
    right: 12px; }
  .dh-tooltip-placement-bottom, .dh-tooltip-placement-bottomLeft, .dh-tooltip-placement-bottomRight {
    margin-top: 3px;
    padding: 6px 0; }
    .dh-tooltip-placement-bottom .dh-tooltip-arrow, .dh-tooltip-placement-bottomLeft .dh-tooltip-arrow, .dh-tooltip-placement-bottomRight .dh-tooltip-arrow {
      top: 2px; }
  .dh-tooltip-placement-bottomLeft .dh-tooltip-arrow {
    left: 12px; }
  .dh-tooltip-placement-bottom .dh-tooltip-arrow {
    left: 50%;
    margin-left: -6px; }
  .dh-tooltip-placement-bottomRight .dh-tooltip-arrow {
    right: 12px; }

.dh-steps {
  width: 100%;
  display: flex; }
  .dh-steps-item {
    display: flex;
    flex-direction: row;
    align-items: center; }
  .dh-steps-step {
    padding: 0 8px; }
  .dh-steps-head {
    width: 32px;
    height: 32px;
    line-height: 32px;
    display: inline-block;
    position: relative; }
    .dh-steps-head-inner {
      display: inline-block;
      width: 100%;
      height: inherit;
      background-color: #23c132;
      text-align: center;
      color: #fff;
      font-size: 14px;
      font-weight: 400;
      border-radius: 50%; }
      .dh-steps-head-inner-finish {
        display: inline-block;
        width: 100%;
        height: inherit;
        background-color: #23c132;
        text-align: center;
        color: #fff;
        font-size: 14px;
        font-weight: 400;
        border-radius: 50%; }
  .dh-steps-main {
    display: inline-block;
    margin-left: 6px;
    font-size: 14px; }
  .dh-steps-tail {
    flex: 1;
    height: 4px;
    background: #e9e9e9;
    position: relative; }
    .dh-steps-tail__inline {
      width: 0;
      height: 100%;
      background-color: #23c132; }
      .dh-steps-tail__inline[data-slide="true"] {
        -webkit-animation: keyframes_inline_start 1s cubic-bezier(0.23, 1, 0.32, 1) 0.1s forwards;
        animation: keyframes_inline_start 1s cubic-bezier(0.23, 1, 0.32, 1) 0.1s forwards; }

/* Slider */
.dh-carousel {
  position: relative;
  height: 100%; }

.slick-slider {
  position: relative;
  display: block;
  height: 100%;
  box-sizing: border-box;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -ms-touch-action: pan-y;
  touch-action: pan-y;
  -webkit-tap-highlight-color: transparent; }

.slick-list {
  position: relative;
  overflow: hidden;
  display: block;
  margin: 0;
  padding: 0;
  height: 100%; }
  .slick-list:focus {
    outline: none; }
  .slick-list.dragging {
    cursor: pointer;
    cursor: hand; }

.slick-slider .slick-track,
.slick-slider .slick-list {
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
  -ms-transform: translate3d(0, 0, 0);
  -o-transform: translate3d(0, 0, 0);
  transform: translate3d(0, 0, 0); }

.slick-track {
  position: relative;
  left: 0;
  top: 0;
  display: block;
  height: inherit; }
  .slick-track:before, .slick-track:after {
    content: "";
    display: table; }
  .slick-track:after {
    clear: both; }
  .slick-loading .slick-track {
    visibility: hidden; }

.slick-slide {
  float: left;
  height: 100%;
  min-height: 1px;
  display: none; }
  [dir="rtl"] .slick-slide {
    float: right; }
  .slick-slide img {
    display: block; }
  .slick-slide.slick-loading img {
    display: none; }
  .slick-slide.dragging img {
    pointer-events: none; }
  .slick-initialized .slick-slide {
    display: block; }
  .slick-loading .slick-slide {
    visibility: hidden; }
  .slick-vertical .slick-slide {
    display: block;
    height: auto;
    border: 1px solid transparent; }

.slick-arrow.slick-hidden {
  display: none; }

/* Slider */
/* Arrows */
.slick-prev,
.slick-next {
  position: absolute;
  display: block;
  height: 20px;
  width: 20px;
  line-height: 0px;
  font-size: 0px;
  cursor: pointer;
  background: transparent;
  color: transparent;
  top: 50%;
  -webkit-transform: translate(0, -50%);
  -ms-transform: translate(0, -50%);
  transform: translate(0, -50%);
  padding: 0;
  border: none;
  outline: none;
  z-index: 2; }
  .slick-prev:hover, .slick-prev:focus,
  .slick-next:hover,
  .slick-next:focus {
    outline: none;
    background: transparent;
    color: transparent; }
    .slick-prev:hover:before, .slick-prev:focus:before,
    .slick-next:hover:before,
    .slick-next:focus:before {
      opacity: 1; }
  .slick-prev.slick-disabled:before,
  .slick-next.slick-disabled:before {
    opacity: 0.25; }
  .slick-prev:before,
  .slick-next:before {
    font-family: "dhfont";
    font-size: 20px;
    line-height: 1;
    color: white;
    opacity: 0.75;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale; }

.slick-prev {
  left: 12px; }
  [dir="rtl"] .slick-prev {
    left: auto;
    right: -25px; }
  .slick-prev:before {
    content: ""; }
    [dir="rtl"] .slick-prev:before {
      content: ""; }

.slick-next {
  right: 12px; }
  [dir="rtl"] .slick-next {
    left: -25px;
    right: auto; }
  .slick-next:before {
    content: ""; }
    [dir="rtl"] .slick-next:before {
      content: ""; }

/* Dots */
.slick-dotted.slick-slider {
  margin-bottom: 30px; }

.slick-dots {
  position: absolute;
  bottom: 12px;
  list-style: none;
  display: block;
  text-align: center;
  padding: 0;
  margin: 0;
  width: 100%; }
  .slick-dots li {
    position: relative;
    display: inline-block;
    height: 20px;
    width: 20px;
    margin: 0 5px;
    padding: 0;
    cursor: pointer; }
    .slick-dots li button {
      border: 0;
      background: transparent;
      display: block;
      height: 20px;
      width: 20px;
      outline: none;
      line-height: 0px;
      font-size: 0px;
      color: transparent;
      padding: 5px;
      cursor: pointer; }
      .slick-dots li button:hover, .slick-dots li button:focus {
        outline: none; }
        .slick-dots li button:hover:before, .slick-dots li button:focus:before {
          opacity: 1; }
      .slick-dots li button:before {
        position: absolute;
        top: 0;
        left: 0;
        content: "";
        width: 20px;
        height: 20px;
        font-family: "dhfont";
        font-size: 6px;
        line-height: 20px;
        text-align: center;
        color: black;
        opacity: 0.25;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale; }
    .slick-dots li.slick-active button:before {
      color: black;
      opacity: 0.75; }

.dh-pagination {
  list-style: none;
  padding: 0;
  margin: 0; }
  .dh-pagination .dh-pagination-jump-prev, .dh-pagination .dh-pagination-jump-next {
    display: none; }
  .dh-pagination .dh-pagination-item {
    display: inline-block;
    padding: 0 8px;
    vertical-align: middle; }
    .dh-pagination .dh-pagination-item a {
      color: #ccc; }
    .dh-pagination .dh-pagination-item.dh-pagination-item-active a {
      color: #666; }
  .dh-pagination .dh-pagination-next, .dh-pagination .dh-pagination-prev {
    display: inline-block;
    width: 24px;
    height: 24px;
    border-radius: 50%;
    vertical-align: middle;
    cursor: pointer;
    color: #e6e6e6; }
    .dh-pagination .dh-pagination-next:hover, .dh-pagination .dh-pagination-prev:hover {
      color: #23c132; }
    .dh-pagination .dh-pagination-next:before, .dh-pagination .dh-pagination-prev:before {
      font-family: dhfont;
      content: '\e6cd';
      font-size: 24px;
      line-height: 24px; }
  .dh-pagination .dh-pagination-prev:before {
    content: '\e689'; }

.dh-radio {
  display: inline-block;
  margin-right: 32px;
  color: #666;
  cursor: pointer; }
  .dh-radio .dh-icon {
    font-size: 14px; }
  .dh-radio:last-child {
    margin-right: 0; }
  .dh-radio i {
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-right: 8px; }
  .dh-radio.dh-radio-checked i {
    color: #23c132; }

.dh-checkbox {
  display: inline-block;
  color: #666;
  cursor: pointer; }
  .dh-checkbox .dh-icon {
    font-size: 14px; }
  .dh-checkbox:last-child {
    margin-right: 0; }
  .dh-checkbox i {
    display: inline-block;
    width: 14px;
    height: 14px;
    margin-right: 12px; }
  .dh-checkbox.dh-checkbox-checked i {
    color: #23c132; }

.dh-checkbox2 {
  white-space: nowrap;
  cursor: pointer;
  outline: none;
  display: inline-block;
  line-height: 1;
  position: relative;
  vertical-align: text-bottom; }
  .dh-checkbox2 + span {
    padding: 0 8px; }
  .dh-checkbox2-wrapper {
    cursor: pointer;
    font-size: 12px;
    display: inline-block; }
  .dh-checkbox2-input {
    position: absolute;
    left: 0;
    z-index: 1;
    cursor: pointer;
    opacity: 0;
    top: 0;
    bottom: 0;
    right: 0;
    width: 100%;
    height: 100%; }
  .dh-checkbox2-inner {
    position: relative;
    top: 0;
    left: 0;
    display: block;
    width: 14px;
    height: 14px;
    border: 1px solid #d9d9d9;
    border-radius: 2px;
    background-color: #fff;
    transition: all .3s; }
    .dh-checkbox2-inner:after {
      transform: rotate(45deg) scale(0);
      position: absolute;
      left: 4px;
      top: 1px;
      display: table;
      width: 5px;
      height: 8px;
      border: 1px solid #fff;
      border-top: 0;
      border-left: 0;
      content: " ";
      transition: all 0.1s cubic-bezier(0.71, -0.46, 0.88, 0.6); }
  .dh-checkbox2-checked .dh-checkbox2-inner {
    background-color: #23c123;
    border-color: #23c123; }
    .dh-checkbox2-checked .dh-checkbox2-inner:after {
      transform: rotate(45deg) scale(1);
      position: absolute;
      display: table;
      border: 2px solid #fff;
      border-top: 0;
      border-left: 0;
      content: " ";
      transition: all 0.2s cubic-bezier(0.12, 0.4, 0.29, 1.46) 0.1s; }

.dh-select {
  box-sizing: border-box;
  display: inline-block;
  position: relative;
  color: #666666;
  width: 100%; }
  .dh-select-selection {
    outline: 0;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-user-select: none;
    box-sizing: border-box;
    display: block;
    border-bottom: 1px solid #e6e6e6; }
    .dh-select-selection--single {
      position: relative;
      cursor: pointer;
      height: 24px; }
    .dh-select-selection__placeholder {
      color: #999999;
      font-size: 12px;
      line-height: 15px; }
  .dh-select-selection-selected-value {
    position: relative;
    font-size: 12px;
    line-height: 15px;
    color: #333333;
    white-space: nowrap; }
  .dh-select-arrow {
    height: 100%;
    position: absolute;
    top: 0;
    right: 0;
    text-align: end; }
    .dh-select-arrow b {
      font-size: 12px;
      position: relative;
      font-family: "dhfont" !important;
      display: inline-block;
      line-height: 23px;
      transform: rotate(0deg); }
      .dh-select-arrow b:after {
        content: "\e63e"; }
  .dh-select-open .dh-select-arrow b {
    transform: rotate(180deg);
    transition: transform 0.45s cubic-bezier(0.23, 1, 0.32, 1); }
  .dh-select-selection__rendered {
    display: block;
    position: relative;
    padding: 4px 0; }
  .dh-select-selection--multiple .dh-select-selection__choice {
    background-color: #f3f3f3;
    border-radius: 3px;
    cursor: default;
    float: left;
    max-width: 99%;
    position: relative;
    overflow: hidden;
    -webkit-transition: padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    transition: padding 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
    padding: 0 20px 0 10px; }
    .dh-select-selection--multiple .dh-select-selection__choice__content {
      display: inline-block;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      max-width: 100%;
      -webkit-transition: margin 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
      transition: margin 0.3s cubic-bezier(0.645, 0.045, 0.355, 1); }
    .dh-select-selection--multiple .dh-select-selection__choice__remove {
      font-style: normal;
      vertical-align: baseline;
      text-align: center;
      text-transform: none;
      text-rendering: optimizeLegibility;
      -webkit-font-smoothing: antialiased;
      -moz-osx-font-smoothing: grayscale;
      color: rgba(0, 0, 0, 0.43);
      line-height: inherit;
      cursor: pointer;
      font-weight: 700;
      -webkit-transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
      transition: all 0.3s cubic-bezier(0.645, 0.045, 0.355, 1);
      display: inline-block;
      font-size: 12px;
      font-size: 8px\9;
      -webkit-transform: scale(0.66667) rotate(0deg);
      -ms-transform: scale(0.66667) rotate(0deg);
      transform: scale(0.66667) rotate(0deg);
      -ms-filter: "progid:DXImageTransform.Microsoft.Matrix(sizingMethod='auto expand', M11=1, M12=0, M21=0, M22=1)";
      zoom: 1;
      position: absolute;
      right: 4px;
      padding: 0 0 0 8px; }
      .dh-select-selection--multiple .dh-select-selection__choice__remove:before {
        content: "";
        display: block;
        font-family: dhfont !important; }
  .dh-select-selection--multiple .dh-select-search--inline {
    float: left;
    position: static; }
    .dh-select-selection--multiple .dh-select-search--inline .dh-select--search__field__ {
      width: .75em; }

.dh-select-search--inline .dh-select-search__field__warp {
  width: 100%;
  height: 100%; }

.dh-select-search--inline .dh-select-search__field {
  border: 0;
  font-size: 100%;
  height: 100%;
  width: 100%;
  background: transparent;
  outline: 0;
  border-radius: 4px; }

.dh-select-dropdown {
  background-color: #fff;
  border: 1px solid #d9d9d9;
  box-shadow: 0 1px 4px 0 rgba(31, 56, 88, 0.15);
  border-radius: 3px;
  box-sizing: border-box;
  z-index: 1070;
  left: -9999px;
  top: -9999px;
  position: absolute;
  outline: 0; }
  .dh-select-dropdown-hidden {
    display: none; }
  .dh-select-dropdown-menu {
    outline: none;
    margin-bottom: 0;
    padding-left: 0;
    list-style: none;
    max-height: 250px;
    overflow: auto; }
    .dh-select-dropdown-menu-item {
      position: relative;
      display: block;
      padding: 7px 10px 7px 16px;
      font-weight: 400;
      color: #666666;
      white-space: nowrap;
      cursor: pointer;
      overflow: hidden;
      -webkit-transition: background .3s ease;
      transition: background .3s ease;
      overflow: hidden;
      text-overflow: ellipsis; }
      .dh-select-dropdown-menu-item-disabled {
        color: rgba(0, 0, 0, 0.25);
        cursor: no-drop; }
      .dh-select-dropdown-menu-item-active {
        background-color: #f6f6f6;
        color: #333333; }
      .dh-select-dropdown-menu-item-selected {
        color: #23c132;
        background-color: transparent; }
        .dh-select-dropdown-menu-item-selected:hover {
          background-color: #f6f6f6; }

.dh-modal-mask {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: 1000;
  background-color: rgba(0, 0, 0, 0.4);
  height: 100%; }
  .dh-modal-mask-hidden {
    display: none; }

.dh-modal-wrap {
  position: fixed;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: 1000;
  overflow: auto;
  outline: 0;
  display: flex;
  align-items: center; }

.dh-modal {
  position: relative;
  margin: 0 auto;
  background-color: #ffffff;
  border-radius: 0; }
  .dh-modal-close {
    cursor: pointer;
    border: 0;
    background: transparent;
    position: absolute;
    right: 24px;
    top: 16px;
    z-index: 10;
    text-decoration: none;
    transition: color 0.3s ease;
    outline: 0; }
    .dh-modal-close-x {
      height: 20px;
      width: 20px;
      display: block;
      font-style: normal;
      font-family: dhfont;
      font-size: 14px;
      text-align: right;
      text-transform: none;
      text-rendering: auto;
      line-height: 20px;
      color: #999; }
      .dh-modal-close-x:before {
        content: "\e629";
        display: block; }
  .dh-modal-header {
    padding: 16px 24px; }
  .dh-modal-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 94%;
    height: 20px;
    line-height: 20px;
    color: #666666;
    font-size: 14px;
    font-weight: bold; }
  .dh-modal-body {
    position: relative;
    width: 100%;
    height: auto;
    padding: 13px 24px; }
  .dh-modal-footer {
    padding: 8px 8px 8px 24px;
    font-size: 14px;
    text-align: right; }
    .dh-modal-footer_btn {
      width: 64px;
      height: 36px;
      color: #23C132;
      outline: none;
      white-space: nowrap;
      text-align: center;
      background-image: none;
      cursor: pointer;
      user-select: none;
      border: none;
      background: none; }
      .dh-modal-footer_btn:hover {
        background: #e9f8ea; }
    .dh-modal-footer_btn:not(:last-child) {
      margin-right: 8px; }

.dh-list {
  background-color: #fff;
  border: 1px solid #e6e6e6; }
  .dh-list .dh-list-child {
    cursor: pointer;
    box-sizing: border-box;
    position: relative;
    height: 64px;
    padding-left: 24px;
    line-height: 1; }
    .dh-list .dh-list-child:not(:last-child) {
      border-bottom: 1px solid #e6e6e6; }
    .dh-list .dh-list-child:hover {
      background-color: #f6f6f6; }
    .dh-list .dh-list-child[data-selected="true"] {
      background: #f6f6f6; }
    .dh-list .dh-list-child__inner {
      height: 100%;
      display: flex;
      flex-direction: row;
      justify-content: center;
      align-items: center; }
  .dh-list .dh-list-child__border {
    position: absolute;
    height: 100%;
    width: 2px;
    left: 0;
    top: 0;
    -webkit-transform: scaleY(1);
    -ms-transform: scaleY(1);
    transform: scaleY(1);
    transition: all 0.45s cubic-bezier(0.23, 1, 0.32, 1) 0ms;
    background-color: #23c132; }
  .dh-list-inner__avatar {
    max-height: 32px;
    max-width: 32px;
    overflow: hidden;
    margin-right: 12px; }
  .dh-list-inner__title {
    flex: 1;
    max-height: 64px;
    height: 64px;
    line-height: 64px;
    font-size: 14px;
    overflow: hidden;
    color: #999999; }
    .dh-list-inner__title:hover {
      color: #333333; }
  .dh-list-inner__icon {
    width: 64px;
    height: 100%;
    line-height: 1;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden; }
    .dh-list-inner__icon .dh-list-info {
      cursor: pointer;
      font-size: 20px;
      color: #23c132;
      height: 32px;
      width: 32px;
      text-align: center;
      line-height: 32px; }
      .dh-list-inner__icon .dh-list-info i[type="radio"] {
        color: #cccccc; }

.dh-avatar {
  width: 32px;
  height: 32px;
  font-size: 16px;
  background: #999999;
  box-sizing: border-box;
  cursor: pointer;
  max-width: 100px;
  max-height: 100px;
  color: #fff;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center; }
  .dh-avatar-radius {
    border-radius: 50%; }
  .dh-avatar img {
    width: 100%;
    height: 100%; }

/** *
  颜色值变量
*/
/** *
主题颜色
*/
/** *
  input 变量
*/
.dp, .dh-menu-submenu-inline > .dh-menu-submenu-title:after, .dh-menu-submenu-vertical > .dh-menu-submenu-title:after {
  font-family: dhfont !important;
  font-style: normal;
  vertical-align: baseline;
  text-align: center;
  text-transform: none;
  font-size: 12px;
  text-rendering: auto;
  transition: transform .3s ease;
  position: absolute;
  right: 10px;
  line-height: 36px; }

.dh-menu {
  margin-bottom: 0;
  padding-left: 0;
  list-style: none;
  z-index: 1050;
  color: #666666;
  background: #fff;
  outline: none;
  font-size: 12px;
  line-height: 36px; }
  .dh-menu-item {
    position: relative;
    cursor: pointer;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    line-height: 36px;
    padding: 0 24px; }
    .dh-menu-item-active, .dh-menu-item-selected {
      color: #23c132; }
    .dh-menu-item-selected {
      background-color: rgba(35, 193, 50, 0.1); }
      .dh-menu-item-selected:before {
        content: "";
        position: absolute;
        width: 2px;
        height: 100%;
        top: 0;
        left: 0;
        background: #23c132;
        transform: scaleY(0);
        box-shadow: 0 0 10px 0 rgba(35, 193, 50, 0.5);
        -webkit-animation: keyframesScale 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0s forwards;
        animation: keyframesScale 0.5s cubic-bezier(0.23, 1, 0.32, 1) 0s forwards; }
  .dh-menu-inline {
    z-index: auto; }
  .dh-menu-vertical {
    z-index: auto; }
  .dh-menu-horizontal {
    z-index: 0; }
    .dh-menu-horizontal:after {
      content: "\20";
      display: block;
      height: 0;
      clear: both; }
    .dh-menu-horizontal > .dh-menu-item {
      position: relative;
      float: left; }
  .dh-menu-hidden {
    display: none; }
  .dh-menu-submenu {
    position: relative;
    display: block; }
    .dh-menu-submenu-title {
      position: relative;
      padding: 0 24px;
      font-size: 12px;
      line-height: 36px;
      cursor: pointer;
      overflow: hidden;
      white-space: nowrap;
      text-overflow: ellipsis; }
      .dh-menu-submenu-title:hover {
        position: relative;
        color: #23c132; }
    .dh-menu-submenu-inline > .dh-menu-submenu-title:after {
      content: "\e63e";
      top: 0; }
    .dh-menu-submenu-inline.dh-menu-submenu-open > .dh-menu-submenu-title:after {
      transform: rotate(180deg); }
    .dh-menu-submenu-vertical > .dh-menu-submenu-title:after {
      content: "\e621";
      top: 0; }
    .dh-menu-submenu-vertical > .dh-menu-sub {
      top: 0;
      left: 100%;
      position: absolute;
      min-width: 160px;
      margin-left: 4px;
      z-index: 1050;
      box-shadow: 0 1px 6px rgba(0, 0, 0, 0.2); }
    .dh-menu-submenu-horizontal {
      float: left; }
      .dh-m