@charset "shift_jis";
/* CSS Document */
/* ----------------------------------------------------
　body この記述は消さないでください！
  背景の色替えなどが必要な時に修正
---------------------------------------------------- */
body {
	color: #000000;
	font-size: 12px;
	font-weight: normal;
	line-height: 18px;
	text-align: left;
	background: #FFFFFF;
	margin: 0 0px 0px 0px;
	padding: 0;
	font-family: "Zen Kaku Gothic Antique", serif;
	font-weight: 500;
	font-style: normal;
}
.pc_off {
	display: none !important;
}
/* ----------------------------------------------------
　header 固定 この記述は消さないでください！
  PCヘッダー固定用。色変更したいときはnew_headerのバックグラウンドを変更
---------------------------------------------------- */
h1 {
	color: #333;
	font-size: clamp(8px, 1vw, 11px);
	text-align: left;
	width: 44%;
	line-height: 2.5;
	padding-left: 15px;
	float: left;
	position: absolute;
	top: 0;
	z-index: 150;
	margin: 0;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.head_title {
	color: #333;
	font-size: 11px;
	text-align: left;
	width: 44%;
	line-height: 35px;
	padding-left: 10px;
	float: left;
	position: fixed;
	top: 0;
	z-index: 150;
	margin: 0;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	font-weight: bold;
}
.new_header {
	background-color: #4cca2a;
	width: 100%;
	height: 35px;
	position: fixed;
	top: 0;
	z-index: 100;
}
.new_header_inner {
	min-width: 1000px;
}
.new_header_icon {
	float: left;
	margin: 8px 0 0 0;
}
.new_header_menu {
	float: right;
	margin-top: 6px;
}
.new_header_menu ul {
	margin: 0;
	padding: 0;
	overflow: hidden;
}
.new_header_menu li {
	list-style-type: none;
	float: left;
	padding: 0;
	margin-right: 6px;
}
.new_h_reserv {
	background-color: #fff;
	border-radius: 3px;
}
.new_h_reserv a {
	color: #4cca2a !important;
	text-align: center;
}
.new_header_menu a {
	color: #fff;
	font-weight: bold;
	text-decoration: none;
	display: block;
	padding: 3px 10px;
	height: 16px;
	line-height: 16px;
	font-size: 12px;
	letter-spacing: 1px;
}
.new_header_menu a img {
	float: left;
	margin: 0px 10px 0px 0px;
}
.new_header_icon:hover, .new_header_menu li:hover {
	filter: alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}
.new_header_menu li i {
	margin-right: 5px;
}
/*-------------------------------------------------------------------
検索ページ、物件一覧等のh2
-------------------------------------------------------------------*/
.ko_title {
	margin: 0px auto 0px auto;
	padding: 0 0 15px 5px;
	position: relative;
	font-size: 20px;
	line-height: 28px;
	border-bottom: 3px solid #DDD;
	color: #333;
	width: 100%;
	float: none;
	z-index: 0;
	overflow: initial;
	font-weight: bold;
	white-space: normal;
}
.ko_title:after {
	position: absolute;
	content: ' ';
	border-bottom: solid 3px #4cca2a;
	bottom: -3px;
	width: 80px;
	display: block;
	left: 0px;
}
/*-------------------------------------------------------------------
学区表示非表示設定
学区非表示にする場合は下記cssのコメントアウトをはずしてください
-------------------------------------------------------------------*/
/*
.sho_school , .sho_school_text , .sesrch_school , .list_school_text{
    display: none;
}
*/
/*-------------------------------------------------------------------
  ここから下を全削除後、各サイトの共通テンプレート
  ヘッダーフッターサイドバーなどで使用するcssを記載してください
  サイドバーのcssをそのまま使いたいとかであればうまく利用してください。
-------------------------------------------------------------------*/
#h_wrap {
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	width: calc(100vw - 135px);
	box-sizing: border-box;
	padding: 0 15px clamp(15px, 1.9vh, 20px) 15px;
	& img {
		display: block;
		max-width: 100%;
		height: auto;
	}
	& ul, li, p {
		margin: 0;
		padding: 0;
		list-style: none;
	}
	& a {
		color: #000000;
		text-decoration: none;
	}
	.h_logo {
		width: clamp(200px, 14vw, 260px);
	}
	>div {
		.h_menu_box {
			display: flex;
			gap: 0 3px;
			justify-content: flex-end;
			margin-bottom: clamp(12px, 1.4vh, 15px);
			>li {
				>a {
					display: flex;
					align-items: center;
					gap: 0 3px;
					padding: 0 15px;
					border-radius: 0 0 5px 5px;
					font-size: clamp(10px, 0.65vw, 12px);
					line-height: 2.7;
					color: #FFF;
					transition: all 0.2s;
					>i {
						font-size: clamp(11px, 0.7vw, 13px);
					}
				}
				&:nth-child(-n+3) {
					>a {
						background: #4cca2a;
					}
				}
				&:nth-child(n+4) {
					>a {
						background: #d4c285;
					}
				}
				&:hover {
					>a {
						background: #000000;
					}
				}
			}
		}
		.h_btn_box {
			display: flex;
			gap: 0 5px;
			justify-content: flex-end;
			>li {
				>a {
					display: block;
					padding: 0 15px;
					font-size: clamp(12px, 0.88vw, 16px);
					line-height: 2.5;
					transition: all 0.2s;
					border-radius: 10px;
					&:hover {
						color: #FFF;
					}
				}
				.h_btn_gr {
					border: 1px solid #4cca2a;
					&:hover {
						background-color: #4cca2a;
					}
				}
				.h_btn_be {
					border: 1px solid #d4c285;
					&:hover {
						background-color: #d4c285;
					}
				}
			}
		}
	}
}
/* ----------------------------------------
　side
---------------------------------------- */
/*検索 共通*/
.s_search {
	width: 196px;
	margin: 0 auto 20px;
	border: 1px solid #CCCCCC;
}
.s_search h2 {
	color: #FFFFFF;
	/*★見出し文字色*/
	margin: 2px;
	font-size: 16px;
	font-weight: bold;
	line-height: 40px;
	text-align: center;
	background: #555;
	/*★見出し背景色*/
}
.s_search ul {
	margin: 8px 5px;
	padding: 0;
	list-style: none;
}
.s_search ul li {
	line-height: 35px;
	margin-bottom: 3px;
	text-indent: 10px;
	background: #F0F0F0;
	/*★以下、背景色 #F5F5F5→#F0F0F0 を各ブラウザで指定*/
	background: -webkit-gradient(linear, left top, left bottom, from(#F5F5F5), to(#F0F0F0));
	/* Webkit系 */
	background: -moz-linear-gradient(top, #F5F5F5, #F0F0F0);
	/* Mozilla系 */
	background: -ms-linear-gradient(top, #F5F5F5, #F0F0F0);
	/* IE10+ */
	-ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#F5F5F5', endColorstr='#F0F0F0', GradientType=0)";
	/* IE8-9 */
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#F5F5F5', endColorstr='#F0F0F0', GradientType=0);
	/* IE5.5-7 */
}
.s_search ul li a {
	width: 99%;
	margin: auto;
	display: block;
	color: #555555;
	font-size: 14px;
	font-weight: bold;
	/* text-indent: 30px; */
	text-decoration: none;
	background: url(/tool/sample/side/img/s_search_icon.gif) 10px 50% no-repeat;
}
.s_search ul li a:hover {
	color: #000000;
	background: #DDDDDD url(/tool/sample/side/img/s_search_icon.gif) 10px 50% no-repeat;
	/*★hover背景色・アイコン画像*/
}
.s_search_txt {
	margin: 5px;
	font-size: 10px;
	line-height: 14px;
}
/*店舗情報*/
.s_company {
	width: 198px;
	margin: 15px 0;
	border: 1px solid #CCCCCC;
}
.s_company h2 {
	color: #FFFFFF;
	/*★見出し文字色*/
	margin: 2px;
	font-size: 16px;
	font-weight: bold;
	line-height: 40px;
	text-align: center;
	background: #555;
	/*★見出し背景色*/
}
.s_company_inner {
	margin: 5px;
}
.s_company_inner p {
	clear: both;
}
.s_company_inner p span {
	display: block;
	font-size: 14px;
	font-weight: bold;
}
.s_company_btn-l,
.s_company_btn_r {
	margin-bottom: 10px;
}
.s_company_btn-l {
	float: left;
}
.s_company_btn_r {
	float: right;
}
/* ----------------------------------------
レンタルコンテンツのお問合せボタン
---------------------------------------- */
.rental_inq {
	width: 720px;
	margin: 0 auto;
}
.rental_inq a {
	box-sizing: border-box;
	border: 3px solid #ff7f00;
	background: #ff7f00;
	color: #fff;
	position: relative;
	display: block;
	font-size: 20px;
	line-height: 18px;
	padding: 30px 0;
	text-decoration: none;
	text-align: center;
	font-weight: bold;
	letter-spacing: 1px;
}
.rental_inq a:after {
	position: absolute;
	bottom: -5px;
	content: "";
	vertical-align: middle;
	right: -5px;
	box-sizing: border-box;
	width: 10px;
	height: 10px;
	border: 10px solid transparent;
	border-left: 10px solid #FFF;
	transform: rotate(45deg);
}
.rental_inq a:hover {
	background: #fff;
	color: #ff7f00;
}
.rental_inq a:hover:after {
	border-left: 10px solid #ff7f00;
}
.side {
	position: relative;
	z-index: 1;
	& p, ul, li, h2, h3 {
		margin: 0;
		padding: 0;
		list-style: none;
	}
	& a, p {
		color: #000000;
		text-decoration: none;
	}
	.s_member {
		display: block;
		margin: 0 0 35px 0;
		transition: all 0.2s;
		&:hover {
			opacity: 0.8;
		}
	}
	.s_box {
		margin: 0 0 40px 0;
		padding-right: 10px;
		padding-left: 10px;
		.color_beige {
			color: #c9b879;
		}
		.color_green {
			color: #4cca2a;
		}
		.s_title {
			margin: 0 0 10px 0;
			>h2 {
				margin: 0 0 5px 0;
				font-size: 20px;
				line-height: 1.2;
				font-weight: 300;
			}
			>p {
				font-size: 11px;
				line-height: 1.2;
			}
		}
		>img {
			margin: 0 0 15px 0;
		}
		>p.s_catch {
			margin: 0 0 10px 0;
			font-size: 16px;
			line-height: 1.375;
			font-weight: 500;
		}
		>p.s_txt {
			margin: 0 0 15px 0;
			font-size: 10px;
			line-height: 1.4;
			font-weight: 500;
		}
		>a {
			display: flex;
			align-items: center;
			justify-content: space-between;
			width: 180px;
			box-sizing: border-box;
			margin: 0 auto;
			padding: 9px 10px 9px 15px;
			background: #FFF;
			border-radius: 15px;
			transition: all 0.2s;
			position: relative;
			>span {
				font-size: 11px;
				line-height: 18px;
				text-decoration: underline;
				text-decoration-thickness: 1px;
				text-underline-offset: 5px;
				transition: all 0.2s;
			}
			>div {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 30px;
				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;
				}
			}
		}
		.s_btn_gr {
			border: 1px solid #4cca2a;
			>span {
				text-decoration-color: #4cca2a;
			}
			>div {
				background: #4cca2a;
			}
		}
		.s_btn_beige {
			border: 1px solid #c9b879;
			>span {
				text-decoration-color: #c9b879;
			}
			>div {
				background: #c9b879;
			}
		}
	}
	#s_rent {
		padding-top: 25px;
		padding-bottom: 25px;
		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;
			z-index: -1;
		}
		&:after {
			content: "";
			display: block;
			width: 100%;
			height: 100%;
			background: linear-gradient(90deg, rgba(242, 255, 239, 1) 0%, rgba(255, 255, 255, 1) 100%);
			position: absolute;
			left: 0;
			top: 0;
			z-index: -2;
		}
	}
	#s_buy {
		>a:nth-of-type(1) {
			margin-bottom: 7px;
		}
	}
	#s_owner {
		padding-top: 25px;
		padding-bottom: 25px;
		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;
			z-index: -1;
		}
		&:after {
			content: "";
			display: block;
			width: 100%;
			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: -2;
		}
		>a:nth-of-type(1) {
			margin-bottom: 7px;
		}
	}
	#s_sale {
		padding-top: 25px;
		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;
			z-index: -1;
		}
		&:after {
			content: "";
			display: block;
			width: 100%;
			height: 100%;
			background: linear-gradient(180deg, rgba(250, 248, 240, 1) 0%, rgba(255, 255, 255, 1) 100%);
			position: absolute;
			left: 0;
			top: 0;
			z-index: -2;
		}
		>a:nth-of-type(1) {
			margin-bottom: 7px;
		}
	}
	#s_ab {
		padding-top: 25px;
		padding-bottom: 25px;
		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;
			z-index: -1;
		}
		&:after {
			content: "";
			display: block;
			width: 100%;
			height: 100%;
			background: linear-gradient(-90deg, rgba(242, 255, 239, 1) 0%, rgba(255, 255, 255, 1) 100%);
			position: absolute;
			left: 0;
			top: 0;
			z-index: -2;
		}
	}
	#s_nav {
		margin: 0 0 30px 0;
		padding: 10px 10px;
		background: #eefdea;
		border-radius: 10px;
		>ul {
			>li:not(:last-child) {
				margin: 0 0 8px 0;
			}
			>li {
				>a {
					display: block;
					padding: 12px 0 20px 75px;
					background: #FFF;
					border-radius: 10px;
					position: relative;
					>img {
						position: absolute;
						margin: auto;
						width: 65px;
						height: auto;
						display: block;
						top: 0;
						bottom: 0;
						left: 5px;
					}
					.s_ab_btn_en {
						margin: 0 0 5px 0;
						font-size: 11px;
						line-height: 13px;
						color: #4cca2a;
					}
					.s_ab_btn_name {
						margin: 0 0 2px 0;
						height: 36px;
						font-size: 15px;
						line-height: 18px;
					}
					.s_ab_btn_more {
						display: inline-block;
						padding: 0 12px 0 8px;
						clip-path: polygon(0 0, 90% 0, 100% 100%, 0% 100%);
						background: #4cca2a;
						font-weight: 300;
						font-size: 10px;
						line-height: 1.5;
						color: #FFF;
						position: absolute;
						bottom: 8px;
						right: 8px;
						transition: all 0.2s;
					}
					&:hover {
						.s_ab_btn_more {
							background: #000000;
						}
					}
				}
			}
		}
	}
}
#f_wrap {
	padding: 120px 0 0 0;
	background: #FFF;
	position: relative;
	z-index: 3;
	& ul, p, li {
		margin: 0;
		padding: 0;
		list-style: none;
	}
	& a {
		text-decoration: none;
		color: #333333;
	}
	& img {
		display: block;
		max-width: 100%;
	}
	>div {
		padding: 60px 0 0 0;
		background: #f2ffef;
		>div {
			width: clamp(1000px, 75vw, 1400px);
			margin-right: auto;
			margin-left: auto;
			margin-bottom: 50px;
			>div {
				display: flex;
				align-items: flex-start;
				justify-content: space-between;
				margin: 0 0 60px 0;
				.f_box {
					width: clamp(200px, 14vw, 260px);
					& img {
						height: auto;
					}
					>a {
						display: block;
						margin: 0 0 clamp(20px, 2.8vh, 30px) 0;
					}
					.f_box_txt {
						margin: 0 0 clamp(10px, 1.4vh, 15px) 0;
						font-size: clamp(11px, 0.85vw, 16px);
						line-height: 1.5;
					}
					>div {
						.f_box_tel {
							font-size: clamp(22px, 1.65vw, 30px);
							line-height: 1.5;
							display: flex;
							align-items: center;
							gap: 0 8px;
							&:before {
								content: "";
								display: block;
								width: clamp(24px, 1.75vw, 32px);
								height: auto;
								aspect-ratio: 1 / 1;
								background-image: url(/img/common/footer/f_tel_icon.webp);
								background-size: cover;
								background-repeat: no-repeat;
							}
						}
						.f_box_time {
							margin: 0 0 clamp(15px, 1.85vh, 20px) 0;
							font-size: clamp(9px, 0.65vw, 12px);
							line-height: 1;
						}
					}
					>ul {
						display: flex;
						gap: 0 5px;
						>li {
							width: clamp(90px, 6.4vw, 115px);
							>a {
								display: block;
								padding: 15px 0;
								border-radius: 10px;
								font-size: clamp(10px, 0.75vw, 14px);
								line-height: 1.5;
								color: #FFF;
								text-align: center;
								transition: all 0.2s;
							}
							&:nth-child(1) a {
								background: #4cca2a;
							}
							&:nth-child(2) a {
								background: #d4c285;
							}
							&:hover {
								>a {
									background: #000000;
								}
							}
						}
					}
				}
				.f_link {
					display: flex;
					gap: 0 clamp(45px, 3.2vw, 60px);
					.f_link_w {
						display: flex;
						gap: 0 clamp(45px, 3.2vw, 60px);
						&:after {
							content: "";
							display: block;
							width: 1px;
							height: 100%;
							background: #4cca2a;
						}
						>ul {
							>li {
								display: flex;
								align-items: center;
								gap: 0 8px;
								&:not(:last-child) {
									margin: 0 0 clamp(15px, 1.85vh, 20px) 0;
								}
								&:before {
									content: "";
									display: block;
									width: 6px;
									height: 10px;
									clip-path: polygon(0 0, 0% 100%, 100% 50%);
									background: #4cca2a;
								}
								>a {
									font-size: clamp(11px, 0.85vw, 16px);
									line-height: 1.2;
									transition: all 0.2s;
									&:hover {
										color: #4cca2a;
									}
								}
							}
						}
					}
					.f_link_t {
						display: flex;
						justify-content: space-between;
						gap: 0 clamp(45px, 3.2vw, 60px);
						.f_link_part {
							>div {
								margin: 0 0 clamp(15px, 1.85vh, 20px) 0;
								.f_link_name {
									margin: 0 0 8px 0;
									font-size: clamp(12px, 0.95vw, 18px);
									line-height: 1;
								}
								.f_link_en {
									font-size: clamp(10px, 0.75vw, 12px);
									line-height: 1;
									font-weight: 300;
								}
							}
							>ul {
								>li {
									&:not(:last-child) {
										margin: 0 0 clamp(15px, 1.85vh, 20px) 0;
									}
									>a {
										font-size: clamp(11px, 0.75vw, 14px);
										line-height: 1;
										transition: all 0.2s;
										&:hover {
											color: #4cca2a;
										}
									}
								}
							}
						}
					}
				}
			}
			>p {
				font-size: clamp(9px, 0.6vw, 11px);
				line-height: 1;
				text-align: center;
			}
		}
		>p {
			background: #4cca2a;
			font-size: clamp(9px, 0.6vw, 11px);
			line-height: 2.3;
			color: #FFF;
			text-align: center;
		}
	}
}
/* サイド固定 */
.t_side {
	display: flex;
	align-items: flex-end;
	justify-content: center;
	width: clamp(70px, 5.5vw, 100px);
	height: 100vh;
	box-sizing: border-box;
	padding: 20px 0 20px 0;
	background: #eefdea;
	position: fixed;
	top: 0;
	right: 0;
	z-index: 100;
	>ul {
		display: flex;
		flex-direction: column;
		gap: 10px 0;
		margin: 0;
		padding: 0;
		list-style: none;
		>li {
			&:not(:last-child) a {
				background: #c9b879;
				&:before {
					background-image: url(/img/top/t_side_icon03.png);
				}
			}
			&:last-child a {
				background: #4cca2a;
				&:before {
					background-image: url(/img/top/t_side_icon02.webp);
				}
			}
			>a {
				display: flex;
				align-items: center;
				gap: 0 5px;
				padding: clamp(11px, 0.82vw, 15px);
				border-radius: 10px;
				font-size: clamp(12px, 0.86vw, 16px);
				line-height: 1.25;
				color: #FFF;
				letter-spacing: 0.1em;
				text-decoration: none;
				-ms-writing-mode: tb-rl;
				writing-mode: vertical-rl;
				transition: all 0.2s;
				&:before {
					content: "";
					display: block;
					width: clamp(16px, 1.2vw, 22px);
					height: auto;
					aspect-ratio: 1 / 1;
					background-repeat: no-repeat;
					background-size: cover;
				}
				&:hover {
					background: #000000;
				}
			}
		}
	}
}
/*　開閉メニュー　*/
.header-logo-menu {
	position: fixed;
	top: 15px;
	right: calc((clamp(70px, 5.5vw, 100px) - 50px)/2);
	z-index: 150;
}
#nav-drawer {
	position: relative;
}
/*チェックボックス等は非表示に*/
.nav-unshown {
	display: none;
}
/*アイコンのスペース*/
#nav-open {
	width: 50px;
	height: 50px;
	display: inline-block;
	box-sizing: border-box;
	padding: 32px 0 0 0;
	vertical-align: middle;
	z-index: 99;
	position: inherit;
	cursor: pointer;
	font-size: clamp(10px, 0.65vw, 12px);
	line-height: 18px;
	color: #4cca2a;
	text-align: center;
}
/*ハンバーガーの形をCSSで表現*/
#nav-open span,
#nav-open span:before,
#nav-open span:after {
	position: absolute;
	height: 2px;
	/*線の太さ*/
	/*長さ*/
	border-radius: 3px;
	background: #4cca2a;
	display: block;
	content: '';
	cursor: pointer;
	transition: 0.2s;
}
#nav-open span {
	width: 36px;
	top: 6px;
	left: 7px;
}
#nav-open span:before {
	width: 30px;
	bottom: -8px;
	transition: 0.2s;
}
#nav-open span:after {
	width: 24px;
	bottom: -16px;
	transition: 0.2s;
}
/*メニューの中身*/
#nav-content {
	overflow: auto;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 98;
	width: 100%;
	height: 100%;
	background: #f2ffef;
	transition: .3s ease-in-out;
	display: none;
	transform: scale(0.5);
	transition: 0.2s;
}
/*チェックがついたら表示させる*/
#nav-input:checked~#nav-close {
	display: block;
	opacity: .5;
}
#nav-input:checked~#nav-content {
	box-shadow: 6px 0 25px rgba(0, 0, 0, .15);
	display: block;
	transform: scale(1);
	transition: 0.2s;
}
/*チェックがついたらボタンに変形*/
#nav-input:checked~#nav-open {
	border-bottom: 1px solid #f0f9ff;
	border-left: 1px solid #f0f9ff;
}
#nav-input:checked~#nav-open img {
	display: none;
}
#nav-input:checked~#nav-open span {
	height: 0px;
	/*線の太さ*/
}
#nav-input:checked~#nav-open span:before {
	width: 30px;
	transform: rotate(-45deg);
	bottom: -11px;
}
#nav-input:checked~#nav-open span:after {
	width: 30px;
	transform: rotate(45deg);
	bottom: -11px;
}
.nav_content_inner {
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	& ul, p, li {
		margin: 0;
		padding: 0;
		list-style: none;
	}
	& a {
		text-decoration: none;
		color: #333333;
	}
	& img {
		display: block;
		max-width: 100%;
		height: auto;
	}
	>div {
		display: flex;
		align-items: flex-start;
		justify-content: space-between;
		width: clamp(1000px, 75vw, 1400px);
		margin-right: auto;
		margin-left: auto;
		.nav_content_box {
			width: clamp(200px, 14vw, 260px);
			>a {
				display: block;
				margin: 0 0 clamp(20px, 2.8vh, 30px) 0;
			}
			.nav_content_box_txt {
				margin: 0 0 clamp(10px, 1.4vh, 15px) 0;
				font-size: clamp(11px, 0.85vw, 16px);
				line-height: 1.5;
			}
			>div {
				.nav_content_box_tel {
					font-size: clamp(22px, 1.65vw, 30px);
					line-height: 1.5;
					display: flex;
					align-items: center;
					gap: 0 8px;
					&:before {
						content: "";
						display: block;
						width: clamp(24px, 1.75vw, 32px);
						height: auto;
						aspect-ratio: 1 / 1;
						background-image: url(/img/common/footer/f_tel_icon.webp);
						background-size: cover;
						background-repeat: no-repeat;
					}
				}
				.nav_content_box_time {
					margin: 0 0 clamp(15px, 1.85vh, 20px) 0;
					font-size: clamp(9px, 0.65vw, 12px);
					line-height: 1;
				}
			}
			>ul {
				display: flex;
				gap: 0 5px;
				>li {
					width: clamp(90px, 6.4vw, 115px);
					>a {
						display: block;
						padding: 15px 0;
						border-radius: 10px;
						font-size: clamp(10px, 0.75vw, 14px);
						line-height: 1.5;
						color: #FFF;
						text-align: center;
						transition: all 0.2s;
					}
					&:nth-child(1) a {
						background: #4cca2a;
					}
					&:nth-child(2) a {
						background: #d4c285;
					}
					&:hover {
						>a {
							background: #000000;
						}
					}
				}
			}
		}
		.nav_content_link {
			display: flex;
			gap: 0 clamp(45px, 3.2vw, 60px);
			.nav_content_link_w {
				display: flex;
				gap: 0 clamp(45px, 3.2vw, 60px);
				&:after {
					content: "";
					display: block;
					width: 1px;
					height: 100%;
					background: #4cca2a;
				}
				>ul {
					>li {
						display: flex;
						align-items: center;
						gap: 0 8px;
						&:not(:last-child) {
							margin: 0 0 clamp(15px, 1.85vh, 20px) 0;
						}
						&:before {
							content: "";
							display: block;
							width: 6px;
							height: 10px;
							clip-path: polygon(0 0, 0% 100%, 100% 50%);
							background: #4cca2a;
						}
						>a {
							font-size: clamp(11px, 0.85vw, 16px);
							line-height: 1.2;
							transition: all 0.2s;
							&:hover {
								color: #4cca2a;
							}
						}
					}
				}
			}
			.nav_content_link_t {
				display: flex;
				justify-content: space-between;
				gap: 0 clamp(45px, 3.2vw, 60px);
				.nav_content_link_part {
					>div {
						margin: 0 0 clamp(15px, 1.85vh, 20px) 0;
						.nav_content_link_name {
							margin: 0 0 8px 0;
							font-size: clamp(12px, 0.95vw, 18px);
							line-height: 1;
						}
						.nav_content_link_en {
							font-size: clamp(10px, 0.75vw, 12px);
							line-height: 1;
							font-weight: 300;
						}
					}
					>ul {
						>li {
							&:not(:last-child) {
								margin: 0 0 clamp(15px, 1.85vh, 20px) 0;
							}
							>a {
								font-size: clamp(11px, 0.75vw, 14px);
								line-height: 1;
								transition: all 0.2s;
								&:hover {
									color: #4cca2a;
								}
							}
						}
					}
				}
			}
		}
	}
}
.color_green {
	color: #4cca2a;
}
.color_beige {
	color: #c9b879;
}
.font_lexend {
	font-family: "Lexend Giga", sans-serif;
	font-optical-sizing: auto;
	font-weight: 500;
	font-style: normal;
}