/* #greeting
------------------------------------ */
#newslist {
  max-width: calc(1080px + 4rem);
  padding: 0 2rem;
  margin: 0 auto;
}
#newslist section + section {
  margin-top: 6rem;
}
#newslist section {
  border-radius: 10px;
  background: #FFFCDB;
  padding: 3rem 2rem;
}
#newslist .article a {
  text-decoration: underline;
}
#newslist .article hgroup {
  color: #4AA85A;
  display: grid;
  grid-template-columns: max-content 1fr;
  gap: 2rem;
  margin-bottom: 2rem;
  place-content: center;
}
#newslist .article hgroup .date {
  align-self: center;
}
#newslist .article hgroup h3 {
  font-size: clamp(2rem, 1.5vw, 2.2rem);
  font-weight: 500;
  padding-left: 2rem;
  border-left: 2px solid #4AA85A;
  line-height: 1.4;
}
#newslist .article .text p + * {
  margin-top: 2em;
}
#newslist .pager {
  margin-top: 10rem;
  display: flex;
  justify-content: center;
  gap: 1rem;
}
#newslist .pager a, #newslist .pager span {
  display: grid;
  place-content: center;
  place-items: center;
  width: 4rem;
  height: 4rem;
  background: #4AA85A;
  padding: 3px;
  border-radius: 5px;
  color: #FFF;
}
#newslist .pager a:hover, #newslist .pager span:hover {
  background: #468C53;
}
#newslist .pager span {
  background: #EEE331;
  color: #468C53;
}
@media screen and (max-width: 767px) {
  #newslist section + section {
    margin-top: 3rem;
  }
  #newslist .article hgroup {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.5rem;
  }
  #newslist .article hgroup h3 {
    padding: 0 0 2rem 0;
    border-left: none;
    position: relative;
  }
  #newslist .article hgroup h3:after {
    content: "";
    width: 100%;
    height: 3px;
    display: block;
    background: #CCC url(/lib/img/cmn/line_green_01.webp) repeat-x top;
    position: absolute;
    left: 0;
    bottom: 0;
    border-radius: 50vh;
  }
  #newslist .pager {
    margin-top: 5rem;
  }
}