@charset "UTF-8";
/* =========================================================================
 * front-page.css / レクソル トップページ リニューアル用
 *
 *   ネイビー #2b3a5c / ヒーロー濃紺 #1c2536 / くすみゴールド #c9a24b
 *   明朝・広い字間・余白主体。枠線/角丸/塗りボタン/ピル型タグは使わない。
 *   is_front_page() 限定で読み込む（rexsol-front.php で enqueue）。
 * ====================================================================== */

:root {
	--rx-navy:        #2b3a5c;
	--rx-navy-dark:   #1c2536;
	--rx-gold:        #c9a24b;
	--rx-gold-deep:   #9c7c2e;
	--rx-ink:         #2a2d33;
	--rx-sub:         #6b7280;
	--rx-line:        #e3e1da;
	--rx-bg-soft:     #f7f6f3;
	--rx-serif: "Times New Roman", "YuMincho", "Yu Mincho", "Hiragino Mincho ProN", "ヒラギノ明朝 ProN W3", serif;
}

html { scroll-behavior: smooth; }

/* 共通：セクション枠 ----------------------------------------------------- */
.rexsol-search,
.rexsol-arst,
.rexsol-recommend {
	padding: clamp(48px, 7vw, 96px) 0;
}
.rexsol-section__inner {
	max-width: 1120px;
	margin: 0 auto;
	padding: 0 24px;
}
.rexsol-section__head {
	text-align: center;
	margin-bottom: clamp(28px, 4vw, 52px);
}
.rexsol-section__en {
	display: block;
	font-family: "Times New Roman", serif;
	font-size: .72rem;
	letter-spacing: .42em;
	text-indent: .42em;
	color: var(--rx-gold-deep);
	margin-bottom: 1.1em;
}
.rexsol-section__title {
	font-family: var(--rx-serif);
	font-weight: 400;
	font-size: clamp(1.25rem, 2.6vw, 1.85rem);
	letter-spacing: .12em;
	color: var(--rx-navy);
	line-height: 1.6;
	margin: 0;
	position: relative;
	padding-bottom: .9em;
}
.rexsol-section__head .rexsol-section__title::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;
	transform: translateX(-50%);
	width: 42px;
	height: 1px;
	background: var(--rx-gold);
}

/* =========================================================================
 * ヒーロー（header.php の is_front_page 分岐をCSSで装飾）
 * ====================================================================== */
.custom-header {
	position: relative !important;
	overflow: hidden;
	height: clamp(440px, 72vh, 760px) !important;
}
.custom-header .custom-header-media,
.custom-header .wp-custom-header {
	height: 100%;
	margin: 0;
}
.custom-header .custom-header-media img,
.custom-header .wp-custom-header img {
	width: 100% !important;
	height: 100% !important;
	max-height: none !important;
	min-height: 0 !important;
	object-fit: cover !important;
	object-position: center !important;
	box-shadow: none !important;
	margin: 0 !important;
	display: block;
}
.custom-header::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(28,37,54,.42) 0%, rgba(28,37,54,.60) 100%);
	pointer-events: none;
	z-index: 1;
}
/* オーバーレイ（中央寄せ）。既存テーマの top:43% / translateY(-50%) / width:60% を確実に上書き */
.custom-header .slider-content {
	position: absolute !important;
	top: 0 !important;
	right: 0 !important;
	bottom: 0 !important;
	left: 0 !important;
	width: auto !important;
	margin: 0 !important;
	transform: none !important;
	padding: 0 24px !important;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	text-align: center;
	color: #fff;
	z-index: 2;
}
.custom-header .slider-content::before {
	content: "EXECUTIVE ESTATE";
	font-family: "Times New Roman", serif;
	font-size: .72rem;
	letter-spacing: .42em;
	text-indent: .42em;
	color: var(--rx-gold);
	margin-bottom: 1.6em;
	text-shadow: none;
}
.custom-header .slider-content .slider-title,
.custom-header .slider-content .slider-title a {
	font-family: var(--rx-serif) !important;
	font-weight: 400 !important;
	font-size: clamp(1.55rem, 4.4vw, 2.85rem) !important;
	letter-spacing: .14em;
	line-height: 1.75;
	margin: 0 !important;
	padding: 0 !important;
	color: #fff;
	text-shadow: 0 1px 24px rgba(0,0,0,.30);
}
.custom-header .slider-content .slider-text {
	font-size: clamp(.85rem, 1.6vw, .98rem) !important;
	letter-spacing: .08em;
	line-height: 2;
	margin: 1.6em 0 0 !important;
	padding: 0 !important;
	color: #fff;
	opacity: .94;
	text-shadow: 0 1px 16px rgba(0,0,0,.30);
}
/* ヘッダー下のボタン群（mainav）が出る場合の体裁 */
#top-btn { margin-top: -1px; }

/* =========================================================================
 * セクション1：物件を探す（3枠・枠なし・写真＋ラベル）
 * ====================================================================== */
.rexsol-search__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(14px, 2.4vw, 30px);
}
.rexsol-search__item {
	position: relative;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	min-height: clamp(190px, 26vw, 280px);
	padding: 28px 26px;
	color: #fff;
	text-decoration: none;
	/* 既定は濃紺パネル。写真差し替え時は <a> に
	   style="background-image:url('画像URL')" を足すだけ */
	background: var(--rx-navy-dark) center / cover no-repeat;
	overflow: hidden;
}
.rexsol-search__item::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(28,37,54,.20) 0%, rgba(28,37,54,.68) 100%);
	transition: background .3s ease;
}
.rexsol-search__item:hover::after {
	background: linear-gradient(180deg, rgba(28,37,54,.10) 0%, rgba(28,37,54,.58) 100%);
}
.rexsol-search__en,
.rexsol-search__ja,
.rexsol-search__sub { position: relative; z-index: 2; }
.rexsol-search__en {
	font-family: "Times New Roman", serif;
	font-size: .68rem;
	letter-spacing: .36em;
	text-indent: .36em;
	color: var(--rx-gold);
	margin-bottom: .9em;
}
.rexsol-search__ja {
	font-family: var(--rx-serif);
	font-size: 1.18rem;
	letter-spacing: .1em;
	line-height: 1.5;
	display: inline-block;
	padding-bottom: .55em;
	border-bottom: 1px solid rgba(201,162,75,.55);
	width: fit-content;
	transition: border-color .3s ease;
}
.rexsol-search__item:hover .rexsol-search__ja { border-color: var(--rx-gold); }
.rexsol-search__sub {
	margin-top: .9em;
	font-size: .8rem;
	letter-spacing: .06em;
	opacity: .82;
}

/* =========================================================================
 * セクション2：エリア・駅から探す（薄いネイビー×ゴールドのタグ）
 * ====================================================================== */
.rexsol-arst { background: var(--rx-bg-soft); }
.rexsol-arst__block { scroll-margin-top: 96px; }
.rexsol-arst__block + .rexsol-arst__block { margin-top: clamp(40px, 5vw, 72px); }
.rexsol-taglist {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 10px 12px;
	justify-content: center;
}
.rexsol-taglist li a {
	display: inline-block;
	padding: .5em 1.05em;
	font-size: .9rem;
	letter-spacing: .04em;
	color: var(--rx-navy);
	text-decoration: none;
	background: #fff;
	border: 1px solid var(--rx-line);
	transition: color .25s ease, border-color .25s ease, background .25s ease;
}
.rexsol-taglist li a:hover {
	color: var(--rx-gold-deep);
	border-color: var(--rx-gold);
	background: #fff;
}
.rexsol-taglist li a.spot {
	color: var(--rx-navy);
	border-color: rgba(201,162,75,.6);
	font-weight: 600;
}
.rexsol-taglist li a.spot:hover {
	color: var(--rx-gold-deep);
	border-color: var(--rx-gold);
}

/* =========================================================================
 * セクション3：おすすめ物件（枠なしカード）
 * ====================================================================== */
.rexsol-recommend__grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: clamp(22px, 3vw, 40px) clamp(18px, 2.6vw, 34px);
}
.rexsol-card {
	display: block;
	text-decoration: none;
	color: var(--rx-ink);
}
.rexsol-card__img {
	display: block;
	position: relative;
	width: 100%;
	padding-top: 66%;
	background: #eceae4 center / cover no-repeat;
	background-image: inherit;
	overflow: hidden;
}
.rexsol-card__img {
	/* 実際の画像は inline style で background-image を指定 */
	background-color: #eceae4;
	background-size: cover;
	background-position: center;
}
.rexsol-card__badge {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 2;
	padding: .35em .85em;
	font-family: "Times New Roman", serif;
	font-size: .64rem;
	letter-spacing: .18em;
	text-indent: .18em;
	color: #fff;
	background: var(--rx-navy);
}
.rexsol-card__body { display: block; padding: 1.05em .2em 0; }
.rexsol-card__title {
	display: block;
	font-family: var(--rx-serif);
	font-size: 1.04rem;
	letter-spacing: .06em;
	line-height: 1.65;
	color: var(--rx-navy);
}
.rexsol-card__access {
	display: block;
	margin-top: .55em;
	font-size: .8rem;
	letter-spacing: .03em;
	color: var(--rx-sub);
	line-height: 1.6;
}
.rexsol-card__price {
	display: block;
	margin-top: .7em;
	font-family: var(--rx-serif);
	font-size: 1.18rem;
	letter-spacing: .04em;
	color: var(--rx-navy);
}
.rexsol-card__price .yen,
.rexsol-card__price span { color: inherit; }
.rexsol-card:hover .rexsol-card__title { color: var(--rx-gold-deep); }

.rexsol-recommend__more {
	margin-top: clamp(32px, 4vw, 56px);
	text-align: center;
}
.rexsol-recommend__more a {
	display: inline-block;
	font-family: var(--rx-serif);
	font-size: 1rem;
	letter-spacing: .12em;
	color: var(--rx-navy);
	text-decoration: none;
	padding-bottom: .5em;
	border-bottom: 1px solid var(--rx-gold);
	transition: color .25s ease;
}
.rexsol-recommend__more a:hover { color: var(--rx-gold-deep); }

/* =========================================================================
 * セクション4：CONTACT帯（濃紺・ゴールドの控えめCTA）
 * ====================================================================== */
.rexsol-contact {
	background: var(--rx-navy-dark);
	color: #fff;
	padding: clamp(52px, 7vw, 96px) 24px;
}
.rexsol-contact__inner {
	max-width: 1000px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: clamp(28px, 4vw, 56px);
}
.rexsol-contact__lead { flex: 1 1 320px; }
.rexsol-contact .rexsol-section__en { color: var(--rx-gold); margin-bottom: 1.2em; }
.rexsol-contact__title {
	font-family: var(--rx-serif);
	font-weight: 400;
	font-size: clamp(1.3rem, 2.8vw, 1.9rem);
	letter-spacing: .12em;
	margin: 0;
	color: #fff;
}
.rexsol-contact__text {
	margin: 1.2em 0 0;
	font-size: .92rem;
	letter-spacing: .06em;
	line-height: 2;
	opacity: .9;
}
.rexsol-contact__actions {
	flex: 0 1 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
}
.rexsol-contact__btn {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	min-width: 220px;
	padding: 22px 28px;
	text-decoration: none;
	color: #fff;
	border: 1px solid rgba(201,162,75,.55);
	transition: border-color .25s ease, background .25s ease, color .25s ease;
}
.rexsol-contact__btn:hover {
	border-color: var(--rx-gold);
	background: rgba(201,162,75,.08);
}
.rexsol-contact__btnlabel {
	font-size: .78rem;
	letter-spacing: .12em;
	color: var(--rx-gold);
	margin-bottom: .65em;
}
.rexsol-contact__btnvalue {
	font-family: var(--rx-serif);
	font-size: 1.32rem;
	letter-spacing: .06em;
	line-height: 1.3;
}
.rexsol-contact__btnnote {
	margin-top: .7em;
	font-size: .72rem;
	letter-spacing: .04em;
	opacity: .82;
}

/* =========================================================================
 * レスポンシブ
 * ====================================================================== */
@media (max-width: 900px) {
	.rexsol-recommend__grid { grid-template-columns: repeat(2, 1fr); }
	.rexsol-contact__inner { justify-content: center; text-align: center; }
	.rexsol-contact__lead { flex-basis: 100%; }
}
@media (max-width: 600px) {
	.rexsol-search__grid { grid-template-columns: 1fr; }
	.rexsol-recommend__grid { grid-template-columns: 1fr 1fr; }
	.rexsol-taglist { justify-content: flex-start; }
	.rexsol-taglist li a { font-size: .82rem; padding: .45em .85em; }
	.rexsol-contact__btn { min-width: 0; flex: 1 1 100%; }
}