.department {
  .ant-card-body {
    height: 100%;
  }

  .department-warp {
    display: flex;
    height: 100%;

    .department-left {
      display: flex;
      width: 300px;
      height: 100%;

      .border-left {
        padding-right: 24px;
      }

      .left-tree-content {
        position: relative;
        display: flex;
        flex-direction: column;
        width: 100%;

        .left-tree-loading {
          position: absolute;
          top: 0;
          left: 0;
          z-index: 2;
          display: flex;
          align-items: center;
          justify-content: center;
          width: 100%;
          height: 100%;
          font-size: 30px;
          background-color: rgba(#fff, 0.1);
        }
      }

      .left-tree-body {
        flex: 1 1 auto;
        overflow-y: auto;

        .tree-node-name {
          display: flex;

          .tree-node-name--title {
            display: flex;
            flex-grow: 1;
            width: 0;
          }

          .tree-node-name--btn {
            width: 80px;
            opacity: 0;
            transition: opacity 0.3s;

            &.show-btn {
              opacity: 1;
            }
          }
        }
      }
    }

    .department-right {
      display: flex;
      flex-grow: 1;
      width: 0;
      padding-left: 24px;
      border-left: 1px solid #f0f0f0;
    }
  }
}
