@layer components {
/* UI Components */
.search-wrap {
	height: auto;
	position: relative;

	> svg {
		position: absolute;
		top: 50%;
		transform: translatey(-50%);
		left: 0.5rem;
		width: 1.5rem;
		height: 1.5rem;
		fill: var(--decorative-base);
	}
	.textbox-search {
		display: block;
		padding: 0.5rem 0 0.5rem 2.5rem;
		background-color: var(--neutral-white);
		border: 1px solid var(--border-dark);
		cursor: text;

		input[type="search"] {
			display: block;
			width: calc(100% - 3.5rem);
			font-size: 16px;
			cursor: text;
		}
	}
	> button {
		z-index: 50;
		display: block;
		position: absolute;
		top: 50%;
		transform: translatey(-50%);
		right: 0.5rem;
		padding: 0.1rem 0.5rem;
		border-left: 1px solid var(--border-dark);
	}
}
button.do-search-btn {
	width: auto;
	min-width: fit-content;
	padding: 0.4rem 1rem;
	font-size: var(--font-body-lg);
	font-weight: bold;
	white-space: nowrap;
	color: var(--primary-base);
	background-color: var(--neutral-white);
	border: 1.5px solid var(--decorative-base);
	border-radius: var(--radius-btn);
	white-space: nowrap;
	text-overflow: ellipsis;
	min-width: fit-content;
}
input[type="text"], input[type="email"], input[type="tel"] {
	width: 100%;
	height: 2rem;
	label & {
		padding: 0.2rem;
		border: 1px solid var(--border-dark);
	}
}
input[type="checkbox"] {
	margin-right: 0.5rem;
	transform: var(--checkbox-normal);
}
textarea {
	width: 100%;
	max-width: 100%;
	resize: vertical;
	label & {
		padding: 0.2rem;
		border: 1px solid var(--border-dark);
	}
}
.select-wrap {
	position: relative;
	display: inline-block;

	select {
		appearance: none;
		-webkit-appearance: none;

		min-width: 6em;
		padding: 0.5em 2.5em 0.5em 0.5em;
		border: 1px solid var(--border-base);
		background: var(--neutral-white);
	}
	.select-arrow {
		position: absolute;
		top: 50%;
		right: 10px;
		width: 0;
		height: 0;
		border-left: 0.4rem solid transparent;
		border-right: 0.4rem solid transparent;
		border-top: 0.5rem solid var(--text-primary);
		pointer-events: none;
		transform: translateY(-50%);
	}
}
select,
label:has(input[type="checkbox"]),
label:has(input[type="radio"]) {
	cursor: pointer;
}

.reco-ttl {
	font-family: var(--font-serif);
	padding-left: 1.5rem;
	color: var(--decorative-base);	
}
.carousel {
	display: flex;
	align-items: center;
	/*gap: 8px;*/
	width: 100%;
	/*max-width: 600px;*/
	/*margin: 24px auto;*/

	.carousel-viewport {
		overflow: hidden;
		width: 100%;
		touch-action: pan-y;

		.carousel-track {
			display: flex;
			transition: transform 0.3s ease;
			will-change: transform;

			.carousel-item {
				min-width: 100%;
				height: auto;
				flex-shrink: 0;
				/*height: 200px;*/
				display: flex;
				align-items: center;
				justify-content: center;
				position: relative;
			}
		}
	}
	.arrow > svg {
		width: 1.5rem;
		height: 1.5rem;
		fill: var(--primary-base);
	}
	.arrow:disabled > svg {
		cursor: default;
		fill: var(--text-disabled);
	}
}

/* 物件詳細ページの画像カルーセル：メインのみライトボックス2スロットと同じスライド、他は無アニメ */
#detail .main-carousel .carousel-viewport .carousel-track {
	transition: transform 0.78s cubic-bezier(0.48, 0.06, 0.24, 1);
}
#detail .sub-img-view-area .sub-carousel .carousel-viewport .carousel-track,
#detail .common-images-carousel .carousel-viewport .carousel-track {
	transition: none !important;
}
/* 物件詳細ページのメイン画像カルーセルのみ透かし（建物カードはreco-imgに個別） */
#detail .main-carousel .carousel-item::after {
	content: 'FIRST RENT';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 32px;
	font-weight: bold;
	color: rgba(150, 150, 150, 0.6);
	text-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
	pointer-events: none;
	z-index: 10;
	white-space: nowrap;
}
/* 物件詳細ページのサムネイル: 選択中以外は70%白マスク */
#detail .sub-img-view-area .carousel-item {
	position: relative;
}
#detail .sub-img-view-area .carousel-item::before {
	content: '';
	position: absolute;
	inset: 0;
	background: rgba(255, 255, 255, 0.7);
	pointer-events: none;
	transition: opacity 0.25s ease;
	z-index: 1;
}
#detail .sub-img-view-area .carousel-item.is-active::before {
	opacity: 0;
}
#detail .sub-img-view-area .carousel-item::after {
	content: 'FIRST RENT';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 14px;
	font-weight: bold;
	color: rgba(150, 150, 150, 0.6);
	text-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
	pointer-events: none;
	z-index: 10;
	white-space: nowrap;
}
/* トップページの「新着物件」各カードに透かし（カードごと） */
#top .new-property .reco-property-cell .cell-inner .clickable-area .reco-img {
	position: relative;
	overflow: visible;
}
#top .new-property .reco-property-cell .cell-inner .clickable-area .reco-img::after {
	content: 'FIRST RENT';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 20px;
	font-weight: bold;
	color: rgba(150, 150, 150, 0.6);
	text-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
	pointer-events: none;
	z-index: 10;
	white-space: nowrap;
}
/* トップページの「最近見た物件」各カードに透かし（カードごと） */
.page-container > .recent-history .reco-property-cell .cell-inner .clickable-area .reco-img {
	position: relative;
	overflow: visible;
}
.page-container > .recent-history .reco-property-cell .cell-inner .clickable-area .reco-img::after {
	content: 'FIRST RENT';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 20px;
	font-weight: bold;
	color: rgba(150, 150, 150, 0.6);
	text-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
	pointer-events: none;
	z-index: 10;
	white-space: nowrap;
}

.breadcrumbs {
	padding: 0.25rem 0 0 1.5rem;
	color: var(--link-default);
	font-size: var(--font-small);
}
.breadcrumbs.bottom-bc {
	padding-bottom: 0.5rem;
}
p.num-disp {
	display: flex;
	align-items: baseline;

	span:nth-of-type(1) {
		color: var(--decorative-base);
	}
	span:nth-of-type(2) {
		color: var(--text-primary);
		font-size: var(--font-caption);
	}
}

.from-area {
	.item-title {
		margin: 0;
		padding: 0.4rem 0 0.45rem 1rem;
		/*font-size: var(--font-body-xl);*/
		color: var(--text-inverse);
		background-color: var(--primary-base);
		border-bottom: 3px solid var(--decorative-base);

		.required {
			margin-left: 0.5rem;
			padding: 0 0.5rem;
			font-size: var(--font-small);
			color: var(--text-red);
			background-color: var(--neutral-white);
			border-radius: 100vw;
		}
	}
	.please {
		.item-title {
			display: flex;
			justify-content: center;
			background-color: var(--accent-base);
			border-bottom: 0;
		}
		.consent {
			display: flex;
			justify-content: center;
			margin-top: 0.5rem;
		}
	}
	.item-field {
		padding: 1rem 1.5rem;

		ul.checkbox-area {
			display: flex;
			flex-direction: column;
			gap: 0.2rem;
			line-height: 2.4;
			font-size: var(--font-body);

			&.second-lines {
				display: grid;
				grid-template-columns: repeat(2, 1fr);
				
				span {
					letter-spacing: -0.05em;
				}
			}
			li:last-child:nth-child(odd) {
				grid-column: 1 / -1;
			}
		}
	}
}
.btn-area {
	display: flex;
	gap: 1rem;
	justify-content: center;

	> button {
		width: 100%;
		height: 3.2rem;
		font-size: 0.9375rem;	/* 15px */
		font-weight: bold;
		border-radius: var(--radius-btn);
	}
	button.submit {
		color: var(--primary-base);
		background-color: var(--neutral-white);
		border: 2px solid var(--decorative-base);
	}
	button.reset {
		color: var(--text-secondary);
		background-color: var(--surface-base);
	}
}
/* SP input-list SP */
@media screen and (max-width: 767px) {
	.input-list {
		width: 100%;
		height: 50vh;
		overflow-x: scroll;
		border-top: 1px solid var(--border-base);

		label {
				display: block;
				padding: 1rem 0 1rem 1.5rem;
				border-bottom: 1px solid var(--border-base);
		}
		.route-warp {
			> h5 {
				margin: 0;
				padding: 0.5rem 0 0.2rem 1.5rem;
				/*color: var(--decorative-base);*/
				color: var(--primary-base);
				font-weight: bold;
				/*background-color: var(--surface-light-1);*/
				border-bottom: 1px solid var(--decorative-base);
			}
		}
		.inner {
			position: relative;

			/* ボタンエリアのスタイル（任意） */
			.btn-area {
				position: absolute;
				right: 0;
				top: 0.01rem;
				padding: 0;
				/*
				top: 50%;
				transform: translateY(-50%);
				*/
				button {
					padding: 0 1.5rem 0 4rem;

					svg {
						width: 1.5rem;
						height: 1.5rem;
					}
				}
			}
			/* トグル表示の切り替え用クラス */
			/* 初期状態：下向きボタンを表示、上向きボタンを隠す */
			.btn-area button:first-child { display: none; } /* arrow-up */
			.btn-area button:last-child { display: inline-block; } /* arrow-down */

			/* openクラスがついている時の表示切り替え */
			.btn-area.is-open button:first-child { display: inline-block; }
			.btn-area.is-open button:last-child { display: none; }
		}

		.station-list-wrap {
			display: none;
			list-style: none;
			margin: 0;
		}
		.station-wrap {
			> label {
				display: flex;
				align-items: center;
				padding-left: 2.5rem;
			}
		}
	}
}
/* PC input-list PC */
@media screen and (min-width: 768px) {
	.input-list {
		display: grid;
	}
}

.selected-ward {
	background-color: var(--surface-light-2);

	> h4 {
		color: var(--primary-base);
	}
	.inner {
		display: flex;
		flex-wrap: wrap;
		padding-bottom: 1em;
		
	}
}
.selected-ward.area-display {
	.inner {
		> p {
			/*width: 0;
			height: 0;
			margin-right: 0;*/
			font-size: var(--font-small);

			/*opacity: 0;
			visibility: hidden;
			transition: opacity 0.4s ease, transform 0.4s ease;
			transform: translateY(1.6em);
			overflow: hidden;*/
			margin-right: 0.8em;
		}
	}
}
.selected-ward.route-display {
	.route-inner-wrpa {
		h5 {
			width: 100%;
			color: var(--decorative-base);
			border-bottom: 1px dotted var(--border-dark);
		}

		.inner {
			> p {
				margin-right: 0.8em;
			}
		}
	}
}

.input-list:has(input[value="chiyoda"	]:checked) + .selected-ward .text-chiyoda,
.input-list:has(input[value="chuo"		]:checked) + .selected-ward .text-chuo,
.input-list:has(input[value="minato"	]:checked) + .selected-ward .text-minato,
.input-list:has(input[value="shinjuku"	]:checked) + .selected-ward .text-shinjuku,
.input-list:has(input[value="bunkyo"	]:checked) + .selected-ward .text-bunkyo,
.input-list:has(input[value="taito"		]:checked) + .selected-ward .text-taito,
.input-list:has(input[value="sumida"	]:checked) + .selected-ward .text-sumida,
.input-list:has(input[value="koto"		]:checked) + .selected-ward .text-koto,
.input-list:has(input[value="shinagawa"	]:checked) + .selected-ward .text-shinagawa,
.input-list:has(input[value="meguro"	]:checked) + .selected-ward .text-meguro,
.input-list:has(input[value="ota"		]:checked) + .selected-ward .text-ota,
.input-list:has(input[value="setagaya"	]:checked) + .selected-ward .text-setagaya,
.input-list:has(input[value="shibuya"	]:checked) + .selected-ward .text-shibuya,
.input-list:has(input[value="nakano"	]:checked) + .selected-ward .text-nakano,
.input-list:has(input[value="suginami"	]:checked) + .selected-ward .text-suginami,
.input-list:has(input[value="toshima"	]:checked) + .selected-ward .text-toshima,
.input-list:has(input[value="kita"		]:checked) + .selected-ward .text-kita,
.input-list:has(input[value="arakawa"	]:checked) + .selected-ward .text-arakawa,
.input-list:has(input[value="itabashi"	]:checked) + .selected-ward .text-itabashi,
.input-list:has(input[value="nerima"	]:checked) + .selected-ward .text-nerima,
.input-list:has(input[value="adachi"	]:checked) + .selected-ward .text-adachi,
.input-list:has(input[value="katsushika"]:checked) + .selected-ward .text-katsushika,
.input-list:has(input[value="edogawa"	]:checked) + .selected-ward .text-edogawa
{
	opacity: 1;
	visibility: visible;
	transition: opacity 0.4s ease, transform 0.4s ease;
	transform: translateY(0);

	/* レイアウトを戻す（任意） */
	width: auto;
	height: 1.6em;
	margin-right: 0.8em;
}

/* スライダー */
.slider-group {
	/* 全体のレイアウト設定 */
	/*width: 20rem;*/
	width: 100%;
	padding: 0.25rem 1.25rem;
	font-family: sans-serif;

	.label {
		margin-bottom: 0.5rem; /* スライダーとの間隔 */
		text-align: center;
		font-weight: bold;
		color: var(--decorative-base);
	}
	/* スライダーを置くための基準コンテナ */
	.slider-container {
		position: relative;
		width: 100%;
		height: 2rem; /* つまみの高さに合わせた領域 */
		display: flex;
		align-items: center;
		
		/* 共通の「レール（線）」 */
		.slider-track {
			position: absolute;
			width: 100%;
			height: 0.375rem; /* 6px相当 */
			background: var(--border-base);
			border-radius: 0.313rem;
			z-index: 1; /* 重なり順：一番下 */
		}
		/* スライダー本体の共通設定 */
		input[type="range"] {
			position: absolute;
			width: 100%;
			background: none;
			pointer-events: none; /* レールなどはクリック不可にする */
			-webkit-appearance: none;
			appearance: none;
			margin: 0;
			z-index: 2; /* レールより上に配置 */
		}
		/* --- つまみ（Thumb）のデザイン --- */
		/* Chrome, Safari, Edge */
		input[type="range"]::-webkit-slider-thumb {
			-webkit-appearance: none;
			appearance: none;
			height: 2rem; /* 20px相当 */
			width: 2rem;
			background: var(--primary-base);
			border-radius: 50%;
			border: 0.15rem solid var(--neutral-white);
			/*border: 0.015rem solid var(--decorative-base);*/
			box-shadow:
				0 0 0 0.1rem var(--decorative-base),
				0 0.063rem 0.188rem rgba(0,0,0,0.3);
			cursor: pointer;
			pointer-events: auto; /* つまみだけは操作可能 */
		}
		/* Firefox */
		input[type="range"]::-moz-range-thumb {
			height: 1.25rem;
			width: 1.25rem;
			background: var(--primary-base);
			border-radius: 50%;
			border: 0.125rem solid var(--neutral-white);
			cursor: pointer;
			pointer-events: auto;
		}
	}
	.slider-caption {
		position: relative;
		margin-top: 0.5rem;
		text-align: center;
		font-size: var(--font-caption);

		> span:first-of-type {
			display: inline-block;
			position: absolute;
			left:0;
			transform: -50%;
		}
		> span:last-of-type {
			display: inline-block;
			position: absolute;
			right:0;
			transform: -50%;
		}
	}
}
.select-container,
.pc-checkbox {
	display: none;
}
/* ページング */
.paging {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
	padding-bottom: 1.5rem;
	> * {cursor: pointer;}
	a { text-decoration: none; }

	svg {
		width: 2rem;
		height: 2rem;
		color: var(--text-inverse);
		fill: var(--link-default);
	}
	.disable > svg {
		fill: var(--text-disabled);
	}
	.disable {
		cursor: not-allowed;
	}
	/* 前後へ（＜＞）：クリック可能なときだけ薄い紺ホバー */
	> a[href]:not(.num) {
		display: inline-flex;
		align-items: center;
		justify-content: center;
		width: 2rem;
		height: 2rem;
		border-radius: 0.25rem;
		transition: background-color 0.2s ease;
	}
	> a[href]:not(.num) svg {
		transition: fill 0.2s ease;
	}
	> a[href]:not(.num):hover {
		background-color: #e4eaf2;
	}
	@supports (background-color: color-mix(in srgb, red 10%, white)) {
		> a[href]:not(.num):hover {
			background-color: color-mix(in srgb, var(--navy-ttl, #061D3F) 14%, var(--surface-base, #fff));
		}
	}
	> a[href]:not(.num):hover svg {
		fill: var(--navy-ttl, #061D3F);
	}
	.num {
		width: 2rem;
		height: 2rem;
		line-height: 2rem;
		text-align: center;
		display: inline-block;
		color: var(--text-disabled);
		background-color: var(--surface-base);
		transition: background-color 0.2s ease, color 0.2s ease;
	}
	/* 現在ページ：ホバーしても見た目は変えない */
	.num.active {
		color: var(--text-inverse);
		background-color: var(--primary-base);
	}
	.num.active:hover {
		color: var(--text-inverse);
		background-color: var(--primary-base);
	}
	/* その他のページ番号：ホバーで薄い紺 */
	.num:not(.active):hover {
		background-color: #e4eaf2;
		color: var(--navy-ttl, #061D3F);
	}
	@supports (background-color: color-mix(in srgb, red 10%, white)) {
		.num:not(.active):hover {
			background-color: color-mix(in srgb, var(--navy-ttl, #061D3F) 14%, var(--surface-base, #fff));
		}
	}
	.dots-and-dots {
		width: 2rem;
		height: 2rem;
		line-height: 2rem;
		text-align: center;
		display: inline-block;
	}
}
/* サブ カルーセル */
.sub-carousel {
	position: relative;
	width: 100%;
	padding: 0 35px;

	.carousel-viewport {
		width: 100%;
		overflow: hidden;
	}
	.carousel-track {
		display: flex;
		flex-wrap: nowrap;
		transition: transform 0.5s ease;
		will-change: transform;
	}
	.carousel-item {
		flex: 0 0 calc(100% / 6);
		height: 5rem;
		box-sizing: border-box;
		border-right: 2px solid var(--neutral-white);
		background-size: contain;
		background-repeat: no-repeat;
		background-position: center center;
		background-color: var(--surface-light-2);
	}
	.arrow {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		width: 30px;
		height: 30px;
		border-radius: 50%;
		display: flex;
		align-items: center;
		justify-content: center;
		background: #fff;
		border: 2px solid #aaa;
		user-select: none;
		cursor: pointer;
		z-index: 2;
		padding: 0;

		> svg {
			width: 14px;
			height: 14px;
			fill: #333;
		}
	}
	.arrow:hover:not(:disabled) {
		border-color: #666;
	}
	.arrow:disabled {
		cursor: default;
		opacity: 0.3;
	}
	.arrow.prev { left: 0; }
	.arrow.next { right: 0; }
}

/* COMMON */
.page-container {
	background-color: floralwhite;
}
.header {
	box-shadow: var(--shadow-soft);
	background-color: #fff;
	
	.logo-area {
		display: flex;
		align-items: center;

		.logo-img {
			height: 2rem;
		}
		> p {
			padding-left: 1em;
			line-height: 1.3;
			font-size: var(--font-caption);
		}
	}

	nav {
		:is(a:link, a:active, a:visited) {
			color: var(--text-primary);
			text-decoration: none;

			svg {
				width: 1.6rem;
				height: 1.6rem;
				fill: var(--decorative-base);
			}
		}
	}
	nav.menu {
		background-color: var(--neutral-white);
		box-shadow: var(--shadow-medium);

		.menu-head {
			padding: 1rem 1rem 0.6rem;
			box-shadow: var(--shadow-medium);

			.inquiry {
				display: flex;
				align-items: center;
				justify-content: center;

				.link-contact {
					display: none;
				}
				.contact-area {
					.tel-num, .always-open {
						display: block;
						text-align: center;
						line-height: 1.1;
					}
					.tel-num {
						display: flex;
						align-items: center;
						justify-content: center;
						font-size: var(--font-body-lg);

						> svg {
							width: 1em;
							height: 1em;
							margin-right: 0.2rem;
							fill: var(--decorative-base);
						}
						> a {
							font-size: 118%;
							color: var(--primary-base);
							font-weight: bold;
						}
					}
					.always-open {
						> p:first-of-type {
							font-size: var(--font-caption);
						}
						> p:last-of-type {
							font-size: var(--font-ultra-small);
						}
					}
				}
				.line-btn {
					width: 3rem;
					margin-left: 1rem;
				}
			}
			.search-wrap {
				margin-top: 0.5rem;
				position: relative;

				> svg {
					position: absolute;
					top: 50%;
					transform: translateY(-50%);
					left: 0.5rem;
					width: 1.5rem;
					height: 1.5rem;
					fill: var(--decorative-base);
				}
				.textbox-search {
					display: block;
					padding: 0.5rem 0 0.5rem 2.5rem;
					background-color: var(--neutral-white);
					border: 1px solid var(--border-dark);

					input[type="search"] {
						display: block;
						width: calc(100% - 3.5rem);
						font-size: 16px;
						border: none;
						background: transparent;
					}
				}
				> button {
					position: absolute;
					top: 50%;
					transform: translateY(-50%);
					right: 0.5rem;
					padding: 0.1rem 0.5rem;
					border-left: 1px solid var(--border-dark);
				}
			}
		}
		.link-wrap {
			> p {
				padding:0.8rem 0 0.8rem 1.5rem;
				border-bottom: 1px solid var(--border-base);
			}
			:where(a:link, a:active, a:visited) {
				display: flex;
				gap: 1rem;
				align-items: center;
			}
			.menu-img {
				width: 2rem;
			}
			@media screen and (max-width: 767px){
				svg {
					width: 2rem;
					height: 2rem;
				}
			}
			.link-top {
				img {
					height: 1.5rem;
				}
			}
		}
	}
	#overlay {
		position: fixed;
		inset: 0;
		z-index: 99;
		width: 100vw;
		height: 100vh;
		background: rgba(0, 0, 0, 0.6);
		backdrop-filter: blur(4px); /* 背景をぼかす */
		opacity: 0;
		visibility: hidden;
		transition: all 0.5s ease-out;
		
		.close-button {
			width: 16vw;
			height: 16vw;
			position: relative;
			border: none;
			/*background: #333;*/
			/*border-radius: 50%;*/
			cursor: pointer;
			transition: 0.3s;
		
			&::before,
			&::after {
				content: "";
				position: absolute;
				top: 50%;
				left: 50%;
				width: 8vw;
				height: 0.6vw;
				background: var(--border-base);
			}
			&::before {
				transform: translate(-50%, -50%) rotate(45deg);
			}
			&::after {
				transform: translate(-50%, -50%) rotate(-45deg);
			}
			&:hover::before,
			&:hover::after {
				background: var(--neutral-white);
			}
			&:hover {
				transform: scale(1.2);
			}
		}
	}
	#overlay.is-open {
		opacity: 1;
		visibility: visible;
		transition: all 0.5s ease-out;
	}
	nav.smartphone {
		display: flex;
		gap: 1rem;
		align-items: center;

		:is(.link-history, .link-favorites) {
			height: 3rem;

			:is(a:link, a:active, a:visited) {
				display: flex;
				align-items: center;
				flex-direction: column;
				font-size: var(--font-caption);
				margin-top: 0.3rem;
			}
		}
		#menu-btn {
			width: 3rem;
			height: 3rem;

			svg {
				width: 3rem;
				height: 3rem;
			}
		}
	}
}
.footer .foot-links {
	padding: 1.5rem 0 1rem;
}
.footer .foot-links-section {
	margin-bottom: 1rem;
}
.footer .foot-links-section h4 {
	font-size: 0.8rem;
	font-weight: 600;
	margin-bottom: 0.5rem;
	padding-bottom: 0.3rem;
}
@media screen and (max-width: 767px) {
	.footer .foot-collapsible > h4 {
		cursor: pointer;
		display: flex;
		justify-content: space-between;
		align-items: center;
	}
	.footer .foot-collapsible > h4::after {
		content: '▼';
		font-size: 0.6rem;
		transition: transform 0.2s;
	}
	.footer .foot-collapsible.is-open > h4::after {
		transform: rotate(180deg);
	}
	.footer .foot-collapsible > .foot-tag-list {
		max-height: 0;
		overflow: hidden;
		transition: max-height 0.3s ease-out;
	}
	.footer .foot-collapsible.is-open > .foot-tag-list {
		max-height: 500px;
	}
}
.footer .foot-tag-list {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.3rem;
}
.footer .foot-tag-list li a {
	display: inline-block;
	font-size: 0.65rem;
	padding: 0.2rem 0.5rem;
	line-height: 1.3;
	transition: background 0.2s;
	text-decoration: underline;
}
@media screen and (max-width: 767px) {
	.footer .foot-tag-list li a {
		line-height: 1.65;
		padding: 0.35rem 0.55rem;
	}
}
.footer .foot-tag-list li a:hover {
	background: rgba(255,255,255,0.15);
	text-decoration: underline;
}
.footer {
	color: var(--text-inverse);
	/*background-color: var(--primary-base);*/
	background-color: var(--dark-blue);

	:is(a:link, a:active, a:visited) {
		color: var(--text-inverse);
		text-decoration: none;
	}
	:is(a:hover) {
		opacity: 0.6;
	}
	.foot-company {
		padding: 1rem 0;
	}
	.foot-company-inner {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		padding-top: 2.5rem;
		padding-left: 7.5rem;
		padding-right: 1rem;
	}
	.foot-company-left {
		align-self: flex-end;
	}
	.foot-company-right {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 0.5rem;
		text-align: left;
	}
	.foot-company-right .foot-logo img {
		height: 2.2em;
	}
	.jprs-seal {
		flex-shrink: 0;
		.jprs-pc { display: none; }
		.jprs-sp { display: inline; }
	}
	.foot-company-text {
		font-size: 0.65rem;
		line-height: 1.6;
		text-align: left;
	}
	.foot-company-text .foot-desc {
		font-size: 0.7rem;
	}
	.foot-company-text .foot-info {
		font-size: 0.6rem;
		opacity: 0.85;
	}
	.copyright {
		padding: 0 0 0.4rem;
		text-align: center;
		background-color: var(--decorative-base);
	}
}
.shortcut-link {
	background-color: var(--surface-light-1);

	.shortcut-ttl {
		font-family: var(--font-serif);
		padding: 0.5rem 0;
		color: var(--decorative-base);
	}
	.shortcut-head {
		padding-left: 0.5em;
		font-size: var(--font-caption);
		background-color: var(--surface-base);
	}
	.shortcut-item {
		padding: 0.2em 0 0.5em;
		font-size: var(--font-body);

		> a {
			display: inline-block;
			margin-right: 0.8em;
		}
	}
}
@media screen and (max-width: 767px) {
	.shortcut-link .shortcut-item {
		line-height: 1.85;
	}
	.shortcut-link .shortcut-item > a {
		line-height: 1.85;
		padding: 0.35em 0;
	}
	#hide-list,
	#conditions-hide-list {
		max-height: 0;
		overflow: hidden;
		transition: max-height 0.5s ease-out; /* ここでアニメーション速度を調整 */
	}
	/* スマホ縦: 設備チェックボックス1列 */
	#conditions-hide-list .category-block .item-field ul.checkbox-area.second-lines {
		display: grid;
		grid-template-columns: 1fr;
	}
}
/* スマホ横: 設備チェックボックス2列 */
@media screen and (max-width: 767px) and (orientation: landscape) {
	#conditions-hide-list .category-block .item-field ul.checkbox-area.second-lines {
		grid-template-columns: repeat(2, 1fr);
	}
}
.hide-button {
	#hide-list-open,
	#hide-list-close,
	#conditions-hide-list-open,
	#conditions-hide-list-close {
		width: 100%;
		padding: 0.4rem 0 0.5rem;
		text-align: center;
		color: var(--link-default);
		border-top: 1px dotted var(--border-dark);
	}
	#hide-list-open,
	#conditions-hide-list-open {
		display: block;
	}
	#hide-list-close,
	#conditions-hide-list-close {
		display: none;
	}
}

#hide-list.is-open {
	max-height: 1000px; /* 十分な高さを指定 */
}
.fav-button {
	background: none;
	border: none;
	cursor: pointer;
	padding: 0.5rem;
	width: 3rem;
	height: 3rem;

	.icon-on {fill: var(--feedback-warning);}
	.icon-off {fill: var(--surface-dark);}
}
/* 初期状態はOFFを表示、ONを非表示 */
.fav-button .icon-on { display: none; }
.fav-button .icon-off { display: block; }

/* data-active="true" になったら表示を逆転 */
.fav-button[data-active="true"] .icon-on { display: block; }
.fav-button[data-active="true"] .icon-off { display: none; }

/* サイズ調整 */
.fav-button svg {
	width: 100%;
	height: 100%;
}

/* おすすめ・最近見たカルーセル：カード単位でスクロール（SP:2枚表示） */
@media (max-width: 767px) {
	.recent-history .carousel-viewport .carousel-track .carousel-item,
	.recommended-history .carousel-viewport .carousel-track .carousel-item {
		flex: 0 0 50%;
		min-width: 50%;
	}
}
/* PC:4枚表示 */
@media (min-width: 768px) {
	.recent-history .carousel-viewport .carousel-track .carousel-item,
	.recommended-history .carousel-viewport .carousel-track .carousel-item {
		flex: 0 0 25%;
		min-width: 25%;
	}
}
.recent-history .carousel-item .reco-property-cell,
.recommended-history .carousel-item .reco-property-cell {
	width: 100%;
}

.reco-property-cell {
	display: flex;
	justify-content: center;
	gap: 0.5rem;
	padding: 0.5rem;
	font-size: var(--font-small);

	.fav-button {
		position: absolute;
		top: 2.5rem;
		right: 0;
		z-index: 5;
		width: 2.5rem;
		height: 2.5rem;
	}
	.new-arrival-date {
		position: absolute;
		top: 2.7rem;
		left: 0.2rem;
		z-index: 6;
		font-size: var(--font-small);
		font-weight: bold;
		color: var(--decorative-base);
		background-color: rgba(255, 245, 238, 0.6);
		padding: 0.15em 0.4em;
	}
	.cell-inner {
		position: relative;
		width: 40vw;
		padding: 0.5rem 0;
		box-shadow: var(--shadow-reco-cell);
		overflow: hidden;

		/* ホバー時のきらり光るエフェクト */
		&::after {
			content: '';
			position: absolute;
			top: 0;
			left: -100%;
			width: 60%;
			height: 100%;
			background: linear-gradient(
				105deg,
				transparent 0%,
				transparent 35%,
				rgba(255, 255, 255, 0.4) 50%,
				transparent 65%,
				transparent 100%
			);
			transform: skewX(-15deg);
			transition: left 0.6s ease;
			pointer-events: none;
			z-index: 5;
		}
		&:hover::after {
			left: 150%;
		}

		:is(
			.property-station,
			.property-name
			) {
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
		}
		.property-station {
			text-decoration: none;
			color: inherit;
		}
		:is(
			.property-station,
			.property-name,
			.bottom-area
			) {
			padding-left: 0.5rem;
		}
		.clickable-area {
			.reco-img {
				height: 40vw;
				background-position: center center;
				background-size: contain;
				background-repeat: no-repeat;
			}
			.bottom-area {
				padding-top: 0.5rem;
				color: var(--text-primary);

				.rent-price {
					color: var(--primary-base);

					> span {
						font-size: var(--font-body-lg);
					}
				}
				.line-name {
					font-size: var(--font-small);
					color: var(--text-secondary);
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
				}
				.station-access {
					font-size: var(--font-small);
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
				}
				.room-info {
					font-size: var(--font-small);
					color: var(--text-secondary);
					white-space: nowrap;
					overflow: hidden;
					text-overflow: ellipsis;
				}
			}
		}
	}

	.dep-key-wrap {
		display: flex;
		gap: 0.5rem;
		padding: 0.5rem 0;

		.dep-key-icon {
			display: flex;
			align-items: center;
			gap: 0.2rem;

			> span {
				display: flex;
				justify-content: center;
				align-items: center;
				width: 1.2em;
				height: 1.2em;
				border: 1px solid var(--text-primary);
			}
		}
		.dep-key-icon.free-ver {
			color: var(--text-red);

			> span {
				border: 1px solid var(--text-red);
			}
		}
	}
	:is(
		a.clickable-area:link,
		a.clickable-area:active,
		a.clickable-area:visited
		) {
		text-decoration: none;
	}
}


/* ドロワー本体 */
.saved-conditions-drawer {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	background: var(--neutral-white);
	z-index: 1001;

	transform: translateY(-100%);
	transition: transform .35s ease;
	pointer-events: none;		/* 触れない状態に */

	max-height: 90dvh;			/* 高さ可変でもOK */
	overflow-y: auto;

	box-shadow: 0 8px 24px rgba(0,0,0,.15);
}
/* 開いた状態 */
.saved-conditions-drawer.is-open {
	transform: translateY(0);
	pointer-events: auto;
}
/* オーバーレイ（閉時はdisplay:noneでスタッキングから完全除外） */
.drawer-overlay {
	display: none;
	position: fixed;
	inset: 0;
	background: rgba(0,0,0,.4);
	z-index: 100;
	pointer-events: none;
}
.drawer-overlay.is-open {
	display: block;
	pointer-events: auto;
}

.saved-conditions-drawer {
	.container {
		position: relative;
		padding-bottom: 1rem;

		> h3 {
			color: var(--text-secondary);
		}
	}
	.wrap {
		margin-top: 2rem;
		border-top: 2px solid var(--decorative-base);
		box-shadow: var(--shadow-result-list-bottom);

		.saved-drawer {
			position: relative;
			display: flex;
			align-items: center;

			.saved-close-btn {
				width: 3rem;

				> button {
					display: flex;
					align-items: center;
					justify-content: center;
					width: 3rem;
					height: 3rem;

					> svg {
						width: 1rem;
						height: 1rem;
						fill: var(--text-disabled);
					}
				}
				> button:hover {
					opacity: 0.6;
				}
			}
			.arrow-right {
				position: absolute;
				top: 50%;
				right: 0.5rem;
				transform: translateY(-50%);
				width: 1rem;
				height: 1rem;
				fill: var(--text-disabled);
			}
			a.search-axis-wrap {
				padding: 1rem 2rem 1rem 0;
				text-decoration: none;

				.inner {
					margin-top: 0.5rem;

					> h5 {
						display: inline;
						color: var(--primary-base);
						font-size: var(--font-body);
						font-weight: bold;
					}
					> h5::after {
						content: '：';
					}
				}
				.inner:first-of-type {
					margin-top: 0;
				}
			}
			a.search-axis-wrap:link,
			a.search-axis-wrap:active,
			a.search-axis-wrap:visited {
				color: var(--text-primary);
			}
			a.search-axis-wrap:hover {
				opacity: 0.6;
				color: var(--text-primary);
			}
		}
	}
	.wrap:first-of-type {
		margin-top: 0;
	}
}
#drawer-close-btn {
	position: absolute;
	top: 1rem;
	right: 1rem;

	> svg {
		width: 2rem;
		height: 2rem;
		fill: var(--text-disabled);
	}
}


/* WIDE BG */
.surface-base-bg-wrap {
	background-color: var(--surface-base);
}
.surface-light-1-bg-wrap {
	background-color: var(--surface-light-1);
}
.surface-light-2-bg-wrap {
	background-color: var(--surface-light-2);
}

/* TOP ///////////////////*/
@keyframes bgFadeIn {
	0%   { opacity: 0.1; }
	100% { opacity: 1; }
}
.map-link-bg-wrap {
	position: relative;
	overflow: hidden;
}
.map-link-bg-wrap::before {
	content: "";
	position: absolute;
	inset: 0;
	background: url(../images/map-bg.jpg) no-repeat center / cover;
	opacity: 0;
	animation: bgFadeIn 5s ease-out forwards;
	z-index: 0;
}
/* 子要素を前面にする */
.map-link-bg-wrap > * {
	position: relative;
	z-index: 1;
}

#top {
	position: relative;

	h5.top-first-ttl {
		position: absolute;
		z-index: 99;
		left: 0;
		right: 0;
		width: 100vw;
		margin-left: calc(-50vw + 50%);
		padding: 0.5rem 0;
		color: var(--decorative-base);
		font-size: var(--font-body-lg);
		font-weight: bold;
		text-align: center;
		background-color: rgba(255, 255, 255, 0.7);
	}

	.recent-history {
		margin-top: 2rem;
	}
}
.map-link {
	padding: 4rem 1.5rem 1rem;
	color: var(--neutral-white);

	.map-wrap{
		width: 100%;
		max-width: 1200px;
		margin: auto;

		svg {
			width: 100%;
			height: auto;
			display: block;
			overflow: visible;
		}

		/* ===== 区共通 ===== */
		.ward {
			stroke: var(--neutral-white);
			stroke-width: 0.8rem;
			cursor: pointer;
			transition: all .18s ease;
			transform-box: fill-box;
			transform-origin: center;
		}
		.ward-bg1 {fill: var(--ward-bg1);}
		.ward-bg2 {fill: var(--ward-bg2);}
		
		.ward.is-active {
			fill: var(--primary-light-1) !important;
			/* ポリゴンを scale すると SVG 上の区名座標と視覚中心がずれるため拡大しない */
			filter: drop-shadow(0 4px 8px rgba(26, 26, 26, .18));
		}

		/* ===== テキスト ===== */
		.ward-label {
			font-size: var(--font-body-map);
			fill: var(--primary-base);
			text-anchor: middle;
			pointer-events: none;
			transition: fill 0.18s ease, font-weight 0.18s ease;
			isolation: isolate;
		}
		/* SVG <text> の scale は fill-box／基準点の解釈差で位置がズレるため拡大しない */
		.ward-label.is-active {
			fill: var(--decorative-base);
			font-weight: 700;
		}
	}

	> img {
		margin: 0 2rem;
		width: calc(100% - 4rem);
	}

	> p {
		position: absolute;
		right: 0;
		bottom: 4rem;
		padding: 0.5rem 1.5rem 0.5rem 1rem;
		font-size: var(--font-caption);
		font-size: var(--font-small);
		font-weight: bold;
		color: var(--neutral-white);
		text-shadow: 0 0.1rem 0.2rem rgba(26, 26, 26, 0.4);

	}
}
.area-link {
	font-family: var(--font-serif);
	position: relative;

	.wrap {
		display: flex;
		gap: 1rem;
		overflow-x: auto;
		-webkit-overflow-scrolling: touch;
		padding: 1rem;

		.container {
			flex: 0 0 calc((100% - 2rem) / 3);

			.img-area {
				position: relative;
				height: 5.4rem;
				border-radius: 0.1rem;
				overflow: hidden;

				> img {
					position: absolute;
					inset: 0;
					width: 100%;
					height: 100%;
					object-fit: cover;
				}

				.text-bg {
					position: absolute;
					inset: 0;
					height: auto;
					background: url(../images/text-bg.png) no-repeat;
					background-size: cover;
					background-position: center bottom;

					> h5 {
						position: absolute;
						bottom: 0;
						left: 50%;
						transform: translateX(-50%);
						margin-bottom: 0.1rem;
						text-align: center;
						font-weight: bold;
						color: var(--text-inverse);
					}
				}
			}
			> p {
				padding: 0.2rem 0;
				text-align: center;
				line-height: 1.1;
			}
			> button, > .btn-area-link {
				display: block;
				width: 100%;
				padding: 0.65rem 0;
				color: var(--text-inverse);
				font-size: var(--font-small);
				font-weight: bold;
				text-align: center;
				text-decoration: none;
				background: url(../images/area-btn-bg.jpg) no-repeat;
				background-size: cover;
				background-position: center center;
				border-radius: 0.1rem;
				box-shadow: 0 3px 6px rgba(58, 43, 27, 0.6);
			}
		}
	}
}
.top-count {
	display: flex;
	align-items: baseline;
	justify-content: center;
	gap: 0.5rem;
	padding: 1rem 0;

	p.num-disp {
		span:nth-of-type(1) {
			font-size: var(--font-body-lg);
		}
		span:nth-of-type(2) {
			font-size: var(--font-small);
		}
	}
}
.search-navigation {
	.search-link {
		display: flex;
		justify-content: center;
		gap: 1rem;
		padding: 0 0 1rem;

		.do-btn {
			display: flex;
			align-items: center;
			justify-content: center;
			width: 100%;
			padding: 1rem 0;
			text-decoration: none;
			background-color: var(--neutral-white);
			border: 1.5px solid var(--decorative-base);
			border-radius: var(--radius-btn);
			box-shadow: var(--shadow-soft);

			> svg {
				width: 1.5rem;
				height: 1.5rem;
				fill: var(--decorative-base);
				transition: transform .18s ease;
			}
			> p {
				color: var(--primary-base);
				font-size: var(--font-body-lg);
				font-weight: bold;
				line-height: 1.5;
				transition: transform .18s ease;

				> span:nth-of-type(2) {
					font-size: var(--font-small);
				}
			}
		}
		.do-btn.do-route {
			> svg {
				margin-right: 0.25rem;
			}
		}
		.do-btn:hover {
			text-decoration: none;
			box-shadow: var(--shadow-medium);

			> svg {
				transform: translateX(-0.8rem) scale(1.2);
			}
			> p {
				transform: scale(1.2);
			}
		}
	}
	.previous-condition {
		display: flex;
		flex-direction: column;
		margin-bottom: 1rem;
		padding: 0.5rem;
		background-color: var(--neutral-white);
		border: 1px solid var(--border-dark);
		border-radius: var(--radius-small);

		h5 {
			color: var(--decorative-base);
		}
		.inner {
			display: -webkit-box;
			-webkit-line-clamp: 2;
			-webkit-box-orient: vertical;
			overflow: hidden;

			> span {
				font-size: var(--font-small);
			}
		}
		.do-search-btn {
			position: relative;
			display: flex;
			align-items: center;
			justify-content: flex-end;
			margin-top: 0.5rem;
			padding: 0.5rem 1rem;
			width: 100%;
			box-sizing: border-box;

			.search-label {
				position: absolute;
				left: 50%;
				transform: translateX(-50%);
				font-weight: bold;
			}
			.count-label {
				font-size: var(--font-small);
				font-weight: normal;
				white-space: nowrap;
				flex-shrink: 0;
			}
		}
	}
	.textbox-search {
		display: block;
	}
	.search-wrap,
	.textbox-search,
	input[type="search"] {
		width: 100%;
	}
}
.search-future {
	background-color: var(--surface-base);

	.jp-title {
		font-family: var(--font-serif);
		font-size: var(--font-h2);
		color: var(--navy-ttl);
		font-weight: bold;
		text-align: center;
	}
	.title-line {
		width: 2rem;
		height: 0;
		margin: 0.5rem auto 0.4rem;
		border-bottom: 2px solid var(--decorative-base);
	}
	.en-title {
		font-size: var(--font-small);
		color: var(--text-secondary);
		text-align: center;
		margin-bottom: 1rem;
	}

	a.img-btn {
		text-align: center;
		border: 1px solid var(--decorative-base);
		border-radius: 0;
		color: var(--text-inverse);
		text-decoration: none;
		line-height: 1;

		> p {
			margin-top: 1.1rem;
			padding: 0.25rem 0 0.25rem;
			background-color: rgba(150, 150, 150, 0.6);
			text-shadow: 0 0.1rem 0.2rem rgba(26, 26, 26, 0.8);
		}
		> span {
			display: block;
			width: 100%;
			margin: 0 auto;
			padding-bottom: 0.25rem;
			font-size: var(--font-caption);
			background-color: rgba(150, 150, 150, 0.6);
			text-shadow: 0 0.1rem 0.2rem rgba(26, 26, 26, 0.8);
		}
	}
	.button-1 {
		background: url(../images/search-future/newly-built.jpg) no-repeat;
		background-position: center center;
		background-size: cover;
	}
	.button-2 {
		background: url(../images/search-future/pets-ok.jpg) no-repeat;
		background-position: 60% 50%;
		background-size: 140%;
	}
	.button-3 {
		background: url(../images/search-future/music-ok.jpg) no-repeat;
		background-position: 40% 90%;
		background-size: 170%;
	}
	.button-4 {
		background: url(../images/search-future/has-parking.jpg) no-repeat;
		background-position: center center;
		background-size: cover;
	}
	.button-5 {
		background: url(../images/search-future/free-rent.jpg) no-repeat;
		background-position: center center;
		background-size: cover;
	}
	.button-6 {
		background: url(../images/search-future/near-station.jpg) no-repeat;
		background-position: center center;
		background-size: cover;
	}
}
@media screen and (max-width: 767px) {
	.search-future {
		.container {
			display: grid;
			grid-template-columns: repeat(3, 1fr);
			grid-auto-rows: 5rem;
			gap: 2px;

			a.button-7 {
				grid-column-start: 1;
				grid-column-end: 4;
				grid-row-start: 3;
				grid-row-end: 4;
			}
		}
	}
}
@keyframes blinkSlow {
	0%   { opacity: 1; }
	50%  { opacity: 0; }
	100% { opacity: 1; }
}
@keyframes np-recent-loading-spin {
	to {
		transform: rotate(360deg);
	}
}
.new-property {
	padding: 1rem 0;

	h2 {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 0.25rem;
		color: var(--decorative-base);

		img.blink-slow {
			height: 1em;
			animation: blinkSlow 3s ease-in-out infinite;
		}
	}
	h2.top-title {
		display: block;
	}
	.np-recent-loading-wrap {
		display: flex;
		flex-direction: column;
		align-items: center;
		justify-content: center;
		gap: 0.5rem;
		min-height: 8rem;
		width: 100%;
	}
	.np-recent-loading-icon {
		display: block;
		color: #bc9d12;
		animation: np-recent-loading-spin 2s linear infinite;
	}
	.np-recent-loading-text {
		margin: 0;
		font-size: var(--font-small);
		color: var(--text-secondary);
	}
	.floor-wrap {
		padding: 0;
		border-top: 1px solid var(--border-base);

		.floor-plan {
			display: flex;
			align-items: center;
			justify-content: center;
			gap: 0.5rem;
			padding: 0.5rem 0;
			border-bottom: 1px dotted var(--border-base);
			
			.floor-btn {
				width: 4rem;
				padding: 0.2rem 0;
				color: var(--text-disabled);
				font-size: var(--font-small);
				border: 1px solid var(--border-base);
				border-radius: var(--radius-btn);
			}
			.ward-filter-select {
				padding: 0.15rem 0.3rem;
				font-size: var(--font-caption);
				border: 1px solid var(--border-base);
				border-radius: var(--radius-btn);
				background: var(--neutral-white);
				color: var(--text-primary);
				cursor: pointer;
				margin-left: 0.25rem;
				outline: none;
				-webkit-appearance: auto;
			}
			.floor-btn.floor-on {
				color: var(--primary-base);
				border: 2px solid var(--decorative-base);
				background-color: var(--neutral-white);
			}
		}
	}
	.np-carousel {
		position: relative;
		padding-bottom: 0.5rem;
		border-bottom: 1px solid var(--border-base);
	}
	.np-carousel__viewport {
		position: relative;
		overflow: hidden;
		width: 100%;
		touch-action: pan-y; /* スマホ縦スクロール維持 */
	}
	.np-carousel__track {
		display: flex;
		transition: transform 0.6s ease;
		will-change: transform;
	}
	.np-carousel__item {
		flex: 0 0 100%;
	}
	/* arrows */
	.np-carousel__arrow {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		z-index: 2;
		cursor: pointer;

		> svg {
			width: 1rem;
			height: 1rem;
			fill: var(--primary-base);
		}
	}
	.np-carousel__arrow--prev {
		left: 8px;
	}
	.np-carousel__arrow--next {
		right: 8px;
	}
	/* toggle */
	.np-carousel__toggle {
  		position: absolute;
		/*right: 2rem;*/
		left: -9999px;
		bottom: -2.5rem;
		display: flex;
		align-items: center;
		padding: 0.2rem;
		color: var(--link-default);
		font-size: var(--font-small);
		background: none;
		border: 1px solid var(--decorative-base);
		border-radius: var(--radius-btn);
		cursor: pointer;

		.np-carousel__icon {
			display: block;
			width: 1.5rem;
			height: 1.5rem;
			fill: var(--text-disabled);
		}
	}
}
.ranking {
	h2 {
		color: var(--decorative-base);
	}
	.container {
		padding-top: 1.5rem;
	}
	.container:first-of-type {
		padding-top: 0;
	}
	h3 {
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 0 0 0.5rem;

		svg {
			width: 1.5rem;
			height: 1.5rem;
			margin-right: 0.25rem;
			fill: var(--decorative-base);
		}
	}
	.list-inner{
		border-top: 1px solid var(--decorative-base);

		a.rank-list {
			width: 100%;
			display: grid;
			grid-template-columns: auto 1fr auto;
			align-items: center;
			padding: 0.25rem;
			color: var(--text-primary);
			text-decoration: none;

			> img {
				width: 1.25rem;
			}
			> span {
				width:1.25rem;
				text-align: center;
				font-weight: bold;
			}
			p.item-name {
				white-space: nowrap;
				overflow: hidden;
				text-overflow: ellipsis;
				min-width: 0;
				padding: 0 0.25rem;

				> span {
					padding-left: 0.25rem;
					font-size: var(--font-caption);
				}
			}
		}
		a.rank-list:hover {
			opacity: 0.4;
		}

		a.rank-list:nth-of-type(odd) {
			background-color: var(--surface-light-2);
		}
	}
	.lower-ranking-wrap {
		display: none;
		overflow: hidden;
		height: 0;
		transition: height 0.4s ease;
	}
	.ranking-foot {
		display: flex;
		justify-content: space-between;
		padding-top: 0.2rem;
		border-top: 1px solid var(--border-dark);

		> small {
			font-size: var(--font-caption);
		}
		> button {
			color: var(--link-default);
		}
		.to-close {
			display: none;

			> svg {
				display: inline;
				width: 1.2em;
				height: 1.2em;
				fill: var(--link-default);
				vertical-align: sub;
			}
		}
	}
}
.property-news {
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	background-color: var(--surface-light-1);

	> h2 {
		span {
			display: block;
			color: var(--decorative-base);
			font-size: var(--font-body);
		}
	}
	h2.top-title {
		display: block;
	}
	.news-list {
		/*width: calc(100% - 3rem);*/
		width: 100%;
		min-height: 5rem;
		max-height: 50vh;
		margin: 0 auto;
		overflow-y: scroll;
		background-color: #fff;
		border: 1px solid var(--border-base);

		.heading {
			position: sticky;
			top: 0;
			left: 0;
			z-index: 50;
			display: flex;
			align-items: center;
			gap: 2%;
			width: 100%;
			padding: 0.2rem 0;
			font-size: var(--font-caption);
			background-color: var(--neutral-white);
			border-bottom: 1px solid var(--border-base);

			> div {
				svg {
					width: 1rem;
					height: 1rem;
					transform: rotate(90deg);
					fill: var(--text-primary);
				}
			}
			.sort-btn.asc {
				color: var(--primary-base);

				> svg {
					transform: rotate(-90deg);
					fill: var(--primary-base);
				}
			}
			.sort-btn.desc {
				color: var(--primary-base);

				> svg {
					transform: rotate(90deg);
					fill: var(--primary-base);
				}
			}
			.building-head {
				flex: 1;
				min-width: 0;
			}
			.rent-head {
				white-space: nowrap;
				text-align: right;

				> p {
					display: flex;
					align-items: center;
				}
			}
		}
		.news-item {
			/*padding: 0 0.5rem;*/

			a.item-wrap {
				display: flex;
				align-items: center;
				gap: 2%;
				padding: 0;
				color: var(--text-primary);
				text-decoration: none;
				font-size: var(--font-small);
				border-bottom: 1px dotted var(--border-base);

				.img-area,
				.floor-plan-area {
					width: 4rem;
					height: 4rem;
				}
				.img-area {
					background-position: center center;
					background-size: contain;
				}
				.floor-plan-area {
					background-position: center center;
					background-size: contain;
				}
				.building-disp {
					width: calc((100% - 8rem - 6%) * 0.8);

					.list-icon-area {
						display: flex;
					}
					> p {
						overflow: hidden;
						white-space: nowrap;
						text-overflow: ellipsis;
					}
					.arrival-icon,
					.applied-icon {
						display: none;
						margin-right: 0.2rem;
						padding: 0 0.2rem;
						color: var(--text-inverse);
						font-size: var(--font-caption);
						border-radius: var(--radius-xsmall);
					}
					.arrival-icon {background-color: var(--text-red);}
					.applied-icon {background-color: var(--accent-base);}
					.arrival-icon.active,
					.applied-icon.active {
						display: inline-block;
					}
				}
				.rate-disp {
					width: calc((100% - 8rem - 6%) * 0.2);

					.old-rent-disp,
					.new-rent-disp,
					.price-rate-disp {
						width: 100%;
						text-align: right;
					}
					.new-rent-disp {
						color: var(--text-red);
					}
					.price-rate-disp {
						color: var(--decorative-base);
					}
				}
			}
		}
	}
}
.our-strengths {
	> h2 {
		color: var(--decorative-base);
	}
	.strengths-wrap	{
		.container {
			padding: 0.5rem 0;
			background-color: var(--neutral-white);
			border-bottom: 2px solid var(--surface-light-2);

			.strengths-toggle {
				display: flex;
				align-items: center;
				gap: 0.5rem;
				padding: 0.5rem 1rem;
				cursor: pointer;
				transition: background-color 0.2s;

				> span {
					color: var(--primary-base);
					font-size: var(--font-ultra-xl);
					flex-shrink: 0;
				}
				.strengths-icon-area {
					flex-shrink: 0;
					> svg {
						width: 3.5rem;
						height: 3.5rem;
						fill: var(--text-secondary);
					}
				}
				> p {
					color: var(--decorative-base);
					flex: 1;
				}
			}
			.strengths-toggle:hover {
				background-color: var(--surface-light-2);
			}
			&.is-locked .strengths-toggle {
				background-color: var(--surface-light-2);
			}
			.strengths-inner {
				display: none;
				padding: 0 1rem 1rem;
			}
			&.is-open .strengths-inner,
			&.is-locked .strengths-inner {
				display: block;
			}
			.strengths-text-area {
				width: 100%;

				.inner {
					display: flex;
					gap: 0.2rem;
					margin-top: 0.5rem;

					> svg {
						width: 1em;
						height: 1em;
						margin-top: 0.25rem;
						fill: var(--decorative-base);
						flex-shrink: 0;
					}
					> p, > a {
						flex: 1;
						text-align: left;
					}
				}
				.inner:first-of-type {
					margin-top: 0;
				}
				.caution-word-area {
					padding-left: 1.1rem;
					text-align: left;
					font-size: var(--font-ultra-small);
				}
			}
			.strengths-image-area {
				margin-top: 0.75rem;
			}
			.strengths-main-image {
				display: block;
				width: 100%;
				height: auto;
				border-radius: 0.25rem;
			}
			.strengths-sub-image-grid {
				display: grid;
				gap: 0.5rem;
				margin-top: 0.5rem;
			}
			.strengths-sub-image-grid.cols-1 {
				grid-template-columns: 1fr;
			}
			.strengths-sub-image-grid.cols-2 {
				grid-template-columns: repeat(2, minmax(0, 1fr));
			}
			.strengths-sub-image-grid.cols-3 {
				grid-template-columns: repeat(3, minmax(0, 1fr));
			}
			.strengths-sub-image-grid img {
				display: block;
				width: 100%;
				height: auto;
				border-radius: 0.25rem;
			}
		}
		.strengths-2 {
			.strengths-toggle > p {
				color: var(--accent-base);
			}
		}
	}
}

.our-strengths-2 {
	> h2 {
		color: var(--decorative-base);
	}
	.wrap {
		display: flex;
		flex-direction: column;
		gap: 2rem;
	}
	.container {
		display: grid;
		grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
		grid-template-areas:
			"main text"
			"main sub";
		column-gap: 1.5rem;
		row-gap: 0.9rem;
		align-items: start;
	}
	.container.right-img {
		grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr);
		grid-template-areas:
			"text main"
			"sub main";
	}
	.text-area {
		grid-area: text;
		padding-top: 0.15rem;
		> h4 {
			font-size: var(--font-h4);
			font-weight: 700;
			color: var(--primary-base);
			padding-bottom: 0.35rem;
			border-bottom: 1px solid var(--decorative-light);
		}
		> p {
			margin-top: 0.5rem;
			line-height: 1.75;
			color: var(--text-primary);
		}
	}
	.main-img-area {
		grid-area: main;
		> .img-title {
			margin-bottom: 0.35rem;
			font-size: 7pt;
			color: var(--neutral-gray);
			line-height: 1.4;
			text-align: center;
			white-space: nowrap;
			padding: 0 0.2rem;
			box-sizing: border-box;
		}
		> img {
			display: block;
			width: 100%;
			aspect-ratio: 16 / 10;
			object-fit: cover;
			background: var(--surface-base);
		}
	}
	.sub-img-area {
		grid-area: sub;
		display: grid;
		gap: 0.75rem;
	}
	.sub-img-area.img-num-1 {
		grid-template-columns: 1fr;
	}
	.sub-img-area.img-num-2 {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
	.sub-img-area.img-num-3 {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}
	.sub-img-area > div {
		display: flex;
		flex-direction: column;
		justify-content: center;
		align-items: center;
	}
	.sub-img-area > div > .img-title {
		width: 100%;
		max-width: none;
		margin-bottom: 0.3rem;
		font-size: 7pt;
		color: var(--neutral-gray);
		line-height: 1.35;
		text-align: center;
		white-space: nowrap;
		padding: 0 0.15rem;
		box-sizing: border-box;
	}
	.sub-img-area > div > img {
		display: block;
		width: 86%;
		max-width: 180px;
		aspect-ratio: 4 / 3;
		object-fit: cover;
		background: var(--surface-base);
	}
	.item-3 .main-img-area,
	.item-3 .sub-img-area {
		align-self: end;
	}
	.item-2 .sub-img-area {
		align-self: end;
	}
}

/* 当社の強み: スマホ表示用 */
@media screen and (max-width: 767px) {
	.our-strengths {
		.strengths-wrap .container {
			.strengths-toggle {
				min-height: 44px;
				-webkit-tap-highlight-color: rgba(0, 0, 0, 0.1);
				touch-action: manipulation;
			}
			.strengths-icon-area {
				display: flex;
				align-items: center;
				justify-content: center;
				flex-shrink: 0;
				min-width: 2.5rem;
				> svg {
					width: 2.5rem;
					height: 2.5rem;
					flex-shrink: 0;
				}
			}
			.strengths-inner {
				display: none;
			}
			&.is-open .strengths-inner,
			&.is-locked .strengths-inner {
				display: block;
			}
		}
	}
	.our-strengths-2 {
		padding-left: 0.75rem;
		padding-right: 0.75rem;
		box-sizing: border-box;
		.wrap {
			gap: 1.5rem;
		}
		.container,
		.container.right-img {
			grid-template-columns: 1fr;
			grid-template-areas:
				"text"
				"main"
				"sub";
			row-gap: 0.75rem;
		}
		.sub-img-area.img-num-3 {
			grid-template-columns: repeat(3, minmax(0, 1fr));
		}
		.sub-img-area > div > img {
			width: 100%;
			max-width: none;
		}
		.sub-img-area > div > .img-title {
			width: 100%;
			max-width: none;
		}
	}
}

.faq-area {
	.wrap {
		width: 100vw;
		margin-top: 1rem;
		padding: 1rem;
		background-color: var(--surface-light-2);

		.inner {
			display: grid;
			grid-template-columns: 4rem 1fr;
			align-items: flex-start;

			.question,
			.answer {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 2em;
				height: 2em;
				font-size: 1.5rem;
				font-weight: bold;
				border-radius: 9999px;
			}
			> p:nth-of-type(2) {
				display: flex;
				align-items: center;
			}
			.question {
				color: var(--primary-base);
				background-color: var(--neutral-white);
				border: 1px solid var(--decorative-base);
			}
			.answer {
				color: var(--decorative-base);
				background-color: var(--primary-light-1);
				border: 1px solid var(--primary-base);
			}
		}
		.inner:last-of-type {
			margin-top: 1rem;
		}
	}
	.wrap:first-of-type {
		margin-top: 0;
	}
}

/* エリア・路線 検索 */
.recommend-condition {
	.wrap {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 0.5rem 0.5rem;
		padding: 0.5rem 0.25rem;
		border: 1px solid var(--border-base);

		.inner {
			width: 100%;
			display: grid;
			grid-template-columns: 1fr auto;
			align-items: center;

			> label > input[type="checkbox"] {
				transform: var(--checkbox-small);
				font-size: var(--font-small);
				margin-right: 0.25rem;
			}
		}
	}

}
.do-search-btn-area {
	display: block;
}

/* 検索結果一覧 */
.result-condition-head {
	border: 1px solid var(--border-base);
	margin: 1rem 1rem 0 1rem;
	padding: 0.5rem 0.5rem 0 0.5rem;

	> h5 {
		padding: 0.25rem 0;
		text-align: center;
		color: var(--neutral-white);
		background-color: var(--primary-base);
	}
	.result-condition-wrap {
		.container {
			position: relative;
			padding: 0.25rem 1rem;
			max-height: 0;
			overflow: hidden;
			opacity: 0;
			transition: max-height 0.3s ease-out;

			.inner {
				/*padding-right: 1.5rem;*/
			> h5 {
				position: relative;
				padding: 0.5rem 0 0;
				font-size: var(--font-small);
				color: var(--primary-base);

				>span {
					padding-left: 0;
				}
					> span::before {
						content: "";
						position: absolute;
						left: 0;
						top: 0.5rem;
						/*transform: translateY(-50%);*/
						width: 0.5rem;
						height: 1.2em;
					}

				}
				> div {
					padding: 0 0.2rem 0.1rem;
					font-size: var(--font-small);
					background-color: var(--surface-light-2);
				}
			}
			> button {
				position: absolute;
				top: 0.5rem;
				right: 0.2rem;
				z-index: 1;
				padding: 0 0.5rem;
				font-size: var(--font-small);
				background-color: var(--neutral-white);
				border: 1px solid var(--primary-base);
				border-radius: var(--radius-xsmall);
				cursor: pointer;
			}
		}
		.container.is-open {
			max-height: 9999px; /* JSで実寸に上書き */
			opacity: 1;
			transition: max-height 0.3s ease-out;
		}
		button.show-all-btn {
			border-bottom: none;
			border-top: 1px dotted var(--border-base);
			box-shadow: none;
		}
	}
}
.result-condition-head.content-container {
	margin: 0 auto 1rem;
}
.save-condition-wrap {
	display: flex;
	justify-content: flex-end;
	margin-bottom: 1rem;
	padding: 0 1rem;

	.save-condition-btn {
		display: flex;
		align-items: center;
		gap: 0.2rem;
		padding: 0.2rem 0.5rem;
		color: var(--primary-base);
		font-size: var(--font-small);
		background-color: var(--primary-light-1);
		border-left: 1px solid var(--primary-base);
		border-right: 1px solid var(--primary-base);
		border-bottom: 1px solid var(--primary-base);
		border-bottom-left-radius: var(--radius-xsmall);
		border-bottom-right-radius: var(--radius-xsmall);

		> svg {
			width: 1em;
			height: 1em;
			fill: var(--primary-base);
		}
	}
}

#result-list .property-wrapper-sell {
	> h3, > .building-header-link > h3 {
		position: relative;
		display: grid;
		grid-template-columns: auto 1fr auto;
		align-items: center;
		padding: 0.1rem 0.5rem;

		.building-type-icon {
			grid-column: 1;
			justify-self: start;
			padding: 0.2rem;
			font-size: var(--font-caption);
			background-color: var(--neutral-white);
			border: 1px solid var(--decorative-base);
			border-radius: var(--radius-xsmall);
		}
		> .building-header-name {
			grid-column: 2;
			display: block;
			width: 100%;
			justify-self: stretch;
			text-align: center;
			padding-left: 0;
			padding-right: 0;
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;
			font-size: var(--font-small);
			min-width: 0;
		}
		.building-header-arrow {
			grid-column: 3;
			justify-self: end;
			width: 24px;
			height: 24px;
			color: var(--property-name);
			fill: var(--property-name);
		}
	}
}

#result-list {
	header.list-header {
		padding: 0 1.5rem 0.5rem;

		.header-inner {
			display: flex;
			align-items: baseline;
			justify-content: center;
			gap: 0.2rem;

			.cont-ttl {
				padding-right: 0.2rem;
				color: var(--decorative-base);
			}
			.count-num {
				color: var(--decorative-base);
				font-size: var(--font-body-xl);
			}
			p.num-disp {
				padding-right: 0.2rem;
				span:nth-of-type(2) {
					color: var(--text-primary);
					font-size: var(--font-body);
				}
			}
		}
		.container {
			display: flex;
			align-items: center;
			justify-content: space-between;
			gap: 0.75rem;
			flex-wrap: wrap;
			padding: 0.5rem 0;
		}
		.list-header-right-controls {
			display: flex;
			align-items: center;
			gap: 0.75rem;
		}
		.brokerage-fee-filter-toggle {
			display: flex;
			align-items: center;
			gap: 0.25rem;
			font-size: var(--font-small);
			white-space: nowrap;
		}
	}
	.recent-history {
		padding: 0 0 1rem;
	}
}
.property-wrapper-sell {
	padding-bottom: 2rem;

		h3 {
		width: 100%;
		margin: 0;
		background: linear-gradient(to right, var(--dark-blue) 50%, rgba(10, 33, 61, 0.75));
		border-top: 2px solid var(--decorative-base);
		border-bottom: 2px solid var(--decorative-base);
		box-shadow: var(--shadow-result-list-top);

		> .building-header-name {
			color: var(--property-name);
		}
		.building-name-link {
			color: inherit;
			text-decoration: none;
		}
		.building-name-link:hover {
			text-decoration: underline;
		}
	}
	.do-gmap-btn {
		width: 1.2rem;
		height: 1.2rem;
		border: 1px solid var(--primary-base);
		border-radius: var(--radius-xsmall);

		> svg {
			width: 1rem;
			height: 1rem;
			fill: var(--decorative-base);
		}
	}
	.property-area {
		display: flex;
		gap: 1rem;
		border-bottom: 1px solid var(--border-base);

		.property-img-area {
			width: 7rem;
			height: 7rem;
			background-position: center center;
			background-size: contain;
			background-repeat: no-repeat;
		}
		.inner {
			display: flex;
			align-items: center;
			width: calc(100% - 5.6rem);
			padding-right: 1rem;

			> div {
				display: flex;
				flex-direction: column;
				gap: 0.3rem;

				> p {
					display: flex;
					align-items: center;
					/*height: 1.2em;*/

					> a {
						color: var(--text-primary);
					}
				}
			}
		}
	}
	.fee-free {
		display: inline-flex;
		align-items: center;
		justify-content: flex-start;
		/*gap: 0.25rem;*/
		margin: 0;
		padding: 0.3rem 0;
		font-size: var(--font-small);

		.icon {
			margin-right: 0.25rem;
			/*padding: 0 0.5rem;
			font-weight: bold;
			color: var(--text-inverse);
			background-color: var(--decorative-base);
			border-radius: 9999px;*/
			> svg {
				width: 1.5em;
				height: 1.5em;
				fill: var(--decorative-base);
			}
		}
		> span {
			color: var(--accent-base);
			font-weight: bold;
		}
	}
	.sidebar-badge-row {
		display: flex;
		flex-wrap: wrap;
		gap: 0.3rem;
		margin: 0.3rem 0 0;
	}
	.sidebar-badge {
		display: inline-block;
		font-size: var(--font-caption);
		font-weight: 700;
		background: #ffe6e6;
		color: #F86E6E;
		border: none;
		padding: 0.15rem 0.5rem;
		border-radius: var(--radius-xsmall);
	}
}
/* ===== 開閉エリア ===== */
.property-hide-list {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.4s ease;
}
/* 展開時：内部コンテナの高さ制限を緩和（165室等の大型建物でも見切れない） */
.property-hide-list.is-open {
  max-height: 999999px;
}
/* ===== ボタン文言 初期状態 ===== */
.show-all-btn .hide-open-btn {
  display: flex;
}
.show-all-btn .hide-close-btn {
  display: none;
}
/* ===== 開いた状態 ===== */
.show-all-btn.is-open .hide-open-btn {
  display: none;
}
.show-all-btn.is-open .hide-close-btn {
  display: flex;
}
/* ===== もっと見るボタン・次の20室を見るボタン 中央寄せ・ピル型 ===== */
.show-all-btn-wrap {
  width: 100%;
  padding: 0.5rem 0;
  display: flex;
  justify-content: center;
  box-shadow: var(--shadow-soft);
}
/* ピル型ボタン（白・丸み・枠・影） */
.property-wrapper-sell .show-all-btn-pill {
  width: auto;
  min-width: 10em;
  padding: 0.4rem 1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1.2;
  background: #fff;
  border: 1px solid var(--border-base, #ddd);
  border-radius: 9999px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
  color: var(--text-base, #333);
  cursor: pointer;
  font-size: var(--btn-text, 1rem);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.property-wrapper-sell .show-all-btn-pill:hover {
  background: #fafafa;
  border-color: var(--border-dark, #ccc);
  transform: translateY(1px);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
}
.property-wrapper-sell .show-all-btn-pill:active {
  transform: translateY(2px);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}
/* 開閉で同じスタイルを共有（ベースの hide-open-btn 固有スタイルを上書き） */
.property-wrapper-sell .show-all-btn-pill .show-all-btn-inner {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  margin: 0;
  padding: 0;
  width: auto;
  line-height: 1.2;
}
.property-wrapper-sell .show-all-btn-pill .show-all-btn-inner span {
  margin: 0;
  padding: 0;
  font-size: inherit;
  font-weight: inherit;
  line-height: inherit;
}
.property-wrapper-sell .show-all-btn-pill .hide-close-btn.show-all-btn-inner,
.property-wrapper-sell .show-all-btn-pill .hide-close-btn {
  display: none;
}
.property-wrapper-sell .show-all-btn-pill.is-open .hide-open-btn.show-all-btn-inner {
  display: none;
}
/* 閉じるボタンのみ以前の全幅スタイル（全X室を見るはピル型のまま） */
.property-wrapper-sell .show-all-btn-pill.is-open {
  width: 100%;
  min-width: unset;
  border-radius: 0;
  border: none;
  border-bottom: 1px solid var(--border-base);
  box-shadow: var(--shadow-result-list-bottom);
  padding: 0;
  background: transparent;
}
.property-wrapper-sell .show-all-btn-pill.is-open:hover {
  background: transparent;
  border-color: var(--border-base);
}
.property-wrapper-sell .show-all-btn-pill.is-open .hide-close-btn.show-all-btn-inner,
.property-wrapper-sell .show-all-btn-pill.is-open .hide-close-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.2rem;
  width: 100%;
  padding: 0.5rem 0;
}
.property-wrapper-sell .show-all-btn-pill .show-all-btn-inner svg {
  width: 1rem;
  height: 1rem;
  fill: currentColor;
}
.property-wrapper-sell .show-all-btn-pill .hide-close-btn svg {
  width: 1.5rem;
  height: 1.5rem;
  fill: var(--primary-base);
}
.property-wrapper-sell .show-all-btn-pill .hide-close-btn p {
  margin: 0;
  padding: 0;
  font-size: var(--btn-text);
  font-weight: normal;
  line-height: inherit;
}
.load-more-rooms-wrap {
  width: 100%;
  padding: 0.5rem 0;
  display: flex;
  justify-content: center;
  box-shadow: var(--shadow-soft);
}
.load-more-rooms-btn {
  width: auto;
  min-width: 10em;
  padding: 0.4rem 1rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.35rem;
  background: #fff;
  border: 1px solid var(--border-base, #ddd);
  border-radius: 9999px;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.15);
  color: var(--text-base, #333);
  cursor: pointer;
  font-size: var(--btn-text, 1rem);
  transition: transform 0.15s ease, box-shadow 0.15s ease;
}
.load-more-rooms-btn:hover:not(:disabled) {
  background: #fafafa;
  border-color: var(--border-dark, #ccc);
  transform: translateY(1px);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
}
.load-more-rooms-btn:active:not(:disabled) {
  transform: translateY(2px);
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
}
.load-more-rooms-btn:disabled {
  opacity: 0.7;
  cursor: not-allowed;
}

.main-area-wrap,
.result-list-sell {
	position: relative;
	padding-top: 1rem;
	padding-bottom: 1rem;
	border-bottom: 1px dotted var(--border-base);
	cursor: pointer;

	.corner-badge {
		position: absolute;
		top: 0;
		left: 0;
		width: 0;
		height: 0;
		z-index: 2;
		border-top: 2.5rem solid var(--text-red);
		border-right: 2.5rem solid transparent;
	}
	.corner-badge::before {
		content: "新着";
		position: absolute;
		top: -2.1rem;
		left: -0.4rem;
		width: 2.5rem;
		text-align: center;
		color: #fff;
		font-size: 12px;
		font-weight: 700;
		transform: rotate(-45deg);
		letter-spacing: 0.05em;
	}
	.disp-view {
		position: absolute;
		top: 0.75rem;
		right: 0.75rem;
		z-index: 2;
		
		.disp-icon {
			margin-bottom: 0.25rem;
			padding: 0.1rem 0.2rem;
			text-align: center;
			font-size: var(--font-caption);
			color: var(--neutral-white);
			border-radius: var(--radius-xsmall);

			&.new {display: none;}
			&.app {background-color: var(--accent-base);}
		}
	}
	.main-area {
		position: relative;
		display: flex;
		align-items: center;
		padding-left: 1.5rem;
		padding-right: 3rem;
	}
	/* スルスル開閉するアニメーションの設定 */
	.img-block {
		position: relative;
		z-index:1;
		margin-right: 0.5rem;
		width: 6rem;
		height: 6rem;
		border: 1px solid var(--border-base);
		background-size: contain;
		background-position: center center;
		background-repeat: no-repeat;
	}
	.main-img-view-area {
		position: relative;
		z-index: 10;
		width: 100%;
		height: 100%;
		background-size: contain;
		background-position: center center;
		background-repeat: no-repeat; 
	}
	.toggle-btn {
		position: absolute;
		z-index: 1;
		bottom:-0.25rem;
		left: 50%;
		transform: translateX(-50%);
		width: 8em;
		font-size: var(--font-ultra-small);
		color: var(--text-inverse);
		background-color: var(--neutral-black);
		border-radius: var(--radius-xsmall);
		
	}

	.terms {
		.terms-rent {
			display: flex;
			align-items: baseline;
			font-size: var(--font-small);

			> p:first-of-type {
				color: var(--primary-base);
				font-weight: 700;
			}
			> p:last-of-type {
				color: var(--text-primary);
			}
			p:first-of-type {
				span {
					font-size: var(--font-terms-rent);
				}
			}
		}
		.terms-property-info {
			.initial-fees-area {
				display: flex;
				align-items: center;
				gap: 1rem;
				margin: 0.25rem 0;

				p {
					display: flex;
					align-items: center;
					gap: 0.5rem;

					> span:first-of-type {
						display: inline-block;
						width: 1.2rem;
						height: 1.2rem;
						line-height: 1.2rem;
						text-align: center;
					}
				}
				p.default {
					color: var(--text-primary);

					> span:first-of-type {
						border: 1px solid var(--neutral-black);
					}
				}
				p.free {
					color: var(--text-red);

					> span:first-of-type {
						border: 1px solid var(--text-red);
					}
				}
				p.none {
					display: none;
				}
			}
		}
	}

	.sub-img-view-area {
		overflow: hidden;
		max-height: 0;
		padding-top: 0;
		transition: all 0.4s ease;
	}
	/* 開いている状態 */
	.sub-img-view-area.is-open {
		max-height: 1000px;
		padding-top: 1rem;
		overflow: visible;
	}

	.free-inquiry-area {
		position: absolute;
		bottom: 0;
		right: 0;
		padding-bottom: 0.5rem;
		padding-right: 0.5rem;

		.free-inquiry-btn {
			display: flex;
			align-items: center;
			justify-content: center;
			gap: 0.2rem;
			width: 90%;
			color: var(--primary-base);
			border: 1px solid var(--primary-base);
			border-radius: var(--radius-small);

			> svg {
				width: 2rem;
				height: 2rem;
				fill: var(--primary-base);
			}
		}
	}
}

.show-all-btn {
	width: 100%;
	border-bottom: 1px solid var(--border-base);
	box-shadow: var(--shadow-result-list-bottom);

	> div,
	.hide-open-btn,
	.hide-close-btn {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 0.2rem;
		width: 100%;
		padding: 0.5rem 0;

		> span,
		> p {
			margin: 0;
			padding: 0;
			font-size: var(--btn-text);
			font-weight: normal;
		}
		> svg {
			width: 1.5rem;
			height: 1.5rem;
			fill: var(--primary-base);
		}
	}
	.hide-close-btn {
		display: none;
	}
}

#sticky-filter {
	width: calc(100% - 2vw);
	display: block;
	position: fixed;
	/*top:0;*/
	top: -40vh;
	left: 50%;
	padding-top: 4.5rem; /* JS で header 高さに動的上書き */
	margin-top: 1vw;
	transform: translateX(-50%);
	background-color: var(--neutral-white);
	border: 1px solid var(--border-base);
	box-shadow: var(--shadow-medium);
	/*transition: transform 0.3s ease, opacity 0.3s ease;*/
	/*transform: translateY(-100%); /* 初期位置 */
	z-index: 800;
	opacity: 0;
	transition: all 0.4s;

	> div {
		position: relative;
		padding: 0.5rem 1rem;
		border-bottom: 1px solid var(--border-dark);
	
		> button,
		> .change-condition-dual > button {
			position: absolute;
			top: 0.2rem;
			right: 0.2rem;
			padding: 0.15rem 0.5rem;
			font-size: var(--font-small);
			background-color: var(--neutral-white);
			border: 1px solid var(--primary-base);
			border-radius: var(--radius-xsmall);
			cursor: pointer;
		}
		> div:not(.change-condition-dual) {
			white-space: nowrap;
			overflow: hidden;
			text-overflow: ellipsis;

			padding: 0 0.2rem 0.1rem;
			font-size: var(--font-small);
			background-color: var(--surface-light-2);
		}
		h6 {
			display: flex;
			align-items: center;
			gap: 0.2rem;
			margin: 0 0 0.25em 0;
			color: var(--primary-base);

			> svg {
				width: 1.2rem;
				height: 1.2rem;
				fill: var(--primary-base);
			}
		}
	}
}
#sticky-filter.is-show {
	top: 0;
	opacity: 1;
	transition: all 0.4s ease;
}

/* 04_物件詳細 */
#detail {
	.detail-title-wrap {
		position: relative;

		.detail-fav-btn {
			position: absolute;
			top: 50%;
			right: 1rem;
			transform: translateY(-50%);
			z-index: 1;
			width: 2.5rem;
			height: 2.5rem;
			padding: 0;
			background: none;
			border: none;
			cursor: pointer;
		}
	}
	h2.content-ttl {
		margin-top: 1rem;
		margin-bottom: 0.5rem;
		padding: 0.5rem 1rem;
		background-color: var(--dark-blue);
		color: var(--property-name);
		border-top: 2px solid var(--decorative-base);
		border-bottom: 2px solid var(--decorative-base);
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.detail-ttl-info-area {
		padding: 0 1rem 1rem;
		text-align: center;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
	.fee-free-wrap {
		text-align: center;

		.fee-free {
			display: inline-flex;
			align-items: baseline;
			justify-content: center;
			gap: 0.25rem;
			margin: 0 auto 0.5rem;
			padding: 0.5rem 1rem;
			font-size: var(--font-small);
			/*background-color: var(--fee-free-bg);*/
			border: 1px solid var(--decorative-base);

			.icon {
				padding: 0 1rem;
				font-weight: bold;
				color: var(--text-inverse);
				background-color: var(--decorative-base);
				border-radius: 9999px;
			}
			> span {
				color: var(--accent-base);
				font-weight: bold;
			}
		}
	}
	.features-wrap {
		text-align: center;

		.inner {
			display: inline-flex;
			align-items: baseline;
			justify-content: center;
			gap: 0.25rem;
			margin: 0 auto 0.5rem;
			padding-right: 1rem;
			font-size: var(--font-small);
			box-shadow: var(--shadow-soft);

			.icon {
				padding: 0.25rem 1rem;
				font-weight: bold;
				color: var(--text-inverse);
				background-color: var(--primary-base);
			}
			> span {
				margin-left: 1rem;
			}
		}
	}
	.detail-top-rent {
		/*text-align: center;*/
		margin-bottom: 1rem;
		padding-left: 1rem;

		.new-icon,
		.appl-ucon {
			margin-bottom: 0.25rem;
			padding: 0.1rem 0.2rem;
			text-align: center;
			color: var(--text-inverse);
			font-size: var(--font-caption);
			border-radius: var(--radius-xsmall);
		}

		.new-icon {
			padding-left: 0.5rem;
			padding-right: 0.5rem;
			background-color: var(--text-red);
		}
		.appl-ucon {
			background-color: var(--accent-base);
		}
		.amount-disp {
			color: var(--primary-base);
		}
	}
	.main-area-wrap {
		padding-top: 0;
		padding-bottom: 1rem;

		.main-area-container {
			position: relative;

			.main-carousel {
				.num-counter {
					position: absolute;
					top: 0.5rem;
					left: 2.5rem;
					z-index: 10;
					padding: 0 0.5rem;
					background-color: rgba(255, 255, 255, 0.7);
					border-radius: 999px;
				}
				.carousel-viewport {
					background-color: var(--surface-light-2);
				}
				.carousel-item {
					height: 16rem;
					background-size: contain;
					background-repeat: no-repeat;
					background-position: center;
				}
			}
			.toggle-btn {
				font-size: var(--font-small);
			}
		}
	}
	.detail-inquiry-btn {
		> button {
			display: flex;
			align-items: center;
			justify-content: center;
			gap: 0.5rem;
			width: 100%;
			padding: 0.5rem 1rem;
			color: var(--primary-base);
			font-weight: bold;
			font-size: var(--font-body);
			border: 2px solid var(--decorative-base);
			border-radius: var(--radius-btn);
			text-decoration: none;
			background: #fff;
			cursor: pointer;
			box-sizing: border-box;
		}
		> button svg {
			width: 1.5em;
			height: 1.5em;
			flex-shrink: 0;
			fill: currentColor;
		}
		> button:hover {
			background: var(--primary-light-1);
		}
		> div {
			display: flex;
			justify-content: center;
			/*gap: 0.5rem;*/
			gap: 2%;
			margin-top: 0.5rem;

			> button {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 32%;
				line-height: 1.2;
				padding: 0.25rem 0;
				color: var(--primary-base);
				font-size: var(--font-caption);
				background-color: var(--primary-light-1);
				border: 1px solid var(--primary-base);
				border-radius: var(--radius-xsmall);
				text-align: center;
				cursor: pointer;
			}
			> button:hover {
				background: var(--neutral-white);
				color: var(--primary-base);
				border: 1px solid var(--decorative-base);
			}
		}
	}
	.detail-inquiry-btn.second {
		width: 80%;
		margin: 1rem auto;
	}
	.recent-history,
	.recommended-history {
		padding: 1rem 0;
	}
}
.reserve-inquiry-foot-btn,
.reserve-inquiry-btn-area {
	padding: 1rem 0 0.5rem;
	background-color: var(--surface-light-2);

	.btn-wrap {
		display: flex;
		justify-content: center;
		gap: 1rem;
		padding: 0 1.5rem 0.5rem;

		a.btn-body {
			position: relative;
			display: flex;
			align-items: center;
			width: 100%;
			text-decoration: none;
			border-radius: var(--radius-btn);

			.free-icon {
				padding: 0.5rem;
				line-height: 1.1;
				font-size: var(--font-body);
				font-weight: bold;
				border-top-left-radius: var(--radius-btn);
				border-bottom-left-radius: var(--radius-btn);
			}
			.btn-ttl {
				width: 100%;
				text-align: center;
				font-weight: bold;
				color: var(--text-inverse);
			}
			.tagline {
				position: absolute;
				top: -0.25rem;
				left: 50%;
				width: 13em;
				transform: translateX(-50%);
				text-align: center;
				font-size: var(--font-ultra-small);
				background-color: var(--neutral-white);
				border-radius: 0.2rem;
			}
		}
		a.do-contact {
			background: var(--gradient-btn-contact-base);
			box-shadow: var(--shadow-contact);
			
			.free-icon {
				color: var(--primary-base);
				background: var(--gradient-btn-contact-light);
			}
			.tagline {
				color: var(--primary-base);
				border: 1px solid var(--primary-base);
			}
		}
		a.do-reserve {
			background: var(--gradient-btn-reserve-base);
			box-shadow: var(--shadow-reserve);

			.free-icon {
				color: var(--decorative-base);
				background: var(--gradient-btn-reserve-light);
			}
			.tagline {
				color: var(--decorative-base);
				border: 1px solid var(--decorative-base);
			}
		}
		a.do-waitlist {
			background: var(--gradient-btn-waitlist-base);
			box-shadow: var(--shadow-waitlist);

			.free-icon {
				color: var(--free-icon-waitlist);
				background: var(--gradient-btn-waitlist-light);
			}
			.tagline {
				color: var(--primary-light-3);
				border: 1px solid var(--primary-light-3);
			}
		}
	} 
	.business-info-area {
		a.phone-number {
			display: flex;
			align-items: center;
			justify-content: center;
			gap: 0.5rem;
			text-decoration: none;

			> svg {
				width: 1rem;
				height: 1rem;
				fill: var(--primary-base);
			}
			> span {
				font-size: var(--font-body-xl);
				font-weight: bold;
				color: var(--decorative-base);
			}
		}
		.business-hours {
			text-align: center;
			line-height: 1;

			> p {
				font-size: var(--font-small);
			}
			> span {
				font-size: var(--font-caption);
			}
		}
	}
}
.reserve-inquiry-foot-btn {
	position: fixed;
	left: 0;
	bottom: 0;
	width: 100%;
	padding: 1rem 0;
	background-color: var(--text-secondary);

	.btn-wrap {
		a.foot-btn {
			width: 80%;
			text-decoration: none;
			background-color: var(--neutral-white);
			border: 1px solid var(--decorative-base);
			border-radius: var(--radius-btn);
			transition: background .2s, color .2s, border-color .2s;

			> p {
				width: 100%;
				padding: 0.5rem 0;
                text-align: center;
                font-weight: bold;
                color: var(--primary-base);
			}
		}
		a.foot-btn:hover {
			background-color: var(--primary-light-1) !important;
			border-color: var(--decorative-base) !important;

			> p {
				color: var(--primary-base) !important;
			}
		}
	}
	.business-info-area {
		color: var(--text-inverse);
	}
}
.detail-rent-info-wrap {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0.5rem 1rem;
	
	.property-info {
		.rent-area {
			/*padding: 1rem 0.5rem 0.2rem 1rem;*/
			font-size: var(--font-body-xl);
			color: var(--primary-base);

			> p:first-of-type > span:first-of-type {
				font-size: var(--font-detail-rent);
			}
			> p:last-of-type {
				font-size: var(--font-small);
			}
		}
	}
}

table.information-area {
	width: 100%;
	border-collapse: collapse;
	border-spacing: 0;
	border-top: 1px solid var(--border-base);
	border-bottom: 1px solid var(--border-base);

	tr {
		display: flex;
		flex-wrap: wrap;
		border-bottom: 1px dotted var(--border-dark);
		&:last-of-type {
			border-bottom: 0;
		}
	}
	tr.col-1 {
		th {
			width: 20%;
			text-align: center;
		}
		td { width: 80%; }
	}
	tr.col-2 {
		th { width: 20%; }
		td { width: 30%; }
	}
	th {
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 0 0.5rem;
		font-size: var(--font-small);
		font-weight: normal;
		vertical-align: middle;
		background-color: var(--surface-base);
	}
	td {
		padding: 0.5rem;

		> button {
			display: flex;
			align-items: center;
			justify-content: center;
			gap: 0.2rem;
			width: 100%;
			margin-top: 0.2rem;
			background-color: var(--surface-light-2);
			border: 1px solid var(--decorative-base);
			border-radius: var(--radius-btn);

			> svg {
				width: 1rem;
				height: 1rem;
				fill: var(--primary-base);
			}
		}
		.free-color {
			color: var(--text-red);
		}
	}
}
.comment-box,
.review-box {
	padding: 1rem;
	
	> h4 {
		border-bottom: 1px solid var(--decorative-base);
	}
	.container {
		padding: 1rem;
		border: 1px solid var(--border-base);

		#review-box-hide-list {
			overflow: hidden;
			height: 0;
			transition: height .35s ease;
		}
		.btn-wrap {
			display: flex;
			justify-content: end;
			margin-top: 1rem;
			padding: 0.25rem 0;
			border-top: 1px dotted var(--border-base);
			
			> button {
				text-align: right;
				color: var(--link-default);

				.review-llist-close {
					display: none;
					align-items: center;

					> svg {
						width: 1.5em;
						height: 1.5em;
						fill: var(--primary-base);
					}
				}
			}
		}
		.llist-inner {
			margin-top: 1rem;

			.name-disp {
				padding-bottom: 0.25rem;
				border-bottom: 1px dotted var(--border-base);

				> span {
					padding: 0.2rem 1rem;
					font-size: var(--font-small);
					color: var(--neutral-white);
					background-color: var(--primary-base);
				}
			}
		}
		.review-item-format {
			.review-item-row {
				display: flex;
				align-items: flex-start;
				gap: 0.5rem;
			}
			.review-icon-block {
				flex-shrink: 0;
				display: flex;
				flex-direction: column;
				align-items: center;
				gap: 0.25rem;
			}
			.review-icon-svg {
				width: 3.6em;
				height: 3.6em;
			}
			.review-author {
				margin: 0;
				font-size: var(--font-small);
				color: var(--text-secondary);
				text-align: center;
			}
			.review-content {
				flex: 1;
				white-space: pre-wrap;
				word-break: break-word;
			}
		}
		> .llist-inner:first-of-type {
			margin-top: 0;
		}
	}
}
.comment-box {
	padding-bottom: 0;
}
.review-box {
	> h4 {
		> p:last-of-type {
			font-size: var(--font-small);
			text-align: right;
			font-weight: normal;
		}
	}
}
.icon-area {
	display: grid;
	grid-template-columns: repeat(4, 1fr); 
	justify-items: center;
    gap: 1rem 0;
	padding: 1rem 0.5rem;
	
	> div {
		text-align: center;
		line-height: 1;
		display: flex;
		flex-direction: column;
		align-items: center;
		min-width: 0;

		> svg,
		> img.facility-icon-img {
			width: 3.5rem;
			height: 3.5rem;
			display: block;
		}
		> img.facility-icon-img {
			object-fit: contain;
		}
		> span {
			font-size: var(--font-ultra-small);
			display: block;
			text-align: center;
		}
	}
	.icon-on {
		> svg {fill: var(--primary-light-3);}
		> img.facility-icon-img {
			opacity: 1;
			filter: brightness(0) saturate(100%) invert(71%) sepia(51%) saturate(2000%) hue-rotate(166deg) brightness(95%) contrast(101%);
		}
		> span {color: var(--text-primary);}
	}
	.icon-off {
		> svg {fill: var(--text-disabled);}
		> img.facility-icon-img {
			opacity: 0.35;
			filter: none;
		}
		> span {color: var(--text-disabled);}
	}
}

.mini-reserve-cal {
	padding: 1rem 0.5rem;
	ul {
		border-top: 1px solid var(--surface-base);
		border-left: 1px solid var(--surface-base);
		font-size: var(--font-caption);
		display: flex;
		overflow-x: scroll;

		li {
			width: 3rem;
			border-right: 1px solid var(--surface-base);
			border-bottom: 1px solid var(--surface-base);
			color: var(--text-disabled);

			> span {
				width: 3rem;
				display: block;
				text-align: center;

				&:first-of-type {
					background-color: var(--surface-base);
				}
			}
			> svg {
				fill: var(--text-disabled);
			}
			&.circle > svg {fill: var(--primary-base);}
			&.cross > svg {fill: var(--text-red);}
			&.weekdays {color: var(--text-primary);}
			&.saturday {color: var(--primary-light-3);}
			&.sunday {color: var(--text-red);}
			
			> svg {
				width: 1.5rem;
				height: 1.5rem;
				margin: 0 auto;
			}
		}
	}
}
.google-map-area {
	.inner {
		width: 100%;
		aspect-ratio: 16 / 9;
		border: 1px solid var(--border-dark);
		overflow: hidden;

		iframe {
			display: block;
			width: 100%;
			height: calc(100% + 30px);
			border: 0;
		}
	}
}
.other-property {
	.wrap {
		padding: 1rem;
		background-color: var(--surface-light-2);

		.open-arrow-btn {
			width: 100%;
			display: flex;
			align-items: center;
			justify-content: center;
			gap: 0.5rem;
			margin: 0 auto;
			padding: 0.5rem 0;
			color: var(--link-default);
			background-color: var(--neutral-white);
			border: 1px solid var(--decorative-base);
			border-radius: var(--radius-btn);

			> img {
				width: 1.2rem;
			}
		}
		.open-arrow-btn.is-open {
			> img {
				transform: rotate(180deg);
			}
		}
	}
	.open-rist-wrap {
		overflow: hidden;
		max-height: 0;
		transition: all 0.4s ease;
	}
	.open-rist-wrap.is-open {
		max-height: 60vh;
		overflow-y: auto;
	}
	#list-close-btn {
		display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.2rem;
        width: 100%;
        padding: 0.5rem 0;
		color: var(--link-default);

		> svg {
			width: 1rem;
			height: 1rem;
			fill: var(--primary-base);
		}
	}
}

.bottom-modal {
	position: fixed;
	left: 0;
	bottom: 0;

	opacity: 0;
	pointer-events: none;
	transform: translateY(32vh);

	transition:
		opacity .5s ease,
		transform .5s ease;
}
.bottom-modal.is-show {
	bottom: 0;
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0);

	transition:
		opacity .4s ease,
		transform .4s ease;
}

/* お気に入り - 観覧履歴 */
#favorites,
#history {
	.count-area {
		padding: 0.5rem 0 1rem;
		text-align: center;

		> p > span {
			color: var(--decorative-base);
		}
	}
	.all-inquiry-btn {
		position: fixed;
		left: 0;
		bottom: 0;
		z-index: 1;
		width: 100%;
		padding: 1rem;
		background-color: var(--neutral-white);
		box-shadow: var(--shadow-result-list-top);

		a.btn-body {
			position: relative;
			display: flex;
			align-items: center;
			width: 100%;
			text-decoration: none;
			border-radius: var(--radius-btn);

			.free-icon {
				padding: 0.5rem;
				line-height: 1.1;
				font-size: var(--font-body);
				font-weight: bold;
				border-top-left-radius: var(--radius-btn);
				border-bottom-left-radius: var(--radius-btn);
			}
			.btn-ttl {
				width: 100%;
				text-align: center;
				font-weight: bold;
				color: var(--text-inverse);
			}
			.tagline {
				position: absolute;
				top: -0.25rem;
				left: 50%;
				width: 13em;
				transform: translateX(-50%);
				text-align: center;
				font-size: var(--font-ultra-small);
				background-color: var(--neutral-white);
				border-radius: 0.2rem;
			}
		}
		a.do-contact {
			background: var(--gradient-btn-contact-base);
			box-shadow: var(--shadow-contact);
			
			.free-icon {
				color: var(--primary-base);
				background: var(--gradient-btn-contact-light);
			}
		}
	}
	.property-wrapper-sell {
		padding-bottom: 0;
		margin-bottom: 2rem;
		box-shadow: var(--shadow-result-list-bottom);
	}
}
/* お気に入り：建物ヘッダーは <a><h3> 構造のため > h3 だけでは当たらない。チェック→種別→建物名→＞の順 */
#favorites .property-wrapper-sell > h3,
#favorites .property-wrapper-sell > .building-header-link > h3 {
	display: grid;
	grid-template-columns: auto auto 1fr auto;
	align-items: center;
	padding: 0.5rem 0.5rem 0.5rem 1rem;

	> input[type="checkbox"] {
		grid-column: 1;
		justify-self: start;
		padding: 0.2rem;
		font-size: var(--font-caption);
		background-color: var(--neutral-white);
		border: 1px solid var(--decorative-base);
		border-radius: var(--radius-xsmall);
	}
	.building-type-icon {
		grid-column: 2;
		justify-self: start;
		padding: 0.2rem;
		font-size: var(--font-caption);
		background-color: var(--neutral-white);
		border: 1px solid var(--decorative-base);
		border-radius: var(--radius-xsmall);
	}
	> .building-header-name {
		grid-column: 3;
		text-align: center;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		min-width: 0;
	}
	.building-header-arrow {
		grid-column: 4;
		justify-self: end;
		width: 24px;
		height: 24px;
		color: var(--property-name);
		fill: var(--property-name);
	}
}
/* 閲覧履歴：種別→建物名→＞→✖（JS で .sell-close-btn を末尾追加） */
#history .property-wrapper-sell > h3,
#history .property-wrapper-sell > .building-header-link > h3 {
	display: grid;
	grid-template-columns: auto 1fr auto auto;
	align-items: center;
	padding: 0.5rem 0.5rem 0.5rem 1rem;

	.building-type-icon {
		grid-column: 1;
		justify-self: start;
		padding: 0.2rem;
		font-size: var(--font-caption);
		background-color: var(--neutral-white);
		border: 1px solid var(--decorative-base);
		border-radius: var(--radius-xsmall);
	}
	> .building-header-name {
		grid-column: 2;
		text-align: center;
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
		min-width: 0;
	}
	.building-header-arrow {
		grid-column: 3;
		justify-self: end;
		width: 24px;
		height: 24px;
		color: var(--property-name);
		fill: var(--property-name);
	}
	.sell-close-btn {
		grid-column: 4;
		justify-self: end;
		width: 1.5rem;
		height: 1.5rem;
		padding: 0;
		border: none;
		background: transparent;
		cursor: pointer;
		line-height: 0;

		> svg {
			width: 1.5rem;
			height: 1.5rem;
			fill: var(--border-dark);
		}
	}
}

/* お問い合わせ */
.step-chart {
	display: flex;
	width: 100%;
	color: var(--text-inverse);
	margin-bottom: 1rem;

	> div {
		position: relative;
		width: calc(100% / 3);
		padding: 0.2rem 0;
		text-align: center;

		> img {
			height: 100%;
			position: absolute;
			top: 0;
			left: 0;
		}
	}
	.color-base {background-color: var(--decorative-base);}
	.color-light {background-color: var(--decorative-light);}
}
.do-line {
	padding-bottom: 1rem;
	> a {
		display: flex;
		gap: 0.5rem;
		align-items: center;
		justify-content: center;
		width: fit-content;
		margin: 0 auto;
		color: var(--text-primary);
		text-decoration: none;

		> img {width: 3rem;}
		> p {
			font-size: var(--font-body-lg);
			line-height: 1;

			> span {font-size: var(--font-caption);}
		}
	}
}
.from-area {		/* お問い合わせ：カスタム */
	.calendar-wrap {
		max-height: 0;				/* 高さを0にする */
		opacity: 0;					/* 透明にする */
		overflow: hidden;			/* はみ出た中身を隠す（これが重要！） */
		transition: all 0.5s ease;	/* 変化をなめらかに */
	}
	.calendar-wrap > div {
		min-height: 0;
	}
	.checkbox-area:has(li:nth-of-type(2) input:checked) .calendar-wrap {
		max-height: 24rem;	/* 十分な高さを指定（中身に合わせて適宜調整） */
		opacity: 1;					/* 表示する */
		/*margin: 5px 0;*/
	}
}
.do-terms-area {
	text-align: center;
	> p {
		width: 22em;
		margin: 0 auto;
		font-size: var(--font-small);
	}
}
.flash-message {
	padding: 1rem 1.25rem;
	border-radius: 6px;
	margin-bottom: 1.5rem;
	font-size: 0.95rem;
	line-height: 1.5;
}
.flash-success {
	background: #e8f5e9;
	color: #2e7d32;
	border-left: 4px solid #43a047;
}
#contact,
#contact-conf {
	.property-area {
		.carousel {
			.property-wrapper-sell {
				padding-bottom: 0;
				background-color: var(--neutral-white);
			}
			.carousel-item {
				width: calc(100vw - 3rem);
			}
			.result-list-sell {
				padding-bottom: 1rem;
			}
		}
		.carousel-counter {
			text-align: center;
			padding: 0.5rem 0 1rem;
		}
	}
}

.caution-word {
	padding-top: 0.5rem;
	text-align: center;
	line-height: 1;
}
.calendar {
	width: 100%;
	height: 24rem;
	overflow: auto;
	/*line-height: var(--line-height-body);*/

	/* グリッド本体 */
	.calendar-grid {
		display: grid;
		grid-template-columns: 3rem repeat(14, 6rem);
		grid-auto-rows: 2.4rem;
		min-width: max-content;
	}

	/* 共通セル */
	.cell {
		display: flex;
		align-items: center;
		justify-content: center;
		/*border: 1px solid #eee;*/
		box-sizing: border-box;
		background: #fff;
	}

	/* 左上 */
	.corner {
		position: sticky;
		top: 0;
		left: 0;
		z-index: 3;
		/*height: 1.8rem;*/
		border-top: 1px solid var(--border-base);
		border-bottom: 1px solid var(--border-base);
	}

	/* 日付（上固定） */
	.date {
		position: sticky;
		top: 0;
		z-index: 2;
		/*height: 1.8rem;*/
		text-align: center;
		/*line-height: 60px;*/
		border-top: 1px solid var(--border-base);
		border-bottom: 1px solid var(--border-base);
	}
	.date.sat {
		color: var(--primary-light-3);
	}
	.date.sun {
		color: var(--text-red);
	}

	/* 時間（左固定） */
	.time {
		position: sticky;
		left: 0;
		z-index: 1;
		text-align: right;
		/*padding-right: 8px;*/
		/*line-height: 60px;*/
	}
	.corner, .time {width: 3rem;}

	/* 予約ボタン */
	.slot {
		padding: 0 0.2rem;
		background: var(--neutral-white);
		cursor: pointer;
		border-right: 1px dotted var(--border-dark);
		border-bottom: 1px solid var(--border-base);

		> span {
			width: 100%;
			height: 2rem;
		}
	}
	.slot.is-available {
		> span {
			color: var(--primary-base);
			background-color: var(--primary-light-1);
		}
	}
	.slot.is-booked {
		> span {
			color: var(--neutral-white);
			background-color: var(--surface-dark);
			cursor: not-allowed;
		}
	}
	.slot.is-selected {
		> span {
			color: var(--neutral-white);
			background-color: var(--decorative-base);
		}
	}
	/*
	.slot:hover {
		background: #e6f0ff;
	}
	*/
}

/*.内見のご予約 */
.calendar-wrap-reserve {
	padding: 1rem 1.5rem 0.5rem;
}
.preferred-display {
	display: grid;
	grid-template-columns: repeat(1, 1fr);
	justify-content: center;
	gap: 0.25rem;
	width: 70%;
	margin: 0 auto;
	padding-bottom: 1rem;

	.preferred {
		color: var(--text-disabled);
	}
	.preferred.active {
		color: var(--decorative-base);
	}
}

/* 利用規約 */
#terms {
	p {
		padding: 1rem 2rem 2rem;
		border-top: 1px solid var(--border-base);
	}
	p.terms-text {
		margin-bottom: 2rem;
	}
}

/* PC ///////////////////////////////////////////////// */
@media screen and (min-width: 768px) {
	/* UI Components */
	.select-wrap {
		select {
			font-size: var(--font-small);
		}
	}
	.breadcrumbs {
		padding: 0.25rem 0 0 2rem;
	}

	.first-item {
		display: flex;
		align-items: center;
	}
	.from-area {
		.item-field {
			ul.checkbox-area {
				.second-lines {
					display: grid;
					grid-template-columns: repeat(3, 1fr);
				}
			}
		}
	}

	.slider-group {
		display: none;
	}
	.select-container {
		display: inline-block;
	}
	.pc-checkbox {
		display: grid;
		grid-template-columns: repeat(5, 1fr);
	}


	/* COMMON */
	.page-container {
		box-shadow: var(--shadow-medium);
	}
	.header {
		nav.menu {
			display: flex;
			align-items: center;
			justify-content: flex-end;
			flex-direction: row-reverse;
			/*padding: 0 1rem;*/
			background-color: transparent;
			box-shadow: none;

			.menu-head {
				display: flex;
				align-items: center;
				flex-direction: row-reverse;
				box-shadow: none;
				padding: 0;

				.inquiry {
					display: flex;
					align-items: center;

					.link-contact {
						display: block;
					}
					.contact-area {
						/*margin-left: 2em;*/
						margin-left: 1rem;

						.tel-num {
							> a {
								font-size: 107%;
							}
						}
						.always-open {
							font-size: 120%;
						}
					}
					.link-contact {
						padding:0;
					}
				}
				.search-wrap {
					display: flex;
					align-items: center;
					/*margin: 0 2rem;*/
					margin: 0 1rem;

					.textbox-search {
						width: 16rem;
					}
				}
			}
			.link-wrap {
				display: flex;
				/*gap: 2rem;*/
				gap: 1rem;

				> p {
					/*padding:0 0 0 1rem;*/
					padding:0 0 0 0.5rem;
					border: 0;
					white-space: nowrap;
				}
				.link-top, .link-contact, .link-result {
					display: none;
				}
			}
			:is(.menu-head, .link-wrap) {
				:is(a:link, a:active, a:visited) {
					display: flex;
					gap: 0;
					align-items: center;
					flex-direction: column;
					font-size: var(--font-caption);
				}
			}
		}
		#overlay, nav.smartphone {
			display: none;
		}
	}
	.footer {
		.jprs-seal {
			.jprs-pc { display: inline; }
			.jprs-sp { display: none; }
		}
		.foot-company-inner {
			flex-direction: row;
			align-items: center;
			justify-content: space-between;
			padding-top: 0;
		}
		.foot-company-left {
			align-self: auto;
		}
		.foot-company-right {
			flex-direction: row;
			align-items: center;
			gap: 0.8rem;
		}
	}
	.shortcut-link {
		line-height: 1.6;
		background-color: var(--surface-light-1);

		.tokyo-23 {
			width: 100%;
		}
	}
	.visible-list, #hide-list {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 0 2vw;
	}
	#hide-list {
		overflow: visible;
	}
	.hide-button {
		display: none;

		/*#conditions-hide-list {
			display: grid;
			grid-template-columns: repeat(2, 1fr);
		}*/
	}
	.reco-property-cell {
		.fav-button {top: 2.7rem;}
		.new-arrival-date {top: 3.2rem;}
	}

	/* 保存した条件 */
	.saved-conditions-drawer {
		.container {
			padding: 2rem;
		}
		.wrap {
			.saved-drawer {
				a.search-axis-wrap {
					.inner {
						display: inline;
						padding-left: 0.5rem;
					}
					.inner:first-of-type {
						padding-left: 0;
					}
				}
			}
		}
	}

	/* TOP */
	.map-link {
		padding: 3.6rem 20rem 1rem;

		> h5 {
			position: absolute;
			top: 0;
			left: 0;
		}
		> p {
			right: 20rem;
			bottom: 7rem;
			font-size: var(--font-body);
		}
	}
	.area-link {
		.area-link-next-btn {
			display: none;
		}

		.wrap {
			padding: 1rem 0;
			overflow-x: visible;

			.container {
				flex: 0 0 calc((100% - 3rem) / 4);

				.img-area {
					height: 9.4rem;

					.text-bg {
						height: 9.4rem;
						background-size: 90% 90%;

						> h5 {
							font-size: var(--font-body-lg);
						}
					}
				}
				> p{
					font-size: calc(var(--font-body) - 2pt);
				}
				> button {
					font-size: var(--font-body);
				}
			}
		}
	}
	.search-navigation {
		.search-link .do-btn > span {
			font-size: var(--font-body);
			line-height: 1.5;
		}
	}
	.search-future {
		.container {
			display: flex;
			justify-content: center;
			gap: 2px;

			a.img-btn {
				display: flex;
				flex-direction: column;
				justify-content: center;
				width: calc((100% - 20px) / 5);
				height: 7vw;

				> p {
					margin-top: 0;
					padding-top: 0.25rem;
					padding-bottom: 0.5rem;
					font-size: var(--font-body-lg);
				}
				> span {
					padding-bottom: 0.25rem;
					font-size: var(--font-body);
				}
			}
			a.img-btn:hover {
				opacity: 1;
			}
			/*
			.button-7 > span {
				display: block;
				width: 9.5em;
				margin: 0 auto;
				line-height: var(--line-height-body);
			}
			*/
		}
	}
	.new-property {
		/*margin-bottom: 3rem;*/
		padding-bottom: 0;
		border-bottom: 1px solid var(--border-base);

		.floor-wrap {
			padding: 0;
		}

		.np-carousel {
			border: 0;
		}
	}
	.reco-property-cell {
    	.cell-inner {
			width: 22%;
			min-width: 22%;
			max-width: 22%;
			flex: 0 0 22%;

			.clickable-area {
				.reco-img {
					width: 100%;
					height: 14rem;
				}
			}
		}
	}
	.ranking {
		.wrap {
			display: flex;
			gap: 4vw;
		}
		div.container {
			width: calc(100% / 3);
			padding: 0;
		}
	}
	.property-news {
		padding: 2rem 0;

		.news-list {
			max-height: 75vh;

			.heading {
				.building-head {
					flex: 1;
					min-width: 0;
					margin-left: calc(10rem + 4%);
				}
				.rent-head {
					flex: none;
					white-space: nowrap;
				}
			}
			.news-item {
				a.item-wrap {
					.img-area,
					.floor-plan-area {
						flex: none;
						width: 5rem;
						height: 5rem;
					}
					.building-disp {
						flex: 1;
						min-width: 0;
					}
					.rate-disp {
						flex: none;
						white-space: nowrap;
					}
				}
			}
		}
	}
	.our-strengths {
		.strengths-wrap {
			.container {
				.strengths-inner {
					padding: 0 1rem 0 2rem;
				}
				> h4 {
					padding-left: 2rem;
				}
				.strengths-icon-area {
                	width: 14%;

					> svg {
						width: 4rem;
						height: 4rem;
					}
				}
				.strengths-text-area {
					width: 84%;
				}
			}
		}
	}
	.recent-history,
	.recommended-history {
		.reco-property-cell {
			justify-content: flex-start;
			.cell-inner {
				width: 100%;
				min-width: 100%;
				max-width: 100%;
				flex: 0 0 100%;
				.clickable-area {
					.reco-img {
						width: 100%;
						height: 14rem;
					}
				}
			}
		}
	}
	/* 物件詳細ページ: おすすめ・最近見たのカード幅を親いっぱいに（4枚表示で各25%） */
	#detail .recommended-history .reco-property-cell .cell-inner,
	#detail .recent-history .reco-property-cell .cell-inner {
		width: 100% !important;
		min-width: 100% !important;
		max-width: 100% !important;
		flex: 0 0 100% !important;
	}
	/* 物件詳細ページの建物カード（おすすめ物件・最近見た物件）各画像に透かし */
	#detail .recommended-history .reco-property-cell .cell-inner .reco-img,
	#detail .recent-history .reco-property-cell .cell-inner .reco-img {
		position: relative;
		&::after {
			content: 'FIRST RENT';
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			font-size: 14px;
			font-weight: bold;
			color: rgba(150, 150, 150, 0.6);
			text-shadow: 0 0 4px rgba(0, 0, 0, 0.5);
			pointer-events: none;
			z-index: 10;
			white-space: nowrap;
		}
	}
	.faq-area {
		.wrap {
			width: auto;
			padding: 2rem;

			.inner {
				> p:nth-of-type(2) {
					/*width: 100%;*/
					height: 100%;
				}
			}
		}
	}

	/* エリア・路線 検索 */
	.input-list.train {
		.container {
			display: grid;
			grid-template-columns: repeat(2, 1fr);

			.inner {
				.btn-area,
				.station-list-wrap {
					display: none;
				}
			}
		}
	}
	/* 検索 上部 */
	.search-base-inputs {
		display: grid;
		grid-template-columns: 1fr 4rem 1fr;
		align-items: center;
		padding: 0 2rem 1rem;

		/* 路線未選択時: 左パネルを全幅表示 */
		.base-inputs-left.no-selection {
			grid-column: 1 / -1;
			height: auto;

			.recommend-condition {
				.wrap {
					display: flex;
					gap: 0.5rem 1rem;
				}
			}
			.input-list-primary.train {
				max-height: 24rem;
				overflow-y: auto;
				border: 1px solid var(--border-base);
				border-radius: var(--radius-xsmall);
				padding: 0.5rem;
			}
			.input-list-primary.train .innner {
				grid-template-columns: repeat(2, 1fr);
			}
		}

		.base-inputs-left {
			overflow: hidden;
			.recommend-condition {
				padding: 0;

				.wrap {
					gap: 0.2rem 4rem;
					padding: 0.5rem;
				}
			}
			.input-list-primary {

				.innner {
					display: grid;
					padding: 0.5rem;
				}
			}
			.input-list-primary.area {
				.all-input {
					width: 100%;
					padding: 0.5rem;
					border-bottom: 1px dotted var(--border-base);
				}
				.innner {
					grid-template-columns: repeat(2, 1fr); /* 2列 */
					grid-auto-flow: row;
					gap: 0.2rem;

					> div {
						display: flex;
						align-items: center;
						
						> p {
							width: 1.2em;
						}
					}
				}
			}
			.input-list-primary.train {
				margin-top: 1rem;
				overflow-y: auto;

				.route-ttl {
					width: 100%;
					padding: 0.5rem;
					color: var(--decorative-base);
					border-bottom: 1px dotted var(--border-base);
				}
				.route-ttl:first-of-type {
					padding-top: 0;
				}
				.innner {
					display: grid;
					grid-template-columns: repeat(2, 1fr);
					gap: 0.2rem;
				}
				.line-count {
					display: none;
				}
			}
		}
		.input-list-secondary.train {
			.station-count,
			.station-wrap label p > span:last-child,
			.station-list-wrap label p > span:last-child {
				display: none;
			}
		}
		.svg-arrow {
			padding: 0 1rem;
			> svg {
				width: 2rem;
				height: 2rem;
				fill: var(--neutral-black);
			}
		}
		.base-inputs-right {
			height: 18rem;
			padding: 0.5rem;
			overflow-y: scroll;
			border: 1px solid var(--border-base);
			
			.area-warp {
				padding-top: 1.5rem;
				border-top: 1px solid var(--border-base);

				> h5 {
					padding: 0.5rem 0;
					border-bottom: 1px dotted var(--border-base);
				}
			}
			.area-warp.first-visible {
				padding-top: 0;
				border-top: 0;
			}
			ul.ward-wrap {
				display: grid;
				grid-template-columns: 1fr 1fr;
				gap: 0.2rem 4rem;
				
				> li {
					display: flex;
					align-items: center;
					justify-content: space-between;

					> label {
						display: flex;
						align-items: center;
					}
				}
			}
		}
	}
	.selected-ward {
		display: grid;
		grid-template-columns: 80% 20%;
		grid-template-rows: auto auto;
		padding: 1rem 2rem;

		> h4 {
			grid-column-start: 1;
			grid-column-end: -1;
			grid-row-start: 1;
		}
		.inner {
			grid-column-start: 1;
			grid-row-start: 2;

			> p {
				opacity: 1;
				visibility: visible;
			}
		}
		.button-wrap {
			grid-column-start: 2;
			grid-row-start: 2;
			padding-left: 1rem;

			display: flex;
			flex-direction: column;
			justify-content: flex-end;

			.do-search-btn {
				margin-top: auto;
			}
		}
	}
	/* 絞り込み */
	.from-area {
    	.container {

			.item-title {
				width: 16%;
				padding-top: 1rem;
				color: var(--text-primary);
				background-color: var(--surface-light-2);
				border-top: 1px dotted var(--border-base);
				border-bottom: 0;
			}
			.item-field {
				color: var(--text-primary);
				border-top: 1px dotted var(--border-base);

				.pc-checkbox {
					display: grid;
					grid-template-columns: repeat(4, 1fr);
					line-height: 2.4;
				}
				.select-container {
					display: flex;
					align-items: center;

					> select {
						min-width: 8rem;
					}
					> span {
						padding: 0 0.5rem;
					}
				}
			}
			.item-field.first-item {
				border-top: 0;

				.select-container {
					width: 36%;
				}
				.second-lines {
					width: 60%;
					display: flex;
					flex-direction: row;
					flex-wrap: nowrap;
					justify-content: flex-start;
					align-items: stretch;
					gap: 1rem;
				}
			}

			#conditions-visible-list {
				display: flex;
				flex-wrap: wrap;
				border: 1px solid var(--border-base);

				.item-field {
					width: 84%;
					
					ul.checkbox-area.second-lines {
						grid-template-columns: repeat(4, 1fr);
					}
				}
				.item-title:nth-of-type(1) {
					border-top: 0;
				}

			}
			#conditions-hide-list {
				margin-top: 1rem;
				display: block;
				border: 1px solid var(--border-base);

				.category-block {
					display: flex;
					flex-wrap: wrap;
					width: 100%;

					.item-title {
						width: 16%;
					}
					.item-field {
						width: 84%;

						ul.checkbox-area.second-lines {
							display: grid;
							grid-template-columns: repeat(3, 1fr);
						}
					}
				}
				.category-block:first-child {
					.item-title, .item-field {
						border-top: 0;
					}
				}
			}
		}
	}
	.search-content {
		.do-search-btn-area {
			display: flex;
			justify-content: flex-end;
			padding: 2rem;
			background-color: var(--surface-light-2);

			button.do-search-btn {
				width: auto;
				min-width: 20%;
				padding: 0.4rem 2rem;
			}
		}
	}

	/*.検索結果一覧 */
	#sticky-filter {display: none;}
	#result-list {
		.pc-only-wrap {display: flex;}

		.applied-conditions {
			padding: 0 2rem;

			.container {
				width: 18rem;
				max-height: 9999px;
				opacity: 1;
				font-size: var(--font-small);
				background-color: var(--surface-light-1);

				.item-title {
					padding: 0.5rem;
					background-color: var(--surface-light-2);
					border-top: 1px dotted var(--border-base);
				}
				.item-field.first-item {
					flex-direction: column;
					border: 0;
				}
				.item-field {
					padding: 0.5rem;
					padding-bottom: 1.5rem;

					.select-container {
						display: flex;
						justify-content: start;
						padding-bottom: 1rem;
						width: 100%;
						margin: 0 auto;

						> select {
							width: 40%;
						}
						> span {
							margin: 0 0.5rem;
							text-align: center;
							/*transform: rotate(90deg);*/
						}
					}
					.pc-checkbox,
					.checkbox-area {
						display: grid;
						grid-template-columns: repeat(2, 1fr);
					}
					.checkbox-area.pc-one-column {
						grid-template-columns: repeat(1, 1fr);

					}
					.checkbox-area.first-row-single-column {
						width: 100%;
						> :first-child {
							grid-column: 1 / -1;
						}
					}
					.checkbox-area.last-row-single-column {
						> :last-child {
							grid-column: 1 / -1;
						}
					}
				}
			}
			.button-wrap {
				margin-top: 1rem;
			}
		}
		.main-contents {
			padding-right: 2rem;

			.result-condition-head {
				margin: 0;
				padding-bottom: 1rem;

				> h5 {
					display: none;
				}
				.result-condition-wrap {

					.container {

						.inner {
							> div {
								padding: 0.5rem;

								> span {
									margin-right: 0.5rem;
								}
							}
						}
					}
				}
			}
			.list-header {
				.container {
					padding: 0 0 0.5rem;
				}
			}
			.property-wrapper-sell {
				margin-bottom: 2rem;
				padding-bottom: 0;
				border-left: 1px solid var(--border-base);
				border-right: 1px solid var(--border-base);
				box-shadow: var(--shadow-reco-cell);

				> h3,
				> .building-header-link > h3 {
					box-shadow: none;
					> .building-header-name {
						padding-left: 0;
						font-size: var(--font-body);
						text-align: center;
					}
				}
				.property-area {
					gap: 1rem;

					.property-img-area {
						width: 9rem;
						height: 9rem;
					}
					.inner {
						> div {
							gap: 0.4rem;

							> p {
								height: auto;
							}
							.fee-free {
								font-size: var(--font-body);
							}
						}
					}
				}
				.terms-head {
					display: flex;
					gap: 3.5rem;
					padding: 0.2rem 0;
					padding-left: 11rem;
					font-size: var(--font-small);
					color: var(--text-secondary);
					background-color: var(--surface-light-2);
					/*border-bottom: 1px solid var(--border-base);*/

					> span {
						display: inline-block;
						text-align: center;
					}
					> span:nth-of-type(1) {
						width: 7rem;
					}
					> span:nth-of-type(2) {
						width: 7rem;
					}
					> span:nth-of-type(3) {
						width: 7rem;
					}
					> span:nth-of-type(4) {
						width: 3rem;
					}
				}
				.result-list-sell {
					padding-bottom: 1rem;

					.main-area {
						padding-left: 2.5rem;

						.img-block {
							margin-right: 2.5rem;
						}
					}
					.terms {
						.item-wrap {
							display: flex;
							align-items: center;
							gap: 3.5rem;

							.terms-rent {
								display: block;
							}
							> div {
								text-align: center;
							}
							.terms-rent {
								width: 7rem;
								> p:last-of-type {
									font-size: var(--font-small);
								}
							}
							.terms-property-info {
								display: flex;
								align-items: center;
								gap: 3.5rem;
								text-align: center;
							}
							.initial-fees-area {
								width: 7rem;
								flex-direction: column;
								gap: 0.25rem;

								> p {
									display: flex;
									align-items: center;
									gap: 0.5rem;
									white-space: nowrap;

									> span:first-of-type {
										display: inline-block;
										width: 1.2rem;
										height: 1.2rem;
										line-height: 1.2rem;
										text-align: center;
									}
								}
								> p:first-of-type {
									margin-bottom: 0;
								}
								p.default {
									color: var(--text-primary);

									> span:first-of-type {
										border: 1px solid var(--neutral-black);
									}
								}
								p.free {
									color: var(--text-red);

									> span:first-of-type {
										border: 1px solid var(--text-red);
									}
								}
								p.none {
									display: none;
								}
							}
							.room-size {
								width: 7rem;
								white-space: nowrap;
								color: var(--text-primary);
							}
							.room-num {
								width: 3rem;
								color: var(--text-primary);
							}
						}

					}
					.free-inquiry-area {
						bottom: 0;
						right: 0;
						
						.free-inquiry-btn {
							padding: 0 1rem;
						}
						.fee-free {
							.icon {
								display: none;
							}
						}
					}
				}
			.show-all-btn:not(.show-all-btn-pill) {
				box-shadow: none;
			}
		}
	}
	.result-condition-head.content-container {
		margin: 0 auto 2rem;
			
			> h5 {
				display: none;
			}
		}
	}

	/* 物件詳細 */
	#detail {
		h2 {
			padding: 0.5rem 2rem;
		}
		.detail-ttl-info-area {
			padding: 0 2rem 1rem;
		}

		/* --- 2カラムレイアウト（左メイン72% + 右サイドバー28%） --- */
		.detail-two-column {
			display: flex;
			gap: 1.2rem;
			align-items: flex-start;
		}
		.detail-main-column {
			width: calc(72% - 0.6rem);
			min-width: 0;
			flex-shrink: 0;
		}

		.main-area-wrap {
			display: block;

			.main-area-container {
				width: 100%;

				.main-carousel {
					.carousel-item {
						height: 24rem;
						background-size: contain;
						background-repeat: no-repeat;
						background-position: center;
					}
				}
				.toggle-btn {
					display: none;
				}
			}
			.sub-img-view-area {
				width: 100%;
				max-height: none;
				overflow: visible;
				padding-top: 0.5rem;

				.sub-carousel {
					.carousel-viewport {
						width: 100%;
						max-height: none;
						overflow-x: auto;
						overflow-y: hidden;

						.carousel-track {
							display: flex;
							flex-wrap: nowrap;

							.carousel-item {
								height: 5rem;
								flex: 0 0 6rem;
								border-right: 3px solid var(--neutral-white);
								background-size: contain;
								background-repeat: no-repeat;
								background-position: center;
								cursor: pointer;
							}
						}
					}
					> button {
						display: none;
					}
				}
			}
		}

		/* 表: 左カラム内でコンパクトに */
		.information-area {
			font-size: var(--font-small);
			th {
				padding: 0.4rem 0.6rem;
				white-space: nowrap;
			}
			td {
				padding: 0.4rem 0.6rem;
			}
		}

		.mini-reserve-cal {
			padding: 0.5rem 0;
		}
	}

	/* --- サイドバー --- */
	.detail-sidebar {
		width: calc(28% - 0.6rem);
		flex-shrink: 0;
		position: sticky;
		top: calc(3.5rem + 3rem);
		max-height: calc(100vh - 6.5rem);
		overflow-y: auto;
	}
	.sidebar-building-card {
		background: #f5f5f5;
		color: var(--dark-blue);
		border: none;
		border-radius: 15px;
		/* border-radius: var(--radius-small); */
		padding: 1.2rem 1rem;
		/* box-shadow: var(--shadow-medium); */
	}
	.sidebar-building-name {
		font-size: var(--font-body-lg);
		font-weight: 700;
		line-height: 1.3;
		margin-bottom: 0.15rem;
	}
	.sidebar-room-number {
		font-size: var(--font-small);
		color: rgba(10,33,61,0.7);
	}
	.sidebar-hr {
		border: none;
		border-top: 1px solid rgba(10,33,61,0.12);
		margin: 0.7rem 0;
	}
	.sidebar-section {
		margin-bottom: 0;
	}
	.sidebar-train {
		font-size: var(--font-caption);
		line-height: 1.6;
	}
	.sidebar-address {
		font-size: var(--font-caption);
		line-height: 1.5;
	}
	.sidebar-detail-row {
		font-size: var(--font-caption);
		line-height: 1.5;
	}
	.sidebar-rent-block {
		margin-bottom: 0.4rem;
	}
	.sidebar-rent-amount {
		font-size: 1.6rem;
		font-weight: 700;
	}
	.sidebar-rent-unit {
		font-size: var(--font-body);
		margin-left: 0.1rem;
	}
	.sidebar-kanri {
		font-size: var(--font-caption);
		color: rgba(10,33,61,0.7);
		margin-top: 0.15rem;
	}
	.sidebar-badge-row {
		display: flex;
		flex-wrap: wrap;
		gap: 0.3rem;
		margin-bottom: 0.6rem;
	}
	.sidebar-badge {
		display: inline-block;
		font-size: var(--font-caption);
		font-weight: 700;
		background: #ffe6e6;
		color: #F86E6E;
		border: none;
		padding: 0.15rem 0.5rem;
		border-radius: var(--radius-xsmall);
	}
	.sidebar-cta {
		margin-top: 0.6rem;
		display: flex;
		flex-direction: column;
		gap: 0.35rem;
	}
	.sidebar-cta-btn {
		display: block;
		text-align: center;
		font-size: var(--font-small);
		font-weight: 600;
		padding: 0.55rem 0.5rem;
		border-radius: var(--radius-btn);
		text-decoration: none;
		background: #fff;
		color: var(--dark-blue);
		border: 1px solid var(--decorative-base);
		transition: background .2s, color .2s, border-color .2s;
	}
	.sidebar-cta-btn:hover {
		background: var(--primary-light-1) !important;
		color: var(--dark-blue) !important;
		border-color: var(--decorative-base) !important;
	}
	.sidebar-cta-btn.primary {
		background: var(--neutral-white);
		color: var(--dark-blue);
		border: 2px solid var(--decorative-base);
	}
	.sidebar-cta-btn.secondary {
	}
	.sidebar-phone {
		margin-top: 0.8rem;
		border-top: 1px solid rgba(10,33,61,0.12);
		padding-top: 0.7rem;
		text-align: center;
	}
	.sidebar-phone-number {
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 0.5rem;
		text-decoration: none;
	}
	.sidebar-phone-number svg {
		width: 1rem;
		height: 1rem;
		fill: var(--dark-blue);
	}
	.sidebar-phone-number span {
		font-size: var(--font-body-xl);
		font-weight: bold;
		color: var(--dark-blue);
	}
	.sidebar-phone-meta {
		font-size: var(--font-caption);
		color: var(--dark-blue);
		margin-top: 0.3rem;
		line-height: 1.5;
	}
	.sidebar-phone-meta p {
		margin: 0;
	}
	.sidebar-phone-note {
		margin-top: 0.3rem !important;
		font-size: var(--font-ultra-small);
		color: var(--dark-blue);
		line-height: 1.4;
	}
	.sidebar-phone {
		border-top-color: rgba(10,33,61,0.12);
	}
	.sidebar-calendar {
		margin-top: 0.4rem;
		border-radius: var(--radius-xsmall);
		overflow: hidden;
	}
	.sidebar-cal-week {
		display: flex;
		border-top: 1px solid rgba(10,33,61,0.15);
		border-left: 1px solid rgba(10,33,61,0.15);
	}
	.sidebar-cal-day {
		flex: 1;
		min-width: 0;
		border-right: 1px solid rgba(10,33,61,0.15);
		border-bottom: 1px solid rgba(10,33,61,0.15);
		text-align: center;
		font-size: var(--font-ultra-small);
		cursor: pointer;
		padding: 0.15rem 0;
		background: rgba(255,255,255,0.5);
		transition: background 0.15s;
		color: var(--dark-blue);
	}
	.sidebar-cal-day:hover {
		background: rgba(10,33,61,0.08);
	}
	.sidebar-cal-day .cal-dow {
		display: block;
		background: rgba(10,33,61,0.06);
		font-size: var(--font-ultra-small);
		line-height: 1.6;
	}
	.sidebar-cal-day .cal-date {
		display: block;
		line-height: 1.6;
	}
	.sidebar-cal-day .cal-icon {
		display: block;
	}
	.sidebar-cal-day .cal-icon svg {
		width: 1rem;
		height: 1rem;
		margin: 0 auto;
		fill: var(--primary-base);
	}
	.sidebar-cal-day.saturday { color: var(--primary-light-3); }
	.sidebar-cal-day.sunday { color: var(--text-red); }
	.detail-rent-info-wrap {
		.property-info {
			.rent-area {
				.management-fee {
					color: var(--text-primary);

					> span {
						color: var(--primary-base);
					}
				}
			}
		}
		.detail-inquiry-btn {
			> div {
				> button {
					width: 8rem;
				}
			}
		}
	}
	.icon-area {
		grid-template-columns: repeat(8, 1fr); 
		gap: 1rem;
		padding: 0.5rem 0.5rem 1rem;
	}
	table.information-area {
		margin: 0 auto 1rem;
		border: 1px solid var(--border-base);

		th {
			color: var(--text-primary);
		}
		td {
			> button {
				width: 10rem;
			}
		}

	}
	.comment-box,
	.review-box {
		padding: 1rem;

		> h4 {
			border-bottom: 1px solid var(--decorative-base);
		}
	}
	.comment-box {

	}
	.review-box {
		> h4 {
			display: flex;
			align-items: baseline;
			justify-content: space-between;
		}
	}
	.reserve-inquiry-btn-area {
		padding: 1rem 2rem 0.5rem;
	}
	.google-map-area {
		.inner {
			width: 100%;
			aspect-ratio: 16 / 9;
		}
	}
	.other-property {
		padding-bottom: 0;

		.open-rist-wrap {
			background-color: var(--neutral-white);

			.result-list-sell {
				padding-bottom: 1rem;

				.free-inquiry-area {
					position: absolute;
					bottom: 0;
					right: 0;

					.free-inquiry-btn {
						padding: 0 1rem;
					}
				}
			}
		}
	}
	.other-property.is-open {
		padding-bottom: 2rem;
	}
	.recent-history,
	.recommended-history {
		.carousel {
			width: 100%;
			margin: 0 auto;
		}
		.carousel-viewport .carousel-track .carousel-item {
			flex: 0 0 25%;
			min-width: 25%;
		}
		.carousel-viewport .carousel-track .carousel-item .reco-property-cell {
			width: 100%;
		}
	}
	/* 物件詳細ページの建物カード（おすすめ・最近見た）各画像に透かし（カードごと） */
	#detail .recommended-history .reco-property-cell .cell-inner .clickable-area .reco-img,
	#detail .recent-history .reco-property-cell .cell-inner .clickable-area .reco-img {
		position: relative;
		overflow: visible;
		&::after {
			content: 'FIRST RENT';
			position: absolute;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			font-size: 10px;
			font-weight: bold;
			color: rgba(150, 150, 150, 0.6);
			text-shadow: 0 0 3px rgba(0, 0, 0, 0.5);
			pointer-events: none;
			z-index: 10;
			white-space: nowrap;
		}
	}
	.reserve-inquiry-foot-btn {
		padding: 1rem 0;

		.business-info-area {
			display: flex;
			align-items: center;
			justify-content: center;
			gap: 1rem;
			color: var(--text-inverse);

			.business-hours {
				text-align: left;
			}
		}
	}
	

	/* お気に入り */
	#favorites {
		.all-inquiry-btn {
			a.do-contact {
				width: 50%;
				margin: 0 auto;
			}
		}
	}

	/* お気に入り - 観覧履歴 */
	#favorites, #history {
		/*padding-left: 12rem;
		padding-right: 12rem;*/

		.content-container {
			padding: 0;
		}
		.property-wrapper-sell {
			> h3 > .building-header-name,
			> .building-header-link > h3 > .building-header-name {
				font-size: var(--font-body);
			}
			.result-list-sell {
				padding-bottom: 1rem;

				.free-inquiry-area {
					position: absolute;
					bottom: 0;
					right: 0;

					.free-inquiry-btn {
						padding: 0 1rem;
					}
				}
			}
		}
	}

	/* お問い合わせ */
	.do-terms-area {
		> p {
			width: 100%;
		}
	}
	.btn-area {
		gap: 4rem;
	}
	#contact,
	#contact-conf {
		.property-area {
			.carousel {
				.property-wrapper-sell {
					width: 100%;
					> h3 {
						font-size: var(--font-body);
					}
				}
				.carousel-item {
					width: auto;
				}
			}
		}
	}

	/*.内見のご予約 */
	.preferred-display {
		width: 20rem;
	}

	#contact,
	#contact-conf,
	#contact-complete,
	#reserve,
	#reserve-conf,
	#waitlist,
	#waitlist-conf {
		.breadcrumbs {
			padding-left: 0;
		}
	}

	/* 利用規約 */
	#terms {
		.breadcrumbs {
			padding-left: 0;
		}
		p {
			margin: 1rem 0 3rem;
			padding: 1rem 0 2rem;
		}
	}
}
}
/* ========================================
   アプリ固有スタイル（既存から保持）
   ======================================== */
/* 00_index 値下げ物件速報（local_20260204準拠） */
.property-news .news-list {
	min-height: 5rem;
	max-height: 50vh;
	height: auto;
}
.property-news .news-list .heading {
	display: flex;
	gap: 2%;
	width: 100%;
}
.property-news .news-list .heading .rent-head {
	white-space: nowrap;
	text-align: right;
}
.property-news .news-item a.item-wrap {
	display: flex;
	align-items: center;
	gap: 2%;
	padding: 0;
	color: var(--text-primary);
	text-decoration: none;
	font-size: var(--font-small);
	border-bottom: 1px dotted var(--border-base);
	transition: background-color 0.15s ease;
}
.property-news .news-item a.item-wrap:hover {
	background-color: var(--surface-light-1);
}
.property-news .news-item a.item-wrap .img-area,
.property-news .news-item a.item-wrap .floor-plan-area {
	width: 4rem;
	height: 4rem;
	background-position: center center;
	background-size: contain;
	border-radius: 4px;
	flex-shrink: 0;
}
.property-news .news-item a.item-wrap .building-disp {
	flex: 1;
	min-width: 0;
}
.property-news .news-item a.item-wrap .building-disp .list-icon-area {
	display: flex;
}
.property-news .news-item a.item-wrap .building-disp > p {
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.property-news .news-item a.item-wrap .arrival-icon,
.property-news .news-item a.item-wrap .applied-icon {
	display: none;
	margin-right: 0.2rem;
	padding: 0 0.2rem;
	color: var(--text-inverse);
	font-size: var(--font-caption);
	border-radius: var(--radius-xsmall);
}
.property-news .news-item a.item-wrap .arrival-icon { background-color: var(--text-red); }
.property-news .news-item a.item-wrap .applied-icon { background-color: var(--accent-base); }
.property-news .news-item a.item-wrap .arrival-icon.active,
.property-news .news-item a.item-wrap .applied-icon.active {
	display: inline-block;
}
.property-news .news-item a.item-wrap .rate-disp .old-rent-disp,
.property-news .news-item a.item-wrap .rate-disp .new-rent-disp,
.property-news .news-item a.item-wrap .rate-disp .price-rate-disp {
	width: 100%;
}
.property-news .news-item a.item-wrap .rate-disp .new-rent-disp,
.property-news .news-item a.item-wrap .rate-disp .price-rate-disp {
	text-align: right;
}
.property-news .news-item a.item-wrap .rate-disp .new-rent-disp {
	color: var(--text-red);
}
.property-news .news-item a.item-wrap .rate-disp .price-rate-disp {
	color: var(--decorative-base);
}

@media screen and (min-width: 768px) {
	.property-news {
		padding: 2rem 0;
	}
	.property-news .news-list {
		max-height: 75vh;
	}
	.property-news .news-list .heading .building-head {
		flex: 1;
		min-width: 0;
	}
	.property-news .news-item a.item-wrap .img-area,
	.property-news .news-item a.item-wrap .floor-plan-area {
		width: 5rem;
		height: 5rem;
	}
	.property-news .news-item a.item-wrap .building-disp {
		flex: 1;
		min-width: 0;
	}
	.property-news .news-item a.item-wrap .rate-disp {
		flex: none;
		white-space: nowrap;
		text-align: right;
	}
}

.faq-area .faq-answer-toggle {
	border: none;
	background: transparent;
	padding: 0;
	cursor: pointer;
	font-weight: 600;
	color: var(--decorative-base);
}
.faq-area .faq-question-row {
	display: grid;
	grid-template-columns: 4rem 1fr auto;
	align-items: center;
	gap: 0.5rem;
}
.faq-area .faq-question-row .faq-answer-toggle {
	justify-self: end;
}
.faq-area .faq-answer-body {
	margin-top: 1rem;
}
.faq-area .faq-answer-spacer {
	display: block;
	min-height: 1.5rem;
}
.faq-area {
	.wrap {
		width: 100%;
		box-sizing: border-box;
		margin-top: 1rem;
		padding: 1rem;
		background-color: var(--surface-light-2);

		.inner {
			display: grid;
			grid-template-columns: 4rem 1fr;
			align-items: flex-start;

			.question,
			.answer {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 2em;
				height: 2em;
				font-size: 1.5rem;
				font-weight: bold;
				border-radius: 9999px;
			}
			> p:nth-of-type(2) {
				display: flex;
				align-items: center;
			}
			.question {
				color: var(--primary-base);
				background-color: var(--neutral-white);
				border: 1px solid var(--decorative-base);
			}
			.answer {
				color: var(--decorative-base);
				background-color: var(--primary-light-1);
				border: 1px solid var(--primary-base);
			}
		}
		.inner:last-of-type {
			margin-top: 1rem;
		}
	}
	.wrap:first-of-type {
		margin-top: 0;
	}
}
.faq-area .wrap .inner.faq-question-row {
	display: flex;
	align-items: center;
	gap: 0.5rem;
}
.faq-area .wrap .inner.faq-question-row > p:nth-of-type(2) {
	flex: 1 1 auto;
	min-width: 0;
}
.faq-area .wrap .inner.faq-question-row .faq-answer-toggle {
	margin-left: auto;
	white-space: nowrap;
	font-size: 0.85rem;
	display: inline-flex;
	align-items: center;
	gap: 0.35rem;
}
.faq-area .wrap .inner.faq-question-row .faq-answer-toggle .answer {
	width: 1.6em;
	height: 1.6em;
	font-size: 0.85rem;
}
.faq-area .faq-answer-body .faq-answer-row {
	display: grid;
	grid-template-columns: 4rem 1fr;
	align-items: flex-start;
	gap: 0.5rem;
}
.faq-area .faq-answer-body .faq-answer-content {
	display: block;
}
.faq-area .faq-answer-body .answer {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 2em;
	height: 2em;
	border-radius: 9999px;
	border: 1px solid var(--primary-base);
	background-color: var(--primary-light-1);
	color: var(--decorative-base);
	font-size: 1.5rem;
	font-weight: bold;
}

/* エリア名・路線名・駅名の後の物件数 */
.ward-count,
.station-count,
.line-count,
.input-list label > span:last-child:not(.line-name-only),
.input-list .inner label > span:last-child:not(.line-name-only),
.input-list-primary.area .innner > div label > span:last-child,
.input-list-primary.area .innner div label span:last-child,
.input-list.train .inner label > span:last-child:not(.line-name-only),
.input-list-primary.train .innner > div label > span.line-count,
.station-wrap label p > span:last-child,
.station-list-wrap label p > span:last-child {
	color: var(--decorative-base) !important;
	font-size: 0.85em !important; /* 名前より約2pt小さく */
}

.save-condition-wrap {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	gap: 0.5rem;
	margin-bottom: 1rem;
	padding: 0 1rem;
	position: relative;

	.save-condition-btn {
		display: flex;
		align-items: center;
		gap: 0.2rem;
		padding: 0.2rem 0.5rem;
		color: var(--primary-base);
		font-size: var(--font-small);
		background-color: var(--primary-light-1);
		border-left: 1px solid var(--primary-base);
		border-right: 1px solid var(--primary-base);
		border-bottom: 1px solid var(--primary-base);
		border-bottom-left-radius: var(--radius-xsmall);
		border-bottom-right-radius: var(--radius-xsmall);

		> svg {
			width: 1em;
			height: 1em;
			fill: var(--primary-base);
		}
	}

	.save-tooltip {
		position: absolute;
		right: 1rem;
		top: 100%;
		margin-top: 0.3rem;
		padding: 0.4rem 0.8rem;
		font-size: var(--font-small);
		color: #fff;
		background-color: #333;
		border-radius: var(--radius-small);
		white-space: nowrap;
		z-index: 100;
		animation: fadeInOut 2s ease-in-out;
	}

	.save-tooltip::before {
		content: '';
		position: absolute;
		bottom: 100%;
		right: 1rem;
		border: 6px solid transparent;
		border-bottom-color: #333;
	}
}

@keyframes fadeInOut {
	0% { opacity: 0; transform: translateY(-5px); }
	15% { opacity: 1; transform: translateY(0); }
	85% { opacity: 1; transform: translateY(0); }
	100% { opacity: 0; transform: translateY(-5px); }
}

.save-modal-overlay {
	position: fixed;
	inset: 0;
	background-color: rgba(0, 0, 0, 0.5);
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 1000;
}

.save-modal {
	background-color: #fff;
	border-radius: var(--radius-medium);
	width: 90%;
	max-width: 400px;
	box-shadow: 0 4px 20px rgba(0, 0, 0, 0.2);
	animation: modalFadeIn 0.2s ease-out;
}

@keyframes modalFadeIn {
	from {
		opacity: 0;
		transform: scale(0.95);
	}
	to {
		opacity: 1;
		transform: scale(1);
	}
}

.save-modal-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 1rem 1.2rem;
	border-bottom: 1px solid var(--border-base);

	h4 {
		margin: 0;
		font-size: var(--font-medium);
		font-weight: 600;
	}

	.save-modal-close {
		background: none;
		border: none;
		font-size: 1.5rem;
		color: var(--neutral-gray);
		cursor: pointer;
		line-height: 1;
		padding: 0;

		&:hover {
			color: var(--neutral-black);
		}
	}
}

.save-modal-body {
	padding: 1.2rem;

	label {
		display: block;
		margin-bottom: 0.5rem;
		font-size: var(--font-small);
		color: var(--neutral-gray);
	}

	input[type="text"] {
		width: 100%;
		padding: 0.7rem 0.8rem;
		font-size: var(--font-base);
		border: 1px solid var(--border-base);
		border-radius: var(--radius-small);
		box-sizing: border-box;

		&:focus {
			outline: none;
			border-color: var(--primary-base);
			box-shadow: 0 0 0 2px rgba(var(--primary-base-rgb, 0, 123, 255), 0.15);
		}
	}
}

.save-modal-footer {
	display: flex;
	justify-content: flex-end;
	gap: 0.8rem;
	padding: 1rem 1.2rem;
	border-top: 1px solid var(--border-base);

	button {
		padding: 0.6rem 1.2rem;
		font-size: var(--font-small);
		border-radius: var(--radius-small);
		cursor: pointer;
		transition: background-color 0.15s;
	}

	.save-modal-cancel {
		background-color: #fff;
		border: 1px solid var(--border-base);
		color: var(--neutral-gray);

		&:hover {
			background-color: var(--neutral-light);
		}
	}

	.save-modal-confirm {
		background-color: var(--neutral-white);
		border: 2px solid var(--decorative-base);
		color: var(--primary-base);

		&:hover {
			background-color: var(--primary-light-1);
			border-color: var(--decorative-base);
			color: var(--primary-base);
		}
	}
}

/* インライン区選択セクション */
.inline-ward-selector,
.inline-line-selector {
	margin: 0.5rem 0;
	background-color: var(--neutral-white);
	border: 1px solid var(--border-base);
	border-radius: var(--radius-small);
	box-shadow: var(--shadow-soft);

	.ward-selector-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0.8rem 1rem;
		background-color: var(--surface-light-1);
		border-bottom: 1px solid var(--border-base);
		border-radius: var(--radius-small) var(--radius-small) 0 0;

		h4 {
			margin: 0;
			font-size: var(--font-body);
			font-weight: 600;
		}

		.ward-selector-close {
			background: none;
			border: none;
			font-size: 1.5rem;
			color: var(--neutral-gray);
			cursor: pointer;
			line-height: 1;
			padding: 0;

			&:hover {
				color: var(--neutral-black);
			}
		}
	}

	.search-base-inputs {
		display: flex;
		gap: 0.5rem;
		padding: 0.5rem;

		.base-inputs-left {
			flex: 0 0 48%;
			max-height: 28rem;
			overflow-y: auto;
			overflow-x: hidden;
			border: 1px solid var(--border-base);
			border-radius: var(--radius-xsmall);
		}

		.svg-arrow {
			display: flex;
			align-items: center;
			justify-content: center;
			flex-shrink: 0;
			padding: 0 0.3rem;

			svg {
				width: 1.5rem;
				height: 1.5rem;
				fill: var(--neutral-gray);
			}
		}

		.base-inputs-right {
			flex: 1;
			min-width: 0;
			max-height: 28rem;
			overflow-y: auto;
			overflow-x: hidden;
			border: 1px solid var(--border-base);
			border-radius: var(--radius-xsmall);
			padding: 0.3rem;
			position: relative;

			.close-right-column {
				position: sticky;
				top: 0;
				float: right;
				background: none;
				border: none;
				font-size: 1.25rem;
				color: var(--neutral-gray);
				cursor: pointer;
				line-height: 1;
				padding: 0;
				z-index: 10;

				&:hover {
					color: var(--neutral-black);
				}
			}

			.no-selection-msg {
				display: flex;
				align-items: center;
				justify-content: center;
				min-height: 5rem;
				color: var(--text-secondary);
				font-size: var(--font-small);
				text-align: center;

				&::before {
					content: "← ";
				}
			}

			.input-list-secondary {
				.input-list {
					.area-warp {
						margin-bottom: 0.3rem;

						h5 {
							display: flex;
							justify-content: space-between;
							align-items: center;
							padding: 0.3rem 0.5rem;
							background-color: var(--surface-light-1);
							border-radius: var(--radius-xsmall);
							margin-bottom: 0;
							gap: 0.5rem;

							label {
								display: flex;
								align-items: center;
								gap: 0.3rem;
								cursor: pointer;
								font-weight: normal;
								font-size: var(--font-small);
								flex: 1;

							input {
								transform: var(--checkbox-normal);
							}
						}

						.num-disp {
							font-size: var(--font-caption);
							color: var(--decorative-base);
							flex-shrink: 0;
						}
					}

					.container {
						padding: 0;
						margin: 0;
						/* Override result-condition-wrap styles */
							max-height: none;
							overflow: visible;
							opacity: 1;
							position: static;
						}

						.container .inner {
							padding: 0;
							margin: 0;

							.ward-wrap {
								display: grid;
								grid-template-columns: repeat(3, 1fr);
								grid-auto-flow: row;
								gap: 0.1rem 0.3rem;
								list-style: none;
								padding: 0;
								margin: 0;

								.town-wrap {
									display: flex;
									align-items: center;

									label {
										display: flex;
										align-items: center;
										gap: 0.2rem;
										cursor: pointer;
										font-size: var(--font-small);
										white-space: nowrap;

										input {
											transform: var(--checkbox-normal);
											flex-shrink: 0;
										}

										.town-count {
											font-size: var(--font-caption);
											color: var(--text-secondary);
										}
									}
								}
							}
						}
					}
				}
			}
		}
	}

	.input-list-primary.area {
		padding: 0.5rem;

		.all-input {
			padding: 0.5rem 0;
			border-bottom: 1px solid var(--border-base);
			margin-bottom: 0.5rem;

			label {
				display: flex;
				align-items: center;
				gap: 0.5rem;
				font-weight: 600;
				cursor: pointer;

				input {
					transform: var(--checkbox-normal);
				}
			}
		}

		.innner {
			display: grid;
			grid-template-columns: repeat(2, 1fr);
			grid-auto-flow: row;
			gap: 0.3rem 0.8rem;

			> div {
				label {
					display: flex;
					align-items: center;
					gap: 0.3rem;
					font-size: var(--font-small);
					cursor: pointer;
					white-space: nowrap;

			input {
				transform: var(--checkbox-normal);
				flex-shrink: 0;
			}

			span:last-child {
				color: var(--decorative-base) !important;
				font-size: 0.85em; /* エリア名より約2pt小さく */
			}
			}
		}
	}
}

.ward-selector-footer {
		padding: 0.8rem 1rem;
		border-top: 1px solid var(--border-base);
		display: flex;
		justify-content: flex-end;

		.ward-selector-search {
			display: block;
			width: 25%;
			min-width: 12rem;
			padding: 1.2rem 1rem;
			font-size: var(--font-body);
			font-weight: 600;
			color: var(--primary-base);
			background-color: var(--neutral-white);
			border: 2px solid var(--decorative-base);
			border-radius: var(--radius-small);
			cursor: pointer;
			transition: background-color 0.15s;
			display: inline-flex;
			align-items: center;
			justify-content: center;
			gap: 0.4rem;
			white-space: nowrap;

			&:hover {
				background-color: var(--primary-light-1);
			}
		}
	}

	/* 2列表示 */
	.base-inputs-left .input-list-primary.area .innner {
		display: grid !important;
		grid-template-columns: repeat(2, 1fr) !important;
		grid-template-rows: auto !important;
		grid-auto-flow: row !important;
		/* gap: 0.2rem 0.5rem !important; */
		margin-left: 0.2rem !important;
	}

	/* スマホ用: 左右カラムを上下に変更 */
	@media screen and (max-width: 767px) {
		.search-base-inputs {
			flex-direction: column;

			.base-inputs-left {
				flex: none;
				width: 100%;
				max-height: 12rem;
				overflow-y: auto;
			}

			.svg-arrow {
				transform: rotate(90deg);
				padding: 0.3rem 0;
				align-self: center;
			}

			.base-inputs-right {
				flex: none;
				width: 100%;
				min-height: 10rem;
				max-height: 18rem;
				overflow-y: auto;

				.no-selection-msg::before {
					content: "↑ ";
				}
			}
		}

		/* スマホ用: 区名を2列に */
		.base-inputs-left .input-list-primary.area .innner {
			grid-template-columns: repeat(2, 1fr) !important;
		}

		/* スマホ用: 町名を2列に */
		.base-inputs-right .input-list-secondary .input-list .area-warp .container .inner .ward-wrap {
			grid-template-columns: repeat(2, 1fr) !important;
		}

		.ward-selector-footer .ward-selector-search {
			width: 50%;
			min-width: 10rem;
			max-width: 100%;
		}
	}
}

/* インライン路線選択セクション - 追加スタイル */
.inline-line-selector {
	.search-base-inputs {
		display: flex;
		gap: 0.5rem;
		padding: 0.5rem;

		.base-inputs-left {
			flex: 0 0 40%;
			max-height: 28rem;
			overflow-y: auto;
			overflow-x: hidden;
			border: 1px solid var(--border-base);
			border-radius: var(--radius-xsmall);

			.input-list-primary.train {
				padding: 0.5rem;

				.innner {
					display: flex;
					flex-direction: column;
					gap: 0.1rem;

					> div label {
						display: flex;
						align-items: center;
						gap: 0.3rem;
						font-size: var(--font-small);
						cursor: pointer;
						padding: 0.2rem 0.3rem;
						border-radius: var(--radius-xsmall);
						white-space: nowrap;
						overflow: hidden;
						text-overflow: ellipsis;

						&:hover {
							background-color: var(--surface-light-1);
						}

						input {
							transform: var(--checkbox-normal);
							flex-shrink: 0;
						}

						> span:first-of-type::before {
							content: "";
							display: inline-block;
							width: 0.3rem;
							height: 1rem;
							margin-right: 0.3rem;
							vertical-align: middle;
							border-radius: 2px;
						}

					span {
						overflow: hidden;
						text-overflow: ellipsis;
					}

					.num-disp {
						font-size: var(--font-caption);
						color: var(--decorative-base);
						flex-shrink: 0;

						&::before {
							display: none;
						}
					}
				}
			}
		}
	}

	.svg-arrow {
			display: flex;
			align-items: center;
			justify-content: center;
			flex-shrink: 0;
			padding: 0 0.3rem;

			svg {
				width: 1.5rem;
				height: 1.5rem;
				fill: var(--neutral-gray);
			}
		}

		.base-inputs-right {
			flex: 1;
			min-width: 0;
			max-height: 28rem;
			overflow-y: auto;
			overflow-x: hidden;
			border: 1px solid var(--border-base);
			border-radius: var(--radius-xsmall);
			padding: 0.5rem;

			.no-selection-msg {
				display: flex;
				align-items: center;
				justify-content: center;
				min-height: 5rem;
				color: var(--text-secondary);
				font-size: var(--font-small);
				text-align: center;

				&::before {
					content: "← ";
				}
			}

			.input-list-secondary .input-list {
				.line-warp {
					margin-bottom: 0.5rem;

					h5 {
						display: flex;
						justify-content: space-between;
						align-items: center;
						/* 左だけ詰めて路線チェックを駅リストより外側（左）に */
						padding: 0.5rem 0.5rem 0.5rem 0.2rem;
						background-color: var(--surface-light-1);
						border-radius: var(--radius-xsmall);
						margin-bottom: 0.3rem;
						font-weight: normal;

						label {
							display: flex;
							align-items: center;
							gap: 0.3rem;
							cursor: pointer;
							font-weight: normal;
							font-size: var(--font-small);

							input {
								transform: var(--checkbox-normal);
								flex-shrink: 0;
							}

						> span:first-of-type::before {
							content: "";
							display: inline-block;
							width: 0.3rem;
							height: 1rem;
							margin-right: 0.3rem;
							vertical-align: middle;
							border-radius: 2px;
						}
					}

					.num-disp {
						font-size: var(--font-caption);
						color: var(--decorative-base);
						flex-shrink: 0;

						&::before {
							display: none;
						}
					}
				}

				.container {
					/* Override result-condition-wrap styles */
						max-height: none;
						overflow: visible;
						opacity: 1;
						position: static;
						padding: 0;
						/* 左だけ広げて駅チェックを路線行より内側に */
						margin: 0.2rem 0.2rem 0.2rem 0.55rem;
					}

					.container .inner {
						.station-wrap {
							display: grid;
							grid-template-columns: 1fr;
							gap: 0.2rem 0;
							list-style: none;
							padding: 0;
							margin: 0;

							.station-item {
								label {
									display: flex;
									align-items: center;
									gap: 0.3rem;
									cursor: pointer;
									font-size: var(--font-small);
									white-space: nowrap;
									color: var(--text-primary);

									input {
										transform: var(--checkbox-normal);
										flex-shrink: 0;
									}

								span {
									color: var(--text-primary);
								}

								.num-disp {
									font-size: var(--font-caption);
									color: var(--decorative-base);
									flex-shrink: 0;
								}
							}
							}
						}
					}
				}
			}
		}
	}

	.line-selector-header {
		display: flex;
		justify-content: space-between;
		align-items: center;
		padding: 0.8rem 1rem;
		background-color: var(--surface-light-1);
		border-bottom: 1px solid var(--border-base);
		border-radius: var(--radius-small) var(--radius-small) 0 0;

		h4 {
			margin: 0;
			font-size: var(--font-body);
			font-weight: 600;
		}

		.line-selector-close {
			background: none;
			border: none;
			font-size: 1.5rem;
			color: var(--neutral-gray);
			cursor: pointer;
			line-height: 1;
			padding: 0;

			&:hover {
				color: var(--neutral-black);
			}
		}
	}

	.input-list-primary.train {
		padding: 0.5rem 1rem 1rem;

		.route-ttl {
			font-size: var(--font-small);
			font-weight: 600;
			color: var(--text-secondary);
			padding: 0.5rem 0 0.3rem;
			border-bottom: 1px solid var(--border-light);
			margin-top: 0.5rem;

			&:first-child {
				margin-top: 0;
			}
		}

		.innner {
			display: grid;
			grid-template-columns: repeat(4, minmax(6.5rem, 1fr));
			gap: 0.2rem 0.8rem;
			padding-top: 0.5rem;

			> div {
				label {
					display: flex;
					align-items: center;
					gap: 0.3rem;
					font-size: var(--font-small);
					cursor: pointer;

					&::before {
						content: "";
						width: 0.3rem;
						height: 1rem;
						border-radius: 2px;
					}

					input {
						transform: var(--checkbox-normal);
					}
				}
			}

			> div.line-name-long {
				grid-column: span 2;
			}
		}
	}

	.num-disp {
		display: none;
	}

	.line-selector-footer {
		padding: 0.8rem 1rem;
		border-top: 1px solid var(--border-base);
		display: flex;
		justify-content: flex-end;

		.search-count-number {
			display: none !important;
		}

		.line-selector-search {
			display: block;
			width: 25%;
			min-width: 12rem;
			padding: 1.2rem 1rem;
			font-size: var(--font-body);
			font-weight: 600;
			color: var(--primary-base);
			background-color: var(--neutral-white);
			border: 2px solid var(--decorative-base);
			border-radius: var(--radius-small);
			cursor: pointer;
			transition: background-color 0.15s;
			display: inline-flex;
			align-items: center;
			justify-content: center;
			gap: 0.4rem;
			white-space: nowrap;

			&:hover {
				background-color: var(--primary-light-1);
			}
		}
	}

	/* スマホ用: 左右カラムを上下に変更 */
	@media screen and (max-width: 767px) {
		.search-base-inputs {
			flex-direction: column;

			.base-inputs-left {
				flex: none;
				width: 100%;
				max-height: 12rem;
				overflow-y: auto;
			}

			.svg-arrow {
				transform: rotate(90deg);
				padding: 0.3rem 0;
				align-self: center;
			}

			.base-inputs-right {
				flex: none;
				width: 100%;
				min-height: 10rem;
				max-height: 18rem;
				overflow-y: auto;

				.no-selection-msg::before {
					content: "↑ ";
				}
			}
		}

		/* スマホ用: 駅名を1列に */
		.base-inputs-right .input-list-secondary .input-list .line-warp .container .inner .station-wrap {
			grid-template-columns: repeat(1, 1fr) !important;
		}

		/* スマホ用: 路線名は1列表示 */
		.input-list-primary.train .innner {
			grid-template-columns: 1fr;
		}

		.line-selector-footer .line-selector-search {
			width: 50%;
			min-width: 10rem;
			max-width: 100%;
		}
	}
}

.search-bottom-modal {
	z-index: 9999;
	width: 100%;
	padding: 0.75rem 0;
	background-color: var(--surface-light-2);
	box-shadow: var(--shadow-result-list-top);
}
.search-bottom-modal .do-search-btn {
	width: 100%;
}


/* 絞込み条件 - スティッキー & スクロール (PC版 result-list) */
@media (min-width: 769px) {
	#result-list .applied-conditions.pc-only {
		position: sticky;
		top: 6rem;
		max-height: calc(100vh - 7rem);
	}

	#result-list .applied-conditions.pc-only > form {
		display: flex;
		flex-direction: column;
		max-height: calc(100vh - 7rem);
	}

	#result-list .applied-conditions.pc-only > form > section.container {
		flex: 1;
		min-height: 0;
		overflow-y: auto;
		scrollbar-width: thin;
	}

	#result-list .applied-conditions.pc-only > form > section.container::-webkit-scrollbar {
		width: 6px;
	}

	#result-list .applied-conditions.pc-only > form > section.container::-webkit-scrollbar-track {
		background: var(--bg-base, #f5f5f5);
	}

	#result-list .applied-conditions.pc-only > form > section.container::-webkit-scrollbar-thumb {
		background: var(--border-base, #ccc);
		border-radius: 3px;
	}

	#result-list .applied-conditions.pc-only > form > .button-wrap {
		flex-shrink: 0;
		padding: 1rem 0;
		position: sticky;
		bottom: 0;
		background-color: var(--surface-light-1, #fff);
		z-index: 10;
	}

	/* 折りたたみボタンは非表示（スクロールで対応） */
	#result-list .conditions-toggle-btn {
		display: none;
	}

	.conditions-toggle-btn {
		display: block;
		width: 100%;
		padding: 0.75rem 1rem;
		margin-top: 0.5rem;
		background: var(--bg-base, #f5f5f5);
		border: 1px solid var(--border-base, #ddd);
		border-radius: 4px;
		cursor: pointer;
		font-size: var(--font-body, 14px);
		color: var(--text-base, #333);
		text-align: center;
		transition: background 0.2s;
	}

	.conditions-toggle-btn:hover {
		background: var(--bg-hover, #eee);
	}

	/* 初期状態：展開（閉じるを表示） */
	.conditions-toggle-btn .toggle-open {
		display: none;
	}

	.conditions-toggle-btn .toggle-close {
		display: inline;
	}

	/* 折りたたみ時（もっと見るを表示） */
	.conditions-toggle-btn.is-collapsed .toggle-open {
		display: inline;
	}

	.conditions-toggle-btn.is-collapsed .toggle-close {
		display: none;
	}
}

/* layer外: 値下げ物件速報スマホ用（最高優先度） */
@media screen and (max-width: 767px) {
	.property-news .news-list .news-item {
		padding: 0 0.5rem;
	}
	.property-news .news-list .heading {
		display: flex;
		padding: 0.2rem 0.5rem;
		gap: 0.5rem;
	}
	.property-news .news-list .heading .old-rent-head,
	.property-news .news-list .heading .new-rent-head {
		writing-mode: horizontal-tb;
		white-space: nowrap;
	}
	.property-news .news-list .heading .old-rent-head svg,
	.property-news .news-list .heading .new-rent-head svg {
		display: inline-block;
		margin-left: 0.2rem;
		width: 1rem;
		height: 1rem;
		min-width: 1rem;
		min-height: 1rem;
		flex: 0 0 auto;
		visibility: visible;
		opacity: 1;
		fill: var(--text-primary);
	}
	.property-news .news-list .heading .price-rate-head {
		display: none;
	}
	.property-news .news-list .news-item a.item-wrap {
		display: grid;
		grid-template-columns: auto auto 1fr auto;
		align-items: center;
		gap: 0 0.5rem;
	}
	.property-news .news-list .news-item a.item-wrap .img-area {
		grid-column: 1;
		width: 3.5rem;
		height: 3.5rem;
		background-size: contain;
		background-position: center;
	}
	.property-news .news-list .news-item a.item-wrap .floor-plan-area {
		grid-column: 2;
		width: 3.5rem;
		height: 3.5rem;
		background-size: contain;
		background-position: center;
	}
	.property-news .news-list .news-item a.item-wrap .building-disp {
		grid-column: 3;
		min-width: 8em;
	}
	.property-news .news-list .news-item a.item-wrap .rate-disp {
		grid-column: 4;
		text-align: right;
		white-space: nowrap;
	}
	.property-news .news-list .news-item a.item-wrap .rate-disp .new-rent-disp {
		color: var(--text-red);
	}
	.property-news .news-list .news-item a.item-wrap .rate-disp .price-rate-disp {
		color: var(--decorative-base);
	}
}

/* ========== クチコミボタン ========== */
.review-open-btn {
	display: flex;
	align-items: center;
	gap: 0.2rem;
	background: none;
	border: 1px solid var(--primary-base);
	border-radius: var(--radius-small);
	color: var(--primary-base);
	padding: 0.15rem 0.5rem;
	font-size: var(--font-x-small);
	cursor: pointer;
	margin-top: 0.3rem;
}
.review-open-btn > svg {
	width: 1rem;
	height: 1rem;
	fill: var(--primary-base);
}
.review-open-btn:hover {
	background: var(--primary-light-1);
	color: var(--primary-base);
	border-color: var(--decorative-base);
}
.review-open-btn:hover > svg {
	fill: var(--primary-base);
}

/* ========== クチコミモーダル ========== */
.review-modal-overlay {
	position: fixed;
	inset: 0;
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	background: rgba(0, 0, 0, 0.5);
}
.review-modal {
	background: #fff;
	border-radius: 0.75rem;
	width: 92vw;
	max-width: 32rem;
	max-height: 85vh;
	display: flex;
	flex-direction: column;
	overflow: hidden;
	box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.2);
}
.review-modal-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 0.75rem 1rem;
	border-bottom: 1px solid #e5e7eb;
}
.review-modal-header h4 {
	font-size: 1rem;
	font-weight: bold;
	margin: 0;
}
.review-modal-close {
	background: none;
	border: none;
	font-size: 1.5rem;
	line-height: 1;
	cursor: pointer;
	color: #6b7280;
}
.review-modal-body {
	flex: 1;
	overflow-y: auto;
	padding: 0.75rem 1rem;
}
.review-modal-loading,
.review-modal-empty {
	text-align: center;
	color: #9ca3af;
	padding: 2rem 0;
	font-size: 0.875rem;
}
.review-modal-item {
	padding: 0.75rem 0;
	border-bottom: 1px solid #f3f4f6;
}
.review-modal-item:last-child {
	border-bottom: none;
}
.review-item-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 0.25rem;
}
.review-item-name {
	font-weight: 600;
	font-size: 0.8rem;
	color: #374151;
}
.review-item-date {
	font-size: 0.75rem;
	color: #9ca3af;
}
.review-item-title {
	font-weight: 600;
	font-size: 0.875rem;
	margin: 0.15rem 0;
	color: #1f2937;
}
.review-item-contents {
	font-size: 0.8rem;
	color: #4b5563;
	white-space: pre-line;
	line-height: 1.5;
}

/* フォーム */
.review-modal-form {
	border-top: 1px solid #e5e7eb;
	padding: 0.75rem 1rem;
	background: #f9fafb;
}
.review-form-row {
	margin-bottom: 0.5rem;
}
.review-form-row:last-child {
	margin-bottom: 0;
}
.review-form-row input[type="text"],
.review-form-row textarea {
	width: 100%;
	border: 1px solid #d1d5db;
	border-radius: 0.5rem;
	padding: 0.5rem 0.75rem;
	font-size: 0.85rem;
	resize: vertical;
	box-sizing: border-box;
}
.review-form-row input[type="text"]:focus,
.review-form-row textarea:focus {
	outline: 2px solid rgba(79, 70, 229, 0.3);
	border-color: #6366f1;
}
.review-form-actions {
	display: flex;
	justify-content: flex-end;
}
.review-submit-btn {
	background: #fff;
	color: var(--primary-base, #061d3f);
	border: 2px solid var(--decorative-base);
	border-radius: 0.5rem;
	padding: 0.5rem 1.5rem;
	font-size: 0.85rem;
	font-weight: 600;
	cursor: pointer;
}
.review-submit-btn:hover {
	background: var(--primary-light-1);
	opacity: 1;
}
.review-submit-btn:disabled {
	opacity: 0.6;
	cursor: not-allowed;
}

@media screen and (min-width: 768px) {
	.review-modal {
		max-width: 40rem;
	}
}

/* ===== スマホ横向き (landscape) ===== */
@media screen and (max-height: 500px) and (orientation: landscape) {
	/* スマホ版レイアウトを使用（PC版を非表示） */
	.pc-only {
		display: none;
	}
	.sp-only {
		display: block;
	}

	/* ヘッダーの高さを抑える */
	.header {
		padding: 0.3rem 0.5rem;

		.logo-area {
			.logo-img {
				height: 1.5rem;
			}
			> p {
				font-size: 0.65rem;
				line-height: 1.1;
			}
		}

		nav.menu {
			.menu-head {
				padding: 0.5rem;

				.inquiry {
					.contact-area {
						.tel-num {
							font-size: 0.85rem;
						}
						.always-open {
							> p:first-of-type {
								font-size: 0.6rem;
							}
							> p:last-of-type {
								font-size: 0.5rem;
							}
						}
					}
				}
			}
		}
	}

	/* ページ全体の拡大を抑制 */
	html {
		font-size: 14px;
	}

	/* メインコンテンツの余白を調整 */
	.page-container {
		padding: 0.5rem;
	}

	/* トップページのヒーローエリア */
	.hero-area,
	.top-hero {
		min-height: auto;
		padding: 1rem;
	}

	/* 検索ボックス */
	.search-box,
	.search-wrap {
		padding: 0.5rem;
	}

	/* 物件一覧ページ */
	.result-list,
	.result-list-sell {
		font-size: 0.75rem;

		.property-name,
		.building-name {
			font-size: 0.7rem;
			overflow: hidden;
			text-overflow: ellipsis;
			white-space: nowrap;
			max-width: 100%;
		}

		.price,
		.rent {
			font-size: 0.9rem;
		}

		.property-info,
		.room-info {
			font-size: 0.7rem;
			line-height: 1.3;
		}

		.tag,
		.label {
			font-size: 0.6rem;
			padding: 0.1rem 0.3rem;
		}
	}

	/* 物件見出しのはみ出し防止 */
	.property-title,
	.room-title,
	.list-item-title {
		overflow: hidden;
		text-overflow: ellipsis;
		white-space: nowrap;
		max-width: 100%;
	}

	/* 物件カード */
	.property-card,
	.room-card {
		padding: 0.5rem;
		font-size: 0.75rem;
	}

	/* 一覧のサムネイル */
	.property-img-area,
	.img-block {
		max-height: 80px;
	}

	/* 左側の絞り込みフォーム */
	#result-list .applied-conditions {
		padding: 0 0.5rem;

		.container {
			width: 10rem;
			font-size: 0.65rem;

			.item-title {
				padding: 0.3rem;
				font-size: 0.7rem;
			}

			.item-field {
				padding: 0.3rem;
				padding-bottom: 0.5rem;

				/* セレクトボックスを縦並びに */
				.select-container {
					flex-direction: column;
					align-items: stretch;
					padding-bottom: 0.5rem;

					> select {
						width: 100%;
						font-size: 0.65rem;
						padding: 0.2rem;
						margin-bottom: 0.3rem;
					}
					> span {
						text-align: center;
						margin: 0.2rem 0;
					}
				}

				/* チェックボックスを1列に */
				.pc-checkbox,
				.checkbox-area {
					grid-template-columns: 1fr;
				}

				.checkbox-area label {
					font-size: 0.65rem;
					padding: 0.15rem 0;
				}
			}
		}

		/* スライダー */
		.slider-group {
			padding: 0.25rem 0.5rem;

			.label {
				font-size: 0.65rem;
				margin-bottom: 0.3rem;
			}

			.slider-container {
				height: 1.5rem;

				input[type="range"]::-webkit-slider-thumb {
					height: 1.2rem;
					width: 1.2rem;
				}
			}
		}

		/* 検索ボタン */
		.button-wrap {
			padding: 0.3rem;

			.do-search-btn {
				font-size: 0.7rem;
				padding: 0.4rem;
			}
		}
	}

	/* 路線検索・エリア検索フォーム（スマホ縦向きと同じレイアウト） */
	.inline-line-selector,
	.inline-ward-selector {
		margin: 0.3rem 0;

		.ward-selector-header,
		.line-selector-header {
			padding: 0.4rem 0.6rem;

			h4 {
				font-size: 0.75rem;
			}

			.ward-selector-close,
			.line-selector-close {
				font-size: 1rem;
			}
		}

		.search-base-inputs {
			flex-direction: column;
			gap: 0.3rem;
			padding: 0.3rem;

			.base-inputs-left {
				flex: none;
				width: 100%;
				max-height: 8rem;
				overflow-y: auto;
				font-size: 0.65rem;
			}

			.svg-arrow {
				transform: rotate(90deg);
				padding: 0.2rem 0;
				align-self: center;

				svg {
					width: 1rem;
					height: 1rem;
				}
			}

			.base-inputs-right {
				flex: none;
				width: 100%;
				min-height: 6rem;
				max-height: 10rem;
				overflow-y: auto;
				font-size: 0.65rem;

				.no-selection-msg::before {
					content: "↑ ";
				}
			}

			.close-right-column {
				font-size: 0.9rem;
			}

			/* 路線・駅・区・町リスト */
			.line-item,
			.station-item {
				padding: 0.25rem 0.4rem;
				font-size: 0.65rem;
			}

			label {
				font-size: 0.65rem;
			}

			input[type="checkbox"] {
				width: 0.9rem;
				height: 0.9rem;
			}
		}

		/* 路線名は1列表示 */
		.input-list-primary.train .innner {
			grid-template-columns: 1fr;
		}

		/* 駅名を1列に */
		.base-inputs-right .input-list-secondary .input-list .line-warp .container .inner .station-wrap {
			grid-template-columns: repeat(1, 1fr) !important;
		}

		/* 区名を2列に */
		.base-inputs-left .input-list-primary.area .innner {
			grid-template-columns: repeat(2, 1fr) !important;
		}

		/* 町名を2列に */
		.base-inputs-right .input-list-secondary .input-list .area-warp .container .inner .ward-wrap {
			grid-template-columns: repeat(2, 1fr) !important;
		}

		.ward-selector-footer,
		.line-selector-footer {
			padding: 0.4rem;

			.ward-selector-search,
			.line-selector-search {
				width: 50%;
				min-width: 8rem;
				font-size: 0.7rem;
				padding: 0.4rem 0.8rem;
			}
		}
	}

	/* 路線・エリア検索ページ（スマホ縦向きと同じレイアウト） */
	#route-search .sp-only,
	#area-search .sp-only {
		width: 100%;
		max-width: 100vw;
		overflow-x: hidden;
	}

	#route-search .sp-only .input-list,
	#area-search .sp-only .input-list {
		display: block;
		width: 50%;
		min-width: 280px;
		max-width: 320px;
		height: auto;
		max-height: 50vh;
		overflow-y: auto;
		overflow-x: hidden;
		border-top: 1px solid var(--border-base);
	}

	#route-search .sp-only .input-list .container,
	#area-search .sp-only .input-list .container {
		display: block;
	}

	#route-search .sp-only .input-list label,
	#area-search .sp-only .input-list label {
		display: block;
		padding: 0.6rem 0 0.6rem 1rem;
		border-bottom: 1px solid var(--border-base);
		font-size: 0.8rem;
	}

	#route-search .sp-only .input-list .route-warp > h5,
	#area-search .sp-only .input-list .area-warp > h5 {
		margin: 0;
		padding: 0.4rem 0 0.2rem 1rem;
		color: var(--primary-base);
		font-weight: bold;
		font-size: 0.8rem;
		border-bottom: 1px solid var(--decorative-base);
	}

	#route-search .sp-only .input-list .inner,
	#area-search .sp-only .input-list .inner {
		position: relative;
	}

	#route-search .sp-only .input-list .inner .btn-area,
	#area-search .sp-only .input-list .inner .btn-area {
		display: block;
		position: absolute;
		right: 0.5rem;
		top: 0.3rem;
		padding: 0;
	}

	#route-search .sp-only .input-list .inner .btn-area button,
	#area-search .sp-only .input-list .inner .btn-area button {
		padding: 0 1rem 0 2rem;
	}

	#route-search .sp-only .input-list .inner .btn-area button svg,
	#area-search .sp-only .input-list .inner .btn-area button svg {
		width: 1.2rem;
		height: 1.2rem;
	}

	/* Vボタンの表示切替 */
	#route-search .sp-only .input-list .inner .btn-area button:first-child,
	#area-search .sp-only .input-list .inner .btn-area button:first-child {
		display: none;
	}
	#route-search .sp-only .input-list .inner .btn-area button:last-child,
	#area-search .sp-only .input-list .inner .btn-area button:last-child {
		display: inline-block;
	}
	#route-search .sp-only .input-list .inner .btn-area.is-open button:first-child,
	#area-search .sp-only .input-list .inner .btn-area.is-open button:first-child {
		display: inline-block;
	}
	#route-search .sp-only .input-list .inner .btn-area.is-open button:last-child,
	#area-search .sp-only .input-list .inner .btn-area.is-open button:last-child {
		display: none;
	}

	#route-search .sp-only .input-list .station-list-wrap,
	#area-search .sp-only .input-list .station-list-wrap {
		display: none;
		list-style: none;
		margin: 0;
	}

	#route-search .sp-only .input-list .station-wrap > label,
	#area-search .sp-only .input-list .station-wrap > label {
		display: flex;
		align-items: center;
		padding-left: 2rem;
		font-size: 0.75rem;
	}

	/* 物件数を非表示 */
	#route-search .sp-only .input-list label > span:last-child,
	#area-search .sp-only .input-list label > span:last-child,
	#route-search .sp-only .station-wrap label p > span:last-child,
	#area-search .sp-only .station-wrap label p > span:last-child {
		display: none;
	}

	/* おすすめ条件を2列 */
	#route-search .recommend-condition .wrap,
	#area-search .recommend-condition .wrap {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 0.2rem 0.8rem;
	}

	#route-search .recommend-condition .wrap .inner label,
	#area-search .recommend-condition .wrap .inner label {
		font-size: 0.75rem;
		padding: 0.3rem;
	}

	/* 選択した駅エリア */
	#route-search .selected-ward,
	#area-search .selected-ward {
		padding: 0.5rem;
	}

	#route-search .selected-ward h4,
	#area-search .selected-ward h4 {
		font-size: 0.8rem;
	}

	/* 検索ボタン */
	#route-search .button-wrap .do-search-btn,
	#area-search .button-wrap .do-search-btn {
		font-size: 0.8rem;
		padding: 0.5rem 1rem;
	}
}

/* お知らせセクション */
.company-notice {
	padding: 2rem;
}

.company-notice > h4 {
	border-bottom: 1px solid var(--decorative-base);
}

.company-notice .wrap .inner {
	padding: 0.2rem 0 0.5rem 0;
	border-bottom: 1px solid var(--border-base);
}

.company-notice .wrap .inner .date-area {
	color: var(--text-secondary);
	font-size: var(--font-caption);
}

.company-notice .wrap .inner p {
	margin: 0;
	font-size: var(--font-small);
	line-height: 1.6;
}

.company-notice .wrap .inner p a {
	color: var(--text-primary);
	text-decoration: none;
}

.company-notice .wrap .inner p a:hover {
	color: var(--link-default);
	text-decoration: underline;
}

.top-title {
	text-align: center;

	.jp-title {
		font-family: var(--font-serif);
		display: flex;
		align-items: center;
		justify-content: center;
		gap: 0.25rem;
		color: var(--navy-ttl);
		font-weight: bold;

		img.blink-slow {
			height: 1em;
			animation: blinkSlow 3s ease-in-out infinite;
		}
	}
	.en-title {
		font-size: var(--font-small);
		color: var(--text-secondary);
		font-weight: normal;
	}
	.title-line {
		width: 2rem;
		height: 0;
		margin: 0.5rem auto 0.4rem;
		border-bottom: 2px solid var(--decorative-base);
	}
}

.accent-line {
	font-family: var(--font-serif);
	color: var(--navy-ttl);
	font-weight: bold;
	padding-left: 0.7rem;
	border-left: 4px solid var(--decorative-base);
}

/* お知らせ詳細ページ */
#notice-page .notice-section {
	padding: 2rem 1rem;
	max-width: 800px;
	margin: 0 auto;
}

#notice-page .notice-page-title {
	font-family: var(--font-serif);
	font-size: var(--font-body-lg);
	font-weight: bold;
	color: var(--navy-ttl);
	text-align: center;
	margin-bottom: 1.5rem;
	padding-bottom: 0.8rem;
	border-bottom: 1px solid var(--decorative-base);
}

#notice-page .notice-article {
	background-color: var(--neutral-white);
	padding: 2rem;
	border-radius: 8px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
}

#notice-page .notice-title {
	font-size: var(--font-body);
	font-weight: bold;
	color: var(--text-primary);
	margin: 0 0 1rem 0;
	padding-bottom: 0.8rem;
	border-bottom: 1px solid var(--border-base);
	line-height: 1.6;
}

#notice-page .notice-content {
	font-size: var(--font-body);
	color: var(--text-primary);
	line-height: 1.8;
}

#notice-page .notice-content img {
	max-width: 100%;
	height: auto;
	margin: 1rem 0;
}

#notice-page .notice-content p {
	margin-bottom: 1rem;
}

#notice-page .notice-back {
	margin-top: 2rem;
	text-align: center;
}

#notice-page .notice-back .back-btn {
	display: inline-block;
	padding: 0.8rem 2rem;
	background-color: var(--neutral-white);
	color: var(--primary-base);
	border: 2px solid var(--decorative-base);
	text-decoration: none;
	border-radius: 4px;
	font-size: var(--font-small);
	font-weight: bold;
	transition: background-color 0.2s;
}

#notice-page .notice-back .back-btn:hover {
	background-color: var(--primary-light-1);
}

@media screen and (max-width: 767px) {
	#notice-page .notice-section {
		padding: 1rem;
	}

	#notice-page .notice-article {
		padding: 1rem;
	}

	#notice-page .notice-page-title {
		font-size: var(--font-body);
	}

	#notice-page .notice-title {
		font-size: var(--font-small);
	}

	#notice-page .notice-content {
		font-size: var(--font-small);
	}
}
