.cv-btn-area {
  display: flex;
  gap: min(1.5vw, 20px);
}
.cv-btn-area_s p {
  font-size: clamp(0.6875rem, 1.5625vw, 0.875rem) !important;
  font-weight: 700;
  margin-bottom: 5px;
  text-align: center;
  letter-spacing: 0;
}
.cv-btn-area_m p {
  font-size: clamp(0.75rem, 2.2135416667vw, 1.375rem) !important;
  font-weight: 700;
  margin-bottom: 5px;
  text-align: center;
  letter-spacing: 0;
}
.cv-btn-area_l p {
  font-size: clamp(1.125rem, 2.8645833333vw, 1.75rem) !important;
  font-weight: 700;
  margin-bottom: 5px;
  text-align: center;
}
.cv-btn-area a:hover {
  opacity: 1 !important;
}

.cv-btn a {
  text-decoration: none !important;
  opacity: 1;
}

.btn {
  display: block;
}

.btn-primary {
  background: #004098;
  border: 2px solid #004098;
  box-sizing: border-box;
  color: #fff;
}
.btn-primary:hover {
  background: #fff;
  color: #004098;
}

.btn-primary-block .btn-primary,
.btn-primary-block a {
  background: #004098;
  border: 2px solid #004098;
  box-sizing: border-box;
  color: #fff;
}
.btn-primary-block .btn-primary:hover,
.btn-primary-block a:hover {
  background: #fff;
  color: #004098;
}

.btn-navy-block .btn-navy,
.btn-navy-block a {
  background: #151F41;
  border: 2px solid #151F41;
  box-sizing: border-box;
  color: #fff;
}
.btn-navy-block .btn-navy:hover,
.btn-navy-block a:hover {
  background: #fff;
  color: #151F41;
}

.btn-yellow-block .btn-yellow,
.btn-yellow-block a {
  background: #FFE200;
  border: 2px solid #FFE200;
  box-sizing: border-box;
  color: #151F41;
}
.btn-yellow-block .btn-yellow:hover,
.btn-yellow-block a:hover {
  background: #fff;
}

.btn-white-block .btn-white,
.btn-white-block a {
  background: #fff;
  border: 2px solid #fff;
  box-sizing: border-box;
  color: #151F41;
}
.btn-white-block .btn-white:hover,
.btn-white-block a:hover {
  background: #FFE200;
  color: #151F41;
}

.btn-border-primary {
  border: 2px solid #004098;
  background: #fff;
  color: #004098;
}
.btn-border-primary:hover {
  background: #004098;
  color: #fff;
}

.btn-border-navy-block .btn-border-navy,
.btn-border-navy-block a {
  background: #fff;
  border: 2px solid #151F41;
  box-sizing: border-box;
  color: #151F41;
}
.btn-border-navy-block .btn-border-navy:hover,
.btn-border-navy-block a:hover {
  background: #151F41;
  color: #fff;
}

.txt30-btn .btn-primary,
.txt30-btn .btn-navy,
.txt30-btn .btn-border-primary,
.txt30-btn .btn-navy-block a {
  border-width: 2px !important;
}
.txt30-btn a {
  padding: min(2vw, 20px);
  font-size: clamp(1.0625rem, 2.6041666667vw, 1.75rem);
  border-radius: 100px;
}
@media screen and (max-width: 780px) {
  .txt30-btn a {
    width: 100%;
    letter-spacing: 0;
  }
}

.txt20-btn a {
  padding: min(2vw, 18px);
  font-size: clamp(1rem, 2.34375vw, 1.25rem);
  border-radius: 100px;
}

.more-btn {
  max-width: 350px;
  width: 70%;
}
.more-btn a {
  display: block;
  padding: min(2.66666vw, 18px) 0;
  font-size: clamp(0.875rem, 1.953125vw, 1rem);
  border-radius: 100px;
}

.wp-container-core-buttons-layout-1.wp-container-core-buttons-layout-1 {
  display: flex;
}

.wp-block-button a.wp-block-button__link {
  text-decoration: none !important;
}

.w225 {
  max-width: 225px;
  width: 50%;
}

.w420 {
  max-width: 420px;
  width: 50%;
}

.w100p {
  width: 100%;
}

/*----------------------------------------


section


----------------------------------------*/
article {
  position: relative;
  overflow: hidden;
}
@media screen and (max-width: 780px) {
  article .inner {
    width: 100%;
  }
}
article .sub-title {
  font-size: clamp(1.1875rem, 3.515625vw, 3rem);
}

.cv-area.pad {
  padding: min(7vw, 70px) 0;
}
@media screen and (max-width: 780px) {
  .cv-area.pad {
    padding: 10vw 0;
  }
}

.top {
  /*----------------------------------------


  .hero-area


  ----------------------------------------*/
  /*----------------------------------------


  .client-area


  ----------------------------------------*/
  /*----------------------------------------


  .feature-area


  ----------------------------------------*/
  /*----------------------------------------


  .wallet-area


  ----------------------------------------*/
}
.top h1,
.top h2,
.top h3,
.top h4,
.top h5,
.top h6 {
  font-weight: 700;
  line-height: 1.6;
}
.top .div-pad {
  padding: min(8vw, 90px) 0;
}
@media screen and (max-width: 780px) {
  .top .div-pad {
    padding: 13vw 0;
  }
}
.top .sec-pad {
  padding: min(15vw, 150px) 0;
}
.top .sec-pad_t {
  padding-top: min(15vw, 150px);
}
.top .hero-area {
  position: relative;
  max-width: 2000px;
  margin: min(3vw, 30px) auto 0;
}
@media screen and (max-width: 780px) {
  .top .hero-area {
    min-height: auto;
    margin: 8vw auto 5.3333vw;
  }
}
.top .hero-area .inner {
  position: relative;
  width: 90%;
  transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s;
}
@media screen and (max-width: 2000px) {
  .top .hero-area .inner {
    width: 100%;
  }
}
.top .hero-area .inner .obj {
  position: absolute;
  width: min(60vw, 755px);
  z-index: 3;
  bottom: max(-5vw, -50px);
  left: 50%;
  transform: translateX(-50%);
  margin-left: 5%;
  aspect-ratio: 1400/928;
  z-index: 100;
}
@media screen and (max-width: 1700px) {
  .top .hero-area .inner .obj {
    margin-left: 15%;
  }
}
@media screen and (max-width: 1400px) {
  .top .hero-area .inner .obj {
    margin-left: 35%;
  }
}
@media screen and (max-width: 780px) {
  .top .hero-area .inner .obj {
    bottom: auto;
    top: 46.6666vw;
    width: 65vw;
  }
}
.top .hero-area .inner .obj picture {
  height: 100%;
}
.top .hero-area .inner .obj picture img {
  width: 100%;
  height: 100%;
}
.top .hero-area .txt-area {
  position: relative;
  height: 85vh;
  min-height: 700px;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  z-index: 1;
  left: 3%;
  transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s;
}
@media screen and (max-width: 2000px) {
  .top .hero-area .txt-area {
    left: 1.5%;
  }
}
@media screen and (max-width: 1399px) {
  .top .hero-area .txt-area {
    left: 0;
  }
}
@media screen and (max-width: 991px) {
  .top .hero-area .txt-area {
    min-height: 60vw;
    height: 60vh;
    margin-top: 10vw;
  }
}
@media screen and (max-width: 780px) {
  .top .hero-area .txt-area {
    height: auto;
    margin-top: 70vw;
    min-height: auto;
  }
}
.top .hero-area .txt-area .txt {
  width: 100%;
}
.top .hero-area .txt-area h2.title {
  font-size: clamp(1.5rem, 4.6875vw, 4.5rem);
  margin-bottom: min(4vw, 55px);
}
.top .hero-area .txt-area p {
  font-size: clamp(0.875rem, 1.953125vw, 1.125rem);
  color: #151F41;
  line-height: 2;
  letter-spacing: 0;
}
.top .hero-area .txt-area .cach {
  font-size: clamp(1rem, 2.34375vw, 1.25rem);
  font-weight: 700;
  color: #151F41;
  margin-bottom: 0;
}
.top .hero-area .txt-area .cv-btn {
  margin-top: min(8vw, 55px);
}
.top .hero-area .fv-slider {
  position: absolute;
  right: 0;
  width: 80%;
  max-width: 1200px;
  z-index: 0;
  transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s;
}
@media screen and (max-width: 1600px) {
  .top .hero-area .fv-slider {
    right: -5vw;
  }
}
@media screen and (max-width: 1199px) {
  .top .hero-area .fv-slider {
    right: -15vw;
    width: 800px;
  }
}
@media screen and (max-width: 991px) {
  .top .hero-area .fv-slider {
    top: 0;
    right: -15vw;
    width: 85vw;
  }
}
@media screen and (max-width: 780px) {
  .top .hero-area .fv-slider {
    top: 0;
    right: auto;
    width: 120%;
    left: -10%;
  }
}
.top .hero-area .fv-slider .swiper-slide {
  position: relative;
}
.top .hero-area .fv-slider .swiper-slide .ico {
  position: absolute;
  width: min(2vw, 22px);
  opacity: 0;
  animation: floating-y 0.9s ease-in-out infinite alternate-reverse;
}
@media screen and (max-width: 780px) {
  .top .hero-area .fv-slider .swiper-slide .ico {
    width: 2.6666vw;
  }
}
.top .hero-area .fv-slider .swiper-slide .ico .hukidashi {
  position: absolute;
  width: 80%;
  left: 10%;
  top: -30px;
  animation: floating-y_s 0.5s ease-in-out infinite alternate-reverse;
}
@media screen and (max-width: 780px) {
  .top .hero-area .fv-slider .swiper-slide .ico .hukidashi {
    top: -3vw;
  }
}
.top .hero-area .fv-slider .swiper-slide .ico .hukidashi img {
  width: 10%;
  display: block;
  opacity: 0;
  transform: translateY(50px);
  transition: 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  transition-delay: 1.6s;
}
.top .hero-area .fv-slider .swiper-slide .ico .cube {
  opacity: 0;
  width: 100%;
  transform: translateY(50px) scale(0.8);
  transition: 0.6s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.top .hero-area .fv-slider .swiper-slide.slide01 .ico01, .top .hero-area .fv-slider .swiper-slide.slide04 .ico01 {
  top: 40%;
  left: 50%;
}
.top .hero-area .fv-slider .swiper-slide.slide01 .ico01 .cube, .top .hero-area .fv-slider .swiper-slide.slide04 .ico01 .cube {
  transform: translateY(50px) scale(0.8) rotate(-50deg);
  transition-delay: 0.8s;
}
.top .hero-area .fv-slider .swiper-slide.slide01 .ico02, .top .hero-area .fv-slider .swiper-slide.slide04 .ico02 {
  top: 13%;
  left: 35%;
}
.top .hero-area .fv-slider .swiper-slide.slide01 .ico02 .cube, .top .hero-area .fv-slider .swiper-slide.slide04 .ico02 .cube {
  transform: translateY(50px) scale(0.8) rotate(-180deg);
  transition-delay: 0.9s;
}
.top .hero-area .fv-slider .swiper-slide.slide01 .ico03, .top .hero-area .fv-slider .swiper-slide.slide04 .ico03 {
  top: 20%;
  right: 30%;
}
.top .hero-area .fv-slider .swiper-slide.slide01 .ico03 .cube, .top .hero-area .fv-slider .swiper-slide.slide04 .ico03 .cube {
  transform: translateY(50px) scale(0.8) rotate(-230deg);
  transition-delay: 1.1s;
}
.top .hero-area .fv-slider .swiper-slide.slide01 .ico04, .top .hero-area .fv-slider .swiper-slide.slide04 .ico04 {
  top: 42%;
  left: 80%;
}
.top .hero-area .fv-slider .swiper-slide.slide01 .ico04 .cube, .top .hero-area .fv-slider .swiper-slide.slide04 .ico04 .cube {
  transform: translateY(50px) scale(0.8) rotate(0deg);
  transition-delay: 1s;
}
.top .hero-area .fv-slider .swiper-slide.slide01 .ico05, .top .hero-area .fv-slider .swiper-slide.slide04 .ico05 {
  top: 70%;
  right: 22%;
}
.top .hero-area .fv-slider .swiper-slide.slide01 .ico05 .cube, .top .hero-area .fv-slider .swiper-slide.slide04 .ico05 .cube {
  transform: translateY(50px) scale(0.8) rotate(-100deg);
  transition-delay: 1s;
}
.top .hero-area .fv-slider .swiper-slide.slide02 .ico01, .top .hero-area .fv-slider .swiper-slide.slide05 .ico01 {
  top: 20%;
  left: 15%;
}
.top .hero-area .fv-slider .swiper-slide.slide02 .ico01 .cube, .top .hero-area .fv-slider .swiper-slide.slide05 .ico01 .cube {
  transform: translateY(50px) scale(0.8) rotate(-20deg);
  transition-delay: 1.4s;
}
.top .hero-area .fv-slider .swiper-slide.slide02 .ico02, .top .hero-area .fv-slider .swiper-slide.slide05 .ico02 {
  top: 15%;
  left: 55%;
}
.top .hero-area .fv-slider .swiper-slide.slide02 .ico02 .cube, .top .hero-area .fv-slider .swiper-slide.slide05 .ico02 .cube {
  transform: translateY(50px) scale(0.8) rotate(-90deg);
  transition-delay: 1.2s;
}
.top .hero-area .fv-slider .swiper-slide.slide02 .ico03, .top .hero-area .fv-slider .swiper-slide.slide05 .ico03 {
  top: 35%;
  right: 15%;
}
.top .hero-area .fv-slider .swiper-slide.slide02 .ico03 .cube, .top .hero-area .fv-slider .swiper-slide.slide05 .ico03 .cube {
  transform: translateY(50px) scale(0.8) rotate(-72deg);
  transition-delay: 0.9s;
}
.top .hero-area .fv-slider .swiper-slide.slide02 .ico04, .top .hero-area .fv-slider .swiper-slide.slide05 .ico04 {
  top: 42%;
  left: 46%;
  transition-delay: 0.7s;
}
.top .hero-area .fv-slider .swiper-slide.slide02 .ico05, .top .hero-area .fv-slider .swiper-slide.slide05 .ico05 {
  top: 70%;
  left: 22%;
}
.top .hero-area .fv-slider .swiper-slide.slide02 .ico05 .cube, .top .hero-area .fv-slider .swiper-slide.slide05 .ico05 .cube {
  transform: translateY(50px) scale(0.8) rotate(50deg);
  transition-delay: 1.25s;
}
.top .hero-area .fv-slider .swiper-slide.slide03 .ico01, .top .hero-area .fv-slider .swiper-slide.slide06 .ico01 {
  top: 35%;
  right: 70%;
}
.top .hero-area .fv-slider .swiper-slide.slide03 .ico01 .cube, .top .hero-area .fv-slider .swiper-slide.slide06 .ico01 .cube {
  transform: translateY(50px) scale(0.8) rotate(-190deg);
  transition-delay: 1.3s;
}
.top .hero-area .fv-slider .swiper-slide.slide03 .ico02, .top .hero-area .fv-slider .swiper-slide.slide06 .ico02 {
  top: 22%;
  left: 20%;
}
.top .hero-area .fv-slider .swiper-slide.slide03 .ico02 .cube, .top .hero-area .fv-slider .swiper-slide.slide06 .ico02 .cube {
  transform: translateY(50px) scale(0.8) rotate(-90deg);
  transition-delay: 1.2s;
}
.top .hero-area .fv-slider .swiper-slide.slide03 .ico03, .top .hero-area .fv-slider .swiper-slide.slide06 .ico03 {
  top: 15%;
  right: 20%;
}
.top .hero-area .fv-slider .swiper-slide.slide03 .ico03 .cube, .top .hero-area .fv-slider .swiper-slide.slide06 .ico03 .cube {
  transform: translateY(50px) scale(0.8) rotate(-66deg);
  transition-delay: 1.1s;
}
.top .hero-area .fv-slider .swiper-slide.slide03 .ico04, .top .hero-area .fv-slider .swiper-slide.slide06 .ico04 {
  top: 42%;
  left: 60%;
}
.top .hero-area .fv-slider .swiper-slide.slide03 .ico04 .cube, .top .hero-area .fv-slider .swiper-slide.slide06 .ico04 .cube {
  transform: translateY(50px) scale(0.8) rotate(22deg);
  transition-delay: 0.8s;
}
.top .hero-area .fv-slider .swiper-slide.slide03 .ico05, .top .hero-area .fv-slider .swiper-slide.slide06 .ico05 {
  top: 65%;
  right: 12%;
}
.top .hero-area .fv-slider .swiper-slide.slide03 .ico05 .cube, .top .hero-area .fv-slider .swiper-slide.slide06 .ico05 .cube {
  transform: translateY(50px) scale(0.8) rotate(-10deg);
  transition-delay: 0.9s;
}
.top .hero-area .fv-slider .swiper-slide-active .ico {
  opacity: 1;
}
.top .hero-area .fv-slider .swiper-slide-active .ico .hukidashi {
  width: 80%;
  margin: 0 auto 2px;
}
.top .hero-area .fv-slider .swiper-slide-active .ico .hukidashi img {
  width: 100%;
  display: block;
  opacity: 1;
  transform: translateY(0);
}
.top .hero-area .fv-slider .swiper-slide-active .ico .cube {
  opacity: 1;
  width: 100%;
  transform: translateY(0) scale(1);
}
.top .hero-area .fv-slider .swiper-slide-active.slide01 .ico01 .cube, .top .hero-area .fv-slider .swiper-slide-active.slide04 .ico01 .cube {
  transform: translateY(0) scale(1) rotate(-50deg);
}
.top .hero-area .fv-slider .swiper-slide-active.slide01 .ico02 .cube, .top .hero-area .fv-slider .swiper-slide-active.slide04 .ico02 .cube {
  transform: translateY(0) scale(1) rotate(-180deg);
}
.top .hero-area .fv-slider .swiper-slide-active.slide01 .ico03 .cube, .top .hero-area .fv-slider .swiper-slide-active.slide04 .ico03 .cube {
  transform: translateY(0) scale(1) rotate(-230deg);
}
.top .hero-area .fv-slider .swiper-slide-active.slide01 .ico04 .cube, .top .hero-area .fv-slider .swiper-slide-active.slide04 .ico04 .cube {
  transform: translateY(0) scale(1) rotate(0);
}
.top .hero-area .fv-slider .swiper-slide-active.slide01 .ico05 .cube, .top .hero-area .fv-slider .swiper-slide-active.slide04 .ico05 .cube {
  transform: translateY(0) scale(1) rotate(100deg);
}
.top .hero-area .fv-slider .swiper-slide-active.slide02 .ico01 .cube, .top .hero-area .fv-slider .swiper-slide-active.slide05 .ico01 .cube {
  transform: translateY(0) scale(1) rotate(-20deg);
}
.top .hero-area .fv-slider .swiper-slide-active.slide02 .ico02 .cube, .top .hero-area .fv-slider .swiper-slide-active.slide05 .ico02 .cube {
  transform: translateY(0) scale(1) rotate(-90deg);
}
.top .hero-area .fv-slider .swiper-slide-active.slide02 .ico03 .cube, .top .hero-area .fv-slider .swiper-slide-active.slide05 .ico03 .cube {
  transform: translateY(0) scale(1) rotate(-72deg);
}
.top .hero-area .fv-slider .swiper-slide-active.slide02 .ico04 .cube, .top .hero-area .fv-slider .swiper-slide-active.slide05 .ico04 .cube {
  transform: translateY(0) scale(1) rotate(0);
}
.top .hero-area .fv-slider .swiper-slide-active.slide02 .ico05 .cube, .top .hero-area .fv-slider .swiper-slide-active.slide05 .ico05 .cube {
  transform: translateY(0) scale(1) rotate(-50deg);
}
.top .hero-area .fv-slider .swiper-slide-active.slide03 .ico01 .cube, .top .hero-area .fv-slider .swiper-slide-active.slide06 .ico01 .cube {
  transform: translateY(0) scale(1) rotate(-190deg);
}
.top .hero-area .fv-slider .swiper-slide-active.slide03 .ico02 .cube, .top .hero-area .fv-slider .swiper-slide-active.slide06 .ico02 .cube {
  transform: translateY(0) scale(1) rotate(-90deg);
}
.top .hero-area .fv-slider .swiper-slide-active.slide03 .ico03 .cube, .top .hero-area .fv-slider .swiper-slide-active.slide06 .ico03 .cube {
  transform: translateY(0) scale(1) rotate(-66deg);
}
.top .hero-area .fv-slider .swiper-slide-active.slide03 .ico04 .cube, .top .hero-area .fv-slider .swiper-slide-active.slide06 .ico04 .cube {
  transform: translateY(0) scale(1) rotate(22deg);
}
.top .hero-area .fv-slider .swiper-slide-active.slide03 .ico05 .cube, .top .hero-area .fv-slider .swiper-slide-active.slide06 .ico05 .cube {
  transform: translateY(0) scale(1) rotate(-10deg);
}
.top .client-area {
  padding: min(6vw, 60px) 0;
}
@media screen and (max-width: 780px) {
  .top .client-area {
    padding: 13vw 0;
  }
}
.top .client-area .client-slider .swiper-wrapper {
  transition-timing-function: linear;
}
.top .client-area .client-slider .swiper-wrapper .swiper-slide {
  padding: 0 min(2vw, 20px);
  text-align: center;
  height: 100px;
  width: auto;
}
@media screen and (max-width: 780px) {
  .top .client-area .client-slider .swiper-wrapper .swiper-slide {
    padding: 3vw;
    height: 16vw;
  }
}
.top .client-area .client-slider .swiper-wrapper .swiper-slide img {
  height: 100%;
  object-fit: cover;
}
.top .feature-area {
  overflow: hidden;
}
.top .feature-area .inner {
  position: relative;
  max-width: 1400px;
}
.top .feature-area .inner .txt-area {
  position: relative;
  max-width: 540px;
  aspect-ratio: 1/1.1;
  z-index: 2;
}
@media screen and (max-width: 780px) {
  .top .feature-area .inner .txt-area {
    aspect-ratio: auto;
    margin-top: -4vw;
  }
}
.top .feature-area .inner .txt-area h3.sub-title {
  margin-bottom: min(5.33333vw, 55px);
}
.top .feature-area .inner .txt-area p {
  font-size: clamp(0.875rem, 1.953125vw, 1.125rem);
}
.top .feature-area .inner .txt-area .cv-btn {
  margin-top: min(6.666vw, 55px);
}
.top .feature-area .inner .txt-area .cv-btn p {
  letter-spacing: 0;
}
@media screen and (max-width: 780px) {
  .top .feature-matome-area {
    padding: 20vw 0;
  }
}
.top .feature-matome-area .ph-area {
  position: absolute;
  left: 50%;
  width: 50%;
  top: max(-5vw, -80px);
  max-width: 725px;
  transition: cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.2s;
}
@media screen and (max-width: 780px) {
  .top .feature-matome-area .ph-area {
    top: -24vw;
    width: 50%;
    left: 50%;
  }
}
.top .feature-matome-area .ph-area .obj-area {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.top .feature-matome-area .ph-area .obj-area .obj {
  position: absolute;
  animation: floating-y_l 1.5s ease-in-out infinite alternate-reverse;
}
.top .feature-matome-area .ph-area .obj-area .obj img {
  display: block;
}
.top .feature-matome-area .ph-area .obj-area .obj.obj01 {
  top: 12.26%;
  left: 13.9%;
  width: 11.47%;
  animation-delay: 0.4s;
}
.top .feature-matome-area .ph-area .obj-area .obj.obj02 {
  top: 5%;
  left: 38.1%;
  width: 12.86%;
}
.top .feature-matome-area .ph-area .obj-area .obj.obj03 {
  top: 8.3%;
  right: 16.9%;
  width: 12.51%;
  animation-delay: 0.5s;
}
.top .feature-matome-area .ph-area .obj-area .obj.obj04 {
  top: 25.39%;
  right: 7.6%;
  width: 4.5%;
  animation-delay: 0.15s;
}
.top .feature-matome-area .ph-area .obj-area .obj.obj05 {
  top: 36.77%;
  right: 0;
  width: 14.46%;
  animation-delay: 0.6s;
}
.top .feature-matome-area .ph-area .obj-area .obj.obj06 {
  top: 53.67%;
  right: 13.2%;
  width: 8.9%;
}
.top .feature-matome-area .ph-area .obj-area .obj.obj07 {
  top: 70%;
  right: 13.2%;
  width: 4.86%;
  animation-delay: 0.2s;
}
.top .feature-matome-area .ph-area .obj-area .obj.obj08 {
  top: 75.3%;
  right: 24%;
  width: 18.42%;
  animation-delay: 0.15s;
}
.top .feature-matome-area .ph-area .obj-area .obj.obj09 {
  bottom: 0;
  left: 32.19%;
  width: 11.12%;
}
.top .feature-matome-area .ph-area .obj-area .obj.obj10 {
  top: 66.97%;
  left: 0;
  width: 8.2%;
  animation-delay: 0.3s;
}
.top .feature-matome-area .ph-area .obj-area .obj.obj11 {
  top: 30.64%;
  left: 3%;
  width: 4.7%;
  animation-delay: 0.7s;
}
.top .feature-matome-area .ph-area .obj-area .obj.obj12 {
  left: 5%;
  top: 44.3%;
  width: 7.85%;
  mix-blend-mode: overlay;
}
.top .feature-matome-area .ph-area .obj-area .obj.obj13 {
  top: 0;
  left: 58.54%;
  width: 8.2%;
  mix-blend-mode: overlay;
  animation-delay: 0.1s;
}
.top .feature-matome-area .ph-area .obj-area .obj.obj14 {
  bottom: 3%;
  left: 11.77%;
  width: 13.63%;
  mix-blend-mode: overlay;
  animation-delay: 0.12s;
}
.top .feature-matome-area .ph-area .obj-area .obj.obj15 {
  bottom: 7%;
  left: 22.8%;
  width: 3.78%;
  animation-delay: 0.2s;
}
.top .feature-matome-area .ph-area .obj-area .obj.obj16 {
  top: 80.3%;
  right: 47.5%;
  width: 3.78%;
}
.top .feature-matome-area .ph-area .obj-area .ico {
  position: absolute;
  opacity: 0;
  transform: translateY(100px);
  transition: 1s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}
.top .feature-matome-area .ph-area .obj-area .ico img {
  display: block;
  animation: floating-y_l 1s ease-in-out infinite alternate-reverse;
}
.top .feature-matome-area .ph-area .obj-area .ico01 {
  top: 12.95%;
  left: 60.15%;
  width: 3.19%;
  transition-delay: 0.2s;
}
.top .feature-matome-area .ph-area .obj-area .ico01 .cube {
  transform: rotate(-80deg);
}
.top .feature-matome-area .ph-area .obj-area .ico01 img {
  animation-delay: 0.2s;
}
.top .feature-matome-area .ph-area .obj-area .ico02 {
  top: 22.76%;
  left: 32.33%;
  width: 4.5%;
  transition-delay: 0.1s;
}
.top .feature-matome-area .ph-area .obj-area .ico02 .cube {
  transform: rotate(-140deg);
}
.top .feature-matome-area .ph-area .obj-area .ico02 img {
  animation-delay: 0.15s;
}
.top .feature-matome-area .ph-area .obj-area .ico03 {
  top: 38.96%;
  right: 33.64%;
  width: 5.9%;
}
.top .feature-matome-area .ph-area .obj-area .ico03 .cube {
  transform: rotate(-190deg);
}
.top .feature-matome-area .ph-area .obj-area .ico03 img {
  animation-delay: 0.1s;
}
.top .feature-matome-area .ph-area .obj-area .ico04 {
  left: 15.9%;
  bottom: 24.5%;
  width: 4.8%;
  transition-delay: 0.1 0.2s;
}
.top .feature-matome-area .ph-area .obj-area .ico04 .cube {
  transform: rotate(-20deg);
}
.top .feature-matome-area .ph-area .obj-area.active .ico {
  position: absolute;
  opacity: 1;
  transform: translateY(0);
}
.top .feature-earth-area {
  position: relative;
}
@media screen and (max-width: 780px) {
  .top .feature-earth-area {
    padding-bottom: 15vw;
  }
}
.top .feature-earth-area .ph-area {
  position: absolute;
  right: 45%;
  width: 1580px;
  top: max(-30vw, -300px);
}
@media screen and (max-width: 1400px) {
  .top .feature-earth-area .ph-area {
    width: 120%;
    right: 40%;
  }
}
@media screen and (max-width: 780px) {
  .top .feature-earth-area .ph-area {
    width: 100vw;
    right: 35%;
  }
}
.top .feature-earth-area .ph-area .obj-area {
  position: absolute;
  width: 50%;
  height: 60%;
  bottom: 0;
  transform: translate(-50%, 0);
  left: 50%;
}
.top .feature-earth-area .ph-area .obj-area .obj {
  position: absolute;
  opacity: 0;
}
.top .feature-earth-area .ph-area .obj-area .obj img {
  display: block;
}
.top .feature-earth-area .ph-area .obj-area .obj.obj01 {
  top: 12.26%;
  right: 8%;
  width: 7%;
  animation: swing01 8s ease-in-out infinite;
  transform-origin: center min(20vw, 300px);
}
.top .feature-earth-area .ph-area .obj-area .obj.obj01 img {
  display: block;
  animation: rotate01 8s ease-out forwards infinite;
}
.top .feature-earth-area .ph-area .obj-area .obj.obj02 {
  top: 5%;
  right: 0;
  width: 4%;
  animation: swing01 8s ease-in-out infinite;
  animation-delay: 1.5s;
  transform-origin: center min(15vw, 220px);
}
.top .feature-earth-area .ph-area .obj-area .obj.obj02 img {
  display: block;
  animation: rotate01 8s ease-out forwards;
  animation-delay: 1.5s;
}
.top .feature-earth-area .ph-area .obj-area .obj.obj03 {
  top: -5%;
  right: 15%;
  width: 5%;
  animation: swing01 8s ease-in-out infinite;
  animation-delay: 4.5s;
  transform-origin: center min(30vw, 400px);
}
.top .feature-earth-area .ph-area .obj-area .obj.obj03 img {
  display: block;
  animation: rotate01 8s ease-out forwards;
  animation-delay: 4.5s;
}
.top .feature-earth-area .ph-area .obj-area .obj.obj04 {
  top: 10%;
  right: 20%;
  width: 5%;
  animation: swing01 8s ease-in-out infinite;
  animation-delay: 3s;
  transform-origin: center min(40vw, 480px);
}
.top .feature-earth-area .ph-area .obj-area .obj.obj04 img {
  display: block;
  animation: rotate01 8s ease-out forwards;
  animation-delay: 3s;
}
.top .feature-earth-area .ph-area .obj-area .ico {
  position: absolute;
  opacity: 0;
  transform: translateY(50px);
  transition: 1s cubic-bezier(0.175, 0.885, 0.32, 1.275);
  width: 2.6%;
  animation: obj01 8s infinite;
}
@media screen and (max-width: 780px) {
  .top .feature-earth-area .ph-area .obj-area .ico {
    width: 2vw;
    transform: translateY(3vw);
  }
}
.top .feature-earth-area .ph-area .obj-area .ico .cube {
  transform: rotate(-120deg);
  animation: floating-y 0.9s ease-in-out infinite alternate-reverse;
}
.top .feature-earth-area .ph-area .obj-area .ico .hukidashi {
  animation: floating-y 0.9s ease-in-out infinite alternate-reverse;
  animation-delay: 0.3s;
}
@media screen and (max-width: 780px) {
  .top .feature-earth-area .ph-area .obj-area .ico .hukidashi {
    position: relative;
    top: 3vw;
  }
}
.top .feature-earth-area .ph-area .obj-area .ico01 {
  top: 12.95%;
  right: 30.15%;
}
@media screen and (max-width: 780px) {
  .top .feature-earth-area .ph-area .obj-area .ico01 {
    top: 3.885%;
  }
}
.top .feature-earth-area .ph-area .obj-area .ico02 {
  top: 5%;
  right: 18.15%;
  animation-delay: 1.5s;
}
@media screen and (max-width: 780px) {
  .top .feature-earth-area .ph-area .obj-area .ico02 {
    top: -5vw;
  }
}
.top .feature-earth-area .ph-area .obj-area .ico03 {
  top: -3%;
  right: 43.15%;
  animation-delay: 4.5s;
}
@media screen and (max-width: 780px) {
  .top .feature-earth-area .ph-area .obj-area .ico03 {
    top: -8vw;
  }
}
.top .feature-earth-area .ph-area .obj-area .ico04 {
  top: 15%;
  right: 55.15%;
  animation-delay: 3s;
}
@media screen and (max-width: 780px) {
  .top .feature-earth-area .ph-area .obj-area .ico04 {
    top: 2vw;
    right: 60%;
  }
}
.top .feature-earth-area .txt-area {
  left: 100%;
}
@media screen and (max-width: 780px) {
  .top .feature-earth-area .txt-area {
    left: 0;
    width: 100%;
  }
  .top .feature-earth-area .txt-area h3.sub-title {
    position: relative;
    left: 50vw;
  }
}
.top .wallet-area {
  padding-bottom: min(20vw, 200px);
}
.top .wallet-area .inner {
  position: relative;
  max-width: 1400px;
}
.top .wallet-area .inner h3.sub-title {
  margin-bottom: min(7vw, 90px);
}
.top .wallet-area .inner .row {
  gap: 10px 0;
}
.top .wallet-area .inner .row .c-logo {
  width: 10%;
}
@media screen and (max-width: 1199px) {
  .top .wallet-area .inner .row .c-logo {
    width: 12.5%;
  }
}
@media screen and (max-width: 991px) {
  .top .wallet-area .inner .row .c-logo {
    width: 16.6666%;
  }
}
@media screen and (max-width: 780px) {
  .top .wallet-area .inner .row .c-logo {
    width: 20%;
    padding-left: 1%;
    padding-right: 1%;
  }
}

/*----------------------------------------


.api-reason-area


----------------------------------------*/
.api-reason-area {
  padding-bottom: min(15vw, 150px);
}
.api-reason-area .api-area {
  position: relative;
}
.api-reason-area .api-area .video {
  position: absolute;
  mask-image: linear-gradient(to bottom, transparent, black 10%, black 90%, transparent);
  opacity: 0.4;
  top: 0;
  left: 30%;
}
.api-reason-area .api-area .video video {
  position: relative;
  width: 140%;
  max-width: 2000px;
  filter: blur(1px);
}
@media screen and (max-width: 780px) {
  .api-reason-area .api-area .video video {
    width: 300%;
  }
}
.api-reason-area .api-area .inner {
  position: relative;
  max-width: 1750px;
}
.api-reason-area .api-area .inner .txt-area {
  position: relative;
  top: -60px;
  z-index: 2;
  padding: min(8vw, 140px) min(8vw, 100px);
  border-radius: 0;
  max-width: 700px;
  width: 50%;
  box-sizing: border-box;
  border-radius: 100px 0 100px 0;
}
@media screen and (max-width: 1199px) {
  .api-reason-area .api-area .inner .txt-area {
    width: 60%;
  }
}
@media screen and (max-width: 780px) {
  .api-reason-area .api-area .inner .txt-area {
    border-radius: 10vw 0 10vw 0;
    width: 75%;
    top: -8vw;
  }
}
.api-reason-area .api-area .inner .txt-area h3.sub-title {
  margin-bottom: min(4vw, 55px);
}
.api-reason-area .api-area .txt20-btn {
  max-width: 420px;
  margin: min(3vw, 30px) auto 0;
}
.api-reason-area .reason-area {
  position: relative;
  margin-top: min(15vw, 150px);
}
.api-reason-area .reason-area .inner {
  position: relative;
  max-width: 1400px;
}
.api-reason-area .reason-area .inner h3.sub-title {
  margin-bottom: min(4vw, 55px);
}
.api-reason-area .reason-area .inner .ph {
  position: absolute;
  top: 0;
  right: 0;
  width: calc(50% - min(4vw, 40px));
  background: url(../images/top/reason_ph00.jpg) no-repeat right center/auto 100%;
  aspect-ratio: 62/75;
}
.api-reason-area .reason-area .inner .ph picture {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  transition: cubic-bezier(0.175, 0.885, 0.32, 1.275) 1s;
  display: block;
}
.api-reason-area .reason-area .inner .ph picture.active {
  opacity: 1;
}
@media screen and (max-width: 1199px) {
  .api-reason-area .reason-area .inner .ph {
    right: -10vw;
    width: calc(50% + 10vw);
  }
}
@media screen and (max-width: 780px) {
  .api-reason-area .reason-area .inner .ph {
    display: none;
  }
}
@media screen and (max-width: 780px) {
  .api-reason-area .reason-area .inner .reason-list-area {
    width: 100%;
  }
}
.api-reason-area .reason-area .inner .reason-list-area .reason-list {
  position: relative;
  color: #fff;
  background: #0a3c94;
  padding: min(5vw, 50px) 0;
  transition: cubic-bezier(0.175, 0.885, 0.32, 1.275) 1s;
  margin-bottom: 2px;
  cursor: pointer;
  opacity: 0.5;
}
@media screen and (max-width: 780px) {
  .api-reason-area .reason-area .inner .reason-list-area .reason-list {
    padding: 6.66666vw 0;
  }
}
.api-reason-area .reason-area .inner .reason-list-area .reason-list::before {
  position: absolute;
  content: "";
  border-top: 1px solid #fff;
  width: 30%;
  top: min(6vw, 75px);
  right: 0;
  transition: cubic-bezier(0.175, 0.885, 0.32, 1.275) 1s;
}
@media screen and (max-width: 1199px) {
  .api-reason-area .reason-area .inner .reason-list-area .reason-list::before {
    width: 20%;
  }
}
@media screen and (max-width: 780px) {
  .api-reason-area .reason-area .inner .reason-list-area .reason-list::before {
    top: 11.3333vw;
  }
}
.api-reason-area .reason-area .inner .reason-list-area .reason-list .no {
  position: absolute;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  font-size: clamp(2.5rem, 6.5104166667vw, 3.75rem);
  letter-spacing: 0;
  color: #0e367b;
  display: block;
  transition: cubic-bezier(0.175, 0.885, 0.32, 1.275) 1s;
}
@media (min-width: 781px) and (max-width: 1200px) {
  .api-reason-area .reason-area .inner .reason-list-area .reason-list .no {
    display: none;
  }
}
@media screen and (max-width: 780px) {
  .api-reason-area .reason-area .inner .reason-list-area .reason-list .no {
    top: 0;
    transform: translateY(0);
  }
}
.api-reason-area .reason-area .inner .reason-list-area .reason-list h4 {
  font-size: clamp(1.0625rem, 2.34375vw, 1.375rem);
  padding-left: 100px;
  color: #fff;
  transition: cubic-bezier(0.175, 0.885, 0.32, 1.275) 1s;
}
@media (min-width: 781px) and (max-width: 1200px) {
  .api-reason-area .reason-area .inner .reason-list-area .reason-list h4 {
    padding-left: min(4vw, 40px);
  }
}
@media screen and (max-width: 780px) {
  .api-reason-area .reason-area .inner .reason-list-area .reason-list h4 {
    padding-left: 18.88888vw;
  }
}
.api-reason-area .reason-area .inner .reason-list-area .reason-list .txt {
  visibility: hidden;
  opacity: 0;
  padding: 0 min(6vw, 60px) 0 100px;
  transition: cubic-bezier(0.175, 0.885, 0.32, 1.275) 1s;
  max-height: 0;
}
@media (min-width: 781px) and (max-width: 1200px) {
  .api-reason-area .reason-area .inner .reason-list-area .reason-list .txt {
    padding: 0 min(4vw, 40px);
  }
}
@media screen and (max-width: 780px) {
  .api-reason-area .reason-area .inner .reason-list-area .reason-list .txt {
    padding-left: 18.88888vw;
  }
}
@media screen and (min-width: 781px) {
  .api-reason-area .reason-area .inner .reason-list-area .reason-list .txt figure {
    display: none;
  }
}
@media screen and (max-width: 780px) {
  .api-reason-area .reason-area .inner .reason-list-area .reason-list .txt figure {
    display: block;
  }
}
.api-reason-area .reason-area .inner .reason-list-area .reason-list:hover {
  padding: min(4vw, 40px) 0;
  opacity: 1;
  border-radius: min(10vw, 100px) 0 min(10vw, 100px) 0;
}
@media screen and (max-width: 780px) {
  .api-reason-area .reason-area .inner .reason-list-area .reason-list:hover {
    padding: 6.66666vw 0;
  }
}
.api-reason-area .reason-area .inner .reason-list-area .reason-list:hover::before {
  width: 0;
}
.api-reason-area .reason-area .inner .reason-list-area .reason-list:hover .no {
  color: #fff;
}
.api-reason-area .reason-area .inner .reason-list-area .reason-list:hover h4 {
  color: #FFE200;
}
.api-reason-area .reason-area .inner .reason-list-area .reason-list:hover .txt {
  visibility: visible;
  opacity: 1;
  max-height: 300px;
}
@media screen and (max-width: 780px) {
  .api-reason-area .reason-area .inner .reason-list-area .reason-list:hover .txt {
    max-height: 200vw;
  }
}

@keyframes slide {
  0% {
    height: 0;
  }
  100% {
    height: 100%;
  }
}/*# sourceMappingURL=top.css.map */