/*----------------------------------------------

  NEWS PAGE CONTENTS

----------------------------------------------*/
.newsPage-contents {
  display: grid;
  gap: min(calc( 50 / var(--screen-width) * 100vw ), 100px);
  /*---------------------------------------
   heading
  ---------------------------------------*/
  /*---------------------------------------
   articles
  ---------------------------------------*/
}
.newsPage-contents__heading {
  display: grid;
  gap: min(calc( 10 / var(--screen-width) * 100vw ), 10px);
  margin-bottom: max(calc( -25 / var(--screen-width) * 100vw ), -50px);
}
.newsPage-contents__heading h1 {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  font-size: min(calc( 35 / var(--screen-width) * 100vw ), 35px);
  line-height: 1.2;
  color: var(--color__primary);
  text-align: center;
  letter-spacing: 0.1em;
}
.newsPage-contents__heading small {
  display: block;
  text-align: center;
  font-size: min(calc( 14 / var(--screen-width) * 100vw ), 14px);
  color: var(--color__primary);
  line-height: 1.5;
}
.newsPage-contents__articles {
  display: grid;
  gap: min(calc( 25 / var(--screen-width) * 100vw ), 50px);
  /* articles
  ----------------------------------*/
  /* article
  ----------------------------------*/
}
.newsPage-contents__articles .articles {
  display: grid;
  gap: min(calc( 15 / var(--screen-width) * 100vw ), 25px);
  font-size: min(calc( 14 / var(--screen-width) * 100vw ), 14px);
  line-height: 1.5;
}
.newsPage-contents__articles article {
  border: 1px solid #707070;
}
.newsPage-contents__articles article a {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  padding: min(calc( 15 / var(--screen-width) * 100vw ), 15px);
  gap: min(calc( 10 / var(--screen-width) * 100vw ), 10px) min(calc( 20 / var(--screen-width) * 100vw ), 35px);
}
@media (min-width: 960px) {
  .newsPage-contents__articles article a {
    flex-wrap: nowrap;
    padding: min(calc( 15 / var(--screen-width) * 100vw ), 15px) min(calc( 40 / var(--screen-width) * 100vw ), 40px);
  }
}
.newsPage-contents__articles article a time {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  flex-shrink: 0;
}
.newsPage-contents__articles article a p {
  font-family: "Roboto", sans-serif;
  font-weight: 900;
  background-color: var(--color__text);
  color: #fff;
  padding: min(calc( 3 / var(--screen-width) * 100vw ), 3px) min(calc( 10 / var(--screen-width) * 100vw ), 15px);
  line-height: 1;
  flex-shrink: 0;
  width: min(calc( 85 / var(--screen-width) * 100vw ), 85px);
  text-align: center;
}
.newsPage-contents__articles article a h3 {
  width: 100%;
  font-size: inherit;
  flex: 1;
}