@charset "utf-8";

/* =====================================================
--------------------------------------------------------
雑多（共通）
--------------------------------------------------------
===================================================== */

/* インナー幅の上下余白 */
.u--inner:not(:is(.footer)) {
	padding-top: 16px;
	padding-bottom: 16px;
}

@media screen and (min-width:1024px) {
	.u--inner:not(:is(.footer)) {
		padding-top: 32px;
		padding-bottom: 32px;
	}
}



/* 見出し */
hgroup:has(.head02-detail) {
	margin-bottom: 16px;
}

.head02-detail {
	display: flex;
	flex-direction: row;
	align-items: center;
	margin-bottom: 16px;
	font-size: 18px;
	font-weight: bold;
}

.head02-detail:is(.u--icon-apartment),
.head02-detail:is(.u--icon-construction) {
	padding-left: calc(24px + 8px);
}

/* .head02-detail > span {
	margin-right: 8px;
	font-size: 24px;
} */

.head02-detail::before,
.head02-detail::after {
	font-size: 24px;
}

@media screen and (min-width:1024px) {
	hgroup:has(.head02-detail) {
		margin-bottom: 24px;
	}
	hgroup .head02-detail {
		margin-bottom: 16px;
	}
	.head02-detail {
		margin-bottom: 24px;
		font-size: 24px;
	}
	.head02-detail:is(.u--icon-apartment),
	.head02-detail:is(.u--icon-construction) {
		padding-left: calc(32px + 8px);
	}
	/* .head02-detail > span {
		font-size: 32px;
	} */
	.head02-detail::before,
	.head02-detail::after {
		font-size: 32px;
	}
}



/* 詳細を囲う背景色 */
.detail {
	background: var(--color-grey-light);
}

.detail:has(.selectshop) {
	padding: 16px 0;
}

@media screen and (min-width:1024px) {
	.detail:has(.selectshop) {
		padding: 32px 0;
	}
}







/* =====================================================
--------------------------------------------------------
上部の概要（共通）
--------------------------------------------------------
===================================================== */

.summary {
	display: flex;
	flex-direction: column;
	gap: 16px;
	position: relative;
}

.summary hgroup h1 {
	margin-bottom: 16px;
	width: 100%;
	font-size: 24px;
	font-weight: bold;
}

.summary hgroup p span {
	font-size: 24px;
	font-weight: bold;
}

.summary_date {
	font-size: 12px;
}

.summary_date:has(p) {
	/* 部屋 */
	display: inline-flex;
	flex-flow: row wrap;
	gap: 4px 16px;
	margin-bottom: 4px;
}

.summary_date:has(p) .u--accordion-head {
	padding-right: 16px;
}

.summary_note {
	display: none;
	color: var(--color-grey-dark);
	font-size: 12px;
}

.summary_nav {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	gap: 16px;
}

.summary_nav li {
	width: calc((100% - 16px) / 2);
}

.summary_nav li a {
	position: relative;
	width: 100%;
	padding-left: 8px;
	padding-right: 8px;
	border-radius: 24px;
	font-size: 14px;
	line-height: 1;
}

.summary_nav li a::after {
	position: absolute;
	top: 50%;
	right: 8px;
	translate: 0 -50%;
	color: var(--color-black);
	font-family: 'icomoon';
	content: '\e94f';
}

@media screen and (min-width:1024px) {
	.summary hgroup h1 {
		font-size: 28px;
	}
	.summary_date {
		font-size: 14px;
	}
	.summary_nav {
		gap: 32px;
	}
	.summary_nav li {
		width: calc((100% - 96px) / 4);
	}
	.summary_nav li a {
		padding-left: 16px;
		padding-right: 16px;
		font-size: 18px;
	}
	.summary_nav li a::after {
		right: 16px;
	}
}










/* =====================================================
--------------------------------------------------------
基本情報（共通）
--------------------------------------------------------
===================================================== */

.overview {
	display: flex;
	flex-flow: row wrap;
	gap: 16px;
	margin-left: auto;
	margin-right: auto;
	padding-bottom: 16px;
	width: 100%;
	max-width: 1024px;
}

.overview > div {
	margin: 0 auto;
	width: 100%;
	max-width: 400px;
}

@media screen and (min-width:768px) {
	.overview {
		padding: 32px 24px 24px;
	}
}

@media screen and (min-width:1024px) {
	.overview {
		padding-left: 0;
		padding-right: 0;
	}
	.overview > div:has(.room-vacant),
	main:has(.build-hgroup) .overview > div:not(:has(.detail_info)) {
		width: 320px;
	}
}



/* 画像なし */
.overview .detail_noimage {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-bottom: 16px;
	height: 275px;
	background: var(--color-grey-pale);
}

@media screen and (min-width: 768px) {
	.overview .detail_noimage {
		height: 234px;
	}
}


/* 連動型のslick */
.room-interlock > div {
	margin-bottom: 8px;
	margin-bottom: 16px;
}

.room-interlock > .cassette,
.room-interlock > .cassette .slick-track,
.room-interlock > .cassette .slick-slide {
	height: 275px;
	background: var(--color-grey-pale);
}

.room-interlock > .cassette .slick-slide img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.detail-thumb-cassette {
	/* height: 74px; */
}

.detail-thumb-cassette .cassette_slick,
.detail-thumb-cassette .slick-list,
.detail-thumb-cassette .slick-track {
	/* height: 100%; */
}

.detail-thumb-cassette .slick-slide {
	margin: 0 4px;
	/* height: 74px; */
	aspect-ratio: 1 / 1;
	background: var(--color-grey-pale);
}

.detail-thumb-cassette .slick-slide img {
	width: 100%;
	/* height: 74px; */
	height: 100%;
	object-fit: contain;
}

.detail-thumb-cassette .slick-current {
	position: relative;
}

.detail-thumb-cassette .slick-current::after {
	position: absolute;
	width: 100%;
	height: 100%;
	border: 3px solid var(--color-housecom-blue);
	content: '';
}

.detail-thumb-cassette .cassette_prev,
.detail-thumb-cassette .cassette_next {
	display: none !important;
}

@media screen and (min-width: 768px) {
	.room-interlock > .cassette,
	.room-interlock > .cassette .slick-track,
	.room-interlock > .cassette .slick-slide {
		height: 234px;
	}
	.detail-thumb-cassette {
		padding-left: 0;
	}
}

/* slickサムネイルの調整用（JS連動） */
:not(.over) .detail-thumb-cassette .slick-track {
	margin: 0;
}

.over .detail-thumb-cassette .slick-track {
	display: flex;
	translate: -11vw 0;
	width: fit-content;
	gap: 0 8px;
}

.over .detail-thumb-cassette .slick-slide {
	float: none;
}

@media screen and (min-width: 768px) {
	.over .detail-thumb-cassette .slick-track {
		translate: 0;
	}
}



/* テーブルリスト */
.overview_overview[class] {
	margin-left: 16px;
	margin-right: 16px;
	width: calc(100% - 32px);
	max-width: 1024px;
}

main:has(.room-tag) .overview:not(:has(.room-vacant)) .overview_overview[class] {
	margin-top: 16px;
	width: 100%;
}

@media screen and (min-width:768px) {
	.overview .detail_info {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}
}

@media screen and (min-width:1024px) {
	.overview h2 {
		display: none;
	}
	.overview_overview[class] {
		margin: 0;
		width: calc(100% - 16px - 320px);
	}
}



/* 学区データ */
.school-data {
	display: flex;
	flex-direction: column;
	align-items: flex-end;
	margin-left: auto;
	width: 100%;
}

.school-data dt {
	display: inline-block;
	margin-bottom: 8px;
	padding-right: 24px;
	text-align: right;
}

@media screen and (min-width:768px) {
	.school-data {
		padding-right: 24px;
	}
}

@media screen and (min-width:1024px) {
	.school-data {
		padding-right: 16px;
		max-width: 512px;
	}
}















/* =====================================================
--------------------------------------------------------
テーブルリスト（共通）
--------------------------------------------------------
===================================================== */

.detail_info {
	margin-bottom: 16px;
	width: 100%;
}

.detail_info tbody {
	display: flex;
	flex-flow: row wrap;
	column-gap: 16px;
	border-radius: 8px;
	border: 1px solid var(--color-grey-origin);
	background: #fff;
}

.detail_info tr {
	display: flex;
	flex-direction: row;
	align-items: center;
	gap: 16px;
	position: relative;
	width: 100%;
}

.detail_info tr:has(+ tr) {
	border-bottom: 1px solid var(--color-grey-origin);
}

.detail_info th {
	padding: 16px 0 16px 16px;
	width: calc(5em + 16px);
	text-align: left;
}

.detail_info th:has(wbr) {
	word-break: keep-all;
	overflow-wrap: break-word;
}

.detail_info th span {
	display: block;
}

.detail_info td {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	gap: 0 8px;
	padding: 8px 16px 8px 0;
	width: calc(100% - 5em - 32px);
	word-break: break-word;
	overflow-wrap: anywhere;
}

.detail_info td:has(.c--link-cv) {
	justify-content: space-between;
}

.detail_info td:has(.detail_info_vacant) {
	justify-content: space-between;
}

.detail_info a:not(:is(.c--link-cv)) {
	color: var(--color-link-text);
}

.detail_info td > div {
	display: flex;
	flex-flow: row wrap;
	align-items: center;
	gap: 0 8px;
	width: 100%;
}

.detail_info td > div > span,
.detail_info td > div > h4 {
	width: 3em;
}



/* 値段 */
.detail_info_price:not(:has(> span)),
.detail_info_price:not(.initial-cost) span {
	font-weight: bold;
}

.detail_info_price:is(.initial-cost) {
	font-size: initial;
}

.detail_info_price:is(.initial-cost) span + span:has(strong) {
	font-weight: bold;
}

.detail_info_price:not(.initial-cost) strong,
.detail_info_price:is(.initial-cost) span + span:has(strong) strong {
	font-size: 22px;
}

.detail_info td > div > span.detail_info_price {
	width: calc(100% - 3em - 8px);
}

@media screen and (min-width:1024px) {
	.detail_info_price:not(.initial-cost) strong,
	.detail_info_price:is(.initial-cost) span + span:has(strong) strong {
		font-size: 24px;
	}
}



/* 駅 */
.detail_info_station li a:nth-of-type(1) {
	margin-right: 4px;
}



/* 空室 */
.detail_info_vacant {
	justify-content: space-between;
	color: var(--color-link-cv);
	font-weight: bold;
}

.detail_info_vacant strong {
	font-size: 24px;
}

.detail_info_vacant .c--link-text-spot {
	margin-right: 20px;
}

.detail_info_vacant .c--link-text-spot::after {
	right: -20px;
	font-weight: normal;
}



/* CVリンク */
.detail_info .c--link-cv {
	padding: 4px 8px;
	width: auto;
	min-height: unset;
	font-size: 12px;
	text-align: left;
	word-break: keep-all;
	overflow-wrap: break-word;
}

@media (any-hover:hover) {
	.detail_info a:not(:is(.c--link-cv)):hover {
		text-decoration: underline;
	}
}

@media screen and (min-width:1024px) {
	.detail_info tr:not(:is(.full)) {
		width: calc((100% - 16px) / 2);
	}
	.detail_info tr:nth-last-of-type(2) {
		border-bottom: none;
	}
	.detail_info .c--link-cv {
		padding: 8px 16px;
		width: min-content;
		font-size: 14px;
	}

	/* {{yonezawa 20250925 テーブルのボーダーを調整（2分するか否か）}} */
	/* .detail_info tr:not(:first-of-type):is(.full)::before {
		position: absolute;
		top: -1px;
		left: 0;
		width: 100%;
		height: 1px;
		border-top: 1px solid var(--color-grey-origin);
		content: '';
	}
	.detail_info tr:has(+ .full) + .full::after {
		position: absolute;
		bottom: -1px;
		left: 50%;
		translate: -50% 0;
		width: 16px;
		height: 1px;
		background: #fff;
		content: '';
	} */

	.detail_info td {
		padding: 16px 16px 16px 0;
	}
}










/* =====================================================
--------------------------------------------------------
拡大表示（共通）
--------------------------------------------------------
===================================================== */

.dialog::backdrop {
	opacity: 0.5;
	background: var(--color-black);
}

.dialog {
	display: none;
	align-items: center;
	top: calc(50% - 24px);
	left: 50%;
	opacity: 0;
	z-index: -1;
	translate: -50% -50%;
	width: 100%;
	max-width: 864px;
	border: none;
	background: transparent;
}

.dialog[open] {
	display: flex;
	flex-direction: column;
	opacity: 1;
	z-index: 4;
}



/* 虫眼鏡 */
.overview .cassette .u--icon-zoom,
.room-building .cassette .u--icon-zoom {
	display: none;
}

@media screen and (min-width:1024px) {
	.overview .cassette .u--icon-zoom,
	.room-building .cassette .u--icon-zoom {
		display: block;
	}
	.room-madori > div .u--icon-zoom {
		display: none;
	}
}

.cassette .u--icon-zoom::after,
.room-madori > div .u--icon-zoom::after {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	bottom: 4px;
	right: 4px;
	width: 32px;
	height: 32px;
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.6);
	font-family: 'icomoon';
	font-size: 24px;
	content: '\e985';
	cursor: pointer;
}



/* 閉じる */
.dialog div:has(.dialog-close) {
	margin-bottom: 10px;
	width: calc(100% - 64px);
	line-height: 0;
	text-align: right;
}

.dialog-close {
	display: inline-block;
	position: relative;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background: #fff;
	cursor: pointer;
}

.dialog-close::before {
	position: absolute;
	top: 50%;
	left: 50%;
	translate: -50% -50%;
	font-size: 32px;
	font-family: 'icomoon';
	content: '\e92d';
}



/* スライダー */
.dialog .cassette:is(.js--dialogContents) {
	width: calc(100% - 32px * 2);
	height: fit-content;
}

.dialog .cassette:is(.js--dialogContents) .slick-slide {
	aspect-ratio: 8 / 6;
	background: var(--color-grey-pale);
}

/* {{-- yonezawa 20251030 部屋ページ SP 間取り画像のポップアップ表示 --}} */
.room-madori .dialog:open .cassette:is(.js--dialogContents) .slick-track,
.room-madori .dialog:open .cassette:is(.js--dialogContents) .slick-slide {
	width: 100% !important;
}

.dialog .cassette:is(.js--dialogContents) .cassette_prev {
	left: -32px;
	width: 32px;
	border-radius: 8px 0 0 8px;
	background: #fff;
}

.dialog .cassette:is(.js--dialogContents) .cassette_next {
	right: -32px;
	width: 32px;
	border-radius: 0 8px 8px 0;
	background: #fff;
}

@media screen and (min-width:1024px) {
	.dialog .cassette:is(.js--dialogContents) {
		width: 800px;
		max-width: unset;
	}
	.cassette_caption + .u--icon-zoom::after {
		bottom: 10px;
		right: 10px;
	}
	.dialog .cassette:is(.js--dialogContents) .slick-slide[class] {
		height: 600px;
	}
}










/* =====================================================
--------------------------------------------------------
追従（共通）
--------------------------------------------------------
===================================================== */

.floating {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	gap: 16px;
	position: fixed;
	z-index: 3;
	left: 0;
	bottom: 0;
	padding: 8px 16px;
	width: 100%;
	background: #fff;
}

.floating a {
	flex-direction: column;
	padding: 4px 4px 4px 32px;
	width: calc((100% - 16px) / 2);
	max-width: 164px;
}

.floating a::before {
	left: 4px;
	font-family: 'icomoon';
	font-size: 24px;
}

.floating a:nth-of-type(1)::before {
	content: '\e928';
}

.floating a:nth-of-type(2)::before {
	content: '\e927';
}

.floating a > span {
	font-size: 12px;
}

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

@media screen and (min-width:375px) {
	.floating a {
		padding: 4px 12px 4px 48px;
	}
	.floating a::before {
		left: 16px;
	}
}

@media screen and (min-width:768px) {
	.floating {
		display: none;
	}
	/* 追従を最下部表示しているときに、余白を確保する */
	body:has(.floating) footer {
		margin-bottom: 0;
	}
}




















/* === 部屋詳細の固有でroom- === */

/* =====================================================
--------------------------------------------------------
特徴タグ
--------------------------------------------------------
===================================================== */

/* タグ */
.room-tag {
	display: flex;
	flex-flow: row wrap;
	align-items: flex-start;
	gap: 16px;
	margin-bottom: 16px;
}

.room-tag li {
	overflow: hidden;
	width: calc((100% - 16px) / 2);
	border-radius: 4px;
	border: 1px solid var(--color-grey-origin);
	background: #fff;
}

.room-tag li a {
	display: flex;
	flex-direction: column-reverse;
	justify-content: flex-end;
	height: 100%;
	color: var(--color-link-text);
}

.room-tag li a h3 {
	display: inline-block;
	position: relative;
	padding: 8px 8px 8px 24px;
	text-align: center;
}

.room-tag li a h3::before {
	position: absolute;
	top: 50%;
	left: 8px;
	translate: 0 -50%;
	color: var(--color-link-text);
}

.room-tag li a div {
	min-height: 80px;
	/* 画像の背景色pale→white */
	background: var(--color-grey-pale);
}

.room-tag li a div img {
	width: 100%;
	aspect-ratio: 2 / 1 ;
	object-fit: cover;
}

@media screen and (min-width:1024px) {
	.room-tag {
		gap: 24px;
		margin-bottom: 24px;
	}
	.room-tag li {
		width: calc((100% - 72px) / 4);
	}
	.room-tag li a h3 {
		padding: 16px 24px;
	}
}



/* 詳細説明 */
.room-tag-info {
	align-items: flex-start;
	gap: 8px;
}

.room-tag-info > div {
	display: flex;
	flex-direction: row;
	gap: 8px;
}

.room-tag-info > div h3 {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	padding: 4px;
	width: 70px;
	border-radius: 4px;
	border: 1px solid var(--color-grey-origin);
	background: #f4f4f4;
	font-weight: bold;
}

.room-tag-info > div h3:has(wbr) {
	word-break: keep-all;
	overflow-wrap: break-word;
}

.room-tag-info > div h3 span {
	display: block;
}

.room-tag-info > div p {
	width: calc(100% - 70px);
}

@media screen and (min-width:1024px) {
	.room-tag-info {
		gap: 24px;
	}
	.room-tag-info > div {
		gap: 16px;
	}
	.room-tag-info > div h3 {
		padding: 8px;
		width: 120px;
		text-align: center;
	}
	.room-tag-info > div p {
		width: calc(100% - 120px);
	}
}










/* =====================================================
--------------------------------------------------------
この物件にお問い合わせ
--------------------------------------------------------
===================================================== */

.u--inner:has(.room-vacant) {
	padding: 0;
}

.room-vacant {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	margin: 0 auto;
	max-width: 400px;
	background: var(--color-housecom-blue-light);
}

.room-vacant > p {
	display: none;
}



/* 左側（PCのみ） */
.room-vacant_form {
	padding: 16px 16px 0 16px;
	width: 100%;
	text-align: center;
}

.room-vacant_form > p,
.room-vacant_form > div ,
.room-vacant_shop {
	display: none;
}

.room-vacant_form > div input {
	margin-right: 8px;
}

.room-vacant .c--link-cv-primary {
	justify-content: center;
	padding: 4px 0;
	width: 100%;
}

.room-vacant .c--link-cv-primary > span {
	display: flex;
	align-items: center;
	margin: 0 auto;
	padding: 8px 0;
	position: relative;
}

.room-vacant .c--link-cv-primary > span:not(:is(.u--icon-mail)) {
	font-size: 20px;
}

.room-vacant .c--link-cv-primary > span:not(:is(.u--icon-mail))::after {
	position: absolute;
	top: 50%;
	right: -8px;
	translate: 0 -50%;
	width: 1px;
	height: 100%;
	background: #fff;
	content: '';
}

.room-vacant .c--link-cv-primary > span:is(.u--icon-mail) {
	justify-content: center;
	min-width: calc(100% - 78px);
	font-size: 18px;
}

.room-vacant .c--link-cv-primary > span:is(.u--icon-mail)::before {
	margin-right: 8px;
	color: #fff;
	font-size: 24px;
}

.room-vacant .c--link-cv-primary > span:is(.u--icon-mail) span:nth-of-type(2) {
	display: none;
}

@media screen and (min-width:375px) {
	.room-vacant .c--link-cv-primary > span {
		padding: 8px 16px;
	}
	.room-vacant .c--link-cv-primary > span:not(:is(.u--icon-mail))::after {
		right: 0;
	}
	.room-vacant .c--link-cv-primary > span:is(.u--icon-mail)::before {
		margin-right: 16px;
	}
}

@media screen and (min-width:1024px) {
	.room-vacant .c--link-cv-primary > span:is(.u--icon-mail) span:nth-of-type(1) {
		display: none;
	}
	.overview > div:has(.room-vacant) .room-vacant .c--link-cv-primary > span:is(.u--icon-mail) span:nth-of-type(1) {
		display: block;
	}
	.room-vacant .c--link-cv-primary > span:is(.u--icon-mail) span:nth-of-type(2) {
		display: block;
	}
}



/* 右側 */
.room-vacant div:has(.room-vacant_shop) {
	padding: 16px;
	width: 100%;
}

.room-vacant_action {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.room-vacant_action > div,
.room-vacant_share {
	display: flex;
	gap: 16px;
}

.room-vacant_action > div a,
.room-vacant_share {
	display: flex;
	align-items: center;
	font-size: 32px;
}

.room-vacant .c--link-cv {
	padding: 4px 12px 0 44px;
	width: auto;
	font-size: 18px;
	cursor: pointer;
}

.room-vacant .u--icon-heart::before {
	left: 16px;
	color: var(--color-link-cv);
	font-size: 24px;
	content: "\e92a";
}

.room-vacant .u--icon-heart.added::before {
	content: "\e92b";
}

@media (any-hover:hover) {
	.room-vacant .u--icon-heart:hover::before {
		color: #fff;
	}
}



/* 基本情報のみ特別 */
.overview .room-vacant {
	align-items: center;
	gap: 16px 0;
	padding: 16px;
}
.overview .room-vacant .c--link-cv-primary > span:is(.u--icon-mail) {
	flex-flow: row wrap;
}

@media (any-hover:hover) {
	.room-vacant .c--link-cv-primary:hover > span:not(:is(.u--icon-mail))::after {
		background: var(--color-link-cv)
	}
	.room-vacant .c--link-cv-primary:hover > .u--icon-mail::before{
		color: var(--color-link-cv);
	}
}

@media screen and (min-width:1024px) {
	.room-vacant {
		max-width: unset;
	}
	.room-vacant > p {
		display: block;
		padding: 8px;
		width: 100%;
		background: var(--color-housecom-blue);
		color: #fff;
		font-size: 20px;
		font-weight: bold;
		text-align: center;
	}
	.room-vacant > div {
		width: fit-content;
	}
	.room-vacant_form {
		padding: 24px 0 24px 24px;
	}
	.room-vacant_form > p {
		display: block;
		font-weight: bold;
	}
	.room-vacant_form > div {
		display: block;
		margin: 16px 0 8px;
		font-size: 14px;
	}
	.room-vacant_form > div label:not(:last-of-type) {
		margin-right: 24px;
	}
	.room-vacant_form .c--link-cv-primary { 
		width: fit-content;
	}
	.room-vacant_form .c--link-cv-primary > span:has(.u--icon-mail) span:nth-of-type(1) {
		display: none;
	}
	.room-vacant_form .c--link-cv-primary > span:has(.u--icon-mail) span:nth-of-type(2) {
		display: block;
	}
	.room-vacant > div:has(.room-vacant_shop) {
		padding: 24px 24px 24px 0;
		max-width: 320px;
	}
	.room-vacant_shop {
		display: block;
		margin-bottom: 20px;
		font-size: 14px;
	}
	.room-vacant_shop .u--icon-phone {
		margin-bottom: 8px;
		color: var(--color-link-cv);
		font-size: 32px;
		font-weight: bold;
	}
	.room-vacant_shop .u--icon-phone::before {
		margin-right: 8px;
		color: var(--color-link-cv);
	}
	.room-vacant_shop_name {
		margin-bottom: 4px;
		font-size: 16px;
		font-weight: bold;
	}
	/* 基本情報のみ特別 */
	.overview .room-vacant .c--link-cv {
		padding-left: 40px;
	}
	.overview .room-vacant .c--link-cv > span:nth-of-type(2) span:nth-of-type(2) {
		display: block;
	}
	.overview .room-vacant .c--link-cv::before {
		left: 12px;
	}
	.overview .room-vacant .c--link-cv-primary > span:is(.u--icon-mail) {
		position: relative;
		padding-left: 76px;
		max-width: 180px;
	}
	.overview .room-vacant .c--link-cv-primary > span:is(.u--icon-mail)::before {
		position: absolute;
		top: 50%;
		left: 40px;
		translate: 0 -50%;
	}
}



/* 取扱い店舗ページへ */
.u--inner:has(.room-selectshop) {
	padding-top: 16px;
	padding-bottom: 16px;
}

.room-selectshop {
	margin: 0 auto;
	width: 100%;
	max-width: 500px;
}

.room-selectshop a {
	justify-content: flex-start;
	padding: 16px;
	border-radius: 8px;
	text-align: left;
}

.room-selectshop a p {
	margin-bottom: 4px;
	color: var(--color-black);
	font-size: 16px;
	font-weight: bold;
}

.room-selectshop a span {
	position: relative;
	padding-right: 32px;
	width: 100%;
	font-size: 20px;
}

.room-selectshop a span::after {
	display: flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 50%;
	right: 0;
	translate: 0 -50%;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--color-housecom-green);
	color: var(--color-black);
	font-family: 'icomoon';
	font-size: 10px;
	font-weight: bold;
	content: '\e90d';
}










/* =====================================================
--------------------------------------------------------
間取り・設備
--------------------------------------------------------
===================================================== */

/* 間取り */
.room-madori {
	display: flex;
	flex-flow: row-reverse wrap;
	gap: 8px;
	padding: 16px 8px;
	border-radius: 8px;
	border: 1px solid var(--color-grey-origin);
	background: #fff;
}

.room-madori > div:is(:not(.room-madori_info)) {
	position: relative;
	width: 160px;
	height: 120px;
}

.room-madori > div:is(:not([class])) {
	display: flex;
	justify-content: center;
	align-items: center;
	background: var(--color-grey-pale);
}

.room-madori > div .slick-slide,
.room-equip > div:is(.cassette) .slick-slide {
	height: 120px;
	background: var(--color-grey-pale);
}

.room-madori > div:is(:not(.room-madori_info)) img,
.room-madori > div .slick-slide img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.room-madori .slick_single .cassette_prev,
.room-madori .slick_single .cassette_next {
	width: 20px;
	height: 36px;
	font-size: 12px;
}

.room-madori_info {
	display: flex;
	flex-direction: column;
	justify-content: center;
	width: 100%;
}

.room-madori_info:has(+ div) {
	max-width: calc(100% - 8px - 160px);
}

.room-madori_info p:not(:last-of-type) {
	margin-bottom: 4px;
}

@media screen and (min-width:1024px) {
	.room-madori {
		gap: 24px;
		padding: 24px;
	}
	.room-madori > div:is(:not(.room-madori_info)),
	.room-madori > div .slick-slide {
		width: 500px;
		height: 375px;
	}
	.room-madori .slick_single .cassette_prev,
	.room-madori .slick_single .cassette_next {
		width: 28px;
		height: 48px;
		font-size: 16px;
	}
	.room-madori_info:has(+ div) {
		width: calc((100% - 24px - 500px));
	}
	.room-madori_info p:not(:last-of-type) {
		margin-bottom: 8px;
	}
}



/* 設備 */
.c--flex-1-2:has(.room-equip) {
	align-items: flex-start;
	margin-bottom: 16px;
}

.room-equip {
	display: flex;
	align-items: flex-start;
	gap: 8px;
	padding: 16px;
	border-radius: 8px;
	border: 1px solid var(--color-grey-origin);
	background: #fff;
}

.room-equip > div {
	width: 100%;
}

.room-equip:has(.cassette) > div {
	width: calc((100% - 8px) / 2);
}

.room-equip > div:not(:is(.cassette)) {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

.room-equip > div:not(:is(.cassette)) h3 {
	flex-shrink: 0;
	flex-basis: 100%;
	width: 100%;
	font-size: 16px;
	font-weight: bold;
}

.room-equip:not(:has(.cassette)) > div p:has(~ .cassette) {
	width: calc((100% - 8px) / 2);
}

.room-equip .cassette {
	height: 120px;
}

.room-equip .slick_single .cassette_prev,
.room-equip .slick_single .cassette_next {
	width: 20px;
	height: 36px;
	font-size: 12px;
}

.room-equip > div:not(:is(.cassette)) div {
	display: flex;
	flex-direction: column;
	gap: 4px;
}

.room-equip:has(.cassette) > div:is(.cassette) .slick-slide img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

@media screen and (min-width: 768px) {
	.c--flex-1-2:has(.room-equip) > * {
		width: calc((100% - 24px) / 2);
	}
}

@media screen and (min-width:1024px) {
	.c--flex-1-2:has(.room-equip) {
		margin-bottom: 24px;
	}
	.room-equip {
		padding: 24px;
	}
	.room-equip:has(.cassette) > div:not(:is(.cassette)) {
		width: calc(100% - 8px - 228px);
	}
	.room-equip > div:not(:is(.cassette)) h3 {
		font-size: 20px;
	}
	.room-equip:has(.cassette) > div:is(.cassette) {
		width: 228px;
	}
	.room-equip .cassette,
	.room-equip > div:is(.cassette) .slick-slide {
		height: 170px;
	}
}










/* =====================================================
--------------------------------------------------------
賃貸契約情報
--------------------------------------------------------
===================================================== */

@media screen and (min-width:1024px) {
	div:has(.room-vacant) + div .detail_info:not(:has(.c--link-cv)) tr {
		gap: 16px;
	}

	div:has(.room-vacant) + div .detail_info:not(:has(.c--link-cv)) tr:not(:is(.full)) th {
		padding-left: 24px;
		width: calc(5em + 48px);
	}

	div:has(.room-vacant) + div .detail_info:not(:has(.c--link-cv)) tr:not(:is(.full)) td {
		width: calc(100% - 5em - 32px);
	}
}










/* =====================================================
--------------------------------------------------------
建物情報
--------------------------------------------------------
===================================================== */

.room-building {
	display: flex;
	flex-flow: row wrap;
	align-items: flex-start;
	gap: 16px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 16px;
	padding-bottom: 16px;
	width: 100%;
	max-width: 1024px;
}

.room-building h2 {
	order: 1;
}

.room-building .detail_info {
	order: 3;
}

.room-building h2,
.room-building .detail_info {
	margin-left: auto;
	margin-right: auto;
	margin-bottom: 0;
	width: calc(100% - 32px);
	max-width: 1024px;
}

.room-building > div {
	order: 2;
	width: 100%;
	text-align: center;
}



/* 画像 */
.room-building .cassette,
.room-building div:has(> img) {
	margin: 0 auto 16px;
	height: 275px;
	background: var(--color-grey-pale);
}

.room-building div:has(> img) {
	display: flex;
	justify-content: center;
	align-items: center;
	background: #fff;
}

.room-building .slick-slide {
	height: 275px;
	background: var(--color-grey-pale);
}

.room-building .cassette .slick-slide img,
.room-building div:has(> img) img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}


/* その他 */
.room-building .c--link-main {
	margin: 0 auto;
	padding-left: 32px;
	padding-right: 40px;
}

.room-building .c--link-main::before {
	right: 16px;
}

.room-building .school-data {
	order: 4;
	margin-left: auto;
	margin-right: unset;
	padding: 0 16px;
}

@media screen and (min-width:768px) {
	.room-building .school-data {
		padding-left: 24px;
		padding-right: 24px;
	}
	.room-building h2 {
		/* margin-left: unset; */
		margin-bottom: 24px;
		padding: 0 24px;
		width: calc(100% - 48px);
	}
	.room-building .detail_info:has(~ div) {
		margin-bottom: 16px;
		width: calc(100% - 48px);
	}
	.room-building .cassette {
		margin: 0 auto 24px;
		max-width: 400px;
		height: 234px;
	}	
	.room-building .slick-slide {
		height: 234px;
	}
	/* #building .cassette {
		max-width: 400px;
	} */
}

@media screen and (min-width:1024px) {
	.room-building {
		gap: 0 16px;
		padding-top: 32px;
		padding-bottom: 32px;
	}
	.room-building .detail_info:has(~ div) {
		width: calc(100% - 16px - 320px);
	}
	.room-building > div {
		width: 320px;
	}
}










/* =====================================================
--------------------------------------------------------
この物件に問い合わせ（個人情報の取得）
--------------------------------------------------------
===================================================== */

.room-contact {
	margin: 16px auto;
	width: 100%;
	max-width: 1024px;
}

.room-contact h2 {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	padding: 16px;
	min-height: calc(50px + 32px);
	background-color: var(--color-link-cv);
	color: #fff;
	font-size: 18px;
	font-weight: bold;
}

.room-contact h2::before {
	position: absolute;
	top: 50%;
	right: 16px;
	translate: 0 -50%;
	color: #fff;
	font-size: 24px;
}

.room-contact h2 span {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	position: absolute;
	top: 50%;
	left: 16px;
	translate: 0 -50%;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	background: #fff;
	color: var(--color-link-cv);
	font-size: 18px;
}



/* 部屋情報 */
.room-contact > dl {
	display: flex;
	flex-flow: row wrap;
	gap: 16px 8px;
	padding: 16px 27px 16px 27px;
	border-right: 5px solid var(--color-link-cv);
	border-left: 5px solid var(--color-link-cv);
	background: #fff;
}

.room-contact > dl > dt {
	width: 100%;
	font-size: 16px;
	font-weight: bold;
}

.room-contact > dl > dd:not(:is(.room-contact_info)) {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100px;
	height: 100px;
	/* 画像の背景色pale→white */
	background: var(--color-grey-pale);
}

.room-contact > dl > dd:not(:is(.room-contact_info)) img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.room-contact_info {
	width: calc(100% - 100px - 8px);
}

.room-contact_info > span:has(strong) {
	font-size: 14px;
	font-weight: bold;
}

.room-contact_info > span:has(strong) strong {
	font-size: 20px;
}

.room-contact_info > span:has(strong) span {
	font-size: 12px;
	font-weight: normal;
}

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

.room-contact_info > dl div {
	display: flex;
	gap: 8px;
	width: calc((100% - 16px) / 2);
}

.room-contact_info > dl div dt {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 20px;
	background: var(--color-grey-pale);
	line-height: 1;
}

@media screen and (min-width:1024px) {
	.room-contact {
		margin: 32px auto;
	}
	.room-contact h2 {
		font-size: 24px;
	}
	.room-contact h2::before {
		right: 212px;
	}
	.room-contact h2 span {
		left: 212px;
	}
	.room-contact > dl {
		gap: 8px 16px;
		padding: 24px 207px;
	}
	.room-contact > dl > dt {
		font-size: 18px;
	}
	.room-contact_info {
		width: calc(100% - 100px - 16px);
	}
	.room-contact_info > span:has(strong) {
		font-size: 18px;
	}	
	.room-contact_info > span:has(strong) strong {
		font-size: 24px;
	}	
	.room-contact_info > span:has(strong) span {
		font-size: 18px;
	}
	.room-contact_info > dl {
		gap: 24px;
	}
	.room-contact_info > dl div {
		width: fit-content;
	}
	.room-contact_info > dl div dt {
		width: 24px;
	}
	.room-contact_info > dl div dd {
		font-size: 18px;
	}
}



/* フォーム */
.room-contact > *:has(.room-contact_form) {
	padding: 0 27px 27px 27px;
	border-right: 5px solid var(--color-link-cv);
	border-bottom: 5px solid var(--color-link-cv);
	border-left: 5px solid var(--color-link-cv);
	background: #fff;
}

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

.room-contact_form > .c--select,
.room-contact_form > input:is(.mail) {
	width: 100%;
}

.room-contact_form > input:not(:is(.mail)) {
	width: calc((100% - 16px) / 2);
}

.room-contact > div div:has(.c--link-cv-primary) .c--link-cv-primary {
	padding: 16px 8px;
	font-size: 18px;
}

@media screen and (min-width:1024px) {
	.room-contact_form {
		gap: 24px;
		margin-bottom: 24px;
		padding: 0 180px;
	}
	.room-contact_form > input:not(:is(.mail)) {
		width: calc((100% - 24px) / 2);
	}
	.room-contact > div div:has(.c--link-cv-primary) {
		padding: 0 180px;
	}
}



/* エラー */
.room-contact_form .error-mark {
	border: 4px solid var(--color-link-cv) !important;
}

.room-contact_form .error-text {
	display: none;
	position: relative;
	margin-top: -8px;
	padding-left: 24px;
	width: 100%;
	color: var(--color-link-cv);
	font-size: 18px;
	font-weight: bold;
}

.room-contact_form .error-text.active {
	display: block;
}

.room-contact_form .error-text::before {
	position: absolute;
	top: 50%;
	left: 0;
	translate: 0 -50%;
	color: var(--color-link-cv);
	font-family: 'icomoon';
	font-weight: normal;
	content: '\e93e';
}

@media screen and (min-width:1024px) {
	.room-contact_form .error-text {
		margin-top: -16px;
		font-size: 20px;
	}
}



/* プライバシー */
.room-contact_privacy {
	display: flex;
	flex-direction: column;
	align-items: center;
	margin-bottom: 16px;
}

.room-contact_privacy dt {
	display: inline-block;
	margin-bottom: 8px;
	padding-right: 8px;
	font-size: 16px;
}

.room-contact_privacy dt::after {
	right: -16px;
}

.room-contact_privacy dd {
	font-size: 14px;
}

.room-contact_privacy dd p:not(:last-of-type) {
	margin-bottom: 1em;
}

.room-contact_privacy dd span {
	display: block;
	font-weight: bold;
}

@media screen and (min-width:1024px) {
	.room-contact_privacy {
		margin-bottom: 24px;
	}
}










/* =====================================================
--------------------------------------------------------
取扱い店舗
--------------------------------------------------------
===================================================== */

.room-shop {
	position: relative;
	margin-bottom: 16px;
	border-radius: 8px;
	border: 1px solid var(--color-grey-origin);
	background: #fff;
}

.room-shop > div:has(h3) {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	align-items: flex-start;
	gap: 16px;
	-webkit-tap-highlight-color: transparent;
	/* {{-- yonezawa 20251030 チェックFB No.63 --}} */
	/* {{-- a要素タップ時の挙動を修正 --}} */
	/* position: relative; */
	padding: 16px;
	transition: all 0.5s;
}



/* 会社名 */
.room-shop h3 {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 8px;
	position: relative;
	width: 100%;
	font-size: 18px;
	font-weight: bold;
}

.room-shop h3 span:is(:not(.u--icon-arrow)) {
	width: fit-content;
	max-width: calc(100% - 8px - 24px);
}

.room-shop h3 span:is(.u--icon-arrow) {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--color-housecom-green);
}

.room-shop h3 span:is(.u--icon-arrow)::before {
	color: var(--color-black);
	font-size: 10px;
	font-weight: bold;
}



/* タグ */
.room-shop_tag {
	display: flex;
	gap: 8px;
	position: relative;
	z-index: 1;
	width: 100%;

	/* {{yonezawa 20251001 [作業リスト 米澤 No.14]}}
		お問い合わせ先・取り扱い店舗カセットの店舗タグの崩れを修正 */
	flex-wrap: wrap;
}

.room-shop_tag span {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 4px 8px;
	border-radius: 4px;
	border: 1px solid var(--color-grey-origin);
	color: var(--color-link-text);
	font-size: 12px;
	
	/* {{yonezawa 20251001 [作業リスト 米澤 No.14]}}
		お問い合わせ先・取り扱い店舗カセットの店舗タグの崩れを修正 */
	flex-shrink: 0;
}



/* 画像 */
.room-shop_img {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	max-width: 400px;
	height: 100%;
	/* 画像の背景色pale→white */
	background: var(--color-grey-pale);
	aspect-ratio: 4 / 3;
}

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

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

.room-shop_img a::before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	content: '';
	
	/* {{yonezawa 20250925 ホバー時のマウスカーソルの挙動を終始得}} */
	/* z-index: 0; */
	z-index: 1;
}

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

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

.room-shop_img a img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}



/* 詳細 */
.room-shop_info {
	display: inline-flex;
	flex-flow: row wrap;
	gap: 4px 16px;
	width: 100%;
}

.room-shop_info dt {
	width: 5em;
	font-weight: bold;
}

.room-shop_info dd {
	width: calc(100% - 5em - 16px);
}

.room-shop_info dd span {
	display: block;
}



/* 問い合わせ */
.room-shop_contact {
	display: flex;
	flex-flow: row  wrap;
	justify-content: space-between;
	gap: 16px;
	margin: 0 auto 16px;
	padding: 0 16px;
	width: 100%;
	max-width: 430px;
	/* {{-- yonezawa 20251030 チェックFB No.63 --}} */
	/* {{-- a要素タップ時の挙動を修正 --}} */
	position: relative;
    z-index: 1;
}

.room-shop_contact a {
	width: 100%;
}

.room-shop_contact a::before {
	left: 8px;
	font-size: 24px;
}

.room-shop_contact a.u--icon-phone {
	flex-flow: row wrap;
	padding: 4px 8px 4px 40px;
}

.room-shop_contact a.u--icon-phone span,
.room-shop_contact a.u--icon-mail span:nth-of-type(3) {
	display: block;
	font-size: 12px;
}

.room-shop_contact a.u--icon-mail {
	padding: 4px 8px 4px 40px;
}

.room-shop_contact a.u--icon-mail span:nth-of-type(1),
.room-shop_contact a.u--icon-mail span:nth-of-type(2) {
	display: none;
}

.room-shop_contact a:has(.u--icon-shop) {
	padding: 4px 8px;
	width: 100%;
	word-break: keep-all;
	overflow-wrap: break-word;
}

.room-shop_contact a:has(.u--icon-shop) .u--icon-shop {
	padding-left: 32px;
	width: 100%;
}

.room-shop_contact a:has(.u--icon-shop) .u--icon-shop::before,
.room-shop_contact a:has(.u--icon-shop) .u--icon-shop::after {
	left: 0;
	font-size: 24px;
	color: #fff;
}



/* 番号 */
.room-shop_number {
	padding: 0 16px 16px 16px;
	color: var(--color-grey-dark);
}

@media (any-hover:hover) {
	.room-shop h3,
	.room-shop_img,
	.room-shop_info {
		transition: all 0.5s;
	}
	.room-shop > div:has(h3):has(.room-shop_img a:hover) h3,
	.room-shop > div:has(h3):has(.room-shop_img a:hover) .room-shop_info {
		opacity: 0.5;
	}
	.room-shop_contact a:has(.u--icon-shop):hover .u--icon-shop::before,
	.room-shop_contact a:has(.u--icon-shop):hover .u--icon-shop::after {
		color: var(--color-link-cv);
	}
}

@media screen and (min-width:375px) {
	.room-shop_contact a.u--icon-phone {
		width: 170px;
	}	
	.room-shop_contact a.u--icon-mail {
		width: calc(100% - 16px - 170px);
	}
}

@media screen and (min-width:425px) {
	.room-shop_contact a.u--icon-phone {
		width: calc((100% - 16px) / 2);
		min-width: 170px;
	}
	.room-shop_contact a.u--icon-mail {
		width: calc((100% - 16px) / 2);
		min-width: 120px;
	}
}

@media screen and (min-width:768px) {
	.room-shop {
		margin-bottom: 24px;
	}
	.room-shop > div:has(h3) {
		display: grid;
		/* {{yonezawa 20251001 [作業リスト 米澤 No.14]}}
			お問い合わせ先・取り扱い店舗カセットの店舗タグの崩れを修正 */
		/* grid-template-columns: 320px 1fr 1fr 1fr; */
		grid-template-columns: 320px 1fr;
		padding: 24px;
	}
	.room-shop h3 {
		grid-area: 1 / 1 / 2 / 3;
		justify-content: flex-start;
		padding: 0;
		font-size: 20px;
	}
	.room-shop h3 span:not(:is(.u--icon-arrow)) {
		max-width: calc(100% - 8px - 24px);
	}
	.room-shop h3 span:is(.u--icon-arrow) {
		position: relative;
	}
	.room-shop_tag {
		grid-area: 2 / 1 / 3 / 3;
	}
	.room-shop_tag span {
		padding: 0 8px;
		height: 32px;
		font-size: 16px;
	}
	.room-shop_img {
		grid-area: 3 / 1 / 4 / 2;
	}
	.room-shop_info {
		grid-area: 3 / 2 / 4 / 3;
		gap: 16px;
	}
	.room-shop_contact {
		flex-flow: nowrap;
		padding: 0 24px;
		max-width: unset;
	}
	.room-shop_contact a {
		padding: 0 8px;
	}
	.room-shop_contact a.u--icon-phone {
		padding-left: 0;
		width: 320px;
		border: none;
		background: #fff;
		color: var(--color-link-cv);
		font-size: 32px;
	}
	.room-shop_contact a.u--icon-phone::before {
		left: 0;
		color: var(--color-link-cv);
		font-size: 32px;
	}
	.room-shop_contact a.u--icon-phone span {
		display: none;
	}
	.room-shop_contact a.u--icon-mail,
	.room-shop_contact a:has(.u--icon-shop) {
		width: calc((100% - 320px - 32px) / 2);
		max-width: 310px;
	}
	.room-shop_contact a.u--icon-mail,
	.room-shop_contact a.u--icon-mail span:nth-of-type(3),
	.room-shop_contact a:has(.u--icon-shop) {
		font-size: 16px;
	}
	/* .room-shop_contact a.u--icon-mail,
	.room-shop_contact a:has(.u--icon-shop) {
		flex-direction: row;
	} */
	.room-shop_contact a.u--icon-mail span:nth-of-type(1),
	.room-shop_contact a.u--icon-mail span:nth-of-type(2),
	.room-shop_contact a.u--icon-mail span:nth-of-type(3) {
		display: inline-block;
	}
	.room-shop_number {
		padding: 0 24px 24px 24px;
	}
}

@media screen and (min-width:1024px) {
	.room-shop > div:has(h3) {
		grid-template-columns: 320px 1fr;
	}
	.room-shop h3 {
		grid-area: 1 / 1 / 2 / 2;
	}
	.room-shop_tag {
		grid-area: 1 / 2 / 2 / 3;
		justify-content: flex-end;
	}
	.room-shop_img {
		grid-area: 2 / 1 / 3 / 2;
	}
	.room-shop_info {
		grid-area: 2 / 2 / 3 / 3;
		gap: 16px;
	}
	.room-shop_contact a.u--icon-phone,
	.room-shop_contact a.u--icon-mail {
		padding-top: 0;
		padding-bottom: 0;
	}
}









/* =====================================================
--------------------------------------------------------
CV～したい
--------------------------------------------------------
===================================================== */

.room-want {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	gap: 24px;
	font-size: 12px;
	margin: auto;
}

.room-want .c--link-cv {
	padding: 4px 8px;
	width: auto;
	min-height: unset;
}

.room-want .c--link-main {
	padding: 16px;
	width: 240px;
}

.room-want .c--link-main span {
	display: block;
}

.room-want .c--link-main::before {
	right: 16px;
}

.overview > div:has(.room-want) .room-want {
	margin-bottom: 16px;
}

.overview > div:has(.room-want) .room-want:not(:has(+ .school-data)),
.room-contract .room-want,
.room-shops .room-want {
	width: fit-content;
}

@media screen and (min-width:768px) {
	#dialog_building_image + .room-want {
		margin: 26px auto 16px;
	}
}

@media screen and (min-width:1024px) {
	.room-want {
		justify-content: center;
		font-size: 16px;
	}
	.room-want .c--link-cv {
		padding: 8px 12px;
		min-height: 40px;
	}
	.room-want .c--link-main {
		padding: 16px 24px;
		width: 350px;
	}
	.overview > div:has(.room-want) .room-want {
		margin-bottom: 32px;
	}

	#dialog_building_image + .room-want {
		margin: 0 auto 16px;
	}
}




















/* === 建物詳細の固有でbuild- === */

/* =====================================================
--------------------------------------------------------
上部の概要
--------------------------------------------------------
===================================================== */

/* hgroupの特別仕様 */
.build-hgroup {
	display: flex;
	flex-flow: row wrap;
	align-items: flex-start;
	gap: 16px;
}

.build-hgroup hgroup {
	display: contents;
}

.build-hgroup hgroup h1 {
	margin-bottom: 0;
}


/* {{ yonezawa 20251007 実機（Android）検証結果からの修正 }} */
/* {{ 建物ページ 「この建物にn件の募集中の賃貸情報があります」のテキストの折り返し }} */
/*
.build-hgroup .c--link-cv {
	display: flex;
	align-items: flex-end;
	padding-top: 0;
	border-radius: 8px;
	border-width: 1px;
	font-size: 16px;
}
.build-hgroup .c--link-cv {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top: 0;
	border-radius: 8px;
	border-width: 1px;
	font-size: 16px;
	word-break: keep-all;
	overflow-wrap: break-word;
}
@media screen and (min-width: 480px) {
	.build-hgroup .c--link-cv {
		flex-direction: row;
		align-items: flex-end;
	}
}
.build-hgroup .c--link-cv > span {
	display: flex;
	align-items: flex-end;
}
*/

.build-hgroup .c--link-cv {
	display: inline-block;
	padding-top: 4px;
	padding-right: 40px;
	border-radius: 8px;
	border-width: 1px;
	font-size: 16px;
	word-break: keep-all;
	overflow-wrap: break-word;
}

.build-hgroup .c--link-cv::before {
	right: 16px;
	rotate: 90deg;
	font-size: 20px;
}

.build-hgroup .c--link-cv > strong {
	font-size: 24px;
	margin-bottom: -2px;
}

@media screen and (min-width:1024px) {
	.build-hgroup {
		gap: 16px 24px;
	}
	.build-hgroup:has(a) p {
		width: calc(100% - 342px - 24px);
	}
	.build-hgroup:has(a) .c--link-cv {
		width: 342px;
	}
	.build-hgroup .c--link-cv {
		padding-top: 0;
		padding-right: 32px;
	}
}




/* navの特別仕様 */
.summary:has(.build-hgroup) .summary_nav {
	gap: 16px 8px;
}

.summary:has(.build-hgroup) .summary_nav li {
	width: calc((100% - 16px) / 3);
	flex-grow: 1;
}

.summary:has(.build-hgroup) .summary_nav li.contact {
	width: 100%;
}

.summary:has(.build-hgroup) .summary_nav li a {
	padding-right: 24px;
}

@media screen and (min-width:1024px) {
	.summary:has(.build-hgroup) .summary_nav {
		flex-wrap: nowrap;
		gap: 32px;
	}
	.summary:has(.build-hgroup) .summary_nav li.contact {
		max-width: 388px;
	}
}










/* =====================================================
--------------------------------------------------------
特徴タグ
--------------------------------------------------------
===================================================== */

.build-tag {
	display: flex;
	flex-flow: row wrap;
	align-items: flex-start;
	gap: 16px;
}

.build-tag li {
	width: calc((100% - 16px) / 2);
	border-radius: 4px;
	border: 1px solid var(--color-grey-origin);
	background: #fff;
	font-size: 16px;
	text-align: center;
}

.build-tag li h3 {
	position: relative;
	transition: all 0.5s;
}

.build-tag li h3::before {
	position: absolute;
	top: 50%;
	left: 8px;
	translate: 0 -50%;
	color: var(--color-link-text);
}

.build-tag li h3 a {
	padding: 8px 8px 8px 32px;
	width: 100%;
	height: 100%;
	color: var(--color-link-text);
}

@media (any-hover:hover) {
	.build-tag li h3:hover,
	.build-tag li h3:hover a::before {
		opacity: 0.5;
	}
}

@media screen and (min-width:1024px) {
	.build-tag {
		gap: 24px;
	}
	.build-tag li {
		width: calc((100% - 72px) / 4);
	}
	.build-tag li h3 a {
		padding: 16px 24px 16px 32px;
	}
}










/* =====================================================
--------------------------------------------------------
募集中・空室情報
--------------------------------------------------------
===================================================== */

.build-vacant_heart,
.thumb-toggle {
	z-index: 2;
	cursor: pointer;
}

.build-vacant_shop,
.build-vacant_thumb-cassette {
	z-index: 2;
}

@media (any-hover:hover) {
	.build-vacant h3,
	.build-vacant_info,
	.build-vacant_time,
	/* {{-- ホバーエフェクトのタイミングを合わせるため修正 --}} */
	/* .build-vacant_madori { */
	.build-vacant_madori div {
		transition: opacity 0.5s;
	}
	.build-vacant h3:has(~ .build-vacant_more:hover),
	.build-vacant_info:has(~ .build-vacant_more:hover),
	.build-vacant_time:has(~ .build-vacant_more:hover),
	.build-vacant_madori:has(~ .build-vacant_more:hover) div {
		opacity: 0.5;
	}
}

.build-vacant {
	position: relative;
	display: grid;
	grid-template-columns: 100px 1fr 24px;
	gap: 8px;
	padding: 8px 8px 16px 8px;
	border-radius: 8px;
	border: 1px solid var(--color-grey-origin);
	background: #fff;
	transition: all 0.5s;
}

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

@media screen and (min-width:1024px) {
	.build-vacant {
		grid-template-columns: 120px 150px 1fr max-content;
		grid-template-rows: 46px 46px 1fr max-content;
		gap: 8px 16px;
		padding: 24px 24px 32px 24px;
	}
	.build-vacant.show {
		grid-template-rows: 46px 46px 1fr 28px 140px;
		padding: 24px;
	}
}



/* 部屋名 */
.build-vacant h3 {
	grid-area: 1 / 1 / 2 / 3;
	display: flex;
	align-items: flex-end;
	color: var(--color-link-text);
	font-size: 18px;
	font-weight: bold;
}

@media screen and (min-width:1024px) {
	.build-vacant h3 {
		grid-area: 1 / 1 / 5 / 5;
		align-items: center;
	}
	.build-vacant.show h3 {
		grid-area: 1 / 1 / 6 / 5;
	}
}



/* お気に入り */
.build-vacant_heart {
	grid-area: 1 / 4 / 2 / 5;
	text-align: right;
}

.build-vacant_heart .u--icon-heart::before {
	font-size: 24px;
}

.build-vacant_heart .u--icon-heart span {
	display: none;
}

.build-vacant_heart .u--icon-heart {
	display: block;
	width: 100%;
	height: 100%;
}

.build-vacant_heart .u--icon-heart::before {
	color: var(--color-grey-dark);
	content: "\e92a";
}

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

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

@media screen and (min-width:1024px) {
	.build-vacant_heart .u--icon-heart {
		display: inline-flex;
		justify-content: center;
		align-items: center;
		position: relative;
		padding: 0 16px 0 40px;
		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;
	}
	.build-vacant_heart .u--icon-heart::before {
		position: absolute;
		top: 50%;
		left: 12px;
		translate: 0 -50%;
	}
	.build-vacant_heart .u--icon-heart span {
		display: inline-block;
	}
}




/* 詳細を見る */
.build-vacant_more {
	grid-area: 2 / 4 / 5 / 5;
	display: flex;
	justify-content: center;
	align-items: center;
	position: static !important;
	z-index: 1;
	width: fit-content;
	/* {{-- yonezawa 20251030 チェックFB No.63 --}} */
	/* {{-- a要素タップ時の挙動を修正 --}} */
	-webkit-tap-highlight-color: transparent;
}

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

.build-vacant_more::after {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 0;
	content: '';
}

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

.build-vacant_more > .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;
}

.build-vacant_more > .u--icon-arrow::before {
	font-size: 10px;
}

.build-vacant_more > .u--icon-arrow span {
	display: none;
}

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



/* 詳細 */
.build-vacant_info {
	grid-area: 2 / 2 / 3 / 4;
}

.build-vacant_price {
	display: block;
	margin-bottom: 8px;
	font-size: 12px;
}

.build-vacant_price > span:has(strong) {
	font-size: 14px;
	font-weight: bold;
}

.build-vacant_price > span strong {
	font-size: 20px;
}

.build-vacant_info > dl {
	display: flex;
	flex-flow: row wrap;
	gap: 8px 16px;
	margin-bottom: 8px;
}

.build-vacant_info > dl div {
	display: flex;
	gap: 8px;
	width: fit-content;
	min-width: 80px;
}

.build-vacant_info > dl div dt {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 20px;
	height: 20px;
	background: var(--color-grey-pale);
	line-height: 1;
}

@media screen and (min-width:1024px) {
	.build-vacant_info {
		grid-area: 1 / 3 / 4 / 4;
		padding-left: 8px;
	}
	.build-vacant_price {
		font-size: 18px;
		margin-bottom: 16px;
	}
	.build-vacant_price > span:has(strong) {
		font-size: 18px;
	}
	.build-vacant_price > span strong {
		font-size: 24px;
	}
	.build-vacant_info > dl {
		margin-bottom: 24px;
	}
	.build-vacant_info > dl div {
		min-width: 100px;
	}
	.build-vacant_info > dl div dt {
		width: 24px;
		height: 24px;
	}
	.build-vacant_info > dl div dd {
		font-size: 18px;
	}
}



/* 公開日 */
.build-vacant_time {
	grid-area: 3 / 2 / 4 / 4;
	display: flex;
	align-items: center;
	color: var(--color-grey-dark);
}

.build-vacant_time time {
	margin-right: 4px;
}

.build-vacant_time span {
	margin-left: 8px;
	padding: 2px 4px;
	border-radius: 2px;
	background: var(--color-housecom-blue);
	color: #fff;
	font-size: 12px;
	font-weight: bold;
}

@media screen and (min-width:1024px) {
	.build-vacant_time {
		grid-area: 4 / 4 / 5 / 5;
		justify-content: flex-end;
	}
	.build-vacant_time span {
		padding: 4px 8px;
		font-size: 14px;
	}
}



/* 店舗名 */
.build-vacant_shop {
	grid-area: 4 / 2 / 5 / 4;
}

@media screen and (min-width:1024px) {
	.build-vacant_shop {
		grid-area: 4 / 3 / 5 / 4;
		padding-left: 8px;
	}
}



/* 間取り画像 */
.build-vacant_madori {
	grid-area: 2 / 1 / 2 / 2;
	position: relative;
	height: 100px;
}

.build-vacant_madori div {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
	/* 画像の背景色pale→white */
	background: var(--color-grey-pale);
}

.build-vacant_madori div img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

@media screen and (min-width:1024px) {
	.build-vacant_madori {
		grid-area: 1 / 2 / 3 / 3;
		height: 150px;
	}
}



/* 画像（すべて） */
.build-vacant_thumb-cassette {
	grid-area: 1 / 1 / 4 / 4;
	opacity: 0;
	height: 100px;
}

.build-vacant_thumb-cassette:has(.show) {
	grid-area: 5 / 1 / 6 / 5;
	opacity: 1;
}

.build-vacant_thumb-cassette .slick-track {
	gap: 0 8px;
	min-height: 100px;
}

.build-vacant_thumb-cassette .slick-slide {
	margin: 0 6px;
	min-width: 100px;
	height: 100px;
	/* 画像の背景色pale→white */
	background: var(--color-grey-pale);
}

#tag + #vacant .build-vacant_thumb-cassette .slick-track {
	margin: 0 !important;
}

@media screen and (min-width:375px) {
	.build-vacant_thumb-cassette .slick-slide {
		min-width: unset;
	}
}

@media screen and (min-width:1024px) {
	.build-vacant_thumb-cassette {
		grid-area: 1 / 2 / 4 / 5;
		min-height: calc(120px + 24px);
	}
	.build-vacant_thumb-cassette:has(.show) {
		grid-area: 5 / 2 / 6 / 5;
	}
	.build-vacant_thumb-cassette .slick-slide {
		margin: 0 8px;
		height: 108px;
	}
	.build-vacant_thumb-cassette::before {
		display: block;
		width: 100%;
		height: 24px;
		content: "";
	}
}



/* 写真を見る */
.thumb-toggle {
	display: inline-block;
	position: absolute;
	bottom: -24px;
	left: 50%;
	translate: -50% 0;
	padding: 4px 12px 12px;
	width: max-content;
	border-radius: 22px;
	border: 1px solid var(--color-grey-origin);
	background: #fff;
	color: var(--color-link-text);
	font-size: 12px;
	font-weight: bold;
	transition: all 0.5s;
}

.thumb-toggle::after {
	position: absolute;
	bottom: 0;
	left: 50%;
	translate: -50% 0;
	rotate: 90deg;
	color: var(--color-black);
	font-family: icomoon;
	font-size: 14px;
	content: '\e90d';
}

/* muto 2025.10.09 写真を見るをクリックしたら矢印を反転させる */
.thumb-toggle.show::after {
	rotate: -90deg;
}

@media screen and (min-width:1024px) {
	.thumb-toggle {
		padding: 8px 16px 16px;
		border-radius: 22px;
		border: 1px solid var(--color-grey-origin);
		font-size: 14px;
	}

	.thumb-toggle::after {
		bottom: 2px;
	}
}








/* =====================================================
--------------------------------------------------------
家賃相場と間取り
--------------------------------------------------------
===================================================== */

.build-history_article {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 16px;
	border-radius: 8px;
	border: 1px solid var(--color-grey-origin);
	background: #fff;
	font-size: 14px;
}

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

.build-history_article > h3 {
	font-size: 18px;
	font-weight: bold;
}

.build-history_article > span:has(span) > span {
	font-weight: bold;
}

.build-history_article > span:has(span) > span:nth-of-type(1) {
	font-size: 20px;
}

.build-history_article > span:not(:has(span)) {
	color: var(--color-grey-dark);
	text-align: right;
}

@media screen and (min-width:1024px) {
	.build-history {
		display: grid;
		grid-template-columns: repeat(auto-fill, 64px);
	}
	.build-history_article {
		display: grid;
		grid-template-columns: subgrid;
		grid-column: 1 / 17;
		align-items: center;
		gap: 28px;
		padding: 16px 24px;
		font-size: 18px;
	}
	.build-history_article > h3 {
		grid-area: 1 / 1 / 2 / 6;
		font-size: 24px;
	}
	.build-history_article > span:has(span) {
		grid-area: 1 / 6 / 1 / 12;
	}
	.build-history_article > span:has(span) > span:nth-of-type(1) {
		font-size: 24px;
	}
	.build-history_article > span:has(span) > span:nth-of-type(2) {
		padding-right: 8px;
	}
	.build-history_article > span:nth-of-type(2) {
		grid-area: 1 / 12 / 1 / 17;
	}
}






















/* =====================================================
--------------------------------------------------------
お問い合わせ先・取り扱い店舗
--------------------------------------------------------
===================================================== */

.build-contact {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
	gap: 16px 8px;
	position: relative;
	padding: 16px;
	border-radius: 8px;
	border: 1px solid var(--color-grey-origin);
	background: #fff;
	transition: all 0.5s;
}

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

.build-contact_tag,
.build-contact_contact {
	position: relative;
	z-index: 2;
}

@media (any-hover:hover) {
	.build-contact h3,
	.build-contact_info {
		transition: all 0.5s;
	}
	.build-contact h3:hover,
	.build-contact:has(> h3:hover) .build-contact_info {
		opacity: 0.5;
	}
}



/* 店舗名 */
.build-contact h3 {
	order: 1;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
	gap: 8px;
	z-index: 1;
	width: 100%;
	font-size: 18px;
	font-weight: bold;
}

.build-contact h3 span {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--color-housecom-green);
}


.build-contact h3 span::before {
	color: var(--color-black);
	font-size: 10px;
	font-weight: bold;
}


.build-contact h3 a {
	position: static !important;
	width: fit-content;
	max-width: calc(100% - 32px);
	/* {{-- yonezawa 20251030 チェックFB No.63 --}} */
	/* {{-- a要素タップ時の挙動を修正 --}} */
	-webkit-tap-highlight-color: transparent;
}

/* {{-- yonezawa 20251030 チェックFB No.63 --}} */
/* {{-- a要素タップ時の挙動を修正 --}} */
.build-contact h3 a:focus {
	outline: none;
}

.build-contact h3 a::before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 0;
	content: '';
}

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


/* タグ */
.build-contact_tag {
	order: 2;
	display: flex;
	flex-flow: row wrap;
	gap: 8px;
	width: 100%;
}

.build-contact_tag span {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 4px 8px;
	border-radius: 4px;
	border: 1px solid var(--color-grey-origin);
	color: var(--color-link-text);
	font-size: 12px;
}



/* 詳細 */
.build-contact_info {
	order: 3;
	display: flex;
	gap: 8px;
	width: 100%;
	max-width: 278px;
}

.build-contact_info > div:has(img) {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 80px;
	height: 80px;
	/* 画像の背景色pale→white */
	background: var(--color-grey-pale);
}

.build-contact_info > div:has(img) img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.build-contact_info > div:has(span) {
	display: flex;
	flex-direction: column;
	gap: 2px;
	width: calc(100% - 80px - 8px);
}

.build-contact_info > div:has(span) ul {
	font-weight: bold;
}



/* お問い合わせ */
.build-contact_contact {
	order: 4;
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	gap: 16px;
	width: 100%;
}

.build-contact_contact a::before {
	left: 8px;
	font-size: 24px;
}

.build-contact_contact a.u--icon-phone {
	flex-flow: row  wrap;
	padding: 4px 8px 4px 40px;
	width: 100%;
}

.build-contact_contact a.u--icon-phone span,
.build-contact_contact a.u--icon-mail span:nth-of-type(3) {
	display: block;
	width: 100%;
	font-size: 12px;
}

.build-contact_contact a.u--icon-mail {
	flex-direction: column;
	padding: 4px 8px 4px 40px;
	width: 100%;
	/* width: calc(100% - 16px - 174px); */
	white-space: nowrap;
}

.build-contact_contact a.u--icon-mail span:nth-of-type(1),
.build-contact_contact a.u--icon-mail span:nth-of-type(2) {
	display: none;
}

@media screen and (min-width:375px) {
	.build-contact_contact a.u--icon-phone {
		width: calc(100% - 16px - 120px);
	}
	.build-contact_contact a.u--icon-mail {
		width: 120px;
	}
}

@media screen and (min-width:425px) {
	.build-contact_contact a.u--icon-phone {
		max-width: 170px;
	}
}

@media screen and (min-width:768px) {
	.build-contact_contact {
		max-width: 288px;
	}
}

@media screen and (min-width:1024px) {
	.build-contact {
		align-items: flex-end;
		gap: 16px;
		padding: 24px;
	}
	.build-contact h3 {
		justify-content: flex-start;
		width: fit-content;
		max-width: calc(100% - 24px - 310px);
		font-size: 20px;
	}
	.build-contact_tag {
		width: fit-content;
		min-width: 310px;
	}
	.build-contact_tag span {
		padding: 0 8px;
		font-size: 16px;
	}
	.build-contact_info {
		gap: 24px;
		width: calc(100% - 310px - 24px);
		max-width: unset;
	}
	.build-contact_info > div:has(img) {
		width: 120px;
		height: 120px;
	}
	.build-contact_info > div:has(span) {
		gap: 8px;
		width: calc(100% - 120px - 24px);
	}
	.build-contact_contact {
		width: 310px;
		max-width: unset;
	}
	.build-contact_contact a {
		padding: 0 8px;
	}
	.build-contact_contact a.u--icon-phone {
		align-items:  flex-start;
		justify-content: flex-start;
		padding-left: 48px;
		border: none;
		width: 100%;
		max-width: unset;
		background: transparent;
		color: var(--color-link-cv);
		font-size: 24px;
	}
	.build-contact_contact a.u--icon-phone::before {
		color: var(--color-link-cv);
		font-size: 24px;
	}
	.build-contact_contact a.u--icon-phone span {
		display: none;
	}
	.build-contact_contact a.u--icon-mail {
		flex-direction: row;
		width: 100%;
		max-width: unset;
	}
	.build-contact_contact a.u--icon-mail span:nth-of-type(1),
	.build-contact_contact a.u--icon-mail span:nth-of-type(2),
	.build-contact_contact a.u--icon-mail span:nth-of-type(3) {
		display: inline-block;
		width: fit-content;
		font-size: 16px;
	}
}










/* =====================================================
--------------------------------------------------------
周辺施設
--------------------------------------------------------
===================================================== */

.neighborhood > .first,
.neighborhood > .second {
	margin-bottom: 16px;
}

.neighborhood > div .cassette {
	height: 200px;
}

.neighborhood h3 {
	font-size: 16px;
	margin: 16px 0 8px;
	font-weight: bold;
}

.neighborhood_read {
	margin: 4px 0;
	font-weight: bold;
}

.neighborhood h3 + p::before {
	font-family: 'icomoon';
	content: "\e96e";
	margin: 0 8px 0 0;
}

.neighborhood div:has(.u--accordion-head) {
	margin-top: 24px;
}

.neighborhood .u--accordion-head {
	padding: 0 24px 0 0;
	color: var(--color-link-text);
}

.neighborhood .u--accordion-head::after {
	color: var(--color-black);
}

.neighborhood div:has(> .u--accordion-head) {
	text-align: right;
}

.neighborhood .u--accordion-head + div {
	margin: 16px 0 0;
}

.neighborhood .u--accordion-head + div dl {
	display: flex;
	flex-wrap: wrap;
	text-align: left;
	gap: 8px 16px;
	font-size: 12px;
}

.neighborhood .u--accordion-head + div dt {
	width: 4em;
	font-weight: bold;
}

.neighborhood .u--accordion-head + div dd {
	width: calc(100% - 4em - 32px);
}

.neighborhood .u--accordion-head + div p {
	margin: -18px 0 0;
	font-size: 10px;
}

.neighborhood .slick-slide {
	border-radius: 8px;
	overflow: hidden;
	height: 200px;
	background: var(--color-grey-pale);
}

.neighborhood .slick-slide img {
	width: 100%;
	height: 100%;
	object-fit: contain;
}

@media screen and (min-width: 768px) {
	.neighborhood {
		display: grid;
		grid-template-columns: repeat(3, calc((100% - 64px) / 3));
		grid-template-areas: "h2      h2      h2"
							 "slide_1 slide_2 slide_3";
		gap: 0 32px;
	}
	.neighborhood h2 {
		grid-area: h2;
	}
	.neighborhood h3 {
		margin-bottom: 0;
	}
	.neighborhood_read {
		margin: 8px 0 4px;
	}
	.neighborhood_read + p {
		line-height: 1.2;
	}
	.neighborhood div:has(.u--accordion-head) {
		margin-top: 16px;
	}
	.neighborhood > .first {
		grid-area: slide_1;
		margin-bottom: 0;
	}
	.neighborhood > .second {
		grid-area: slide_2;
		margin-bottom: 0;
	}
	.neighborhood > .third {
		grid-area: slide_3;
	}
	.neighborhood .u--accordion-head + div {
		font-size: 14px;
	}
	.neighborhood .u--accordion-head + div p {
		font-size: 12px;
	}
	.neighborhood .u--accordion-head + div dl {
		gap: 8px 32px;
		font-size: 14px;
	}
}





























/* =====================================================
--------------------------------------------------------
住人の属性と口コミ・評価
--------------------------------------------------------
===================================================== */

.review {
	padding: 16px;
}

.review.u--inner {
	padding-bottom: 16px;
}

.review h2 {
	margin: 0 0 16px;
	font-size: 18px;
	font-weight: bold;
}

.review > h3 {
	padding: 16px 16px 8px 16px;
	font-size: 18px;
	font-weight: bold;
	border-radius: 8px 8px 0 0;
	background: #fff;
	border: 1px solid var(--color-grey-origin);
	border-bottom: none;
}

.review > h3 ~ div {
	border-left: 1px solid var(--color-grey-origin);
	border-right: 1px solid var(--color-grey-origin);
	padding: 0 16px 16px;
	background: #fff;
}

.review > h3 ~ div:last-of-type {
	border-radius: 0 0 8px 8px;
	border-bottom: 1px solid var(--color-grey-origin);
}



/* 星印（共通）★ */
.rate-star {
	position: relative;
	z-index: 0;
	display: inline-block;
	white-space: nowrap;
	color: var(--color-grey-dak);
}

.rate-star::before,
.rate-star::after {
	font-family: 'icomoon';
	content: "\e986\e986\e986\e986\e986";
	letter-spacing: 0.35em;
}

@media screen and (min-width: 768px) {
	.rate-star::before,
	.rate-star::after {
		letter-spacing: 8px;
	}
}

.review-card .rate-star::before,
.review-card .rate-star::after {
	letter-spacing: 0.25em;
}

.rate-star::after {
	position: absolute;
	z-index: 1;
	top: 0;
	left: 0;
	-webkit-text-stroke: 0.2px var(--color-housecom-blue);
	text-stroke: 0.2px var(--color-housecom-blue);
	overflow: hidden;
	white-space: nowrap;
	color: var(--color-housecom-blue);
}

.rate-star:not(+ .null) {}

.rate-star[data-rate="5.0"]::after {
	width: 100%;
}

.rate-star[data-rate="4.5"]::after {
	width: 87%;
}

.rate-star[data-rate="4.0"]::after {
	width: 80%;
}

.rate-star[data-rate="3.5"]::after {
	width: 67%;
}

.rate-star[data-rate="3.0"]::after {
	width: 60%;
}

.rate-star[data-rate="2.5"]::after {
	width: 47%;
}

.rate-star[data-rate="2.0"]::after {
	width: 40%;
}

.rate-star[data-rate="1.5"]::after {
	width: 27%;
}

.rate-star[data-rate="1.0"]::after {
	width: 20%;
}

.rate-star[data-rate="0.5"]::after {
	width: 7%;
}

.rate-star[data-rate="0"]::after {
	width: 0%;
}



/* グラフ（共通） */
.rate-graph .canvas-graph,
.single-graph .canvas-graph {
	grid-area: graph;
	display: flex;
	height: 8px;
}

/* graph height
.review [class$="-graph"] canvas,
.review + div [class$="-graph"] canvas {
	height: 8px;
} */

.rate-graph .canvas-graph canvas:first-of-type,
.single-graph .canvas-graph canvas:first-of-type {
	border-radius: 8px 0 0 8px;
}

.rate-graph .canvas-graph canvas:last-of-type,
.single-graph .canvas-graph canvas:last-of-type {
	border-radius: 0 8px 8px 0;
}



/* 口コミの評価（共通） */
.review .review-rate {
	display: flex;
	justify-content: space-between;
	align-items: center;
	font-weight: bold;
}

@media screen and (min-width: 768px) {
	.review .review-rate .rate-star {
		margin: 0 8px 0 auto;
	}
}




/* 口コミの評価（総合） */
.review > .review-rate {
	font-size: 24px;
	padding-bottom: 8px;
}

.review > .review-rate span {
	font-size: 18px;
}

.review > .review-rate .rate-star {
	margin-left: 24px;
}

.review > .review-rate span:is(.rate-star),
.review > .review-rate span:is(.rate-value) {
	font-size: 24px;
}



/* 口コミの評価（カテゴリごと） */
.review > .rate-graph .review-rate {
	margin: 0 0 -4px;
	font-size: 16px;
}

.review > .rate-graph .review-rate span:not(:has([class])) {
	font-size: 14px;
}

.review > .rate-graph .explanatory {
	display: flex;
	justify-content: space-between;
	margin: 4px 0;
}

.review > .rate-graph .explanatory .perfect {
	color: #4e87dc;
}

.review > .rate-graph .explanatory .concern {
	color: #de3231;
}

.review > .rate-graph .canvas-graph canvas {
	width: 50%;
}

.review > .rate-graph .canvas-graph .graph-perfect-residents {
	background: #4e87dc;
}

.review > .rate-graph .canvas-graph .graph-concern-residents {
	background: #de3231;
}



/* 評価なし */
/* {{20251008 口コミの評価（カテゴリごと）は実装されていないが、jsで切り替える可能性が高いため一旦削除}} */
/* .review > .rate-graph:has([data-rate="null"]) .review-rate .rate-star {
	display: none;
} */

.review > .rate-graph:has([data-rate="null"]) .explanatory .perfect,
.review > .rate-graph:has([data-rate="null"]) .explanatory .concern {
	color: var(--color-grey-dark);
}

.review > .rate-graph:has([data-rate="null"]) .graph-perfect-residents,
.review > .rate-graph:has([data-rate="null"]) .graph-concern-residents {
	background: var(--color-grey-pale);
}



/* 口コミ情報（文章） */
.review > .rate-graph:has(+ .review-card) + .review-card {
	padding: 16px;
	border-top: 1px solid var(--color-grey-origin);
}

/* .review > .review-card {
	border-left: 1px solid var(--color-grey-origin);
	border-right: 1px solid var(--color-grey-origin);
	background: #fff;
}

.review > .review-card:has(+ .review-card) {
	padding: 16px 16px 0;
	border-radius: 8px 8px 0 0;
	border-top: 1px solid var(--color-grey-origin);
}

.review > .review-card:not(:has(+ .review-card)) {
	padding: 16px;
	border-radius: 0 0 8px 8px;
	border-bottom: 1px solid var(--color-grey-origin);
} */

.review > .review-card > div:has(img) {
	display: flex;
	align-items: center;
	gap: 0 8px;
	font-size: 12px;
}

.review > .review-card > div:has(img) img {
	width: 40px;
	height: 40px;
	border-radius: 50%;
}

.review > .review-card > div:has(h3) {
	position: relative;
	padding: 8px;
	margin: 8px 0 0;
	border-radius: 8px;
	background: var(--color-grey-light);
}

.review > .review-card > div:has(h3)::before {
	position: absolute;
	top: -15px;
	left: 50px;
	clip-path: polygon(50% 0,100% 100%,0 100%);
	width: 20px;
	height: 15px;
	background: var(--color-grey-light);
	content: '';
}

.review > .review-card h3 {
	font-weight: bold;
}

.review > .review-card .review-rate {
	justify-content: flex-start;
	gap: 0 4px;
	margin: 4px 0 8px;
	font-weight: bold;
}

.review > .review-card .review-rate span:not(:is(.rate-star)) {
	font-size: 12px;
}

.review > .review-card .review-rate span:not(:is(.rate-value)) {
	margin: 0;
}

.review > .review-card .review-rate .perfect {
	color: #4e87dc;
}

.review > .review-card .review-rate .concern {
	color: #de3231;
}

.review > .review-card .read-more {
	text-decoration: underline;
	cursor: pointer;
}

.review > .review-card .overflow-text {
	display: none;
}



/* もっと見る（マンションノートへ） */
.review .view-more {
	text-align: center;
	padding: 0 16px 16px;
	width: 100%;
}

.review .view-more .c--link-sub {
	padding: 12px 0;
	width: 100%;
	max-width: calc(100% - 32px);
	max-width: 342px;
	border-width: 2px;
	line-height: 1;
	font-size: 18px;
	font-weight: bold;
}

@media screen and (min-width:1024px) {
	.review .view-more {
		padding-bottom: 24px;
	}
}


/* 住人の属性 */
div:has(> .single-graph) > * {
	padding: 0 16px 16px;
	background: #fff;
	border-left: 1px solid var(--color-grey-pale);
	border-right: 1px solid var(--color-grey-pale);
}

div:has(> .single-graph) > h3 {
	border-top: 1px solid var(--color-grey-pale);
	border-radius: 8px 8px 0 0;
	padding: 16px 16px 8px 16px;
	font-size: 18px;
	font-weight: bold;
}

div:has(> .single-graph) > div:last-of-type {
	border-bottom: 1px solid var(--color-grey-pale);
	border-radius: 0 0 8px 8px;
	padding: 0 16px 32px;
}

div:has(> .single-graph) h4 {
	font-weight: bold;
}

.single-graph {
	display: grid;
	/* grid-template-rows: 14px repeat(2, auto); */
	grid-template-rows: 14px auto 1fr;
	grid-template-columns: 32px calc(100% - 8px - 32px);
	grid-template-areas: "icon heading"
						"icon explan"
						"icon graph";
	gap: 8px;
}

.single-graph:has(.odd-style) {
	padding: 0 16px 24px;
}

/* icon */
.single-graph > span {
	grid-area: icon;
	font-size: 32px;
}

/* 凡例 */
.single-graph .explanatory {
	grid-area: explan;
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin: 0 0 -4px;
}

.single-graph .explanatory span {
	flex-shrink: 0;
	white-space: nowrap;
}

.single-graph:has(.odd-style) .canvas-graph {
	grid-area: 3 / 2 / 3 / 3;
}

.single-graph:has(.odd-style) .explanatory {
	grid-area: 2 / 2 / 2 / 3;
}

.single-graph:has(.odd-style) .explanatory > span:nth-of-type(even) {
	translate: 0 34px;
}

/* .single-graph:last-of-type .explanatory span:last-of-type {
	margin: 0 0 0 -16px;
} */

/* adjust-odd-style
.single-graph .adjust-odd-style {
	position: relative;
}

.single-graph .adjust-odd-style span {
	position: absolute;
}

.single-graph .adjust-odd-style span:nth-of-type(2) {
	right: 75%;
	translate: 50% 0;
	top: 34px;
}

.single-graph .adjust-odd-style span:nth-of-type(3) {
	right: 50%;
	translate: 50% 0;
}

.single-graph .adjust-odd-style span:nth-of-type(4) {
	right: 25%;
	translate: 50% 0;
	top: 34px;
}

.single-graph .adjust-odd-style span:nth-of-type(5) {
	right: 0;
} */



/* 性別 */
.single-graph .men {
	color: #4e87dc;
}

.single-graph .women {
	color: #de3231;
}

.single-graph .graph-men {
	width: 60%;
	background: #4e87dc;
}

.single-graph .graph-women {
	width: 40%;
	background: #de3231;
}



/* 年代 */
.single-graph .under-10 {
	color: #ed7700;
}

.single-graph .twenty {
	color: #dbdf19;
}

.single-graph .thirty {
	color: #b1dd50;
}

.single-graph .fourty {
	color: #3ab585;
}

.single-graph .fifty {
	color: #b269d6;
}

.single-graph .sixty {
	color: #ff5385;
}

.single-graph .graph-under-10 {
	width: 5%;
	background: #ed7700;
}

.single-graph .graph-twenty {
	width: 10%;
	background: #dbdf19;
}

.single-graph .graph-thirty {
	width: 15%;
	background: #b1dd50;
}

.single-graph .graph-fourty {
	width: 30%;
	background: #3ab585;
}

.single-graph .graph-fifty {
	width: 20%;
	background: #b269d6;
}

.single-graph .graph-sixty {
	width: 20%;
	background: #ff5385;
}



/* 家族構成 */
.single-graph .alone {
	color: #1f7aa1;
}

.single-graph .pair {
	color: #3ab585;
}

.single-graph .family {
	color: #cd0e53;
}

.single-graph .graph-alone {
	width: 55%;
	background: #1f7aa1;
}

.single-graph .graph-pair {
	width: 32%;
	background: #3ab585;
}

.single-graph .graph-family {
	width: 13%;
	background: #cd0e53;
}



/* 世帯収入 */
.single-graph .under-300 {
	color: #ed7700;
}

.single-graph .yen300 {
	color: #b1dd50;
}

.single-graph .yen500 {
	color: #3ab585;
}

.single-graph .yen700 {
	color: #b269d6;
}

.single-graph .yen1000 {
	color: #ff5385;
}

.single-graph .graph-under-300 {
	width: 5%;
	background: #ed7700;
}

.single-graph .graph-yen300 {
	width: 10%;
	background: #b1dd50;
}

.single-graph .graph-yen500 {
	width: 20%;
	background: #3ab585;
}

.single-graph .graph-yen700 {
	width: 40%;
	background: #b269d6;
}

.single-graph .graph-yen1000 {
	width: 25%;
	background: #ff5385;
}





/* 不明？ */
/* 治安 */
.graph-perfect-security {
	width: 50%;
}

.graph-concern-security {
	width: 50%;
}

/* 自然環境 */
.graph-perfect-natural {
	width: 50%;
}

.graph-concern-natural {
	width: 50%;
}

/* 子育て・病院 */
.graph-perfect-hospital {
	width: 50%;
}

.graph-concern-hospital {
	width: 50%;
}

/* お買い物・飲食 */
.graph-perfect-shopping {
	width: 50%;
}

.graph-concern-shopping {
	width: 50%;
}




/* マンションノート */
.review ~ .mansion-note {
	max-width: 1024px;
	padding: 0 16px;
	margin: 0 auto 16px;
	font-size: 12px;
}

.review ~ .mansion-note p:has(img) {
	margin: 0 0 8px;
}

.review ~ .mansion-note a {
	text-decoration: underline;
	color: var(--color-link-text);
}

.review ~ .mansion-note img {
	width: 120px;
}

@media screen and (min-width:1024px) {
	.review ~ .mansion-note {
		margin-bottom: 32px;
		padding: 0;
	}
}









@media screen and (min-width:1024px) {
	.single-graph > span {
		font-size: 56px;
		grid-template-columns: 48px auto;
	}

	.review {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		padding: 0;
	}

	.review h2,
	.review > h3,
	.review > .review-rate {
		width: 100%;
	}

	.review h2 {
		font-size: 24px;
		margin: 0 0 28px;
	}
	
	.review > h3 {
		padding: 24px;
	}

	.review > h3 ~ div {
		padding: 0 24px 24px;
	}
	
	.review > h3 ~ div:first-of-type {
		padding: 0 24px 32px;
	}

	.review > .review-rate {
		justify-content: flex-start;
	}

	/* .review > .review-rate span:nth-of-type(2) {
		margin: 0 8px 0 24px;
	} */

	.review > .rate-graph {
		width: calc(100% / 3);
	}

	.rate-graph .explanatory {
		font-size: 14px;
	}

	.review > .rate-graph:nth-of-type(3n + 1) {
		border-left: none;
		padding: 0 24px 24px 12px;
	}

	.review > .rate-graph:nth-of-type(3n + 2) {
		border-right: none;
		padding: 0 12px 24px 24px;
	}
	
	.review > .rate-graph:nth-of-type(3n + 3) {
		border: none;
		padding: 0 12px 24px;
	}

	.review > .review-card,
	div:has(> .single-graph) > .single-graph {
		width: calc(100% / 2);
	}
	
	.review > .review-card:nth-of-type(2n + 1),
	div:has(> .single-graph) > .single-graph:nth-of-type(2n + 2) {
		border-left: none;
		padding: 0 24px 24px 12px;
	}

	.review > .review-card:nth-of-type(2n + 2) {
		border-right: none;
		padding: 0 12px 24px 24px;
	}

	div:has(> .single-graph) > .single-graph:nth-of-type(2n + 1) {
		border-right: none;
	}

	.review .review-card > div:last-of-type {
		padding: 16px;
	}

	.review .rate-graph ~ .review-card .review-rate span {
		font-size: 16px;
	}

	div:has(> .single-graph) > .single-graph:last-of-type {
		border-radius: 0 0 8px 0;
	}
	
	div:has(> .single-graph) > .single-graph:nth-last-of-type(2) {
		border-radius: 0 0 0 8px;
		border-bottom: 1px solid var(--color-grey-origin);
	}

	.review > .rate-graph + .review-card,
	.review > .rate-graph + .review-card + .review-card {
		border-top: 1px solid var(--color-grey-origin);
		padding-top: 24px;
	}
	.review > .rate-graph:has(+ .review-card) + .review-card {
		padding: 24px 24px 16px 24px;
	}

	.review + .u--inner {
		display: flex;
		justify-content: space-between;
		flex-wrap: wrap;
		margin: 16px auto 24px;
		padding: 0;
	}
	
	.single-graph {
		grid-template-columns: 56px calc(100% - 16px - 56px);
		grid-template-rows: 24px 14px auto;
		gap: 8px 16px;
	}

	.single-graph:has(.odd-style) .explanatory > span:nth-of-type(even) {
		translate: 0 44px;
	}
	
	.review + .u--inner > div:last-of-type {
		padding: 0 24px 40px 12px;
	}

	div:has(> .single-graph) > h3 {
		width: 100%;
		padding: 24px 24px 16px;
	}
	
	div:has(> .single-graph) .explanatory {
		font-size: 14px;
	}

	.rate-graph .canvas-graph, .single-graph .canvas-graph {
		margin: 4px 0 0;
	}
}

/* 20251020 口コミがコメントのみ実装されている状態 */
@media screen and (min-width:1024px) {
	.review > .review-card:has(+ .review-card) {
		padding: 0 12px 24px 24px;
		border-radius: 0 0 0 8px;
		border-right: none;
		border-bottom: 1px solid var(--color-grey-origin);
		border-left: 1px solid var(--color-grey-origin);
	}

	.review > .review-card:not(:has(+ .review-card)) {
		padding: 0 24px 24px 12px;
		border-radius: 0 0 8px 0;
		/* border-top: 1px solid var(--color-grey-origin); */
		border-right: 1px solid var(--color-grey-origin);
		border-left: none;
	}
}




















/* === 不動産会社の固有でselectshop- === */

/* =====================================================
--------------------------------------------------------
取り扱い不動産会社店舗
--------------------------------------------------------
===================================================== */

main:has(.selectshop) .summary {
	padding-bottom: 8px;
}

main:has(.selectshop) .summary hgroup h1 {
	margin-bottom: 8px;
}

.selectshop {
	margin: 0 auto;
	padding: 0 16px;
	width: 100%;
	max-width: 1024px;
}

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

.selectshop_tag span,
.selectshop_room {
	position: relative;
	z-index: 1;
}

.selectshop > div:has(.selectshop_tag) {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
	gap: 16px 8px;
	position: relative;
	padding: 16px;
	border-radius: 8px 8px 0 0;
	border-top: 1px solid var(--color-grey-origin);
	border-right: 1px solid var(--color-grey-origin);
	border-left: 1px solid var(--color-grey-origin);
	background: #fff;
	transition: all 0.5s;
}




/* 会社名 */
.selectshop h2 {
	order: 1;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	align-items: center;
	gap: 8px;
	position: relative;
	width: 100%;
	font-size: 18px;
	font-weight: bold;
}

/* .selectshop h2 span:is(.u--icon-arrow) */
.selectshop h2::after {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: var(--color-housecom-green);
	color: var(--color-black);
	font-size: 8px;
	font-weight: bold;
	font-family: 'icomoon';
	content: "\e90d";
}

/* .selectshop h2 span {
	width: calc(100% - 32px);
} */



/* タグ */
.selectshop_tag {
	display: flex;
	gap: 8px;
	order: 2;
	width: 100%;

	/* {{yonezawa 20250930 作業リスト 米澤 No.8 対応として追加} */
	flex-wrap: wrap;
}

.selectshop_tag span {
	display: flex;
	justify-content: center;
	align-items: center;
	padding: 4px 8px;
	border-radius: 4px;
	border: 1px solid var(--color-grey-origin);
	color: var(--color-link-text);
	font-size: 12px;
}



/* 店舗情報 */
.selectshop_info {
	order: 3;
	display: flex;
	flex-flow: row-reverse wrap;
	gap: 8px;
	width: 100%;
}

.selectshop_link {
	width: 80px;
	height: 80px;
	/* 画像の背景色pale→white */
	background: var(--color-grey-pale);
}

.selectshop_link a {
	position: static !important;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	-webkit-tap-highlight-color: transparent;
}

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

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

/* {{-- yonezawa 20251029 チェックFB No.63 --}} */
/* {{-- a要素タップ時の挙動を修正 --}} */
.selectshop_link a:focus {
	outline: none;
}

@media (any-hover:hover) {
	.selectshop h2,
	.selectshop_info {
		transition: all 0.5s;
	}
	.selectshop_link a:hover,
	.selectshop div:has(.selectshop_tag):has(.selectshop_link a:hover) h2,
	.selectshop div:has(.selectshop_tag):has(.selectshop_link a:hover) .selectshop_info {
		opacity: 0.5;
	}
}

.selectshop_info > div:has(span) {
	display: flex;
	flex-direction: column;
	gap: 2px;
	width: calc(100% - 8px - 80px);
}

.selectshop_info_station {
	font-weight: bold;
}

@media screen and (min-width:768px) {
	.selectshop {
		padding: 0;
	}
	.selectshop > div:has(.selectshop_tag) {
		padding: 24px 24px 16px 24px;

		/* {{yonezawa 20250930 作業リスト 米澤 No.8 対応として追加} */
		/* {{FlexBoxからGridLayoutに変更} */
		display: grid;
		grid-template-rows: repeat(2, auto);
		grid-template-columns: repeat(2, auto);
		grid-template-areas:
			"name tags"
			"info room";
	}
	.selectshop h2 {
		justify-content: flex-start;
		width: fit-content;
		max-width: 100%;
		font-size: 20px;

		/* {{yonezawa 20250930 作業リスト 米澤 No.8 対応として追加} */
		grid-area: name;
	}
	.selectshop_tag {
		justify-content: flex-end;
		
		/* {{yonezawa 20250930 作業リスト 米澤 No.8 対応として削除} */
		/* width: fit-content; */
		/* max-width: calc((100% - 8px) / 2); */

		/* {{yonezawa 20250930 作業リスト 米澤 No.8 対応として追加} */
		width: 100%;
		flex-wrap: wrap;
		max-width: none;
		grid-area: tags;
	}
	.selectshop_tag span {
		padding: 0 8px;
		font-size: 16px;

		/* {{yonezawa 20250930 作業リスト 米澤 No.8 対応として追加} */
		flex-shrink: 0;
	}
	.selectshop_info {
		gap: 24px;
		width: calc(100% - 16px - 532px);

		/* {{yonezawa 20250930 作業リスト 米澤 No.8 対応として追加} */
		grid-area: info;
		width: 100%;
		min-width: 380px;
	}
	.selectshop_info > div:has(span) {
		gap: 8px;
		width: calc(100% - 24px - 120px);
	}
	.selectshop_link {
		width: 120px;
		height: 120px;
	}
	/* {{yonezawa 20250930 作業リスト 米澤 No.8 対応として追加} */
	.selectshop_room {
		grid-area: room;
	}
}



/* 物件情報 */
.selectshop_room {
	order: 4;
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	gap: 8px;
	padding: 16px;
	width: 100%;
	border-radius: 4px;
	background: var(--color-housecom-blue-light);
	/* {{yonezawa 20251001 PC閲覧時のレイアウト崩れを修正} */
	margin: 0 0 0 auto;
}

.selectshop_room h3 {
	font-weight: bold;
}

.selectshop_room_time {
	display: flex;
	justify-content: flex-end;
	align-items: center;
	margin-bottom: 4px;
	width: 100%;
	color: var(--color-grey-dark);
}

.selectshop_room_time time {
	margin-right: 4px;
}

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

.selectshop_room_price {
	width: 100%;
	font-weight: bold;
}

.selectshop_room_price span {
	font-size: 20px;
}

/* {{yonezawaw 20251001 [作業リスト 米澤 No.10]
SP閲覧時の「敷礼保償」表示のレイアウト崩れを修正}} */
/* .selectshop_room dl {
	display: flex;
	flex-flow: row wrap;
	gap: 8px 16px;
} */
.selectshop_room dl {
	display: grid;
    grid-template-columns: repeat(2, auto);
	gap: 8px 16px;
}

.selectshop_room dl div {
	display: flex;
	gap: 8px;
	min-width: 82px;
}

.selectshop_room dl div:nth-of-type(even) {
	min-width: calc(100% - 24px - 78px);
}

.selectshop_room dl dt {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 20px;
	height: 20px;
	background: var(--color-grey-pale);
	line-height: 1;
}

.selectshop_room_feature {
	display: flex;
	gap: 0 16px;
	margin-bottom: 4px;
	color: var(--color-link-text);
	font-weight: bold;

	/* {{yonezawa 20250930 作業リスト 米澤 No.8 対応として追加} */
	width: 100%;
	
	flex-wrap: wrap;
}

.selectshop_room .c--link-main {
	position: static !important;
	padding-left: 24px;
	padding-right: 44px;
	/* {{yonezawaw 20251001 [作業リスト 米澤 No.11] 
	SP閲覧時は「物件情報充実度表示（3_8_5）」の下で1行表示にする}} */
	margin: 0 auto;
	margin: 0 calc((100% - 200px) / 2);
	width: 200px;
	/* {{-- yonezawa 20251030 チェックFB No.63 --}} */
	/* {{-- a要素タップ時の挙動を修正 --}} */
	-webkit-tap-highlight-color: transparent;
}

/* {{-- yonezawa 20251030 チェックFB No.63 --}} */
/* {{-- a要素タップ時の挙動を修正 --}} */
.selectshop_room .c--link-main:focus {
	outline: none;
}

.selectshop_room .c--link-main::before {
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	translate: 0% 0%;
	content: '';
	z-index: 0;
}

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

.selectshop_room .c--link-main span {
	position: relative;
	width: 100%;
}

.selectshop_room .c--link-main span::before {
	position: absolute;
	right: -28px;
}

@media (any-hover:hover) {
	.selectshop_room > * {
		transition: all 0.5s;
	}
	.selectshop_room:has(a:hover) > *:not(.c--link-main) {
		opacity: 0.5;
	}
}

@media screen and (min-width:375px) {
	.selectshop_room_time {
		margin-left: auto;
		width: fit-content;
	}
	.selectshop_room dl {
		/* {{yonezawaw 20251001 [作業リスト 米澤 No.10]
		SP閲覧時の「敷礼保償」表示のレイアウト崩れを修正}}
		grid-template-columns: repeat(4, auto); */
		display: flex;
		flex-flow: row wrap;
	}
	.selectshop_room dl div:nth-of-type(even) {
		min-width: unset;
	}
}

@media screen and (min-width:768px) {
	.selectshop_room {
		gap: 8px 24px;
		max-width: 532px;
	}
	.selectshop_room_time {
		margin-bottom: 0;
	}
	.selectshop_room_time span {
		font-size: 14px;
	}
	.selectshop_room_price span {
		font-size: 24px;
	}

	.selectshop_room dl {
		gap: 8px 32px;
		margin-bottom: 8px;
	}
	.selectshop_room dl div,
	.selectshop_room dl div:nth-of-type(even) {
		width: fit-content;
		min-width: unset;
	}
	.selectshop_room dl dt {
		width: 24px;
		height: 24px;
	}
	.selectshop_room dl dd {
		font-size: 18px;
	}
	.selectshop_room_feature {
		width: fit-content;
	}
	.selectshop_room .c--link-main {
		margin: 0 0 0 auto;
		padding-left: 16px;
		padding-right: 40px;
		/* {{yonezawaw 20251001 [作業リスト 米澤 No.11]
		PC閲覧時は「物件情報充実度表示（3_8_5）」の横に並べて表示する}} */
		width: fit-content;
	}
}






/* 問い合わせ */
.selectshop_contact {
	display: flex;
	flex-flow: row wrap;
	justify-content: space-between;
	gap: 16px;
	padding: 0 16px 16px 16px;
	border-radius: 0 0 8px 8px;
	border-right: 1px solid var(--color-grey-origin);
	border-bottom: 1px solid var(--color-grey-origin);
	border-left: 1px solid var(--color-grey-origin);
	background: #fff;
}

.selectshop_contact a {
	width: 100%;
}

.selectshop_contact a::before {
	left: 8px;
	font-size: 24px;
}

.selectshop_contact a.u--icon-phone {
	padding: 4px 8px 4px 40px;
}

.selectshop_contact a.u--icon-phone span,
.selectshop_contact a.u--icon-mail span:nth-of-type(3) {
	display: block;
	font-size: 12px;
}

.selectshop_contact a.u--icon-mail {
	padding: 4px 8px 4px 40px;
}

.selectshop_contact a.u--icon-mail span:nth-of-type(1),
.selectshop_contact a.u--icon-mail span:nth-of-type(2) {
	display: none;
}

.selectshop_contact a:has(.u--icon-shop) {
	padding: 4px 8px;
	width: 100%;
	word-break: keep-all;
	overflow-wrap: break-word;
}

.selectshop_contact a:has(.u--icon-shop) .u--icon-shop {
	padding-left: 32px;
	width: 100%;
}

.selectshop_contact a:has(.u--icon-shop) .u--icon-shop {
	padding-left: 32px;
	width: 100%;
}

.selectshop_contact a:has(.u--icon-shop) .u--icon-shop::before,
.selectshop_contact a:has(.u--icon-shop) .u--icon-shop::after {
	left: 0;
	font-size: 24px;
	color: #fff;
}



main:has(.selectshop) aside > p {
	margin-bottom: 8px;
}

@media (any-hover:hover) {
	.selectshop_contact a:has(.u--icon-shop):hover .u--icon-shop::before,
	.selectshop_contact a:has(.u--icon-shop):hover .u--icon-shop::after {
		color: var(--color-link-cv);
	}
}

@media screen and (min-width:375px) {
	.selectshop_contact a.u--icon-phone {
		width: 170px;
	}
	.selectshop_contact a.u--icon-mail {
		width: calc(100% - 16px - 170px);
	}
}

@media screen and (min-width:425px) {
	.selectshop_contact a.u--icon-phone {
		width: calc((100% - 16px) / 2);
		min-width: 170px;
	}
	.selectshop_contact a.u--icon-mail {
		width: calc((100% - 16px) / 2);
		min-width: 120px;
	}
}

@media screen and (min-width:768px) {
	.selectshop_contact {
		padding: 0 24px 24px 24px;
	}
	.selectshop_contact a {
		padding: 0 8px;
	}
	.selectshop_contact a.u--icon-phone {
		padding: 0;
		width: 320px;
		border: none;
		background: #fff;
		color: var(--color-link-cv);
		font-size: 32px;
	}
	.selectshop_contact a.u--icon-phone::before {
		left: 0;
		color: var(--color-link-cv);
		font-size: 32px;
	}
	.selectshop_contact a.u--icon-phone span {
		display: none;
	}
	.selectshop_contact a.u--icon-mail,
	.selectshop_contact a:has(.u--icon-shop) {
		flex-direction: row;
		padding-left: 40px;
		width: calc((100% - 320px - 32px) / 2);
		font-size: 16px;
	}
	.selectshop_contact a.u--icon-mail span:nth-of-type(1),
	.selectshop_contact a.u--icon-mail span:nth-of-type(2),
	.selectshop_contact a.u--icon-mail span:nth-of-type(3) {
		display: inline-block;
		font-size: 16px;
	}
}

@media screen and (min-width:1024px) {
	main:has(.selectshop) .summary {
		padding: 24px 0;
	}
}










/* =====================================================
--------------------------------------------------------
ぱんくず
--------------------------------------------------------
===================================================== */

.breadcrumb {
	background: var(--color-grey-light);
}

.breadcrumb::before {
	position: absolute;
	top: 0;
	left: 0;
	margin: 0 calc(50% - 50vw);
	width: 100vw;
	height: 100%;
	background: var(--color-grey-light);
	content: '';
}