@charset "utf-8";
.news {
  padding-top: 80px;
  padding-bottom: clamp(5rem, 1.667rem + 6.94vw, 10rem);
}
.news__inner {
  padding: 0 clamp(1.25rem, -12.458rem + 28.56vw, 21.813rem);
}
.news__cate {
      display: flex;
    column-gap: clamp(1.25rem, 0.417rem + 1.74vw, 2.5rem);
    align-items: center;
}
.news-cate__btn {
      padding: 10px clamp(1rem, 0.333rem + 1.39vw, 2rem);
    border: 2px solid #2F2020;
    font-size: clamp(0.875rem, 0.75rem + 0.26vw, 1.063rem);
    font-weight: 600;
    transition: all 0.5s;
}
.news-cate__btn:hover {
  opacity: 0.5;
}
.news__cate section {
      display: flex;
    column-gap: clamp(1.25rem, 0.417rem + 1.74vw, 2.5rem);
    align-items: center;
}
.news__cate section article a {
  display: inline-block;
      padding: 10px clamp(1rem, 0.333rem + 1.39vw, 2rem);
    border: 2px solid #2F2020;
    font-size: clamp(0.875rem, 0.75rem + 0.26vw, 1.063rem);
    font-weight: 600;
    transition: all 0.5s;
}
.news__cate section article a:hover {
  opacity: 0.5;
}
.news__block {
  margin-top: 80px;
}
.news__block section {
      display: flex;
    flex-direction: column;
    row-gap: clamp(2.5rem, 0.833rem + 3.47vw, 5rem);
}
.newsItem {
      padding-bottom: 20px;
    border-bottom: 1px solid #2F2020;
  padding-right: clamp(2.5rem, -1.292rem + 7.9vw, 8.188rem);
  position: relative;
  transition: all 0.5s;
}
.newsItem::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 79px;
  height: 6px;
  background-color: #2F2020;
}
.newsItemBottom {
      display: flex;
    align-items: flex-start;
    column-gap: 20px;
}
.newsItemText {
      display: flex;
    align-items: center;
    column-gap: clamp(0.625rem, 0.208rem + 0.87vw, 1.25rem);
  width: 25%;
}
.newsItemTime {
  font-weight: 600;
}
.newsItemCate {
      font-size: clamp(0.75rem, 0.667rem + 0.17vw, 0.875rem);
  font-weight: 600;
    padding: 2px clamp(0.625rem, 0.208rem + 0.87vw, 1.25rem);
    border: 1px solid #FF7745;
    color: #FF7745;
}
.newsTitleBox {
  width: 75%;
}
.newsItemTit {
      font-size: clamp(1rem, 0.917rem + 0.17vw, 1.125rem);
    font-weight: 600;
    line-height: 1.4;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.newsItemTitCircle {
      width: clamp(0.625rem, 0.417rem + 0.43vw, 0.938rem);
    height: clamp(0.625rem, 0.417rem + 0.43vw, 0.938rem);
    border: 0;
    border-top: solid 3px #2F2020;
    border-right: solid 3px #2F2020;
    min-width: 10px;
    position: absolute;
    top: 50%;
    right: clamp(0.625rem, 0.417rem + 0.43vw, 0.938rem);
    transform: rotate(45deg) translateY(-50%);
    transition: all 0.5s;
}

.newsItem:hover {
  opacity: 0.5;
}

.webgene-pagination {
  width: 100%;
  margin-top: 80px;
}
.webgene-pagination>ul {
        display: flex;
    align-items: center;
    padding: 0;
    flex-wrap: wrap;
    row-gap: 16px;
    column-gap: 20px;
}
.webgene-pagination>ul>li {
        width: 42px;
    height: 46px;
    display: flex;
    justify-content: center;
    align-items: center;
    list-style: none;
  transition: all 0.5s;
}
.number>a {
  border: 2px solid #2F2020;
    font-size: clamp(0.875rem, 0.75rem + 0.26vw, 1.063rem);
    font-weight: 600;
    color: #2F2020;
      width: 42px;
    height: 46px;
      display: flex;
    justify-content: center;
    align-items: center;
    transition: all 0.5s;
}
.number > a:hover {
  color: #fff;
  background-color: #2F2020;
}
.next > a {
  border: 2px solid #2F2020;
    font-size: clamp(0.875rem, 0.75rem + 0.26vw, 1.063rem);
    font-weight: 600;
      width: 42px;
    height: 46px;
      display: flex;
    justify-content: center;
    align-items: center;
      color: #fff;
    background-color: #2F2020;
  transition: all 0.5s;
}
.next > a:hover {
    opacity: 0.5;
}
.prev > a {
    border: 2px solid #2F2020;
    font-size: clamp(0.875rem, 0.75rem + 0.26vw, 1.063rem);
    font-weight: 600;
      width: 42px;
    height: 46px;
      display: flex;
    justify-content: center;
    align-items: center;
      color: #fff;
    background-color: #2F2020;
  transition: all 0.5s;
}
.prev > a:hover {
    opacity: 0.5;
}

@media (max-width: 767px) {
  .news {
    padding-top: 40px;
  }
  .newsItemBottom {
        flex-direction: column;
    row-gap: 15px;
  }
  .newsItemText,
  .newsTitleBox {
    width: 100%;
  }
  .newsItemTime  {
    font-size: 16px;
  }
  .newsItemCate {
    font-size: 14px;
  }
  .newsItemTit {
    font-size: 14px;
  }
  .webgene-pagination {
    margin-top: 16px;
  }
  .webgene-pagination>ul {
    justify-content: center;
  }
}