﻿#tpuDetail {
  padding-bottom: 40px;
}
.detail-top {
  display: flex;
  justify-content: space-between;
}
.detail-top-left {
  width: 50%;
}
.detail-top-left-tab-img {
  /*height: 600px;*/
  overflow: hidden;
  text-align: center;
  padding-bottom: 70px;
}
.detail-top-left-tab-img-div,
.detail-top-left-tab-img-1-fc {
  display: none;
  position: relative;
  height: 500px;
}
.detail-top-left-tab-img-div.active {
  display: block;
}
.detail-top-left-tab-img-div:hover .detail-top-left-tab-img-1-fc {
  display: block;
}
/*.detail-top-left-tab-img-div:hover .detail-top-left-tab-img-div-img,.detail-top-left-tab-img-div:hover
	.detail-top-left-tab-img-div-text{
	display: none;
	}*/
.detail-top-left-tab-img-1-fc {
  position: absolute;
  /*display: block;*/
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}
.detail-top-left-tab-img-1-fc-div {
  height: 435px;
  position: relative;
}
.detail-top-left-tab-img-fc {
  position: absolute;
  left: 20%;
  top: 0;
  border-radius: 13px;
  box-shadow: 0 4px 8px #0006;
}
.detail-top-left-tab-img-div-img img {
  width: 430px;
  height: 430px;
  border-radius: 10px;
}
.detail-top-left-tab-img-div-img-ckt img {
  width: 100%;
  height: auto;
}
.detail-top-left-tab-img-div-text,
.detail-top-left-tab-img-1-fc-div-text {
  font-size: 16px;
  color: #999999;
  padding-top: 40px;
}
.detail-top-left-tab-bottom {
  display: flex;
  justify-content: center;
}
.detail-top-left-tab-text {
  width: 148px;
  height: 38px;
  border: 1px solid #e8e8e8;
  background: #ffffff;
  color: #999999;
  text-align: center;
  line-height: 38px;
  font-size: 16px;
  cursor: pointer;
}
.detail-top-left-tab-text.active {
  color: #666666;
  background: #f9f9f9;
}
.detail-top-right {
  width: 540px;
}
.detail-top-right-title {
  font-size: 36px;
  font-weight: bold;
}
.detail-top-right-Series {
  font-size: 20px;
  line-height: 2;
}
.detail-top-right-p {
  border-bottom: 2px solid #eeeeee;
  padding-bottom: 15px;
  position: relative;
}
.detail-top-right-p::after {
  position: absolute;
  content: "";
  width: 100px;
  height: 2px;
  background: #fdd14f;
  bottom: -2px;
  left: 0;
}
.detail-top-right-list {
  display: flex;
  align-items: center;
  border-bottom: 1px solid #eeeeee;
  height: 50px;
  font-size: 16px;
}
.detail-top-right-list-left {
  width: 50%;
}
.detail-top-right-btn-div {
  display: flex;
  align-items: center;
  padding-top: 30px;
}
.detail-top-right-btn {
  width: 178px;
  height: 38px;
  color: #fff;
  background: #996600;
  border: 1px solid #996600;
  margin-right: 30px;
  font-size: 16px;
  border-radius: 5px;
  text-align: center;
  line-height: 38px;
  cursor: pointer;
}
.detail-top-right-btn:hover {
  opacity: 0.8;
}
.detail-top-right-btn-white {
  background: #fff;
  color: #996600;
}
.detail-bottom {
  padding-top: 90px;
}
.detail-series-title {
  font-size: 16px;
  margin-bottom: 15px;
}
.detail-series-div {
  position: relative;
}
.detail-series-product img {
  width: 100px;
  height: 100px;
  border-radius: 10px;
}
.detail-series-div .swiper-button-prev {
  left: -50px;
}
.detail-series-div .swiper-button-next {
  right: -50px;
}

.printonly {
  margin: 0 auto;
  display: none;
  margin-top: -76px;
  width: 800px;
}
@media print {
  .header,
  .btop,
  #tpuDetail,
  .foot {
    display: none;
    margin: 0;
    padding: 0;
  }
  .printonly {
    display: block;
  }
}

.printonly .printimg,
.printonly .printqimg {
  overflow: hidden;
}
.printonly .printimg li {
  float: left;
  text-align: center;
}
.printonly .printimg li {
  width: 50%;
  height: 400px;
}
.printonly .printimg li img {
  width: auto;
  height: 300px;
  object-fit: cover;
  border-radius: 10px;
}
.printonly .printimg li p {
  width: 110px;
  height: 40px;
  line-height: 40px;
  color: #333;
  font-size: 16px;
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid #e3e3e3;
  text-align: center;
  margin: 20px auto;
}
.printonly .printqimg {
  /*margin-top: -32px;*/
  display: flex;
  justify-content: center;
}
.printonly .printqimg li {
  width: 50%;
  height: 400px;
}
.printonly .printqimg li div {
  width: 100%;
  height: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}
.printonly .printqimg li div img {
  width: auto;
  height: 260px;
  object-fit: cover;
}
.printonly .printqimg li p {
  width: 150px;
  height: 40px;
  line-height: 40px;
  color: #333;
  font-size: 16px;
  overflow: hidden;
  border-radius: 10px;
  border: 1px solid #e3e3e3;
  text-align: center;
  margin: 20px auto 0;
}
.printonly .printcont div,
.printonly .printcont ul {
  overflow: hidden;
}
.printonly .printcont div {
  margin-top: 30px;
  height: 70px;
  line-height: 70px;
  border-bottom: 1px solid #e3e3e3;
}
.printonly .printcont div h3 {
  color: #9b7239;
  font-size: 30px;
  font-weight: bold;
  padding-bottom: 6px;
  float: left;
  margin-right: 20px;
}
.printonly .printcont div h4 {
  font-size: 20px;
  color: #5c5c5c;
  float: left;
  margin-right: 20px;
  line-height: 77px;
}
.printonly .printcont div h5 {
  font-size: 14px;
  color: #696969;
  float: left;
  line-height: 80px;
}
.printonly .printcont ul li {
  width: 46%;
  height: 42px;
  line-height: 42px;
  border-bottom: 1px solid #e4e4e4;
  float: left;
  font-size: 16px;
}
.printonly .printcont ul li:nth-child(2n) {
  margin-left: 8%;
}
.printonly .printcont ul li p {
  min-width: 34%;
  float: left;
}
.printcont {
  width: 80%;
  margin: 0 auto;
  margin-top: -30px;
}
#tpuList {
  /*display: flex;*/
  /*justify-content: space-between;*/
  padding-bottom: 40px;
}
.tpu-left {
  width: 280px;
  background-color: #e9e9e9;
  padding: 10px 0;
  float: left;
}
.tpu-left.is_stuck {
  position: fixed;
  top: calc(88px + 1.5rem);
}
.tpu-left .tit {
  display: flex;
  justify-content: space-between;
  align-items: center;
  position: relative;
  /*margin: 10px 0 0; */
  padding: 15px 20px;
  line-height: 36px;
}
.tpu-left .tit > b {
  font-weight: 1rem;
}
.tpu-left .tit:before {
  content: "";
  position: absolute;
  top: 10px;
  left: 20px;
  width: 3.3rem;
  height: 1px;
  background: #eccc6c;
}
.tpu-right .tit:before {
  content: "";
  position: absolute;
  top: 10px;
  left: 20px;
  display: none !important;
  width: 3.3rem;
  height: 1px;
  background: #eccc6c;
}
.tpu-left .nav-list {
  padding: 0 20px;
  font-size: 16px;
  line-height: 2;
}
.tpu-left .nav-first .text {
  cursor: pointer;
}
.tpu-left .nav-first.active .text {
  color: #996600;
}
.tpu-left .nav-first .nav-sec-div {
  display: none;
}
/*.nav-first.active .nav-sec-div{
	display: block;
	}*/
.tpu-left .nav-first .nav-sec {
  display: flex;
  align-items: center;
  cursor: pointer;
}

.tpu-left .nav-first .nav-sec:hover,
.tpu-left .nav-first .nav-sec.active {
  color: #996600;
}
.tpu-left .nav-first .nav-sec .yuandian {
  width: 8px;
  height: 8px;
  display: inline-block;
  background: #e9e9e9;
  border-radius: 50%;
  margin-right: 6px;
}
.tpu-left .nav-first .nav-sec:hover .yuandian,
.tpu-left .nav-first .nav-sec.active .yuandian {
  background: #996600;
}
.tpu-right .sx-div {
  width: 870px;
  z-index: 5;
  top: 88px;
  background-color: #fff;
}
.tpu-right .sx-div .tit {
  display: flex;
  justify-content: space-between;
  margin-bottom: 20px;
}
.zsbm-search {
  border: 1px solid #333;
  display: flex;
  align-items: center;
  padding: 10px 15px;
}
.zsbm-search #zsbmkw {
  border: none;
  outline: none;
}
.zsbm-search button {
  border: none;
  background: none;
  cursor: pointer;
}

.tpu-right .sx-list {
  padding: 0 20px;
  font-size: 16px;
  line-height: 2;
  display: flex;
  position: relative;
  justify-content: space-evenly;
  width: 870px;
}
.tpu-right .sx-first {
  margin-bottom: 10px;
  /* position: relative; */
}
.tpu-right .sx-first .text {
  display: flex;
  font-size: 18px;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}
.tpu-right .sx-first .text i {
  font-size: 27px;
  margin-left: 5px;
  transform: rotate(180deg);
}
.tpu-right .sx-first .sx-sec {
  margin-right: 5px;
}
.tpu-right .sx-first .sx-sec-div {
  /* display: none; */
  width: 870px;
  height: 50px;
  justify-content: center;
  display: flex;
  background-color: #fff;
  align-items: center;
  left: 0;
  position: absolute;
  flex-wrap: wrap;
}
.tpu-right .sx-first.close .text > i {
  transform: rotate(0deg);
}
.tpu-right .sx-first .sx-sec {
  display: flex;
  align-items: center;
  cursor: pointer;
  /* flex-wrap: wrap; */
}
.tpu-right .sx-first .sx-sec .sx-gou {
  width: 18px;
  height: 18px;
  border: 1px solid #bcbcbc;
  background: #f7f7f7;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 6px;
}
.tpu-right .sx-first .sx-sec .sx-gou i {
  display: none;
  font-size: 16px;
  color: #c6a02f;
}
.tpu-right .sx-first .sx-sec.active .sx-gou {
  background-color: #fff;
  border-color: #c6a02f;
}
.tpu-right .sx-first .sx-sec.active .sx-gou i {
  display: inline-block;
}
.tpu-right .sx-first .color-div {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  display: none;
}
.tpu-right .sx-first:first-child .color-div {
  display: flex;
}
.tpu-right .sx-first .color-div .sx-sec-color {
  width: 20px;
  height: 20px;
  position: relative;
  margin: 0 8px 5px 0;
  cursor: pointer;
}
.close .color-div {
  display: flex !important;
}
.tpu-right .sx-first .color-div .sx-sec-color:nth-of-type(5n + 0) {
  margin-right: 0;
}
.tpu-right .sx-first .color-div .sx-sec-color-buquan {
  width: 40px;
  height: 0;
}
.tpu-right .sx-first .color-div .sx-sec-color .color-li {
  height: 20px;
  width: 20px;
  /* margin: 0 5px; */
  border-radius: 50%;
}
.tpu-right .sx-first .color-div .sx-sec-color .sx-gou {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, 0.3);
  display: none;
}
.tpu-right .sx-first .color-div .sx-sec-color.active .sx-gou {
  display: flex;
}
.tpu-right .sx-first .color-div .sx-sec-color .sx-gou i {
  font-size: 16px;
  color: #fff;
}

.tpu-right {
  width: 870px;
  min-height: 400px;
  float: right;
  overflow: visible;
}
.tpu-rightp {
  position: sticky;
  top: 87px;
  background-color: #fff;
  z-index: 5;
}
.tpu-right .tpu-pro-list {
  /* margin-top: 135px; */
  transition: 0.5s;
}
.tpu-pro-listp {
  margin-top: 20px !important;
}
.tpu-right .tpu-pro-list .pro-list-div {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
}
.tpu-right .tpu-pro-list .pro-list {
  width: 16%;
  padding: 0 1% 20px;
  box-sizing: border-box;
  text-align: center;
  font-size: 16px;
  line-height: 1.8;
}
.tpu-right .tpu-pro-list .pro-list .pro-list-a {
  display: inline-block;
  position: relative;
}
.tpu-right .tpu-pro-list .pro-list .pro-list-a .text {
  position: absolute;
  opacity: 0;
  transition: 0.3s;
  top: 28px;
  text-wrap: nowrap;
  font-size: 15px;
}
.tpu-right .tpu-pro-list .pro-list:hover .pro-list-a .text {
  opacity: 0;
}
.tpu-right .tpu-pro-list .pro-list .pro-list-a:hover {
  /* opacity: 0.8; */
}
.tpu-right .tpu-pro-list .pro-list.pro-list-buquan {
  height: 0;
}
.tpu-right .tpu-pro-list .pro-list img {
  max-width: 100%;
  height: 112px;
  border-radius: 10px;
}
.tpu-right .tpu-back-btn {
  text-align: center;
  margin-top: 15px;
}
.tpu-right .tpu-back-btn a {
  display: inline-block;
  padding: 6px 11px;
  border: 1px solid #333;
  border-radius: 5px;
  font-size: 14px;
}
.tpu-right .tpu-back-btn a:hover {
  background: #333;
  color: #fff;
}
.tpu-right .tpu-back-btn a span {
  display: flex;
  align-items: center;
}
.tpu-right .tpu-back-btn a i {
  font-size: 16px;
  margin-right: 10px;
}

.tpu-right .pageNum {
  display: flex;
  justify-content: center;
  align-items: center;
  line-height: 1.8rem;
  color: #666;
  margin-top: 15px;
}
.tpu-right .pageNum > a {
  font-weight: normal;
  font-size: 1.2rem;
  text-align: center;
  width: 1.8rem;
  background-color: #e9e9e9;
  border-radius: 50%;
}
.tpu-right .pageNum > a:hover {
  background-color: #960;
  color: #fff;
}
.tpu-right .pageNum span {
  margin: 0 20px;
  font-size: 16px;
}

.tpu-right .sx-nr {
  display: flex;
  justify-content: space-between;
  min-height: 46px;
  /* margin-bottom: 15px; */
  align-items: top;
  background-color: #fff;
  /* margin-top: 72px; */
  z-index: 5;
  transition: 0.5s;
}
.tpu-right .sx-nrp {
  margin-top: 46px;
}
.tpu-right .sx-nr .sx-nr-clear {
  padding: 0 11px;
  border: 1px solid #333;
  border-radius: 5px;
  font-size: 14px;
  height: 36px;
  line-height: 36px;
  display: flex;
  align-items: center;
  cursor: pointer;
  box-sizing: border-box;
  justify-content: center;
  width: 120px;
  display: flex;
  white-space: nowrap;
  width: auto;
}
.tpu-right .sx-nr .sx-nr-clear i {
  margin-right: 10px;
  font-size: 14px;
}
.tpu-right .sx-nr .sx-nr-clear:hover {
  background: #333;
  color: #fff;
}
.tpu-right .sx-nr .sx-nr-list {
  display: flex;
  flex-wrap: wrap;
  width: 750px;
}
.tpu-right .sx-nr .sx-nr-list .list-text {
  padding: 0 11px;
  border-radius: 5px;
  font-size: 14px;
  background: #e9e9e9;
  height: 36px;
  line-height: 36px;
  display: flex;
  align-items: center;
  margin-right: 10px;
  margin-bottom: 10px;
}
.tpu-right .sx-nr .sx-nr-list .list-text i {
  margin-left: 10px;
  font-size: 14px;
  cursor: pointer;
}
.tpu-right .sx-nr .sx-nr-list .list-text i:hover {
  color: #960;
}
.tpu-right .sx-nr .sx-nr-list .list-text .sekuai {
  width: 40px;
  height: 19px;
}
.bl {
  display: block !important;
}

@media (max-width: 1000px) {
  .header-liubai {
    display: none;
  }
}

@media (max-width: 800px) {
  .tpu-left {
    width: 100%;
    padding: 20px 0;
    margin-bottom: 20px;
  }
  .tpu-right {
    width: 100%;
  }
  .tpu-right .sx-div {
    width: 100%;
  }
  .tpu-right .sx-list {
    padding: 0;
    width: 100%;
	display: flex;
	align-items: center;
	flex-wrap: wrap;
  }
  .tpu-right .sx-first {
  }
  .tpu-right .sx-first .sx-sec-div {
	width: 100%;
	height: auto;
	flex-wrap: wrap;
	z-index: 5;
	background-color: #fff;
  }
  .tpu-right .sx-nr .sx-nr-clear {
	width: auto;
	text-wrap: nowrap;
  }
  .tpu-right .sx-first .text i {
	position: relative;
	z-index: 3;
  }
  .tpu-right .tpu-pro-list .pro-list img {
	height: auto;
  }
  .tpu-right .tpu-pro-list .pro-list {
	width: 25%;
  }
  .lang {
	margin-right: 83px;
  }

  img.lazy {  
    display: block;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
}  
img.lazy.loaded {  
  opacity: 1;
} 
}