@charset "UTF-8";
/* ==========================================================
   model2.css｜モデルハウスページ専用
   読み込み：../css2/model2.css
   ========================================================== */

/* ===== メインスライダー ドット（共通） ===== */
.gallery-main .slick-dots{
  position:relative;
  bottom:-10px;
  list-style:none;
  display:flex !important;
  justify-content:center;
  padding:0;
  margin:0;
  width:100%;
}
.gallery-main .slick-dots li{
  margin:0 2px;
  width:10px;
  height:10px;
}
.gallery-main .slick-dots li button::before{
  display:none !important;
}
.gallery-main .slick-dots li button{
  display:block;
  width:4px;
  height:4px;
  background:#ccc;
  border-radius:50%;
  border:none;
  outline:none;
  font-size:7px;
  line-height:7px;
  text-align:center;
  padding:0;
  cursor:pointer;
}
.gallery-main .slick-dots li.slick-active button{
  background:#666;
}
.gallery-thumb{
  margin-top:-15px !important;
}
.plan-subheading{
  margin:1rem auto 1rem;
  padding:0;
}

/* ==========================================================
   PC
   ========================================================== */
@media screen and (min-width:751px){

/* ===== 号棟見出し ===== */
.no{
  max-width:1200px;
  width:90%;
  margin:0 auto;
  padding:2rem 0 1rem 0;
  display:flex;
  align-items:center;
  gap:0.5rem;
  text-align:left;
  font-size:clamp(1rem, 1.2vw + 0.4rem, 1.4rem);
  font-weight:normal;
  line-height:1;
  white-space:nowrap;
}
.no::after{
  content:"";
  flex:1;
  height:1rem;
  background:#002060;
}
/* 親(.gallery-main1)内では幅100% */
.gallery-main1 .no{
  width:100%;
  max-width:none;
}
.gallery-main1 img{
  width:100%;
  height:auto;
  display:block;
}

/* ===== モデルハウス枠 ===== */
.modelbg{
  width:100%;
  height:auto;
  background:url("../modelhouse/img/locabg1.webp") no-repeat top center;
  background-size:cover;
  padding:60px 0 20px 0;
  position:relative;
}
.model{
  width:100%;
  height:auto;
  margin:0 auto;
  padding:130px 0 0 0;
  text-align:center;
}
.modeltitle{
  width:100%;
  height:auto;
  margin:0 auto;
  padding:0;
  text-align:center;
}
.modelfont{
  width:90%;
  height:auto;
  margin:0 auto;
  text-align:center;
  padding:3rem 0 4rem 0;
  font-size:clamp(1rem, 3vw, 2rem);
}
.gallery-main1{
  margin:0 auto;
  max-width:1200px;
  width:90%;
  padding:0 0 30px 0;
}
.gallery-main,
.gallery-thumb{
  margin:0 auto;
  max-width:1200px;
  width:90%;
  position:relative;
  padding:0;
}

/* ===== メインスライダー画像 ===== */
.gallery-main img{
  width:100%;
  height:auto;
  display:block;
  padding:0;
}

/* ===== サムネイルスライダー ===== */
.gallery-thumb{
  margin-top:0;
  padding:0;
}
.gallery-thumb .slick-slide{
  padding:0 1px;
}
.gallery-thumb img{
  display:block;
  width:100%;
  height:100px;
  object-fit:cover;
  cursor:pointer;
  box-sizing:border-box;
  transition:border 0.3s ease;
  image-rendering:-webkit-optimize-contrast;
  image-rendering:crisp-edges;
  -ms-interpolation-mode:nearest-neighbor;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  padding:0;
}
.gallery-thumb .slick-current img{
  border:3px solid red;
  box-sizing:border-box;
  padding:0;
}

/* ===== 矢印（メイン） ===== */
.gallery-main .slick-prev,
.gallery-main .slick-next{
  z-index:5;
  width:20px;
  height:80px;
  background:rgba(0,0,0,0.2);
  border-radius:0;
  color:#fff;
  top:50%;
  transform:translateY(-50%);
  transition:background 0.3s;
}
.gallery-main .slick-prev:hover,
.gallery-main .slick-next:hover{
  background:rgba(255,0,0,0.8);
}
.gallery-main .slick-prev{left:0;}
.gallery-main .slick-next{right:0;}

/* ===== 矢印（サムネイル） ===== */
.gallery-thumb .slick-prev,
.gallery-thumb .slick-next{
  z-index:2;
  width:20px;
  height:100%;
  background:rgba(0,0,0,0.2);
  border-radius:0;
  color:#fff;
  top:40%;
  transform:translateY(-50%);
  transition:background 0.3s;
  margin:0.8% 0 0;
}
.gallery-thumb .slick-prev:hover,
.gallery-thumb .slick-next:hover{
  background:rgba(255,0,0,0.7);
}
.gallery-thumb .slick-prev{left:0;}
.gallery-thumb .slick-next{right:0;}

/* ===== 注釈 ===== */
.modelcap{
  max-width:1200px;
  width:90%;
  height:auto;
  margin:0 auto;
  text-align:left;
  padding:20px 0 30px 0;
  font-family:"メイリオ","Meiryo",verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
  font-size:70%;
}

}

/* ==========================================================
   SP
   ========================================================== */
@media screen and (max-width:750px){

/* ===== ドット微調整 ===== */
.gallery-main .slick-dots{
  bottom:-8px;
}
.gallery-thumb{
  margin-top:-16px !important;
}
.gallery-main .slick-dots li{
  width:8px;
  height:4px;
}
.plan-subheading{
  margin:1rem auto 1rem;
  padding:0;
  text-align:center;
}

/* ===== 号棟見出し ===== */
.no{
  width:100%;
  margin:0 auto;
  padding:1.5rem 0 0.8rem 0;
  display:flex;
  align-items:center;
  gap:0.4rem;
  text-align:left;
  font-size:clamp(0.9rem, 2.5vw + 0.3rem, 1.2rem);
  font-weight:normal;
  line-height:1;
  white-space:nowrap;
}
.no::after{
  content:"";
  flex:1;
  height:0.6rem;
  background:#002060;
}
.gallery-main1 img{
  width:100%;
  height:auto;
  display:block;
}

/* ===== モデルハウス枠 ===== */
.modelbg{
  width:90%;
  height:auto;
  background:url("../modelhouse/img/locabg1.webp") no-repeat top center;
  background-size:cover;
  padding:20px 0;
  position:relative;
  margin:0 auto;
}
.model{
  width:100%;
  height:auto;
  margin:0 auto;
  padding:50px 0 0 0;
  text-align:center;
}
.modeltitle{
  width:100%;
  height:auto;
  margin:0 auto;
  padding:0;
  text-align:center;
}
.modelfont{
  width:100%;
  height:auto;
  margin:0 auto;
  text-align:center;
  padding:1rem 0;
  font-size:clamp(1.2rem, 2vw, 2rem);
  line-height:1.6;
}
.gallery-main,
.gallery-thumb{
  margin:0 auto;
  width:100%;
  position:relative;
}

/* ===== メインスライダー画像 ===== */
.gallery-main img{
  width:100%;
  height:auto;
  display:block;
}

/* ===== サムネイルスライダー ===== */
.gallery-thumb{
  padding:0;
}
.gallery-thumb .slick-slide{
  padding:0 1px;
}
.gallery-thumb img{
  display:block;
  width:100%;
  height:50px;
  object-fit:cover;
  cursor:pointer;
  box-sizing:border-box;
  transition:border 0.3s ease;
  image-rendering:-webkit-optimize-contrast;
  image-rendering:crisp-edges;
  -ms-interpolation-mode:nearest-neighbor;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  padding:0;
}
.gallery-thumb .slick-current img{
  border:3px solid red;
  box-sizing:border-box;
  padding:0;
}

/* ===== 矢印（メイン） ===== */
.gallery-main .slick-prev,
.gallery-main .slick-next{
  z-index:5;
  width:20px;
  height:80px;
  background:rgba(0,0,0,0.2);
  border-radius:0;
  color:#fff;
  top:50%;
  transform:translateY(-50%);
  transition:background 0.3s;
}
.gallery-main .slick-prev:hover,
.gallery-main .slick-next:hover{
  background:rgba(255,0,0,0.8);
}
.gallery-main .slick-prev{left:0;}
.gallery-main .slick-next{right:0;}

/* ===== 矢印（サムネイル） ===== */
.gallery-thumb .slick-prev,
.gallery-thumb .slick-next{
  z-index:2;
  width:20px;
  height:100%;
  background:rgba(0,0,0,0.2);
  border-radius:0;
  color:#fff;
  top:40%;
  transform:translateY(-40%);
  transition:background 0.3s;
}
.gallery-thumb .slick-prev:hover,
.gallery-thumb .slick-next:hover{
  background:rgba(255,0,0,0.7);
}
.gallery-thumb .slick-prev{left:0;}
.gallery-thumb .slick-next{right:0;}

/* ===== 注釈 ===== */
.modelcap{
  max-width:1200px;
  width:100%;
  height:auto;
  margin:0 auto;
  text-align:left;
  padding:20px 0 30px 0;
  font-family:"メイリオ","Meiryo",verdana,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro",Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
  font-size:70%;
}

}