.mieru {
  padding-bottom: 15rem;
}
@media screen and (max-width: 768px) {
  .mieru {
    padding-bottom: 5rem;
  }
}
.mieru__inner {
  width: 90%;
  margin: 0 auto;
  max-width: 120rem;
}
.mieru__wrap {
  border-radius: 0.6rem;
  background: #f0f3f5;
  padding: 4.2rem 10rem 3.4rem;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 7rem;
}
@media screen and (max-width: 1220px) {
  .mieru__wrap {
    padding-inline: 5rem;
  }
}
@media screen and (max-width: 1220px) and (max-width: 768px) {
  .mieru__wrap {
    justify-content: center;
    padding: 3rem 4rem;
    align-items: center;
    width: 100%;
    margin: 0 auto;
    margin-bottom: 5rem;
  }
}
@media screen and (max-width: 1220px) and (max-width: 768px) and (max-width: 600px) {
  .mieru__wrap {
    flex-direction: column;
    width: -moz-fit-content;
    width: fit-content;
    gap: 3rem;
  }
}
.mieru__contents {
  display: contents;
}
@media screen and (max-width: 970px) {
  .mieru__contents {
    display: flex;
    align-items: center;
    gap: 10px;
    flex-direction: column;
  }
}
.mieru__left {
  max-width: 38rem;
  margin-right: 5rem;
}
@media screen and (max-width: 1350px) and (max-width: 1120px) {
  .mieru__left {
    max-width: 32rem;
    margin-right: 3rem;
    max-width: 100%;
  }
}
@media screen and (max-width: 1350px) and (max-width: 1120px) and (max-width: 600px) {
  .mieru__left {
    margin-right: 0;
  }
}
.mieru__center {
  max-width: 27rem;
  margin-right: 9rem;
}
@media screen and (max-width: 1350px) {
  .mieru__center {
    margin-right: 5rem;
  }
}
@media screen and (max-width: 1350px) and (max-width: 1220px) {
  .mieru__center {
    max-width: 20rem;
  }
}
@media screen and (max-width: 1350px) and (max-width: 1220px) and (max-width: 970px) {
  .mieru__center {
    margin-right: 0;
  }
}
.mieru__center img {
  width: 100%;
}
.mieru__right {
  max-width: 20.9rem;
}
@media screen and (max-width: 1220px) {
  .mieru__right {
    max-width: 16rem;
  }
}
.mieru__right img {
  width: 100%;
}
.mieru__title {
  display: flex;
  flex-direction: column;
  gap: 3rem;
}
@media screen and (max-width: 1350px) {
  .mieru__title {
    gap: 2rem;
  }
}
@media screen and (max-width: 1350px) and (max-width: 768px) {
  .mieru__title {
    gap: 1rem;
  }
}
@media screen and (max-width: 1350px) and (max-width: 768px) and (max-width: 600px) {
  .mieru__title {
    text-align: center;
  }
}
.mieru__title-sub {
  line-height: 1.2258064516;
  letter-spacing: 0.02em;
  font-size: 3.1rem;
}
.mieru__title-sub::before, .mieru__title-sub::after {
  content: "";
  display: block flow;
  inline-size: 0;
  block-size: 1px;
}
.mieru__title-sub::before {
  margin-block-end: calc((1 - 1.2258064516) * 0.5em);
}
.mieru__title-sub::after {
  margin-block-start: calc((1 - 1.2258064516) * 0.5em);
}
@media screen and (max-width: 1350px) {
  .mieru__title-sub {
    font-size: 2.4rem;
  }
}
@media screen and (max-width: 1350px) and (max-width: 600px) {
  .mieru__title-sub {
    font-size: 1.8rem;
    line-height: 1.5;
  }
}
.mieru__title-main {
  line-height: 1;
  letter-spacing: 0.05em;
  font-size: 6rem;
}
.mieru__title-main::before, .mieru__title-main::after {
  content: "";
  display: block flow;
  inline-size: 0;
  block-size: 1px;
}
.mieru__title-main::before {
  margin-block-end: calc((1 - 1) * 0.5em);
}
.mieru__title-main::after {
  margin-block-start: calc((1 - 1) * 0.5em);
}
@media screen and (max-width: 1350px) {
  .mieru__title-main {
    font-size: 4rem;
  }
}
@media screen and (max-width: 1350px) and (max-width: 600px) {
  .mieru__title-main {
    font-size: 3rem;
  }
}
.mieru__bottom {
  margin-bottom: 11rem;
}
@media screen and (max-width: 1240px) and (max-width: 768px) {
  .mieru__bottom {
    margin-bottom: 5rem;
  }
}
.mieru__bottom-title {
  line-height: 1.7142857143;
  letter-spacing: 0.06em;
  font-size: 2.8rem;
  margin-bottom: 5rem;
}
.mieru__bottom-title::before, .mieru__bottom-title::after {
  content: "";
  display: block flow;
  inline-size: 0;
  block-size: 1px;
}
.mieru__bottom-title::before {
  margin-block-end: calc((1 - 1.7142857143) * 0.5em);
}
.mieru__bottom-title::after {
  margin-block-start: calc((1 - 1.7142857143) * 0.5em);
}
@media screen and (max-width: 768px) {
  .mieru__bottom-title {
    font-size: 2.4rem;
    margin-bottom: 3rem;
  }
}
.mieru__bottom-text {
  line-height: 2;
  letter-spacing: 0.06em;
  font-size: 1.6rem;
}
.mieru__bottom-text::before, .mieru__bottom-text::after {
  content: "";
  display: block flow;
  inline-size: 0;
  block-size: 1px;
}
.mieru__bottom-text::before {
  margin-block-end: calc((1 - 2) * 0.5em);
}
.mieru__bottom-text::after {
  margin-block-start: calc((1 - 2) * 0.5em);
}
@media screen and (max-width: 768px) {
  .mieru__bottom-text {
    font-size: 1.4rem;
  }
}
.mieru__bottom-right {
  display: flex;
  align-items: flex-end;
  gap: 3rem;
  margin-top: 5rem;
}
@media screen and (max-width: 768px) {
  .mieru__bottom-right {
    gap: 2.5rem;
  }
}
.mieru__bottom-right-item {
  border: 1px solid #dddddd;
}
.mieru__bottom-right-item:nth-child(1) {
  width: 60%;
}
.mieru__bottom-right-item:nth-child(2) {
  width: 50%;
}
@media screen and (max-width: 768px) {
  .mieru__bottom-right-item {
    max-width: 500px;
    margin-inline: auto;
  }
}
.mieru__bottom-right-item img {
  width: 100%;
}
.mieru__regist {
  width: -moz-fit-content;
  width: fit-content;
  margin: 0 auto;
}
.mieru__regist-top {
  line-height: 1.6;
  letter-spacing: 0.06em;
  margin-block: calc((1em - 1lh) / 2);
  font-size: 2rem;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 1.5rem;
  margin-bottom: 4rem;
}
@media screen and (max-width: 768px) {
  .mieru__regist-top {
    text-align: center;
    margin-bottom: 2rem;
    gap: 2rem;
    font-size: 1.6rem;
  }
}
.mieru__regist-top::before, .mieru__regist-top::after {
  content: "";
  height: 2.7rem;
  width: 0.1rem;
  background: #000;
}
.mieru__regist-top::before {
  rotate: -30deg;
}
@media screen and (max-width: 768px) {
  .mieru__regist-top::before {
    rotate: -20deg;
  }
}
.mieru__regist-top::after {
  rotate: 30deg;
}
@media screen and (max-width: 768px) {
  .mieru__regist-top::after {
    rotate: 20deg;
  }
}
.mieru__regist-link {
  display: flex;
  align-items: center;
  padding: 2rem 3rem;
  border-radius: 0.3rem;
  border: solid 1px #737373;
  width: -moz-fit-content;
  width: fit-content;
  transition: opacity 0.3s, box-shadow 0.3s;
  box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.08);
}
@media (hover) {
  .mieru__regist-link:hover {
    opacity: 0.5;
    box-shadow: none;
  }
  .mieru__regist-link:hover .mieru__regist-arrow {
    translate: 5px 0;
  }
}
@media screen and (max-width: 768px) {
  .mieru__regist-link {
    padding: 1.5rem 2rem;
  }
}
.mieru__regist-img {
  width: 5.5rem;
}
@media screen and (max-width: 768px) {
  .mieru__regist-img {
    width: 3rem;
  }
}
.mieru__regist-list {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 3.5rem;
  margin-bottom: 3rem;
}
@media screen and (max-width: 768px) {
  .mieru__regist-list {
    gap: 1.5rem;
    flex-wrap: wrap;
  }
}
.mieru__regist-qr {
  width: 10.4rem;
}
@media screen and (max-width: 768px) {
  .mieru__regist-qr {
    width: 8rem;
  }
}
.mieru__regist-linkText {
  margin-inline: 3rem 4rem;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .mieru__regist-linkText {
    margin-inline: 1.5rem 2rem;
  }
}
.mieru__regist-linkText-1 {
  display: block;
  line-height: 2.0625;
  letter-spacing: 0.12em;
  font-size: 1.6rem;
  margin-bottom: 1rem;
}
.mieru__regist-linkText-1::before, .mieru__regist-linkText-1::after {
  content: "";
  display: block flow;
  inline-size: 0;
  block-size: 1px;
}
.mieru__regist-linkText-1::before {
  margin-block-end: calc((1 - 2.0625) * 0.5em);
}
.mieru__regist-linkText-1::after {
  margin-block-start: calc((1 - 2.0625) * 0.5em);
}
@media screen and (max-width: 768px) {
  .mieru__regist-linkText-1 {
    margin-bottom: 0.5rem;
  }
}
.mieru__regist-linkText-2 {
  display: block;
  line-height: 1;
  letter-spacing: 0.12em;
  font-size: 2.2rem;
}
.mieru__regist-linkText-2::before, .mieru__regist-linkText-2::after {
  content: "";
  display: block flow;
  inline-size: 0;
  block-size: 1px;
}
.mieru__regist-linkText-2::before {
  margin-block-end: calc((1 - 1) * 0.5em);
}
.mieru__regist-linkText-2::after {
  margin-block-start: calc((1 - 1) * 0.5em);
}
@media screen and (max-width: 768px) {
  .mieru__regist-linkText-2 {
    font-size: 1.8rem;
  }
}
.mieru__regist-arrow {
  width: 0.9rem;
  transition: translate 0.3s;
}
.mieru__regist-bottom {
  text-align: center;
  color: #737373;
  line-height: 1.7142857143;
  letter-spacing: 0.06em;
  font-size: 1.4rem;
}
.mieru__regist-bottom::before, .mieru__regist-bottom::after {
  content: "";
  display: block flow;
  inline-size: 0;
  block-size: 1px;
}
.mieru__regist-bottom::before {
  margin-block-end: calc((1 - 1.7142857143) * 0.5em);
}
.mieru__regist-bottom::after {
  margin-block-start: calc((1 - 1.7142857143) * 0.5em);
}
@media screen and (max-width: 768px) {
  .mieru__regist-bottom {
    font-size: 1.2rem;
  }
}

.method {
  padding: 15rem 0;
  background: #f7f7f5;
}
@media screen and (max-width: 768px) {
  .method {
    padding: 6rem 0;
  }
}
.method__title {
  width: 90%;
  margin: 0 auto 10rem;
  max-width: 120rem;
  line-height: 1;
  letter-spacing: 0.12em;
  font-size: 3.2rem;
}
.method__title::before, .method__title::after {
  content: "";
  display: block flow;
  inline-size: 0;
  block-size: 1px;
}
.method__title::before {
  margin-block-end: calc((1 - 1) * 0.5em);
}
.method__title::after {
  margin-block-start: calc((1 - 1) * 0.5em);
}
@media screen and (max-width: 768px) {
  .method__title {
    font-size: 2.4rem;
    margin-bottom: 3rem;
  }
}
.method__list {
  width: 90%;
  margin: 0 auto;
  max-width: 100rem;
  display: flex;
  flex-direction: column;
  gap: 10rem;
}
@media screen and (max-width: 768px) {
  .method__list {
    gap: 6rem;
  }
}
.method__item {
  background: #fff;
  padding: 4.6rem 6rem;
  position: relative;
}
@media screen and (max-width: 1120px) {
  .method__item {
    padding: 4.6rem 4.5rem;
  }
}
@media screen and (max-width: 1120px) and (max-width: 768px) {
  .method__item {
    padding: 7rem 3rem 3rem;
  }
}
.method__item:not(:last-child) {
  position: relative;
}
.method__item:not(:last-child)::after {
  content: "";
  height: auto;
  width: 8.1rem;
  aspect-ratio: 81/22;
  background: #d9d9d9;
  position: absolute;
  bottom: -5rem;
  left: 50%;
  translate: -50% 50%;
  clip-path: polygon(0 0, 50% 100%, 100% 0);
}
@media screen and (max-width: 768px) {
  .method__item:not(:last-child)::after {
    bottom: -3rem;
    width: 7rem;
  }
}
.method__item-number {
  background: #ededeb;
  position: absolute;
  top: 0;
  left: 0;
  height: 4.6rem;
  width: 16.1rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .method__item-number {
    height: 4rem;
    width: 12rem;
  }
}
.method__item-number p {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 0.8rem;
  line-height: 1;
  letter-spacing: 0.1em;
  margin-block: calc((1em - 1lh) / 2);
  font-size: 1.4rem;
}
@media screen and (max-width: 768px) {
  .method__item-number p {
    font-size: 1.2rem;
  }
}
.method__item-number p span {
  line-height: 1;
  letter-spacing: 0.1em;
  margin-block: calc((1em - 1lh) / 2);
  font-size: 2.6rem;
}
@media screen and (max-width: 768px) and (max-width: 768px) {
  .method__item-number p span {
    font-size: 2rem;
  }
}
.method__item-lr {
  display: flex;
  justify-content: center;
  gap: 4rem;
}
@media screen and (max-width: 1120px) {
  .method__item-lr {
    gap: 2rem;
  }
}
@media screen and (max-width: 1120px) and (max-width: 768px) {
  .method__item-lr {
    flex-direction: column;
    gap: 3rem;
  }
}
.method__item-left {
  max-width: 46rem;
}
@media screen and (max-width: 768px) {
  .method__item-left {
    max-width: 100%;
  }
}
.method__item-right {
  max-width: 40rem;
  margin-inline: auto;
  border: 1px solid #dddddd;
}
.method__item-right img {
  width: 100%;
}
.method__item-right--top {
  margin-top: 2rem;
}
.method__item-title {
  line-height: 1.6666666667;
  letter-spacing: 0.06em;
  font-size: 2.4rem;
  margin-bottom: 4rem;
  margin-top: 4.6rem;
}
.method__item-title::before, .method__item-title::after {
  content: "";
  display: block flow;
  inline-size: 0;
  block-size: 1px;
}
.method__item-title::before {
  margin-block-end: calc((1 - 1.6666666667) * 0.5em);
}
.method__item-title::after {
  margin-block-start: calc((1 - 1.6666666667) * 0.5em);
}
@media screen and (max-width: 768px) {
  .method__item-title {
    margin-top: 0;
    font-size: 2rem;
    margin-bottom: 2rem;
  }
}
.method__item-text {
  line-height: 2;
  letter-spacing: 0.06em;
  font-size: 1.6rem;
}
.method__item-text::before, .method__item-text::after {
  content: "";
  display: block flow;
  inline-size: 0;
  block-size: 1px;
}
.method__item-text::before {
  margin-block-end: calc((1 - 2) * 0.5em);
}
.method__item-text::after {
  margin-block-start: calc((1 - 2) * 0.5em);
}
.method__item-text span {
  display: block;
  font-size: 1.4rem;
  color: #ff554d;
}
.method__item-text a {
  color: #0d3da9;
  border-bottom: 1px solid #0d3da9;
  padding-bottom: 5px;
  transition: opacity 0.3s;
}
@media (hover) {
  .method__item-text a:hover {
    opacity: 0.5;
  }
}

.info {
  padding: 15rem 0;
}
@media screen and (max-width: 768px) {
  .info {
    padding: 6rem 0;
  }
}
.info__inner {
  width: 90%;
  margin: 0 auto;
  max-width: 120rem;
}
.info__wrap {
  display: grid;
  gap: 10rem;
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (max-width: 768px) {
  .info__wrap {
    grid-template-columns: 1fr;
    gap: 6rem;
  }
}
.info__title {
  line-height: 1.625;
  letter-spacing: 0.12em;
  font-size: 3.2rem;
  margin-bottom: 5rem;
}
.info__title::before, .info__title::after {
  content: "";
  display: block flow;
  inline-size: 0;
  block-size: 1px;
}
.info__title::before {
  margin-block-end: calc((1 - 1.625) * 0.5em);
}
.info__title::after {
  margin-block-start: calc((1 - 1.625) * 0.5em);
}
@media screen and (max-width: 768px) {
  .info__title {
    line-height: 1.5;
    font-size: 2.4rem;
    margin-bottom: 3rem;
  }
}
.info__texts {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
.info__text {
  line-height: 2;
  letter-spacing: 0.06em;
  margin-block: calc((1em - 1lh) / 2);
  font-size: 1.6rem;
  padding-left: 1.25em;
  text-indent: -1.25em;
}
.info__text-link {
  color: #0d3da9;
  padding-bottom: 5px;
  border-bottom: 1px solid #0d3da9;
  transition: opacity 0.3s;
}
@media (hover) {
  .info__text-link:hover {
    opacity: 0.5;
  }
}
/*# sourceMappingURL=style.css.map */