.lar_black {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 1000;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
}
.lar_click {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}

.btn_gotoweb {
  position: absolute;
  display: block;
  width: 22.5%;
  height: 12%;
  bottom: 6.5%;
  left: -5.5%;
}
@media screen and (max-width: 1279px) {
  .btn_gotoweb {
    position: absolute;
    display: block;
    width: 19.5%;
    height: 10%;
    bottom: 19.5%;
    left: -1.6%;
  }
}
@media only screen and (max-width: 735px) {
  .btn_gotoweb {
    position: absolute;
    display: block;
    width: 26.5%;
    height: 10%;
    top: 37%;
    left: -3%;
  }
}

.main_box {
  position: fixed;
  left: 0;
  z-index: 1000;
  width: 100%;
  height: 100%;
  padding-top: 5%;
  text-align: center;
  overflow-y: scroll;
  overflow-x: hidden;
}
@media only screen and (max-width: 735px) {
  .main_box {
    padding-top: 8%;
  }
}
.main_box .main_container {
  position: relative;
  margin: 0 auto;
  margin-bottom: 5%;
  width: 1228px;
  height: 807px;
  border-radius: 20px;
  background: #00011d;
  background-image: url(/Action/11_Star31/20240920SJX/images/main/bg_main_box.jpg?v=20240119);
  background-size: 100%;
  background-repeat: no-repeat;
  -webkit-box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.9);
          box-shadow: 0 0 14px 0 rgba(0, 0, 0, 0.9);
}
@media screen and (max-width: 1279px) {
  .main_box .main_container {
    width: 85%;
    height: 0;
    padding-bottom: 55.5%;
    margin-top: 2%;
  }
}
@media only screen and (max-width: 735px) {
  .main_box .main_container {
    background-image: url(/Action/11_Star31/20240920SJX/images/main/bg_main_box-m.jpg?v=20240119);
    background-position: center top;
    margin-top: 3%;
    padding-bottom: 120%;
  }
}
.main_box .video {
  position: absolute;
  top: 29%;
  left: 20%;
  margin: 0 auto;
  width: 60%;
  background-color: #000;
  border-radius: 15px;
  padding: 1%;
  border: 3px solid #08c97a;
}
@media only screen and (max-width: 735px) {
  .main_box .video {
    top: 46%;
    left: 2.5%;
    width: 95%;
  }
}

.video-container {
  position: relative;
  padding-bottom: 56.25%;
  padding-top: 30px;
  height: 0;
  overflow: hidden;
  display: none;
}
.video-container iframe,
.video-container object,
.video-container embed {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.active {
  display: block;
}

.main {
  /*&_label{
      position:absolute;
      top: percentage(55 / $baseHeight);
      left: percentage(160 / $baseWidth);
      width: percentage(310 / $baseWidth);
      height: 0;
      padding-bottom: percentage(187 / $baseWidth);
      background-image:url(/Action/11_Star31/20240920SJX/images/main/label.png?v=20240119);
      background-repeat:no-repeat;
      background-size: 100%;
      @include mobile-width(){
          top: percentage(-70 / $baseHeight);
          left: percentage(300 / $baseWidth);
      }
  }*/
}
.main_logo {
  position: absolute;
  display: block;
  top: -4.9566294919%;
  left: 36.7263843648%;
  width: 29.6416938111%;
  height: 0;
  padding-bottom: 9.6091205212%;
  background-image: url(/Action/11_Star31/20240920SJX/images/main/logo.png?v=20240119);
  background-size: 100%;
  background-repeat: no-repeat;
  z-index: 100;
}
@media only screen and (max-width: 735px) {
  .main_logo {
    position: absolute;
    top: 2.5%;
    left: 30%;
    width: 40%;
    padding-bottom: 13.5%;
  }
}
.main_slogan {
  position: absolute;
  top: 5.2044609665%;
  left: 31.7589576547%;
  width: 38.4364820847%;
  height: 0;
  padding-bottom: 19.4625407166%;
  background-image: url(/Action/11_Star31/20240920SJX/images/main/slogan1.png?v=20240119);
  background-size: 100%;
  background-repeat: no-repeat;
}
@media only screen and (max-width: 735px) {
  .main_slogan {
    top: 9%;
    left: 21.6%;
    width: 53.2%;
    padding-bottom: 25%;
    z-index: 100;
  }
}
.main_slogan2 {
  position: absolute;
  bottom: -1.239157373%;
  left: 24.4299674267%;
  width: 55.5374592834%;
  height: 0;
  padding-bottom: 8.7947882736%;
  background-image: url(/Action/11_Star31/20240920SJX/images/main/slogan2.png?v=20240119);
  background-size: 100%;
  background-repeat: no-repeat;
}
@media only screen and (max-width: 735px) {
  .main_slogan2 {
    bottom: 1%;
    left: 9.5%;
    width: 80%;
    padding-bottom: 12%;
    z-index: 100;
  }
}
.main_img1 {
  position: absolute;
  top: -13.5068153656%;
  left: -8.5504885993%;
  width: 45.6840390879%;
  height: 0;
  padding-bottom: 53.8273615635%;
  background-image: url(/Action/11_Star31/20240920SJX/images/main/img1.png?v=20240119);
  background-size: 100%;
  background-repeat: no-repeat;
}
@media only screen and (max-width: 735px) {
  .main_img1 {
    top: -21%;
    left: -6%;
    width: 39%;
    padding-bottom: 107.3%;
    background-image: url(/Action/11_Star31/20240920SJX/images/main/img1-m.png?v=20240119);
  }
}
.main_img2 {
  position: absolute;
  top: -8.6741016109%;
  left: 68.6482084691%;
  width: 34.6091205212%;
  height: 0;
  padding-bottom: 51.8729641694%;
  background-image: url(/Action/11_Star31/20240920SJX/images/main/img2.png?v=20240119);
  background-size: 100%;
  background-repeat: no-repeat;
}
@media only screen and (max-width: 735px) {
  .main_img2 {
    top: -7%;
    left: 65.4%;
    width: 40.75%;
    padding-bottom: 107.38%;
    background-image: url(/Action/11_Star31/20240920SJX/images/main/img2-m.png?v=20240119);
  }
}

ul.nav_action {
  padding: 0;
  margin: 0;
  position: absolute;
  width: 15.9609120521%;
  top: 47.4597273854%;
  right: 0.651465798%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  z-index: 1000;
}
@media only screen and (max-width: 735px) {
  ul.nav_action {
    width: 55%;
    top: 27%;
    right: 22%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}
ul.nav_action li {
  list-style: none;
  margin-bottom: 15px;
}
@media screen and (max-width: 1279px) {
  ul.nav_action li {
    margin-bottom: 0px;
  }
}
@media screen and (max-width: 1279px) {
  ul.nav_action a {
    width: 100%;
    height: auto;
    padding-bottom: 90%;
  }
}
@media only screen and (max-width: 735px) {
  ul.nav_action a {
    padding-bottom: 100%;
  }
}
ul.nav_action .main_btn1 {
  width: 108.6734693878%;
  height: 0;
  padding-bottom: 106.1224489796%;
  background-image: url(/Action/11_Star31/20240920SJX/images/main/btn1.png?v=20240119);
  background-size: 100%;
  background-repeat: no-repeat;
}
@media only screen and (max-width: 735px) {
  ul.nav_action .main_btn1 {
    width: 44%;
    margin: 0;
    padding-bottom: 43%;
  }
}
ul.nav_action .main_btn2 {
  width: 108.6734693878%;
  height: 0;
  padding-bottom: 106.1224489796%;
  background-image: url(/Action/11_Star31/20240920SJX/images/main/btn2.png?v=20240119);
  background-size: 100%;
  background-repeat: no-repeat;
}
@media only screen and (max-width: 735px) {
  ul.nav_action .main_btn2 {
    width: 44%;
    margin: 0;
    padding-bottom: 43%;
  }
}
ul.nav_action .main_btn1 a,
ul.nav_action .main_btn2 a {
  display: block;
  width: 100%;
  height: 0;
  padding-bottom: 106.1224489796%;
}

.btn_x {
  position: absolute;
  top: -50px;
  right: -44px;
  width: 87px;
  height: 87px;
  background-image: url(/Action/11_Star31/20240920SJX/images/main/btnX.png?v=20240119);
  background-size: 100%;
  background-repeat: no-repeat;
}
@media only screen and (max-width: 735px) {
  .btn_x {
    top: -30px;
    right: -30px;
    width: 60px;
    height: 60px;
  }
}
.btn_x a {
  display: block;
  width: 100%;
  height: 100%;
}

.main_box--close {
  top: -110%;
  opacity: 0;
}

.navMenu--open {
  top: 0;
  opacity: 1;
}