/** @format */

@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@200..700&display=swap');

/* ---------------------------------------- common ---------------------------------------- */
body {
  font-size: 14px;
  font-family: YuGothic, 游ゴシック, DIN Next W01 Regular, 'ＭＳ Ｐゴシック', 'MS P Gothic', MS-PGothic,
    'ヒラギノ角ゴ Pro W3', 'Hiragino Kaku Gothic Pro', Osaka, arial, helvetica, clean, sans-serif;
  line-height: 1;
  font-feature-settings: 'palt';
  letter-spacing: 0.04em;
}

a {
  text-decoration: none;
  outline: none;
  transition: all 0.3s ease;
}

a:hover {
  opacity: 0.6;
}

img {
  max-width: 100%;
}

sub {
  font-size: 60%;
}

.md {
  display: none;
}

.lg {
  display: none;
}

.xxl {
  display: none;
}

.sm {
  display: block;
}

.section {
  position: relative;
  font-size: clamp(0.875rem, 0.76rem + 0.49vw, 1.25rem);

  .section__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: clamp(2.875rem, 1.842rem + 4.41vw, 6.25rem) 24px 58px;
    position: relative;

    &.section__inner--mv {
      padding: 120px 25px 18px;
    }

    &.section__inner--points {
      padding-bottom: clamp(4.688rem, 4.171rem + 2.2vw, 6.375rem);
    }

    &.section__inner--example {
      padding-top: clamp(3.125rem, 2.551rem + 2.45vw, 5rem);
      padding-bottom: clamp(3rem, 1.909rem + 4.65vw, 6.563rem);
    }

    &.section__inner--flow {
      padding-top: clamp(4.5rem, 3.563rem + 4vw, 7.563rem);
      padding-bottom: 16px;
    }

    &.section__inner--faq {
      padding-bottom: 26px;
    }
  }

  .section__title {
    font-size: clamp(1.25rem, 0.867rem + 1.63vw, 2.5rem);
    font-weight: bold;
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: clamp(1.438rem, 0.997rem + 1.88vw, 2.875rem);

    &::after {
      content: '';
      display: block;
      width: clamp(1.875rem, 1.301rem + 2.45vw, 3.75rem);
      height: clamp(0.156rem, 0.108rem + 0.2vw, 0.313rem);
      background-color: #000;
    }
  }
}

/* mv ---------------------------------------------------- */
.mv {
  background-image: url(./images/sp/mv.png);
  background-size: 100%;
  background-repeat: no-repeat;

  .mv__body {
    background-color: #fff;
    padding: clamp(0.875rem, 0.555rem + 1.37vw, 1.75rem) clamp(0.75rem, 0.476rem + 1.17vw, 1.5rem)
      clamp(0.688rem, 0.42rem + 1.14vw, 1.563rem);
  }

  .mv__title {
    background-color: #717171;
    color: #fff;
    font-weight: bold;
    text-align: center;
    font-size: clamp(1rem, 0.634rem + 1.56vw, 2rem);
    width: calc(100% - 5px);
    line-height: 1;
    padding: clamp(0.375rem, 0.238rem + 0.59vw, 0.75rem) 0 clamp(0.313rem, 0.198rem + 0.49vw, 0.625rem);
  }

  .mv__text {
    font-size: clamp(1rem, 0.634rem + 1.56vw, 2rem);
    font-weight: bold;
    text-align: center;
    line-height: 1;
    margin-top: clamp(0.438rem, 0.277rem + 0.68vw, 0.875rem);
  }

  .mv__text-small {
    font-size: clamp(0.813rem, 0.492rem + 1.37vw, 1.688rem);
    display: inline-block;
    margin-top: clamp(0.5rem, 0.317rem + 0.78vw, 1rem);
  }

  .mv__text-emphasis {
    color: #e1140a;
  }

  .mv__text-number {
    font-size: clamp(1.938rem, 1.229rem + 3.02vw, 3.875rem);
  }

  .mv__list {
    margin-top: clamp(0.75rem, 0.406rem + 1.47vw, 1.875rem);
    display: flex;
    gap: clamp(0.375rem, 0.238rem + 0.59vw, 0.75rem);
    justify-content: center;
  }

  .mv__list-item {
    text-align: center;
    font-weight: bold;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    min-height: 56px;
    font-size: clamp(0.625rem, 0.396rem + 0.98vw, 1.25rem);
    gap: 9px;

    & + & {
      border-left: 1px solid #c1c4d0;
      padding-left: 10px;
    }

    &::before {
      display: block;
      content: '';
      width: clamp(2.25rem, 1.427rem + 3.51vw, 4.5rem);
      height: clamp(2.063rem, 1.308rem + 3.22vw, 4.125rem);
      top: 0;
      background-image: url(./images/mv_card.png);
      background-size: contain;
      background-position: center;
      background-repeat: no-repeat;
      flex-shrink: 0;
    }

    &:nth-of-type(2) {
      &::before {
        background-image: url(./images/mv_phone.png);
      }
    }

    &:nth-of-type(3) {
      &::before {
        width: clamp(2rem, 1.268rem + 3.12vw, 4rem);
        background-image: url(./images/mv_calendar.png);
      }
    }
  }
}

/* points ---------------------------------------------------- */
.points {
  .points__catch {
    margin-top: 26px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 6px;

    &::before {
      display: block;
      content: '';
      width: clamp(4.125rem, 3.226rem + 3.84vw, 7.063rem);
      height: clamp(0.938rem, 0.651rem + 1.22vw, 1.875rem);
      top: 0;
      background-image: url(./images/points_logo.png);
      background-size: contain;
      background-position: center;
      background-repeat: no-repeat;
    }
  }

  .points__catch-body {
    text-align: center;
    font-size: clamp(0.938rem, 0.651rem + 1.22vw, 1.875rem);
    font-weight: bold;
    line-height: 1.2;
  }

  .points__title__emphasis {
    font-size: clamp(1.688rem, 1.171rem + 2.2vw, 3.375rem);

    &.points__title__emphasis--number {
      font-size: clamp(1.875rem, 1.301rem + 2.45vw, 3.75rem);
    }
  }

  .points__catch-main {
    font-size: clamp(1.25rem, 0.867rem + 1.63vw, 2.5rem);
  }

  .points__list {
    display: flex;
    gap: 10px 13px;
    flex-wrap: wrap;
    margin-top: 24px;
  }

  .points__list-item {
    border: 1px solid #565656;
    width: calc(50% - 16px / 2);
    font-size: clamp(0.938rem, 0.651rem + 1.22vw, 1.875rem);
    position: relative;
    border-radius: 5px;
    overflow: hidden;
    padding-bottom: 8px;
    box-sizing: border-box;
    min-height: 150px;
  }

  .points__list-index {
    position: absolute;
    color: #fff;
    font-weight: bold;
    text-align: center;
    font-size: clamp(0.5rem, 0.347rem + 0.65vw, 1rem);
    background-image: url(./images/points_index_bg.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: clamp(2.813rem, 1.952rem + 3.67vw, 5.625rem);
    height: clamp(2.813rem, 1.952rem + 3.67vw, 5.625rem);
    padding: 5px 10px 10px 7px;
    line-height: 1.5;
    box-sizing: border-box;
  }

  .points__list-index-number {
    font-size: clamp(0.938rem, 0.651rem + 1.22vw, 1.875rem);
  }

  .points__list-image-wrapper {
    width: clamp(2.438rem, 1.691rem + 3.18vw, 4.875rem);
    margin: clamp(0.5rem, 0.022rem + 2.04vw, 2.063rem) auto clamp(0.75rem, -0.092rem + 3.59vw, 3.5rem);

    &.points__list-image-wrapper--point2 {
      width: clamp(3.125rem, 2.188rem + 4vw, 6.188rem);
      margin: clamp(1.5rem, 1.041rem + 1.96vw, 3rem) auto clamp(1.063rem, 0.489rem + 2.45vw, 2.938rem);
    }

    &.points__list-image-wrapper--point3 {
      margin: clamp(1.125rem, 0.781rem + 1.47vw, 2.25rem) auto clamp(1.5rem, 1.041rem + 1.96vw, 3rem);
    }

    &.points__list-image-wrapper--point4 {
      margin: clamp(0.938rem, 0.651rem + 1.22vw, 1.875rem) auto clamp(0.875rem, 0.607rem + 1.14vw, 1.75rem);
    }

    &.points__list-image-wrapper--point5 {
      margin: clamp(1.25rem, 0.867rem + 1.63vw, 2.5rem) auto;
      width: clamp(2.25rem, 1.561rem + 2.94vw, 4.5rem);
    }

    &.points__list-image-wrapper--point6 {
      margin: clamp(1.25rem, 0.867rem + 1.63vw, 2.5rem) auto clamp(0.625rem, 0.395rem + 0.98vw, 1.375rem);
      width: clamp(2.25rem, 1.561rem + 2.94vw, 4.5rem);
    }
  }

  .points__list-text-wrapper {
    font-weight: bold;
    text-align: center;
    line-height: 1.1;

    &.points__list-text-wrapper--point5 {
      line-height: 1.4;
    }
  }

  .points__list-text {
    vertical-align: bottom;
  }

  .points__list-note {
    font-weight: normal;
    margin-top: 8px;
    text-align: center;
  }

  .points__list-item-vertical {
    writing-mode: vertical-rl;
    vertical-align: text-bottom;
  }

  .points__list-fsz15 {
    font-size: clamp(0.438rem, 0.284rem + 0.65vw, 0.938rem);
  }

  .points__list-fsz17 {
    font-size: clamp(0.5rem, 0.328rem + 0.73vw, 1.063rem);
  }

  .points__list-fsz25 {
    font-size: clamp(0.75rem, 0.501rem + 1.06vw, 1.563rem);
  }

  .points__list-fsz29 {
    font-size: clamp(0.75rem, 0.425rem + 1.39vw, 1.813rem);
  }

  .points__list-fsz37 {
    font-size: clamp(0.938rem, 0.517rem + 1.8vw, 2.313rem);
  }

  .points__list-fsz35 {
    font-size: clamp(1.125rem, 0.8rem + 1.39vw, 2.188rem);
  }

  .points__list-fsz36 {
    font-size: clamp(1.125rem, 0.781rem + 1.47vw, 2.25rem);
  }

  .points__list-fsz63 {
    font-size: clamp(1.938rem, 1.325rem + 2.61vw, 3.938rem);
  }

  .points__list-fsz50 {
    font-size: clamp(1.563rem, 1.084rem + 2.04vw, 3.125rem);
  }

  .points__list-fsz57 {
    font-size: clamp(1.625rem, 1.032rem + 2.53vw, 3.563rem);
  }

  .points__list-fsz53 {
    font-size: clamp(1.625rem, 1.108rem + 2.2vw, 3.313rem);
  }

  .points__list-fsz72 {
    font-size: clamp(2.25rem, 1.561rem + 2.94vw, 4.5rem);
  }

  .points__list-text-align {
    vertical-align: text-bottom;
  }

  .points__list-red {
    color: #e1140a;
  }
}

/* example ---------------------------------------------------- */
.example {
  background-color: #f3f4f8;

  .example__image-wrapper {
    width: clamp(6.875rem, 4.79rem + 8.9vw, 13.688rem);
    margin: 15px auto 0;
    transform: translateX(-12px);
  }

  .example__text {
    font-size: clamp(0.75rem, 0.52rem + 0.98vw, 1.5rem);
    text-align: center;
    line-height: 1.3;
    margin-top: 13px;
  }

  .example__arrow {
    width: clamp(2.063rem, 1.01rem + 4.49vw, 5.5rem);
    margin: 0 auto;
  }

  .example__interest-wrapper {
    display: flex;
    flex-direction: column;
  }

  .example__interest {
    border-radius: 5px;
    overflow: hidden;
    border: 1px solid #717171;
    margin-top: 23px;
    background-color: #fff;
    position: relative;

    &.example__interest--red {
      border: 1px solid #e1140a;
      margin-top: 0;
    }
  }

  .example__interest-inner {
    padding: clamp(1.313rem, 0.872rem + 1.88vw, 2.75rem) clamp(1.938rem, 1.746rem + 0.82vw, 2.563rem);
    padding-bottom: 35px;
  }

  .example__interest-catch {
    display: flex;
    align-items: flex-end;
    border-bottom: 1px solid #cbcbcb;
    padding: 0 1px clamp(0.375rem, 0.165rem + 0.9vw, 1.063rem);
    gap: 3px;
    justify-content: center;
  }

  .example__interest-title {
    color: #fff;
    font-weight: bold;
    background-color: #717171;
    font-size: clamp(0.875rem, 0.607rem + 1.14vw, 1.75rem);
    text-align: center;
    padding: clamp(0.5rem, 0.347rem + 0.65vw, 1rem) 0;

    &.example__interest-title--red {
      background-color: #e1140a;
    }
  }

  .example__interest-split-fee {
    text-align: center;
    transform: translateY(-2px);
  }

  .example__interest-detail {
    font-size: clamp(0.75rem, 0.52rem + 0.98vw, 1.5rem);
    text-align: center;
    margin-top: clamp(0.938rem, 0.746rem + 0.82vw, 1.563rem);
    line-height: 1.2;
  }

  .example__interest-total {
    background-color: #f0f0f0;
    text-align: center;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-top: clamp(0.938rem, 0.651rem + 1.22vw, 1.875rem);
    padding: 18px 0;

    &.example__interest-total--yellow {
      background-color: #fffdd3;
    }
  }

  .example__interest-arrow {
    width: clamp(0.625rem, 0.453rem + 0.73vw, 1.188rem);
    transform: translateY(-6px);
  }

  .example__interest-diagonal-line {
    position: relative;
    margin-left: 8px;

    &::before {
      position: absolute;
      content: '';
      display: block;
      transform: rotate(-10deg);
      background-color: #000;
      width: 100%;
      height: 1px;
      top: 50%;
      left: 0;
    }
  }

  .example__emphasis {
    font-weight: bold;
  }

  .example__fsz19 {
    font-size: clamp(0.563rem, 0.371rem + 0.82vw, 1.188rem);
  }

  .example__fsz26 {
    font-size: clamp(0.813rem, 0.564rem + 1.06vw, 1.625rem);
  }

  .example__fsz30 {
    font-size: clamp(0.938rem, 0.651rem + 1.22vw, 1.875rem);
  }

  .example__interest-ls0 {
    letter-spacing: 0;
  }

  .example__interest-fsz12 {
    font-size: clamp(0.563rem, 0.505rem + 0.24vw, 0.75rem);
  }

  .example__interest-fsz14 {
    font-size: clamp(0.563rem, 0.467rem + 0.41vw, 0.875rem);
  }

  .example__interest-fsz18 {
    font-size: clamp(0.563rem, 0.39rem + 0.73vw, 1.125rem);
  }

  .example__interest-fsz20 {
    font-size: clamp(0.75rem, 0.597rem + 0.65vw, 1.25rem);
  }

  .example__interest-fsz22 {
    font-size: clamp(0.688rem, 0.477rem + 0.9vw, 1.375rem);
  }

  .example__interest-fsz24 {
    font-size: clamp(0.75rem, 0.52rem + 0.98vw, 1.5rem);
  }

  .example__interest-fsz25 {
    font-size: clamp(0.75rem, 0.501rem + 1.06vw, 1.563rem);
  }

  .example__interest-fsz27 {
    font-size: clamp(0.875rem, 0.626rem + 1.06vw, 1.688rem);
  }

  .example__interest-fsz30 {
    font-size: clamp(0.938rem, 0.651rem + 1.22vw, 1.875rem);
  }

  .example__interest-fsz38 {
    font-size: clamp(1.188rem, 0.824rem + 1.55vw, 2.375rem);
  }

  .example__interest-fsz48 {
    font-size: clamp(1.5rem, 1.041rem + 1.96vw, 3rem);
  }

  .example__interest-fsz50 {
    font-size: clamp(1.563rem, 1.084rem + 2.04vw, 3.125rem);
  }

  .example__interest-fsz60 {
    font-size: clamp(1.563rem, 0.893rem + 2.86vw, 3.75rem);
  }

  .example__interest-red {
    color: #e1140a;
  }

  .example__interest-emphasis {
    font-weight: bold;
  }
}

/* ---------------------------------------- flow ---------------------------------------- */
.flow {
  .flow-list {
    margin-top: clamp(2.875rem, 2.224rem + 2.78vw, 5rem);
    display: flex;
    flex-direction: column;
    gap: 20px;
  }

  .flow-list__item {
    position: relative;
    box-shadow: 5px 5px 30px rgba(67, 67, 67, 0.15);
    border-radius: 5px;

    &::before {
      position: absolute;
      content: '';
      display: block;
      background-image: url(./images/sp/flow_obi.png);
      width: 100%;
      height: 8vw;
      max-height: 58px;
      background-size: 100%;
      background-repeat: no-repeat;
      top: -6vw;
    }

    &::after {
      position: absolute;
      content: '';
      display: block;
      background-image: url(./images/sp/flow_arrow.png);
      width: 40px;
      height: 16px;
      background-size: contain;
      background-repeat: no-repeat;
      bottom: -16px;
      left: 50%;
      transform: translate(-50%);
    }

    & + & {
      margin-top: clamp(1.313rem, 0.391rem + 4.61vw, 5rem);
    }

    &:last-of-type {
      &::after {
        display: none;
      }
    }
  }

  .flow-list__step {
    text-align: center;
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    top: -4vw;
  }

  .flow-list__step-body {
    display: inline-block;
    color: #fff;
    font-weight: bold;
    text-align: center;
    font-size: clamp(0.438rem, 0.304rem + 0.57vw, 0.875rem);
    text-align: center;
  }

  .flow-list__step-emphasis {
    font-size: clamp(0.625rem, 0.406rem + 1.09vw, 1.5rem);
  }

  .flow-list__item-body {
    padding: clamp(1.438rem, 1.093rem + 1.47vw, 2.563rem) 14px 15px;
    border-radius: 5px;
    display: grid;
    grid-template-columns: 88px auto;
    grid-template-rows: 13px 1fr;
    gap: 5px;
  }

  .flow-list__catch {
    color: #31387d;
    font-weight: bold;
    order: 1;
    grid-column: 2 / 3;
    font-size: clamp(0.688rem, 0.477rem + 0.9vw, 1.375rem);
  }

  .flow__image-wrapper {
    grid-column: 1 / 2;
    grid-row: 1 / 3;
    align-content: center;
    text-align: center;
  }

  .flow-list__text {
    grid-column: 2 / 3;
    grid-row: 2 / 3;
    font-size: clamp(0.625rem, 0.548rem + 0.33vw, 0.875rem);
    line-height: 1.7;
  }

  .flow__image {
    width: clamp(5.5rem, 3.989rem + 6.45vw, 10.438rem);

    &.flow__image--step2 {
      width: clamp(2.938rem, 2.364rem + 2.45vw, 4.813rem);
    }

    &.flow__image--step3 {
      width: clamp(2.938rem, 2.402rem + 2.29vw, 4.688rem);
    }

    &.flow__image--step4 {
      width: clamp(3rem, 2.579rem + 1.8vw, 4.375rem);
    }
  }
}

/* faq ---------------------------------------------------- */
.faq {
  .faq__list {
    margin-top: clamp(1.563rem, 1.084rem + 2.04vw, 3.125rem);
  }

  .faq__question {
    font-size: clamp(0.688rem, 0.573rem + 0.49vw, 1.063rem);
    font-weight: bold;
    display: flex;
    align-items: center;
    padding: clamp(0.25rem, 0.135rem + 0.49vw, 0.625rem) clamp(0.375rem, 0.203rem + 0.73vw, 0.938rem);
    background-color: #e6e6e6;
    gap: clamp(0.563rem, 0.429rem + 0.57vw, 1rem);
    border-top: 1px solid #808080;
    border-bottom: 1px solid #808080;
    line-height: 1.5;

    &.faq__question--sm-md-2lines {
      align-items: flex-start;
    }

    &::before {
      content: '';
      background-image: url(./images/faq_q.png);
      background-size: contain;
      background-repeat: no-repeat;
      width: clamp(1.25rem, 0.867rem + 1.63vw, 2.5rem);
      height: clamp(1.25rem, 0.867rem + 1.63vw, 2.5rem);
    }

    &:not(:first-of-type) {
      margin-top: clamp(1.125rem, 0.398rem + 3.1vw, 3.5rem);
    }
  }

  .faq__answer {
    font-size: clamp(0.688rem, 0.611rem + 0.33vw, 0.938rem);
    display: flex;
    align-items: flex-start;
    margin-top: clamp(0.938rem, 0.651rem + 1.22vw, 1.875rem);
    padding: 0 clamp(0.375rem, 0.26rem + 0.49vw, 0.75rem) clamp(0.25rem, 0.173rem + 0.33vw, 0.5rem);
    gap: clamp(0.563rem, 0.314rem + 1.06vw, 1.375rem);
    line-height: 1.52;

    &::before {
      content: '';
      background-image: url(./images/faq_a.png);
      background-size: contain;
      background-repeat: no-repeat;
      width: clamp(1.25rem, 0.867rem + 1.63vw, 2.5rem);
      height: clamp(1.25rem, 0.867rem + 1.63vw, 2.5rem);
      flex-shrink: 0;
      transform: translateY(-5px);
    }
  }

  .faq__contact {
    border: 1px solid #b7b7b7;
    margin-top: clamp(1.688rem, 0.98rem + 3.02vw, 4rem);
  }

  .faq__contact-title {
    background-color: #000;
    color: #fff;
    font-weight: bold;
    text-align: center;
    padding: clamp(0.313rem, 0.255rem + 0.24vw, 0.5rem) 0 clamp(0.375rem, 0.298rem + 0.33vw, 0.625rem);
    line-height: 1.2;
    letter-spacing: 0.1em;
  }

  .faq__contact-info-title {
    font-weight: bold;
    letter-spacing: 0.1em;
    font-size: clamp(0.875rem, 0.798rem + 0.33vw, 1.125rem);
  }

  .faq__contact-body {
    padding: clamp(1.25rem, 0.963rem + 1.22vw, 2.188rem) clamp(2.188rem, 1.709rem + 2.04vw, 3.75rem)
      clamp(1rem, 0.77rem + 0.98vw, 1.75rem) clamp(2.188rem, 1.614rem + 2.45vw, 4.063rem);
  }

  .faq__contact-info {
    font-size: clamp(0.688rem, 0.611rem + 0.33vw, 0.938rem);
    margin-top: 15px;
    line-height: 1.5;
  }
}

/* caution ---------------------------------------------------- */
.caution {
  .caution__list {
    margin: clamp(1.375rem, 0.954rem + 1.8vw, 2.75rem) auto 0;
    padding: 0 20px;
  }

  .caution__list-item {
    font-size: clamp(0.688rem, 0.63rem + 0.24vw, 0.875rem);
    letter-spacing: 0.09em;
    line-height: 1.55;
  }

  .caution__contact {
    background-color: #f3f4f8;
    margin: clamp(1.75rem, 1.061rem + 2.94vw, 4rem) auto 0;
    padding: 26px 18px 28px;
    box-sizing: border-box;
  }

  .caution__contact-title {
    font-weight: bold;
    text-align: center;
    line-height: 1.5;
    letter-spacing: 0.1em;
    font-size: clamp(0.938rem, 0.689rem + 1.06vw, 1.75rem);
  }

  .caution__contact-text {
    font-size: clamp(0.688rem, 0.63rem + 0.24vw, 0.875rem);
    line-height: 1.5;
    margin-top: 16px;
  }

  .caution__contact-item {
    border: 1px solid #b7b7b7;
    margin-top: 23px;
  }

  .caution__contact-info-title {
    background-color: #000;
    color: #fff;
    font-weight: bold;
    text-align: center;
    padding: 5px 0 6px;
    line-height: 1.2;
    letter-spacing: 0.1em;
  }

  .caution__contact-info-title {
    font-weight: bold;
    letter-spacing: 0.1em;
  }

  .caution__contact-item-body {
    padding: clamp(1.25rem, 1.02rem + 0.98vw, 2rem) 0 16px;
    text-align: center;
    letter-spacing: 0.1em;
    background-color: #fff;

    &.caution__contact-item-body--mail {
      padding-bottom: 28px;
    }
  }

  .caution__contact-item-tel {
    font-weight: bold;
    font-size: clamp(1.313rem, 1.14rem + 0.73vw, 1.875rem);
    color: #000;
    display: block;
  }

  .caution__contact-time {
    display: block;
    font-size: clamp(0.625rem, 0.548rem + 0.33vw, 0.875rem);
    font-weight: bold;
    letter-spacing: 0.1em;
    margin-top: clamp(0.688rem, 0.496rem + 0.82vw, 1.313rem);
  }

  .caution__contact-note {
    display: block;
    font-size: clamp(0.563rem, 0.505rem + 0.24vw, 0.75rem);
    letter-spacing: 0.1em;
    margin-top: 11px;
  }

  .caution__contact-item-mail {
    font-weight: bold;
    font-size: clamp(0.938rem, 0.804rem + 0.57vw, 1.375rem);
    color: #000;
    letter-spacing: 0.02em;
  }
}

@media (min-width: 768px) {
  .flow {
    .flow-list {
      flex-direction: row;
      gap: 32px;
    }

    .flow-list__item-body {
      grid-template-columns: 1fr;
      grid-template-rows: 22px 110px auto;
      place-items: center;
      padding-left: 20px;
      padding-right: 15px;
      letter-spacing: 0.1em;
    }

    .flow-list__item {
      width: calc(25% - 32px * 3 / 4);
      border-radius: 10px;
      min-height: 360px;

      &::before {
        background-image: url(./images/pc/flow_obi.png);
        width: 100%;
        height: 56px;
        top: -3vw;
      }

      &::after {
        background-image: url(./images/pc/flow_arrow.png);
        width: 19px;
        height: 40px;
        top: 50%;
        left: auto;
        right: -25px;
        transform: translateY(-50%);
      }

      & + & {
        margin: 0;
      }
    }

    .flow-list__step {
      top: -2vw;
    }

    .flow-list__catch {
      grid-column: 1 / 3;
      grid-row: 1 / 2;
    }

    .flow__image-wrapper {
      grid-column: 1 / 3;
      grid-row: 2 / 3;
    }

    .flow-list__text {
      grid-row: 3 / 4;
      grid-column: 1;
      margin-top: 7px;
      letter-spacing: 0.06em;
    }
  }
}

@media (min-width: 992px) {
  .sm {
    display: none;
  }

  .md {
    display: none;
  }

  .lg {
    display: block;
  }

  .section {
    .section__inner {
      &.section__inner--mv {
        padding: 38px 103px;
      }
    }
  }

  .mv {
    background-image: url(./images/pc/mv.png);
    background-size: cover;
    max-width: 1400px;
    margin: 0 auto;

    .mv__body {
      max-width: 600px;
      box-sizing: border-box;
    }

    .mv__list-item {
      gap: 16px;
    }
  }

  .points {
    .points__list {
      margin-top: 24px;
      gap: 36px 50px;
    }

    .points__list-item {
      width: calc(100% / 3 - 50px * 2 / 3);
      min-height: 300px;
      border-radisu: 10px;
    }

    .points__list-index {
      padding: 12px 10px 10px 0px;
    }

    .points__list-image-wrapper {
      min-width: 78px;
    }

    .points__catch-body {
      line-height: 1.4;
      letter-spacing: 0.12em;
    }

    .points__catch {
      margin-top: 40px;
      display: flex;
      flex-direction: row;
      align-items: flex-start;
      justify-content: center;
      gap: 6px;
    }

    .points__catch-main {
      transform: translateX(-60px);
      display: inline-block;
    }

    .points__list-note {
      margin-top: 14px;
    }
  }

  .example {
    .example__case {
      display: flex;
      justify-content: center;
      align-items: center;
      gap: 53px;
    }

    .example__text {
      text-align: left;
      letter-spacing: 0.08em;
      margin-top: 0;
    }

    .example__image-wrapper {
      margin: 0;
      transform: translate(18px, 10px);
    }

    .example__interest {
      width: 50%;
      margin-top: 0;
      border-radius: 10px;
    }

    .example__interest-arrow {
      transform: translate(-10px, -10px);
      margin-left: 24px;
    }

    .example__interest-wrapper {
      flex-direction: row;
      align-items: center;
      margin-top: 46px;
    }

    .example__interest-detail {
      margin-top: 18px;
    }

    ..example__interest-total {
      padding: 16px 0;
    }

    .example__interest-emphasis-lh08 {
      line-height: 0.8;
    }
  }

  .flow {
    .flow-list {
      flex-direction: row;
    }

    .flow-list__item {
      &::after {
        right: -29px;
      }

      & + & {
        margin: 0 0 0 10px;
      }
    }

    .flow-list__step {
      top: -22px;
    }
  }

  .faq {
    .faq__list {
      max-width: 924px;
      margin-left: auto;
      margin-right: auto;
    }

    .faq__question {
      &.faq__question--sm-md-2lines {
        align-items: center;
      }
    }

    .faq__answer {
      line-height: 1.98;
      letter-spacing: 0;

      &::before {
        transform: translateY(-10px);
      }
    }

    .faq__contact {
      max-width: 600px;
      margin: clamp(1.688rem, 0.98rem + 3.02vw, 4rem) auto 0;
    }

    .faq__contact-title {
      font-size: 20px;
    }

    .faq__contact-info {
      letter-spacing: 0.1em;
      line-height: 1.65;
    }
  }

  .caution {
    .caution__list {
      max-width: 913px;
    }

    .caution__list-item {
      line-height: 1.75;
      letter-spacing: 0.115em;

      & + & {
        margin-top: 3px;
      }
    }

    .caution__contact {
      max-width: 920px;
    }

    .caution__contact-text {
      text-align: center;
      line-height: 2;
    }

    .caution__contact-item-wrapper {
      display: flex;
      justify-content: center;
      gap: 42px;
    }

    .caution__contact-item {
      width: calc(50% - 42px / 2);
      max-width: 370px;
    }

    .caution__contact-item-body {
      &.caution__contact-item-body--mail {
        line-height: 1.8;
      }
    }
  }
}

@media (min-width: 1400px) {
  .flow {
    .flow-list__step {
      top: -2.5vw;
    }
  }
}

@media (max-width: 374px) {
  .flow {
    .flow-list__step {
      top: -15px;
    }
  }
}