.page_banner .head {
  padding-top: 11rem;
}
.search .products_main{
  padding-top: 2rem;
}
.products_main {
  padding: 15.5rem 0 16.3rem;
}
.products_main h2 {
  max-width: 62.6rem;
}
.products_main .nav {
  margin-top: 4.3rem;
}
.products_main .nav .nav_item {
  padding-inline: 2.9rem;
}
.products_main .list {
  margin-top: 8.5rem;
}
.products_main .list ul {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(min(35rem, 100%), 1fr));
  gap: 5.3rem 2.80438636%;
}
.products_main p.center:has(.btn_line) {
  margin-top: 5.4rem;
  min-height: 5.9rem;
}
.products_intro {
  border: 1px solid var(--border);
  background-color: var(--bg);
  border-bottom: none;
  padding: 16.5rem 0 16.4rem;
}
.products_intro .head {
  flex: 1;
  width: 100%;
  max-width: 58.3rem;
  padding-bottom: 0.4%;
}
.products_intro .head ul {
  font-weight: 500;
  color: #1a2b3d;
  margin-top: 2.9rem;
}
.products_intro .head ul li + li {
  margin-top: 1.15625em;
}
.products_intro .head ul li {
  position: relative;
  padding-left: 2.1875em;
}
.products_intro .head ul li::before {
  position: absolute;
  width: 1.0625em;
  height: 1.0625em;
  left: 0;
  top: 0.125em;
  content: '';
  background: url("../img/gou-b.svg") no-repeat center / contain;
}
.products_intro p {
  max-width: 58rem;
  margin-top: 2.4rem;
}
.products_intro .btn {
  margin-top: 4.8rem;
}
.products_intro .image_wrap {
  width: 49.01515152%;
}
@media screen and (max-width: 768px) {
  .products_main {
    padding: 50px 0;
  }
  .products_main .nav {
    margin-top: 20px;
  }
  .products_main .nav .nav_item {
    padding-inline: 20px;
  }
  .products_main .list {
    margin-top: 30px;
  }
  .products_main .list ul {
    grid-template-columns: repeat(auto-fill, minmax(min(240px, 100%), 1fr));
    gap: 30px 16px;
  }
  .products_main p.center:has(.btn_line) {
    margin-top: 40px;
    min-height: 41px;
  }
  .products_intro {
    padding: 50px 0;
  }
  .products_intro .head {
    padding: 0;
  }
  .products_intro .head ul {
    margin-top: 12px;
  }
  .products_intro .head ul li + li {
    margin-top: 10px;
  }
}
@media screen and (max-width: 576px) {
  .products_intro .image_wrap {
    width: 100%;
    order: -1;
  }
}
