.hw-niki-all {
  color: #000;
  font-weight: 400;
  line-height: normal;
  position: relative;
  background: #fff;
}

.hw-niki-all * {
  box-sizing: border-box;
}

.hw-niki-all .borderRadius {
  overflow: hidden;
  transform: translate3d(0, 0, 0) rotate(0deg);
  border-radius: 0.00vw;
}

.hw-niki-all .overflow-hidden {
  overflow: hidden;
}

.hw-niki-all .botton-animation {
  transition: opacity .6s linear, transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
  -webkit-transition: opacity .6s linear, transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
  -moz-transition: opacity .6s linear, transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
  -ms-transition: opacity .6s linear, transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
  -o-transition: opacity .6s linear, transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
  will-change: opacity, transform;
}

.hw-niki-all .text-animation {
  transition: opacity .6s linear, transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
  -webkit-transition: opacity .6s linear, transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
  -moz-transition: opacity .6s linear, transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
  -ms-transition: opacity .6s linear, transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
  -o-transition: opacity .6s linear, transform .6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
  will-change: opacity, transform;
}

.hw-niki-all :is(svg) {
  width: 100%;
  height: auto;
  vertical-align: middle;
  overflow: visible;
}

.hw-niki-all div svg {
  width: 100%;
  height: 100%;
}

.hw-niki-all img {
  border: 0;
  width: 100%;
  display: block;
}


.hw-niki-all picture {
  border: 0;
  width: 100%;
  display: block;
}

.hw-niki-all video {
  border: 0;
  width: 100%;
  height: 100%;
  display: block;
}

.hw-niki-all a {
  text-decoration: none;
  color: initial;
}

.hw-niki-all em {
  font-style: normal;
}

.hw-niki-all .video-load {
  width: 100%;
  height: 100%;
}

.hw-niki-all .video-listening .button-play,
.hw-niki-all .video-listening .button-pause,
.hw-niki-all .video-listening .button-replay {
  opacity: 0;
  transition: opacity .3s cubic-bezier(0.46, 0.03, 0.52, 0.96);
}

.hw-niki-all .video-listening[data-state="play"] .button-play {
  opacity: 1;
}

.hw-niki-all .video-listening[data-state="pause"] .button-pause {
  opacity: 1;
}

.hw-niki-all .video-listening[data-state="replay"] .button-replay {
  opacity: 1;
}

.hw-niki-all .video-button {
  width: 2.08333333vw;
  position: absolute;
  right: 2.08333333vw;
  bottom: 2.08333333vw;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .video-button {
    cursor: pointer;
  }
}

.hw-niki-all .video-button img+img {
  width: 100%;
  position: absolute;
  top: 0;
}

.hw-niki-all .video-listening {
  position: relative;
}

.hw-niki-all .pc-show {
  display: block;
  font-style: normal;
}

.hw-niki-all .pc-hidden {
  display: none;
  font-style: normal;
}

.hw-niki-all .mob-show {
  display: none;
  font-style: normal;
}

.hw-niki-all .mob-hidden {
  display: block;
  font-style: normal;
}

.hw-niki-all .iPc-show {
  display: inline-block;
  font-style: normal;
}

.hw-niki-all .iPc-hidden {
  display: none;
  font-style: normal;
}

.hw-niki-all .iMob-show {
  display: none;
  font-style: normal;
}

.hw-niki-all .iMob-hidden {
  display: inline-block;
  font-style: normal;
}

.hw-niki-all .nr {
  white-space: nowrap;
  font-style: normal;
  display: inline-block;
}

.hw-niki-all .blur-up {
  -webkit-filter: blur(3px);
  filter: blur(3px);
  -webkit-transition: -webkit-filter 400ms;
  transition: -webkit-filter 400ms;
  transition: filter 400ms;
  transition: filter 400ms, -webkit-filter 400ms;
  will-change: filter;
}

.hw-niki-all .blur-up.lazyloaded {
  -webkit-filter: blur(0);
  filter: blur(0);
}

.hw-niki-all .lazyload:not([src]) {
  /* display: none; */
  visibility: hidden;
}

.hw-niki-all sup {
  font-size: 0.6em;
}

.hw-niki-all sup.hw-sup {
  font-size: 0.6em;
  cursor: pointer;
}

@media screen and (max-aspect-ratio:11/10) {
  .hw-niki-all .pc-show {
    display: none;
    font-style: normal;
  }

  .hw-niki-all .pc-hidden {
    display: block;
    font-style: normal;
  }

  .hw-niki-all .mob-show {
    display: block;
    font-style: normal;
  }

  .hw-niki-all .mob-hidden {
    display: none;
    font-style: normal;
  }

  .hw-niki-all .iPc-show {
    display: none;
    font-style: normal;
  }

  .hw-niki-all .iPc-hidden {
    display: inline-block;
    font-style: normal;
  }

  .hw-niki-all .iMob-show {
    display: inline-block;
    font-style: normal;
  }

  .hw-niki-all .iMob-hidden {
    display: none;
    font-style: normal;
  }

  .hw-niki-all sup,
  .hw-niki-all sup.hw-sup {
    cursor: initial;
  }
}

.hw-niki-all .gradient {
  background-image: linear-gradient(122deg, #ffeccc 0%, #aa7a4f 100%);
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
  text-fill-color: transparent;
  display: inline-block;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
  transform: translate3d(0, 0, 0);
}


/* video-bottom */
.hw-niki-all .video-play-box {
  width: 2.08333333vw;
  height: 2.08333333vw;
  position: relative;
  z-index: 10;
  display: flex;
  justify-content: center;
  align-items: baseline;
}

.hw-niki-all.wu .video-play-box {
  display: none;
}

.hw-niki-all .video-play-box-bag {
  content: '';
  position: absolute;
  inset: 0;
  background: rgba(255, 255, 255, 0.2);
  backdrop-filter: blur(2.5vw);
  -webkit-backdrop-filter: blur(2.5vw);
  border-radius: 52.03125vw;
  overflow: hidden;
  transition: .3s ease;
  -webkit-transition: .3s ease;
  -moz-transition: .3s ease;
  transform: translate3d(0, 0, 0) rotate(0deg);
}

@media (pointer: fine) and (hover: hover) {
  .hw-niki-all .video-play-box:hover {
    cursor: pointer;
  }

  .hw-niki-all .video-play-box:hover .video-play-box-bag {
    background: rgba(255, 255, 255, 0.12);
  }
}

.hw-niki-all .video-play-box img {
  position: absolute;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: opacity 0.2s cubic-bezier(0.65, 0.05, 0.36, 1);
  transform: translate3d(0, 0, 1px) rotate(0deg);
}

.hw-niki-all .video-play-box[data-state="play"] .video-pause-icon {
  opacity: 1;
}

.hw-niki-all .video-play-box[data-state="pause"] .video-play-icon {
  opacity: 1;
}

.hw-niki-all .video-play-box[data-state="replay"] .video-replay-icon {
  opacity: 1;
}

@media screen and (max-aspect-ratio:11/10) {
  .hw-niki-all .video-play-box {
    width: 8.88888888vw;
    height: 8.88888888vw;
    transform: translate3d(0, 0, 1px) rotate(0deg);
  }
}


/* price-start */
.hw-niki-all .sec1-price {
  position: relative;
  z-index: 100;
  text-align: center;
  margin: 0 auto;
}

.hw-niki-all .sec1-price .pricing {
  font-size: 1.458333vw;
  font-weight: 400;
  line-height: 1.25;
  color: #000;
}

.hw-niki-all .sec1-price .pricing span {
  font-size: 0.677083vw;
}

.hw-niki-all .sec1-price .buy-cta {
  display: inline-block;
  margin-top: 24px;
  padding: 8px 20px 9px;
  font-size: 13px;
  font-weight: 500;
  line-height: 19px;
  transition: opacity .3s cubic-bezier(0, 0, .5, 1);
  color: #fff;
  border: 2px solid #000;
  border-radius: 4px;
  background-color: #000;
  transform: translateZ(0);
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .sec1-price .buy-cta:hover {
    opacity: 0.8;
  }

  .hw-niki-all .sec1-price .pricing i {
    cursor: pointer;
    font-style: normal;
  }
}

@media screen and (max-aspect-ratio:11/10) {
  .hw-niki-all .sec1-price .pricing {
    font-size: 5.555556vw;
  }

  .hw-niki-all .sec1-price .pricing span {
    font-size: 3.6111111vw;
  }
}

.hw-niki-all .sec1-buy {
  position: relative;
  margin: 2.08333333vw 0 0;
}

@media screen and (max-aspect-ratio:11/10) {
  .hw-niki-all .sec1-buy {
    position: relative;
    margin: 8.33333vw 0 3.61111111vw;
  }
}

/* price-end */
/* 
.hw-niki-all {
    width: 100vw;
    overflow: auto;
    scrollbar-gutter: stable;
} */
.hw-niki-all .section1-2 {
  width: 100%;
  height: 150vw;
  position: relative;
}

.hw-niki-all .section1-2-sticky {
  position: sticky;
  top: 0;
  overflow: hidden;
}

.hw-niki-all .section1 {
  width: calc(100vw - calc(100vw - 100%));
  overflow: hidden;
  padding: 0 0 10.41666667vw 0;
}

.hw-niki-all .section1-center {
  position: relative;
  width: 100%;
}

.hw-niki-all .section1-images {
  width: 55.20833333vw;
  height: 48.125vw;
  position: relative;
}

.hw-niki-all .section1-images-bag {
  position: absolute;
  left: 2.1875vw;
  top: 1.97916667vw;
  width: 53.02083333vw;
  height: 46.14583333vw;
  background: #ECF0F1;
  opacity: 0;
}

.hw-niki-all .section1-img1 {
  width: 25.9375vw;
  position: absolute;
  left: -38.54166666vw;
  bottom: 10vw;
  transform: rotateX(32deg);
}

.hw-niki-all .section1-img2 {
  width: 30.78125vw;
  position: absolute;
  left: 30.10416667vw;
  top: 8.48958333vw;
  opacity: 0;
}

.hw-niki-all .section1-word {
  width: 30.72916667vw;
  position: absolute;
  left: 0;
  top: 0;
  transform: translate(34.63541666vw, 23.125vw);
}

.hw-niki-all .section1-name {
  width: 100%;
  margin-bottom: 1.66666667vw;
  transform: scale(1.6721);
  will-change: transform;
}

.hw-niki-all .section1-name svg {
  transform: translateZ(1px);
  padding-bottom: 2px;
}

.hw-niki-all .section1-ksp {
  width: 110%;
  font-weight: 500;
  color: #000000;
  font-size: 0.9375vw;
  line-height: 1.6;
  text-align: center;
  opacity: 0;
  transform: translateY(80px);
  margin-bottom: 5vw;
  margin-left: -5%;
}

.hw-niki-all .sec1-price {
  opacity: 0;
  transform: translateY(80px);
}

.hw-niki-all .section1-harmonyos {
  width: 8.33333333vw;
  margin-left: 23.75vw;
  margin-top: 3.75vw;
  opacity: 0;
  transform: translateY(80px);
}

@media screen and (max-aspect-ratio:11/10) {
  .hw-niki-all .section1-2 {
    height: auto;
  }

  .hw-niki-all .section1-2-sticky {
    position: static;
    top: initial;
  }

  .hw-niki-all .section1 {
    width: 100%;
    padding: 0 0 27.7777777vw 0;
  }

  .hw-niki-all .section1-images {
    width: 100%;
    height: 90.69444444vw;
    overflow: hidden;
  }

  .hw-niki-all .section1-images-bag {
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
  }

  .hw-niki-all .section1-img1 {
    width: 49.16666vw;
    left: 0;
    bottom: 0;
    opacity: 0;
    transform: translateX(-47vw) scale(1.1) rotateX(0deg);
  }

  .hw-niki-all .section1-img2 {
    width: 47.0833333vw;
    left: 52.916666vw;
    top: 14.7222222vw;
    opacity: 0;
    transform: translateX(52vw) scale(1.14);
  }

  .hw-niki-all .section1-word {
    width: 89.1666666vw;
    position: static;
    left: initial;
    top: initial;
    margin: 0 auto;
    transform: translate(0, 0);
  }

  .hw-niki-all .section1-name {
    margin-bottom: 4.4444444vw;
    margin-top: 16.666666666vw;
    transform: translate(0, -20vw) scale(1);
  }

  .hw-niki-all .section1-ksp {
    width: 100%;
    font-size: 2.9166666666vw;
    margin-bottom: 11.111111vw;
    margin-left: 0px;
  }

  .hw-niki-all .section1-harmonyos {
    width: 24.8611111vw;
    margin-left: 53.8888888vw;
    margin-top: 13.333333333vw;
  }
}



.hw-niki-all .section2 {
  width: calc(100vw - calc(100vw - 100%));
  padding: 0 0 10.41666667vw 0;
  position: relative;
}

.hw-niki-all .section2-center {
  width: 67.5vw;
  margin: 0 auto;
}

.hw-niki-all .section2-swiper {
  width: 100%;
  height: 37.5vw;
  will-change: transform;
}

.hw-niki-all .section2-swiper .section2-slide-bag {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.hw-niki-all .section2-swiper .section2-slide-bag::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 37.5vw;
  background: #ECF0F1;
  border-radius: 0.83333333vw;
  transform: translate3d(0, 0, 0) rotate(0deg);
  z-index: -1;
}

.hw-niki-all .section2-swiper .section2-slide-bag1::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 37.5vw;
  background: #F7FFE2;
  border-radius: 0.83333333vw;
  transform: translate3d(0, 0, 0) rotate(0deg);
  z-index: -1;
}

.hw-niki-all .section2-swiper .swiper-slide:not(:last-child) {
  margin: 0 1.25vw 0 0;
}

.hw-niki-all .section2-swiper .swiper-slide:not(:first-of-type) .section2-slide-box {
  width: 100%;
  height: 100%;
  border-radius: 0.83333333vw;
  overflow: hidden;
  position: relative;
}

.hw-niki-all .section2-slide1 .section2-slide-box {
  position: absolute;
  bottom: 0;
  left: 10.20833333vw;
  width: 75vw;
  height: 97.34375vw;
  pointer-events: none;
  overflow: hidden;
}

.hw-niki-all .section2-slide1 .section2-img {
  position: absolute;
  width: 45.625vw;
  transform: scale(0.807);
  transform-origin: 0% 0%;
  left: 72.9166666vw;
  top: -29.166666vw;
  will-change: transform, left, top;
}

.hw-niki-all .section2-slide2 .section2-video,
.hw-niki-all .section2-slide3 .section2-video {
  height: 37.5vw;
  position: relative;
  border-radius: 0.83333333vw;
  overflow: hidden;
}

.hw-niki-all .section2-slide2 .section2-video video,
.hw-niki-all .section2-slide3 .section2-video video {
  border-radius: 0.83333333vw;
  overflow: hidden;
  transform: translate3d(0, 0, 0) rotate(0deg);
  object-fit: cover;
  transform: scale(1.005);
}

.hw-niki-all .section2-slide2 .section2-video .section2-img,
.hw-niki-all .section2-slide3 .section2-video .section2-img {
  position: absolute;
  z-index: 9;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  visibility: hidden;
  will-change: opacity;
}

.hw-niki-all .section2-slide2 .section2-video .section2-img.show,
.hw-niki-all .section2-slide3 .section2-video .section2-img.show {
  opacity: 1;
  visibility: visible;
  transition: opacity 600ms 200ms linear;
  will-change: opacity;
}

@media screen and (max-aspect-ratio:7/10) {

  .hw-niki-all .section2-slide2 .section2-video .section2-img.show,
  .hw-niki-all .section2-slide3 .section2-video .section2-img.show {
    transition: opacity 400ms 200ms linear;
  }
}

.hw-niki-all .section2-slide2::before,
.hw-niki-all .section2-slide3::before {
  content: "";
  position: absolute;
  width: 100%;
  height: 10.78125vw;
  background: linear-gradient(180deg, #000000 0%, rgba(0, 0, 0, 0) 100%);
  opacity: 0.77;
  z-index: 10;
  border-radius: 0.83333333vw;
  transform: translate3d(0px, 0px, 1px);
}

.hw-niki-all .section2-slide4 .section2-img-1 {
  width: 17.03125vw;
  position: absolute;
  left: 0;
  top: 0;
  transform: translate(-16.864583vw, 33.614583vw);
  transition: transform 0.8s ease;
}

.hw-niki-all .section2-slide4.change-active .section2-img-1 {
  transform: translate(14.16666667vw, 11.14583333vw);
}

.hw-niki-all .section2-slide4 .section2-img-2 {
  width: 16.97916667vw;
  position: absolute;
  left: 26.5625vw;
  top: 6.66666667vw;
  z-index: 10;
}

.hw-niki-all .section2-slide4 .section2-img-2 .section2-img-2-video {
  width: 80%;
  height: 57%;
  position: absolute;
  left: 7%;
  top: 22%;
  z-index: -1;
  border-radius: 15%;
  overflow: hidden;
}

.hw-niki-all .section2-slide4 .section2-img-2 .section2-img-2-video video {
  object-fit: cover;
}

.hw-niki-all .section2-slide4 .section2-img-3 {
  width: 17.29166667vw;
  position: absolute;
  left: 0;
  top: 0;
  transform: translate(68.072917vw, -10.322917vw);
  transition: transform 0.8s ease;
}

.hw-niki-all .section2-slide4.change-active .section2-img-3 {
  transform: translate(37.60416667vw, 11.14583333vw);
}

.hw-niki-all .section2-slide5 .section2-img {
  width: 31.45833333vw;
  position: absolute;
  left: 18.02083333vw;
  top: 9.16666667vw;
}

.hw-niki-all .section2-slide5 .section2-img .section2-slide5-slide {
  width: 86px;
  transition: width 0.8s ease;
}

.hw-niki-all .section2-slide5.change-active .section2-img .section2-slide5-slide {
  width: 451.51px;
}

.hw-niki-all .section2-slide5 .section2-slide5-ul {
  width: 27.1875vw;
  position: absolute;
  top: 28.07291667vw;
  left: 50%;
  transform: translateX(-50%) translateY(2.08333333vw);
  display: flex;
  justify-content: space-between;
  opacity: 0;
  transition: transform 0.8s ease, opacity 0.6s ease;
}

.hw-niki-all .section2-slide5.change-active .section2-slide5-ul {
  opacity: 1;
  transform: translateX(-50%) translateY(0);
}

.hw-niki-all .section2-slide5 .section2-slide5-li {
  max-width: 6.25vw;
}

.hw-niki-all .section2-slide5 .section2-slide5-ul .section2-slide5-line {
  width: 1px;
  flex-shrink: 0;
  display: flex;
  align-items: center;
}

.hw-niki-all .section2-slide5 .section2-slide5-ul .section2-slide5-line span {
  width: 100%;
  height: 3.33333333vw;
  transform: translateY(0.20833333vw);
  background: #e1e1e3;
}

.hw-niki-all .section2-slide5 .section2-slide5-ul .section2-slide5-li-p {
  font-weight: 500;
  color: #86868B;
  font-size: max(8px, 0.83333333vw);
  line-height: 1.6;
}

.hw-niki-all .section2-slide5 .section2-slide5-ul .section2-slide5-li-number {
  font-weight: 500;
  color: #00cc1f;
  font-size: 2.8125vw;
  line-height: 1.25;
  background-image: linear-gradient(180deg, #d0d0d0 0%, #d0d0d0 22.21%, #b9ffc3 38.97%, #00cc1f 66.92%, #00cc1f 100%);
  background-size: 100% 300%;
  background-position-y: 0%;
  transition: background-position-y 0.8s 0.05s ease;
}

.hw-niki-all .section2-slide5.change-active .section2-slide5-ul .section2-slide5-li-number {
  background-position-y: 100%;
}

.hw-niki-all .section2-slide5 .section2-slide5-ul .section2-slide5-li-number span {
  font-size: 1.04166667vw;
}

.hw-niki-all .section2-slide6 .section2-img {
  height: 108.333333vw;
  border-radius: 0.83333333vw;
  overflow: hidden;
}

.hw-niki-all .section2-slide6 img {
  border-radius: 0.83333333vw;
  overflow: hidden;
  transform: translate3d(0, 0, 0) rotate(0deg);
}

.hw-niki-all .section2-tittle {
  position: absolute;
  left: 2.5vw;
  top: 2.5vw;
  right: 2.5vw;
  z-index: 10;
  opacity: 0;
  will-change: transform, opacity;
  transition-timing-function: cubic-bezier(0.85, 0.02, 0.15, 0.53);
}

.hw-niki-all .section2-tittle h2 {
  color: #ffffff;
  font-size: 1.66666667vw;
  line-height: 1.5;
  font-weight: 700;
}

.hw-niki-all .section2-tittle .section2-color-black {
  color: #000;
}

.hw-niki-all .section2-tittle .section2-color-white {
  color: #fff;
}

.hw-niki-all .section2-navigation {
  display: flex;
  justify-content: center;
  margin: 2.5vw auto 0;
  user-select: none;
}

.hw-niki-all .section2-navigation-box {
  background: transparent;
  border-radius: 100px;
  padding: 0.625vw 1.04166667vw;
  display: flex;
  align-items: center;
  position: relative;
  z-index: 10;
  overflow: hidden;
}

.hw-niki-all .section2-navigation-box::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: calc(100% - 4px);
  height: calc(100% - 4px);
  border: 2px solid #ED6D3B;
  border-radius: 100px;
  z-index: -1;
}

.hw-niki-all .section2-bottom-bag {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 100%;
  background: #ED6D3B;
  opacity: 0;
  transition: all 0.3s ease;
  border-radius: 100px;
}

.hw-niki-all .section2-navigation-box .section2-button-bag path {
  fill: #ed6d3b;
  transition: all 0.3s ease;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .section2-navigation-box:hover .section2-bottom-bag {
    top: 0;
    opacity: 1;
  }

  .hw-niki-all .section2-navigation-box:hover .section2-button-bag path {
    fill: #fff;
  }

  .hw-niki-all .section2-navigation-box:hover .section2-pagination span {
    background: #fff;
  }
}

.hw-niki-all .section2-button-prev {
  width: 2.08333333vw;
  height: 2.08333333vw;
  transform: translate3d(0, 0, 0) rotate(180deg);
  transition: all 0.3s;
  flex-shrink: 0;
}

.hw-niki-all .section2-button-prev div {
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.hw-niki-all .section2-button-prev div svg {
  height: 100%;
  width: 100%;
  display: block;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .section2-swiper .swiper-wrapper {
    cursor: pointer;
  }

  .hw-niki-all .section2-swiper .swiper-wrapper .swiper-slide-active {
    cursor: initial;
  }

  .hw-niki-all .section2-button-prev {
    cursor: pointer;
  }

  .hw-niki-all .section2-button-prev:hover {
    opacity: 0.6;
  }
}

.hw-niki-all .section2-button-prev.swiper-button-disabled {
  opacity: 0.3;
  cursor: initial;
}

.hw-niki-all .section2-button-next {
  width: 2.08333333vw;
  height: 2.08333333vw;
  transition: all 0.3s;
  flex-shrink: 0;
  transform: translate3d(0, 0, 0);
  position: relative;
}

.hw-niki-all .section2-button-next div {
  height: 100%;
  width: 100%;
  position: absolute;
  left: 0;
  top: 0;
}

.hw-niki-all .section2-button-next div svg {
  height: 100%;
  width: 100%;
  display: block;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .section2-button-next {
    cursor: pointer;
  }

  .hw-niki-all .section2-button-next:hover {
    opacity: 0.6;
  }
}

.hw-niki-all .section2-button-next.swiper-button-disabled {
  opacity: 0.3;
  cursor: initial;
}

.hw-niki-all .section2-pagination {
  display: flex;
  justify-content: space-between;
  margin: 0 0.9375vw;
  position: static;
}

.hw-niki-all .section2-pagination span {
  width: 0.52083333vw;
  height: 0.52083333vw;
  display: inline-block;
  border-radius: 50px;
  background: #ED6D3B;
  opacity: 0.2;
  transition: all 0.3s;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

}

.hw-niki-all .section2-pagination span+span {
  margin: 0 0 0 0.52083333vw;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .section2-pagination span {
    cursor: pointer;
  }

  .hw-niki-all .section2-pagination span:hover {
    opacity: 0.6;
  }
}

.hw-niki-all .section2-pagination span.swiper-pagination-bullet-active {
  opacity: 0.8;
}

@media screen and (max-aspect-ratio:11/10) {
  .hw-niki-all .section2 {
    width: 100%;
    padding: 0 0 27.77777777vw 0;
  }

  .hw-niki-all .section2-center {
    width: 82.222222vw;
  }

  .hw-niki-all .section2-swiper {
    height: auto;
  }

  .hw-niki-all .section2-swiper .section2-slide-bag::after {
    content: "";
    height: 108.333333vw;
    top: 0;
    bottom: initial;
    border-radius: 2.222222222vw;
  }

  .hw-niki-all .section2-swiper .section2-slide-bag1::after {
    content: "";
    height: 108.333333vw;
    top: 0;
    bottom: initial;
    border-radius: 2.222222222vw;
  }

  .hw-niki-all .section2-swiper .swiper-slide:not(:last-child) {
    margin: 0 4.44444444444vw 0 0;
  }

  .hw-niki-all .section2-swiper .swiper-slide:not(:first-of-type) .section2-slide-box {
    border-radius: 2.222222222vw;
    height: 108.333333vw;
  }

  .hw-niki-all .section2-swiper .swiper-slide .section2-slide-box {
    border-radius: 2.222222222vw;
    height: 108.333333vw;
  }

  .hw-niki-all .section2-slide1 .section2-slide-box {
    position: relative;
    bottom: initial;
    left: initial;
    width: 100%;
    height: 108.333333vw;
    pointer-events: auto;
  }

  .hw-niki-all .section2-slide1 .section2-img {
    position: absolute;
    width: 87.63888888vw;
    transform: scale(0.8) rotate(0deg);
    transform-origin: 50% 50%;
    left: 2.08333333vw;
    top: 22.5vw;
  }

  .hw-niki-all .section2-slide2 .section2-video,
  .hw-niki-all .section2-slide3 .section2-video {
    height: 108.333333vw;
    border-radius: 2.222222222vw;
  }

  .hw-niki-all .section2-slide2 .section2-video video,
  .hw-niki-all .section2-slide3 .section2-video video {
    border-radius: 2.222222222vw;
  }

  .hw-niki-all .section2-slide2::before,
  .hw-niki-all .section2-slide3::before {
    display: none;
  }

  .hw-niki-all .section2-slide4 .section2-img-1 {
    width: 32.2222222vw;
    transform: translate(-57vw, 70vw);
  }

  .hw-niki-all .section2-slide4.change-active .section2-img-1 {
    transform: translate(1.944444444vw, 34.02777777vw);
  }

  .hw-niki-all .section2-slide4 .section2-img-2 {
    width: 31.94444444vw;
    left: 25.5555555vw;
    top: 25.5555555vw;
  }

  .hw-niki-all .section2-slide4 .section2-img-3 {
    width: 32.63888888vw;
    transform: translate(80vw, -30vw);
    transition: transform 0.8s ease;
  }

  .hw-niki-all .section2-slide4.change-active .section2-img-3 {
    transform: translate(47.5vw, 34.0277777vw);
  }

  .hw-niki-all .section2-slide5 .section2-img {
    width: 69.166666vw;
    left: 6.52777777vw;
    top: 29.72222222vw;
  }

  /* .hw-niki-all .section2-slide5 .section2-img .section2-slide5-slide {
        width: 11.944444444vw;
    }
    .hw-niki-all .section2-slide5.change-active .section2-img .section2-slide5-slide {
        width: 63.3333333vw;
    } */
  .hw-niki-all .section2-slide5 .section2-slide5-ul {
    width: 66.666666vw;
    top: 77.5vw;
    transform: translateX(-50%) translateY(11.111111vw);
  }

  .hw-niki-all .section2-slide5 .section2-slide5-li {
    max-width: 13.8888888vw;
  }

  .hw-niki-all .section2-slide5 .section2-slide5-ul .section2-slide5-line {}

  .hw-niki-all .section2-slide5 .section2-slide5-ul .section2-slide5-line span {
    height: 8.33333333vw;
    transform: translateY(0.55555555vw);
  }

  .hw-niki-all .section2-slide5 .section2-slide5-ul .section2-slide5-li-p {
    font-size: 1.9444444vw;
  }

  .hw-niki-all .section2-slide5 .section2-slide5-ul .section2-slide5-li-number {
    font-size: 6.66666666vw;
  }

  .hw-niki-all .section2-slide5 .section2-slide5-ul .section2-slide5-li-number span {
    font-size: 2.5vw;
  }

  .hw-niki-all .section2-slide6 .section2-img {
    height: 108.333333vw;
    border-radius: 2.222222222vw;
  }

  .hw-niki-all .section2-slide6 img {
    border-radius: 2.222222222vw;
  }

  .hw-niki-all .section2-tittle {
    position: static;
    left: initial;
    top: initial;
    right: initial;
    opacity: 1;
    margin: 6.666666vw 0 0;
  }

  .hw-niki-all .section2-tittle h2 {
    color: #000;
    font-size: 5.55555vw;
    text-align: center;
  }

  .hw-niki-all .section2-navigation {
    margin: 8.888888888vw auto 0;
  }

  .hw-niki-all .section2-navigation-box {
    padding: 0 1.6666666vw;
  }

  .hw-niki-all .section2-bottom-bag span:nth-of-type(1) {
    inset: 0.416666666vw 2.2222222vw auto 2.36111111vw;
    height: 9.16666666vw;
  }

  .hw-niki-all .section2-bottom-bag span:nth-of-type(2) {
    inset: auto 2.2222222vw 1.6666666vw 2.36111111vw;
    height: 5.4166666vw;
  }

  .hw-niki-all .section2-button-prev {
    width: 13.3333333vw;
    height: 13.3333333vw;
  }

  .hw-niki-all .section2-button-next {
    width: 13.3333333vw;
    height: 13.3333333vw;
  }

  .hw-niki-all .section2-pagination {
    margin: 0 1.11111111vw;
  }

  .hw-niki-all .section2-pagination span {
    width: 2.22222222vw;
    height: 2.22222222vw;
  }

  .hw-niki-all .section2-pagination span+span {
    margin: 0 0 0 3.333333333vw;
  }
}




/* sec3 */
.hw-niki-all .section3 {
  position: relative;
  width: 100%;
  padding: 0 0 10.41666667vw 0;
  overflow: hidden;
}

.hw-niki-all .section3-word {
  width: 67.5vw;
  margin: 0 auto 4.16666667vw;
  text-align: center;
}

.hw-niki-all .section3-title {
  font-weight: 700;
  color: #000000;
  font-size: 4.16666667vw;
  line-height: 1.25;
}

.hw-niki-all .section3-center {
  width: 67.5vw;
  height: 35.625vw;
  margin: 0 auto;
}

.hw-niki-all .section3-center-hight {
  width: 100%;
  height: 59.27083vw;
  overflow: hidden;
  position: relative;
  transition: height 0.6s linear;
}

.hw-niki-all .section3.enterVisible .section3-center-hight {
  height: 35.625vw;
}

.hw-niki-all .section3-bag {
  width: 44.79166667vw;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  background: #F5F5F7;
  border-radius: 0.83333333vw;
}

.hw-niki-all .section3-bag {
  width: 42.29166667vw;
  left: 11.92708333vw;
  opacity: 0;
  transition: width 0.6s linear, left 0.6s linear, opacity 0.6s linear;
}

.hw-niki-all .section3.enterVisible .section3-bag {
  width: 44.79166667vw;
  left: 0;
  opacity: 1;
}

.hw-niki-all .section3-default {
  height: 100%;
  width: 44.79166667vw;
  position: absolute;
  left: 0;
  top: 0;
  z-index: 9;
  opacity: 1;
  pointer-events: none;
  transition: opacity 0.6s linear 0s;
  visibility: visible;
}

.hw-niki-all .section3.defaultVisible .section3-default {
  opacity: 0;
}

.hw-niki-all .section3.defaultVisible1 .section3-default {
  visibility: hidden;
  transition: visibility 0s linear 0.6s;
}

.hw-niki-all .section3.defaultVisible2 .section3-default {
  visibility: visible;
  transition: none;
}

.hw-niki-all .section3-default-box {
  transform: translateX(20.83333333vw) translateY(3.4375vw);
  transition: transform 0.6s linear;
}

.hw-niki-all .section3.enterVisible .section3-default-box {
  transform: translateX(4.58333333vw) translateY(0px);
}

.hw-niki-all .section3-default-img {
  width: 35.72916666vw;
  display: flex;
  justify-content: center;
}

.hw-niki-all .section3-default-img img {
  transform-origin: 0% 0%;
  transform: translateY(0px) scale(0.72463768);
  transition: transform 0.6s linear;
}

.hw-niki-all .section3.enterVisible .section3-default-img img {
  transform: translateY(-3.07291667vw) scale(1);
}

.hw-niki-all .section3-bot {
  width: 22.29166667vw;
  height: 100%;
  padding: 0 2.91666667vw;
  position: absolute;
  left: 45.20833333vw;
  z-index: 10;
  background: #F5F5F7;
  border-radius: 0.83333333vw;
  overflow: hidden;
  opacity: 0;
  transition: opacity 0.6s linear;
}

.hw-niki-all .section3.enterVisible .section3-bot {
  opacity: 1;
}

.hw-niki-all .section3-bottom {
  height: 100%;
  pointer-events: none;
  transform: translateX(3.4375vw);
  transition: transform 500ms linear;
}

.hw-niki-all .section3.enterVisible .section3-bottom {
  pointer-events: auto;
}

.hw-niki-all .section3.defaultVisible .section3-bottom,
.hw-niki-all .section3.defaultVisible1 .section3-bottom {
  transform: translateX(0vw);
}

.hw-niki-all .section3-bottom .swiper-wrapper {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  justify-content: center;
}

.hw-niki-all .section3-bottom .swiper-slide {
  width: calc(var(--sec3-width) / var(--html-width) * 100vw);
  height: calc(var(--sec3-height) / var(--html-width) * 100vw);
  transition: all 500ms linear 0ms;
  overflow: hidden;
  margin: 0.8333333vw 0;
}

.hw-niki-all .section3-bottom .swiper-slide .section3-bottom-bag {
  position: absolute;
  width: 100%;
  height: 100%;
  z-index: -1;
  border-radius: 0px;
}

.hw-niki-all .section3-bottom .swiper-slide.animated .section3-bottom-bag {
  border-radius: 0px;
}

.hw-niki-all .section3-bottom .swiper-slide.animated {
  width: calc(var(--sec3-open-width) / var(--html-width) * 100vw);
  height: calc(var(--sec3-open-height) / var(--html-width) * 100vw);
  transition: all 500ms linear;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .section3-bottom .swiper-slide:not(.animated):hover {
    cursor: pointer;
  }
}

.hw-niki-all .section3-front {
  width: fit-content;
  display: flex;
  align-items: center;
  transition: opacity 400ms linear 300ms;
  transform: translate3d(0px, 0px, 1px) rotate(0deg);
}

.hw-niki-all .section3-bottom .swiper-slide.animated .section3-front {
  opacity: 0;
  transition: opacity 100ms linear 0ms;
}

.hw-niki-all .section3-front-text {
  font-weight: 500;
  color: #190900;
  font-size: 0.88541667vw;
  line-height: 1.25;
  opacity: 1;
  transition: opacity 300ms linear;
  transform: translate3d(0px, 0px, 1px) rotate(0deg);
}

.hw-niki-all .section3-front-icon {
  width: 1.45833333vw;
  height: 1.45833333vw;
  margin-left: 0.83333333vw;
  opacity: 1;
  transition: opacity 300ms linear;
  transform: translate3d(0px, 0px, 1px) rotate(0deg);
}

@media (hover: hover) and (pointer: fine) {

  .hw-niki-all .section3-bottom .swiper-slide:hover .section3-front-text,
  .hw-niki-all .section3-bottom .swiper-slide:hover .section3-front-icon {
    opacity: 0.8;
    transform: translate3d(0px, 0px, 1px) rotate(0deg);
  }

  .hw-niki-all .section3.defaultVisible .section3-bottom .swiper-slide .section3-front-text,
  .hw-niki-all .section3.defaultVisible .section3-bottom .swiper-slide .section3-front-icon,
  .hw-niki-all .section3.defaultVisible1 .section3-bottom .swiper-slide .section3-front-text,
  .hw-niki-all .section3.defaultVisible1 .section3-bottom .swiper-slide .section3-front-icon {
    opacity: 0.5;
    transform: translate3d(0px, 0px, 1px) rotate(0deg);
  }

  .hw-niki-all .section3.defaultVisible .section3-bottom .swiper-slide:hover .section3-front-text,
  .hw-niki-all .section3.defaultVisible .section3-bottom .swiper-slide:hover .section3-front-icon,
  .hw-niki-all .section3.defaultVisible1 .section3-bottom .swiper-slide:hover .section3-front-text,
  .hw-niki-all .section3.defaultVisible1 .section3-bottom .swiper-slide:hover .section3-front-icon {
    opacity: 0.8;
    transform: translate3d(0px, 0px, 1px) rotate(0deg);
  }
}

.hw-niki-all .section3-back {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  bottom: 0;
}

.hw-niki-all .section3-back-box {
  width: 16.5625vw;
  height: auto;
  transform: translateY(1.45833333vw);
  opacity: 0;
  transition: opacity 100ms linear 0ms, transform 200ms linear 0ms;
}

.hw-niki-all .section3-bottom .swiper-slide.animated .section3-back-box {
  opacity: 1;
  transform: translateY(0px);
  transition: opacity 800ms linear 50ms, transform 600ms linear 0ms;
}

.hw-niki-all .section3-back-text {
  font-weight: 500;
  color: #190900;
  font-size: 0.88541667vw;
  line-height: 1.6;
}

.hw-niki-all .section3-back-text-flex {
  display: flex;
}

.hw-niki-all .section3-back-text p {
  width: 100%;
  flex-shrink: 0;
  transition: opacity 0.6s linear;
  opacity: 0;
}

.hw-niki-all .section3-back-text p.active {
  position: relative;
  opacity: 1;
  z-index: 10;
  transition-delay: 0.4s;
}

.hw-niki-all .section3-back-text p+p {
  margin-left: -100%;
}

.hw-niki-all .section3-back-text em {
  font-weight: 700;
  color: #190900;
}

.hw-niki-all .section3-color-icon {
  width: 5.05208333vw;
  display: flex;
  justify-content: space-between;
  margin-top: 0.41666667vw;
}

.hw-niki-all .section3-color-icon-item {
  width: 1.25vw;
  padding: 1px;
}

.hw-niki-all .section3-color-icon-item .section3-color-icon-line {
  opacity: 0;
  transition: opacity 0.6s linear;
}

.hw-niki-all .section3-color-icon-item.activeLine .section3-color-icon-line {
  opacity: 1;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .section3-color-icon-item:not(.activeLine):hover {
    cursor: pointer;
  }
}

.hw-niki-all .section3-color-icon-item svg {
  transform: translateZ(0px);
}

.hw-niki-all .section3-box {
  position: absolute;
  left: 0;
  top: 0;
  width: 44.79166667vw;
  height: 100%;
  z-index: 8;
  overflow: hidden;
}

.hw-niki-all .section3-box-swiper .section3-box-item {
  opacity: 0;
}

.hw-niki-all .section3-box-swiper .swiper-slide.change-active .section3-box-item {
  opacity: 1;
  transition: opacity 0.6s linear;
}

.hw-niki-all .section3-shut {
  position: absolute;
  width: 2.08333333vw;
  right: 2.08333333vw;
  top: 2.08333333vw;
  z-index: 10;
}


@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .section3-shut.active:hover {
    cursor: pointer;
  }
}

.hw-niki-all .section3-shut-img {
  width: 2.08333333vw;
  transform: translateY(3.125vw);
  opacity: 0;
  border-radius: 999px;
  visibility: hidden;
  transition: transform 600ms linear, opacity 600ms linear;
}

.hw-niki-all .section3-shut.active .section3-shut-img {
  visibility: visible;
  opacity: 1;
  transform: translateY(0px);
}

.hw-niki-all .section3-shut.active .section3-shut-img img {
  opacity: 1;
  transition: opacity 0.3s ease;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .section3-shut.active .section3-shut-img:hover img {
    opacity: 0.8;
  }
}

.hw-niki-all .section3-box-swiper {
  width: 100%;
  height: 100%;
}

.hw-niki-all .section3-box-item1 {
  width: 100%;
  height: 100%;
}

.hw-niki-all .section3-box-item1-swiper {
  width: 35.72916666vw;
  transform: translateX(4.58333333vw);
  display: flex;
  justify-content: center;
}

.hw-niki-all .section3-box-item1-swiper img {
  transform-origin: 0% 0%;
  transform: translateY(-3.07291667vw) scale(1);
}

.hw-niki-all .section3-box-item2 {
  width: 100%;
  height: 100%;
  border-radius: 0.83333333vw;
  overflow: hidden;
}

.hw-niki-all .section3-box-item2 .section3-video {
  width: 100%;
  height: 100%;
}

.hw-niki-all .section3-box-item2 video {
  object-fit: cover;
  transform: scale(1.01);
}

.hw-niki-all .section3-box-item3 {
  width: 28.85416667vw;
  height: 100%;
  transform: translateX(9.11458333vw);
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 10;
}

.hw-niki-all .section3-box-item3 .section3-box-img1 {
  width: 28.85416667vw;
  height: 47.76041667vw;
  flex-shrink: 0;
}

.hw-niki-all .section3-box-item3 .section3-box-img2 {
  position: absolute;
  left: 0;
  z-index: 10;
  flex-shrink: 0;
  /* clip-path: inset(0 100% 0 0); */
  width: 0px;
  overflow: hidden;
}

.hw-niki-all .section3-box-item3 .section3-box-img2 .section3-box-img2-box {
  width: 28.85416667vw;
  height: 47.76041667vw;
}

.hw-niki-all .section3-box-item3 .section3-box-drag {
  width: 2px;
  height: 100%;
  position: absolute;
  left: 0px;
  top: 0px;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 18;
  flex-shrink: 0;
  background: #529cc6;
  transform: translateX(0px);
}

.hw-niki-all .section3-box-item3 .section3-box-drag .section3-box-drag-icon {
  width: 2.39583333vw;
  height: 2.39583333vw;
  background: rgba(255, 255, 255, 0);
  backdrop-filter: blur(11px) brightness(0.85);
  -webkit-backdrop-filter: blur(11px) brightness(0.85);
  flex-shrink: 0;
  border-radius: 5.20833333vw;
  margin-left: -1px;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .section3-box-item3 .section3-box-drag .section3-box-drag-icon {
    cursor: pointer;
  }
}

.hw-niki-all .section3-box-item3 .section3-box-drag1 {
  opacity: 0;
  z-index: 30;
}

.hw-niki-all .section3-box-item3 .section3-box-item3-mask {
  width: 29.89583333vw;
  height: 47.76041667vw;
  position: absolute;
  left: -0.52083333vw;
  z-index: 19;
  pointer-events: none;
  flex-shrink: 0;
  transform: translate3d(0px, 0px, 0px);
}

.hw-niki-all .section3-box-item3 .section3-box-item3-hint1 {
  width: 12vw;
  position: absolute;
  right: calc(100% - 3.17708333vw);
  bottom: 1.77083333vw;
  font-weight: 500;
  color: #2e79ad;
  line-height: 1.6;
  font-size: max(8px, 0.625vw);
  transform: translateY(80px);
  opacity: 0;
  z-index: 20;
  transition: transform 0.6s linear, opacity 0.6s linear;
  text-align: right;
}

.hw-niki-all .section3-box-slide3.change-active .section3-box-item3-hint1 {
  opacity: 1;
  transform: translateX(0) translateY(0);
}

.hw-niki-all .section3-box-item3 .section3-box-item3-hint2 {
  width: 12vw;
  position: absolute;
  left: calc(100% - 5.8333333vw);
  bottom: 1.77083333vw;
  font-weight: 500;
  color: #2e79ad;
  line-height: 1.6;
  font-size: max(8px, 0.625vw);
  transform: translateY(80px);
  opacity: 0;
  z-index: 20;
  transition: transform 0.6s linear, opacity 0.6s linear;
}

.hw-niki-all .section3-box-slide3.change-active .section3-box-item3-hint2 {
    opacity: 1;
    transform: translateX(0) translateY(0);
}

.hw-niki-all .section3-box-item4 {
  width: 100%;
  height: 100%;
  border-radius: 0.83333333vw;
  overflow: hidden;
}

.hw-niki-all .section3-box-item5 {
  width: 100%;
  height: 100%;
  border-radius: 0.83333333vw;
  overflow: hidden;
}

.hw-niki-all .section3-box-item5 .section3-video {
  width: 100%;
  height: 100%;
}

.hw-niki-all .section3-box-item5 video {
  object-fit: cover;
  transform: scale(1.01);
}

.hw-niki-all .section3-box-item6 {
  width: 100%;
  height: 100%;
  border-radius: 0.83333333vw;
  overflow: hidden;
}

.hw-niki-all .section3-box-item6 .section3-video {
  width: 100%;
  height: 100%;
}

.hw-niki-all .section3-box-item6 video {
  object-fit: cover;
  transform: scale(1.01);
}

.hw-niki-all .section3-box-item7 {
  width: 44.79166667vw;
  height: 100%;
  position: absolute;
  right: 0;
}

.hw-niki-all .section3-box-item7 .section3-box-img {
  width: 11.458333vw;
  flex-shrink: 0;
  position: absolute;
}

.hw-niki-all .section3-box-item7 .section3-box-img1 {
  left: -3.22916667vw;
  top: 3.48958333vw;
  transform: translate(-10vw, -26vw) rotate(33deg);
  transition: transform 0.6s linear 0s;
}

.hw-niki-all .section3-box-item7 .section3-box-img2 {
  left: 4.58333333vw;
  top: 15.625vw;
  transform: translate(10vw, -5.5vw) scale(1.546875) rotate(33deg);
  transition: transform 0.6s linear 0s;
}

.hw-niki-all .section3-box-item7 .section3-box-img3 {
  left: 16.35416667vw;
  top: -2.1875vw;
  transform: translate(3vw, -22vw) rotate(33deg);
  transition: transform 0.6s linear 0s;
}

.hw-niki-all .section3-box-item7 .section3-box-img4 {
  left: 18.02083333vw;
  top: 19.375vw;
  transform: translate(3vw, 22vw) rotate(33deg);
  transition: transform 0.6s linear 0s;
}

.hw-niki-all .section3-box-item7 .section3-box-img5 {
  left: 30.20833333vw;
  top: 2.1875vw;
  transform: translate(17vw, -19vw) rotate(33deg);
  transition: transform 0.6s linear 0s;
}

.hw-niki-all .section3-box-item7 .section3-box-img6 {
  left: 32.5vw;
  top: 22.13541667vw;
  transform: translate(12vw, 24vw) rotate(33deg);
  transition: transform 0.6s linear 0s;
}

.hw-niki-all .section3-box-slide7.change-active .section3-box-img {
  transform: translate(0px, 0px) rotate(33deg);
  transition: transform 0.6s linear 0.6s;
}

.hw-niki-all .section3-navigation {
  display: none;
}

.hw-niki-all .section3-tip {
  width: 67.5vw;
  margin: 1.25vw auto 0;
  font-size: max(8px, 0.5729166666vw);
  font-weight: 400;
  line-height: 1.6;
  color: rgba(0, 0, 0, 0.6);
  text-align: center;
  visibility: hidden;
}

.hw-niki-all .section3-tip p {
  width: 44.79166667vw;
}

.hw-niki-all .section3.defaultVisible .section3-tip.active,
.hw-niki-all .section3.defaultVisible1 .section3-tip.active {
  visibility: visible;
}

@media screen and (max-aspect-ratio:11/10) {
  .hw-niki-all .section3 {
    padding: 0 0 27.777777vw 0;
    overflow: visible;
  }

  .hw-niki-all .section3-word {
    width: 77.2222222vw;
    margin: 0 auto 11.1111111vw;
    text-align: left;
  }

  .hw-niki-all .section3-title {
    font-size: 11.1111111vw;
  }

  .hw-niki-all .section3-center {
    width: 100%;
    height: 150vw;
  }

  .hw-niki-all .section3-center-hight {
    width: 100%;
    height: 100%;
    transition: none;
    overflow: visible;
  }

  .hw-niki-all .section3.enterVisible .section3-center-hight {
    height: 100%;
  }

  .hw-niki-all .section3-bag {
    border-radius: 0px;
    width: 100%;
    left: 0;
    opacity: 0;
    transform: translateY(13.8888888vw);
    transition: transform 0.6s linear, opacity 0.6s linear;
  }

  .hw-niki-all .section3.enterVisible .section3-bag {
    width: 100%;
    opacity: 1;
    transform: translateY(0px);
  }

  .hw-niki-all .section3-default {
    width: 100%;
  }

  .hw-niki-all .section3-default-box {
    transform: translateX(0px) translateY(0px);
  }

  .hw-niki-all .section3.enterVisible .section3-default-box {
    transform: translateX(0px) translateY(0px);
  }

  .hw-niki-all .section3-default-img {
    width: 60.277777vw;
    margin: 0 auto;
    padding-top: 5.555555vw;
  }

  .hw-niki-all .section3-default-img img {
    transform-origin: 50% 0%;
    transform: translateY(0px) scale(1.2811);
  }

  .hw-niki-all .section3.enterVisible .section3-default-img img {
    transform: translateY(0) scale(1.2);
  }

  .hw-niki-all .section3.defaultVisible .section3-default-img img,
  .hw-niki-all .section3.defaultVisible1 .section3-default-img img {
    transform: translateY(0) scale(1);
  }

  .hw-niki-all .section3-bot {
    width: 100%;
    height: auto;
    padding: 0 7.222222222vw;
    position: absolute;
    left: 0;
    bottom: 5.555555vw;
    background: transparent;
    border-radius: 0px;
    transform: translateX(0px) translateY(4.1666666vw);
    transition: transform 0.6s linear 0.5s, opacity 0.6s linear 0.5s;
  }

  .hw-niki-all .section3-bottom {
    transform: translateX(0vw);
    transition: none;
  }

  .hw-niki-all .section3.enterVisible .section3-bot {
    opacity: 1;
    transform: translateX(0px) translateY(0px);
  }

  .hw-niki-all .section3-bottom .swiper-wrapper {
    display: flex;
    flex-direction: initial;
    flex-wrap: initial;
    justify-content: initial;
    align-items: flex-end;
  }

  .hw-niki-all .section3-bottom .swiper-slide .section3-bottom-bag {
    background: rgba(236, 236, 240, 1);
    border-radius: 13.8888888vw;
  }

  .hw-niki-all .section3-bottom .swiper-slide.animated .section3-bottom-bag {
    border-radius: 6.6666666vw;
  }

  .hw-niki-all .section3-bottom .swiper-slide.animated .section3-bottom-bag-filter-mo {
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(2.5vw) brightness(0.95);
    -webkit-backdrop-filter: blur(2.5vw) brightness(0.95);
  }

  .hw-niki-all .section3-bottom .swiper-slide {
    margin: 0 1.6666666vw;
    transition: all 300ms linear 0ms;
  }

  .hw-niki-all .section3.sec3-open .section3-bottom .swiper-slide {
    width: calc(var(--sec3-open-width) / var(--html-width) * 100vw);
  }

  .hw-niki-all .section3-bottom .swiper-slide.animated {
    transition: all 300ms linear 0ms;
  }

  .hw-niki-all .section3-front {
    padding: 3.8888888vw 4.4444444vw;
    transition: opacity 240ms linear 120ms;
  }

  .hw-niki-all .section3-bottom .swiper-slide.animated .section3-front {
    opacity: 0;
    transition: opacity 60ms linear 0ms;
  }

  .hw-niki-all .section3-front-text {
    font-size: 3.8888888vw;
    flex-shrink: 0;
  }

  .hw-niki-all .section3-front-icon {
    width: 5.5555555vw;
    height: 5.5555555vw;
    margin-left: 2.2222222vw;
    flex-shrink: 0;
  }

  .hw-niki-all .section3-back-box {
    width: 71.1111111vw;
    padding: 5.5555555vw;
    transform: translateY(1.45833333vw);
    transition: opacity 100ms linear 0ms, transform 200ms linear 0ms;
  }

  .hw-niki-all .section3-bottom .swiper-slide.animated .section3-back-box {
    transition: opacity 720ms linear 30ms, transform 480ms linear 0ms;
  }

  .hw-niki-all .section3-back-text {
    font-size: 3.0555555vw;
  }

  .hw-niki-all .section3-color-icon {
    width: 36.1111111vw;
    margin-top: 3.33333333vw;
  }

  .hw-niki-all .section3-color-icon-item {
    width: 8.33333333vw;
  }

  .hw-niki-all .section3-box {
    width: 100%;
  }

  .hw-niki-all .section3-shut {
    width: 11.1111111vw;
    height: 50%;
    right: 3.333333333vw;
    top: 3.333333333vw;
  }
  
  .hw-niki-all .section3-shut.section3-shut-filter .section3-shut-img {
    background: rgba(255, 255, 255, 0);
    backdrop-filter: blur(10px) brightness(1.5);
    -webkit-backdrop-filter: blur(10px) brightness(1.5);
  }

  .hw-niki-all .section3-shut-img {
    position: sticky;
    top: calc(48px + 3.333333333vw);
    width: 100%;
  }

  .hw-niki-all .section3-box-item1-swiper {
    width: 60.2777777vw;
    transform: translateX(0);
    margin: 0 auto;
    display: flex;
    justify-content: center;
    padding-top: 5.555555vw;
  }

  .hw-niki-all .section3-box-item1-swiper img {
    transform-origin: 50% 50%;
    transform: translateY(0) scale(1);
  }

  .hw-niki-all .section3-box-item2 {
    border-radius: 0vw;
  }

  .hw-niki-all .section3-box-item3 {
    width: 68.3333333vw;
    height: auto;
    transform: translateX(0px);
    margin: 8.88888888vw auto 0;
  }

  .hw-niki-all .section3-box-item3 .section3-box-img1 {
    width: 68.3333333vw;
    height: 113.055555vw;
    flex-shrink: 0;
  }

  .hw-niki-all .section3-box-item3 .section3-box-img2 .section3-box-img2-box {
    width: 68.3333333vw;
    height: 113.055555vw;
  }

  .hw-niki-all .section3-box-item3 .section3-box-drag .section3-box-drag-icon {
    width: 9.72222222vw;
    height: 9.72222222vw;
    border-radius: 13.3333333vw;
  }

  .hw-niki-all .section3-box-item3 .section3-box-item3-mask {
    width: 70.83333333vw;
    height: 113.055555vw;
    position: absolute;
    left: -1.25vw;
    z-index: 19;
    pointer-events: none;
    flex-shrink: 0;
    transform: translate3d(0px, 0px, 0px);
  }

  .hw-niki-all .section3-box-item3 .section3-box-item3-hint1 {
    width: 27.7777777vw;
    left: -17.2222222vw;
    right: auto;
    bottom: 11.6666666vw;
    font-size: max(8px, 1.9444444vw);
    transform: translateX(32vw);
  }

  .hw-niki-all .section3-box-item3 .section3-box-item3-hint2 {
    width: 27.7777777vw;
    right: -12.7777777vw;
    left: auto;
    bottom: 11.6666666vw;
    font-size: max(8px, 1.9444444vw);
    transform: translateX(-32vw);
  }

  .hw-niki-all .section3-box-item4 {
    border-radius: 0px;
  }

  .hw-niki-all .section3-box-item5 {
    border-radius: 0px;
    display: flex;
    align-items: center;
  }

  .hw-niki-all .section3-box-item6 {
    border-radius: 0px;
  }

  .hw-niki-all .section3-box-item7 {
    width: 100%;
    height: 100%;
  }

  .hw-niki-all .section3-box-item7 .section3-box-img {
    width: 27.2222222vw;
  }

  .hw-niki-all .section3-box-item7 .section3-box-img1 {
    left: -7.5vw;
    top: 28.055555vw;
    transform: translate(0vw, -70vw) rotate(33deg);
  }

  .hw-niki-all .section3-box-item7 .section3-box-img2 {
    left: 13.88888888vw;
    top: 54.7222222vw;
    transform: translate(24vw, -10vw) scale(1.546875) rotate(33deg);
  }

  .hw-niki-all .section3-box-item7 .section3-box-img3 {
    left: 39.4444444vw;
    top: 7.2222222vw;
    transform: translate(17vw, -48vw) rotate(33deg);
  }

  .hw-niki-all .section3-box-item7 .section3-box-img4 {
    left: 42.6388888vw;
    top: 69.7222222vw;
    transform: translate(12vw, 92vw) rotate(33deg);
  }

  .hw-niki-all .section3-box-item7 .section3-box-img5 {
    left: 73.1944444vw;
    top: 25.277777vw;
    transform: translate(20vw, -63vw) rotate(33deg);
  }

  .hw-niki-all .section3-box-item7 .section3-box-img6 {
    left: 78.3333333vw;
    top: 73.1944444vw;
    transform: translate(26vw, 88vw) rotate(33deg);
  }

  .hw-niki-all .section3-box-slide7.change-active .section3-box-img {
    transform: translate(0px, 0px) rotate(33deg);
  }

  .hw-niki-all .section3.defaultVisible .section3-bottom .swiper-slide:not(.animated) .section3-bottom-bag,
  .hw-niki-all .section3.defaultVisible1 .section3-bottom .swiper-slide:not(.animated) .section3-bottom-bag {
    background: rgba(0, 0, 0, 0);
  }

  .hw-niki-all .section3.defaultVisible .section3-bottom .swiper-slide:not(.animated) .section3-front,
  .hw-niki-all .section3.defaultVisible .section3-bottom .swiper-slide:not(.animated) .section3-back,
  .hw-niki-all .section3.defaultVisible1 .section3-bottom .swiper-slide:not(.animated) .section3-front,
  .hw-niki-all .section3.defaultVisible1 .section3-bottom .swiper-slide:not(.animated) .section3-back {
    visibility: hidden;
  }

  .hw-niki-all .section3-navigation {
    display: block;
    width: 27.7777777vw;
    margin: 5.555555555vw auto 0;
    display: flex;
    justify-content: space-between;
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s linear;
  }

  .hw-niki-all .section3.sec3-open .section3-navigation {
    opacity: 1;
    pointer-events: auto;
  }

  .hw-niki-all .section3-button-next {
    width: 11.11111111vw;
    height: 11.11111111vw;
    transform: rotate(180deg);
  }

  .hw-niki-all .section3-button-prev {
    width: 11.11111111vw;
    height: 11.11111111vw;
  }

  .hw-niki-all .section3-button-next.swiper-button-disabled,
  .hw-niki-all .section3-button-prev.swiper-button-disabled {
    opacity: 0.5;
    pointer-events: none;
  }

  .hw-niki-all .section3-tip {
    width: 50vw;
    margin: 0px;
    padding: 0;
    font-size: 2.22222222vw;
    position: absolute;
    top: calc(100% + 5.27777777vw - 27.7777777777vw);
    left: 25vw;
    text-align: left;
  }

  .hw-niki-all .section3-tip p {
    width: 100%;
  }
}




/* sec4 */
.hw-niki-all .section4 {
  width: 100%;
  padding: 0 0 10.41666667vw 0;
  overflow: hidden;
}

.hw-niki-all .section4-center {
  width: 67.5vw;
  margin: 0 auto;
}

.hw-niki-all .section4-top {
  width: 100%;
  position: relative;
}

.hw-niki-all .section4-top-video {
  width: 8.33333333vw;
  height: 8.33333333vw;
  margin: 0 auto;
  transform: scale(3);
  transform-origin: 50% 0%;
  overflow: hidden;
}

.hw-niki-all .section4 .section4-top-video video {
  transform: scale(1.01);
  mix-blend-mode: darken;
}

.hw-niki-all .section4-word {
  width: 100%;
  padding: 1.25vw 0 4.16666667vw;
  transform: translateY(27.08333333vw);
  display: flex;
  justify-content: center;
}

.hw-niki-all .section4-word h2 {
  flex-shrink: 0;
  font-weight: 700;
  color: #000;
  font-size: 4.16666667vw;
  line-height: 1.25;
}

.hw-niki-all .section4-width {
  width: 0px;
  height: calc(4.16666667vw * 1.25);
  position: relative;
  margin-right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

.hw-niki-all .section4-video {
  width: 0px;
  height: 2.8125vw;
  border-radius: 0.83333333vw;
  overflow: hidden;
  position: absolute;
  top: calc(100% - 4.01041667vw);
  left: 0;
  will-change: width, height;
}

.hw-niki-all .section4-video .video-play-box {
  position: absolute;
  right: 2.08333333vw;
  bottom: 2.08333333vw;
}

.hw-niki-all .section4-video img,
.hw-niki-all .section4-video video {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.hw-niki-all .section4-box {
  width: 100%;
  height: 39.0625vw;
}

.hw-niki-all .section4-text {
  width: 30.72916667vw;
  margin: 2.08333333vw auto 0;
  color: #86868b;
  font-size: 1.14583333vw;
  line-height: 1.6;
  font-weight: 500;
  text-align: center;
}

.hw-niki-all .section4-btn {
  opacity: 0;
}

@media screen and (max-aspect-ratio:11/10) {
  .hw-niki-all .section4 {
    padding: 0 0 27.777777vw 0;
  }

  .hw-niki-all .section4-center {
    width: 100%;
  }

  .hw-niki-all .section4-top-video {
    width: 27.77777777vw;
    height: 27.77777777vw;
    transform: scale(3);
    transition: transform 0.3s ease;
  }

  .hw-niki-all .section4.enterVisible .section4-top-video {
    transform: scale(1);
  }

  .hw-niki-all .section4-word {
    width: 100%;
    padding: 0vw 0 11.1111111vw;
    transform: translateY(35vw);
    display: block;
    transition: transform 0.3s ease;
  }

  .hw-niki-all .section4.enterVisible .section4-word {
    transform: translateY(0px);
  }

  .hw-niki-all .section4-word h2 {
    width: 90vw;
    font-size: 11.1111111vw;
    text-align: center;
    margin: 0 auto;
  }

  .hw-niki-all .section4-width {
    width: 0px;
    height: 0;
    position: static;
    display: inline;
  }

  .hw-niki-all .section4-video {
    width: 100%;
    height: 111.1111111vw;
    border-radius: 0px;
    top: 100%;
    left: 0;
  }

  .hw-niki-all .section4-video video {
    transform: scale(1.01);
  }

  .hw-niki-all .section4-video .video-play-box {
    right: 3.33333333vw;
    bottom: 3.33333333vw;
  }

  .hw-niki-all .section4-box {
    height: 111.1111111vw;
  }

  .hw-niki-all .section4-text {
    width: 73.33333333vw;
    margin: 5.55555555vw auto 0;
    font-size: 4.44444444vw;
  }

  .hw-niki-all .section4-btn {
    opacity: 1;
  }
}





/* zpj */
.hw-niki-all .sec {
  padding: 5.20833333vw 0;
  overflow: hidden;
}

.hw-niki-all .rounded {
  border-radius: 0.83333333vw;
  -webkit-border-radius: 0.83333333vw;
  -moz-border-radius: 0.83333333vw;
  -ms-border-radius: 0.83333333vw;
  -o-border-radius: 0.83333333vw;
  overflow: hidden;
  transform: translate3d(0, 0, 0) rotate(0deg);
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .sec {
    padding: 13.888889vw 0;
  }

  .hw-niki-all .rounded {
    border-radius: 2.222222vw;
    -webkit-border-radius: 2.222222vw;
    -moz-border-radius: 2.222222vw;
    -ms-border-radius: 2.222222vw;
    -o-border-radius: 2.222222vw;
  }
}

.hw-niki-all .opc {
  opacity: 0;
  transform: translate3d(0, 30px, 0);
  -webkit-transform: translate3d(0, 30px, 0);
  -moz-transform: translate3d(0, 30px, 0);
  pointer-events: none;
  will-change: opacity, transform;
}

.hw-niki-all .opc.animated {
  transition: opacity 0.9s 0.15s ease, transform 0.7s 0.15s ease;
  -webkit-transition: opacity 0.9s 0.15s ease, transform 0.7s 0.15s ease;
  -moz-transition: opacity 0.9s 0.15s ease, transform 0.7s 0.15s ease;
  opacity: 1;
  pointer-events: all;
  transform: translate3d(0, 0, 0);
}

.hw-niki-all .opt,
.hw-niki-all .omc {
  opacity: 0;
  transform: translate3d(0, 30px, 0);
  -webkit-transform: translate3d(0, 30px, 0);
  -moz-transform: translate3d(0, 30px, 0);
  pointer-events: none;
  transition: opacity 0.9s ease, transform 0.7s ease;
  -webkit-transition: opacity 0.9s ease, transform 0.7s ease;
  -moz-transition: opacity 0.9s ease, transform 0.7s ease;
  will-change: opacity, transform;
}

.hw-niki-all .omc.animated {
  opacity: 1;
  pointer-events: all;
  transform: translate3d(0, 0, 0);
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .omt {
    opacity: 0;
    transform: translate3d(0, 30px, 0);
    -webkit-transform: translate3d(0, 30px, 0);
    -moz-transform: translate3d(0, 30px, 0);
    transition: opacity 0.9s 0.15s ease, transform 0.7s 0.15s ease;
    -webkit-transition: opacity 0.9s 0.15s ease, transform 0.7s 0.15s ease;
    -moz-transition: opacity 0.9s 0.15s ease, transform 0.7s 0.15s ease;
    pointer-events: none;
    will-change: opacity, transform;
  }

  .hw-niki-all .omt.animated {
    opacity: 1;
    pointer-events: all;
    transform: translate3d(0, 0, 0);
  }

  .hw-niki-all .opt {
    opacity: 1;
    pointer-events: all;
    transform: translate3d(0, 0, 0);
    transition: none;
  }
}

/* switch start */
.hw-niki-all .switch-button {
  margin: 2.5vw auto 0;
  width: 67.5vw;
}

.hw-niki-all .public-swiper-parent video {
  object-fit: cover;
}

.hw-niki-all .public-trigger .switch-button {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s linear;
  will-change: opacity;
}

.hw-niki-all .public-trigger.animated .switch-button {
  opacity: 1;
  pointer-events: all;
  transition-delay: 0.8s;
}

.hw-niki-all .switch-content {
  margin-left: auto;
  width: fit-content;
  width: -webkit-fit-content;
  display: flex;
  align-items: center;
}

.hw-niki-all .switch-btn {
  width: 2.5vw;
  height: 2.5vw;
  position: relative;
}

.hw-niki-all .switch-btn.nav-disabled {
  opacity: 0.3;
  pointer-events: none;
}

.hw-niki-all .switch-btn-before {
  content: "";
  display: flex;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 100%;
  pointer-events: none;
  overflow: hidden;
}

.hw-niki-all .switch-btn-before div {
  width: 100%;
  height: 100%;
  border-radius: 100%;
  transform: translateY(-100%);
  transition: .6s ease;
  background-color: #ED6D3B;
}

.hw-niki-all .switch-next .switch-btn-before div {
  transform: translateY(100%);
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .switch-btn:not(.nav-disabled):hover {
    cursor: pointer;
  }

  .hw-niki-all .switch-btn:not(.nav-disabled):hover .switch-btn-before div {
    transform: translateY(0%);
    pointer-events: all;
  }
}

.hw-niki-all .switch-btn .switch-btn-svg {
  width: 2.5vw;
  height: 2.5vw;
  display: flex;
}

.hw-niki-all .switch-btn svg {
  width: 2.5vw;
  height: 2.5vw;
  overflow: visible;
  transform: translate3d(0, 0, 0) rotate(0deg);
  position: relative;
  z-index: 2;
}

.hw-niki-all .switch-btn svg path {
  transition: all 0.6s ease;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .switch-btn:not(.nav-disabled):hover path {
    fill: #fff;
  }
}

.hw-niki-all .switch-prev {
  transform: scale(-1);
}

.hw-niki-all .switch-next {
  margin-left: 1.25vw;
}

.hw-niki-all .public-title {
  margin: 0 auto;
  width: 67.5vw;
  text-align: center;
}

.hw-niki-all .public-sub {
  font-size: 1.25vw;
  font-weight: 400;
  line-height: 1.6;
}

.hw-niki-all .public-h2 {
  font-size: 3.33333333vw;
  line-height: 1.25;
  font-weight: 700;
  color: #000;
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .switch-button {
    margin: 11.111111vw auto 0;
    width: 82.222222vw;
  }

  .hw-niki-all .public-trigger .switch-button {
    opacity: 1;
    transition: none;
    pointer-events: all;
  }

  .hw-niki-all .switch-btn {
    width: 11.111111vw;
    height: 11.111111vw;
  }

  .hw-niki-all .switch-btn .switch-btn-svg {
    width: 11.111111vw;
    height: 11.111111vw;
  }

  .hw-niki-all .switch-btn svg {
    width: 11.111111vw;
    height: 11.111111vw;
  }

  .hw-niki-all .switch-next {
    margin-left: 5.555556vw;
  }

  .hw-niki-all .public-title {
    width: 82.222222vw;
    text-align: left;
  }

  .hw-niki-all .public-sub {
    font-size: 4.444444vw;
  }

  .hw-niki-all .public-h2 {
    font-size: 8.888889vw;
  }
}

/* switch end */

/* video-control-btn */
.hw-niki-all .video-control-btn {
  width: 2.0833334vw;
  height: 2.0833334vw;
  position: absolute;
  right: 1.25vw;
  bottom: 1.25vw;
  z-index: 1;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-transition: 50%;
  -o-transition: 50%;
  background-color: rgba(128, 128, 128, .5);
  backdrop-filter: blur(2.5vw);
  -webkit-backdrop-filter: blur(2.5vw);
  transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
}

@media (pointer: fine) and (hover: hover) {
  .hw-niki-all .video-control-btn:hover {
    background-color: rgba(128, 128, 128, .12);
    cursor: pointer;
  }
}

.hw-niki-all .video-control-btn.btn-disabled {
  pointer-events: none;
  opacity: 0;
}

.hw-niki-all .video-control-btn .video-btn {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.3s ease;
  -webkit-transition: opacity 0.3s ease;
  -moz-transition: opacity 0.3s ease;
  -ms-transition: opacity 0.3s ease;
  -o-transition: opacity 0.3s ease;
}

.hw-niki-all .video-control[data-state="play"] .video-btn-play {
  opacity: 1;
}

.hw-niki-all .video-control[data-state="pause"] .video-btn-pause {
  opacity: 1;
}

.hw-niki-all .video-control[data-state="replay"] .video-btn-replay {
  opacity: 1;
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .video-control-btn {
    width: 8.888889vw;
    height: 8.888889vw;
    right: 3.333333vw;
    bottom: 3.333333vw;
  }
}

/* video-control-btn */

.hw-niki-all .video-sticky {
  position: sticky;
  top: 0;
}

.hw-niki-all .video-mask {
  position: relative;
}

.hw-niki-all .video-mask::before {
  content: '';
  position: absolute;
  left: 0;
  bottom: -1px;
  width: 100%;
  z-index: 1;
}

.hw-niki-all .video-title {
  position: absolute;
  bottom: 8.33333333vw;
  left: 9.89583333vw;
  width: 36.45833333vw;
  text-align: left;
  z-index: 2;
}

.hw-niki-all .video-sub {
  font-size: 1.25vw;
  font-weight: 400;
  line-height: 1.25;
}

.hw-niki-all .video-h2 {
  margin-top: 0.83333333vw;
  font-size: 3.33333333vw;
  font-weight: 700;
  line-height: 1.25;
  color: #fff;
}

.hw-niki-all .video-backdrop {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
  background: rgba(0, 0, 0, 0.001);
  backdrop-filter: blur(0px);
  -webkit-backdrop-filter: blur(0px);
  -moz-backdrop-filter: blur(0px);
  will-change: backdrop-filter;
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .video-sticky {
    position: static;
    top: 0;
    overflow: hidden;
  }

  .hw-niki-all .video-mask::before {
    height: 81.25vw;
    background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
  }

  .hw-niki-all .video-title {
    bottom: 22.222222vw;
    left: 8.888889vw;
    width: 55.555556vw;
  }

  .hw-niki-all .video-sub {
    font-size: 4.444444vw;
  }

  .hw-niki-all .video-h2 {
    margin-top: 2.222222vw;
    font-size: 8.888889vw;
  }

  .hw-niki-all .video-backdrop {
    background: rgba(0, 0, 0, 0.65);
    backdrop-filter: blur(6.666667vw);
    -webkit-backdrop-filter: blur(6.666667vw);
    -moz-backdrop-filter: blur(6.666667vw);
  }
}

/* micro-sport start */
.hw-niki-all .micro-sport {
  padding-bottom: 10.41666667vw;
  overflow: hidden;
}

.hw-niki-all .micro-sport .micro-swiper {
  margin: 0 auto;
  width: 67.5vw;
  overflow: visible;
}

.hw-niki-all .micro-sport .micro-swiper .swiper-wrapper {
  transition-timing-function: ease;
}

@media (pointer: fine) and (hover: hover) {
  .hw-niki-all .micro-sport .micro-swiper .swiper-slide:not(.swiper-slide-active):hover {
    cursor: pointer;
  }

  .hw-niki-all .micro-sport .micro-swiper.isend .swiper-wrapper .swiper-slide:nth-last-of-type(-n+1) {
    cursor: default;
  }
}

.hw-niki-all .micro-sport .micro-inner {
  height: 26.04166667vw;
  display: flex;
  align-items: center;
  justify-content: center;
}

.hw-niki-all .micro-sport .micro-inner video {
  object-fit: cover;
}

.hw-niki-all .micro-sport .swiper-slide.opc.animated:nth-child(1) {
  transition-delay: 0s;
}

.hw-niki-all .micro-sport .swiper-slide.opc.animated:nth-child(2) {
  transition-delay: 0.2s;
}

.hw-niki-all .micro-sport .swiper-slide.opc.animated:nth-child(3) {
  transition-delay: 0.4s;
}

.hw-niki-all .micro-sport .swiper-slide.opc.animated:nth-child(4) {
  transition-delay: 0.6s;
}

.hw-niki-all .micro-sport .swiper-slide:nth-child(1) .micro-inner,
.hw-niki-all .micro-sport .swiper-slide:last-child .micro-inner {
  background: #f5f5f7;
}

.hw-niki-all .micro-sport .micro-inner .micro-ctn {
  position: relative;
  width: 12.76041667vw;
  height: 21.14583333vw;
  flex-shrink: 0;
}

.hw-niki-all .micro-sport .micro-inner .micro-img {
  position: relative;
  z-index: 2;
}

.hw-niki-all .micro-sport .micro-inner .micro-video {
  position: absolute;
  top: 4.84375vw;
  left: 0.98958333vw;
  width: 9.79166667vw;
  height: 11.51041667vw;
  border-radius: 0.83333333vw;
  -webkit-border-radius: 0.83333333vw;
  -moz-border-radius: 0.83333333vw;
  overflow: hidden;
  z-index: 1;
}

.hw-niki-all .micro-sport .swiper-slide .micro-txt {
  margin: 2.08333333vw 0 0 0.83333333vw;
  width: 22.29166667vw;
  font-size: 1.04166667vw;
  line-height: 1.6;
  font-weight: 500;
  color: #86868b;
}

.hw-niki-all .micro-sport .swiper-slide .micro-txt span {
  font-weight: 700;
  color: #000;
}

.hw-niki-all .micro-sport .swiper-slide:last-child .micro-inner-swiper {
  position: absolute;
  top: 4.84375vw;
  left: 1.04166667vw;
  width: 9.84375vw;
  height: 11.51041667vw;
  border-radius: 0.83333333vw;
  -webkit-border-radius: 0.83333333vw;
  -moz-border-radius: 0.83333333vw;
  overflow: hidden;
  transform-origin: 50% 50%;
  transform: scaleX(1.015);
}

.hw-niki-all .micro-sport .swiper-slide:last-child .micro-inner {
  flex-direction: column;
}

.hw-niki-all .micro-sport .micro-btn {
  flex-shrink: 0;
  margin-top: 1.04166667vw;
  display: flex;
  align-self: flex-start;
  margin-left: 13.75vw;
}

.hw-niki-all .micro-sport .micro-btn li {
  width: 0.625vw;
  height: 0.625vw;
  border-radius: 999px;
  background: rgba(201, 201, 201, .6);
  transition: all 0.3s linear;
  transform: translate3d(0, 0, 0) rotate(0deg);
  will-change: transform;
}

.hw-niki-all .micro-sport .micro-btn li:not(:last-child) {
  margin-right: 0.41666667vw;
}

.hw-niki-all .micro-sport .micro-btn li.active {
  background: rgba(201, 201, 201);
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .micro-sport {
    padding-bottom: 27.777778vw;
  }

  .hw-niki-all .micro-sport .micro-swiper {
    width: 82.222222vw;
  }

  .hw-niki-all .micro-sport .micro-inner {
    height: 83.333333vw;
  }

  .hw-niki-all .micro-sport .micro-inner .micro-ctn {
    width: 41.527778vw;
    height: 68.888889vw;
  }

  .hw-niki-all .micro-sport .micro-inner .micro-video {
    top: 15.694444vw;
    left: 3.194444vw;
    width: 32.5vw;
    height: 38.333333vw;
    border-radius: 2.222222vw;
    -webkit-border-radius: 2.222222vw;
    -moz-border-radius: 2.222222vw;
  }

  .hw-niki-all .micro-sport .swiper-slide .micro-txt {
    margin: 6.666667vw 0 0 2.222222vw;
    width: 73.333333vw;
    font-size: 4.444444vw;
  }

  .hw-niki-all .micro-sport .swiper-slide:last-child .micro-inner-swiper {
    top: 15.625vw;
    left: 3.402778vw;
    width: 31.944444vw;
    height: 37.638889vw;
    border-radius: 2.222222vw;
    -webkit-border-radius: 2.222222vw;
    -moz-border-radius: 2.222222vw;
  }

  .hw-niki-all .micro-sport .swiper-slide:last-child .micro-inner {
    padding-left: 20.416667vw;
    flex-direction: row;
    justify-content: flex-start;
  }

  .hw-niki-all .micro-sport .micro-btn {
    display: block;
    margin: 0 0 0 10vw;
    align-self: center;
  }

  .hw-niki-all .micro-sport .micro-btn li {
    width: 2.777778vw;
    height: 2.777778vw;
  }

  .hw-niki-all .micro-sport .micro-btn li:not(:last-child) {
    margin: 0 0 1.944444vw 0;
  }
}

/* micro-sport end */

/* ball-sport start */
.hw-niki-all .ball-sport .video-mask::before {
  height: 25.83333333vw;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
}

.hw-niki-all .ball-sport .ball-video {
  position: relative;
  overflow: hidden;
}

.hw-niki-all .ball-sport .video-load {
  height: 100vh;
  overflow: hidden;
}

.hw-niki-all .ball-sport .video-load video {
  transform-origin: 50% 50%;
  transform: scale(1.2);
  will-change: transform;
}

.hw-niki-all .ball-sport .video-txt {
  opacity: 0;
  pointer-events: none;
  transform: translateY(15.625vw);
  transition: opacity 0.6s linear, transform 0.6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
  will-change: opacity, transform;
}

.hw-niki-all .ball-sport .video-txt.animated {
  pointer-events: all;
  opacity: 1;
  transform: translateY(0);
}

.hw-niki-all .ball-sport .ball-sub {
  color: #e6304c;
}

.hw-niki-all .ball-sport .ball-content {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.hw-niki-all .ball-sport .ball-swiper {
  width: 67.5vw;
  z-index: 5;
  overflow: visible;
}

.hw-niki-all .ball-sport .swiper-slide {
  width: 21.66666667vw;
}

.hw-niki-all .ball-sport .ball-swiper .swiper-slide {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  will-change: opacity;
}

.hw-niki-all .ball-sport .ball-swiper.active .swiper-slide {
  opacity: 1;
  pointer-events: all;
}

.hw-niki-all .ball-sport .ball-swiper.animated .swiper-slide .opt {
  opacity: 1;
  transform: translateY(0);
  pointer-events: all;
}

.hw-niki-all .ball-sport .swiper-slide:nth-child(1) .opt {
  transition-delay: 0s;
}

.hw-niki-all .ball-sport .swiper-slide:nth-child(2) .opt {
  transition-delay: 0.15s;
}

.hw-niki-all .ball-sport .swiper-slide:nth-child(3) .opt {
  transition-delay: 0.3s;
}

.hw-niki-all .ball-sport .swiper-slide .ball-img {
  width: 21.66666667vw;
  height: 26.04166667vw;
}

.hw-niki-all .ball-sport .swiper-slide:nth-child(3) {
  margin-right: 0 !important;
}

.hw-niki-all .ball-sport .swiper-slide .ball-txt {
  margin: 2.08333333vw 0 0 0.83333333vw;
  width: 17.70833333vw;
  font-size: 1.04166667vw;
  color: #86868b;
  line-height: 1.6;
  font-weight: 500;
}

.hw-niki-all .ball-sport .swiper-slide .ball-txt span {
  color: #fff;
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .ball-sport .video-mask::before {
    height: 81.25vw;
  }

  .hw-niki-all .ball-sport,
  .hw-niki-all .ball-container,
  .hw-niki-all .ball-sport .ball-video {
    overflow: hidden;
  }

  .hw-niki-all .ball-sport .video-load {
    height: 150vw;
  }

  .hw-niki-all .ball-sport .video-txt {
    transform: translateY(27.777778vw);
    transition: opacity 0.9s linear, transform 0.7s cubic-bezier(0.26, 0.67, 0.48, 0.91);
  }

  .hw-niki-all .ball-sport .ball-content {
    padding: 8.888889vw 0;
    width: 100%;
    height: auto;
    position: relative;
    flex-direction: column;
  }

  .hw-niki-all .ball-sport .ball-swiper-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .hw-niki-all .ball-sport .ball-swiper {
    margin: 0 auto;
    width: 82.222222vw;
    position: relative;
    top: 0;
    left: 0;
    transform: translate(0, 0);
  }

  .hw-niki-all .ball-sport .swiper-slide {
    width: 82.222222vw;
  }

  .hw-niki-all .ball-sport .swiper-slide .opt {
    transform: translate3d(0, 0, 0);
    opacity: 1;
    pointer-events: all;
    transition: none;
  }

  .hw-niki-all .ball-sport .swiper-slide .ball-img {
    width: 82.222222vw;
    height: 83.333333vw;
  }

  .hw-niki-all .ball-sport .swiper-slide:nth-child(1) .omt.animated {
    transition-delay: 0s;
  }

  .hw-niki-all .ball-sport .swiper-slide:nth-child(2) .omt.animated {
    transition-delay: 0.2s;
  }

  .hw-niki-all .ball-sport .swiper-slide:nth-child(3) .omt.animated {
    transition-delay: 0.4s;
  }

  .hw-niki-all .ball-sport .swiper-slide .ball-txt {
    margin: 6.666667vw 0 0 2.222222vw;
    width: 73.333333vw;
    font-size: 4.444444vw;
    font-weight: 500;
  }

  .hw-niki-all .ball-sport .swiper-slide:nth-child(1),
  .hw-niki-all .ball-sport .swiper-slide:nth-child(2),
  .hw-niki-all .ball-sport .swiper-slide:nth-child(3) {
    transform: translateY(0);
    transition: none;
    opacity: 1;
  }

  .hw-niki-all .ball-sport .switch-button {
    position: relative;
    z-index: 5;
  }
}

/* ball-sport end */

/* cycling-sport start */
.hw-niki-all .cycling-sport .video-mask::before {
  height: 26.25vw;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.86) 100%);
}

.hw-niki-all .cycling-sport .cycling-video {
  position: relative;
  overflow: hidden;
}

.hw-niki-all .cycling-sport .video-load {
  height: 100vh;
  overflow: hidden;
}

.hw-niki-all .cycling-sport .video-load video {
  transform-origin: 50% 50%;
  transform: scale(1.2);
  will-change: transform;
}

.hw-niki-all .cycling-sport .video-txt {
  opacity: 0;
  pointer-events: none;
  transform: translateY(15.625vw);
  transition: opacity 0.6s linear, transform 0.6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
  will-change: opacity, transform;
}

.hw-niki-all .cycling-sport .video-txt.animated {
  pointer-events: all;
  opacity: 1;
  transform: translateY(0);
}

.hw-niki-all .cycling-sport .cycling-sub {
  color: #e6304c;
}

.hw-niki-all .cycling-sport .cycling-content {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.hw-niki-all .cycling-sport .cycling-swiper {
  overflow: visible;
  width: 67.5vw;
  z-index: 5;
}

@media (pointer: fine) and (hover: hover) {
  .hw-niki-all .cycling-sport .cycling-swiper .swiper-slide:not(.swiper-slide-active):hover {
    cursor: pointer;
  }

  .hw-niki-all .cycling-sport .cycling-swiper.isend .swiper-wrapper .swiper-slide:nth-last-of-type(-n+1) {
    cursor: default;
  }
}

.hw-niki-all .cycling-sport .cycling-swiper .swiper-wrapper {
  transition-timing-function: ease;
}

.hw-niki-all .cycling-sport .swiper-slide {
  width: 21.66666667vw;
}

.hw-niki-all .cycling-sport .cycling-swiper .swiper-slide {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  will-change: opacity;
}

.hw-niki-all .cycling-sport .cycling-swiper.active .swiper-slide {
  opacity: 1;
  pointer-events: all;
}

.hw-niki-all .cycling-sport .cycling-swiper.animated .swiper-slide .opt,
.hw-niki-all .cycling-sport .cycling-swiper.animated .switch-button {
  opacity: 1;
  transform: translateY(0);
  pointer-events: all;
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(1) .opt {
  transition-delay: 0s;
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(2) .opt {
  transition-delay: 0.15s;
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(3) .opt {
  transition-delay: 0.3s;
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(4) .opt {
  transition-delay: 0.45s;
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(5) .opt {
  transition-delay: 0.6s;
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(6) .opt {
  transition-delay: 0.75s;
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(7) .opt {
  transition-delay: 0.9s;
}

.hw-niki-all .cycling-sport .swiper-slide .cycling-img {
  width: 21.66666667vw;
  height: 26.04166667vw;
}

.hw-niki-all .cycling-sport .swiper-slide .cycling-cta {
  width: 21.66666667vw;
  height: 26.04166667vw;
  position: relative;
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(1) .cycling-cta {
  background: linear-gradient(177.99deg, #523f09 18.92%, #3c3005 40.14%, #261e03 71.21%);
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(3) .cycling-cta {
  background: linear-gradient(180deg, #303e07 0%, #1e2705 100%);
}

.hw-niki-all .cycling-sport .swiper-slide .cycling-cta .cycling-img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(1) .cycling-cta .cycling-img {
  width: 19.42708333vw;
  height: 22.91666667vw;
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(3) .cycling-cta .cycling-img {
  width: 16.875vw;
  height: 14.73958333vw;
}

.hw-niki-all .cycling-sport .swiper-slide .cycling-txt {
  width: 19.79166667vw;
}

.hw-niki-all .cycling-sport .swiper-slide .cycling-txt span {
  color: #fff;
  font-weight: 700;
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(5) {
  width: 46.25vw !important;
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(5) .cycling-img {
  width: 46.25vw !important;
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(7) {
  width: 22.70833333vw !important;
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(7) .cycling-img {
  width: 22.70833333vw !important;
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(7) {
  width: 22.70833333vw;
}

.hw-niki-all .cycling-sport .swiper-slide:nth-child(5) .cycling-txt {
  width: 27.91666667vw;
}

.hw-niki-all .cycling-sport .swiper-slide .cycling-txt {
  margin: 2.08333333vw 0 0 0.83333333vw;
  font-size: 1.04166667vw;
  color: #86868b;
  line-height: 1.6;
  font-weight: 500;
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .cycling-sport .video-mask::before {
    height: 81.25vw;
  }

  .hw-niki-all .cycling-sport,
  .hw-niki-all .cycling-container,
  .hw-niki-all .cycling-sport .cycling-video {
    overflow: hidden;
  }

  .hw-niki-all .cycling-sport .video-load {
    height: 150vw;
  }

  .hw-niki-all .cycling-sport .video-txt {
    transform: translateY(27.777778vw);
  }

  .hw-niki-all .cycling-sport .cycling-content {
    padding: 8.88889vw 0;
    width: 100%;
    height: auto;
    position: relative;
  }

  .hw-niki-all .cycling-sport .cycling-swiper-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .hw-niki-all .cycling-sport .cycling-swiper {
    margin: 0 auto;
    width: 82.222222vw;
    position: relative;
    top: 0;
    left: 0;
    transform: translate(0, 0);
  }

  .hw-niki-all .cycling-sport .swiper-slide,
  .hw-niki-all .cycling-sport .swiper-slide:nth-child(5),
  .hw-niki-all .cycling-sport .swiper-slide:nth-child(7) {
    width: 100% !important;
  }

  .hw-niki-all .cycling-sport .swiper-slide .cycling-img {
    width: 100%;
    height: 83.333333vw;
  }

  .hw-niki-all .cycling-sport .swiper-slide .cycling-cta {
    width: 100%;
    height: 83.333333vw;
  }

  .hw-niki-all .cycling-sport .swiper-slide:nth-child(1) .cycling-cta .cycling-img {
    width: 62.222222vw;
    height: 73.055556vw;
  }

  .hw-niki-all .cycling-sport .swiper-slide:nth-child(3) .cycling-cta .cycling-img {
    width: 62.777778vw;
    height: 53.194444vw;
  }

  .hw-niki-all .cycling-sport .swiper-slide:nth-child(5) .cycling-img,
  .hw-niki-all .cycling-sport .swiper-slide:nth-child(7) .cycling-img {
    width: 100% !important;
    height: 83.333333vw;
  }

  .hw-niki-all .cycling-sport .swiper-slide .cycling-txt,
  .hw-niki-all .cycling-sport .swiper-slide:nth-child(5) .cycling-txt {
    width: 73.333333vw;
  }

  .hw-niki-all .cycling-sport .swiper-slide .cycling-txt {
    margin: 6.666667vw 0 0 2.222222vw;
    font-size: 4.444444vw;
    font-weight: 500;
  }

  .hw-niki-all .cycling-sport .cycling-swiper .swiper-slide {
    transform: translateY(0);
    transition: none;
    opacity: 1;
  }

  .hw-niki-all .cycling-sport .swiper-slide:nth-child(1) .omt.animated {
    transition-delay: 0s;
  }

  .hw-niki-all .cycling-sport .swiper-slide:nth-child(2) .omt.animated {
    transition-delay: 0.2s;
  }

  .hw-niki-all .cycling-sport .swiper-slide:nth-child(3) .omt.animated {
    transition-delay: 0.4s;
  }

  .hw-niki-all .cycling-sport .swiper-slide:nth-child(4) .omt.animated {
    transition-delay: 0.6s;
  }

  .hw-niki-all .cycling-sport .swiper-slide:nth-child(5) .omt.animated {
    transition-delay: 0.8s;
  }

  .hw-niki-all .cycling-sport .swiper-slide:nth-child(6) .omt.animated {
    transition-delay: 1s;
  }

  .hw-niki-all .cycling-sport .swiper-slide:nth-child(7) .omt.animated {
    transition-delay: 1.2s;
  }

  .hw-niki-all .cycling-sport .switch-button {
    position: relative;
    z-index: 5;
  }
}

/* cycling-sport end */

/* running-sport start */
.hw-niki-all .running-sport .video-mask::before {
  height: 45.3125vw;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000000 100%);
}

.hw-niki-all .running-sport .running-video {
  position: relative;
  overflow: hidden;
}

.hw-niki-all .running-sport .video-load {
  height: 100vh;
  overflow: hidden;
}

.hw-niki-all .running-sport .video-load video {
  transform-origin: 50% 50%;
  transform: scale(1.2);
  will-change: transform;
}

.hw-niki-all .running-sport .video-txt {
  opacity: 0;
  pointer-events: none;
  transform: translateY(15.625vw);
  transition: opacity 0.6s linear, transform 0.6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
  will-change: opacity, transform;
}

.hw-niki-all .running-sport .video-txt.animated {
  pointer-events: all;
  opacity: 1;
  transform: translateY(0);
}

.hw-niki-all .running-sport .running-sub {
  color: #ed6d3b;
}

.hw-niki-all .running-sport .running-content {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.hw-niki-all .running-sport .running-swiper {
  overflow: visible;
  width: 67.5vw;
  z-index: 5;
}

.hw-niki-all .running-sport.curser-default .swiper-slide:nth-child(3) {
  cursor: default !important;
}

@media (pointer: fine) and (hover: hover) {
  .hw-niki-all .running-sport .running-swiper .swiper-slide:not(.swiper-slide-active):hover {
    cursor: pointer;
  }

  .hw-niki-all .running-sport .running-swiper.isend .swiper-wrapper .swiper-slide:nth-last-of-type(-n+1) {
    cursor: default;
  }
}

.hw-niki-all .running-sport .running-swiper .swiper-slide {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  will-change: opacity;
}

.hw-niki-all .running-sport .running-swiper .swiper-wrapper {
  transition-timing-function: ease;
}

.hw-niki-all .running-sport .running-swiper.active .swiper-slide {
  opacity: 1;
  pointer-events: all;
}

.hw-niki-all .running-sport .running-swiper.animated .swiper-slide .opt,
.hw-niki-all .running-sport .running-swiper.animated .switch-button {
  opacity: 1;
  transform: translateY(0);
  pointer-events: all;
}

.hw-niki-all .running-sport .swiper-slide:nth-child(1) .opt {
  transition-delay: 0s;
}

.hw-niki-all .running-sport .swiper-slide:nth-child(2) .opt {
  transition-delay: 0.15s;
}

.hw-niki-all .running-sport .swiper-slide:nth-child(3) .opt {
  transition-delay: 0.3s;
}

.hw-niki-all .running-sport .swiper-slide:nth-child(4) .opt {
  transition-delay: 0.45s;
}

.hw-niki-all .running-sport .swiper-slide:nth-child(5) .opt {
  transition-delay: 0.6s;
}

.hw-niki-all .running-sport .swiper-slide {
  width: 21.66666667vw;
}

.hw-niki-all .running-sport .swiper-slide .running-img {
  width: 21.66666667vw;
  height: 26.04166667vw;
}

.hw-niki-all .running-sport .swiper-slide .running-txt {
  width: 19.79166667vw;
}

.hw-niki-all .running-sport .swiper-slide .running-txt span {
  color: #fff;
  font-weight: 700;
}

.hw-niki-all .running-sport .swiper-slide:nth-child(4) {
  width: 27.08333333vw !important;
}

.hw-niki-all .running-sport .swiper-slide:nth-child(4) .running-img {
  width: 27.08333333vw !important;
}

.hw-niki-all .running-sport .swiper-slide:nth-child(4) .running-txt {
  width: 23.69791667vw;
}

.hw-niki-all .running-sport .swiper-slide:nth-child(5) {
  width: 34.58333333vw !important;
}

.hw-niki-all .running-sport .swiper-slide:nth-child(5) .running-img {
  width: 34.58333333vw !important;
}

.hw-niki-all .running-sport .swiper-slide:nth-child(5) .running-txt {
  width: 22.29166667vw;
}

.hw-niki-all .running-sport .swiper-slide .running-txt {
  margin: 2.08333333vw 0 0 0.83333333vw;
  font-size: 1.04166667vw;
  color: #86868b;
  line-height: 1.6;
  font-weight: 500;
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .running-sport .video-mask::before {
    height: 92.916667vw;
  }

  .hw-niki-all .running-sport,
  .hw-niki-all .running-container,
  .hw-niki-all .running-sport .running-video {
    overflow: hidden;
  }

  .hw-niki-all .running-sport .video-load {
    height: 150vw;
  }

  .hw-niki-all .running-sport .video-txt {
    transform: translateY(27.777778vw);
  }

  .hw-niki-all .running-sport .running-content {
    padding: 8.888889vw 0;
    width: 100%;
    height: auto;
    position: relative;
  }

  .hw-niki-all .running-sport .running-swiper-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .hw-niki-all .running-sport .running-swiper {
    margin: 0 auto;
    width: 82.222222vw;
    position: relative;
    top: 0;
    left: 0;
    transform: translate(0, 0);
  }

  .hw-niki-all .running-sport .swiper-slide,
  .hw-niki-all .running-sport .swiper-slide:nth-child(4),
  .hw-niki-all .running-sport .swiper-slide:nth-child(5) {
    width: 100% !important;
  }

  .hw-niki-all .running-sport .swiper-slide .running-img {
    width: 100%;
    height: 83.333333vw;
  }

  .hw-niki-all .running-sport .swiper-slide:nth-child(4) .running-img,
  .hw-niki-all .running-sport .swiper-slide:nth-child(5) .running-img {
    width: 100% !important;
    height: 83.333333vw;
  }

  .hw-niki-all .running-sport .swiper-slide .running-txt,
  .hw-niki-all .running-sport .swiper-slide:nth-child(4) .running-txt,
  .hw-niki-all .running-sport .swiper-slide:nth-child(5) .running-txt {
    width: 73.333333vw;
  }

  .hw-niki-all .running-sport .swiper-slide:nth-child(1) .omt.animated {
    transition-delay: 0s;
  }

  .hw-niki-all .running-sport .swiper-slide:nth-child(2) .omt.animated {
    transition-delay: 0.2s;
  }

  .hw-niki-all .running-sport .swiper-slide:nth-child(3) .omt.animated {
    transition-delay: 0.4s;
  }

  .hw-niki-all .running-sport .swiper-slide:nth-child(4) .omt.animated {
    transition-delay: 0.6s;
  }

  .hw-niki-all .running-sport .swiper-slide:nth-child(5) .omt.animated {
    transition-delay: 0.8s;
  }

  .hw-niki-all .running-sport .swiper-slide .running-txt {
    margin: 6.666667vw 0 0 2.222222vw;
    font-size: 4.444444vw;
    font-weight: 500;
  }

  .hw-niki-all .running-sport .running-swiper .swiper-slide {
    transform: translateY(0);
    transition: none;
    opacity: 1;
  }

  .hw-niki-all .running-sport .switch-button {
    position: relative;
    z-index: 5;
  }
}

/* running-sport end */

/* golf-sport start */
.hw-niki-all .golf-sport .video-mask::before {
  height: 34.32291667vw;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 1) 100%);
}

.hw-niki-all .golf-sport .golf-video {
  position: relative;
  overflow: hidden;
}

.hw-niki-all .golf-sport .video-load {
  height: 100vh;
  overflow: hidden;
}

.hw-niki-all .golf-sport .video-load video {
  transform-origin: 50% 50%;
  transform: scale(1.2);
  will-change: transform;
}

.hw-niki-all .golf-sport .video-txt {
  opacity: 0;
  pointer-events: none;
  transform: translateY(15.625vw);
  transition: opacity 0.6s linear, transform 0.6s cubic-bezier(0.26, 0.67, 0.48, 0.91);
  will-change: opacity, transform;
}

.hw-niki-all .golf-sport .video-txt.animated {
  pointer-events: all;
  opacity: 1;
  transform: translateY(0);
}

.hw-niki-all .golf-sport .golf-sub {
  color: #64EF0E;
}

.hw-niki-all .golf-sport .golf-content {
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.hw-niki-all .golf-sport .golf-swiper {
  overflow: visible;
  width: 67.5vw;
  z-index: 5;
}

.hw-niki-all .golf-sport .swiper-slide {
  width: 21.66666667vw;
}

.hw-niki-all .golf-sport.curser-default .swiper-slide:nth-child(3) {
  cursor: default !important;
}

@media (pointer: fine) and (hover: hover) {
  .hw-niki-all .golf-sport .golf-swiper .swiper-slide:not(.swiper-slide-active):hover {
    cursor: pointer;
  }

  .hw-niki-all .golf-sport .golf-swiper.isend .swiper-wrapper .swiper-slide:nth-last-of-type(-n+1) {
    cursor: default;
  }
}

.hw-niki-all .golf-sport .golf-swiper .swiper-wrapper {
  transition-timing-function: ease;
}

.hw-niki-all .golf-sport .golf-swiper .swiper-slide {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
  will-change: opacity;
}

.hw-niki-all .golf-sport .golf-swiper.active .swiper-slide {
  opacity: 1;
  pointer-events: all;
}

.hw-niki-all .golf-sport .golf-swiper.animated .swiper-slide .opt,
.hw-niki-all .golf-sport .golf-swiper.animated .switch-button {
  opacity: 1;
  transform: translateY(0);
  pointer-events: all;
}

.hw-niki-all .golf-sport .swiper-slide:nth-child(1) .opt {
  transition-delay: 0s;
}

.hw-niki-all .golf-sport .swiper-slide:nth-child(2) .opt {
  transition-delay: 0.15s;
}

.hw-niki-all .golf-sport .swiper-slide:nth-child(3) .opt {
  transition-delay: 0.3s;
}

.hw-niki-all .golf-sport .swiper-slide:nth-child(4) .opt {
  transition-delay: 0.45s;
}

.hw-niki-all .golf-sport .swiper-slide .golf-img {
  width: 21.66666667vw;
  height: 26.04166667vw;
}

.hw-niki-all .golf-sport .swiper-slide .golf-txt {
  width: 19.79166667vw;
}

.hw-niki-all .golf-sport .swiper-slide .golf-txt span {
  color: #fff;
  font-weight: 700;
}

.hw-niki-all .golf-sport .swiper-slide:nth-child(1) {
  width: 33.125vw !important;
}

.hw-niki-all .golf-sport .swiper-slide:nth-child(1) .golf-img {
  width: 33.125vw !important;
}

.hw-niki-all .golf-sport .swiper-slide:nth-child(1) .golf-txt {
  width: 22.29166667vw;
}

.hw-niki-all .golf-sport .swiper-slide .golf-txt {
  margin: 2.08333333vw 0 0 0.83333333vw;
  font-size: 1.04166667vw;
  color: #86868b;
  line-height: 1.6;
  font-weight: 500;
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .golf-sport .video-mask::before {
    height: 92.916667vw;
  }

  .hw-niki-all .golf-sport .golf-container {
    margin-bottom: -1px;
  }

  .hw-niki-all .golf-sport,
  .hw-niki-all .golf-container,
  .hw-niki-all .golf-sport .golf-video {
    overflow: hidden;
  }

  .hw-niki-all .golf-sport .video-load {
    height: 150vw;
  }

  .hw-niki-all .golf-sport .video-txt {
    transform: translateY(27.777778vw);
  }

  .hw-niki-all .golf-sport .golf-content {
    padding: 8.888889vw 0;
    width: 100%;
    height: auto;
    position: relative;
  }

  .hw-niki-all .golf-sport .golf-swiper-bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  .hw-niki-all .golf-sport .golf-swiper {
    margin: 0 auto;
    width: 82.222222vw;
    position: relative;
    top: 0;
    left: 0;
    transform: translate(0, 0);
  }

  .hw-niki-all .golf-sport .swiper-slide,
  .hw-niki-all .golf-sport .swiper-slide:nth-child(1) {
    width: 100% !important;
  }

  .hw-niki-all .golf-sport .swiper-slide .golf-img {
    width: 100%;
    height: 83.333333vw;
  }

  .hw-niki-all .golf-sport .swiper-slide:nth-child(1) .golf-img {
    width: 100% !important;
    height: 83.333333vw;
  }

  .hw-niki-all .golf-sport .swiper-slide .golf-txt,
  .hw-niki-all .golf-sport .swiper-slide:nth-child(1) .golf-txt {
    width: 73.333333vw;
  }

  .hw-niki-all .golf-sport .swiper-slide .golf-txt {
    margin: 6.666667vw 0 0 2.222222vw;
    font-size: 4.444444vw;
    font-weight: 500;
  }

  .hw-niki-all .golf-sport .golf-swiper .swiper-slide {
    transform: translateY(0);
    transition: none;
    opacity: 1;
  }

  .hw-niki-all .golf-sport .swiper-slide:nth-child(1) .omt.animated {
    transition-delay: 0s;
  }

  .hw-niki-all .golf-sport .swiper-slide:nth-child(2) .omt.animated {
    transition-delay: 0.2s;
  }

  .hw-niki-all .golf-sport .swiper-slide:nth-child(3) .omt.animated {
    transition-delay: 0.4s;
  }

  .hw-niki-all .golf-sport .swiper-slide:nth-child(4) .omt.animated {
    transition-delay: 0.6s;
  }

  .hw-niki-all .golf-sport .switch-button {
    position: relative;
    z-index: 5;
  }
}

/* golf-sport end */

/* sport-type start */
.hw-niki-all .sport-type {
  padding-top: 10.41666667vw;
}

.hw-niki-all .sport-type .sport-content {
  margin-top: 4.16666667vw;
}

.hw-niki-all .sport-type .sport-swiper {
  margin: 0 auto;
  width: 67.5vw;
}

.hw-niki-all .sport-type .swiper-slide {
  opacity: 0 !important;
  border-radius: 0.83333333vw;
  -webkit-border-radius: 0.83333333vw;
  -moz-border-radius: 0.83333333vw;
  overflow: hidden;
  will-change: opacity;
}

.hw-niki-all .sport-type .swiper-slide-active {
  opacity: 1 !important;
}

.hw-niki-all .sport-type .swiper-slide:nth-child(4) {
  height: 31.25vw;
}

.hw-niki-all .sport-type .swiper-slide:nth-child(4) .sport-inner {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #f8f9fa;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
}

.hw-niki-all .sport-type .swiper-slide:nth-child(4) .sport-icon {
  flex-shrink: 0;
}

.hw-niki-all .sport-type .swiper-slide .sport-icon {
  will-change: transform;
}

.hw-niki-all .sport-type .swiper-slide .sport-icon1,
.hw-niki-all .sport-type .swiper-slide .sport-icon3 {
  align-self: flex-start;
  margin-left: 1.82291667vw;
  display: flex;
}

.hw-niki-all .sport-swiper .swiper-slide .sport-icon1 img,
.hw-niki-all .sport-swiper .swiper-slide .sport-icon3 img {
  width: 117.60416667vw;
  margin-right: 2.5vw;
  height: 7.55208333vw;
}

.hw-niki-all .sport-type .swiper-slide .sport-icon2 img:first-child {
  width: 117.60416667vw;
  margin-right: 2.5vw;
  height: 7.55208333vw;
}

.hw-niki-all .sport-type .swiper-slide .sport-icon-img4 {
  margin-right: 3.95833333vw;
}

.hw-niki-all .sport-type .swiper-slide .sport-icon2 {
  align-self: flex-end;
  margin: 2.60416667vw 0 2.55208333vw 0;
  display: flex;
}

.hw-niki-all .sport-type .sport-inner img {
  flex-shrink: 0;
  will-change: transform;
}

.hw-niki-all .sport-type .swiper-slide .sport-icon-img1 {
  transform: translateY(-10.41666667vw);
}

.hw-niki-all .sport-type .swiper-slide .sport-icon-img2 {
  width: 80.20833333vw;
  transform: translateX(-31.25vw);
}

.hw-niki-all .sport-type .swiper-slide .sport-icon-img3 {
  width: 7.54166667vw;
  transform-origin: 50% 50%;
  transform: scale(2);
}

.hw-niki-all .sport-type .swiper-slide .sport-icon-img4 {
  width: 30.15625vw;
  transform: translateX(31.25vw);
}

.hw-niki-all .sport-type .swiper-slide .sport-icon-img5 {
  transform: translateY(10.41666667vw);
}

.hw-niki-all .sport-swiper.animated .sport-icon-img1 {
  transition: all 1s ease 0.2s;
  transform: translateY(0);
}

.hw-niki-all .sport-swiper.animated .sport-icon-img2 {
  transition: all 1s ease;
  transform: translateX(0);
}

.hw-niki-all .sport-swiper.animated .sport-icon-img3 {
  transition: all 1s ease;
  transform: scale(1);
}

.hw-niki-all .sport-swiper.animated .sport-icon-img4 {
  transition: all 1s ease;
  transform: translateX(0);
}

.hw-niki-all .sport-swiper.animated .sport-icon-img5 {
  transition: all 1s ease 0.2s;
  transform: translateY(0);
}

.hw-niki-all .sport-swiper.animated .sport-icon1,
.hw-niki-all .sport-swiper.animated .sport-icon3 {
  animation: lamp 10s linear 1s infinite;
}

.hw-niki-all .sport-swiper.animated .sport-icon2 {
  animation: lamp-reverse 10s linear 1s infinite;
}

@keyframes lamp {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(-50%);
  }
}

@keyframes lamp-reverse {
  0% {
    transform: translateX(0%);
  }

  100% {
    transform: translateX(50%);
  }
}

.hw-niki-all .sport-type .sport-nav {
  margin-top: 2.5vw;
}

.hw-niki-all .sport-type .nav-cta {
  display: flex;
  justify-content: center;
}

.hw-niki-all .sport-type .nav-ctn {
  padding: 0.9375vw 1.45833333vw;
  border-radius: 999px;
  -webkit-border-radius: 999px;
  -moz-border-radius: 999px;
  background: #f2f3f5;
  display: flex;
  position: relative;
}

.hw-niki-all .sport-type .nav-ctn::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0.20833333vw;
  width: var(--item-width, 0);
  height: var(--item-height, 0);
  padding: 0.72916667vw 1.25vw;
  border-radius: 999px;
  -webkit-border-radius: 999px;
  -moz-border-radius: 999px;
  background: #ED6D3B;
  transform: translate(var(--item-move, 0), -50%);
  transition: all 0.3s linear;
  will-change: width, transform;
}

.hw-niki-all .sport-type .nav-item {
  flex-shrink: 0;
  font-weight: 500;
  font-size: 0.9375vw;
  line-height: 1.25;
  color: rgba(0, 0, 0, 0.6);
  transition: all 0.3s linear;
  position: relative;
  z-index: 1;
  cursor: default;
}

.hw-niki-all .sport-type .nav-item:not(:last-child) {
  margin-right: 2.5vw;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .sport-type .nav-item:not(.active):hover {
    cursor: pointer;
    color: rgba(0, 0, 0, 0.8);
  }
}

.hw-niki-all .sport-type .nav-item.active {
  color: rgba(255, 255, 255);
}

.hw-niki-all .sport-type .nav-desc {
  width: 28.54166667vw;
  margin: 1.66666667vw auto 0;
  display: flex;
}

.hw-niki-all .sport-type .nav-text {
  flex-shrink: 0;
  width: 100%;
  color: #86868b;
  font-size: 1.14583333vw;
  font-weight: 500;
  line-height: 1.6;
  text-align: center;
  transition: opacity 0.3s ease;
  transform: translateX(calc(-100% * var(--i)));
  opacity: 0;
  pointer-events: none;
  will-change: opacity;
}

.hw-niki-all .sport-type .nav-text.active {
  opacity: 1;
  pointer-events: auto;
  transition-delay: 0.3s;
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .sport-type {
    padding-top: 27.777778vw;
  }

  .hw-niki-all .sport-type .swiper-slide:nth-child(4) {
    height: 100vw;
  }

  .hw-niki-all .sport-type .swiper-slide .sport-icon1,
  .hw-niki-all .sport-type .swiper-slide .sport-icon3 {
    align-self: flex-start;
    margin-left: -6.944444vw;
    margin-left: 0;
  }

  .hw-niki-all .sport-swiper .swiper-slide .sport-icon1 img,
  .hw-niki-all .sport-swiper .swiper-slide .sport-icon3 img {
    width: 355.277778vw;
    margin-right: 7.777778vw;
    height: 22.777778vw;
  }

  .hw-niki-all .sport-type .swiper-slide .sport-icon2 img:first-child {
    width: 355.277778vw;
    margin-right: 7.777778vw;
    height: 22.777778vw;
  }

  .hw-niki-all .sport-type .swiper-slide .sport-icon-img4 {
    margin-right: 7.777778vw;
  }

  .hw-niki-all .sport-type .swiper-slide .sport-icon2 {
    margin: 7.638889vw -61vw 7.638889vw 0;
  }

  .hw-niki-all .sport-type .swiper-slide .sport-icon-img1 {
    transform: translateY(-41.666667vw);
  }

  .hw-niki-all .sport-type .swiper-slide .sport-icon-img2 {
    width: 242.006944vw;
    transform: translateX(-83.333333vw);
  }

  .hw-niki-all .sport-type .swiper-slide .sport-icon-img3 {
    width: 22.786111vw;
  }

  .hw-niki-all .sport-type .swiper-slide .sport-icon-img4 {
    width: 90.777778vw;
    transform: translateX(83.333333vw);
  }

  .hw-niki-all .sport-type .swiper-slide .sport-icon-img5 {
    transform: translateY(41.666667vw);
  }

  .hw-niki-all .sport-swiper.animated .sport-icon-img1 {
    transform: translateY(0);
  }

  .hw-niki-all .sport-swiper.animated .sport-icon-img2 {
    transform: translateX(0);
  }

  .hw-niki-all .sport-swiper.animated .sport-icon-img3 {
    transform: scale(1);
  }

  .hw-niki-all .sport-swiper.animated .sport-icon-img4 {
    transform: translateX(0);
  }

  .hw-niki-all .sport-swiper.animated .sport-icon-img5 {
    transform: translateY(0);
  }

  .hw-niki-all .sport-type .sport-content {
    margin-top: 11.111111vw;
  }

  .hw-niki-all .sport-type .sport-swiper {
    width: 100%;
  }

  .hw-niki-all .sport-type .swiper-slide {
    border-radius: 0vw;
  }

  .hw-niki-all .sport-type .sport-nav {
    margin-top: 11.111111vw;
  }

  .hw-niki-all .sport-type .nav-cta {
    justify-content: flex-start;
    overflow: scroll;
  }

  .hw-niki-all .sport-type .nav-cta::-webkit-scrollbar {
    display: none;
  }

  .hw-niki-all .sport-type .nav-ctn {
    padding: 4.444444vw 6.666667vw;
  }

  .hw-niki-all .sport-type .nav-ctn::before {
    left: 1.111111vw;
    padding: 3.333333vw 5.555556vw;
  }

  .hw-niki-all .sport-type .nav-padding {
    padding: 0 8.888889vw;
    flex-shrink: 0;
  }

  .hw-niki-all .sport-type .nav-item {
    font-size: 3.888889vw;
  }

  .hw-niki-all .sport-type .nav-item:not(:last-child) {
    margin-right: 11.111111vw;
  }

  .hw-niki-all .sport-type .nav-desc {
    width: 82.222222vw;
    margin: 6.666667vw auto 0;
  }

  .hw-niki-all .sport-type .nav-text {
    font-size: 4.4444444vw;
  }
}

/* sport-type end */

/* health-track start */
.hw-niki-all .health-track {
  padding-bottom: 10.41666667vw;
}

.hw-niki-all .health-track .track-title h2 {
  width: 67.5vw;
  text-align: center;
  font-size: 4.16666667vw;
}

.hw-niki-all .health-track .track-content {
  margin-top: 4.16666667vw;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.hw-niki-all .health-track .track-image {
  display: flex;
  align-items: center;
}

.hw-niki-all .health-track .track-img {
  transition: all 1s ease;
  will-change: transform;
}

.hw-niki-all .health-track .track-img:nth-child(1) {
  margin-right: -6.82291667vw;
  width: 23.95833333vw;
  height: 26.51041667vw;

  opacity: 0;
  transform-origin: 50% 0%;
  transform: translate(-61.14583333vw, 52.08333333vw) scale(1.870069605);
  will-change: transform, opacity;
}

.hw-niki-all .health-track .track-img:nth-child(2) {
  width: 23.125vw;
  height: 37.91666667vw;
  position: relative;
  z-index: 1;

  transform-origin: 50% 0%;
  transform: scale(1.84653465346);
}

.hw-niki-all .health-track .track-img:nth-child(3) {
  margin-left: -7.23958333vw;
  width: 24.32291667vw;
  height: 26.51041667vw;

  opacity: 0;
  transform-origin: 50% 0%;
  transform: translate(61.14583333vw, -52.08333333vw) scale(1.86976744186);
  will-change: transform, opacity;
}

.hw-niki-all .health-track.animated .track-content .track-img {
  opacity: 1;
  transform: translate(0, 0) scale(1);
}

.hw-niki-all .health-track .track-txt {
  margin: 4.16666667vw auto 0;
  width: 36.71875vw;
  font-size: 1.14583333vw;
  font-weight: 500;
  line-height: 1.6;
  color: #86868b;
  text-align: center;

  opacity: 0;
  pointer-events: none;
  transform: translateY(10.41666667vw);
  will-change: transform, opacity;
  transition: all 0.6s ease 0.4s;
}

.hw-niki-all .health-track .track-txt span {
  color: #000;
  font-weight: 700;
}

.hw-niki-all .health-track.animated .track-txt {
  opacity: 1;
  pointer-events: all;
  transform: translateY(0);
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .health-track {
    padding-bottom: 27.777778vw;
  }

  .hw-niki-all .health-track .track-title {
    text-align: center;
  }

  .hw-niki-all .health-track .track-title h2 {
    width: 82.222222vw;
    text-align: left;
    font-size: 11.111111vw;
  }

  .hw-niki-all .health-track .track-content {
    margin-top: 11.111111vw;
  }

  .hw-niki-all .health-track .track-img:nth-child(1) {
    margin-right: -11.25vw;
    width: 39.166667vw;
    height: 43.194444vw;
    transform: translate(-61.14583333vw, 52.08333333vw) scale(1.8);
  }

  .hw-niki-all .health-track .track-img:nth-child(2) {
    width: 37.777778vw;
    height: 61.944444vw;
    transform: scale(1.8);
  }

  .hw-niki-all .health-track .track-img:nth-child(3) {
    margin-left: -11.666667vw;
    width: 39.722222vw;
    height: 43.333333vw;
    transform: translate(61.14583333vw, -52.08333333vw) scale(1.8);
  }

  .hw-niki-all .health-track .track-txt {
    margin: 6.666667vw auto 0;
    width: 82.222222vw;
    font-size: 4.444444vw;
    transform: translateY(27.777778vw);
  }
}

/* health-track end */

/* sleep-data start */
.hw-niki-all .sleep-data {
  padding-top: 0;
}

.hw-niki-all .sleep-data h2 {
  transition-delay: 0s;
}

.hw-niki-all .sleep-data .sleep-p {
  margin-top: 1.66666667vw;
  font-size: 1.14583333vw;
  font-weight: 500;
  color: #86868b;
  line-height: 1.6;
  transition-delay: 0.15s;
}

.hw-niki-all .sleep-data .sleep-content {
  margin-top: 4.16666667vw;
}

.hw-niki-all .sleep-data .sleep-img {
  margin: 0 auto;
  width: 67.5vw;
  height: 33.85416667vw;
  border-radius: 0.83333333vw;
  -webkit-border-radius: 0.83333333vw;
  -moz-border-radius: 0.83333333vw;
  transform-origin: 50% 0%;
  transform: scale(1.3811728395);
  will-change: transform;
  overflow: hidden;
}

.hw-niki-all .sleep-data .sleep-img img {
  transform-origin: 50% 30%;
  transform: scale(1.1);
  will-change: transform;
}

.hw-niki-all .sleep-data .sleep-desc {
  margin: -10.9375vw auto 0;
  width: 67.5vw;
  display: flex;
  justify-content: flex-end;
  align-items: flex-start;

  pointer-events: none;
  opacity: 0;
  transform: translateY(10.41666667vw);
  transition: transform 0.6s ease, opacity 0.6s ease;
  will-change: transform, opacity;
}

.hw-niki-all .sleep-data .sleep-container.animated .sleep-desc {
  pointer-events: all;
  opacity: 1;
  transform: translateY(0);
}

.hw-niki-all .sleep-data .sleep-text {
  flex-shrink: 0;
  margin-top: 12.91666667vw;
  margin-right: 4.16666667vw;
  width: 23.4375vw;
  position: relative;
}

.hw-niki-all .sleep-data .sleep-text .sleep-txt:last-child {
  position: absolute;
  top: 0;
  left: 0;
}

.hw-niki-all .sleep-data .sleep-text .sleep-txt {
  font-size: 1.04166667vw;
  font-weight: 500;
  line-height: 1.6;
  color: #86868b;
  opacity: 0;
  pointer-events: none;
  will-change: opacity;
}

.hw-niki-all .sleep-container[data-index="0"] .sleep-text .sleep-txt:first-child {
  opacity: 1;
  pointer-events: all;
}

.hw-niki-all .sleep-container[data-index="1"] .sleep-text .sleep-txt:last-child {
  opacity: 1;
  pointer-events: all;
}

.hw-niki-all .sleep-data .sleep-swiper-content {
  flex-shrink: 0;
  margin-right: 4.375vw;
  width: 14.375vw;
  height: 25.26041667vw;
  position: relative;
  pointer-events: none;
}

.hw-niki-all .sleep-data .sleep-img-bg {
  pointer-events: none;
}

.hw-niki-all .sleep-data .sleep-swiper {
  position: absolute;
  top: 5.41666667vw;
  left: 1.14583333vw;
  width: 11.09375vw;
  height: 13.07291667vw;
  z-index: -1;
}

.hw-niki-all .sleep-data .sleep-nav {
  margin-top: 13.02083333vw;
  padding: 0.83333333vw 1.45833333vw;
  border-radius: 999px;
  -webkit-border-radius: 999px;
  -moz-border-radius: 999px;
  display: flex;
  background: #f2f3f5;
  position: relative;
}

.hw-niki-all .sleep-data .sleep-nav::before {
  content: '';
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate3d(var(--runner-move, 0px), -50%, 1px) rotate(0deg);
  width: var(--runner-width, 0px);
  height: var(--runner-height, 0px);
  padding: 0.625vw 1.25vw;
  border-radius: 999px;
  -webkit-border-radius: 999px;
  -moz-border-radius: 999px;
  background: #ED6D3B;
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  will-change: transform, width, height;
}

.hw-niki-all .sleep-data .sleep-nav .sleep-btn {
  width: fit-content;
  width: -webkit-fit-content;
  font-size: 0.9375vw;
  font-weight: 500;
  line-height: 1.25;
  color: rgba(0, 0, 0, 0.6);
  position: relative;
  z-index: 10;
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  cursor: default;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .sleep-data .sleep-nav .sleep-btn:not(.active):hover {
    cursor: pointer;
    color: rgba(0, 0, 0, 0.8);
  }
}

.hw-niki-all .sleep-data .sleep-nav .sleep-btn:first-child {
  margin-right: 2.5vw;
}

.hw-niki-all .sleep-data .sleep-nav .sleep-btn.active {
  color: rgba(255, 255, 255);
  transform: translate3d(0px, 0px, 1px) rotate(0deg);
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .sleep-data .sleep-p {
    margin-top: 6.666667vw;
    font-size: 4.444444vw;
  }

  .hw-niki-all .sleep-data .sleep-content {
    margin-top: 11.111111vw;
  }

  .hw-niki-all .sleep-data .sleep-img {
    width: 100%;
    height: auto;
    border-radius: 0;
    transform: scale(1);
    will-change: clip-path;
  }

  .hw-niki-all .sleep-data .sleep-img img {
    transform-origin: 80% 50%;
    transform: scale(1.178187);
  }

  .hw-niki-all .sleep-data .sleep-desc {
    margin-top: -45.416667vw;
    width: 100%;
    padding: 0 8.611111vw;
    align-items: center;
    flex-direction: column;
    transform: translateY(0);
    opacity: 1;
  }

  .hw-niki-all .sleep-data .sleep-text {
    order: 3;
    margin: 6.666667vw 0 0 0;
    width: 82.222222vw;

    opacity: 0;
    transform: translate3d(0, 30px, 0);
    -webkit-transform: translate3d(0, 30px, 0);
    -moz-transform: translate3d(0, 30px, 0);
    pointer-events: none;
    transition: opacity 0.9s ease, transform 0.7s ease;
    -webkit-transition: opacity 0.9s ease, transform 0.7s ease;
    -moz-transition: opacity 0.9s ease, transform 0.7s ease;
    will-change: opacity, transform;
  }

  .hw-niki-all .sleep-data .sleep-container.animated .sleep-text {
    transition-delay: 0.3s;
    opacity: 1;
    transform: translateY(0);
    pointer-events: all;
  }

  .hw-niki-all .sleep-data .sleep-text .sleep-txt {
    font-size: 4.444444vw;
    text-align: center;
  }

  .hw-niki-all .sleep-data .sleep-swiper-content {
    margin: 0;
    width: 38.333333vw;
    height: 63.611111vw;
    opacity: 0;
    transform: translate3d(0, 30px, 0);
    -webkit-transform: translate3d(0, 30px, 0);
    -moz-transform: translate3d(0, 30px, 0);
    pointer-events: none;
    transition: opacity 0.9s ease, transform 0.7s ease;
    -webkit-transition: opacity 0.9s ease, transform 0.7s ease;
    -moz-transition: opacity 0.9s ease, transform 0.7s ease;
    will-change: opacity, transform;
    position: relative;
    z-index: 10;
  }

  .hw-niki-all .sleep-data .sleep-container.animated .sleep-swiper-content {
    opacity: 1;
    transform: translateY(0);
    pointer-events: all;
  }

  .hw-niki-all .sleep-data .sleep-swiper {
    top: 14.444444vw;
    left: 3.055556vw;
    width: 29.583333vw;
    height: 34.861111vw;
  }

  .hw-niki-all .sleep-data .sleep-nav {
    margin-top: 11.111111vw;
    padding: 4.444444vw 6.666667vw;

    opacity: 0;
    transform: translate3d(0, 30px, 0);
    -webkit-transform: translate3d(0, 30px, 0);
    -moz-transform: translate3d(0, 30px, 0);
    pointer-events: none;
    transition: opacity 0.9s ease, transform 0.7s ease;
    -webkit-transition: opacity 0.9s ease, transform 0.7s ease;
    -moz-transition: opacity 0.9s ease, transform 0.7s ease;
    will-change: opacity, transform;
  }

  .hw-niki-all .sleep-data .sleep-container.animated .sleep-nav {
    transition-delay: 0.15s;
    opacity: 1;
    transform: translateY(0);
    pointer-events: all;
  }

  .hw-niki-all .sleep-data .sleep-nav::before {
    padding: 3.333333vw 5.555556vw;
  }

  .hw-niki-all .sleep-data .sleep-nav .sleep-btn {
    font-size: 3.888889vw;
  }

  .hw-niki-all .sleep-data .sleep-nav .sleep-btn:first-child {
    margin-right: 11.111111vw;
  }
}

/* sleep-data end */


/* ecg-keep start */
.hw-niki-all .ecg-keep .keep-swiper {
  margin: 4.16666667vw auto 0;
  width: 67.5vw;
  height: 47.91666667vw;
  overflow: visible;
}

.hw-niki-all .ecg-keep .keep-swiper .swiper-wrapper {
  transition-timing-function: ease;
}

.hw-niki-all .ecg-keep .swiper-slide.keep-outer:nth-child(-n + 3) {
  width: 33.125vw !important;
}

.hw-niki-all .ecg-keep .swiper-slide:nth-child(1) .opc.animated {
  transition-delay: 0s;
}

.hw-niki-all .ecg-keep .swiper-slide:nth-child(2) .opc.animated {
  transition-delay: 0.2s;
}

.hw-niki-all .ecg-keep .swiper-slide:nth-child(3) .opc.animated {
  transition-delay: 0.4s;
}

.hw-niki-all .ecg-keep .swiper-slide:nth-child(4) .opc.animated {
  transition-delay: 0.6s;
}

.hw-niki-all .ecg-keep .swiper-slide.keep-inner {
  width: 53.75vw !important;
}

.hw-niki-all .ecg-keep .swiper-slide.keep-inner .keep-content {
  background: #000;
}

.hw-niki-all .ecg-keep .keep-content {
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.hw-niki-all .ecg-keep .keep-txt {
  flex-shrink: 0;
  padding: 3.33333333vw 0 0 3.33333333vw;
  width: 37.70833333vw;
}

.hw-niki-all .ecg-keep .keep-txt1 {
  font-size: 1.66666667vw;
  color: #f5f6f7;
  line-height: 1.25;
  font-weight: 700;
}

.hw-niki-all .ecg-keep .keep-txt2 {
  margin-top: 0.83333333vw;
  font-size: 1.04166667vw;
  color: #797c80;
  line-height: 1.6;
  font-weight: 400;
}

.hw-niki-all .ecg-keep .keep-inner-swiper {
  transform: translateY(-6.66666667vw);
  flex-shrink: 0;
  align-self: center;
  width: 17.96875vw;
  height: 25.15625vw;
  overflow: visible;
  pointer-events: none;
}

.hw-niki-all .ecg-keep .keep-inner .swiper-slide:nth-child(1),
.hw-niki-all .ecg-keep .keep-inner .swiper-slide:nth-child(3) {
  position: absolute;
  top: 0;
}

.hw-niki-all .ecg-keep .keep-inner .swiper-slide:nth-child(1) {
  transform: translateX(-13.4375vw) scale(0.7710144927);
  transform-origin: left center;
}

.hw-niki-all .ecg-keep .keep-inner .swiper-slide:nth-child(3) {
  transform: translateX(13.4375vw) scale(0.7710144927);
  transform-origin: right center;
}

@media (pointer: fine) and (hover: hover) {
  .hw-niki-all .ecg-keep .keep-swiper .swiper-slide.keep-outer:not(.swiper-slide-active):hover {
    cursor: pointer;
  }

  .hw-niki-all .ecg-keep .keep-swiper .swiper-wrapper .keep-inner {
    cursor: pointer;
  }

  .hw-niki-all .ecg-keep .keep-swiper .swiper-slide-next.keep-outer.no-pointer:hover {
    cursor: default;
  }

  .hw-niki-all .ecg-keep .keep-swiper.isend .swiper-wrapper .keep-inner {
    cursor: default;
  }
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .ecg-keep .keep-swiper {
    margin: 11.111111vw auto 0;
    width: 82.222222vw;
    height: 180.555556vw;
  }

  .hw-niki-all .ecg-keep .swiper-slide.keep-outer:nth-child(-n + 3) {
    width: 82.222222vw !important;
  }

  .hw-niki-all .ecg-keep .swiper-slide.keep-inner {
    width: 82.222222vw !important;
  }

  .hw-niki-all .ecg-keep .keep-txt {
    padding: 6.666667vw 0 0 6.666667vw;
    width: 72.638889vw;
  }

  .hw-niki-all .ecg-keep .keep-txt1 {
    font-size: 5.555556vw;
  }

  .hw-niki-all .ecg-keep .keep-txt2 {
    margin-top: 2.777778vw;
    font-size: 3.888889vw;
  }

  .hw-niki-all .ecg-keep .keep-inner-swiper {
    transform: translateY(-24.861111vw);
    width: 67.5vw;
    width: 100%;
    height: 94.444444vw;
    pointer-events: all;
  }

  .hw-niki-all .ecg-keep .keep-inner .keep-inner-swiper .swiper-slide {
    position: static;
    width: 100%;
    height: 94.444444vw;
  }

  .hw-niki-all .ecg-keep .keep-inner .swiper-slide:nth-child(1) {
    transform: translateX(0) scale(1);
    transform-origin: left center;
  }

  .hw-niki-all .ecg-keep .keep-inner .swiper-slide:nth-child(3) {
    transform: translateX(0) scale(1);
    transform-origin: right center;
  }

  .hw-niki-all .ecg-keep .keep-inner .swiper-slide.swiper-slide-next img {
    will-change: transform, transform-origin;
    transition: transform 400ms ease, transform-origin 400ms ease;
    box-sizing: border-box;
    transform: translateX(0) scale(0.7716049);
    transform-origin: 0% center;
  }

  .hw-niki-all .ecg-keep .keep-inner .swiper-slide.swiper-slide-active img {
    will-change: transform, transform-origin;
    transition: transform 400ms ease, transform-origin 400ms ease;
    box-sizing: border-box;
    transform: scale(1);
  }

  .hw-niki-all .ecg-keep .keep-inner .swiper-slide.swiper-slide-prev img {
    will-change: transform, transform-origin;
    transition: transform 400ms ease, transform-origin 400ms ease;
    box-sizing: border-box;
    transform: translateX(0) scale(0.7716049);
    transform-origin: 100% center;
  }
}

/* ecg-keep end */

/* health-manage start */
.hw-niki-all .health-manage {
  padding-bottom: 10.41666667vw;
}

.hw-niki-all .health-manage .manage-content {
  margin-top: 4.16666667vw;
}

.hw-niki-all .health-manage .manage-swiper {
  margin: 0 auto;
  width: 41.40625vw;
  height: 31.71875vw;
  overflow: visible;
}

.hw-niki-all .health-manage .swiper-slide {
  background: #fff;
}

.hw-niki-all .health-manage .manage-inner {
  margin-left: 10.83333333vw;
  position: relative;
  flex-shrink: 0;
}

.hw-niki-all .health-manage .manage-item {
  position: relative;
  width: 19.11458333vw;
  height: 31.71875vw;
  transform-origin: 50% 50%;
}

.hw-niki-all .health-manage .manage-item:nth-child(n + 2) {
  position: absolute;
  top: 3.4375vw;
  width: 15vw;
  height: 24.84375vw;
  z-index: -1;
}

.hw-niki-all .health-manage .manage-item:nth-child(2) {
  left: -10.83333333vw;
}

.hw-niki-all .health-manage .manage-item:nth-child(3) {
  left: 15.52083333vw;
}

.hw-niki-all .health-manage .manage-item .manage-img {
  position: relative;
  z-index: 1;
}

.hw-niki-all .health-manage .manage-item .manage-video {
  position: absolute;
  top: 7.1875vw;
  left: 1.51041667vw;
  width: 14.6875vw;
  height: 17.29166667vw;
  border-radius: 0.20833333vw;
  -webkit-border-radius: 0.20833333vw;
  -moz-border-radius: 0.20833333vw;
  overflow: hidden;
}

.hw-niki-all .health-manage .manage-item .manage-video video {
  transform: scale(1.01536);
}

.hw-niki-all .health-manage .manage-item:nth-child(n + 2) .manage-video {
  top: 5.625vw;
  left: 1.19791667vw;
  width: 11.5625vw;
  height: 13.64583333vw;
}

.hw-niki-all .manage-content .swiper-slide:nth-child(1) .manage-item-ctn1 {
  transform-origin: 50% 0%;
  transform: translate(0, 0) scale(1.3106267);
  will-change: transform;
}

.hw-niki-all .manage-content .swiper-slide:nth-child(1) .manage-item-ctn2 {
  opacity: 0;
  transform: translate(-37.44791667vw, 41.40625vw) scale(1.9337979);
  will-change: transform, opacity;
}

.hw-niki-all .manage-content .swiper-slide:nth-child(1) .manage-item-ctn3 {
  opacity: 0;
  transform: translate(37.44791667vw, -41.40625vw) scale(1.9337979);
  will-change: transform, opacity;
}

.hw-niki-all .manage-content .manage-nav {
  opacity: 0;
  transform: translateY(5.20833333vw);
  will-change: transform, opacity;
}

.hw-niki-all .manage-container.animated .swiper-slide:nth-child(1) .manage-item-ctn1 {
  transition: all 1s ease;
  transform: translate(0, 0) scale(1);
}

.hw-niki-all .manage-container.animated .swiper-slide:nth-child(1) .manage-item-ctn2 {
  opacity: 1;
  transition: all 1s ease;
  transform: translate(0, 0) scale(1);
}

.hw-niki-all .manage-container.animated .swiper-slide:nth-child(1) .manage-item-ctn3 {
  opacity: 1;
  transition: all 1s ease;
  transform: translate(0, 0) scale(1);
}

.hw-niki-all .manage-container.animated .manage-nav {
  opacity: 1;
  transition: all 0.6s ease 0.3s;
  transform: translate(0, 0) scale(1);
}



.hw-niki-all .manage-content .swiper-slide .manage-item:nth-child(2),
.hw-niki-all .manage-content .swiper-slide .manage-item:nth-child(3) {
  transition: transform 0.8s;
  will-change: transform;
}

.hw-niki-all .manage-content[data-index="0"] .manage-item:nth-child(2) {
  transform: translateX(0);
}

.hw-niki-all .manage-content[data-index="0"] .manage-item:nth-child(3) {
  transform: translateX(0);
}

.hw-niki-all .manage-content[data-index="1"] .manage-item:nth-child(2) {
  transform: translateX(12.1875vw);
}

.hw-niki-all .manage-content[data-index="1"] .manage-item:nth-child(3) {
  transform: translateX(-14.0625vw);
}

.hw-niki-all .manage-content[data-index="2"] .manage-item:nth-child(2) {
  transform: translateX(12.1875vw);
}

.hw-niki-all .manage-content[data-index="2"] .manage-item:nth-child(3) {
  transform: translateX(-14.0625vw);
}

.hw-niki-all .manage-content .manage-circle {
  position: absolute;
  top: 10.26041667vw;
  left: 3.75vw;
  z-index: -1;
  border-radius: 50%;
  background: radial-gradient(circle at 50% 50%, #f9f7ff 0%, #e3c6fc 69.27%, #9266ce 100%);
  background: radial-gradient(circle at 50% 50%, #f9f7ff 0%, #f9f7ff 40%, rgba(227, 198, 252, .85) 69.27%, rgba(146, 102, 206, .4) 100%);
  display: flex;
  justify-content: center;
  pointer-events: none;
  transition: transform 0.8s;
  -webkit-transition: transform 0.8s;
  -moz-transition: transform 0.8s;
  will-change: transform;
}

.hw-niki-all .health-manage .manage-circle1 {
  width: 10.72916667vw;
  height: 10.72916667vw;
}

.hw-niki-all .health-manage .manage-circle2 {
  width: 9.375vw;
  height: 9.375vw;
}

.hw-niki-all .health-manage .manage-circle3 {
  width: 7.70833333vw;
  height: 7.70833333vw;
}

.hw-niki-all .manage-content[data-index="2"] .manage-circle1 {
  pointer-events: all;
  transform: translate(-17.60416667vw, 0);
}

.hw-niki-all .manage-content[data-index="2"] .manage-circle2 {
  pointer-events: all;
  transform: translate(16.25vw, -6.40625vw);
}

.hw-niki-all .manage-content[data-index="2"] .manage-circle3 {
  pointer-events: all;
  transform: translate(16.09375vw, 12.34375vw);
}

.hw-niki-all .manage-content .manage-circle-ctn {
  text-align: center;
  flex-shrink: 0;
}

.hw-niki-all .health-manage .manage-circle-txt1 {
  font-weight: 500;
  line-height: 1.6;
  color: #797c80;
}

.hw-niki-all .health-manage .manage-circle-txt2 {
  display: flex;
  align-items: center;
}

.hw-niki-all .health-manage .manage-circle-num {
  font-weight: 700;
  line-height: 1.25;
  color: #5844a8;
}

.hw-niki-all .health-manage .manage-circle-num span {
  color: #5844a8;
  font-weight: 500;
  line-height: 1.6;
}

.hw-niki-all .health-manage .manage-circle-txt3 {
  font-weight: 400;
  line-height: 1.6;
  color: #797c80;
}

.hw-niki-all .health-manage .manage-circle1 .manage-circle-ctn {
  margin-top: 1.35416667vw;
}

.hw-niki-all .health-manage .manage-circle2 .manage-circle-ctn {
  margin-top: 1.77083333vw;
}

.hw-niki-all .health-manage .manage-circle3 .manage-circle-ctn {
  margin-top: 1.25vw;
}

.hw-niki-all .health-manage .manage-circle1 .manage-circle-txt1 {
  font-size: 1.25vw;
}

.hw-niki-all .health-manage .manage-circle1 .manage-circle-txt2 {
  margin: 0.20833333vw 0 0.72916667vw 0;
}

.hw-niki-all .health-manage .manage-circle1 .manage-circle-txt3 {
  font-size: 0.9375vw;
}

.hw-niki-all .health-manage .manage-circle1 .manage-circle-num {
  font-size: 2.70833333vw;
}

.hw-niki-all .health-manage .manage-circle1 svg {
  width: 1.14583333vw;
  margin: 0.3125vw 0.3125vw 0 0;
}

.hw-niki-all .health-manage .manage-circle2 .manage-circle-txt1 {
  font-size: 1.04166667vw;
}

.hw-niki-all .health-manage .manage-circle2 .manage-circle-txt2 {
  margin: 0 0 0.36458333vw 0;
}

.hw-niki-all .health-manage .manage-circle2 .manage-circle-txt3 {
  font-size: 0.9375vw;
}

.hw-niki-all .health-manage .manage-circle2 .manage-circle-num {
  font-size: 2.5vw;
}

.hw-niki-all .health-manage .manage-circle2 .manage-circle-num span {
  margin-left: 0.20833333vw;
  font-size: 1.04166667vw;
}

.hw-niki-all .health-manage .manage-circle2 svg {
  width: 1.04166667vw;
  margin: 0.41666667vw 0 0 0;
}

.hw-niki-all .health-manage .manage-circle3 .manage-circle-txt1 {
  font-size: 0.9375vw;
}

.hw-niki-all .health-manage .manage-circle3 .manage-circle-txt2 {
  margin: 0 0 0.36458333vw 0;
}

.hw-niki-all .health-manage .manage-circle3 .manage-circle-txt3 {
  font-size: 0.83333333vw;
}

.hw-niki-all .health-manage .manage-circle3 .manage-circle-num {
  font-size: 2.08333333vw;
}

.hw-niki-all .health-manage .manage-circle3 .manage-circle-num span {
  margin-left: 0.36458333vw;
  font-size: 0.9375vw;
}

.hw-niki-all .health-manage .manage-circle3 svg {
  width: 0.83333333vw;
  margin: 0.41666667vw 0.26041667vw 0 0;
}



.hw-niki-all .manage-content .manage-nav {
  margin-top: 2.5vw;
}

.hw-niki-all .manage-content .nav-cta {
  display: flex;
  justify-content: center;
}

.hw-niki-all .manage-content .nav-ctn {
  display: flex;
  position: relative;
}

.hw-niki-all .manage-content .nav-item {
  flex-shrink: 0;
  font-weight: 500;
  font-size: 1.25vw;
  line-height: 1.25;
  color: rgba(0, 0, 0, 0.4);
  transition: all 0.3s linear;
  cursor: default;
}

.hw-niki-all .manage-content .nav-item:not(:last-child) {
  margin-right: 2.91666667vw;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .manage-content .nav-item:not(.active):hover {
    cursor: pointer;
    color: rgba(0, 0, 0, 0.6);
  }
}

.hw-niki-all .manage-content .nav-item.active {
  color: rgba(0, 0, 0);
}

.hw-niki-all .manage-content .nav-line {
  margin-top: 0.83333333vw;
  width: 100%;
  height: 2px;
  background: #bfbfbf;
  position: relative;
}

.hw-niki-all .manage-content .nav-line::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: var(--line-width, 0);
  height: 2px;
  background: #0e0e0f;
  transform: translateX(var(--line-move, 0));
  transition: all 0.3s linear;
  will-change: width, transform;
}

.hw-niki-all .manage-content .nav-desc {
  width: 30.57291667vw;
  margin: 1.66666667vw auto 0;
  display: flex;
}

.hw-niki-all .manage-content .nav-text {
  flex-shrink: 0;
  width: 100%;
  color: #86868b;
  font-size: 1.14583333vw;
  font-weight: 500;
  line-height: 1.6;
  text-align: center;
  transform: translateX(calc(-100% * var(--i)));
  transition: opacity 0.3s ease;
  opacity: 0;
  pointer-events: none;
  will-change: opacity;
}

.hw-niki-all .manage-content .nav-text.active {
  opacity: 1;
  pointer-events: auto;
  transition-delay: 0.3s;
}


@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .health-manage {
    padding-bottom: 27.777778vw;
  }

  .hw-niki-all .health-manage .manage-content {
    margin-top: 11.111111vw;
  }

  .hw-niki-all .health-manage .manage-swiper {
    width: 89.583333vw;
    height: 68.611111vw;
  }

  .hw-niki-all .health-manage .manage-inner {
    margin-left: 23.472222vw;
  }

  .hw-niki-all .health-manage .manage-item {
    width: 41.388889vw;
    height: 68.611111vw;
  }

  .hw-niki-all .health-manage .manage-item .manage-item-ctn1 .manage-img {
    width: 41.388889vw;
    height: 68.611111vw;
  }

  .hw-niki-all .health-manage .manage-item:nth-child(n + 2) {
    top: 7.222222vw;
    width: 32.361111vw;
    height: 53.75vw;
  }

  .hw-niki-all .health-manage .manage-item:nth-child(n + 2) .manage-img {
    width: 32.361111vw;
    height: 53.75vw;
  }

  .hw-niki-all .health-manage .manage-item:nth-child(2) {
    left: -23.472222vw;
  }

  .hw-niki-all .health-manage .manage-item:nth-child(3) {
    left: 33.611111vw;
  }

  .hw-niki-all .health-manage .manage-item .manage-video {
    top: 15.555556vw;
    left: 3.333333vw;
    width: 32.083333vw;
    height: 37.5vw;
    border-radius: 0.555556vw;
    -webkit-border-radius: 0.555556vw;
    -moz-border-radius: 0.555556vw;
  }

  .hw-niki-all .health-manage .manage-item:nth-child(n + 2) .manage-video {
    top: 12.083333vw;
    left: 2.5vw;
    width: 25vw;
    height: 29.444444vw;
  }

  .hw-niki-all .manage-content .swiper-slide:nth-child(1) .manage-item-ctn1 {
    transform: translate(0, 0) scale(1.3106267);
    will-change: transform;
  }

  .hw-niki-all .manage-content .swiper-slide:nth-child(1) .manage-item-ctn2 {
    opacity: 0;
    transform: translate(-69.444444vw, 66.666667vw) scale(1.9337979);
    will-change: transform, opacity;
  }

  .hw-niki-all .manage-content .swiper-slide:nth-child(1) .manage-item-ctn3 {
    opacity: 0;
    transform: translate(69.444444vw, -66.666667vw) scale(1.9337979);
    will-change: transform, opacity;
  }

  .hw-niki-all .manage-content .manage-nav {
    transform: translateY(13.888889vw);
  }

  .hw-niki-all .manage-container.animated .manage-nav {
    transition: all 0.6s ease 0.4s;
  }

  .hw-niki-all .manage-content[data-index="0"] .manage-item:nth-child(2) {
    transform: translateX(0);
  }

  .hw-niki-all .manage-content[data-index="0"] .manage-item:nth-child(3) {
    transform: translateX(0);
  }

  .hw-niki-all .manage-content[data-index="1"] .manage-item:nth-child(2) {
    transform: translateX(26.388889vw);
  }

  .hw-niki-all .manage-content[data-index="1"] .manage-item:nth-child(3) {
    transform: translateX(-29.166667vw);
  }

  .hw-niki-all .manage-content[data-index="2"] .manage-item:nth-child(2) {
    transform: translateX(26.388889vw);
  }

  .hw-niki-all .manage-content[data-index="2"] .manage-item:nth-child(3) {
    transform: translateX(-29.166667vw);
  }

  .hw-niki-all .manage-content .manage-circle {
    top: 22.222222vw;
    left: 6.944444vw;
  }

  .hw-niki-all .health-manage .manage-circle1 {
    width: 23.333333vw;
    height: 23.333333vw;
  }

  .hw-niki-all .health-manage .manage-circle2 {
    width: 20.416667vw;
    height: 20.416667vw;
  }

  .hw-niki-all .health-manage .manage-circle3 {
    width: 16.805556vw;
    height: 16.805556vw;
  }

  .hw-niki-all .manage-content[data-index="2"] .manage-circle1 {
    transform: translate(-31.388889vw, 0);
  }

  .hw-niki-all .manage-content[data-index="2"] .manage-circle2 {
    transform: translate(34.166667vw, -15vw);
  }

  .hw-niki-all .manage-content[data-index="2"] .manage-circle3 {
    transform: translate(34.166667vw, 27.222222vw);
  }

  .hw-niki-all .health-manage .manage-circle1 .manage-circle-ctn {
    margin-top: 3.055556vw;
  }

  .hw-niki-all .health-manage .manage-circle2 .manage-circle-ctn {
    margin-top: 3.75vw;
  }

  .hw-niki-all .health-manage .manage-circle3 .manage-circle-ctn {
    margin-top: 2.777778vw;
  }

  .hw-niki-all .health-manage .manage-circle1 .manage-circle-txt1 {
    font-size: 2.5vw;
  }

  .hw-niki-all .health-manage .manage-circle1 .manage-circle-txt2 {
    margin: 0.555556vw 0 1.805556vw 0;
  }

  .hw-niki-all .health-manage .manage-circle1 .manage-circle-txt3 {
    font-size: 2.222222vw;
  }

  .hw-niki-all .health-manage .manage-circle1 .manage-circle-num {
    font-size: 5.833333vw;
  }

  .hw-niki-all .health-manage .manage-circle1 svg {
    width: 2.222222vw;
    margin: 1.805556vw 0 0.555556vw 0;
  }

  .hw-niki-all .health-manage .manage-circle2 .manage-circle-txt1 {
    font-size: 2.222222vw;
  }

  .hw-niki-all .health-manage .manage-circle2 .manage-circle-txt2 {
    margin: 0 0 0.833333vw 0;
  }

  .hw-niki-all .health-manage .manage-circle2 .manage-circle-txt3 {
    font-size: 1.944444vw;
  }

  .hw-niki-all .health-manage .manage-circle2 .manage-circle-num {
    font-size: 5.416667vw;
  }

  .hw-niki-all .health-manage .manage-circle2 .manage-circle-num span {
    margin-left: 0.694444vw;
    font-size: 2.222222vw;
  }

  .hw-niki-all .health-manage .manage-circle2 svg {
    width: 2.222222vw;
    margin: 0.833333vw 0 0 0;
  }

  .hw-niki-all .health-manage .manage-circle3 .manage-circle-txt1 {
    font-size: 1.944444vw;
  }

  .hw-niki-all .health-manage .manage-circle3 .manage-circle-txt2 {
    margin: 0 0 0.972222vw 0;
  }

  .hw-niki-all .health-manage .manage-circle3 .manage-circle-txt3 {
    font-size: 1.805556vw;
  }

  .hw-niki-all .health-manage .manage-circle3 .manage-circle-num {
    font-size: 4.305556vw;
  }

  .hw-niki-all .health-manage .manage-circle3 .manage-circle-num span {
    margin-left: 1.111111vw;
    font-size: 1.944444vw;
  }

  .hw-niki-all .health-manage .manage-circle3 svg {
    width: 1.805556vw;
    margin: 0.694444vw 0.555556vw 0 0;
  }

  .hw-niki-all .manage-content .manage-nav {
    margin-top: 11.111111vw;
  }

  .hw-niki-all .manage-content .nav-cta {
    justify-content: flex-start;
    overflow: scroll;
  }

  .hw-niki-all .manage-content .nav-cta.nav-scrollable {
    justify-content: flex-start;
    overflow: scroll;
  }

  .hw-niki-all .manage-content .nav-cta::-webkit-scrollbar {
    display: none;
  }

  .hw-niki-all .manage-content .nav-padding {
    padding: 0 8.888889vw;
    flex-shrink: 0;
  }

  .hw-niki-all .manage-content .nav-item {
    font-size: 5.5555555vw;
  }

  .hw-niki-all .manage-content .nav-item:not(:last-child) {
    margin-right: 11.111111vw;
  }

  .hw-niki-all .manage-content .nav-line {
    margin-top: 3.888889vw;
  }

  .hw-niki-all .manage-content .nav-desc {
    width: 82.222222vw;
    margin: 6.666667vw auto 0;
  }

  .hw-niki-all .manage-content .nav-text {
    font-size: 4.4444444vw;
    text-align: left;
  }
}

/* health-manage end */

/* health-research start */
.hw-niki-all .health-research {
  padding-top: 0;
}

.hw-niki-all .health-research .research-content {
  margin: 4.16666667vw auto 0;
  width: 67.5vw;
  padding: 6.92708333vw 6.51041667vw 6.92708333vw 5.83333333vw;
  position: relative;
  background: #f8f9fa;
  border-radius: 0.83333333vw;
  -webkit-border-radius: 0.83333333vw;
  -moz-border-radius: 0.83333333vw;
}

.hw-niki-all .health-research .research-swiper {
  margin: 0;
  width: 20.15625vw;
  height: 30.625vw;
}

.hw-niki-all .health-research .research-txt {
  position: absolute;
  top: 5vw;
  left: 35.833333vw;
  z-index: 2;
  width: 25vw;
}

.hw-niki-all .health-research .research-txt-item {
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
}

.hw-niki-all .health-research .research-img {
  width: 20.15625vw;
  height: 30.625vw;
}

.hw-niki-all .health-research .research-txt-item.active {
  padding-bottom: 1.25vw;
}

.hw-niki-all .health-research .research-txt-item:last-child {
  border-bottom: none;
}

.hw-niki-all .health-research .research-txt-item:not(:first-child) {
  margin-top: 1.25vw;
}

.hw-niki-all .health-research .research-txt-item-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.hw-niki-all .health-research .research-txt h3 {
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  line-height: 1.25;
  font-weight: 500;
  color: #86868b;
  font-size: 1.45833333vw;
  transition: all 0.6s;
  opacity: 0.5;
}

.hw-niki-all .health-research .research-txt-item.active h3 {
  color: rgba(0, 0, 0);
  opacity: 1;
}

.hw-niki-all .health-research .research-txt svg {
  width: 0.88541667vw;
  height: 0.88541667vw;
}

.hw-niki-all .health-research .research-txt-item.active svg {
  opacity: 1;
}

.hw-niki-all .health-research .research-txt-item.active svg .svg-v {
  opacity: 0;
}

.hw-niki-all .health-research .research-txt-item.active svg .svg-s {
  fill: #000;
}

.hw-niki-all .health-research .research-txt-item-desc {
  margin-top: 1.25vw;
  color: #86868B;
  font-weight: 500;
  line-height: 1.6;
  font-size: 0.9375vw;
  transition: all 0.6s;
  overflow: hidden;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .health-research .research-txt-item:not(.active):hover {
    cursor: pointer;
  }

  .hw-niki-all .health-research .research-txt-item:not(.active):hover h3 {
    color: rgba(0, 0, 0, 0.6);
    opacity: 0.8;
  }
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .health-research .research-content {
    margin: 11.111111vw auto 0;
    width: 86.666667vw;
    padding: 0;
    background: #fff;
    border-radius: 0;
  }

  .hw-niki-all .health-research .research-swiper {
    width: 86.666667vw;
    height: 159.722222vw;
    overflow: visible;
  }

  .hw-niki-all .health-research .swiper-slide {
    border-radius: 2.222222vw;
    -webkit-border-radius: 2.222222vw;
    -moz-border-radius: 2.222222vw;
    overflow: hidden;
    background: #f8f9fa;

    display: flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 13.472222vw;
  }

  .hw-niki-all .health-research .swiper-slide:nth-child(1).omc.animated {
    transition-delay: 0.15s;
  }

  .hw-niki-all .health-research .swiper-slide:nth-child(2).omc.animated {
    transition-delay: 0.3s;
  }

  .hw-niki-all .health-research .swiper-slide:nth-child(3).omc.animated {
    transition-delay: 0.45s;
  }

  .hw-niki-all .health-research .swiper-slide:nth-child(4).omc.animated {
    transition-delay: 0.6s;
  }

  .hw-niki-all .health-research .swiper-slide:nth-child(5).omc.animated {
    transition-delay: 0.75s;
  }

  .hw-niki-all .health-research .swiper-slide:nth-child(6).omc.animated {
    transition-delay: 0.9s;
  }

  .hw-niki-all .health-research .swiper-slide:nth-child(7).omc.animated {
    transition-delay: 1.05s;
  }

  .hw-niki-all .health-research .swiper-slide .research-img {
    width: 62.361111vw;
    height: 94.722222vw;
  }

  .hw-niki-all .health-research .research-txt-item {
    align-self: flex-start;
    padding: 6.666667vw 0 0 6.666667vw;
    border-bottom: none;
  }

  .hw-niki-all .health-research .research-txt-item:not(:first-child) {
    margin-top: 0;
  }

  .hw-niki-all .health-research .research-txt-item-title {
    width: 70vw;
    display: block;
  }

  .hw-niki-all .health-research .research-txt-item-title h3 {
    font-size: 5.555556vw;
    line-height: 1.25;
    font-weight: 500;
    color: #000;
  }

  .hw-niki-all .health-research .research-txt-item-desc {
    margin-top: 2.777778vw;
    width: 69.166667vw;
    font-size: 3.888889vw;
    transition: none;
  }
}

/* health-research end */

/* life-member start */
.hw-niki-all .life-member {
  display: flex;
  justify-content: center;
}

.hw-niki-all .life-member .member-content {
  border-radius: 1.51041667vw;
  -webkit-border-radius: 1.51041667vw;
  -moz-border-radius: 1.51041667vw;
  overflow: hidden;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 6.14583333vw 5.36458333vw 6.14583333vw 3.48958333vw;
  position: relative;
  background: linear-gradient(103.03deg, #fffaf8 2.43%, #f8f9fa 93.36%);
}

.hw-niki-all .life-member .member-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.hw-niki-all .life-member .member-desc {
  width: 25.72916667vw;
  margin-right: 4.84375vw;
  position: relative;
  z-index: 1;
}

.hw-niki-all .life-member .member-title {
  font-size: 2.5vw;
  font-weight: 700;
  line-height: 1.25;
  color: #000;
}

.hw-niki-all .life-member .member-txt {
  margin-top: 1.66666667vw;
  font-size: 1.04166667vw;
  font-weight: 500;
  line-height: 1.6;
  color: #86868b;
}

.hw-niki-all .life-member .member-icon {
  position: relative;
  z-index: 1;
}

.hw-niki-all .life-member .member-icon ul {
  display: flex;
  justify-content: center;
  list-style: none;
}

.hw-niki-all .life-member .member-icon ul:nth-of-type(1) {
  margin-bottom: 1.66666667vw;
}

.hw-niki-all .life-member .member-icon ul .icon-li {
  display: flex;
  flex-direction: column;
  align-items: center;
}

.hw-niki-all .life-member .member-icon ul:nth-child(1) li:not(:last-child) {
  margin-right: 1.40625vw;
}

.hw-niki-all .life-member .member-icon ul li:not(:nth-last-child(-n+2)) {
  margin-right: 1.40625vw;
}

.hw-niki-all .life-member .member-icon ul li img {
  width: 3.95833333vw;
  height: 3.95833333vw;
}

.hw-niki-all .life-member .member-icon ul li span {
  margin-top: 0.41666667vw;
  font-size: 0.88541667vw;
  font-weight: 500;
  line-height: 1.25;
  color: #000;
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .life-member .member-container {
    width: 86.666667vw;
  }

  .hw-niki-all .life-member .member-content {
    margin: 11.111111vw 0 0 0;
    border-radius: 2.222222vw;
    -webkit-border-radius: 2.222222vw;
    -moz-border-radius: 2.222222vw;
    padding: 9.166667vw 10.416667vw;
    background: linear-gradient(126.66deg, #fffaf8 5.49%, #f8f9fa 83.22%);
  }

  .hw-niki-all .life-member .member-desc {
    width: 82.222222vw;
    margin: 6.666667vw auto 0;
  }

  .hw-niki-all .life-member .member-title {
    width: 86.666667vw;
    padding-left: 2.222222vw;
    font-size: 8.888889vw;
  }

  .hw-niki-all .life-member .member-txt {
    margin-top: 0;
    font-size: 4.444444vw;
  }

  .hw-niki-all .life-member .member-icon ul:nth-of-type(1) {
    margin-bottom: 6.111111vw;
  }

  .hw-niki-all .life-member .member-icon ul:nth-of-type(2) {
    flex-wrap: wrap;
  }

  .hw-niki-all .life-member .member-icon ul li:not(:last-child) {
    margin-right: 0;
  }

  .hw-niki-all .life-member .member-icon ul:nth-child(1) li:nth-child(1),
  .hw-niki-all .life-member .member-icon ul:nth-child(1) li:nth-child(3) {
    margin-right: 0;
  }

  .hw-niki-all .life-member .member-icon ul:nth-of-type(1) li:nth-child(2) {
    margin: 0 5.416667vw;
    width: 21.666667vw;
  }

  .hw-niki-all .life-member .member-icon ul:nth-of-type(2) li:nth-child(2),
  .hw-niki-all .life-member .member-icon ul:nth-of-type(2) li:nth-child(5) {
    margin: 0 5.416667vw;
    width: 21.666667vw;
  }

  .hw-niki-all .life-member .member-icon ul:nth-of-type(2) li:nth-child(-n + 3) {
    margin-bottom: 6.111111vw;
  }

  .hw-niki-all .life-member .member-icon ul li img {
    width: 16.666667vw;
    height: 16.666667vw;
  }

  .hw-niki-all .life-member .member-icon ul li span {
    margin-top: 2.222222vw;
    font-size: 3.611111vw;
  }
}

/* life-member end */

/* wisdom-life start */
.hw-niki-all .wisdom-life .life-head h2 {
  margin: 0 auto;
  width: 67.5vw;
  text-align: left;
  font-size: 4.16666667vw;
  font-weight: 700;
  line-height: 1.25;
  color: #000;
}

.hw-niki-all .wisdom-life .life-swiper {
  margin: 4.16666667vw auto 0;
  width: 67.5vw;
  overflow: visible;
}

.hw-niki-all .wisdom-life .life-swiper .swiper-wrapper {
  transition-timing-function: ease;
}

.hw-niki-all .wisdom-life .swiper-slide {
  width: 21.66666667vw;
  height: 33.33333333vw;
}

.hw-niki-all .wisdom-life .swiper-slide .life-inner-ctn {
  width: 21.66666667vw;
  height: 33.33333333vw;
  border-top-left-radius: 0.83333333vw;
  border-bottom-left-radius: 0.83333333vw;
  border-bottom-right-radius: 0.83333333vw;
  border-top-right-radius: 4.6875vw;
  overflow: hidden;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .wisdom-life .swiper-slide:hover {
    cursor: pointer;
  }
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(1) .life-img,
.hw-niki-all .wisdom-life .swiper-slide:nth-child(3) .life-img,
.hw-niki-all .wisdom-life .swiper-slide:nth-child(4) .life-img,
.hw-niki-all .wisdom-life .swiper-slide:nth-child(5) .life-img,
.hw-niki-all .wisdom-life .swiper-slide:nth-child(6) .life-img {
  position: absolute;
  left: 50%;
  transform: translate(-50%, 0);
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(1) .life-inner-ctn {
  background: linear-gradient(180.89deg, #521717 25.47%, #320e0e 48.35%, #240b0b 80.26%);
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(3) .life-inner-ctn {
  background: linear-gradient(180deg, #1d3f7c 0%, #081934 100%);
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(4) .life-inner-ctn {
  background: linear-gradient(180deg, #1d3f7c 0%, #043a71 23.57%, #052c69 51.56%, #042967 89.24%);
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(5) .life-inner-ctn {
  background: linear-gradient(180deg, #1d3f7c 0%, #043a71 23.57%, #052c69 51.56%, #042967 89.24%);
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(6) .life-inner-ctn {
  background: #191919;
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(1) .life-img {
  bottom: 0;
  width: 18.38541667vw;
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(3) .life-img {
  top: 5.88541667vw;
  width: 13.85416667vw;
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(4) .life-img {
  top: 6.04166667vw;
  width: 18.02083333vw;
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(5) .life-img {
  top: 11.92708333vw;
  width: 17.8125vw;
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(6) .life-img {
  top: 7.96875vw;
  width: 18.33333333vw;
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(2) .life-img img {
  border-top-left-radius: 0.83333333vw;
  border-bottom-left-radius: 0.83333333vw;
  border-bottom-right-radius: 0.83333333vw;
  border-top-right-radius: 4.6875vw;
  overflow: hidden;
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(1).opc.animated {
  transition-delay: 0s;
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(2).opc.animated {
  transition-delay: 0.15s;
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(3).opc.animated {
  transition-delay: 0.3s;
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(4).opc.animated {
  transition-delay: 0.45s;
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(5).opc.animated {
  transition-delay: 0.6s;
}

.hw-niki-all .wisdom-life .swiper-slide:nth-child(6).opc.animated {
  transition-delay: 0.75s;
}

.hw-niki-all .wisdom-life .swiper-slide .life-title {
  position: absolute;
  top: 2.08333333vw;
  left: 2.08333333vw;
  z-index: 3;
  line-height: 1.25;
  font-size: 1.66666667vw;
  font-weight: 700;
  color: #fff;
  will-change: transform;
  transform: translate3d(0, 0, 0) rotate(0deg);
}

.hw-niki-all .wisdom-life .swiper-slide .life-desc {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 2;
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  border-top-left-radius: 0.83333333vw;
  border-bottom-left-radius: 0.83333333vw;
  border-bottom-right-radius: 0.83333333vw;
  border-top-right-radius: 4.6875vw;
  overflow: hidden;
  background-color: rgba(25, 25, 25, 0);
  backdrop-filter: blur(30px) brightness(1.2);
  -webkit-backdrop-filter: blur(30px) brightness(1.2);
  -moz-backdrop-filter: blur(30px) brightness(1.2);
  opacity: 0;
  transition: opacity 0.8s;
  pointer-events: none;
  will-change: backdrop-filter, opacity;
}

.hw-niki-all .wisdom-life .swiper-slide.active .life-desc {
  opacity: 1;
  pointer-events: all;
}

.hw-niki-all .wisdom-life .swiper-slide .life-txt {
  position: absolute;
  top: 11.97916667vw;
  left: 2.08333333vw;
  width: 14.79166667vw;
  line-height: 1.6;
  font-size: 1.04166667vw;
  font-weight: 500;
  color: #F5F6F7;
}

.hw-niki-all .wisdom-life .swiper-slide .life-txt span {
  font-weight: 700;
}

.hw-niki-all .wisdom-life .swiper-slide .life-icon {
  position: absolute;
  top: -1px;
  right: -1px;
  top: 0px;
  right: 0px;
  width: 4.375vw;
  height: 4.375vw;
  z-index: 4;
  will-change: transform;
  transform: translate3d(0, 0, 0) rotate(0deg);
  opacity: 1 !important;
}

.hw-niki-all .wisdom-life .swiper-slide .life-icon1 {
  width: 4.375vw;
  height: 4.375vw;
}

.hw-niki-all .wisdom-life .swiper-slide .life-icon2 {
  position: absolute;
  top: 1px;
  right: 1px;
  width: 2.5vw;
  height: 2.5vw;
  transition: transform 0.8s, opacity 0.6s ease;
  will-change: transform, opacity;
  display: flex;
}

.hw-niki-all .wisdom-life .swiper-slide .life-icon2 svg {
  width: 2.5vw;
  height: 2.5vw;
  overflow: visible;
  transform: translate3d(0, 0, 0) rotate(0deg);
}

.hw-niki-all .wisdom-life .swiper-slide.active .life-icon2 {
  transform: rotate(45deg);
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .wisdom-life .swiper-slide .life-icon2:hover {
    opacity: 0.6;
  }
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .wisdom-life .life-head h2 {
    width: 82.222222vw;
    font-size: 11.111111vw;
  }

  .hw-niki-all .wisdom-life .life-swiper {
    margin: 11.111111vw auto 0;
    width: 82.222222vw;
  }

  .hw-niki-all .wisdom-life .swiper-slide {
    width: 82.222222vw;
    height: 125vw;
  }

  .hw-niki-all .wisdom-life .swiper-slide .life-inner-ctn {
    width: 82.222222vw;
    height: 125vw;
    border-top-left-radius: 2.222222vw;
    border-bottom-left-radius: 2.222222vw;
    border-bottom-right-radius: 2.222222vw;
    border-top-right-radius: 15.972222vw;
  }

  .hw-niki-all .wisdom-life .swiper-slide:nth-child(1) .life-img {
    bottom: 8.055556vw;
    width: 68.611111vw;
  }

  .hw-niki-all .wisdom-life .swiper-slide:nth-child(3) .life-img {
    top: 25.416667vw;
    width: 48.888889vw;
  }

  .hw-niki-all .wisdom-life .swiper-slide:nth-child(4) .life-img {
    top: 27.777778vw;
    width: 64.166667vw;
  }

  .hw-niki-all .wisdom-life .swiper-slide:nth-child(5) .life-img {
    top: 45.555556vw;
    width: 63.333333vw;
  }

  .hw-niki-all .wisdom-life .swiper-slide:nth-child(6) .life-img {
    top: 31.944444vw;
    width: 69.444444vw;
  }

  .hw-niki-all .wisdom-life .swiper-slide:nth-child(2) .life-img img {
    border-top-left-radius: 2.222222vw;
    border-bottom-left-radius: 2.222222vw;
    border-bottom-right-radius: 2.222222vw;
    border-top-right-radius: 15.972222vw;
  }

  .hw-niki-all .wisdom-life .swiper-slide .life-title {
    top: 6.666667vw;
    left: 6.666667vw;
    font-size: 5.555556vw;
  }

  .hw-niki-all .wisdom-life .swiper-slide .life-desc {
    border-top-left-radius: 2.222222vw;
    border-bottom-left-radius: 2.222222vw;
    border-bottom-right-radius: 2.222222vw;
    border-top-right-radius: 15.972222vw;
  }

  .hw-niki-all .wisdom-life .swiper-slide:last-child .life-desc {
    position: relative;
  }

  .hw-niki-all .wisdom-life .swiper-slide .life-txt {
    top: 43.611111vw;
    left: 6.666667vw;
    width: 64.444444vw;
    font-size: 3.888889vw;
  }

  .hw-niki-all .wisdom-life .swiper-slide .life-icon {
    width: 14.861111vw;
    height: 14.861111vw;
  }

  .hw-niki-all .wisdom-life .swiper-slide .life-icon1 {
    width: 14.861111vw;
    height: 14.861111vw;
  }

  .hw-niki-all .wisdom-life .swiper-slide .life-icon2 {
    width: 8.888889vw;
    height: 8.888889vw;
  }

  .hw-niki-all .wisdom-life .swiper-slide .life-icon2 svg {
    width: 8.888889vw;
    height: 8.888889vw;
  }
}

/* wisdom-life end */

/* compatible-battery start */
.hw-niki-all .compatible-battery {
  padding-bottom: 0;
}

.hw-niki-all .compatible-battery .battery-content {
  margin: 0 auto;
  width: 67.5vw;
  display: flex;
}

.hw-niki-all .compatible-battery .battery-card {
  width: 33.125vw;
  flex-shrink: 0;
  height: auto;
  background: #F8F9FA;
  position: relative;
}

.hw-niki-all .compatible-battery .battery-card:first-child {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: space-between;
}

.hw-niki-all .compatible-battery .battery-card:last-child {
  order: -1;
  padding-bottom: 4.32291667vw;
  margin-right: 1.25vw;
}

.hw-niki-all .compatible-battery .battery-head {
  padding: 3.33333333vw 2.60416667vw 0 3.33333333vw;
}

.hw-niki-all .compatible-battery .battery-title {
  font-size: 1.66666667vw;
  font-weight: 700;
  line-height: 1.25;
  color: #000;
}

.hw-niki-all .compatible-battery .battery-desc {
  margin-top: 0.83333333vw;
  font-size: 1.04166667vw;
  font-weight: 500;
  line-height: 1.6;
  color: #86868b;
}

.hw-niki-all .compatible-battery .battery-link {
  margin-top: 1.25vw;
}

.hw-niki-all .compatible-battery .battery-link a {
  width: fit-content;
  width: -webkit-fit-content;
  font-size: 1.04166667vw;
  line-height: 1.6;
  font-weight: 500;
  color: #000;
  opacity: 1;
  display: flex;
  align-items: center;
  transition: opacity 0.6s ease;
  -webkit-transition: opacity 0.6s ease;
  -moz-transition: opacity 0.6s ease;
  will-change: opacity;
}

.hw-niki-all .compatible-battery .battery-link a svg {
  display: inline-block;
  width: 1.14583333vw;
  height: 1.14583333vw;
  overflow: visible;
  transition: transform 0.6s ease;
  -webkit-transition: transform 0.6s ease;
  -moz-transition: transform 0.6s ease;
  will-change: transform;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .compatible-battery .battery-link a:hover {
    opacity: 0.6;
  }

  .hw-niki-all .compatible-battery .battery-link a:hover svg {
    transform: translateX(4px);
    -webkit-transform: translateX(4px);
    -moz-transform: translateX(4px);
  }
}

.hw-niki-all .compatible-battery .battery-left .battery-img {
  width: 25.15625vw;
  height: 26.40625vw;
  transform-origin: 50% 100%;
  transform: translate3d(0, 0, 0) scale(1.05777778);
  will-change: transform;
}

.hw-niki-all .compatible-battery.animated .battery-left .battery-img {
  transition: transform 1s ease 0.8s;
  -webkit-transition: transform 1s ease 0.8s;
  -moz-transition: transform 1s ease 0.8s;
  transform: translate3d(0, 0, 0) scale(1);
}

.hw-niki-all .compatible-battery .battery-right {
  margin: 2.5vw 0 0 3.33333333vw;
  display: flex;
  align-items: center;
}

.hw-niki-all .compatible-battery .battery-text {
  margin-right: 3.33333333vw;
  display: flex;
  flex-direction: column;
}

.hw-niki-all .compatible-battery .battery-bottom {
  margin-top: 0.83333333vw;
  width: 5.20833333vw;
  height: 1px;
  background: #e1e1e3;
}

.hw-niki-all .compatible-battery .battery-item:nth-child(n + 2) {
  margin-top: 0.83333333vw;
}

.hw-niki-all .compatible-battery .battery-right .battery-item-txt {
  font-size: 0.83333333vw;
  font-weight: 500;
  line-height: 1.6;
  color: #BCBCBC;
}

.hw-niki-all .compatible-battery .battery-right .battery-item-num {
  font-size: 2.8125vw;
  font-weight: 500;
  line-height: 1.25;

  background-image: linear-gradient(to bottom, #BCBCBC 0%, #BCBCBC 50%, #00CC1F 51%, #00CC1F 100%);
  background-size: 100% 200%;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

.hw-niki-all .compatible-battery.animated .battery-right .battery-item-num {
  transition: all 1s ease 0.8s;
  -webkit-transition: all 1s ease 0.8s;
  -moz-transition: all 1s ease 0.8s;
  background-position-y: 100%;
}

.hw-niki-all .compatible-battery .battery-right .battery-item-num span {
  display: inline-block;
  margin-left: 0.10416667vw;
  font-size: 1.04166667vw;
  font-weight: 500;
  line-height: 1.6;
}

.hw-niki-all .compatible-battery .battery-right .battery-img {
  position: relative;
}

.hw-niki-all .compatible-battery .battery-watch {
  width: 14.47916667vw;
  height: 24.0625vw;
  transform-origin: 50% 50%;
  transform: translate3d(0, 0, 0) scale(1.13253);
  will-change: transform;
}

.hw-niki-all .compatible-battery.animated .battery-watch {
  transition: transform 1s ease 0.8s;
  -webkit-transition: transform 1s ease 0.8s;
  -moz-transition: transform 1s ease 0.8s;
  transform: translate3d(0, 0, 0) scale(1);
}

.hw-niki-all .compatible-battery .battery-line {
  position: absolute;
  top: 50%;
  left: 4.21875vw;
  transform: translate(22.60416667vw, -50%);
  width: 35.20833333vw;
  height: 9.79166667vw;
  z-index: -1;
  will-change: transform;
}

.hw-niki-all .compatible-battery.animated .battery-line {
  transition: transform 0.8s ease;
  -webkit-transition: transform 0.8s ease;
  -moz-transition: transform 0.8s ease;
  transform: translate(0, -50%);
}

@media screen and (max-aspect-ratio: 11/10) {
  .hw-niki-all .compatible-battery .battery-content {
    margin: 0 auto;
    width: 91.111111vw;
    flex-direction: column;
    align-items: center;
  }

  .hw-niki-all .compatible-battery .battery-card {
    width: 100%;
  }

  .hw-niki-all .compatible-battery .battery-card:first-child {
    padding-bottom: 9.722222vw;
  }

  .hw-niki-all .compatible-battery .battery-card:last-child {
    margin-right: 0;
    margin-bottom: 16.666667vw;
    padding-bottom: 6.25vw;
  }

  .hw-niki-all .compatible-battery .battery-head {
    padding: 6.666667vw 6.666667vw 0 6.666667vw;
  }

  .hw-niki-all .compatible-battery .battery-title {
    font-size: 5.555556vw;
  }

  .hw-niki-all .compatible-battery .battery-link {
    margin-top: 5.555556vw;
  }

  .hw-niki-all .compatible-battery .battery-link a {
    font-size: 3.888889vw;
    transition: none;
  }

  .hw-niki-all .compatible-battery .battery-link a svg {
    width: 4.166667vw;
    height: 4.166667vw;
    transition: none;
  }

  .hw-niki-all .compatible-battery .battery-desc {
    margin-top: 2.777778vw;
    font-size: 3.888889vw;
  }

  .hw-niki-all .compatible-battery .battery-left .battery-img {
    margin-top: 5.555556vw;
    width: 72.222222vw;
    height: 93.888889vw;
    transform-origin: 50% 50%;
    transform: translate3d(0, 0, 0) scale(1);
  }

  .hw-niki-all .compatible-battery .battery-right {
    margin: 11.805556vw 0 0 0;
    flex-direction: column;
  }

  .hw-niki-all .compatible-battery .battery-text {
    margin: 7.222222vw 0 0 0;
    flex-direction: row;

    opacity: 0;
    transform: translate3d(0, 30px, 0);
    -webkit-transform: translate3d(0, 30px, 0);
    -moz-transform: translate3d(0, 30px, 0);
    pointer-events: none;
    transition: opacity 0.9s ease, transform 0.7s ease;
    -webkit-transition: opacity 0.9s ease, transform 0.7s ease;
    -moz-transition: opacity 0.9s ease, transform 0.7s ease;
    will-change: opacity, transform;
  }

  .hw-niki-all .compatible-battery.animated .battery-text {
    opacity: 1;
    transform: translateY(0);
    pointer-events: all;
    transition-delay: 0.3s;
  }

  .hw-niki-all .compatible-battery.animated .battery-right .battery-item-num {
    transition-delay: 0.9s;
  }

  .hw-niki-all .compatible-battery .battery-item:nth-child(n + 2) {
    margin: 0;
  }

  .hw-niki-all .compatible-battery .battery-bottom {
    margin: 4.583333vw 4.722222vw 0;
    width: 1px;
    height: 10.833333vw;
  }

  .hw-niki-all .compatible-battery .battery-right .battery-item-txt {
    font-size: 3.055556vw;
  }

  .hw-niki-all .compatible-battery .battery-right .battery-item-num {
    font-size: 11.666667vw;
  }

  .hw-niki-all .compatible-battery .battery-right .battery-item-num span {
    margin-left: 0.555556vw;
    font-size: 3.75vw;
  }

  .hw-niki-all .compatible-battery .battery-right .battery-img {
    order: -1;
    width: 41.666667vw;
    height: 69.166667vw;
  }

  .hw-niki-all .compatible-battery .battery-watch {
    width: 41.666667vw;
    height: 69.166667vw;
    transform: translate3d(0, 0, 0) scale(1.13253);
  }

  .hw-niki-all .compatible-battery .battery-line {
    left: 8.472222vw;
    transform: translate(83.333333vw, -50%);
    width: 113.611111vw;
    height: 31.666667vw;
  }
}

/* compatible-battery end */

/* foot start */
.hw-niki-all .section-footer {
  padding: 10.41666667vw 0 80px 0;
}

.hw-niki-all .hw-footer-ul {
  margin: 0 auto;
  width: 67.5vw;
}

.hw-niki-all .hw-footer-ul ul {
  list-style-type: decimal;
  padding-left: 1.8em;
  font-size: 14px;
}

.hw-niki-all .hw-footer-ul li {
  color: #000000;
  line-height: 1.6;
  font-weight: 500;
  position: relative;
  margin: 0.5em 0;
}

.hw-niki-all .hw-footer-ul a {
  word-wrap: break-word;
  word-break: normal;
  color: #000;
  text-decoration: underline;
}

.hw-niki-all .hw-footer-ul li.note-none {
  list-style-type: "";
}

.hw-niki-all .hw-footer-ul li.note1 {
  list-style-type: "*";
}

.hw-niki-all .hw-footer-ul li.note2 {
  list-style-type: "**";
}

.hw-niki-all .hw-footer-ul li.active,
.hw-niki-all .hw-footer-ul li.active a {
  font-weight: 800;
}

@media screen and (max-aspect-ratio:11/10) {
  .hw-niki-all .section-footer {
    padding-top: 27.777778vw;
  }

  .hw-niki-all .hw-footer-ul {
    width: 91.11111111vw;
  }

  .hw-niki-all .hw-footer-ul ul {
    font-size: 3.333333vw;
  }
}

.hw-niki-all .hw-footer-ul li span {
  --arrow-dark: 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;
  --arrow-light: 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;
  position: absolute;
  bottom: 0;
  display: none;
  width: 16px;
  height: 16px;
  transform: translateY(calc((14px * 1.6 - 16px) / 2 * -1 - 1px));
  background: var(--arrow-light);
}

.hw-niki-all .hw-footer-ul li.active span {
  display: inline-block;
}

@media (hover: hover) and (pointer: fine) {
  .hw-niki-all .hw-footer-ul li span:hover {
    cursor: pointer;
  }
}

@media (min-width: 1921px) {
  .hw-niki-all .hw-footer-ul li span {
    width: .833333vw;
    height: .833333vw;
    transform: translateY(calc((.625vw * 1.6 - .833333vw) / 2 * -1 - 1px));
  }
}

@media (max-aspect-ratio: 11/10) {
  .hw-niki-all .hw-footer-ul li span {
    width: 4.722222vw;
    height: 4.722222vw;
    transform: translateY(calc((3.333333vw * 1.6 - 4.722222vw) / 2 * -1 - 1px));
  }
}

/* foot end */