@charset "UTF-8";
/* =====================================================================
   common.css：変数・リセット・共通の基本スタイル（全幅・印刷共通）
   サイズ指定は style-pc.css / style-sp.css に記述する
   ===================================================================== */

/* ===== 変数 ===== */
:root {
	/* 色（デザインPDF実測値） */
	--color-text: #000000;
	--color-white: #ffffff;
	--color-bg: #dfeff5;     /* 背景水色 */
	--color-band: #c8dbe2;   /* 帯・フッターメニュー */
	--color-main: #36666b;   /* ボタン */
	--color-icon: #898989;   /* 右上メニューのアイコン */
	--color-line: #c8d3d4;   /* ヒーロー内の罫線 */
	--color-red: #e60012;    /* 物件概要の赤字 */

	/* フォント（★デザインはヒラギノ。Webでは Noto Sans JP / Noto Serif JP で代替） */
	--font-sans-jp: "Noto Sans JP", "Noto Sans CJK JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", YuGothic, sans-serif;
	--font-mincho: "Noto Serif JP", "Noto Serif CJK JP", "Hiragino Mincho ProN", "Yu Mincho", YuMincho, serif;
	--font-en: Arial, "Helvetica Neue", Helvetica, "Noto Sans JP", sans-serif;
	--font-num: "Times New Roman", Times, "Noto Serif JP", serif;

	/* font-size の clamp() 最小値の係数（印刷時は 0 にして縮小を優先） */
	--fmin: 1;
}

/* ===== リセット ===== */
*,
*::before,
*::after {
	box-sizing: border-box;
}
html {
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}
body,
h1, h2, h3, h4, h5, h6,
p, figure, blockquote,
ul, ol, dl, dd,
table, th, td {
	margin: 0;
	padding: 0;
}
ul,
ol {
	list-style: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}
img,
svg,
picture {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
}
img {
	border: 0;
}
button {
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	color: inherit;
	font: inherit;
	cursor: pointer;
}
small {
	font-size: inherit;
}

/* ===== 基本 ===== */
body {
	background: var(--color-white);
	color: var(--color-text);
	font-family: var(--font-sans-jp);
	font-weight: 400;
	line-height: 1.5;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
a {
	color: inherit;
	text-decoration: none;
}
a[href]:hover {
	opacity: 0.7;
}
a:not([href]) {
	cursor: default;
}
/* リンク先が未設定のボタン・準備中のメニュー項目は半透明 */
.header__btn:not([href]),
.info__btn:not([href]),
.is-soon > span {
	opacity: 0.5;
}
/* 来場予約はリンクなしでも不透明のまま（後日SUUMOへリンク予定） */
.header__btn--visit:not([href]),
.info__btn--visit:not([href]) {
	opacity: 1;
}
.info__price-num {
	color: var(--color-main);
}
:focus-visible {
	outline: 2px solid var(--color-main);
	outline-offset: 2px;
}

/* ===== ユーティリティ ===== */
.u-visually-hidden {
	position: absolute !important;
	width: 1px !important;
	height: 1px !important;
	margin: -1px !important;
	padding: 0 !important;
	overflow: hidden !important;
	clip: rect(0 0 0 0) !important;
	white-space: nowrap !important;
	border: 0 !important;
}

/* ===== スクロール演出（JS有効時のみ。画面に入るとふわっと表示） ===== */
.js .u-inview {
	opacity: 0;
	transform: translateY(2rem);
	transition: opacity 1s ease, transform 1s ease;
}
.js .u-inview.is-inview {
	opacity: 1;
	transform: none;
}

/* ===== ページTOPへ戻る ===== */
.pagetop {
	position: fixed;
	z-index: 90;
	aspect-ratio: 1 / 1;
}
.js .pagetop {
	opacity: 0;
	visibility: hidden;
	transition: opacity 0.4s ease, visibility 0.4s ease;
}
.js .pagetop.is-show {
	opacity: 1;
	visibility: visible;
}
.pagetop a {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	background: var(--color-main);
}
.pagetop__arrow {
	display: block;
	width: 32%;
	height: 32%;
	border-top: solid var(--color-white);
	border-left: solid var(--color-white);
	transform: translateY(20%) rotate(45deg);
}
