@charset "utf-8";


/*Font Awesomeの読み込み
---------------------------------------------------------------------------*/
@import url("https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.6.0/css/all.min.css");


/*エラー、OK、注意書き
--------------------------------------------------------*/
.err{background: #ffecec;color:#a10000;padding: 0.5rem;}
.ok{background: #e4f2fd;color:var(--secondary-color);padding: 0.5rem;}
.notice{background: #ff0000;color:#fff;display: inline-block;padding: 0 0.5rem;margin-bottom: 2rem;}


/*著作部分（※意図的に見えなくしたりしないで下さい。規約違反になります。）
--------------------------------------------------------*/
.pr a {
	text-decoration: none;display: block;
	background: rgba(0,0,0,0.8);
	color: #ccc;
	text-align: right;
	padding: 0.2rem 1rem;
	font-size: 0.8rem;
}
.pr a::before {
	font-family: "Font Awesome 6 Free";
	content: "\e2ca";
	font-weight: bold;
	margin-right: 0.5em;
}


/*カテゴリー名バッジ（写真左上）
--------------------------------------------------------*/
/*バッジを写真に重ねて絶対配置するための基準位置*/
.list-tpcms figure {
  position: relative;
}
.category-badge {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 4;
  background: rgba(20,26,34,.72);
  color: #fff;
  font-size: 0.85rem;
  font-weight: 700;
  line-height: 1.2;
  padding: 0.4em 0.8em;
  letter-spacing: 0.02em;
}


/*NEW、UP、おすすめアイコン
--------------------------------------------------------*/
.new-icon, .up-icon, .recommend-icon {
  font-size: 0.8rem;
  display: inline-block;
  border-radius: 3px;
  padding: 0 0.4rem;
  vertical-align: middle;
}
.new-icon {
  background: #cc2701;
  color: #fff;
}
.up-icon {
  background: #659efb;
  color: #fff;
}
.recommend-icon {
  background: #4caf50;
  color: #fff;
}
/*バッジ同士が並ぶ時の間隔（NEW＋おすすめ など）*/
.new-icon + .recommend-icon,
.up-icon + .recommend-icon,
.new-icon + .up-icon {
  margin-left: 0.3rem;
}
.list-tpcms h4 a {
  margin-right: 0.2rem;
}


/*SOLD OUT表示（物件情報カード全体に重ねる）
--------------------------------------------------------*/
/*.list-tpcms（カード全体＝写真＋価格情報など）を基準にSOLD OUTを絶対配置する*/
.list-tpcms {
  position: relative;
}
.sold-out-overlay {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(26,90,196,.62);
  z-index: 5;
  cursor: not-allowed;
  text-align: center;
  padding: 0 0.5rem;
}
.sold-out-overlay span {
  display: inline-block;
  color: #fff;
  font-weight: 800;
  font-size: clamp(1.4rem, 5vw, 2.2rem);	/*大きめの文字。カード幅に応じて自動調整*/
  letter-spacing: 0.08em;
  text-shadow: 0 2px 8px rgba(0,0,0,.35);
}


/*list-tpcms-grid（グリッドレイアウト）
---------------------------------------------------------------------------*/
/*ブロック全体を囲むブロック*/
.list-tpcms-grid {
	display: grid;
  grid-template-columns: repeat(4, 1fr);  /*4列*/
  gap: 1.5rem;
  margin-bottom: 2rem;
}
/*ブロック幅が1000px未満で２列に*/
.list-tpcms-grid.window-s {
  grid-template-columns: repeat(2, 1fr);
}
/*ボックス１個あたり*/
.list-tpcms-grid .list-tpcms {
  display: grid;
	position: relative;
	padding: 1rem;
	background: #fff;
	color: #555;
  grid-template-rows: auto 1fr;	
	box-shadow: 5px 5px 20px rgba(0,0,0,0.1);
}
/*ボックス内のh4見出し
  ※.list-tpcms-grid／.list-tpcms-row のどちらで囲まれていても、また
  （新着物件情報のように）専用ラッパーが無く既定表示になった場合でも、
  カードの文字サイズが必ず統一されるよう、ラッパーではなくカード本体
  （.list-tpcms）に対して指定しています。*/
.list-tpcms h4 {
  margin: 0 0 0.5rem;
  font-size: 1.2rem;
}
/*カテゴリー・住所・価格の3行サマリー（写真の下）
  ※カテゴリーが増えてもレイアウトが崩れないよう、全カテゴリー共通の固定表示にしています*/
.card-summary {
  margin-top: 0.25rem;
}
.card-cat {
  margin: 0 0 0.2rem;
  font-weight: 700;
  font-size: 0.95rem;
  color: #333;
}
.card-address {
  margin: 0 0 0.5rem;
  font-size: 0.9rem;
  color: #555;
  line-height: 1.4;
}
.card-price {
  margin: 0;
  font-size: 1.6rem;
  font-weight: 800;
  color: #e8720c;
  line-height: 1.2;
}
.card-price .unit {
  margin-left: 0.15rem;
  font-size: 0.95rem;
  font-weight: 700;
  color: #555;
}
/*ボックス内のp要素*/
.list-tpcms-grid .list-tpcms p {
	font-size: 0.85rem;
	line-height: 1.5;
}
/*上のp要素の汎用指定より、カテゴリー・住所・価格（.card-cat／.card-address／.card-price）を
  優先させるための上書き。これが無いと一覧ページ（.list-tpcms-grid）だけ価格などの文字が
  小さくなり、トップページ（新着物件・おすすめ物件）と見た目がずれてしまう。*/
.list-tpcms-grid .list-tpcms p.card-cat {
	font-size: 0.95rem;
	line-height: 1.4;
}
.list-tpcms-grid .list-tpcms p.card-address {
	font-size: 0.9rem;
	line-height: 1.4;
}
.list-tpcms-grid .list-tpcms p.card-price {
	font-size: 1.6rem;
	line-height: 1.2;
}
.list-tpcms-grid .list-tpcms p.card-price .unit {
	font-size: 0.95rem;
}
/*ボックス内のfigure画像*/
.list-tpcms-grid .list-tpcms figure img {
	width: 100%;
	aspect-ratio: 4 / 3;	/*画像の縦横比を揃えて四角いカードに見せる（トップページと統一）*/
	object-fit: cover;
	display: block;
	margin-bottom: 0.5rem;
}


/*list-tpcms-row（横長レイアウト）
---------------------------------------------------------------------------*/
.list-tpcms-row {
  margin-bottom: 2rem;
}
/*ボックス１個あたり*/
.list-tpcms-row .list-tpcms {
	display: flex;
	gap: 2vw;
	margin-bottom: 1rem;
}
/*テキストブロック*/
.list-tpcms-row .text {
	flex: 1;
}
/*画像ブロック*/
.list-tpcms-row figure {
	width: 30%;
}
/*説明テキスト*/
.list-tpcms-row p {
	margin: 0;	
}


/*トップページ「新着物件情報」（#recent-properties）／「おすすめ物件」（#recommend-properties）
  専用の表示調整
---------------------------------------------------------------------------*/
/*ここは元々 .list-tpcms-row（横長・縦積み）のスタイルが使われていた前提で、
  PCでは3列グリッド、スマートフォンでは1列に固定するよう上書きしています。
  実際のマークアップは templates/_home.recents.html・_home.recommend.html 側
  （どちらも .list-tpcms-row を出力）で決まりますが、テンプレが無い場合の
  既定表示（.tpcms-list.recents／.tpcms-list.recommend）でも同じ見た目に
  なるよう、両方のクラス名に対して保険をかけています。*/
#recent-properties .list-tpcms-row,
#recent-properties .list-tpcms-grid,
#recent-properties .tpcms-list.recents,
#recommend-properties .list-tpcms-row,
#recommend-properties .list-tpcms-grid,
#recommend-properties .tpcms-list.recommend {
  display: grid;
  grid-template-columns: repeat(4, 1fr);  /*PC：新しい順に左上から4列で並ぶ*/
  gap: 1.5rem;
  margin-bottom: 2rem;
}
/*物件ボックス１個あたり：横並び(flex)ではなく、画像を上・情報を下に積む
  正方形に近いカードにする*/
#recent-properties .list-tpcms,
#recommend-properties .list-tpcms {
  display: grid;
  grid-template-rows: auto 1fr;
  position: relative;
  gap: 0;
  padding: 1rem;
  margin-bottom: 0;
  background: #fff;
  color: #555;
  box-shadow: 5px 5px 20px rgba(0,0,0,0.1);
}
#recent-properties .list-tpcms figure,
#recommend-properties .list-tpcms figure {
  width: 100%;
  margin: 0 0 0.5rem;
}
#recent-properties .list-tpcms figure img,
#recommend-properties .list-tpcms figure img {
  width: 100%;
  aspect-ratio: 4 / 3;   /*画像の縦横比を揃えて四角いカードに見せる*/
  object-fit: cover;
  display: block;
}
#recent-properties .list-tpcms .text,
#recommend-properties .list-tpcms .text {
  flex: none;
}
#recent-properties dl.tpcms-dl-table,
#recommend-properties dl.tpcms-dl-table {
  font-size: 0.75rem;
}

	/*画面幅900px以下：タブレット・スマートフォンではレスポンシブに切り替え*/
	@media screen and (min-width:601px) and (max-width:900px) {
		#recent-properties .list-tpcms-row,
		#recent-properties .list-tpcms-grid,
		#recent-properties .tpcms-list.recents,
		#recommend-properties .list-tpcms-row,
		#recommend-properties .list-tpcms-grid,
		#recommend-properties .tpcms-list.recommend {
			grid-template-columns: repeat(2, 1fr);
		}
	}

	@media screen and (max-width:600px) {

	#recent-properties .list-tpcms-row,
	#recent-properties .list-tpcms-grid,
	#recent-properties .tpcms-list.recents,
	#recommend-properties .list-tpcms-row,
	#recommend-properties .list-tpcms-grid,
	#recommend-properties .tpcms-list.recommend {
		grid-template-columns: 1fr;
	}

	}/*追加指定ここまで*/


/*詳細ページ：物件のおすすめポイント・コメント（{{COMMENT}}）
---------------------------------------------------------------------------*/
/*ギャラリーの下、詳細テーブルの上に表示する、ラベル無しの目立つ吹き出し風ボックス*/
.tpcms-comment-box {
  margin: 1.5rem 0;
  padding: 1.2rem 1.4rem;
  background: #f5f8fb;
  border-left: 4px solid var(--primary-color, #2f7bc4);
  font-size: 0.95rem;
  line-height: 1.8;
  color: #333;
}


/*一覧ブロック内のtableっぽく見える所
---------------------------------------------------------------------------*/
dl.tpcms-dl-table {
	margin: 0;
	display: grid;
	grid-template-columns: repeat(2, auto 1fr);
	font-size: 0.85rem;
	border-top: 1px solid #ddd;
}
/*グリッドレイアウトで文字サイズをもっと小さく*/
.list-tpcms-grid dl.tpcms-dl-table {
	font-size: 0.75rem;
}
dl.tpcms-dl-table dt, dl.tpcms-dl-table dd {
	border-bottom: 1px solid #ddd;
	padding: 0 0.2rem;
}

	/*画面幅900px以下の追加指定*/
	@media screen and (max-width:900px) {

  dl.tpcms-dl-table {
    grid-template-columns: auto 1fr;
  }

	}/*追加指定ここまで*/

/*詳細ページ：PC幅では2列。
  項目（ラベル＋値）を1件ずつ .row としてまとめ、CSSの段組み（columns）で
  「左列を上から下へ流し、埋まったら右列へ」という順番で表示する。
  ※以前は3列グリッドで「左→右→左→右…」と横方向に並んでいたため見づらかった点を改善。
  スマホ幅では1列表示。*/
body.detail article dl.tpcms-dl-table {
  display: block; /* 上位の汎用ルール(display:grid)を打ち消して段組みを効かせる */
  margin: 0;
  font-size: 1rem;
  border-top: 1px solid #ddd;
  column-count: 2;
  column-gap: 2.5rem;
}
@media screen and (max-width:900px) {
  body.detail article dl.tpcms-dl-table {
    column-count: 1;
  }
}
/*項目1件分のブロック。列の途中で分割されないようにし（break-inside:avoid）、
  ラベルと値を横並びにする*/
body.detail article dl.tpcms-dl-table > div {
  display: grid;
  grid-template-columns: minmax(6.5em, max-content) 1fr;
  column-gap: 1.2rem;
  align-items: start;
  break-inside: avoid;
  -webkit-column-break-inside: avoid;
  page-break-inside: avoid;
  border-bottom: 1px solid #ddd;
}
body.detail article dl.tpcms-dl-table dt,
body.detail article dl.tpcms-dl-table dd {
  padding: 0.6rem 0;
  margin: 0;
  min-width: 0;
  overflow-wrap: break-word;
}
/*項目名（ラベル）はデータと見分けやすいよう太字表示に*/
body.detail article dl.tpcms-dl-table dt {
  font-weight: 700;
  color: #222;
}


/*検索ブロック
---------------------------------------------------------------------------*/
/* ---------- Search (共通) ---------- */
.tpcms-search {
  --tpcms-border: #ddd;
  --tpcms-text: #222;
  --tpcms-muted: #666;
  --tpcms-bg: #fff;
  --tpcms-filter-bg: #fafafa;
  --tpcms-radius: 3px;
  --gap: .75rem;

  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--gap);
  align-items: end;
  margin: 1rem 0;
  color: var(--tpcms-text);
}

.tpcms-search input[type="search"],
.tpcms-search select {
  width: 100%;
  height: 2.6rem;
  padding: 0 .8rem;
  border: 1px solid var(--tpcms-border);
  border-radius: var(--tpcms-radius);
  background: var(--tpcms-bg);
  font-size: .95rem;
  line-height: 1;
  transition: border-color .15s ease, box-shadow .15s ease;
}

.tpcms-search input[type="search"]::placeholder {
  color: #999;
}

.tpcms-search input[type="search"]:focus,
.tpcms-search select:focus,
.tpcms-search button:focus {
  outline: none;
  border-color: #bbb;
  box-shadow: 0 0 0 3px rgba(0,0,0,.06);
}

/* ボタン */
.tpcms-search button[type="submit"] {
  height: 2.6rem;
  padding: 0 1rem;
  border: none;
  border-radius: var(--tpcms-radius);
  background: #222;
  color: #fff;
  font-weight: 600;
  cursor: pointer;
  transition: filter .15s ease;
}
.tpcms-search button[type="submit"]:hover { filter: brightness(1.08); }

.tpcms-search .tpcms-reset {
  height: 2.6rem;
  padding: 0 1rem;
  border: 1px solid var(--tpcms-border);
  border-radius: var(--tpcms-radius);
  background: transparent;
  color: var(--tpcms-text);
  cursor: pointer;
}

/* 結果件数 */
.tpcms-result-count {
  grid-column: 1 / -1;
  margin: .25rem 0 0;
  font-size: .95rem;
  color: var(--tpcms-muted);
}

/* sr-only のフォールバック（無ければ有効化） */
.tpcms-search .sr-only {
  position: absolute !important;
  width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ---------- Filters (select/radio/checkbox) ---------- */
.tpcms-filters {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: var(--gap);
}

.tpcms-filter {
  border: 1px solid var(--tpcms-border);
  border-radius: var(--tpcms-radius);
  background: var(--tpcms-filter-bg);
  padding: .75rem .75rem .6rem;
}

.tpcms-filter legend {
  font-size: .9rem;
  font-weight: 600;
  color: var(--tpcms-muted);
  padding: 0 .2rem;
  margin-bottom: .4rem;
}

.tpcms-filter select {
  width: 100%;
  height: 2.4rem;
  border: 1px solid var(--tpcms-border);
  border-radius: 10px;
  background: var(--tpcms-bg);
  padding: 0 .6rem;
}

.tpcms-filter label {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  margin: .2rem .8rem .2rem 0;
  font-size: .9rem;
  cursor: pointer;
}

/* チェックボックスの視認性（対応ブラウザではアクセント色を環境に馴染む無彩色に） */
.tpcms-filter input[type="checkbox"] {
  accent-color: #444;
}

/* ---------- レスポンシブ微調整 ---------- */
@media (max-width: 640px) {
  .tpcms-search { grid-template-columns: 1fr; }
  .tpcms-filters { grid-template-columns: 1fr; }
  .tpcms-search button[type="submit"],
  .tpcms-search .tpcms-reset { width: 100%; }
}

/* 中央寄せのアクション行 */
.tpcms-actions{
  grid-column: 1 / -1;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: .75rem;
  margin-top: .25rem;
}

@media (max-width: 640px){
  .tpcms-actions{
    flex-direction: column;
  }
  .tpcms-actions > *{
    width: 100%;
  }
}


/*ページャー
---------------------------------------------------------------------------*/
.pager {
    clear: both;
	  text-align: center;
}
/*余白の一括管理*/
.pager a,
.pager span {
	  margin: 2px;
	  padding: 0.5rem 1rem;
    border: 1px solid #ccc;
}
.pager a {
	  display: inline-block;text-decoration: none;
}
.pager a:hover {
    border: 1px solid #333;
}
/*最初と最後のボタン*/
.pager span:first-child,.pager span:last-child {
    color: #333;
    border: 1px solid #ccc;
    background: #fff;
}
/*リンクのないボタン*/
.pager span {
    display: inline-block;
    color: #999;
    border: 1px solid #ccc;
    background: #f0f0f0;
}


/*詳細ページのサムネイル切り替えブロック
---------------------------------------------------------------------------*/
/*大きな画像が表示されるブロック*/
.thumbnail-view-parts {
	max-width: 1000px;  /*最大幅。もし画面幅に合わせて100%にしたいなら、width: 100%に変更してください。*/
	margin: 0 auto 1rem;
	text-align: center;
}

/*サムネイル全体を囲むブロック*/
.thumbnail-parts {
	display: flex;
  flex-wrap: wrap;
	justify-content: center;
	margin-bottom: 2rem;
}

/*サムネイル画像・動画*/
.thumbnail-parts img,
.thumbnail-parts video {
	width: 100px;  /*サムネイルの幅*/
	margin: 2px;
	cursor: pointer;
	transition: 0.3s;
  background: #000;
}

/*マウスオン時に色を80%にする*/
.thumbnail-parts img:hover,
.thumbnail-parts video:hover {
	opacity: 0.8;
}

/* 大きな表示の中身（画像・動画） */
.thumbnail-view-parts img,
.thumbnail-view-parts video {
  max-width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

/* 動画サムネ用ラッパ＆アイコン */
.thumbnail-parts .thumb-wrap {
  position: relative;
  display: inline-block;
  width: 100px;      /* 既存サムネ幅と合わせる */
  margin: 2px;       /* 既存サムネ間隔と合わせる */
}
.thumbnail-parts .thumb-wrap > video {
  width: 100%;
  height: auto;
  display: block;
  margin: 0;         /* 二重余白を防止 */
}
.thumbnail-parts .thumb-play {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  pointer-events: none;      /* クリックは下のvideoに通す */
  opacity: 0.9;
  text-shadow: 0 1px 2px rgba(0,0,0,.35);
}
/*動画サムネの上のアイコン*/
.thumbnail-parts .thumb-play i {
  background: #ff0000;  /*背景色*/
  color: #fff;          /*文字色*/
  border-radius: 9999px;
  padding: 6px 8px;
  font-size: 12px;
  line-height: 1;
}


/*詳細ページのGoogleMap
---------------------------------------------------------------------------*/
.map-area {
	width: 100%;
	height: 0;
	padding-top: 56.25%;	/*マップの高さを増やしたい場合は、ここの数値を上げてみて下さい。*/
	position: relative;
	overflow: hidden;
  margin-top: 2rem;
}
.map-area iframe {
	position: absolute;
	left: 0px;
	top: 0px;
	width: 100%;
	height: 100%;
}


/*詳細ページのお問い合わせフォーム
---------------------------------------------------------------------------*/
.tpcms-contact {
  margin-top: 5rem;
}
body.detail input[type=search],
body.detail input[type=text],
body.detail input[type=email],
body.detail input[type=tel],
body.detail input[type=number],
body.detail input[type=file],
body.detail textarea,
body.detail select,
body.detail input[type="password"]{
  width:100%;
  padding:8px;
  border:1px solid #ccc;
  border-radius:8px;
  font:inherit;
}
body.detail select {width: auto;display: block;}
body.detail textarea{min-height:100px}
body.detail fieldset {
  margin-bottom: 1rem;
  border: 1px solid #ccc;
  border-radius:8px;
  font:inherit;
}

/*お問い合わせフォームの見出し下に出るデータタイトル*/
body.detail .form-title {
  background: #d1effc;
  padding: 0.5rem;
  display: inline-block;
}

/*「送信する」ボタン*/
.btn-submit {
  /* 色 */
  --btn-bg: #e53935;
  --btn-bg-hover: #ff4440;
  --btn-bg-active: #c62828;
  --btn-text: #fff;

  -webkit-appearance: none; /* iOSのデフォルト外観を無効化 */
  appearance: none;
  background-image: none;   /* iOSのグラデを無効化 */
  border: none;

  background-color: var(--btn-bg);
  color: var(--btn-text);
  font-size: 1.125rem;      /* ほんの少し大きめ */
  font-weight: 600;
  line-height: 1.2;
  padding: 0.75em 2em;
  border-radius: 8px;
  min-height: 44px;         /* タップしやすさ */
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-decoration: none;
}

.btn-submit:hover { background-color: var(--btn-bg-hover); }
.btn-submit:active { background-color: var(--btn-bg-active); transform: translateY(1px); }
.btn-submit:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(229, 57, 53, .4); }
.btn-submit:disabled { opacity: .5; cursor: not-allowed; }


/*物件資料PDFのダウンロードボタン（assetsフィールドがPDFの場合に出力）
---------------------------------------------------------------------------*/
.btn-pdf {
  --btn-pdf-bg: #1a73e8;
  --btn-pdf-bg-hover: #3384ea;
  --btn-pdf-bg-active: #135cbc;

  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.5em;
  background-color: var(--btn-pdf-bg);
  color: #fff;
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.2;
  padding: 0.75em 1.5em;
  border-radius: 8px;
  min-height: 44px;
  text-decoration: none;
  /* 画面幅が狭い時にボタンが正円状に潰れないようにする */
  box-sizing: border-box;
  max-width: 100%;
  white-space: normal;
  text-align: center;
  flex-shrink: 0;
}
.btn-pdf::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  content: "\f56d"; /* fa-file-pdf 相当のダウンロード風アイコン。fa-solid読み込み済み前提 */
}
.btn-pdf:hover { background-color: var(--btn-pdf-bg-hover); }
.btn-pdf:active { background-color: var(--btn-pdf-bg-active); transform: translateY(1px); }
.btn-pdf:focus-visible { outline: none; box-shadow: 0 0 0 3px rgba(26, 115, 232, .4); }


/*その他
---------------------------------------------------------------------------*/
/*「XX件ヒット」の文字*/
.tpcms-result-count {
  margin-bottom: 1rem;
  text-align: center;
}
.mt4rem {margin-top: 4rem;}


/*以下、テンプレ専用css
---------------------------------------------------------------------------*/
/*お知らせの日付横に余白*/
.new dt {
	padding-right: 1rem;
}
/*ドロップダウンの親のカーソル形状*/
a[onclick="return false;"] {
  cursor: default;
  text-decoration: none;
  color: inherit;
}


/*サブコンテンツに出力する特集ブロックの設定
---------------------------------------------------------------------------*/
.feature-side * {margin: 0;padding: 0;}
.feature-side .new-icon, .feature-side .up-icon, .feature-side .recommend-icon {
  display: none;
}
/*ブロックの最初のh3見出し*/
.feature-side h3 {
  margin-bottom: 1rem !important;
}
/*ブロック１個あたり*/
.feature-side > div {
  display: grid;
  grid-template-columns: 1fr;
  gap: 1rem;
}

/* 600px以上 かつ 901px未満で2列に */
@media (600px <= width < 901px) {
  .feature-side > div {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

/*ループブロック内のh4見出し*/
.feature-side h4 {
  font-size: 0.85rem;
  line-height: 1.5;
}

.feature-side .list-tpcms {
  display: flex;
  gap: 0.5rem;
}

/* figure画像 */
.feature-side .list-tpcms figure {
  width: 30%;
}

/* 右側テキストは残り（70%）を占有 */
.feature-side .list-tpcms .text {
  flex: 1;
}

/*tableっぽく見えるところ*/
.feature-side dl.tpcms-dl-table {
  grid-template-columns: auto 1fr;
  font-size: 0.7rem;
}

/* 物件お問い合わせ：送信結果を独立した案内カードとして表示 */
#contact-result.property-contact-result {
  display: flex;
  align-items: flex-start;
  gap: 24px;
  box-sizing: border-box;
  width: 100%;
  margin: 32px 0 48px;
  padding: clamp(24px, 4vw, 44px);
  color: #234859;
  background: #edf8fc;
  border: 1px solid #b6deeb;
  border-top: 5px solid #168bb6;
  border-radius: 16px;
  box-shadow: 0 8px 24px rgba(23, 99, 129, .09);
  scroll-margin-top: 120px;
  line-height: 1.85;
  overflow-wrap: anywhere;
}
.property-contact-result .property-contact-result__icon {
  display: grid;
  place-items: center;
  flex: 0 0 56px;
  height: 56px;
  border-radius: 50%;
  background: #168bb6;
  color: #fff;
  font-size: 30px;
  font-weight: 700;
  line-height: 1;
}
.property-contact-result .property-contact-result__content { min-width: 0; }
.property-contact-result p { margin: 0 0 12px; padding: 0; }
.property-contact-result .property-contact-result__label {
  color: #126b8e;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: .12em;
  margin-bottom: 8px;
}
.property-contact-result .property-contact-result__title {
  margin: 0 0 20px;
  padding: 0;
  border: 0;
  background: none;
  color: #125b7a;
  font-size: clamp(21px, 2.2vw, 30px);
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: .02em;
}
.property-contact-result .property-contact-result__title::before,
.property-contact-result .property-contact-result__title::after { display: none; }
.property-contact-result .property-contact-result__followup { font-weight: 700; }
.property-contact-result .property-contact-result__note {
  margin: 22px 0 0;
  padding-top: 18px;
  border-top: 1px solid #b6deeb;
  font-size: 14px;
  color: #405f6e;
}
#contact-result.property-contact-result--error { background: #fff5ec; border-color: #d8a06c; }
.property-contact-result--error .property-contact-result__icon { background: #995b26; }
@media (max-width: 600px) {
  #contact-result.property-contact-result { flex-direction: column; gap: 16px; margin: 24px 0 36px; scroll-margin-top: 90px; }
  .property-contact-result .property-contact-result__icon { flex-basis: auto; width: 48px; height: 48px; font-size: 26px; }
}

/* 物件フォーム：指で選びやすい連絡方法 */
.tpcms-contact .contact-method { margin: 0 0 24px; padding: 0; border: 0; min-width: 0; }
.tpcms-contact .contact-method legend { padding: 0; margin-bottom: 10px; }
.tpcms-contact .contact-method__options { display: flex; flex-wrap: wrap; gap: 12px; }
.tpcms-contact .contact-method__option {
  display: flex; align-items: center; gap: 10px; min-height: 52px;
  padding: 10px 24px; border: 1px solid #c3d3da; border-radius: 8px;
  background: #fff; cursor: pointer; flex: 0 1 160px;
}
.tpcms-contact .contact-method__option:has(input:checked) { background: #edf8fc; border-color: #168bb6; color: #125b7a; font-weight: 700; }
.tpcms-contact .contact-method__option:focus-within { outline: 2px solid #168bb6; outline-offset: 3px; }
.tpcms-contact .contact-method__option input[type="radio"] { width: 20px; height: 20px; margin: 0; flex: 0 0 20px; accent-color: #168bb6; }
.tpcms-contact .contact-method__help { margin: 8px 0 0; font-size: 14px; color: #53646c; }
@media (max-width: 600px) {
  .tpcms-contact .contact-method__option { flex: 1 1 100px; padding: 10px 16px; }
  .tpcms-contact .btn-submit { max-width: 100%; white-space: normal; }
}

/* 物件お問い合わせ：必須項目のバッジ */
.tpcms-contact .contact-required-badge {
  display: inline-block;
  margin-left: 8px;
  padding: 3px 9px;
  border-radius: 5px;
  background: #e60000;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: .06em;
  vertical-align: middle;
  white-space: nowrap;
}