@charset "shift_jis";
/*************************************************/
/* 制作を始める時にはtop.css、header.css、h_menu.cssの中身をを削除してください */
/* ナビメニューのプルダウンを使用したい場合にはh_menu.cssの記述を参考にしてみてください。 */
/* この下にあるコメントアウトを活用してください！ */
/* 「assessment」は売却査定フォームのデフォルトデザイン用cssです */
/*************************************************/
/*************************************************/
/*  assessment  */
/*************************************************/
.t_asse_form_wrap {
	width: 1000px;
	margin: 0 auto 40px;
}
.t_asse_form_wrap .h2_title {
	width: 1000px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.t_asse_form {
	margin: 20px auto;
	border-radius: 3px;
	box-shadow: 0 0 3px 0 #999;
	padding: 20px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.t_asse_form table {
	border-collapse: collapse;
	margin: 0;
	padding: 0;
	width: 100%;
}
.t_asse_form tr {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	margin-bottom: 3px;
}
.t_asse_form tr th,
.t_asse_form tr td {
	padding: 15px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
.t_asse_form tr th {
	width: 25%;
	background: #FAFAF9;
}
.t_asse_form tr th {
	display: -webkit-flex;
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: flex;
	justify-content: space-between;
	font-size: 14px;
	align-items: flex-start;
	text-align: left;
}
.t_asse_form tr td {
	width: 75%;
	font-size: 15px;
	line-height: 22px;
}
.t_asse_form th span {
	font-size: 12px;
	font-weight: bold;
	padding: 0 10px;
	line-height: 22px;
	border-radius: 3px;
}
.t_asse_form th span.t_asse_required {
	border: 1px solid #ff4a32;
	color: #ff4a32;
	background: #FFE8E5;
}
.t_asse_form th span.t_asse_any {
	border: 1px solid #237dc0;
	color: #237dc0;
	background: #dfebf5;
}
.t_asse_form td p {
	color: #999;
}
.t_asse_form td input[type="text"],
.t_asse_form td input[type="tel"],
.t_asse_form td input[type="password"],
.t_asse_form td input[type="number"],
.t_asse_form td textarea,
.t_asse_form td select {
	font-size: 16px;
	line-height: 24px;
	padding: 8px 15px;
	border: 1px solid #ccdae4;
	background: #f5f9fc;
	font-family: 'Arial', '游ゴシック', YuGothic, 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', sans-serif;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 3px;
	margin-bottom: 4px;
	margin-right: 5px;
}
.t_asse_form td input[type="button"] {
	font-family: 'Arial', '游ゴシック', YuGothic, 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', sans-serif;
	font-size: 16px;
	line-height: 24px;
	padding: 8px 15px;
	border: 1px solid #ccc;
	background: #eee;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 3px;
	cursor: pointer;
}
.t_asse_form td input[type="button"]:hover {
	background: #ccc;
}
.t_asse_form td select {
	cursor: pointer;
	height: 42px;
	vertical-align: bottom;
}
.t_asse_form td textarea {
	height: 150px;
	display: block;
}
.t_asse_form td label {
	border: 1px solid #ccdae4;
	background: #f5f9fc;
	cursor: pointer;
	border-radius: 3px;
	padding: 9px 15px 9px 9px;
	display: inline-block;
	margin: 0 2px 5px 0;
}
.t_asse_form td label input {
	width: 20px;
	height: 20px;
	margin-right: 5px;
}
.t_asse_form td label input[type="checkbox"],
.t_asse_form td label input[type="radio"] {
	vertical-align: sub;
	margin: 0 5px 0 0;
	cursor: pointer;
}
.t_asse_form td input[type="text"]:hover,
.t_asse_form td input[type="tel"]:hover,
.t_asse_form td input[type="password"]:hover,
.t_asse_form td input[type="number"]:hover,
.t_asse_form td textarea:hover,
.t_asse_form td select:hover,
.t_asse_form td label:hover {
	background: #f9fcf5;
	border: 1px solid #d6eaba;
}
.t_asse_btn input[type="submit"] {
	-webkit-appearance: none;
	border: 2px solid #2799fb;
	background: #2799fb;
	color: #fff;
	border-radius: 30px;
	width: 400px;
	height: 60px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	box-shadow: 0 0 3px 0 #999;
	padding: 0 40px;
	font-weight: bold;
	cursor: pointer;
	margin: 0 auto;
	font-size: 20px;
	display: block;
	font-family: 'Arial', '游ゴシック', YuGothic, 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', sans-serif;
}
.t_asse_btn input[type="submit"]:hover {
	color: #2799fb;
	background: #fff;
}
.t_asse_btn input[type="button"] {
	-webkit-appearance: none;
	border: 1px solid #ccc;
	background: #eee;
	border-radius: 3px;
	width: 100px;
	height: 40px;
	font-weight: bold;
	cursor: pointer;
	margin: 0 auto;
	display: block;
	font-family: 'Arial', '游ゴシック', YuGothic, 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo', sans-serif;
}
.t_asse_btn input[type="button"]:hover {
	background: #ccc;
}
body {
	font-family: "Zen Kaku Gothic Antique", serif;
	font-weight: 500;
	font-style: normal;
	margin: 0;
	padding: 27px 0 0 0;
	color: #000000;
}
.t_all {
	width: calc(100vw - 135px);
	& a {
		color: #000000;
		text-decoration: none;
	}
	& ul, & p, & h2, & h3 {
		padding: 0;
		margin: 0;
		list-style: none;
	}
	& img {
		display: block;
		max-width: 100%;
	}
	.t_tl {
		margin-bottom: clamp(30px, 3.8vh, 40px);
		>p {
			margin-bottom: clamp(24px, 2.8vh, 30px);
			font-size: clamp(40px, 2.7vw, 50px);
			line-height: 1;
			font-weight: 300;
		}
		>h2 {
			font-size: clamp(12px, 0.95vw, 18px);
			line-height: 1;
			font-weight: 500;
		}
	}
	.t_txt {
		font-size: clamp(12px, 0.88vw, 16px);
		line-height: 1.875;
	}
	.t_btn {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: clamp(200px, 16vw, 300px);
		padding: clamp(8px, 1vh, 11px) clamp(10px, 0.75vw, 12px) clamp(8px, 1vh, 11px) clamp(20px, 1.5vw, 25px);
		box-sizing: border-box;
		background: #FFF;
		border-radius: 20px;
		transition: all 0.2s;
		position: relative;
		>span {
			font-size: clamp(10px, 0.75vw, 14px);
			line-height: 1;
			text-decoration: underline;
			text-decoration-thickness: 1px;
			text-underline-offset: 8px;
			transition: all 0.2s;
		}
		>div {
			display: flex;
			align-items: center;
			justify-content: center;
			width: clamp(42px, 3vw, 56px);
			height: auto;
			aspect-ratio: 1 / 1;
			border-radius: 50%;
			transition: all 0.2s;
			>img {
				display: block;
				width: 30%;
				max-width: 16px;
				height: auto;
				aspect-ratio: 4 / 3;
			}
		}
		&:hover {
			border: 1px solid #333;
			>span {
				text-decoration-color: #333;
			}
			>div {
				background: #333;
			}
		}
	}
	.t_btn_gr {
		border: 1px solid #4cca2a;
		>span {
			text-decoration-color: #4cca2a;
		}
		>div {
			background: #4cca2a;
		}
	}
	.t_btn_beige {
		border: 1px solid #c9b879;
		>span {
			text-decoration-color: #c9b879;
		}
		>div {
			background: #c9b879;
		}
	}
	.t_conts_wide {
		width: clamp(1000px, 75vw, 1400px);
		margin-right: auto;
		margin-left: auto;
	}
	.t_catch_txt {
		margin-bottom: clamp(35px, 4.2vh, 45px);
		font-size: clamp(22px, 1.6vw, 30px);
		line-height: 1.65;
		font-weight: 500;
	}
	.t_main {
		display: flex;
		justify-content: space-between;
		margin-bottom: clamp(70px, 8.5vh, 90px);
		position: relative;
		&:before {
			content: "";
			display: block;
			width: clamp(600px, 45vw, 800px);
			height: auto;
			aspect-ratio: 1 /1;
			background-image: url(/img/top/main_circle.webp);
			background-repeat: no-repeat;
			background-size: cover;
			position: absolute;
			bottom: calc(clamp(180px, 22vh, 220px) * -1);
			left: calc(clamp(40px, 27vw, 50px) * -1);
			z-index: -1;
		}
		.t_main_box {
			flex-shrink: 0;
			width: clamp(200px, 15vw, 280px);
			padding: 20px 0 0 0;
			>a {
				display: block;
				margin: 0 0 40px 20px;
			}
			>p {
				margin: 0 0 30px 20px;
				font-size: clamp(12px, 0.95vw, 18px);
				line-height: 1.65;
				>span {
					color: #4cca2a;
				}
			}
			>nav {
				display: flex;
				justify-content: center;
				width: 100%;
				padding: clamp(28px, 3.4vh, 35px) 0;
				border-radius: 0 20px 20px 0;
				background: #FFF;
				>ul {
					>li {
						>a {
							font-size: clamp(12px, 0.95vw, 18px);
							line-height: 1;
							transition: all 0.2s;
							>span {
								padding-left: 10px;
								font-size: clamp(8px, 0.63vw, 12px);
								color: #4cca2a;
							}
							&:hover {
								color: #4cca2a;
							}
						}
						&:not(:last-child) {
							margin-bottom: clamp(15px, 1.9vh, 20px);
						}
					}
				}
			}
		}
		.t_main_img {
			display: flex;
			align-items: flex-end;
			justify-content: flex-end;
			width: calc(100% - clamp(200px, 15vw, 280px) - 50px);
			box-sizing: border-box;
			padding-top: clamp(320px, 40vh, 430px);
			padding-right: 55px;
			padding-bottom: 55px;
			border-radius: clamp(75px, 5.5vw, 100px) 0 100px 100px;
			overflow: hidden;
			position: relative;
			.t_main_album {
				width: 100%;
				height: 100%;
				position: absolute;
				top: 0;
				right: 0;
				z-index: -1;
				>img {
					width: 100%;
					height: 100%;
					object-fit: cover;
				}
			}
			.t_main_catch {
				>p {
					width: clamp(450px, 34vw, 628px);
				}
				>h2 {
					width: clamp(480px, 36vw, 679px);
				}
			}
		}
	}
	#t_service {
		margin-bottom: clamp(90px, 11.5vh, 120px);
		.t_service_box {
			display: flex;
			gap: 0 clamp(45px, 3.2vw, 60px);
			>div {
				width: calc((100% - clamp(45px, 3.2vw, 60px))/2);
				>h3 {
					margin-bottom: clamp(30px, 3.8vh, 40px);
					font-size: clamp(30px, 2.2vw, 40px);
					font-weight: 400;
					line-height: 1;
					>span {
						padding: 0 5px 0 0;
						font-size: clamp(40px, 3vw, 55px);
					}
				}
				>ul {
					display: flex;
					gap: 0 clamp(22px, 1.6vw, 30px);
					>li {
						width: calc((100% - clamp(22px, 1.6vw, 30px))/2);
						>a {
							display: block;
							width: 100%;
							height: auto;
							aspect-ratio: 1 / 1;
							box-sizing: border-box;
							padding: clamp(20px, 1.4vw, 25px) clamp(18px, 1.4vw, 25px) 10px clamp(18px, 1.4vw, 25px);
							border-radius: clamp(22px, 1.6vw, 30px);
							position: relative;
							transition: all 0.2s;
							.t_service_name {
								margin: 0 0 clamp(5px, 0.7vh, 8px) 0;
								font-size: clamp(20px, 1.4vw, 25px);
								line-height: 1.2;
								text-align: center;
								letter-spacing: 0.05em;
							}
							.t_service_en {
								margin: 0 0 clamp(8px, 1.1vh, 12px) 0;
								font-size: clamp(11px, 0.85vw, 16px);
								line-height: 1.2;
								text-align: center;
								font-weight: 300;
							}
							.t_service_img {
								height: 45%;
								margin: 0 0 clamp(8px, 1.1vh, 12px) 0;
								text-align: center;
								position: relative;
								>img {
									display: inline-block;
									max-height: 100%;
								}
								&:before {
									content: "";
									width: auto;
									height: 90%;
									aspect-ratio: 1 /1;
									margin: auto;
									border-radius: 50%;
									position: absolute;
									left: 0;
									right: 0;
									bottom: 0;
									z-index: -1;
								}
							}
							.t_service_txt {
								font-size: clamp(9px, 0.7vw, 13px);
								line-height: 1.38;
							}
							.t_service_more {
								display: flex;
								justify-content: flex-end;
								width: 100%;
								box-sizing: border-box;
								padding: 0 clamp(18px, 1.4vw, 25px);
								position: absolute;
								bottom: 15px;
								left: 0;
								>p {
									padding: 0 12px 0 8px;
									clip-path: polygon(0 0, 90% 0%, 100% 100%, 0% 100%);
									font-size: clamp(9px, 0.7vw, 13px);
									line-height: 1.55;
									color: #FFF;
								}
							}
							&:hover {
								transform: translateY(-10px);
							}
						}
					}
				}
			}
			.t_service_rent {
				>ul {
					>li {
						>a {
							box-shadow: 0px 0px 20px 3px #eefdea;
							.t_service_img {
								&:before {
									background-color: #eefdea;
								}
							}
							.t_service_more {
								>p {
									background: #4cca2a;
								}
							}
							&:hover {
								box-shadow: 0px 5px 40px 8px #e8ffe2;
							}
						}
					}
				}
			}
			.t_service_buy {
				>ul {
					>li {
						>a {
							box-shadow: 0px 0px 20px 3px #f8f5ea;
							.t_service_img {
								&:before {
									background-color: #f8f5ea;
								}
							}
							.t_service_more {
								>p {
									background: #c9b879;
								}
							}
							&:hover {
								box-shadow: 0px 5px 40px 8px #f7f2e3;
							}
						}
					}
				}
			}
		}
	}
	#t_info {
		margin-bottom: clamp(90px, 11.5vh, 120px);
		position: relative;
		>div {
			>div {
				>div {
					display: flex;
					justify-content: flex-end;
					>div {
						width: clamp(620px, 48vw, 900px);
						>div {
							display: flex;
							align-items: flex-end;
							justify-content: space-between;
							margin-bottom: clamp(30px, 3.8vh, 40px);
							.t_tl {
								margin-bottom: 0;
							}
						}
						>iframe {
							width: 100%;
							height: clamp(420px, 55.5vh, 520px);
						}
					}
				}
				>img {
					width: clamp(365px, 30vw, 580px);
					height: auto;
					aspect-ratio: 1 / 1;
					border-radius: 40px;
					position: absolute;
					top: clamp(50px, 7.5vh, 80px);
					left: clamp(25px, 2.2vw, 40px);
				}
			}
		}
	}
	#t_philo {
		padding-top: clamp(60px, 7vh, 75px);
		position: relative;
		z-index: 1;
		overflow: hidden;
		&:before {
			content: "";
			display: block;
			width: 96%;
			height: 30%;
			background-image: url(/img/top/noise.png);
			background-repeat: repeat;
			background-size: 100px;
			mix-blend-mode: overlay;
			opacity: 0.7;
			position: absolute;
			left: 0;
			top: 0;
			z-index: -1;
		}
		&:after {
			content: "";
			display: block;
			width: 96%;
			height: 30%;
			background: linear-gradient(180deg, rgba(242, 255, 239, 1) 0%, rgba(255, 255, 255, 1) 100%);
			position: absolute;
			left: 0;
			top: 0;
			z-index: -2;
		}
		.t_philo_box {
			width: clamp(850px, 65vw, 1220px);
			margin-left: auto;
			margin-right: auto;
		}
		.t_philo_txt {
			margin-bottom: clamp(60px, 7vh, 75px);
			position: relative;
			>img {
				width: clamp(600px, 45vw, 825px);
				border-radius: 40px 0 0 40px;
				object-fit: cover;
				position: absolute;
				right: 0;
				bottom: 0;
			}
		}
		#t_philo_promise {
			display: flex;
			justify-content: space-between;
			margin-bottom: clamp(80px, 9vh, 100px);
			>h3 {
				font-size: clamp(28px, 2vw, 36px);
				line-height: 1;
				letter-spacing: 0.05em;
				font-weight: 500;
				-ms-writing-mode: tb-rl;
				writing-mode: vertical-rl;
				position: relative;
				&:before {
					content: "";
					display: block;
					width: clamp(200px, 16.5vw, 314px);
					height: auto;
					aspect-ratio: 1 / 1;
					background-image: url(/img/top/promise_ci.webp);
					background-repeat: no-repeat;
					background-size: cover;
					position: absolute;
					top: 0;
					left: calc(clamp(105px, 7.8vw, 150px)*-1);
					z-index: -1;
				}
			}
			>ul {
				display: flex;
				gap: 0 clamp(30px, 2.8vw, 55px);
				width: clamp(780px, 58vw, 1100px);
				>li {
					width: calc((100% - clamp(30px, 2.8vw, 55px)*2)/3);
					background: #eefdea;
					border-radius: 20px;
					position: relative;
					&:before {
						content: "";
						display: block;
						width: 100%;
						height: auto;
						aspect-ratio: 1 / 1;
						background: #FFF;
						border-radius: 50%;
						position: absolute;
						top: 0;
						left: 0;
					}
					>div {
						padding: clamp(55px, 6.2vh, 65px) 0 clamp(12px, 1.4vh, 15px) 0;
						position: relative;
						z-index: 1;
						>span {
							display: block;
							font-size: clamp(10px, 0.75vw, 14px);
							transform: rotate(-90deg);
							position: absolute;
							top: clamp(40px, 5.2vh, 55px);
							left: -10px;
						}
						>img {
							width: 60%;
							margin: 0 auto 10px auto;
						}
						.t_philo_promise_num {
							font-size: clamp(32px, 2.7vw, 50px);
							line-height: 1;
							font-weight: 300;
							position: absolute;
							top: 15px;
							right: 15px;
						}
						.t_philo_promise_catch {
							margin-bottom: clamp(12px, 1.4vh, 15px);
							padding-bottom: clamp(12px, 1.4vh, 15px);
							border-bottom: 1px solid #4cca2a;
							font-size: clamp(12px, 0.9vw, 17px);
							line-height: 1.5;
							text-align: center;
						}
						.t_philo_promise_txt {
							padding: 0 clamp(15px, 1.05vw, 20px);
							font-size: clamp(11px, 0.65vw, 13px);
							line-height: 1.65;
						}
					}
				}
			}
		}
		.t_philo_tl {
			>p {
				font-size: clamp(11px, 0.85vw, 16px);
			}
			>h3 {
				font-size: clamp(30px, 2.2vw, 42px);
				line-height: 1.42;
				font-weight: 500;
			}
		}
		#t_philo_dif {
			position: relative;
			margin-bottom: clamp(65px, 7.5vh, 80px);
			padding-bottom: clamp(100px, 12.5vh, 130px);
			.t_philo_tl {
				display: flex;
				align-items: flex-start;
				gap: 0 20px;
				padding-left: clamp(190px, 14vw, 280px);
				>p {
					-ms-writing-mode: tb-rl;
					writing-mode: vertical-rl;
				}
				>h3 {
					-ms-writing-mode: tb-rl;
					writing-mode: vertical-rl;
				}
			}
			.t_philo_dif_box {
				width: clamp(675px, 57vw, 1075px);
				overflow: hidden;
				position: absolute;
				top: 0;
				left: clamp(340px, 25vw, 470px);
				>div {
					>ul {
						>li {
							width: clamp(540px, 40vw, 750px);
							box-sizing: border-box;
							padding: clamp(18px, 1.4vw, 25px);
							background: #eefdea;
							border-radius: 20px;
							.t_philo_dif_eng {
								margin-bottom: clamp(15px, 1.85vh, 20px);
								font-size: clamp(10px, 0.75vw, 14px);
							}
							>h4 {
								display: flex;
								align-items: flex-start;
								gap: 0 30px;
								margin: 0 0 clamp(15px, 1.9vh, 20px) 0;
								>span {
									color: #4cca2a;
								}
								>span.font_lexend {
									font-size: clamp(27px, 1.95vw, 36px);
									font-weight: 300;
								}
								>span.t_philo_dif_name {
									display: block;
									width: 100%;
									padding-bottom: clamp(15px, 1.9vh, 20px);
									border-bottom: 1px solid #4cca2a;
									font-size: clamp(22px, 1.6vw, 30px);
									font-weight: 500;
								}
							}
							.t_txt {
								margin-bottom: clamp(15px, 1.9vh, 20px);
								line-height: 1.5;
							}
							>img {
								border-radius: 16px;
							}
						}
					}
				}
			}
			>img {
				width: clamp(200px, 17.5vw, 333px);
				position: absolute;
				bottom: 0;
				left: 0;
			}
		}
		#t_philo_reco {
			padding: clamp(65px, 7.5vh, 80px) 0;
			background: linear-gradient(260deg, rgba(242, 255, 239, 1) 0%, rgba(255, 255, 255, 1) 100%);
			position: relative;
			&:before {
				content: "";
				display: block;
				width: 100%;
				height: 100%;
				background-image: url(/img/top/noise.png);
				background-repeat: repeat;
				background-size: 100px;
				mix-blend-mode: overlay;
				opacity: 0.7;
				position: absolute;
				left: 0;
				top: 0;
			}
			>div {
				display: flex;
				align-items: center;
				justify-content: space-between;
				position: relative;
				z-index: 1;
				>div {
					width: fit-content;
					padding-bottom: clamp(170px, 21.5vh, 230px);
					position: relative;
					.t_philo_tl {
						>h3 {
							margin-bottom: clamp(22px, 2.8vh, 30px);
						}
					}
					>img {
						width: clamp(150px, 11vw, 205px);
						position: absolute;
						right: clamp(65px, 4.8vw, 90px);
						bottom: 0;
					}
				}
				>ul {
					display: flex;
					flex-wrap: wrap;
					gap: 10px;
					width: clamp(430px, 33vw, 610px);
					>li {
						display: flex;
						flex-direction: column;
						align-items: center;
						justify-content: center;
						width: calc((100% - 10px)/2);
						height: auto;
						box-sizing: border-box;
						padding: clamp(15px, 1.9vh, 20px) 0 0 0;
						aspect-ratio: 1 / 1;
						background: #FFF;
						border-radius: 50%;
						>p {
							margin-bottom: clamp(15px, 1.9vh, 20px);
							font-size: clamp(15px, 1.05vw, 20px);
							line-height: 1.3;
							text-align: center;
						}
						>img {
							width: 68%;
							margin: 0 auto;
						}
					}
				}
			}
		}
		.swiper-pagination-custom {
			display: flex;
			align-items: center;
			justify-content: flex-end;
			gap: 0 10px;
			width: clamp(540px, 40vw, 750px);
			margin-top: 15px;
			.current-slide, .total-slides {
				font-size: 16px;
				line-height: 1;
				color: #4cca2a;
			}
			.pagination-line {
				width: 95px;
				height: 2px;
				background: #4cca2a;
			}
		}
		.swiper-paginationbar {
			position: absolute;
			bottom: 0;
			.swiper-pagination-bullet {
				width: 50px;
				height: 6px;
				background: #eefdea;
				border-radius: 0;
				opacity: 1;
				position: relative;
				&:before {
					content: "";
					width: 0;
					height: 100%;
					background: #4cca2a;
					position: absolute;
					left: 0;
					top: 0;
				}
			}
			.swiper-pagination-bullet-active {
				&:before {
					width: 100%;
					transition: 4s all ease 0s;
				}
			}
		}
	}
	& ul.t_house_ul {
		display: flex;
		gap: 0 20px;
		>li {
			width: calc((100% - 60px)/4);
			>a {
				display: block;
				box-sizing: border-box;
				padding: 14px;
				background: #FFF;
				border-radius: 10px;
				.t_house_img {
					width: 100%;
					aspect-ratio: 53 / 30;
					margin: 0 0 8px 0;
					border-radius: 8px;
					overflow: hidden;
					position: relative;
					>img {
						width: 100%;
						height: 100%;
						object-fit: cover;
						transition: all 0.2s;
					}
					>p {
						font-size: clamp(13px, 0.82vw, 15px);
						position: absolute;
						bottom: 0;
						right: 0;
						padding: 0 8px 0 12px;
						border-radius: 8px 0 0 0;
						background: #FFF;
						font-size: clamp(13px, 0.82vw, 15px);
						line-height: 2;
					}
				}
				>p {
					margin: 0 0 8px 0;
					font-size: clamp(15px, 1vw, 18px);
					line-height: 1.2;
					>span {
						overflow: hidden;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 1;
					}
				}
				.t_house_box {
					padding: 10px;
					border-radius: 8px;
					>div {
						display: flex;
						align-items: flex-end;
						gap: 0 10px;
						margin: 0 0 2px 0;
						>p {
							line-height: 1.2;
							letter-spacing: 0.05em;
						}
						.t_house_price {
							font-size: clamp(18px, 1.2vw, 22px);
						}
						.t_house_price_s {
							display: flex;
							align-items: center;
							gap: 0 10px;
							font-size: clamp(11px, 0.85vw, 16px);
							&:before {
								content: "";
								display: block;
								width: 1px;
								height: clamp(11px, 0.85vw, 16px);
								background: #000000;
								transform: rotate(25deg);
							}
						}
					}
					>p {
						>span {
							font-size: clamp(10px, 0.75vw, 14px);
							line-height: 1.5;
							overflow: hidden;
							display: -webkit-box;
							-webkit-box-orient: vertical;
							-webkit-line-clamp: 1;
						}
					}
				}
				&:hover {
					.t_house_img {
						>img {
							filter: grayscale(100%);
							transform: scale(1.2);
						}
					}
				}
			}
		}
	}
	#t_rent {
		margin-bottom: clamp(90px, 11.5vh, 120px);
		padding-top: clamp(35px, 4.7vh, 50px);
		overflow: hidden;
		position: relative;
		& iframe {
			width: 100%;
			height: 300px;
			z-index: 2;
			position: relative;
		}
		& h3 {
			position: relative;
			z-index: 1;
			&:before {
				content: "";
				display: block;
				width: clamp(200px, 16.5vw, 314px);
				height: auto;
				aspect-ratio: 1 / 1;
				background-image: url(/img/top/promise_ci.webp);
				background-repeat: no-repeat;
				background-size: cover;
				position: absolute;
				top: calc(clamp(90px, 11.5vh, 120px) * -1);
				left: calc(clamp(105px, 7.8vw, 150px) * -1);
				z-index: -1;
			}
		}
		>div {
			display: flex;
			flex-direction: column;
			align-items: end;
			justify-content: flex-end;
			width: clamp(1030px, 80vw, 1500px);
			margin: 0 auto;
			>div {
				width: clamp(900px, 67vw, 1240px);
				margin: 0 0 110px 0;
				.t_txt {
					width: clamp(450px, 30vw, 560px);
					margin: 0 0 60px 0;
				}
			}
			>article {
				width: clamp(900px, 67vw, 1240px);
				>h3 {
					margin: 0 0 35px 0;
					font-size: clamp(30px, 2vw, 36px);
					line-height: 1.2;
					font-weight: 500;
				}
				>ul {
					>li {
						>a {
							border: 1px solid #4cca2a;
							.t_house_box {
								background: #eefdea;
							}
						}
					}
				}
			}
		}
		.t_rent_img01 {
			width: clamp(200px, 16.5vw, 320px);
			height: auto;
			aspect-ratio: 32 / 45;
			object-fit: cover;
			border-radius: 20px;
			position: absolute;
			right: calc(50% + clamp(400px, 30vw, 555px));
			top: clamp(150px, 19.5vh, 210px);
		}
		.t_rent_img02 {
			width: auto;
			height: calc(2 * clamp(175px, 14.5vw, 275px));
			aspect-ratio: 8.5 / 11;
			object-fit: cover;
			border-radius: 20px;
			position: absolute;
			right: calc(clamp(175px, 14.5vw, 275px) + 10px);
			top: 0;
		}
		.t_rent_img03 {
			width: clamp(175px, 14.5vw, 275px);
			height: auto;
			aspect-ratio: 1 / 2;
			object-fit: cover;
			border-radius: 20px 0 0 20px;
			position: absolute;
			right: 0;
			top: 0;
		}
	}
	#t_buy {
		margin: 0 auto 50px auto;
		padding: 40px 0 0 0;
		position: relative;
		>div {
			display: flex;
			flex-direction: column;
			align-items: flex-end;
			width: clamp(900px, 67vw, 1240px);
			margin: 0 auto 50px auto;
			>div {
				width: clamp(450px, 34vw, 620px);
				margin: 0 0 120px 0;
				.t_txt {
					margin: 0 0 60px 0;
				}
				.t_buy_btn {
					display: flex;
					gap: 0 10px;
				}
			}
			>article {
				width: 100%;
				>h3 {
					margin: 0 0 35px 0;
					font-size: clamp(30px, 2vw, 36px);
					line-height: 1.2;
					font-weight: 500;
					position: relative;
					z-index: 1;
					&:before {
						content: "";
						display: block;
						width: clamp(200px, 16.5vw, 314px);
						height: auto;
						aspect-ratio: 1 / 1;
						background-image: url(/img/top/promise_ci02.webp);
						background-repeat: no-repeat;
						background-size: cover;
						position: absolute;
						top: calc(clamp(90px, 11.5vh, 120px) * -1);
						left: calc(clamp(105px, 7.8vw, 150px) * -1);
						z-index: -1;
					}
				}
				>ul {
					z-index: 2;
					position: relative;
					>li {
						>a {
							border: 1px solid #c9b879;
							.t_house_box {
								background: #faf8f0;
							}
						}
					}
				}
			}
		}
		.t_buy_img01 {
			width: clamp(240px, 20vw, 380px);
			border-radius: 20px;
			position: absolute;
			left: 15px;
			top: 0;
		}
		.t_buy_img02 {
			width: clamp(240px, 20vw, 380px);
			border-radius: 20px;
			position: absolute;
			left: calc(clamp(240px, 20vw, 380px) + 30px);
			top: 100px;
		}
		.t_buy_img03 {
			width: clamp(100px, 8.5vw, 160px);
			border-radius: 20px 0 0 20px;
			position: absolute;
			right: 0;
			top: 200px;
		}
	}
	#t_mem {
		width: clamp(900px, 67vw, 1240px);
		margin: 0 auto clamp(90px, 11.5vh, 120px) auto;
		>a {
			display: flex;
			align-items: center;
			padding: 30px;
			border-radius: 20px;
			background: #faf8f0;
			transition: all 0.2s;
			&:hover {
				transform: translateY(-10px);
				.t_btn {
					border: 1px solid #333;
				}
				.t_btn_beige span {
					text-decoration-color: #333;
				}
				.t_btn_beige div {
					background: #333;
				}
			}
			.t_mem_box {
				width: clamp(225px, 17.2vw, 320px);
				.t_mem_en {
					margin-bottom: clamp(15px, 1.9vh, 20px);
					font-size: clamp(15px, 1.05vw, 20px);
					line-height: 1.2;
					font-weight: 400;
				}
				.t_mem_name {
					display: inline-block;
					margin-bottom: clamp(15px, 1.9vh, 20px);
					padding-bottom: 8px;
					border-bottom: 1px solid #c9b879;
					font-size: clamp(20px, 1.55vw, 28px);
					line-height: 1.2;
					font-weight: 500;
				}
				>h2 {
					margin-bottom: clamp(15px, 1.9vh, 20px);
					font-size: clamp(32px, 2.3vw, 42px);
					line-height: 1.3;
					font-weight: 500;
					letter-spacing: 0.05em;
					.color_red {
						color: #cc5151;
					}
					.t_mem_tl_s {
						font-size: clamp(27px, 2vw, 36px);
					}
				}
			}
			>ul {
				width: calc(100% - clamp(200px, 16vw, 300px));
				display: flex;
				gap: 10px;
				>li {
					width: calc((100% - 20px)/3);
					box-sizing: border-box;
					padding: 5px 1.3% 0 1.3%;
					position: relative;
					z-index: 1;
					&:before {
						content: "";
						display: block;
						width: 100%;
						height: auto;
						aspect-ratio: 1 / 1;
						background: #FFF;
						border-radius: 50%;
						position: absolute;
						top: 0;
						left: 0;
						z-index: -1;
					}
					.t_mem_num {
						font-size: clamp(20px, 1.5vw, 27px);
						font-weight: 300;
						line-height: 1.5;
					}
					>h3 {
						margin: 0 0 10px 0;
						font-size: clamp(19px, 1.45vw, 26px);
						font-weight: 500;
						line-height: 1.2;
						letter-spacing: 0.05em;
						>span {
							font-size: clamp(18px, 1.2vw, 22px);
						}
					}
					.t_mem_txt {
						margin: 0 0 8px 0;
						font-size: clamp(8px, 0.63vw, 12px);
						line-height: 1.33;
						text-align: center;
					}
					>img {
						width: 50%;
						margin: 0 auto;
					}
				}
			}
		}
	}
	#t_owner {
		margin: 0 0 60px 0;
		padding: 150px 0 0 0;
		position: relative;
		&:before {
			content: "";
			display: block;
			width: 96%;
			height: 100%;
			background-image: url(/img/top/noise.png);
			background-repeat: repeat;
			background-size: 100px;
			mix-blend-mode: overlay;
			opacity: 0.7;
			position: absolute;
			left: 0;
			top: 0;
		}
		&:after {
			content: "";
			display: block;
			width: 96%;
			height: 100%;
			background: linear-gradient(0deg, rgba(242, 255, 239, 1) 0%, rgba(255, 255, 255, 1) 100%);
			position: absolute;
			left: 0;
			top: 0;
			z-index: -1;
		}
		>div {
			display: flex;
			align-items: flex-end;
			justify-content: space-between;
			width: clamp(1000px, 75vw, 1400px);
			box-sizing: border-box;
			margin-right: auto;
			margin-left: auto;
			padding-bottom: clamp(60px, 7.5vh, 80px);
			position: relative;
			>div {
				width: clamp(450px, 33.5vw, 620px);
				.t_txt {
					margin-bottom: clamp(35px, 4.2vh, 45px);
				}
				.t_ow_btn {
					display: flex;
					gap: 0 10px;
				}
			}
			>ul {
				width: clamp(520px, 40vw, 740px);
				display: flex;
				align-items: flex-end;
				gap: 0 clamp(30px, 2.2vw, 40px);
				>li {
					width: calc((100% - clamp(30px, 2.2vw, 40px))/2);
					&:nth-child(1) {
						margin-bottom: 60px;
					}
					>a {
						display: flex;
						flex-direction: column;
						align-items: flex-start;
						justify-content: space-between;
						width: 100%;
						height: auto;
						box-sizing: border-box;
						padding: clamp(15px, 1.05vw, 20px);
						aspect-ratio: 1 / 1;
						border: 1px solid #4cca2a;
						background: #FFF;
						border-radius: 30px;
						box-shadow: 0px 0px 20px 3px #eefdea;
						overflow: hidden;
						position: relative;
						z-index: 1;
						transition: all 0.2s;
						&:before {
							content: "";
							display: block;
							width: calc(100% - 10px);
							height: auto;
							aspect-ratio: 1 / 1;
							background: #eefdea;
							border-radius: 50%;
							position: absolute;
							bottom: 15px;
							right: -30%;
							z-index: -1;
							transition: all 0.4s ease-in-out;
						}
						>img {
							width: 68.5%;
							position: absolute;
							top: clamp(30px, 4.5vh, 50px);
							right: 0;
						}
						.t_ow_part_en {
							font-size: clamp(15px, 1vw, 18px);
							line-height: 1.2;
							position: absolute;
							right: clamp(15px, 1.05vw, 20px);
							top: clamp(15px, 1.05vw, 20px);
						}
						.t_ow_part_tl {
							.t_ow_part_num {
								font-size: clamp(22px, 1.65vw, 30px);
								line-height: 1.5;
								font-weight: 300;
							}
							>h3 {
								font-size: clamp(18px, 1.3vw, 24px);
								line-height: 1.5;
								font-weight: 500;
							}
						}
						.t_ow_part_box {
							padding: 10px 0 0 0;
							border-top: 1px solid #4cca2a;
							.t_ow_part_txt {
								margin-bottom: 8px;
								font-size: clamp(10px, 0.75vw, 14px);
								line-height: 1.5;
							}
							.t_ow_part_more {
								display: flex;
								justify-content: flex-end;
								>span {
									display: inline-block;
									padding: 0 12px 0 8px;
									clip-path: polygon(0 0, 95% 0, 100% 100%, 0% 100%);
									background: #4cca2a;
									font-size: clamp(10px, 0.75vw, 14px);
									line-height: 1.5;
									color: #FFF;
									transition: all 0.2s;
								}
							}
						}
						&:hover {
							transform: translateY(-10px);
							&:before {
								transform: scale(2.5);
							}
							.t_ow_part_more {
								>span {
									background: #000;
								}
							}
						}
					}
				}
			}
		}
		.t_owner_img {
			width: clamp(656px, 55vw, 1040px);
			height: auto;
			aspect-ratio: 13 / 3;
			border-radius: 20px 0 0 20px;
			position: absolute;
			top: 0;
			right: 0;
		}
	}
	#t_sale {
		margin-bottom: clamp(100px, 12.5vh, 130px);
		padding: clamp(80px, 9vh, 100px) 0 0 0;
		position: relative;
		>div {
			width: clamp(1030px, 80vw, 1500px);
			box-sizing: border-box;
			margin: 0 auto;
			padding: 0 0 0 calc(clamp(1030px, 80vw, 1500px)/2);
			position: relative;
			&:before {
				content: "";
				width: 100%;
				height: calc(100% - 50px);
				margin: auto;
				background-image: url(/img/top/noise.png);
				background-repeat: repeat;
				background-size: 100px;
				mix-blend-mode: overlay;
				opacity: 0.7;
				position: absolute;
				top: 0;
				bottom: 0;
				left: 0;
				z-index: -1;
			}
			&:after {
				content: "";
				width: 100%;
				height: calc(100% - 50px);
				margin: auto;
				background: #faf8f0;
				position: absolute;
				top: 0;
				bottom: 0;
				left: 0;
				z-index: -2;
			}
			.t_txt {
				margin: 0 0 60px 0;
			}
			.t_sale_btn {
				display: flex;
				gap: 0 10px;
			}
		}
		>img {
			width: clamp(500px, 42vw, 800px);
			height: auto;
			aspect-ratio: 80 / 57;
			border-radius: 0 40px 40px 0;
			position: absolute;
			top: 0;
			left: 0;
		}
	}
	#t_about {
		width: clamp(1030px, 80vw, 1500px);
		margin: 0 auto 0 auto;
		position: relative;
		>div {
			width: clamp(1000px, 75vw, 1400px);
			margin: 0 auto 70px auto;
			.t_txt {
				margin: 0 0 60px 0;
			}
			.t_ab_btn {
				display: flex;
				gap: 0 10px;
			}
		}
		>ul {
			display: flex;
			gap: 0 10px;
			padding: 25px;
			background: #eefdea;
			border-radius: 20px;
			width: clamp(1000px, 75vw, 1400px);
			margin: 0 auto;
			>li {
				width: calc((100% - 30px)/4);
				>a {
					display: block;
					width: 100%;
					height: auto;
					aspect-ratio: 3 / 2;
					box-sizing: border-box;
					padding: 25px;
					background: #FFF;
					border-radius: 16px;
					position: relative;
					transition: all 0.2s;
					>img {
						width: 50%;
						margin: auto;
						position: absolute;
						right: 10px;
						bottom: 0;
						top: 0;
					}
					.t_ab_btn_en {
						margin: 0 0 5px 0;
						font-size: clamp(12px, 0.95vw, 18px);
						line-height: 1.2;
						font-weight: 300;
					}
					.t_ab_btn_name {
						font-size: clamp(18px, 1.3vw, 24px);
						line-height: 1.2;
						transition: all 0.2s;
					}
					.t_ab_btn_more {
						display: inline-block;
						padding: 0 20px 0 15px;
						clip-path: polygon(0 0, 90% 0, 100% 100%, 0% 100%);
						background: #4cca2a;
						font-size: clamp(9px, 0.7vw, 13px);
						font-weight: 300;
						line-height: 1.5;
						color: #FFF;
						position: absolute;
						bottom: 15px;
						right: 15px;
						transition: all 0.2s;
					}
					&:hover {
						.t_ab_btn_more {
							background: #000000;
						}
						.t_ab_btn_name {
							color: #4cca2a;
						}
					}
				}
			}
		}
		.t_ab_img01, .t_ab_img02 {
			width: clamp(400px, 28.5vw, 520px);
			height: auto;
			border-radius: 20px;
			aspect-ratio: 3 / 2;
			position: absolute;
		}
		.t_ab_img01 {
			top: 0;
			right: clamp(110px, 9.5vw, 180px);
		}
		.t_ab_img02 {
			top: calc(clamp(400px, 28.5vw, 520px)*0.7);
			right: 0;
		}
	}
}
.t_info_cms {
	list-style: none;
	margin: 0;
	padding: 0;
	& p {
		margin: 0;
	}
	>li {
		margin: 0;
		padding: 0;
		>a {
			display: flex;
			gap: 0 15px;
			padding: 20px 0;
			border-bottom: 1px solid #cdcdcd;
			color: #000000;
			text-decoration: none;
			.font_lexend {
				font-family: "Lexend Giga", sans-serif;
				font-optical-sizing: auto;
				font-weight: 500;
				font-style: normal;
			}
			.color_green {
				color: #4cca2a;
			}
			>div.t_info_img {
				flex-shrink: 0;
				width: clamp(150px, 24vw, 200px);
				height: auto;
				aspect-ratio: 5 / 3;
				border-radius: 10px;
				overflow: hidden;
				>img {
					width: 100%;
					height: 100%;
					object-fit: cover;
					transition: all 0.2s;
				}
			}
			>div.t_info_box {
				width: 100%;
				position: relative;
				.t_info_date {
					margin: 0 0 15px 0;
					>span {
						font-size: clamp(10px, 1.6vw, 14px);
						line-height: 1.5;
						text-decoration: underline;
						text-decoration-thickness: 2px;
						text-underline-offset: 6px;
					}
				}
				.t_info_txt {
					>span {
						font-size: clamp(11px, 1.77vw, 16px);
						line-height: 1.5;
						overflow: hidden;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 2;
					}
				}
				.t_info_more {
					display: inline-block;
					padding: 0 12px 0 8px;
					clip-path: polygon(0 0, 90% 0%, 100% 100%, 0% 100%);
					background: #4cca2a;
					font-size: clamp(8px, 1.3vw, 12px);
					line-height: 1.5;
					color: #FFF;
					position: absolute;
					right: 0;
					bottom: 0;
					transition: all 0.2s;
				}
			}
			&:hover {
				>div.t_info_img {
					>img {
						filter: grayscale(100%);
						transform: scale(1.1);
					}
				}
				>div.t_info_box {
					.t_info_more {
						background: #333333;
					}
				}
			}
		}
	}
}
/* スクロールの動き　*/
.section {
	position: relative;
}
.section:nth-of-type(1) {
	height: 100vh;
	display: grid;
	align-items: center;
	background: #FFF;
}
.section:nth-of-type(2) {
	height: clamp(2300px, 320vh, 3400px);
	background: #FFF;
}
.section:nth-of-type(3) {
	height: clamp(2300px, 330vh, 3550px);
	background-color: #FFF;
}
.section__inner {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	width: calc(100vw - 135px);
	height: inherit;
	display: grid;
	align-items: center;
}
.section_up {
	position: relative;
	z-index: 3;
	background: #FFF;
}
#jsp {
	position: absolute;
}