#page-body {
  --landing-font-proxima: "proxima-nova",sans-serif;
  --landing-black: #111;
  --landing-brown: #80736A;
  --landing-lightbrown: #F5F0ED;
  --landing-darkblue: #719AAA;
  --landing-lightblue: #E6EFF0;
  --landing-darkgray: #2A2C2B;
  --landing-white: #fff;
  --landing-anim-dur: 0.5s;
}

.main-area a {
  transition: opacity 0.5s;
}
.main-area img {
  width: auto;
  height: auto;
  max-width: 100%;
  display: block;
}

.main-area .product__feature {
  width: max-content;
  color: var(--landing-black);
  margin: calc(54 * (100vw/750)) auto 0;
}
.main-area .product__feature:nth-of-type(n+3) {
  margin-top: calc(135 * (100vw/750));
}
.main-area .product__feature--name {
  font-family: var(--landing-font-proxima);
  font-style: normal;
  font-weight: var(--font-weight-bold);
  font-size: calc(36 * (100vw/750));
  letter-spacing: 0.1em;
  line-height: 1.3333333333;
  text-align: center;
}
.main-area .product__feature--img {
  width: calc(400 * (100vw/750));
  margin: calc(13 * (100vw/750)) auto 0;
}
.main-area .product__feature--variation {
  font-family: var(--landing-font-proxima);
  font-style: normal;
  font-weight: var(--font-weight-semibold);
  font-size: calc(28 * (100vw/750));
  letter-spacing: 0.1em;
  margin: calc(12 * (100vw/750)) auto 0;
  text-align: center;
}
.main-area .product__feature--price {
  font-family: var(--landing-font-proxima);
  font-style: normal;
  font-weight: var(--font-weight-regular);
  font-size: calc(22 * (100vw/750));
  letter-spacing: 0.1em;
  margin: calc(13 * (100vw/750)) auto 0;
  text-align: center;
}

.main-area .product__model {
  margin: calc(82 * (100vw/750)) auto 0;
}
.main-area .product__model--img {
  margin: auto;
}
.main-area .product__model--content {
  width: calc(650 * (100vw/750));
  margin: calc(-35 * (100vw/750)) auto 0;
}
.main-area .product__model--headingen {
  color: var(--section-color);
  font-family: var(--landing-font-proxima);
  font-style: normal;
  font-weight: var(--font-weight-bold);
  display: flex;
  justify-content: flex-start;
  align-items: baseline;
  gap: calc(20 * (100vw/750));
  position: relative;
  padding-bottom: calc(28 * (100vw/750));
}
.main-area .product__model--headingen::before {
  width: calc(70 * (100vw/750));
  height: calc(4 * (100vw/750));
  background-color: var(--section-color);
  content: "";
  display: block;
  position: absolute;
  bottom: 0;
  left: 0;
}
.main-area .product__model--headingen .heading_small {
  font-size: calc(40 * (100vw/750));
  letter-spacing: 0.1em;
  line-height: 1;
}
.main-area .product__model--headingen .heading_middle {
  font-size: calc(80 * (100vw/750));
  letter-spacing: 0.1em;
  line-height: 1;
}
.main-area .product__model--headingjp {
  color: var(--landing-black);
  font-size: calc(36 * (100vw/750));
  font-weight: var(--font-weight-semibold);
  letter-spacing: 0.1em;
  line-height: 1.3888888889;
  margin-top: calc(43 * (100vw/750));
}
.main-area .product__model--desc {
  color: var(--landing-black);
  font-size: calc(26 * (100vw/750));
  letter-spacing: 0.1em;
  line-height: 1.5384615385;
  margin: calc(25 * (100vw/750)) auto 0;
}
.main-area .product__model--price {
  color: var(--landing-black);
  font-family: var(--landing-font-proxima);
  font-style: normal;
  font-weight: var(--font-weight-regular);
  font-size: calc(22 * (100vw/750));
  letter-spacing: 0.1em;
  margin: calc(30 * (100vw/750)) auto 0;
}
.main-area .product__model--price a {
  text-decoration: underline;
}
.main-area .product__models.grid {
  display: grid;
  gap: calc(80 * (100vw/750)) 0;
  margin: calc(82 * (100vw/750)) auto 0;
}
.main-area .model__img--xl {
  width: calc(690 * (100vw/750));
}
.main-area .model__img--l {
  width: calc(590 * (100vw/750));
}
.main-area .model__img--m {
  width: calc(480 * (100vw/750));
}
.main-area .model__img--s {
  width: calc(470 * (100vw/750));
}

.main-area .content1 {
  --section-color: var(--landing-brown);
  --section-bgcolor: var(--landing-lightbrown);
  position: relative;
}
.main-area .content1::before {
  width: 100%;
  height: calc(2527 * (100vw/750));
  background-color: var(--section-bgcolor);
  content: "";
  display: block;
  position: absolute;
  top: calc(690 * (100vw/750));
  left: 0;
  z-index: -1;
}
.main-area .content1 .grid {
  width: calc(690 * (100vw/750));
  grid-template-columns: calc(50 * (100vw/750)) calc(123 * (100vw/750)) calc(357 * (100vw/750)) calc(110 * (100vw/750)) calc(13 * (100vw/750)) calc(37 * (100vw/750));
  grid-template-rows: auto auto auto;
}
.main-area .content1 .grid .product__model--img:nth-of-type(1) {
  grid-area: 1/2/2/5;
}
.main-area .content1 .grid .product__model--img:nth-of-type(2) {
  grid-area: 2/3/3/6;
}
.main-area .content1 .grid .model__img--border {
  border: calc(4 * (100vw/750)) solid var(--landing-brown);
  box-sizing: border-box;
  grid-area: 3/1/4/4;
  padding: calc(26 * (100vw/750));
}
.main-area .content1 .grid .text-right {
  position: relative;
}
.main-area .content1 .grid .text-right::after {
  width: calc(20 * (100vw/750));
  height: calc(520 * (100vw/750));
  background-image: url(../img/model_img_03_text.svg);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
  content: "";
  display: block;
  position: absolute;
  top: calc(-8 * (100vw/750));
  right: calc(-37 * (100vw/750));
  z-index: 2;
}

.main-area .content2 {
  --section-color: var(--landing-darkblue);
  --section-bgcolor: var(--landing-lightblue);
  position: relative;
}
.main-area .content2::before {
  width: 100%;
  height: calc(2036 * (100vw/750));
  background-color: var(--section-bgcolor);
  content: "";
  display: block;
  position: absolute;
  top: calc(690 * (100vw/750));
  left: 0;
  z-index: -1;
}
.main-area .content2 .grid {
  width: calc(650 * (100vw/750));
}
.main-area .content2 .grid .model__img--border {
  width: max-content;
  border: calc(4 * (100vw/750)) solid var(--section-color);
  box-sizing: border-box;
  margin: 0 calc(17 * (100vw/750)) 0 auto;
  padding: calc(26 * (100vw/750));
  position: relative;
}
.main-area .content2 .grid .model__img--border::before {
  width: calc(20 * (100vw/750));
  height: calc(470 * (100vw/750));
  background-image: url(../img/model_img_07_text.svg);
  background-repeat: no-repeat;
  background-position: center center;
  background-size: contain;
  content: "";
  display: block;
  position: absolute;
  top: calc(-20 * (100vw/750));
  left: calc(-44 * (100vw/750));
  z-index: 2;
}

.main-area .content3 {
  --section-color: var(--landing-darkgray);
  --section-bgcolor: #E8E8E8;
  position: relative;
}
.main-area .content3::before {
  width: 100%;
  height: calc(2476 * (100vw/750));
  background-color: var(--section-bgcolor);
  content: "";
  display: block;
  position: absolute;
  top: calc(690 * (100vw/750));
  left: 0;
  z-index: -1;
}
.main-area .content3 .grid {
  width: calc(690 * (100vw/750));
  grid-template-columns: calc(50 * (100vw/750)) calc(123 * (100vw/750)) calc(357 * (100vw/750)) calc(123 * (100vw/750)) calc(37 * (100vw/750));
  grid-template-rows: auto auto auto;
}
.main-area .content3 .product__model--img:nth-of-type(1) {
  grid-area: 1/2/2/4;
}
.main-area .content3 .product__model--img:nth-of-type(2) {
  grid-area: 2/3/3/5;
}
.main-area .content3 .text-right {
  position: relative;
}
.main-area .content3 .text-right::before {
  width: calc(20 * (100vw/750));
  height: calc(408 * (100vw/750));
  background-image: url(../img/model_img_10_text.svg);
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center;
  content: "";
  display: block;
  position: absolute;
  top: calc(-8 * (100vw/750));
  right: calc(-38 * (100vw/750));
  z-index: 2;
}
.main-area .content3 .model__img--border {
  border: calc(4 * (100vw/750)) solid var(--section-color);
  grid-area: 3/1/4/4;
  padding: calc(26 * (100vw/750));
}

.main-area .product__linkarea {
  width: calc(520 * (100vw/750));
  margin: calc(120 * (100vw/750)) auto calc(240 * (100vw/750));
}
.main-area .product__linkarea .link {
  width: 100%;
  height: calc(100 * (100vw/750));
  border: calc(2 * (100vw/750)) solid var(--landing-black);
  display: grid;
  place-content: center;
  font-family: var(--roboto);
  font-weight: var(--font-weight-medium);
  font-size: calc(29 * (100vw/750));
  letter-spacing: 0.075em;
}
.main-area .product__linkarea .link:nth-of-type(n+2) {
  margin-top: calc(30 * (100vw/750));
}
.main-area .product__linkarea .link:hover {
  opacity: 1;
}
.main-area .product__linkarea .link__fill {
  background-color: var(--landing-black);
  color: var(--landing-white);
}

.mainvisual {
  width: 100%;
}

@media screen and (min-width: 768px) {
  .main-area .product__feature {
    margin: 8rem auto 0;
  }
  .main-area .product__feature:nth-of-type(3) {
    margin-top: 12rem;
  }
  .main-area .product__feature:nth-of-type(4) {
    margin-top: 9.8rem;
  }
  .main-area .product__feature--name {
    font-size: 2.4rem;
    line-height: 1.25;
  }
  .main-area .product__feature--img {
    width: 25rem;
    margin: 1rem auto 0;
  }
  .main-area .product__feature--variation {
    font-size: 1.8rem;
    margin: 1rem auto 0;
  }
  .main-area .product__feature--price {
    font-size: 1.2rem;
    margin: 0.5rem auto 0;
  }
  .main-area .product__model {
    width: 91rem;
    display: flex;
    justify-content: space-between;
    margin: 6rem auto 0;
    position: relative;
  }
  .main-area .product__model--content {
    width: auto;
    margin: 0;
    position: absolute;
    top: 8.5rem;
    z-index: 2;
  }
  .main-area .product__model--img {
    margin: 0;
  }
  .main-area .product__model--headingen {
    gap: 1.1rem;
    padding-bottom: 1.6rem;
  }
  .main-area .product__model--headingen::before {
    width: 4rem;
    height: 0.2rem;
  }
  .main-area .product__model--headingen .heading_small {
    font-size: 2.4rem;
  }
  .main-area .product__model--headingen .heading_middle {
    font-size: 4.8rem;
  }
  .main-area .product__model--headingjp {
    font-size: 2.4rem;
    margin-top: 2.5rem;
  }
  .main-area .product__model--desc {
    width: 32.7rem;
    font-size: 1.3rem;
    margin: 1.7rem 0 0;
  }
  .main-area .product__model--price {
    font-size: 1.2rem;
    margin: 5rem auto 0;
  }
  .main-area .model__img--xl {
    width: 52rem;
  }
  .main-area .model__img--l {
    width: 40rem;
  }
  .main-area .model__img--m {
    width: 31rem;
  }
  .main-area .model__img--s {
    width: 31rem;
  }
  .main-area .content1::before {
    height: 96rem;
    top: 48rem;
  }
  .main-area .content1 .grid {
    width: 84rem;
    grid-template-columns: 32.5rem 7.5rem 13rem 14.5rem 16.5rem;
    grid-template-rows: 6rem 40rem 4rem 4rem 44rem;
    gap: 0;
    margin: 8rem auto 0;
    transform: translateX(-8rem);
  }
  .main-area .content1 .grid .product__model--img:nth-of-type(1) {
    grid-area: 1/1/4/3;
  }
  .main-area .content1 .grid .product__model--img:nth-of-type(2) {
    grid-area: 2/4/3/6;
  }
  .main-area .content1 .grid .model__img--border {
    border-width: 0.2rem;
    grid-area: 5/2/6/5;
    padding: 1.8rem;
  }
  .main-area .content1 .grid .text-right::after {
    width: 1.3rem;
    height: 36rem;
    top: -1.6rem;
    right: -3rem;
  }
  .main-area .content1 .product__model {
    transform: translateX(4.5rem);
  }
  .main-area .content1 .product__model--content {
    left: 49rem;
  }
  .main-area .content2::before {
    height: 78rem;
    top: 48rem;
  }
  .main-area .content2 .product__model {
    justify-content: flex-end;
    transform: translateX(4.5rem);
  }
  .main-area .content2 .product__model--content {
    left: 7.5rem;
  }
  .main-area .content2 .product__models.grid {
    width: 83rem;
    gap: 0;
    grid-template-columns: 35rem 1fr 40rem;
    grid-template-rows: 18rem 32rem 12rem;
    margin-top: 8rem;
    transform: translateX(18.5rem);
  }
  .main-area .content2 .product__models .product__model--img:nth-of-type(1) {
    grid-area: 1/3/3/4;
  }
  .main-area .content2 .product__models .model__img--border {
    border-width: 0.2rem;
    grid-area: 2/1/4/2;
    padding: 1.8rem;
  }
  .main-area .content2 .product__models .model__img--border::before {
    width: 1.3rem;
    height: 32.5rem;
    left: -3rem;
    top: -2.5rem;
  }
  .main-area .content3::before {
    height: 116rem;
    top: 48rem;
  }
  .main-area .content3 .grid {
    width: 88rem;
    gap: 0;
    grid-template-columns: 24.5rem 21.5rem 11rem 18.5rem 12.5rem;
    grid-template-rows: 6rem 40rem 4rem 6rem 64rem;
    margin: 8.2rem auto 0;
    transform: translateX(-6rem);
  }
  .main-area .content3 .product__model {
    transform: translateX(4.5rem);
  }
  .main-area .content3 .product__model--img:nth-of-type(1) {
    grid-area: 1/1/4/3;
  }
  .main-area .content3 .product__model--img:nth-of-type(2) {
    grid-area: 2/4/3/6;
  }
  .main-area .content3 .product__model--content {
    left: 49rem;
  }
  .main-area .content3 .text-right::before {
    width: 1.4rem;
    height: 27.2rem;
    top: 0;
    right: -3rem;
  }
  .main-area .content3 .model__img--border {
    border-width: 0.2rem;
    grid-area: 5/2/6/5;
    padding: 2.8rem;
  }
  .main-area .content3 .model__img--s {
    width: 45rem;
  }
  .main-area .content3 .model__img--l {
    width: 46rem;
  }
  .main-area .product__linkarea {
    width: 25rem;
    margin: 8rem auto 10rem;
  }
  .main-area .product__linkarea .link {
    height: 4.8rem;
    border-width: 1px;
    font-size: 1.4rem;
    transition: background-color var(--landing-anim-dur), color var(--landing-anim-dur);
  }
  .main-area .product__linkarea .link:nth-of-type(n+2) {
    margin-top: 1rem;
  }
  .main-area .product__linkarea .link__outline:hover {
    background-color: var(--landing-black);
    color: var(--landing-white);
  }
  .main-area .product__linkarea .link__fill:hover {
    background-color: var(--landing-white);
    color: var(--landing-black);
  }
  .breadcrumb__list {
    padding-bottom: 1.6rem;
  }

  .mainvisual {
    width: 120rem;
    margin: auto;
  }
}
