.mymoods-top-information {
  margin-bottom: 80px;

  @media (max-width: 768px) {
    width: 100vw;
    padding-inline: 0;
    margin-bottom: 40px;
  }
}

.mymoods-top-information-container {
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: black;
  padding: 0 28px;
  gap: 40px;
  height: 50px;
  border-bottom-left-radius: 10px;
  border-bottom-right-radius: 10px;

  @media (max-width: 768px) {
    flex-direction: column;
    height: 60px;
    gap: 0;
    padding: 0 20px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
  }

  .mymoods-top-information__title {
    color: white;
    font-family: var(--mymoods-font-poppins), sans-serif;
    font-weight: var(--mymoods-font-weight-bold);
    font-size: 16px;

    @media (max-width: 768px) {
      width: 100%;
      color: #666666;
      font-size: 12px;
      line-height: 1;
    }
  }

  .mymoods-top-information-navigation {
    display: flex;
    gap: 10px;
    align-items: center;

    @media (max-width: 768px) {
      display: none;
    }

    .information-swiper-button {
      border: none;
      background-color: transparent;
      width: 30px;
      height: 30px;
      display: flex;
      justify-content: center;
      align-items: center;
      cursor: pointer;
    }
  }

  .mymoods-top-information-swiper {
    flex: 1;

    @media (max-width: 768px) {
      width: 100%;
      flex: unset;
    }

    .swiper-wrapper {

      .mymoods-top-information__banner-text {
        color: white;
        font-size: 14px;
        overflow-x: hidden;

        @media (max-width: 768px) {
          font-size: 12px;
        }

        a {
          color: white;
          text-decoration: underline;
        }
      }
    }
  }
}