@charset "shift_jis";
@media screen and (max-width:768px) {
	& ul.t_house_ul {
		font-family: "Zen Kaku Gothic Antique", serif;
		font-weight: 500;
		font-style: normal;
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
		margin: 0;
		padding: 0;
		list-style: none;
		.color_green {
			color: #4cca2a;
		}
		& p {
			margin: 0;
		}
		>li {
			width: calc((100% - 10px)/2);
			>a {
				display: block;
				height: 100%;
				box-sizing: border-box;
				padding: 8px;
				border: 1px solid #4cca2a;
				border-radius: 10px;
				text-decoration: none;
				color: #000000;
				.t_house_img {
					width: 100%;
					aspect-ratio: 16 / 9;
					margin: 0 0 8px 0;
					border-radius: 8px;
					overflow: hidden;
					position: relative;
					>img {
						width: 100%;
						height: 100%;
						object-fit: cover;
					}
					>p {
						position: absolute;
						bottom: 0;
						right: 0;
						padding: 0 8px 0 12px;
						border-radius: 8px 0 0 0;
						background: #FFF;
						font-size: clamp(11px, 3vw, 13px);
						line-height: 2;
					}
				}
				>p {
					margin: 0 0 8px 0;
					font-size: clamp(12px, 3.6vw, 15px);
					line-height: 1.2;
					overflow: hidden;
					display: -webkit-box;
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 1;
				}
				.t_house_box {
					padding: 8px 10px;
					background: #eefdea;
					border-radius: 8px;
					>div {
						display: flex;
						align-items: flex-end;
						gap: 0 6px;
						margin: 0 0 2px 0;
						>p {
							line-height: 1.2;
							letter-spacing: 0.05em;
						}
						.t_house_price {
							font-size: clamp(14px, 3.9vw, 16px);
						}
						.t_house_price_s {
							display: flex;
							align-items: center;
							gap: 0 6px;
							font-size: clamp(10px, 2.8vw, 11px);
							&:before {
								content: "";
								display: block;
								width: 1px;
								height: clamp(10px, 2.8vw, 11px);
								background: #000000;
								transform: rotate(25deg);
							}
						}
					}
					>p {
						>span {
							font-size: clamp(10px, 2.8vw, 12px);
							line-height: 1.5;
							overflow: hidden;
							display: -webkit-box;
							-webkit-box-orient: vertical;
							-webkit-line-clamp: 1;
						}
					}
				}
			}
		}
	}
}
@media screen and (min-width: 769px) {
	ul.t_house_ul {
		display: flex;
		gap: 0 20px;
		margin: 0;
		padding: 0;
		list-style: none;
		font-family: "Zen Kaku Gothic Antique", serif;
		font-weight: 500;
		font-style: normal;
		.color_green {
			color: #4cca2a;
		}
		& p {
			margin: 0;
		}
		>li {
			width: calc((100% - 60px)/4);
			>a {
				display: block;
				box-sizing: border-box;
				padding: 14px;
				border: 1px solid #4cca2a;
				background: #FFF;
				border-radius: 10px;
				text-decoration: none;
				color: #000000;
				.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 10px 0;
					font-size: clamp(15px, 1.55vw, 18px);
					line-height: 1.35;
					>span {
						overflow: hidden;
						display: -webkit-box;
						-webkit-box-orient: vertical;
						-webkit-line-clamp: 1;
					}
				}
				.t_house_box {
					padding: 10px;
					background: #eefdea;
					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.85vw, 22px);
						}
						.t_house_price_s {
							display: flex;
							align-items: center;
							gap: 0 10px;
							font-size: clamp(11px, 1.35vw, 16px);
							&:before {
								content: "";
								display: block;
								width: 1px;
								height: clamp(11px, 1.35vw, 16px);
								background: #000000;
								transform: rotate(25deg);
							}
						}
					}
					>p {
						>span {
							font-size: clamp(10px, 1.15vw, 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);
						}
					}
				}
			}
		}
	}
}