@charset "shift_jis";
/* CSS Document */
#re_header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 0 0 15px 0;
	padding: 20px clamp(30px, 2.5vw, 45px);
	font-family: '游ゴシック', YuGothic, 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', '?揀Cリオ', 'Meiryo', 'Arial', sans-serif;
	& a {
		color: #000000;
		text-decoration: none;
	}
	.re_h_logo {
		display: block;
		width: clamp(220px, 17vw, 300px);
	}
	>div {
		display: flex;
		align-items: center;
		gap: 0 clamp(50px, 4vw, 75px);
		.re_h_nav {
			>ul {
				display: flex;
				gap: 0 25px;
				>li {
					>a {
						font-size: clamp(11px, 0.8vw, 14px);
						line-height: 1;
						font-weight: bold;
						position: relative;
						&:after {
							position: absolute;
							left: 0;
							content: '';
							width: 100%;
							height: 1px;
							background: #0c449b;
							bottom: -4px;
							transform: scale(0, 1);
							transform-origin: left top;
							transition: transform 0.3s;
						}
						&:hover:after {
							transform: scale(1, 1);
						}
					}
				}
			}
		}
		.re_h_btn {
			display: flex;
			>li {
				>a {
					display: block;
					width: clamp(100px, 8vw, 145px);
					box-sizing: border-box;
					padding: 19px 0;
					border-top: 1px solid #0c449b;
					border-bottom: 1px solid #0c449b;
					font-size: clamp(11px, 0.8vw, 14px);
					line-height: 15px;
					font-weight: bold;
					text-align: center;
					transition: all 0.2s;
				}
				&:nth-child(1) a {
					border-left: 1px solid #0c449b;
					border-right: 1px solid #FFF;
					color: #0c449b;
					&:hover {
						background: #0c449b;
						color: #FFF;
					}
				}
				&:nth-child(2) a {
					background: #0c449b;
					color: #FFF;
					border-left: 1px solid #0c449b;
					border-right: 1px solid #0c449b;
					&:hover {
						background: #FFF;
						color: #0c449b;
					}
				}
			}
		}
	}
}
#re_top {
	font-family: '游ゴシック', YuGothic, 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', '?揀Cリオ', 'Meiryo', 'Arial', sans-serif;
	width: 100%;
	overflow-x: hidden;
	>h1 {
		color: #000000;
	}
	& h2, h3, h4, p, li, a, span {
		color: #333333;
	}
	& a {
		text-decoration: none;
		&:hover {
			>img {
				opacity: 1;
			}
		}
	}
	#re_t_nav {
		margin: 0 0 75px 0;
		padding: 60px 0 60px 0;
		position: relative;
		z-index: 1;
		&:after {
			content: "";
			width: calc(50% + 730px);
			max-width: 96vw;
			background: #f1f3f9;
			height: 100%;
			position: absolute;
			top: 0;
			left: 0;
			z-index: -1;
		}
		>ul {
			display: flex;
			flex-wrap: wrap;
			justify-content: space-between;
			gap: 12px 0;
			width: 1073px;
			margin: 0 auto;
			>li {
				>a {
					display: block;
					background: #FFF;
					text-align: center;
					transition: all 0.2s;
					.re_t_nav_en {
						color: #0c449b;
						letter-spacing: 0.06em;
					}
					.re_t_nav_name {
						color: #333333;
						font-weight: bold;
						letter-spacing: 0.1em;
					}
					&:hover {
						background: #e4e8f5;
					}
				}
			}
			.re_t_nav_w {
				width: 525px;
				>a {
					padding: 25px 0 25px 0;
					.re_t_nav_en {
						margin: 0 0 10px 0;
						font-size: 14px;
						line-height: 1;
					}
					.re_t_nav_name {
						margin: 0 0 30px 0;
						font-size: 28px;
						line-height: 1.1;
					}
				}
			}
			.re_t_nav_t {
				width: 260px;
				>a {
					padding: 12px 0 15px 0;
					.re_t_nav_en {
						margin: 0 0 5px 0;
						font-size: 11px;
						line-height: 1;
					}
					.re_t_nav_name {
						display: flex;
						flex-direction: column;
						justify-content: center;
						height: 48px;
						margin: 0 0 10px 0;
						font-size: 20px;
						line-height: 1.1;
					}
				}
			}
			>li {
				&:nth-child(4) {
					>a {
						padding: 12px 0 7px 0;
					}
					.re_t_nav_name {
						margin: 0 0 0 0;
					}
				}
			}
		}
	}
	.re_t_tl {
		>h2 {
			font-size: 40px;
			line-height: 1;
			font-weight: bold;
			letter-spacing: 0.04em;
		}
		>p {
			display: flex;
			font-size: 14px;
			line-height: 1;
			font-weight: bold;
			letter-spacing: 0.1em;
		}
		.re_t_tl_en {
			align-items: center;
			gap: 0 10px;
			&:before {
				content: "";
				display: block;
				width: 62px;
				height: 1px;
			}
		}
		.re_t_tl_wh {
			color: #FFF;
		}
		>p.re_t_tl_wh {
			&:before {
				background: #FFF;
			}
		}
		.re_t_tl_bl {
			color: #0c449b;
		}
		>p.re_t_tl_bl {
			&:before {
				background: #0c449b;
			}
		}
	}
	.re_t_txt {
		font-size: 18px;
		line-height: 2;
		font-weight: bold;
		letter-spacing: 0.03em;
	}
	.re_t_btn_bl {
		background: #0c449b;
		color: #FFF;
	}
	.re_t_btn_wh {
		background: #FFF;
		color: #0c449b;
	}
	.re_t_btn {
		display: block;
		width: 350px;
		padding: 25px 0;
		font-size: 20px;
		line-height: 1;
		font-weight: bold;
		text-align: center;
		transition: all 0.2s;
		&:hover {
			background: #333333;
			color: #FFF;
		}
	}
	#re_t_info {
		width: 1100px;
		margin: 0 auto 120px auto;
		.re_t_info_tl {
			display: flex;
			align-items: flex-end;
			justify-content: space-between;
			margin: 0 0 65px 0;
			.re_t_tl {
				display: flex;
				align-items: center;
				gap: 0 25px;
				>h2 {
					margin: 0;
				}
				>p {
					align-items: center;
					gap: 0 18px;
					&:before {
						content: "";
						width: 308px;
						height: 1px;
						background: #333333;
					}
				}
			}
			>a {
				display: block;
				width: 250px;
				padding: 15px 0;
				background: #f4f4f4;
				font-size: 13px;
				line-height: 15px;
				font-weight: bold;
				text-align: center;
				letter-spacing: 0.14em;
				transition: all 0.2s;
				&:hover {
					background: #333333;
					color: #FFF;
				}
			}
		}
		.re_t_info_con {
			>iframe {
				width: 100%;
				height: 200px;
			}
		}
	}
	#re_t_hills {
		width: 100%;
		margin: 0 0 145px 0;
		padding: 60px 0 35px 0;
		background-image: url(/img/re_top/hills_bg.webp);
		background-size: cover;
		background-position: center;
		>div {
			width: 980px;
			margin: 0 auto;
			position: relative;
			.re_t_tl {
				margin: 0 0 30px 0;
				text-align: center;
				>p {
					justify-content: center;
					margin: 0 0 5px 0;
				}
				>img {
					margin: 0 0 12px 0;
				}
			}
			>p {
				margin: 0 0 35px 0;
				font-size: 18px;
				line-height: 1.8;
				color: #FFF;
				font-weight: bold;
				text-align: center;
				letter-spacing: 0.03em;
			}
			>a {
				display: block;
				width: 280px;
				margin: 0 auto 35px auto;
				padding: 15px 0;
				background: #FFFFFF;
				font-size: 13px;
				line-height: 15px;
				font-weight: bold;
				text-align: center;
				letter-spacing: 0.14em;
				transition: all 0.2s;
				&:hover {
					background: #333333;
					color: #FFF;
				}
			}
			>ul {
				display: flex;
				justify-content: flex-end;
				gap: 0 50px;
			}
			.re_t_hills_tower {
				position: absolute;
				bottom: -35px;
				left: -225px;
			}
		}
	}
	#re_t_kodate {
		margin: 0 0 260px 0;
		padding: 80px 0 620px 0;
		position: relative;
		overflow: hidden;
		&:after {
			content: "";
			height: 100%;
			width: calc(50% + 600px);
			max-width: 96vw;
			background: #edf0fb;
			position: absolute;
			top: 0;
			right: 0;
			z-index: -1;
		}
		>div {
			display: flex;
			align-items: flex-start;
			width: 1100px;
			margin: 0 auto;
			.re_t_tl {
				margin-left: 25px;
				display: flex;
				align-items: flex-start;
				gap: 0 40px;
				>h2 {
					-ms-writing-mode: tb-rl;
					writing-mode: vertical-rl;
				}
				>p {
					transform: rotate(90deg);
					transform-origin: 0 0;
				}
			}
			.re_t_kodate_box {
				transform: translateX(-80px);
				>p {
					margin: 0 0 50px 0;
				}
			}
		}
		>ul {
			display: flex;
			gap: 0 30px;
			width: 1234px;
			position: absolute;
			right: calc(50% - 550px);
			bottom: 70px;
			>li:nth-child(2n) {
				margin-top: 50px;
			}
		}
	}
	#re_t_rent {
		margin: 0 0 220px 0;
		padding: 60px 0 140px 0;
		position: relative;
		overflow: hidden;
		>div {
			width: 790px;
			margin: 0 auto;
			position: relative;
			.re_t_tl {
				margin: 0 0 70px 0;
				>p {
					margin: 0 0 25px 0;
				}
			}
			.re_t_txt {
				margin: 0 0 75px 0;
			}
			>img {
				position: absolute;
				top: 80px;
				right: 0;
			}
		}
		.re_t_rent_img01 {
			position: absolute;
			top: 0;
			right: calc(50% + 500px);
		}
		.re_t_rent_img02 {
			position: absolute;
			top: 0;
			left: calc(50% + 500px);
		}
	}
	#re_t_owner {
		margin: 0 0 330px 0;
		position: relative;
		width: 100%;
		&:before {
			content: "";
			width: 1640px;
			height: 1640px;
			background: #f1f3f9;
			border-radius: 50%;
			position: absolute;
			top: -360px;
			right: calc(50% - 180px);
			z-index: -2;
		}
		>div {
			width: 1100px;
			margin: 0 auto;
			padding: 65px 0 0 0;
			position: relative;
			.re_t_tl {
				margin: 0 0 80px 0;
				>p {
					margin: 0 0 25px 0;
				}
			}
			.re_t_owner_catch {
				margin: 0 0 50px 0;
				font-size: 30px;
				line-height: 1.33;
				font-weight: bold;
				letter-spacing: 0.1em;
				>span {
					color: #0c449b;
					font-weight: bold;
				}
			}
			.re_t_txt {
				margin: 0 0 40px 0;
			}
			.re_t_owner_per {
				position: absolute;
				top: 125px;
				left: 350px;
				width: 252px;
				box-sizing: border-box;
				padding: 30px 0 15px 0;
				border: 1px solid #0c449b;
				border-radius: 5px;
				&:before {
					content: "";
					width: 55px;
					height: 1px;
					background: #f1f3f9;
					position: absolute;
					bottom: -1px;
					left: 12px;
				}
				&:after {
					content: "";
					width: 50px;
					height: 1px;
					background: #0c449b;
					transform: rotate(135deg);
					transform-origin: 0 0;
					position: absolute;
					bottom: 10px;
					left: 52px;
				}
				.re_t_owner_per_name {
					width: 152px;
					margin: auto;
					padding: 5px 0;
					background: #f1f3f9;
					border: 1px solid #0c449b;
					border-radius: 24px;
					font-size: 23px;
					line-height: 1;
					color: #0c449b;
					font-weight: bold;
					letter-spacing: 0.04em;
					text-align: center;
					position: absolute;
					top: -17px;
					left: 0;
					right: 0;
				}
				.re_t_owner_per_num {
					display: flex;
					align-items: baseline;
					justify-content: center;
					font-size: 90px;
					line-height: 1;
					color: #0c449b;
					font-weight: bold;
					letter-spacing: 0.04em;
					.re_t_owner_per_dot {
						font-size: 70px;
						color: #0c449b;
					}
					.re_t_owner_per_mark {
						font-size: 30px;
						color: #0c449b;
					}
				}
				.re_t_owner_per_cau {
					padding: 0 15px;
					font-size: 12px;
					line-height: 1;
					color: #0c449b;
					font-weight: bold;
					letter-spacing: 0.04em;
					text-align: right;
				}
			}
		}
		>img {
			position: absolute;
			top: 0;
			left: calc(50% + 105px);
		}
	}
	#re_t_sale {
		margin: 0 0 240px 0;
		padding: 100px 0 190px 0;
		position: relative;
		&:before {
			content: "";
			display: block;
			width: calc(50% + 200px);
			height: 100%;
			background: #0c449b;
			position: absolute;
			top: 0;
			right: 0;
			z-index: -2;
		}
		>div {
			display: flex;
			justify-content: flex-end;
			width: 1000px;
			margin: 0 auto;
			>div {
				width: 445px;
				.re_t_tl {
					margin: 0 0 50px 0;
					>p {
						margin: 0 0 25px 0;
					}
				}
				.re_t_txt {
					margin: 0 0 50px 0;
					color: #FFF;
				}
			}
		}
		.re_t_sale_img {
			position: absolute;
			bottom: -85px;
			right: calc(50% + 80px);
		}
		.re_t_sale_il {
			position: absolute;
			right: 100px;
			bottom: 65px;
			z-index: -1;
		}
	}
	#re_t_build {
		width: 100%;
		margin: 0 0 240px 0;
		padding: 110px 0 100px 0;
		background-image: url(/img/re_top/build_bg.webp);
		background-size: cover;
		background-position: center;
		>div {
			width: 1200px;
			margin: 0 auto;
			>div {
				width: 730px;
				padding: 50px 96px 40px 60px;
				background: #FFF;
				box-sizing: border-box;
				.re_t_tl {
					margin: 0 0 35px 0;
					>p {
						margin: 0 0 25px 0;
					}
				}
				.re_t_txt {
					margin: 0 0 45px 0;
				}
				>a {
					display: block;
					width: 365px;
					box-sizing: border-box;
					padding: 20px 0 20px 25px;
					border: 1px solid #000000;
					position: relative;
					transition: all 0.2s;
					&:after {
						content: "";
						display: block;
						width: 22px;
						height: 23px;
						margin: auto;
						background-image: url(/img/re_top/build_ar.webp);
						background-repeat: no-repeat;
						background-size: cover;
						background-position: center;
						position: absolute;
						top: 0;
						bottom: 0;
						right: 40px;
					}
					&:hover {
						background: #f4f4f4;
					}
				}
			}
		}
	}
	#re_t_recruit {
		margin: 0 0 220px 0;
		position: relative;
		>div {
			display: flex;
			justify-content: flex-end;
			width: 1200px;
			margin: 0 auto;
			>div {
				width: 675px;
				box-sizing: border-box;
				padding: 0 60px 0 60px;
				background: #FFF;
				.re_t_tl {
					margin: 0 0 45px 0;
					>p {
						margin: 0 0 20px 0;
					}
				}
				.re_t_txt {
					margin: 0 0 30px 0;
				}
			}
		}
		.re_t_recruit_img01 {
			height: 100%;
			object-fit: cover;
			position: absolute;
			top: 0;
			right: calc(50% + 75px);
		}
		.re_t_recruit_img02 {
			height: calc((100% - 20px)/2);
			object-fit: cover;
			position: absolute;
			top: 0;
			left: calc(50% + 600px);
		}
		.re_t_recruit_img03 {
			height: calc((100% - 20px)/2);
			object-fit: cover;
			position: absolute;
			bottom: 0;
			left: calc(50% + 600px);
		}
	}
	#re_t_company {
		margin: 0 0 60px 0;
		>ul {
			display: flex;
			margin: 0 0 120px 0;
			>li {
				width: 50%;
				>img {
					display: block;
				}
			}
		}
		.re_t_company_box {
			width: 1100px;
			margin: 0 auto;
			.re_t_tl {
				margin: 0 0 35px 0;
				>p {
					margin: 0 0 20px 0;
				}
				>h2 {
					font-size: 42px;
					line-height: 1.4;
					>span {
						font-size: 42px;
						color: #0c449b;
					}
				}
			}
			>ul {
				display: flex;
				gap: 0 45px;
				>li {
					width: 240px;
					>a {
						display: block;
						padding: 20px 0 20px 0;
						background: #f0f4fc;
						text-align: center;
						transition: all 0.3s;
						>p {
							font-weight: bold;
							letter-spacing: 0.1em;
							transition: all 0.3s;
						}
						.re_t_company_nav_en {
							margin: 0 0 6px 0;
							font-size: 18px;
							line-height: 1;
						}
						.re_t_company_nav_ja {
							margin: 0 0 15px 0;
							font-size: 13px;
							line-height: 1;
						}
						&:hover {
							background: #f4f4f4;
							>p {
								color: #0c449b;
							}
						}
					}
				}
			}
		}
	}
	#re_t_shop {
		width: 1180px;
		box-sizing: border-box;
		margin: 0 auto;
		padding: 55px 110px 30px 110px;
		background: #f1f5fc;
		.re_t_tl {
			margin: 0 0 45px 0;
			>p {
				margin: 0 0 25px 0;
			}
		}
		>ul {
			display: flex;
			flex-wrap: wrap;
			justify-content: center;
			gap: 15px 30px;
			>li {
				width: 300px;
				>a {
					display: block;
					padding: 20px;
					background: #FFF;
					>img {
						margin: 0 0 15px 0;
					}
					& p, li, span {
						font-weight: bold;
					}
					.re_t_shop_bl {
						color: #0c449b;
					}
					.re_t_shop_gr {
						color: #65b822;
					}
					.re_t_shop_name {
						margin: 0 0 5px 0;
						font-size: 18px;
						line-height: 1.25;
					}
					.re_t_shop_ad {
						font-size: 14px;
						line-height: 1.28;
					}
					>ul {
						margin: 0 0 5px 0;
						>li {
							font-size: 14px;
							line-height: 1.28;
						}
					}
					.re_t_shop_txt {
						margin: 0 0 5px 0;
						font-size: 12px;
						line-height: 1.25;
					}
					.re_t_shop_btn {
						width: 200px;
						margin: 0 auto;
						padding: 5px 0;
						font-size: 12px;
						line-height: 20px;
						color: #FFF;
						text-align: center;
						letter-spacing: 0.14em;
					}
					.re_t_shop_btn_bl {
						background: #0c449b;
					}
					.re_t_shop_btn_gr {
						background: #65b822;
					}
				}
				&:last-child {
					>a {
						>ul {
							margin: 0 0 23px 0;
						}
					}
				}
			}
		}
	}
}
.video {
	width: 100%;
	aspect-ratio: 16 / 9;
	position: relative;
	overflow: hidden;
	>video {
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
}
.re_t_main_caution {
	padding: 5px 10px;
	font-size: 12px;
	line-height: 1.5;
	text-align: right;
}
#re_footer {
	font-family: '游ゴシック', YuGothic, 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', '?揀Cリオ', 'Meiryo', 'Arial', sans-serif;
	margin: 140px 0 0 0;
	.re_f_box {
		width: 100%;
		margin: 0 0 60px 0;
		padding: 30px 0;
		background: #f0f4fc;
		>div {
			display: flex;
			align-items: center;
			gap: 0 25px;
			width: 1200px;
			margin: 0 auto;
			.re_f_box_l {
				>a {
					display: block;
					margin: 0 0 10px 0;
				}
				>p {
					font-size: 11px;
					line-height: 1.35;
				}
			}
			.re_f_box_r {
				display: flex;
				align-items: center;
				gap: 0 30px;
				padding: 0 0 0 20px;
				border-left: 1px solid #000;
				>div {
					>p {
						font-weight: bold;
					}
					.re_f_box_tel_txt {
						margin: 0 0 5px 0;
						font-size: 13px;
						line-height: 1;
					}
					.re_f_box_tel_num {
						display: flex;
						align-items: center;
						gap: 0 10px;
						margin: 0 0 5px 0;
						font-size: 30px;
						line-height: 1;
						letter-spacing: 0.08em;
						&:before {
							content: "";
							width: 33px;
							height: 19px;
							background-image: url(/img/re_footer/f_icon_tel.webp);
							background-repeat: no-repeat;
							background-position: center;
							background-size: cover;
						}
					}
					.re_f_box_tel_time {
						font-size: 11px;
						line-height: 1;
					}
				}
				>ul {
					display: flex;
					gap: 0 28px;
					>li {
						width: 230px;
						>a {
							display: block;
							padding: 15px 0;
							background: #0c449b;
							border-radius: 25px;
							font-size: 15px;
							line-height: 20px;
							color: #FFF;
							font-weight: bold;
							letter-spacing: 0.08em;
							text-align: center;
							transition: all 0.2s;
						}
					}
				}
			}
		}
	}
	.re_f_link {
		display: flex;
		align-items: flex-start;
		justify-content: center;
		gap: 0 55px;
		margin: 0 0 60px 0;
		>ul {
			>li {
				>a {
					font-size: 15px;
					line-height: 1.5;
					font-weight: bold;
					letter-spacing: 0.26em;
				}
			}
		}
		.re_f_link_part {
			>p {
				margin: 0 0 12px 0;
				font-size: 13px;
				line-height: 1;
				font-weight: bold;
				letter-spacing: 0.2em;
			}
			>ul {
				>li {
					&:not(:last-child) {
						margin: 0 0 8px 0;
					}
					>a {
						font-size: 13px;
						line-height: 1;
						font-weight: 500;
						letter-spacing: 0.2em;
					}
				}
			}
		}
	}
	>nav {
		width: 1100px;
		margin: 0 auto 35px auto;
		>ul {
			display: flex;
			justify-content: flex-end;
			gap: 0 25px;
			>li {
				>a {
					font-size: 13px;
					line-height: 1;
					font-weight: bold;
				}
			}
		}
	}
	.re_f_copy {
		padding: 5px 0;
		background: #222222;
		font-size: 11px;
		line-height: 15px;
		font-weight: 500;
		color: #FFF;
		text-align: center;
	}
}
.re_t_info_cms {
	display: flex;
	gap: 0 40px;
	margin: 0;
	padding: 0;
	list-style: none;
	>li {
		width: 340px;
		>a {
			display: flex;
			align-items: center;
			gap: 0 15px;
			text-decoration: none;
			font-family: '?????', YuGothic, '?????? Pro', 'Hiragino Kaku Gothic Pro', '????', 'Meiryo', 'Arial', sans-serif;
			.re_t_info_img {
				width: 105px;
				height: 100px;
				overflow: hidden;
				>img {
					width: 100%;
					height: 100%;
					object-fit: cover;
					transition: all 0.2s;
				}
			}
			.re_t_info_box {
				width: calc(100% - 120px);
				.re_t_info_date {
					margin: 0 0 12px 0;
					font-size: 12px;
					line-height: 15px;
					color: #0c449b;
				}
				.re_t_info_txt {
					margin: 0;
					height: 42px;
					>span {
						font-size: 14px;
						line-height: 1.5;
						color: #333333;
						letter-spacing: 0.1em;
						text-decoration: underline;
						overflow: hidden;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 2;
					}
				}
			}
			&:hover {
				.re_t_info_img {
					>img {
						transform: scale(1.1);
					}
				}
				.re_t_info_box {
					.re_t_info_txt {
						>span {
							text-decoration: none;
						}
					}
				}
			}
		}
	}
}
#jsp {
	margin-top: 0 !important;
}