.fv {
  .category {
    display: grid;
    place-content: center;
    min-width: 16rem;
    width: max-content;
    height: 4rem;
    border-radius: 4rem;
    background-color: var(--cosmos-blue);
    font-size: max(10px, 1.5rem);
    font-weight: 500;
    color: #fff;
    margin-top: 1.6rem;
    padding: 2rem;
  }
}

/* ↓↓↓ news ↓↓↓ */
.-preview {
  position: fixed;
  width: max-content;
  background-color: red;
  color: #fff;
  font-size: max(10px, 1.5rem);
  font-weight: 700;
  top: 12rem;
  left: 0;
  z-index: 10;
}

.news {
  padding: 12rem 2rem;

  article {
    position: relative;
    max-width: 86.4rem;
    margin: 0 auto;
    font-size: max(10px, 1.5rem);
    text-align: justify;

    h1 {
      font-size: 3.8rem;
    }

    h2 {
      font-size: 3rem;
    }

    h3 {
      font-size: 2.8rem;
    }

    h4 {
      font-size: 2.5rem;
    }

    h5 {
      font-size: 2rem;
    }

    h6 {
      font-size: 1.8rem;
    }

    p, div {
      text-align: justify;
      word-break: break-all;
      font-size: max(10px, 1.5rem);
      line-height: 2;
      letter-spacing: 0.08em;
    }

    a {
      color: var(--cosmos-blue);
      text-decoration: underline;
      word-break: break-all;
    }

    @media screen and (min-width: 769px) {
      a:hover {
        text-decoration: none;
      }
    }

    figure, img {
      max-width: 100%;
      width: auto;
      margin: 5rem auto;
    }
  }

  strong {
    font-weight: 700;
  }

  em {
    font-style: italic;
  }

  blockquote {
    border-left: 0.5em solid var(--cosmos-blue);
    padding-left: 0.5em;
    line-height: 2;
  }

  ul {
    li {
      position: relative;

      &::before {
        content: '・';
      }
    }
  }

  ol {
    padding-left: 1.5em;

    li {
      list-style: decimal;
    }
  }

  hr {
    margin: 5rem auto;
  }

  .back_btn {
    position: relative;
    display: grid;
    place-content: center;
    width: 33.6rem;
    height: 6.4rem;
    font-size: max(10px, 1.3rem);
    font-weight: 500;
    border-radius: 6.4rem;
    margin: 8rem auto 0;
    color: var(--cosmos-blue);
    border: 1px solid #D0DEE5;
    background-color: #fff;

    &::before {
      content: '';
      position: absolute;
      translate: 0 -50%;
      top: 50%;
      left: 2rem;
      width: 2.4rem;
      height: 2.4rem;
      border-radius: 50%;
      background-color: #E7F4FA;
    }

    &::after {
      content: '';
      position: absolute;
      translate: 0 -50%;
      rotate: 180deg;
      top: 50%;
      left: 2.8rem;
      width: 0.6rem;
      height: 1rem;
      mask-image: url(/wp/wp-content/themes/cosmos-cpo/img/common/more_arrow.svg);
      mask-size: contain;
      mask-repeat: no-repeat;
      background-color: var(--cosmos-blue);
      transition: background-color 0.3s ease;
    }
  }
}

@media screen and (max-width: 768px) {
  .news {
    padding: 7.4rem 2rem 8rem;

    article {

      figure {
        margin: 4.8rem auto;
      }
    }

    .back_btn {
      max-width: 33.5rem;
      width: 100%;
      height: 6.4rem;
      font-size: 1.5rem;
      border-radius: 6.4rem;
      margin: 6.4rem auto 0;
    }
  }
}

/* ↑↑↑ news ↑↑↑ */