/*
** .c-post-archive
*/

.c-post-archive__list {
  display: grid;
  grid-template-columns: 100%;
  grid-auto-rows: max-content;
}

.c-post-archive__item a {
  display: grid;
  grid-template-columns: 100%;
  grid-auto-rows: max-content;
  grid-row-gap: calc(5 * 100vw / var(--standard-width));
  font-weight: 500;
  border-bottom: 1px solid rgb(150, 150, 150);
  padding-top: calc(30 * 100vw / var(--standard-width));
  padding-bottom: calc(30 * 100vw / var(--standard-width));
}

.c-post-archive__item-date {
  display: block;
  color: var(--d-gray);
  line-height: 1;
}

.c-post-archive__item-title {
  font-size: calc(16 / var(--standard-font-size) * 1em);
  transition: var(--transition);
}

.c-post-archive .pagination {
  font-family: var(--roboto);
  font-size: calc(16 / var(--standard-font-size) * 1em);
  font-weight: 500;
  line-height: 1;
  margin-top: calc(45 * 100vw / var(--standard-width));
}

.c-post-archive .pagination .nav-links {
  position: relative;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(calc(30 * 100vw / var(--standard-width)), max-content));
  grid-auto-rows: calc(30 * 100vw / var(--standard-width));
  grid-gap: calc(13 * 100vw / var(--standard-width));
  justify-content: center;
  color: var(--gray);
  padding-left: calc((13 + 30) * 100vw / var(--standard-width));
  padding-right: calc((13 + 30) * 100vw / var(--standard-width));
}

.c-post-archive .pagination .nav-links:not(:has(.page-numbers.prev))::before {
  content: '\f053';
}

.c-post-archive .pagination .nav-links:not(:has(.page-numbers.next))::after {
  content: '\f054';
}

.c-post-archive .pagination .nav-links .page-numbers,
.c-post-archive .pagination .nav-links::before,
.c-post-archive .pagination .nav-links::after {
  display: block;
  text-align: center;
  align-content: center;
  -ms-flex-line-pack: center;
}

.c-post-archive .pagination .nav-links .page-numbers:not(.current, .prev, .next, .dots) {
  border: 1px solid var(--gray);
  background-color: #fff;
}

.c-post-archive .pagination .nav-links .page-numbers.current {
  color: #fff;
  border: 1px solid var(--main);
  background-color: var(--main);
}

.c-post-archive .pagination .nav-links .page-numbers.prev,
.c-post-archive .pagination .nav-links .page-numbers.next {
  color: var(--main);
}


@media (hover: hover) and (pointer: fine) {

  .c-post-archive__item a:hover .c-post-archive__item-title {
    color: var(--dark);
  }

}