.white_share_header {
  width: 100%;
  height: 86px;
  position: relative;
  background-repeat: no-repeat;
  background-size: 100% 100%;

  .title {
    position: absolute;
    left: 50.5%;
    transform: translateX(-50%);
    top: 25px;
  }

  .left {
    position: absolute;
    top: 30px;
    left: 10px;
    display: flex;

    .back {
      cursor: pointer;

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

    .list {
      padding: 6px 15px;
      border-radius: 23px;
      background-image: linear-gradient(180deg, rgb(217, 239, 253) 0%, rgb(225, 243, 254) 58%, rgb(232, 246, 255) 100%);
      box-shadow: inset 0 1px 3px 0 rgba(49, 122, 202, 0.75);
      margin-right: 10px;
      color: #465683;
      opacity: 0.8;
    }
  }

  .right {
    position: absolute;
    right: 20px;
    top: 25px;
    border-radius: 23px;
    background-image: linear-gradient(180deg, rgb(217, 239, 253) 0%, rgb(225, 243, 254) 58%, rgb(232, 246, 255) 100%);
    box-shadow: inset 0 1px 3px 0 rgba(49, 122, 202, 0.75);
    padding: 6px 15px;
    color: #465683;


    .top {
      display: flex;
      justify-content: space-between;
      position: relative;

      .name {
        margin-right: 20px;
        font-weight: bold;
      }

      .more {
        cursor: pointer;
      }

      .down_main {
        width: 150px;
        position: absolute;
        top: 30px;
        left: 0;
        background: #ddf1fe;
        border: 1px solid #b8dcf3;
        border-radius: 4px;
        opacity: 0;

        .list {
          font-weight: bold;
          border-bottom: 1px solid #d4e3f7;
          line-height: 36px;
          padding: 0 10px;
          text-align: center;
          font-size: 12px;
          cursor: pointer;

          &:hover {
            background: #def1ff;
          }
        }
      }

      &:hover {
        .down_main {
          opacity: 1;
        }
      }
    }
    }
}
