/* Start custom CSS for section, class: .elementor-element-1971641 */picture { display: block; }

:root {
  --pc-pad-top: 12vw;
  --pc-pad-right: 27.94vw;
  --pc-pad-bottom: 8.54vw;
  --pc-pad-left: 27.94vw;

  --bg12-pc: url("/wp-content/uploads/2026/01/apusWa_12.webp");
  --bg12-m: url("/wp-content/uploads/2026/01/mApusWa_13.webp");

  --font-rc-regular: RobotoCondensedRegular, sans-serif;
  --font-rc-bold: RobotoCondensedBold, sans-serif;
}

.apusWrap { width: 100%; }

.apusSwag {
  width: 100%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}

.apusSwagSection {
  position: relative;
}

.apusSwagBg {
  display: block;
  width: 100%;
}

.apusSwagMedia {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: var(--pc-pad-top) var(--pc-pad-right) var(--pc-pad-bottom) var(--pc-pad-left);
}

.apusSwagMedia video {
  width: 100%;
  height: auto;
  display: block;
  cursor: pointer;
}

.apusSwagMedia video::-webkit-media-controls { display: none !important; }

.apusOverlay {
  position: absolute;
  display: block;
  pointer-events: none;
}


.apusOverlay--02 { top: 16.5%; left: 19.9%; width: 32.05vw; }
.apusOverlay--03 { top: 19.5%; right: 27.1%; width: 17.21vw; }
.apusOverlay--04 { top: 36.5%; right: 20.1%; width: 18.22vw; }

.apusHow {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  box-sizing: border-box;
}

.apusHowTop {
  width: 33.95vw;
  max-width: 100%;
}

.apusHowTop img { width: 100%; height: auto; }

.apusHowSteps {
  width: 60.46vw;
  display: flex;
  gap: 2.5vw;
  margin-top: 4.29vw;
}

.apusHowStep { flex: 1; min-width: 0; }

.apusHowStepHead {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.8vw;
}

.apusHowStepHeadText {
  font-family: var(--font-rc-bold);
  color: #000000;
  font-size: 2.58vw;
  font-weight: 700;
}

.apusHowStepText {
  font-family: var(--font-rc-regular);
  color: #000000;
  font-size: 1.62vw;
  line-height: 1.92vw;
  margin-top: 0.54vw;
  text-align: center;
}

.apusHowBr { display: inline; }

.apusHowTime {
  display: inline-flex;
  align-items: center;
  border-radius: 9999px;
  background: #ec6730;
  border: 3px solid #fef141;
  padding: 0.88vw 2.34vw;
  margin-top: 5.73vw;
  font-family: var(--font-rc-bold);
  font-size: 1.82vw;
  line-height: 1.82vw;
  font-weight: 700;
}

.apusHowTimeLabel { color: #ffffff; }
.apusHowTimeValue { color: #fef141; }

.apusJoin {
  width: 100%;
  box-sizing: border-box;
  background-image: var(--bg12-pc);
  background-repeat: no-repeat;
  background-size: cover;
  padding: 3.77vw 23.17vw 0 23.17vw;
}

.apusJoinPic img {
  width: 100%;
  max-width: 100%;
  display: block;
  margin: 0 auto;
}

.apusJoinPicImg {
  width: 14.69vw !important;
}

.apusJoinPic--10 { padding: 2.47vw 0 3.75vw 0; box-sizing: border-box; }

.apusJoinNote {
  color: #ffffff;
  font-family: var(--font-rc-regular);
  font-size: 1.25vw;
  line-height: 1.25vw;
  text-align: center;
  padding-bottom: 4.42vw;
}

.mApusSwag {
  display: none;
}

.mApusSwag img {
  display: block;
}

.tApusSwag {
  display: none;
}

.tApusSwag img {
  display: block;
  width: 100%;
  height: auto;
}

@media (min-width: 769px) and (max-width: 1024px) {
  .apusHero { display: none; }
  .apusSwag { display: none; }
  .mApusSwag { display: none; }
  .apusJoin { display: none; }
  .tApusSwag { display: block; }
}

@media (max-width: 768px) {
  .apusJoinPicImg {
    width: 36.7vw !important;
  }
  .apusSwag { display: none; }
  .mApusSwag { display: block; }

  .mApusSwagCard {
    position: relative;
  }

  .mApusSwagCard > img {
    display: block;
    width: 100%;
    height: auto;
  }

  .mApusSwagContent {
    position: absolute;
    inset: 0;
  }

  .mApusSwagContent .apusHowSteps {
    width: 100%;
    margin-top: 0;
  }

  .mApusSwagMedia {
    position: relative;
  }

  .mApusSwagBase {
    display: block;
    width: 100%;
    height: auto;
  }

  .mApusSwagMedia video {
    position: absolute;
    left: 50%;
    top: 33.46vw;
    transform: translateX(-50%);
    width: 83.22vw;
    z-index: 1;
  }

  .mApusSwagMedia .apusOverlay--02 {
    top: 9.5vw;
    left: 50%;
    transform: translateX(-50%);
    width: 59.63vw;
    z-index: 3;
  }

  .mApusSwagMedia .apusOverlay--03 {
    top: 32%;
    left: 5.4%;
    width: 29.68vw;
    z-index: 2;
  }

  .mApusSwagMedia .apusOverlay--04 {
    top: 25.5%;
    right: 4%;
    width: 34.11vw;
    z-index: 2;
  }

  .mApusSwagContent .mApusHowIcon--07 { width: 2.99vw; height: auto; }
  .mApusSwagContent .mApusHowIcon--08 { width: 5.59vw; height: auto; }
  .mApusSwagContent .mApusHowIcon--09 { width: 7.55vw; height: auto; }

  .apusHowTop { width: 100%; max-width: 100%; }
  .apusHowSteps { flex-direction: column; gap: 7.55vw; }
  .apusHowStepHeadText { font-size: 4.44vw; line-height: 4.44vw; }
  .apusHowStepText { font-size: 3.4vw; line-height: 3.4vw; margin-top: 1.69vw; }
  .apusHowBr { display: none; }
  .apusHowTime { padding: 1.69vw 4.99vw; font-size: 3.33vw; line-height: 3.33vw; margin: 0 25.5vw; text-align: center; }

  .apusJoin {
    background-image: var(--bg12-m);
    padding: 9.76vw 9.5vw 0 10.41vw;
  }
  .apusJoinPic--10 { padding: 13.8vw 0; }
  .apusJoinNote { font-size: 2.44vw; line-height: 2.44vw; padding-bottom: 6.25vw; }
}/* End custom CSS */