.jiaye-goods-read {
  padding: var(--gap-100) 0 var(--gap-50);
  background: #F8F8F8;
}

.jiaye-goods-read .jgr-wrap {
  display: flex;
  gap: var(--gap-50);
  align-items: flex-start;
}

/* 左侧图片画廊 */
.jiaye-goods-read .jgr-gallery {
  display: flex;
  gap: 20px;
  min-width: 0;
}

.jiaye-goods-read .jgr-gallery-main {
  width: 607px;
  min-width: 0;
}

.jiaye-goods-read .jgr-main-swiper {
  width: 100%;
  border-radius: 10px;
  overflow: hidden;
  background: #FFF;
  padding: 30px;
}

.jiaye-goods-read .jgr-main-swiper .swiper-slide {
  aspect-ratio: 1/1;
  display: flex;
  align-items: center;
  justify-content: center;
}

.jiaye-goods-read .jgr-main-swiper .swiper-slide a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
  cursor: zoom-in;
}

.jiaye-goods-read .jgr-main-swiper .swiper-slide img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}

/* 缩略图区 */
.jiaye-goods-read .jgr-gallery-thumbs {
  width: 191px;
  flex-shrink: 0;
  position: relative;
}

.jiaye-goods-read .jgr-thumbs-swiper {
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.jiaye-goods-read .jgr-thumbs-swiper .swiper-slide {
  aspect-ratio: 1/1;
  border-radius: 10px;
  padding: 10px;
  overflow: hidden;
  cursor: pointer;
  transition: border-color 0.3s ease;
  background: #FFF;
  display: flex;
  align-items: center;
  justify-content: center;
}

.jiaye-goods-read .jgr-thumbs-swiper .swiper-slide img {
  max-width: 100%;
  max-height: 100%;
  object-fit: contain;
  display: block;
}

.jiaye-goods-read .jgr-thumbs-swiper .swiper-slide-thumb-active {
  border: 1px solid var(--color-primary);
}

/* 缩略图导航 */
.jiaye-goods-read .jgr-thumbs-prev,
.jiaye-goods-read .jgr-thumbs-next {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  transition: all 0.3s ease;
  border-radius: 4px;
  z-index: 10;
}

.jiaye-goods-read .jgr-thumbs-prev {
  top: -33px;
}

.jiaye-goods-read .jgr-thumbs-next {
  bottom: -33px;
}

.jiaye-goods-read .jgr-thumbs-prev.swiper-button-disabled,
.jiaye-goods-read .jgr-thumbs-next.swiper-button-disabled {
  opacity: 0.3;
  cursor: not-allowed;
}

/* 右侧信息区 */
.jiaye-goods-read .jgr-info {
  flex: 1;
  display: flex;
  flex-direction: column;
}

.jiaye-goods-read .jgr-title {
  color: #333;
  font-family: var(--font-family);
  font-size: var(--font-28);
  font-style: normal;
  font-weight: 700;
  line-height: 1.3;
  margin-bottom: 10px;
}

.jiaye-goods-read .jgr-social {
  display: flex;
  align-items: center;
  gap: 10px;
  color: #5B5B5B;
  font-family: var(--font-family);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
  margin-bottom: 15px;
}

.jiaye-goods-read .jgr-social .social-medias{
  margin: 0 !important;
  gap: 5px;
}

.jiaye-goods-read .jgr-social .social-medias li{
  margin: 0 !important;
  width: 21px;
  height: 21px;
}
.jiaye-goods-read .jgr-social .social-medias li img{
  width: 100% !important;
}

.jiaye-goods-read .jgr-subtitle {
  color: #3B3B3B;
  font-family: var(--font-family);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
  margin-bottom: var(--gap-50);
}

.jiaye-goods-read .jgr-attributes {
  margin-bottom: var(--gap-50);
}

.jiaye-goods-read .jgr-attributes-title {
  color: #333;
  font-family: var(--font-family);
  font-size: var(--font-24);
  font-style: normal;
  font-weight: 500;
  line-height: 1.3;
  margin: 0 0 15px 0;
}

.jiaye-goods-read .jgr-attributes-line {
  width: 100%;
  height: 1px;
  background: #DDD;
  margin-bottom: 20px;
}

.jiaye-goods-read .jgr-attributes-content {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 35px;
}

.jiaye-goods-read .jgr-attr-item {
  display: flex;
  align-items: baseline;
  gap: 5px;
}

.jiaye-goods-read .jgr-attr-title {
  color: #24BDD8;
  font-family: var(--font-family);
  font-size: 16px;
  font-style: normal;
  font-weight: 700;
  line-height: 1.5;
  flex-shrink: 0;
}

.jiaye-goods-read .jgr-attr-colon {
  color: #24BDD8;
  flex-shrink: 0;
}

.jiaye-goods-read .jgr-attr-content {
  color: #484848;
  font-family: var(--font-family);
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 1.5;
  flex: 1;
}

.jiaye-goods-read .jgr-inquiry-btn .jiaye-button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  color: #FFF;
  background: linear-gradient(92deg, #24BDD8 0%, #95D7E1 123.91%);
  -webkit-text-fill-color: #FFF;
}


/* 内容区域 */
.jgr-content{
  margin-top: 132px;
}
.jgr-content .jgr-content-title{
  color: #333;
  text-align: center;
  font-family: var(--font-family);
  font-size: var(--font-48);
  font-style: normal;
  font-weight: 700;
  line-height: 1.2; /* 57.6px */
}
.jgr-content-item{
  margin-top: var(--gap-100);
}
.jgr-content-item-title{
  color: var(--color-primary);
  font-family: var(--font-family);
  font-size: var(--font-28);
  font-style: normal;
  font-weight: 700;
  line-height: 1.3; /* 36.4px */
}
.jgr-content-item-con{
  margin-top: var(--gap-50);
}
.jgr-content-item-con div,
.jgr-content-item-con table{
  width: 100%;
  overflow: scroll;
}
.jgr-content-item-con div::-webkit-scrollbar,
.jgr-content-item-con table::-webkit-scrollbar{
  display: none;
}

.jgr-content-item-con table tr:nth-of-type(even) td{
  background: #F5F5F5;
}

/* 产品优势 */
.jgr-content-item-advantage {
  display: grid;
  grid-template-columns: repeat(6, auto);
  justify-content: space-between;
  gap: 20px;
  list-style: none;
  margin: 0;
  padding: 0;
}

.jgr-advantage-item {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  text-align: center;
}

.jgr-advantage-icon {
  width: 100px !important;
  height: 100px;
  border-radius: 50%;
  background: #ECFEFF;
  padding: 26px;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background 0.3s ease;
}

.jgr-advantage-icon img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  transition: filter 0.3s ease;
}

.jgr-advantage-item:hover .jgr-advantage-icon {
  background: linear-gradient(135deg, #00B8DB 0%, #00D5BE 100%);
}

.jgr-advantage-item:hover .jgr-advantage-icon img {
  filter: brightness(0) invert(1);
}

.jgr-advantage-content {
  color: #6A7982;
  font-family: var(--font-family);
  font-size: var(--font-20);
  font-style: normal;
  font-weight: 700;
  line-height: 1.45;
}

.jgr-content-item table td{
  border: none;
  padding: 15px;
  background: #fff;
}

.jgr-content-item .jgr-table-wrap,
.jgr-content-item-con > table {
  display: block;
  /* max-height: 360px; */
  overflow: auto;
}

.jgr-content-item-con > table {
  width: 100%;
}



/* 响应式 */
@media screen and (max-width: 1500px) {
  .jiaye-goods-read .jgr-gallery{
    width: 55%;
  }
  .jiaye-goods-read .jgr-gallery-thumbs{
    width: 140px;
  }
  .jiaye-goods-read .jgr-attributes-content{
    gap: 10px;
  }
  .jiaye-goods-read .jgr-gallery-main{
    flex: 1;
  }
  .jgr-content{
    margin-top: 100px;
  }
}
@media screen and (max-width: 1280px) {
  .jiaye-goods-read .jgr-attributes-content{
    grid-template-columns: 1fr;
  }
  .jgr-content{
    margin-top: 80px;
  }
}
@media screen and (max-width: 1200px) {
  .jgr-content-item-advantage {
    grid-template-columns: repeat(3, 1fr);
  }
  .jiaye-goods-read .jgr-wrap {
    flex-direction: column;
  }
  .jiaye-goods-read .jgr-info {
    width: 100%;
  }
  .jiaye-goods-read .jgr-gallery{
    width: 70%;
    margin: 0 auto;
  }
  /* .jgr-content-item-advantage {
    grid-template-columns: repeat(3, 1fr);
  } */
  .jgr-content{
    margin-top: 50px;
  }
}

@media screen and (max-width: 992px) {

}

@media screen and (max-width: 768px) {
  .jiaye-goods-read .jgr-gallery {
    flex-direction: column-reverse;
  }
  .jiaye-goods-read .jgr-gallery{
    width: 90%;
  }
  .jiaye-goods-read .jgr-gallery-main{
    width: 100%;
  }
  .jiaye-goods-read .jgr-gallery-thumbs {
    width: 100%;
    height: auto;
  }
  .jiaye-goods-read .jgr-thumbs-swiper {
    height: auto;
    max-height: none;
  }
  .jiaye-goods-read .jgr-thumbs-prev{
    top: 50%;
    left: -20px;
    transform: translateY(-50%) rotate(-90deg);
  }
  .jiaye-goods-read .jgr-thumbs-next {
    top: 50%;
    right: -20px;
    left: initial;
    transform: translateY(-50%) rotate(-90deg);
  }
  .jiaye-goods-read .jgr-attributes-content {
    grid-template-columns: 1fr;
    gap: 20px;
  }
  .jgr-content-item-advantage {
    grid-template-columns: repeat(2, 1fr);
  }
  .jiaye-goods-read .jgr-inquiry-btn .jiaye-button {
    width: 100%;
    max-width: 100%;
  }
}