@charset "utf-8";

/* =====================================================
--------------------------------------------------------
共通
--------------------------------------------------------
===================================================== */

/* 節（見出しhead02から始まる塊） */
.section-home {
	padding-top: 40px;
	padding-bottom: 48px;
}

.section-home:has(.u--inner) {
	background: var(--color-grey-light);
}

main > div:last-of-type {
	padding-top: 0;
}

@media screen and (min-width:1024px) {
	.section-home {
		padding-top: 60px;
		padding-bottom: 64px;
	}
}



/* 見出し */
.head02-home {
	margin-bottom: 32px;
	padding-left: 36px;
	font-size: 24px;
	font-weight: bold;
}

.head02-home::before,
.head02-home::after {
	font-size: 32px;
}

.head03-home {
	display: flex;
	align-items: center;
	column-gap: 4px;
	margin-bottom: 16px;
	font-size: 18px;
	font-weight: bold;
}

.head04-home {
	margin: 16px 0 8px;
	font-size: 16px;
	font-weight: bold;
}

* + .head02-home,
* + .head03-home {
	margin-top: 32px;
}

/* *:not([class*="c--head"]) + .head02-home,
*:not([class*="c--head"]) + .head03-home {
	margin-top: 32px;
} */

/* @media screen and (min-width:1024px) {
	* + .head02-home {
		margin-top: 64px;
	}
} */










/* =====================================================
--------------------------------------------------------
ページ内リンク（メインビジュアル）
--------------------------------------------------------
===================================================== */

.home-menu {
	padding: 24px 0;
	background: var(--color-housecom-blue) url('/img/home/menu-sp.png?20251117') no-repeat top center / contain;
	font-weight: bold;
}

.home-menu h1 {
	margin-left: auto;
	margin-bottom: 80px;
	width: 6em;
	font-size: 24px;
	word-break: keep-all;
	overflow-wrap: break-word;
}

.home-menu ul {
	display: flex;
	flex-flow: row wrap;
	gap: 16px;
	width: 100%;
}

.home-menu ul li {
	width: calc((100% - 16px) / 2);
	height: 126px;
	border-radius: 4px;
	background: #fff;
	color: var(--color-link-text);
	font-size: 16px;
	text-align: center;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	word-break: keep-all;
	overflow-wrap: break-word;
	transition: all 0.5s;
}

.home-menu ul li::before,
.home-menu ul li::after {
	top: 8px;
	translate: 0;
	width: 100%;
	font-size: 48px;
	pointer-events: none;
}

.home-menu ul li a {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: flex-end;
	padding: 8px 32px 16px;
	width: 100%;
	height: 100%;
	color: var(--color-link-text);
	line-height: 1.2;
}

@media screen and (min-width:425px) {
	.home-menu h1 {
		margin-bottom: 120px;
		width: 9em;
	}
}

@media screen and (min-width:768px) {
	.home-menu {
		padding: 32px 0 24px;
		background-image: url('/img/home/menu-pc.png?20251117');
		background-position: left center;
		background-size: 780px 360px;
	}
	.home-menu .u--inner {
		display: grid;
		grid-template-columns: 1fr 1fr;
		grid-template-rows: max-content max-content;
		gap: 32px;
	}
	.home-menu h1 {
		grid-area: 1 / 2 / 2 / 2;
		margin: 0;
		font-size: 36px;
		line-height: 1.4;
	}
	.home-menu ul {
		grid-area: 2 / 2 / 2 / 2;
	}
}

@media screen and (min-width:1024px) {
	.home-menu {
		background-position: center center;
		background-size: 1300px 600px;
	}
	.home-menu ul {
		gap: 24px;
	}
	.home-menu ul li {
		width: calc((100% - 48px) / 3);
		height: 144px;
	}
	.home-menu ul li::before,
	.home-menu ul li::after {
		font-size: 64px;
	}
	.home-menu ul li a {
		align-items: flex-start;
		padding: 92px 16px 0;
	}
}

/* {{-- yonezawa 20251029 チェックFB No.160 --}} */
/* {{-- ページ内リンク 遷移先の位置調整 --}} */
#useful,
#service,
#campaign {
	scroll-margin-top: 82px;
}










/* =====================================================
--------------------------------------------------------
物件を探したい
--------------------------------------------------------
===================================================== */

/* トップページのみの挙動 */
.method-home {
	display: flex;
	flex-flow: column nowrap;
	gap: 32px 16px;
}

@media screen and (min-width:1024px) {
	.method-home {
		flex-flow: row wrap;
		align-items: flex-start;
	}
}



/* 前回の条件で探す */
.method-previous {
	width: 100%;
}

.method-previous_this {
	display: grid;
	grid-template-rows: max-content max-content;
	gap: 8px;
}

.method-previous_this.none {
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 16px;
	height: 100%;
	border: 1px solid var(--color-grey-origin);
}

.method-previous_this h3 {
	position: relative;
	grid-area: 1 / 1 / 2 / 3;
	margin-bottom: 0;
}

.method-previous_this h3::before {
	font-size: 32px;
}

.method-previous_this > p {
	grid-area: 2 / 1 / 3 / 3;
}

.method-previous_this .method-previous_more {
	grid-area: 3 / 1 / 3 / 3;
}

.method-previous_new {
	width: 100%;
}

.method-previous_new .method-previous_more {
	margin-top: 8px;
}

.method-previous_more {
	display: flex;
	justify-content: space-between;
	align-items: center;
	position: relative;
	padding: 8px 32px 8px 16px;
	width: 100%;
	min-height: 32px;
	border-radius: 4px;
	border: 1px solid var(--color-grey-origin);
	background: #fff;
}

.method-previous_more::after {
	position: absolute;
	top: 50%;
	right: 16px;
	translate: 0 -50%;
	font-family: 'icomoon';
	font-size: 16px;
	content: '\e90d';
}

.method-previous_title {
	color: var(--color-link-text);
	font-size: 16px;
	font-weight: bold;
}

.method-previous_count {
	font-size: 12px;
	text-align: center;
}

.method-previous_count span:nth-of-type(1) {
	display: block;
}

.method-previous_count span:nth-of-type(2) {
	font-size: 18px;
	font-weight: bold;
}

@media screen and (min-width:1024px) {
	.method-home .method-previous {
		order: 2;
		width: 312px;
		border-radius: 4px;
		border: 1px solid var(--color-grey-origin);
	}
	.method-previous_this {
		gap: 8px;
		margin: 0;
		padding: 16px;
	}
	.method-previous_this h3 {
		color: var(--color-link-text);
	}
	.method-previous_this > p {
		grid-area: 2 / 1 / 2 / 2;
	}
	.method-previous_this .method-previous_more {
		grid-area: 2 / 2 / 3 / 3;
		justify-self: end;
		padding: 0 32px 0 0;
		width: auto;
		border: none;
		background: transparent;
	}
	.method-previous_this .method-previous_more::after {
		right: 0;
	}
	.method-previous_this .method-previous_title {
		display: none;
	}
	.method-previous_new .method-previous_more {
		margin: 0 auto 16px;
		padding: 8px 32px 8px 12px;
		width: calc(100% - 16px * 2);
	}
	.method-previous_new .method-previous_more::after {
		right: 8px;
	}
	.method-previous_new p:nth-of-type(1) span {
		display: block;
	}
}



/* 各都道府県 */
.search-prefecture_ja_area {
	display: flex;
	flex-flow: row wrap;
	gap: 8px;
	padding: 16px;
	width: 100%;
	border-radius: 4px;
	background: var(--color-housecom-blue-light);

	/* {{
		yonezawa 20251001 [作業リスト 米澤 No.12]
		TOPページ 地域別の都道府県ボタンの並びが左に偏っていたのを均等に修正（最終行は左揃え）
	}} */
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(min(100%, calc(152px - 8px - 16px - 16px)), 1fr));
}



.search-prefecture_ja_area:not(:last-of-type) {
	margin-bottom: 16px;
}

.search-prefecture_ja_area p {
	margin-bottom: 8px;
	width: 100%;
	font-size: 16px;
	text-align: center;

	/* {{
		yonezawa 20251001 [作業リスト 米澤 No.12]
		TOPページ 地域名の表示はgridの1行すべてを使用して表示
	}} */
	grid-column: 1 / -1;
}

.search-prefecture_ja_area h4 {
	width: calc((100% - 8px) / 2);
	max-width: 152px;

	/* {{
		yonezawa 20251001 [作業リスト 米澤 No.12]
		TOPページ 地域別の都道府県ボタンの並びが左に偏っていたのを均等に修正（最終行は左揃え）
	}} */
	width: 100%;
	margin: auto;
}

.search-prefecture_ja_area h4 a {
	padding: 12px;
	width: 100%;
	height: 100%;
	font-size: 16px;
	font-weight: bold;
}

@media screen and (min-width:1024px) {
	.method-home .method-prefecture {
		order: 3;
		width: 100%;
	}
	.method-prefecture_ja {
		position: relative;
		height: 340px;
		background-image: url('../img/home/japan.png');
		background-repeat: no-repeat;
		background-position: top center;
		background-size: 345px 313px;
	}
	.search-prefecture_ja_area {
		position: absolute;
		padding: 8px;
		max-width: 328px;

		/* {{
			yonezawa 20251001 [作業リスト 米澤 No.12]
			TOPページ 地域別の都道府県ボタンの並びをSPで修正したため、PCのスタイリングを再調整
		}} */
		display: flex;
		flex-flow: row wrap;
	}
	.search-prefecture_ja_area:is(.hokkaido) { /* 北海道 */
		top: 0;
		right: 340px;
	}
	.search-prefecture_ja_area:is(.tohoku) { /* 東北 */
		top: 0;
		right: 0;
	}
	.search-prefecture_ja_area:is(.kanto) { /* 関東 */
		top: 90px;
		right: 0;
	}
	.search-prefecture_ja_area:is(.tokai-koushinetsu) { /* 東海・甲信越 */
		top: 220px;
		right: 0;
	}
	.search-prefecture_ja_area:is(.hokuriku) { /* 北陸 */
		top: 0;
		left: 340px;
		max-width: 168px;
	}
	.search-prefecture_ja_area:is(.kansai) {/* 関西 */
		top: 0;
		left: 0;
	}
	.search-prefecture_ja_area:is(.chugoku-shikoku) { /* 中国・四国 */
		top: 50%;
		left: 0;
		translate: 0 -50%;
	}
	.search-prefecture_ja_area:is(.kyushu) { /* 九州・沖縄 */
		top: 90px;
		left: 0;
	}
	.search-prefecture_ja_area p {
		margin-bottom: 0;
	}
	.search-prefecture_ja_area h4 {
		width: auto;
		min-width: 72px;

		/* {{
			yonezawa 20251001 [作業リスト 米澤 No.12]
			TOPページ 地域別の都道府県ボタンの並びをSPで修正したため、PCのスタイリングを再調整
		}} */
		margin: 0;
	}
	.search-prefecture_ja_area h4 a {
		padding: 0 8px;
		font-weight: normal;
	}
}



/* 人気エリア */
.method-home .method-popular h4 a {
	font-size: 16px;
	font-weight: bold;
}

@media screen and (min-width:1024px) {
	.method-home .method-popular {
		order: 4;
		width: 100%;
		font-weight: normal;
	}
	.method-home .method-popular h4 a {
		font-weight: normal;
	}
}



/* 自分に合った探し方 */
.method-own ul {
	display: flex;
	flex-flow: row wrap;
	gap: 8px;
}

.method-own ul li {
	border-radius: 4px;
	border: 1px solid var(--color-grey-origin);
	font-weight: bold;
	transition: all 0.5s;
}

.method-own ul li::before,
.method-own ul li::after {
	left: 50%;
	translate: -50% 0;
	font-size: 32px;
	pointer-events: none;
}

.method-own ul .u--icon-train::before,
.method-own ul .u--icon-train::after,
.method-own ul .u--icon-area::before,
.method-own ul .u--icon-area::after,
.method-own ul .u--icon-map::before,
.method-own ul .u--icon-map::after,
.method-own ul .u--icon-route::before,
.method-own ul .u--icon-route::after {
	top: 12px;
}

.method-own ul .u--icon-bag::before,
.method-own ul .u--icon-bag::after,
.method-own ul .u--icon-university::before,
.method-own ul .u--icon-university::after,
.method-own ul .u--icon-school::before,
.method-own ul .u--icon-school::after,
.method-own ul .u--icon-calculator::before,
.method-own ul .u--icon-calculator::after,
.method-own ul .u--icon-crown::before,
.method-own ul .u--icon-crown::after {
	top: 4px;
}

.method-own ul .u--icon-train,
.method-own ul .u--icon-area,
.method-own ul .u--icon-map,
.method-own ul .u--icon-route {
	width: calc((100% - 8px) / 2);
	min-height: 135px;
}

.method-own ul .u--icon-bag,
.method-own ul .u--icon-university,
.method-own ul .u--icon-school {
	width: calc((100% - 16px) / 3);
	min-height: 109px;
}

.method-own ul .u--icon-calculator,
.method-own ul .u--icon-crown {
	width: calc((100% - 8px) / 2);
	min-height: 90px;
}

.method-own ul li h4 {
	width: 100%;
	height: 100%;
}

.method-own ul li h4 a {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	width: 100%;
	height: 100%;
	color: var(--color-link-text);
}

.method-own ul .u--icon-train a,
.method-own ul .u--icon-area a,
.method-own ul .u--icon-map a,
.method-own ul .u--icon-route a {
	padding: 60px 8px 24px 8px;
}

.method-own ul .u--icon-bag a,
.method-own ul .u--icon-university a,
.method-own ul .u--icon-school a,
.method-own ul .u--icon-calculator a,
.method-own ul .u--icon-crown a {
	padding: 50px 8px 8px 8px;
}

.method-own ul li:not(.u--icon-calculator):not(.u--icon-crown) a {
	flex-direction: column;
	align-items: center;
}

.method-own ul .u--icon-train strong,
.method-own ul .u--icon-area strong,
.method-own ul .u--icon-map strong,
.method-own ul .u--icon-route strong {
	font-size: 20px;
}

.method-own ul .u--icon-bag,
.method-own ul .u--icon-university,
.method-own ul .u--icon-school {
	font-size: 12px;
}

.method-own ul .u--icon-bag strong,
.method-own ul .u--icon-university strong,
.method-own ul .u--icon-school strong {
	font-size: 14px;
}

@media screen and (min-width:375px) {
	.method-own ul {
		gap: 16px;
	}
	.method-own ul .u--icon-train,
	.method-own ul .u--icon-area,
	.method-own ul .u--icon-map,
	.method-own ul .u--icon-route {
		width: calc((100% - 16px) / 2);
	}
	.method-own ul .u--icon-bag,
	.method-own ul .u--icon-university,
	.method-own ul .u--icon-school {
		width: calc((100% - 32px) / 3);
		font-size: 14px;
	}
	.method-own ul .u--icon-calculator,
	.method-own ul .u--icon-crown {
		width: calc((100% - 16px) / 2);
	}
	.method-own ul .u--icon-train strong,
	.method-own ul .u--icon-area strong,
	.method-own ul .u--icon-map strong,
	.method-own ul .u--icon-route strong {
		font-size: 22px;
	}
	.method-own ul .u--icon-bag strong,
	.method-own ul .u--icon-university strong,
	.method-own ul .u--icon-school strong,
	.method-own ul .u--icon-calculator,
	.method-own ul .u--icon-crown {
		font-size: 16px
	}
}

@media screen and (min-width:1024px) {
	.method-home .method-own {
		order: 1;
		width: calc(100% - 16px - 312px);
	}
	.method-own ul .u--icon-train,
	.method-own ul .u--icon-area,
	.method-own ul .u--icon-map,
	.method-own ul .u--icon-route {
		width: calc((100% - 48px) / 4);
	}
	.method-own ul .u--icon-bag,
	.method-own ul .u--icon-university,
	.method-own ul .u--icon-school,
	.method-own ul .u--icon-calculator,
	.method-own ul .u--icon-crown {
		width: calc((100% - 64px) / 5);
		min-height: 124px;
		font-size: 14px;
	}
	.method-own ul .u--icon-bag::before,
	.method-own ul .u--icon-bag::after,
	.method-own ul .u--icon-university::before,
	.method-own ul .u--icon-university::after,
	.method-own ul .u--icon-school::before,
	.method-own ul .u--icon-school::after,
	.method-own ul .u--icon-calculator::before,
	.method-own ul .u--icon-calculator::after,
	.method-own ul .u--icon-crown::before,
	.method-own ul .u--icon-crown::after {
		top: 12px;
	}
	.method-own ul .u--icon-calculator a,
	.method-own ul .u--icon-crown a {
		flex-direction: column;
		align-items: center;
	}
	.method-own ul .u--icon-train strong,
	.method-own ul .u--icon-area strong,
	.method-own ul .u--icon-map strong,
	.method-own ul .u--icon-route strong {
		font-size: 22px
	}
	.method-own ul .u--icon-bag strong,
	.method-own ul .u--icon-university strong,
	.method-own ul .u--icon-school strong,
	.method-own ul .u--icon-calculator strong,
	.method-own ul .u--icon-crown strong,
	.method-own ul .u--icon-calculator strong,
	.method-own ul .u--icon-crown strong {
		font-size: 20px
	}
}

@media (any-hover:hover) {
	.method-own ul li h4 a:hover,
	.method-own ul li:has(h4 a:hover)::before,
	.method-own ul li:has(h4 a:hover)::after {
		opacity: 0.5;
	}
	.method-own ul li h4 a:hover strong {
		opacity: 1 !important;
	}
}



/* 入居者・家族構成 */
.method-tenant_wrap {
	display: flex;
	gap: 8px;
}

.method-tenant_wrap a {
	flex-direction: column;
	align-items: center;
	padding: 4px 8px 8px 8px;
	width: calc((100% - 16px) / 3);
	font-size: 14px;
}

.method-tenant_wrap a h4 {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: center;
	gap: 4px 0;
	font-weight: bold;
}

.method-tenant_wrap a h4::before {
	font-size: 32px;
}

.method-tenant_wrap a p {
	display: none;
}

@media screen and (min-width:375px) {
	.method-tenant_wrap {
		gap: 16px;
	}
	.method-tenant_wrap a {
		width: calc((100% - 32px) / 3);
	}
	.method-tenant_wrap a h4 strong {
		margin-top: -2px;
		font-size: 16px;
	}
}

@media screen and (min-width:1024px) {
	.method-home .method-tenant {
		order: 5;
		width: 100%;
	}
	.method-tenant_wrap a {
		padding: 12px 16px 16px;
	}
	.method-tenant_wrap a h4 {
		margin-left: -32px;
	}
	.method-tenant_wrap a h4::before {
		margin-right: 16px;
	}
	.method-tenant_wrap a p {
		display: block;
		color: var(--color-black);
	}
}



/* ライフスタイル・こだわりタグ */
.method-style h4 a {
	min-height: 40px;
	font-weight: bold;
}

.method-style .u--text-right {
	margin-top: 16px;
	margin-right: 24px;
	font-size: 16px;
	letter-spacing: -0.1px;
}

.method-style .u--text-right .c--link-text-internal::after {
	right: -24px;
}

@media screen and (min-width:768px) {
	.method-style .u--text-right {
		letter-spacing: 0;
	}
}

@media screen and (min-width:1024px) {
	.method-home .method-style {
		order: 6;
		width: 100%;
	}
	.method-style h4 a {
		font-weight: normal;
	}
}



/* 不動産のプロ */
.method-home .method-pro {
	margin-bottom: 48px;
	width: 100%;
}

.method-pro a {
	padding-left: 40px;
	max-width: 344px;
	min-height: 48px;
	font-size: 16px;
}

.method-pro a::before {
	left: 24px;
	font-size: 32px;
}

@media screen and (min-width:1024px) {
	.method-home .method-pro {
		order: 7;
		margin: 0;
	}
	.method-pro a {
		width: 300px;
	}
}



/* -----------------------------------------------------
ランキング
----------------------------------------------------- */

.method-ranking {
	margin-top: -32px;
}

/* タブ */
.method-ranking_tab {
	display: flex;
	overflow: hidden;
	margin-bottom: 16px;
	color: var(--color-link-text);
	font-size: 14px;
	text-align: center;
	cursor: pointer;
}

/* {{ yonezawa 20251021 作業リスト No.28 }} */
/* {{ TOP ランキングカセットの都道府県名表示を調整 }} */
.method-ranking_tab {
	overflow-x: auto;
	width: 100vw;
	padding: 0 32px 0 0;
	-ms-overflow-style: none;
	scrollbar-width: none;
	cursor: default;
}

/* {{ yonezawa 20251021 作業リスト No.28 }} */
/* {{ TOP ランキングカセットの都道府県名表示を調整 }} */
.method-ranking_tab::-webkit-scrollbar {
	display: none;
}

.method-ranking_tab li {
	flex-shrink: 0;
	width: calc(100% / 18);
	border-bottom: 4px solid var(--color-grey-light);
}

/* {{ yonezawa 20251021 作業リスト No.28 }} */
/* {{ TOP ランキングカセットの都道府県名表示を調整 }} */
.method-ranking_tab li {
	width: 64px;
	cursor: pointer;
}

.method-ranking_tab li[aria-selected="true"] {
	border-bottom: 4px solid var(--color-housecom-blue);
	color: var(--color-black);
	font-weight: bold;
}

/* {{ yonezawa 20251021 作業リスト No.30 }} */
/* {{ TOP ランキングカセットの画像右横の余白を削除 }} */
.method-ranking .method-ranking_cassette a {
	width: 100%;
}


/* 詳細 */
.method-ranking_cassette img {
	width: 100%;
	max-height: 88px;
}

.method-ranking_cassette_info {
	padding: 8px 8px 16px 8px;
	font-size: 14px;

	/* {{yonezawa 20250924 各種ランキングのカルーセルを調整のため追加}} */
	height: 100%;
    display: flex;
    flex-direction: column;
}

.method-home[class] .method-ranking_cassette_info {
	gap: 4px;
}

.method-ranking_cassette_madori {
	display: inline-block;
	width: fit-content;
	margin-bottom: 8px;
	padding: 4px 8px;
	border-radius: 2px;
	background-color: var(--color-grey-light);
	font-size: 12px;
}

.method-ranking_cassette_price {
	color: var(--color-link-text);
	font-weight: bold;
}

.method-ranking_cassette_price span {
	font-size: 20px;
	
	/* {{yonezawa 20250924 各種ランキングのカルーセルを調整のため追加}} */
	margin: 0 0 0 8px;
}

/* {{yonezawa 20250924 各種ランキングのカルーセルを調整のため追加}} */
.method-ranking_cassette_date {
	margin: auto 0 0;
}

.method-ranking .u--text-right {
	margin-top: 16px;
	margin-bottom: 32px;
}

.method-home .method-ranking .head03-home {
	margin-top: 32px;
}

@media screen and (min-width:1024px) {

	.method-home .method-ranking {
		order: 8;
		width: 100%;
	}
	.method-ranking_cassette_date {
		font-size: 12px;
	}
	.method-home[class] .method-ranking_cassette_date {
		/* margin-top: 8px; */
		color: var(--color-grey-dark);
	}

	/* {{ yonezawa 20251021 作業リスト No.28 }} */
	/* {{ TOP ランキングカセットの都道府県名表示を調整 }} */
	.method-ranking_tab {
		padding: 8px calc((100vw - 1024px + 48px) / 2) 0 0;
	}
}

















/* =====================================================
--------------------------------------------------------
店舗を探したい
--------------------------------------------------------
===================================================== */

/* ボタン */
.realtor-link {
	justify-content: flex-start;
	padding: 20px 16px 20px 64px;
	width: 100%;
	max-width: 344px;
	font-size: 16px;
	font-weight: bold;
}

.realtor-link::before,
.realtor-link::after {
	position: absolute;
	top: 50%;
	left: 24px;
	translate: 0 -50%;
	font-family: 'icomoon';
	font-size: 32px;
	font-weight: normal;
}

.realtor-link::before {
	color: var(--color-housecom-blue);
	content: '\e909';
}

.realtor-link::after {
	color: var(--color-black);
	content: '\e90a';
}



/* 特徴 */
.realtor-feature div {
	display: flex;
	flex-flow: column wrap;
	gap: 8px 24px;
	font-size: 16px;
}

.realtor-feature div:not(:last-of-type) {
	margin-bottom: 16px;
}

.realtor-feature dt {
	min-width: 6em;
	font-weight: bold;
}

.realtor-feature dd {
	display: flex;
	flex-flow: row wrap;
	gap: 8px;
}

.realtor-feature a {
	min-height: 40px;
}

@media screen and (min-width:1024px) {
	.realtor-feature {
		margin-top: 24px;
	}
	.realtor-link {
		padding-left: 56px;
	}
	.realtor-link::before,
	.realtor-link::after {
		left: 16px;
	}
	.realtor-feature div {
		flex-flow: row nowrap;
	}
	.realtor-feature dt {
		padding-top: 12px;
		width: 7em;
		text-align: right;
	}
	/* {{-- yonezawa 20251024 チェックFBシート No.156対応 --}} */
	/* {{-- PCのみ ddの幅を固定する --}} */
	.realtor-feature dd {
		width: calc(100% - 7em - 24px);
	}
}










/* =====================================================
--------------------------------------------------------
キャンペーン・PR
--------------------------------------------------------
===================================================== */

.campaign {
	justify-content: center;
}

.campaign > * {
	text-align: center;
}

@media screen and (min-width:768px) {
	.campaign > * {
		width: calc((100% - 16px) / 2);
	}
}

@media screen and (min-width:1024px) {
	.campaign {
		gap: 24px;
	}
	.campaign > * {
		width: calc((100% - 48px) / 3);
	}
}










/* =====================================================
--------------------------------------------------------
暮らしのお役立ち情報（コラム）
--------------------------------------------------------
===================================================== */

.column-cassette img {
	width: 100%;
	/* height: 128px; */
	max-height: 128px;
}

.column-cassette h4 {
	padding: 16px;
}










/* =====================================================
--------------------------------------------------------
ハウスコムについて
--------------------------------------------------------
===================================================== */

/* とは */
.about-home {
	display: block;
	position: relative;
	margin: 0 auto;
	padding: 16px 48px 16px 16px;
	width: 100%;
	max-width: 750px;
	border-radius: 4px;
	border: 1px solid var(--color-grey-origin);
	background-color: #fff;
}

.about-home::after {
	position: absolute;
	top: 50%;
	right: 16px;
	translate: 0 -50%;
	font-family: 'icomoon';
	font-size: 16px;
	font-weight: normal;
	content: '\e90d';
}

.about-home h3 {
	margin-bottom: 16px;
	color: var(--color-link-text);
	font-size: 18px;
	font-weight: bold;
}



/* 特徴 */
.head03-home:has(+ .merit-home) {
	display: none;
}

.merit-home {
	justify-content: center;
	margin-top: 32px;
	font-size: 16px;
	line-height: 1.6;
}

.merit-home li {
	display: flex;
	flex-direction: column;
	align-items: center;
	max-width: 344px;
}

.merit-home[class] li h4 {
	margin: 16px 0 8px;
	width: 100%;
}

.merit-home li img {
	width: 148px;
	height: 124px
}

@media screen and (min-width:1024px) {
	.head03-home:has(+ .merit-home) {
		display: block;
	}
	.merit-home {
		margin: 0;
	}
}



/* ピックアップ店舗 */
.shop-cassette .slick-slide {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.shop-cassette .slick-slide > div:not(:is(.shop-cassette_contact)),
.shop-cassette .slick-slide > div:not(:is(.shop-cassette_contact)) > a {
	width: 100%;
}

.shop-cassette_photo {
	height: 128px;
	background: var(--color-grey-pale);
}

.shop-cassette_photo[class] img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.shop-cassette h4 {
	padding: 16px 16px 8px 16px;
	font-size: 18px;
	font-weight: bold;
}

.shop-cassette_info {
	padding: 0 16px 8px 16px;
	font-size: 16px;
}

.shop-cassette_contact {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 0 16px 16px 16px;
}

.shop-cassette_contact a {
	padding: 4px 4px 4px 24px;
	word-break: keep-all;
	overflow-wrap: break-word;
}

.shop-cassette_contact .u--icon-phone span,
.shop-cassette_contact .u--icon-mail,
.shop-cassette_contact .u--icon-shop {
	font-size: 14px;
}

.shop-cassette_contact a::before,
.shop-cassette_contact a::after {
	left: 4px;
	font-size: 16px;
}

.shop-cassette_contact .u--icon-shop::after {
	color: #fff;
}

@media (any-hover:hover) {
	.shop-cassette_contact .u--icon-shop:hover::after {
		color: var(--color-link-cv);
	}
}

@media screen and (min-width:375px) {
	.shop-cassette_contact a {
		padding: 4px 8px 4px 32px;
		font-size: 24px;
	}
	.shop-cassette_contact a::before,
	.shop-cassette_contact a::after {
		left: 8px;
		font-size: 24px;
	}
	.shop-cassette_contact .u--icon-phone {
		font-size: 16px;
	}
}



/* お近くの店舗を探す */
.realtor-prefecture div {
	display: flex;
	flex-flow: row nowrap;
	gap: 8px 16px;
}

.realtor-prefecture div:not(:last-of-type) {
	margin-bottom: 32px;
}

.realtor-prefecture dt {
	padding-top: 16px;
	min-width: 6em;
	font-size: 16px;
	text-align: right;
}

.realtor-prefecture dd {
	display: flex;
	flex-flow: row wrap;
	gap: 8px;
	width: 100%;
}

.realtor-prefecture h4 {
	width: calc((100% - 8px) / 2);
	max-width: 120px;
}

.realtor-prefecture a {
	min-height: 48px;
	font-size: 18px;
	font-weight: bold;
}

@media screen and (min-width:1024px) {
	.realtor-prefecture div {
		align-items: center;
		gap: 8px 24px;
	}
	.realtor-prefecture dt {
		padding: 0;
		min-width: 7em;
	}
	.realtor-prefecture h4 {
		min-width: 150px;
	}
}










/* =====================================================
--------------------------------------------------------
暮らしのお役立ち情報・ハウスコムについて
--------------------------------------------------------
===================================================== */

/* 統一 */
.card-useful a,
.card-service a {
	position: relative;
	padding: 16px 16px 16px 96px;
	width: 100%;
	height: 100%;
	min-height: 96px;
	border-radius: 4px;
	border: 1px solid var(--color-grey-origin);
	background-color: #fff;
}

.card-useful a {
	padding: 16px 16px 16px 96px;
}

.card-service a {
	padding: 16px 8px 16px 104px;
}

.card-useful a::before,
.card-service a::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 90px;
	height: 100%;
	background-repeat: no-repeat;
	content: '';
	transition: all 0.5s;
}

.card-useful p,
.card-service p {
	transition: all 0.5s;
}

.card-useful .card-service_title,
.card-service .card-service_title {
	margin-bottom: 8px;
	color: var(--color-link-text);
	font-size: 16px;
	font-weight: bold;
}

@media (any-hover:hover) {
	.card-useful a:hover::before,
	.card-service a:hover::before {
		background-color: rgba(255,255,255,0.5);
		background-blend-mode: lighten;
	}
}



/* お部屋探しサポート */
.head03-home:has(+ .card-useful) {
	display: none;
}

.card-useful a::before {
	background-position: 16px 16px;
	background-size: 64px 64px;
}

.card-useful li:nth-of-type(1) a::before {
	background-image: url('/img/home/useful_manual.png');
}

.card-useful li:nth-of-type(2) a::before {
	background-image: url('/img/home/useful_madori.png');
}

.card-useful li:nth-of-type(3) a::before {
	background-image: url('/img/home/useful_price.png');
}

.card-useful li:nth-of-type(4) a::before {
	background-image: url('/img/home/useful_ranking.png');
}

.card-useful li:nth-of-type(5) a::before {
	background-image: url('/img/home/useful_plplan.png');
}

@media screen and (min-width:1024px) {
	.head03-home:has(+ .card-useful) {
		display: block;
	}
	.card-useful {
		margin-bottom: 56px;
	}
}



/* サービス */
.card-service {
	margin-bottom: 16px;
}

.card-service li {
	height: auto;
	min-height: 128px;
}

.card-service li:nth-of-type(11) .card-service_title {
	letter-spacing: -2px;
}

.card-service li a::before {
	background-position: center center;
	background-size: cover;
}

.card-service li:nth-of-type(1) a::before {
	background-image: url('/img/home/service_move.png');
}

.card-service li:nth-of-type(2) a::before {
	background-image: url('/img/home/service_toritsugi.png');
}

.card-service li:nth-of-type(3) a::before {
	background-image: url('/img/home/service_sanitary.png');
}

.card-service li:nth-of-type(4) a::before {
	background-image: url('/img/home/service_kagi.png');
}

.card-service li:nth-of-type(5) a::before {
	background-image: url('/img/home/service_hoshou.png');
}

.card-service li:nth-of-type(6) a::before {
	background-image: url('/img/home/service_ouen.png');
}

.card-service li:nth-of-type(7) a::before {
	background-image: url('/img/home/service_aircon.png');
}

.card-service li:nth-of-type(8) a::before {
	background-image: url('/img/home/service_tfhikkoshi.png');
}

.card-service li:nth-of-type(9) a::before {
	background-image: url('/img/home/service_kosodate.png');
}

.card-service li:nth-of-type(10) a::before {
	background-image: url('/img/home/service_forcorp.png');
}

.card-service li:nth-of-type(11) a::before {
	background-image: url('/img/home/service_global.png');
}

@media screen and (min-width:1024px) {
	.card-service li {
		height: unset;
	}
	.card-service li:nth-of-type(11) .card-service_title {
		letter-spacing: unset;
	}
}


/* {{ yonezwa 20251007 実機（Android）検証結果からの修正 }} */
/* {{ ブレイクポイント768pxを追加 }} */
/* {{ px <= 768px <= 1024px }} */
/* {{ 1 <= 2 <= 3 column表示に修正 }} */
/* サービスのバナー */
.card-service + .c--flex-1-3 {
	margin: 0 auto;
}

.card-service + .c--flex-1-3 > li {
	text-align: center;
}

@media screen and (min-width:768px) {
	.card-service + .c--flex-1-3 {
		width: calc(344px * 2 + 16px);
	}
	
	.card-service + .c--flex-1-3 > li {
		max-width: 344px;
	}
}


@media screen and (min-width:1024px) {
	.card-service + .c--flex-1-3 {
		width: 100%;
	}
}






/* =====================================================
--------------------------------------------------------
以下の共通
--------------------------------------------------------
===================================================== */

/* 該当0件 */
.not-applicable {
	display: none;
}

.not-applicable.active {
	display: block;
	position: relative;
	padding: 12px 16px 12px 42px;
	width: 100%;
	border-radius: 4px;
	border: 3px solid var(--color-link-cv);
	color: var(--color-link-cv);
	font-size: 18px;
	font-weight: bold;
	text-align: center;
}

.not-applicable::before {
	position: absolute;
	top: 50%;
	left: 16px;
	translate: 0 -50%;
	color: var(--color-link-cv);
	font-family: 'icomoon';
	font-weight: normal;
	content: '\e93e';
}

@media screen and (min-width:1024px) {
	.not-applicable.active {
		padding-left: 44px;
		font-size: 20px;
	}
	.not-applicable::before {
		display: none;
	}
	.not-applicable span {
		position: relative;
	}
	.not-applicable span::before {
		position: absolute;
		top: 50%;
		left: -32px;
		translate: 0 -50%;
		color: var(--color-link-cv);
		font-family: 'icomoon';
		font-weight: normal;
		content: '\e93e';
	}
}



/* について */
div:has(> .about-cookie) {
	margin: 32px 0 48px;
	padding: 16px;
	width: 100%;
	border-radius: 4px;
	border: 1px solid var(--color-grey-origin);
}

.about-cookie {
	margin-bottom: 16px;
	font-size: 16px;
	font-weight: bold;
}

main:has(.room) div:has(> .about-cookie) {
	margin-top: 16px;
}

@media screen and (min-width:1024px) {
	div:has(> .about-cookie) {
		margin: 48px 0 64px;
	}

	.about-cookie {
		font-size: 18px;
	}
}









/* =====================================================
--------------------------------------------------------
最近見た・お気に入りの物件
--------------------------------------------------------
===================================================== */

div:has(> .room-total) {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	gap: 16px 8px;
	align-items: center;
}

div:has(> .room-total) .c--head01 {
	margin-bottom: 16px;
	width: 100%;
}

.room-total span {
	font-size: 18px;
	font-weight: bold;
}

div:has(> .room-total) .c--select::before {
	rotate: 0deg;
	width: 14px;
	height: 12px;
	clip-path: polygon(0 0, 100% 0%, 50% 100%);
	background: var(--color-black);
	content: '';
}

div:has(> .room-total) .c--select.show::before {
	rotate: 180deg;
}

div:has(> .room-total) .c--select select {
	padding: 6px 48px 6px 12px;
}

@media screen and (min-width:1024px) {
	div:has(> .room-total) {
		gap: 24px 8px;
	}
	.room-total {
		font-size: 18px;
	}
	.room-total span {
		font-size: 22px;
	}
	div:has(> .room-total) .c--select select {
		padding-right: 40px;
	}
}



/* 注釈 */
.room-note {
	position: relative;
	padding-left: 44px;
	width: 100%;
	font-size: 14px;
}

.room-note::before {
	position: absolute;
	bottom: 0;
	left: 20px;
	font-family: 'icomoon';
	font-size: 16px;
	content: '\e987';
}

.room-note span {
	display: block;
}



/* 箱 */
.room {
	display: grid;
	grid-template-columns: 100px auto auto 24px;
	gap: 8px;
	position: relative;
	padding: 16px;
	width: 100%;
	border-radius: 8px;
	border: 1px solid var(--color-grey-origin);
}

@media (any-hover:hover) {
	.room label h2,
	.room_img,
	.room_info {
		transition: all 0.5s;
	}
	.room_more a:hover,
	.room:has(.room_more a:hover) label h2,
	.room:has(.room_more a:hover) .room_img,
	.room:has(.room_more a:hover) .room_info {
		opacity: 0.5;
	}
}

@media screen and (min-width:1024px) {
	.room {
		/* {{yonezawa 20250930 「お気に入りに追加」ボタンの幅が変わってもカード全体の余白が変わらないようgridの幅を修正}} */
		/* grid-template-columns: 200px auto auto 180px; */
		grid-template-columns: 200px auto 1fr auto;
		gap: 0 16px;
	}
}



/* 掲載終了まで・公開日 */
.room_time {
	grid-area: 1 / 1 / 2 / 5;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
}

.room_time p {
	z-index: 1;
	height: fit-content;
}

.room_time p:not(:has(time)) {
	color: var(--color-link-cv);
}

.room_time p:not(:has(time)) span {
	font-weight: bold;
}

.room_time p:has(time) {
	color: var(--color-grey-dark);
	font-size: 12px;
}

.room_time p:has(time) time {
	margin-right: 4px;
}

.room_time p:has(time) span {
	margin-left: 8px;
	padding: 4px;
	border-radius: 2px;
	background: var(--color-housecom-blue);
	color: #fff;
	font-weight: bold;
}

@media screen and (min-width:1024px) {
	.room_time {
		grid-area: 1 / 1 / 2 / 4;
		justify-content: flex-start;
		align-items: flex-start;
		gap: 24px;
	}
	.room_time p:has(time) {
		font-size: 14px;
	}
	.room_time p:has(time) span {
		padding: 4px 8px
	}
}



/* 部屋名 */
.room label {
	grid-area: 2 / 1 / 3 / 4;
	align-items: flex-start;
	margin-bottom: 8px;
	line-height: var(--line-height-default);
}

.room label input {
	z-index: 1;
	margin-right: 8px;
}

.room label h2 {
	color: var(--color-link-text);
	font-size: 16px;
	font-weight: bold;
}

@media screen and (min-width:1024px) {
	.room label {
		grid-area: 2 / 1 / 3 / 5;
		margin: -8px 0 16px;
	}
	.room label input {
		margin-right: 16px;
	}
	.room label h2 {
		font-size: 20px;
	}
}



/* 画像 */
.room_img {
	grid-area: 4 / 1 / 5 / 2;
	display: flex;
	justify-content: center;
	align-items: center;
	aspect-ratio: 1 / 1;
	background: var(--color-grey-pale);
}

.room_img img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

@media screen and (min-width:1024px) {
	.room_img {
		grid-area: 3 / 1 / 5 / 2;
	}
}



/* 基本情報 */
.room_info {
	display: contents;
}

.room_info > * {
	grid-area: 4 / 2 / 5 / 4;
	width: 100%;
}

.room_station {
	grid-area: 3 / 1 / 4 / 5;
}

.room_price {
	font-weight: bold;
}

.room_price span:first-of-type {
	font-size: 20px;
}

.room_price span:last-of-type {
	margin-left: 8px;
	font-size: 12px;
	font-weight: normal;
}

.room_info dl {
	display: flex;
	flex-flow: row wrap;
	gap: 8px;
	margin: 8px 0;
}

.room_info dl div {
	display: flex;
	gap: 8px;
	
	/* {{yonezawa 20250922 SP閲覧時のレイアウト調整用に削除}} */
	/* width: fit-content; */
	/* min-width: 80px; */

	/* {{yonezawa 20250922 SP閲覧時のレイアウト調整用に追加}} */
	width: calc(50% - 4px);
}

.room_info dl div dt {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 20px;
	background: var(--color-grey-pale);
	line-height: 1;
	
	/* {{yonezawa 20250922 SP閲覧時のレイアウト調整用に追加}} */
	height: 20px;
	align-self: flex-start;
}

/* {{yonezawa 20250922 SP閲覧時のレイアウト調整用に追加}} */
.room_info dl div dd {
	width: calc(100% - 20px);
	word-break: break-all;
}


@media screen and (min-width:1024px) {
	.room_info {
		grid-area: 3 / 2 / 4 / 5;
		display: flex;
		flex-direction: column;
		gap: 8px;
	}
	.room_info > div {
		display: flex;
		flex-direction: column;
	}
	.room_price span:first-of-type {
		font-size: 24px;
	}
	.room_price span:last-of-type {
		font-size: 16px;
	}
	.room_info dl {
		gap: 16px;
		margin: 8px 0 16px;
	}
	.room_info dl div {
		min-width: 100px;

		/* {{yonezawa 20250922 SP閲覧時のレイアウト調整用に追加}} */
		width: fit-content;
	}
	.room_info dl div dt {
		width: 24px;
	}
}



/* 店舗詳細へ */
.room .c--link-text {
	grid-area: 5 / 1 / 6 / 5;
	margin-bottom: 8px;
	z-index: 1;
	width: fit-content;
}

@media screen and (min-width:1024px) {
	.room .c--link-text {
		grid-area: unset;
		/* {{yonezawa 20250930 問い合わせボタン上部の余白を調整}} */
		margin: 16px 0 0;
	}
}



/* お気に入り */
.room_favorite {
	grid-area: 2 / 4 / 3 / 5;
	cursor: pointer;

	/* {{yonezawa 20250922 SP閲覧時の重なり順を追加}} */
	z-index: 1;
}

.room_favorite > .u--icon-heart {
	display: block;
	width: 100%;
	height: 100%;
}

.room_favorite > .u--icon-heart::before {
	color: var(--color-grey-dark);
	font-size: 24px;
	content: "\e92a";
}

.room_favorite > .u--icon-heart.added::before {
	color: var(--color-link-cv);
	content: "\e92b";
}

.room_favorite > span span {
	display: none;
}

@media (any-hover:hover) {
	.room_favorite > .u--icon-heart:hover::before {
		color: var(--color-link-cv);
	}
	.room_favorite > .u--icon-heart.added:hover::before {
		/* {{yonezawa 20250930 ホバーエフェクトを他ページと統一するため削除}} */
		/* color: var(--color-grey-dark); */
	}
}

@media screen and (min-width:1024px) {
	.room_favorite {
		grid-area: 1 / 4 / 2 / 5;
	}
	.room_favorite > .u--icon-heart {
		display: inline-flex;
		justify-content: center;
		align-items: center;
		position: relative;
		z-index: 1;
		padding: 0 12px 0 40px;
		/* {{yonezawa 20250930 ボックス幅が「お気に入りに追加」「お気に入りに追加済」のどちらにも柔軟に対応できるよう幅の固定値指定を削除}} */
		/* width: 180px; */
		height: 48px;
		border-radius: 4px;
		border: 1px solid var(--color-grey-origin);
		background: #fff;
		color: var(--color-link-text);
		text-align: center;
		transition: all 0.5s;
		white-space: nowrap;
	}
	.room_favorite > .u--icon-heart::before {
		position: absolute;
		top: 50%;
		left: 12px;
		translate: 0 -50%;
	}
	.room_favorite > .u--icon-heart span {
		display: inline-block;
	}
}



/* 詳細を見る */
.room_more {
	grid-area: 4 / 4 / 5 / 5;
	display: flex;
	justify-content: center;
	align-items: center;
}

.room_more > a {
	position: static !important;
	/* {{-- yonezawa 20251030 チェックFB No.63 --}} */
	/* {{-- a要素タップ時の挙動を修正 --}} */
	-webkit-tap-highlight-color: transparent;
}

/* {{-- yonezawa 20251030 チェックFB No.63 --}} */
/* {{-- a要素タップ時の挙動を修正 --}} */
div:has(> .property_build) > a:focus {
	outline: none;
}

.room_more > a::before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 0;
	width: 100%;
	height: 100%;
	content: '';
}

/* {{-- yonezawa 20251030 チェックFB No.63 --}} */
/* {{-- a要素タップ時の挙動を修正 --}} */
.room_more > a:active:before {
	animation: tap .5s;
}

@keyframes tap {
	0% {background: #0000;}
	50% {background: #0001;}
	100% {background: #0000;}
}

.room_more > a .u--icon-arrow {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--color-housecom-green);
	text-align: center;
	transition: all 0.5s;
}

.room_more > a .u--icon-arrow span {
	display: none;
}

@media screen and (min-width:1024px) {
	.room_more {
		grid-area: 2 / 4 / 4 / 5;
		justify-content: flex-end;
		align-items: flex-end;
	}
	.room_more > a .u--icon-arrow {
		position: relative;
		padding: 0 32px 0 16px;
		width: fit-content;
		width: 180px;
		height: 48px;
		border-radius: 4px;
		border: 2px solid var(--color-housecom-green);
		font-size: 16px;
		font-weight: bold;
	}
	.room_more > a .u--icon-arrow::before {
		position: absolute;
		top: 50%;
		right: 16px;
		translate: 0 -50%;
	}
	.room_more > a .u--icon-arrow span {
		display: block;
	}
}



/* お問い合わせ */
.room_contact {
	grid-area: 6 / 1 / 7 / 5;
	display: flex;
	justify-content: center;
	margin:0 -16px -16px -16px;
	padding: 0 16px 16px 16px;
	gap: 16px;
	width: calc(100% + 16 * 2);
	z-index: 1;
}

.room_contact a {
	padding: 4px 4px 4px 24px;
	max-width: 350px;
}

.room_contact a::before {
	left: 4px;
	font-size: 16px;
}

.room_contact a .room_contact_now {
	width: 100%;
	font-size: 10px;
}

.room_contact a:is(.u--icon-mail) span:not(.room_contact_now),
.room_contact a:is(.u--icon-phone) .room_contact_num,
.room_contact a:is(.u--icon-phone) .room_contact_num + span {
	display: none;
}

@media screen and (min-width:375px) {
	.room_contact a {
		padding: 8px 8px 8px 32px;
	}
	.room_contact a::before {
		left: 8px;
		font-size: 24px;
	}
}

@media screen and (min-width:1024px) {
	.room_contact {
		gap: 32px;
		/* {{yonezawa 20250930 問い合わせボタン上部の余白を調整}} */
		padding: 16px;
	}
	.room_contact a::before {
		left: 12px;
	}
	.room_contact a .room_contact_now {
		width: fit-content;
		font-size: 16px;
	}
	.room_contact a:is(.u--icon-phone) {
		border-color: var(--color-link-cv);
		background: #fff;
		color: var(--color-link-cv);
	}
	.room_contact a:is(.u--icon-phone)::before {
		color: var(--color-link-cv);
	}
	.room_contact a:is(.u--icon-mail) span:not(.room_contact_now),
	.room_contact a:is(.u--icon-phone) .room_contact_num,
	.room_contact a:is(.u--icon-phone) .room_contact_num + span {
		display: block;
	}
	.room_contact a:is(.u--icon-phone) .room_contact_now,
	.room_contact a:is(.u--icon-phone) .room_contact_now + span {
		display: none;
	}
	.room_contact a:is(.u--icon-phone) .room_contact_num {
		margin-right: 8px;
		font-size: 24px;
	}
}

/* もっと見る */
.room-more {
	width: 100%;
	text-align: center;
}

.room-more .c--link-sub {
	padding: 8px;
	width: 100%;
	max-width: 342px;
	border-width: 2px;
	font-size: 18px;
	font-weight: bold;
}

@media screen and (min-width:1024px) {
	.room-more .c--link-sub {
		padding: 16px;
		font-size: 20px;
	}
}



/* まとめて問い合わせ */
.room-float {
	display: none;
}

.room-float.active {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 16px;
	position: fixed;
	left: 0;
	bottom: 0;
	padding: 8px 16px;
	width: 100%;
	border-top: 1px solid var(--color-grey-origin);
	border-bottom: 1px solid var(--color-grey-origin);
	background: #fff;
	z-index: 1;
}

/* {{yonezawa 20250922 すべてがチェックオフ時は非表示にするため追加}} */
.u--inner:has(.room-total):not(:has(:checked)) .room-float.active {
	display: none;
}

/* {{yonezawa 20250922 すべてがチェックオフ時は念のためにリンクを無効化するため追加}} */
.u--inner:has(.room-total):not(:has(:checked)) #inquiry_btn {	
	pointer-events: none;
	filter: grayscale(1);
	color: #777;
	cursor: default;
}

.u--inner:has(.room-total):not(:has(:checked)) #inquiry_btn::before {	
	color: #777;
}

.room-float p {
	width: fit-content;
	min-width: 157px;
	font-size: 16px;
	font-weight: bold;
	text-align: right;
}

.room-float p span {
	font-size: 22px;
}

.room-float .c--link-main {
	padding-left: 48px;
	width: 170px;
	height: 48px;
	font-size: 18px;
	
	/* {{yonezawa 20250922 ボタンラベルテキストの折り返し禁止を追加}} */
	flex-shrink: 0;
}

.room-float .u--icon-mail::before {
	left: 16px;
	font-size: 24px;
}

@media screen and (min-width:1024px) {
	.room-float.active {
		padding: 16px;
	}
	.room-float .c--link-main {
		width: 280px;
	}
}

/* 追従を最下部表示しているときに、余白を確保する */
body:has(.room-float.active) footer {
	margin-bottom: 48px;
}










/* =====================================================
--------------------------------------------------------
保存した条件
--------------------------------------------------------
===================================================== */

/* タブ切替 */
.condition-tab {
	display: flex;
	flex-direction: row;
	margin-bottom: 20px;
}

.condition-tab span {
	padding-bottom: 4px;
	width: 50%;
	border-bottom: 4px solid var(--color-grey-pale);
	color: var(--color-link-text);
	text-align: center;
	cursor: pointer;
}

.condition-tab span.active {
	border-color: var(--color-housecom-blue);
	color: var(--color-black);
	font-weight: bold;
	cursor: default;
}

@media screen and (min-width:1024px) {
	.condition-tab span {
		padding-bottom: 8px;
	}
}



/* 件数 */
.condition-total {
	margin: 20px 0 16px;
}

.condition-total span {
	font-size: 18px;
	font-weight: bold;
}

@media screen and (min-width:1024px) {
	.condition-total {
		margin: 20px 0 24px;
		font-size: 18px;
	}
	.condition-total span {
		font-size: 22px;
	}
}



/* 箱 */
/* {{20251008 jsで切り替えるため削除}} */
/* div:has(> .condition) {
	display: none;
}

div:has( > .condition).active {
	display: flex;
} */

.condition {
	display: grid;
	grid-template-columns: auto 20px;
	align-content: start;
	gap: 16px;
	padding: 16px;
	border-radius: 8px;
	border: 1px solid var(--color-grey-origin);
}

.condition h2 {
	grid-area: 1 / 1 / 2 / 2;
	font-size: 16px;
	font-weight: bold;
}

.condition a:has(.u--icon-close) {
	grid-area: 1 / 2 / 2 / 3;
	font-size: 20px;
}

.condition_new {
	grid-area: 2 / 1 / 3 / 3;
	margin: -16px 0 -8px;
	width: 100%;
	color: var(--color-link-cv);
	font-size: 16px;
}

.condition_new span {
	font-weight: bold;
}

.condition ul {
	grid-area: 3 / 1 / 4 / 3;
	width: 100%;
	border-radius: 8px;
	border: 1px solid var(--color-grey-origin);
}

.condition:not(:has(.condition_new)) ul {
	grid-area: 2 / 1 / 3 / 3;
	margin-top: -8px;
}

.condition ul li {
	display: flex;
	gap: 12px;
	padding: 16px;
}

.condition ul li:not(:last-of-type) {
	border-bottom: 1px solid var(--color-grey-origin);
}

.condition_title {
	width: 4em;
	font-weight: bold;
}

.condition_title + p {
	width: calc(100% - 12px - 4.5em);
}

.condition .c--link-main {
	grid-area: 4 / 1 / 5 / 3;
	width: 100%;
	height: 48px;
	font-size: 18px;
}

.condition:not(:has(.condition_new)) .c--link-main {
	grid-area: 3 / 1 / 4 / 3;
}

.condition_time {
	grid-area: 5 / 1 / 6 / 3;
	color: var(--color-grey-dark);
	font-size: 14px;
}

.condition:not(:has(.condition_new)) .condition_time {
	grid-area: 4 / 1 / 5 / 3;
}

@media screen and (min-width:1024px) {
	.condition {
		grid-template-columns: auto 24px;
	}
	.condition h2 {
		font-size: 20px;
	}
	.condition a:has(.u--icon-close) {
		font-size: 24px;
	}
	.condition .condition_new {
		margin-bottom: 0;
		font-size: 18px;
	}
	.condition ul {
		border-top: 6px solid var(--color-housecom-blue);
	}
	.condition:not(:has(.condition_new)) ul {
		margin-top: 0;
	}
	.condition ul li {
		gap: 24px;
	}
	.condition_title + p {
		width: calc(100% - 24px - 4.5em);
	}
	.condition_title {
		font-size: 18px;
	}
}










/* =====================================================
--------------------------------------------------------
サイトマップ
--------------------------------------------------------
===================================================== */

.sitemap {
	display: flex;
	flex-flow: row wrap;
	margin-bottom: 48px;
	gap: 16px;
	font-size: 16px;
}

.sitemap > div {
	display: flex;
	flex-direction: column;
	gap: 16px;
	width: 100%;
}

.sitemap > div > div {
	padding: 6px 16px 8px;
	width: 100%;
	height: fit-content;
	border-radius: 4px;
	border: 1px solid var(--color-grey-origin);
	background: #fff;
}

.sitemap h2 {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 8px;
	font-weight: bold;
}

.sitemap h2::after {
	font-size: 16px;
}

.sitemap h2 span {
	padding: 8px 0 8px 32px;
}

.sitemap h2 span::before,
.sitemap h2 span::after {
	font-size: 24px;
}

.sitemap h2 + div {
	display: flex;
	flex-direction: column;
	gap: 12px;
	margin-top: 16px;
}

@media screen and (min-width:1024px) {
	.sitemap {
		gap: 24px;
	}
	.sitemap > div {
		gap: 24px;
		width: calc((100% - 24px * 2) / 3);
	}
	.sitemap h2 {
		font-size: 20px;
	}
	.sitemap > div {
		width: calc((100% - 24px * 2) / 3);
	}
}



/* 共通（リスト） */
.sitemap h2 + div:not(:is([class])) h3,
.sitemap h2 + .sitemap_service div + h3 {
	position: relative;
	width: fit-content;
	cursor: pointer;
}

.sitemap h2 + div:not(:is([class])) h3::before,
.sitemap h2 + .sitemap_service div + h3::before {
	position: absolute;
	top: 50%;
	right: 0;
	translate: 0 -50%;
	color: var(--color-black);
	font-family: 'icomoon';
	transition: all 0.5s;
}

.sitemap h2 + div:not(:is([class])) h3:not(:is(.u--icon-external))::before,
.sitemap h2 + .sitemap_service div + h3::before {
	content: '\e90d';
}



/* 各種ご案内・お問い合わせひとつ */
.sitemap h2 + .sitemap_service div {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.sitemap h2 + .sitemap_service div h4,
.sitemap h2 + div:not(:is([class])) h3:is(.u--icon-check) {
	position: relative;
	padding-left: 24px;
	width: fit-content;
	cursor: pointer;
}

.sitemap h2 + .sitemap_service div h4::before,
.sitemap h2 + div:not(:is([class])) h3:is(.u--icon-check)::before {
	position: absolute;
	top: 50%;
	left: 0;
	translate: 0 -50%;
	width: fit-content;
	color: var(--color-black);
	font-family: 'icomoon';
	content: '\e94b';
	transition: all 0.5s;
}



/* リンク */
.sitemap a {
	padding-right: 24px;
	color: var(--color-link-text);
}

.sitemap a span {
	display: block;
}

@media (any-hover:hover) { 
	.sitemap a:not(:has(span)):hover {
		opacity: 0.5;
	}
	.sitemap h2 + div:not(:is([class])) h3:not(:is(.u--icon-external)):hover::before,
	.sitemap h2 + .sitemap_service div + h3:hover::before {
		right: -8px;
	}
}









/* =====================================================
--------------------------------------------------------
404
--------------------------------------------------------
===================================================== */

.notfound {
	margin-bottom: 48px;
}

.notfound > p span {
	display: block;
}

.notfound .c--link-sub {
	display: flex;
	margin: 32px auto;
	width: 100%;
	max-width: 344px;
	height: 48px;
	border-width: 2px;
	font-size: 18px;
	font-weight: bold;
}

.notfound h2 {
	font-size: 18px;
	font-weight: bold;
	margin-bottom: 16px;
}

.notfound ul {
	display: flex;
	flex-flow: row wrap;
	gap: 8px;
}

.notfound ul li {
	border-radius: 4px;
	border: 1px solid var(--color-grey-origin);
	font-weight: bold;
	transition: all 0.5s;
}

.notfound ul li::before,
.notfound ul li::after {
	left: 50%;
	translate: -50% 0;
	font-size: 32px;
	pointer-events: none;
}

.notfound ul .u--icon-train::before,
.notfound ul .u--icon-train::after,
.notfound ul .u--icon-area::before,
.notfound ul .u--icon-area::after,
.notfound ul .u--icon-map::before,
.notfound ul .u--icon-map::after,
.notfound ul .u--icon-route::before,
.notfound ul .u--icon-route::after {
	top: 12px;
}

.notfound ul .u--icon-bag::before,
.notfound ul .u--icon-bag::after,
.notfound ul .u--icon-university::before,
.notfound ul .u--icon-university::after,
.notfound ul .u--icon-school::before,
.notfound ul .u--icon-school::after,
.notfound ul .u--icon-calculator::before,
.notfound ul .u--icon-calculator::after,
.notfound ul .u--icon-crown::before,
.notfound ul .u--icon-crown::after {
	top: 4px;
}

.notfound ul .u--icon-train,
.notfound ul .u--icon-area,
.notfound ul .u--icon-map,
.notfound ul .u--icon-route {
	width: calc((100% - 8px) / 2);
	min-height: 135px;
}

.notfound ul .u--icon-bag,
.notfound ul .u--icon-university,
.notfound ul .u--icon-school {
	width: calc((100% - 16px) / 3);
	min-height: 109px;
}

.notfound ul .u--icon-calculator,
.notfound ul .u--icon-crown {
	width: calc((100% - 8px) / 2);
	min-height: 90px;
}

.notfound ul li h4 {
	width: 100%;
	height: 100%;
}

.notfound ul li a {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	width: 100%;
	height: 100%;
	color: var(--color-link-text);
}

.notfound ul .u--icon-train a,
.notfound ul .u--icon-area a,
.notfound ul .u--icon-map a,
.notfound ul .u--icon-route a {
	padding: 60px 8px 24px 8px;
	font-size: 16px;
}

.notfound ul .u--icon-bag a,
.notfound ul .u--icon-university a,
.notfound ul .u--icon-school a,
.notfound ul .u--icon-calculator a,
.notfound ul .u--icon-crown a {
	padding: 50px 8px 8px 8px;
}

.notfound ul li:not(.u--icon-calculator):not(.u--icon-crown) a {
	flex-direction: column;
	align-items: center;
}

.notfound ul .u--icon-train strong,
.notfound ul .u--icon-area strong,
.notfound ul .u--icon-map strong,
.notfound ul .u--icon-route strong {
	font-size: 20px;
}

@media screen and (min-width:375px) {
	.notfound ul {
		gap: 16px;
	}
	.notfound ul .u--icon-train,
	.notfound ul .u--icon-area,
	.notfound ul .u--icon-map,
	.notfound ul .u--icon-route {
		width: calc((100% - 16px) / 2);
	}
	.notfound ul .u--icon-bag,
	.notfound ul .u--icon-university,
	.notfound ul .u--icon-school {
		width: calc((100% - 32px) / 3);
	}
	.notfound ul .u--icon-calculator,
	.notfound ul .u--icon-crown {
		width: calc((100% - 16px) / 2);
	}
	.notfound ul .u--icon-train strong,
	.notfound ul .u--icon-area strong,
	.notfound ul .u--icon-map strong,
	.notfound ul .u--icon-route strong {
		font-size: 22px;
	}
	.notfound ul .u--icon-bag strong,
	.notfound ul .u--icon-university strong,
	.notfound ul .u--icon-school strong,
	.notfound ul .u--icon-calculator,
	.notfound ul .u--icon-crown {
		font-size: 16px
	}
}

@media screen and (min-width:1024px) {
	.notfound {
		margin-bottom: 64px;
	}
	.notfound .c--link-sub {
		margin: 48px auto;
	}
	.notfound ul {
		gap: 24px;
	}
	.notfound ul li::before,
	.notfound ul li::after {
		font-size: 48px;
	}
	.notfound ul .u--icon-train,
	.notfound ul .u--icon-area,
	.notfound ul .u--icon-map,
	.notfound ul .u--icon-route {
		width: calc((100% - 72px) / 4);
	}
	.notfound ul .u--icon-bag,
	.notfound ul .u--icon-university,
	.notfound ul .u--icon-school,
	.notfound ul .u--icon-calculator,
	.notfound ul .u--icon-crown {
		width: calc((100% - 96px) / 5);
	}
	.notfound ul li:not(.u--icon-bag):not(.u--icon-university):not(.u--icon-school):not(.u--icon-calculator):not(.u--icon-crown) a {
		flex-flow: row wrap;
		align-items: flex-end;
	}
	.notfound ul .u--icon-train a,
	.notfound ul .u--icon-area a,
	.notfound ul .u--icon-map a,
	.notfound ul .u--icon-route a {
		gap: 4px;
		padding: 80px 8px 24px 8px;
	}
	.notfound ul .u--icon-bag a,
	.notfound ul .u--icon-university a,
	.notfound ul .u--icon-school a,
	.notfound ul .u--icon-calculator a,
	.notfound ul .u--icon-crown a {
		padding: 72px 8px 16px 8px;
	}
	.notfound ul .u--icon-calculator a,
	.notfound ul .u--icon-crown a {
		flex-direction: column;
		align-items: center;
	}
	.notfound ul .u--icon-train strong,
	.notfound ul .u--icon-area strong,
	.notfound ul .u--icon-map strong,
	.notfound ul .u--icon-route strong {
		font-size: 22px;
		line-height: 1.2;
	}
	.notfound ul .u--icon-bag strong,
	.notfound ul .u--icon-university strong,
	.notfound ul .u--icon-school strong,
	.notfound ul .u--icon-calculator strong,
	.notfound ul .u--icon-crown strong,
	.notfound ul .u--icon-calculator strong,
	.notfound ul .u--icon-crown strong {
		font-size: 20px
	}
}

@media (any-hover:hover) {
	.notfound ul li h4 a:hover,
	.notfound ul li:has(h4 a:hover)::before,
	.notfound ul li:has(h4 a:hover)::after {
		opacity: 0.5;
	}
	.notfound ul li h4 a:hover strong {
		opacity: 1 !important;
	}
}



/* アイコン各種 */
.notfound ul li span:has(.path1) {
	width: 100%;
	font-size: 32px;
}



/* 駅路線・住所・地図・現在地 */
.notfound ul li span:is(.u--icon-train) + span,
.notfound ul li span:is(.u--icon-area) + span,
.notfound ul li span:is(.u--icon-map) + span,
.notfound ul li span:is(.u--icon-route) + span {
	width: 100%;
	font-size: 22px;
}

.notfound ul li span:is(.u--icon-train) + span + span,
.notfound ul li span:is(.u--icon-area) + span + span,
.notfound ul li span:is(.u--icon-map) + span + span,
.notfound ul li span:is(.u--icon-route) + span + span {
	font-size: 16px;
}



/* 通勤通学・大学・学区校区 */
.notfound ul li span:is(.u--icon-bag) + span,
.notfound ul li span:is(.u--icon-university) + span,
.notfound ul li span:is(.u--icon-school) + span {
	width: 100%;
	font-size: 16px;
}



/* 家賃相場・ランキング */
.notfound ul li span:is(.u--icon-calculator) + span,
.notfound ul li span:is(.u--icon-crown) + span,
.notfound ul li span:is(.u--icon-calculator) + span + span,
.notfound ul li span:is(.u--icon-crown) + span + span {
	font-size: 16px;
}


@media screen and (min-width:1024px) {
	.notfound ul li span:has(.path1) {
		font-size: 48px;
	}
	.notfound ul li span:is(.u--icon-train) + span,
	.notfound ul li span:is(.u--icon-area) + span,
	.notfound ul li span:is(.u--icon-map) + span,
	.notfound ul li span:is(.u--icon-route) + span {
		width: fit-content;
	}
	.notfound ul li span:is(.u--icon-bag) + span,
	.notfound ul li span:is(.u--icon-university) + span,
	.notfound ul li span:is(.u--icon-school) + span {
		font-size: 20px;
	}
	.notfound ul li span:is(.u--icon-train) + span +span,
	.notfound ul li span:is(.u--icon-area) + span +span,
	.notfound ul li span:is(.u--icon-map) + span +span,
	.notfound ul li span:is(.u--icon-route) + span +span,
	.notfound ul li span:is(.u--icon-calculator) + span +span,
	.notfound ul li span:is(.u--icon-crown) + span +span {
		font-size: 16px;
	}
	.notfound ul li span:is(.u--icon-calculator) + span,
	.notfound ul li span:is(.u--icon-crown) + span {
		width: 100%;
		font-size: 20px;
	}
}