/*------ news archive ------*/
.ttlSec.ttlSec--news span img {
  right: -18rem;
}
@media screen and (max-width: 768px) {
  .ttlSec.ttlSec--news span img {
    right: -9rem;
    bottom: -5.5rem;
    height: 5.5rem;
  }
}

.newsSec {
  padding: 1rem 0 7rem;
}
@media screen and (max-width: 768px) {
  .newsSec {
    padding: 0 0 5rem;
  }
}
.newsSec__article {
  border-bottom: 1px solid #ddd;
}
.newsSec__article:last-child {
  margin-bottom: 0;
}
.newsSec__article a {
  display: block;
  padding: 1.25rem 0;
  color: #333;
  cursor: pointer;
  transition: ease opacity 0.3s;
}
@media (any-hover: hover) {
  .newsSec__article a:hover {
    opacity: 0.3;
  }
}
.newsSec__article a dl {
  display: flex;
  gap: 3rem;
  letter-spacing: 0.03rem;
}
@media screen and (max-width: 768px) {
  .newsSec__article a dl {
    flex-wrap: wrap;
    gap: 0;
  }
}
@media screen and (max-width: 768px) {
  .newsSec__article a dl dt {
    width: 100%;
  }
}

/*--------- pagenation ----------*/
.pagenation-archive {
  display: flex;
  gap: 1rem;
  justify-content: center;
  margin-top: 5rem;
}
@media screen and (max-width: 768px) {
  .pagenation-archive {
    margin-top: 3rem;
  }
}
.pagenation-archive .page-numbers {
  padding: 0.25rem 1rem;
  font-size: clamp(1.125rem, 1.0588235294rem + 0vw, 1.125rem);
  color: var(--color01);
  border: 1px solid #ddd;
  border-radius: 0.4rem;
  cursor: pointer;
  transition: ease opacity 0.3s;
}
@media (any-hover: hover) {
  .pagenation-archive .page-numbers:hover {
    opacity: 0.3;
  }
}
@media screen and (max-width: 768px) {
  .pagenation-archive .page-numbers {
    border-radius: 0.25rem;
  }
}
.pagenation-archive .current {
  color: #fff;
  background: var(--color01);
  border: 1px solid var(--color01);
}
.pagenation-archive .current:hover {
  opacity: 1;
}