@charset "shift_jis";
@media screen and (max-width:768px) {
	.sp_off {
		display: none;
	}
	.tokusen_pack_wrap {
		width: 1100px;
		display: flex;
		justify-content: space-between;
		align-content: flex-start;
		margin: 0;
		padding: 0;
	}
	.tokusen_pack_wrap>li {
		position: relative;
		width: 265px;
		border: 1px solid #ccc;
		box-sizing: border-box;
		overflow: hidden;
	}
	.tokusen_pack_wrap>li:hover {
		border: 1px solid #ffdd00;
		background: #fffdf3;
	}
	.tokusen_pack_img {
		width: 100%;
		height: 140px;
		display: flex;
		align-items: center;
		overflow: hidden;
	}
	.tokusen_pack_img img {
		width: 100%;
		height: auto;
	}
	.tokusen_pack_title {
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
	}
	.tokusen_pack_title span {
		position: absolute;
		box-sizing: border-box;
		color: #fff;
		font-size: 14px;
		height: 30px;
		padding: 5px;
		background: #000;
		display: block;
		width: 100%;
		top: 140px;
		left: 0px;
	}
	.tokusen_pack_txt {
		margin-top: 30px;
		font-size: 12px;
		list-style: none;
		padding: 10px;
	}
	.tokusen_pack_txt ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	span.tokusen_pack_yachin {
		font-size: 16px;
		color: #FF0000;
	}
	.tokusen_pack_kakaku>div {
		display: inline-block;
		margin-left: 5px;
	}
	.tokusen_pack_kyouekihi:not(:empty)::before {
		content: "[共益費]";
		margin-right: 3px;
	}
	.tokusen_pack_kanrihi:not(:empty)::before {
		content: "[管理費]";
		margin-right: 3px;
	}
	.tokusen_pack_txt ul li {
		margin-bottom: 0px;
		font-size: 11px;
	}
	.tokusen_pack_comment {
		background: #f5f5f5;
		margin-top: 10px;
		box-sizing: border-box;
		border: 1px solid #eee;
		height: 75px;
		overflow: hidden;
	}
	.tokusen_pack_comment p {
		margin: 10px;
		overflow: hidden;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		line-height: 18px;
	}
	.t_bukken {
		width: 100%;
		padding: 5px 0;
		overflow: hidden;
	}
	.t_bukken_slide {
		padding: 5px 0;
		overflow: hidden;
		position: relative;
		& ul {
			margin: 0;
			padding: 0;
			list-style: none;
		}
		& p {
			margin: 0;
			padding: 0;
		}
		>ul {
			height: fit-content;
			margin: 0 0 15px 0;
			>li {
				width: 270px;
				height: fit-content;
				>a {
					display: block;
					box-sizing: border-box;
					padding: 20px;
					background: #FFF;
					border-radius: 15px;
					box-shadow: 0px 0px 6px 0px RGBA(179, 179, 179, 0.2);
					text-decoration: none;
					font-family: "Zen Kaku Gothic Antique", "揀Cリオ", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
					font-weight: 500;
					font-style: normal;
					color: #333;
					.t_bukken_img {
						width: 100%;
						height: 100%;
						aspect-ratio: 4 / 3;
						margin: 0 0 15px 0;
						border-radius: 12px 12px 12px 0;
						overflow: hidden;
						position: relative;
						>img {
							width: 100%;
							height: 100%;
							object-fit: cover;
						}
						>p {
							display: inline-block;
							border-radius: 0 12px 0 0;
							padding: 10px 12px 0 0;
							background: #FFF;
							font-size: clamp(14px, 3.9vw, 16px);
							line-height: 18px;
							color: #bdac6f;
							position: absolute;
							bottom: 0;
							left: 0;
						}
					}
					.t_bukken_name {
						margin: 0 0 10px 0;
						font-size: clamp(18px, 4.8vw, 20px);
						line-height: 20px;
						letter-spacing: 0.1em;
						>span {
							overflow: hidden;
							display: -webkit-box;
							-webkit-box-orient: vertical;
							-webkit-line-clamp: 1;
						}
					}
					.t_bukken_price {
						display: flex;
						align-items: baseline;
						gap: 0 8px;
						margin: 0 0 12px 0;
						>p {
							display: flex;
							align-items: baseline;
							font-size: clamp(12px, 3.4vw, 14px);
							line-height: 20px;
							>span {
								font-size: clamp(18px, 4.8vw, 20px);
							}
						}
						.t_bukken_yachin:after {
							content: "";
							width: 2px;
							height: 12px;
							margin-left: 5px;
							background: #333333;
							border-radius: 1px;
							transform: rotate(20deg);
						}
						.t_bukken_yachin span {
							color: #bdac6f;
							margin-left: 5px;
						}
						.t_bukken_kanri span {
							margin-left: 5px;
						}
						.t_bukken_kakaku:after {
							content: "";
							width: 2px;
							height: 18px;
							margin-left: 8px;
							background: #333333;
							border-radius: 1px;
							transform: rotate(20deg);
						}
						.t_bukken_kakaku span {
							color: #bdac6f;
							margin-left: 5px;
						}
					}
					>ul {
						>li {
							font-size: clamp(12px, 3.4vw, 14px);
							line-height: 14px;
							color: #878787;
							&:not(:last-child) {
								margin: 0 0 7px 0;
							}
							>span {
								overflow: hidden;
								display: -webkit-box;
								-webkit-box-orient: vertical;
								-webkit-line-clamp: 1;
							}
						}
					}
				}
			}
		}
		.t_bukken_slide_btn {
			display: flex;
			justify-content: space-between;
			width: 100%;
			max-width: 340px;
			height: fit-content;
			margin: auto;
			position: absolute;
			left: 0;
			right: 0;
			top: 139px;
			.t_bukken_slide_btn_prev, .t_bukken_slide_btn_next {
				display: flex;
				align-items: center;
				justify-content: center;
				width: 50px;
				height: 50px;
				border-radius: 50%;
				box-sizing: border-box;
				border: 1px solid #bdac6f;
				cursor: pointer;
				position: relative;
				z-index: 2;
				>img {
					width: 10px;
					height: auto;
				}
			}
		}
		.t_bukken_slide_pagenation {
			text-align: center;
			.swiper-pagination-bullet {
				width: 12px;
				height: 12px;
				border-radius: 50%;
				background: #e8e0cb;
				opacity: 1;
			}
			.swiper-pagination-bullet-active {
				background: #c8ba8d;
			}
		}
	}
}
@media screen and (min-width: 769px) {
	.pc_off {
		display: none;
	}
	.tokusen_pack_wrap {
		width: 1100px;
		display: flex;
		justify-content: space-between;
		align-content: flex-start;
		margin: 0;
		padding: 0;
	}
	.tokusen_pack_wrap>li {
		position: relative;
		width: 265px;
		border: 1px solid #ccc;
		box-sizing: border-box;
		overflow: hidden;
	}
	.tokusen_pack_wrap>li:hover {
		border: 1px solid #ffdd00;
		background: #fffdf3;
	}
	.tokusen_pack_img {
		width: 100%;
		height: 140px;
		display: flex;
		align-items: center;
		overflow: hidden;
	}
	.tokusen_pack_img img {
		width: 100%;
		height: auto;
	}
	.tokusen_pack_title {
		position: absolute;
		width: 100%;
		height: 100%;
		top: 0;
		left: 0;
	}
	.tokusen_pack_title span {
		position: absolute;
		box-sizing: border-box;
		color: #fff;
		font-size: 14px;
		height: 30px;
		padding: 5px;
		background: #000;
		display: block;
		width: 100%;
		top: 140px;
		left: 0px;
	}
	.tokusen_pack_txt {
		margin-top: 30px;
		font-size: 12px;
		list-style: none;
		padding: 10px;
	}
	.tokusen_pack_txt ul {
		list-style: none;
		margin: 0;
		padding: 0;
	}
	span.tokusen_pack_yachin {
		font-size: 16px;
		color: #FF0000;
	}
	.tokusen_pack_kakaku>div {
		display: inline-block;
		margin-left: 5px;
	}
	.tokusen_pack_kyouekihi:not(:empty)::before {
		content: "[共益費]";
		margin-right: 3px;
	}
	.tokusen_pack_kanrihi:not(:empty)::before {
		content: "[管理費]";
		margin-right: 3px;
	}
	.tokusen_pack_txt ul li {
		margin-bottom: 0px;
		font-size: 11px;
	}
	.tokusen_pack_comment {
		background: #f5f5f5;
		margin-top: 10px;
		box-sizing: border-box;
		border: 1px solid #eee;
		height: 75px;
		overflow: hidden;
	}
	.tokusen_pack_comment p {
		margin: 10px;
		overflow: hidden;
		display: -webkit-box;
		-webkit-box-orient: vertical;
		-webkit-line-clamp: 3;
		line-height: 18px;
	}
	/* ?????? */
	.t_bukken {
		width: 100%;
		padding: 5px 0;
		overflow: hidden;
	}
	.t_bukken_slide {
		padding: 5px 0;
		overflow: hidden;
		position: relative;
		& ul {
			margin: 0;
			padding: 0;
			list-style: none;
		}
		& p {
			margin: 0;
			padding: 0;
		}
		>ul {
			height: fit-content;
			>li {
				width: clamp(350px, 23.5vw, 420px);
				height: fit-content;
				>a {
					display: block;
					box-sizing: border-box;
					padding: clamp(25px, 1.65vw, 30px);
					background: #FFF;
					border-radius: 20px;
					box-shadow: 0px 0px 6px 0px RGBA(179, 179, 179, 0.2);
					text-decoration: none;
					font-family: "Zen Kaku Gothic Antique", "揀Cリオ", "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
					font-weight: 500;
					font-style: normal;
					color: #333;
					.t_bukken_img {
						width: 100%;
						aspect-ratio: 6 / 5;
						margin: 0 0 clamp(12px, 0.85vw, 15px) 0;
						border-radius: 16px 16px 16px 0;
						overflow: hidden;
						position: relative;
						>img {
							width: 100%;
							height: 100%;
							object-fit: cover;
							transition: all 0.2s;
						}
						>p {
							display: inline-block;
							border-radius: 0 16px 0 0;
							padding: 15px 18px 0 0;
							background: #FFF;
							font-size: clamp(16px, 1.1vw, 20px);
							line-height: 1.2;
							color: #bdac6f;
							position: absolute;
							bottom: 0;
							left: 0;
						}
					}
					.t_bukken_name {
						margin: 0 0 clamp(12px, 0.85vw, 15px) 0;
						font-size: clamp(22px, 1.4vw, 26px);
						line-height: 1;
						letter-spacing: 0.1em;
						transition: all 0.2s;
						>span {
							overflow: hidden;
							display: -webkit-box;
							-webkit-box-orient: vertical;
							-webkit-line-clamp: 1;
						}
					}
					.t_bukken_price {
						display: flex;
						align-items: baseline;
						gap: 0 12px;
						margin: 0 0 clamp(12px, 0.85vw, 15px) 0;
						>p {
							display: flex;
							align-items: baseline;
							font-size: clamp(15px, 1vw, 18px);
							line-height: 1;
							>span {
								font-size: clamp(22px, 1.4vw, 26px);
							}
						}
						.t_bukken_yachin:after {
							content: "";
							width: 2px;
							height: 18px;
							margin-left: 12px;
							background: #333333;
							border-radius: 1px;
							transform: rotate(20deg);
						}
						.t_bukken_yachin span {
							color: #bdac6f;
							margin-left: 8px;
						}
						.t_bukken_kanri span {
							margin-left: 8px;
						}
						.t_bukken_kakaku:after {
							content: "";
							width: 2px;
							height: 18px;
							margin-left: 12px;
							background: #333333;
							border-radius: 1px;
							transform: rotate(20deg);
						}
						.t_bukken_kakaku span {
							color: #bdac6f;
							margin-left: 8px;
						}
					}
					>ul {
						>li {
							font-size: clamp(15px, 1vw, 18px);
							line-height: 1;
							color: #878787;
							&:not(:last-child) {
								margin: 0 0 7px 0;
							}
							>span {
								overflow: hidden;
								display: -webkit-box;
								-webkit-box-orient: vertical;
								-webkit-line-clamp: 1;
							}
						}
					}
					&:hover {
						.t_bukken_img {
							>img {
								transform: scale(1.1);
							}
						}
						.t_bukken_name {
							color: #bdac6f;
						}
					}
				}
			}
		}
		.t_bukken_slide_btn {
			display: flex;
			justify-content: space-between;
			width: clamp(1200px, 80vw, 1450px);
			height: fit-content;
			margin: auto;
			position: absolute;
			top: 0;
			bottom: 0;
			left: 0;
			right: 0;
			.t_bukken_slide_btn_prev, .t_bukken_slide_btn_next {
				display: flex;
				align-items: center;
				justify-content: center;
				width: clamp(90px, 5.9vw, 106px);
				height: clamp(90px, 5.9vw, 106px);
				border-radius: 50%;
				box-sizing: border-box;
				border: 1px solid #bdac6f;
				cursor: pointer;
				position: relative;
				z-index: 2;
				>img {
					width: clamp(21px, 1.4vw, 25px);
				}
			}
		}
	}
}