@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;
}
#t_wrap {
	margin-top: 25px;
	background: var(--color-beige);
	& h1 {
		color: var(--txt-basic-color);
		position: absolute;
	}
	& h2, & h3, & h4 {
		margin: 0;
	}
	& a {
		text-decoration: none;
		color: var(--txt-basic-color);
	}
	& img {
		max-width: 100%;
	}
	& ul, & ol {
		list-style: none;
	}
	& p, & ul, & ol, & h2, & h3, & hr, & figure {
		margin: 0;
		padding: 0;
	}
	.new_header {
		display: none;
	}
	.wide_conts {
		margin-left: auto;
		margin-right: auto;
	}
	#t_main {
		width: 100%;
		padding: clamp(265px, 22.5vw, 400px) 0 clamp(65px, 5.55vw, 100px) 0;
		position: relative;
		.t_main_box {
			color: var(--color-beige);
			>h2 {
				margin-bottom: clamp(20px, 1.65vw, 30px);
				font-size: clamp(40px, 3.35vw, 60px);
				line-height: 1.5;
				letter-spacing: 0.08em;
			}
			>p {
				font-size: clamp(22px, 1.85vw, 33px);
				line-height: 1.55;
				font-weight: 500;
				letter-spacing: 0.08em;
			}
		}
		.t_main_bg {
			height: 100%;
			overflow: hidden;
			position: absolute;
			top: 0px;
			right: 0px;
			width: 100%;
			z-index: -1;
			.t_main_img {
				opacity: 0;
				width: 100%;
				height: 100%;
				background-position: center center;
				background-repeat: no-repeat;
				background-size: cover;
				position: absolute;
				left: 0;
				top: 0;
				-webkit-animation: anime 24s 0s infinite;
				animation: anime 24s 0s infinite;
				&:nth-of-type(2) {
					-webkit-animation-delay: 8s;
					animation-delay: 8s;
				}
				&:nth-of-type(3) {
					-webkit-animation-delay: 16s;
					animation-delay: 16s;
				}
			}
		}
	}
	#t_nav {
		width: calc(100% - clamp(13px, 1.1vw, 20px)*2);
		margin: calc(clamp(18px, 1.4vw, 25px)*-1) auto clamp(75px, 6.2vw, 110px) auto;
		position: relative;
		&:before {
			content: "";
			width: 100%;
			height: calc(100% - clamp(18px, 1.4vw, 25px));
			background: var(--color-bl-pale);
			border-radius: 0 0 20px 20px;
			position: absolute;
			bottom: 0;
			left: 0;
			z-index: -1;
		}
		>ul {
			display: flex;
			.t_nav_w {
				flex-grow: 2;
				>a {
					aspect-ratio: 2 / 1;
					>div {
						.t_nav_name {
							margin-bottom: 0.2em;
							font-size: clamp(35px, 2.8vw, 50px);
							line-height: 1.2;
						}
						.t_nav_en {
							font-size: clamp(13px, 1.1vw, 20px);
							line-height: 1.2;
						}
					}
					&:after {
						content: "";
						width: clamp(150px, 12.5vw, 225px);
						aspect-ratio: 55 / 42;
						margin: auto;
						background-position: center;
						background-repeat: no-repeat;
						background-size: cover;
						position: absolute;
						top: 0;
						bottom: 0;
						right: clamp(11px, 0.85vw, 15px);
					}
				}
			}
			.t_nav_t {
				flex-grow: 1;
				>a {
					>div {
						.t_nav_name {
							padding-top: 0.5em;
							margin-bottom: 0.3em;
							font-size: clamp(27px, 2.25vw, 40px);
							line-height: 1.2;
						}
						.t_nav_en {
							font-size: clamp(11px, 0.85vw, 15px);
							line-height: 1.2;
						}
					}
					.t_nav_btn {
						margin: 0 auto;
					}
					&:after {
						content: "";
						width: clamp(100px, 8.4vw, 150px);
						aspect-ratio: 1 / 1;
						background-position: center;
						background-repeat: no-repeat;
						background-size: cover;
						position: absolute;
						top: clamp(24px, 1.95vw, 35px);
						right: 0;
					}
				}
			}
			>li {
				>a {
					overflow: hidden;
					display: flex;
					flex-direction: column;
					justify-content: space-between;
					box-sizing: border-box;
					height: 100%;
					padding: clamp(20px, 1.65vw, 30px) clamp(24px, 1.95vw, 35px) clamp(27px, 2.25vw, 40px) clamp(24px, 1.95vw, 35px);
					position: relative;
					&:before {
						content: "";
						width: 100%;
						height: 100%;
						position: absolute;
						top: 0;
						left: -100%;
						transition: all 0.2s;
					}
					&:hover {
						&:before {
							left: 0;
						}
					}
					>div {
						position: relative;
						>p {
							color: var(--color-beige);
							font-weight: 600;
							letter-spacing: 0.08em;
						}
					}
					.t_nav_btn {
						display: flex;
						align-items: center;
						gap: 0 1em;
						width: fit-content;
						padding: 0.8em 2em 0.8em 0.8em;
						background: var(--color-beige);
						border-radius: 60px;
						font-size: clamp(10px, 0.8vw, 14px);
						line-height: 1;
						letter-spacing: 0.08em;
						>div {
							overflow: hidden;
							display: flex;
							align-items: center;
							justify-content: center;
							width: clamp(28px, 2.35vw, 42px);
							aspect-ratio: 1 / 1;
							margin: auto;
							background: var(--color-bl-pale);
							border-radius: 50%;
							transition: all 0.2s;
							>img {
								width: clamp(9px, 0.7vw, 12px);
							}
						}
						>p {
							color: var(--txt-basic-color);
						}
					}
					&:hover {
						.t_nav_btn {
							>div {
								background: #8496bb;
								>img {
									animation: slideOutIn 0.3s forwards;
								}
							}
						}
					}
				}
				&:nth-child(1) {
					>a {
						background: #9caac7;
						border-radius: 20px 0 0 0;
						&:before {
							background: #8496bb;
						}
						&:after {
							background-image: url(/img/top/nav_il01.webp);
						}
					}
				}
				&:nth-child(2) {
					>a {
						background: var(--color-bl-light);
						&:before {
							background: #8599be;
						}
						&:after {
							background-image: url(/img/top/nav_il02.webp);
						}
					}
				}
				&:nth-child(3) {
					>a {
						background: var(--color-bl-deep);
						border-radius: 0 20px 0 0;
						&:before {
							background: #74819d;
						}
						&:after {
							background-image: url(/img/top/nav_il03.webp);
						}
					}
				}
			}
		}
	}
	.t_tl {
		font-size: clamp(35px, 2.8vw, 50px);
		line-height: 1.5;
		font-weight: 600;
		letter-spacing: 0.08em;
	}
	.t_tl_en {
		font-size: clamp(13px, 1.1vw, 20px);
		line-height: 1.2;
		font-weight: 600;
		letter-spacing: 0.08em;
	}
	.t_catchtxt {
		font-size: clamp(20px, 1.65vw, 30px);
		line-height: 1.5;
		font-weight: 600;
		letter-spacing: 0.08em;
	}
	.t_txt {
		font-size: clamp(12px, 1vw, 18px);
		line-height: 1.5;
	}
	#t_reco {
		width: 100%;
		margin: 0 0 clamp(135px, 11vw, 200px) 0;
		padding: 0 0 clamp(35px, 2.8vw, 50px) 0;
		position: relative;
		>div {
			.t_reco_txtbox {
				display: flex;
				align-items: flex-end;
				gap: 0 clamp(95px, 7.8vw, 140px);
				margin-bottom: clamp(45px, 3.9vw, 70px);
				position: relative;
				&:after {
					content: "";
					display: block;
					width: clamp(155px, 12.8vw, 230px);
					aspect-ratio: 46 / 37;
					background-image: url(/img/top/reco_img.webp);
					background-repeat: no-repeat;
					background-position: center;
					background-size: cover;
					position: absolute;
					top: clamp(30px, 2.5vw, 45px);
					right: clamp(13px, 1.1vw, 20px);
				}
				>div {
					position: relative;
					.t_tl {
						padding-right: clamp(18px, 1.4vw, 25px);
						>span {
							color: var(--color-green);
						}
					}
					.t_tl_en {
						color: var(--color-green);
						position: absolute;
						bottom: 0.5em;
						right: 0;
					}
				}
				.t_reco_txtcatch {
					font-size: clamp(15px, 1.25vw, 22px);
					line-height: 1.5;
					font-weight: 600;
					letter-spacing: 0.08em;
				}
			}
			.t_reco_box {
				display: flex;
				gap: 0 clamp(40px, 3.35vw, 60px);
				.t_reco_pick {
					display: block;
					width: clamp(435px, 36vw, 650px);
					flex-shrink: 0;
					.t_reco_pick_img {
						width: 100%;
						aspect-ratio: 65 / 59;
						margin-bottom: clamp(13px, 1.1vw, 20px);
						border-radius: 20px;
					}
					.t_reco_type {
						margin-bottom: clamp(11px, 0.85vw, 15px);
					}
					.t_reco_pick_name {
						margin-bottom: clamp(11px, 0.85vw, 15px);
						font-size: clamp(16px, 1.35vw, 24px);
					}
					.t_reco_pick_box {
						>div {
							padding: clamp(13px, 1.1vw, 20px);
							background: #FFF;
							border: 1px solid var(--color-green);
							border-radius: 10px;
							.t_reco_pick_price {
								margin-bottom: clamp(11px, 0.85vw, 15px);
								font-size: clamp(20px, 1.5vw, 27px);
							}
							>ul {
								margin-bottom: clamp(13px, 1.1vw, 20px);
								display: flex;
								flex-wrap: wrap;
								gap: 0 2em;
							}
						}
					}
				}
				>ul {
					display: flex;
					flex-wrap: wrap;
					gap: clamp(35px, 2.8vw, 50px) clamp(24px, 1.95vw, 35px);
					margin-top: clamp(45px, 3.9vw, 70px);
					>li {
						width: calc((100% - clamp(24px, 1.95vw, 35px))/2);
						>a {
							position: relative;
							.t_reco_type {
								position: absolute;
								top: -1em;
								left: -0.5em;
								z-index: 5;
							}
							.t_reco_li_img {
								width: 100%;
								aspect-ratio: 37 / 20;
								margin-bottom: clamp(9px, 0.7vw, 12px);
								border-radius: 10px;
							}
							.t_reco_li_name {
								margin-bottom: clamp(7px, 0.55vw, 10px);
								font-size: clamp(12px, 1vw, 18px);
							}
							.t_reco_li_pr {
								display: flex;
								align-items: center;
								gap: 0 clamp(11px, 0.85vw, 15px);
								margin-bottom: clamp(9px, 0.7vw, 12px);
							}
							.t_reco_li_price {
								font-size: clamp(15px, 1.25vw, 22px);
							}
							>ul {
								margin-bottom: clamp(9px, 0.7vw, 12px);
								>li {
									&:not(:last-child) {
										margin-bottom: 0.5em;
									}
								}
							}
							.t_reco_li_comment {
								padding: 1em;
								background: #FFF;
								border-radius: 10px;
							}
						}
					}
				}
				.t_reco_img {
					overflow: hidden;
					>img {
						width: 100%;
						height: 100%;
						object-fit: cover;
						transition: all 0.2s;
					}
				}
				.t_reco_type {
					display: flex;
					align-items: center;
					gap: 0 0.5em;
					width: fit-content;
					padding: 0.5em 0.8em 0.5em 0;
					background: var(--color-white);
					border: 1px solid var(--color-green);
					border-radius: 10px;
					font-size: clamp(10px, 0.8vw, 14px);
					line-height: 1;
					letter-spacing: 0.1em;
					&:before {
						content: "";
						width: 0.75em;
						height: 1px;
						background: var(--color-green);
					}
				}
				.t_reco_name {
					color: var(--color-green);
					line-height: 1.2;
					letter-spacing: 0.05em;
					>span {
						overflow: hidden;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 1;
						font-weight: 600;
					}
				}
				.t_reco_price {
					display: flex;
					align-items: baseline;
					gap: 0 4px;
					color: var(--color-pink);
					line-height: 1.2;
					font-weight: 600;
					letter-spacing: 0.05em;
					>span {
						font-size: clamp(10px, 0.8vw, 14px);
						line-height: 1.2;
						color: var(--txt-basic-color);
						letter-spacing: 0.12em;
					}
				}
				.t_reco_ab {
					display: flex;
					align-items: center;
					gap: 0 0.4em;
					font-size: clamp(10px, 0.8vw, 14px);
					line-height: 1.2;
					&:before {
						content: "";
						width: clamp(13px, 1.1vw, 20px);
						aspect-ratio: 1 / 1;
						background-repeat: no-repeat;
						background-position: center;
						background-size: cover;
					}
				}
				.t_reco_ad {
					&:before {
						background-image: url(/img/top/reco_icon01.webp);
					}
				}
				.t_reco_ac {
					&:before {
						background-image: url(/img/top/reco_icon02.webp);
					}
				}
				.t_reco_fl {
					&:before {
						background-image: url(/img/top/reco_icon03.webp);
					}
				}
				.t_reco_comment {
					font-size: clamp(10px, 0.8vw, 14px);
					line-height: 1.5;
					color: var(--color-green);
					letter-spacing: 0.1em;
					>span {
						overflow: hidden;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 2;
					}
				}
				.t_reco_pick:hover,
				>ul li a:hover {
					.t_reco_img {
						>img {
							transform: scale(1.1);
						}
					}
				}
			}
		}
		&:after {
			content: "";
			width: calc(50vw + clamp(250px, 21vw, 375px));
			height: calc(100% - clamp(135px, 11vw, 200px));
			background: #d8e9e0;
			border-radius: 30px 0 0 30px;
			position: absolute;
			right: 0;
			bottom: 0;
			z-index: -1;
		}
	}
	#t_mem {
		margin-bottom: clamp(43px, 3.6vw, 65px);
		>a {
			display: block;
			background: var(--color-bl-deep);
			>div {
				display: flex;
				align-items: center;
				justify-content: space-between;
				padding: clamp(30px, 2.5vw, 45px) 0 clamp(40px, 3.35vw, 60px) 0;
				position: relative;
				&:before {
					content: "";
					width: clamp(125px, 10.5vw, 190px);
					aspect-ratio: 19 / 8;
					background-image: url(/img/top/mem_il01.webp);
					background-repeat: no-repeat;
					background-position: center;
					background-size: cover;
					position: absolute;
					top: calc(clamp(125px, 10.5vw, 190px) / 19 * -8);
					left: clamp(200px, 16.5vw, 300px);
				}
				>h2 {
					width: fit-content;
					padding: 0.33em 1.5em;
					background: var(--color-white);
					border-radius: 50px;
					font-size: clamp(20px, 1.55vw, 28px);
					line-height: 1.5;
					letter-spacing: 0.12em;
					position: absolute;
					left: 0;
					top: -1.08em;
					>span {
						color: var(--color-pink);
					}
				}
				.t_mem_box {
					.t_mem_tl {
						margin-bottom: clamp(18px, 1.4vw, 25px);
						position: relative;
						.t_tl {
							color: var(--color-white);
						}
						.t_tl_en {
							color: var(--color-pink);
							position: absolute;
							bottom: 0.5em;
							right: clamp(135px, 11vw, 200px);
						}
					}
					.t_mem_num {
						display: flex;
						gap: 0 clamp(15px, 1.25vw, 22px);
						margin-bottom: clamp(27px, 2.25vw, 40px);
						>li {
							display: flex;
							align-items: center;
							gap: 0 clamp(11px, 0.85vw, 15px);
						}
						.t_mem_num_item {
							padding: 0.5em 1em;
							background: var(--color-white);
							border-radius: 50px;
							font-size: clamp(12px, 1vw, 18px);
							line-height: 1;
							letter-spacing: 0.12em;
							font-weight: 600;
						}
						.t_mem_num_data {
							display: flex;
							align-items: flex-end;
							gap: 0 clamp(7px, 0.55vw, 10px);
							font-size: clamp(45px, 3.9vw, 70px);
							line-height: 1;
							font-weight: 600;
							>span {
								font-size: clamp(12px, 1vw, 18px);
								line-height: 1.5;
							}
						}
						.t_mem_num_open {
							.t_mem_num_item {
								color: var(--color-bl-deep);
							}
							.t_mem_num_data {
								color: var(--color-beige);
							}
						}
						.t_mem_num_limited {
							.t_mem_num_item {
								color: var(--color-pink);
							}
							.t_mem_num_data {
								color: var(--color-pink);
							}
						}
					}
					.t_mem_merit {
						display: flex;
						gap: 0 3px;
						margin: 0 0 clamp(24px, 1.95vw, 35px) 0;
						>li {
							width: clamp(135px, 11vw, 200px);
							padding: clamp(7px, 0.55vw, 10px) 0;
							background: var(--color-white);
							border-radius: 10px;
							.t_mem_merit_num {
								display: flex;
								align-items: center;
								justify-content: center;
								width: clamp(20px, 1.65vw, 30px);
								height: clamp(20px, 1.65vw, 30px);
								margin: 0 auto 0.5em auto;
								border-radius: 50%;
								background: var(--color-beige);
								font-size: clamp(11px, 0.85vw, 15px);
								line-height: 1;
								color: #888a7a;
							}
							.t_mem_merit_txt {
								font-size: clamp(12px, 0.95vw, 17px);
								line-height: 1.3;
								text-align: center;
								letter-spacing: 0.12em;
							}
						}
					}
					.t_mem_txt {
						margin-bottom: clamp(18px, 1.4vw, 25px);
						font-size: clamp(12px, 1vw, 18px);
						line-height: 1.55;
						color: var(--color-white);
						letter-spacing: 0.08em;
						text-align: center;
					}
					.t_mem_btn {
						overflow: hidden;
						width: clamp(385px, 32.2vw, 580px);
						box-sizing: border-box;
						margin: 0 auto;
						padding: 1.2em 0 1.2em 1.2em;
						background: var(--color-pink);
						border-radius: 50px;
						font-size: clamp(18px, 1.4vw, 25px);
						line-height: 1;
						color: var(--color-white);
						letter-spacing: 0.16em;
						text-align: center;
						position: relative;
						&:before {
							content: "";
							width: 100%;
							height: 100%;
							background: #f28cab;
							position: absolute;
							top: 0;
							left: -100%;
							transition: all 0.2s;
						}
						>div {
							overflow: hidden;
							display: flex;
							align-items: center;
							justify-content: center;
							width: clamp(40px, 3.35vw, 60px);
							background: var(--color-beige);
							border-radius: 50%;
							aspect-ratio: 1 / 1;
							margin: auto;
							position: absolute;
							top: 0;
							bottom: 0;
							left: clamp(20px, 1.65vw, 30px);
							>img {
								width: clamp(15px, 1.25vw, 22px);
							}
						}
						>p {
							position: relative;
						}
					}
				}
				.t_mem_img {
					width: clamp(530px, 44.5vw, 800px);
					box-sizing: border-box;
					padding: 0 clamp(20px, 1.65vw, 30px) 0 0;
					position: relative;
					.t_mem_img02 {
						width: clamp(185px, 15.3vw, 275px);
						position: absolute;
						right: calc(clamp(37px, 3.05vw, 55px)*-1);
						top: calc(clamp(80px, 7vw, 125px)*-1)
					}
					.t_mem_il {
						width: clamp(80px, 6.65vw, 120px);
						position: absolute;
						left: calc(clamp(18px, 1.4vw, 25px)*-1);
						bottom: calc(clamp(60px, 5vw, 90px)*-1)
					}
				}
			}
			&:hover {
				>div {
					.t_mem_btn {
						&:before {
							left: 0;
						}
						>div {
							>img {
								animation: slideOutIn 0.3s forwards;
							}
						}
					}
				}
			}
		}
	}
	#t_sale {
		margin-bottom: clamp(165px, 14vw, 250px);
		position: relative;
		&:before {
			content: "";
			display: block;
			width: calc(50% - clamp(20px, 1.65vw, 30px));
			height: 60%;
			background: var(--color-bl-pale);
			border-radius: 0 20px 20px 0;
			position: absolute;
			left: 0;
			bottom: clamp(35px, 2.8vw, 50px);
		}
		>div {
			display: flex;
			align-items: flex-end;
			justify-content: space-between;
			width: calc(100% - clamp(50px, 4.25vw, 85px)*2);
			margin: 0 auto;
			.t_sale_img {
				width: clamp(493px, 41.5vw, 740px);
				position: relative;
				.t_sale_img_fuki {
					width: clamp(88px, 7.35vw, 132px);
					position: absolute;
					top: calc(clamp(90px, 7.5vw, 135px) * -1);
					right: calc(clamp(35px, 2.8vw, 50px) * -1);
				}
				.t_sale_img_il {
					width: clamp(65px, 5.55vw, 100px);
					position: absolute;
					left: 0;
					bottom: calc(clamp(37px, 3.05vw, 55px) * -1)
				}
			}
			.t_sale_il {
				width: clamp(535px, 45vw, 893px);
				margin-bottom: clamp(335px, 27.8vw, 500px);
				transform: translateX(clamp(20px, 1.65vw, 30px));
			}
			.t_sale_box {
				display: flex;
				justify-content: flex-end;
				padding-bottom: clamp(13px, 1.1vw, 20px);
				position: absolute;
				bottom: 0;
				right: 0;
				left: 0;
				>div {
					width: clamp(465px, 39vw, 700px);
					.t_sale_tl {
						display: flex;
						align-items: baseline;
						gap: 0 clamp(18px, 1.4vw, 25px);
						margin-bottom: clamp(13px, 1.1vw, 20px);
						.t_tl_en {
							color: var(--color-bl-pale);
						}
					}
					.t_catchtxt {
						margin-bottom: clamp(35px, 2.8vw, 50px);
						color: var(--color-bl-deep);
					}
					.t_txt {
						margin-bottom: clamp(57px, 4.75vw, 85px);
					}
					>ul {
						display: flex;
						gap: 0 clamp(16px, 1.35vw, 24px);
						>li {
							>a {
								overflow: hidden;
								display: block;
								width: clamp(200px, 16.5vw, 300px);
								box-sizing: border-box;
								padding: 1.625em 0 1.625em 1.625em;
								background: var(--color-white);
								border-radius: 50px;
								font-size: clamp(11px, 0.9vw, 16px);
								line-height: 1;
								font-weight: 600;
								letter-spacing: 0.12em;
								text-align: center;
								position: relative;
								&:before {
									content: "";
									width: 100%;
									height: 100%;
									background: #dbe5f5;
									transition: all 0.3s;
									position: absolute;
									top: 0;
									left: -100%;
								}
								>div {
									overflow: hidden;
									display: flex;
									align-items: center;
									justify-content: center;
									width: clamp(30px, 2.5vw, 45px);
									aspect-ratio: 1 / 1;
									background: var(--color-bl-light);
									border-radius: 50%;
									margin: auto;
									position: absolute;
									top: 0;
									bottom: 0;
									left: 0.75em;
									>img {
										width: clamp(10px, 0.75vw, 13px);
									}
								}
								>span {
									position: relative;
								}
								&:hover {
									&:before {
										left: 0;
									}
									>div {
										>img {
											animation: slideOutIn 0.3s forwards;
										}
									}
								}
							}
						}
					}
				}
			}
		}
	}
	#t_sr {
		width: calc(100% - clamp(13px, 1.1vw, 20px)*2);
		padding: clamp(95px, 7.8vw, 140px) 0 clamp(120px, 10vw, 180px) 0;
		margin: 0 auto clamp(75px, 6.2vw, 110px) auto;
		background: var(--color-white);
		border-radius: 20px;
		position: relative;
		&:before {
			content: "";
			display: block;
			width: clamp(560px, 46.7vw, 840px);
			aspect-ratio: 4 / 1;
			margin: auto;
			background-image: url(/img/top/sr_il.webp);
			background-repeat: no-repeat;
			background-position: center;
			background-size: cover;
			position: absolute;
			top: calc(clamp(560px, 46.7vw, 840px) * -0.166);
			left: 0;
			right: 0;
		}
		.t_sr_tl {
			margin-bottom: clamp(43px, 3.6vw, 65px);
			text-align: center;
			.t_tl {
				margin: 0 0 clamp(7px, 0.55vw, 10px) 0;
			}
			.t_tl_en {
				color: var(--color-green);
			}
		}
		.wide_conts {
			display: flex;
			gap: 0 clamp(35px, 2.8vw, 50px);
			.t_sr_map {
				flex-shrink: 0;
				width: clamp(485px, 40.6vw, 730px);
				& h3 {
					display: flex;
					align-items: center;
					margin-bottom: clamp(11px, 0.85vw, 15px);
					font-size: clamp(15px, 1.3vw, 23px);
					line-height: 1.2;
					color: var(--color-green);
					letter-spacing: 0.08em;
					&:before {
						content: "";
						width: clamp(13px, 1.1vw, 20px);
						aspect-ratio: 4 / 5;
						margin-right: clamp(7px, 0.55vw, 10px);
						background-image: url(/img/top/sr_tl_icon.webp);
						background-repeat: no-repeat;
						background-position: center;
						background-size: cover;
					}
					>span {
						font-size: clamp(12px, 1vw, 18px);
					}
				}
				>div {
					&:not(:last-of-type) {
						margin: 0 0 clamp(18px, 1.4vw, 25px) 0;
					}
				}
			}
			.t_sr_box {
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				>div {
					>h3 {
						margin-bottom: clamp(11px, 0.85vw, 15px);
						font-size: clamp(18px, 1.4vw, 25px);
						line-height: 1;
						color: var(--color-green);
						letter-spacing: 0.08em;
					}
					>div {
						padding: clamp(18px, 1.4vw, 25px) clamp(12px, 1vw, 18px) clamp(27px, 2.25vw, 40px) clamp(12px, 1vw, 18px);
						background: var(--color-beige);
						border-radius: 10px;
						& h4 {
							margin-bottom: clamp(13px, 1.1vw, 20px);
							font-size: clamp(10px, 0.8vw, 14px);
							line-height: 1.2;
							color: var(--color-green);
							letter-spacing: 0.1em;
						}
						& ul {
							display: flex;
							flex-wrap: wrap;
							gap: 0.33em;
							font-size: clamp(11px, 0.85vw, 15px);
							>li {
								>a {
									overflow: hidden;
									display: block;
									border-radius: 5px;
									background: var(--color-white);
									line-height: 1;
									font-weight: bold;
									letter-spacing: 0.05em;
									text-align: center;
									position: relative;
									>div {
										position: relative;
										z-index: 2;
									}
									&:before {
										content: "";
										width: 100%;
										height: 100%;
										background: #f9faf2;
										transition: all 0.3s;
										position: absolute;
										top: 0;
										left: -100%;
									}
									&:hover {
										&:before {
											left: 0;
										}
									}
								}
								&:nth-child(-n + 4) {
									width: calc((100% - 0.99em)/4);
								}
								&:nth-child(n + 5) {
									width: calc((100% - 0.66em)/3);
								}
							}
						}
						.t_sr_type {
							margin: 0 0 clamp(20px, 1.65vw, 30px) 0;
							& ul {
								>li {
									>a {
										padding: clamp(10px, 0.75vw, 13px) 0 clamp(12px, 0.95vw, 17px) 0;
										& img {
											width: clamp(60px, 5vw, 90px);
											margin: 0 auto clamp(9px, 0.7vw, 12px) auto;
										}
									}
								}
							}
						}
						.t_sr_sort {
							margin: 0 0 clamp(20px, 1.65vw, 30px) 0;
							& ul {
								>li {
									>a {
										padding: 1.5em 0;
										font-size: clamp(9px, 0.75vw, 13px);
									}
								}
							}
						}
						.t_sr_key {
							.t_sr_key_box {
								display: flex;
								gap: 0 clamp(7px, 0.55vw, 10px);
								margin-bottom: clamp(20px, 1.65vw, 30px);
								& input[type="text"] {
									width: 100%;
									box-sizing: border-box;
									padding: 0 1em;
									background: var(--color-white);
									border: none;
									border-radius: 5px;
									font-size: clamp(11px, 0.85vw, 15px);
									letter-spacing: 0.06em;
									&::placeholder {
										color: #cecccc;
									}
								}
								& input[type="submit"] {
									cursor: pointer;
									flex-shrink: 0;
									display: flex;
									align-items: center;
									justify-content: center;
									width: clamp(80px, 6.65vw, 120px);
									aspect-ratio: 2 / 1;
									background: var(--color-green);
									border: none;
									border-radius: 5px;
									font-size: clamp(11px, 0.9vw, 16px);
									line-height: 1;
									color: var(--color-white);
									transition: all 0.2s;
									&:hover {
										background: #5fa086;
									}
								}
							}
						}
					}
					.t_sr_catalog {
						display: block;
						position: relative;
					}
				}
				.t_sr_bnr {
					display: block;
					padding: clamp(9px, 0.7vw, 12px) 0 clamp(11px, 0.85vw, 15px) 0;
					background: var(--color-green);
					border-radius: 10px;
					text-align: center;
					position: relative;
					&:before {
						content: "";
						display: block;
						width: clamp(75px, 6.2vw, 110px);
						aspect-ratio: 22 / 33;
						background-image: url(/img/top/sr_bnr_il.webp);
						background-repeat: no-repeat;
						background-position: center;
						background-size: cover;
						position: absolute;
						bottom: 0;
						left: clamp(9px, 0.7vw, 12px);
					}
					& p {
						font-weight: 600;
					}
					.t_sr_bnr_txt {
						width: fit-content;
						margin: 0 auto clamp(9px, 0.7vw, 12px) auto;
						border-top: 1px solid var(--color-white);
						border-bottom: 1px solid var(--color-white);
						font-size: clamp(10px, 0.8vw, 14px);
						line-height: 2;
						color: var(--color-white);
						letter-spacing: 0.05em;
					}
					.t_sr_bnr_tl {
						margin: 0 0 clamp(9px, 0.7vw, 12px) 0;
						font-size: clamp(27px, 2.25vw, 40px);
						line-height: 1.2;
						color: var(--color-white);
						letter-spacing: 0.08em;
					}
					.t_sr_bnr_btn {
						overflow: hidden;
						display: block;
						width: clamp(310px, 26vw, 465px);
						box-sizing: border-box;
						margin: 0 auto;
						padding: 1.2em 0 1.2em 0;
						background: var(--color-beige);
						border-radius: 80px;
						font-size: clamp(12px, 1vw, 18px);
						line-height: 1;
						font-weight: 600;
						letter-spacing: 0.16em;
						text-align: center;
						position: relative;
						&:before {
							content: "";
							width: 100%;
							height: 100%;
							background: var(--color-white);
							transition: all 0.3s;
							position: absolute;
							top: 0;
							left: -100%;
						}
						>div {
							overflow: hidden;
							display: flex;
							align-items: center;
							justify-content: center;
							width: clamp(30px, 2.5vw, 45px);
							aspect-ratio: 1 / 1;
							margin: auto;
							background: var(--color-white);
							border-radius: 50%;
							position: absolute;
							top: 0;
							bottom: 0;
							left: 0.415em;
							transition: all 0.2s;
							>img {
								width: clamp(11px, 0.9vw, 16px);
							}
						}
						>p {
							position: relative;
						}
					}
					&:hover {
						background: #75af98;
						.t_sr_bnr_btn {
							&:before {
								left: 0;
							}
							>div {
								background: var(--color-beige);
								>img {
									animation: slideOutIn 0.3s forwards;
								}
							}
						}
					}
				}
			}
		}
	}
	#t_com {
		margin-bottom: clamp(100px, 8.4vw, 150px);
		>div {
			position: relative;
			&:before {
				content: "";
				display: block;
				width: clamp(605px, 50.5vw, 910px);
				aspect-ratio: 182 / 155;
				background: var(--color-bl-pale);
				border-radius: 0 20px 0 20px;
				position: absolute;
				top: clamp(340px, 28.3vw, 510px);
				right: calc(clamp(35px, 2.8vw, 50px)*-1)
			}
			&:after {
				content: "";
				display: block;
				width: clamp(175px, 14.7vw, 265px);
				aspect-ratio: 53 / 46;
				background: var(--color-bl-pale);
				border-radius: 20px;
				position: absolute;
				top: clamp(265px, 22.5vw, 400px);
				left: clamp(400px, 33.3vw, 600px);
				z-index: -1;
			}
			.t_com_box {
				display: flex;
				align-items: flex-end;
				justify-content: space-between;
				margin: 0 0 clamp(100px, 8.4vw, 150px) 0;
				.t_com_box_txt {
					width: clamp(365px, 30.5vw, 550px);
					.t_sr_tl {
						display: flex;
						align-items: baseline;
						gap: 0 clamp(18px, 1.4vw, 25px);
						margin-bottom: clamp(24px, 1.95vw, 35px);
						.t_tl_en {
							color: var(--color-bl-pale);
						}
					}
					.t_catchtxt {
						margin-bottom: clamp(20px, 1.65vw, 30px);
						color: var(--color-bl-deep);
					}
				}
				.t_com_box_img {
					width: clamp(480px, 40vw, 720px);
					position: relative;
					.t_com_box_img02 {
						width: clamp(160px, 13.5vw, 240px);
						position: absolute;
						left: calc(clamp(95px, 7.8vw, 140px)*-1);
						bottom: calc(clamp(27px, 2.25vw, 40px)*-1)
					}
					.t_com_box_il01 {
						width: clamp(200px, 16.5vw, 300px);
						position: absolute;
						top: calc(clamp(90px, 7.5vw, 135px)*-1);
						right: clamp(55px, 4.5vw, 80px);
					}
					.t_com_box_il02 {
						width: clamp(135px, 11vw, 200px);
						position: absolute;
						top: clamp(135px, 11vw, 200px);
						right: calc(clamp(24px, 1.95vw, 35px)*-1)
					}
					.t_com_box_fuki {
						width: clamp(90px, 7.5vw, 135px);
						position: absolute;
						top: calc(clamp(45px, 3.9vw, 70px)*-1);
						left: clamp(27px, 2.25vw, 40px);
					}
				}
			}
			.t_com_shop {
				display: flex;
				justify-content: space-between;
				margin-bottom: clamp(60px, 5vw, 90px);
				>li {
					width: calc((100% - clamp(43px, 3.6vw, 65px))/2);
					box-sizing: border-box;
					padding: clamp(27px, 2.25vw, 40px) clamp(13px, 1.1vw, 20px);
					background: var(--color-white);
					border-radius: 20px;
					position: relative;
					.t_com_shop_name {
						margin: auto;
						font-size: clamp(13px, 1.1vw, 20px);
						line-height: 1.25;
						padding: 0.5em 1em;
						border-radius: 30px;
						position: absolute;
						left: 0;
						right: 0;
						top: -1.125em;
					}
					.t_com_shop_co {
						width: fit-content;
						color: var(--color-white);
					}
					>div {
						display: flex;
						align-items: center;
						gap: 0 clamp(7px, 0.55vw, 10px);
						>img {
							flex-shrink: 0;
							width: clamp(135px, 11vw, 200px);
						}
						>div {
							display: flex;
							flex-direction: column;
							gap: clamp(11px, 0.85vw, 15px) 0;
						}
						.t_com_shop_item {
							flex-shrink: 0;
							padding: 0.5em 1em;
							border-radius: 20px;
							font-size: clamp(9px, 0.75vw, 13px);
							line-height: 1;
							letter-spacing: 0.08em;
						}
						.t_com_shop_txt {
							font-size: clamp(10px, 0.8vw, 14px);
							line-height: 1.5;
							letter-spacing: 0.08em;
						}
						.t_com_shop_ad {
							display: flex;
							align-items: flex-start;
							gap: 0 clamp(7px, 0.55vw, 10px);
						}
						.t_com_shop_date {
							display: flex;
							gap: 0 clamp(7px, 0.55vw, 10px);
							>li {
								display: flex;
								gap: 0 clamp(7px, 0.55vw, 10px);
							}
						}
						.t_com_shop_btn {
							display: flex;
							gap: 0 clamp(7px, 0.55vw, 10px);
							>li {
								>a {
									display: block;
									border-radius: 70px;
									overflow: hidden;
									position: relative;
									&:before {
										content: "";
										width: 100%;
										height: 100%;
										transition: all 0.3s;
										position: absolute;
										top: 0;
										left: -100%;
									}
									&:hover {
										&:before {
											left: 0;
										}
									}
									>div {
										display: flex;
										align-items: center;
										gap: 0 clamp(7px, 0.55vw, 10px);
										padding: 0.5em 1.5em 0.5em 0.5em;
										font-size: clamp(11px, 0.85vw, 15px);
										line-height: 1;
										letter-spacing: 0.12em;
										position: relative;
										&:before {
											content: "";
											width: clamp(24px, 2vw, 36px);
											aspect-ratio: 1 / 1;
											background-repeat: no-repeat;
											background-position: center;
											background-size: cover;
										}
									}
								}
								&:nth-child(1) {
									>a {
										background: #fadde9;
										pointer-events: none;
										&:before {
											background: #f2b4c7;
										}
										>div {
											&:before {
												background-image: url(/img/top/shop_icon_tel.webp);
											}
										}
									}
								}
							}
						}
					}
					&:nth-child(1) {
						.t_com_shop_co {
							background: var(--color-bl-light);
						}
						.t_com_shop_btn {
							>li {
								&:nth-child(2) {
									>a {
										&:before {
											background: #8496bb;
										}
										>div {
											&:before {
												background-image: url(/img/top/shop_icon_map01.webp);
											}
										}
									}
								}
							}
						}
					}
					&:nth-child(2) {
						.t_com_shop_co {
							background: var(--color-green);
						}
						.t_com_shop_btn {
							>li {
								&:nth-child(2) {
									>a {
										&:before {
											background: #5fa086;
										}
										>div {
											&:before {
												background-image: url(/img/top/shop_icon_map02.webp);
											}
										}
									}
								}
							}
						}
					}
				}
			}
			.t_com_btn {
				display: flex;
				gap: clamp(18px, 1.4vw, 25px);
				>li {
					width: calc((100% - clamp(18px, 1.4vw, 25px)*3)/4);
					>a {
						overflow: hidden;
						display: block;
						box-sizing: border-box;
						margin: 0 auto;
						padding: 1.5em 0 1.5em 0.75em;
						background: var(--color-white);
						border-radius: 80px;
						font-size: clamp(13px, 1.1vw, 20px);
						line-height: 1;
						font-weight: 600;
						letter-spacing: 0.12em;
						text-align: center;
						position: relative;
						&:before {
							content: "";
							width: 100%;
							height: 100%;
							background: #dbe5f5;
							transition: all 0.3s;
							position: absolute;
							top: 0;
							left: -100%;
						}
						>div {
							overflow: hidden;
							display: flex;
							align-items: center;
							justify-content: center;
							width: clamp(35px, 2.8vw, 50px);
							aspect-ratio: 1 / 1;
							margin: auto;
							background: var(--color-bl-light);
							border-radius: 50%;
							position: absolute;
							top: 0;
							bottom: 0;
							left: 0.75em;
							transition: all 0.2s;
							>img {
								width: clamp(11px, 0.9vw, 16px);
							}
						}
						>p {
							position: relative;
						}
						&:hover {
							&:before {
								left: 0;
							}
							>div {
								>img {
									animation: slideOutIn 0.3s forwards;
								}
							}
						}
					}
				}
			}
		}
	}
	#t_google {
		margin-bottom: clamp(75px, 6.2vw, 110px);
		.t_google_tl {
			display: flex;
			align-items: baseline;
			gap: 0 clamp(24px, 1.95vw, 35px);
			margin-bottom: clamp(24px, 1.95vw, 35px);
			>p,
			>h2 {
				letter-spacing: 0.08em;
				line-height: 1.2;
			}
			>h2 {
				font-size: clamp(27px, 2.25vw, 40px);
				line-height: 1.2;
			}
			>p {
				font-size: clamp(13px, 1.1vw, 20px);
				color: var(--color-bl-pale);
			}
			>img {
				width: clamp(80px, 6.65vw, 120px);
			}
		}
		.t_google_box {
			width: 100%;
			min-height: 200px;
			margin-bottom: clamp(35px, 2.8vw, 50px);
		}
		.t_google_btn {
			overflow: hidden;
			display: flex;
			align-items: center;
			gap: 0 clamp(18px, 1.4vw, 25px);
			box-sizing: border-box;
			width: fit-content;
			margin: 0 auto;
			padding: 0.75em 2em 0.75em 0.75em;
			background: var(--color-white);
			border-radius: 80px;
			font-size: clamp(12px, 0.95vw, 17px);
			line-height: 1;
			font-weight: 600;
			letter-spacing: 0.12em;
			text-align: center;
			position: relative;
			&:before {
				content: "";
				width: 100%;
				height: 100%;
				background: #dbe5f5;
				transition: all 0.3s;
				position: absolute;
				top: 0;
				left: -100%;
			}
			>div {
				overflow: hidden;
				display: flex;
				align-items: center;
				justify-content: center;
				width: clamp(30px, 2.5vw, 45px);
				aspect-ratio: 1 / 1;
				margin: auto;
				background: var(--color-bl-pale);
				border-radius: 50%;
				position: relative;
				transition: all 0.2s;
				>img {
					width: clamp(12px, 1vw, 18px);
				}
			}
			>p {
				position: relative;
			}
			&:hover {
				&:before {
					left: 0;
				}
				>div {
					background: var(--color-bl-deep);
				}
			}
		}
	}
	.t_imgsc {
		display: flex;
		overflow: hidden;
		gap: 0 clamp(40px, 3.35vw, 60px);
		>img {
			animation: infinity-scroll-left 80s infinite linear 0.5s both;
			width: 100vw;
			max-width: 2290px;
		}
	}
}
@keyframes anime {
	0% {
		opacity: 0;
	}
	17% {
		opacity: 1;
	}
	33% {
		opacity: 1;
	}
	50% {
		opacity: 0;
		transform: scale(1.1);
		z-index: 9;
	}
	100% {
		opacity: 0;
	}
}
@keyframes slideOutIn {
	0% {
		transform: translateX(0);
	}
	49.9% {
		transform: translateX(150%);
		opacity: 1;
	}
	50% {
		transform: translateX(-150%);
		opacity: 0;
	}
	50.1% {
		opacity: 1;
	}
	100% {
		transform: translateX(0);
	}
}
@keyframes infinity-scroll-left {
	from {
		transform: translateX(-100%);
	}
	to {
		transform: translateX(0%);
	}
}