@charset "UTF-8";
/* フェードアップアニメーション */
.fade-up {
  opacity: 0;
  transform: translateY(50px); /* 50px下から開始 */
  transition: opacity 0.8s ease-out, transform 0.8s ease-out;
  will-change: opacity, transform;
}

/* JSでこのクラスが付与された時に表示される */
.fade-up.is-visible {
  opacity: 1;
  transform: translateY(0);
}

.body {
  background-image: url(../images/bg.gif);
}

.wrapper {
  background-color: #fff;
  max-width: 750px;
  margin: 0 auto;
}

.section {
  position: relative;
}

.section-content {
  position: absolute;
  inset: 0;
  height: -moz-fit-content;
  height: fit-content;
  z-index: 1;
  overflow-x: clip;
}

.bg {
  overflow: hidden;
}

.btn-cv-fixd {
  position: fixed;
  bottom: min(100px, 13.333vw);
  right: 50%;
  transform: translateX(min(375px, 50vw));
  z-index: 100;
  width: min(93px, 12.4vw);
}

.kv .section-content {
  margin-top: min(120px, 16vw);
}
.kv .section-content h1 {
  width: min(496px, 66.133vw);
  margin: 0 auto;
}
.kv .section-content figure {
  width: min(640px, 85.333vw);
  margin: min(5px, 0.667vw) auto 0;
}
.kv .section-content p {
  width: min(581px, 77.467vw);
  margin: max(-20px, -2.667vw) auto 0;
}
.kv .section-content ul {
  width: min(586px, 78.133vw);
  display: grid;
}

.about .about-copy-cont {
  margin-top: min(54px, 7.2vw);
  position: relative;
}
.about .about-copy-cont p {
  width: min(676px, 90.133vw);
  margin: 0 auto;
}
.about .about-copy-cont figure {
  position: absolute;
  right: 0;
  bottom: min(12px, 1.6vw);
  width: min(239px, 31.867vw);
}
.about ul {
  width: min(524px, 69.867vw);
  display: grid;
  margin: min(50px, 6.667vw) auto 0;
  gap: min(15px, 2vw);
}
.about ul li {
  width: 100%;
  height: min(100px, 13.333vw);
  background-color: #fff;
  border-radius: min(9px, 1.2vw);
  display: grid;
  place-items: center;
  position: relative;
}
.about ul li img {
  width: min(442px, 58.933vw);
}
.about h2 {
  width: min(780px, 104vw);
  margin-left: max(-21px, -2.8vw);
  margin-top: min(10px, 1.333vw);
  display: flex;
  position: relative;
  justify-content: center;
}
.about h2 a {
  width: min(517px, 68.933vw);
  position: absolute;
  bottom: min(13px, 1.733vw);
  right: min(33px, 4.4vw);
}

.worry {
  margin-top: max(-186px, -24.8vw);
}
.worry .drop-shadow {
  filter: drop-shadow(5px 5px 7px rgba(0, 123, 167, 0.3));
}
.worry h2 {
  width: min(750px, 100vw);
  margin-left: min(5px, 0.667vw);
}
.worry ol {
  background-color: #fff;
  width: min(676px, 90.133vw);
  padding-left: min(30px, 4vw);
  margin: 0 auto;
  border-radius: 0 0 min(10px, 1.333vw) min(10px, 1.333vw);
}
.worry ol li {
  padding-block: min(33px, 4.4vw);
  position: relative;
}
.worry ol li img {
  margin-right: auto;
}
.worry ol li img.worry-1 {
  width: min(595px, 79.333vw);
}
.worry ol li img.worry-2 {
  width: min(622px, 82.933vw);
}
.worry ol li img.worry-3 {
  width: min(628px, 83.733vw);
}
.worry ol li::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: max(-14px, -1.867vw);
  display: block;
  height: min(2px, 0.267vw);
  width: min(644px, 85.867vw);
  background-color: #e6e6e6;
}
.worry ol li:last-child::after {
  display: none;
}
.worry h3 {
  width: min(658px, 87.733vw);
  margin: min(70px, 9.333vw) auto 0;
}
.worry .worry-cv {
  width: min(756px, 100.8vw);
  position: relative;
  margin-left: min(2px, 0.267vw);
}
.worry .worry-cv a {
  position: absolute;
  bottom: min(100px, 13.333vw);
  right: min(35px, 4.667vw);
  width: min(518px, 69.067vw);
}

.howto {
  margin-top: max(-800px, -106.667vw);
  overflow-x: hidden;
}
.howto h2 {
  margin: min(120px, 16vw) auto 0;
  width: min(528px, 70.4vw);
}
.howto h2 .sub-title {
  width: min(290px, 38.667vw);
  margin: min(30px, 4vw) auto 0;
}
.howto .howto-mv-img {
  width: min(580px, 77.333vw);
  margin: min(20px, 2.667vw) auto 0;
}
.howto .howto-mv-text {
  width: min(540px, 72vw);
  margin: min(10px, 1.333vw) auto 0;
}
.howto .howto-4-copy {
  margin-top: min(5px, 0.667vw);
  position: relative;
  z-index: 1;
}
.howto .howto-4-card {
  width: min(676px, 90.133vw);
  margin: max(-50px, -6.667vw) auto 0;
  background-color: #fff;
  border-radius: min(10px, 1.333vw);
  padding: min(60px, 8vw) 0 min(20px, 2.667vw);
}
.howto .howto-4-card h3 {
  width: min(610px, 81.333vw);
  margin: 0 auto;
}
.howto .howto-4-card .howto-4-table {
  width: min(640px, 85.333vw);
  margin: min(20px, 2.667vw) auto 0;
}
.howto .howto-4-card ol li {
  border-bottom: solid min(1px, 0.133vw) #006fbc;
}
.howto .howto-4-card ol li:last-child {
  border-bottom: none;
}
.howto .howto-4-card ol li h4 {
  width: min(513px, 68.4vw);
  margin: min(40px, 5.333vw) auto 0;
}
.howto .howto-4-card ol li figure {
  margin: min(10px, 1.333vw) 0 0 0;
}
.howto .howto-4-card ol li .howto-4-1img {
  width: min(636px, 84.8vw);
}
.howto .howto-4-card ol li .howto-4-2img {
  width: min(633px, 84.4vw);
}
.howto .howto-4-card ol li .howto-4-3img {
  width: min(596px, 79.467vw);
  padding-left: min(10px, 1.333vw);
  margin: max(-10px, -1.333vw) 0 min(20px, 2.667vw) 0;
}
.howto .howto-4-card ol li .howto-4-4img {
  width: min(612px, 81.6vw);
  padding-left: min(15px, 2vw);
}
.howto .howto-3-card {
  width: min(670px, 89.333vw);
  margin: min(60px, 8vw) auto 0;
  background-color: #fff;
  border-radius: min(20px, 2.667vw);
  padding: 0 0 min(60px, 8vw) 0;
}
.howto .howto-3-copy {
  width: min(545px, 72.667vw);
  margin: min(30px, 4vw) auto 0;
}
.howto .howto-3-steps {
  margin: min(30px, 4vw) 0 0;
}
.howto .howto-3-steps .step-item {
  width: min(623px, 83.067vw);
}
.howto .howto-3-steps .step-2 {
  margin-top: max(-30px, -4vw);
  width: min(600px, 80vw);
}
.howto .howto-3-steps .step-3 {
  margin-top: min(18px, 2.4vw);
}
.howto .howto-3-footer-text {
  width: min(531px, 70.8vw);
  margin: min(60px, 8vw) auto 0;
}
.howto .howto-cv-card {
  margin: min(30px, 4vw) 0 0 min(10px, 1.333vw);
  position: relative;
}
.howto .howto-cv-card .btn-cv {
  position: absolute;
  bottom: min(115px, 15.333vw);
  right: min(25px, 3.333vw);
  width: min(518px, 69.067vw);
}
.howto .howto-bg1 {
  padding-top: min(10px, 1.333vw);
  margin-top: max(-10px, -1.333vw);
  width: min(750px, 100vw);
}
.howto .howto-bg2 {
  width: min(750px, 100vw);
  margin: max(-164px, -21.867vw) 0 0 0;
}
.howto .howto-bg3 {
  width: min(750px, 100vw);
  height: min(285px, 38vw);
  margin: max(-3px, -0.4vw) 0 0 0;
}

.merit {
  margin: max(-220px, -29.333vw) 0 0 0;
}
.merit .merit-title {
  width: min(683px, 91.067vw);
  margin: min(60px, 8vw) auto 0;
}
.merit .merit-usecase-list {
  margin: min(19px, 2.533vw) auto 0;
  display: grid;
  justify-content: center;
}
.merit .merit-usecase-list li {
  width: min(600px, 80vw);
  margin-left: min(10px, 1.333vw);
}
.merit .bg .merit-bg {
  width: min(750px, 100vw);
}

.review {
  margin: max(-300px, -40vw) 0 0 0;
}
.review .review-title {
  width: min(561px, 74.8vw);
  margin: min(100px, 13.333vw) auto 0;
}
.review .review-text-img {
  width: min(578px, 77.067vw);
  margin: min(55px, 7.333vw) auto 0;
}
.review .review-list-img {
  width: min(647px, 86.267vw);
  margin: min(40px, 5.333vw) 0 0 auto;
}
.review .review-copy {
  width: min(559px, 74.533vw);
  margin: min(52px, 6.933vw) auto 0;
}
.review .review-text-img-2 {
  width: min(695px, 92.667vw);
  margin: min(36px, 4.8vw) 0 0 auto;
}
.review .review-voices {
  margin: min(51px, 6.8vw) auto 0;
  width: min(676px, 90.133vw);
  display: grid;
  gap: min(18px, 2.4vw);
}
.review .review-voices .margin-top {
  margin-top: max(-10px, -1.333vw);
}

.product {
  margin: max(-300px, -40vw) 0 0 0;
}
.product .product-title {
  width: min(639px, 85.2vw);
  margin: min(60px, 8vw) auto 0;
}
.product .product-list {
  margin: max(-90px, -12vw) 0 0 0;
  width: min(750px, 100vw);
}
.product .product-item figure {
  position: relative;
}
.product .product-item .btn-cv {
  position: absolute;
}
.product .product-item .btn1 {
  width: min(518px, 69.067vw);
  bottom: min(55px, 7.333vw);
  right: min(120px, 16vw);
}
.product .product-item .btn2 {
  width: min(518px, 69.067vw);
  bottom: min(55px, 7.333vw);
  right: min(120px, 16vw);
}
.product .product-item .btn3 {
  width: min(492px, 65.6vw);
  bottom: min(40px, 5.333vw);
  right: min(25px, 3.333vw);
}
.product .product-card-1 {
  width: min(745px, 99.333vw);
  margin-left: min(12px, 1.6vw);
}
.product .product-card-2 {
  width: min(776px, 103.467vw);
  margin: max(-30px, -4vw) 0 0 max(-18px, -2.4vw);
}
.product .product-card-3 {
  width: min(748px, 99.733vw);
  margin-left: min(10px, 1.333vw);
}
.product .btn1 {
  bottom: min(30px, 4vw);
  right: min(40px, 5.333vw);
}
.product .product-message {
  margin: min(110px, 14.667vw) auto 0;
}
.product .product-copy {
  width: min(639px, 85.2vw);
  margin: 0 auto;
}
.product .message-img {
  width: min(220px, 29.333vw);
  margin: 0 auto;
  margin-top: max(-40px, -5.333vw);
}
.product .product-text {
  width: min(573px, 76.4vw);
  margin: min(30px, 4vw) auto 0;
}
.product .bg .product-bg2 {
  margin-top: max(-230px, -30.667vw);
}

.contact {
  background-color: #fff;
  max-width: 750px;
  padding: min(80px, 10.667vw) 0 min(30px, 4vw);
  margin: max(-8px, -1.067vw) 0 auto;
}
.contact .contact-icon {
  width: min(89px, 11.867vw);
  margin: 0 auto;
}
.contact .contact-title {
  width: min(469px, 62.533vw);
  margin: 4vw auto 0;
}
.contact .contact-tel {
  width: min(469px, 62.533vw);
  margin: min(40px, 5.333vw) auto 0;
}
.contact .contact-text {
  width: min(389px, 51.867vw);
  margin: min(40px, 5.333vw) auto 0;
}
.contact .contact-logo {
  width: min(708px, 94.4vw);
  margin: min(70px, 9.333vw) auto 0;
}/*# sourceMappingURL=style.css.map */