:root {
  --mh--breakpoint--min: 375px;
  --mh--breakpoint--sm: 640px;
  --mh--breakpoint--md: 768px;
  --mh--breakpoint--lg: 1100px;
  --mh--breakpoint--xl: 1280px;
  --mh--breakpoint--x2l: 1450px;
}

/* .x-sp-feature-service
================================================== */

.x-sp-feature-service {
  padding-top: 40px;
  padding-bottom: 80px;
  background-color: var(--mh--color--grayscale-400);
}

.x-sp-feature-service__inner {
  margin-bottom: 60px;
}

.x-sp-feature-service__body {
  margin-top: 30px;
}

.x-sp-feature-service__lead {
  font-size: var(--mh--font-size--x6l);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--grayscale-900);
}

.x-sp-feature-service__txt {
  margin-top: 15px;
  font-size: var(--mh--font-size--md);
  line-height: var(--mh--line-height--md);
  color: var(--mh--color--grayscale-900);
}

.x-sp-feature-service__list {
  display: grid;
  margin-top: 30px;
  gap: 30px;
}

.x-sp-feature-service__item-img {
  aspect-ratio: 525/295;
  border-radius: var(--mh--border-radius--md);
  overflow: hidden;
}

.x-sp-feature-service__item-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.x-sp-feature-service__item-img iframe {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.x-sp-feature-service__item-head {
  margin-top: 20px;
  font-size: var(--mh--font-size--x2l);
  line-height: var(--mh--line-height--sm);
  color: var(--mh--color--grayscale-900);
}

.x-sp-feature-service__item-txt {
  margin-top: 10px;
  font-size: var(--mh--font-size--md);
  line-height: var(--mh--line-height--md);
}

.x-sp-feature-service__one-stop {
  display: grid;
  gap: var(--mh--space--20-60);
  padding: var(--mh--space--sm) var(--mh--space--20-60);
  margin-top: var(--mh--space--xl);
  background: url("../img/common/bg_gradation02.png") no-repeat bottom left/89.8507462687% var(--mh--color--grayscale-100);
  border-radius: var(--mh--border-radius--md);
}

.x-sp-feature-service__one-stop-area-txt {
  display: grid;
  gap: var(--mh--space--xs);
}

.x-sp-feature-service__one-stop-head {
  display: grid;
  gap: var(--mh--space--10-15);
}

.x-sp-feature-service__one-stop-head-en {
  font-size: var(--mh--font-size--sm);
  color: var(--mh--color--primary-500);
}

.x-sp-feature-service__one-stop-head-main {
  font-size: var(--mh--font-size--x5l);
  line-height: var(--mh--line-height--sm);
}

.x-sp-feature-service__one-stop-btn {
  display: grid;
  gap: var(--mh--space--x4s);
}

.x-sp-feature-service__one-stop-btn .c-btn02__in {
  background: linear-gradient(90deg, #ff8c44 0%, #ffca44 100%);
}

.x-sp-feature-service__one-stop-btn .c-btn02__body {
  background: transparent;
}

.x-sp-feature-service__one-stop-btn .c-btn02__cat-item {
  color: var(--mh--color--grayscale-100);
  border-color: var(--mh--color--grayscale-100) !important;
}

.x-sp-feature-service__one-stop-btn .c-btn02__head {
  color: var(--mh--color--grayscale-100);
}

.x-sp-feature-service__one-stop-btn .c-btn02__arw {
  color: var(--mh--color--grayscale-100);
  background: transparent;
  border-color: var(--mh--color--grayscale-100);
}

.x-sp-feature-service__one-stop-img {
  overflow: hidden;
  border-radius: var(--mh--border-radius--md);
}

@media (width >= 768px ) {
  .x-sp-feature-service {
    padding-top: 80px;
    padding-bottom: 160px;
  }
  .x-sp-feature-service__inner {
    margin-bottom: 120px;
  }
  .x-sp-feature-service__body {
    display: flex;
    margin-top: 60px;
    align-items: flex-start;
    justify-content: space-between;
    gap: 40px;
  }
  .x-sp-feature-service__lead {
    min-width: 0;
    flex: 0 1 580px;
  }
  .x-sp-feature-service__txt {
    min-width: 0;
    margin-top: 0;
    flex: 0 1 776px;
  }
  .x-sp-feature-service__list {
    max-width: var(--mh--contents--width);
    margin-top: 60px;
    margin-right: auto;
    margin-left: auto;
    grid-template-columns: repeat(2, 1fr);
    gap: 60px 50px;
  }
  .x-sp-feature-service__item-head {
    margin-top: 20px;
  }
  .x-sp-feature-service__item-txt {
    margin-top: 15px;
  }
  .x-sp-feature-service__one-stop {
    grid-template-columns: 1fr 37.5335120643%;
    align-items: center;
    background-size: 37.841191067%;
  }
  .x-sp-feature-service__one-stop-btn {
    grid-template-columns: 1fr 1fr;
  }
}