.astra-news {
  padding-top: 240px;
  position: relative;
  z-index: 1;

  @media screen and (max-width: 768px) {
    padding-top: 70px;
  }

  .section-container {

    .astra-news-inner {
      display: flex;
      align-items: flex-start;
      margin-bottom: 200px;

      @media screen and (max-width: 768px) {
        flex-wrap: wrap;
        gap: 24px;
        margin-bottom: 90px;
      }

      .left {
        width: 414px;

        .left__more-button {
          margin-top: 68px;

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

          .more-button {
            width: 214px;
            height: 56px;
            border: 2px solid #4EC3E1;
            border-radius: 60px;
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 40px;
            color: #4EC3E1;
            text-decoration: none;
            background-color: transparent;
            font-family: var(--astra-source-code-pro), monospace;
            font-size: 24px;
            font-weight: var(--astra-font-weight-regular);
            cursor: pointer;

            @media screen and (max-width: 768px) {
              width: 75px;
              height: 36px;
              font-size: 14px;
              font-weight: var(--astra-font-weight-light);
            }

            .more-button__arrow {
              width: 48px;
              display: block;

              svg {
                width: 100%;
                display: block;
              }
            }
          }
        }
      }

      .right {
        flex: 1;

        .news-list {
          list-style: none;
          padding: 0;
          margin: 0;
          display: flex;
          flex-direction: column;
          gap: 48px;

          .news-list__item {
            display: flex;
            align-items: center;
            gap: 80px;

            @media screen and (max-width: 768px) {
              flex-wrap: wrap;
              gap: 0;
            }

            .news-list__item--date {
              width: 90px;
              color: var(--astra-gray);
              font-size: 16px;
              font-family: var(--astra-source-code-pro), monospace;

              @media screen and (max-width: 768px) {
                width: 100%;
                text-align: left;
              }
            }

            .news-list__item--title {
              flex: 1;
              font-size: 18px;
              font-family: var(--astra-notosansjp), sans-serif;
              color: white;
              margin: 0;
              text-align: left;
            }
          }
        }
      }
    }

    .sp-more-button {
      display: none;

      @media screen and (max-width: 768px) {
        display: block;
      }

      .more-button {
        width: 214px;
        height: 56px;
        margin-inline: auto;
        margin-bottom: 90px;
        border: 2px solid #4EC3E1;
        border-radius: 60px;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 40px;
        color: #4EC3E1;
        text-decoration: none;
        background-color: transparent;
        font-family: var(--astra-source-code-pro), monospace;
        font-size: 24px;
        font-weight: var(--astra-font-weight-regular);
        cursor: pointer;
      }

    }
  }
}