body {
  background: #000;
}

.index-bx {
  position: absolute;
  width: 100%;
}
@media (max-width: 768px) {
  .index-bx {
    -webkit-transform: rotate(90deg);
            transform: rotate(90deg);
    -webkit-transform-origin: 50vw;
            transform-origin: 50vw;
    top: 0;
    left: 0;
  }
  .index-bx.safaindex {
    top: 30px;
  }
}

.swiper .swiper-button-prev {
  width: 6.9%;
  height: 12%;
  background: url(../images/btn_arrow_up.png) no-repeat center center/contain !important;
  left: 2%;
  right: auto;
  top: 2%;
  bottom: auto;
  -webkit-transform: none;
          transform: none;
  z-index: 10;
  margin-top: 0;
  opacity: 1 !important;
}
.swiper .swiper-button-prev::before {
  display: none;
}
.swiper .swiper-button-prev::after {
  display: none;
}

.swiper .swiper-button-next {
  width: 6.9%;
  height: 12%;
  background: url(../images/btn_arrow_down.png) no-repeat center center/contain !important;
  left: 10%;
  right: auto;
  top: 2%;
  bottom: auto;
  -webkit-transform: none;
          transform: none;
  z-index: 10;
  margin-top: 0;
  opacity: 1 !important;
}
.swiper .swiper-button-next::before {
  display: none;
}
.swiper .swiper-button-next::after {
  display: none;
}

.index-slide {
  width: 100%;
  height: 100%;
}
.index-slide .slick-list {
  height: 100% !important;
}
.index-slide .slick-list .slick-track {
  height: 100% !important;
}
.index-slide .img-bx {
  position: relative;
  margin: 0 auto;
  width: 100%;
  height: 100%;
}
.index-slide .img-bx .bgcover {
  width: 100%;
  height: 100%;
  background-size: cover !important;
}
.index-slide li {
  position: relative;
}
.index-slide li:nth-child(1) .curtains-bx {
  position: absolute;
  top: 24.7%;
  left: 19.6%;
  width: 20.45%;
  z-index: 9;
}
.index-slide li:nth-child(1) .curtains-bx.hid {
  display: none;
}
.index-slide li:nth-child(1) .curtains-bx .img-bx img {
  width: 100%;
}
.index-slide li:nth-child(1) .curtainsst2-bx {
  position: absolute;
  top: 24.7%;
  left: 19.6%;
  width: 20.45%;
  z-index: 7;
  pointer-events: none;
}
.index-slide li:nth-child(1) .curtainsst2-bx.hid {
  display: none;
}
.index-slide li:nth-child(1) .curtainsst2-bx .img-bx img {
  width: 100%;
}
.index-slide li:nth-child(1) .floshlight-bx {
  position: absolute;
  left: 95%;
  top: 53%;
  width: 3.85%;
  height: 7%;
}
.index-slide li:nth-child(1) .floshlight-bx .img-bx {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  height: auto;
}
.index-slide li:nth-child(1) .floshlight-bx .img-bx:nth-child(1) {
  opacity: 1;
}
.index-slide li:nth-child(1) .floshlight-bx .img-bx:nth-child(2) {
  opacity: 0;
}
.index-slide li:nth-child(1) .floshlight-bx.on-light .img-bx:nth-child(1) {
  opacity: 0;
}
.index-slide li:nth-child(1) .floshlight-bx.on-light .img-bx:nth-child(2) {
  opacity: 1;
}
.index-slide li:nth-child(1) .floshlight-bx.hid {
  display: none;
}
.index-slide li:nth-child(1) .tv-bx {
  position: absolute;
  bottom: 0;
  left: 0;
  pointer-events: none;
  width: 26.45%;
  z-index: 10;
}
.index-slide li:nth-child(1) .radio-bx {
  position: absolute;
  top: 60.6%;
  left: 27.5%;
  width: 10.72%;
  pointer-events: none;
  display: none;
  z-index: 6;
}
.index-slide li:nth-child(1) .radio-bx.open {
  display: block;
  pointer-events: all;
}
.index-slide li:nth-child(1) .radio-bx img {
  width: 100%;
}
.index-slide li:nth-child(1) .radio-bx .radio-img {
  position: absolute;
  top: 20%;
  left: 70%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 40%;
  display: none;
}
.index-slide li:nth-child(1) .radio-bx .radio-img.hid {
  display: block;
}
.index-slide li:nth-child(1) .radio-bx .radio-timg {
  position: absolute;
  top: 20%;
  left: 70%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 40%;
  display: none;
}
.index-slide li:nth-child(1) .radio-bx .radio-timg.hid {
  display: block;
}
.index-slide li:nth-child(1) .radio-con {
  position: absolute;
  top: 60.6%;
  left: 32.5%;
  width: 5.5%;
  height: 10%;
  z-index: 6;
}
.index-slide li:nth-child(1) .tape-bx {
  position: absolute;
  left: 59%;
  top: 33.5%;
  width: 2.39%;
}
@media (max-width: 991px) {
  .index-slide li:nth-child(1) .tape-bx {
    top: 31.5%;
  }
}
.index-slide li:nth-child(1) .tape-bx.hid {
  display: none;
}
.index-slide li:nth-child(1) .dustpan-bx {
  position: absolute;
  left: 81.5%;
  top: 59%;
  width: 8%;
  z-index: 6;
}
.index-slide li:nth-child(1) .dustpan-bx.hid {
  display: none;
}
.index-slide li:nth-child(1) .shovel-bx {
  position: absolute;
  top: 46.6%;
  left: 26.9%;
  width: 6.3%;
  z-index: 5;
}
.index-slide li:nth-child(1) .shovel-bx.hid {
  display: none;
}
.index-slide li:nth-child(1) .shovel-bx img {
  width: 100%;
}
.index-slide li:nth-child(1) .tel-bx {
  position: absolute;
  top: 72.6%;
  left: 16.6%;
  width: 5.15%;
  z-index: 11;
}
.index-slide li:nth-child(1) .tel-bx.hid {
  pointer-events: none;
}
.index-slide li:nth-child(1) .tel-bx.active .img-bx::before {
  opacity: 0;
}
.index-slide li:nth-child(1) .tel-bx .img-bx {
  position: relative;
}
.index-slide li:nth-child(1) .tel-bx .img-bx::before {
  position: absolute;
  content: "";
  top: -10px;
  right: -50px;
  width: 77%;
  height: 120%;
  background: url(../images/slide-o/phone_sound.png) no-repeat center/contain;
  top: -105%;
  right: -60%;
  -webkit-transition: 0.4s ease;
  transition: 0.4s ease;
  opacity: 1;
}
.index-slide li:nth-child(1) .tel-bx img {
  width: 100%;
}
.index-slide li:nth-child(1) .batteries-bx {
  position: absolute;
  top: 53.6%;
  left: 21.2%;
  width: 15%;
  height: 19%;
  z-index: 11;
  display: none;
}
.index-slide li:nth-child(1) .batteries-bx.active {
  display: block;
}
.index-slide li:nth-child(1) .batteries-bx .img-bx:nth-child(1) {
  opacity: 0;
  pointer-events: none;
}
.index-slide li:nth-child(1) .batteries-bx .img-bx:nth-child(1).show {
  opacity: 1;
  pointer-events: all;
}
.index-slide li:nth-child(1) .batteries-bx .img-bx:nth-child(2), .index-slide li:nth-child(1) .batteries-bx .img-bx:nth-child(3) {
  position: absolute;
  bottom: 0;
  left: 0;
  display: none;
  pointer-events: none;
}
.index-slide li:nth-child(1) .batteries-bx .img-bx:nth-child(2) > img, .index-slide li:nth-child(1) .batteries-bx .img-bx:nth-child(3) > img {
  position: absolute;
  bottom: 0;
  left: 0;
}
.index-slide li:nth-child(1) .batteries-bx .img-bx:nth-child(2).show, .index-slide li:nth-child(1) .batteries-bx .img-bx:nth-child(3).show {
  display: block;
  pointer-events: all;
}
.index-slide li:nth-child(1) .batteries-bx .input-bx {
  position: absolute;
  bottom: 17%;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 89%;
  height: 50%;
}
@media (max-width: 991px) {
  .index-slide li:nth-child(1) .batteries-bx .input-bx {
    bottom: 23%;
  }
}
.index-slide li:nth-child(1) .batteries-bx .input-bx input {
  width: 100%;
  border-radius: 32px;
  height: 45%;
  background: rgba(64, 91, 122, 0.4);
  text-align: center;
  border: none;
  color: #fff;
  font-size: 1vw;
}
@media (max-width: 991px) {
  .index-slide li:nth-child(1) .batteries-bx .input-bx input {
    font-size: 1vw;
  }
}
.index-slide li:nth-child(1) .batteries-bx .input-bx a {
  width: 40%;
  margin: 0 auto;
  display: block;
  margin-top: 5%;
}
@media (max-width: 991px) {
  .index-slide li:nth-child(1) .batteries-bx .input-bx a {
    margin-top: 0.1%;
  }
}
.index-slide li:nth-child(1) ::-webkit-input-placeholder {
  /* WebKit browsers */
  color: #fff;
  line-height: initial;
  font-size: 1vw;
  font-family: "Karla";
}
@media (max-width: 991px) {
  .index-slide li:nth-child(1) ::-webkit-input-placeholder {
    font-size: 1vw;
  }
}
.index-slide li:nth-child(1) :-moz-placeholder {
  /* Mozilla Firefox 4 to 18 */
  color: #fff;
  line-height: initial;
  font-size: 1vw;
  font-family: "Karla";
}
@media (max-width: 991px) {
  .index-slide li:nth-child(1) :-moz-placeholder {
    font-size: 1vw;
  }
}
.index-slide li:nth-child(1) ::-moz-placeholder {
  /* Mozilla Firefox 19+ */
  color: #fff;
  line-height: initial;
  font-size: 1vw;
  font-family: "Karla";
}
@media (max-width: 991px) {
  .index-slide li:nth-child(1) ::-moz-placeholder {
    font-size: 1vw;
  }
}
.index-slide li:nth-child(1) :-ms-input-placeholder {
  /* Internet Explorer 10+ */
  color: #fff;
  line-height: initial;
  font-size: 1vw;
  font-family: "Karla";
}
@media (max-width: 991px) {
  .index-slide li:nth-child(1) :-ms-input-placeholder {
    font-size: 1vw;
  }
}
.index-slide li:nth-child(1) .up-cab {
  position: absolute;
  width: 23.9%;
  height: 16%;
  z-index: 11;
  top: 15.5%;
}
.index-slide li:nth-child(1) .up-cab img {
  width: 100%;
}
.index-slide li:nth-child(1) .up-cab .img-bx {
  display: none;
}
.index-slide li:nth-child(1) .up-cab .up-cabbtn {
  position: absolute;
  top: 37%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 60%;
  height: 73%;
}
.index-slide li:nth-child(1) .up-cab.open {
  z-index: 10;
}
.index-slide li:nth-child(1) .up-cab.open .img-bx {
  display: block;
}
.index-slide li:nth-child(1) .up-cab.saw-bx .img-bx {
  position: relative;
}
.index-slide li:nth-child(1) .up-cab.saw-bx .img-bx .saw-img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 35%;
}
.index-slide li:nth-child(1) .up-cab.saw-bx .img-bx .saw-img.hid {
  display: none;
}
.index-slide li:nth-child(1) .up-cab1 {
  left: 36.5%;
}
.index-slide li:nth-child(1) .up-cab2 {
  left: 51.15%;
}
.index-slide li:nth-child(1) .up-cab3 {
  left: 65.8%;
}
.index-slide li:nth-child(1) .cen-cab {
  position: absolute;
  width: 7.5%;
  height: 10.4%;
  z-index: 5;
  top: 58.1%;
}
.index-slide li:nth-child(1) .cen-cab img {
  width: 100%;
}
.index-slide li:nth-child(1) .cen-cab .img-bx {
  display: none;
}
.index-slide li:nth-child(1) .cen-cab .cen-cabbtn {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 39%;
}
.index-slide li:nth-child(1) .cen-cab.open {
  z-index: 6;
}
.index-slide li:nth-child(1) .cen-cab.open .img-bx {
  display: block;
}
.index-slide li:nth-child(1) .cen-cab.sci-bx .img-bx {
  position: relative;
}
.index-slide li:nth-child(1) .cen-cab.sci-bx .img-bx .sic-img {
  position: absolute;
  top: 36%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 45%;
}
.index-slide li:nth-child(1) .cen-cab.sci-bx .img-bx .sic-img.hid {
  display: none;
}
.index-slide li:nth-child(1) .cen-cab1 {
  left: 41%;
}
.index-slide li:nth-child(1) .cen-cab2 {
  left: 48.4%;
}
.index-slide li:nth-child(1) .cen-cab3 {
  left: 55.7%;
}
.index-slide li:nth-child(1) .cen-cab4 {
  left: 63.1%;
}
.index-slide li:nth-child(1) .cen-cab5 {
  left: 70.4%;
}
.index-slide li:nth-child(1) .cen-cab6 {
  left: 77.7%;
}
.index-slide li:nth-child(1) .bot-cab {
  position: absolute;
  width: 25.2%;
  height: 22%;
  z-index: 5;
  top: 61.9%;
}
.index-slide li:nth-child(1) .bot-cab img {
  width: 100%;
}
.index-slide li:nth-child(1) .bot-cab .img-bx {
  display: none;
}
.index-slide li:nth-child(1) .bot-cab .bot-cabbtn {
  position: absolute;
  top: 38%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 59%;
  height: 74%;
}
.index-slide li:nth-child(1) .bot-cab.open {
  z-index: 11;
}
.index-slide li:nth-child(1) .bot-cab.open .img-bx {
  display: block;
}
.index-slide li:nth-child(1) .bot-cab.open .wire-img {
  z-index: 15;
}
.index-slide li:nth-child(1) .bot-cab.wire-bx .img-bx {
  position: relative;
}
.index-slide li:nth-child(1) .bot-cab.wire-bx .img-bx .wire-img {
  position: absolute;
  top: 25%;
  left: 65%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 13%;
}
.index-slide li:nth-child(1) .bot-cab.wire-bx .img-bx .wire-img.hid {
  display: none;
}
.index-slide li:nth-child(1) .bot-cab1 {
  left: 36%;
}
.index-slide li:nth-child(1) .bot-cab2 {
  left: 50.5%;
}
.index-slide li:nth-child(1) .bot-cab3 {
  left: 65%;
}
.index-slide li:nth-child(2) .ta-windowbx {
  position: absolute;
  left: 1.9%;
  top: 0.2%;
  z-index: 10;
  width: 19.4%;
  height: 49.4%;
}
.index-slide li:nth-child(2) .ta-windowbx img {
  display: none;
}
.index-slide li:nth-child(2) .ta-windowbx img.active {
  display: block;
}
.index-slide li:nth-child(2) .water-bottle {
  position: absolute;
  left: 26.8%;
  top: 31.5%;
  z-index: 10;
  width: 3%;
  height: 17.4%;
}
.index-slide li:nth-child(2) .water-bottle.hid {
  display: none;
}
.index-slide li:nth-child(2) .fillwater-bx {
  position: absolute;
  left: 11%;
  top: 45%;
  width: 13%;
  height: 10%;
  z-index: 11;
}
.index-slide li:nth-child(2) .noodles-dbx {
  position: absolute;
  left: 75.7%;
  top: 52%;
  z-index: 10;
  width: 4.5%;
  height: 8%;
  z-index: 11;
}
.index-slide li:nth-child(2) .noodles-dbx.hid {
  display: none;
}
.index-slide li:nth-child(2) .anti-bx {
  position: absolute;
  top: 65%;
  left: 40%;
  width: 13%;
  height: 15.5%;
  z-index: 15;
  display: none;
}
.index-slide li:nth-child(2) .anti-bx.active {
  display: block;
}
.index-slide li:nth-child(2) .anti-bx .img-bx {
  position: relative;
}
.index-slide li:nth-child(2) .anti-bx .an-box {
  display: block;
  z-index: 8;
  position: relative;
}
.index-slide li:nth-child(2) .anti-bx .an-boxb {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 3;
}
.index-slide li:nth-child(2) .anti-bx .an-noodles {
  position: absolute;
  left: 0;
  top: -12%;
  z-index: 6;
  display: none;
  width: 75%;
}
.index-slide li:nth-child(2) .anti-bx .an-noodles.active {
  display: block;
}
.index-slide li:nth-child(2) .anti-bx .an-water {
  position: absolute;
  right: 8%;
  top: -35%;
  z-index: 5;
  display: none;
  width: 38%;
}
.index-slide li:nth-child(2) .anti-bx .an-water.active {
  display: block;
}
.index-slide li:nth-child(2) .anti-bx .an-can {
  position: absolute;
  left: 25%;
  top: -17%;
  z-index: 4;
  display: none;
  width: 28%;
}
.index-slide li:nth-child(2) .anti-bx .an-can.active {
  display: block;
}
.index-slide li:nth-child(2) .faucet-bx {
  position: absolute;
  left: 13%;
  top: 43.2%;
  z-index: 10;
  width: 4.6%;
  height: 9%;
  z-index: 16;
}
.index-slide li:nth-child(2) .up-cab {
  position: absolute;
  height: 26%;
  z-index: 5;
  top: 2.4%;
}
.index-slide li:nth-child(2) .up-cab img {
  width: 100%;
}
.index-slide li:nth-child(2) .up-cab .img-bx {
  display: none;
}
.index-slide li:nth-child(2) .up-cab.open {
  z-index: 11;
}
.index-slide li:nth-child(2) .up-cab.open .img-bx {
  display: block;
}
.index-slide li:nth-child(2) .up-cab.can-bx .img-bx {
  position: relative;
}
.index-slide li:nth-child(2) .up-cab.can-bx .img-bx .can-img {
  position: absolute;
  top: 34%;
  left: 74%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 32%;
  z-index: 6;
}
.index-slide li:nth-child(2) .up-cab.can-bx .img-bx .can-img.hid {
  display: none;
}
.index-slide li:nth-child(2) .up-cab1 {
  left: 17.3%;
  width: 12.7%;
  z-index: 10;
}
.index-slide li:nth-child(2) .up-cab1 .up-cabbtn {
  position: absolute;
  top: 57%;
  left: 66%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 66%;
  height: 84%;
}
.index-slide li:nth-child(2) .up-cab2 {
  left: 21.9%;
  width: 16.9%;
  top: 4.9%;
  z-index: 9;
}
.index-slide li:nth-child(2) .up-cab2 .up-cabbtn {
  position: absolute;
  top: 48%;
  left: 72%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 49%;
  height: 84%;
}
.index-slide li:nth-child(2) .up-cab3 {
  left: 29.8%;
  width: 16.9%;
  top: 4.9%;
  z-index: 8;
}
.index-slide li:nth-child(2) .up-cab3 .up-cabbtn {
  position: absolute;
  top: 49%;
  left: 74.5%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 49%;
  height: 84%;
}
.index-slide li:nth-child(2) .up-cab4 {
  left: 40.5%;
  width: 28.8%;
  top: 4.4%;
  z-index: 7;
}
.index-slide li:nth-child(2) .up-cab4 .up-cabbtn {
  position: absolute;
  top: 49%;
  left: 49.9%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 58%;
  height: 84%;
}
.index-slide li:nth-child(2) .up-cab5 {
  left: 63.1%;
  width: 12.9%;
  top: 2.2%;
  z-index: 8;
}
.index-slide li:nth-child(2) .up-cab5 .up-cabbtn {
  position: absolute;
  top: 58%;
  left: 33.5%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 66%;
  height: 84%;
}
.index-slide li:nth-child(2) .bot-cab {
  position: absolute;
  height: 26%;
  z-index: 5;
  top: 51.7%;
}
.index-slide li:nth-child(2) .bot-cab img {
  width: 100%;
}
.index-slide li:nth-child(2) .bot-cab .img-bx {
  display: none;
}
.index-slide li:nth-child(2) .bot-cab.open {
  z-index: 11;
}
.index-slide li:nth-child(2) .bot-cab.open .img-bx {
  display: block;
}
.index-slide li:nth-child(2) .bot-cab.botan-box .img-bx {
  position: relative;
}
.index-slide li:nth-child(2) .bot-cab.botan-box .img-bx .botan-img {
  position: absolute;
  top: 65%;
  left: 35%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 41%;
  z-index: 6;
}
.index-slide li:nth-child(2) .bot-cab.botan-box .img-bx .botan-img.hid {
  display: none;
}
.index-slide li:nth-child(2) .bot-cab1 {
  left: 26%;
  width: 16.5%;
  z-index: 10;
}
.index-slide li:nth-child(2) .bot-cab1 .bot-cabbtn {
  position: absolute;
  top: 42%;
  left: 65.3%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 69%;
  height: 84%;
}
.index-slide li:nth-child(2) .bot-cab2 {
  left: 62.2%;
  width: 16.5%;
  z-index: 10;
}
.index-slide li:nth-child(2) .bot-cab2 .bot-cabbtn {
  position: absolute;
  top: 42%;
  left: 34.3%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 69%;
  height: 84%;
}
.index-slide li:nth-child(3) .wood-bx {
  position: absolute;
  left: 22%;
  top: 61%;
  width: 20%;
  height: 9%;
}
.index-slide li:nth-child(3) .wood-bx .img-bx {
  position: absolute;
  top: 50%;
  right: 0;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  height: auto;
  text-align: right;
}
.index-slide li:nth-child(3) .wood-bx .img-bx img {
  margin-left: auto;
}
.index-slide li:nth-child(3) .wood-bx .img-bx:nth-child(1) {
  opacity: 1;
}
.index-slide li:nth-child(3) .wood-bx .img-bx:nth-child(2) {
  opacity: 0;
}
.index-slide li:nth-child(3) .wood-bx.on .img-bx:nth-child(1) {
  opacity: 0;
}
.index-slide li:nth-child(3) .wood-bx.on .img-bx:nth-child(2) {
  opacity: 1;
}
.index-slide li:nth-child(3) .wood-bx.hid {
  display: none;
}
.index-slide li:nth-child(3) .tree-bx {
  position: absolute;
  left: 19%;
  top: 15.4%;
  width: 16.4%;
  height: 64%;
}
.index-slide li:nth-child(3) .tree-bx .img-bx {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  height: auto;
  display: none;
}
.index-slide li:nth-child(3) .tree-bx .img-bx.active {
  display: block;
}
.index-slide li:nth-child(3) .broom-bx {
  position: absolute;
  left: 13%;
  top: 44%;
  width: 8%;
  height: 33%;
}
.index-slide li:nth-child(3) .broom-bx.hid {
  display: none;
}
.index-slide li:nth-child(3) .car-bx {
  position: absolute;
  top: 29%;
  right: 0%;
  width: 37%;
  height: 53%;
}
.index-slide li:nth-child(3) .car-bx .img-bx {
  position: absolute;
  top: 11%;
  right: 18.5%;
  width: 11%;
  height: 15%;
  display: none;
}
.index-slide li:nth-child(3) .car-bx .img-bx.active {
  display: block;
}
.index-slide li:nth-child(3) .car-bx .img-bx.getkey {
  display: none !important;
}
.index-slide li:nth-child(3) .soilandleaves-bx {
  position: absolute;
  top: 63%;
  left: 39%;
  width: 14.5%;
  height: 20%;
}
.index-slide li:nth-child(3) .soilandleaves-bx .img-bx {
  display: none;
}
.index-slide li:nth-child(3) .soilandleaves-bx .img-bx.active {
  display: block;
}
.index-slide li:nth-child(3) .soilandleaves-bx .img-bx:nth-child(4) {
  position: absolute;
  right: -49%;
  top: -49%;
  width: 53%;
}
.index-slide li:nth-child(3) .soilandleaves-bx .img-bx:nth-child(5) {
  position: absolute;
  right: -49%;
  top: -49%;
  width: 53%;
}
.index-slide li:nth-child(3) .soilandleaves-bx .img-bx:nth-child(6) {
  position: absolute;
  right: -49%;
  top: -49%;
  width: 53%;
}
.index-slide li:nth-child(4) .clothesfork-bx {
  position: absolute;
  left: 58.3%;
  top: 20%;
  width: 1.6%;
  height: 26%;
}
.index-slide li:nth-child(4) .clothesfork-bx.hid {
  display: none;
}
.index-slide li:nth-child(4) .waterwipe-con {
  position: absolute;
  left: 43.4%;
  top: 20.3%;
  width: 7%;
  height: 19%;
  z-index: 4;
}
.index-slide li:nth-child(4) .waterwipe-bx {
  position: absolute;
  left: 38%;
  top: 20.3%;
  width: 12%;
  height: 19%;
  z-index: 6;
  display: none;
}
.index-slide li:nth-child(4) .waterwipe-bx.active {
  display: block;
}
.index-slide li:nth-child(4) .waterwipe-bx.waterwipeget {
  display: block;
  pointer-events: none;
}
.index-slide li:nth-child(4) .waterwipe-bx .waterwipe-img {
  display: block;
  position: absolute;
  bottom: 4%;
  left: 55%;
  width: 44%;
  z-index: 8;
}
.index-slide li:nth-child(4) .waterwipe-bx .waterwipe-img.hid {
  display: none;
}
.index-slide li:nth-child(4) .clothes-bx {
  position: absolute;
  top: 8%;
  left: 10%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  width: 32%;
  height: 55%;
  z-index: 8;
}
.index-slide li:nth-child(4) .clothes-bx .img-bx {
  position: absolute;
}
.index-slide li:nth-child(4) .clothes-bx .img-bx.hid {
  display: none;
}
.index-slide li:nth-child(4) .clothes-bx .img-bx:nth-child(1) {
  position: absolute;
  margin-right: 5%;
  width: 37%;
  position: absolute;
  left: 0;
  top: 0;
}
.index-slide li:nth-child(4) .clothes-bx .img-bx:nth-child(2) {
  position: absolute;
  margin-right: 5%;
  width: 37%;
  left: 40%;
  top: 0;
}
.index-slide li:nth-child(4) .clothes-bx .img-bx:nth-child(3) {
  position: absolute;
  top: -11px;
  width: 24%;
  left: 76%;
}
.index-slide li:nth-child(4) .clothes-bx .img-bx img {
  width: 100%;
}
.index-slide li:nth-child(4) .drainhole-bx {
  position: absolute;
  left: 70%;
  top: 51%;
  width: 25%;
  height: 23%;
  z-index: 5;
}
.index-slide li:nth-child(4) .drainhole-bx .img-bx {
  display: none;
}
.index-slide li:nth-child(4) .drainhole-bx .img-bx.active {
  display: block;
}
.index-slide li:nth-child(4) .drainhole-bx .img-bx:nth-child(4) {
  position: absolute;
  top: -11%;
  left: 54%;
  width: 36%;
}

.pass-bx {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(211, 72, 115, 0.2);
  z-index: 50;
  -webkit-transition: 0.5s ease;
  transition: 0.5s ease;
  pointer-events: none;
  opacity: 0;
  z-index: 25;
}
.pass-bx .img-bx {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -25%);
          transform: translate(-50%, -25%);
  opacity: 0;
  width: 52%;
}
.pass-bx.pass-st {
  pointer-events: all;
  opacity: 1;
}
.pass-bx.pass-st .img-bx {
  -webkit-animation: passani 3s 0.5s forwards;
          animation: passani 3s 0.5s forwards;
}

.n-passbx {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(41, 51, 130, 0.2);
  z-index: 50;
  -webkit-transition: 0.5s ease;
  transition: 0.5s ease;
  pointer-events: none;
  opacity: 0;
  z-index: 25;
}
.n-passbx .npassimg {
  position: absolute;
  top: 28%;
  left: 50%;
  -webkit-transform: translate(-50%, -25%);
          transform: translate(-50%, -25%);
  opacity: 1;
  width: 52%;
  opacity: 0;
}
.n-passbx .btn-flex {
  position: absolute;
  top: 60%;
  left: 50%;
  -webkit-transform: translate(-50%, -25%);
          transform: translate(-50%, -25%);
  width: 40%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  opacity: 0;
}
.n-passbx .btn-flex a {
  width: 45%;
  cursor: pointer;
}
.n-passbx.npass-st {
  pointer-events: all;
  opacity: 1;
}
.n-passbx.npass-st .npassimg {
  -webkit-animation: passani 3s 0.5s forwards;
          animation: passani 3s 0.5s forwards;
}
.n-passbx.npass-st .btn-flex {
  -webkit-animation: passani 3s 0.5s forwards;
          animation: passani 3s 0.5s forwards;
}

.bot-list {
  position: absolute;
  bottom: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: 100%;
  padding: 0 3%;
  background-color: #8AEEC2;
  border-top: 1px solid #405B7A;
  border-bottom: 2px solid #8AEEC2;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  z-index: 10;
}
.bot-list::before {
  position: absolute;
  content: "";
  left: 0;
  bottom: -3px;
  width: 100%;
  height: 5px;
  background-color: #8AEEC2;
}
.bot-list::after {
  position: absolute;
  content: "";
  right: -2px;
  top: 0;
  width: 5px;
  height: 100%;
  background-color: #8AEEC2;
}
.bot-list .time-bx {
  width: 20%;
  padding: 20px 15px;
  background: #405B7A;
  border: 1px solid #fff;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border-radius: 15px;
}
@media (max-width: 991px) {
  .bot-list .time-bx {
    padding: 5px 7px;
    border-radius: 7px;
    height: 4vw;
  }
}
@media (max-width: 600px) {
  .bot-list .time-bx {
    height: 30px;
  }
}
.bot-list .time-bx .ti-img {
  margin-right: 8px;
}
@media (max-width: 991px) {
  .bot-list .time-bx .ti-img {
    width: 25px;
  }
  .bot-list .time-bx .ti-img img {
    display: block;
  }
}
.bot-list .time-bx .time-line {
  width: 80%;
  height: 30px;
  border-radius: 8px;
  background-color: #8AEEC2;
  position: relative;
  overflow: hidden;
}
@media (max-width: 991px) {
  .bot-list .time-bx .time-line {
    width: calc(100% - 20px);
    height: 15px;
    border-radius: 4px;
  }
}
@media (max-width: 600px) {
  .bot-list .time-bx .time-line {
    height: 10px;
  }
}
.bot-list .time-bx .time-line::before {
  position: absolute;
  top: 0;
  content: "";
  width: 0;
  height: 100%;
  background-color: #fff;
  border-radius: 8px;
}
@media (max-width: 991px) {
  .bot-list .time-bx .time-line::before {
    border-radius: 4px;
  }
}
.bot-list .time-bx .time-line.start::before {
  -webkit-animation: timeAni 300s 3s linear forwards;
          animation: timeAni 300s 3s linear forwards;
}
@-webkit-keyframes timeAni {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
@keyframes timeAni {
  0% {
    width: 0;
  }
  100% {
    width: 100%;
  }
}
.bot-list .bot-thing {
  width: 70%;
  padding-right: 5%;
}
.bot-list .bot-thing .slick-prev {
  width: 6.9%;
  height: 57%;
  background: url(../images/btn_arrow_left.png) no-repeat center center/contain;
  left: -9%;
}
.bot-list .bot-thing .slick-prev::before {
  display: none;
}
.bot-list .bot-thing .slick-next {
  width: 6.9%;
  height: 57%;
  background: url(../images/btn_arrow_right.png) no-repeat center center/contain;
  right: -2%;
}
.bot-list .bot-thing .slick-next::before {
  display: none;
}
.bot-list .bot-thing li.get .img-bx {
  -webkit-animation: getani 1.5s 0.5s ease forwards;
          animation: getani 1.5s 0.5s ease forwards;
  -webkit-transition: 0.4s ease;
  transition: 0.4s ease;
}
.bot-list .bot-thing li.get .img-bx .n-get {
  opacity: 0;
}
.bot-list .bot-thing li.get .img-bx .get {
  opacity: 1;
}
@media (max-width: 991px) {
  .bot-list .bot-thing li.get.mob .img-bx .get {
    -webkit-transition: 0.4s ease;
    transition: 0.4s ease;
    -webkit-transform: translate(-50%, -50%) scale(1.1) !important;
            transform: translate(-50%, -50%) scale(1.1) !important;
  }
}
.bot-list .bot-thing li.hint img {
  -webkit-animation: hintani 0.5s 0.5s ease infinite;
          animation: hintani 0.5s 0.5s ease infinite;
}
@-webkit-keyframes getani {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@keyframes getani {
  0% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
  50% {
    -webkit-transform: scale(1.1);
            transform: scale(1.1);
  }
  100% {
    -webkit-transform: scale(1);
            transform: scale(1);
  }
}
@-webkit-keyframes hintani {
  0% {
    -webkit-transform: translate(-50%, -50%) scale(1);
            transform: translate(-50%, -50%) scale(1);
  }
  50% {
    -webkit-transform: translate(-50%, -50%) scale(1.1);
            transform: translate(-50%, -50%) scale(1.1);
  }
  100% {
    -webkit-transform: translate(-50%, -50%) scale(1);
            transform: translate(-50%, -50%) scale(1);
  }
}
@keyframes hintani {
  0% {
    -webkit-transform: translate(-50%, -50%) scale(1);
            transform: translate(-50%, -50%) scale(1);
  }
  50% {
    -webkit-transform: translate(-50%, -50%) scale(1.1);
            transform: translate(-50%, -50%) scale(1.1);
  }
  100% {
    -webkit-transform: translate(-50%, -50%) scale(1);
            transform: translate(-50%, -50%) scale(1);
  }
}
.bot-list .bot-thing .img-bx {
  position: relative;
  margin: 15px;
}
@media (max-width: 991px) {
  .bot-list .bot-thing .img-bx {
    margin: 5px;
  }
}
.bot-list .bot-thing .img-bx img {
  margin: 0 auto;
}
.bot-list .bot-thing .img-bx .get {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  opacity: 0;
}

.rule-bx {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  -webkit-transition: 0.4s ease;
  transition: 0.4s ease;
  width: 100%;
  height: 100%;
  z-index: 25;
}
.rule-bx.hid {
  display: none;
}
.rule-bx img {
  position: absolute;
  top: 41%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 62%;
}
@media (max-width: 768px) {
  .rule-bx img {
    width: 66%;
  }
}
.rule-bx .okbtn {
  width: 6%;
  height: 11%;
  position: absolute;
  top: 23%;
  right: 21.5%;
}

.start-bx {
  position: fixed;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -25%);
          transform: translate(-50%, -25%);
  opacity: 0;
  pointer-events: none;
  z-index: 25;
}
.start-bx.start {
  -webkit-animation: startani 3s 0.5s forwards;
          animation: startani 3s 0.5s forwards;
}

@-webkit-keyframes startani {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -25%);
            transform: translate(-50%, -25%);
  }
  30% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
  100% {
    opacity: 0;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
}

@keyframes startani {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -25%);
            transform: translate(-50%, -25%);
  }
  30% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
  100% {
    opacity: 0;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
}
@-webkit-keyframes passani {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -25%);
            transform: translate(-50%, -25%);
  }
  30% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
}
@keyframes passani {
  0% {
    opacity: 0;
    -webkit-transform: translate(-50%, -25%);
            transform: translate(-50%, -25%);
  }
  30% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
  }
}
.rule-open {
  position: absolute;
  top: 25px;
  right: 25px;
  width: 5.1%;
  z-index: 25;
}

@media (max-width: 768px) {
  .indexPage.mob-st .index-bx {
    -webkit-transform-origin: center;
            transform-origin: center;
    -webkit-transform: translate(-50%, -50%);
            transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
  }
}

.test-bg {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 99;
  height: 328px;
  width: 50px;
  background: #fff;
}