@charset "UTF-8";
/*------------------------------------------------------------
	index
------------------------------------------------------------*/
/* #main {
} */
#main .bgBox {
  background-color: rgba(232, 212, 162, 0.2);
}

#main .lineUp {
  font-family: "游ゴシック", "游ゴシック体", "Yu Gothic", YuGothic, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

#main .lineUp a:hover img {
  opacity: 0.7;
}

#main .lineUp .mainBox {
  max-width: 805px;
  padding-right: 5px;
  box-sizing: border-box;
}

#main .comTtlBox {
  padding: 39px 0 15px;
}

#main .headLine01 {
  text-align: center;
}

#main .headLine01 > span {
  display: inline-block;
  position: relative;
}

#main .headLine01 > span .subPhoto {
  position: absolute;
  bottom: -10px;
  right: -155px;
}

#main .house {
  padding: 30px 0 57px;
}

#main .smallTxt {
  margin-bottom: 5px;
  font-size: 1.6rem;
  color: #483a34;
  letter-spacing: 0.2em;
  text-align: center;
  font-weight: 500;
}

#main .h3Ttl {
  margin-bottom: 47px;
  text-align: center;
  color: rgba(236, 109, 101, 0.7);
  font-size: 3.7rem;
  font-weight: 700;
  letter-spacing: 0.2em;
}

#main .h3Ttl span {
  min-height: 71px;
  display: inline-block;
  min-width: 359px;
  padding: 3px 0 12px 40px;
  box-sizing: border-box;
  background: url(../img/lineup/bg.webp) no-repeat left bottom;
  background-size: 359px auto;
}

#main .ttlBox {
  margin-bottom: 51px;
  position: relative;
}

#main .ttlBox h4 {
  max-width: 805px;
  margin: 0 auto;
  padding: 16px 20px;
  text-align: center;
  font-size: 2.3rem;
  font-weight: 700;
  color: #483a34;
  letter-spacing: 0.2em;
  position: relative;
  z-index: 1;
}

#main .ttlBox::before {
  width: calc(50% + 480px);
  height: 100%;
  background-color: #f9d0c3;
  position: absolute;
  top: 0;
  left: 0;
  content: "";
}

#main .ttlBox::after {
  width: 27px;
  height: 100%;
  background: url(../img/lineup/bg02.webp) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: calc(50% + 477px);
  content: "";
}

#main .ttlBox h4 .txtImg {
  width: 121px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 22px;
}

#main .imgBox {
  margin-bottom: 20px;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
}

#main .imgBox .photoBox {
  width: 48.8%;
  margin-right: 17px;
}

#main .imgBox .photoBox img {
  width: 100%;
}

#main .imgBox .textBox {
  order: 2;
  text-align: center;
  flex: 1;
  margin-top: -32px;
}

#main .photoUl {
  margin-bottom: 10px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

#main .photoUl li {
  width: 48.8%;
  margin-bottom: 10px;
}

#main .photoUl li img {
  width: 100%;
}

#main .photoUl02 {
  margin-bottom: 30px;
  display: flex;
  flex-wrap: wrap;
}

#main .photoUl02:last-child {
  margin-bottom: 0;
}

#main .photoUl02 li {
  width: 31.8%;
  margin: 0 2.3% 10px 0;
}

#main .photoUl02 li:nth-child(3n) {
  margin-right: 0;
}

#main .photoUl02 li img {
  width: 100%;
}

#main .photoUl03 {
  margin: 0 0 20px 30px;
  display: flex;
  justify-content: center;
}

#main .photoUl03 li {
  width: 38%;
  text-align: center;
  margin: 0 0 10px;
}

#main .photoUl03 a {
  display: inline-block;
  text-align: left;
}

#main .photoUl03 a .txtSpan {
  margin-left: 13px;
  display: block;
  font-size: 2rem;
  font-weight: 700;
  color: #000;
  letter-spacing: 0.02em;
}

#main .infoUl {
  margin-bottom: 22px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

#main .infoUl li {
  margin-bottom: 34px;
  padding: 27px 0 25px;
  width: 48.9%;
  box-sizing: border-box;
  position: relative;
  border: 2px solid #483a34;
}

#main .infoUl li .sub {
  padding: 0 20px 0 45px;
  position: relative;
  z-index: 1;
}

#main .infoUl li .sub::before {
  width: 12px;
  background-color: #fad9ca;
  position: absolute;
  top: 10px;
  left: 0;
  bottom: 4px;
  content: "";
}

#main .infoUl .li02 .sub::before {
  background-color: #d3edfb;
}

#main .infoUl .li03 .sub::before {
  background-color: #d5ebe1;
}

#main .infoUl .li04 .sub::before {
  background-color: #f6e3ae;
}

#main .infoUl li:after {
  width: 59px;
  height: 56px;
  background: url(../img/lineup/bg03.webp) no-repeat;
  background-size: 100% auto;
  position: absolute;
  top: -2px;
  right: -2px;
  content: "";
}

#main .infoUl li .num {
  position: absolute;
  top: -27px;
  left: 35px;
  font-size: 3.2rem;
  color: #483a34;
  letter-spacing: 0.04em;
  line-height: 1;
  font-weight: 700;
  padding: 10px;
  background-color: #fff;
}

#main .infoUl li p {
  font-size: 1.6rem;
  color: #483a34;
  letter-spacing: 0.03em;
  line-height: 1.67;
  font-weight: 500;
}

#main .infoUl li .ttl {
  font-size: 2rem;
  font-weight: 700;
  letter-spacing: 0.1em;
  margin-bottom: 13px;
  font-feature-settings: "palt";
}

#main .structure .bgBox {
  padding: 67px 0 85px;
}

#main .structure .h3Ttl {
  color: #ec6d65;
}

#main .structure .h3Ttl span {
  padding-left: 50px;
}

#main .structure .point {
  padding-top: 12px;
}

#main .whiteBox {
  margin-bottom: 30px;
  padding: 46px 30px 44px;
  border-radius: 10px;
  background-color: #fff;
  position: relative;
  /* box-shadow: 0 0 8px rgba(0, 0, 0, 0.2); */
  box-shadow: 11px 10px 0px rgba(212, 175, 81, 0.2);
}

#main .whiteBox:last-child {
  margin-bottom: 0;
}

#main .whiteBox02 {
  padding-bottom: 30px;
}

#main .whiteBox .txtImg {
  position: absolute;
  top: 0;
  left: 22px;
  width: 185px;
}

#main .point .inner {
  margin-bottom: 15px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

#main .point .inner:last-child {
  margin-bottom: 0;
}

#main .point .inner .photoBox {
  width: 38%;
  text-align: center;
  order: 2;
  margin-left: 37px;
}

#main .point .inner .textBox {
  padding-top: 44px;
  flex: 1;
}

#main .point p {
  margin-bottom: 23px;
  font-size: 1.5rem;
  color: #603b33;
  font-weight: 500;
  letter-spacing: 0.03em;
  line-height: 2.11;
  font-feature-settings: "palt";
  text-align: justify;
}

#main .point p:last-child {
  margin-bottom: 0;
}

#main .point h4 {
  margin-bottom: 7px;
  font-size: 2.5rem;
  font-weight: 700;
  color: #ec6d65;
  letter-spacing: 0.02em;
}

#main .point h5 {
  font-size: 1.9rem;
  color: #ec6d65;
  letter-spacing: 0.02em;
  font-weight: 500;
}

#main .point .inner02 .photoBox {
  width: 44%;
  padding-top: 44px;
  /* margin-left: -10px; */
}

#main .point .inner02 p {
  letter-spacing: 0;
}

#main .point .photoUl02 {
  margin: 30px 0 -20px;
}

#main .point .inner03 {
  align-items: center;
}

#main .point .inner03 .photoBox {
  width: 52%;
  margin: 65px -20px 0 10px;
}

#main .point .inner04 p {
  margin-bottom: 0;
}

#main .point .textList {
  font-size: 1.5rem;
  color: #603b33;
  letter-spacing: 0.03em;
  line-height: 2.11;
  font-weight: 500;
}

#main .point .textList li {
  text-indent: -1em;
  padding-left: 1em;
}

#main .point .inner04 .photoBox {
  width: 42%;
  margin: 0 10px 0 55px;
}

#main .point .inner04 .photo {
  margin-bottom: 8px;
}

#main .point .inner04 .photo:last-child {
  margin-bottom: 0;
}

#main .point .inner04 .photo span {
  margin-top: 2px;
  display: block;
  font-size: 1.5rem;
  color: #603b33;
  letter-spacing: 0.03em;
  font-weight: 500;
  font-feature-settings: "palt";
}

#main .point .inner05 {
  /* align-items: center; */
}

#main .point .inner05 .photoBox {
  width: 40%;
  margin: 80px 10px 0 75px;
}

#main .point .tableBox {
  margin-bottom: 7px;
  border: 1px solid #603b33;
}

#main .point table {
  width: 100%;
  border-collapse: collapse;
  word-break: break-all;
  font-feature-settings: "palt";
}

#main .point table th {
  text-align: center;
  padding: 4px 1px;
  font-size: 1.6rem;
  color: #603b33;
  letter-spacing: 0.1em;
  line-height: 1.1;
  font-weight: 500;
  background-color: #ececed;
  border: 1px solid #603b33;
}

#main .point table .wid01 {
  width: 16%;
}

#main .point table .wid03 {
  width: 22.5%;
}

#main .point table td {
  text-align: center;
  padding: 5px 1px 6px;
  font-size: 1.6rem;
  color: #603b33;
  letter-spacing: 0.1em;
  line-height: 1.1;
  font-weight: 500;
  background-color: #fff;
  border: 1px solid #603b33;
}

/* #main .point table td:last-child {
  text-align: left;
  padding-left: 12px;
} */
#main .point table .trStyle td {
  background-color: #fbe5d7;
}

#main .point table td:nth-child(2) {
  text-align: left;
  padding-left: 13px;
}

#main .point .inner06 h4 {
  margin-right: -60px;
}

#main .point .rBox {
  width: 50.5%;
  /* margin: 98px 15px 0 60px; */
  margin: 98px 0px 0 15px;
}

#main .point .rBox p {
  margin-left: -5px;
  font-size: 1.2rem;
  color: #231815;
  letter-spacing: 0.02em;
  font-weight: 500;
  font-feature-settings: "palt";
}

#main .point .rBox .txt {
  font-size: 1.6rem;
  font-weight: 500;
  letter-spacing: 0.02em;
  color: #603b33;
  text-align: left;
}

#main .point .rBox .txt > span {
  margin-bottom: 5px;
  display: block;
  font-size: 2.4rem;
  letter-spacing: 0.02em;
  color: #ec6d65;
  line-height: 1;
  font-feature-settings: "palt";
}

#main .point .rBox .txtSpan {
  margin-top: 12px;
  display: block;
  /* font-size: 3.1rem; */
  font-size: 2.1rem;
  line-height: 1.2;
}

#main .point .inner07 {
  align-items: center;
}

#main .point .inner07 .photoBox {
  width: 49%;
  margin: 34px 1px 0 10px;
}

#main .point .inner08 {
  align-items: center;
}

#main .point .inner08 .photoBox {
  width: 50%;
  margin: 0 -6px -15px 15px;
}

#main .point .flooring {
  padding-top: 10px;
  margin-bottom: -10px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}

#main .point .flooring .lBox {
  width: 50.2%;
}

#main .point .flooring .photoBox {
  width: 46.2%;
}

#main .point .flooring .photoBox img {
  width: 100%;
}

#main .point .flooring table th {
  padding: 3px 1px;
  line-height: 1.4375;
}

#main .point .flooring table td {
  padding: 3px 10px 3px 18px;
  line-height: 1.4375;
}

#main .point .flooring table th:first-child {
  width: 25%;
  background-color: #eae1d8;
}

#main .point .inner09 .photoBox {
  width: 45%;
}

@media all and (min-width: 897px) {
  .comTtlBox .bg01 {
    top: 23px;
  }
  .comTtlBox .bg02 {
    top: 23px;
    right: -40px;
  }
  .headLine01 {
    margin-bottom: 30px;
  }
  .pinkLink02 a {
    padding: 0 0 0 5px;
    justify-content: center;
    background-color: #f09082;
    border-color: #f09082;
    background-image: none;
    background-position: left 20px center;
  }
  .greenLink02 a {
    padding: 0 0 0 5px;
    justify-content: center;
    background-color: #64c0ab;
    border-color: #64c0ab;
    background-image: none;
    background-position: left 20px center;
  }
  .pinkLink02 .subSpan {
    min-width: 300px;
    padding: 0 0 0 50px;
    display: block;
    text-align: center;
    background: url(../img/common/com_img01.webp) no-repeat left center;
    background-size: 38px auto;
  }
  .greenLink02 .subSpan {
    min-width: 300px;
    padding: 0 0 0 50px;
    display: block;
    text-align: center;
    background: url(../img/common/com_img01.webp) no-repeat left center;
    background-size: 38px auto;
  }
  .pinkLink02 a:hover {
    color: #f09082;
  }
  .pinkLink02 a:hover {
    color: #64c0ab;
    border-color: #64c0ab;
  }
}
@media all and (max-width: 896px) {
  #gHeader {
    margin-bottom: 0;
  }
  .comTtlBox .bg01 {
    left: -120px;
  }
  .comTtlBox .bg02 {
    right: -130px;
  }
  #main .comTtlBox {
    padding: 23px 0 10px;
  }
  #main .headLine01 > span .subPhoto {
    width: 80px;
    right: -85px;
    bottom: 0;
  }
  #main .house {
    padding: 18px 0 30px;
  }
  #main .smallTxt {
    margin-bottom: 3px;
    font-size: 1rem;
  }
  #main .h3Ttl {
    margin-bottom: 21px;
    font-size: 1.7rem;
  }
  #main .h3Ttl span {
    min-height: inherit;
    min-width: 154px;
    padding: 3px 10px 6px 40px;
    background-image: url(../img/lineup/bg_sp.webp);
    background-size: 154px auto;
    min-width: inherit;
  }
  #main .ttlBox h4 {
    padding: 7px 20px;
    max-width: inherit;
    font-size: 1.4rem;
  }
  #main .ttlBox::before {
    width: calc(100% - 53px);
  }
  #main .ttlBox::after {
    width: 15px;
    left: calc(100% - 53px);
  }
  #main .ttlBox h4 .txtImg {
    width: 61px;
    left: 30px;
  }
  #main .ttlBox {
    margin-bottom: 21px;
  }
  #main .lineUp .mainBox {
    max-width: inherit;
    padding: 0 40px;
  }
  #main .lineUp .spPhoto {
    margin-bottom: 17px;
  }
  #main .lineUp .spPhoto img {
    width: 100%;
  }
  #main .imgBox {
    margin-bottom: 10px;
    display: block;
  }
  #main .imgBox .photoBox {
    width: auto;
    margin: 0;
  }
  #main .imgBox .photoBox img {
    width: 100%;
  }
  #main .imgBox .textBox {
    margin: 0 43px 28px;
  }
  #main .photoUl {
    display: block;
  }
  #main .photoUl li {
    width: auto;
  }
  #main .photoUl02 li {
    width: 31%;
    margin-right: 3.5%;
  }
  #main .photoUl03 {
    margin: 0 0 38px;
    display: block;
    text-align: center;
  }
  #main .photoUl03 li {
    width: auto;
    margin: 0 40px 15px;
  }
  #main .photoUl03 .liStyle {
    margin-left: 65px;
    margin-right: 65px;
  }
  #main .photoUl02 {
    margin-bottom: 17px;
  }
  #main .photoUl03 a .txtSpan {
    font-size: 1.5rem;
    margin-left: 10px;
  }
  #main .infoUl {
    margin-bottom: 27px;
    display: block;
  }
  #main .infoUl li {
    padding: 17px 0 10px;
    width: auto;
    margin: 0 0 24px;
    min-height: 138px;
    box-sizing: border-box;
  }
  #main .infoUl li .num {
    font-size: 2.4rem;
    top: -23px;
    left: 25px;
    padding: 10px 6px;
  }
  #main .infoUl li .sub {
    padding: 4px 10px 0 32px;
    min-height: 99px;
  }
  #main .infoUl li .sub::before {
    width: 8px;
  }
  #main .infoUl li p {
    font-size: 1.2rem;
    line-height: 1.67;
  }
  #main .infoUl li .ttl {
    margin-bottom: 10px;
    font-size: 1.5rem;
  }
  #main .infoUl li::after {
    width: 45px;
    height: 45px;
  }
  #main .greenBtn a .subSpan {
    transform: translateX(0);
  }
  #main .structure .bgBox {
    padding: 20px 0;
  }
  #main .structure .h3Ttl {
    margin-bottom: 15px;
  }
  #main .structure .h3Ttl span {
    padding-left: 35px;
  }
  #main .whiteBox {
    margin-bottom: 22px;
    border-radius: 0;
    padding: 62px 15px 25px;
  }
  #main .whiteBox .txtImg {
    left: 50%;
    width: 123px;
    top: 6px;
    transform: translateX(-50%);
  }
  #main .point .inner {
    display: block;
  }
  #main .point .inner .textBox {
    padding: 0 0 15px;
  }
  #main .point .inner .photoBox {
    width: auto;
    margin: 0;
  }
  #main .point .inner .photoBox img {
    width: 100%;
  }
  #main .point p {
    margin-bottom: 20px;
    font-size: 1.4rem;
    letter-spacing: 0;
    line-height: 1.63;
  }
  #main .point h4 {
    margin-right: 10px;
    margin-bottom: 9px;
    line-height: 1.52;
    font-size: 1.5rem;
  }
  #main .point .inner06 h4 {
    margin-right: 10px;
  }
  #main .point .inner01 .photoBox {
    margin: 0 63px;
  }
  #main .point .spH4 {
    margin-bottom: 0;
  }
  .pinkLink02 a {
    background-color: #f09082;
  }
  .greenLink02 a {
    background-color: #64c0ab;
  }
  #main .point h5 {
    font-size: 1.4rem;
    letter-spacing: 0.02em;
    line-height: 1.52;
  }
  #main .point .inner02 .photoBox {
    margin: 0 50px;
    padding-top: 0;
  }
  #main .point .photoUl02 {
    margin: 0px 0 0;
    display: block;
  }
  #main .point .photoUl02 li {
    width: auto;
    margin: 0 0 10px;
  }
  #main .point .photoUl02 li:last-child {
    margin-bottom: 0;
  }
  /* #main .whiteBox02 {
    padding-bottom: 15px;
  } */
  #main .point .textList {
    font-size: 1.4rem;
    line-height: 1.63;
  }
  #main .point .inner04 .photo span {
    margin-left: -10px;
    margin-right: -10px;
    font-size: 1.2rem;
  }
  #main .point .inner04 .photo02 {
    margin: 0 35px;
  }
  /* #main .point .inner05 {
    align-items: center;
  } */
  #main .point .inner05 .photoBox {
    margin: 0 8px 0 40px;
  }
  #main .point .rBox {
    width: auto;
    margin: 0;
  }
  #main .point table th {
    font-size: 1.3rem;
    letter-spacing: 0.1em;
    line-height: 1.2;
    padding: 2px 1px;
  }
  #main .point table td {
    font-size: 1.3rem;
    letter-spacing: 0.1em;
    padding: 5px 1px 5px;
  }
  #main .point .rBox p {
    margin: 0 0 18px;
    font-size: 1.1rem;
  }
  #main .point .tableBox {
    margin-bottom: 10px;
  }
  #main .point .rBox .txt {
    margin-bottom: 5px;
    font-size: 1.2rem;
  }
  #main .point .rBox .txt > span {
    font-size: 1.8rem;
  }
  #main .point .rBox .txtSpan {
    font-size: 1.6rem;
    /* font-size: 2.3rem; */
    margin-top: 10px;
  }
  #main .point .inner08 .photoBox02 {
    margin: 0 5px;
  }
  #main .point .flooring {
    padding: 0;
    display: block;
    margin: -15px 0 0;
  }
  #main .point .flooring .lBox {
    width: auto;
  }
  #main .point .flooring table th {
    font-size: 1.2rem;
    padding: 2px 1px;
    line-height: 1.33;
  }
  #main .point .flooring table td {
    font-size: 1.2rem;
    padding: 2px 10px 3px 10px;
    line-height: 1.33;
  }
  #main .point .flooring .tableBox {
    margin-bottom: 13px;
  }
  #main .point .flooring .photoBox {
    width: auto;
  }
  #main .point .inner09 .photoBox {
    width: 100%;
    /* margin: 0 67px; */
  }
}
@media all and (max-width: 374px) {
  #main .point .flooring table th:first-child {
    width: 28%;
  }
}
@media all and (min-width: 897px) and (max-width: 1100px) {
  .comTtlBox .bg02 {
    right: -10px;
  }
  #main .ttlBox::before {
    width: calc(50% + 390px);
  }
  #main .ttlBox::after {
    left: calc(50% + 387px);
  }
}
/*------------------------------------------------------------
	矢野追記
------------------------------------------------------------*/
/*-------------------------
	ラインナップ 共通
-------------------------*/
/* 見出しサブ */
.ttlsub {
  text-align: center;
  margin: 50px 0;
}

.ttlsub P {
  font-size: 2.1rem;
  font-weight: 600;
  color: #f28a75;
}

/* 間取り図 */
#main .photoUl03 {
  margin: 0 0 20px 0px;
}

/* 資料請求ボタン */
.materials {
  width: 80%;
  margin: 0 auto;
}

.materials a img:hover {
  transition-duration: 0.3s;
  z-index: 9999;
  transform: translate(5px, 5px);
}

/* ルビをふったための余白調整 */
#main .ttlBox h4 {
  padding: 20px 20px 10px;
}

/* 企画住宅 名前 ルビ */
ruby > rt {
  letter-spacing: -1.6em;
  padding-left: 2em;
}

@media all and (max-width: 896px) {
  .ttlsub {
    margin: 30px 0;
  }
  .ttlsub P {
    font-size: 1.4rem;
  }
  /* 間取り図 中央寄せ */
  #main .photoUl03 {
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .materials {
    width: 100%;
  }
  /* ルビをふったための調整 */
  #main .ttlBox h4 {
    padding: 11px 20px 5px;
  }
}
/*-------------------------
	ラインナップ1 select
-------------------------*/
/* Select A 共通*/
#main .select .house_a .photoUl03 {
  align-items: flex-end;
}

#main .select .house_a .photoUl03 li:nth-child(2) {
  width: 30%;
}

#main .select .photoUl03 li:first-child a .txtSpan {
  margin-left: 47px;
}

#main .select .photoUl03 li:nth-child(2) a .txtSpan {
  margin-top: 27px;
}

@media all and (max-width: 896px) {
  #main .select .photoUl03 li:first-child a .txtSpan {
    margin-left: 38px;
  }
  #main .select .house_a .photoUl03 {
    align-items: center;
  }
}
/* Select A */
#main .select .h3Ttl {
  color: #95c8cd;
}

#main .select .h3Ttl span {
  background: url(../img/lineup01/bg.webp) no-repeat left bottom;
  background-size: 359px auto;
}

#main .select .house_a .ttlBox::before {
  background-color: #96c8cd;
}

#main .select .house_a .ttlBox::after {
  width: 27px;
  height: 100%;
  background: url(../img/lineup01/bg02-1.webp) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: calc(50% + 477px);
  content: "";
}

#main .select .house_a .ttlsub p {
  color: #63b2c0;
}

@media all and (max-width: 896px) {
  #main .select .house_a .photoUl03 li:nth-child(2) {
    width: 57%;
  }
}
/* Select B */
#main .select .house_b .ttlBox::before {
  background-color: #fff2ad;
}

#main .select .house_b .ttlBox::after {
  width: 27px;
  height: 100%;
  background: url(../img/lineup01/bg02-3.webp) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: calc(50% + 477px);
  content: "";
}

#main .select .house_b .ttlsub p {
  color: #e1ab35;
}

#main .select .house_b .photoUl03 li:nth-child(2) {
  width: 36%;
}

#main .select .house_b .photoUl03 li:first-child a .txtSpan {
  margin-left: 30px;
}

#main .select .house_b .photoUl03 li:nth-child(2) a .txtSpan {
  margin-top: 18px;
}

@media all and (max-width: 896px) {
  #main .select .house_b .photoUl03 li:nth-child(2) {
    width: 63%;
  }
}
/* Select C */
#main .select .house_c .ttlBox::before {
  background-color: #d2e8de;
}

#main .select .house_c .ttlBox::after {
  width: 27px;
  height: 100%;
  background: url(../img/lineup01/bg02-5.webp) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: calc(50% + 477px);
  content: "";
}

#main .select .house_c .ttlsub p {
  color: #76ba95;
}

#main .select .house_c .photoUl03 li:nth-child(2) {
  width: 26.8%;
}

#main .select .house_c .photoUl03 li:first-child a .txtSpan {
  margin-left: 13px;
}

#main .select .house_c .photoUl03 li:nth-child(2) a .txtSpan {
  /* margin-top: 34px; */
  margin-top: 50px;
}

@media all and (max-width: 896px) {
  #main .select .house_c .photoUl03 li:nth-child(2) {
    width: 70%;
  }
  #main .select .house_c .photoUl03 li:nth-child(2) a .txtSpan {
    /* margin-top: 34px; */
    margin-top: 13px;
  }
}
/* Select D */
#main .select .house_d .ttlBox::before {
  background-color: #f3a694;
}

#main .select .house_d .ttlBox::after {
  width: 27px;
  height: 100%;
  background: url(../img/lineup01/bg02-2.webp) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: calc(50% + 477px);
  content: "";
}

#main .select .house_d .ttlsub p {
  color: #ee7961;
}

/* #main .select .house_d .photoUl03 li:nth-child(2) {
  width: 26.8%;
} */
#main .select .house_d .photoUl03 li:nth-child(2) a .txtSpan {
  /* margin-top: 18px; */
  margin-top: 0;
}

/* Select E */
#main .select .house_e .ttlBox::before {
  background-color: #d2e8de;
}

#main .select .house_e .ttlBox::after {
  width: 27px;
  height: 100%;
  background: url(../img/lineup01/bg02-5.webp) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: calc(50% + 477px);
  content: "";
}

#main .select .house_e .ttlsub p {
  color: #76ba95;
}

#main .select .house_e .photoUl03 li:nth-child(2) {
  width: 32%;
}

#main .select .house_e .photoUl03 li:first-child a .txtSpan {
  margin-left: 33px;
}

#main .select .house_e .photoUl03 li:nth-child(2) a .txtSpan {
  margin-top: 17px;
}

@media all and (max-width: 896px) {
  #main .select .house_e .photoUl03 li:nth-child(2) {
    width: 72%;
  }
  #main .select .house_e .photoUl03 li:first-child a .txtSpan {
    margin-left: 13px;
  }
}
/* 全体項目 */
@media all and (max-width: 896px) {
  #main .select .h3Ttl span {
    min-height: inherit;
    min-width: 154px;
    padding: 3px 10px 6px 40px;
    background-image: url(../img/lineup01/bg_sp.webp);
    background-size: 154px auto;
    min-width: inherit;
  }
  #main .select .house_a .ttlBox::after,
  #main .select .house_b .ttlBox::after,
  #main .select .house_c .ttlBox::after,
  #main .select .house_d .ttlBox::after,
  #main .select .house_e .ttlBox::after {
    width: 15px;
    left: calc(100% - 53px);
  }
  .appearance {
    width: 64% !important;
    margin: 0 auto !important;
  }
}
/*-------------------------
	  ラインナップ2 original
  -------------------------*/
/* original A */
#main .original .h3Ttl {
  color: #f2c674;
}

#main .original .h3Ttl span {
  background: url(../img/lineup02/bg.webp) no-repeat left bottom;
  background-size: 359px auto;
}

#main .original .house_a .ttlBox::before {
  background-color: #f9d0c3;
}

#main .original .house_a .ttlBox::after {
  width: 27px;
  height: 100%;
  background: url(../img/lineup02/bg02.webp) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: calc(50% + 477px);
  content: "";
}

#main .original .house_a .photoUl03 li:nth-child(2) {
  width: 26%;
}

#main .original .house_a .photoUl03 li:first-child a .txtSpan {
  margin-left: 32px;
}

#main .original .house_a .photoUl03 li:nth-child(2) a .txtSpan {
  margin-top: 27px;
}

@media all and (max-width: 896px) {
  #main .original .house_a .photoUl03 li:nth-child(2) {
    width: 49%;
  }
  #main .original .house_a .photoUl03 li:first-child a .txtSpan {
    margin-left: 20px;
  }
  #main .original .house_a .photoUl03 li:nth-child(2) a .txtSpan {
    margin-left: 6px;
  }
}
/* original B */
#main .original .house_b .ttlBox::before {
  background-color: #d5ebe1;
}

#main .original .house_b .ttlBox::after {
  width: 27px;
  height: 100%;
  background: url(../img/lineup02/bg02-2.webp) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: calc(50% + 477px);
  content: "";
}

#main .original .house_b .ttlsub p {
  color: #57b588;
}

@media all and (max-width: 896px) {
  #main .original .h3Ttl span {
    min-height: inherit;
    min-width: 154px;
    padding: 3px 10px 6px 40px;
    background-image: url(../img/lineup02/bg_sp.webp);
    background-size: 154px auto;
    min-width: inherit;
  }
  #main .original .house_a .ttlBox::after,
  #main .original .house_b .ttlBox::after,
  #main .original .house_c .ttlBox::after,
  #main .original .house_d .ttlBox::after,
  #main .original .house_e .ttlBox::after {
    width: 15px;
    left: calc(100% - 53px);
  }
  .appearance {
    width: 64% !important;
    margin: 0 auto !important;
  }
  #main .original .house_a .photoUl03 li:first-child {
    width: 58.2%;
  }
  #main .original .house_b .photoUl03 li:nth-child(2) {
    width: 74.2%;
  }
}
/* original C */
#main .original .house_c .ttlBox::before {
  background-color: #edafbd;
}

#main .original .house_c .ttlBox::after {
  width: 27px;
  height: 100%;
  background: url(../img/lineup02/bg04.webp) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: calc(50% + 477px);
  content: "";
}

#main .original .house_c .ttlsub p {
  color: #db7198;
}

/* original D */
#main .original .house_d .ttlBox::before {
  background-color: #cdc1dc;
}

#main .original .house_d .ttlBox::after {
  width: 27px;
  height: 100%;
  background: url(../img/lineup02/bg05.webp) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: calc(50% + 477px);
  content: "";
}

#main .original .house_d .ttlsub p {
  color: #9b82ba;
}

/*-------------------------
	  ラインナップ3 .brick
  -------------------------*/
#main .brick .house_a .ttlsub p {
  color: #ef878a;
}

#main .brick .house_b .ttlsub p {
  color: #62b1bf;
}

#main .brick .house_c .ttlsub p {
  color: #e0aa35;
}

#main .brick .house_b .ttlBox::before {
  background-color: #d5ebe1;
}

#main .brick .house_b .ttlBox::after {
  width: 27px;
  height: 100%;
  background: url(../img/lineup03/bg02-2.webp) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: calc(50% + 477px);
  content: "";
}

#main .brick .house_c .ttlBox::before {
  background-color: #fff2ad;
}

#main .brick .house_c .ttlBox::after {
  width: 27px;
  height: 100%;
  background: url(../img/lineup03/bg02-3.webp) no-repeat;
  background-size: 100% 100%;
  position: absolute;
  top: 0;
  left: calc(50% + 477px);
  content: "";
}

.appearance {
  width: 48% !important;
}

/* ボタン */
.greenBtn a {
  font-size: 2rem;
  letter-spacing: 0.1em;
  background-color: #64c0ab;
  border-color: #64c0ab;
}

.greenBtn a:hover {
  color: #64c0ab;
  background-color: #fff;
}

/* ZEH ボタン */
.circle-btn {
  border-radius: 70px;
  max-width: 250px;
  margin: 2em auto 0px;
  transition: 0.3s;
}

.circle-btn a {
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: 0.3em;
  font-weight: 900;
  min-height: 30px;
  font-size: 1.6rem;
  border-radius: 8px;
  color: #fff;
  padding: 0.8em 0em;
}

.circle-btn a span {
  padding: 0 25px 0 5px;
  display: inline-block;
  background: url(../img/lineup03/icon01.webp) no-repeat right center;
  background-size: 5px auto;
}

.red {
  background-color: #ec6d65;
  border: 1px solid #ec6d65;
}

.red:hover {
  background-color: #fff;
}

.red:hover a {
  color: #ec6d65;
}

.green {
  background-color: #64c0ab;
  border: 1px solid #64c0ab;
}

.green:hover {
  background-color: #fff;
}

.green:hover a {
  color: #64c0ab;
}

@media all and (max-width: 896px) {
  #main .brick .house_b .ttlBox::after,
  #main .brick .house_c .ttlBox::after {
    width: 15px;
    left: calc(100% - 53px);
  }
  .appearance {
    width: 64% !important;
    margin: 0 auto !important;
  }
  /* ボタン */
  .comLink02 a {
    padding: 0;
    font-weight: 700;
    min-height: 35px;
    font-size: 1.6rem;
    letter-spacing: 0;
    background-image: none;
  }
  .circle-btn a span {
    padding: 0;
    padding-right: 12px;
  }
}
@media all and (min-width: 897px) and (max-width: 1100px) {
  .comTtlBox .bg02 {
    right: -10px;
  }
  #main .ttlBox::before {
    width: calc(50% + 390px);
  }
  #main .select .house_a .ttlBox::after,
  #main .select .house_b .ttlBox::after,
  #main .select .house_c .ttlBox::after,
  #main .select .house_d .ttlBox::after,
  #main .select .house_e .ttlBox::after,
  #main .brick .house_a .ttlBox::after,
  #main .brick .house_b .ttlBox::after,
  #main .brick .house_c .ttlBox::after,
  #main .original .house_a .ttlBox::after,
  #main .original .house_b .ttlBox::after,
  #main .original .house_c .ttlBox::after,
  #main .original .house_d .ttlBox::after,
  #main .original .house_e .ttlBox::after {
    left: calc(50% + 387px);
  }
  #main .original .house_c .ttlBox::after,
  #main .original .house_d .ttlBox::after,
  #main .original .house_e .ttlBox::after {
    left: calc(50% + 387px);
  }
}
/*------------------------------------------------------------
性能・構造
------------------------------------------------------------*/
#main .point #p-01 .comLink02 {
  width: 470px;
}

#main .point .inner03 {
  align-items: flex-start;
}

#main .point .inner03 .photo span {
  margin-top: 2px;
  display: block;
  font-size: 1.5rem;
  color: #603b33;
  letter-spacing: 0.03em;
  font-weight: 500;
  font-feature-settings: "palt";
}

#main .point .inner04 .photoBox {
  /* width: 52%; */
  width: fit-content;
  margin: 65px -20px 0 10px;
}

/* #main .point .rBox .txtSpan {
  font-size: 2.9rem;
  font-size: 2.1rem;
  line-height: 1.2;
} */
.inner.inner08 {
  flex-direction: row-reverse;
}

#main .point h4 span {
  font-size: 1.5rem;
  color: #603b33;
  font-weight: 500;
  letter-spacing: 0.03em;
  line-height: 2.11;
  font-feature-settings: "palt";
  margin-left: 0.5em;
}

@media all and (max-width: 896px) {
  #main .point .inner03 .photo span {
    margin-left: -10px;
    margin-right: -10px;
    font-size: 1.2rem;
  }
  #main .point .inner04 .photoBox {
    width: auto;
    margin-left: auto;
    margin-right: auto;
    margin-top: 10px;
  }
  /* #main .point .rBox .txtSpan {
    font-size: 1.6rem;
  } */
  #main .point h4 span {
    font-size: 1.2rem;
    letter-spacing: 0;
    line-height: 1.63;
  }
  /* 文字とマークがかぶるため 文字数が少なくなったらコメントアウト */
  #main section.house.house_c .ttlBox h4 {
    font-size: 1.2rem;
  }
  .inner.inner08 + .inner.inner08 {
    margin-top: 5rem;
  }
}
/*
//＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
//追加項目
//＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝＝
*/
.title-sub {
  color: #603b33;
  font-size: 0.8em;
  font-weight: normal;
}

.btn-flex {
  display: flex;
  justify-content: center;
  gap: 3rem;
}

.btn-flex .circle-btn {
  /* display: flex; */
  max-width: none;
  margin: 0;
  margin-top: 2em;
}

.btn-flex .circle-btn a {
  padding-left: 2em;
  padding-right: 2em;
}

/* 保温・遮音性 */
#main .point .inner.heat-retention {
  flex-direction: column;
}

.photoGrid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 4px;
}

#main .point .inner04.heat-retention .photoBox,
#main .point .inner04.makeFlow .photoBox {
  width: 100%;
  margin: 0;
}

#main .point .inner04.makeFlow .photoGrid {
  gap: 3rem;
}

#main .point .inner04.makeFlow .photoBox {
  position: relative;
}

#main .point .inner04.makeFlow .photoBox::before {
  content: "";
  position: absolute;
  display: block;
  width: 12px;
  height: 27px;
  top: 50%;
  right: -10%;
  transform: translateY(calc(-50% - 8px));
  background: url(../img/lineup03/red-arrow.webp) no-repeat center center/contain;
}

#main .point .inner04.makeFlow .photoBox:last-child:before {
  content: none;
}

/* レンガ住宅のメリットここから */
.meritBox {
  margin-top: 3rem;
}

.meritBoxList {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 3rem;
}

.colorBox {
  background-color: #f7d6c7;
  border-radius: 0 3rem 0 3rem;
  padding: 2rem 2rem;
  position: relative;
}

.colorBox.isTyepe2 {
  background-color: #d0e9f6;
}

.colorBox.isTyepe3 {
  background-color: #d1e7dd;
}

.colorBox.isTyepe4 {
  background-color: #ffe27a;
}

.colorBoxNumber {
  font-size: 2.4rem;
  font-weight: bold;
  position: absolute;
  top: -1.7rem;
  left: 2rem;
}

#main .point h5.colorBoxTitle {
  color: #e8473f;
}

#main .point .colorBox.isTyepe2 h5.colorBoxTitle {
  color: #0080a3;
}

#main .point .colorBox.isTyepe3 h5.colorBoxTitle {
  color: #00aa8c;
}

#main .point .colorBox.isTyepe4 h5.colorBoxTitle {
  color: #ef8200;
}

/* レンガ住宅のメリットここまで */
@media all and (max-width: 896px) {
  .btn-flex {
    flex-direction: column;
    gap: 0;
  }
  .btn-flex .circle-btn a {
    padding-left: 1em;
    padding-right: 1em;
  }
  .photoGrid {
    grid-template-columns: repeat(1, 1fr);
    gap: 30px;
  }
  #main .point .inner04.makeFlow .photoBox {
    grid-template-columns: repeat(1, 1fr);
  }
  #main .point .inner04.makeFlow .photoBox::before {
    content: none;
  }
  /* レンガ住宅のメリットここから */
  .meritBoxList {
    grid-template-columns: repeat(1, 1fr);
  }
  #main .point h5.colorBoxTitle {
    font-size: 1.5rem;
  }
  /* レンガ住宅のメリットここまで */
}