@charset "utf-8";
/* CSS Document */

/* 既存 */
@media screen and (min-width: 811px) {
  #home_modelhouse.tateSEC .bou.btn {
    position: absolute !important;
    right: 0;
  }
  #home_modelhouse.second #bl-contents-modelhouse .text {
    position:relative;
  }
  #home_modelhouse.second .bou.btn {
    position: absolute !important;
    right: 0;
  }
  #home_faq .faq_Details__right .text{
    position:relative;
  }
  #home_faq .bou.btn {
    position: absolute !important;
    right: 0;
  }
}

.img-monotoan .cases-item-thumb,
#home_tidbits .cases-item-thumb {
	/* filter: grayscale(70%) brightness(0.85); */
	/* filter: grayscale(90%) brightness(0.8); */
  /* opacity: 0.9;
  background: rgba(0, 0, 0, 0.5);
  mix-blend-mode: multiply; */
  filter: brightness(0.8);
}

@media screen and (max-width: 787px) {
  .bou.btn.pc {
    display:none;
  }
}

#home_cases.section .cases-item-cat {
  background-color:#fff !important;
}

#home_cases .slick-dots li.slick-active button::before {
    color: rgba(0, 0, 0, 0.84) !important;
}

#home_voice.section .cases-item {
  margin-top:50px;
	padding: 0 5px;
  /* filter: grayscale(90%) brightness(0.8); */
  /* filter: grayscale(70%) brightness(0.85);
  opacity: 0.9; */
  filter: brightness(0.8);

  &.is_color {
    filter: grayscale(0%);
  }

  .cases-item-thumb {
    position: relative;
    &.is_close img {filter: brightness(0.5);}
  }
  .stamp-comp {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;

    width: fit-content;
    width: 145px;
    height: 42px;
    border: 1px solid #fff;
    display: flex;
    justify-content: center;
    align-items: center;


    color: #fff;
    font-size: 17px;
  }
}

@media screen and (min-width: 768px) {
  #home_voice {padding-bottom: 80px;}
  #home_voice.section .cases-item {
    .stamp-comp {
      width: fit-content;
      height: 50px;
      width: 170px;


      color: #fff;
      font-size: 20px;
    }
  }
}
.header_smart {display: none;}

@media screen and (max-width: 767px) {
  #home_voice .bou.btn{margin-top: 88px;}
  #home_voice.section .cases-item{margin-top: 9px;}
  #home_voice.section .section-inner{padding-bottom: 0;}

  #main-visual__top h1.header_smart {
    display: block;
    width: fit-content;
    height: fit-content;

    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    margin: auto;

    writing-mode: vertical-rl;
    text-orientation: mixed;
    white-space: nowrap;
    font-size: 25.5px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: 12px;
    color: #fff;
    text-shadow: 2px 2px 2px rgba(0, 0, 0, 0.46);
    z-index: 2;
  }
}


#home_voice.section .cases-item-cat {
  background-color:#fff;
  display: inline-block;
  font-size: 12px;
  font-weight: bold;
  margin-bottom: 10px;
  padding: 0.2em 0.5em;
  text-align: center;
}

#home_voice .slick-dots li.slick-active button::before {
    color: rgba(0, 0, 0, 0.84) !important;
}

#home_feature {
  background: unset !important;
}

.slide.slick-slide{
  position: relative;
  display: inline-block;
}

.slide.slick-slide img{
  display:block;
}

.slide.slick-slide:after{
  /* content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.3);
  mix-blend-mode: multiply;
  */
  /* 乗算 */
}

/* =========================================
   TOP - Suggestion
   front-page.php の #home_feature 専用
========================================= */

/* セクション全体 */
#home_feature {
  background: #f3f2ee;
  overflow: hidden;
}

#home_feature > .section-inner {
  position: relative;
  max-width: 1400px;
  width: calc(100% - 80px);
  padding: 70px 0 64px;
}

/* タイトルまわり */
#home_feature .section-ttl-area.is_suggestion {
  width: 100%;
  max-width: none;
  padding: 0;
  margin: 0 0 38px;
}

#home_feature .section-ttl-area.is_suggestion .section-ttl {
  margin-bottom: 0;
  text-align: center;
}

#home_feature .section-ttl-area.is_suggestion .section-ttl-jp {
  margin-top: 0;
  margin-bottom: 12px;
  font-size: 17px;
  line-height: 1.4;
  letter-spacing: 0.08em;
  color: #231815;
}

#home_feature .section-ttl-area.is_suggestion .section-ttl-en {
  line-height: 1;
  letter-spacing: 0.03em;
  color: #231815;
}

/* レイアウト本体 */
#home_feature .suggestion-top {
  position: relative;
  width: 100%;
  max-width: none;
  min-height: 430px;
  padding: 0;
  display: flex;
  justify-content: center;
  align-items: flex-start;
}

/* 背景画像エリア */
#home_feature .home-bg-img {
  pointer-events: none;
}

#home_feature .home-bg-img p {
  margin: 0;
  position: absolute;
}

#home_feature .home-bg-img img {
  display: block;
  width: 100%;
  height: auto;
}

/* PC 画像位置 */
#home_feature .bg-position01 {
  top: 6px;
  left: 4%;
  width: 230px;
}

#home_feature .bg-position02 {
  top: 200px;
  left: 0;
  width: 185px;
}

#home_feature .bg-position03 {
  top: 138px;
  right: 0;
  width: 245px;
}

/* proposal nav は既存CSSを生かす */

/* 詳細を見るボタン */
.bou.btn {
  position: relative !important;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 176px;
  max-width: none;
  height: 50px;
  margin: 34px auto 0;
  padding: 0 52px 0 18px;
  border: 1px solid #8f8a83;
  background: transparent;
  color: #231815 !important;
  font-family: inherit;
  font-size: 15px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.08em;
  box-sizing: border-box;
}

.bou.btn::after {
  content: none;
}

.bou.btn::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 32px;
  height: 1px;
  background: #8f8a83;
  transform: translateY(-50%);
}

#home_feature > .section-inner > .bou.btn:hover {
  background: transparent;
  color: #231815 !important;
  opacity: 0.75;
}

/* =========================================
   PC 微調整
========================================= */
@media screen and (max-width: 1400px) and (min-width: 811px) {
  #home_feature > .section-inner {
    width: calc(100% - 56px);
  }

  #home_feature .bg-position01 {
    left: 3%;
    width: 210px;
  }

  #home_feature .bg-position02 {
    width: 170px;
  }

  #home_feature .bg-position03 {
    width: 220px;
  }
}


/* =========================================
   SP - Suggestion
========================================= */
@media screen and (max-width: 810px) {
  #home_feature > .section-inner {
    width: 100%;
    padding: 30px 0 260px;
  }

  #home_feature .section-ttl-area.is_suggestion {
    margin: 0 0 26px;
  }

  #home_feature .section-ttl-area.is_suggestion .section-ttl-jp {
    margin-bottom: 8px;
    font-size: 14px;
    line-height: 1.4;
  }

  #home_feature .section-ttl-area.is_suggestion .section-ttl-en {
    font-size: 46px;
    line-height: 1;
    letter-spacing: 0.02em;
  }

  #home_feature .suggestion-top {
    display: block;
    min-height: auto;
    padding: 0;
  }

  /* 画像親 */
  #home_feature .home-bg-img {
    position: static;
    width: 100%;
    margin: 0;
    pointer-events: none;
  }

  #home_feature .home-bg-img p {
    margin: 0;
  }

  /* メイン画像 */
  #home_feature .home-bg-img .bg-position03 {
    position: relative;
    top: auto;
    right: auto;
    left: auto;
    width: calc(100% - 20px);
    margin: 0 0 56px auto;
    aspect-ratio: 1.45 / 1;
    overflow: hidden;
  }

  #home_feature .home-bg-img .bg-position03 img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center center;
    display: block;
  }

  /* 下部の2枚画像 */
  #home_feature .home-bg-img .bg-position01,
  #home_feature .home-bg-img .bg-position02 {
    position: absolute;
    top: auto;
    width: calc((100% - 30px) / 2);
    overflow: hidden;
  }
  /* 左下 */
  #home_feature .home-bg-img .bg-position02 {
    left: 0;
    bottom: -46%;
     width: calc((100% - 30px) / 2);
  }

  /* 右下 */
  #home_feature .home-bg-img .bg-position01 {
    left: 50%;
    bottom:-30%;
  }

  #home_feature .home-bg-img .bg-position01 img,
  #home_feature .home-bg-img .bg-position02 img {
    width: 100%;
    height: auto;
    display: block;
  }

  /* ボタン */
  .bou.btn {
    width: 160px;
    height: 48px;
    margin: 40px auto 72px;
    padding: 0 46px 0 16px;
    font-size: 14px;
  }

  .bou.btn::before {
    right: 0;
    width: 28px;
  }
}

/* =========================================
   極小SP
========================================= */
@media screen and (max-width: 480px) {
  #home_feature > .section-inner {
    padding: 30px 0 245px;
  }

  #home_feature .section-ttl-area.is_suggestion .section-ttl-en {
    font-size: 40px;
  }

  #home_feature .home-bg-img .bg-position03 {
    width: calc(100% - 10px);
    margin: 0 0 48px auto;
    aspect-ratio: 1.45 / 1;
  }

  #home_feature .home-bg-img .bg-position01,
  #home_feature .home-bg-img .bg-position02 {
    width: calc((100% - 20px) / 2);
  }

  .bou.btn {
    width: 150px;
    height: 46px;
    margin: 36px auto 64px;
    font-size: 13px;
  }
}

/* =========================================
   共通：縦書きタイトル
   ※ br で任意改行できる形
========================================= */
@media screen and (min-width: 811px) {
  .section-ttl-tate-common {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    white-space: normal;
    display: inline-block;
    margin: 0;
    line-height: 1.35;
    letter-spacing: 0.12em;
    font-weight: 400;
    color: #231815;
  }

  .section-ttl-tate-common br {
    display: block;
    content: "";
  }

  .section-ttl-tate-common .tate-big {
    font-size: 64px;
    line-height: 1.1;
  }

  .section-ttl-tate-common .tate-small {
    font-size: 24px;
    line-height: 1.2;
  }
}

@media screen and (max-width: 810px) {
  .section-ttl-tate-common {
    writing-mode: horizontal-tb;
    text-orientation: initial;
    display: block;
    text-align: center;
    line-height: 1.35;
    letter-spacing: 0.08em;
  }

  .section-ttl-tate-common .tate-big {
    font-size: 40px;
    line-height: 1.15;
  }

  .section-ttl-tate-common .tate-small {
    font-size: 18px;
    line-height: 1.2;
  }

  .section-ttl-tate-common br {
    display: block;
  }
}

/* =========================================
   HOME CASES
   home_modelhouse の逆レイアウト版
========================================= */
#home_cases {
  position: relative;
  overflow: hidden;
}

#home_cases::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
        to bottom,
        #ffffff 0,
        #ffffff 180px,
        #efeeea 180px,
        #efeeea 100%
    );
  z-index: 0;
}

#home_cases .section-inner {
  position: relative;
  z-index: 1;
}

#home_cases .section-head {
  position: relative;
  min-height: 620px;
  width: 90%;
  max-width: 1200px;
  margin: 0 auto 70px;
}

/* 左の大きい画像 */
#home_cases .section-head::before {
  content: "";
  position: absolute;
  top: 12px;
  right: 47%;
  width: 82%;
  height: calc(98% - 82px);
  background: url("../img/top/home_cases_bg.png") center center / cover no-repeat;
}

/* 右のタイトルエリア */
#home_cases .section-head > div {
  position: relative;
  width: 45%;
  margin-left: auto;
  padding: 50px 0 110px;
  min-height: 620px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  text-align: center;
}

/* 今ある空figureは使わない */
#home_cases .section-head .section-thumb {
  display: none;
}

/* 現在の #home_cases の h2 を強制的に縦組み */
@media screen and (min-width: 811px) {
  #home_cases .section-head .section-ttl {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    white-space: normal;
    margin: 0;
    line-height: 1.3;
    letter-spacing: 0.12em;
  }

  #home_cases .section-head .section-ttl > span {
    display: inline;
  }

  #home_cases .section-head .section-ttl .section-ttl-tate-big {
    font-size: 60px;
    font-weight: 400;
    line-height: 1.05;
  }

  #home_cases .section-head .section-ttl .section-ttl-tate-small {
    font-size: 24px;
    font-weight: 400;
    line-height: 1.2;
  }

  .section-inner .section-ttl.txt-l-pc.base {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    white-space: normal;
    margin: 0;
    line-height: 1.3;
    letter-spacing: 0.12em;
    text-align: center;
  }
  .section-inner .section-ttl.txt-l-pc.base > span {
    display: inline;
  }
  .section-inner .section-ttl.txt-l-pc.base .section-ttl-tate-big {
    font-size: 60px;
    font-weight: 400;
    line-height: 1.05;
  }
  .section-inner .section-ttl.txt-l-pc.base .section-ttl-tate-small {
    font-size: 24px;
    font-weight: 400;
    line-height: 1.2;
  }

}

/* ボタン位置 */
#home_cases .section-head > .bou.btn {
  position: absolute !important;
  right: 0;
  bottom: 14px;
  margin: 0;
}

/* スライダー下余白 */
#home_cases.section .cases-list {
  position: relative;
  z-index: 1;
  margin-bottom: 100px;
}

/* =========================================
   タブレット以下
========================================= */
@media screen and (max-width: 810px) {
  #home_cases::before {
    width: 100%;
    right: 0;
    background:#f5f4f2;
  }

  #home_cases .section-head {
    min-height: auto;
    width: 100%;
    margin: 0 auto 40px;
    padding: 0 0 20px;
  }

  #home_cases .section-head::before {
    position: relative;
    display: block;
    top: auto;
    left: auto;
    width: calc(100% - 20px);
    height: auto;
    aspect-ratio: 16 / 9;
    margin: 0 0 28px auto;
    background-position: center center;
    background-size: cover;
  }

  #home_cases .section-head > div {
    width: 100%;
    min-height: auto;
    margin-left: 0;
    padding: 0 20px;
    display: block;
    text-align: center;
  }

  #home_cases .section-head .section-ttl {
    writing-mode: horizontal-tb;
    text-orientation: initial;
    margin-bottom: 26px;
    text-align: center;
  }

  #home_cases .section-head .section-ttl > span {
    display: inline;
  }

  #home_cases .section-head .section-ttl .section-ttl-tate-big {
    font-size: 42px;
    line-height: 1.15;
  }

  #home_cases .section-head .section-ttl .section-ttl-tate-small {
    font-size: 18px;
    line-height: 1.2;
  }

  #home_cases .section-head > .bou.btn {
    position: relative !important;
    right: auto;
    bottom: auto;
    margin: 0 auto;
  }
}

@media screen and (max-width: 480px) {
  #home_cases .section-head{
    padding:0;
  }
  #home_cases .section-head::before {
    display:none;
  }
  #home_cases .section-head .section-ttl{
]    text-align:left;
  }
  #home_cases .section-head .section-ttl .section-ttl-tate-big {
    font-size: 34px;
  }

  #home_cases .section-head .section-ttl .section-ttl-tate-small {
    font-size: 16px;
  }
}

/* =========================================
   HOME VOICE
========================================= */
#home_voice .home_voice_mv {
  background: url(../img/top/home_voice_h3_mv.png) no-repeat center center / cover;
  height: 300px;
  max-height: 300px;
  position: relative;
  margin: 0 0 48px;
  overflow: hidden;
}

#home_voice .home_voice_mv::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.18);
  z-index: 1;
}

#home_voice .home_voice_mv .accent {
  position: absolute;
  top: 50%;
  left: 7%;
  transform: translateY(-50%);
  z-index: 2;
  margin: 0;
  color: #fff;
  font-family: "Yu Mincho", "Hiragino Mincho ProN", "MS Mincho", "ＭＳ 明朝", serif;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.08em;
  white-space: nowrap;
  text-shadow:
    0 0 10px rgba(0, 0, 0, 0.22),
    2px 2px 6px rgba(0, 0, 0, 0.28);
}

#home_voice .home_voice_mv .accent .lg,
#home_voice .home_voice_mv .accent .md {
  display: inline-block;
  vertical-align: baseline;
}

#home_voice .home_voice_mv .accent .lg {
  font-size: 60px;
}

#home_voice .home_voice_mv .accent .md {
  font-size: 30px;
}

#home_voice .home_voice_mv .accent .lg + .md {
  margin-left: 0.03em;
}

#home_voice .home_voice_mv .accent .md + .lg {
  margin-left: 0.08em;
}

#home_voice .home_voice_mv .accent .md:last-child {
  margin-left: 0.08em;
}

/* 2カラム */
#home_voice .voice_Details {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 90px;
  max-width: 980px;
  margin: 0 auto;
}

/* 左 */
#home_voice .voice_Details .section-ttl.txt-l-pc.base {
  width: 280px;
  flex: 0 0 280px;
  margin: 0;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  white-space: normal;
  line-height: 1.2;
  letter-spacing: 0.12em;
  text-align: center;
}

#home_voice .voice_Details .section-ttl.txt-l-pc.base > span {
  display: inline;
}

#home_voice .voice_Details .section-ttl.txt-l-pc.base .section-ttl-tate-big {
  font-size: 60px;
  font-weight: 400;
  line-height: 1.05;
}

#home_voice .voice_Details .section-ttl.txt-l-pc.base .section-ttl-tate-small {
  font-size: 24px;
  font-weight: 400;
  line-height: 1.2;
}

/* 右 */
#home_voice .voice_Details__right {
  flex: 1 1 auto;
  padding-top: 34px;
}

#home_voice .voice_Details__right .text {
  max-width: none;
  margin: 0;
  line-height: 2.35;
  text-align: left;
}

#home_voice .voice_Details__right .bou.btn {
  margin: 34px 0 0 auto;
}

/* タブレット */
@media screen and (max-width: 1024px) {
  #home_voice .home_voice_mv {
    height: 240px;
    margin-bottom: 40px;
  }

  #home_voice .home_voice_mv .accent {
    left: 6%;
  }

  #home_voice .home_voice_mv .accent .lg {
    font-size: 56px;
  }

  #home_voice .home_voice_mv .accent .md {
    font-size: 40px;
  }

  #home_voice .voice_Details {
    gap: 56px;
    max-width: 900px;
  }

  #home_voice .voice_Details .section-ttl.txt-l-pc.base {
    width: 220px;
    flex: 0 0 220px;
  }

  #home_voice .voice_Details .section-ttl.txt-l-pc.base .section-ttl-tate-big {
    font-size: 48px;
  }

  #home_voice .voice_Details .section-ttl.txt-l-pc.base .section-ttl-tate-small {
    font-size: 20px;
  }

  #home_voice .voice_Details__right {
    padding-top: 24px;
  }

  #home_voice .voice_Details__right .text {
    line-height: 2.1;
  }

  #home_voice .voice_Details__right .bou.btn {
    margin-top: 26px;
  }
}

/* SP */
@media screen and (max-width: 767px) {
  #home_voice .home_voice_mv {
    height: 170px;
    margin-bottom: 28px;
  }

  #home_voice .home_voice_mv .accent {
    left: 5%;
    letter-spacing: 0.05em;
  }

  #home_voice .home_voice_mv .accent .lg {
    font-size: 36px;
  }

  #home_voice .home_voice_mv .accent .md {
    font-size: 25px;
  }

  #home_voice .voice_Details {
    display: block;
    max-width: none;
    width: 100%;
  }

  #home_voice .voice_Details .section-ttl.txt-l-pc.base {
    width: 100%;
    writing-mode: horizontal-tb;
    text-orientation: initial;
    text-align: left;
    margin: 0 0 18px;
  }

  #home_voice .voice_Details .section-ttl.txt-l-pc.base .section-ttl-tate-big {
    font-size: 34px;
    line-height: 1.2;
  }

  #home_voice .voice_Details .section-ttl.txt-l-pc.base .section-ttl-tate-small {
    font-size: 16px;
    line-height: 1.3;
  }

  #home_voice .voice_Details__right {
    padding-top: 0;
  }

  #home_voice .voice_Details__right .text {
    /* width: 90%; */
    margin: 0 0 24px 0;
    line-height: 1.9;
    text-align: left;
  }

  #home_voice .voice_Details__right .bou.btn {
    margin: 0 auto;
  }

  #home_tidbits .tidbits-list .cases-item {
    /* padding: 0!important; */
  }
}

/* =========================================
   HOME MODELHOUSE
========================================= */
#home_modelhouse.second::before {
    right: 0 !important;
    left:unset !important;
    margin-top:50px !important;
}


@media (min-width: 811px) {
  .second #bl-contents-modelhouse {
    gap: 33px;
    }
  .second #bl-contents-modelhouse .section-thumb {
    display: block;
   order: 1;
  }
  .second #bl-contents-modelhouse .bl-contents-text {
    order: 2;
  }
  #home_modelhouse.second .section-thumb {
    background: url(../img/top/top_modelhouse_img02.png) left center no-repeat;
    max-width:unset !important;
    width: 70%;
  }
}

@media screen and (max-width: 767px) {
  #home_modelhouse.second::before {
    margin-top:unset !important;
    width:100%;;
  }
}

/* =========================================
   HOME FAQ
========================================= */

/* 2カラム */
#home_faq .faq_Details {
  display: flex;
  flex-direction: row-reverse;
  justify-content: space-between;
  align-items: flex-start;
  gap: 150px;
  max-width: 980px;
  margin: 50px auto;
}

/* 右（見出し） */
#home_faq .faq_Details .section-ttl.txt-l-pc.base {
  width: 220px;
  flex: 0 0 220px;
  margin: 0 24px 0 0;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  white-space: normal;
  line-height: 1.1;
  letter-spacing: 0.1em;
  text-align: center;
  position: relative;
  right: 86px;
}

#home_faq .faq_Details .section-ttl.txt-l-pc.base > span {
  display: inline;
}

#home_faq .faq_Details .section-ttl.txt-l-pc.base .section-ttl-tate-big {
  font-size: 60px;
  font-weight: 400;
  line-height: 1.0;
}

#home_faq .faq_Details .section-ttl.txt-l-pc.base .section-ttl-tate-small {
  font-size: 24px;
  font-weight: 400;
  line-height: 1.2;
}

/* 左（本文） */
#home_faq .faq_Details__right {
  flex: 1 1 auto;
  padding-top: 34px;
}

#home_faq .faq_Details__right .text {
  max-width: none;
  margin: 0;
  line-height: 2.35;
  text-align: left;
}

#home_faq .faq_Details__right .bou.btn {
  margin: 34px 0 0 0;
}

/* タブレット */
@media screen and (max-width: 1024px) {
  #home_faq .faq_Details {
    gap: 56px;
    max-width: 900px;
  }

  #home_faq .faq_Details .section-ttl.txt-l-pc.base {
    width: 220px;
    flex: 0 0 220px;
  }

  #home_faq .faq_Details .section-ttl.txt-l-pc.base .section-ttl-tate-big {
    font-size: 48px;
  }

  #home_faq .faq_Details .section-ttl.txt-l-pc.base .section-ttl-tate-small {
  font-size: 20px;
  font-weight: 400;
  line-height: 1.2;
  letter-spacing: 0.08em;
  position: relative;
  right: 4px;
  }

  #home_faq .faq_Details__right {
    padding-top: 24px;
  }

  #home_faq .faq_Details__right .text {
    line-height: 2.1;
  }

  #home_faq .faq_Details__right .bou.btn {
    margin-top: 26px;
  }
}

/* SP */
@media screen and (max-width: 767px) {
  #home_faq .faq_Details {
    display: block;
    width: 100%;
  }

  #home_faq .faq_Details .section-ttl.txt-l-pc.base {
    width: fit-content;
    flex: none;
    margin: 0 auto 24px;
    writing-mode: vertical-rl;
    text-orientation: mixed;
    text-align: center;
    position: static;
    right: auto;
    left: auto;
  }

  #home_faq .faq_Details .section-ttl.txt-l-pc.base .section-ttl-tate-big {
    font-size: 34px;
    line-height: 1.1;
  }

  #home_faq .faq_Details .section-ttl.txt-l-pc.base .section-ttl-tate-small {
    font-size: 16px;
    line-height: 1.2;
    position: static;
    right: auto;
  }

  #home_faq .faq_Details__right {
    padding-top: 0;
  }

  #home_faq .faq_Details__right .text {
    width: 90%;
    margin: 0 auto 24px;
    line-height: 1.9;
    text-align: left;
  }
}

/* =========================================
   HOME INSTAGRAM
========================================= */
#home_instagram {
  background: transparent;
}

#home_instagram .section-inner {
  width: 100%;
  max-width: none;
  padding: 0;
}

/* 全体のグレー枠 */
#home_instagram #bl-contents-instagram {
  width: calc(100% - 30px);
  max-width: 1210px;
  margin: 22px auto 0;
  padding: 64px 70px 74px;
  background: #f2f1ee;
  box-sizing: border-box;

  display: grid;
  grid-template-columns: 1fr 240px;
  grid-template-areas:
    "intro cta"
    "feed  feed";
  column-gap: 56px;
  row-gap: 42px;
}

/* text親を箱として使わず中身だけ配置に参加させる */
#home_instagram #bl-contents-instagram .bl-contents-text {
  display: contents;
}

/* =========================
   左上：説明エリア
========================= */
#home_instagram #bl-contents-instagram .section-ttl {
  grid-area: intro;
  margin: 0 0 34px;
  text-align: left;
}

#home_instagram #bl-contents-instagram .section-ttl .section-ttl-en {
  display: block;
  margin: 0;
  line-height: 1.05;
  letter-spacing: 0.06em;
  color: #231815;
}

#home_instagram #bl-contents-instagram .section-ttl .section-ttl-jp {
  display: block;
  margin: 0 0 10px;
  font-size: 16px;
  line-height: 1.4;
  letter-spacing: 0.08em;
  color: #231815;
}

/* 英語を下、日本語を上に見せる */
#home_instagram #bl-contents-instagram .section-ttl .section-ttl-jp {
  order: -1;
}

#home_instagram #bl-contents-instagram .text {
  grid-area: intro;
  align-self: end;
  max-width: 520px;
  margin: 118px 0 0;
}

#home_instagram #bl-contents-instagram .text p {
  margin: 0;
  line-height: 2.25;
  letter-spacing: 0.08em;
  color: #231815;
}

/* =========================
   右上：ボタン
========================= */
#home_instagram #bl-contents-instagram .btn.btn-pc {
  grid-area: cta;
  align-self: center;
  justify-self: end;

  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;

  width: 178px;
  height: 52px;
  max-width: none;
  margin: 0;
  padding: 0 52px 0 18px;

  border: 1px solid #8f8a83;
  background: transparent;
  color: #231815 !important;
  font-family: inherit;
  font-size: 15px;
  font-weight: 400;
  line-height: 1;
  letter-spacing: 0.08em;
  box-sizing: border-box;
}

#home_instagram #bl-contents-instagram .btn.btn-pc::after {
  content: none;
}

#home_instagram #bl-contents-instagram .btn.btn-pc::before {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 30px;
  height: 1px;
  background: #8f8a83;
  transform: translateY(-50%);
}

#home_instagram #bl-contents-instagram .btn.btn-pc:hover {
  background: transparent;
  color: #231815 !important;
  opacity: 0.75;
}

/* SPボタンはPCでは非表示 */
#home_instagram #bl-contents-instagram .btn.btn-sp {
  display: none;
}

/* =========================
   下段：Instagram一覧
========================= */
#home_instagram #bl-contents-instagram .bl-contents-media {
  grid-area: feed;
  width: 100%;
}

#home_instagram #bl-contents-instagram .instagram-box {
  width: 100%;
  min-height: 0;
  height: auto;
  margin: 0;
  padding: 0;
  background: transparent;
  border: 0;
  box-sizing: border-box;
}

/* プラグインの外枠余白を消す */
#home_instagram #bl-contents-instagram .instagram-box #sb_instagram,
#home_instagram #bl-contents-instagram .instagram-box .sbi,
#home_instagram #bl-contents-instagram .instagram-box .sb_instagram_header {
  padding: 0 !important;
  margin: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* 投稿一覧を4列に */
#home_instagram #bl-contents-instagram .instagram-box #sbi_images,
#home_instagram #bl-contents-instagram .instagram-box .sbi_photo_wrap {
  width: 100%;
}

#home_instagram #bl-contents-instagram .instagram-box #sbi_images {
  display: grid !important;
  grid-template-columns: repeat(4, 1fr);
  gap: 22px;
}

/* 1枚ずつ */
#home_instagram #bl-contents-instagram .instagram-box .sbi_item {
  width: 100% !important;
  float: none !important;
  margin: 0 !important;
  padding: 0 !important;
}

#home_instagram #bl-contents-instagram .instagram-box .sbi_photo {
  display: block !important;
  aspect-ratio: 1 / 1;
  overflow: hidden;
}

#home_instagram #bl-contents-instagram .instagram-box .sbi_photo img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  display: block;
}

/* ヘッダー・フォロー・ロードボタンなど不要なら非表示 */
#home_instagram #bl-contents-instagram .instagram-box #sbi_load,
#home_instagram #bl-contents-instagram .instagram-box .sbi_follow_btn,
#home_instagram #bl-contents-instagram .instagram-box .sb_instagram_header,
#home_instagram #bl-contents-instagram .instagram-box .sbi_header_text,
#home_instagram #bl-contents-instagram .instagram-box .sbi_header_link {
  display: none !important;
}

/* =========================================
   タブレット
========================================= */
@media screen and (max-width: 1024px) {
  #home_instagram #bl-contents-instagram {
    padding: 54px 40px 60px;
    grid-template-columns: 1fr 190px;
    column-gap: 36px;
    row-gap: 34px;
  }

  #home_instagram #bl-contents-instagram .section-ttl .section-ttl-en {
    font-size: 36px;
  }

  #home_instagram #bl-contents-instagram .section-ttl .section-ttl-jp {
    font-size: 14px;
  }

  #home_instagram #bl-contents-instagram .text {
    margin-top: 92px;
  }

  #home_instagram #bl-contents-instagram .instagram-box #sbi_images {
    gap: 16px;
  }
}

/* =========================================
   SP
========================================= */
@media screen and (max-width: 767px) {
  #home_instagram #bl-contents-instagram {
    width: calc(100% - 20px);
    padding: 34px 20px 40px;
    display: block;
  }

  #home_instagram #bl-contents-instagram .section-ttl {
    margin: 0 0 20px;
    text-align: left;
  }

  #home_instagram #bl-contents-instagram .section-ttl .section-ttl-en {
    font-size: 32px;
  }

  #home_instagram #bl-contents-instagram .section-ttl .section-ttl-jp {
    font-size: 14px;
    margin-bottom: 6px;
  }

  #home_instagram #bl-contents-instagram .text {
    max-width: none;
    margin: 0 0 24px;
  }

  #home_instagram #bl-contents-instagram .text p {
    font-size: 14px;
    line-height: 2;
  }

  #home_instagram #bl-contents-instagram .bl-contents-media {
    margin-top: 0;
  }

  #home_instagram #bl-contents-instagram .instagram-box #sbi_images {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  #home_instagram #bl-contents-instagram .btn.btn-pc {
    display: none;
  }

  #home_instagram #bl-contents-instagram .btn.btn-sp {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 160px;
    height: 48px;
    margin: 22px auto 0;
    padding: 0 44px 0 16px;
    border: 1px solid #8f8a83;
    background: transparent;
    color: #231815 !important;
    font-family: inherit;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0.08em;
    box-sizing: border-box;
  }

  #home_instagram #bl-contents-instagram .btn.btn-sp::after {
    content: none;
  }

  #home_instagram #bl-contents-instagram .btn.btn-sp::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    width: 26px;
    height: 1px;
    background: #8f8a83;
    transform: translateY(-50%);
  }
  #home_instagram #bl-contents-instagram .instagram-box{
     margin-bottom:25px;
  }
}

/* =========================================
   HOME TIDBITS
========================================= */
#home_tidbits {
  margin-top: 50px;
  background: #f3f2ee;
  overflow: hidden;
}

#home_tidbits .section-inner {
  width: calc(100% - 80px);
  max-width: 1400px;
  padding: 70px 0 78px;
}

#home_tidbits #bl-contents-tidbits {
  background: transparent;
}

#home_tidbits #bl-contents-tidbits .bl-contents-inner {
  width: 100%;
  max-width: none;
  padding: 0;
}

/* =========================
   上段
========================= */
#home_tidbits .tidbits_Details {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 90px;
  max-width: 980px;
  margin: 0 auto 58px;
}

/* 左：縦見出し */
#home_tidbits .tidbits_Details .section-ttl.txt-l-pc.base {
  width: 130px;
  flex: 0 0 130px;
  margin: 0;
  writing-mode: vertical-rl;
  text-orientation: upright;
  white-space: nowrap;
  text-align: center;
  line-height: 1;
  letter-spacing: 0.04em;
}

#home_tidbits .tidbits_Details .section-ttl.txt-l-pc.base > span {
  display: inline;
}

#home_tidbits .tidbits_Details .section-ttl.txt-l-pc.base .section-ttl-tate-small {
  font-size: 24px;
  font-weight: 400;
  line-height: 1.15;
  letter-spacing: 0.02em;
}

#home_tidbits .tidbits_Details .section-ttl.txt-l-pc.base .section-ttl-tate-big {
  font-size: 60px;
  font-weight: 400;
  line-height: 1.28;
  letter-spacing: 0.08em;
}

/* 右：説明文 */
#home_tidbits .tidbits_Details__right {
  flex: 1 1 auto;
  padding-top: 16px;
}

#home_tidbits .tidbits_Details__right .text {
  max-width: 560px;
  margin: 0 0 34px auto;
  line-height: 2.3;
  text-align: left;
}

#home_tidbits .tidbits_Details__right .bou.btn {
  margin: 0 0 0 auto;
}

/* =========================
   一覧
========================= */
#home_tidbits .tidbits-list {
  position: relative;
  width: auto;
  margin: 0 calc(50% - 50vw) 70px 0;
  padding-left: 0;
}

#home_tidbits .tidbits-list .slick-list {
  overflow: hidden;
}

#home_tidbits .tidbits-list .slick-track {
  display: flex;
  /* gap:10px */
}

#home_tidbits .tidbits-list .slick-slide {
  height: auto !important;
}

#home_tidbits .tidbits-list .cases-item {
  /* width: 350px !important; */
  padding: 0 11px;
  box-sizing: border-box;
}

#home_tidbits .tidbits-list .cases-item a {
  display: block;
  text-decoration: none;
  color: #231815;
  width: fit-content;
}

/* 画像 */
#home_tidbits .tidbits-list .cases-item-thumb {
  width: 350px;
  height: 240px;
  margin: 0 0 18px;
  overflow: hidden;
  background: #ddd;
  /* filter: grayscale(70%) brightness(0.85); */
  /* filter: grayscale(90%) brightness(0.8); */
  /* opacity: 0.9;
  background: rgba(0, 0, 0, 0.5);
  mix-blend-mode: multiply; */
  filter: brightness(0.8);
}

#home_tidbits .tidbits-list .cases-item-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* カテゴリ */
#home_tidbits .tidbits-list .cases-item-cat {
  display: none;
}

/* タイトル */
#home_tidbits .tidbits-list .cases-item-ttl {
  margin: 0 0 10px;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.65;
  color: #231815;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  white-space: normal;
}

/* 日付 */
#home_tidbits .tidbits-list .cases-item-date {
  margin: 0;
  font-size: 13px;
  line-height: 1.4;
  color: #b4b4b4;
  letter-spacing: 0.06em;
}

/* slick dots */
#home_tidbits .slick-dots {
  position: static;
  margin-top: 42px;
  text-align: center;
}

#home_tidbits .slick-dots li {
  width: 14px;
  height: 14px;
  margin: 0 5px;
}

#home_tidbits .slick-dots li button {
  width: 14px;
  height: 14px;
  padding: 0;
}

#home_tidbits .slick-dots li button:before {
  font-size: 12px;
  color: #9e9e9e;
  opacity: 1;
}

.slick-dots {
  bottom: -45px;
}
.slick-dots li button:before {
  font-size:12px;
}


#home_tidbits .slick-dots li.slick-active button:before {
  color: #6d6d6d;
  opacity: 1;
}

/* 下のMOREはPC非表示 */
#home_tidbits > .section-inner > #bl-contents-tidbits .pc.btn:not(.bou) {
  display: none;
}

/* =========================
   PC
========================= */
@media screen and (min-width: 768px) {
  #home_tidbits .tidbits-list .cases-item {
     /* width: 350px !important; */
  }
}

/* =========================
   SP
========================= */
@media screen and (max-width: 767px) {
  #home_tidbits {
    margin-top: 24px;
  }

  #home_tidbits .section-inner {
    width: calc(100% - 20px);
    padding: 36px 0 44px;
  }

  #home_tidbits .tidbits_Details {
    display: block;
    margin-bottom: 34px;
  }

  #home_tidbits .tidbits_Details .section-ttl.txt-l-pc.base {
    width: fit-content;
    flex: none;
    margin: 0 auto 24px;
    writing-mode: vertical-rl;
    text-orientation: upright;
    white-space: nowrap;
    text-align: center;
    line-height: 1;
    letter-spacing: 0.04em;
    position: static;
    right: auto;
    left: auto;
  }

  #home_tidbits .tidbits_Details .section-ttl.txt-l-pc.base .section-ttl-tate-small {
    font-size: 16px;
    line-height: 1.15;
    letter-spacing: 0.02em;
  }

  #home_tidbits .tidbits_Details .section-ttl.txt-l-pc.base .section-ttl-tate-big {
    font-size: 38px;
    line-height: 1.28;
    letter-spacing: 0.08em;
  }

  #home_tidbits .tidbits_Details__right {
    padding-top: 0;
  }

  #home_tidbits .tidbits_Details__right .text {
    max-width: none;
    margin: 0 0 24px;
    line-height: 1.95;
  }

  #home_tidbits .tidbits-list {
    width: auto;
    margin: 0 calc(50% - 50vw) 34px 0;
  }

  #home_tidbits .tidbits-list .slick-list {
    overflow: visible;
  }

  #home_tidbits .tidbits-list .cases-item {
    padding: 0 10px;
  }

  #home_tidbits .tidbits-list .cases-item-thumb {
    aspect-ratio: 1 / 1.12;
    margin-bottom: 16px;
  }

  #home_tidbits .tidbits-list .cases-item-ttl {
    margin-bottom: 6px;
    font-size: 16px;
    line-height: 1.55;
  }

  #home_tidbits .tidbits-list .cases-item-date {
    font-size: 12px;
  }

  #home_tidbits .pc.bou.btn {
    display: none;
  }

  #home_tidbits .sp .btn {
    margin: 0 auto;
  }

  #home_tidbits .slick-dots {
    margin-top: 22px;
  }

  #home_tidbits .slick-dots li {
    margin: 0 4px;
  }
}

/* =========================================
   HOME LIVING
========================================= */
#home_living {
  overflow: hidden;
}

#home_living .section-inner {
  width: calc(100% - 80px);
  max-width: 1400px;
  padding: 80px 0 90px;
}

/* 共通の 1000px 制限を解除 */
#home_living #bl-contents-living .bl-contents-inner {
  width: 100%;
  max-width: none;
  padding: 0;
}

/* 全体レイアウト */
#home_living .living_Details {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 50px;
  position: relative;
}

/* 右側テキストブロックを右に */
#home_living .living_Details__right {
  order: 2;
  width: 42%;
/*  max-width: 520px;*/
  padding-top: 10px;
  margin-right:5%;
}

/* 左側画像 */
#home_living .section-thumb {
  order: 1;
  display: block;
  width: 58%;
  aspect-ratio: 812 / 548;
  background: url("../img/top/home_living_img.png") center center / cover no-repeat;
  flex-shrink: 0;
  margin-left: calc(53% - 47vw);
}

/* タイトル */
#home_living .living_Details__right .section-ttl.txt-l-pc.base {
  margin: 0 auto 46px;
  writing-mode: vertical-rl;
  text-orientation: mixed;
  white-space: normal;
  line-height: 1.18;
  letter-spacing: 0.12em;
  text-align: center;
}

#home_living .living_Details__right .section-ttl.txt-l-pc.base > span {
  display: inline;
}

#home_living .living_Details__right .section-ttl.txt-l-pc.base .section-ttl-tate-big {
  font-size: 60px;
  font-weight: 400;
  line-height: 1.05;
}

#home_living .living_Details__right .section-ttl.txt-l-pc.base .section-ttl-tate-small {
  font-size: 24px;
  font-weight: 400;
  line-height: 1.2;
}

/* 本文 */
#home_living .living_Details__right .text {
  margin: 0 0 34px;
  line-height: 2.35;
  text-align: left;
}

/* ボタン */
#home_living .living_Details__right .bou.btn {
  margin: 0;
  position:absolute !important;
  right:0;
}

/* =========================
   タブレット
========================= */
@media screen and (max-width: 1200px) {
  #home_living .living_Details {
    gap: 50px;
  }

  #home_living .living_Details__right {
    width: 44%;
  }

  #home_living .section-thumb {
    width: 56%;
  }

  #home_living .living_Details__right .section-ttl.txt-l-pc.base .section-ttl-tate-big {
    font-size: 52px;
  }

  #home_living .living_Details__right .section-ttl.txt-l-pc.base .section-ttl-tate-small {
    font-size: 20px;
  }

  #home_living .living_Details__right .text {
    line-height: 2.1;
  }
}

/* =========================
   SP
========================= */
@media screen and (max-width: 767px) {
  #home_living .section-inner {
    width: calc(100% - 20px);
    padding: 40px 0 48px;
  }

  #home_living .living_Details {
    display: block;
  }

  #home_living .section-thumb {
    width: 100%;
    aspect-ratio: 16 / 10;
    margin: 0 0 28px;
  }

  #home_living .living_Details__right {
    width: 100%;
    max-width: none;
    padding-top: 0;
  }

  #home_living .living_Details__right .section-ttl.txt-l-pc.base {
    width: fit-content;
    margin: 0 0 24px;
    writing-mode:unset;
    text-orientation: mixed;
    text-align: left;
  }

  #home_living .living_Details__right .section-ttl.txt-l-pc.base .section-ttl-tate-big {
    font-size: 38px;
    line-height: 1.1;
  }

  #home_living .living_Details__right .section-ttl.txt-l-pc.base .section-ttl-tate-small {
    font-size: 16px;
    line-height: 1.2;
  }

  #home_living .living_Details__right .text {
    margin: 0 0 24px;
    line-height: 1.95;
  }

  #home_living .living_Details__right .bou.btn {
    margin: 0 auto;
  }

  .hide-sp {display: none!important;}

  #home_modelhouse #bl-contents-modelhouse .text {
    margin-bottom: 0;
    .btn.bou {margin-bottom: 0;}
  }
  #home_modelhouse.second::before {
    width: 95%;
  }
  #home_modelhouse .section-thumb {
    margin-left: -6%;
    background: url(../img/top/top_modelhouse_img02.png) left center no-repeat;
    aspect-ratio: 710 / 414;
    width: 105%;
  }
}






/* 不要な場合、ここからした削除する[swiper slideバージョンのコンテンツ] */
#home_tidbits {
  padding-bottom: 50px;
  .section-inner {
    padding-bottom: 0;
  }

  .sp.hide-pc {margin-top: 50px;}

  .swiper {
    margin-top: 50px;
    .swiper-pagination {
      position: static;
      margin-top: 24px;
    }

    .cases-item-ttl {
      font-size: 15px;
      margin-top: 0.75em;
      color: #231815;
    }

    .cases-item-date {
      color: #9fa0a0;
      font-size: 14px;
      margin-top: 0.75em;
    }

    .swiper-pagination-bullet {
      width: 7px;
      height: 7px;
      background-color: #9fa0a0;
      opacity: 1;
      margin: 0 10px;

      &.swiper-pagination-bullet-active {background-color: #231815;}
    }
  }
}
@media screen and (min-width: 768px) {

  .page-template-front-page {padding-left: 0;}
  .page-template-front-page #container {
    padding-left: 225px;
  }

  .page-template-front-page #footer_reception,
  .page-template-front-page #footer_contactWrap,
  .page-template-front-page #home_living {
    margin-left: 225px;
    width: calc(100% - 225px);
  }

  #footer,
  .section.footArea {
    margin-left: 225px;
    width: calc(100% - 225px);
  }


  #home_tidbits .section-inner {
    max-width: 1200px;
  }

  #home_tidbits {
    padding-bottom: 160px;

    .section-inner {
      padding-bottom: 0;
    }


    .swiper {
      max-width: 1460px;
      margin-left: auto;
      margin-right: 0;
      margin-top: 80px;

      .swiper-pagination {
        margin-top: 45px;

        .swiper-pagination-bullet {
          width: 12px;
          height: 12px;

          margin: 0 10px;
        }
      }

      .swiper-slide {
        width: calc(350% / 14.50);
        max-width: 350px;
      }

      .cases-item-date {
        color: #9fa0a0;
        font-size: 14px;
        margin-top: 0.75em;
      }

      .cases-item-ttl {
        font-size: 18px;
        margin-top: 0.75em;
      }
    }
  }

}
/*　ここまで 不要な場合、ここからした削除する[swiper slideバージョンのコンテンツ] */
