@charset "utf-8";
/* ==================================================
〈やまぎん〉と「積立」について考える スライダー
================================================== */
.tumitateSlider {
  margin-top: 40px;
}
@media screen and (max-width: 767px) {
  .tumitateSlider .uniSwiper_arrow {
    width: 28px;
  }
  .tumitateSlider .uniSwiper_arrow-type2::before {
    width: 24px;
  }
}

/* スライド共通 */
.tumitate_pr_slide {
  width: 100%;
  min-height: 450px;
  padding: 4% 20px;
  position: relative;
  background-color: #f2f2f2;
  border-radius: 10px;
}
@media screen and (max-width: 767px) {
  .tumitate_pr_slide {
    height: auto;
    padding: 8% 0;
  }
}

/* ==================================================
スライド1
================================================== */
.tumitate_pr_slide01 {
  padding: 0;
}
.tumitate_pr_slide01_inner {
  max-width: 988px;
  height: 100%;
  margin: 0 auto;
  position: relative;
}
@media screen and (max-width: 767px) {
  .tumitate_pr_slide01_inner {
    width: 100%;
    height: 550px;
  }
}
.tumitate_pr_slide01 h3 {
  width: 340px;
  position: absolute;
  top: calc(50% - 190px);
  left: calc(50% - 170px);
  transform: translateY(10px) scale(0.6);
  opacity: 0;
}
.tumitate_pr_slide01 .slide01_parts01 {
  width: 300px;
  position: absolute;
  top: 5%;
  left: 6%;
  transform: translateX(-10px);
  opacity: 0;
}
.tumitate_pr_slide01 .slide01_parts02 {
  width: 310px;
  position: absolute;
  top: 5%;
  right: 6%;
  transform: translateX(10px);
  opacity: 0;
}
.tumitate_pr_slide01 .slide01_parts03 {
  width: 300px;
  position: absolute;
  bottom: 5%;
  left: 4%;
  transform: translateX(-10px);
  opacity: 0;
}
.tumitate_pr_slide01 .slide01_parts04 {
  width: 310px;
  position: absolute;
  bottom: 5%;
  right: 4%;
  transform: translateX(10px);
  opacity: 0;
}
.tumitate_pr_slide01 h3 img,
.tumitate_pr_slide01 .slide01_parts01 img,
.tumitate_pr_slide01 .slide01_parts02 img,
.tumitate_pr_slide01 .slide01_parts03 img,
.tumitate_pr_slide01 .slide01_parts04 img {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .tumitate_pr_slide01 h3 {
    width: 60%;
    top: calc(50% - 100px);
    left: 20%;
  }
  .tumitate_pr_slide01 .slide01_parts01 { width: 40%; }
  .tumitate_pr_slide01 .slide01_parts02 { width: 39%; }
  .tumitate_pr_slide01 .slide01_parts03 { width: 38%; }
  .tumitate_pr_slide01 .slide01_parts04 { width: 36%; }
}
.swiper-slide-active .tumitate_pr_slide01 h3 {
  animation: tumitateSlideInA 1s cubic-bezier(0.25, 1, 0.5, 1) 0.8s forwards;
}
.swiper-slide-active .tumitate_pr_slide01 .slide01_parts01 {
  animation: tumitateSlideInB 1.5s cubic-bezier(0.25, 1, 0.5, 1) 1.4s forwards;
}
.swiper-slide-active .tumitate_pr_slide01 .slide01_parts02 {
  animation: tumitateSlideInC 1.5s cubic-bezier(0.25, 1, 0.5, 1) 1.6s forwards;
}
.swiper-slide-active .tumitate_pr_slide01 .slide01_parts03 {
  animation: tumitateSlideInB 1.5s cubic-bezier(0.25, 1, 0.5, 1) 1.8s forwards;
}
.swiper-slide-active .tumitate_pr_slide01 .slide01_parts04 {
  animation: tumitateSlideInC 1.5s cubic-bezier(0.25, 1, 0.5, 1) 2s forwards;
}

/* ==================================================
スライド2
================================================== */
.tumitate_pr_slide02 .slide02_parts01 {
  width: 760px;
  margin: 0 auto 30px auto;
  transform: translateX(-20px);
  opacity: 0;
}
.tumitate_pr_slide02 .slide02_parts02 {
  width: 650px;
  margin: 30px auto;
  transform: translateY(10px) scale(0.6);
  opacity: 0;
}
.tumitate_pr_slide02 .slide02_parts03 {
  width: 700px;
  margin: 0 auto;
  display: flex;
}
.tumitate_pr_slide02 .slide02_parts03 div {
  opacity: 0;
}
.tumitate_pr_slide02 .slide02_parts03 div:nth-child(2) {
  width: 5%;
  margin: 4% 15px 4% 20px;
}
.tumitate_pr_slide02 .slide02_parts04 {
  width: 400px;
  margin: 30px auto 0;
  text-align: center;
  transform: translateX(-10px) scale(0.6);
  opacity: 0;
}
.tumitate_pr_slide02 .slide02_parts01 img,
.tumitate_pr_slide02 .slide02_parts02 img,
.tumitate_pr_slide02 .slide02_parts03 img,
.tumitate_pr_slide02 .slide02_parts04 img {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .tumitate_pr_slide02 .slide02_parts01 {
    width: 60%;
    margin: 0 auto 20px auto;
  }
  .tumitate_pr_slide02 .slide02_parts02 {
    width: 95%;
    margin: 20px auto;
  }
  .tumitate_pr_slide02 .slide02_parts03 {
    width: 62%;
    margin: 0 auto;
    display: block;
  }
  .tumitate_pr_slide02 .slide02_parts03 div:nth-child(2) {
    width: 17%;
    margin: 10px auto;
  }
  .tumitate_pr_slide02 .slide02_parts04 {
    width: 90%;
    margin: 20px auto 0;
  }
}
.swiper-slide-active .tumitate_pr_slide02 .slide02_parts01 {
  animation: tumitateSlideInTitle 1s cubic-bezier(0.25, 1, 0.5, 1) 0.8s forwards;
}
.swiper-slide-active .tumitate_pr_slide02 .slide02_parts02 {
  animation: tumitateSlideInA 0.8s cubic-bezier(0.25, 1, 0.5, 1) 1.8s forwards;
}
.swiper-slide-active .tumitate_pr_slide02 .slide02_parts03 div:nth-child(1) {
  animation: tumitateSlideInD 1s cubic-bezier(0.25, 1, 0.5, 1) 2.5s forwards;
}
.swiper-slide-active .tumitate_pr_slide02 .slide02_parts03 div:nth-child(2) {
  animation: tumitateSlideInD 1s cubic-bezier(0.25, 1, 0.5, 1) 2.7s forwards;
}
.swiper-slide-active .tumitate_pr_slide02 .slide02_parts03 div:nth-child(3) {
  animation: tumitateSlideInD 1s cubic-bezier(0.25, 1, 0.5, 1) 2.9s forwards;
}
.swiper-slide-active .tumitate_pr_slide02 .slide02_parts04 {
  animation: tumitateSlideInA 1.2s cubic-bezier(0.25, 1, 0.5, 1) 3.5s forwards;
}

/* ==================================================
スライド3
================================================== */
.tumitate_pr_slide03 .slide03_parts01 {
  width: 700px;
  margin: 0 auto 30px auto;
  transform: translateX(-20px);
  opacity: 0;
}
.tumitate_pr_slide03 .slide03_parts02 {
  width: 850px;
  margin: 0 auto;
  display: flex;
}
.tumitate_pr_slide03 .slide03_parts02 div {
  opacity: 0;
}
.tumitate_pr_slide03 .slide03_parts02 div:nth-child(2),
.tumitate_pr_slide03 .slide03_parts02 div:nth-child(4) {
  width: 7%;
  margin: 13% 15px 4% 20px;
}
.tumitate_pr_slide03 .slide03_parts01 img,
.tumitate_pr_slide03 .slide03_parts02 img {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .tumitate_pr_slide03 .slide03_parts01 {
    width: 90%;
    margin: 0 auto 20px auto;
  }
  .tumitate_pr_slide03 .slide03_parts02 {
    width: 88%;
  }
  .tumitate_pr_slide03 .slide03_parts02 div:nth-child(2),
  .tumitate_pr_slide03 .slide03_parts02 div:nth-child(3),
  .tumitate_pr_slide03 .slide03_parts02 div:nth-child(4),
  .tumitate_pr_slide03 .slide03_parts02 div:nth-child(5) {
    display: none;
  }
}
.swiper-slide-active .tumitate_pr_slide03 .slide03_parts01 {
  animation: tumitateSlideInTitle 1s cubic-bezier(0.25, 1, 0.5, 1) 0.8s forwards;
}
.swiper-slide-active .tumitate_pr_slide03 .slide03_parts02 div:nth-child(1) {
  animation: tumitateSlideInD 1s cubic-bezier(0.25, 1, 0.5, 1) 2s forwards;
}
.swiper-slide-active .tumitate_pr_slide03 .slide03_parts02 div:nth-child(2) {
  animation: tumitateSlideInD 1s cubic-bezier(0.25, 1, 0.5, 1) 2.2s forwards;
}
.swiper-slide-active .tumitate_pr_slide03 .slide03_parts02 div:nth-child(3) {
  animation: tumitateSlideInD 1s cubic-bezier(0.25, 1, 0.5, 1) 2.4s forwards;
}
.swiper-slide-active .tumitate_pr_slide03 .slide03_parts02 div:nth-child(4) {
  animation: tumitateSlideInD 1s cubic-bezier(0.25, 1, 0.5, 1) 2.6s forwards;
}
.swiper-slide-active .tumitate_pr_slide03 .slide03_parts02 div:nth-child(5) {
  animation: tumitateSlideInD 1s cubic-bezier(0.25, 1, 0.5, 1) 2.8s forwards;
}

/* ==================================================
スライド4
================================================== */
.tumitate_pr_slide04 .slide04_parts01 {
  width: 650px;
  margin: 0 auto 30px auto;
  transform: translateX(-20px);
  opacity: 0;
}
.tumitate_pr_slide04 .slide04_parts02 {
  width: 600px;
  margin: 0 auto;
  display: flex;
}
.tumitate_pr_slide04 .slide04_parts02 > div {
  margin: 0 10px;
}
.tumitate_pr_slide04 .slide04_parts02 > div:nth-child(1) {
  transform: translateX(-10px);
  opacity: 0;
}
.tumitate_pr_slide04 .slide04_parts02 > div:nth-child(2) {
  transform: translateX(10px);
  opacity: 0;
}
.tumitate_pr_slide04 .slide04_parts03 {
  width: 860px;
  margin: 30px auto 0;
}
.tumitate_pr_slide04 .slide04_parts03 .nmlBtn_item {
  transform: translateX(-10px) scale(0.6);
  opacity: 0;
}
.tumitate_pr_slide04 .slide04_parts01 img,
.tumitate_pr_slide04 .slide04_parts02 img {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .tumitate_pr_slide04 .slide04_parts01 {
    width: 90%;
    margin: 0 auto 20px auto;
  }
  .tumitate_pr_slide04 .slide04_parts02 {
    width: 90%;
    flex-direction: column-reverse;
  }
  .tumitate_pr_slide04 .slide04_parts02 > div:nth-child(1) {
    width: 40%;
    margin: -10px auto 0;
  }
  .tumitate_pr_slide04 .slide04_parts03 {
    width: 90%;
  }
}
.swiper-slide-active .tumitate_pr_slide04 .slide04_parts01 {
  animation: tumitateSlideInTitle 1s cubic-bezier(0.25, 1, 0.5, 1) 0.8s forwards;
}
.swiper-slide-active .tumitate_pr_slide04 .slide04_parts02 > div:nth-child(1) {
  animation: tumitateSlideInB 1.5s cubic-bezier(0.25, 1, 0.5, 1) 1.6s forwards;
}
.swiper-slide-active .tumitate_pr_slide04 .slide04_parts02 > div:nth-child(2) {
  animation: tumitateSlideInC 1.5s cubic-bezier(0.25, 1, 0.5, 1) 1.8s forwards;
}
.swiper-slide-active .tumitate_pr_slide04 .slide04_parts03 .nmlBtn_item:nth-child(1) {
  animation: tumitateSlideInA 1.2s cubic-bezier(0.25, 1, 0.5, 1) 2.5s forwards;
}
.swiper-slide-active .tumitate_pr_slide04 .slide04_parts03 .nmlBtn_item:nth-child(2) {
  animation: tumitateSlideInA 1.2s cubic-bezier(0.25, 1, 0.5, 1) 2.7s forwards;
}

/* ==================================================
スライド5
================================================== */
.tumitate_pr_slide05 .slide05_parts01 {
  width: 650px;
  margin: 0 auto 30px auto;
  transform: translateX(-20px);
  opacity: 0;
}
.tumitate_pr_slide05 .slide05_parts02 {
  width: 860px;
  margin: 50px auto 0;
  display: flex;
}
.tumitate_pr_slide05 .slide05_parts02 > div {
  margin: 0 10px;
}
.tumitate_pr_slide05 .slide05_parts02 > div:nth-child(1) {
  transform: translateX(-10px);
  opacity: 0;
}
.tumitate_pr_slide05 .slide05_parts02 > div:nth-child(2) {
  transform: translateX(10px);
  opacity: 0;
}
.tumitate_pr_slide05 .slide05_parts03 {
  width: 860px;
  margin: 30px auto 0;
}
.tumitate_pr_slide05 .slide05_parts03 .nmlBtn_item {
  transform: translateX(-10px) scale(0.6);
  opacity: 0;
}
.tumitate_pr_slide05 .slide05_parts01 img,
.tumitate_pr_slide05 .slide05_parts02 img {
  width: 100%;
}
@media screen and (max-width: 767px) {
  .tumitate_pr_slide05 .slide05_parts01 {
    width: 85%;
    margin: 0 auto 20px auto;
  }
  .tumitate_pr_slide05 .slide05_parts02 {
    width: 90%;
    margin: 20px auto 0;
    display: block;
  }
  .tumitate_pr_slide05 .slide05_parts02 > div:nth-child(2) {
    margin-top: 10px;
  }
  .tumitate_pr_slide05 .slide05_parts03 {
    width: 90%;
    margin-top: 12px;
  }
}
.swiper-slide-active .tumitate_pr_slide05 .slide05_parts01 {
  animation: tumitateSlideInTitle 1s cubic-bezier(0.25, 1, 0.5, 1) 0.8s forwards;
}
.swiper-slide-active .tumitate_pr_slide05 .slide05_parts02 > div:nth-child(1) {
  animation: tumitateSlideInB 1.5s cubic-bezier(0.25, 1, 0.5, 1) 1.6s forwards;
}
.swiper-slide-active .tumitate_pr_slide05 .slide05_parts02 > div:nth-child(2) {
  animation: tumitateSlideInC 1.5s cubic-bezier(0.25, 1, 0.5, 1) 1.8s forwards;
}
.swiper-slide-active .tumitate_pr_slide05 .slide05_parts03 .nmlBtn_item:nth-child(1) {
  animation: tumitateSlideInA 1.2s cubic-bezier(0.25, 1, 0.5, 1) 2.5s forwards;
}
.swiper-slide-active .tumitate_pr_slide05 .slide05_parts03 .nmlBtn_item:nth-child(2) {
  animation: tumitateSlideInA 1.2s cubic-bezier(0.25, 1, 0.5, 1) 2.7s forwards;
}

/* ==================================================
キーフレーム
================================================== */
@keyframes tumitateSlideInA {
  0%   { transform: translateY(10px) scale(0.6); opacity: 0; }
  100% { transform: translateY(0) scale(1); }
  70%, 100% { opacity: 1; }
}
@keyframes tumitateSlideInB {
  0%   { transform: translateX(-10px); opacity: 0; }
  100% { transform: translateX(0); }
  70%, 100% { opacity: 1; }
}
@keyframes tumitateSlideInC {
  0%   { transform: translateX(10px); opacity: 0; }
  100% { transform: translateX(0); }
  70%, 100% { opacity: 1; }
}
@keyframes tumitateSlideInTitle {
  0%   { transform: translateX(-20px); opacity: 0; }
  100% { transform: translateX(0); }
  70%, 100% { opacity: 1; }
}
@keyframes tumitateSlideInD {
  0%        { opacity: 0; }
  70%, 100% { opacity: 1; }
}

/* ==================================================
一度アニメーションが完走したスライドはアニメーションを再実行しない
（animation 系のセレクタは specificity が高いので !important で確実に上書き）
================================================== */
.swiper-slide.is-viewed h3,
.swiper-slide.is-viewed [class*="parts"],
.swiper-slide.is-viewed [class*="parts"] > div,
.swiper-slide.is-viewed .nmlBtn_item {
  opacity: 1 !important;
  transform: none !important;
  animation: none !important;
}


/* ==================================================
PIP-Maker埋め込み（SP時のはみ出し対策・現行サイトの対処を踏襲）
================================================== */
#pipmakerw4r4,
#pipmaker4bg9 {
  margin: 0 auto;
}
@media screen and (max-width: 767px) {
  #pipmakerw4r4,
  #pipmaker4bg9 {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 512 / 384;
  }
}
