@charset "utf-8";

/* CSS Document */
.home-banner .swiper-slide img {
  width: 100%;
}

.home-banner .swiper-container .swiper-pagination {
  bottom: 40px;
}

.home-banner .swiper-container .swiper-pagination .swiper-pagination-bullet {
  background: none;
  border: 1px solid #fff;
  opacity: 1;
  margin: 0 10px;
}

.home-banner .swiper-container .swiper-pagination .swiper-pagination-bullet-active {
  background: #fff;
}

.home-first {
  width: 100%;
  background: #000 url(../images/img_6.jpg) no-repeat;
  background-size: cover;
  background-position: bottom;
  padding: 80px 0;
  border-bottom: 1px solid rgba(255, 255, 255, 0.1);
}

.home-first .home-cell {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.home-first .home-text {
  width: 660px;
  display: inline-block;
  vertical-align: middle;
}

.home-first .home-text h2 {
  font-size: 32px;
  color: #fff;
}

.home-first .home-text p {
  font-size: 14px;
  line-height: 26px;
  margin-top: 24px;
  color: rgba(255, 255, 255, .5);
}

.home-first .home-box {
  display: flex;
}

.home-first .home-box .box {
  width: 33.33%;
  margin-top: 90px;
}

.home-first .home-pic {
  display: inline-block;
  vertical-align: middle;
}

.home-first .home-pic img {
  vertical-align: bottom;
  margin-left: 40px;
}

.homePro {
  background: #010101;
}

.homePro-title {
  height: 86px;
  line-height: 86px;
  color: #fff;
  font-size: 32px;
}

.homePro-banner {
  background: #111;
  padding-bottom: 80px;
}

.homePro-banner .swiper-slide .img img {
  width: 100%;
}

.homePro-banner .swiper-slide .box {
  margin: -80px 0 0 230px;
}

.box-warp {
  display: inline-block;
  text-align: center;
}

.homePro-banner .swiper-slide .box h2 {
  color: #fff;
  font-size: 100px;
  opacity: 0.5;
  transition: all .4s;
  font-weight: normal;
  font-family: yqb;
}

.homePro-banner .swiper-slide .box p {
  color: #fff;
  font-size: 24px;
  margin-top: 40px;
  opacity: 0.5;
  transition: all .4s;
}

.homePro-banner .swiper-pagination {
  color: #fff;
  font-size: 16px;
  text-indent: 25%;
}

.homePro-banner .swiper-button-next,
.homePro-banner .swiper-button-prev {
  width: 52px;
  height: 52px;
  top: auto;
  margin-top: 0;
  bottom: 250px;
  border-radius: 100%;
  border: 1px solid rgba(255, 255, 255, .5);
  transition: all .4s;
  box-sizing: border-box;
}

.homePro-banner .swiper-button-next {
  background: url(../images/next.png) no-repeat;
  background-size: cover;
  right: 30.5%;
}

.homePro-banner .swiper-button-prev {
  background: url(../images/prev.png) no-repeat;
  background-size: cover;
  left: 56%;
}

.homePro-banner .swiper-button-prev:hover {
  background: rgba(0, 0, 0, .3) url(../images/prev.png) no-repeat;
  background-size: cover;
}

.homePro-banner .swiper-button-next:hover {
  background: rgba(0, 0, 0, .3) url(../images/next.png) no-repeat;
  background-size: cover;
}

.homePro-banner .swiper-slide-active .box h2 {
  opacity: 1;
}

.homePro-banner .swiper-slide-active .box p {
  opacity: 1;
}

:focus {
  outline: none !important;
}

.homeZone {
  background: #000;
  padding: 90px 0;
}

.homeZone-title {
  font-size: 32px;
  color: #fff;
  margin-bottom: 40px;
}

.homeZone-left {
  width: 48%;
}

.homeZone-left img {
  width: 100%;
}

.homeZone-right {
  width: 48%;
}

.homeZone-right img {
  width: 100%;
}

.homeZone-box .img {
  position: relative;
  height: 578px;
}

.homeZone-box .img i {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: inline-block;
  background: url(../images/icon_4.png) no-repeat rgba(0, 0, 0, .5);
  background-position: center center;
  opacity: 0;
  transition: all 1s;
}

.homeZone-box .img:hover i {
  opacity: 1;
}

.homeZone-box h2 {
  font-size: 22px;
  color: #fff;
  font-weight: 400;
  margin: 20px 0 8px;
}

.homeZone-box p {
  font-size: 18px;
  color: #fff;
}

.homeZone-list.sm {
  width: 33%;
}

.homeZone-list.big {
  width: 63%;
}

.homeZone-list {
  transition: all .4s;
}

.homeJoin {
  position: relative;
}

.homeJoin img {
  width: 100%;
}

.homeJoin-box {
  width: 92%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 4%;
  z-index: 6;
  margin: 0 auto;
}

.homeJoin-box .box {
  text-align: center;
}

.homeJoin-box .box .txt {
  max-width: 1000px;
  margin: 0 auto;
}

.homeJoin-box .box .txt p {
  font-size: 14px;
  color: #fff;
  line-height: 26px;
  padding: 12px 0 24px;
}

.homeJoin-box .box .txt h2 {
  font-size: 26px;
  font-weight: 400;
  color: #fff;
}

.homeJoin-box .box .txt a {
  display: inline-block;
  width: 134px;
  height: 36px;
  line-height: 36px;
  border-radius: 20px;
  background: #fff;
  font-size: 16px;
  text-align: center;
  color: #000;
  transition: 1s;
}

.homeJoin-box .box .txt a:hover {
  box-shadow: 0 0 20px #eee;
}

/*品牌*/
.brand {
  background: #171719;
}

.brand-banner img {
  width: 100%;
}

.brand-first {
  padding: 100px 0;
}

.brand-title {
  color: #fff;
  /*opacity:0;*/
  /*animation:brandCen 4s .5s forwards;*/
}

.brand-title .tit {
  font-size: 32px;
  display: inline-block;
}

.brand-title h2 {
  font-size: 26px;
  font-weight: 400;
  padding: 20px 0 30px;
  display: inline-block;
}

.brand-title p {
  font-size: 14px;
  /*animation:brandH 2s .5s forwards;*/
}

.brand-title-des {
  display: inline-block;
}

.brand-history {
  display: table;
  margin-top: 80px;
}

.brand-history .txt {
  display: table-cell;
  padding-right: 90px;
  vertical-align: middle;
}

.brand-history .img {
  display: table-cell;
  width: 880px;
}

.brand-history .img img {
  width: 100%;
}

.brand-history .txt p {
  font-size: 14px;
  color: #fff;
  line-height: 32px;
}

.brand-slide {
  padding: 120px 0 0;
  overflow: hidden;
}

.brand-third {
  padding-top: 100px;
}

.brand-slide .swiper-container {
  overflow: visible;
}

.brand-slide .swiper-slide .box {
  color: #fff;
  padding: 24px 40px;
}

.brand-slide .swiper-slide .box h2 {
  font-size: 26px;
  font-weight: 400;
}

.brand-slide .swiper-slide .box p {
  font-size: 14px;
  line-height: 32px;
  margin-top: 16px;
}

.brand-slide .swiper-slide img {
  width: 100%;
}

.brand-slide .swiper-slide.swiper-slide-active img {
  transform: scale(1.06);
  transform: -webkit-scale(1.06);
}

.brand-slide .swiper-slide.swiper-slide-active h2 {
  margin-top: 10px;
}

.brand-slide .brand-button {
  width: 63px;
  height: 62px;
  border-radius: 50%;
  margin-top: -62px;
}

.brand-slide .swiper-button-prev {
  background: url(../images/prev2.png) no-repeat center #fff;
  left: 8%;
}

.brand-slide .swiper-button-next {
  background: url(../images/next2.png) no-repeat center #fff;
  right: 8%;
}

.brand-slide .swiper-button-prev:hover {
  background: url(../images/prev2.png) no-repeat center rgba(255, 255, 255, .8);
}

.brand-slide .swiper-button-next:hover {
  background: url(../images/next2.png) no-repeat center rgba(255, 255, 255, .8);
}

.brand-cell {
  width: 100%;
  padding: 120px 0 180px;
}

.brand-cell .cell {
  position: relative;
}

.brand-cell .img {
  width: 900px;
  position: relative;
  z-index: 6;
}

.brand-cell .img img {
  width: 100%;
  display: none;
}

.brand-cell .img img.active {
  display: block;
}

.brand-cell .box {
  position: absolute;
  top: -80px;
  right: 0;
  z-index: 5;
  background: #282828;
  width: 410px;
  padding: 80px 40px 80px 130px;
  height: 100%;
}

.brand-tabs ul li {
  width: 20%;
  float: left;
}

.brand-tabs ul li a {
  display: inline-block;
  line-height: 26px;
  font-size: 14px;
  color: #a9a9a9;
  border-bottom: 1px solid #282828;
}

.brand-tabs ul li.active a,
.brand-tabs ul li:hover a {
  color: #fff;
  border-bottom: 1px solid #fff;
}

.brand-drop .txt {
  margin-top: 150px;
  color: #fff;
  display: none;
}

.brand-drop .txt:first-child {
  display: block;
}

.brand-drop .txt h2 {
  padding: 20px 0;
  font-size: 26px;
  font-weight: 400;
}

.brand-drop .txt p {
  font-size: 16px;
  line-height: 32px;
}

@keyframes brandCen {
  0% {
    text-align: center;
  }

  100% {
    text-align: left;
    opacity: 1;
  }
}

@keyframes brandH {
  0% {
    transform: translateY(40px);
  }

  100% {
    transform: translateY(0);
  }
}

/*资讯*/
.news {
  background: #212123;
  padding-bottom: 50px;
}

.news-title {
  font-size: 32px;
  color: #fff;
  padding-top: 90px;
}

.news-list {
  padding: 60px 0;
}

.news-list li {
  width: 32%;
  float: left;
  margin-right: 2%;
}

.news-list li:hover .img img {
  transform: scale(1.1);
}

.news-list li:nth-child(3n) {
  margin-right: 0;
}

.news-list li .img {
  width: 100%;
  overflow: hidden;
}

.news-list li .img img {
  width: 100%;
  transition: 1s;
}

.news-list li .box {
  padding: 24px 0 34px;
}

.news-list li .box h2 {
  height: 22px;
  line-height: 22px;
  font-size: 16px;
  color: #fff;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.news-list li .box p {
  color: #999;
  font-size: 14px;
  height: 66px;
  overflow: hidden;
  line-height: 22px;
  margin-top: 18px;
}

.news-list li .box .time {
  font-size: 14px;
  color: #fff;
  margin-top: 18px;
  font-weight: bold;
}

.pagination {
  margin: 40px auto 0;
  text-align: center;
}

.pagination ul {
  display: inline-block;
}

.pagination li {
  float: left;
}

.pagination li a {
  font-size: 22px;
  color: #535353;
  margin: 0 6px;
  display: inline-block;
  width: 32px;
  height: 32px;
  line-height: 32px;
  display: inline-block;
  border: 2px solid #212123;
}

.pagination li.active a {
  color: #fff;
  border: 2px solid #fff;
}

/*资讯详情*/
.newsDeatil {
  background: #212123;
  padding: 140px 0 50px;
}

.newsDeatil-title {
  text-align: center;
  margin: 0 auto;
  padding-bottom: 36px;
  border-bottom: 1px solid #383838;
}

.newsDeatil-title h2 {
  color: #fff;
  font-size: 22px;
  font-weight: 400;
}

.newsDeatil-title p {
  font-size: 16px;
  color: #a9a9a9;
  margin-top: 30px;
}

.newsDeatil-title p img {
  vertical-align: middle;
  margin: -2px 12px 0 12px;
  height: 17px;
}

.newsDeatil-centent {
  max-width: 960px;
  margin: 0 auto;
  padding: 40px 0 60px;
}

.newsDeatil-centent p {
  font-size: 14px;
  line-height: 26px;
  color: #fff;
  margin-top: 20px;
  text-align: justify;
}

.newsDeatil-centent img {
  max-width: 100%;
  width: auto !important;
  height: auto !important;
}

.newsDeatil-page {
  border-top: 1px solid #383838;
}

.newsDeatil-page .box {
  max-width: 960px;
  margin: 0 auto;
  padding: 20px 0;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.newsDeatil-page .box a {
  color: #8e8e8e;
  font-size: 14px;
  line-height: 28px;
}

.newsDeatil-page .box a span {
  color: #fff;
}

.newsDeatil-page .box .left a {
  display: block;
}

.newsDeatil-page .box a:hover {
  color: #fff;
}

.newsDeatil-page .box .right img {
  vertical-align: middle;
  margin: -3px 8px 0 0;
}

/*产品分类*/
.proClass-banner img {
  width: 100%;
}

.proClass-slide {
  text-align: center;
  margin: 0 auto;
}

.proClass-slide .tit {
  font-size: 44px;
  color: #fff;
  display: inline-block;
  padding: 100px 0 40px;
  position: relative;
  transition: 1s;
  opacity: 0;
}

.proClass-slide .tit:before {
  content: '';
  width: 130px;
  height: 1px;
  background: #fff;
  position: absolute;
  bottom: 0;
  left: 50%;
  margin-left: -65px;
  opacity: 0;
}

.proClass-slide .img {
  height: calc(100% - 200px);
  height: -webkit-calc(100% - 200px);
  height: -moz-calc(100% - 200px);
  margin-top: 50px;
}

.proClass-slide .img img {
  height: 100%;
}

.proClass-menu {
  position: absolute;
  right: 20px;
  top: 50%;
  z-index: 444;
}

.proClass-menu li a {
  width: 6px;
  height: 6px;
  border-radius: 50%;
  border: 1px solid #6e6e70;
  margin: 16px auto;
  display: block;
}

.proClass-menu li.active a {
  background: #fff;
  border: 1px solid #fff;
}

.proClass-slide.proClass-animate .tit {
  animation: proClass 1s .5s forwards;
}

.proClass-slide.proClass-animate .tit:before {
  animation: proClass 1s 1s forwards;
}

@keyframes proClass {
  0% {
    transform: translateY(40px);
    opacity: 0;
  }

  100% {
    transform: translateY(0px);
    opacity: 1;
  }
}

/*产品列表*/
.proList {
  background: #171719;
  padding: 90px 0 30px;
}

.proList .box {
  width: 48%;
  margin-right: 4%;
  float: left;
  margin-bottom: 36px;
}

.proList .box:nth-child(2n) {
  margin-right: 0;
}

.proList .box .proList-swiper {
  width: 100%;
  overflow: hidden;
}

.proList .box .proList-swiper img {
  width: 100%;
}

.proList .box .txt p {
  font-size: 12px;
  color: #bababa;
  margin: 10px 0;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.proList .box .txt h2 {
  font-size: 18px;
  color: #fff;
  font-weight: 400;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  letter-spacing: 2px;
}

.proList .box .proList-button {
  left: auto;
  top: auto;
  margin-top: 0;
  right: 0;
  width: 45px;
  height: 45px;
  opacity: 0;
  transition: .5s;
}

.proList .box .swiper-button-next {
  background: url(../images/prev1.png) no-repeat center rgba(0, 0, 0, .5);
  bottom: 47px;
}

.proList .box .swiper-button-prev {
  background: url(../images/next1.png) no-repeat center rgba(0, 0, 0, .5);
  bottom: 0;
}

.proList .swiper-button-prev:hover {
  background: url(../images/next1.png) no-repeat center rgba(0, 0, 0, .8);
}

.proList .swiper-button-next:hover {
  background: url(../images/prev1.png) no-repeat center rgba(0, 0, 0, .8);
}

.proList .box:hover .proList-button {
  opacity: 1;
}

/*产品详情*/
.proDeatil {
  background: #111111;
  padding-top: 90px;
  border-bottom: 1px solid rgba(255, 255, 255, .1);
}

.proDeatil-left {
  background: #1c1c1c;
  width: 70%;
}

.proDeatil-left .proDeatil-banner {
  padding: 70px 80px 30px;
}

.proDeatil-left .proDeatil-banner {
  position: relative;
}

.proDeatil-banner .swiper-container .swiper-pagination {
  bottom: 26px;
}

.proDeatil-banner .swiper-container .swiper-pagination .swiper-pagination-bullet {
  background: none;
  border: 1px solid #fff;
  opacity: 1;
  margin: 0 10px;
}

.proDeatil-banner .swiper-container .swiper-pagination .swiper-pagination-bullet-active {
  background: #fff;
}

.proDeatil-button {
  margin-top: 40px;
}

.proDeatil-button .swiper-button-next,
.proDeatil-button .swiper-button-prev {
  top: auto;
  bottom: 0;
  background: none;
  position: static;
  margin-top: 0;
}

.proDeatil-button .swiper-button-next {
  width: 46%;
  height: 80px;
}

.proDeatil-button .swiper-button-prev {
  width: 46%;
  height: 80px;
}

.proDeatil-button a {
  display: block;
  padding: 0 60px;
  height: 100%;
  position: relative;
  text-align: right;
  color: #888;
}

.proDeatil-button a,
.proDeatil-button a:hover {
  background: #111111;
}

.proDeatil-button a h2 {
  font-size: 18px;
  font-weight: 400;
  color: #fff;
  line-height: 80px;
}

.proDeatil-button a p {
  font-size: 14px;
  display: none;
}

.proDeatil-button a img {
  position: absolute;
  top: 28px;
  width: 35px;
  transition: all .4s;
}

.proDeatil-button .swiper-button-prev a:hover img {
  transform: translateX(-15px);
}

.proDeatil-button .swiper-button-next a:hover img {
  transform: translateX(15px);
}

.proDeatil-button .swiper-button-next a {
  text-align: left;
}

.proDeatil-button .swiper-button-prev a img {
  left: 60px;
}

.proDeatil-button .swiper-button-next a img {
  right: 60px;
}

.proDeatil-left .swiper-container {
  width: 100%;
}

.proDeatil-left .swiper-container .swiper-slide {
  width: 100%;
}

.proDeatil-left .swiper-container .swiper-slide img {
  width: 100%;
}

.proDeatil-right {
  width: 30%;
  background: #111111;
}

.proDeatil-center {
  padding: 70px 80px 20px;
}

.proDeatil-title {
  position: relative;
  min-height: 150px;
  margin-bottom: 50px;
}

.proDeatil-s {
  position: absolute;
  top: -10px;
  left: -80px;
  width: 1px;
  height: 46px;
  background: #fff;
  opacity: 0;
  animation: proLineS 1s .2s forwards;
}

.proDeatil-h {
  position: absolute;
  top: 13px;
  left: -80px;
  width: 70px;
  height: 1px;
  background: #414141;
  opacity: 0;
  animation: proLineH 2s .5s forwards;
}

.proDeatil-title h2 {
  color: #fff;
  font-size: 24px;
  font-weight: 400;
  margin-bottom: 8px;
  opacity: 0;
  animation: proDeatil 1s .2s forwards;
}

.proDeatil-title p {
  color: #fff;
  font-size: 14px;
  line-height: 26px;
  overflow: hidden;
  margin-top: 12px;
  opacity: 0;
  animation: proDeatil 1s .5s forwards;
}

.proDeatil-title span {
  font-size: 14px;
  color: #595959;
  opacity: 0;
  animation: proDeatil 1s .5s forwards;
}

.proDeatil-slide ul li {
  float: left;
  width: 49%;
  margin-right: 2%;
  margin-top: 12px;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}

.proDeatil-slide ul li:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, .5);
}

.proDeatil-slide ul li.active:before,
.proDeatil-slide ul li:hover:before {
  background: none;
}

.proDeatil-slide ul li:nth-child(2n) {
  margin-right: 0;
}

.proDeatil-slide ul li img {
  width: 100%;
}

.proDeatil-back {
  margin-top: 60px;
  font-size: 16px;
  color: #696969;
  cursor: pointer;
}

.proDeatil-back img {
  vertical-align: middle;
  margin: -3px 10px 0 0;
  opacity: 0.5;
  transition: all .4s;
}

.proDeatil-back a {
  transition: all .4s;
}

.proDeatil-back a:hover {
  color: #fff;
}

.proDeatil-back a:hover img {
  opacity: 1;
}

@keyframes proDeatil {
  0% {
    transform: translateY(40px);
    opacity: 0;
  }

  100% {
    transform: translateY(0px);
    opacity: 1;
  }
}

@keyframes proLineS {
  0% {
    transform: translateY(-60px);
  }

  100% {
    transform: translateY(0px);
    opacity: 1;
  }
}

@keyframes proLineH {
  0% {
    transform: rotate(0deg);
    transform-origin: center;
  }

  100% {
    transform: rotate(360deg);
    opacity: 1;
  }
}

/*联系我们*/
.contact {
  padding: 90px 0;
  background: #171717;
}

.contact-cell {
  display: table;
}

.contact-cell .contact-txt {
  width: 50%;
  padding-right: 3%;
  display: table-cell;
  vertical-align: middle;
}

.contact-cell .contact-pic {
  width: 50%;
  display: table-cell;
  vertical-align: middle;
}

.contact-cell .contact-pic img {
  width: 100%;
}

.contact-txt .tit {
  font-size: 24px;
  color: #fff;
}

.contact-txt .txt {
  margin-top: 50px;
}

.contact-txt .txt p {
  color: #a7a7a7;
  font-size: 16px;
}

.contact-txt .txt h2 {
  color: #fff;
  font-size: 26px;
  margin-top: 10px;
}

.contact-txt .addre {
  margin-top: 50px;
}

.contact-txt .addre p {
  color: #a7a7a7;
  font-size: 16px;
}

.contact-txt .addre h2 {
  color: #fff;
  font-size: 18px;
  margin-top: 14px;
  font-weight: 400;
}

.contact-txt .addre span {
  color: #a7a7a7;
  font-size: 14px;
  display: block;
  margin-top: 6px;
}

.contact-txt .addre span a:hover {
  color: #fff;
}

.contact-online {
  margin-top: 50px;
}

.contact-online-title {
  font-size: 22px;
  color: #fff;
  padding-bottom: 26px;
  border-bottom: 1px solid #404040;
}

.contact-form .box {
  width: 32%;
  float: left;
  margin-right: 2%;
  position: relative;
}

.contact-form .box.box-c2 {
  width: 49%;
}

.contact-form .box.last {
  margin-right: 0;
}

.contact-form .box:nth-child(3) {
  margin-right: 0;
}

.contact-form .box p {
  padding: 25px 0 16px;
  font-size: 16px;
  color: #fff;
}

.contact-form .box img {
  vertical-align: middle;
  margin: -3px 10px 0 0;
}

.contact-form .box input {
  width: 100%;
  height: 55px;
  line-height: 55px;
  background: #212123;
  text-indent: 20px;
  font-size: 16px;
  color: #666666;
}

.contact-form .box input::placeholder {
  font-size: 16px;
  color: #666666;
}

.contact-form .contact-textarea {
  width: 100%;
}

.contact-form .contact-textarea textarea {
  background: #212123;
  width: 96%;
  padding: 16px 2%;
  height: 200px;
  font-size: 16px;
  color: #666666;
}

.contact-btn {
  margin-top: 40px;
}

.contact-btn span {
  float: left;
  height: 50px;
  line-height: 50px;
  display: block;
  color: #fff;
  font-size: 16px;
}

.contact-btn a {
  float: right;
  color: #fff;
  background: #303033;
  width: 200px;
  height: 50px;
  line-height: 50px;
  display: block;
  text-align: center;
  font-size: 16px;
  font-weight: bold;
}

.box-select {
  position: relative;
  cursor: pointer;
}

.box-select input {
  cursor: pointer;
}

.box-select:after {
  width: 10px;
  height: 9px;
  background: url("../images/dbx.png") no-repeat center;
  background-size: cover;
  right: 30px;
  top: 50%;
  margin-top: -5px;
  position: absolute;
  content: '';
  transition: all .4s;
}

.box.active .box-select:after {
  transform: rotate(180deg);
}

.box-select-text {
  position: absolute;
  width: 100%;
  left: 0;
  background: #212123;
  top: 56px;
  max-height: 280px;
  overflow: auto;
  display: none;
}

.box-select-text a {
  display: block;
  padding-left: 20px;
  font-size: 16px;
  line-height: 40px;
}

.box-select-text a:hover {
  background: #666;
}


.scrollBar::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.scrollBar::-webkit-scrollbar-thumb:hover {
  border: 1px solid #636363;
  background-color: #929292;
}

.scrollBar::-webkit-scrollbar-thumb {
  background-color: #cfcfd2;
  border-radius: 8px;
  background-clip: padding-box;
  min-height: 28px;
}

.scrollBar::-webkit-scrollbar-track-piece {
  background: #f3f3f3;
}

/*全国门店*/
.shop {
  padding: 80px 0;
  background: #212123;
}

.shop-title {
  text-align: center;
  margin: 0 auto;
}

.shop-title h2 {
  font-size: 32px;
  color: #fff;
  font-weight: 400;
}

.shop-title p {
  font-size: 16px;
  margin-top: 12px;
  color: #fff;
}

.shop-map {
  padding: 25px;
  background: #fff;
  margin: 50px 0 70px;
}

.shop-con .map {
  width: 100%;
  height: 540px;
}

.shop-con .swiper-container {
  height: 450px;
  border-bottom: 1px solid #d9d9d9;
}

.shop-con {
  position: relative;
}

.shop-list {
  background: #fff;
  position: absolute;
  top: 17px;
  right: 30px;
  width: 260px;
  padding: 0 10px;
  height: 500px;
  z-index: 56;
}

.shop-list .box {
  padding: 18px 22px 14px;
  color: #666;
  cursor: pointer;
}

.shop-list .box:hover,
.shop-list .active {
  color: #000;
}

.shop-list h2 {
  font-size: 16px;
  font-weight: 400;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.shop-list h2 img {
  vertical-align: middle;
  margin: -3px 10px 0 0;
}

.shop-list p {
  font-size: 14px;
  line-height: 22px;
  height: 44px;
  overflow: hidden;
  margin-top: 6px;
}

.shop-list .swiper-slide {
  border-bottom: 1px solid #d9d9d9;
}

.shop-list .swiper-button-prev,
.shop-list .swiper-button-next {
  top: auto;
  bottom: 20px;
  width: 18px;
  height: 11px;
}

.shop-list .swiper-button-prev {
  background: url(../images/icon_14.png) no-repeat;
  left: 60px;
}

.shop-list .swiper-button-next {
  background: url(../images/icon_13.png) no-repeat;
  right: 60px;
}

.shop-banner {
  margin-top: 40px;
}

.shop-banner img {
  width: 100%;
}

.shop-banner .swiper-pagination {
  position: static;
  margin-top: 50px;
}

.shop-banner .swiper-pagination .swiper-pagination-bullet {
  margin: 0 8px;
  background: #909091;
  opacity: 1;
}

.shop-banner .swiper-pagination .swiper-pagination-bullet-active {
  background: #fff;
}

.shop-banner .swiper-slide {
  overflow: hidden;
  position: relative;
  cursor: pointer;
}

.shop-banner .swiper-slide i {
  background: url(../images/search1.png) center no-repeat rgba(0, 0, 0, .5);
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: 1s;
}

.shop-banner .swiper-slide:hover i {
  opacity: 1;
}

/*空间案例*/
.zone {
  background: #212123;
  padding: 80px 0;
}

.zone-title {
  font-size: 32px;
  color: #fff;
  padding: 10px 0;
}

.zone-list li {
  width: 49%;
  float: left;
  margin-right: 2%;
  margin-top: 50px;
  overflow: hidden;
  position: relative;
}

.zone-list li:nth-child(2n) {
  margin-right: 0;
}

.zone-list li .img img {
  width: 100%;
}

.zone-list li i {
  background: url(../images/logo.png) no-repeat;
  background-size: cover;
  width: 130px;
  height: 22px;
  position: absolute;
  bottom: 20px;
  left: 20px;
  z-index: 6;
}

.proList .box .i {
  background: url(../images/logo.png) no-repeat;
  background-size: cover;
  width: 130px;
  height: 22px;
  position: absolute;
  bottom: 20px;
  left: 20px;
  z-index: 6;
}

.zone-list li .txt {
  position: absolute;
  bottom: 3px;
  right: 0;
  z-index: 6;
  background: rgba(0, 0, 0, 0);
  width: 190px;
  height: 50px;
  line-height: 50px;
  text-align: center;
  font-size: 14px;
  color: #fff;
  transition: 1s;
}

.zone-list li .txt img {
  vertical-align: middle;
  margin: -3px 0px 0 40px;
  width: 24px;
}

.zone-list li:hover .txt {
  background: rgba(0, 0, 0, .5);
}

/*详情*/
.zoneBox {
  background: rgba(0, 0, 0, .7);
  position: fixed;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  z-index: 666;
  display: none;
}

.zoneBox-con {
  background: #1a1a1a;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  transform: -webkit-translate(-50%, -50%);
  transform: -moz-translate(-50%, -50%);
  width: 90%;
}

.zoneBox-close {
  position: absolute;
  top: 25px;
  right: 30px;
  cursor: pointer;
  opacity: 0.5;
  transition: all .4s;
}

.zoneBox-close:hover {
  opacity: 1;
  transform: rotate(90deg);
}

.zoneBox-banner {
  padding: 80px 160px;
}

.zoneBox-banner img {
  width: 100%;
}

.zoneBox-banner .txt {
  position: absolute;
  bottom: 0;
  left: 0;
  z-index: 4;
  width: 48%;
  padding: 25px 200px 0 2%;
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
}

.zoneBox-banner .txt h2 {
  font-size: 22px;
  font-weight: 400;
}

.zoneBox-banner .txt p {
  font-size: 14px;
  line-height: 26px;
  margin-top: 10px;
}

.zoneBox-banner .swiper-pagination {
  width: 200px;
  bottom: 20px;
  left: 50%;
  color: #fff;
  font-size: 20px;
}

.zoneBox-banner .swiper-button-prev {
  background: url(../images/prev3.png) no-repeat;
  left: 50px;
}

.zoneBox-banner .swiper-button-next {
  background: url(../images/next3.png) no-repeat;
  right: 50px;
}

/*项目分类*/
.classify {
  background: #212123;
  padding: 70px 0 30px;
}

.classify-con {
  max-width: 880px;
  padding: 0 4%;
  margin: 0 auto;
}

.classify-title {
  color: #fff;
  position: relative;
  padding-left: 40px;
}

.classify-title i {
  width: 1px;
  height: 94%;
  background: #fff;
  position: absolute;
  left: 0;
  top: 4%;
}

.classify-title h2 {
  font-size: 32px;
  font-weight: 400;
}

.classify-title p {
  font-size: 14px;
  margin-top: 24px;
}

.classify-pic {
  width: 100%;
  overflow: hidden;
  position: relative;
  margin: 40px 0 100px;
}

.classify-pic a {
  display: block;
}

.classify-pic img {
  width: 100%;
}

.classify-pic i {
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/icon_16.png) no-repeat center;
  transform: rotate(0) scale(0);
  -webkit-transform: rotate(0) scale(0);
  -moz-transform: rotate(0) scale(0);
  transition: all 1s;
  -webkit-transition: all 1s;
  -moz-transition: all 1s;
}

.proClass-slide .img .i {
  width: 100%;
  height: 100%;
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  background: url(../images/icon_16.png) no-repeat center;
  transform: rotate(0) scale(0);
  -webkit-transform: rotate(0) scale(0);
  -moz-transform: rotate(0) scale(0);
  transition: all 1s;
  -webkit-transition: all 1s;
  -moz-transition: all 1s;
}

.classify-pic a:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  transition: all 1s;
}

.proClass-slide .img a:before {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  transition: all 1s;
}

.classify-pic a:hover:before {
  background: rgba(0, 0, 0, .3);
}

.proClass-slide .img a:hover:before {
  background: rgba(0, 0, 0, .3);
}

.classify-pic a:hover i {
  transform: rotate(360deg) scale(1);
  -webkit-transform: rotate(360deg) scale(1);
  -moz-transform: rotate(360deg) scale(1);
}

.proClass-slide .img a:hover .i {
  transform: rotate(360deg) scale(1);
  -webkit-transform: rotate(360deg) scale(1);
  -moz-transform: rotate(360deg) scale(1);
}

/*定制加盟*/
.custom {
  background: #171719;
  padding-bottom: 140px;
}

.custom-title {
  padding-top: 90px;
}

.custom-title h2 {
  font-size: 32px;
  color: #fff;
  font-weight: 400;
  margin-bottom: 20px;
}

.custom-title p {
  font-size: 14px;
  line-height: 26px;
  color: #fff;
}

.custom-nav {
  background: url(../images/img_29.jpg) no-repeat;
  margin-top: 50px;
  width: 100%;
  padding: 130px 0;
  background-size: cover;
}

.custom-nav li {
  width: 20%;
  float: left;
  text-align: center;
  color: #fff;
  position: relative;
}

.custom-nav li:before {
  content: "";
  width: 1px;
  height: 100%;
  background: rgba(255, 255, 255, .4);
  position: absolute;
  top: 0;
  right: 0;
}

.custom-nav li:last-child:before {
  width: 0;
}

.custom-nav li h2 {
  font-size: 20px;
  font-weight: 400;
  margin-top: 60px;
}

.custom-nav li p {
  font-size: 14px;
  margin: 10px;
}

.custom-nav li span {
  display: block;
  font-size: 22px;
  margin-top: 60px;
}

.custom-toggle {
  margin-top: 120px;
}

.custom-toggle li {
  width: 20%;
  float: left;
  overflow: hidden;
  position: relative;
  cursor: pointer;
}

.custom-toggle li img {
  width: 100%;
  transition: all 1s;
}

.custom-toggle li:before {
  content: "";
  width: 5px;
  height: 100%;
  background: #171719;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 9;
}

.custom-toggle li:last-child:before {
  width: 0;
}

.custom-toggle li:hover img {
  transform: scale(1.2);
}

.custom-toggle li p {
  position: absolute;
  bottom: 30px;
  left: 30px;
  font-size: 22px;
  color: #fff;
}

.custom-banner {
  margin-top: 70px;
}

.custom-banner .swiper-slide img {
  width: 100%;
}

.custom-banner .swiper-container .swiper-pagination {
  bottom: 40px;
}

.custom-banner .swiper-container .swiper-pagination .swiper-pagination-bullet {
  background: none;
  border: 1px solid #fff;
  opacity: 1;
  margin: 0 10px;
}

.custom-banner .swiper-container .swiper-pagination .swiper-pagination-bullet-active {
  background: #fff;
}


/************************/
.language {
  position: absolute;
  height: 32px;
  line-height: 32px;
  top: 50%;
  margin-top: -16px;
  right: 0;
  padding-right: 18px;
}

.language-val {
  color: #fff;
  font-size: 16px;
  font-family: "xlt";
}

.language-box {
  position: absolute;
  top: 100%;
  background: #fff;
  width: 80px;
  left: 50%;
  margin-left: -40px;
  display: none;
}

.language .i {
  position: absolute;
  right: 0;
  top: 50%;
  margin-top: -3px;
  background: url("../images/sjx10.png") no-repeat center;
  background-size: cover;
  width: 10px;
  height: 7px;
  transition: all .4s;
}

.language.active .i {
  transform: rotate(180deg);
}

.language-box a {
  display: block;
  text-align: center;
  font-size: 16px;
  font-family: "xlt";
}

.language-box a:hover {
  background: #171719;
  color: #fff;
}

.language a:hover {
  color: #fff;
}

.search-box {
  position: absolute;
  right: 60px;
  top: 50%;
  margin-top: -12px;
  cursor: pointer;
  z-index: 7;
}

.search-btn {
  width: 24px;
  height: 24px;
  border-radius: 24px;
  background: #fff;
  line-height: 24px;
  text-align: center;
  z-index: 5;
  position: relative;
  background: url("../images/search.png") no-repeat center;
  background-size: cover;
}

.search-con {
  position: absolute;
  width: 0;
  right: 0;
  height: 32px;
  top: 59px;
  background: #fff;
  overflow: hidden;
  transition: all .4s;
  border-radius: 32px;
}

.search-con .text {
  display: block;
  height: 32px;
  width: 100%;
  background: none;
  text-indent: 36px;
}

.search-close {
  width: 32px;
  height: 32px;
  position: absolute;
  top: 0;
  left: 2px;
  text-align: center;
  line-height: 32px;
  background: url("../images/close.png") no-repeat center;
  background-size: cover;
}

.search-sb {
  position: absolute;
  right: 5px;
  top: 4px;
  cursor: pointer;
  display: none;
}

.search-box.active .search-con {
  width: 200px;
}

.search-box.active .search-sb {
  display: block;
}

.search-text {
  margin-right: 32px;
}

.search-sb {
  background: url("../images/search-333.png") no-repeat center;
  background-size: cover;
}

.warpNav {
  position: relative;
}

.head-nav {
  margin-right: 100px;
}

.relative {
  position: relative;
}

.circle-svg {
  color: #fff;
  vertical-align: bottom;
  position: absolute;
  left: -1px;
  top: -1px;
}

.circle-svg circle {
  box-sizing: border-box;
  stroke-width: 1px;
  opacity: 0;
}

.swiper-button-prev:hover .circle-svg__circle-1,
.swiper-button-next:hover .circle-svg__circle-1,
.proClass-menu-bot:hover .circle-svg__circle-1 {
  opacity: 1;
  stroke-dasharray: 162;
  animation: str 0.8s linear;
}

@keyframes str {
  0% {
    stroke-dashoffset: 162px;
  }

  100% {
    stroke-dashoffset: 0;
  }
}

.imgshu {
  transform-origin: bottom;
}

.proClass-slide .img a {
  display: inline-block;
  position: relative;
}

.proClass-menu-bot {
  width: 40px;
  height: 40px;
  position: relative;
  border: 1px solid rgba(255, 255, 255, .5);
  border-radius: 100%;
  cursor: pointer;
  transition: all .4s;
  box-sizing: border-box;
  background: url("../images/bottom.png") no-repeat center;
  background-size: cover;
  margin-top: 25px;
}

.copyright-con span,
.copyright-con a {
  display: inline-block;
  color: #fff;
}

/*search s*/
.titlefff h3 {
  color: #fff;
}

.titlefff p {
  color: #fff;
}

.title26 {
  margin-bottom: 40px;
}

.ss-a {
  padding: 150px 0 60px;
}

.ss-a h3 {
  font-family: "dincondregular";
  letter-spacing: 4px;
  text-indent: 4px;
}

.ss-a p {
  font-size: 22px;
}

.ssbox {
  width: 600px;
  margin: 0 auto;
  max-width: 94%;
}

.ssingput {
  border-radius: 6px;
  overflow: hidden;
  margin-right: 100px;
}

.ssingput input {
  display: block;
  width: 100%;
  height: 54px;
  text-indent: 65px;
  font-size: 16px;
}

.sbmint {
  position: absolute;
  right: 0;
  width: 92px;
  height: 100%;
  top: 0;
  background: #000;
  line-height: 54px;
  text-align: center;
  color: #fff;
  font-size: 18px;
  border-radius: 6px;
  cursor: pointer;
}

.ssingput:before {
  position: absolute;
  content: '';
  height: 100%;
  width: 63px;
  background: url("../images/fdj.png") no-repeat center;
  background-size: cover;
  left: 0;
  top: 0;
}

.ssdh {
  border-bottom: 1px solid #666;
}

.ssdh a {
  float: left;
  line-height: 54px;
  position: relative;
  font-size: 18px;
  color: #a2a2a2;
  margin-right: 55px;
}

.ssdh a:after {
  position: absolute;
  width: 100%;
  bottom: 0;
  border-top: 2px solid #fff;
  content: '';
  left: 0;
  display: none;
}

.result {
  margin-bottom: 35px;
}

.ssdh a.active {
  color: #fff;
}

.ssdh a.active:after {
  display: block;
}

.ssdh a:hover {
  color: #fff;
}

.ssdh a:hover:after {
  display: block;
}

.ssjecon {
  padding: 40px 0 80px;
}

/*.conrt{padding: 40px;}*/
.result {
  font-size: 18px;
  color: #aeaeae;
}

.result span {
  color: #fff;
}

.sslb-tabs {
  display: none;
}

.sslb-tabs.active {
  display: block;
}

/*search e*/
.text-center {
  text-align: center;
}

.sslb-tabs .proList {
  padding-top: 50px;
}

.sslb-tabs .news-list {
  padding-top: 50px;
}

/************************/

.ss {
  padding-top: 65px;
}

.ss .c-search-top {}

.yys-list {
  display: flex;
  flex-wrap: wrap;
}

.yys-top {
  border-bottom: 1px solid #c1c1c1;
  padding-bottom: 15px;
  margin-bottom: 20px;
}

.yys-top h3 {
  font-size: 24px;
}

.yys-mid h5 {
  font-size: 18px;
}

.yys-mid p {
  color: #6d6d6d;
  min-height: 3.2em;
  font-size: 14px;
}

.jiao {
  position: absolute;
  width: 0;
  height: 0;
  border: 10px solid #000;
  right: 0;
  bottom: 0;
  border-left-color: transparent;
  border-top-color: transparent;
}

.yys-list li:hover i {
  transform: translateX(10px);
}

.yys-list li {
  width: 32%;
  margin-right: 2%;
  background: #eee;
  padding: 35px;
  box-sizing: border-box;
  margin-top: 2%;
}

.yys-list li:nth-child(3n) {
  margin-right: 0;
}

.yys-list li:nth-child(1) {
  margin-top: 0;
}

.yys-list li:nth-child(2) {
  margin-top: 0;
}

.yys-list li:nth-child(3) {
  margin-top: 0;
}

.yys-top h3 {
  color: #000 !important;
}

/*定制服务 s*/
@font-face {
  font-family: dinblack;
  src: url("../font/dinblack.otf");
}

.dinblack {
  font-family: dinblack;
}

.position-full {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.title-fff * {
  color: #fff;
}

.title60 h2 {
  font-size: 60px;
  font-weight: normal;
}

.des22 p {
  font-size: 22px;
}

.des-fff p {
  color: #fff;
}

.des-w740 {
  width: 740px;
  max-width: 100%;
  margin: 0 auto;
}

.line20 {
  line-height: 2;
}

.mg-bt20 {
  margin-bottom: 20px;
}

.mg-bt30 {
  margin-bottom: 30px;
}

.padding-tb100 {
  padding: 100px 0;
}

.bg-fff {
  background: #fff;
}

.line16 p {
  line-height: 1.6;
}

.title36 h2 {
  font-size: 36px;
  font-weight: normal;
}

.des-title24 h3 {
  font-size: 24px;
  font-weight: normal;
}

.des20 p {
  font-size: 20px;
}

.mg-bt40 {
  margin-bottom: 40px;
}

.img100 img {
  width: 100%;
  vertical-align: bottom;
}

.mg-bt100 {
  margin-bottom: 100px;
}

.gxcsdz {
  display: flex;
  flex-wrap: wrap;
}

.gxcsdz li {
  width: 31%;
  margin-right: 3.5%;
  position: relative;
}

.gxcsdz li:nth-child(3n) {
  margin-right: 0;
}

.gxcsdz-warp {
  padding: 30px;
}

.des-title30 h3 {
  font-size: 30px;
  font-weight: normal;
}

.des18 p {
  font-size: 18px;
}

.line1 {
  line-height: 1;
}

.shehuadz {
  display: flex;
  flex-wrap: wrap;
}

.shehuadz li {
  width: 47%;
  margin-right: 6%;
  position: relative;
}

.shehuadz li:nth-child(2n) {
  margin-right: 0;
}

.shehuadz-con {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  padding: 50px;
  box-sizing: border-box;
}

.gdlgdz {
  display: inline-block;
}

.gdlgdz img {
  height: 15px;
}

.mg-bt10 {
  margin-bottom: 10px;
}

.bg-171719 {
  background: #171719;
}

.padding-t100 {
  padding-top: 100px;
}

.des-bbb p {
  color: #bbb;
}

.des16 p {
  font-size: 16px;
}

.fuwuliucheng {
  display: flex;
  justify-content: space-between;
}

.fuwuliucheng .img100 {
  width: 178px;
  max-width: 100%;
  margin: 0 auto 20px;
}

.fuwuliucheng li {
  text-align: center;
}

.line18 p {
  line-height: 1.8;
}

.arrow-right4 {
  margin-top: 4%;
}

.arrow-right4:last-child {
  display: none;
}

.login-box {
  width: 500px;
  max-width: 92%;
  margin: 0 auto;
}

.lg-logo img {
  height: 48px;
}

.denglu {
  background: #fff;
  line-height: 60px;
  display: block;
  font-size: 18px;
  text-align: center;
  color: #181616;
  border-radius: 60px;
  transition: all .4s;
}

.mg-bt60 {
  margin-bottom: 60px;
}

.login-page {
  border-bottom: 1px solid #999;
}

.login-page:after {
  width: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 2px;
  bottom: -2px;
  background: #fff;
  content: "";
  position: absolute;
  transition: all .4s;
}

.login-page.active:after {
  width: 100%;
}

.login-name {
  position: absolute;
  left: 0;
  top: 0;
  line-height: 60px;
  font-size: 18px;
  color: #fff;
}

.login-input {
  margin-left: 60px;
}

.login-input .text {
  display: block;
  height: 60px;
  width: 100%;
  font-size: 18px;
  background: none;
  color: #fff;
}

.denglu:hover {
  background: #666;
}

.banner99 {
  width: calc(100% - 666px);
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  display: none;
  /* 限制触摸行为：只允许垂直滑动和缩放，防止页面级别的水平滑动 */
  touch-action: pan-y pinch-zoom;
  -ms-touch-action: pan-y pinch-zoom;
}

.banner99.active {
  display: block;
}

.banner99 .swiper1 .img100 {
  height: 100vh;
}

.banner99 .swiper-container {
  height: 100%;
}

/* 轮播图滑动区域 - 允许水平滑动 */
.banner99 .swiper1,
.banner99 .swiper-container {
  /* 允许水平滑动（轮播图需要）和垂直滑动 */
  touch-action: pan-x pan-y pinch-zoom;
  -ms-touch-action: pan-x pan-y pinch-zoom;
}

.banner99-sm {
  position: absolute;
  z-index: 9;
  bottom: 35px;
  width: 100%;
}

.banner99-sm ul {
  display: flex;
  align-items: center;
  margin: 0 100px;
  gap: 1%;
}

.banner99-sm ul li {
  width: 18%;
  cursor: pointer;
  position: relative;
  border: 1px solid transparent;
  display: flex;
}

.banner99-sm ul li:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  transition: all .4s;
}

.banner99-sm ul li.active {
  border-color: #fff;
}

.banner99-sm ul li:hover {
  border-color: #fff;
}

.banner99-sm ul li.active:after {
  opacity: 0;
}

.banner99-sm ul li:hover:after {
  opacity: 0;
}

.customize-box {
  width: 666px;
  position: fixed;
  height: 100%;
  right: 0;
  z-index: 99;
  top: 0;
  background: #0b090a;
  padding: 42px 60px;
  box-sizing: border-box;
  transition: all .4s;
}

.cus-type {
  display: flex;
}

.cus-type li {
  margin-right: 60px;
  position: relative;
  padding-bottom: 15px;
  cursor: pointer;
}

.cus-bot {
  position: absolute;
  width: 100%;
  bottom: 0;
  border-top: 1px solid #242223;
  padding: 20px 60px;
  left: 0;
  text-align: right;
  box-sizing: border-box;
}

.ljbj-style {
  display: inline-block;
  transition: all .4s;
  background: #fff;
  border-radius: 45px;
  padding: 0 30px;
  font-size: 16px;
  color: #000;
}

.ljbj-style span {
  line-height: 45px;
  display: inline-block;
  vertical-align: middle;
}

.ljbj-style img {
  height: 9px;
  display: inline-block;
  vertical-align: middle;
  transition: all .4s;
  margin-left: 8px;
}

.ljbj-style:hover {
  color: #000;
}

.ljbj-style:hover img {
  transform: translateX(8px);
}

.des-808080 p {
  color: #808080;
  transition: all .4s;
}

.cus-type li:after {
  width: 0;
  left: 50%;
  transform: translateX(-50%);
  height: 2px;
  bottom: -2px;
  background: #fff;
  content: "";
  position: absolute;
  transition: all .4s;
}

.cus-type li.active:after {
  width: 100%;
}

.cus-type li.active p {
  color: #fff;
}

.cus-type li:hover:after {
  width: 100%;
}

.cus-type li:hover p {
  color: #fff;
}

.series-page {
  border-bottom: 1px solid #242223;
  padding: 20px 0;
}

.series-page:last-child {
  border-bottom: none;
}

.customize-series {
  position: absolute;
  left: 60px;
  right: 50px;
  top: 190px;
  bottom: 100px;
  overflow: auto;
  padding-right: 10px;
}

.des-title20 h3 {
  font-size: 20px;
  font-weight: normal;
}

.des-title16 h3 {
  font-size: 16px;
  font-weight: normal;
}

.series-list {
  display: flex;
  flex-wrap: wrap;
}

.series-list:last-child {
  margin-bottom: 0;
}

.series-list p {
  font-size: 14px;
  line-height: 1.6;
}

.series-list span {
  font-size: 12px;
  line-height: 1.6;
  color: #b5b5b5;
}

.series-list li {
  width: 23.5%;
  margin-right: 2%;
  margin-bottom: 1.5%;
  margin-top: 1.5%;
  transition: all .4s;
}

.series-list li:nth-child(4n) {
  margin-right: 0;
}

.series-list li .img100 {
  margin-bottom: 5px;
}

.series-list li.active {
  opacity: 1;
}

.series-list li.active img {
  border: 2px solid #fff;
  box-sizing: border-box;
}

.series-list li.hide {
  opacity: 0.5;
}

/* 商品列表中的隐藏商品（用于"更多花色"功能） */
.series-list li.product-hidden {
  display: none !important;
}

/* 禁用的属性选项样式 */
.series-list li.disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.series-list li.disabled a {
  cursor: not-allowed !important;
  pointer-events: none !important;
}

.imgcover {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
  object-fit: cover;
}

.img-45 {
  padding-bottom: 35%;
}

.img-93 {
  padding-bottom: 73%;
}

.customize-series::-webkit-scrollbar {
  width: 6px;
  height: 6px;
}

.customize-series::-webkit-scrollbar-thumb:hover {
  background-color: #929292;
}

.customize-series::-webkit-scrollbar-thumb {
  background-color: #666;
  background-clip: padding-box;
  min-height: 28px;
}

.customize-series::-webkit-scrollbar-track-piece {
  background: #f3f3f3;
}

.num-box {
  display: flex;
  align-items: flex-end;
  margin-top: 20px;
}

.num-box input {
  width: 183px;
  height: 45px;
  background: #3b3b3b;
  color: #fff;
  margin-right: 10px;
  font-size: 14px;
  text-indent: 1em;
}

.num-box span {
  color: #fff;
  font-size: 18px;
}

/*.color-box{display: none;}*/
.color-box.hide {
  display: none;
}

.num-box {
  display: none;
}

.num-box.active {
  display: block;
}

.tab {
  display: none;
}

.tab.active {
  display: block;
}

.dengji img {
  height: 66px;
  display: block;
}

.fixed-style {
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  display: none;
}

.fixed-style.active {
  display: block;
}

.dj89 {
  width: 795px;
  max-width: 92%;
  margin: 0 auto;
  padding: 50px;
  box-sizing: border-box;
}

.dj89-top {
  justify-content: center;
  color: #d58217;
  font-size: 18px;
  align-items: flex-end;
}

.dj89-top span {
  display: inline-block;
}

.dj89-top p {
  font-size: 48px;
  font-family: itc_bk;
  line-height: 1;
  display: inline-block;
}

.des-868686 p {
  color: #868686;
}

.jiagejiaf {
  width: 516px;
  max-width: 100%;
  margin: 0 auto 20px;
  border: 1px solid #cbcbcb;
  border-radius: 20px;
  padding: 20px 50px;
  box-sizing: border-box;
  background: #fff;
  display: flex;
  justify-content: space-around;
  align-items: center;
}

.jiagejiaf span,
.jia545 {
  font-size: 24px;
  color: #000;
  font-family: itc_bk;
}

.sjx {
  margin: 0 auto -1px;
}

.ljbj-style2 {
  border: 1px solid #cbcbcb;
  color: #747374;
}

.ljbj-style2:hover {
  background: #000000;
  color: #fff;
  border-color: #000;
}

.jqbj {
  display: flex;
  gap: 30px;
  justify-content: center;
}

.des-14 p {
  font-size: 14px;
}

.ljbj-style2 {
  min-width: 100px;
  text-align: center;
}

.xx-page {
  border-bottom: 1px solid #bbbbbb;
  margin-bottom: 30px;
}

.xx-name {
  position: absolute;
  left: 0;
  top: 0;
  line-height: 50px;
  font-size: 16px;
}

.xx-input {
  margin-left: 60px;
}

.xx-input .text {
  display: block;
  width: 100%;
  height: 50px;
  font-size: 16px;
  background: none;
}

.xx-page-2 .xx-page {
  width: 47%;
}

.xx-page-3 .xx-page {
  width: 30%;
  margin-right: 5%;
}

.xx-page-3 .xx-page:nth-child(3n) {
  margin-right: 0;
}

.xx-page-select:before {
  position: absolute;
  content: "";
  width: 12px;
  height: 6px;
  background: url("../images/bot.png") no-repeat center;
  background-size: 100% 100%;
  right: 0;
  top: 50%;
  margin-top: -3px;
}

.quan {
  width: 34px;
  height: 28px;
  background: url("../images/quan.png") no-repeat center;
  background-size: 100% 100%;
  position: absolute;
  bottom: 35px;
  right: 100%;
  margin-right: 30px;
  cursor: pointer;
}

body.active .customize-box {
  right: -666px;
}

body.active .quan {
  transform: rotate(180deg);
}

.bg-e7e7e7 {
  background: #e7e7e7;
}

.padding30 {
  padding: 30px;
}

.des-595959 p {
  color: #595959;
}

.grzx-mid-list {
  display: flex;
  align-items: center;
  gap: 100px;
}

.grzx-mid-list li {
  display: flex;
  align-items: center;
}

.grzx-mid-list li img {
  width: 20px;
  margin-right: 10px;
}

.grzx-mid-b {
  display: flex;
  justify-content: space-between;
}

.btn-bg-14 {
  display: inline-block;
  transition: all .4s;
  color: #fff;
  background: #000;
  border-radius: 34px;
  line-height: 34px;
  padding: 0 30px;
  font-size: 14px;
}

.btn-gray-18 {
  display: inline-block;
  transition: all .4s;
  color: #000000;
  background: #e7e7e7;
  border-radius: 56px;
  line-height: 56px;
  padding: 0 30px;
  font-size: 18px;
  min-width: 180px;
  text-align: center;
  box-sizing: border-box;
}

.btn-gray-18.active {
  background: #000;
  color: #fff;
}

.btn-gray-18:hover {
  background: #000;
  color: #fff;
}

.grzx-type {
  display: flex;
  gap: 20px;
}

.chaxun {
  position: absolute;
  right: 0;
  bottom: 0;
  background: #000;
  color: #fff;
  text-align: center;
  width: 108px;
  line-height: 46px;
  font-size: 18px;
}

.grzx-c-con {
  margin-right: 118px;
  display: flex;
  justify-content: space-between;
  gap: 10px;
}

.grzx-cx-page-bot {
  border: 1px solid #b3b3b3;
  position: relative;
}

.grzx-cx-page {
  width: 20%;
}

.grzx-cx-page-bot select {
  display: block;
  width: 100%;
  height: 46px;
  font-size: 16px;
  padding: 0 10px;
  box-sizing: border-box;
}

.grzx-cx-page-bot input {
  display: block;
  width: 100%;
  height: 46px;
  font-size: 16px;
  padding: 0 10px;
  box-sizing: border-box;
}


.font-normal * {
  font-family: arial, helvetica, sans-serif;
}

.grzx-cx-page-time {
  width: 32%;
}

.grzx-content {
  min-height: 300px;
}

.logo589635 {
  filter: brightness(1) invert(1);
}

.header-scroll .logo589635 {
  filter: brightness(0) invert(1);
}

.header-scroll .tuichu {
  filter: brightness(0) invert(1);
}

.tuichu {
  font-size: 18px;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  color: #000 !important;
  display: flex;
  align-items: center;
  gap: 10px;
}

.tuichu img {
  width: 16px;
}

.grzx-mid {
  margin-top: 50px;
}

.table-container {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.table-container table {
  border-collapse: collapse;
  width: 100%;
  min-width: 800px;
}

.table-container th,
.table-container td {
  border: 1px solid #c7c7c7;
  padding: 12px 5px;
  text-align: center;
  font-weight: normal;
  font-size: 14px;
  min-width: 50px;
}

.table-container thead tr:nth-child(1) th {
  font-size: 18px;
  background: #dbdbdb;
}

.table-container th {
  background-color: #f3f3f3;
}

.table-container tr:nth-child(even) {
  background-color: #f9f9f9;
}

.table-container tbody tr:nth-child(even) {
  background: #f5f9fa;
}

.table-container tbody td p {
  font-size: 16px;
}

.table-container tbody td span {
  font-size: 12px;
  color: #929292;
}

.header-group {
  text-align: center;
  background-color: #eee;
}

.quote-btn {
  padding: 4px 8px;
  background-color: #ff9f43;
  color: #fff;
  border: none;
  border-radius: 20px;
  cursor: pointer;
}

.table-container .th-danhao {
  min-width: 140px;
}

.table-container .th-baojia {
  min-width: 70px;
}

.page {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  margin-top: 60px;
  flex-wrap: wrap;
}

.page a {
  transition: all .4s;
}

.pages {
  transition: all .4s;
  font-size: 24px;
  color: #717171;
}

.pages.active {
  color: #000;
}

.pages:hover {
  color: #000;
}

.page-input {
  display: flex;
  align-items: center;
  font-size: 18px;
  gap: 10px;
  margin-left: 20px;
}

.page-input input {
  width: 60px;
  height: 38px;
  border: 1px solid #e2e2e2;
  border-radius: 40px;
  overflow: hidden;
  text-align: center;
  font-size: 24px;
}

.page-btn {
  width: 40px;
  height: 40px;
  border: 1px solid #d0d0d0;
  border-radius: 100%;
}

.page-btn:hover {
  background-color: #000;
  border-color: #000;
}

.page-left {
  background: url("../images/801.png") no-repeat center;
  background-size: 100% 100%;
}

.page-right {
  background: url("../images/802.png") no-repeat center;
  background-size: 100% 100%;
}

.ddzt {
  display: inline-block;
  background: #afcba6;
  color: #fff;
  padding: 4px 10px;
  margin-top: 10px;
  font-size: 16px;
}

.ddzt-cpck {
  background: #a6bbcb;
}

.ddzt-cpwl {
  background: #bda6cb;
}

.ddzt-qrsh {
  background: #f3c066;
}

::-webkit-scrollbar {
  width: 6px;
  height: 10px;
}

::-webkit-scrollbar-thumb:hover {
  background-color: #929292;
}

::-webkit-scrollbar-thumb {
  background-color: #666;
  background-clip: padding-box;
  min-height: 28px;
}

::-webkit-scrollbar-track-piece {
  background: #f3f3f3;
}

.dengpao {
  width: 217px;
  max-width: 100%;
  margin: 0 auto 20px;
}

.guanbi {
  width: 45px;
  height: 45px;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 5;
  background: #bbbbbb url("../images/x.png") no-repeat center;
  background-size: cover;
  cursor: pointer;
  transition: all .4s;
}

.guanbi:hover {
  background-color: #000;
}

.logo15 {
  position: absolute;
  top: 45px;
  left: 40px;
  z-index: 998;
}

.logo15 img {
  display: block;
  height: 15px;
}

.w1440 {
  width: 1440px;
  max-width: 92%;
  margin: 0 auto;
  box-sizing: border-box;
  padding: 0;
}

.div8928598154 {
  position: fixed;
}

/*定制服务 e*/


.slideUp,
.swiper-slide-active .banner-des {
  animation: slideUp 1s both;
  -webkit-animation: slideUp 1s both;
}

@keyframes slideUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(60px);
    transform: translateY(60px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }
}

.slideLeft {
  animation: slideLeft 1s both;
  -webkit-animation: slideLeft 1s both;
}

@keyframes slideLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-60px);
    transform: translateX(-60px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
}

.slideRight {
  animation: slideRight 1s both;
  -webkit-animation: slideRight 1s both;
}

@keyframes slideRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(60px);
    transform: translateX(60px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0px);
    transform: translateX(0px);
  }
}

.tobig {
  animation: tobig 1s both;
  -webkit-animation: tobig 1s both;
}

@keyframes tobig {
  0% {
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
  }

  100% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }
}

@keyframes ping-poiAppearance_pyuvlly {
  0% {
    transform: scale(0.5);
    opacity: 1;
  }

  30% {
    transform: scale(1);
    opacity: 0;
  }
}




@media screen and (max-width:1380px) {
  .foot-nav li {
    margin-right: 30px;
  }

  .home-first .home-pic img {
    display: none;
  }

  .home-first .home-pic .img {
    width: 100%;
    display: block;
    margin: 0;
  }

  .homeZone-left {
    width: 33.8%;
  }

  .homeZone-right {
    width: 65%;
  }

  .proDeatil-center {
    padding: 40px 30px 20px;
  }

  .proDeatil-left .proDeatil-banner {
    padding: 40px 30px 20px;
  }

  .proDeatil-title em {
    display: none;
  }

  .proDeatil-back {
    margin-top: 30px;
  }

  .brand-history .txt {
    width: 32%;
    padding-right: 3%;
  }

  .brand-history .img {
    width: 65%;
  }

  .brand-cell .img {
    width: 60%;
  }

  .brand-cell .box {
    width: 34%;
    padding: 30px 2% 30px 5%;
    top: -30px;
  }
}

@media screen and (max-width:1200px) {
  .head-nav ul li {
    margin: 0 20px;
  }

  .foot-nav {
    display: none;
  }

  .foot-tel {
    display: block;
    text-align: center;
    float: none;
  }
}

@media screen and (max-width:1024px) {
  .moreNav {
    display: block;
    top: 13px;
    right: 0;
  }

  .moreActive span:nth-child(1) {
    -webkit-transform: rotate(45deg);
    transform-origin: top left;
  }

  .moreActive span:nth-child(2) {
    background: none;
  }

  .moreActive span:nth-child(3) {
    -webkit-transform: rotate(-45deg);
    transform-origin: bottom left;
  }

  .warpNav {
    position: fixed;
    top: 70px;
    left: 0;
    bottom: 0;
    background: #000;
    width: 100%;
    display: none;
  }

  .head {
    height: 70px;
  }

  .header-color {
    background: #000;
  }

  .head-logo img {
    height: 24px;
    margin-top: 22px;
  }

  .head-search {
    display: none;
  }

  .head-lang {
    float: none;
    text-align: center;
  }

  .head-nav {
    width: 100%;
    margin-right: 0;
    position: absolute;
    top: 60px;
    bottom: 20px;
    height: auto;
    overflow: auto;
  }

  .head-nav ul li {
    float: none;
    border-bottom: 1px solid #666;
  }

  .head-nav ul li .head-up {
    height: 50px;
    line-height: 50px;
  }

  .head-nav ul li .head-down {
    position: static;
    width: auto;
    margin: 0;
    display: none;
    text-indent: 20px;
    opacity: 1;
    padding-bottom: 10px;
  }

  .head-nav ul li .head-down a {
    text-align: left;
    color: #999;
  }

  .head-nav ul li .head-down {
    transition: none;
  }

  /*.head-nav ul li:hover  .head-down{ display:block;}*/


  .head-nav li.none .nav-yi {
    display: block;
  }

  .head-nav li:after {
    width: 10px;
    height: 10px;
    position: absolute;
    content: '';
    right: 2px;
    top: 20px;
    background: url("../images/phone-arrow.png") no-repeat center;
    background-size: cover;
    display: none;
    transition: all .4s;
  }

  .head-nav li.has:after {
    display: block;
  }

  .head-nav li.on:after {
    transform: rotate(180deg);
  }


  .home-first .home-box .box {
    margin-top: 20px;
  }

  .brand-banner {
    height: 320px;
    width: 100%;
    position: relative;
    overflow: hidden;
  }

  .brand-banner img {
    width: auto;
    height: 100%;
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    -weblit-transform: translateX(-50%);
  }

  .proDeatil-button a {
    padding: 0 3%;
  }

  .proDeatil-button .swiper-button-prev a img {
    left: 4%;
  }

  .proDeatil-button .swiper-button-next a img {
    right: 4%;
  }

  .contact-txt .txt,
  .contact-txt .addre {
    margin-top: 30px;
  }

  .brand-slide .brand-button {
    display: none;
  }

  .brand-slide {
    padding: 40px 0 0;
  }

  .news-title {
    padding-top: 40px;
    font-size: 26px;
  }

  .news-list {
    padding: 30px 0;
  }

  .zoneBox-con {
    width: 96%;
  }

  .pagination {
    margin: 20px auto 0;
  }

  .zoneBox-banner {
    padding: 60px 5%;
  }

  .zoneBox-close {
    top: 10px;
    right: 10px;
  }

  .zoneBox-close img {
    width: 32px;
    height: 32px;
  }

  .search-close {
    display: none;
  }

  .search-sb {
    display: block;
  }

  /*.header-area{margin: 15px 4% 0;position: relative;height: 32px;z-index: 9;}*/
  /*.search-box{top:0;right: 80px;left: 0;margin-top: 0;}*/
  .search-box {
    right: 4%;
    top: 50%;
    margin-right: 100px;
    position: absolute;
    margin-top: -12px;
  }

  .header-style .search-btn {
    background: url(../images/search-333.png) no-repeat center;
    background-size: cover;
  }

  .search-con {
    position: static;
    width: 100%;
    background: #f0f0f0;
    display: none;
  }

  .search-con .text {
    text-indent: 1em;
  }

  .language {
    right: 4%;
    margin-right: 40px;
  }

  .language-bot {
    left: auto;
    right: 0;
    margin-left: 0;
    width: 50px;
  }

  .language-box {
    box-shadow: 0 0 4px #ddd;
    width: 60px;
    margin-left: -30px;
  }

  .header-style .language .i {
    background: url(../images/sjx10-333.png) no-repeat center;
    background-size: cover;
  }

  .header .nav-yi {
    color: #333;
    margin-top: 24px;
  }

  .header .stock span {
    color: #333;
  }

  .header .search-con {
    background: #f0f0f0;
  }

  /*.header .language-val{color: #333;}*/

  .gbss {
    right: 2%;
    top: 10px;
  }

}

@media screen and (max-width:998px) {
  .brand-cell .img {
    width: 100%;
  }

  .brand-cell .box {
    position: static;
    padding: 20px 2%;
    width: 96%;
  }

  .brand-tabs ul li {
    text-align: center;
  }

  .brand-drop .txt {
    margin-top: 20px;
  }

  .brand-drop .txt h2 {
    font-size: 22px;
  }

  .brand-drop .txt p {
    font-size: 14px;
    line-height: 22px;
  }

  .brand-cell {
    padding: 10px 0 30px;
  }
}

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

  /*.w1440{padding:0 4%;}*/
  .foot-text,
  .foot-code {
    display: block;
  }

  .foot-code {
    margin: 0 auto;
    width: 100px;
  }

  .foot-text {
    padding: 0 0 15px;
  }

  .foot-text p {
    font-size: 14px;
  }

  .foot-top {
    padding: 30px 0;
  }

  .homePro-banner .swiper-button-next,
  .homePro-banner .swiper-button-prev {
    display: none;
  }

  .homePro-banner .swiper-slide .box {
    margin: -60px 0 0 30px;
  }

  .homePro-banner .swiper-slide .box img {
    width: 30px;
  }

  .homePro-banner {
    padding-bottom: 30px;
  }

  .homeZone {
    padding: 30px 0;
  }

  .homeJoin img {
    display: none;
  }

  .homeJoin {
    background: url(../images/img_5.jpg) no-repeat;
    background-size: cover;
    padding: 60px 0;
  }

  .homeJoin-box .box .txt p {
    padding: 25px 0 40px;
  }

  .homeJoin-box {
    position: static;
  }

  .proClass-slide .img {
    width: 94%;
    margin: 30px auto;
  }

  .proClass-slide .img img {
    height: auto;
    width: 100%;
  }

  .proList {
    padding: 30px 0 20px;
  }

  .proList .box .txt h2 {
    font-size: 16px;
  }

  .proDeatil-left {
    width: 100%;
  }

  .proDeatil-right {
    width: 100%;
  }

  .proDeatil-slide {
    display: none;
  }

  .proDeatil-title p {
    height: auto;
  }

  .custom-title {
    padding-top: 40px;
  }

  .custom-title h2 {
    font-size: 26px;
  }

  .custom-nav {
    margin-top: 20px;
    padding: 20px 0;
  }

  .custom-toggle {
    margin-top: 40px;
  }

  .custom-banner {
    margin-top: 30px;
  }

  .custom {
    padding-bottom: 40px;
  }

  .custom-toggle li p {
    left: 0;
    bottom: 5%;
    width: 92%;
    padding: 0 4%;
    text-align: center;
    font-size: 14px;
  }

  .custom-nav li h2 {
    font-size: 16px;
    margin-top: 15px;
  }

  .custom-nav li p {
    font-size: 12px;
    margin: 0;
  }

  .custom-nav li span {
    margin-top: 20px;
    display: none;
  }

  .custom-nav li:before {
    width: 0;
  }

  .custom-banner .swiper-container .swiper-pagination {
    bottom: 5%;
  }

  .contact {
    padding: 40px 0;
  }

  .contact-cell .contact-pic {
    display: none;
  }

  .contact-cell .contact-txt {
    padding-right: 0;
  }

  .contact-txt .tit {
    font-size: 20px;
  }

  .contact-txt .txt h2 {
    font-size: 22px;
  }

  .contact-txt .addre h2 {
    font-size: 16px;
  }

  .contact-online-title {
    font-size: 18px;
    padding-bottom: 12px;
  }

  .brand-first {
    padding: 40px 0;
  }

  .brand-title .tit {
    font-size: 26px;
  }

  .brand-title h2 {
    font-size: 22px;
    padding: 10px 0 15px;
  }

  .brand-history {
    margin-top: 30px;
  }

  .brand-slide .swiper-slide .box {
    padding: 10px 2%;
    box-sizing: border-box;
  }

  .brand-slide .swiper-slide .box h2 {
    font-size: 22px;
  }

  .brand-slide .swiper-slide .box p {
    line-height: 22px;
    margin-top: 8px;
  }

  .brand-slide .swiper-slide.swiper-slide-active h2 {
    margin-top: 0;
  }

  .brand-slide .swiper-slide.swiper-slide-active img {
    transform: none !important;
  }

  .zone {
    padding: 40px 0;
  }

  .zone-title {
    font-size: 26px;
  }

  .zone-list li {
    margin-top: 20px;
  }

  .zoneBox-banner .txt {
    position: static;
    width: 100%;
    padding: 12px 0;
  }

  .zoneBox-banner .swiper-pagination {
    position: static;
    width: 100%;
  }

  .zoneBox-banner .txt h2 {
    font-size: 20px;
  }

  .zoneBox-banner .txt p {
    line-height: 22px;
  }

  .zoneBox-banner .swiper-button-prev,
  .zoneBox-banner .swiper-button-next {
    display: none;
  }

  .classify {
    padding: 40px 0 10px;
  }

  .classify-title h2 {
    font-size: 26px;
  }

  .classify-pic {
    margin: 20px auto 50px;
  }

  .classify-title {
    padding-left: 20px;
  }

  .shop-title h2 {
    font-size: 26px;
  }

  .shop-title p {
    font-size: 14px;
  }

  .shop-map {
    margin: 20px auto 40px;
  }

  .shop-list {
    right: 2%;
  }

  .shop-list {
    width: 200px;
  }

  .shop-list .box {
    padding: 18px 2% 24px;
  }

  .shop {
    padding: 40px 0 20px;
  }

  .brand-third {
    padding-top: 80px;
  }

  .homeZone-box .img {
    height: 240px;
  }
}

@media (max-width: 760px) {
  .homePro-banner .swiper-slide .box h2 {
    font-size: 46px;
  }

  .home-first .home-text h2,
  .homePro-title,
  .homeZone-title,
  .homeJoin-box .box .txt h2,
  .brand-title .tit,
  .brand-drop .txt h2,
  .classify-title h2,
  .zone-title,
  .news-title,
  .custom-title h2,
  .c-what {
    font-size: 20px;
  }

  .brand-slide .swiper-slide .box h2,
  .newsDeatil-title h2,
  .shop-title h2 {
    font-size: 18px;
  }

  .homeZone-box h2,
  .brand-title h2 {
    font-size: 16px;
  }

  .homeZone-box p {
    font-size: 14px;
  }

  .box-warp img {
    height: 42px;
  }

  .home-first .home-text p {
    margin-top: 15px;
  }

  .home-first .home-box {
    margin-top: 25px;
  }

  .home-pic {
    position: relative;
    padding-right: 30px;
  }

  .home-first .home-pic .img {
    width: auto;
    max-width: 100%;
  }

  .home-first .home-pic img.imgshu {
    position: absolute;
    display: block;
    right: 0;
    bottom: 4px;
    width: 12px;
  }

  .homePro-banner .swiper-slide .box {
    margin-top: -40px;
  }

  .homePro-banner .swiper-slide .box p {
    font-size: 18px;
    margin-top: 8px;
  }

  .homePro-banner .swiper-pagination {
    box-sizing: border-box;
    padding-right: 4%;
    text-indent: 0;
    bottom: 0;
    text-align: right;
  }

  .home-banner .swiper-container .swiper-pagination {
    bottom: 20px;
  }

  .homeZone-title {
    margin-bottom: 30px;
  }

  .homeJoin-box .box .txt p {
    line-height: 24px;
  }

  .backTop {
    right: 4%;
    width: 38px;
  }

  .brand-history .txt {
    margin-bottom: 15px;
  }

  .brand-third {
    padding-top: 40px;
  }

  .brand-drop .txt h2 {
    padding: 0 0 10px;
  }

  .proClass-menu {
    right: 4%;
    top: auto;
    bottom: 22px;
  }

  .proList .box {
    margin-right: 0;
    width: 100%;
  }

  .proList .box .i,
  .zone-list li i {
    left: 10px;
    bottom: 10px;
  }

  .proDeatil-banner .swiper-container .swiper-pagination {
    bottom: 15px;
  }

  .wap-show {
    display: block;
  }

  .pc-show {
    display: none;
  }

  .proDeatil-title.wap-show {
    padding: 0 4%;
    height: auto;
    min-height: 100%;
    margin-bottom: 25px;
  }

  .proDeatil-left {
    padding-top: 25px;
  }

  .proDeatil-button a h2 {
    line-height: 50px;
  }

  .proDeatil-button .swiper-button-next {
    height: 50px;
  }

  .proDeatil-button .swiper-button-prev {
    height: 50px;
  }

  .proDeatil-button a img {
    width: 20px;
    top: 18px;
  }

  .proDeatil-button a {
    padding: 0 10px;
  }

  .classify-title p {
    margin-top: 8px;
  }

  .zone-list li .txt img {
    margin-left: 10px;
  }

  .zone-list li .txt {
    width: auto;
    padding: 0 20px;
  }

  .zone-title {
    padding-top: 0;
  }

  .newsDeatil-title h2 {
    line-height: 1.5em;
  }

  .newsDeatil-title {
    padding-bottom: 20px;
  }

  .newsDeatil-title p {
    margin-top: 20px;
    font-size: 14px;
  }

  .newsDeatil-title p img {
    height: 15px;
    margin-right: 7px;
  }

  .custom-title {
    padding-top: 25px;
  }

  .c-search-top {
    padding: 50px 0;
  }

  .s-input-box .text {
    height: 60px;
    line-height: 60px;
    font-size: 26px;
  }

  .s-sb {
    width: 60px;
    height: 60px;
  }

  .enter {
    font-size: 14px;
    margin-top: 15px;
    display: none;
  }

  .sslb-tabs .proList {
    padding-top: 0;
  }

  .sslb-tabs .zone-list li:first-child {
    margin-top: 0;
  }

  .sslb-tabs .news-list {
    padding-top: 0;
  }

  .result {
    font-size: 16px;
  }

  .ssjecon {
    padding: 20px 0 30px;
  }

  .ssdh a {
    margin-right: 40px;
  }

  .ss-a {
    padding: 80px 0 30px;
  }

  .ssjg-a a {
    width: 25%;
    text-align: center;
    margin: 0;
    line-height: 50px;
  }

  .ssbox .text {
    height: 44px;
  }

  .ssbox .submit {
    width: 56px;
  }

  .ssingput input {
    font-size: 14px;
    text-indent: 50px;
  }

  .sbmint {
    font-size: 14px;
    line-height: 44px;
  }

  .ssingput:before {
    width: 42px;
  }

  .ss-a p {
    font-size: 18px;
  }

  .title26 {
    margin-bottom: 20px;
  }

  .contact-form .box.box-c2 {
    width: 100%;
    margin-right: 0;
  }

  .ss {
    padding-top: 46px;
  }

  .copyright-con {
    float: none;
    width: auto;
  }

  .beian {
    float: none;
    width: auto;
  }

  .copyright {
    height: auto;
    text-align: center;
    padding-bottom: 15px;
  }

  .yys-list li {
    width: 100%;
    margin-right: 0;
    padding: 20px;
  }

  .yys-list li:nth-child(2) {
    margin-top: 2%;
  }

  .yys-list li:nth-child(3) {
    margin-top: 2%;
  }

  .yys-top h3 {
    font-size: 18px;
  }

  /*定制 s*/
  .mg-bt100 {
    margin-bottom: 50px;
  }

  .mg-bt60 {
    margin-bottom: 30px;
  }

  .mg-bt30 {
    margin-bottom: 15px;
  }

  .title60 h2 {
    font-size: 30px;
  }

  .title36 h2 {
    font-size: 24px;
  }

  .padding-t100 {
    padding-top: 50px;
  }

  .des-title30 h3 {
    font-size: 24px;
  }

  .des22 p {
    font-size: 16px;
  }

  .des18 p {
    font-size: 14px;
  }

  .line20 {
    line-height: 1.6;
  }

  .gxcsdz li,
  .shehuadz li {
    width: 100%;
    margin-bottom: 4%;
  }

  .gxcsdz li:last-child {
    margin-bottom: 0;
  }

  .shehuadz li:last-child {
    margin-bottom: 0;
  }

  .shehuadz li {
    margin-right: 0;
  }

  .shehuadz-con {
    padding: 25px;
  }

  .padding-tb100 {
    padding: 50px 0;
  }

  .fuwuliucheng {
    display: block;
  }

  .fuwuliucheng {
    text-align: center;
  }

  .fuwuliucheng .img100 {
    width: 128px;
  }

  .arrow-right4 {
    transform: rotate(90deg);
    display: inline-block;
    margin: 4% auto;
  }

  .des-title24 h3 {
    font-size: 20px;
  }

  .arrow-right4 img {
    width: 24px;
  }

  .grzx-mid {
    padding-top: 20px;
  }

  .grzx-mid-list {
    display: block;
  }

  .grzx-mid-b {
    display: block;
  }

  .padding30 {
    padding: 15px;
  }

  .grzx-mid-list li {
    margin-bottom: 15px;
  }

  .btn-gray-18 {
    font-size: 16px;
    padding: 0 20px;
    line-height: 40px;
    min-width: 120px;
  }

  .grzx-c-con {
    flex-wrap: wrap;
    margin-right: 0;
    gap: 0;
  }

  .grzx-cx-page {
    width: 49%;
    margin-right: 2%;
    box-sizing: border-box;
    margin-bottom: 20px;
  }

  .grzx-cx-page:nth-child(1) {
    margin-right: 0;
    width: 100%;
  }

  .grzx-cx-page:nth-child(3) {
    margin-right: 0;
  }

  .grzx-cx-page:nth-child(5) {
    margin-right: 0;
  }

  .chaxun {
    position: static;
    display: block;
    width: 100%;
  }

  .jedate {
    max-width: 92%;
  }

  .jedate .jedate-header {
    padding: 0 40px !important;
  }

  .jedate .jedate-pane {
    width: 50% !important;
  }

  .jedate .jedate-header {
    white-space: nowrap;
  }

  .page {
    gap: 15px;
  }

  .pages {
    font-size: 18px;
  }

  .page-btn {
    width: 30px;
    height: 30px;
  }

  .page-input input {
    height: 30px;
  }

  .dengpao {
    width: 100px;
  }

  .dj89 {
    padding: 25px 15px;
  }

  .guanbi {
    width: 32px;
    height: 32px;
  }

  .customize-box {
    position: static;
    width: 92%;
    margin: 0 auto;
    padding: 50px 0;
  }

  .customize-series {
    position: static;
    padding-right: 0;
    padding-bottom: 50px;
  }

  .series-list li {
    width: 32%;
  }

  .series-list li:nth-child(4n) {
    margin-right: 2%;
  }

  .series-list li:nth-child(3n) {
    margin-right: 0;
  }

  .cus-type li {
    margin-right: 30px;
  }

  .div8928598154 {
    position: static;
    overflow: hidden;
  }

  .banner99 {
    position: relative;
    width: 100%;
    height: auto;
    /* 移动端也限制触摸行为：只允许垂直滑动和缩放，防止页面级别的水平滑动 */
    touch-action: pan-y pinch-zoom;
    -ms-touch-action: pan-y pinch-zoom;
  }

  .banner99 .swiper1 .img100 {
    height: 75vw;
  }

  /* 移动端轮播图滑动区域 - 允许水平滑动 */
  .banner99 .swiper1,
  .banner99 .swiper-container {
    /* 允许水平滑动（轮播图需要）和垂直滑动 */
    touch-action: pan-x pan-y pinch-zoom;
    -ms-touch-action: pan-x pan-y pinch-zoom;
  }

  .cus-type {
    margin: 30px 0 20px;
  }

  .cus-bot {
    position: fixed;
    background: #000;
    text-align: center;
    padding: 12px;
  }

  .logo15 {
    top: 15px;
    left: 15px;
  }

  .banner99-sm {
    bottom: 15px;
  }

  .banner99-sm ul {
    margin: 0 15px;
    justify-content: center;
  }

  .series-list span {
    font-size: 11px;
  }

  .series-list p {
    font-size: 13px;
  }

  .des20 p {
    font-size: 18px;
  }

  .jiagejiaf {
    padding: 20px 15px;
  }

  .ljbj-style2 {
    min-width: 70px;
  }

  .jqbj {
    gap: 10px;
  }

  .xx-page-2 .xx-page,
  .xx-page-3 .xx-page {
    width: 100%;
    margin-right: 0;
  }

  .xx-page {
    margin-bottom: 15px;
  }

  .mg-bt40 {
    margin-bottom: 20px;
  }

  /*定制 e*/
}

@media screen and (max-width:540px) {
  .home-banner {
    height: 320px;
    overflow: hidden;
  }

  .home-banner .swiper-container {
    height: 100%;
  }

  .home-banner .swiper-slide img {
    width: auto;
    height: 100%;
  }

  .home-first .home-cell {
    display: block;
  }

  .home-first .home-text {
    display: block;
    width: 100%;
    margin-bottom: 20px;
  }

  .home-first {
    padding: 30px 0;
  }

  .homeZone-left {
    width: 100%;
    margin-bottom: 30px;
  }

  .homeZone-right {
    width: 100%;
  }

  .copyright {
    font-size: 12px;
    line-height: 20px;
  }

  .copyright-con {
    text-align: center;
  }

  .proClass-slide .tit {
    font-size: 30px;
    padding: 50px 0 20px
  }

  .proDeatil-left .proDeatil-banner {
    padding: 20px 4%;
  }

  .proDeatil-button .swiper-button-next,
  .proDeatil-button .swiper-button-prev {
    width: 49%;
  }

  .proDeatil-button a h2 {
    font-size: 16px;
  }

  .proDeatil-button a p {
    font-size: 12px;
  }

  .proDeatil-button {
    margin-top: 20px;
  }

  .custom-nav li {
    width: 48.5%;
    position: relative;
    margin-bottom: 25px;
    text-align: center;
    margin-right: 0;
  }

  .custom-nav li:nth-child(even) {
    margin-right: 0;
  }

  .custom-nav li img {
    display: block;
    margin: 0 auto;
    width: 40px;
  }

  .custom-nav li p {
    margin-top: 5px;
  }

  .custom-toggle li {
    width: 50%;
  }

  .custom-toggle li:nth-child(2):before {
    width: 0;
  }

  .custom-toggle li:nth-child(n+3) {
    width: 33.33%;
  }

  .contact-form .box {
    width: 100%;
    margin-right: 0;
  }

  .contact-form .box input {
    height: 40px;
    line-height: 40px;
  }

  .box-select-text {
    top: 41px;
  }

  .contact-btn {
    margin-top: 20px;
  }

  .contact-btn span {
    float: none;
  }

  .contact-btn a {
    display: block;
    margin: 0 auto;
    float: none;
  }

  .brand-history .txt {
    width: 100%;
    padding-right: 0;
  }

  .brand-history .img {
    width: 100%;
  }

  .brand-history .txt,
  .brand-history .img {
    display: block;
  }

  .brand-history .txt p {
    line-height: 22px;
    margin-bottom: 10px;
  }

  .news-list li {
    width: 49%;
  }

  .news-list li:nth-child(3n) {
    margin-right: 2%;
  }

  .news-list li:nth-child(2n) {
    margin-right: 0;
  }

  .news-list li .box {
    padding: 12px 0 16px;
  }

  .news-list li .box h2 {
    font-size: 14px;
  }

  .news-list li .box p {
    line-height: 20px;
    height: 40px;
    margin-top: 8px;
  }

  .newsDeatil-centent {
    padding: 0 0 20px;
  }

  .newsDeatil {
    padding: 120px 0 20px;
  }

  .newsDeatil-page .box .right {
    width: 150px;
  }

  .zone-list li {
    width: 100%;
    margin-right: 0;
  }

  .shop-map {
    padding: 2%;
  }

  .shop-list {
    position: static;
    width: 100%;
    padding: 0;
  }

  .shop-con .map {
    height: 240px;
  }

  .shop-banner,
  .shop-banner .swiper-pagination {
    margin-top: 20px;
  }

  .home-first .home-box .box {
    text-align: center;
  }

  .news-list li .box p {
    display: none;
  }

  .news-list li .box h2 {
    white-space: normal;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    height: 44px;
    overflow: hidden;
  }

  .news-list li .box .time {
    font-size: 12px;
    margin-top: 10px;
  }

  .proDeatil-button a h2 {
    font-size: 12px;
  }

  .proDeatil-title h2 {
    font-size: 18px;
  }

  .proDeatil-button>div {
    float: none;
    width: 100% !important;
    margin-bottom: 5px;
  }

  .proDeatil-button>div:last-child {
    margin-bottom: 0;
  }

  .proDeatil-button a {
    text-align: left;
    padding-left: 40px;
  }

  .proDeatil-button .swiper-button-prev a img {
    right: auto;
    left: 10px;
  }

  .proDeatil-button .swiper-button-next a img {
    right: auto;
    left: 10px;
  }

  .proDeatil-button a img {
    top: 16px;
  }

  .logo15 img {
    height: 7.5px;
  }
}