@media only screen and (min-width: 768px) {
  .pro-list {
    --gap: 0.2rem;
    --item-margin-bottom: 0.2rem;
  }
}

.page-product .content {
  padding-bottom: var(--padding100);
}

.pro-list {
  padding-bottom: var(--padding60);
}

.pro-list-item {
  position: relative;
}

.pro-list-item .pic-area {
  box-shadow: 0px 0.04rem 0.2rem 0px rgba(0, 0, 0, 0.25);
}

.pro-list-item .meta {
  box-sizing: border-box;
  padding: 0.2rem 0.04rem 0.12rem;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.pro-list-item .title {
  color: rgba(28, 34, 44, 1);
  font-size: var(--font20);
}

@media screen and (max-width: 767px) {
}

.feature-list {
  display: flex;
  flex-wrap: wrap;
  padding-top: 0.08rem;
  margin: 0 -0.24rem;
  list-style: none;
}

.feature-list > li {
  margin: 0 0.24rem 0.2rem;
  list-style: none;
}

.feature-list > li .wrap {
  display: flex;
  align-items: center;
  gap: 0.08rem;
}

.feature-list > li .title {
  color: rgba(0, 0, 0, 1);
  font-size: var(--font18);
  line-height: 2;
}

.feature-list > li .icon {
  box-sizing: border-box;
  width: var(--icon28);
  height: var(--icon28);
}

.feature-list > li .icon img {
  width: 100%;
  height: 100%;
  display: block;
}

@media screen and (max-width: 767px) {
  .feature-list {
    flex-wrap: wrap;
    gap: 0;
    padding: 20px 12px;
  }

  .feature-list > li {
    width: 50%;
    margin-bottom: 20px;
  }

  .feature-list > li .wrap {
    gap: 8px;
  }
}

@media only screen and (min-width: 768px) {
  .card {
    --card-title-font-size: 0.24rem;
  }

  .card {
    padding-bottom: var(--padding60);
  }

  .card .card-hd {
    padding-bottom: 0.2rem;
    margin-bottom: var(--padding28);
  }

  .card .card-hd::after {
    width: 3.08rem;
  }
}

.table-wrapper2 {
  padding: var(--padding28) 0;
}

.table-wrapper2 table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
}

.table-wrapper2 thead > tr > th {
  position: relative;
  font-weight: bold;
  font-size: var(--font20);
  padding: 0.12rem 0.36rem !important;
  color: rgba(72, 72, 72, 1);
}

.table-wrapper2 thead > tr > th img {
  height: 1rem;
}

.table-wrapper2 tbody > tr > td {
  transition: all 0.3s;
  padding: 0.36rem !important;
  font-size: var(--font20) !important;
  color: rgba(72, 72, 72, 1);
  border-bottom: 1px solid #3b3c3b;
}

.table-wrapper2 tbody > tr > .td1 {
  color: rgba(0, 0, 0, 1);
  font-weight: bold;
}

@media only screen and (min-width: 768px) {
  .headline {
    --headline-margin-bottom: 0.6rem;
  }
}

.category-row {
  --cate-size: 2.24rem;
  font-size: var(--swiper-navigation-size);
  position: relative;
  padding-bottom: var(--padding88);
}

.category-area-wrap {
  padding-left: var(--cate-size);
  padding-right: var(--cate-size);
}

.category-area {
  --swiper-navigation-size: 0.4rem;
  box-sizing: border-box;
  padding: 0 0.24rem;
  position: relative;
}

.category-area .swiper-button-prev,
.category-area .swiper-rtl .swiper-button-next {
  left: 0.24rem;
}

.category-area .swiper-button-next,
.category-area .swiper-rtl .swiper-button-prev {
  right: 0.24rem;
}

.category-list-item {
  width: 100%;
  display: flex;
  justify-content: center;
}

.category-list-item a {
  display: block;
}

.category-list-item .meta {
  box-sizing: border-box;
  width: var(--cate-size);
  height: var(--cate-size);
  border-radius: 50%;
  background-color: rgba(246, 246, 246, 1);
  position: relative;
  padding: 0.2rem;
}

.category-list-item .pic,
.category-list-item .title {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: opacity 0.5s;
}

.category-list-item .title {
  font-size: var(--font18);
  font-weight: 700;
  color: rgba(8, 11, 25, 1);
  text-align: center;
}

.category-list-item .pic {
  opacity: 0;
}

.category-list-item:hover .pic {
  opacity: 1;
}

.category-list-item:hover .title {
  opacity: 0;
}

.category-list-item .pic img {
  max-width: 60% !important;
}

.category-row .all {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
}

.category-row .local-search {
  position: absolute;
  right: 0;
  top: 0;
  z-index: 1;
}

.category-row .local-search .meta {
  cursor: pointer;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 0.24rem;
}

.category-row .local-search .meta:hover {
  color: var(--main-color);
}

.category-row .all .category-list-item .meta {
  background: rgba(0, 0, 0, 1);
}

.category-row .all .category-list-item .title {
  color: rgba(255, 255, 255, 1);
}

.category-row .all .category-list-item:hover .title {
  opacity: 1;
}

@media only screen and (max-width: 767px) {
}

.r1 {
  padding-bottom: var(--padding60);
}

.r1 .flex-box-left {
  width: 45%;
}

.r1 .flex-box-right {
  width: 55%;
  padding-left: var(--padding88);
}

.page-product-detail {
}

.page-product-detail .r1 .meta {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.page-product-detail .r1 .title {
  color: rgba(58, 58, 58, 1);
  font-size: var(--font36);
  margin-bottom: 0.2rem;
  font-weight: bold;
}

.page-product-detail .r1 .desc {
  color: rgba(51, 51, 51, 1);
  font-size: var(--font20);
  line-height: 2;
  margin-bottom: 0.2rem;
}

@media only screen and (min-width: 768px) {
  .pro-gallery-area .swiper-pagination {
    display: none;
  }
}

.pro-focus {
}

/* 大图 */

.pro-gallery-area {
  box-sizing: border-box;
}

.pro-gallery-item {
  border: 1px solid #ddd;
}

.pro-gallery-item .pic {
}

.pro-thumb-area {
  width: 100%;
  height: 0.88rem;
  box-sizing: border-box;
  position: relative;
  margin-top: 0.24rem;
}

.pro-thumb-area .swiper {
  height: 100%;
}

.pro-thumb-item {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  cursor: pointer;
  position: relative;
  background-color: #fff;
  border: 1px solid #ddd;
  padding: 1px;
}

.pro-thumb-item img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

@media only screen and (max-width: 767px) {
  .pro-thumb-area {
    --swiper-navigation-size: 20px;

    padding: 0 28px;
  }
}

@media only screen and (min-width: 768px) {
  /* .Technical-Note .card {
    --card-title-font-size: 0.2rem;
  } */
}

.Technical-Note {
  padding-top: var(--padding60);
}

.Technical-Note .card .card-hd {
  border-bottom: 0 none;
  padding-bottom: 0;
  margin-bottom: 0;
}

.Technical-Note .card .card-hd::after {
  display: none;
}
