.service-page {
  font-family: "Noto Sans JP", sans-serif;
  --rem: 1rem;
}
@media screen and (min-width: 749px) and (max-width: 1440px) {
  .service-page {
    --rem: calc(100vw * 10 / 1440);
  }
}
@media screen and (min-width: 391px) and (max-width: 749px) {
  .service-page {
    --rem: 1rem;
  }
}
@media screen and (max-width: 390px) {
  .service-page {
    --rem: calc(100vw * 10 / 390);
  }
}

@media screen and (max-width: 749px) {
  .md-none {
    display: none;
  }
}

.md-show {
  display: none;
}
@media screen and (max-width: 749px) {
  .md-show {
    display: block;
  }
}

body:has(.service-page) {
  background: none;
}
body:has(.service-page) #main {
  background: none;
}
body:has(.service-page) #main .footer_space {
  padding-top: 0;
}
@media screen and (max-width: 749px) {
  body:has(.service-page) #main {
    padding-top: 0;
  }
}

.din {
  font-family: "din-2014", sans-serif;
}

.cta-wrap {
  margin-top: calc(var(--rem, 1rem) * 7.8);
  text-align: center;
}
@media screen and (max-width: 749px) {
  .cta-wrap {
    margin-top: calc(var(--rem, 1rem) * 6);
  }
}

.cta {
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  gap: calc(var(--rem, 1rem) * 1.2);
  max-width: calc(var(--rem, 1rem) * 31.5);
  width: 100%;
  padding: calc(var(--rem, 1rem) * 0.65) calc(var(--rem, 1rem) * 4) calc(var(--rem, 1rem) * 1.05) calc(var(--rem, 1rem) * 2);
  font-size: calc(var(--rem, 1rem) * 2);
  font-weight: 700;
  color: #fff;
  text-decoration: none;
  background-color: #ef5156;
  border-radius: 999px;
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  position: relative;
  border: calc(var(--rem, 1rem) * 0.2) solid #ef5156;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}
@media screen and (max-width: 749px) {
  .cta {
    max-width: calc(var(--rem, 1rem) * 27.8);
    padding: calc(var(--rem, 1rem) * 1.1) calc(var(--rem, 1rem) * 3) calc(var(--rem, 1rem) * 1.1) calc(var(--rem, 1rem) * 2);
    font-size: calc(var(--rem, 1rem) * 1.6);
  }
}
.cta::before {
  position: absolute;
  content: "";
  top: 50%;
  right: calc(var(--rem, 1rem) * 1.7);
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: calc(var(--rem, 1rem) * 2.5);
  height: calc(var(--rem, 1rem) * 2.5);
  background-image: url(../img/mv-cta-arrow.svg);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
@media screen and (max-width: 749px) {
  .cta::before {
    right: calc(var(--rem, 1rem) * 2);
    width: calc(var(--rem, 1rem) * 2);
    height: calc(var(--rem, 1rem) * 2);
  }
}
.cta:hover {
  opacity: 1;
  background-color: #fff;
  color: #ef5156;
  border: calc(var(--rem, 1rem) * 0.2) solid #ef5156;
}
.cta:hover::before {
  background-image: url(../img/mv-cta-arrow-hover.svg);
}

.service-title-en {
  display: block;
  font-size: calc(var(--rem, 1rem) * 1.5);
  text-align: center;
  font-weight: bold;
  text-transform: uppercase;
  color: #192d64;
}
@media screen and (max-width: 749px) {
  .service-title-en {
    font-size: calc(var(--rem, 1rem) * 1);
  }
}

.service-title-ja {
  margin-top: calc(var(--rem, 1rem) * 1);
  display: block;
  font-size: calc(var(--rem, 1rem) * 2.9);
  text-align: center;
  font-weight: bold;
  color: #ef5156;
}
@media screen and (max-width: 749px) {
  .service-title-ja {
    margin-top: calc(var(--rem, 1rem) * 0.7);
    font-size: calc(var(--rem, 1rem) * 2.2);
  }
}
.service-title-ja span {
  letter-spacing: -0.3em;
}

.service-title-ja.service-title-ja--reverse {
  color: #239b23;
}

.service-mv {
  background-color: #abe698;
  height: calc(var(--rem, 1rem) * 61.3);
  background-image: url(../img/bg-deco-01.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
@media screen and (max-width: 749px) {
  .service-mv {
    height: calc(var(--rem, 1rem) * 53);
    position: relative;
  }
  .service-mv::before {
    position: absolute;
    content: "";
    width: 100%;
    height: calc(var(--rem, 1rem) * 6);
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    background-image: -webkit-gradient(linear, left top, left bottom, from(#abe698), to(#fff));
    background-image: linear-gradient(to bottom, #abe698, #fff);
  }
}

.service-mv-inner {
  max-width: calc(var(--rem, 1rem) * 120.4);
  width: 100%;
  margin: 0 auto;
  height: inherit;
  position: relative;
  z-index: 1;
}
@media screen and (max-width: 749px) {
  .service-mv-inner {
    max-width: calc(var(--rem, 1rem) * 39);
  }
}
.service-mv-inner::before {
  position: absolute;
  content: "";
  width: calc(var(--rem, 1rem) * 41.1);
  height: calc(var(--rem, 1rem) * 21);
  bottom: calc(var(--rem, 1rem) * 3.6);
  right: calc(var(--rem, 1rem) * 10.5);
  background-image: url(../img/mv-bg-staff.svg);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -1;
}
@media screen and (max-width: 749px) {
  .service-mv-inner::before {
    width: calc(var(--rem, 1rem) * 18.5);
    height: calc(var(--rem, 1rem) * 9.4);
    right: calc(var(--rem, 1rem) * 1);
    bottom: calc(var(--rem, 1rem) * -1);
  }
}
.service-mv-inner::after {
  position: absolute;
  content: "";
  width: calc(var(--rem, 1rem) * 63.8);
  height: calc(var(--rem, 1rem) * 25.5);
  bottom: calc(var(--rem, 1rem) * 12);
  right: calc(var(--rem, 1rem) * -2);
  background-image: url(../img/mv-bg-building.svg);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
  z-index: -2;
}
@media screen and (max-width: 749px) {
  .service-mv-inner::after {
    width: calc(var(--rem, 1rem) * 36.2);
    height: calc(var(--rem, 1rem) * 19.4);
    right: initial;
    left: calc(var(--rem, 1rem) * -8.3);
    bottom: calc(var(--rem, 1rem) * -1);
    background-image: url(../img/mv-bg-building-sp.svg);
  }
}

.service-mv-logo {
  width: calc(var(--rem, 1rem) * 15.3);
  position: absolute;
  top: calc(var(--rem, 1rem) * 8.5);
  left: calc(var(--rem, 1rem) * 7.4);
}
@media screen and (max-width: 749px) {
  .service-mv-logo {
    display: none;
  }
}

.service-mv-contents {
  position: absolute;
  bottom: calc(var(--rem, 1rem) * 7);
  left: calc(var(--rem, 1rem) * 13);
}
@media screen and (max-width: 749px) {
  .service-mv-contents {
    bottom: initial;
    top: calc(var(--rem, 1rem) * 7);
    left: 50%;
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    width: 90%;
  }
}

.service-mv-title {
  font-size: calc(var(--rem, 1rem) * 3.4);
  font-weight: bold;
  color: #192d64;
  display: block;
  line-height: 1.4;
}
@media screen and (max-width: 749px) {
  .service-mv-title {
    font-size: calc(var(--rem, 1rem) * 2.3);
    line-height: 1.3043478261;
    text-align: center;
  }
}
.service-mv-title span {
  color: #ef5156;
}

.service-mv-captions {
  margin-top: calc(var(--rem, 1rem) * 2.5);
}
@media screen and (max-width: 749px) {
  .service-mv-captions {
    margin-top: calc(var(--rem, 1rem) * 3);
  }
}

.service-mv-caption {
  font-size: calc(var(--rem, 1rem) * 1.88);
  font-weight: 600;
  color: #192d64;
  letter-spacing: -0.03em;
  line-height: 1.9;
}
@media screen and (max-width: 749px) {
  .service-mv-caption {
    text-align: center;
    font-size: calc(var(--rem, 1rem) * 1.5);
  }
}
.service-mv-caption span {
  letter-spacing: -0.5em;
}

.cta-wrap.cta-wrap--mv {
  margin-top: calc(var(--rem, 1rem) * 3.5);
  text-align: left;
}
@media screen and (max-width: 749px) {
  .cta-wrap.cta-wrap--mv {
    margin-top: calc(var(--rem, 1rem) * 2);
    text-align: center;
  }
}

.service-features {
  background-color: #f9f9f9;
  position: relative;
  overflow-y: clip;
}
@media screen and (max-width: 749px) {
  .service-features {
    overflow-y: initial;
  }
}
.service-features::before {
  position: absolute;
  content: "";
  width: calc(var(--rem, 1rem) * 58.9);
  height: calc(var(--rem, 1rem) * 48.8);
  top: calc(var(--rem, 1rem) * -4.3);
  right: calc(var(--rem, 1rem) * -13.3);
  background-image: url(../img/features-deco-01.svg);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
@media screen and (max-width: 749px) {
  .service-features::before {
    display: none;
  }
}
.service-features::after {
  position: absolute;
  content: "";
  width: calc(var(--rem, 1rem) * 20.3);
  height: calc(var(--rem, 1rem) * 24.4);
  bottom: calc(var(--rem, 1rem) * 0.5);
  left: calc(var(--rem, 1rem) * -6.4);
  background-image: url(../img/features-deco-02.svg);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
@media screen and (max-width: 749px) {
  .service-features::after {
    width: calc(var(--rem, 1rem) * 12.6);
    height: calc(var(--rem, 1rem) * 14.4);
    z-index: 10;
    -webkit-transform: rotate(10deg);
            transform: rotate(10deg);
    left: calc(var(--rem, 1rem) * -2.3);
    bottom: calc(var(--rem, 1rem) * -10.5);
  }
}

.service-features-inner {
  max-width: calc(var(--rem, 1rem) * 98.4);
  margin-inline: auto;
  padding-top: calc(var(--rem, 1rem) * 7.5);
  padding-bottom: calc(var(--rem, 1rem) * 7.5);
}
@media screen and (max-width: 749px) {
  .service-features-inner {
    max-width: calc(var(--rem, 1rem) * 50);
    padding-inline: calc(var(--rem, 1rem) * 3.5);
  }
}

.service-items {
  margin-top: calc(var(--rem, 1rem) * 4.5);
}
@media screen and (max-width: 749px) {
  .service-items {
    margin-top: calc(var(--rem, 1rem) * 1.5);
  }
}

.service-item {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  gap: calc(var(--rem, 1rem) * 2);
}
@media screen and (max-width: 749px) {
  .service-item {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: calc(var(--rem, 1rem) * 1.4);
  }
}

.service-item + .service-item {
  margin-top: calc(var(--rem, 1rem) * 11);
}
@media screen and (max-width: 749px) {
  .service-item + .service-item {
    margin-top: calc(var(--rem, 1rem) * 3);
  }
}

.service-item.service-item--reverse {
  -webkit-box-orient: horizontal;
  -webkit-box-direction: reverse;
      -ms-flex-direction: row-reverse;
          flex-direction: row-reverse;
}
@media screen and (max-width: 749px) {
  .service-item.service-item--reverse {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
  }
}

.service-item:nth-child(odd) {
  margin-left: calc(var(--rem, 1rem) * 4.5);
}
@media screen and (max-width: 749px) {
  .service-item:nth-child(odd) {
    margin-left: 0;
  }
}

.service-item:nth-child(1) {
  max-width: calc(var(--rem, 1rem) * 93.7);
  gap: calc(var(--rem, 1rem) * 4.1);
}
@media screen and (max-width: 749px) {
  .service-item:nth-child(1) {
    gap: calc(var(--rem, 1rem) * 1.4);
  }
}

.service-item:nth-child(2) {
  max-width: calc(var(--rem, 1rem) * 92.3);
  gap: calc(var(--rem, 1rem) * 2.7);
}
@media screen and (max-width: 749px) {
  .service-item:nth-child(2) {
    gap: calc(var(--rem, 1rem) * 1.4);
  }
}

.service-item:nth-child(3) {
  max-width: calc(var(--rem, 1rem) * 82.4);
  gap: calc(var(--rem, 1rem) * 5);
}
@media screen and (max-width: 749px) {
  .service-item:nth-child(3) {
    gap: calc(var(--rem, 1rem) * 1.4);
  }
}

.service-item-img {
  width: calc(var(--rem, 1rem) * 40);
}
@media screen and (max-width: 749px) {
  .service-item-img {
    width: calc(var(--rem, 1rem) * 25);
  }
}

.service-item:nth-child(1) .service-item-img {
  width: calc(var(--rem, 1rem) * 41.4);
}
@media screen and (max-width: 749px) {
  .service-item:nth-child(1) .service-item-img {
    width: calc(var(--rem, 1rem) * 26.8);
  }
}

.service-item:nth-child(2) .service-item-img {
  width: calc(var(--rem, 1rem) * 46.6);
}
@media screen and (max-width: 749px) {
  .service-item:nth-child(2) .service-item-img {
    width: calc(var(--rem, 1rem) * 27.2);
  }
}

.service-item:nth-child(3) .service-item-img {
  width: calc(var(--rem, 1rem) * 42.8);
}
@media screen and (max-width: 749px) {
  .service-item:nth-child(3) .service-item-img {
    width: calc(var(--rem, 1rem) * 28.3);
  }
}

.service-item:nth-child(1) .service-item-text-wrap {
  max-width: calc(var(--rem, 1rem) * 48.2);
  width: 100%;
}
@media screen and (max-width: 749px) {
  .service-item:nth-child(1) .service-item-text-wrap {
    max-width: 100%;
  }
}

.service-item:nth-child(2) .service-item-text-wrap {
  max-width: calc(var(--rem, 1rem) * 42.9);
  width: 100%;
}
@media screen and (max-width: 749px) {
  .service-item:nth-child(2) .service-item-text-wrap {
    max-width: 100%;
  }
}

.service-item-title {
  font-size: calc(var(--rem, 1rem) * 1.88);
  font-weight: 700;
  color: #239b23;
}
@media screen and (max-width: 749px) {
  .service-item-title {
    font-size: calc(var(--rem, 1rem) * 1.8);
  }
}

.service-item-text {
  margin-top: calc(var(--rem, 1rem) * 4);
  font-size: calc(var(--rem, 1rem) * 1.38);
  color: #101010;
  line-height: 1.8;
}
@media screen and (max-width: 749px) {
  .service-item-text {
    margin-top: calc(var(--rem, 1rem) * 1.5);
    font-size: calc(var(--rem, 1rem) * 1.5);
  }
}

.service-flow {
  background-color: #dae8da;
}

.service-flow-inner {
  max-width: calc(var(--rem, 1rem) * 96.3);
  margin-inline: auto;
  padding-top: calc(var(--rem, 1rem) * 7.5);
  padding-bottom: calc(var(--rem, 1rem) * 8.5);
}
@media screen and (max-width: 749px) {
  .service-flow-inner {
    padding-top: calc(var(--rem, 1rem) * 4.5);
    padding-bottom: calc(var(--rem, 1rem) * 6);
    padding-inline: calc(var(--rem, 1rem) * 1.7);
  }
}

.service-flow-title {
  margin: 0;
}

.service-flow-steps {
  margin-top: calc(var(--rem, 1rem) * 5);
  max-width: calc(var(--rem, 1rem) * 96.7);
  margin-inline: auto;
  list-style: none;
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
      -ms-flex-direction: row;
          flex-direction: row;
  -webkit-box-align: start;
      -ms-flex-align: start;
          align-items: flex-start;
  gap: 0;
  padding-top: 0;
}
.service-flow-steps::before {
  content: "";
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  top: calc(calc(var(--rem, 1rem) * 15) + calc(var(--rem, 1rem) * -1) + calc(var(--rem, 1rem) * 1.75));
  height: calc(var(--rem, 1rem) * 0.1);
  width: calc(var(--rem, 1rem) * 75);
  background-color: #192d64;
  z-index: 0;
}
@media screen and (max-width: 749px) {
  .service-flow-steps {
    margin-top: calc(var(--rem, 1rem) * 3);
    display: block;
    max-width: calc(var(--rem, 1rem) * 43);
  }
  .service-flow-steps::before {
    content: "";
    position: absolute;
    left: calc(var(--rem, 1rem) * 1.2);
    top: calc(var(--rem, 1rem) * 1);
    width: calc(var(--rem, 1rem) * 0.1);
    height: calc(var(--rem, 1rem) * 50);
    max-width: none;
    -webkit-transform: none;
            transform: none;
    background-color: #192d64;
    z-index: 1;
  }
}

.service-flow-step {
  position: relative;
  z-index: 1;
  -webkit-box-flex: 1;
      -ms-flex: 1 1 0px;
          flex: 1 1 0;
  min-width: 0;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  text-align: center;
}
@media screen and (max-width: 749px) {
  .service-flow-step {
    position: relative;
    z-index: auto;
    display: grid;
    grid-template-columns: calc(var(--rem, 1rem) * 2.6) 1fr;
    gap: 0;
    -webkit-box-align: start;
        -ms-flex-align: start;
            align-items: start;
    padding-bottom: calc(var(--rem, 1rem) * 0.25);
  }
  .service-flow-step--last {
    padding-bottom: 0;
  }
}

.service-flow-num {
  -ms-flex-negative: 0;
      flex-shrink: 0;
  width: calc(var(--rem, 1rem) * 3.5);
  height: calc(var(--rem, 1rem) * 3.5);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  background-color: #192d64;
  color: #fff;
  border-radius: 50%;
  font-size: calc(var(--rem, 1rem) * 1.75);
  font-weight: 700;
  line-height: 1;
  margin-top: calc(var(--rem, 1rem) * -1);
  z-index: 10;
}
@media screen and (max-width: 749px) {
  .service-flow-num {
    position: absolute;
    left: calc(calc(var(--rem, 1rem) * 2.6) * -0.5 - calc(var(--rem, 1rem) * 2.76) * 0.5);
    top: calc(var(--rem, 1rem) * 0.15);
    margin-top: 0;
    width: calc(var(--rem, 1rem) * 2.76);
    height: calc(var(--rem, 1rem) * 2.76);
    z-index: 3;
    font-size: calc(var(--rem, 1rem) * 1.38);
  }
}

.service-flow-step-main {
  width: 100%;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}
.service-flow-step-main::after {
  content: none;
  display: none;
}
@media screen and (max-width: 749px) {
  .service-flow-step-main {
    grid-column: 2;
    position: relative;
    z-index: 0;
    display: grid;
    grid-template-columns: minmax(calc(var(--rem, 1rem) * 5.8), calc(var(--rem, 1rem) * 9.3)) 1fr;
    grid-template-rows: auto;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    min-width: 0;
  }
  .service-flow-step-main > .service-flow-illust-row,
  .service-flow-step-main .service-flow-step-heading,
  .service-flow-step-main .service-flow-step-desc {
    -webkit-box-ordinal-group: unset;
        -ms-flex-order: unset;
            order: unset;
  }
}
@media screen and (max-width: 749px) and (max-width: 749px) {
  .service-flow-step-main > .service-flow-illust-row,
  .service-flow-step-main .service-flow-step-heading,
  .service-flow-step-main .service-flow-step-desc {
    gap: calc(var(--rem, 1rem) * 1);
  }
}

@media screen and (max-width: 749px) {
  .service-flow-step:not(.service-flow-step--last) .service-flow-step-main {
    margin-bottom: calc(var(--rem, 1rem) * 2.5);
  }
}

.service-flow-step-body {
  display: contents;
}
@media screen and (max-width: 749px) {
  .service-flow-step-body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: stretch;
        -ms-flex-align: stretch;
            align-items: stretch;
    grid-column: 2;
    grid-row: 1;
    min-width: 0;
  }
}

.service-flow-step-heading {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  position: relative;
  z-index: 10;
  width: 100%;
}
@media screen and (max-width: 749px) {
  .service-flow-step-heading {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
        -ms-flex-direction: row;
            flex-direction: row;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    -webkit-box-align: baseline;
        -ms-flex-align: baseline;
            align-items: baseline;
    gap: calc(var(--rem, 1rem) * 0.35) calc(var(--rem, 1rem) * 0.45);
    margin: 0;
    min-width: 0;
  }
}

.service-flow-illust-row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
      -ms-flex-direction: column;
          flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  width: 100%;
  margin-bottom: calc(var(--rem, 1rem) * 2);
}
@media screen and (max-width: 749px) {
  .service-flow-illust-row {
    grid-column: 1;
    grid-row: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
    -webkit-box-pack: start;
        -ms-flex-pack: start;
            justify-content: flex-start;
    margin: 0;
    margin-left: calc(var(--rem, 1rem) * -1.8);
  }
}

.service-flow-illust {
  max-width: calc(var(--rem, 1rem) * 15);
  -webkit-box-sizing: border-box;
          box-sizing: border-box;
  margin: 0;
  position: relative;
  aspect-ratio: 1;
  border-radius: 100vw;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  overflow: visible;
}
@media screen and (max-width: 749px) {
  .service-flow-illust {
    max-width: calc(var(--rem, 1rem) * 9.3);
    width: 100%;
  }
}

.service-flow-step:not(.service-flow-step--last) .service-flow-illust::after {
  content: "";
  position: absolute;
  right: calc(var(--rem, 1rem) * -2.9);
  top: 50%;
  -webkit-transform: translateY(-50%);
          transform: translateY(-50%);
  width: calc(var(--rem, 1rem) * 1.2);
  height: calc(var(--rem, 1rem) * 1.7);
  background-color: #192d64;
  clip-path: polygon(0 0, 0% 100%, 100% 50%);
  pointer-events: none;
}
@media screen and (min-width: 750px) and (max-width: 780px) {
  .service-flow-step:not(.service-flow-step--last) .service-flow-illust::after {
    right: calc(var(--rem, 1rem) * -1.75);
  }
}
@media screen and (max-width: 749px) {
  .service-flow-step:not(.service-flow-step--last) .service-flow-illust::after {
    content: none;
    display: none;
  }
}

.service-flow-illust-img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.service-flow-step-title {
  margin: 0;
  font-size: calc(var(--rem, 1rem) * 1.9);
  font-weight: 700;
  color: #239b23;
}
@media screen and (max-width: 749px) {
  .service-flow-step-title {
    font-size: calc(var(--rem, 1rem) * 1.6);
  }
}

.service-flow-step-desc {
  margin-top: calc(var(--rem, 1rem) * 1);
  font-size: calc(var(--rem, 1rem) * 1.4);
  max-width: calc(var(--rem, 1rem) * 15.9);
  text-align: left;
  letter-spacing: -0.05em;
}
@media screen and (max-width: 749px) {
  .service-flow-step-desc {
    margin-top: calc(var(--rem, 1rem) * 0.4);
    font-size: calc(var(--rem, 1rem) * 1.3);
    max-width: 100%;
  }
}

@media screen and (max-width: 749px) {
  .service-flow-step:not(.service-flow-step--last) .service-flow-step-main::after {
    content: "";
    position: absolute;
    left: calc(calc(var(--rem, 1rem) * 4.65) - calc(var(--rem, 1rem) * 1.8));
    top: calc(var(--rem, 1rem) * 10.5);
    -webkit-transform: translateX(-50%);
            transform: translateX(-50%);
    display: block;
    width: calc(var(--rem, 1rem) * 1.1);
    height: calc(var(--rem, 1rem) * 0.8);
    background-color: #192d64;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    pointer-events: none;
  }
}

.service-cost {
  background-color: #f9f9f9;
}

.service-cost-inner {
  max-width: calc(var(--rem, 1rem) * 95.8);
  margin-inline: auto;
  padding-top: calc(var(--rem, 1rem) * 7.5);
  padding-bottom: calc(var(--rem, 1rem) * 9);
}
@media screen and (max-width: 749px) {
  .service-cost-inner {
    padding-top: calc(var(--rem, 1rem) * 4.5);
    padding-bottom: calc(var(--rem, 1rem) * 5.5);
  }
}

.service-title.service-title--cost {
  width: -webkit-max-content;
  width: -moz-max-content;
  width: max-content;
  margin-inline: auto;
  position: relative;
}
.service-title.service-title--cost::before {
  position: absolute;
  content: "";
  width: calc(var(--rem, 1rem) * 9.8);
  height: calc(var(--rem, 1rem) * 8.3);
  top: calc(var(--rem, 1rem) * 2);
  left: calc(var(--rem, 1rem) * -11.5);
  background-image: url(../img/cost-deco.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
@media screen and (max-width: 749px) {
  .service-title.service-title--cost::before {
    display: none;
  }
}
.service-title.service-title--cost::after {
  position: absolute;
  content: "";
  width: calc(var(--rem, 1rem) * 9.8);
  height: calc(var(--rem, 1rem) * 8.3);
  top: calc(var(--rem, 1rem) * 2);
  right: calc(var(--rem, 1rem) * -11.5);
  -webkit-transform: scaleX(-1);
          transform: scaleX(-1);
  background-image: url(../img/cost-deco.png);
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
@media screen and (max-width: 749px) {
  .service-title.service-title--cost::after {
    display: none;
  }
}

.service-cost-desc {
  margin-top: calc(var(--rem, 1rem) * 1.5);
  font-size: calc(var(--rem, 1rem) * 1.38);
  color: #101010;
  text-align: center;
}

.service-cost-items {
  margin-top: calc(var(--rem, 1rem) * 9);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  gap: calc(var(--rem, 1rem) * 2);
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}
@media screen and (max-width: 749px) {
  .service-cost-items {
    margin-top: calc(var(--rem, 1rem) * 8);
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
        -ms-flex-direction: column;
            flex-direction: column;
    gap: calc(var(--rem, 1rem) * 5);
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
}

.service-cost-item {
  border: calc(var(--rem, 1rem) * 0.18) solid #ef5156;
  border-radius: calc(var(--rem, 1rem) * 1.5);
  position: relative;
  width: calc(var(--rem, 1rem) * 30.7);
  height: calc(var(--rem, 1rem) * 25.7);
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  position: relative;
}
@media screen and (max-width: 749px) {
  .service-cost-item {
    width: calc(var(--rem, 1rem) * 25.1);
    height: calc(var(--rem, 1rem) * 21.1);
  }
}
.service-cost-item::before {
  position: absolute;
  content: "";
  width: calc(var(--rem, 1rem) * 16.5);
  height: calc(var(--rem, 1rem) * 1);
  top: calc(var(--rem, 1rem) * -0.5);
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background-color: #f9f9f9;
}

.service-cost-item-img {
  position: absolute;
  top: calc(var(--rem, 1rem) * -7.5);
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  width: calc(var(--rem, 1rem) * 19);
  height: auto;
}
@media screen and (max-width: 749px) {
  .service-cost-item-img {
    width: calc(var(--rem, 1rem) * 15.5);
    top: calc(var(--rem, 1rem) * -6);
  }
}

.service-cost-item:nth-child(1) .service-cost-item-img {
  top: calc(var(--rem, 1rem) * -7.2);
  left: 53%;
}
@media screen and (max-width: 749px) {
  .service-cost-item:nth-child(1) .service-cost-item-img {
    top: calc(var(--rem, 1rem) * -6);
  }
}

.service-cost-item:nth-child(2) .service-cost-item-img {
  top: calc(var(--rem, 1rem) * -6.2);
}
@media screen and (max-width: 749px) {
  .service-cost-item:nth-child(2) .service-cost-item-img {
    top: calc(var(--rem, 1rem) * -5);
  }
}

.service-cost-item:nth-child(3) .service-cost-item-img {
  top: calc(var(--rem, 1rem) * -7);
}
@media screen and (max-width: 749px) {
  .service-cost-item:nth-child(3) .service-cost-item-img {
    top: calc(var(--rem, 1rem) * -5.5);
  }
}

.service-cost-item-title {
  margin-top: calc(var(--rem, 1rem) * 5);
  font-size: calc(var(--rem, 1rem) * 1.88);
  font-weight: 700;
  text-align: center;
  color: #239b23;
  position: relative;
}
@media screen and (max-width: 749px) {
  .service-cost-item-title {
    font-size: calc(var(--rem, 1rem) * 1.6);
  }
}
.service-cost-item-title::before {
  position: absolute;
  content: "";
  width: calc(var(--rem, 1rem) * 2.2);
  height: calc(var(--rem, 1rem) * 0.38);
  bottom: calc(var(--rem, 1rem) * -1.8);
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  background-color: #239b23;
}
@media screen and (max-width: 749px) {
  .service-cost-item-title::before {
    width: calc(var(--rem, 1rem) * 1.8);
    height: calc(var(--rem, 1rem) * 0.3);
    bottom: calc(var(--rem, 1rem) * -1.6);
  }
}

.service-cost-item-text {
  margin-top: calc(var(--rem, 1rem) * 3.5);
  font-size: calc(var(--rem, 1rem) * 1.38);
  color: #101010;
  text-align: center;
}
@media screen and (max-width: 749px) {
  .service-cost-item-text {
    font-size: calc(var(--rem, 1rem) * 1.3);
  }
}

.service-contact {
  background-color: #418441;
  background-image: url(../img/bg-deco-03.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  position: relative;
}
.service-contact::before {
  content: "";
  position: absolute;
  left: 50%;
  -webkit-transform: translateX(-50%);
          transform: translateX(-50%);
  top: 0;
  width: 100%;
  height: calc(var(--rem, 1rem) * 15.5);
  background-image: url(../img/contact-bg.png);
  background-size: 100% 100%;
  background-position: center;
  background-repeat: no-repeat;
}
@media screen and (max-width: 749px) {
  .service-contact::before {
    height: calc(var(--rem, 1rem) * 4.5);
  }
}

.service-inner.service-inner--contact {
  padding: calc(var(--rem, 1rem) * 7) 0 calc(var(--rem, 1rem) * 10.5);
}
@media screen and (max-width: 749px) {
  .service-inner.service-inner--contact {
    padding: calc(var(--rem, 1rem) * 5) calc(var(--rem, 1rem) * 2) calc(var(--rem, 1rem) * 5.5);
  }
}

.service-title-en.service-title-en--white {
  color: #fff;
}

.service-title-ja.service-title-ja--white {
  color: #fff;
}

.service-contact-desc {
  margin-top: calc(var(--rem, 1rem) * 4.5);
  font-size: calc(var(--rem, 1rem) * 1.4);
  font-weight: 700;
  text-align: center;
  color: #fff;
  line-height: 1.8;
}
@media screen and (max-width: 749px) {
  .service-contact-desc {
    margin-top: calc(var(--rem, 1rem) * 2);
    font-size: calc(var(--rem, 1rem) * 1.5);
    position: relative;
    z-index: 10;
  }
}

.service-contact-note {
  margin-top: calc(var(--rem, 1rem) * 7);
  font-size: calc(var(--rem, 1rem) * 1.4);
  text-align: center;
  color: #fff;
}
@media screen and (max-width: 749px) {
  .service-contact-note {
    margin-top: calc(var(--rem, 1rem) * 2.5);
    font-size: calc(var(--rem, 1rem) * 1.5);
  }
}

.cta-wrap.cta-wrap--contact {
  margin-top: calc(var(--rem, 1rem) * 6.5);
}
@media screen and (max-width: 749px) {
  .cta-wrap.cta-wrap--contact {
    margin-top: calc(var(--rem, 1rem) * 2.5);
  }
}/*# sourceMappingURL=style.css.map */