@charset "utf-8";

/*----------------------------------------------------
touraku-rate.css
Since 2023.3.7
----------------------------------------------------*/

.rate-of-return {}

.rate-of-return .box {
	margin: 0 auto;
	width: 94%;
}

.rate-of-return p {
	margin: 0;
}

.rate-of-return .style-table {
	display: table;
	width: 100%;
}

.rate-of-return .style-tcell {
	display: table-cell;
	vertical-align: top;
}

.rate-of-return .komejiru {
	line-height: 1.6;
	margin: 1em 0 0;
	width: 100%;
}

.rate-of-return .komejiru a {
	display: inline-block;
	text-decoration: underline;
}

.rate-of-return .komejiru a:hover {
	text-decoration: none;
}


/* 騰落率
--------------------------------------*/

.rate-of-return .rate-of-return-inner-wrap {
	background: rgba(255, 255, 255, .1);
	border-radius: 4px;
	box-sizing: border-box;
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-between;
	padding: 2em;
}

.rate-of-return .rate-of-return-inner-wrap > * {
	text-align: center;
}

.rate-of-return .return-on-new-construction {
	border-left: 1px dashed #958a5a;
	border-right: 1px dashed #958a5a;
	padding: 2% 3%;
	width: 19%;
}

.rate-of-return .return-on-new-construction .head-txt {
	font-size: 19px;
	font-weight: 400;
	letter-spacing: .1em;
	margin: 0 0 .3em;
}

.rate-of-return .return-on-new-construction .rate {
	font-size: 48px;
	font-weight: 400;
	letter-spacing: 0;
	line-height: 1.3;
}

.rate-of-return .return-on-new-construction .per {
	font-size: 21px;
	font-weight: 600;
	padding-left: 0.06em;
}

.rate-of-return .return-on-new-construction .chikunen {
	font-size: 15px;
	letter-spacing: .06em;
}

.rate-of-return .rate-of-return-ranking {/* ul */
	display: flex;
	flex-flow: row nowrap;
	justify-content: space-around;
	list-style: none;
	margin: 0;
	padding: 0;
	width: 72%;
}

.rate-of-return .ranking-list {/* li */
	padding: 2%;
	text-align: center;
	width: 29%;
}

.rate-of-return .ranking-list .head-txt {
	font-size: 17px;
	font-weight: 400;
	letter-spacing: .1em;
	margin: 0;
	min-height: 42px;
}

.rate-of-return .ranking-list .rank-detail {
	font-size: 17px;
	font-weight: 600;
	line-height: 1.3;
}

.rate-of-return .ranking-list .rank {
	font-size: 46px;
	font-weight: 400;
	letter-spacing: 0;
	padding-right: .06em;
}

.rate-of-return .ranking-list .rank::before {
	background: linear-gradient(112deg, #958a5a, #eddc91 25%, #958a5a 50%);
	background-clip: text;
	-webkit-background-clip: text;
/*	-webkit-text-fill-color: rgba(255,255,255,0);*/
	color: rgba(255, 255, 255, 0);
	content: "\f091";
	display: inline-block;
	font-family: 'FontAwesome';
	font-size: 32px;
	height: auto;
	line-height: 1;
	margin-right: .2em;
	vertical-align: 4px;
	width: auto;
}

.rate-of-return .ranking-list .all-properties {
	font-size: 15px;
	letter-spacing: .06em;
}


@media screen and (max-width: 960px) {
	.rate-of-return .return-on-new-construction {
		padding: 2%;
		width: 22%;
	}

	.rate-of-return .return-on-new-construction .head-txt {
		font-size: clamp(15px, 1.9vw, 18px);
	}

	.rate-of-return .return-on-new-construction .rate {
		font-size: clamp(40px, 5.3vw, 46px);
	}

	.rate-of-return .return-on-new-construction .per {
		font-size: 17px;
	}

	.rate-of-return .return-on-new-construction .chikunen,
	.rate-of-return .ranking-list .all-properties {
		font-size: 14px;
	}

	.rate-of-return .ranking-list .head-txt {
		font-size: clamp(14px, 1.7vw, 16px);
	}

	.rate-of-return .ranking-list .rank-detail {
		font-size: 15px;
	}

	.rate-of-return .ranking-list .rank {
		font-size: clamp(37px, 4.8vw, 44px);
	}

	.rate-of-return .ranking-list .rank::before {
		font-size: clamp(27px, 3.5vw, 30px);
	}
}


@media screen and (max-width: 767px) {
	.rate-of-return .rate-of-return-inner-wrap {
		flex-direction: column;
	}

	.rate-of-return .return-on-new-construction {
		border: 1px dashed #958a5a;
		box-sizing: border-box;
		margin: 0 auto 3%;
		padding: 3% 2% 2%;
		width: 100%;
	}

	.rate-of-return .rate-of-return-ranking {
		width: 100%;
	}
}


@media screen and (max-width: 600px) {
	.rate-of-return .rate-of-return-ranking {
		flex-direction: column;
	}

	.rate-of-return .ranking-list {
		border-bottom: 1px dashed #958a5a;
		box-sizing: border-box;
		padding: 4% 2%;
		width: 100%;
	}

	.rate-of-return .ranking-list .head-txt {
		margin-bottom: .3em;
		min-height: revert;
	}
}