$nutSidenavbarItemHeight: 40px;
.nut-sidenavbar {
  color: #1d1d21;
  font-size: 14px;
  height: 100%;
  overflow: auto;
  display: block;
  background-color: #fff;
  .arrow-icon {
    position: absolute;
    width: 0;
    height: 0;
    right: 16px;
    top: 18px;
    cursor: pointer;
  }
  .arrow-down {
    border-top: 4px solid #909ca4;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
  }
  .arrow-up {
    border-bottom: 4px solid #909ca4;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
  }
  &__head {
    height: $nutSidenavbarItemHeight;
    background: #eeeff2;
    padding: 10px;
  }
  &__title {
    height: $nutSidenavbarItemHeight;
    padding: 10px 8px 10px 20px;
    background: #f5f5f5;
  }
  &__content {
    position: relative;
    display: block;
  }
  &__list {
    &.nutShow {
      .nut-sidenavbar__content {
        height: auto;
        overflow: inherit;
      }
    }
    &.nutHide {
      .nut-sidenavbar__content {
        height: 0;
        overflow: hidden;
      }
    }
  }

  .border-bt {
    position: relative;
    &:after {
      content: '';
      position: absolute;
      width: 100%;
      height: 1px;
      background: #eeeff2;
      transform: scale(1, 0.5);
      left: 0;
      bottom: 0;
    }
  }
}