.el-expand {
  display: flex;
}

.el-expand__item--left-side {
  width: 50%;
  position: relative;
    &::after {
       content: ' ';
       width: 1px;
       height: calc(100% - 40px);
       display: block;
       position: absolute;
       background-color: #dedede;
       right: 0;
       top:40px;
    }
}

.el-expand__item--right-side {
  position: relative;
  overflow: hidden;
  flex: 1 0;
}

.el-expand__item--border-left {
  padding-left: 20px;
}

.el-expand__btn {
  position: absolute;
  right: -14px;
  top: 26px;
  transform: translateY(-50%);
  width: 28px;
  height: 28px;
  border-radius: 25px;
  padding: 0;
  cursor: ew-resize;
  z-index: 1;
  &::before {
     content: '';
     width: 1px;
     height: 12px;
     display: block;
     position: absolute;
     background-color: #dedede;
     left: 12px;
     margin-top: -13px;
   }
}

.el-expand__btn i.expand__btn-icon {
  font-size: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}

.el-expand__btn-icon--rotated {
  transform: rotate(180deg);
}
