#bx,#bx1{
    position: sticky;
    top: 5vw;
    transition: all 0.5s ease-in-out;
}
.animation-container,.animation-container1 {
    /* position: relative; */
   
    height: 60vw;
    overflow: hidden;
}

.animation-container img,.animation-container1 img {
    /* position: absolute;
    top: 0;
    left: 0; */
    width: 100%;
    display: none;

}
.animation-container .active,.animation-container1 .active {
    display: block;
}
#time_d{
    
    position: relative;
}
#kw_xl{
   
    position: relative;
}
@media(min-width: 750px) {
    
    #kw_xl{
        height: 1050vh;
    }
   
  }
  @media(min-width: 1024px) {
    
    #kw_xl{
        height: 1150vh;
    }
    
}

@media (min-width: 1280px) {
    #kw_xl{
        height: 1300vh;
    }
   
}
@media(min-width: 1366px) {
    #kw_xl{
        height: 1430vh;
    }
   
}
@media(min-width: 1440px) {
    #kw_xl{
        height: 1530vh;
    }
   
}
@media(min-width: 1680px) {
    #kw_xl{
        height: 1680vh;
    }
   
}
@media (min-width: 1920px) {
    #kw_xl{
        height: 1900vh;
    }
    #time_d{
        height: 900vh;
    }
}
.time,.xl {
    position: sticky;
    height: 50vw;
    top: 5%;
    overflow: hidden;
    transition: all 0.6s ease;
  }
  .xl{
    height: 60vw;
  }
  #k_img{
    
    transform: translate3d(0px, 15.6936%, 0px) scale3d(1, 1, 1) rotateX(0deg) rotateY(0deg) rotateZ(0deg) skew(0deg);
  }
  #k_img img{
    width: 54%;
    padding: 13%;
    z-index: 2;
  } 
  .k_i{
    width:100%;
    position: relative;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: center;
    align-items: center;
  }
  .i_d{
    width: 48%;
position: absolute;
bottom: -3%;
left: 14%;
display: flex;
flex-direction: column;
flex-wrap: wrap;
align-content: center;
align-items: center;
  }
  .i_d img{
    width: 41% !important;
    animation: rotate 6s 0.5s infinite linear;
    z-index: 1 !important;
    opacity: 1;
  }
  #kw_info{
    padding: 0.5%;position: relative;
  }
  .hoverable{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.8);
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    align-items: center;
    z-index: 1;
    opacity: 0;
    transition: opacity 0.5s ease;
  }
  .hoverable img{
    width: 90%;
  }
  #kw_info:hover .hoverable{
    opacity: 1; 
  }
  .b_c{
    padding: 6%;
    padding-top: 10%;
  }
  .b_c h1{
    font-size: 3vw;
    font-family: Source Han Sans SC;
    font-weight: 800;
    color: #000000;
  }
  .info{
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: center;
    justify-content: center;
    align-items: center;
  }
  .info img{
    width: 60%;
    padding-top: 15%;
  }
  .info h3{
    font-size: 1.5vw;
    font-family: Source Han Sans SC;
    font-weight: 800;
    color: #FFFFFF;
    padding-top: 10%;
  }
  .info div{
    width: 12vw;
    height: 3vw;
    border: 1px solid #FFFFFF;
    border-radius: 5vw;
    color: #FFFFFF;
    text-align: center;
    line-height: 2.7vw;
    font-size: 1.2vw;
    margin-top: 4%;
    margin-bottom: 12%;
  }
  .tt_t{
    width: 100%;
    margin-left: 17%;
  }
  #kw_imgs .x1{
    padding: 1%;
    width: 10% !important;
   
    transform-style: preserve-3d;
  }
  #kw_imgs img{
    height: 100%;
    
  }
  #in_img {
    padding: 1%;
    position: relative;
    padding-top: 6%;
    padding-left: 12%;
    padding-right: 3%;
  }
  #in_img img{
    width: 100%;
    z-index: 2;
    position: relative;
  }
  #in_tit{
    margin-top: 7%;
    padding-left: 7%;
  }
  #in_tit h1{
    font-size: 4.5vw;
    font-family: Source Han Sans SC;
    font-weight: bold;
    color: #FFFFFF;
    width: 60%;
    line-height: 5vw;
    height: 10vw;
  }
  #in_tit h2{
    font-size: 1.3vw;
    font-family: Source Han Sans SC;
    font-weight: 800;
    color: #FFFFFF;
    display: inline;
  }
  .se_jian{
    margin-top: 25%;
  }
  .se_jian img{
    width: 17%;
    margin-left: 10%;
  }
  #kw_se{
    margin-top: 16%;
    padding-right: 10%;
    width: 580%;
   
    will-change: transform;
    
    transform-style: preserve-3d;
  }
  #kw_se .x1{
    width: 6vw;
    height: 6vw;
    border-radius: 50%;
    margin-right: 1.5%;
  }
  #kw1:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #93d500,
              0px 2px 20px 0px #93d500,
              0px 3px 30px 0px #93d500,
              0px 4px 40px 0px #93d500,
              0px 5px 300px 0px #fff;
  } 
  #kw2:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #00bed6,
              0px 2px 20px 0px #00bed6,
              0px 3px 30px 0px #00bed6,
              0px 4px 40px 0px #00bed6,
              0px 5px 300px 0px #fff;
  } 
  #kw3:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #2ed9c3,
              0px 2px 20px 0px #2ed9c3,
              0px 3px 30px 0px #2ed9c3,
              0px 4px 40px 0px #2ed9c3,
              0px 5px 300px 0px #fff;
  } 
  #kw4:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #e81f76,
              0px 2px 20px 0px #e81f76,
              0px 3px 30px 0px #e81f76,
              0px 4px 40px 0px #e81f76,
              0px 5px 300px 0px #fff;
  } 
  #kw5:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #9e28b5,
              0px 2px 20px 0px #9e28b5,
              0px 3px 30px 0px #9e28b5,
              0px 4px 40px 0px #9e28b5,
              0px 5px 300px 0px #fff;
  } 
  #kw6:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #0071ce,
              0px 2px 20px 0px #0071ce,
              0px 3px 30px 0px #0071ce,
              0px 4px 40px 0px #0071ce,
              0px 5px 300px 0px #fff;
  } 
  #kw7:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #f93549,
              0px 2px 20px 0px #f93549,
              0px 3px 30px 0px #f93549,
              0px 4px 40px 0px #f93549,
              0px 5px 300px 0px #fff;
  } 
  #kw8:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #ffb259,
              0px 2px 20px 0px #ffb259,
              0px 3px 30px 0px #ffb259,
              0px 4px 40px 0px #ffb259,
              0px 5px 300px 0px #fff;
  } 
  #kw9:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #ff4438,
              0px 2px 20px 0px #ff4438,
              0px 3px 30px 0px #ff4438,
              0px 4px 40px 0px #ff4438,
              0px 5px 300px 0px #fff;
  } 
  #kw10:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #96daea,
              0px 2px 20px 0px #96daea,
              0px 3px 30px 0px #96daea,
              0px 4px 40px 0px #96daea,
              0px 5px 300px 0px #fff;
  } 
  #kw11:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #ff5100,
              0px 2px 20px 0px #ff5100,
              0px 3px 30px 0px #ff5100,
              0px 4px 40px 0px #ff5100,
              0px 5px 300px 0px #fff;
  } 
  #kw12:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #ffa400,
              0px 2px 20px 0px #ffa400,
              0px 3px 30px 0px #ffa400,
              0px 4px 40px 0px #ffa400,
              0px 5px 300px 0px #fff;
  }  #kw13:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #00b451,
              0px 2px 20px 0px #00b451,
              0px 3px 30px 0px #00b451,
              0px 4px 40px 0px #00b451,
              0px 5px 300px 0px #fff;
  } 

  #kw15:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #00c1de,
              0px 2px 20px 0px #00c1de,
              0px 3px 30px 0px #f4436c,
              0px 4px 40px 0px #f4436c,
              0px 5px 300px 0px #fff;
  } 
  #kw14:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #ff8672,
              0px 2px 20px 0px #ff8672,
              0px 3px 30px 0px #ff8672,
              0px 4px 40px 0px #ff8672,
              0px 5px 300px 0px #fff;
  } 

  #kw16:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #3085CC,
              0px 2px 20px 0px #3085CC,
              0px 3px 30px 0px #3085CC,
              0px 4px 40px 0px #3085CC,
              0px 5px 300px 0px #fff;
  } 

  #kw17:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #AFB2B3,
              0px 2px 20px 0px #AFB2B3,
              0px 3px 30px 0px #AFB2B3,
              0px 4px 40px 0px #AFB2B3,
              0px 5px 300px 0px #fff;
  } 
  #kw18:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #F4E962,
              0px 2px 20px 0px #F4E962,
              0px 3px 30px 0px #F4E962,
              0px 4px 40px 0px #F4E962,
              0px 5px 300px 0px #fff;
  } 

  #kw19:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #6258B1,
              0px 2px 20px 0px #6258B1,
              0px 3px 30px 0px #6258B1,
              0px 4px 40px 0px #6258B1,
              0px 5px 300px 0px #fff;
  } 

  #kw20:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #3a5826,
              0px 2px 20px 0px #3a5826,
              0px 3px 30px 0px #3a5826,
              0px 4px 40px 0px #3a5826,
              0px 5px 300px 0px #fff;
  } 

  #kw21:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #df3faf,
              0px 2px 20px 0px #df3faf,
              0px 3px 30px 0px #df3faf,
              0px 4px 40px 0px #df3faf,
              0px 5px 300px 0px #fff;
  } 

  #kw22:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #671c32,
              0px 2px 20px 0px #671c32,
              0px 3px 30px 0px #671c32,
              0px 4px 40px 0px #671c32,
              0px 5px 300px 0px #fff;
  } 

  #kw23:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #f32735,
              0px 2px 20px 0px #f32735,
              0px 3px 30px 0px #f32735,
              0px 4px 40px 0px #f32735,
              0px 5px 300px 0px #fff;
  } 

  #kw24:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #9a5f39,
              0px 2px 20px 0px #9a5f39,
              0px 3px 30px 0px #9a5f39,
              0px 4px 40px 0px #9a5f39,
              0px 5px 300px 0px #fff;
  } 

  #kw25:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #e6adb2,
              0px 2px 20px 0px #e6adb2,
              0px 3px 30px 0px #e6adb2,
              0px 4px 40px 0px #e6adb2,
              0px 5px 300px 0px #fff;
  } 
  #kw26:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #f32735,
              0px 2px 20px 0px #f32735,
              0px 3px 30px 0px #f32735,
              0px 4px 40px 0px #f32735,
              0px 5px 300px 0px #fff;
  } 
  #kw27:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #6ad9d4,
              0px 2px 20px 0px #6ad9d4,
              0px 3px 30px 0px #6ad9d4,
              0px 4px 40px 0px #6ad9d4,
              0px 5px 300px 0px #fff;
  } 
  #kw28:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #ffa300,
              0px 2px 20px 0px #ffa300,
              0px 3px 30px 0px #ffa300,
              0px 4px 40px 0px #ffa300,
              0px 5px 300px 0px #fff;
  } 
  #kw29:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #006547,
              0px 2px 20px 0px #006547,
              0px 3px 30px 0px #006547,
              0px 4px 40px 0px #006547,
              0px 5px 300px 0px #fff;
  } 

  #kw30:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #2368c4,
              0px 2px 20px 0px #2368c4,
              0px 3px 30px 0px #2368c4,
              0px 4px 40px 0px #2368c4,
              0px 5px 300px 0px #fff;
  } 
  #kw31:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #ff8200,
              0px 2px 20px 0px #ff8200,
              0px 3px 30px 0px #ff8200,
              0px 4px 40px 0px #ff8200,
              0px 5px 300px 0px #fff;
  } 

  #kw32:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #a2df66,
              0px 2px 20px 0px #a2df66,
              0px 3px 30px 0px #a2df66,
              0px 4px 40px 0px #a2df66,
              0px 5px 300px 0px #fff;
  } 

  #kw33:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #ebbecb,
              0px 2px 20px 0px #ebbecb,
              0px 3px 30px 0px #ebbecb,
              0px 4px 40px 0px #ebbecb,
              0px 5px 300px 0px #fff;
  } 

  #kw34:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #e44261,
              0px 2px 20px 0px #e44261,
              0px 3px 30px 0px #e44261,
              0px 4px 40px 0px #e44261,
              0px 5px 300px 0px #fff;
  } 

  #kw35:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #ffb719,
              0px 2px 20px 0px #ffb719,
              0px 3px 30px 0px #ffb719,
              0px 4px 40px 0px #ffb719,
              0px 5px 300px 0px #fff;
  } 

  #kw36:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #e70000,
              0px 2px 20px 0px #e70000,
              0px 3px 30px 0px #e70000,
              0px 4px 40px 0px #e70000,
              0px 5px 300px 0px #fff;
  } 

  #kw37:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #ffb719,
              0px 2px 20px 0px #ffb719,
              0px 3px 30px 0px #ffb719,
              0px 4px 40px 0px #ffb719,
              0px 5px 300px 0px #fff;
  } 

  #kw38:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #aa95db,
              0px 2px 20px 0px #aa95db,
              0px 3px 30px 0px #aa95db,
              0px 4px 40px 0px #aa95db,
              0px 5px 300px 0px #fff;
  } 

  #kw39:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #ffa069,
              0px 2px 20px 0px #ffa069,
              0px 3px 30px 0px #ffa069,
              0px 4px 40px 0px #ffa069,
              0px 5px 300px 0px #fff;
  } 
  #kw40:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #e88699,
              0px 2px 20px 0px #e88699,
              0px 3px 30px 0px #e88699,
              0px 4px 40px 0px #e88699,
              0px 5px 300px 0px #fff;
  } 
  #kw41:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #a2df66,
              0px 2px 20px 0px #a2df66,
              0px 3px 30px 0px #a2df66,
              0px 4px 40px 0px #a2df66,
              0px 5px 300px 0px #fff;
  } 
  #kw42:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #00c1de,
              0px 2px 20px 0px #00c1de,
              0px 3px 30px 0px #00c1de,
              0px 4px 40px 0px #00c1de,
              0px 5px 300px 0px #fff;
  } 
  #kw43:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #f7f8f8,
              0px 2px 20px 0px #f7f8f8,
              0px 3px 30px 0px #f7f8f8,
              0px 4px 40px 0px #f7f8f8,
              0px 5px 300px 0px #0fc54f;
  } 
  #kw44:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #f7f8f8,
              0px 2px 20px 0px #f7f8f8,
              0px 3px 30px 0px #f7f8f8,
              0px 4px 40px 0px #f7f8f8,
              0px 5px 300px 0px #28c9db;
  } 

  #x1-p-1:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #f7f8f8,
              0px 2px 20px 0px #f7f8f8,
              0px 3px 30px 0px #f7f8f8,
              0px 4px 40px 0px #f7f8f8,
              0px 5px 300px 0px #000389;
  } 
  #x1-p-2:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #f7f8f8,
              0px 2px 20px 0px #f7f8f8,
              0px 3px 30px 0px #f7f8f8,
              0px 4px 40px 0px #f7f8f8,
              0px 5px 300px 0px #000389;
  } 
  #x1-p-3:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #f7f8f8,
              0px 2px 20px 0px #f7f8f8,
              0px 3px 30px 0px #f7f8f8,
              0px 4px 40px 0px #f7f8f8,
              0px 5px 300px 0px #000389;
  } 
  #x1-p-4:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #f7f8f8,
              0px 2px 20px 0px #f7f8f8,
              0px 3px 30px 0px #f7f8f8,
              0px 4px 40px 0px #f7f8f8,
              0px 5px 300px 0px #000389;
  } 
  #x1-p-5:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #f7f8f8,
              0px 2px 20px 0px #f7f8f8,
              0px 3px 30px 0px #f7f8f8,
              0px 4px 40px 0px #f7f8f8,
              0px 5px 300px 0px #000389;
  } 
  #x1-p-6:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #f7f8f8,
              0px 2px 20px 0px #f7f8f8,
              0px 3px 30px 0px #f7f8f8,
              0px 4px 40px 0px #f7f8f8,
              0px 5px 300px 0px #000389;
  } 
  #x1-p-7:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #f7f8f8,
              0px 2px 20px 0px #f7f8f8,
              0px 3px 30px 0px #f7f8f8,
              0px 4px 40px 0px #f7f8f8,
              0px 5px 300px 0px #000389;
  } 
  #x1-p-8:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #f7f8f8,
              0px 2px 20px 0px #f7f8f8,
              0px 3px 30px 0px #f7f8f8,
              0px 4px 40px 0px #f7f8f8,
              0px 5px 300px 0px #000389;
  } 

  #kw45:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #3BAD2D,
              0px 2px 20px 0px #3BAD2D,
              0px 3px 30px 0px #3BAD2D,
              0px 4px 40px 0px #3BAD2D,
              0px 5px 300px 0px #fff;
  } 
  #kw46:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #FF8200,
              0px 2px 20px 0px #FF8200,
              0px 3px 30px 0px #FF8200,
              0px 4px 40px 0px #FF8200,
              0px 5px 300px 0px #fff;
  } 
  #kw47:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #FFB719,
              0px 2px 20px 0px #FFB719,
              0px 3px 30px 0px #FFB719,
              0px 4px 40px 0px #FFB719,
              0px 5px 300px 0px #fff;
  } 
  #kw48:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #E88699,
              0px 2px 20px 0px #E88699,
              0px 3px 30px 0px #E88699,
              0px 4px 40px 0px #E88699,
              0px 5px 300px 0px #fff;
  } 
  #kw49:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #E4447A,
              0px 2px 20px 0px #E4447A,
              0px 3px 30px 0px #E4447A,
              0px 4px 40px 0px #E4447A,
              0px 5px 300px 0px #fff;
  } 
  #kw50:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #E44261,
              0px 2px 20px 0px #E44261,
              0px 3px 30px 0px #E44261,
              0px 4px 40px 0px #E44261,
              0px 5px 300px 0px #fff;
  } 
  #kw51:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #DAC581,
              0px 2px 20px 0px #DAC581,
              0px 3px 30px 0px #DAC581,
              0px 4px 40px 0px #DAC581,
              0px 5px 300px 0px #fff;
  } 
  #kw52:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #247DE3,
              0px 2px 20px 0px #247DE3,
              0px 3px 30px 0px #247DE3,
              0px 4px 40px 0px #247DE3,
              0px 5px 300px 0px #fff;
  } 
  #nic-kw1:hover,#nic-kw2:hover,#nic-kw3:hover,#nic-kw4:hover,#nic-kw5:hover,#nic-kw6:hover,#nic-kw7:hover,#nic-kw8:hover,#nic-kw9:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #fff,
              0px 2px 20px 0px #fff,
              0px 3px 30px 0px #fff,
              0px 4px 40px 0px #fff,
              0px 5px 300px 0px #fff;
  } 

  #fla-kw1:hover,#fla-kw2:hover,#fla-kw3:hover,#fla-kw4:hover,#fla-kw5:hover,#fla-kw6:hover,#fla-kw7:hover,#fla-kw8:hover,#fla-kw9:hover{
    filter: hue-rotate(360deg);
  letter-spacing: 6px;
  border-radius: 50%;
  box-shadow: 0px 1px 10px 0px #fff,
              0px 2px 20px 0px #fff,
              0px 3px 30px 0px #fff,
              0px 4px 40px 0px #fff,
              0px 5px 300px 0px #fff;
  } 

 .x_t1{
    position: absolute;
    left: 4%;
    bottom: 15%;
    
    transition: opacity 0.5s ease-in-out;
 }
 .x_t1 h1,.x_t2 h1,.x_t3 h1{
    color: #FFFFFF;
    font-family: Montserrat-Black;
    font-weight: bolder;
    font-size: 3.5vw;
    line-height: 6vw;
 }
 .x_t1 h2,.x_t2 h2,.x_t3 h2{
    color: #FFFFFF;
    font-family: Source Han Sans SC;
    font-weight: lighter;
    font-size: 1.5vw;
    line-height: 2.5vw;
 }
.x_t2{
    position: absolute;
    top: 10%;
    left: 27%;
    text-align: center;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
}
.x_t3{
    position: absolute;
    top: 25%;
    right: 10%;
    width: 30%;
    text-align: left;
    opacity: 0;
    transition: opacity 0.5s ease-in-out;
}
.x_t3 h1{
    line-height: 4vw;
    padding-bottom: 3%;
}
.p{
    position: relative;
    margin-bottom:0 !important;
}
.p .x1{
   
    will-change: transform;
    transform-style: preserve-3d;
}
.img1-1,.img3-1,.img5-1,.img7-1,.img9-1{
    margin-top: 30%;
}
.img2-1{
    margin-bottom: 30%;
    margin-left: 12%;
}
.img4-1,.img6-1,.img8-1,.img10-1{
    margin-bottom: 30%;
}
.ic_ad1{
  position: relative;
  margin-top: 8vw;
}
.ic_ad1 img{
  width: 100%;
}
.ic_ad1_tex{
  position: absolute;
  color: #fff;
  width: 50%;
  top: 30%;
  right: 0%;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  justify-content: center;
  font-family: 'Montserrat-Black';
  font-weight: 100;
}
.nic_ad1_tex{
  position: absolute;
    color: #fff;
    width: 36%;
    top: 30%;
    right: 0%;
    display: flex;
    flex-direction: column;
    flex-wrap: wrap;
    align-content: center;
    align-items: flex-start;
    justify-content: center;
    font-family: 'Montserrat-Black';
    font-weight: 100;
}
.nic_ad1_tex h1{
  width: 65%;
  margin-bottom: 10%;
}
.nic_ad1_tex h2{
  width: 82%;
 
}
.nic_et3 h2{
  font-size: 1vw !important;
}
.nic_dn_tex{
  text-align: center;
  position: absolute;
  top: 5%;
  left: 35%;
  width: 30%;
}
.nic_dn_tex h1{
  width: 60%;
  margin-left: 20%;
}
.nic_dn_tex h2{
  width: 100%;
  margin-top: 5%;
}
.nic_dn_l{
  position: absolute;
  top: 43%;
}
.nic_dn_l.l1{
  left: 11%;
  width: 16%;
}
.nic_dn_l.l2{
  left: 28%;
  width: 13%;
  top: 44.5%;
}
.nic_dn_l.l3{
  right: 24.5%;
  width: 13%;
  top: 44.5%;
}
.nic_dn_l.l4{
  right: 7.5%;
  width: 16%;
}
.i_st{
  display: flex;
  position: absolute;
  top: -5%;
    right: 32%;
}
.ic_ad1_tex h1{
  font-size: 2vw;
  line-height: 4vw;
  margin-right: 10%;
  
}
.ic_ad1_tex h2{
  font-size: 7vw;
  line-height: 6vw;
}
.ic_ad1_tex h3{
  font-size: 4vw;
  line-height: 5vw;
}
.ic_ad1_tex h4{
  font-size: 3.5vw;
  
}
.ic_ad1_tex h5{
  font-size: 1.2vw
}
.elb{
  position: relative;
}
.elb img{
  width: 100%;
}
.elb_img{
  position: absolute;
  top: 37%;
  right: 5%;
  width: 29.8%;
}
.elb_tex{
  position: absolute;
  width: 40%;
  left: 0;
  top: 27%;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  justify-content: center;
  font-family: 'Montserrat-Black';
  font-weight: 100;
  color: #FFFFFF;
}
.elb_tex h1{
  font-size: 2.4vw;
  line-height: 3vw;
}
.elb_tex h2{
  font-size: 6vw;
  line-height: 6vw;
}
.elb_tex.ic h1{
 
  text-shadow: 
  0 0 1px #5dfd3b,  /* 发光效果 */
  0 0 1px #5dfd3b,
  0 0 15px #5dfd3b; 
}
.elb_tex.ic h2{
  
    text-shadow: 0 0 1px #5dfd3b, 0 0 1px #5dfd3b, 0 0 15px #5dfd3b;
}
.ebl_b{
  margin-top: 7%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-content: center;
  justify-content: space-around;
  align-items: center;
  width: 46%;
}

.ebl_b1{
  text-align: center;
}
.ebl_b1 h3{
  margin-top: 0.5vw;
}
.ebl_b1.ic h3{
  color: #5dfd3b;
}
.dn{
  position: relative;
}
.dn img{
  width: 100%;
}
.dn_tex{
  position: absolute;
  width: 50%;
  right: 0;
  top: 38%;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  justify-content: center;
  font-family: 'Montserrat-Black';
  font-weight: 100;
  color: #FFFFFF;
}
.dn_tex h1{
  font-size: 5.5vw;
  line-height: 6vw;
}
.dn_tex h2{
  font-size: 4vw;
  line-height: 5vw;
}
.dn_tex h3{
  font-size: 1.5vw;
  line-height: 3vw;
}
.aaf{
  position: relative;
}
.aaf img{
  width: 100%;
}
.aaf_tex{
  position: absolute;
  width: 40%;
  left: 0;
  top: 36%;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: center;
  align-items: center;
  justify-content: center;
  font-family: 'Montserrat-Black';
  font-weight: 100;
  color: #FFFFFF;
  text-align: center;
}
.aaf_tex h1{
  font-size: 4vw;
  line-height: 4vw;
}
.et3{
  position: absolute;
  top: 43%;
  left: 0;
  width: 40%;
  display: flex;
  text-align: center;
  margin-top: 8%;
  font-family: Source Han Sans SC;
  color: #FFFFFF;
  flex-direction: row;
  justify-content: center;
}
.et3 h2{
  font-size: 0.8vw;
  padding: 0 5%;
}
.et3 h2:first-child{
  border-right: 2px solid #fff;
}
.et3 h2:nth-child(2){
  border-right: 2px solid #fff;
}

.pack{
  margin: 5% auto;
}
.pack h1{
  font-size: 12vw;
  font-family: Montserrat-Black;
  font-weight: 800;
  color: #fff;
  text-align: center;
}
.pack_info{
  padding: 5%;
}
.pack_img{
  padding: 0 8%;
}
.pack_img img{
  width: 100%;
}
.pack_tex{
  padding-left: 8%;
}
.pack_tex h2{
  font-family: Montserrat-Black;
    color: #fff;
    font-size: 2.5vw;
    /* line-height: 7vw; */
    margin-bottom: 2vw;
}
.pack_tex h3{
  font-family: Source Han Sans SC;
  color: #fff;
  font-size: 1.15vw;
  line-height: 2vw;
}
.ic_img{
  width: 50%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
  align-items: center;
}
.ic_img1{
  width: 20%;
  animation: rotate 6s 0.5s infinite linear;
}
.ic_img2{
  width: 70%;
}

.ic_pop_ad1{
  position: relative;
}
.ic_pop_ad1 img{
  width: 100%;
}
.ost{
  position: absolute;
  width: 20%;
  top: 41%;
  right: 20.5%;
}
.pufs{
  position: absolute;
  width: 8%;
  bottom: 27%;
  right: 20%;
}
.swet_ad1,.swet_ad2,.swet_ad3,.swet_ad4{
  position: relative;
}
.son{
  position: absolute;
}
.son img{
  width: 100%;
}

.fla_ad2_s1{
  top: 26%;
  right: 8%;
  width: 25%;
}
.fla_ad2_s2{
  bottom: 19%;
  right: 17%;
  width: 14%;
}
.fla_ad3_s1{
  top: 14%;
  left: 4%;
  
}
.fla_ad3_s1 h1{
  color: #F47DD5;
  font-family: emoji;
  font-size: 2.5vw;
  line-height: 2.8vw;
  font-weight: 800;
}
.fla_ad3_s2{
  left: 4%;
  top: 31%;
  width: 24%;
}
.fla_ad3_s3{
  left: 4%;
    bottom: 15%;
    width: 19%;
}
.fla_ad4_s1{
  top: 17%;
  right: 21%;
}
.fla_ad4_s1 h1{
  font-size: 2.6vw;
  color: #fff;
  text-transform: uppercase;
  font-family: emoji;
  line-height: 2.8vw;
  font-weight: 600;
}
.fla_ad4_s2{
  left: 34%;
  top: 22%;
  width: 11%;
}
.fla_ad4_s3{
  right: 18%;
  top: 43%;
  width: 29%;
}
.fla_ad4_s4{
  right: 12%;
  bottom: 8%;
  width: 35%;
}
.swe_ad1_s1{
  top: 11%;
    left: 5%;
    width: 34%;
}
.swe_ad1_s2{
  left: 8%;
    bottom: 6%;
    width: 11%;
}
.swe_ad1_s3{
  right: 4%;
  bottom: 8%;
  width: 10%;
}
.swe_ad2_s1{
  top: 27%;
    left: 9%;
    width: 24%;
}
.swe_ad2_s2{
  left: 8%;
    bottom: 10%;
    width: 24%;
}

.swe_ad3_s1{
  top: 20%;
    right: 8%;
    width: 16%;
}
.swe_ad3_s2{
  right: 10%;
    bottom: 42%;
    width: 13%;
}
.swe_ad3_s3{
  right: 6.5%;
    bottom: 7.5%;
    width: 17%;
}
.swe_ad4_s1{
  top: 24%;
    left: 4%;
    width: 20%;
}
.swe_ad4_s2{
  right: 4%;
  bottom: 14%;
  width: 19.5%;
}
.sou_ad1_s1{
  right: 8%;
    top: 16%;
    width: 32%;
}
.sou_ad1_s2{
  right: 4%;
    bottom: 19%;
    width: 22%;
}
.sou_ad1_s3{
  right: 30%;
  bottom: 20%;
  width: 19%;
}
.sou_ad1_s4{
  left: 2%;
  bottom: 6%;
  width: 15%;
}
.sou_ad2_s1{
  left: 16%;
  top: 32%;
  width: 22%;
}
.sou_ad2_s2{
  left: 16%;
    top: 50%;
    width: 22%;
}
.sou_ad3_s1{
  left: 6%;
  top: 37%;
  width: 17%;
}
.sou_ad4_s1{
  right: 37%;
    top: 68%;
    width: 5%;
}
.swet_ad4 h1{
  position: absolute;
  bottom: 11%;
  left: 37%;
  text-align: center;
  font-family: Montserrat-Black;
  font-weight: 400;
  font-size: 2vw;
  color: #FF8EAA;
  line-height: 2.5vw;
}
.swet_ad4 h2{
  position: absolute;
  bottom: 7%;
  left: 39.5%;
  text-align: center;
  font-family: Montserrat-Black;
  font-weight: 400;
  font-size: 1.2vw;
  color: #000;
  line-height: 2.5vw;
}