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

/*================================
共通パーツ
================================*/
/*テキスト付き予約リンク
================================*/
.mh_reservation{
  text-align: center;
}
.mh_reservation h2{
  font-size: 1.4rem;
  font-weight: bold;
}
.mh_reservation .btn_detail{
  margin-left: auto;
  margin-right: auto;
}
@media (min-width: 768px){
  .mh_reservation{
    margin-top: 4rem;
  }
  .mh_reservation h2{
    font-size: 1.4rem;
    margin-bottom: 1.5rem;
  }
  .mh_reservation .btn_detail{
    max-width: 340px;
  }
}
@media (max-width: 767px){
  .mh_reservation{
    margin-top: 2.5rem;
  }
  .mh_reservation h2{
    font-size: 1.1rem;
    margin-bottom: 1rem;
  }
  .mh_reservation .btn_detail{
    max-width: 260px;
  }
}

/*相互リンクボタン
================================*/
.mutual_link{
  margin-top: 2rem;
  display: block;
}
.mutual_link a{
  margin-left: auto;
  margin-right: auto;
}
.mutual_link a:not(:last-child){
  margin-bottom: .5rem;
}

/*================================
モデルハウスTOP
================================*/
#modelhouse #page_mv img{
  border-radius: 10px;
}
.mh_top_ttl{
  font-weight: bold;
  text-align: center;
}
@media (min-width: 768px){
  .mh_top_ttl{
    font-size: 2.2rem;
    margin-bottom: 1.5rem;
  }
}
@media (max-width: 767px){
  .mh_top_ttl{
    font-size: 1.6rem;
    margin-bottom: 1rem;
  }
}


/*実際の暮らしを体感
================================*/
#mh_about{
  position: relative;
  padding-bottom: 0 !important;
}
#mh_about::before{
  content: '';
  display: inline-block;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  width: 90%;
  max-width: 1100px;
  aspect-ratio: 1100 / 182;
  background-image: url("../img/modelhouse/top/bg_modelhouse.png");
  background-position: center bottom;
  background-size: contain;
  z-index: -1;
}
@media (min-width: 768px){
  #mh_about::before{
    bottom: -10%;
  }
}
@media (max-width: 767px){
  #mh_about{
    padding-top: 30px !important;
  }
  #mh_about::before{
    bottom: -5%;
  }
}

/*動画で体感
================================*/
.movie_tour{
  width: 100%;
  max-width: 800px;
  aspect-ratio: 16 / 9;
  margin: 0 auto;
}
.movie_tour iframe {
  width: 100%;
  height: 100%;
}

/*最新のモデルハウス
================================*/
#mh_blog{
  width: 98%;
  margin-left: auto;
  margin-right: 0;
  background-color: #f5f6f4;
}
#mh_blog .sect_top_ttl{
  text-align: left;
}
.bgbox #blog_slider{
  padding-bottom: 30px;
}
.bgbox #blog_slider .swiper-button-next,
.bgbox #blog_slider .swiper-button-prev{
  position: absolute;
  color: #000;
  width: 30px;
  height: 30px;
  background-color: #fff;
  border-radius: 50%;
  margin-top: 0;
}
.bgbox #blog_slider .swiper-button-next{
  background-image: url("../img/modelhouse/top/mh_blog_next.svg");
}
.bgbox #blog_slider .swiper-button-prev{
  background-image: url("../img/modelhouse/top/mh_blog_prev.svg");
}
.bgbox #blog_slider .swiper-button-next:after,
.bgbox #blog_slider .swiper-button-prev:after{
  display: none;
}
.bgbox #blog_slider .swiper-pagination{
  left: 80px;
  bottom: 13px;
  width: 80%;
  display: flex;
  justify-content: left;
  align-items: center;
}
.bgbox #blog_slider .swiper-pagination-bullet{
  width: 10%;
  height: 3px;
  margin: 0;
  border-radius: 0;
  background-color: #cacaca;
}
.bgbox #blog_slider .swiper-pagination-bullet-active{
  background-color: #000;
}
.blog_tmb{
  width: 100%;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  display: block;
}
.bgbox #blog_slider .swiper-wrapper .swiper-slide .blog_tmb img{
  width: 100%!important;
  height: 100%!important;
  object-fit: cover!important;
  object-position: center;
}

@media (min-width: 992px){
  #mh_blog{
    padding-left: 4%;
  }
  .bgbox{
    display: flex;
    gap: 0 20px;
    margin-right: calc(50% - 50vw);
  }
  .bgbox .latest_txt{
    width: 360px;
  }
  .bgbox #blog_slider{
    flex: 1;
    max-width: 1920px;
  }
  .bgbox #blog_slider .swiper-button-next,
  .bgbox #blog_slider .swiper-button-prev{
    top: auto;
    bottom: 0;
  }
  .bgbox #blog_slider .swiper-button-next{
    left: 35px;
  }
  .bgbox #blog_slider .swiper-button-prev{
    left: 0;
  }
}
@media (min-width: 768px){
  #mh_blog{
    border-top-left-radius: 60px;
    border-bottom-left-radius: 60px;
  }
  .bgbox #blog_slider .swiper-wrapper .swiper-slide{
    width: 310px !important;
  }
  .bgbox #blog_slider .swiper-wrapper .swiper-slide img{
    max-width: auto !important;
    width: auto !important;
    height: 185px;
  }
}
@media (max-width: 991px){
  #mh_blog{
    padding-left: 25px;
    padding-right: 0;
  }
  .bgbox{
    position: relative;
  }
  .bgbox .btn_detail{
    position: absolute;
    left: 50%;
    bottom: -20px;
    transform: translateX(-50%);
  }
  .bgbox .latest_txt p{
    padding-right: 20px;
  }
  .bgbox #blog_slider{
    padding-top: 45px;
  }
  .bgbox #blog_slider .swiper-wrapper .swiper-slide{
    width: 86%;
  }
  .bgbox #blog_slider .swiper-pagination-bullet{
    display: none;
  }
  .bgbox #blog_slider .swiper-button-next,
  .bgbox #blog_slider .swiper-button-prev{
    top: 0;
  }
  .bgbox #blog_slider .swiper-button-next{
    right: 15px;
    left: auto;
  }
  .bgbox #blog_slider .swiper-button-prev{
    right: 50px;
    left: auto;
  }
}
@media (max-width: 767px){
  #mh_blog{
    border-top-left-radius: 30px;
    border-bottom-left-radius: 30px;
    padding-top: 50px !important;
  }
}

/*間取り図
================================*/
#floor_plan_tab{
  justify-content: center;
}
#floor_plan_tab .nav-item{
  width: 50%;
  max-width: 250px;
}
#floor_plan_tab .nav-link{
  color: #b1b1b1;
  font-weight: bold;
  display: block;
  width: 100%;
  text-align: center;
  border-radius: 0;
  padding: .75rem;
  border-bottom-width: 4px;
  border-bottom-style: solid;
  border-bottom-color: #b1b1b1;
}
#floor_plan_tab .nav-link.active,
#floor_plan_tab .show >.nav-link{
  color: #000;
  background-color: transparent;
  border-bottom-color: #000;
}
#floor_plan img{
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.floor_plan{
  max-width: 760px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
.floor_photo{
  position: relative;
  border-radius: 5px;
  overflow: hidden;
}
.floor_photo .num{
  position: absolute;
  top: 0;
  left: 0;
  color: #22b373;
  display: block;
  z-index: 0;
}
.floor_photo .num::before{
  content: '';
  display: block;
  position: absolute;
  background-color: #fff;
  border-radius: 50%;
  z-index: -1;
}
.floor dl dt{
  margin-bottom: .25rem;
}

@media (min-width: 768px){
  .floor_plan{
    margin-top: 4rem;
    margin-bottom: 4rem;
  }
  #floor_plan_tab .nav-link{
    font-size: 1.3rem;
  }
  .floor_photo{
    margin-bottom: 1rem;
  }
  .floor_photo .num{
    font-size: 1.5rem;
    padding: 5px 0 0 12px;
  }
  .floor_photo .num::before{
    top: -70px;
    left: -70px;
    width: 140px;
    height: 140px;
  }
  .floor dl dt{
    font-size: 1.25rem;
  }
}
@media (max-width: 767px){
  .floor_plan{
    margin-top: 2rem;
    margin-bottom: 2rem;
  }
  #floor_plan_tab .nav-link{
    font-size: 1.1rem;
  }
  .floor_photo{
    margin-bottom: .5rem;
  }
  .floor_photo .num{
    font-size: 1.1rem;
    padding: 0 0 0 6px;
  }
  .floor_photo .num::before{
    top: -40px;
    left: -40px;
    width: 80px;
    height: 80px;
  }
  .floor dl dt{
    font-size: 1.2rem;
  }
}

/*性能へのこだわり
================================*/
#mh_performance{
  background-color: #f5f6f4;
  counter-reset: point 0;
}
.commitment{
  position: relative;
  border-radius: 10px;
  background-color: #fff;
  margin-bottom: 2.5rem;
}
.commitment::before,
.commitment::after{
  display: block;
  position: absolute;
  top: 30px;
}
.commitment::after{
  content: "POINT " counter(point) "";
  counter-increment: point 1;
  color: #fff;
  font-size: .8rem;
  font-weight: bold;
  text-align: center;
}
.commitment::before{
  content: '';
  background-color: #22b373;
}
.commitment_photo{
  overflow: hidden;
}
.commitment_txt h3{
  font-weight: bold;
}
@media (min-width: 992px){
  .commitment_txt h3{
    font-size: 1.6rem;
    margin-bottom: 1rem;
  }
  .commitment_txt{
    padding: 6%;
  }
}
@media (min-width: 768px) and (max-width: 991px){
  .commitment_txt{
    padding: 1rem;
  }
  .commitment_photo img{
    object-fit: cover;
    aspect-ratio: 5 / 4;
  }
}
@media (min-width: 768px){
  #mh_performance{
    border-top-left-radius: 60px;
    border-top-right-radius: 60px;
  }
  .commitment::before,
  .commitment::after{
    left: -27px;
    width: 27px;
    height: 90px;
    line-height: 30px;
  }
  .commitment::after{
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
  }
  .commitment::before{
    border-top-left-radius: 3px;
    border-bottom-left-radius: 3px;
  }
  .commitment_photo{
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
  }
  .commitment_txt p{
    margin-bottom: 1rem;
  }
}
@media (max-width: 991px){
  .commitment_txt h3{
    font-size: 1.2rem;
  }
  .commitment_txt p{
    font-size: .85rem;
  }
}
@media (max-width: 767px){
  #mh_performance{
    border-top-left-radius: 30px;
    border-top-right-radius: 30px;
    padding-top: 50px !important;
  }
  .commitment::before,
  .commitment::after{
    top: -24px;
    left: 20px;
    width: 90px;
    height: 24px;
    line-height: 26px;
  }
  .commitment::before{
    border-top-left-radius: 3px;
    border-top-right-radius: 3px;
  }
  .commitment_photo{
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    overflow: hidden;
  }
  .commitment_txt{
    padding: 1rem 1rem 2rem;
  }
  .commitment_txt .btn_detail{
    margin-left: auto;
    margin-right: auto;
  }
}

/*SNSをチェック
================================*/
#check_sns h2{
  font-weight: bold;
  text-align: center;
  margin-bottom: 1.5rem;
}
@media (min-width: 768px) {
  #check_sns h2{
    font-size: 1.8rem;
  }
  #check_sns p {
    text-align: center;
    margin-bottom: 2rem;
  }
}
@media (max-width: 767px) {
  #check_sns h2{
    font-size: 1.6rem;
  }
}

/*来場予約のご案内
================================*/
#mh_info{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}
.info_box{
  position: relative;
  color: #fff;
  background-image: url("../img/modelhouse/top/info.jpg");
  background-size: cover;
  background-position: center right;
  text-align: center;
  overflow: hidden;
}
.info_box::after{
  content: '';
  display: inline-block;
  position: absolute;
  top: 0;
  left: 0;
  mix-blend-mode: multiply;
}
.info_txt{
  position: relative;
  z-index: 1;
}
.info_txt h2{
  font-weight: bold;
  margin-bottom: 1.5rem;
}
.info_txt .asterisk_txt{
  text-align: left;
}
.info_list{
  margin-left: auto;
  margin-right: auto;
}
.info_list ul{
  color: #000;
  list-style: none;
  padding-left: 0;
  gap: 0 20px;
}
.info_list ul li{
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #fff;
  padding: 5px;
  border-radius: 5px;
  font-weight: bold;
}
.info_list ul li .tel{
  line-height: 1.2;
}
.info_list ul li .tel_num{
  color: #ef5a24;
  display: block;
}
.info_list ul li .tel .hours{
    font-weight: normal;
}
.info_list ul li .btn-tel{
  color: #000;
  text-decoration: none;
}
@media (min-width: 992px) {
  .info_list ul li{
    font-size: 1.5rem;
  }
  .info_list ul li .tel_num{
    font-size: 2rem;
  }
}
@media (min-width: 768px) and (max-width: 991px){
  .info_list ul li{
    font-size: 1.2rem;
  }
  .info_list ul li .tel_num{
    font-size: 1.7rem;
  }
}
@media (min-width: 768px) {
  .info_box{
    padding: 80px 30px;
    border-radius: 60px;
  }
  .info_box::after{
    width: 65%;
    height: 100%;
    background: linear-gradient(90deg, rgba(102, 102, 102, .8), rgba(0, 0, 0, 0));
  }
  .info_txt h2{
    font-size: 1.8rem;
  }
  .info_list{
    max-width: 920px;
    margin-top: 3rem;
  }
  .info_list ul{
    display: flex;
    justify-content: center;
  }
  .info_list ul li{
    width: 50%;
    height: 120px;
  }
  .info_list ul li .tel .hours{
    font-size: 1rem;
  }
}

@media (max-width: 767px) {
  .info_box{
    padding: 40px 15px;
    border-radius: 30px;
  }
  .info_box::after{
    width: 100%;
    height: 80%;
    background: linear-gradient(180deg, rgba(102, 102, 102, .8), rgba(0, 0, 0, 0));
  }
  .info_txt > p{
    display: inline-block;
    text-align: left;
  }
  .info_txt h2{
    font-size: 1.6rem;
  }
  .info_list{
    max-width: 330px;
  }
  .info_list ul li{
    height: 64px;
    font-size: .95rem;
  }
  .info_list ul li:not(:last-child){
    margin-bottom: .5rem;
  }
  .info_list ul li .tel_num{
    font-size: 1.35rem;
  }
  .info_list ul li .tel .hours{
    font-size: .8rem;
  }
}

/*================================
地震に強い家
================================*/
#quake_proof .sect_scroll{
	background-image: url("../img/modelhouse/quake_proof/sect_scroll_bg.jpg");
}

/*アイフルホームの地震対策
================================*/
.earthquake_resistant{
  text-align: center;
}
.earthquake_resistant h4{
  color: #ef5a24;
  font-size: 1.4rem;
  font-weight: bold;
  margin-bottom: 1rem;
}
@media (min-width: 768px){
  .earthquake_resistant h4{
    font-size: 1.4rem;
  }
}
@media (max-width: 767px){
  .earthquake_resistant h4{
    font-size: 1.2rem;
  }
}

/*ふきだし*/
.earthquake_resistant .balloon{
  position: relative;
  background-color: #fcede8;
  border-radius: 5px;
  margin: 0 auto 2rem;
}
.earthquake_resistant .balloon::before{
  content: '';
  display: inline-block;
  position: absolute;
  left: 50%;
  bottom: -20px;
  transform: translateX(-50%);
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-top: 20px solid #fcede8;
}
.earthquake_resistant .balloon .plus{
  position: relative;
  width: 28px;
  height: 28px;
}
.earthquake_resistant .balloon .plus::before,
.earthquake_resistant .balloon .plus::after{
  content: '';
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 50%;
  height: 2px;
  background-color: #4d4d4d;
}
.earthquake_resistant .balloon .plus::before{
  transform: translateY(-50%) translateX(-50%);
}
.earthquake_resistant .balloon .plus::after{
  transform: translateY(-50%) translateX(-50%) rotate(90deg);
}
@media (min-width: 992px){
  .earthquake_resistant .balloon img{
    max-width: 290px;
  }
}
@media (min-width: 768px) and (max-width: 991px){
  .earthquake_resistant .balloon img{
    max-width: 230px;
  }
}
@media (min-width: 768px){
  .earthquake_resistant .balloon{
    max-width: 800px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 3%;
  }
  .earthquake_resistant .balloon .plus{
    margin: 0 20px;
  }
  .earthquake_resistant .balloon .plus::before,
  .earthquake_resistant .balloon .plus::after{
    width: 28px;
  }
}
@media (max-width: 767px){
  .earthquake_resistant .balloon{
    max-width: 260px;
    padding: 20px 10px;
  }
  .earthquake_resistant .balloon img{
    max-width: 180px;
    display: block;
    margin-left: auto;
    margin-right: auto;
  }
  .earthquake_resistant .balloon .plus{
    margin: 10px auto;
  }
  .earthquake_resistant .balloon .plus::before,
  .earthquake_resistant .balloon .plus::after{
    width: 20px;
  }
}

/*チェックリスト*/
.check_list{
  display: inline-block;
  text-align: left;
  list-style: none;
  padding-left: 0; 
  font-weight: bold;
  margin-bottom: 2rem;
}
.check_list li{
  position: relative;
  padding-left: 24px;
  margin-top: .3rem;
}
.check_list li::before{
  content: '';
  display: inline-block;
  position: absolute;
  left: 0;
  width: 15px;
  height: 14px;
  background-image: url("../img/modelhouse/quake_proof/check_list.png");
  background-size: contain;
}
@media (min-width: 768px){
  .check_list{
    font-size: 1.2rem;
  }
  .check_list li::before{
    top: 6px;
  }
}
@media (max-width: 767px){
  .check_list{
    font-size: 1rem;
  }
  .check_list li::before{
    top: 5px;
  }
}


/*耐震＋制震工法を採用
================================*/
.method img{
  width: 100%;
  max-width: 139px;
  display: block;
  margin: 1rem auto 1.5rem;
}
.method h4{
  color: #fff;
  font-weight: bold;
  padding: .5rem;
  text-align: center;
  background-color: #ef5a24;
  margin-bottom: 1rem;
  letter-spacing: .15em;
}
.method_frame{
  position: relative;
  z-index: 0;
}
.method_frame::before {
  content: '';
  position: absolute;
  left: 0;
  border: #ef5a24 2px dashed;
  width: 100%;
  height: 100%;
  border-radius: 6px;
  z-index: -1;
}
.method_frame >div:first-child .method{
  padding-left: .75rem;
}
.method_frame >div:last-child .method{
  padding-right: .75rem;
}
@media (min-width: 768px) {
  .method h4{
    font-size: 1.15rem;
  }
  .method p{
    font-size: .95rem;
  }
}
@media (max-width: 767px) {
  .method h4{
    font-size: 1rem;
  }
  .method p{
    font-size: .85rem;
  }
}

/*地震対策構造ポイント
================================*/
.structure_point{
  text-align: center;
}
.pointbox{
  position: relative;
  background-color: #f9f6f2;
  border-radius: 5px;
  margin-top: 15px;
  display: flex;
  align-items: flex-start;
}
.pointbox .point_txt{
  flex: 1;
}
.pointbox .point{
  position: absolute;
  top: -15px;
  left: 20px;
  width: 100px;
  color: #fff;
  font-size: .85rem;
  font-weight: bold;
  text-align: center;
  border-radius: 3px;
  padding: .2rem;
  height: 30px;
  line-height: 26px;
}
.pointbox .point.red{
  background-color: #d31a20;
}
.pointbox .point.pur{
  background-color: #723c92;
}
.pointbox h4{
  font-weight: bold;
  margin-top: 20px;
}
.pointbox p{
  margin-bottom: 0;
}

@media (min-width: 768px){
  .structure_point{
    margin: 2.5rem 0 5rem;
  }
  .pointbox{
    padding: 20px;
    gap: 0 10px;
  }
  .pointbox h4{
    font-size: 1.15rem;
  }
  .pointbox:not(.point04) img{
    width: 130px;
  }

}
@media (max-width: 767px){
  .structure_point{
    margin: 1.5rem 0 3rem;
  }
  .pointbox{
    padding: 12px;
    gap: 0 5px;
  }
  .pointbox h4{
    font-size: 1rem;
  }
  .pointbox p{
    font-size: .8rem;
  }
  .pointbox.point04 img{
    width: 48%;
    max-width: 180px;
  }
  .pointbox:not(.point04) img{
    width: 30%;
    max-width: 130px;
  }
}

/*================================
火災に強い家
================================*/
/*省令準耐火構造
================================*/
.structure{
  background-color: #f9f6f2;
  border-radius: 5px;
  padding: 15px;
}
.structure .num{
  color: #ef5a24;
  font-size: 1.4rem;
  text-align: center;
  margin-bottom: .5rem;
}
.structure img{
  width: 100%;
  max-width: 125px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1rem;
}
.structure p{
  font-weight: bold;
  text-align: center;
  margin-bottom: 0;
}
@media (min-width: 992px){
  .structure p{
    font-size: 1.1rem;
  }
}
@media (max-width: 991px){
  .structure p{
    font-size: .85rem;
  }
}

/*構造の図*/
.structure_fig{
  margin-bottom: 2rem;
}

.structure_fig h4{
  font-weight: bold;
  padding: .5rem;
  text-align: center;
  letter-spacing: .1em;
}
.t_structure{
  color: #fff;
  background-color: #ef5a24;
}
.h_structure{
  background-color: #e6e6e6;
}
.structure_fig p{
  margin-bottom: 0;
}
.structure_fig img{
  width: 100%;
  max-width: 250px;
  display: block;
  margin-left: auto;
  margin-right: auto;
}
@media (min-width: 768px){
  .structure_fig{
    margin-top: 3rem;
  }
  .structure_fig h4{
    font-size: 1.15rem;
  }
}
@media (max-width: 767px){
  .structure_fig{
    margin-top: 2rem;
  }
  .structure_fig h4{
    font-size: 1rem;
  }
}

/*構造区分
================================*/
.structural_division>:not(caption)>*>*{
  border-color: #cacaca;
  vertical-align: middle;
}
.structural_division thead th{
  background-color: #e4e4e4;
  text-align: center;
}
.structural_division thead th:not(:first-child),
.structural_division tbody td:not(:first-child){
  border-left: #cacaca 1px solid;
}
.structural_division tbody td:nth-child(1){
  font-weight: bold;
}
.structural_division tbody td:not(:nth-child(2)){
  text-align: center;
}
.structural_division tbody tr.t_structure td{
  background-color: #f7ebe8;
}
.structural_division tbody tr.t_structure td:nth-child(1){
  color: #ef5a24;
}
.structural_division tbody td img{
  width: 100%;
  max-width: 55.5px;
}
@media (min-width: 768px){
  .structural_division thead th:nth-child(1){
    width: 96px;
  }
}
@media (max-width: 767px){
  .structural_division>:not(caption)>*>*{
    font-size: .8rem;
  }
  .structural_division thead th:not(:nth-child(2)){
    width: 60px;
  }
}

/*構造のメリット
================================*/
.division_merit{
  background-color: #f9f6f2;
  border-radius: 5px;
  text-align: center;
  margin-bottom: 0;
}
.division_merit dt{
  position: relative;
  margin-bottom: 30px;
}
.division_merit dt::before,
.division_merit dt::after {
  content: '';
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}
.division_merit dt::before{
  width: 0;
  height: 0;
  border-top: 10px solid #ffab97;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
}
.division_merit dt::after {
  width: 8px;
  height: 8px;
  background-color: #ffab97;
}
.division_merit dd{
  color: #ef5a24;
  font-weight: bold;
  margin-bottom: 0;
}
@media (min-width: 992px){
  .division_merit dt::before{
    top: 46px;
  }
  .division_merit dt::after {
    top: 38px;
  }
}
@media (min-width: 768px){
  .division_merit{
    font-size: 1.3rem;
    padding: 3%;
  }
}
@media (max-width: 991px){
  .division_merit dt::before{
    top: 78px;
  }
  .division_merit dt::after {
    top: 70px;
  }
}
@media (max-width: 767px){
  .division_merit{
    font-size: 1.05rem;
    padding: 15px 10px;
  }
  .division_merit dt::before{
    top: 90px;
  }
  .division_merit dt::after {
    top: 82px;
  }
}

/*================================
いつでも快適な家
================================*/
/*気密性能・断熱性能
================================*/
.performance h4{
  color: #fff;
  font-weight: bold;
  padding: .5rem;
  text-align: center;
  background-color: #ef5a24;
  margin-bottom: 1rem;
  letter-spacing: .15em;
}
.performance img{
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1rem;
  display: block;
}
.performance > img{
  width: 100%;
  max-width: 311px;
}
.performance_txt{
  background-color: #f9f6f2;
  border-radius: 5px;
  text-align: center;
  margin-bottom: 1rem;
}
.performance_txt p:last-child{
  display: inline-block;
  text-align: left;
  margin-bottom: 0;
}
@media (min-width: 992px){
  .performance_txt{
    padding: 7%;
  }
}
@media (min-width: 768px) and (max-width: 991px){
  .performance_txt{
    padding: 1rem;
  }
}
@media (min-width: 768px){
  .performance h4{
    font-size: 1.15rem;
  }
}
@media (max-width: 767px){
  .performance h4{
    font-size: 1rem;
  }
  .performance img{
    max-width: 78%;
  }
  .performance_txt{
    padding: 1rem .75rem;
  }
}

/*高気密高断熱構法
================================*/
.hqp h4{
  color: #ef5a24;
  font-size: 1.1rem;
  font-weight: bold;
  margin-bottom: .75rem;
}
.hqp_fig{
  background-color: #f9f6f2;
  border-radius: 5px;
  text-align: center;
  margin-bottom: 1rem;
}
.hqp_fig img{
  width: 100%;
  max-width: 575px;
}

@media (min-width: 768px){
  .hqp_fig{
    padding: 2rem;
  }
}
@media (max-width: 767px){
  .hqp h4{
    margin-top: 1.5rem;
  }
  .hqp_fig{
    padding: 1rem;
  }
}

/*================================
便利でスマートな家
================================*/
#iot .sect_scroll{
	background-image: url("../img/modelhouse/iot/sect_scroll_bg.jpg");
}

/*スマートホーム機能
================================*/
.sh_ttl{
  position: relative;
  font-size: 1.15rem;
  font-weight: bold;
  padding-left: 1rem;
  margin-top: 2rem;
  margin-bottom: 1rem;
}
.sh_ttl::after{
  content: '';
  display: inline-block;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 6px;
  height: 6px;
  background-color: #22b373;
  border-radius: 50%;
}
.sh_feature img{
  margin-bottom: 1rem;
}
.sh_feature h5{
  font-size: 1.1rem;
  font-weight: bold;
}
.sh_feature p{
  margin-bottom: 0;
}
@media (min-width: 768px){
  .sh_feature h5{
    font-size: 1.1rem;
  }
}
@media (max-width: 767px){
  #smart_home .row > div:not(:last-child) .sh_feature{
    margin-bottom: 2rem;
  }
  .sh_feature h5{
    font-size: 1rem;
  }
}


/*IoT機器
================================*/
#iot #mv_photo img{
  object-position: 35% 50%;
}
.equipment{
  background-color: #f9f6f2;
  border-radius: 5px;
  padding: 15px;
}
.equipment .num{
  color: #ef5a24;
  font-size: 1.4rem;
  text-align: center;
  margin-bottom: .5rem;
}
.equipment img{
  width: 100%;
  max-width: 125px;
  display: block;
  margin-left: auto;
  margin-right: auto;
  margin-bottom: 1rem;
}
.equipment p{
  margin-bottom: 0;
}
@media (max-width: 991px){
  .equipment p{
    font-size: .9rem;
  }
}

