@charset "UTF-8";

/* ========================================
  @media screen and (min-width: 768px),print
======================================== */
@media screen and (min-width: 768px), print {
  #modelhouse .system-contents {
    width: min(95%, 1125px);
    margin-inline: auto;
    margin-block: -59px 0;
    padding-block: 0 80px;
  }

  #modelhouse .system-list {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 81px 0;
  }

  #modelhouse .icon {
    color: #fff;
    font-size: 14px;
    line-height: 1;
    letter-spacing: 0.05em;
    font-weight: 500;
    width: fit-content;
    padding: 7px 18px;
    margin-inline: 12px 0;
    margin-bottom: 14px;
  }

  #modelhouse .icon.icon01 {
    border-top: 11px solid #090909;
    background: #333333;
  }

  #modelhouse .icon.icon02 {
    border-top: 11px solid #1D1104;
    background: #482b0b;
  }

  #modelhouse .icon.icon03 {
    border-top: 11px solid #505d0e;
    background: #889e14;
  }

  #modelhouse .modelhouse_img {
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-template-rows: repeat(4, 1fr);
    gap: 12px 12px;
    margin-bottom: 18px;
  }

  #modelhouse .system-pic {
    grid-area: 1 / 1 / 5 / 4;
    margin-bottom: 0;
  }

  #modelhouse .system-pic img {
    width: 100%;
    height: 442px;
  }

  #modelhouse .system-i-pic {
    grid-area: 1 / 1 / 5 / 4;
    margin-bottom: 0;
  }

  #modelhouse .system-i-pic img {
    width: 100%;
    height: 442px;
    object-fit: cover;
    object-position: center;
  }

  #modelhouse .system-img.top {
    grid-area: 1 / 4 / 3 / 6;
  }

  #modelhouse .system-img.bottom {
    grid-area: 3 / 4 / 5 / 6;
  }

  #modelhouse .system-img img {
    width: 100%;
    height: 215px;
    object-fit: cover;
  }

  #modelhouse .system-ttl {
    font-size: 18px;
    line-height: 1.6;
    letter-spacing: 0.05em;
    font-weight: 500;
    margin-bottom: 13px;
    padding-inline: 13px 0;
  }

  #modelhouse .text-box {
    color: #9c9c9c;
    font-size: 14px;
    line-height: 1.6;
    letter-spacing: 0.05em;
    font-weight: 400;
    display: flex;
    gap: 0 23px;
    padding-inline: 13px 0;
  }

  #modelhouse .text-box.is-single {
    margin-bottom: 123px;
  }

  #modelhouse .text-box .wrap {
    display: flex;
    gap: 0 16px;
  }

  #modelhouse .system-time {
  }

  #modelhouse .system-place {
  }

  #modelhouse .modelhouse_concept {
    margin-bottom: 120px;
  }

  #modelhouse .modelhouse_concept_en {
    text-align: center;
    margin-bottom: 6px;
  }

  #modelhouse .modelhouse_concept_ttl {
    text-align: center;
    font-size: 16px;
    line-height: 1;
    letter-spacing: 0.05em;
    font-weight: 500;
    margin-bottom: 45px;
  }

  #modelhouse .modelhouse_concept_txt {
    width: min(95%, 740px);
    margin-inline: auto;
    font-size: 18px;
    line-height: 1.5;
    letter-spacing: 0.05em;
    font-weight: 400;
    margin-bottom: 46px;
  }

  #modelhouse .modelhouse-point {
    width: min(95%, 700px);
    margin-inline: auto;
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 28px 0;
  }

  #modelhouse .modelhouse-point__item {
    display: grid;
    grid-template-columns: 300px minmax(0, 1fr);
    gap: 0 28px;
  }

  #modelhouse .modelhouse-point__img img {
    width: 100%;
    height: 180px;
    object-fit: cover;
  }

  #modelhouse .modelhouse-point__body {
  }

  #modelhouse .modelhouse-point__title {
    font-size: 16px;
    line-height: 1.625;
    letter-spacing: 0.05em;
    font-weight: 600;
    margin-bottom: 7px;
  }

  #modelhouse .modelhouse-point__txt {
    color: #9c9c9c;
    font-size: 14px;
    line-height: 1.7;
    letter-spacing: 0.05em;
    font-weight: 400;
  }

  #modelhouse .wysiwyg {
    margin-bottom: 40px;
  }

  #modelhouse .modelhouse-spec {
    width: min(95%, 742px);
    margin-inline: auto;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0 10px;
    margin-bottom: 67px;
  }

  #modelhouse .modelhouse-spec__item {
    background: #eae7e3;
    padding-block: 24px 27px;
    text-align: center;
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 0px 0;
  }

  #modelhouse .modelhouse-spec__label {
    font-size: 14px;
    line-height: 2;
    letter-spacing: 0.05em;
    font-weight: 600;
  }

  #modelhouse .modelhouse-spec__value {
    font-size: 14px;
    line-height: 2;
    letter-spacing: 0.05em;
    font-weight: 600;
  }

  #modelhouse .modelhouse-gallery {
    width: min(95%, 1056px);
    margin-inline: auto;
  }

  #modelhouse .modelhouse_concept_en {
    text-align: center;
    margin-bottom: 12px;
  }

  #modelhouse .modelhouse_concept_ttl {
    font-size: 16px;
    line-height: 1;
    letter-spacing: 0.05em;
    font-weight: 500;
    margin-bottom: 45px;
  }

  #modelhouse .gallery-list {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 14px;
    margin-bottom: 49px;
  }

  #modelhouse .gallery-list li a img {
    width: 100%;
    height: 112px;
  }

  #modelhouse .modelhouse-link {
    text-align: center;
    margin-bottom: 120px;
  }

  #modelhouse .modelhouse-link a {
    font-size: 16px;
    line-height: 1;
    letter-spacing: 0.05em;
    font-weight: 500;
    border-bottom: 1px solid #090909;
  }

  #modelhouse .form-Box {
    padding-block: 119px 0;
  }
}
/* ========================================
  @media screen and (max-width: 767px)
======================================== */
@media screen and (max-width: 767px) {
  #modelhouse .system-contents {
    width: min(95%,89.3vw);
    margin-inline: auto;
    margin-block: 2vw 0;
  }

  #modelhouse .system-list {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 14.976vw 0;
  }

  #modelhouse .icon {
    color: #fff;
    font-size: 3.382vw;
    line-height: 1;
    letter-spacing: 0.05em;
    font-weight: 500;
    width: fit-content;
    padding: 1.691vw 4.348vw;
    margin-inline: -1.068vw 0;
    margin-bottom: 3.382vw;
  }

  #modelhouse .icon.icon01 {
    border-top: 11px solid #090909;
    background: #333333;
  }

  #modelhouse .icon.icon02 {
    border-top: 11px solid #1D1104;
    background: #482b0b;
  }

  #modelhouse .icon.icon03 {
    border-top: 11px solid #505d0e;
    background: #889e14;
  }

  #modelhouse .modelhouse_img {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(3, 1fr);
    gap: 1.449vw;
    margin-bottom: 1.348vw;
  }

  #modelhouse .system-pic {
    grid-area: 1 / 1 / 3 / 3;
    margin-bottom: 0;
  }

  #modelhouse .system-i-pic {
    grid-area: 1 / 1 / 3 / 3;
    margin-bottom: 0;
  }

  #modelhouse .system-i-pic img {
    width: 100%;
    height: 62.802vw;
    object-fit: cover;
  }

  #modelhouse .system-pic img {
    width: 100%;
    height: 62.802vw;
  }

  #modelhouse .system-img.top {
    grid-area: 3 / 1 / 4 / 2;
    height: 24.638vw;
  }

  #modelhouse .system-img.bottom {
    grid-area: 3 / 2 / 4 / 3;
  }

  #modelhouse .system-img img {
    width: 100%;
    height: 24.638vw;
    object-fit: cover;
  }

  #modelhouse .system-ttl {
    font-size: 3.865vw;
    line-height: 1.6;
    letter-spacing: 0.05em;
    font-weight: 500;
    margin-bottom: 3.763vw;
  }

  #modelhouse .text-box {
    color: #9c9c9c;
    font-size: 3.382vw;
    line-height: 1.6;
    letter-spacing: 0.05em;
    font-weight: 400;
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 3.382vw 0;
  }

  #modelhouse .text-box.is-single {
    margin-bottom: 18.401vw;
    gap: 2vw 0;
  }

  #modelhouse .text-box .wrap {
    display: flex;
    gap: 0 3.865vw;
  }

  #modelhouse .system-time {
  }

  #modelhouse .system-place {
  }

  #modelhouse .modelhouse_concept {
    margin-bottom: 28.986vw;
  }

  #modelhouse .modelhouse_concept_en {
    text-align: center;
    margin-bottom: 1.449vw;
  }

  #modelhouse .modelhouse_concept_en img {
    width: 29.952vw;
    height: auto;
  }

  #modelhouse .modelhouse_concept_ttl {
    text-align: center;
    font-size: 3.382vw;
    line-height: 1;
    letter-spacing: 0.05em;
    font-weight: 500;
    margin-bottom: 10.87vw;
  }

  #modelhouse .modelhouse_concept_txt {
    width: min(95%, 86.9vw);
    margin-inline: auto;
    font-size: 3.623vw;
    line-height: 1.8;
    letter-spacing: 0.05em;
    font-weight: 400;
    margin-bottom: 9.56vw;
  }

  #modelhouse .modelhouse-point {
    width: min(95%, 86.9vw);
    margin-inline: auto;
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 8.763vw 0;
  }

  #modelhouse .modelhouse-point__item {
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: 5.797vw 0;
  }

  #modelhouse .modelhouse-point__img img {
    width: 100%;
    height: 43.478vw;
    object-fit: cover;
  }

  #modelhouse .modelhouse-point__body {
  }

  #modelhouse .modelhouse-point__title {
    font-size: 3.865vw;
    line-height: 1.625;
    letter-spacing: 0.05em;
    font-weight: 600;
    margin-bottom: 3.865vw;
  }

  #modelhouse .modelhouse-point__txt {
    color: #9c9c9c;
    font-size: 3.382vw;
    line-height: 1.7;
    letter-spacing: 0.05em;
    font-weight: 400;
  }

  #modelhouse .wysiwyg {
    margin-bottom: 6.729vw;
  }

  #modelhouse .modelhouse-spec {
    width: min(100%, 94.9vw);
    margin-inline: auto;
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 2.415vw;
    margin-bottom: 21.184vw;
  }

  #modelhouse .modelhouse-spec__item {
    background: #eae7e3;
    padding-block: 6.213vw 5.488vw;
    text-align: center;
    display: grid;
    grid-template-columns: repeat(1, minmax(0, 1fr));
    gap: -0.101vw 0;
  }

  #modelhouse .modelhouse-spec__label {
    font-size: 3.382vw;
    line-height: 2;
    letter-spacing: 0.05em;
    font-weight: 600;
  }

  #modelhouse .modelhouse-spec__value {
    font-size: 3.382vw;
    line-height: 2;
    letter-spacing: 0.05em;
    font-weight: 600;
  }

  #modelhouse .modelhouse-gallery {
    width: min(95%, 86.9vw);
    margin-inline: auto;
    margin-bottom: 7.493vw;
  }

  #modelhouse .modelhouse_concept_en {
    text-align: center;
    margin-bottom: 2.449vw;
  }

  #modelhouse .modelhouse_concept_en img {
    width: 27.952vw;
    height: auto;
  }

  #modelhouse .modelhouse_concept_ttl {
    font-size: 3.382vw;
    line-height: 1;
    letter-spacing: 0.05em;
    font-weight: 500;
    margin-bottom: 5.87vw;
  }

  #modelhouse .gallery-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 3.382vw;
    margin-bottom: 0vw;
  }

  #modelhouse .gallery-list li a img {
    width: 100%;
    height: 24.155vw;
  }

  #modelhouse .modelhouse-link {
    text-align: center;
    margin-bottom: 8.986vw;
  }

  #modelhouse .modelhouse-link a {
    font-size: 3.382vw;
    line-height: 1;
    letter-spacing: 0.05em;
    font-weight: 500;
    border-bottom: 1px solid #090909;
  }

  #modelhouse .form-Box {
    padding-block: 9.155vw 0;
    margin-bottom: -14.633vw;
  }
}
