.sidebar {
  display: flex;
  flex-direction: column;
  justify-content: left;
  align-items: center;
  .logo {
    display: flex;
    //overflow: hidden;
    position: relative;
    cursor: pointer;
    width: 35px;
    margin: 0 auto;
    //&:hover {
    //  width: auto;
    //}
    h3 {
      font-size: 26px;
    }
    .logo-big-letter {
      transform: translateX(-15px);
    }
    .logo-ordinary-letter-left {
      transform: translateX(-90px);
      opacity: 0;
    }
    .logo-ordinary-letter-top {
      transform: translateY(-25px);
      opacity: 0;
    }
  }
  .df {
    display: flex;
    align-items: center;
  }
  .line {
    background: #fff;
    width: 2px;
    height: 188px;
    margin: 44px auto;
  }
  .line-hidden {
    background: transparent;
  }
  &-media {
    display: flex;
    flex-direction: column;
    gap: 35px;
    .media {
      cursor: pointer;
      width: 40px;
      height: 40px;
      user-select: none;
      -drag: none;
      -moz-user-select: none;
      -webkit-user-drag: none;
      -webkit-user-select: none;
      fill-rule:evenodd;clip-rule:evenodd;stroke-linejoin:round;stroke-miterlimit:1.41421;
    }
  }
}