/*产品与服务样式表*/
.service .banner {
  position: relative;
  width: 100%;
  height: 5.46666667rem;
  background: url("/static/m/images/about/banner.png") no-repeat center;
  background-size: cover;
}
.service h3.title {
  margin-bottom: 0.4rem;
  font-size: 0.53333333rem;
  font-weight: bold;
  color: #333333;
}
.service .content .change-list .change-left {
  width: 100%;
}
.service .content .change-list .change-left ul {
  list-style: none;
  padding: 0;
}
.service .content .change-list .change-left ul li {
  width: 100%;
  margin-bottom: 0;
  padding-bottom: 0.4rem;
  border-bottom: 1px solid #eeeeee;
}
.service .content .change-list .change-left ul li .top-show {
  padding-top: 0.4rem;
  transition: all 0.3s;
  cursor: pointer;
}
.service .content .change-list .change-left ul li .top-show .show-title {
  font-size: 0.42666667rem;
  font-weight: 400;
  color: #333333;
  transition: all 0.3s;
}
.service .content .change-list .change-left ul li .top-show p.arrow-box {
  width: 0.29333333rem;
  height: 0.17333333rem;
  background: url('/static/cn/images/service/roof/down-arrow.png') no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
  transition: all 0.3s;
}
.service .content .change-list .change-left ul li .bottom-hide {
  display: none;
  margin-top: 0.4rem;
}
.service .content .change-list .change-left ul li .bottom-hide img {
  width: 100%;
  margin-top: 0.4rem;
}
.service .content .change-list .change-left ul li .bottom-hide p.hide-txt {
  font-size: 0.4rem;
  font-weight: 400;
  color: #666666;
  line-height: 0.50666667rem;
}
.service .content .change-list .change-left ul li .bottom-hide p.hide-txt:not(:last-of-type) {
  margin-bottom: 0.1rem;
}
.service .content .change-list .change-left ul li.active .top-show {
  padding: 0.4rem 0;
  border-bottom: 0.06666667rem solid #66ba3d;
}
.service .content .change-list .change-left ul li.active .top-show p.arrow-box {
  background: url('/static/cn/images/service/roof/down-arrow-hover.png') no-repeat;
  -webkit-background-size: cover;
  background-size: cover;
}
.service .content .change-list .change-left ul li.active .top-show .show-title {
  color: #66ba3d;
  font-weight: bold;
}
.service .content .change-list .change-right {
  width: 53.1%;
}
.service .structure .banner {
  background: url("/static/m/images/service/index/banner.png") no-repeat center;
  background-size: cover;
}
.service .structure .structure-content {
  margin-top: 1.06666667rem;
}
.service .structure .structure-content .structure-change {
  width: 100%;
}
.service .structure .structure-content .structure-change .change-list {
  display: none;
}
.service .structure .structure-content .structure-change .change-left {
  width: 100%;
}
.service .structure .structure-content .structure-change .change-left ul {
  width: 100%;
  padding-left: 0.4rem;
  list-style: square url('/static/cn/images/about/news/lingxing.png');
}
.service .structure .structure-content .structure-change .change-left ul li {
  width: 100%;
  cursor: default;
  font-size: 0.34666667rem;
  font-weight: 400;
  color: #666666;
  line-height: 0.53333333rem;
  padding: 0;
  border: none;
}
.service .structure .structure-content .structure-change .change-left ul li:not(:last-of-type) {
  margin-bottom: 0.26666667rem;
}
.service .structure .structure-content .structure-change .change-right {
  width: 100%;
  margin-top: 0.53333333rem;
}
.service .structure .structure-content .structure-change .change-right img {
  width: 100%;
}
.service .structure .structure-content .structure-list {
  height: 1.5rem;
}
.service .structure .structure-content .structure-list .list-box {
  width: 100%;
}
.service .structure .structure-content .structure-list .list-box ul {
  width: 100%;
  height: 100%;
}
.service .structure .structure-content .structure-list .list-box ul li {
  position: relative;
  width: 25%;
  font-size: 0.29333333rem;
  font-weight: bold;
  color: rgba(255, 255, 255, 0.6);
}
.service .structure .structure-content .structure-list .list-box ul li img {
  width: 100%;
  height: 100%;
}
.service .structure .structure-content .structure-list .list-box ul li .txt-box {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.7);
}
.service .structure .structure-content .structure-list .list-box ul li .txt-box p {
  text-align: center;
  line-height: 0.42666667rem;
}
.service .structure .structure-content .structure-list .list-box ul li.active {
  color: #ffffff;
}
.service .structure .structure-content .structure-list .list-box ul li.active .txt-box {
  background: rgba(0, 0, 0, 0.4);
}
.service .structure .structure-content .relation-container {
  padding-left: 0.4rem;
}
.service .roof .banner,
.service .wall .banner {
  background: url("/static/m/images/service/roof/banner.png") no-repeat center;
  background-size: cover;
}
.service .roof .roof-content .change-list .change-left,
.service .wall .roof-content .change-list .change-left,
.service .roof .wall-content .change-list .change-left,
.service .wall .wall-content .change-list .change-left {
  width: 100%;
}
.service .roof .roof-content .change-list .change-left ul,
.service .wall .roof-content .change-list .change-left ul,
.service .roof .wall-content .change-list .change-left ul,
.service .wall .wall-content .change-list .change-left ul {
  list-style: none;
  padding: 0;
}
.service .roof .roof-content .change-list .change-left ul li,
.service .wall .roof-content .change-list .change-left ul li,
.service .roof .wall-content .change-list .change-left ul li,
.service .wall .wall-content .change-list .change-left ul li {
  padding-bottom: 0.4rem;
  border-bottom: 1px solid #eeeeee;
  margin: 0!important;
}
.service .roof .roof-content .change-list .change-right,
.service .wall .roof-content .change-list .change-right,
.service .roof .wall-content .change-list .change-right,
.service .wall .wall-content .change-list .change-right {
  width: 53.1%;
}
.service .roof .roof-content .change-list .change-right img,
.service .wall .roof-content .change-list .change-right img,
.service .roof .wall-content .change-list .change-right img,
.service .wall .wall-content .change-list .change-right img {
  display: none;
}
.service .roof .roof-content .relation-container,
.service .wall .roof-content .relation-container,
.service .roof .wall-content .relation-container,
.service .wall .wall-content .relation-container {
  padding-left: 0;
}
.service .wall .banner {
  background: url("/static/m/images/service/wall/banner.png") no-repeat center;
  background-size: cover;
}
.service .steel .banner {
  background: url("/static/m/images/service/steel/banner.png") no-repeat center;
  background-size: cover;
}
.service .steel .steel-content .structure-change .change-list img {
  width: 100%;
}
.service .steel .steel-content .structure-change .change-list .change-left {
  width: 100%;
}
.service .steel .steel-content .structure-change .change-list .change-left .left-txt {
  font-size: 0.34666667rem;
  font-weight: 400;
  color: #666666;
  line-height: 0.53333333rem;
}
.service .steel .steel-content .structure-change .change-list .change-left .apply-range {
  margin-top: 0.8rem;
}
.service .steel .steel-content .structure-change .change-list .change-left .apply-range .range-title {
  margin-bottom: 0.53333333rem;
}
.service .steel .steel-content .structure-change .change-list .change-left .apply-range .range-title img {
  width: 0.37333333rem;
}
.service .steel .steel-content .structure-change .change-list .change-left .apply-range .range-title span {
  font-size: 0.42666667rem;
  font-weight: bold;
  color: #333333;
  margin-left: 0.26666667rem;
}
.service .steel .steel-content .structure-change .change-list .change-left .apply-range ul {
  list-style: none;
  padding: 0;
}
.service .steel .steel-content .structure-change .change-list .change-left .apply-range ul li {
  display: inline-block;
  width: 1.87rem;
  margin-bottom: 0;
  text-align: center;
}
.service .steel .steel-content .structure-change .change-list .change-left .apply-range ul li:not(:nth-of-type(3n)) {
  margin-right: 4.9em;
}
.service .steel .steel-content .structure-change .change-list .change-left .apply-range ul li:nth-of-type(4),
.service .steel .steel-content .structure-change .change-list .change-left .apply-range ul li:nth-of-type(5) {
  margin-top: 0.53333333rem;
}
.service .steel .steel-content .structure-change .change-list .change-left .apply-range ul li p {
  font-size: 0.37333333rem;
  font-weight: 400;
  color: #333333;
  margin-top: 0.26666667rem;
  line-height: 0.53333333rem;
}
.service .steel .steel-content .structure-change .change-list .change-right {
  margin-top: 0.8rem;
}
.service .steel .steel-content .system-characteristic {
  margin-top: 1.33333333rem;
}
.service .steel .steel-content .system-characteristic ul li {
  width: 100%;
  background: #ffffff;
  border: 2px solid #eeeeee;
  padding: 0.4rem;
  text-align: center;
  margin-bottom: 0.53333333rem;
}
.service .steel .steel-content .system-characteristic ul li .list-show img {
  width: 1.02666667rem;
}
.service .steel .steel-content .system-characteristic ul li p.show-title {
  font-size: 0.42666667rem;
  font-weight: bold;
  color: #333333;
  margin-top: 0.26666667rem;
}
.service .steel .steel-content .system-characteristic ul li p.hide-txt {
  font-size: 0.34666667rem;
  font-weight: 400;
  color: #666666;
  margin-top: 0.4rem;
  text-align: left;
  line-height: 0.53333333rem;
}
.service .steel .steel-content .build-sample {
  position: relative;
  height: 8rem;
  margin-top: 0.8rem;
}
.service .steel .steel-content .build-sample #build-swiper {
  margin-top: 0.53333333rem;
}
.service .steel .steel-content .build-sample .swiper-wrapper .swiper-slide img {
  display: block;
  width: 100%;
  margin-bottom: 0.4rem;
}
.service .steel .steel-content .build-sample .swiper-wrapper .swiper-slide p.time {
  font-size: 0.48rem;
  font-weight: bold;
  color: #66ba3d;
  margin-right: 0.26666667rem;
}
.service .steel .steel-content .build-sample .swiper-wrapper .swiper-slide p.slide-txt {
  font-size: 0.34666667rem;
  font-weight: 400;
  color: #666666;
  line-height: 0.53333333rem;
}
.service .steel .steel-content .build-sample .swiper-button-next,
.service .steel .steel-content .build-sample .swiper-button-prev {
  top: 112%;
  width: 0.90666667rem;
  height: 0.90666667rem;
  outline: none;
}
.service .steel .steel-content .build-sample .swiper-button-prev {
  left: 37%;
  background: url('/static/cn/images/service/steel/btn-white.png') no-repeat;
  background-size: cover;
  transform: rotate(0);
}
.service .steel .steel-content .build-sample .swiper-button-next {
  right: 37%;
  background: url('/static/cn/images/service/steel/btn-white.png') no-repeat;
  background-size: cover;
  transform: rotate(180deg);
}
.service .steel .steel-content .build-sample .swiper-button-prev:hover {
  background: url('/static/cn/images/service/steel/btn-hover.png') no-repeat;
  background-size: cover;
  transform: rotate(180deg);
}
.service .steel .steel-content .build-sample .swiper-button-next:hover {
  background: url('/static/cn/images/service/steel/btn-hover.png') no-repeat;
  background-size: cover;
  transform: rotate(0);
}
.service .steel .steel-content .relation-container {
  padding: 0;
}