@charset "utf-8";
/*スマホ*/
@media screen and (max-width:750px){

.topobi1bg{width:100%;padding: 1% 0px 3% 0px;margin: 0% auto 1% auto;background: url('../img/common/bg.webp') center top / auto ;}
.plan4{width:100%;height:auto;margin:0px auto 0px auto;padding: 0px 0% 20px 0%;text-align:center;}
.f-container2 {display: flex;flex-wrap: wrap;justify-content: flex-start;width: 100%;margin: 0px auto 0px auto ;padding: 2.8rem 0px 0.5rem 0px;} 
.f-item2 {width: 70%;margin-right: 0.9%;margin-left: 0.9%;margin-top: 8px; text-align:center;font-size: 90%; margin: 0px auto 0px auto ;}
.f-item2 img{ width: 100%;margin-bottom: 30px; }
.plancap2{clear: both; width:90%;height: auto;margin: 0px auto 0px auto;padding: 30px 0px 30px 0px;font-size:75%;text-align:left;line-height:150%;font-weight: 400;}
.btnList {margin: 0rem auto 0px;display: flex;flex-wrap: wrap;justify-content: space-between;width: 91%;;padding: 0px 0px 0px 0px;}
.btnList li{width: 100%;margin: 0px;}
.btnList li a {display: block;width: 100%;text-align: center;font-size: 16px;color: #fff;background: #59607c;letter-spacing: 0.1rem;line-height: 3;text-decoration:none; transition: .3s all;
}
.btnList li a:hover {opacity: 0.8;}
.plan3 .btnList li:nth-child(1){margin:20px auto 20px auto ;}
.plan3 .btnList li:nth-child(2){margin:0px auto 0px auto ;}
.plan3 li:nth-child(2) img{width: 90%;margin:0px auto 0px auto ;}
	
	
	
.maintop{;width:100%;margin:40px auto 0px auto ;height:auto;text-align:center;padding: 0px 0px 0px 0px;}
.main{max-width:1200px;width:90%;margin: 0px auto 0px auto ;height:auto;text-align:center;padding: 0px 0px 0px 0px;}
.conoie{width:25%;height:auto;margin:12% auto 1% auto;padding: 0% 0% 0% 0%;text-align:center;}
.title {margin-top:7%;font-size:clamp(1.2rem, 1.4vw, 1.7rem); color:#fff;line-height: 150%;font-weight: 700 ;text-align:center;}
.title1 {margin-top:9%;font-size:clamp(1.0rem, 1.4vw, 1.7rem); color:#000;line-height: 150%;font-weight: 700 ;text-align:center; }
.title2 {height:auto;margin:0px auto 0px auto;padding: 4% 0px 0% 0px;text-align: center;color:#000;font-weight: 400;letter-spacing:0px;line-height:160%;font-size: clamp(1.1rem, 1.4vw, 1.4rem);}
.title3 {height:auto;margin:0px auto 0px auto;padding: 1% 0px 5% 0px;text-align: center;color:#fff;font-weight: 400;letter-spacing:0px;line-height:160%;font-size: clamp(1.0rem, 1.5vw, 1.5rem);}
.text1{;width:90%;margin:0px auto 0px auto;padding: 0rem 0% 0% 0%;text-align:left; font-size: clamp(0.85rem, 0.5vw + 0.6rem, 1.0rem);line-height: 1.7;font-weight: 400;color:#fff;}
.main2{width:90%;margin: 0px auto 0px auto ;height:auto;text-align:center;padding: 7% 0px 9% 0px;}
.cap2{ width:100%;height: auto;margin: 0px auto 0px auto;padding: 4% 0px 3% 0px;font-size:70%;text-align:left;line-height:170%;font-weight: 400;color:#fff;}
.conoie{width:25%;height:auto;margin:12% auto 1% auto;padding: 0% 0% 0% 0%;text-align:center;}
}



/*PC*/
@media screen and (min-width:751px){
.topobi1bg{width:100%;padding: 1% 0px 3% 0px;margin: 0% auto 1% auto;background: url('../img/common/bg.webp') center top / auto ;}
.plan4{max-width:800px;width:90%;height:auto;margin:3% auto 2% auto;padding: 0px 0% 3% 0%;text-align:center;}
.plan3{width:100%;margin: 2rem auto 70px auto ;height:auto;text-align:center;padding: 0px 0% 50px 0%;}
.plan3 ul li{margin:0px auto 0px auto;height:auto;text-align:center;padding:0;}
.f-container2 {display: flex;flex-wrap: wrap;justify-content: flex-start;width: 100%;margin: 0px auto 0px auto ;padding: 0rem 0px 2rem 0px;} 
.f-item2 {max-width:1000px;width: 45%;margin-right: 2%;margin-left: 2%;margin-top: 0.5rem;margin-bottom: 1.4rem; text-align:left;font-size: 90%; }
.f-item2 img{ width: 100%;}
.maintop{;width:100%;margin:90px auto 0px auto ;height:auto;text-align:center;padding: 0px 0px 0px 0px;}
.main{max-width:1200px;width:90%;margin: 0px auto 0px auto ;height:auto;text-align:center;padding: 0 0px 0px 0px;}
.main2{max-width:1200px;width:90%;margin: 0px auto 0px auto ;height:auto;text-align:center;padding: 7% 0px 2% 0px;}
.title {margin-top:3%;font-size:clamp(1.0rem, 1.4vw, 1.7rem); color:#fff;line-height: 150%;font-weight: 700; text-align:center;}
.title1 {margin:3% 0 3%;font-size:clamp(1.0rem, 1.4vw, 1.7rem); color:#000;line-height: 150%;font-weight: 700 ;text-align:center;}
.title2 {height:auto;margin:0px auto 0px auto;padding: 4% 0px 0% 0px;text-align: center;color:#fff;font-weight: 400;letter-spacing:0px;line-height:160%;font-size: clamp(1.0rem, 1.4vw, 1.5rem);}
.title3 {height:auto;margin:0px auto 0px auto;padding: 2% 0px 3% 0px;text-align: center;color:#fff;font-weight: 400;letter-spacing:0px;line-height:160%;font-size: clamp(1.1rem, 1.5vw, 1.9rem);}
.text1{margin:0px auto 0px auto;padding: 0rem 0% 2% 0%;text-align:center; font-size: clamp(0.9rem, 0.5vw + 0.6rem, 1.1rem);line-height: 1.7;font-weight: 400;color:#fff;}
.cap2{clear: both; width:100%;height: auto;margin: 0px auto 0px auto;padding: 4% 0px 8% 0px;font-size:75%;text-align:center;line-height:170%;font-weight: 400;color:#fff;}
.btnList {max-width: 730px;margin: 5rem auto 0rem;display: flex;flex-wrap: wrap;justify-content: space-between;width: 91%;}
.btnList li{width: 49%;margin-bottom: 15px;}
.btnList li a {display: block;width: 100%;text-align: center;font-size: 16px;color: #fff;background: #59607c;letter-spacing: 0.1rem;line-height: 3;text-decoration:none; transition: .3s all;
}
.btnList li a:hover {opacity: 0.8;}
.conoie{max-width:160px;width:25%;height:auto;margin:4% auto 0% auto;padding: 0% 0% 0% 0%;text-align:center;}
}



/* ===== 印刷スタイル（間取りページ） ===== */
@media print {
  /* 用紙設定 */
  @page {
    margin: 10mm;
  }

  html,
  body {
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
    font-size: 10pt;
  }

  .main2 {
    width: 100%;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  .title {
    margin: 0 0 0.3rem;
    page-break-after: avoid;
    break-after: avoid;
  }

  .plan3 {
    width: 100%;
    page-break-inside: avoid;
    break-inside: avoid;
  }

  /* メイン画像 */
  .plan3 > img {
    width: 90%;
    height: auto;
    max-height: 60vh;
    object-fit: contain;
    display: block;
    margin: 0 auto;
  }

/* サブ画像2枚を縦並び */
.plan3 > ul {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
  width: 100%;
  list-style: none;
  padding: 0;
  margin: 0.3rem 0 0;
  page-break-inside: avoid;
  break-inside: avoid;
}
.plan3 > ul > li {
  width: 100%;
}
.plan3 > ul > li img {
  width: 100%;
  height: auto;
  max-height: 70vh;
  object-fit: contain;
  display: block;
  margin: 0 auto;
}
.plan3 > ul > li:last-child img {
  width: 50%;
}

  .plancap2 {
    font-size: 8pt;
    margin-top: 0.3rem;
  }

  /* リンクのURL非表示 */
  a[href]::after {
    content: none !important;
  }
}

@media print {
  #page-top { display: none; }
  hr { display: none; }
  .copyright { display: none; }
  .fgnavi { display: none; }
  .maintop { display: none; }
  .info { display: none; }
  .footer2 { display: none; }
  .form { display: none; }
  .headerbg { display: none; }
  .btnList { display: none; }
  .btnList li{ display: none; }
  .content-print {
    top: 0 !important;
    left: 0 !important;
    width: 172mm !important;
    height: 251mm !important;
  }
}