@charset "utf-8";
html {
  scroll-padding-top: calc((var(--headerHeight))); 
}

.products {
  margin-top: 40px;
  margin-bottom: clamp(5rem, 1.667rem + 6.94vw, 10rem);
}
.products__inner {
  padding: 0 clamp(1.25rem, -5.917rem + 14.93vw, 12rem);
}
.products__container {
      display: flex;
    column-gap: clamp(1.25rem, -1.25rem + 5.21vw, 5rem);
}
.products__left {
      width: 14%;
    min-width: 160px;
}
.products__items {
      display: flex;
    flex-direction: column;
    row-gap: 16px;
      position: sticky;
    top: 140px;
}
.products-item__top {
      display: flex;
    column-gap: clamp(0.5rem, 0.167rem + 0.69vw, 1rem);
    align-items: center;
}
.products-item__line {
      border-left: clamp(0.5rem, 0.208rem + 0.61vw, 0.938rem) solid #7DBD69;
    height: clamp(1.75rem, 1.458rem + 0.61vw, 2.188rem);
}
.products__item--header {
      font-size: clamp(1rem, 0.833rem + 0.35vw, 1.25rem);
    font-weight: 700;
}
.products__item {
  font-size: clamp(0.75rem, 0.111rem + 0.74vw, 1rem);
}
.products__right {
  width: 86%;
}
.products-right__top {
      padding: 20px clamp(0.625rem, -9.208rem + 20.49vw, 15.375rem);
    background-color: #FAFAFA;
}
.products-right-top__header {
      font-size: 14px;
    text-align: center;
    padding-bottom: 20px;
}
.goods {
      padding: clamp(2.5rem, 1.5rem + 2.08vw, 4rem) 0;
    background-color: #FAFAFA;
    margin-bottom: clamp(5rem, 3.333rem + 3.47vw, 7.5rem);
}
.goods__inner {
  padding: 0 clamp(1.25rem, -9.917rem + 23.26vw, 18rem);
}
.goods__content {
  margin-top: clamp(2rem, 0.667rem + 2.78vw, 4rem);
}
.goods__items {
      display: grid;
    grid-template-columns: repeat(4, 1fr);
        column-gap: 12px;
    row-gap: 22px;
}
.goods__title {
      height: clamp(1.375rem, 0.708rem + 1.39vw, 2.375rem);
    background-color: #7DBD69;
    display: flex;
    justify-content: center;
    align-items: center;
}
.goods-title__text {
    font-size: clamp(0.625rem, 0.375rem + 0.52vw, 1rem);
    font-weight: 700;
    color: #fff;
}
.goods__bottom {
      margin-top: 40px;
    display: flex;
    justify-content: center;
}

.products-right__bottom {
  margin-top: 80px;
}
.product__items {
  margin-top: 40px;
      display: flex;
    flex-direction: column;
    row-gap: 80px;
}
.product__item {
      display: flex;
    flex-direction: column;
    row-gap: clamp(1.875rem, 1.458rem + 0.87vw, 2.5rem);
}
.product__content {
      padding: clamp(1.25rem, 0.417rem + 1.74vw, 2.5rem) clamp(1.25rem, 0.75rem + 1.04vw, 2rem);
    background-color: #FAFAFA;
}
.prodct-content__header {
      display: flex;
    column-gap: 20px;
}
.product-content-header__1 {
      font-size: clamp(0.875rem, 0.708rem + 0.35vw, 1.125rem);
    font-weight: 700;
}
.product-content-header__2 {
      font-size: 14px;
    background-color: #6CF440;
    padding: 3px 20px;
}
.product-content__box {
      margin-top: clamp(1rem, 0.833rem + 0.35vw, 1.25rem);
    display: flex;
    column-gap: 24px;
}
.product-content__left {
      width: 30%;
    aspect-ratio: 1/1;
    height: 100%;
    object-fit: cover;
}
.product-content__right {
      width: 70%;
    display: flex;
    flex-direction: column;
    row-gap: 20px;
}
.product-content-right__green {
      font-size: clamp(0.875rem, 0.708rem + 0.35vw, 1.125rem);
    font-weight: 700;
    color: #7DBD69;
}
.product-content-right__1 {
          display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: clamp(1rem, -0.208rem + 2.52vw, 2.813rem);
}
.product-content-right-subtitle {
  white-space: nowrap;
  font-weight: 700;
}
.product-content-right-1__text {
    padding: 14px clamp(0.625rem, -0.089rem + 1.12vw, 1.25rem);
    background-color: #fff;
    font-size: clamp(0.875rem, 0.446rem + 0.67vw, 1.25rem);
    font-weight: 700;
    margin-top: 8px;
}
.product-content-right-2__items {
      margin-top: 8px;
        display: grid;
    grid-template-columns: repeat(2, 1fr);
    column-gap: clamp(1rem, -0.208rem + 2.52vw, 2.813rem);
}
.product-content-right-2__item {
  font-size: clamp(0.75rem, 0.464rem + 0.45vw, 1rem);
  font-weight: 400;
}
.product-btn__wrap {
      display: flex;
    column-gap: 24px;
}
.product-btn__green {
      font-size: clamp(1rem, 0.714rem + 0.45vw, 1.25rem);
    font-weight: 700;
    background-color: #7DBD69;
    padding: clamp(0.5rem, -0.071rem + 0.89vw, 1rem) clamp(1rem, -0.143rem + 1.79vw, 2rem);
    border: 1px solid #000;
}
.product-btn__black {
      font-size: clamp(1rem, 0.714rem + 0.45vw, 1.25rem);
    font-weight: 700;
    background-color: #000;
    padding: clamp(0.5rem, -0.071rem + 0.89vw, 1rem) clamp(1rem, -0.143rem + 1.79vw, 2rem);
    color: #fff;
    border: 1px solid #000;
}
.product-content-header__2.bg-orange260410{
  background-color:#f37128;
}

@media (max-width: 1023px) {
  .product-content__box {
        flex-direction: column;
    row-gap: 14px;
  }
  .product-content__left {
    width: 311px;
  }
  .product-content__right {
    width: 100%;
  }
}

@media (max-width: 767px) {
  .products__inner {
    padding: 0;
  }
  .products__left {
    display: none;
  }
  .products__right {
    width: 100%;
  }
  .products-right__top {
    padding: 20px clamp(1.25rem, -2.629rem + 15.92vw, 5rem);
  }
  .goods__items {
    grid-template-columns: repeat(2, 1fr);
    column-gap: 32px;
  }
  .goods-title__text {
    font-size: clamp(0.75rem, 0.621rem + 0.53vw, 0.875rem);
  }
  .products-right__bottom {
    padding: 20px;
  }
  .prodct-content__header {
        flex-direction: column;
    row-gap: 16px;
  }
  .product-content-header__2 {
    width: fit-content;
  }
  .product-content-right__1 {
    grid-template-columns: repeat(1, 1fr);
    row-gap: 16px;
  }
  .product-content-right-1__text {
    width: fit-content;
    font-size: 18px;
  }
  .product-content-right-2__items {
    grid-template-columns: repeat(1, 1fr);
  }
  .product-content-right-2__item {
    font-size: 14px;
  }
  .product-btn__wrap {
        flex-direction: column;
    row-gap: 16px;
    align-items: center;
  }
  .product-btn__green,
  .product-btn__black {
        width: 216px;
    text-align: center;
  }
}

@media (max-width: 389px) {
  .goods-title__text {
    font-size: 10px;
  }
  .product__content {
        padding-left: 10px;
    padding-right: 10px;
  }
  .product-content-right-1__text {
    font-size: 16px;
  }
  .product-content-right-2__item {
    font-size: 12px;
  }
}