#hiPlay {
  background: #FFFFFF;
  line-height: 1.6;
  width: 100%;
  /* margin: 0 auto; */
}
#hiPlay *, #hiPlay::before, #hiPlay::after {
  box-sizing: border-box;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
#hiPlay *:focus, #hiPlay *:active {
  outline: none;
}
#hiPlay span.nowrap {
  white-space: nowrap;
}
#hiPlay section {
  width: 100%;
  position: relative;
  overflow: hidden;
}
#hiPlay .section {
  width: 67.5vw;
  margin: 0 auto;
}
#hiPlay sup {
  font-size: 0.6em;
  line-height: 1;
}
#hiPlay sup[data-footnote] {
  cursor: pointer;
}
#hiPlay .blur-up {
  filter: blur(20px);
  transition: filter 0.2s;
  will-change: filter;
}
#hiPlay .blur-up.lazyloaded {
  filter: blur(0);
}
#hiPlay img, #hiPlay video {
  display: block;
  width: 100%;
}
#hiPlay .relative {
  position: relative;
}
#hiPlay .absolute {
  position: absolute;
}
#hiPlay .txt-center {
  text-align: center;
}
#hiPlay .flex-between {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
#hiPlay .flex-left {
  display: flex;
  justify-content: flex-start;
  align-items: center;
}
#hiPlay .flex-center {
  display: flex;
  justify-content: center;
  align-items: center;
}
#hiPlay .rounded, #hiPlay .lg\:rounded {
  position: relative;
  z-index: 1;
  overflow: hidden;
  border-radius: 0.833333vw;
}
#hiPlay .rounded-left {
  border-top-left-radius: 0.833333vw;
  border-bottom-left-radius: 0.833333vw;
}
#hiPlay .rounded-right {
  border-top-right-radius: 0.833333vw;
  border-bottom-right-radius: 0.833333vw;
}
@media (max-aspect-ratio: 11/10) {
  #hiPlay .xs\:rounded {
    position: relative;
    z-index: 1;
    overflow: hidden;
  }
  #hiPlay .rounded, #hiPlay .xs\:rounded {
    border-radius: 2.222222vw;
  }
  #hiPlay .lg\:rounded {
    border-radius: 0;
  }
  #hiPlay .rounded-left {
    border-top-left-radius: 2.222222vw;
    border-bottom-left-radius: 2.222222vw;
  }
  #hiPlay .rounded-right {
    border-top-right-radius: 2.222222vw;
    border-bottom-right-radius: 2.222222vw;
  }
}
#hiPlay .space-fixed-80{
    height: 80px;
}
#hiPlay .space-300{
    height: 15.625vw;
}
#hiPlay .space-280{
    height: 14.583vw;
}
#hiPlay .space-240{
    height: 12.5vw;
}
#hiPlay .space-200{
    height: 10.416vw;
}
#hiPlay .space-180{
    height: 9.375vw;
}
#hiPlay .space-160{
    height: 8.333vw;
}
#hiPlay .space-140{
    height: 7.291vw;
}
#hiPlay .space-120{
    height: 6.25vw;
}
#hiPlay .space-100{
    height: 5.2vw;
}
#hiPlay .space-80{
    height: 4.166vw;
}
#hiPlay .space-78{
    height: 4.0625vw;
}
#hiPlay .space-64{
    height: 3.333vw;
}
#hiPlay .pb-200 {
  padding: 10.416667vw 0;
}
#hiPlay .pb-160 {
  padding: 8.333333vw 0;
}
#hiPlay .lg-mt-160 {
  margin-top: 8.333333vw;
}
#hiPlay .lg-pt-80 {
  padding-top: 4.166667vw;
}
#hiPlay .lg-pt-120 {
  padding-top: 6.25vw;
}
#hiPlay .lg-pt-160 {
  padding-top: 8.333333vw;
}
#hiPlay .lg-pb-120 {
  padding-bottom: 6.25vw;
}
#hiPlay .lg-pb-160 {
  padding-bottom: 8.333333vw;
}
#hiPlay .lg-pt-200 {
  padding-top: 10.416667vw;
}
#hiPlay .lg-pb-200 {
  padding-bottom: 10.416667vw;
}
#hiPlay .lg-txt-20 {
  font-size: 1.041667vw;
}
#hiPlay .lg-txt-12 {
  font-size: 0.625vw;
}
#hiPlay .lg-txt-16 {
  font-size: 0.833333vw;
}
#hiPlay .lg-txt-22 {
  font-size: 1.145833vw;
}
#hiPlay .lg-txt-24 {
  font-size: 1.25vw;
}
#hiPlay .lg-txt-32 {
  font-size: 1.666667vw;
}
#hiPlay .lg-txt-40 {
  font-size: 2.083333vw;
}
#hiPlay .lg-txt-48 {
  font-size: 2.5vw;
}
#hiPlay .lg-txt-64 {
  font-size: 3.333333vw;
}
#hiPlay .lg-marb-60 {
  margin-bottom: 3.125vw;
}
#hiPlay .lg-mart-28 {
  margin-top: 1.458333vw;
}
#hiPlay .lg-mart-16, #hiPlay .lg\:mt-16 {
  margin-top: 0.833333vw;
}
#hiPlay .lg-mart-40, #hiPlay .lg\:mt-32 {
  margin-top: 1.666667vw;
}
#hiPlay .lg-mart-40, #hiPlay .lg\:mt-40 {
  margin-top: 2.083333vw;
}
#hiPlay .lg-mart-48, #hiPlay .lg\:mt-48 {
  margin-top: 2.5vw;
}
#hiPlay .lg-marb-64, #hiPlay .lg\:mb-64 {
  margin-bottom: 3.333333vw;
}
#hiPlay .lg-marb-56, #hiPlay .lg\:mb-56 {
  margin-bottom: 2.916667vw;
}
#hiPlay .lg-marb-40 {
  margin-bottom: 2.083333vw;
}
#hiPlay .lg-marb-32 {
  margin-bottom: 1.666667vw;
}
#hiPlay .lg-marb-24 {
  margin-bottom: 1.25vw;
}
#hiPlay .w-1296 {
  width: 67.5vw;
}
#hiPlay .w-768 {
  width: 37.520833vw;
}
#hiPlay .w-600 {
  width: 33.333333vw;
}
#hiPlay .text-center {
  text-align: center;
}
#hiPlay h2, #hiPlay h3, #hiPlay h4 {
  line-height: 1.25;
}
#hiPlay .anim-text-animate {
  --transition-timing: .8s;
  --copy-fade-transition: opacity var(--transition-timing) linear,transform var(--transition-timing) cubic-bezier(0.16,1,0.3,1);
  --copy-fade-y-start: 70px;
  transition: var(--copy-fade-transition);
  opacity: 0;
  transform: translateY(var(--copy-fade-y-start));
}
#hiPlay .anim-text-animate.animated-copy-element {
  opacity: 1;
  transform: translateY(0);
}
#hiPlay .video-container {
  position: relative;
}
#hiPlay .video-container.playing .icon-pause, #hiPlay .video-container.paused .icon-play, #hiPlay .video-container.ended .icon-replay, #hiPlay .images-container.playing .icon-pause, #hiPlay .images-container.paused .icon-play, #hiPlay .images-container.ended .icon-replay {
  display: block;
}
#hiPlay .play-pause-button {
  position: absolute;
  z-index: 2;
  right: 1.25vw;
  bottom: 1.25vw;
  overflow: hidden;
  width: 2.5vw;
  height: 2.5vw;
  transform: translateZ(0);
  border-radius: 50%;
  cursor: pointer;
  backdrop-filter: blur(0.416667vw);
  -webkit-backdrop-filter: blur(0.416667vw);
  background-color: rgba(128, 128, 128, 0.4);
}
@media (hover: hover) {
  #hiPlay .play-pause-button:hover {
    opacity: 0.6;
  }
}
@media (hover: none) {
  #hiPlay .play-pause-button:active {
    opacity: 1;
  }
}
#hiPlay .play-pause-button .button-icon {
  position: absolute;
  top: 0;
  left: 0;
  display: none;
  pointer-events: none;
}
@media (max-aspect-ratio: 11/10) {
  #hiPlay .play-pause-button {
    right: 5.555556vw;
    bottom: 5.555556vw;
    width: 11.111111vw;
    height: 11.111111vw;
  }
}
#hiPlay.no-inline-video .play-pause-button {
  display: none;
}
#hiPlay.no-inline-video .section-emotional .emotional-item-2 .play-pause-button {
  display: block;
}
#hiPlay.no-inline-video .section-compatible-content .compatible-item-2 .play-pause-button {
  display: block;
}
#hiPlay .white-bg-content {
  background: white;
  color: #FFFFFF;
}
#hiPlay .white-bg-content .section-page-title .headline {
  color: #000000;
}
#hiPlay .white-bg-content .section-page-title.page-title-mask .headline {
  color: #FFFFFF;
}
#hiPlay .section-page-title {
  display: flex;
  flex-direction: column;
  align-items: center;
}
#hiPlay .section-page-title .headline {
  line-height: 1.25;
  font-weight: 700;
}
#hiPlay .page-title-mask {
  width: 100%;
  height: 17.708333vw;
  left: 0;
  bottom: 0;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;
  padding-left: 16.145833vw;
  padding-bottom: 5.208333vw;
}
#hiPlay .page-title-mask .sub-title {
  color: #E5722D;
  font-weight: 700;
  line-height: 1.25;
  margin-bottom: 0.520833vw;
  margin-left: 0.15625vw;
}
#hiPlay .gradient-text {
  background: linear-gradient(to right, #FFFFFF 0, #8A8A8A 100%);
  color: transparent;
  -webkit-background-clip: text;
}
#hiPlay .desc-color-86 {
  color: #86868B;
}
#hiPlay .desc-color-79 {
  color: #797C80;
}
@media (max-aspect-ratio: 11/10) {
  #hiPlay.hiPlay .hidden-web{
      display: block;
  }
  #hiPlay.hiPlay .hidden-mob{
      display: none;
  }
  #hiPlay .space-300{
      height: 34.722vw;
  }
  #hiPlay .space-280{
      height: 27.777vw;
  }
  #hiPlay .space-240{
      /* height: 33.333vw; */
      height: 27.77vw;
  }
  #hiPlay .space-200{
      height: 27.77vw;
  }
  #hiPlay .space-180{
      height: 25vw;
  }
  #hiPlay .space-160{
      height: 22.222vw;
  }
  #hiPlay .space-140{
      height: 19.444vw;
  }
  #hiPlay .space-120{
      height: 16.666vw;
  }
  #hiPlay .space-100{
      height: 13.888vw;
  }
  #hiPlay .space-78{
      height: 10.833333vw;
  }
  #hiPlay .space-80{
      height: 11.111vw;
  }
  #hiPlay .space-64{
      height: 8.88vw;
  }
  #hiPlay .space-60{
      height: 8.33vw;
  }
  #hiPlay .pb-200 {
    padding: 27.777778vw 0;
  }
  #hiPlay .pb-160 {
    padding: 22.222222vw 0;
  }
  #hiPlay .lg-pb-200 {
    padding-bottom: 27.777778vw;
  }
  #hiPlay .lg-pt-200 {
    padding-top: 27.777778vw;
  }
  #hiPlay .lg-pb-160, #hiPlay .xs\:lg-pb-160 {
    padding-bottom: 22.222222vw;
  }
  #hiPlay .lg-pt-160, #hiPlay .xs\:lg-pt-160 {
    padding-top: 22.222222vw;
  }
  #hiPlay .xs\:lg-pt-120 {
    padding-top: 16.666667vw;
  }
  #hiPlay .xs\:lg-pt-80 {
    padding-top: 11.111111vw;
  }
  #hiPlay .xs\:lg-pt-62 {
    padding-top: 8.611111vw;
  }
  #hiPlay .xs\:lg-mb-200 {
    margin-bottom: 27.777778vw;
  }
  #hiPlay .xs\:lg-mb-160 {
    margin-bottom: 22.222222vw;
  }
  #hiPlay .xs\:lg-mt-160 {
    margin-top: 22.222222vw;
  }
  #hiPlay .xs\:mt-80 {
    margin-top: 11.111111vw;
  }
  #hiPlay .xs\:mt-64 {
    margin-top: 8.888889vw;
  }
  #hiPlay .xs\:mt-48 {
    margin-top: 6.666667vw;
  }
  #hiPlay .xs\:mt-32 {
    margin-top: 4.444444vw;
  }
  #hiPlay .xs\:mt-20 {
    margin-top: 2.777778vw;
  }
  #hiPlay .xs\:mb-48 {
    margin-bottom: 6.666667vw;
  }
  #hiPlay .xs\:mb-40 {
    margin-bottom: 5.555556vw;
  }
  #hiPlay .xs\:mb-20 {
    margin-bottom: 2.777778vw;
  }
  #hiPlay .xs\:mb-32 {
    margin-bottom: 4.444444vw;
  }
  #hiPlay .xs\:mb-64 {
    margin-bottom: 8.888889vw;
  }
  #hiPlay .xs\:mb-80 {
    margin-bottom: 11.111111vw;
  }
  #hiPlay .xs\:mb-0 {
    margin-bottom: 0;
  }
  #hiPlay .xs\:w-full {
    width: 100%;
  }
  #hiPlay .xs\:w-688 {
    width: 95.555556vw;
  }
  #hiPlay .xs\:w-656 {
    width: 91.111111vw;
  }
  #hiPlay .xs\:w-650 {
    width: 90.277778vw;
  }
  #hiPlay .xs\:w-640 {
    width: 88.888889vw;
  }
  #hiPlay .xs\:w-640 {
    width: 88.888889vw;
  }
  #hiPlay .xs\:w-620 {
    width: 86.111111vw;
  }
  #hiPlay .xs\:w-592 {
    width: 82.222222vw;
  }
  #hiPlay .xs\:w-64 {
    width: 77.777778vw;
  }
  #hiPlay .xs\:w-560 {
    width: 77.777778vw;
  }
  #hiPlay .xs\:txt-80 {
    font-size: 11.111111vw;
  }
  #hiPlay .xs\:txt-64 {
    font-size: 8.888889vw;
  }
  #hiPlay .xs\:txt-56 {
    font-size: 7.777778vw;
  }
  #hiPlay .xs\:txt-48 {
    font-size: 6.666667vw;
  }
  #hiPlay .xs\:txt-40 {
    font-size: 5.555556vw;
  }
  #hiPlay .xs\:txt-32 {
    font-size: 4.444444vw;
  }
  #hiPlay .xs\:txt-28 {
    font-size: 3.888889vw;
  }
  #hiPlay .xs\:txt-24 {
    font-size: 3.333333vw;
  }
  #hiPlay .xs\:txt-22 {
    font-size: 3.055556vw;
  }
  #hiPlay .xs\:txt-20 {
    font-size: 2.777778vw;
  }
  #hiPlay .xs\:txt-16 {
    font-size: 2.222222vw;
  }
  #hiPlay .xs\:mx-auto {
    margin-right: auto;
    margin-left: auto;
  }
}

@media (max-aspect-ratio: 11/10) {
  #hiPlay {
    width: 100%;
  }
  #hiPlay .sec-title{
    font-size: 11.111111vw;
    margin: 20.833333vw 10.277778vw 0 10.277778vw;

  }
  #hiPlay .sec-1 h3:first-child,
  #hiPlay .sec-2 h3:first-child,
  #hiPlay .sec-3 h3:first-child,
  #hiPlay .sec-4 h3:nth-child(2){
    -webkit-background-clip: text;
    color: transparent;
    background-image: linear-gradient(130deg, #FF7C9E 34%, #CC74E2 46%, #4D83ED 60%, #0CC2FE 72%)
  }
  /* #hiPlay .sec-5 h3:nth-child(2){
    -webkit-background-clip: text;
    color: transparent;
    background-image: linear-gradient(120deg, #FF7C9E 44%, #CC74E2 47%, #4D83ED 54%, #0CC2FE 62%)
  } */
  #hiPlay .sec-1{
    width: 100%;
  }
  #hiPlay .sec-1-item{
    width: 81.388889vw;
    margin: 0 auto;
  }
  #hiPlay .sec-1 .hp-activity-audio-outbox{
    width: 100%;
    height: 90.277778vw;
  }
  #hiPlay .sec-1 .hp-activity-audiosvg-box {
    position: absolute;
    top: 49%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 83%;
    height: 100%;
  }
  #hiPlay.hiPlay .section{
    width: 100%;
  }
  #hiPlay .section h3{
    font-size: 8.888889vw;
  }
  #hiPlay .section p{
    margin: 0;
    margin-top: 4.444444vw;
    width: 100%;
    font-size: 4.444444vw;
  }
  #hiPlay .section.sec-4 .audio-image-text{
    font-size: 3.888889vw;
  }
  #hiPlay.hiPlay .section.sec-2{
    width: 91.111111vw;
    margin: 0 auto;
  }
  #hiPlay .sec-2 .hp-activity-audio-image{
    border-radius: 2.222222vw;
  }
  #hiPlay .section.sec-2 p{
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 11.111111vw;
    width: 81.527778vw;
  }
  #hiPlay .hp-activity-more-brand-link{
    margin: 4.166667vw 0 11.111111vw;
  }
  #hiPlay .hp-activity-more-brand-link a{
    font-size: 3.888889vw;
  }

  #hiPlay .sec-3 .hp-activity-audio-imageBox{
    width: 91.111111vw;
    margin: 0 auto;
    justify-content: space-between;
  }
  #hiPlay .sec-3 .hp-activity-audio-imageBox .audio-image-item{
      margin: 0 auto;
  }
  #hiPlay .section-add-image-box1{
    flex-basis: 45%;
    margin-left: 5.138889vw;
  }
  #hiPlay .section-add-image-box2{
    flex-basis: auto;
    margin-right: 5.138889vw;
  }
  #hiPlay .section-add-image-box3{
    flex-basis: 45%;
    margin-top: 13.333333vw;
    margin-left: 4.166667vw;
  }
  #hiPlay .section-add-image-box4,
  #hiPlay .section-add-image-box6{
    flex-basis: auto;
    margin-top: 13.333333vw;
  }
  #hiPlay .section-add-image-box4{
    margin-right: 8.611111vw;
  }
  #hiPlay .section-add-image-box5{
    margin-top: 13.333333vw;
    margin-left: 6.944444vw;
    flex-basis: 45%;
  }
  #hiPlay .section-add-image-box6{
    margin-right: 4.027778vw;
  }
  #hiPlay .section-add-image-box7{
    margin-top: 13.333333vw;
    flex-basis: 100%;
  }
  #hiPlay .sec-3 .hp-activity-audio-imageBox .section-add-image-1{
      width: 41.388889vw;
  }
  #hiPlay .sec-3 .hp-activity-audio-imageBox .section-add-image-2{
      width: 22.777778vw;
  }
  #hiPlay .sec-3 .hp-activity-audio-imageBox .section-add-image-3{
      width: 42.361111vw;
  }
  #hiPlay .sec-3 .hp-activity-audio-imageBox .section-add-image-4{
      width: 19.305556vw;
  }
  #hiPlay .sec-3 .hp-activity-audio-imageBox .section-add-image-5{
      width: 39.583333vw;
  }
  #hiPlay .sec-3 .hp-activity-audio-imageBox .section-add-image-6{
      width: 23.888889vw;
  }
  #hiPlay .sec-3 .hp-activity-audio-imageBox .section-add-image-7{
      width: 34.166667vw;
  }
  
  #hiPlay .sec-4-item{
    margin-bottom: 11.944444vw;
  }
  #hiPlay section.sec-4 {
    width: 70.833333vw;
    margin: 0 auto;
  }
  #hiPlay section.sec-4 h3{
    white-space: nowrap;
  }
  #hiPlay .sec-4 .hp-activity-audio-imageBox{
    width: 62.777778vw;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  #hiPlay .sec-4 .hp-activity-song .audio-image-item{
    width: 20vw;
  }
  #hiPlay .sec-4 .hp-activity-song.section-add-image{
    margin-right: 22.222222vw;
  }
  #hiPlay .sec-4 .hp-activity-song.section-add-image-top{
    margin-top: 14.444444vw;
  }
  #hiPlay .sec-4 .hp-activity-song p{
    margin-top: 5.555556vw;
  }

  #hiPlay .activity-details-guide-row{
      flex-wrap: wrap;
      width: 87.222222vw;
  }
  #hiPlay .activity-details-guide-item{
      margin-bottom: 6.666667vw;
      width: 100%;
      border-radius: 2.222222vw;
  }
  #hiPlay .activity-details-guide-item:last-child{
      margin-bottom: 0;
  }
  #hiPlay .activity-details-guide-item-image-container{
    border-top: .694444vw solid;
  }
  #hiPlay .activity-details-guide-item-content{
      width: 76.666667vw;
      margin: 5.833333vw auto 12.638889vw 5.416667vw;
  }
  #hiPlay .activity-details-guide-item-image-container .activity-details-guide-item-image{
      width: 59.861111vw;
  }
  #hiPlay .activity-details-guide-item-text{
      font-size: 4.444444vw;
  }
  #hiPlay .disclaimer-container{
      width: 89.722222vw;
      margin-left: auto;
      margin-right: auto;
      font-size: 3.33vw;
      padding-top: 0;
  }
  #hiPlay .disclaimer-container ol{
    padding-left: 1em;
  }
}
#hiPlay .mx-auto {
  margin-right: auto;
  margin-left: auto;
}
#hiPlay .hidden-web {
  display: none;
}
#hiPlay .section-hero .section-hero-content .hero-content-price-container .huawei-product-buy-btn-container {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}
#hiPlay .section-hero .section-hero-content .hero-content-price-container .huawei-product-buy-btn-container .huawei-product-buy-btn-price {
  color: #000000;
  font-size: 1.46vw;
  font-weight: 400;
  line-height: 1.25;
}
#hiPlay .section-hero .section-hero-content .hero-content-price-container .huawei-product-buy-btn-container .huawei-product-buy-btn-price div {
  color: inherit;
  cursor: pointer;
  display: inline-block;
}
#hiPlay .section-hero .section-hero-content .hero-content-price-container .huawei-product-buy-btn-container .huawei-product-buy-btn-price span {
  font-size: 0.677083vw;
  font-weight: 500;
}
#hiPlay .section-hero .section-hero-content .hero-content-price-container .huawei-product-buy-btn-container .huawei-product-buy-btn {
  color: #FFFFFF;
  font-size: 13px;
  font-weight: 500;
  line-height: 24px;
  text-align: center;
  display: inline-block;
  padding: 6px 20px;
  border: 2px solid #000;
  background: #000000;
  transition: 0.3s ease-out;
  margin-top: 24px;
  cursor: pointer;
  border-radius: 6px;
}
.hiPlay .sec-title{
  font-size: 5vw;
  /* font-weight: 700; */
}
.hiPlay .sec-1 h3:first-child,
.hiPlay .sec-2 h3:first-child,
.hiPlay .sec-3 h3:first-child,
.hiPlay .sec-4 h3:nth-child(2){
  -webkit-background-clip: text;
  color: transparent;
  background-image: linear-gradient(45deg, #FF7C9E 40%, #CC74E2 50%, #4D83ED 55%, #0CC2FE 65%)
}
/* .hiPlay .sec-5 h3:nth-child(2){
  -webkit-background-clip: text;
  color: transparent;
  background-image: linear-gradient(120deg, #FF7C9E 44%, #CC74E2 49%, #4D83ED 52%, #0CC2FE 56%)
} */
.hiPlay .text-position::after{
  content: "，";
  margin-right: -1em;
}
.hiPlay .section h3{
  position: relative;
  font-size: 3.333333vw;
}
.hiPlay .section p{
  margin: 0 auto;
  width: 49.427083vw;
  font-size: 1.25vw;
  color: #86868B;
}
.hiPlay .section.sec-1 .sec-1-item p{
  position: relative;
  z-index: 9;
}
.hiPlay .section.sec-1 .sec-1-item .remark-btn{
    cursor: pointer;
    font-size: 1em;
}
.hiPlay .sec-1 .hp-activity-audio-outbox{
  position: relative;
  width: 56.875vw;
  height: 45.85vw;
  margin: 0 auto;
}
.hiPlay .sec-1 .hp-activity-audio-image{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}
.hiPlay .sec-1 .hp-activity-audiosvg-box {
  position: absolute;
  top: 49%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 56.875vw;
  height: 100%;
}
.hiPlay .sec-1 .hp-svg-box {
  width: 100%;
  height: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.hiPlay .sec-2 .hp-activity-audio-image{
  border-radius: .833333vw;
  overflow: hidden;
  will-change: transform;
}
.hiPlay .sec-4-item{
  margin-bottom: 5.729167vw;
}
.hiPlay .hp-activity-more-brand-link{
  margin: 1.458333vw 0 4.479167vw;
  text-align: center;
}
.hiPlay .hp-activity-more-brand-link a{
    color: #0093FF;
    text-decoration: underline;
    font-size: 1.04vw;
    transition: opacity .3s ease;
}
@media (hover: hover) and (pointer: fine) {
  #hiPlay .hp-activity-more-brand-link a:hover {
    opacity: 0.6;
  }
}
.hiPlay .below-bg{
  width: 100%;
  background-color: #FCFCFC;
}
.hiPlay .sec-3 .hp-activity-audio-imageBox{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
}
.hiPlay .sec-3 .hp-activity-audio-imageBox .audio-image-item{
    margin: 0 auto;
}
.hiPlay .section-add-image-box1,
.hiPlay .section-add-image-box2,
.hiPlay .section-add-image-box3{
  flex-basis: 33.3%;
}
.hiPlay .section-add-image-box5,
.hiPlay .section-add-image-box6{
  flex-basis: 25%;
  margin-top: 8.333333vw;
}
.hiPlay .section-add-image-box4,
.hiPlay .section-add-image-box7{
  flex-basis: auto;
  margin-top: 8.333333vw;
}
.hiPlay .sec-3 .hp-activity-audio-imageBox .section-add-image-1{
  width: 16.666667vw;
  margin-left: .9375vw;
}
.hiPlay .sec-3 .hp-activity-audio-imageBox .section-add-image-2{
  width: 17.239583vw;
}
.hiPlay .sec-3 .hp-activity-audio-imageBox .section-add-image-3{
  width: 16.822917vw;
  margin-right: .9375vw;
}
.hiPlay .sec-3 .hp-activity-audio-imageBox .section-add-image-4{
  width: 9.479167vw;
}
.hiPlay .sec-3 .hp-activity-audio-imageBox .section-add-image-5{
  width: 8.489583vw;
  margin-left: 6.25vw;
  margin-right: 6.25vw;
}
.hiPlay .sec-3 .hp-activity-audio-imageBox .section-add-image-6{
  width: 16.666667vw;
  margin-right: 6.25vw;
}
.hiPlay .sec-3 .hp-activity-audio-imageBox .section-add-image-7{
  width: 10.833333vw;
}

.hiPlay .sec-4 .hp-activity-audio-imageBox{
  width: 64.583333vw;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}
.hiPlay .sec-4 .hp-activity-song .audio-image-item{
  width: 8.333333vw;
}
.hiPlay .sec-4 .hp-activity-song p{
  width: 100%;
  text-align: center;
  margin-top: 2.083333vw;
}

.hiPlay .activity-details-guide-row{
    display: flex;
    justify-content: space-between;
    align-items: stretch;
    margin: 0 auto;
    width: 67.5vw;
}
.hiPlay .activity-details-guide-item{
    display: flex;
    flex-direction: column;
    width: 32.708333vw;
    border-radius: .833vw;
    overflow: hidden;
}
.hiPlay .activity-details-guide-item-image-container{
    flex: 1;
    background-color: rgb(240, 247, 254, .6);
    /* position: relative; */
    border-top: .260417vw solid;
    border-image: linear-gradient(to right, #FF7C9E 0%, #DD77C9 40%, #7B7EE9 60%, #10C1FE 80%);
    border-image-slice: 1;
    overflow: hidden;
    will-change: transform;
}
.hiPlay .activity-details-guide-item-image-container .activity-details-guide-item-image{
    width: 22.447917vw;
    margin: 0 auto;
}
.hiPlay .activity-details-guide-item-content{
    width: 29.270833vw;
    margin: 2.447917vw auto 1.458333vw 2.03125vw;
}
.hiPlay .activity-details-guide-item-text{
    font-size: 1.25vw;
    color: #86868B;
    /* margin-top: .6vw; */
}
.hiPlay .details-guide-compatible-row .compatible-row-box{
    width: 67.5vw;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}
#hiPlay .section-highlights {
  margin-top: -1px;
  background: linear-gradient(to bottom, #503920 0%, #090604 78%, #000000 95%);
}
#hiPlay .section-highlights .swiper-wrapper, #hiPlay .section-highlights [data-swiper-parallax-x], #hiPlay .section-highlights [data-swiper-parallax-y], #hiPlay .section-highlights [data-swiper-parallax-opacity] {
  transition-timing-function: cubic-bezier(0.65, 0.05, 0.36, 1);
}
#hiPlay .section-highlights .swiper-touch-move .swiper-wrapper,
#hiPlay .section-highlights .swiper-touch-move [data-swiper-parallax-x],
#hiPlay .section-highlights .swiper-touch-move [data-swiper-parallax-y],
#hiPlay .section-highlights .swiper-touch-move [data-swiper-parallax-opacity] {
  transition-timing-function: ease;
}
#hiPlay .section-highlights .swiper {
  overflow: visible;
}
#hiPlay .section-highlights .swiper .swiper-wrapper .swiper-slide:not(.swiper-slide-active) {
  cursor: pointer;
}
#hiPlay .section-highlights .swiper .swiper-wrapper .swiper-slide {
  height: auto;
}
#hiPlay .text-nowrap{
  white-space: nowrap;
}

#hiPlay .section-highlights .swiper .swiper-wrapper .swiper-slide .caption-container {
  position: absolute;
  z-index: 2;
  top: 0;
  left: 0;
  margin: 2.291667vw 2.5vw;
}
#hiPlay .section-highlights .swiper .swiper-wrapper .swiper-slide .caption-container .title {
  font-size: 1.666667vw;
  font-weight: 700;
  line-height: 1.25;
  color: #FFFFFF;
}
#hiPlay .section-highlights .controls-container {
  display: flex;
  justify-content: center;
}
#hiPlay .section-highlights .controls-container .controls-wrapper {
  position: relative;
  display: flex;
  align-items: center;
  height: 3.333333vw;
  padding-right: 1.041667vw;
  padding-left: 1.041667vw;
  border-radius: 999px;
  background: linear-gradient(to bottom, #341B10 0%, #6A4D2E 100%);
}

#hiPlay .section-highlights .controls-container .controls-wrapper .arrownav-item {
  flex-shrink: 0;
  width: 2.083333vw;
  cursor: pointer;
  transition: opacity 0.3s;
  outline: 0;
  background: transparent;
  margin: 0;
}
@media (hover: hover) and (pointer: fine) {
  #hiPlay .section-highlights .controls-container .controls-wrapper .arrownav-item:not(.arrownav-disabled):hover {
    opacity: 0.6;
  }
}
@media (hover: none) {
  #hiPlay .section-highlights .controls-container .controls-wrapper .arrownav-item:not(.arrownav-disabled):hover {
    opacity: inherit;
  }
}
@media (any-hover: none) {
  #hiPlay .section-highlights .controls-container .controls-wrapper .arrownav-item:not(.arrownav-disabled):active {
    opacity: inherit;
  }
}
@media (min-width: 1920px){
    .hiPlay .disclaimer-container{
        font-size: .625vw;
    }
}
.hiPlay .disclaimer-container{
    color: #000000;
    font-size: 14px;
    width: 100%;
    overflow: hidden;
}
.hiPlay .disclaimer-container ol{
    list-style-type: decimal;
    padding-left: 2.3em;
}
.hiPlay .disclaimer-container li{
    position: relative;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    line-height: 1.6em;
}
.hiPlay .disclaimer-container .price{
    list-style: none;
    position: relative;
}
.hiPlay .disclaimer-container .price::before{
    content: "*";
    position: absolute;
    top: 0;
    left: 0;
    transform: translateX(-125%);
}
.hiPlay .disclaimer-container .disclaimer-link{
    /* color: #85858A; */
    color: #000000;
    word-wrap: break-word;
    text-decoration: underline;
}
.hiPlay .current{
    font-weight: 800;
}
#hiPlay .section-footnote i {
  position: absolute;
  bottom: 0;
  display: none;
  width: 16px;
  height: 16px;
  cursor: pointer;
  transform: translateY(-4.2px);
  /* background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='8' cy='8' r='8' fill='%23434343'/%3E%3Cpath d='M3.239,8.986,3.233,8.98a.688.688,0,0,1-.014-.972L5.942,5.28H.689A.685.685,0,0,1,.2,5.089l-.009-.01A.689.689,0,0,1,0,4.6V4.589a.7.7,0,0,1,.188-.48L.194,4.1a.681.681,0,0,1,.494-.213H5.911L3.225,1.178a.694.694,0,0,1,0-.979l0,0A.669.669,0,0,1,3.7,0a.772.772,0,0,1,.473.171l.021.017L7.838,3.845a1.151,1.151,0,0,1,.222.331l.008.019V4.2a1.036,1.036,0,0,1,.076.39v0a1.082,1.082,0,0,1-.312.76L4.212,8.976a.683.683,0,0,1-.487.2.715.715,0,0,1-.486-.194' transform='translate(3.411 12.076) rotate(-90)' fill='%23fff'/%3E%3C/svg%3E") center/100% no-repeat; */
  background: url('data:image/svg+xml,%3Csvg xmlns=\'http://www.w3.org/2000/svg\' viewBox=\'0 0 16 16\'%3E%3Ccircle cx=\'8\' cy=\'8\' r=\'8\' fill=\'%23e7e7e8\'/%3E%3Cpath d=\'M3.239,8.986,3.233,8.98a.688.688,0,0,1-.014-.972L5.942,5.28H.689A.685.685,0,0,1,.2,5.089l-.009-.01A.689.689,0,0,1,0,4.6V4.589a.7.7,0,0,1,.188-.48L.194,4.1a.681.681,0,0,1,.494-.213H5.911L3.225,1.178a.694.694,0,0,1,0-.979l0,0A.669.669,0,0,1,3.7,0a.772.772,0,0,1,.473.171l.021.017L7.838,3.845a1.151,1.151,0,0,1,.222.331l.008.019V4.2a1.036,1.036,0,0,1,.076.39v0a1.082,1.082,0,0,1-.312.76L4.212,8.976a.683.683,0,0,1-.487.2.715.715,0,0,1-.486-.194\' transform=\'translate(3.411 12.076) rotate(-90)\' fill=\'%23000\'/%3E%3C/svg%3E') center / 100% no-repeat;
}
#hiPlay .section-footnote li.current i {
  display: inline-block;
}
@media (min-width: 1920px) {
  #hiPlay .section-footnote i {
    width: 0.833333vw;
    height: 0.833333vw;
    transform: translateY(calc(-0.0833335vw - 1px));
  }
}
@media (max-aspect-ratio: 11/10) {
  #hiPlay .section-footnote i {
    /* width: 2.428571vw;
    height: 2.428571vw;
    transform: translateY(calc(-0.1571433vw - 1px)); */
    width: 3.888889vw;
    height: 3.888889vw;
    transform: translateY(calc(-0.8855554vw - 1px));
  }
}
@media (max-aspect-ratio: 7/10) {
  #hiPlay .section-footnote i {
    width: 4.722222vw;
    height: 4.722222vw;
    transform: translateY(calc(-0.3055554vw - 1px));
  }
}
#hiPlay .section-highlights .controls-container .controls-wrapper .arrownav-disabled {
  cursor: default;
  opacity: 0.3;
}
#hiPlay .section-highlights .controls-container .controls-wrapper .dotnav-list {
  display: flex;
  margin-right: 0.9375vw;
  margin-left: 0.9375vw;
}
#hiPlay .section-highlights .controls-container .controls-wrapper .dotnav-list .dotnav-item {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 0.520833vw;
  height: 0.520833vw;
  margin-right: 0.260417vw;
  margin-left: 0.260417vw;
  cursor: pointer;
  transition: opacity 300ms;
  opacity: 0.2;
  border-radius: 100%;
  outline: 0;
  background-color: #FFFFFF;
}
#hiPlay .section-highlights .controls-container .controls-wrapper .dotnav-list .dotnav-item::before {
  position: absolute;
  box-sizing: content-box;
  width: 100%;
  height: 100%;
  padding: 0.260417vw;
  content: "";
}
@media (hover: hover) {
  #hiPlay .section-highlights .controls-container .controls-wrapper .dotnav-list .dotnav-item:hover {
    opacity: 0.6;
  }
}
@media (hover: none) {
  #hiPlay .section-highlights .controls-container .controls-wrapper .dotnav-list .dotnav-item:active {
    opacity: 1;
  }
}
#hiPlay .section-highlights .controls-container .controls-wrapper .dotnav-list .dotnav-item.current {
  cursor: default;
  opacity: 1;
}