.home {

  width: 100%;

  

  overflow: hidden;

  -webkit-perspective: 2000px;

  perspective: 2000px;

  -webkit-transition: all 0.6s;

  transition: all 0.6s;

}

.home .nav {

  color: #37383a;

  vertical-align: baseline;

  position: fixed;

  z-index: 1000;

  height: 100vh;

  transition: all 700ms cubic-bezier(0.645, 0.045, 0.355, 1);

  width: 25%;

  transform: translateX(280px);

  right: -25%;

  top: 0;

}

.home .nav .close {

  position: absolute;

  right: 30%;

  top: 10%;

  cursor: pointer;

}

.home .nav .close img {

  width: 30px;

}

.home .nav ul {

  position: absolute;

  top: 20%;

  overflow: hidden;

  height: 70%;

  margin: 0;

  padding: 0;

  list-style-type: none;

  left: 50px;

  width: calc( 100% - 100px );

  visibility: visible;

  display: flex;

  -ms-flex-direction: column;

  flex-direction: column;

  -ms-flex-pack: start;

  justify-content: flex-start;

  -ms-flex-align: center;

  align-items: center;

  font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;

  font-weight: 300;

  font-style: normal;

  text-transform: none;

  font-size: 31px;

  line-height: 57px;

  letter-spacing: 0;

  color: #a2a2a2;

}

.home .nav ul li {

  -webkit-font-smoothing: antialiased;

  visibility: visible;

  font-family: "Roboto", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;

  font-weight: 300;

  font-style: normal;

  text-transform: none;

  line-height: 57px;

  letter-spacing: 0;

  color: #a2a2a2;

  box-sizing: border-box;

  margin: 0;

  padding: 0;

  border: 0;

  outline: 0;

  font-size: 100%;

  vertical-align: baseline;

  background: transparent;

  margin-bottom: 10px;

  flex: 0 0 auto;

  display: block;

  position: relative;

  text-align: center;

  width: 100%;

  animation-delay: 200ms;

}

.home .nav ul li a {

  position: relative;

  z-index: 1;

  color: rgba(255, 255, 255, 0.5);

  cursor: pointer;

  display: inline-block;

  line-height: inherit;

  font-size: 16px;

  transition: all 600ms;

}

.home .nav ul li a:hover {

  color: white;

}

.home .nav ul .active a {

  color: white;

}

.home .navShow {

  transform: translatex(0px);

  right: 0;

  background-color: black;

}

.home .top {

  position: fixed;

  right: 5%;

  bottom: 10%;

  z-index: 1000;

  cursor: pointer;

  transform: scale(1.5) translateY(40px);

  transition: all 600ms;

  opacity: 0;

}

.home .top i {

  color: #B3B3B3;

  position: absolute;

  left: 50%;

  top: 50%;

  font-size: 15px;

  transition: all 600ms;

  transform: translate(-50%, -55%);

}

.home .top:hover i {

  color: #E5042A;

}

.home .showTop {

  opacity: 1;

  transform: translateY(0) scale(1.5);

}

.home .header {

  width: 100%;

  background-color: #0E1215;

  position: fixed;

  left: 0;

  top: 0;

  z-index: 100;

  transition: all 600ms;

}

.home .header .dom1 {

  width: 80%;

  display: flex;

  flex-direction: row;

  justify-content: space-between;

  margin: 0 auto;

  align-items: center;

  padding: 30px 0;

}

.home .header .dom1 .r {

  display: flex;

  flex-direction: row;

  align-items: center;

  cursor: pointer;

}

.home .header .dom1 .r .lan {

  display: flex;

  flex-direction: row;

  align-items: center;

}



.home .header .dom1 .r .lan p {

  color: white;

}

.home .header .dom1 .r .lan i {

  color: white;

  transform: rotate(-180deg);

}

.home .header .dom1 .r .lines {

  height: 30px;

  width: 20px;

  position: relative;

  margin-left: 10px;

  transform: translateY(3px);

}

.home .header .dom1 .r .lines span {

  display: inline-block;

  height: 1px;

  width: 20px;

  background-color: #fff;

  position: absolute;

  transition: 0.8s;

}

.home .header .dom1 .r .lines span:nth-child(1) {

  top: 5px;

  left: 0;

  animation: long 2s linear infinite;

}

.home .header .dom1 .r .lines span:nth-child(2) {

  left: 0;

  top: 12px;

  width: 15px;

  animation: long 2s linear infinite;

  animation-delay: 400ms;

}

.home .header .dom1 .r .lines span:nth-child(3) {

  left: 0;

  top: 19px;

  width: 10px;

  animation: long 2s linear infinite;

  animation-delay: 600ms;

}

@keyframes long {

  0% {

    width: 0;

  }

  25% {

    width: 10px;

  }

  50% {

    width: 20px;

  }

  75% {

    width: 10px;

  }

  100% {

    width: 0;

  }

}

.home ._311O4 {

  --target-size-w: 100%;

  --target-size-h: 200px;

  --svg-size-w: 100px;

  --svg-size-h: 785px;

  transform: translateX(0px) translateY(0px);

  opacity: 1;

  position: fixed;

  right: 0;

  top: 50%;

  z-index: 1;

}

.home ._311O4 ._3Ndfe {

  display: flex;

  justify-content: center;

  align-items: center;

  position: relative;

  transition: all 600ms;

  overflow: hidden;

}

.home ._311O4 ._3Ndfe ._3eyon {

  font-size: 12px;

  --font-1: "Gotham";

  --color-1: 253,0,78;

  --color-2: 255, 255, 255;

  --color-3: 6, 1, 26;

  --color-4: 14, 18, 67;

  --button-color-1: 253, 0, 78;

  --button-color-2: 255, 255, 255;

  --mask-color: var(--color-3);

  --color-point: var(--color-2);

  --color-outline: var(--color-1);

  --container-min-height: 100vh;

  --header-collapsed-height: 80px;

  --ease-out-elastic: cubic-bezier(1,1.87,.11,.78);

  --ease-in-expo: cubic-bezier(.95, .05, .795, .035);

  --ease-out-expo: cubic-bezier(.19, 1, .22, 1);

  --ease-in-out-expo: cubic-bezier(1, 0, 0, 1);

  --stroke-width: 1.5px;

  color: rgb(var(--color-2));

  --vh: 440px;

  font-family: var(--font-1);

  font-weight: 500;

  font-style: normal;

  pointer-events: none;

  --target-size-w: 100%;

  --target-size-h: 200px;

  --svg-size-w: 100px;

  --svg-size-h: 785px;

  margin: 0;

  box-sizing: border-box;

  -webkit-font-smoothing: antialiased;

  display: flex;

  flex-direction: column;

  position: relative;

  height: var(--target-size-h);

  width: var(--target-size-w);

  -webkit-mask-image: linear-gradient(to bottom, rgba(var(--mask-color), 0) 0%, rgba(var(--mask-color), 1) 0%, rgba(var(--mask-color), 1) 0%, rgba(var(--mask-color), 0) 100%);

}

.home ._311O4 ._3Ndfe ._3eyon ._1Hlt7 {

  position: relative;

  height: 785px;

  width: 100px;

  flex: 1 0 785px;

  transition: all 600ms;

}

.home ._311O4 ._3Ndfe ._3eyon ._1Hlt7 svg {

  height: 100%;

  width: 100%;

  transform: translateY(-400px);

}

.home ._311O4 ._3Ndfe ._3eyon ._1Hlt7 svg path {

  fill: transparent;

  -webkit-transform: translateX(20px);

  transform: translateX(20px);

}

.home ._311O4 ._3Ndfe ._3eyon ._1Hlt7 button {

  --size: 24px;

  position: absolute;

  width: 48px;

  height: 48px;

  display: flex;

  align-items: center;

  justify-content: center;

  will-change: transform;

  cursor: pointer;

  background-color: transparent;

  border: none;

  outline: none;

  z-index: 100;

  pointer-events: all;

  transition: all 100ms;

  left: 20%;

  top: 0;

}

.home ._311O4 ._3Ndfe ._3eyon ._1Hlt7 button .i1a_L {

  height: var(--size);

  width: var(--size);

  border-radius: 100%;

  background-color: #fd004e;

  background-color: rgb(var(--button-color-1));

  will-change: transform;

  pointer-events: none;

}

.home ._311O4 ._3Ndfe ._3eyon ._1Hlt7 button ._1CN0s {

  height: calc(var(--size) + 16px);

  width: calc(var(--size) + 16px);

  border-radius: 100%;

  position: absolute;

  border: 2px solid rgba(253, 0, 78, 0.6);

  border: 2px solid rgba(var(--button-color-1), 0.6);

  pointer-events: none;

  transition: -webkit-transform 0.4s ease-out;

  transition: transform 0.4s ease-out;

  transition: transform 0.4s ease-out, -webkit-transform 0.4s ease-out;

}

.home ._311O4 ._3Ndfe ._3eyon ._1Hlt7 button ._3UJEg {

  height: 10px;

  width: 10px;

  border-radius: 100%;

  position: absolute;

  border: 2px solid white;

  border: 2px solid rgb(var(--button-color-2));

  will-change: transform;

  pointer-events: none;

}

.home .loading {

  width: 100%;

  height: 100vh;

  position: fixed;

  left: 0;

  top: 0;

  z-index: 10000;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  background-color: black;

  transition: all 600ms;

  pointer-events: none;

}

.home .loading .cir {

  width: 350px;

  height: 350px;

  animation: scale 3s linear infinite;

}

.home .loading img {

  position: absolute;

  left: 50%;

  top: 50%;

  transform: translate(-50%, -50%);

}

@keyframes scale {

  0% {

    transform: scale(0.8) rotate(0);

  }

  50% {

    transform: scale(1.1) rotate(360deg);

    opacity: 0.5;

  }

  100% {

    transform: scale(0.8) rotate(360deg);

    opacity: 0;

  }

}

.home .hcon {

  -webkit-transition: 0.6s;

  transition: 0.6s;

  position: relative;

}

.home .hcon .banner {

  width: 100%;

  height: 100vh;

}

.home .hcon .banner .swiper-container {

  width: 100%;

}

.home .hcon .banner .swiper-container .swiper-wrapper {

  width: 100%;

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item {

  width: 100%;

  height: 100vh;

  position: relative;

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item::before {

  content: "";

  display: inline-block;

  position: absolute;

  left: 0;

  top: 0;

  width: 100%;

  height: 100%;

  background-color: rgba(0, 0, 0, 0.3);

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item video {

  width: 100%;

  height: 100vh;

  border: none;

  outline: none;

  object-fit: cover;

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item img {

  width: 100%;

  height: 100vh;

  object-fit: cover;

  display: none;

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text {

  position: absolute;

  left: 15%;

  top: 50%;

  transform: translateY(-50%);

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .p1 {

  color: white;

  font-size: 64px;

  font-family: "b1";

  position: relative;

  padding-bottom: 30px;

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .p1 span {

  display: inline-block;

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .p1 span:nth-of-type(2) {

  animation-delay: 0.05s;

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .p1 span:nth-of-type(3) {

  animation-delay: 0.1s;

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .p1 span:nth-of-type(4) {

  animation-delay: 0.15s;

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .p1 span:nth-of-type(5) {

  animation-delay: 0.2s;

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .p1 span:nth-of-type(6) {

  animation-delay: 0.25s;

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .p1 span:nth-of-type(7) {

  animation-delay: 0.3s;

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .p1 span:nth-of-type(8) {

  animation-delay: 0.35s;

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .p1 span:nth-of-type(9) {

  animation-delay: 0.4s;

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .tag {

  width: 100%;

  margin: 30px 0;

  opacity: 0;

  transition: all 600ms;

  position: relative;

    font-family: "b2";

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .tag::after {

  width: 418px;

  height: 1px;

  background-color: white;

  opacity: 0.1;

  content: "";

  display: inline-block;

  position: absolute;

  left: 0;

  top: -30px;

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .tag::before {

  width: 0;

  height: 1px;

  background-color: #E60027;

  content: "";

  display: inline-block;

  position: absolute;

  left: 0;

  top: -30px;

  transition: all 2s;

}





.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .tag span {

  display: inline-block;

  color: #E4E4E4;

  font-size: 30px;

  margin-right: 30px;

}



.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .tag span:nth-of-type(2){

                    animation-delay: .05s;

                  }



.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide-active .item .text .tag span {

 // animation: revolveScale 1.5s infinite;

}

     @keyframes revolveScale {

                     from {

                      text-shadow: 0 0 10px #fff,

                      0 0 20px #fff,

                      0 0 30px #fff,

                      0 0 40px rgba(103,221,28,1),

                      0 0 70px rgba(103,221,28,1),

                      0 0 80px rgba(103,221,28,1),

                      0 0 100px rgba(103,221,28,1),

                      0 0 150px rgba(103,221,28,1);

                    }

                    to {

                      text-shadow: 0 0 0px #fff,

                      0 0 5px #fff,

                      0 0 10px #fff,

                      0 0 15px rgba(103,221,28,1),

                      0 0 20px rgba(103,221,28,1),

                      0 0 30px rgba(103,221,28,1),

                      0 0 40px rgba(103,221,28,1),

                      0 0 50px rgba(103,221,28,1);

                    }

                  }





.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide-active .item .text .p1 span {

 // animation: leftRight 1.5s forwards;

  animation: revolveScale 1.5s infinite;

}

@keyframes leftRight {

  40% {

    transform: translate(50px, 0) scale(0.7);

    opacity: 1;

    color: rgba(255, 255, 255, 0.5);

  }

  60% {

    color: white;

  }

  80% {

    transform: translate(0) scale(2);

    opacity: 0;

  }

  100% {

    transform: translate(0) scale(1);

    opacity: 1;

  }

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide-active .item .text .tag {

  opacity: 1;

  transform: translateY(0);

}

.home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide-active .item .text .tag::before {

  width: 76px;

}

@-webkit-keyframes type {

  from {

    width: 0;

  }

}

@keyframes type {

  from {

    width: 0;

  }

}

.home .hcon .main {

  width: 100%;

  position: relative;

}

.home_pic{ }
.home .hcon .main .about {

  width: 100%;

 

  background-size: cover;

  padding: 90px 0;

  padding-bottom: 24px;

  position: relative;

}

.home .hcon .main .about .content {

  width: 70%;

  margin: 0 auto;

}

.home .hcon .main .about .content .t1 {

  color: #0e0e0e;

  font-size: 34px;

  font-family: "SOURCEHANSANSCN-MEDIUM";

}

.home .hcon .main .about .content .intro {

  width: 100%;

  padding: 60px 0% 0px 0%;

 

  display: flex;

  flex-direction: row;

  justify-content: space-between;

 

}

 .nums {

  width: 100%;
justify-content: space-between;
	 margin-top: 60px;
}

 .nums .item {

  margin-bottom: 60px;
	
	 float: left; 
	 margin-right: 16.222%;

	 

}
.nums .item .p1 p{ display: inline-block; font-weight: bold;}
.nums .item:nth-of-type(5){ margin-right: 0px;}

 .nums .item .p1 {

  display: flex;

  flex-direction: row;
	 font-size: 60px;
	


}

 .nums .item .p1 p:nth-child(1) {

  color: #004a9d;

  
  font-family: "SairaCondensed-SemiBold";

}

 .nums .item .p1 span {

  color: #004a9d;

  font-size: 18px;

  transform: translateX(10px);

}

 .nums .item .p1 .sp1 {

  font-size: 14px;

}

 .nums .item .p2 {

  color: #444;

  font-size: 16px;

}

.home .hcon .main .about .content .intro .info {

  width: 52%;

  position: relative;

}

.home .hcon .main .about .content .intro .info .st1 {

  color: #B2B2B2;

  font-size: 14px;

}

.home .hcon .main .about .content .intro .info .des {

  color: #0e0e0e;

  font-size: 16px;

  line-height:43px;

  margin: 30px 0;

  width: 90%;

	

}

.home .hcon .main .about .content .intro .info .des p span{ font-weight: bold;}

.home .hcon .main .about .content .factorys {

  width: 100%;

  padding: 0px 0px 30px 0px;

	margin: 0px auto;

  padding-bottom: 0;

  position: relative;
	margin-bottom: 30px; margin-top: 10px;

}

.home .hcon .main .about .content .factorys .swiper-pagination {

  position: absolute;

  left: 0%;

  top: -60px;

  display: flex;

  flex-direction: row;

  width: 80%;

  justify-content: center;

  margin: 0 auto;

}

.home .hcon .main .about .content .factorys .swiper-pagination .swiper-pagination-bullet {

  width: auto;

  display: block;

  position: relative;

  border-radius: 0;

  color: #ffffff;

  opacity: 1;

  font-size: 30px;

  transition: all 600ms;

  background-color: transparent;

  margin: 0 50px;

  padding: 10px 0;

}

.home .hcon .main .about .content .factorys .swiper-pagination .swiper-pagination-bullet::after {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  background-color: white;

  height: 1px;

  display: block;

  width: 0;

  transition: all 600ms;

}

.home .hcon .main .about .content .factorys .swiper-pagination .swiper-pagination-bullet:hover::after {

  width: 100%;

}

.home .hcon .main .about .content .factorys .swiper-pagination .swiper-pagination-bullet-active {

  color: #ffffff;

}

.home .hcon .main .about .content .factorys .swiper-pagination .swiper-pagination-bullet-active::after {

  width: 100%;

}

.home .hcon .main .about .content .factorys .swiper-container {

  width: 100%;

  margin: 0px 0;

}

.home .hcon .main .about .content .factorys .swiper-container .swiper-wrapper {

  width: 100%;

}

.home .hcon .main .about .content .factorys .swiper-container .swiper-wrapper .swiper-slide .item {

  width: 100%;

  display: flex;

  flex-direction: row;

  justify-content: space-between;

}

.home .hcon .main .about .content .factorys .swiper-container .swiper-wrapper .swiper-slide .item .texts {

  width: 80%;

  transition: all 1s;

  margin: 0 auto;

  opacity: 0;

  display: flex;

  justify-content: space-between;

}

.home .hcon .main .about .content .factorys .swiper-container .swiper-wrapper .swiper-slide .item .texts .ap {

  margin-bottom: 30px;

}

.home .hcon .main .about .content .factorys .swiper-container .swiper-wrapper .swiper-slide .item .texts .ap p:nth-child(1) {

  color: #BABABA;

  font-size: 16px;

}

.home .hcon .main .about .content .factorys .swiper-container .swiper-wrapper .swiper-slide .item .texts .ap p:nth-child(2) {

  color: #060606;

  font-size: 20px;

  margin-top: 5px;

}

.home .hcon .main .about .content .factorys .swiper-container .swiper-wrapper .swiper-slide .item .des {

  width: 70%;

  opacity: 0;

  color: #BABABA;

  line-height: 34px;

  transition: all 1s;

  transform: translateX(1000px);

  display: none;

}

.home .hcon .main .about .content .factorys .swiper-container .swiper-wrapper .swiper-slide-active .item .texts, .home .hcon .main .about .content .factorys .swiper-container .swiper-wrapper .swiper-slide-active .item .des {

  transform: translateX(0);

  opacity: 1;

}

.home .hcon .main .about .content .brand {

position: relative;

    width: 90%;

    padding: 50px 5%;

    border-top: 1px solid rgba(255,255,255,.1);

}

.home .hcon .main .about .content .brand .bt {

  color: white;

  font-size: 26px;

  font-family: "uts";

  text-transform: uppercase;

    font-weight: bolder;

}

.home .hcon .main .about .content .brand .pics {

  width: 100%;

  display: flex;

  flex-direction: row;

  align-items: center;

  margin: 60px 0;

}

.home .hcon .main .about .content .brand .pics .swiper-container {

  width: 100%;

}

.home .hcon .main .about .content .brand .pics .swiper-container .swiper-wrapper .swiper-slide {

  padding: 30px 0;

}

.home .hcon .main .about .content .brand .pics .swiper-container .swiper-wrapper .swiper-slide .item {

  text-align: center;

}

.home .hcon .main .about .content .brand .pics .swiper-container .swiper-wrapper .swiper-slide .item img {

  transition: all 600ms;

}

.home .hcon .main .about .content .brand .pics .swiper-container .swiper-wrapper .swiper-slide .item:hover img {

  transform: scale(1.2);

}

.home .hcon .main .about .content .brand .magnet {

  transition: linear 0.15s color;

  touch-action: manipulation;

  text-align: center;

  position: absolute;

  right: 0;

  bottom: 5%;

}

.home .hcon .main .about .content .brand .magnet .magnet_circle {

  transition: all 0.2s linear;

  display: inline-block;

  width: 110px;

  height: 111px;

  background: rgba(255, 255, 255, 0.3);

  border-radius: 50%;

  position: relative;

  cursor: pointer;

  vertical-align: middle;

  font-size: inherit;

}

.home .hcon .main .about .content .brand .magnet .magnet_circle .magnet_arrow {

  -webkit-font-smoothing: antialiased;

  color: inherit;

  pointer-events: none;

  transition: transform 0.2s linear;

  height: 100%;

  width: 100%;

  position: absolute;

  left: 0;

  top: 0;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

}

.home .hcon .main .about .content .brand .magnet .magnet_circle .magnet_arrow p {

  color: white;

  text-align: center;

  font-size: 14px;

}

.home .hcon .main .about .content .brand .magnet .magnet_circle .magnet_arrow i {

  color: white;

  font-size: 20px;

}

.home .hcon .main .about .content .brand .magnet:hover .magnet_circle {

  background-color: black;

  transition: all 0.2s ease-out;

}

.home .hcon .main .products {

  width: 100%;

  animation: polygon 1s linear forwards;

}

@keyframes polygon {

  0% {

    -webkit-clip-path: polygon(0 0, 0 100%, 0 100%, 0 0);

    clip-path: polygon(0 0, 0 100%, 0 100%, 0 0);

    opacity: 0;

  }

  100% {

    -webkit-clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0);

    clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0);

    opacity: 1;

  }

}

.home .hcon .main .products .allPro {

  width: 100%;

  position: relative;

}

.home .hcon .main .products .allPro .pages {

  position: absolute;

  left: 10%;

  bottom: 0;

  display: flex;

  flex-direction: row;

  justify-content: space-between;

  width: 80%;

  z-index: 1000;

  pointer-events: none;

}

.home .hcon .main .products .allPro .pages a {

  width: 12%;

  display: block;

  position: relative;

  border-radius: 0;

  height: 80px;

  color: #848484;

  background-color: transparent !important;

  pointer-events: auto;

  opacity: 1;

  text-align: left;

  font-size: 18px;

  padding: 30px 0;

  transition: all 600ms;

}

.home .hcon .main .products .allPro .pages a::before {

  content: "";

  display: inline-block;

  position: absolute;

  left: 0;

  top: 0;

  width: 174px;

  height: 1px;

  background: #FFFFFF;

  opacity: 0.25;

}

.home .hcon .main .products .allPro .pages a::after {

  content: "";

  display: inline-block;

  position: absolute;

  left: 0;

  top: 0;

  width: 0;

  height: 1px;

  background: #FFFFFF;

  transition: all 600ms;

}

.home .hcon .main .products .allPro .pages a:hover {

  color: white;

}

.home .hcon .main .products .allPro .pages a:hover::after {

  width: 174px;

}

.home .hcon .main .products .allPro .swiper-pagination {

  position: absolute;

  left: 10%;

  bottom: 0;

  display: flex;

  flex-direction: row;

  justify-content: space-between;

  width: 80%;

}

.home .hcon .main .products .allPro .swiper-pagination .swiper-pagination-bullet {

  width: 16.6%;

  display: block;

  position: relative;

  border-radius: 0;

  height: 80px;

  color: #848484;

  background-color: transparent !important;

  opacity: 1;

  text-align: left;

  font-size: 18px;

  padding: 30px 0;

  transition: all 600ms;

}

.home .hcon .main .products .allPro .swiper-pagination .swiper-pagination-bullet::before {

  content: "";

  display: inline-block;

  position: absolute;

  left: 0;

  top: 0;

  width: 174px;

  height: 1px;

  background: #FFFFFF;

  opacity: 0.25;

}

.home .hcon .main .products .allPro .swiper-pagination .swiper-pagination-bullet::after {

  content: "";

  display: inline-block;

  position: absolute;

  left: 0;

  top: 0;

  width: 0;

  height: 1px;

  background: #FFFFFF;

  transition: all 600ms;

}

.home .hcon .main .products .allPro .swiper-pagination .swiper-pagination-bullet:hover {

  color: white;

}

.home .hcon .main .products .allPro .swiper-pagination .swiper-pagination-bullet:hover::after {

  width: 174px;

}

.home .hcon .main .products .allPro .swiper-pagination .swiper-pagination-bullet-active {

  background-color: transparent;

  color: white;

}

.home .hcon .main .products .allPro .swiper-pagination .swiper-pagination-bullet-active::after {

  width: 174px;

}

.home .hcon .main .products .allPro .swiper-container {

  width: 100%;

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper {

  width: 100%;

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item {

  width: 100%;

  position: relative;

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item img {

  width: 100%;

  display: block;

  object-fit: cover;

  transition: all 12s;

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item img:nth-child(2) {

  display: none;

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item canvas {

  position: absolute;

  left: 0;

  top: 0;

  width: 100% !important;

  height: 100% !important;

  z-index: 1000;

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item .nr {

  position: absolute;

  left: 10%;

  top: 25%;

  z-index: 10000;

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item .nr .t1 {

  display: flex;

  flex-direction: row;

  transform: translateY(60px);

  opacity: 0;

  transition: all 1s;

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item .nr .t1 span {

  color: #878787;

  font-size: 26px;

  font-family: "Ubuntu-Medium";

  font-weight: bolder;

  transform: translateY(10px);

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item .nr .t1 p {

  color: white;

  font-size: 42px;

  font-family: "SOURCEHANSANSCN-MEDIUM";

  margin-left: 20px;

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item .nr .btn {

  padding-top: 20px;

  margin: 100px 0 0 20px;

  transform: translateY(80px);

  opacity: 0;

  transition: all 2s;

  transition-delay: 100ms;

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item .nr .btn .magnet {

  transition: linear 0.15s color;

  touch-action: manipulation;

  text-align: center;

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item .nr .btn .magnet .magnet_circle {

  transition: all 0.2s linear;

  display: inline-block;

  width: 110px;

  height: 111px;

  border: 1px solid rgba(255, 255, 255, 0.3);

  border-radius: 50%;

  position: relative;

  cursor: pointer;

  vertical-align: middle;

  font-size: inherit;

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item .nr .btn .magnet .magnet_circle .magnet_arrow {

  -webkit-font-smoothing: antialiased;

  color: inherit;

  pointer-events: none;

  transition: transform 0.2s linear;

  height: 100%;

  width: 100%;

  position: absolute;

  left: 0;

  top: 0;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item .nr .btn .magnet .magnet_circle .magnet_arrow p {

  color: white;

  text-align: center;

  font-size: 14px;

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item .nr .btn .magnet .magnet_circle .magnet_arrow i {

  color: white;

  font-size: 20px;

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item .nr .btn .magnet:hover .magnet_circle {

  transition: all 0.2s ease-out;

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide-active .item img {

  transform: scale(1.05);

}

.home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide-active .item .nr .t1, .home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide-active .item .nr .btn {

  transform: translateY(0);

  opacity: 1;

}

.home .hcon .main .news {

  width: 100%;

  background: url("../images/nbg.png") no-repeat;

  background-size: cover;

  padding: 100px 0;

  position: relative;

  overflow: hidden;

}

.home .hcon .main .news .title {

  width: 70%;

  margin-left: 30%;

  color: #101010;

  font-size: 42px;

  font-family: "SOURCEHANSANSCN-MEDIUM";

  pointer-events: none;

}

.home .hcon .main .news .allNews {

  width: 70vw;

  margin-left: 30vw;

  display: flex;

  flex-direction: row;

  margin-top: 60px;

  cursor: move;

  transition: all 600ms;

  position: relative;

}

.home .hcon .main .news .allNews .swiper-container {

  overflow: visible;

  width: 100%;

}

.home .hcon .main .news .allNews .swiper-container .item {

  display: block;

  width: 100%;

  position: relative;

}

.home .hcon .main .news .allNews .swiper-container .item .pic {

  width: 100%;

  overflow: hidden;

  position: relative;

}

.home .hcon .main .news .allNews .swiper-container .item .pic img {

  width: 100%;

  display: block;

  object-fit: cover;

  transition: all 600ms;

}

.home .hcon .main .news .allNews .swiper-container .item .pic:hover img {

  transform: scale(1.05);

}

.home .hcon .main .news .allNews .swiper-container .item .text {

  display: flex;

  flex-direction: row;

  align-items: center;

  margin-top: 40px;

}

.home .hcon .main .news .allNews .swiper-container .item .text span {

  display: block;

  width: 15%;

  font-size: 12px;

  font-family: "ITCAvantGardeStd-Bk";

  color: #101010;

  transition: all 600ms;

}

.home .hcon .main .news .allNews .swiper-container .item .text p {

  width: 70%;

  color: #101010;

  font-size: 26px;

  transition: all 600ms;

}

.home .hcon .main .news .allNews .prev {

  position: absolute;

  right: 24%;

  top: -109px;

  z-index: 1000;

  cursor: pointer;

}

.home .hcon .main .news .allNews .prev i {

  color: #B3B3B3;

  position: absolute;

  left: 50%;

  font-size: 25px;

  top: 50%;

  transition: all 600ms;

  transform: translate(-50%, -55%) rotate(-90deg);

}

.home .hcon .main .news .allNews .prev:hover i {

  color: #E5042A;

}

.home .hcon .main .news .allNews .next {

  position: absolute;

  right: 18%;

  top: -109px;

  z-index: 1000;

  cursor: pointer;

}

.home .hcon .main .news .allNews .next i {

  color: #B3B3B3;

  position: absolute;

  left: 50%;

  top: 50%;

  font-size: 25px;

  transition: all 600ms;

  transform: translate(-50%, -55%) rotate(90deg);

}

.home .hcon .main .news .allNews .next:hover i {

  color: #E5042A;

}

.home .hcon .foot {

  width: 100%;

  background-color: #1C1D1E;

}

.home .hcon .foot .dom1 {

  width: 80%;

  margin: 0 auto;

  display: flex;

  flex-direction: row;

  justify-content: space-between;

  padding: 60px 0;

}

.home .hcon .foot .dom1 .left {

  width: 15%;

  display: flex;

  flex-direction: column;

  justify-content: space-between;

}

.home .hcon .foot .dom1 .links {

  width: 55%;

  display: flex;

  flex-direction: row;

  justify-content: space-between;

}

.home .hcon .foot .dom1 .links .item p {

  color: white;

  font-weight: 200;

}

.home .hcon .foot .dom1 .links .item .aList {

  margin-top: 50px;

}

.home .hcon .foot .dom1 .links .item .aList a {

  display: block;

  color: #878787;

  font-size: 14px;

  font-weight: 200;

  margin-top: 10px;

  transition: all 600ms;

}

.home .hcon .foot .dom1 .links .item .aList a:hover {

  color: #E60027;

}

.home .hcon .foot .dom1 .address {

  width: 15%;

}

.home .hcon .foot .dom1 .address .item p:nth-child(1) {

  color: white;

  font-size: 14px;

}

.home .hcon .foot .dom1 .address .item p:nth-child(2) {

  color: white;

  font-weight: bolder;

  font-family: "Ubuntu-Medium";

  font-size: 26px;

  margin-top: 30px;

}

.home .hcon .foot .dom1 .address .notice {

  margin-top: 100px;

}

.home .hcon .foot .dom1 .address .notice p {

  color: #878787;

  font-size: 14px;

}

.home .hcon .foot .dom1 .address .notice .icons {

  margin-top: 20px;

}

.home .hcon .foot .dom1 .address .notice .icons i {

  display: inline-block;

  margin-right: 20px;

  color: #AFAFAF;

  font-size: 20px;

  transition: all 600ms;

}

.home .hcon .foot .dom1 .address .notice .icons i:hover {

  color: #E60027;

}

.home .hcon .foot .dom2 {

  width: 80%;

  margin: 0 auto;

  display: flex;

  flex-direction: row;

  justify-content: space-between;

  border-top: 1px solid rgba(255, 255, 255, 0.1);

  padding: 40px 0;

}

.home .hcon .foot .dom2 .l p, .home .hcon .foot .dom2 .l a {

  color: #878787;

  font-size: 14px;

}

.home .hcon .foot .dom2 .r a {

  color: #878787;

  font-size: 14px;

  transition: all 600ms;

}

.home .hcon .foot .dom2 .r a:hover {

  color: #E60027;

}

.home .showPage {

  -webkit-transform: rotateY(30deg);

  transform: rotateY(30deg);

  -webkit-transform-origin: 0 100% 0;

  transform-origin: 0 100% 0;

}

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

  .home .hcon .main .about .content {

    width: 80%;

  }

  .home .hcon .main .about .content .factorys .swiper-container .swiper-wrapper .swiper-slide .item .texts .ap p:nth-child(2) {

    font-size: 20px;

  }

}

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

  .home .header .dom1 {

    width: 90%;

    padding: 15px 0;

  }

  .home .header .dom1 .logo img {

    width: 100px;

  }

  .home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item video {

    display: none;

  }

  .home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item img {

    display: block;

  }

  .home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text {

    left: 10%;

  }

  .home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .p1 {

    font-size: 32px;

  }

  .home .hcon .banner .swiper-container .swiper-wrapper .swiper-slide .item .text .tag span {

    font-size: 16px;

  }

  .home .hcon .main .about {

    padding: 50px 0 0 0;

  }

  .home .hcon .main .about .content {

    width: 90%;

  }

  .home .hcon .main .about .content .t1 {

    font-size: 20px;

  }

  .home .hcon .main .about .content .intro {

    padding: 30px 0;

    width: 100%;

    flex-direction: column-reverse;

    margin: 30px 0;

    margin-bottom: 0;

  }

  .home .hcon .main .about .content .intro .info {

    width: 100%;

  }

  .home .hcon .main .about .content .intro .info .des {

    width: 100%;

    margin: 0;

  }

  .home .hcon .main .about .content .intro .info .brand .pics {

    width: 100%;

    margin: 20px 0;

  }

  .home .hcon .main .about .content .intro .info .magnet {

    display: none;

  }

  .home .hcon .main .about .content .intro .nums {

    width: 100%;

    display: flex;

    flex-direction: row;

    justify-content: space-between;

  }

  .home .hcon .main .about .content .intro .nums .item {

    margin-bottom: 0;

  }

  .home .hcon .main .about .content .intro .nums .item .p1 p:nth-child(1) {

    font-size: 20px;

  }

  .home .hcon .main .about .content .intro .nums .item .p2 {

    font-size: 13px;

  }

  .home .hcon .main .about .content .factorys {

    margin: 30px auto;

    padding: 50px 0;

    margin-bottom: 0;

    width: 100%;

  }

  .home .hcon .main .about .content .factorys .swiper-container {

    margin: 20px 0;

  }

  .home .hcon .main .about .content .factorys .swiper-container .swiper-wrapper .swiper-slide .item {

    flex-direction: column-reverse;

  }

  .home .hcon .main .about .content .factorys .swiper-container .swiper-wrapper .swiper-slide .item .texts {

    width: 100%;

    margin-top: 20px;

flex-direction: column;

  }

  .home .hcon .main .about .content .factorys .swiper-container .swiper-wrapper .swiper-slide .item .des {

    width: 100%;

    font-size: 14px;

  }

  .home .hcon .main .about .content .factorys .swiper-pagination {

    left: 0;

    width: 100%;

    top: -27px;

  }



.home .hcon .main .about .content .factorys .swiper-pagination .swiper-pagination-bullet{

font-size:20px;

margin:0 20px;

}

  .home .hcon .main .about .content .factorys .swiper-pagination .swiper-pagination-bullet {

    transform: translateX(-12px);

  }

  .home .hcon .main .about .content .factorys .swiper-pagination .swiper-pagination-bullet-active {

    transform: scale(1.2) translateX(-12px);

  }

  .home .hcon .main .products .allPro .swiper-pagination {

    display: none;

  }

  .home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item img {

    height: 500px;

    object-fit: cover;

  }

  .home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item canvas {

    display: none;

  }

  .home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item .nr {

    left: 5%;

  }

  .home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item .nr .t1 p {

    font-size: 20px;

  }

  .home .hcon .main .products .allPro .swiper-container .swiper-wrapper .swiper-slide .item .nr .btn .magnet .magnet_circle {

    width: 100px;

    height: 101px;

  }

  .home .hcon .main .news {

    padding: 50px 0;

  }

  .home .hcon .main .news .title {

    width: 90%;

    margin: 0 auto;

    font-size: 24px;

  }

  .home .hcon .main .news .allNews {

    width: 90%;

    margin: 30px auto;

  }

  .home .hcon .main .news .allNews .prev {

    top: -72px;

  }

  .home .hcon .main .news .allNews .next {

    top: -72px;

    right: 5%;

  }

  .home .hcon .main .news .allNews .swiper-container .item .text p {

    font-size: 16px;

  }

  .home .hcon .foot .dom1 {

    flex-direction: column;

    padding: 30px 0;

    text-align: center;

  }

  .home .hcon .foot .dom1 .left {

    width: 100%;

  }

  .home .hcon .foot .dom1 .left .code {

    margin: 15px 0;

  }

  .home .hcon .foot .dom1 .links {

    display: none;

  }

  .home .hcon .foot .dom1 .address {

    width: 100%;

  }

  .home .hcon .foot .dom1 .address .item p:nth-child(2) {

    margin-top: 20px;

  }

  .home .hcon .foot .dom1 .address .notice {

    margin-top: 20px;

  }

  .home .hcon .foot .dom2 {

    flex-direction: column;

    padding: 20px 0;

    width: 90%;

    text-align: center;

    line-height: 30px;

  }

}



/*# sourceMappingURL=index.css.map */

#cnzz_stat_icon_1280119175{

    margin-left: 5px;

}  



@media  screen and (max-width:776px){
	
	.num-change ul li .shuzi p:first-child span{ font-size: 20px;}
	.num-change ul li .shuzi p:last-child{ font-size: 12px;}
	.home .hcon .main .about .content .factorys{ padding: 0px; margin-top: 0px;}
	
}