.page-archive {
  padding-top: 92px;
}
@media only screen and (max-width: 767px) {
  .page-archive {
    padding-top: 0;
  }
}
.page-archive .archive__body {
  padding: 80px 0;
}
@media only screen and (max-width: 767px) {
  .page-archive .archive__body {
    padding: 64px 0;
  }
}
.page-archive .archive__categories {
  padding: 9px 40px 9px 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 28px;
}
@media only screen and (max-width: 767px) {
  .page-archive .archive__categories {
    gap: 12px;
    padding: 0;
  }
}
.page-archive .archive__category a {
  display: block;
  background: -webkit-gradient(
    linear,
    left top,
    right top,
    from(rgba(98, 219, 167, 0.5)),
    to(rgba(164, 198, 84, 0.5))
  );
  background: -webkit-linear-gradient(
    left,
    rgba(98, 219, 167, 0.5) 0%,
    rgba(164, 198, 84, 0.5) 100%
  );
  background: linear-gradient(90deg, #62dba780, #a4c65480);
  background-size: 100% 100%, 0 100%;
  font-size: 1.2rem;
  font-weight: 700;
  padding: 4px 24px;
  border-radius: 99px;
  color: #fff;
}
.page-archive .archive__category:hover a,
.page-archive .archive__category.is-active a {
  background: -webkit-gradient(
    linear,
    left top,
    right top,
    from(#62dba7),
    to(#a4c654)
  );
  background: -webkit-linear-gradient(left, #62dba7 0%, #a4c654 100%);
  background: linear-gradient(90deg, #62dba7, #a4c654);
}
.page-archive .archive__list {
  padding: 40px 0 45px;
  display: grid;
  gap: 42px;
}
@media only screen and (max-width: 767px) {
  .page-archive .archive__list {
    padding: 32px 0;
    gap: 24px;
  }
}
.page-archive .archive-item {
  background-color: #fefaf7;
}
.page-archive .archive-item__link {
  display: block;
  padding: 32px 40px;
}
@media only screen and (max-width: 767px) {
  .page-archive .archive-item__link {
    padding: 16px;
  }
}
.page-archive .archive-item__info {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 40px;
}
@media only screen and (max-width: 767px) {
  .page-archive .archive-item__info {
    gap: 24px;
  }
}
.page-archive .archive-item__date {
  font-size: 1.2rem;
  font-weight: 700;
  color: #645d5c;
}
.page-archive .archive-item__categories {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  gap: 8px;
}
.page-archive .archive-item__category {
  background: -webkit-gradient(
    linear,
    left top,
    right top,
    from(#62dba7),
    to(#a4c654)
  );
  background: -webkit-linear-gradient(left, #62dba7 0%, #a4c654 100%);
  background: linear-gradient(90deg, #62dba7, #a4c654);
  font-size: 1rem;
  font-weight: 700;
  padding: 1px 8px;
  border-radius: 99px;
  color: #fff;
}
.page-archive .archive-item__title {
  margin-top: 16px;
  font-size: 2rem;
  font-weight: 700;
  color: #222222b2;
  transition: .3s;
}
.page-archive .archive-item__link:hover .archive-item__title {
  color:#f28431;
}
@media only screen and (max-width: 767px) {
  .page-archive .archive-item__title {
    font-size: 1.6rem;
    margin-top: 4px;
  }
}
.page-archive .archive-item__text {
  margin-top: 16px;
  font-size: 1.4rem;
  font-weight: 700;
  color: #888;
}
@media screen and (max-width:767px){
  .page-archive .archive-item__text {
    margin-top: 6px;
    font-size: 1.2rem;
  }
}
.page-archive .archive-pagination {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: 0 24px;
  width: -webkit-fit-content;
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.page-archive .archive-pagination ul {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 0 24px;
}
.page-archive .archive-pagination ul .prev,
.page-archive .archive-pagination ul .next {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 32px;
  height: 32px;
  background-color: #f28431;
  border-radius: 99px;
  -ms-flex-negative: 0;
  flex-shrink: 0;
}
@media only screen and (max-width: 767px) {
  .page-archive .archive-pagination ul .prev,
  .page-archive .archive-pagination ul .next {
    width: 28px;
    height: 28px;
  }
}
.page-archive .archive-pagination ul .prev img,
.page-archive .archive-pagination ul .next img {
  -webkit-transition: 0.3s;
  transition: 0.3s;
}
.page-archive .archive-pagination ul .prev:hover img,
.page-archive .archive-pagination ul .next:hover img {
  -webkit-transform: translateX(-2px);
  transform: translate(-2px);
}
.page-archive .archive-pagination ul .next:hover img {
  -webkit-transform: translateX(2px);
  transform: translate(2px);
}
.page-archive .archive-pagination ul li {
  line-height: 1;
}
.page-archive .archive-pagination ul li span,
.page-archive .archive-pagination ul li a {
  display: block;
  font-size: 1.4rem;
  font-weight: 700;
  color: #888;
}
.page-archive .archive-pagination ul li span:hover,
.page-archive .archive-pagination ul li a:hover,
.page-archive .archive-pagination ul li span.current,
.page-archive .archive-pagination ul li a.current {
  color: #f28431;
}
.archive-pagination__item {
  display: block;
}
.archive-pagination__item a {
  font-size: 1.4rem;
  font-weight: 700;
  color: #888;
}
.archive-pagination__item:hover a,
.archive-pagination__item.is-active a {
  color: #f28431;
}
