@charset "utf-8";

.p-trademethod__step02 {
  background-color: var(--yellow-color02);
}
.p-trademethod__step02Head {
  @media screen and (max-width: 880px) {
    margin-bottom: calc(45em/16);
  }
}
.p-trademethod__step02BodyTool01 {
  & .body__img {
    display: flex;
    justify-content: center;
    align-items: flex-start;
    gap: min(calc(80em/16), calc(80/1280*100vw));
    margin-top: calc(56em/16);
    @media screen and (max-width: 880px) {
      flex-direction: column;
      gap: calc(35em/16);
      margin-top: calc(48em/16);
    }
  }
  & .body__imgItem {
    &:where(:nth-child(1)) {
      width: min(calc(343em/16), calc(343/1280*100vw));
    }
    &:where(:nth-child(2)) {
      width: min(calc(404em/16), calc(404/1280*100vw));
    }
    @media screen and (max-width: 880px) {
      width: 100%;
    }
  }
  & .body__imgItemPc {
    @media screen and (max-width: 880px) {
      display: none;
    }
  }
  & .body__imgItemSp {
    display: none;
    @media screen and (max-width: 880px) {
      display: flex;
      justify-content: space-between;
    }
  }
  & .body__imgItemSpItem {
    flex-shrink: 0;
    &:where(:nth-child(1)) {
      width: calc(140/320*100%);
    }
    &:where(:nth-child(2)) {
      width: calc(143/320*100%);
    }
  }
}
.p-trademethod__step02BodyTool02 {
  & .body__img {
    --borderimg-mt: 52;
    --borderimg-mb: 72;
    @media screen and (max-width: 880px) {
      --borderimg-mt: 30;
      --borderimg-mb: 0;
    }
  }
  & .body__link {
    @media screen and (max-width: 880px) {
      display: none;
    }
    & .c-btn {
      --btn-w: 574;
      --btn-h: 94;
      --btn-gap: 28;
      --btn-fs-max: 24;
      --btn-fs-min: 18;
      --btn-ls: 0.05;
      --btn-outer-border-w: 2;
      margin: 0 auto;
      @media screen and (max-width: 880px) {
        --btn-h: 65;
        width: calc(300/320*100%);
      }
    }
  }
}
.p-trademethod__step02BodyTool03 {
  & .body__link {
    margin-top: calc(60em/16);
    @media screen and (max-width: 880px) {
      margin-top: calc(48em/16);
    }
    & .c-btn {
      --btn-w: 614;
      --btn-h: 94;
      --btn-gap: 28;
      --btn-fs-max: 24;
      --btn-fs-min: 18;
      --btn-ls: 0.05;
      --btn-outer-border-w: 2;
      margin: 0 auto;
      @media screen and (max-width: 880px) {
        --btn-h: 65;
        width: calc(300/320*100%);
      }
    }
  }
}
.p-trademethod__step02OutroTitle {
  --outrotitle-w: 425;
}
.p-trademethod__step02OutroTxt {
  margin: 0 auto;
  width: min(calc(900/var(--section-width)*100%), calc(900em/18));
  text-align: justify;
  line-height: 1.8;
  font-size: calc(18em/16);
  letter-spacing: 0.06em;
  @media screen and (max-width: 880px) {
    width: 100%;
    line-height: 1.6;
    font-size: calc(16em/16);
  }
}
.p-trademethod__step02OutroLink {
  margin-top: calc(56em/16);
  & .c-btn {
    --btn-w: 434;
    --btn-h: 94;
    --btn-gap: 28;
    --btn-fs-max: 24;
    --btn-fs-min: 18;
    --btn-ls: 0.05;
    --btn-outer-border-w: 2;
    margin: 0 auto;
    @media screen and (max-width: 880px) {
      --btn-h: 65;
      width: calc(300/320*100%);
    }
  }
}