: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;
}

/* download-pattern01
================================================== */

.download-pattern01 {
  padding-block: var(--mh--space--md) 60px;
  background: url("../img/common/bg_gradation02.png") no-repeat bottom left/100%, url("../img/common/bg_pattern01.png") repeat top/50px;
}

@media (width >= 768px ) {
  .download-pattern01 {
    padding-block: var(--mh--space--md) 80px;
  }
}

.download-pattern02 {
  padding-block: 40px 85px;
}

@media (width >= 768px ) {
  .download-pattern02 {
    padding-block: 85px 170px;
  }
}

.download-mobility {
  padding-top: 62px;
}

@media (width >= 768px ) {
  .download-mobility {
    padding-top: 80px;
  }
}

/* .download-single
================================================== */

.download-single {
  background: url("../img/common/bg_gradation02.png") no-repeat bottom left/100%, url("../img/common/bg_pattern01.png") repeat top/50px;
}

.download-single__thumb img {
  margin-inline: auto;
}

/* download-single-content
================================================== */

.download-single-box {
  margin-top: 40px;
  background: var(--mh--color--grayscale-100);
  padding: 20px;
}

.download-single-box > *:first-child {
  margin-top: 0 !important;
}

.download-single-box > *:last-child {
  margin-bottom: 0 !important;
}

.download-single-box .c-check-list01 {
  margin-block: var(--mh--space--xs);
}

.download-single-box p {
  margin-block: var(--mh--space--xs);
}

@media (width < 768px) {
  .download-single-box {
    margin-inline: calc(-1 * var(--mh--contents--padding--side));
  }
}

@media (width >= 768px ) {
  .download-single-box {
    padding: 40px 80px;
  }
}

/* .download-single-index
================================================== */

/* .download-single-form
================================================== */

.download-single-form__content {
  padding: 30px 40px;
  background: var(--mh--color--grayscale-100);
}

@media (width < 768px) {
  .download-single-form__content {
    margin-inline: calc(-1 * var(--mh--contents--padding--side));
  }
}

@media (width >= 768px ) {
  .download-single-form__content {
    padding: 50px 100px;
  }
}