.map_content_right_utils_container {

  .tooltip() {
    transition: 0.5s;
    opacity: 0;
    width: 100px;
    height: 40px;
    background-size: 100% 100%;
    background-repeat: no-repeat;
    color: #fff;
    font-size: 12px;
    text-align: center;
    line-height: 36px;
    position: absolute;
    right: 20px;
    top: 20px;
  }

  .right_utils.port {
    width: 80px;
    position: absolute;
    top: 170px;
    right: 0;
    display: flex;
    flex-direction: column;
    align-items: end;

    .option {
      cursor: pointer;
      position: relative;

      &:hover {
        animation: slideX 0.5s;

        .tooltip {
          opacity: 1;
          right: 80px;
        }
      }

      .tooltip {
        .tooltip();
      }

      img {
        width: 80px;
        height: 72px;
      }
    }
  }

  .right_utils.branch_office {
    width: 103px;
    position: absolute;
    bottom: 29px;
    right: 36px;

    .bg {
      cursor: pointer;
      transition: all 0.5s;
      transform: rotate(180deg);

      &.active {
        transform: rotate(0deg);
      }

      // 子菜单动画执行期间禁止重复点击，确保按钮方向与菜单展开状态始终一致。
      &.disabled {
        pointer-events: none;
        cursor: not-allowed;
      }

      img {
        width: 101px;
        height: 100px;
      }
    }

    .options {
      width: 68px;
      background-color: rgba(24, 44, 91, 0.74);
      margin: 0 auto 10px;
      text-align: center;
      border: 1px solid rgba(0, 126, 255, 0.58);
      border-radius: 50px 50px 0 0;
      transform-origin: bottom center;

      .option {
        padding: 15px 0;
        cursor: pointer;
        border: 1px solid transparent;
        position: relative;

        &:first-child {
          border-radius: 50px 50px 0 0;
        }

        &.active {
          border: 1px solid rgb(46, 79, 130);
          background-color: rgba(40, 84, 155, 0.459);
        }

        &:hover {
          .tooltip {
            opacity: 1;
            right: 80px;
          }
        }

        img {
          width: 35px;
          height: 35px;
        }

        .tooltip {
          .tooltip();
        }
      }
    }
  }
}
