.animated {
	-webkit-animation-duration: .5s;
	animation-duration: .5s;
	-webkit-animation-fill-mode: both;
	animation-fill-mode: both;
}
  .animated.infinite {
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
  }
  .animated.hinge {
	-webkit-animation-duration: 2s;
	animation-duration: 2s;
  }
  @-webkit-keyframes bounceInRight {
	0%, 100%, 60%, 75%, 90% {
	  -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
	  transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
	}
	0% {
	  opacity: 0;
	  -webkit-transform: translate3d(3000px, 0, 0);
	  transform: translate3d(3000px, 0, 0)
	}
	60% {
	  opacity: 1;
	  -webkit-transform: translate3d(-25px, 0, 0);
	  transform: translate3d(-25px, 0, 0)
	}
	75% {
	  -webkit-transform: translate3d(10px, 0, 0);
	  transform: translate3d(10px, 0, 0)
	}
	90% {
	  -webkit-transform: translate3d(-5px, 0, 0);
	  transform: translate3d(-5px, 0, 0)
	}
	100% {
	  -webkit-transform: none;
	  transform: none
	}
  }
  @keyframes bounceInRight {
	0%, 100%, 60%, 75%, 90% {
	  -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
	  transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
	}
	0% {
	  opacity: 0;
	  -webkit-transform: translate3d(3000px, 0, 0);
	  -ms-transform: translate3d(3000px, 0, 0);
	  transform: translate3d(3000px, 0, 0)
	}
	60% {
	  opacity: 1;
	  -webkit-transform: translate3d(-25px, 0, 0);
	  -ms-transform: translate3d(-25px, 0, 0);
	  transform: translate3d(-25px, 0, 0)
	}
	75% {
	  -webkit-transform: translate3d(10px, 0, 0);
	  -ms-transform: translate3d(10px, 0, 0);
	  transform: translate3d(10px, 0, 0)
	}
	90% {
	  -webkit-transform: translate3d(-5px, 0, 0);
	  -ms-transform: translate3d(-5px, 0, 0);
	  transform: translate3d(-5px, 0, 0)
	}
	100% {
	  -webkit-transform: none;
	  -ms-transform: none;
	  transform: none
	}
  }
  .bounceInRight {
	-webkit-animation-name: bounceInRight;
	animation-name: bounceInRight
  }
  
  @-webkit-keyframes zoomInUp {
	0% {
	  opacity: 0;
	  -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
	  transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
	  -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);
	  animation-timing-function: cubic-bezier(0.55, .055, .675, .19)
	}
	60% {
	  opacity: 1;
	  -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
	  transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
	  -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);
	  animation-timing-function: cubic-bezier(0.175, .885, .32, 1)
	}
  }
  @keyframes zoomInUp {
	0% {
	  opacity: 0;
	  -webkit-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
	  -ms-transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
	  transform: scale3d(.1, .1, .1) translate3d(0, 1000px, 0);
	  -webkit-animation-timing-function: cubic-bezier(0.55, .055, .675, .19);
	  animation-timing-function: cubic-bezier(0.55, .055, .675, .19)
	}
	60% {
	  opacity: 1;
	  -webkit-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
	  -ms-transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
	  transform: scale3d(.475, .475, .475) translate3d(0, -60px, 0);
	  -webkit-animation-timing-function: cubic-bezier(0.175, .885, .32, 1);
	  animation-timing-function: cubic-bezier(0.175, .885, .32, 1)
	}
  }
  .zoomInUp {
	-webkit-animation-name: zoomInUp;
	animation-name: zoomInUp
  }
  
  @-webkit-keyframes bounceInUp {
	0%, 100%, 60%, 75%, 90% {
	  -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
	  transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
	}
	0% {
	  opacity: 0;
	  -webkit-transform: translate3d(0, 3000px, 0);
	  transform: translate3d(0, 3000px, 0)
	}
	60% {
	  opacity: 1;
	  -webkit-transform: translate3d(0, -20px, 0);
	  transform: translate3d(0, -20px, 0)
	}
	75% {
	  -webkit-transform: translate3d(0, 10px, 0);
	  transform: translate3d(0, 10px, 0)
	}
	90% {
	  -webkit-transform: translate3d(0, -5px, 0);
	  transform: translate3d(0, -5px, 0)
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
	  transform: translate3d(0, 0, 0)
	}
  }
  @keyframes bounceInUp {
	0%, 100%, 60%, 75%, 90% {
	  -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
	  transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
	}
	0% {
	  opacity: 0;
	  -webkit-transform: translate3d(0, 3000px, 0);
	  -ms-transform: translate3d(0, 3000px, 0);
	  transform: translate3d(0, 3000px, 0)
	}
	60% {
	  opacity: 1;
	  -webkit-transform: translate3d(0, -20px, 0);
	  -ms-transform: translate3d(0, -20px, 0);
	  transform: translate3d(0, -20px, 0)
	}
	75% {
	  -webkit-transform: translate3d(0, 10px, 0);
	  -ms-transform: translate3d(0, 10px, 0);
	  transform: translate3d(0, 10px, 0)
	}
	90% {
	  -webkit-transform: translate3d(0, -5px, 0);
	  -ms-transform: translate3d(0, -5px, 0);
	  transform: translate3d(0, -5px, 0)
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
	  -ms-transform: translate3d(0, 0, 0);
	  transform: translate3d(0, 0, 0)
	}
  }
  .bounceInUp {
	-webkit-animation-name: bounceInUp;
	animation-name: bounceInUp
  }
  @-webkit-keyframes bounceIn {
	0%, 100%, 20%, 40%, 60%, 80% {
	  -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
	  transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
	}
	0% {
	  opacity: 0;
	  -webkit-transform: scale3d(.3, .3, .3);
	  transform: scale3d(.3, .3, .3)
	}
	20% {
	  -webkit-transform: scale3d(1.1, 1.1, 1.1);
	  transform: scale3d(1.1, 1.1, 1.1)
	}
	40% {
	  -webkit-transform: scale3d(.9, .9, .9);
	  transform: scale3d(.9, .9, .9)
	}
	60% {
	  opacity: 1;
	  -webkit-transform: scale3d(1.03, 1.03, 1.03);
	  transform: scale3d(1.03, 1.03, 1.03)
	}
	80% {
	  -webkit-transform: scale3d(.97, .97, .97);
	  transform: scale3d(.97, .97, .97)
	}
	100% {
	  opacity: 1;
	  -webkit-transform: scale3d(1, 1, 1);
	  transform: scale3d(1, 1, 1)
	}
  }
  @keyframes bounceIn {
	0%, 100%, 20%, 40%, 60%, 80% {
	  -webkit-transition-timing-function: cubic-bezier(0.215, .61, .355, 1);
	  transition-timing-function: cubic-bezier(0.215, .61, .355, 1)
	}
	0% {
	  opacity: 0;
	  -webkit-transform: scale3d(.3, .3, .3);
	  -ms-transform: scale3d(.3, .3, .3);
	  transform: scale3d(.3, .3, .3)
	}
	20% {
	  -webkit-transform: scale3d(1.1, 1.1, 1.1);
	  -ms-transform: scale3d(1.1, 1.1, 1.1);
	  transform: scale3d(1.1, 1.1, 1.1)
	}
	40% {
	  -webkit-transform: scale3d(.9, .9, .9);
	  -ms-transform: scale3d(.9, .9, .9);
	  transform: scale3d(.9, .9, .9)
	}
	60% {
	  opacity: 1;
	  -webkit-transform: scale3d(1.03, 1.03, 1.03);
	  -ms-transform: scale3d(1.03, 1.03, 1.03);
	  transform: scale3d(1.03, 1.03, 1.03)
	}
	80% {
	  -webkit-transform: scale3d(.97, .97, .97);
	  -ms-transform: scale3d(.97, .97, .97);
	  transform: scale3d(.97, .97, .97)
	}
	100% {
	  opacity: 1;
	  -webkit-transform: scale3d(1, 1, 1);
	  -ms-transform: scale3d(1, 1, 1);
	  transform: scale3d(1, 1, 1)
	}
  }
  .bounceIn {
	-webkit-animation-name: bounceIn;
	animation-name: bounceIn
  }
  @-webkit-keyframes zoomIn {
	0% {
	  opacity: 0;
	  -webkit-transform: scale3d(.3, .3, .3);
	  transform: scale3d(.3, .3, .3)
	}
	50% {
	  opacity: 1
	}
  }
  @keyframes zoomIn {
	0% {
	  opacity: 0;
	  -webkit-transform: scale3d(.3, .3, .3);
	  -ms-transform: scale3d(.3, .3, .3);
	  transform: scale3d(.3, .3, .3)
	}
	50% {
	  opacity: 1
	}
  }
  .zoomIn {
	-webkit-animation-name: zoomIn;
	animation-name: zoomIn
  }
  /*the animation definition*/
  @-webkit-keyframes slideInRight {
	0% {
	  -webkit-transform: translate3d(100%, 0, 0);
	  transform: translate3d(100%, 0, 0);
	  visibility: visible
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
	  transform: translate3d(0, 0, 0)
	}
  }
  @keyframes slideInRight {
	0% {
	  -webkit-transform: translate3d(100%, 0, 0);
	  -ms-transform: translate3d(100%, 0, 0);
	  transform: translate3d(100%, 0, 0);
	  visibility: visible
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
	  -ms-transform: translate3d(0, 0, 0);
	  transform: translate3d(0, 0, 0)	;
	  -moz-transform: translate3d(0, 0, 0);
	  -o-transform: translate3d(0, 0, 0);
}
  }
  .slideInRight {
	-webkit-animation-name: slideInRight;
	animation-name: slideInRight
  }
  @-webkit-keyframes slideInDown {
	0% {
	  -webkit-transform: translate3d(0, -100%, 0);
	  transform: translate3d(0, -100%, 0);
	  visibility: visible
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
	  transform: translate3d(0, 0, 0)
	}
  }
  @keyframes slideInDown {
	0% {
	  -webkit-transform: translate3d(0, -100%, 0);
	  -ms-transform: translate3d(0, -100%, 0);
	  transform: translate3d(0, -100%, 0);
	  visibility: visible
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
	  -ms-transform: translate3d(0, 0, 0);
	  transform: translate3d(0, 0, 0)
	}
  }
  .slideInDown {
	-webkit-animation-name: slideInDown;
	animation-name: slideInDown
  }
  
  @-webkit-keyframes flip {
	0% {
	  -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
	  transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
	  -webkit-animation-timing-function: ease-out;
	  animation-timing-function: ease-out
	}
	40% {
	  -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
	  transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
	  -webkit-animation-timing-function: ease-out;
	  animation-timing-function: ease-out
	}
	50% {
	  -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
	  transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
	  -webkit-animation-timing-function: ease-in;
	  animation-timing-function: ease-in
	}
	80% {
	  -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
	  transform: perspective(400px) scale3d(.95, .95, .95);
	  -webkit-animation-timing-function: ease-in;
	  animation-timing-function: ease-in
	}
	100% {
	  -webkit-transform: perspective(400px);
	  transform: perspective(400px);
	  -webkit-animation-timing-function: ease-in;
	  animation-timing-function: ease-in
	}
  }
  @keyframes flip {
	0% {
	  -webkit-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
	  -ms-transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
	  transform: perspective(400px) rotate3d(0, 1, 0, -360deg);
	  -webkit-animation-timing-function: ease-out;
	  animation-timing-function: ease-out
	}
	40% {
	  -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
	  -ms-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
	  transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -190deg);
	  -webkit-animation-timing-function: ease-out;
	  animation-timing-function: ease-out
	}
	50% {
	  -webkit-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
	  -ms-transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
	  transform: perspective(400px) translate3d(0, 0, 150px) rotate3d(0, 1, 0, -170deg);
	  -webkit-animation-timing-function: ease-in;
	  animation-timing-function: ease-in
	}
	80% {
	  -webkit-transform: perspective(400px) scale3d(.95, .95, .95);
	  -ms-transform: perspective(400px) scale3d(.95, .95, .95);
	  transform: perspective(400px) scale3d(.95, .95, .95);
	  -webkit-animation-timing-function: ease-in;
	  animation-timing-function: ease-in
	}
	100% {
	  -webkit-transform: perspective(400px);
	  -ms-transform: perspective(400px);
	  transform: perspective(400px);
	  -webkit-animation-timing-function: ease-in;
	  animation-timing-function: ease-in
	}
  }
  .animated.flip {
	-webkit-backface-visibility: visible;
	-ms-backface-visibility: visible;
	backface-visibility: visible;
	-webkit-animation-name: flip;
	animation-name: flip
  }
  @-webkit-keyframes flipInX {
	0% {
	  -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
	  transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
	  -webkit-transition-timing-function: ease-in;
	  transition-timing-function: ease-in;
	  opacity: 0
	}
	40% {
	  -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
	  transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
	  -webkit-transition-timing-function: ease-in;
	  transition-timing-function: ease-in
	}
	60% {
	  -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
	  transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
	  opacity: 1
	}
	80% {
	  -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
	  transform: perspective(400px) rotate3d(1, 0, 0, -5deg)
	}
	100% {
	  -webkit-transform: perspective(400px);
	  transform: perspective(400px)
	}
  }
  @keyframes flipInX {
	0% {
	  -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
	  -ms-transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
	  transform: perspective(400px) rotate3d(1, 0, 0, 90deg);
	  -webkit-transition-timing-function: ease-in;
	  transition-timing-function: ease-in;
	  opacity: 0
	}
	40% {
	  -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
	  -ms-transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
	  transform: perspective(400px) rotate3d(1, 0, 0, -20deg);
	  -webkit-transition-timing-function: ease-in;
	  transition-timing-function: ease-in
	}
	60% {
	  -webkit-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
	  -ms-transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
	  transform: perspective(400px) rotate3d(1, 0, 0, 10deg);
	  opacity: 1
	}
	80% {
	  -webkit-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
	  -ms-transform: perspective(400px) rotate3d(1, 0, 0, -5deg);
	  transform: perspective(400px) rotate3d(1, 0, 0, -5deg)
	}
	100% {
	  -webkit-transform: perspective(400px);
	  -ms-transform: perspective(400px);
	  transform: perspective(400px)
	}
  }
  .flipInX {
	-webkit-backface-visibility: visible!important;
	-ms-backface-visibility: visible!important;
	backface-visibility: visible!important;
	-webkit-animation-name: flipInX;
	animation-name: flipInX
  }
  
  @-webkit-keyframes pulse {
	0% {
	  -webkit-transform: scale3d(1, 1, 1);
	  transform: scale3d(1, 1, 1)
	}
	50% {
	  -webkit-transform: scale3d(1.05, 1.05, 1.05);
	  transform: scale3d(1.05, 1.05, 1.05)
	}
	100% {
	  -webkit-transform: scale3d(1, 1, 1);
	  transform: scale3d(1, 1, 1)
	}
  }
  @keyframes pulse {
	0% {
	  -webkit-transform: scale3d(1, 1, 1);
	  -ms-transform: scale3d(1, 1, 1);
	  transform: scale3d(1, 1, 1)
	}
	50% {
	  -webkit-transform: scale3d(1.05, 1.05, 1.05);
	  -ms-transform: scale3d(1.05, 1.05, 1.05);
	  transform: scale3d(1.05, 1.05, 1.05)
	}
	100% {
	  -webkit-transform: scale3d(1, 1, 1);
	  -ms-transform: scale3d(1, 1, 1);
	  transform: scale3d(1, 1, 1)
	}
  }
  .pulse {
	-webkit-animation-name: pulse;
	animation-name: pulse
  }
  
  @-webkit-keyframes shake {
	0%, 100% {
	  -webkit-transform: translate3d(0, 0, 0);
	  transform: translate3d(0, 0, 0)
	}
	10%,
	30%,
	50%,
	70%,
	90% {
	  -webkit-transform: translate3d(-10px, 0, 0);
	  transform: translate3d(-10px, 0, 0)
	}
	20%,
	40%,
	60%,
	80% {
	  -webkit-transform: translate3d(10px, 0, 0);
	  transform: translate3d(10px, 0, 0)
	}
  }
  @keyframes shake {
	0%, 100% {
	  -webkit-transform: translate3d(0, 0, 0);
	  -ms-transform: translate3d(0, 0, 0);
	  transform: translate3d(0, 0, 0)
	}
	10%,
	30%,
	50%,
	70%,
	90% {
	  -webkit-transform: translate3d(-10px, 0, 0);
	  -ms-transform: translate3d(-10px, 0, 0);
	  transform: translate3d(-10px, 0, 0)
	}
	20%,
	40%,
	60%,
	80% {
	  -webkit-transform: translate3d(10px, 0, 0)	;
	  -ms-transform: translate3d(10px, 0, 0)	;
	  transform: translate3d(10px, 0, 0)	;
	  -moz-transform: translate3d(10px, 0, 0)	;
	  -o-transform: translate3d(10px, 0, 0)	;
}
  }
  .shake {
	-webkit-animation-name: shake;
	animation-name: shake
  }

  @-webkit-keyframes slideInLeft {
	0% {
	  -webkit-transform: translate3d(-100%, 0, 0);
	  transform: translate3d(-100%, 0, 0);
	  visibility: visible
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
	  transform: translate3d(0, 0, 0)
	}
  }
  @keyframes slideInLeft {
	0% {
	  -webkit-transform: translate3d(-100%, 0, 0);
	  -ms-transform: translate3d(-100%, 0, 0);
	  transform: translate3d(-100%, 0, 0);
	  visibility: visible
	}
	100% {
	  -webkit-transform: translate3d(0, 0, 0);
	  -ms-transform: translate3d(0, 0, 0);
	  transform: translate3d(0, 0, 0)
	}
  }
  .slideInLeft {
	-webkit-animation-name: slideInLeft;
	animation-name: slideInLeft
  }
  
  @-webkit-keyframes fadeIn {
	0% {
	  opacity: 0
	}
	100% {
	  opacity: 1
	}
  }
  @keyframes fadeIn {
	0% {
	  opacity: 0
	}
	100% {
	  opacity: 1
	}
  }
  .fadeIn {
	-webkit-animation-name: fadeIn;
	animation-name: fadeIn
  }  

  @-webkit-keyframes fadeInRight {
	0% {
	  opacity: 0;
	  -webkit-transform: translate3d(100%, 0, 0);
	  transform: translate3d(100%, 0, 0)
	}
	100% {
	  opacity: 1;
	  -webkit-transform: none;
	  transform: none
	}
  }
  @keyframes fadeInRight {
	0% {
	  opacity: 0;
	  -webkit-transform: translate3d(100%, 0, 0);
	  -ms-transform: translate3d(100%, 0, 0);
	  transform: translate3d(100%, 0, 0)
	}
	100% {
	  opacity: 1;
	  -webkit-transform: none;
	  -ms-transform: none;
	  transform: none	;
	  -moz-transform: none;
	  -o-transform: none;
}
  }
  .fadeInRight {
	-webkit-animation-name: fadeInRight;
	animation-name: fadeInRight
  }
  
  
  @-webkit-keyframes fadeInDown {
	0% {
	  opacity: 0;
	  -webkit-transform: translate3d(0, -100%, 0);
	  transform: translate3d(0, -100%, 0)
	}
	100% {
	  opacity: 1;
	  -webkit-transform: none;
	  transform: none
	}
  }
  @keyframes fadeInDown {
	0% {
	  opacity: 0;
	  -webkit-transform: translate3d(0, -100%, 0);
	  -ms-transform: translate3d(0, -100%, 0);
	  transform: translate3d(0, -100%, 0)
	}
	100% {
	  opacity: 1;
	  -webkit-transform: none;
	  -ms-transform: none;
	  transform: none
	}
  }
  .fadeInDown {
	-webkit-animation-name: fadeInDown;
	animation-name: fadeInDown
  }
  
  @-webkit-keyframes rotate {
	0% {
	  -webkit-transform-origin: center;
	  transform-origin: center;
	  -webkit-transform: rotate3d(0, 0, 1, -200deg);
	  transform: rotate3d(0, 0, 1, -200deg)
	}
	100% {
	  -webkit-transform-origin: center;
	  transform-origin: center;
	  -webkit-transform: none;
	  transform: none
	}
  }
  @keyframes rotate {
	0% {
	  -webkit-transform-origin: center;
	  -ms-transform-origin: center;
	  transform-origin: center;
	  -webkit-transform: rotate3d(0, 0, 1, -200deg);
	  -ms-transform: rotate3d(0, 0, 1, -200deg);
	  transform: rotate3d(0, 0, 1, -200deg)
	}
	100% {
	  -webkit-transform-origin: center;
	  -ms-transform-origin: center;
	  transform-origin: center;
	  -webkit-transform: none;
	  -ms-transform: none;
	  transform: none
	}
  }
  .rotate {
	-webkit-animation-name: rotate;
	animation-name: rotate
  }
  
  @-webkit-keyframes tada {
	0% {
	  -webkit-transform: scale3d(1, 1, 1);
	  transform: scale3d(1, 1, 1)
	}
	10%,
	20% {
	  -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
	  transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)
	}
	30%,
	50%,
	70%,
	90% {
	  -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
	  transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
	}
	40%,
	60%,
	80% {
	  -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
	  transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
	}
	100% {
	  -webkit-transform: scale3d(1, 1, 1);
	  transform: scale3d(1, 1, 1)
	}
  }
  @keyframes tada {
	0% {
	  -webkit-transform: scale3d(1, 1, 1);
	  -ms-transform: scale3d(1, 1, 1);
	  transform: scale3d(1, 1, 1)
	}
	10%,
	20% {
	  -webkit-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
	  -ms-transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg);
	  transform: scale3d(.9, .9, .9) rotate3d(0, 0, 1, -3deg)
	}
	30%,
	50%,
	70%,
	90% {
	  -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
	  -ms-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg);
	  transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, 3deg)
	}
	40%,
	60%,
	80% {
	  -webkit-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
	  -ms-transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg);
	  transform: scale3d(1.1, 1.1, 1.1) rotate3d(0, 0, 1, -3deg)
	}
	100% {
	  -webkit-transform: scale3d(1, 1, 1);
	  -ms-transform: scale3d(1, 1, 1);
	  transform: scale3d(1, 1, 1)
	}
  }
  .tada {
	-webkit-animation-name: tada;
	animation-name: tada
  }
  
  .fixed{
	  position: fixed !important;
  }
  .product{
	  position: relative;
	  padding-top: 1px;
  }
  .product-occupy{
	  position: relative;
	  /*width: 100%;
	  height: 65px;*/
  }
  .product-nav{
	  display: none;
	  position: fixed;
	  left: 0;
	  top: 0;
	  z-index: 11;
	  width: 100%;
	  height: 65px;
	  background-color: #222222;
  }
  .product-nav-cnt{
	  width: 900px;
	  padding-top: 15px;
	  padding-bottom: 15px;
	  margin: 0 auto;
	  line-height: 35px;
	  color: #fff;
  }
  .pro-name{
	  font-size: 24px;
  }
  .product-nav-cnt ul{
	  float: right;
	  display: flex;
  }
  .product-nav-cnt li{
	  margin-right: 50px;
	  font-weight: 400;
  }
  .product-nav-cnt li.active{
	  color: #00ff00;
  }
  .buy{
	  float: right;
	  height: 35px;
	  padding: 0 22px;
	  background-color: #00ff00;
	  border-radius: 17.5px;
	  color: #000000;
  }
  .buy:hover, .buy:focus, .buy:link, .buy:active, .buy:visited{
	  color: #000000;
  }
  .cover{
	  position: absolute;
	  left: 0;
	  top: 0;
	  width: 100%;
	  height: 100vh;
	  padding-top: 18vh;
	  text-align: center;
	  overflow: hidden;
  }
  .cover h1{
	  position: relative;
	  z-index: 2;
	  font-size: 2.86vw;
	  line-height: 2.86vw;
  }
  .slogan{
	  position: relative;
	  z-index: 2;
	  display: block;
	  margin-top: 2vh;
	  font-weight: 400;
	  font-size: 1.24vw;
	  color: #999999;
  }
  .btns{
	  position: relative;
	  z-index: 2;
	  margin-top: 3vh;
  }
  .btns a{
	  display: inline-block;
	  min-width: 7.81vw;
	  height: 1.88vw;
	  line-height: 1.78vw;
	  border-radius: 0.91vw;
	  border: solid 0.05vw #00ff00;
	  color: #00ff00;
	  font-weight: 400;
	  font-size: 1.04vw;
  }
  .exhibit-btn{
	  margin-right: 1vw;
  }
  .info-img{
	  margin-top: -3vh;
	  width: 76%;
  }
  .cover-img{
	  width: 45%;
	  position: absolute;
	  left: 27.5%;
	  top: 54vh;
  }
  
  .view-color{
	  display: none;
	  position: absolute;
	  left: 0;
	  top: 0;
	  z-index: 20;
	  width: 100%;
	  height: 100vh;
	  padding-top: 70px;
	  background-color: rgba(0, 0, 0, 0.85);
	  backdrop-filter: blur(5px);
  }
  .view-cls{
	  position: absolute;
	  right: 33%;
	  top: 8vw;
	  width: 2.24vw;
	  height: 2.24vw;
  }
  .product-main .rotate-box,.product-main .img-box{
	  width: 25%;
	  height: 65vh;
	  margin: 0 auto;
	  text-align: center;
	  touch-action: none;
  }
  .product-img .rotate-box,.product-img .img-box{
	  width: 50%;
	  height: 65vh;
	  margin: 0 auto;
	  text-align: center;
	  touch-action: none;
  }
  .img-360{
	  width: 100%;
	  height: 88%;
	  background-repeat: no-repeat;
	  background-size: 100%;
	  background-position: center center;
	  
  }
  .range {
	  -webkit-appearance: none;
	  background: transparent;
	  margin: 0 auto;
	  display: block;
	  width: 100%;
	  border: 0;
	  margin-bottom: 1vw;
  }
  .range:focus {
	  outline: none
  }
  
  .range::-webkit-slider-runnable-track {
	  width: 100%;
	  height: 2px;
	  cursor: pointer;
	  box-shadow: none;
	  background: rgba(255,255,255,.15);
	  border-radius: 0;
	  border: 0
  }
  
  .range:focus::-webkit-slider-runnable-track {
	  background: rgba(255,255,255,.15)
  }
  
  .range::-webkit-slider-thumb {
	  box-shadow: none;
	  border: 0;
	  height: 0.47vw;
	  width: 10%;
	  border-radius: 0.21vw;
	  background: #ffffff;
	  cursor: pointer;
	  -webkit-appearance: none;
	  margin-top: -0.235vw;
  }
  
  .range:focus::-webkit-slider-thumb {
	  outline: 0;
	  outline-offset: 2px
  }
  
  .range::-moz-range-track {
	  width: 100%;
	  height: 2px;
	  cursor: pointer;
	  box-shadow: none;
	  background: rgba(255,255,255,.15);
	  border-radius: 0;
	  border: 0
  }
  
  .range::-moz-range-thumb {
	 box-shadow: none;
	  border: 0;
	  height: 0.47vw;
	  width: 10%;
	  border-radius: 0.21vw;
	  background: #ffffff;
	  cursor: pointer;
	  -webkit-appearance: none;
	  margin-top: -0.235vw;
  }
  
  .range:focus::-moz-range-thumb {
	  outline: 0;
	  outline-offset: 2px
  }
  .img360-info{
	  font-size: 0.83vw;
	  color: #999999;
  }
  .color-list{
	  font-size: 0;
  }
  .color-list a{
	  position: relative;
	  display: inline-block;
	  margin-right: 1vw;
	  background-size: cover;
	  background-repeat: no-repeat;
	  width: 1.6vw;
	  height: 1.6vw;
	  border-radius: 50%;
  }
  .color-list a:last-child{
	  margin-right: 0;
  }
  .color-list a:before{
	  content: '';
	  position: absolute;
	  left: -1px;
	  top: -1px;
	  right: -1px;
	  bottom: -1px;
	  border-radius: 50%;
	  border: 2px solid transparent;
	  transition: all 0.3s;
  }
  .color-list a:after{
	  content: '';
	  position: absolute;
	  z-index: 2;
	  left: -1px;
	  top: -1px;
	  right: -1px;
	  bottom: -1px;
	  border-radius: 50%;
	  border: 1px solid transparent;
	  transition: all 0.3s;
  }
  .black{
	  border: 1px solid #333;
  }
  .color-list a.active:before{
	  border-color: #fff;
  }
  .color-list a.active:after{
	  border-color: #00ff00;
  }
  .color-info{
	  margin-top: 3vh;
	  font-weight: 400;
	  font-size: 0.94vw;
  }
  .basic{
	  position: relative;
	  z-index: 4;
	  margin-top: 100vh;
	  /*background-color: rgba(0, 0, 0, 0.85);
	  backdrop-filter: blur(5px);*/
  }
  .basic-info{
	  position: relative;
	  width: 100%;
	  height: 63vh;
  }
  .basic-box{
	  position: absolute;
	  left: 0;
	  top: 0%;
	  width: 100%;
	  text-align: center;
  }
  .msrp{
	  text-align: center;
	  font-size: 1.25vw;
  }
  .msrp span{
	  color: #00ff00;
  }
  .basic-info p{
	  margin: 3vh auto 0 auto;
	  width: 32%;
	  font-weight: 400;
	  font-size: 0.94vw;
	  line-height: 1.46vw;
  }
  .introduce{
	  position: relative;
	  width: 100%;
	  height: 85vh;
  }
  .introduce ul{
	  display: flex;
	  width: 28%;
	  left: 50%;
	  top: 0;
	  transform: translate3d(-50%, 0%, 0px);
	  flex-wrap: wrap;
	  justify-content: space-between;
  }
  .introduce ul li{
	  width: 40%;
	  margin-bottom: 8vh;
	  font-weight: 400;
	  font-size: 0.94vw;
	  letter-spacing: -0.02vw;
	  text-align: center;
  }
  .introduce ul img{
	  width: 85%;
	  margin-bottom: 2vh;
  }
  .video{
	  position: relative;
	  width: 100%;
	  height: 49vw;
	  font-weight: 400;
	  font-size: 0.94vw;
  }
  .video video{
	  position: absolute;
	  left: 0;
	  top: 0;
	  width: auto;
	  min-width: 100%;
	  height: 100%;
	  overflow: hidden;
	  object-fit: cover;
  }
  .video-box{
	  position: absolute;
	  left: 50%;
	  top: 50%;
	  transform: translate3d(-50%, -50%, 0px);
	  width: 37%;
  }
  .video-box p{
	  font-size: 0.94vw;
	  line-height: 1.46vw;
  }
  .video-play{
	  position: relative;
	  display: inline-block;
	  margin-top: 1.5vw;
	  width: 11.46vw;
	  line-height: 1.78vw;
	  height: 1.88vw;
	  color: #00ff00;
	  border: solid 0.05vw #00ff00;
	  border-radius: 1vw;
  }
  
  .video-play:after{
	  content: '';
	  position: absolute;
	  right: 0;
	  top: 0.39vw;
	  z-index: 2;
	  border: 0.5vw solid transparent;
	  border-left: 0.7vw solid #00ff00;
	  transition: all .3s;
  }
  .video-play:hover:after{
	  border-left-color: #000000;
  }
  
  .highlights{
	  left: 0;
	  bottom: 0;
	  z-index: 2;
  }
  .banner{
	  position: relative;
	  width: 100%;
	  height: 50.52vw;
	  overflow: hidden;
	  background-repeat: no-repeat;
	  background-position: center;
	  background-size: cover;
  }
  .sticky{
	  position: sticky;
	  top: 0;
	  left: 0;
	  width: 100%;
	  height: 100vh;
	  overflow: hidden;
	  padding-top: 65px;
	  background-repeat: no-repeat;
	  background-position: center;
	  background-size: cover;
  }
  .banner-bg{
	  position: absolute;
	  width: 100%;
	  height: 100%;
	  background-repeat: no-repeat;
	  background-position: center;
	  background-size: cover;
  }
  .banner-cnt{
	  position: absolute;
  }
  .banner h3{
	  font-size: 2.08vw;
	  line-height: 2.08vw;
  }
  .banner p{
	  margin-top: 1.2vw;
	  line-height: 1.52vw;
	  font-size: 1.04vw;
	  color: #aaaaaa;
  }
  .product .intro-list{
	  padding: 13vw 7.5%;
	  background-color: #222222;
	  text-align: center;
  }
  .intro-list ul{
	  display: flex;
	  justify-content: space-between;
  }
  .intro-list ul img{
	  width: 100%;
  }
  .intro-list ul li{
	  will-change: transform,opacity;
  }
  .intro-list li span{
	  display: block;
	  margin-top: 1.5vw;
	  font-size: 1.56vw;
	  line-height: 2vw;
  }
  .intro-list p{
	  margin-top: 0.5vw;
	  font-size: 0.94vw;
	  line-height: 1.56vw;
	  color: #a9a9a9;
  }
  .pro-styles{
	  position: relative;
	  width: 100%;
	  height: 300vh;
  }
  .pro-styles li img{
	  width: 100%;
  }
  .banner-fllow{
	  cursor: pointer;
	  height: 100vh;
  }
  .fllow-fixed{
	  width: 100%;
	  height: 100vh;
	  top: 0;
	  left: 0;
	  z-index: 2;
  }
  .banner-fllow .banner-cnt{
	  width: 100%;
	  bottom: 15vh;
	  font-size: 1.56vw;
	  text-align: center;
	  line-height: 2.08vw;
  }
  .ins-tag{
	  color: #00ff00;
  }
  .ins-icon{
	  width: 2.08vw;
	  margin-right: 2%;
  }
  
  .pro-styles h3{
	  margin-top: 5vh;
	  font-size: 2.08vw;
	  text-align: center;
  }
  .pro-styles ul{
	  height: auto;
	  margin: 22vh auto 0 auto;
  }
  .pro-styles li{
	  will-change: transform,opacity;
  }
  .pro-styles li:last-child{
	  opacity: 1 !important;
  }
  .pro-styles li:last-child span{
	  opacity: 1 !important;
  }
  .pro-styles span{
	  display: block;
	  margin-top: 5vh;
	  font-weight: 400;
	  font-size: 0.94vw;
	  color: #aaaaaa;
  }
  .spec{
	  position: relative;
	  z-index: 3;
  }
  .configure{
	  padding: 11vw 0;
	  background-color: #111111;
  }
  .configure h2{
	  text-align: center;
	  font-size: 2.34vw;
  }
  .configure ul{
	  margin: 5vw auto 0 auto;
	  width: 62%;
	  display: flex;
	  flex-wrap: wrap;
  }
  .configure li{
	  width: 25%;
	  padding: 1vw 1.5vw 2.5vw 1.5vw;
	  border-right: 1px solid rgba(277, 277, 277, 0.1);
  }
  .configure li:nth-child(4n){
	  border-right: 0;
  }
  .lastline{
	  border-top: 1px solid rgba(277, 277, 277, 0.1);
  }
  .configure label{
	  display: block;
	  font-size: 0.94vw;
	  font-weight: 400;
	  color: #aaaaaa;
  }
  .configure span{
	  display: block;
	  margin-top: 0.5vw;
	  font-size: 1.04vw;
	  line-height: 1.4vw;
  }
  .pro-fade{
	  position: relative;
	  height: 300vh;
	  background-color: #000;
  }
  .exploded-view{
	  opacity: 0;
  }
  .exploded-box{
	  position: relative;
	  margin: 0 auto;
  }
  .exploded-text{
	  position: absolute;
	  font-weight: 400;
	  font-size: 1.04vw;
	  line-height: 1.04vw;
	  white-space:nowrap;
	  display: flex;
	  transition: opacity .6s ease-out;
	  opacity: 0;
  }
  .exploded-text.left:before,.exploded-text.right:after{
	  margin-top: 0.5vw;
	  margin-left: 0.5vw;
	  height: 0.04vw;
	  width: 4.5vw;
	  border: 0.04vw solid #aaaaaa;
	  content: '';
  }
  .exploded-text.left:before{
	  margin-right: 0.5vw;
	  margin-left: 0;
  }
  .pro-mark ul{
	  position: relative;
	  display: block;
	  height: 200vh;
	  text-align: center;
  }
  .pro-mark li{
	  position: absolute;
	  top: 0;
	  left: 0;
	  height: 100%;
	  padding-top: 12vh;
  }
  .pro-mark h3{
	  margin-bottom: 6vw;
	  font-size: 2.08vw;
	  color: #fdfdfd;
  }
  .swiper-box{
	  position: relative;
	  width: 79%;
	  margin: 0 auto;
	  padding: 0 2.5vw;
  }
  .swiper-box .swiper-container{
	  border-radius: 1.04vw;
  }
  .swiper-box .swiper-button-prev, .swiper-box .swiper-button-next{
	  width: 1.41vw;
	  height: 2.66vw;
	  margin-top: -0.7vw;
	  background-size: cover;
  }
  .swiper-box .swiper-button-prev{
	  left: 0;
	  background-image: url('../../index/pc/r.png');
  }
  .swiper-box  .swiper-button-next{
	  right: 0;
	  background-image: url('../../index/pc/l.png');
  }
  .replacement{
	  top: 0;
	  height:  auto;
	  background-color: #000;
	  margin: 0 auto;
  }
  .replacement-fixed{
	  width: 100%;
	  padding-top: 2vw;
	  top: 0;
	  left: 0;
	  z-index: 2;
  }
  .replacement h3{
	  margin-bottom: 5vw;
	  font-size: 2.08vw;
	  color: #ffffff;
	  text-align: center;
  }
  .replacement li{
	  width: 46%;
	  margin-right: 4%;
	  margin: 0 auto;
	  background-color: #ffffff;
	  border-radius: 1.04vw;
  }
  .replacement img{
	  float: left;
	  width: 14.58vw;
	  background-color: #f0f0f0;
	  margin-right: 1.5vw;
	  border-radius: 1.04vw 0 0 1.04vw;
  }
  .replacement span{
	  display: block;
	  margin-top: 2.5vw;
	  font-size: 1.56vw;
	  color: #1f1f33;
  }
  .view-more{
	  position: relative;
	  z-index: 2;
	  float: left;
	  margin-top: 5vw;
	  width: 9.43vw;
	  height: 3.18vw;
	  text-align: center;
	  line-height: 3.18vw;
	  background-color: #000000;
	  border-radius: 1.56vw;
	  font-size: 1.04vw;
	  color: #00ff00;
	  border: 0;
  }
  .view-more:visited{
	  color: #00ff00;
  }
  .view-more:hover{
	  color: #000;
  }
  .view-more:before{
	  border-radius: 1.56vw;
  }
  .inthebox{
	  position: relative;
	  z-index: 3;
	  padding: 11vw 0 12vw 0;
	  background-color: #000000;
  }
  .inthebox h2{
	  margin-bottom: 5vw;
	  font-size: 2.34vw;
	  text-align: center;
  }
  .inthebox li{
	  position: relative;
	  min-height: 20.89vw;
	  padding: 0;
	  background-color: #f0f0f0;
	  border-radius: 1.04vw;
	  vertical-align: middle;
  }
  .inthebox li img{
	  position: absolute;
	  width: 55%;
	  top: 50%;
	  left: 5%;
	  transform: translate3d(0, -50%, 0px);
  }
  .inthebox-info{
	  float: right;
	  width: 35%;
	  height: 22.69vw;
	  padding: 1.6vw 2vw 1.6vw 2vw;
	  background-color: #fff;
	  border-left: none;
  }
  .inthebox-info h3{
	  font-size: 1.56vw;
	  color: #000000;
  }
  .inthebox-info p{
	  font-weight: 400;
	  line-height: 1.56vw;
	  font-size: 0.94vw;
	  color: #666666;
	  margin-top: 1.2vw;
  }
  @media screen and (min-width: 1024px){
	  .color-choose{
		  width: 59vw;
		  margin: 8vw auto;
		  display: flex;
		  justify-content: space-between;
	  }
	  .color-left{
		  width: 21vw;
		  text-align: left;
	  }
	  .color-left-top{
		  padding-top: 3vw;
		  padding-left: 2vw;
		  width: 100%;
		  height: 20.57vw;
		  background-color: #222222;
		  border-radius: 1.56vw;
	  }
	  .c-label{
		  display: block;
		  font-size: 1.25vw;
		  font-weight: 400;
		  color: #cccccc;
	  }
	  .c-value{
		  display: block;
		  margin-top: 0.5vw;
		  width: 100%;
		  font-size: 2vw;
		  line-height: 2.71vw;
		  font-weight: 600;
	  }
	  .p-name{
		  margin-top: 1.3vw;
		  margin-bottom: 0.8vw;
		  display: block;
		  font-weight: 400;
		  font-size: 0.94vw;
		  color: #cccccc;
	  }
	  .color-left .color-list{
		  width: 100%;
	  }
	  .pro-marp{
		  margin-top: 1.88vw;
		  padding-top: 2vw;
		  padding-left: 2vw;
		  width: 100%;
		  height: 11.15vw;
		  background-color: #222222;
		  border-radius: 1.56vw;
	  }
	  .pro-marp label{
		  font-size: 1.25vw;
		  color: #cccccc;
		  font-weight: 400;
	  }
	  .pro-marp span{
		  display: block;
		  margin-top: 0.5vw;
		  font-size: 2.5vw;
		  font-weight: 600;
	  }
  
	  .color-right{
		  width: 34vw;
		  height: 33.65vw;
		  background-color: #222222;
		  border-radius: 1.56vw;
	  }
	  .color-right img{
		  width: 100%;
		  object-fit: cover;
	  }
	  @keyframes bigIn {
		  0% {
			  opacity: 0;
			  transform: scale3d(4,4,4);
		  }
  
		  100% {
			  opacity: 1;
			  transform: scale3d(1,1,1);
		  }
	  }
	  .bigIn {
		  -webkit-animation-name: bigIn;
		  animation-name: bigIn
	  }
	  .intro-list .row-x-3{
		  width: 22%;
	  }
	  .intro-list .row-x-4{
		  width: 31%;
	  }
	  .intro-list .row-x-6{
		  width: 47%;
	  }
	  .specifications{
		  position: relative;
		  height: 100vh;
		  background-color: #111111;
	  }
	  .specifications h2 {
		  margin-top: 14vh;
		  text-align: center;
		  font-size: 2.34vw;
	  }
	  .spec-box{
		  margin: 10vh auto 0 auto;
		  position: relative;
		  overflow: hidden;
		  list-style: none;
		  padding-left: 13.5%;
	  }
	  .spec-cnt{
		  position: relative;
		  width: 100%;
		  height: 100%;
		  display: flex;
		  transition-property: transform,-webkit-transform;
	  }
	  .spec-img{
		  flex-shrink: 0;
		  width: 26%;
		  padding: 1vh 0;
		  background-color: #222222;
		  border-radius: 1.04vw;
		  text-align: center;
		  transition-property: transform,-webkit-transform;
	  }
	  .spec-img img{
		  height: 40vh;
	  }
	  .spec-info{
		  transition-property: transform,-webkit-transform;
	  }
	  .spec-info ul{
		  display: flex;
	  }
	  .spec-info li{
		  width: 23vw;
		  flex-shrink: 0;
		  margin-left: 1.82vw;
	  }
	  .spec-info li>div{
		  width: 100%;
		  height: 19vh;
		  margin-bottom: 4vh;
		  padding: 1vw 1.5vw 2.5vw 1.5vw;
		  background-color: #222222;
		  border-radius: 1.04vw;
	  }
	  .spec-info li>div:last-child{
		  margin-bottom: 0;
	  }
	  .spec-info li label{
		  display: block;
		  font-weight: 400;
		  color: #999999;
		  font-size: 0.94vw;
	  }
	  .spec-info li span{
		  display: block;
		  margin-top: 0.5vw;
		  font-size: 1.25vw;
		  font-weight: 600;
	  }
  }
  @media screen and (max-width: 1023px){
	  .color-choose{
		  width: 100%;
		  padding: 0.85rem 0.3rem;
		  display: flex;
		  justify-content: space-between;
	  }
	  .color-left{
		  width: 55%;
		  text-align: left;
	  }
	  .color-left-top{
		  padding-top: 0.3rem;
		  padding-left: 0.3rem;
		  width: 100%;
		  height: 3.95rem;
		  background-color: #222222;
		  border-radius: 0.3rem;
	  }
	  .c-label{
		  display: block;
		  font-size: 0.24rem;
		  font-weight: 400;
		  color: #cccccc;
	  }
	  .c-value{
		  display: block;
		  margin-top: 0.1rem;
		  font-size: 0.4rem;
		  line-height: 0.5rem;
		  font-weight: 600;
	  }
	  .p-name{
		  margin-top: 0.25rem;
		  margin-bottom: 0.15rem;
		  display: block;
		  font-weight: 400;
		  font-size: 0.24rem;
		  color: #cccccc;
	  }
	  .color-left .color-list{
		  width: 100%;
	  }
	  .color-left .color-list a{
		  width: 0.3rem;
		  height: 0.3rem;
		  margin-right: 0.16rem;
	  }
	  .pro-marp{
		  margin-top: 0.36rem;
		  padding-top: 0.3rem;
		  padding-left: 0.3rem;
		  width: 100%;
		  height: 2.14rem;
		  background-color: #222222;
		  border-radius: 0.3rem;
	  }
	  .pro-marp label{
		  font-size: 0.24rem;
		  color: #cccccc;
		  font-weight: 400;
	  }
	  .pro-marp span{
		  display: block;
		  margin-top: 0.2rem;
		  font-size: 0.48rem;
		  font-weight: 600;
	  }
  
	  .color-right{
		  width: 35%;
		  height: 6.45rem;
		  overflow: hidden;
	  }
	  .color-right img{
		  width: 280%;
		  margin-left: -94%;
		  object-fit: cover;
		  max-width: none;
	  }
	  .product{
		  padding: 0.88rem 0;
	  }
	  .mask{
		  cursor: pointer;
		  z-index: 5;
	  }
	  .product-nav{
		  height: 1.2rem;
	  }
	  .product-nav-cnt{
		  padding: 0.35rem 0.3rem;
	  }
	  .pro-name{
		  display: inline-block;
		  width: 80%;
		  font-size: 0.36rem;
		  cursor: pointer;
	  }
	  .pro-name:after{
		  float: right;
		  margin-top: 0.14rem;
		  width: 0.4rem;
		  height: 0.22rem;
		  background: url('../../com/arrow.png') no-repeat 0 0 / 0.8rem 0.22rem;
		  content: '';
	  }
	  .pro-name.active:after{
		  background-position: -0.4rem 0;
	  }
	  .product-nav-cnt{
		  width: 100%;
		  line-height: 0.5rem;
	  }
	  .product-nav-cnt ul{
		  position: absolute;
		  left: 0;
		  top: 1.2rem;
		  display: block;
		  width: 100%;
		  padding: 0 0.3rem;
		  background-color: #222222;
		  border-top: 0.03rem solid #333333;
		  border-radius: 0 0 0.3rem 0.3rem;
		  display: none;
	  }
	  .product-nav-cnt li{
		  margin: 0;
		  height: 1rem;
		  line-height: 0.985rem;
		  padding: 0 0.02rem;
		  border-bottom: 0.03rem solid #333333;
		  font-size: 0.24rem;
		  color: #aaaaaa;
	  }
	  .product-nav-cnt li:last-child{
		  border-bottom: 0;
	  }
	  .buy{
		  padding: 0 0.34rem;
		  height: 0.5rem;
		  line-height: 0.5rem;
		  font-size: 0.24rem;
		  border-radius: 0.25rem;
	  }
	  .cover{
		  position: static;
		  padding: 0;
		  height: 11rem;
	  }
	  .cover h1{
		  font-size: 0.45rem;
		  line-height: 0.45rem;
	  }
	  .slogan{
		  margin-top: 0.28rem;
		  font-size: 0.24rem;
	  }
	  .btns{
		  margin-top: 0.35rem;
	  }
	  .btns a{
		  min-width: 2rem;
		  height: 0.5rem;
		  line-height: 0.48rem;
		  border-width: 0.01rem;
		  font-size: 0.24rem;
		  border-radius: 0.25rem;
	  }
	  .exhibit-btn{
		  margin-right: 0.49rem;
	  }
	  .info-img{
		  margin-top: -0.6rem;
		  width: 100%;
	  }
	  .cover-img{
		  /*position: relative;*/
	  }
	  .rotate{
		  width: 100%;
		  top: 5.6rem;
		  left: 0;
		  transform: rotate(90deg);
	  }
	  .view-color{
		  position: fixed;
		  top: 0;
		  z-index: 20;
		  padding-top: 1.5rem;
	  }
	  .product-main .rotate-box,.product-main .img-box{
		  width: 76%;
		  height: 60vh;
	  }
	  .product-img .rotate-box,.product-img .img-box{
		  width: 76%;
		  height: 60vh;
	  }
	  .img360-info{
		  font-size: 0.23rem;
	  }
	  .color-list{
		  margin-top: 0.1rem;
	  }
	  .color-list a{
		  margin-right: 0.2rem;
		  margin-bottom: 0.3rem;
		  width: 0.43rem;
		  height: 0.43rem;
	  }
	  .color-info{
		  margin-top: 0.4rem;
		  font-size: 0.24rem;
	  }
	  .view-cls{
		  left: 50%;
		  top: 90vh;
		  right: 0;
		  width: 0.62rem;
		  height: 0.62rem;
		  transform: translateX(-50%);
	  }
	  .basic{
		  margin: 0;
		  background-color: #111111;
	  }
	  .basic-info{
		  height: auto;
		  padding: 1.15rem 0;
	  }
	  .msrp{
		  font-size: 0.27rem;
	  }
	  .basic-info p{
		  width: 92%;
		  margin-top: 0.32rem;
		  font-size: 0.24rem;
		  line-height: 0.32rem;
	  }
	  .introduce{
		  height: auto;
	  }
	  .basic-box{
		  position: relative;
	  }
	  .introduce ul{
		  left: 0;
		  transform: translate3d(0, 0px, 0px);
		  width: 75%;
		  margin: 0 auto;
	  }
	  .introduce ul li{
		  margin-bottom: 1.15rem;
		  font-size: 0.24rem;
		  letter-spacing: -0.005rem;
	  }
	  .introduce ul img{
		  width: 100%;
		  margin-bottom: 0.3rem;
	  }
	  .video{
		  height: 8.5rem;
	  }
	  .video-box{
		  width: 90%;
	  }
	  .video-box p{
		  font-size: 0.24rem;
		  line-height: 0.34rem;
	  }
	  .video-play{
		  margin-top: 0.45rem;
		  border-radius: 0.25rem;
		  width: 3rem;
		  padding: 0.13rem 0;
		  height: auto;
		  font-size: 0.24rem;
		  line-height: 0.24rem;
	  }
	  .video-play:after{
		  top: 0.12rem;
		  border-width: 0.12rem;
		  border-left-width: 0.18rem;
	  }
	  .banner,.pro-styles{
		  height: 8.5rem;
	  }
	  .pro-styles{
		  background-repeat: no-repeat;
		  background-size: cover;
		  background-position: center;
	  }
	  .sticky{
		  height: 100%;
		  padding: 0;
	  }
	  .banner-cnt{
		  top: 0;
		  left: 0;
		  width: 100%;
		  height: 100%;
		  padding: 0.9rem 0.3rem;
		  text-align: center;
	  }
	  .banner h3,.pro-styles h3{
		  font-size: 0.4rem;
		  line-height: 0.48rem;
	  }
	  .banner p{
		  margin-top: 0.18rem;
		  font-size: 0.24rem;
		  line-height: 0.32rem;
	  }
	  .intro-list li{
		  font-weight: 400;
	  }
	  .intro-list li span{
		  margin-top: 0.62rem;
		  font-size: 0.35rem;
		  line-height: 0.35rem;
	  }
	  .intro-list li p{
		  margin-top: 0.28rem;
		  font-size: 0.24rem;
		  line-height: 0.32rem;
		  padding: 0 0.2rem;
	  }
	  .product .mob-swiper .swiper-pagination-bullets{
		  bottom: 0.5rem;
	  }
	  .mob-swiper .swiper-pagination-bullet{
		  width: 0.18rem;
		  height: 0.18rem;
		  margin-right: 0.13rem;
		  background-color: #cccccc;
	  }
	  .mob-swiper .swiper-pagination-bullet-active{
		  background-color: #00ff00;
	  }
	  .product .style-list{
		  margin-top: 1.6rem;
		  padding: 0 0.8rem;
	  }
	  .banner-fllow{
		  height: 5rem;
	  }
	  .fllow-fixed{
		  height: 100%;
	  }
	  .banner-fllow .banner-cnt{
		  left: 50%;
		  top: 50%;
		  bottom: auto;
		  padding: 0;
		  width: 50%;
		  height: auto;
		  transform: translate3d(-50%, -50%, 0px);
		  text-align: center;
	  }
	  .ins-icon{
		  width: 0.63rem;
	  }
	  .banner-fllow span{
		  display: block;
		  margin-top: 0.3rem;
		  font-size: 0.3rem;
		  line-height: 0.38rem;
	  }
	  .ins-tag{
		  display: block;
		  color: #fff;
	  }
	  .configure{
		  height: auto;
		  padding: 1.3rem 0.3rem 1rem 0.3rem;
		  background-color: transparent;
	  }
	  .configure h2{
		  font-size: 0.45rem;
	  }
	  .configure ul{
		  margin-top: 0.85rem;
		  width: 100%;
	  }
	  .configure li{
		  width: 50%;
		  padding: 0.2rem;
		  border-right: 0;
		  border-bottom: 1px solid rgba(277, 277, 277, 0.2);
	  }
	  .configure li:nth-child(odd){
		  border-right: 1px solid rgba(277, 277, 277, 0.2);
	  }
	  .configure li:nth-last-child(2),.configure li:last-child{
		  border-bottom: 0;
	  }
	  
	  .configure label{
		  font-size: 0.24rem;
		  line-height: 0.24rem;
	  }
	  .configure span{
		  margin-top: 0.15rem;
		  min-height: 1.08rem;
		  font-size: 0.3rem;
		  line-height: 0.36rem;
	  }
  
	  .specifications{
		  padding: 0.65rem 0.5rem;
	  }
	  .specifications h2{
		  font-size: 0.45rem;
		  text-align: center;
	  }
	  .spec-info{
		  margin-top: 0.4rem;
	  }
	  .spec-info li{
		  display: flex;
		  width: 100%;
		  min-height: 2rem;
		  justify-content: space-between;
		  margin-bottom: 0.2rem;
	  }
	  .spec-info li>div{
		  width: 48.5%;
		  padding: 0.3rem 0.2rem;
		  background-color: #111111;
		  border-radius: 0.2rem;
	  }
	  .spec-info li label{
		  display: block;
		  font-size: 0.24rem;
		  color: #aaaaaa;
	  }
	  .spec-info li span{
		  display: block;
		  margin-top: 0.1rem;
		  font-size: 0.3rem;
	  }
	  .pro-fade{
		  height: auto;
	  }
	  .pro-fade .pro-mark{
		  padding: 0 0.5rem 1.04rem 0.5rem;
	  }
	  .pro-mark ul{
		  display: flex;
		  height: auto;
	  }
	  .pro-mark li{
		  position: static;
		  padding: 0.5rem 0.1rem;
		  background-color: #111111;
		  border-radius: 0.2rem;
	  }
	  .exploded-view{
		  opacity: 1;
	  }
	  
	  .pro-mark img{
		  width: 100%;
	  }
	  .pro-mark h3{
		  margin-bottom: 0.9rem;
		  font-size: 0.4rem;
	  }
	  .product .replacement{
		  background-color: transparent;
		  height: auto;
		  padding-top: 0.5rem;
	  }
	  .replacement-fixed{
		  height: 100%;
		  padding: 0;
	  }
	  .swiper-box{
		  width: 100%;
		  padding: 0;
	  }
	  .replacement .swiper-container{
		  padding: 0 0.5rem;
	  }
	  .replacement h3{
		  margin-bottom: 0.6rem;
	  }
	  .replacement li{
		  width: 100%;
		  border-radius: 0.2rem;
	  }
	  .replacement img{
		  width: 2.69rem;
		  margin-right: 0.32rem;
		  border-radius: 0.2rem 0 0 0.2rem;
	  }
	  .replacement span{
		  margin-top: 0.5rem;
		  font-size: 0.3rem;
	  }
	  .view-more{
		  margin-top: 0.95rem;
		  width: 1.76rem;
		  height: 0.6rem;
		  line-height: 0.6rem;
		  border-radius: 0.28rem;
		  font-size: 0.24rem;
	  }
	  .inthebox{
		  padding: 1.3rem 0;
		  height: auto;
	  }
	  .inthebox h2{
		  margin-bottom: 0.55rem;
		  font-size: 0.45rem;
	  }
	  .inthebox .swiper-container{
		  padding: 0 0.5rem;
	  }
	  .inthebox li{
		  padding: 0;
		  border-radius: 0.2rem;
		  min-height: auto;
		  background-color: #f0f0f0;
		  padding-bottom: 0.75rem;
	  }
	  .inthebox-info{
		  float: none;
		  border: 0;
		  width: 100%;
		  height: auto;
		  padding: 0.35rem;
		  background: #fff;
		  border-top-left-radius: 0.2rem;
		  border-top-right-radius: 0.2rem;
	  }
	  .inthebox-info h3{
		  font-size: 0.3rem;
	  }
	  .inthebox-info p{
		  margin-top: 0.3rem;
		  font-size: 0.24rem;
		  line-height: 0.33rem;
	  }
	  .inthebox li img{
		  position: static;
		  width: 90%;
		  margin-left: 5%;
		  margin-top: 1.2rem;
		  transform: none;
	  }
  
  }