@charset "UTF-8";
@-webkit-keyframes shine {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
  }
}
@keyframes shine {
  0% {
    opacity: 1;
  }
  50% {
    opacity: 0.6;
  }
  100% {
    opacity: 1;
  }
}

@-webkit-keyframes AniFloat {
  0% {
    -webkit-transform: translateY(3%);
            transform: translateY(3%);
  }
  50% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
  100% {
    -webkit-transform: translateY(3%);
            transform: translateY(3%);
  }
}

@keyframes AniFloat {
  0% {
    -webkit-transform: translateY(3%);
            transform: translateY(3%);
  }
  50% {
    -webkit-transform: translateY(0%);
            transform: translateY(0%);
  }
  100% {
    -webkit-transform: translateY(3%);
            transform: translateY(3%);
  }
}

:root {
  --font: -apple-system, BlinkMacSystemFont, "Segoe UI",'Microsoft JhengHei',"Noto Sans TC", "微軟正黑體", "Meiryo UI", Roboto, Helvetica, Arial, sans-serif;
  --mainTitle: 22px;
  --mainTxt: 18px;
  --mainPrice: 20px;
  --mainNote: 15px;
  --font-color-dark: #fff;
  --font-color-light: #111;
}

@media (min-width: 768px) {
  :root {
    --mainTitle: 32px;
    --mainTxt: 20px;
    --mainPrice: 20px;
    --mainNote: 15px;
  }
}

:root html:lang(ja-JP) *:not(.material-icons):not(.fa):not(.buttonicons) {
  --font: -apple-system, BlinkMacSystemFont,"Meiryo UI", Arial, sans-serif;
}

img {
  max-width: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

#AMZ_BTS {
  position: relative;
  background-image: url(https://storage-asset.msi.com/event/2023/IT/amz-bts/images/bg.webp);
  background-position: center center;
  background-repeat: repeat;
  background-color: #fff;
  background-size: contain;
  overflow: hidden;
}

#AMZ_BTS .kv {
  position: relative;
  min-height: calc(100vh - 54px);
}

#AMZ_BTS .kv__main {
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
          transform: translate(-50%, -50%);
  width: 100%;
  z-index: 20;
}

#AMZ_BTS .kv__main img {
  width: 100%;
}

@media (min-width: 996px) {
  #AMZ_BTS .kv__main {
    width: 85%;
  }
}

@media (min-width: 1930px) {
  #AMZ_BTS .kv__main {
    width: 95%;
  }
}

#AMZ_BTS .ball {
  position: absolute;
  z-index: 10;
  width: 33%;
}

#AMZ_BTS .ball--01 {
  top: 13%;
  left: 3%;
  -webkit-animation-name: AniFloat;
          animation-name: AniFloat;
  -webkit-animation-duration: 2s;
          animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

#AMZ_BTS .ball--01-1 {
  top: 28%;
  left: 1%;
  -webkit-animation-name: AniFloat;
          animation-name: AniFloat;
  -webkit-animation-duration: 2.5s;
          animation-duration: 2.5s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
  max-width: 30px;
}

#AMZ_BTS .ball--02 {
  bottom: 28%;
  left: -4%;
  -webkit-animation-name: AniFloat;
          animation-name: AniFloat;
  -webkit-animation-duration: 3s;
          animation-duration: 3s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

#AMZ_BTS .ball--03 {
  top: 25%;
  right: -5%;
  -webkit-animation-name: AniFloat;
          animation-name: AniFloat;
  -webkit-animation-duration: 2.3s;
          animation-duration: 2.3s;
  -webkit-animation-iteration-count: infinite;
          animation-iteration-count: infinite;
}

@media (min-width: 576px) {
  #AMZ_BTS .ball {
    width: 30%;
  }
  #AMZ_BTS .ball--01 {
    top: -5%;
    left: 3%;
  }
  #AMZ_BTS .ball--01-1 {
    top: 40%;
    left: 20%;
    max-width: 50px;
  }
  #AMZ_BTS .ball--02 {
    bottom: -4%;
    left: -4%;
  }
  #AMZ_BTS .ball--03 {
    top: 25%;
    right: -5%;
  }
}

@media (min-width: 768px) {
  #AMZ_BTS .ball {
    width: 25%;
  }
}

@media (min-width: 996px) {
  #AMZ_BTS .ball {
    width: auto;
  }
  #AMZ_BTS .ball--01 {
    top: -5%;
    left: 3%;
  }
  #AMZ_BTS .ball--01-1 {
    top: 40%;
    left: 20%;
  }
  #AMZ_BTS .ball--02 {
    bottom: -4%;
    left: -4%;
  }
  #AMZ_BTS .ball--03 {
    top: 25%;
    right: -5%;
  }
}
/*# sourceMappingURL=main.css.map */