/* 详情图 */
.details-potho-container {
  padding: .7rem 0;
  background: url(/lib/images/products-details/img_mainpic_bg.jpg) no-repeat;
}

.details-potho-container .content {
  align-items: center;
  justify-content: space-between;
  margin-top: 0.2rem;
}

/* 详情 */
.details-potho-container .details-part {
  max-width: 6.8rem;
  width: 100%;
}

.details-potho-container .details-part h1 {
  color: #2d2d2d;
  font-size: 28px;
  font-family: 'Hind-SemiBold';
}

.details-potho-container .details-part .xian {
  width: 100%;
  height: 3px;
  margin: .2rem 0 .4rem;
  background: #258ca6;
}

.details-potho-container .details-part .parameter {
  flex-wrap: wrap;
}

.details-potho-container .details-part .parameter .item {
  flex: calc(100% / 2 - .175rem);
  margin-right: .35rem;
  margin-bottom: .2rem;
  border-bottom: 1px solid #5f747a10;
}

.details-potho-container .details-part .parameter .item:nth-child(2n) {
  margin-right: 0;
}

.details-potho-container .details-part .parameter p {
  color: #666;
  font-size: 16px;
}

.details-potho-container .details-part .parameter h4 {
  font-family: 'Hind-Bold';
  margin: .04rem 0 .2rem;
}

.details-potho-container .details-part .features {
  color: #666;
}

.details-potho-container .details-part .features ul {
  margin-top: .04rem;
}

.details-potho-container .details-part .features ul li {
  position: relative;
  padding-left: .2rem;
  color: #2d2d2d;
}

.details-potho-container .details-part .features ul li::before {
  position: absolute;
  top: .08rem;
  left: 0;
  width: .06rem;
  height: .06rem;
  content: '';
  border-radius: 50%;
  background: #258ca6;
}

/* 图片轮播 */
.details-potho-container .potho-part {
  max-width: 7.7rem;
  width: 100%;
  height: 5rem;
  margin-left: .4rem;
  background: #fff;
}

.details-potho-container .potho-part .potho-swiper {
  height: 100%;
}

.details-potho-container .potho-part .potho {
  height: 100%;
  max-width: 4.4rem;
  width: 100%;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: center;
}

.details-potho-container .potho-part .potho img {
  margin: auto;
}



.details-potho-container .potho-part .potho-prev img,
.details-potho-container .potho-part .potho-next img {
  width: .16rem;
}





/* 产品规格介绍区域 */
.product-specification-introduction {
  padding: .8rem 0 0;
}

.specification-introduction-content  {
  width: 100%;
  /* overflow: auto; */
  justify-content: space-between;
}

.product-specification-introduction .left {
  max-width: 11.5rem;
  width: 100%;
  flex: 1;
  overflow: hidden;
}

.product-specification-introduction .item {
  position: relative;
  /* height: 9.7rem; */
  overflow: hidden;
}

.product-specification-introduction .item.mask::after {
  position: absolute;
  bottom: .76rem;
  left: 0;
  width: 100%;
  height: 1rem;
  content: '';
  background: linear-gradient(to bottom, #ffffff00, #ffffff);
}

.product-specification-introduction .loading-more {
  position: absolute;
  bottom: 0;
  z-index: 12;
  left: 50%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: .5rem;
  color: #258ca6;
  text-align: center;
  cursor: pointer;
  transform: translateX(-50%);
}

.product-specification-introduction .loading-more p {
  position: relative;
  width: fit-content;
  margin-bottom: 0;
  color: #258ca6;
  font-family: 'Hind-Medium';
  margin-bottom: 0;
}

.product-specification-introduction .loading-more p::before {
  position: absolute;
  right: -22px;
  bottom: 7px;
  width: 12px;
  height: 12px;
  content: '';
  background: url(/lib/images/nav_down_main.svg) no-repeat center;
}

.product-specification-introduction .loading-more::after {
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  content: '';
  background: #fff;
}

.product-specification-introduction .item {
  margin-bottom: .8rem;
}



.product-specification-introduction .title-part {
  font-size: 28px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-bottom: .16rem;
  margin-bottom: .3rem;
  border-bottom: .01rem solid #eee;
}

.product-specification-introduction .title-part h3 {
  font-family: 'Hind-Medium';
  font-size: 28px;
}

.product-specification-introduction .title-part span {
  color: #666;
}

.product-specification-introduction h4 {
  font-size: 20px;
  margin: .2rem 0;
  font-family: 'Hind-Medium';
}

.product-specification-introduction ul {
  list-style: disc;
  padding-left: .2rem;
}

.product-specification-introduction ul li {
  margin-bottom: 10px;
}

.product-specification-introduction .content p {
  margin-bottom: .3rem;
}

.product-specification-introduction .content .text p {
  margin-bottom: 0;
}

.product-specification-introduction .ol-potho {
  align-items: center;
  justify-content: space-between;
}

.product-specification-introduction .ol-potho ol {
  margin-right: .3rem;
}

.product-specification-introduction .ol-potho li {
  margin-bottom: .2rem;
}

.product-specification-introduction .ol-potho li:last-child {
  margin-bottom: 0;
}

.product-specification-introduction .table-wrap {
  margin-bottom: .3rem;
}

.product-specification-introduction table {
  font-family: 'Hind-Medium';
}

.product-specification-introduction table th {
  color: #fff;
  border: none;
  background: #258ca6;
  padding-top: .17rem;
  padding-bottom: .17rem;
}

.product-specification-introduction table td {
  color: #2d2d2d;
  padding-top: .17rem;
  padding-bottom: .17rem;
}



.product-specification-introduction table td:not(:first-child),
.product-specification-introduction .two {
  text-align: center;
  color: #404040;
}

.product-specification-introduction .hebing {
  background: #edf1f2;
}
.product-specification-introduction .app-swiper-div {
  width: 100%;
  margin: .5rem 0 0;
}

.product-specification-introduction .app-swiper-div .swiper-slide {
  height: auto;
}

.product-specification-introduction .app-swiper-div .app-item {
  height: 100%;
}

.product-specification-introduction .app-swiper-div .app-prev,
.product-specification-introduction .app-swiper-div .app-next {
  width: 40px;
  height: 40px;
}


.product-specification-introduction .app-item .app-desc {
  color: #999;
  margin-top: 6px;
  text-align: center;
}


/* <!-- 复用的固定内容 --> */
.add-icon-container {
  padding: .8rem 0;
}

.add-item {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}

.add-icon {
  width: 1.6rem;
  height: 1.6rem;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: .35rem;
  border-radius: 50%;
  border: 1px dashed #258ca6;
}

.add-title {
  font-size: 16px;
  font-family: 'Hind-Medium';
  margin-bottom: .1rem;
}

.add-text p {
  margin-top: .06rem;
  font-size: 14px;
  color: #666;
}

.certifacate {
  padding: .45rem .25rem .45rem .8rem;
  background: #edf1f2;
}

.certifacate .cer-content {
  align-items: center;
  justify-content: space-between;
}

.certifacate .left {
  max-width: 5.8rem;
  width: 100%;
  margin-right: .3rem;
}

.certifacate .cer-title {
  font-size: 28px;
  font-family: 'Hind-Medium';
  margin-bottom: .1rem;
}

.certifacate .main-btn {
  margin-top: .4rem;
}

.certifacate .right {
  max-width: 6.5rem;
}



/* form */
.com-form-contact-container {
  padding: .8rem 0;
  display: none;
}

.com-form-contact .row {
  margin: 0 -0.1rem;
}

.com-form-contact .row>div {
  padding: 0 .1rem;
  margin-bottom: .2rem;
}

.com-form-contact input[type="submit"] {
  color: #fff;
  cursor: pointer;
  font-family: 'Hind-Bold';
  background: #258ca6;
}

.common-specification-part {
  padding-bottom: .8rem;
}



/* 文件拖拽 */
#dropbox {
  width: 100%;
  height: .56rem;
  line-height: .5rem;
  text-align: center;
  border: .01rem dashed #5f747a;
  border-radius: 0;
  color: #258ca6;
  background-color: #258ca620;
  font-family: 'Hind-Regular';
}

#preview>img {
  height: .8rem;
  margin: .07rem;
  border: 1px solid #666;
  border-radius: .04rem;
  box-shadow: .03rem .03rem .03rem #bbbbbb;
}

#outbox {
  width: 100%;
  display: inline-block;
  position: relative;
  overflow: hidden;
  margin-bottom: .16rem;
}

#imgUpload {
  position: absolute;
  left: 0;
  font-size: 16px;
  opacity: 0;
  border-radius: 0;
  cursor: pointer;
}

#imgUpload.active {
  opacity: 1;
}

.zhushi {
  font-size: 14px;
  text-align: center;
}



/* related products */
.related-products {
  padding: .8rem 0;
  background: #edf1f2;
}


.related-products h2 {
  position: relative;
  padding-left: .3rem;
  margin-bottom: .3rem;
  font-size: .32rem;
  color: #2d2d2d;
  font-family: 'Hind-Medium';
}

.related-products h2::before {
  position: absolute;
  left: 0;
  top: 0;
  width: .1rem;
  height: .5rem;
  content: '';
  background: #258ca6;
}

.related-pro-item {
  position: relative;
  background: #fff;
}

.related-pro-img {
  padding: .4rem .2rem;
}

.related-pro-img img {
  max-width: 2.6rem;
  width: 100%;
  margin: auto;
  transition: all 0.4s;
}

.related-pro-title {
  height: 60px;
  padding: 0 20px;
  line-height: 60px;
  border-top: 1px solid #eee;
  -webkit-line-clamp: 2;
}


.normal-item,
.mask-item a {
  position: relative;
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
}

.mask-item {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: .6rem .3rem 0;
  color: #fff;
  text-align: center;
  opacity: 0;
  transition: all 0.4s;
  background: #258ca6;
}

.mask-item h4 {
  font-size: 20px;
  font-family: 'Hind-Bold';
  margin-bottom: .3rem;
}

.mask-item .view-details {
  position: absolute;
  bottom: .6rem;
  left: 50%;
  width: 1.8rem;
  height: .48rem;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateX(-50%);
  border: .01rem solid #fff;
}

.related-pro-item a:hover {
  color: #fff;
}

.related-pro-item:hover .mask-item {
  opacity: 0.9;
  transition: all 0.4s;
}


.details-potho-container .potho-part .potho-prev,
.details-potho-container .potho-part .potho-next {
  top: 47%;
  width: .4rem;
  height: .72rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #404040;
}




/* 右侧悬浮表单 */
.aside-form {
  max-width: 4rem;
  width: 100%;
  flex-shrink: 0;
  margin-left: .3rem;
  padding-bottom: .5rem;
}

.aside-form>div,
.aside-form form {
  position: sticky;
  top: .8rem;
}

.form-title {
  position: relative;
  color: #fff;
  font-size: .2rem;
  padding: .22rem 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: 'Hind-Bold';
  background: #1b677a;
}

.form-title h3 {
  font-size: 20px;
}

.form-title::after {
  position: absolute;
  bottom: -0.09rem;
  left: 50%;
  width: .1rem;
  height: .1rem;
  content: '';
  background: #1b677a;
  transform: rotate(45deg) translateX(-50%);
}

.aside-form .form-content {
  padding: .3rem .4rem;
  background: #fff;
  text-align: center;
  color: #666;
  font-size: .14rem;
  border: .01rem solid #eee;
  box-shadow: 0 0 .1rem rgb(2 7 15 / 10%);
}

.aside-form .form-content input {
  height: .64rem;
  padding: 0 .2rem;
  margin-bottom: .1rem;
}

.aside-form .form-content textarea {
  height: 1.4rem;
}

.aside-form .form-content input::placeholder,
.aside-form .form-content textarea::placeholder {
  color: #666;
  font-size: .16rem;
}

.aside-form .form-content input[type="submit"] {
  height: .56rem;
  color: #fff;
  margin: .2rem auto .1rem;
  cursor: pointer;
  font-family: 'Hind-Medium';
  background: #258ca6;
}

@media (max-width:1400px) {
  .certifacate {
    padding: .45rem .25rem .45rem .45rem;
  }

  .details-potho-container .potho-part {
    max-width: 6.8rem;
  }
}


@media (max-width:1279px) {
  .details-potho-container {
    background-size: cover;
  }

  .details-potho-container .content {
    flex-direction: column-reverse;
    margin-top: 30px;
  }

  .details-potho-container .potho-part {
    max-width: 7.7rem;
    margin-left: 0;
    margin-bottom: .4rem;
  }

  .details-potho-container .details-part {
    max-width: 7.7rem;
  }

  .certifacate .left {
    max-width: 4rem;
  }

  .aside-form {
    display: none;
  }


  .product-specification-introduction .left {
    max-width: 100%;
  }
}

@media (max-width: 1023px) {
  .product-specification-introduction {
    padding-top: .6rem;
  }

  .product-specification-introduction .item {
    margin-bottom: .6rem;
  }

  .product-specification-introduction .ol-potho {
    flex-direction: column;
    align-items: flex-start;
  }

  .product-specification-introduction .ol-potho .potho {
    margin-top: .3rem;
  }

  .add-icon-container {
    padding: .6rem 0 .3rem;
  }

  .add-item {
    margin-bottom: .3rem;
  }

  .certifacate {
    padding: .4rem;
  }

  .certifacate .cer-content {
    flex-direction: column;
  }

  .certifacate .left {
    max-width: 100%;
    margin-right: 0;
    margin-bottom: .4rem;
  }

  .certifacate .right {
    max-width: 100%;
  }

  .details-potho-container,
  .com-form-contact-container,
  .related-products {
    padding: .6rem 0;
  }


  .common-specification-part {
    padding-bottom: .6rem;
  }
}


@media (max-width: 767px) {

  .details-potho-container .potho-part,
  .details-potho-container .details-part {
    max-width: 100%;
  }

  .details-potho-container .potho-part {
    height: auto;
    padding: 30px 0;
  }

  .details-potho-container .potho-part .potho-swiper {
    height: auto;
  }

  .details-potho-container .details-part h1,
  .product-specification-introduction .title-part h3,
  .certifacate .cer-title,
  .related-products h2 {
    font-size: 20px;
  }

  .product-specification-introduction .title-part h3 {
    margin-right: .3rem;
    line-height: 1.3;
  }

  .details-potho-container .details-part .parameter .item {
    /* flex: calc(100%); */
    flex: calc(100% / 2 - .1rem);
    margin-right: .2rem;
    margin-bottom: .1rem;
  }

  .details-potho-container,
  .com-form-contact-container,
  .related-products {
    padding: .4rem 0;
  }


  .common-specification-part {
    padding-bottom: .4rem;
  }

  .product-specification-introduction {
    padding-top: .4rem;
  }

  .product-specification-introduction .item {
    margin-bottom: .4rem;
  }

  .add-icon-container {
    padding: .4rem 0 .1rem;
  }

  .certifacate {
    padding: .3rem .15rem;
  }

  .cer-img img {
    margin: auto;
  }

  .related-pro-img img {
    max-width: 100%;
  }

}