@charset "utf-8";

/* =====================================================
   PC共通ルール
   ・ルートfont-sizeを画面幅に連動させ、rem指定の
     文字・余白・アイコンを全て比例縮小させる
   ・画像とテキストは flex で行の高さを揃える
   ===================================================== */

/* 画面幅1920pxで16px、縮小時は最小10pxまで比例縮小 */
html{font-size:clamp(0.7rem, 0.9vw, 1rem);}
.infofont55 {margin:0px auto 0px;color:#000;padding:1% 0 15px 0;font-size: clamp(1.0rem, 1.0vw, 1.0rem);line-height:160% ;letter-spacing:1px;font-weight: 400;}
.infofont444{max-width:800px;width:70%; height :auto;border: 1px solid #000;margin: 2rem auto 2rem auto;padding: 1.2rem 1rem ;color:#000;text-align:center;letter-spacing:0px;line-height: 170%;font-weight: 400;font-size: clamp(1.0rem, 1.0vw, 1.0rem);font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝","ＭＳ 明朝", serif;}
hr.line {height: 1px;border: none;border-top: 1px #999 solid;margin:0.2rem 0px 0.4rem;}
/* ===== 共通パーツのルート連動を解除 =====
   上のroot可変指定はTOPページ限定のため、.wrap外の共通パーツ
   （ヘッダー・メニュー・フッターナビ）を他ページと同じ16px基準へ戻す。
   navi.css / css/common.css より後に読み込まれるため上書きされる */
#g-nav li{font-size:15.2px;}                            /* 0.95rem 相当 */
.openbtn4 span:nth-of-type(3)::after{font-size:13.3px;} /* 0.83rem 相当 */
.snavi,
.snavi2{font-size:clamp(12.8px, 0.9vw, 19.2px);}        /* 0.8rem〜1.2rem 相当 */
.gnavi2 li{font-size:clamp(9px, 0.8vw, 12.8px);}        /* 0.8rem 相当 */

/* ===== セクション共通 ===== */
.sec{
  display:flex;
  align-items:stretch;
  justify-content:space-between;
  padding:5rem 0;
}
.sec.l{flex-direction:row;}         /* 画像 左 */
.sec.r{flex-direction:row-reverse;} /* 画像 右 */

.sec-img{
  width:46%;
  display:flex;
  align-items:center;
  position:relative;
}
.sec-txt{
  width:46%;
  display:flex;
  flex-direction:column;
  justify-content:center;
}

/* ===== 見出し ===== */
.ttl-en{margin-bottom:1.5rem;}
.ttl-en img{width:auto;height:3.4rem;}
.ttl{margin-bottom:2rem;}

/* ===== アイコン（.tx基準・リード文の右横＝赤枠位置） ===== */
.tx{position:relative;}
.tx .icon{
  position:absolute;
  bottom:.5rem;
  margin:0;
}
.icon{width:6.5rem;}
.icon img{width:100%;}

/* ===== view more ===== */
.btn{width:18rem;margin:2.5rem auto 0;}

/* ===== 円形写真キャプション（円の内側に配置） ===== */
.sec-img .cap{
  position:absolute;
  bottom:4%;
  color:#fff;
  font-family:var(--f-jp);
  text-shadow:0 0 .25rem rgba(0,0,0,.35);
}
.sec.l .sec-img .cap{left:28%;}
.sec.r .sec-img .cap{right:28%;}
/* ===== 写真列・スライダー ===== */
.ph-row{
  justify-content:space-between;
  align-items:stretch;
  max-width:72%;
  margin-inline:auto;
  gap:1rem;
}
.ph-row li{width:calc((100% - 2rem) / 3);display:flex;}
.slides{gap:1rem;padding-right:1rem;}
/* 1画面に4.5枚表示（gap分を差し引き） */
.slides li{width:calc(min(100vw, 2000px) / 4.5 - 1rem);display:flex;}

/* ===== KV / PRIME STYLE ===== */
.kv{
  background:var(--c-bg2);
  padding:4rem 0 6rem;margin:4rem 0 0rem; /* 下余白をKICHIJOJI直前まで伸ばし背景色を敷く */
  text-align:center;
}
.kv-logo{margin-bottom:1.5rem;}
.kv-logo img{width:35%;max-width:80%;margin-inline:auto;}
.kv-ttl{margin-bottom:1.75rem;}
.kv-lead{margin-bottom:2.5rem;}
.kv-map{width:100%;}
.kv-cap{text-align:right;margin-top:.5rem;padding-right:1rem;}

/* ===== スライダー速度（枚数×12s） ===== */
.kichi .track{animation-duration:96s;} /* 8枚 */
.loc .track{animation-duration:72s;}   /* 6枚 */

/* ===== KICHIJOJI ===== */
.kichi{
  padding-bottom:0rem; /* coming soon下を詰める */
  /* 上部10%まで背景色を敷き、カフェ写真の上部を色地に重ねる */
  background:linear-gradient(to bottom, var(--c-bg2) 5%, transparent 5%);
}
.kichi-top{padding:0 0 3rem;} /* 上余白は.kvの下余白へ移譲（合計の余白量は不変） */
/* 円形写真が左端に見切れる配置 */
.kichi-top .sec-img{width:40%;margin-left:-8%;}
.kichi-top .sec-txt{width:48%;margin-right:6%;}
.kichi-top .icon-shop{width:7rem;right:20%;}
.kichi .slider{margin-top:1rem;}

/* ===== LOCATION ===== */
.loc{padding-bottom:0rem;} /* coming soon下を詰める */
.loc-top{padding-bottom:3rem;}
/* 右側の円形写真：サイズ縮小 */
.loc-top .sec-img{width:38%;margin-right:0;}
.loc-top .sec-txt{width:50%;}
.loc-top .icon-tree{width:6rem;right:28%;bottom:1rem;}

/* ===== ACCESS ===== */
.acc{padding-bottom:0rem;} /* coming soon下を詰める */
.acc-top{padding-bottom:3rem;}
.acc-top .sec-img{width:40%;margin-left:-8%;}
.acc-top .sec-txt{width:48%;margin-right:6%;}
.acc-top .icon-bldg{width:9rem;right:6%;bottom:.5rem;}

/* ===== PLAN ===== */
.plan .sec-img{width:40%;margin-right:-8%;}
.plan .sec-txt{width:48%;margin-left:6%;}
.plan .icon-dog{width:6.5rem;right:0;}
.plan .btn{margin-top:2rem;}

/* ===== BANNER（中央揃え） ===== */
.bnr{
  display:flex;
  align-items:stretch;
  width:60%;
  max-width:60%;
  margin-inline:auto;
  margin-bottom:2rem;
}
.bnr-img{
  position:relative;
  width:31%;
  overflow:hidden;
  display:flex;
  align-items:center;
  justify-content:center;
}
.bnr-img img{width:100%;height:auto;}
.bnr-img .cap{
  position:absolute;
  right:.75rem;
  bottom:.5rem;
  color:#fff;
  font-family:var(--f-en);
  text-shadow:0 0 .25rem rgba(0,0,0,.35);
}
.bnr-body{
  width:38%;
  background:var(--c-grn);
  color:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  padding:2rem 1.5rem;
}
.bnr-ttl{margin-bottom:.75rem;}
.bnr-ttl img{width:15rem;max-width:90%;margin-inline:auto;}
.bnr-sub{
  font-size:clamp(0.7rem, 0.3vw + 0.62rem, 0.85rem);
  letter-spacing:.12em;
  margin-bottom:1.25rem;
}
.bnr-list{
  width:82%;
  display:flex;
  flex-direction:column;
  gap:.6rem;
  margin-bottom:1.25rem;
}
.bnr-list li{
  background:#fff;
  color:var(--c-grn);
  font-size:clamp(0.75rem, 0.3vw + 0.66rem, 0.9rem);
  letter-spacing:.28em;
  padding:.35rem .5rem;
}
.bnr-soon{
  display:flex;
  align-items:center;
  gap:.6rem;
  font-family:var(--f-en);
  font-size:clamp(0.8rem, 0.35vw + 0.7rem, 0.95rem);
  letter-spacing:.18em;
}
.bnr-soon::after{
  content:"";
  width:3rem;
  height:1px;
  background:currentColor;
}

/* ===== 注釈 ===== */
.note-area{padding:3rem 0 4rem;}
.note-area .note{text-align:center;}

/* ===== ページTOPへ戻る ===== */
.ptop{
  right:1.5rem;
  bottom:1.5rem;
  width:3.5rem;
  height:3.5rem;
}

/* ===== 物件メリット帯（4列×2段） ===== */
.feat{
  padding:0 4%;
  margin-top:5rem; /* TOPスライドとの間の白スペース */
}
.feat-list{
  grid-template-columns:repeat(4, 1fr);
  row-gap:6px; /* 1段目と2段目の間隔 */
  position:relative;
}
/* 段間の横罫：太め・帯の全幅（padding分の外まで延長） */
.feat-list::after{
  content:"";
  position:absolute;
  top:50%;
  transform:translateY(-50%);
  left:-4.35%;
  right:-4.35%;
  height:3px;
  background:#fff;
}
.feat-list li{
  position:relative;
  padding:1.5rem 1rem;
  display:flex;
  flex-direction:column;
  justify-content:center;
}
/* 縦罫：セル高さの65%・上下中央（両端含む） */
.feat-list li::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  transform:translateY(-50%);
  width:1px;
  height:65%;
  background:#fff;
}
.feat-list li:nth-child(4n)::after{
  content:"";
  position:absolute;
  right:0;
  top:50%;
  transform:translateY(-50%);
  width:1px;
  height:65%;
  background:#fff;
}