@charset "UTF-8";



/*  l-detail
--------------------------------------------------*/
.l-detail {
	position: relative;
	padding-block: 24.0rem 20.0rem;
	background: #222020;
}
.detail-inner {
	padding-block: 12.0rem;
	background: linear-gradient(141.58deg, #F3F0F0 0.24%, #FFFFFF 70.6%, #F0EBDF 100%);
}
.detail-direction {
	position: absolute;
	left: 0;
	top: 0;
	width: 12.0rem;
	height: 12.0rem;
	font-size: 2.4rem;
	line-height: 1;
	color: var(--white);
	background: #943535;
	padding-bottom: .1em;
}
.detail-contents {
	width: min(90%,1320px);
	margin-inline: auto;
}
.detail-box {
	position: relative;
	width: calc(480 / 1320 * 100%);
	padding-top: 10.0rem;
}
.detail-box__icon--parking {
	position: absolute;
	right: 0;
	top: 11.0rem;
	width: calc(95 / 480 * 100%);
}
.detail-box__icon__note {
	position: absolute;
	inset: auto 0 0 0;
	margin-inline: auto;
    translate: 0 200%;
    white-space: nowrap;
	font-size: 1.1rem;
	line-height: 1;
	letter-spacing: .05em;
	text-align: center;
}
.detail-type {
	font-size: 3.6rem;
	line-height: 1;
	letter-spacing: 0;
	color: #B49B5E;
	margin-bottom: 4.0rem;
	padding-bottom: 4.0rem;
	border-bottom: 1px solid rgba(180, 155, 94, 0.3);
}
.detail-type em {
	font-size: 14.0rem;
	line-height: 1;
    vertical-align: -.1em;
    padding-right: 0.05em;
}
.detail-type span {
	font-size: 2.0rem;
    letter-spacing: .1em;
    color: #fff;
    background: #B49B5E;
    padding: .5em 1em;
    margin-left: .7em;
    vertical-align: .3em;
}
.detail-spec {
	margin-bottom: 7.5rem;
}
.detail-spec__ldk {
	font-size: 2.8rem;
	line-height: 1;
	letter-spacing: -0.06em;
	margin-bottom: 4.0rem;
}
.detail-spec__ldk span {
	font-size: 1.714285714285714em;
	letter-spacing: -0.02em;
}
.detail-spec__ldk em {
	font-size: 1.5em;
}
.detail-spec__area {
	position: relative;
	margin-bottom: 2.0rem;
}
.detail-spec__area__item {
	width: 100%;
	align-items: baseline;
}
.detail-spec__area__item__heading {
	position: relative;
	font-size: 1.6rem;
	line-height: 1;
	letter-spacing: .05em;
	padding-right: 1.2em;
	margin-right: .7em;
}
.detail-spec__area__item__heading i {
	position: absolute;
	right: 0;
	top: 50%;
    transform: translateY(-50%);
}
.detail-spec__area__item__desc {
	font-size: 1.6rem;
	line-height: 1;
	letter-spacing: .05em;
}
.detail-spec__area__item__desc em {
	font-size: 3em;
}
.detail-spec__area__item__desc i {
	font-size: 2em;
}
.detail-spec__area__item__desc b {
	font-size: 1.5em;
	font-weight: 400;
	font-family: YakuHanMP, 'Noto Serif JP', YuMincho, 'Hiragino Mincho ProN', 'Yu Mincho', 'MS PMincho', serif;
}
.detail-spec__area__item__desc small {
	font-size: 0.6875em;
}
.detail-spec__list {
	position: relative;
	display: inline-block;
}
.detail-spec__list__item {
	width: 100%;
	align-items: baseline;
}
.detail-spec__list__item + .detail-spec__list__item {
	margin-top: 2.0rem;
}
.detail-spec__list__item__heading {
	position: relative;
	font-size: 1.6rem;
	line-height: 1;
	letter-spacing: .05em;
    margin-right: .7em;
    padding-right: 1.2em;
    /*flex: 1 auto;*/
}
.detail-spec__list__item__heading i {
	position: absolute;
	right: 0;
	top: 50%;
    transform: translateY(-50%);
}
.detail-spec__list__item__desc {
	font-size: 1.6rem;
	line-height: 1;
	letter-spacing: .05em;
}
.detail-spec__list__item__desc b {
	font-size: 1em;
	font-weight: 400;
	font-family: YakuHanMP, 'Noto Serif JP', YuMincho, 'Hiragino Mincho ProN', 'Yu Mincho', 'MS PMincho', serif;
}
.detail-spec__list__item__desc small {
	font-size: 0.6875em;
}
.detail-spec__price {
	width: 100%;
	margin-top: 5.0rem;
	gap: 2.0rem 3.0rem;
}
.detail-spec__price__direction {
	font-size: 2.0rem;
	line-height: 1.25;
	letter-spacing: .1em;
	color: #936812;
	text-align: center;
	border: solid 1px #936812;
	/* text-align: center; */
	padding: .9rem 2.0rem 1.1rem;
	margin-bottom: 0rem;
	width: fit-content;
}
.detail-spec__price__detail {
	font-size: 2.2rem;
	line-height: 1.3;
	letter-spacing: .1em;
	color: #936812;
	/* text-align: center; */
}
.detail-spec__price__detail small {
	font-size: .7em;
    line-height: 1;
    letter-spacing: .01em;
}
.detail-spec__price__detail em {
    font-size: 2.25em;
    line-height: 1;
    letter-spacing: .02em;
}
.detail-point {
	margin-bottom: 6.5rem;
}
.detail-point__heading {
	font-size: 2.6rem;
	line-height: 1;
	letter-spacing: .05em;
	color: #B49B5E;
	margin-bottom: 1.5rem;
}
.detail-point__list {
	display: flex;
	justify-content: flex-start;
	align-items: stretch;
	flex-wrap: wrap;
	gap: 1.0rem;
	width: 100%;
}
.detail-point__list__item {
	position: relative;
	width: fit-content;
	font-size: 1.8rem;
	line-height: 1.86;
	letter-spacing: .05em;
	color: #B49B5E;
	padding: .5rem 2.5rem;
	background: var(--white);
	border: 1px solid #B49B5E;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	flex-wrap: wrap;
}
.detail-point__list__item small {
	letter-spacing: 0;
}
/*.detail-point__list__item::before {
	content: '';
	position: absolute;
	left: 0;
	top: .65em;
	width: 1.2rem;
	height: 1.2rem;
	background: linear-gradient(135deg, #F0EBDF 0%, #B49B5E 100%);
}*/
.detail-note {
	font-size: min(1.0rem,11px);
	line-height: 1.82;
	letter-spacing: 0;
	text-indent: -1em;
	margin-left: 1em;
}
.detail-floor {
	width: calc(740 / 1320 * 100%);
	padding-block: 7.0rem;
	padding-inline: 3.0rem;
	background: var(--white);
}
.detail-floor__madori {
	max-width: 100%;
	--maxwidth: 0;
	max-width: var(--maxwidth);
	width: 100%;
	margin-inline: auto;
}
.detail-floor__legend {
	position: relative;
	width: 100%;
	font-size: 0;
	text-align: center;
	margin-top: 3.0rem;
}
.detail-floor__legend__mark {
	font-size: max(1.1rem,10px);
	letter-spacing: .05em;
}
.detail-floor__legend__mark span{
	display: inline-block;
	letter-spacing: .1em;
	margin: .6rem .8rem;
}
.detail-floor__legend__mark i{
	display: inline-block;
	margin-right: .8rem;
	vertical-align: -.1em;
	width: max(2.6rem,24px);
}
.detail-floor__legend__mark img{
	vertical-align: -.08em;
}
.detail-btn {
	width: 100%;
	margin-top: 8.0rem;
}
.detail-btn__item {
	position: relative;
	width: 320px;
	height: 60px;
	font-size: 18px;
	line-height: 1;
	letter-spacing: .05em;
	color: var(--white);
	background: #B49B5E;
	margin-inline: auto;
	padding-left: 30px;
    padding-bottom: .2em;
}
.detail-btn__item::before {
	content: '';
	position: absolute;
	left: 60px;
	top: 50%;
	transform: translateY(-50%);
	width: 15px;
	height: 15px;
	background: url('../imgs/icon_plan.svg') no-repeat center center/cover;
}
@media screen and (max-width: 768px){
	.l-detail {
		padding-block: 12.0rem 10.0rem;
	}
	.detail-inner {
		padding-block: 8.0rem 6.0rem;
	}
	.detail-direction {
		width: 100%;
		height: 4.0rem;
		font-size: 1.6rem;
	}
	.detail-contents {
		width: calc(260 / 320 * 100%);
		margin-bottom: 3.0rem;
	}
	.detail-box {
		width: 100%;
		padding-top: 0;
		margin-bottom: 4.0rem;
	}
	.detail-box__icon--parking {
		top: -6.0rem;
		width: calc(65 / 260 * 100%);
	}
	.detail-box__icon__note {
	    translate: -.5em 200%;
	    font-size: 0.8rem;
	}
	.detail-type {
		font-size: 2.3rem;
		margin-bottom: 2.0rem;
		padding-bottom: 2.0rem;
	}
	.detail-type em {
		font-size: 9.0rem;
	}
	.detail-type span {
		font-size: 1.4rem;
	}
	.detail-spec {
		/*margin-bottom: 4.0rem;*/
		margin-bottom: 0;
	}
	.detail-spec__ldk {
		font-size: 1.8rem;
		margin-bottom: 2.0rem;
	}
	.detail-spec__area {
		margin-bottom: 1.0rem;
	}
	.detail-spec__area__item__heading {
		font-size: 1.1rem;
		padding-right: 1.2em;
		margin-right: .7em;
	}
	.detail-spec__area__item__desc {
		font-size: 1.1rem;
	}
	.detail-spec__area__item__desc small {
	    font-size: 0.909090909090909em;
	}
	.detail-spec__list__item + .detail-spec__list__item {
		margin-top: 1.0rem;
	}
	.detail-spec__list__item__heading {
		font-size: 1.1rem;
	    margin-right: .7em;
	    padding-right: 1.2em;
	}
	.detail-spec__list__item__desc {
		font-size: 1.1rem;
	}
	.detail-spec__list__item__desc small {
    	font-size: 0.909090909090909em
	}
	.detail-spec__price {
		width: 100%;
	    margin-top: 4.0rem;
	    gap: 0.5rem 3rem;
	}
	.detail-spec__price__direction {
		font-size: 1.5rem;
	    text-align: center;
	    padding: 0.8rem 1.5rem 1rem;
	    width: 100%;
	}
	.detail-spec__price__detail {
		font-size: 1.4rem;
	    text-align: center;
	    width: 100%;
	}
	.detail-point {
		margin-bottom: 0;
	}
	.detail-point__heading {
		font-size: 2.2rem;
		margin-bottom: 1.5rem;
	}
	.detail-point__list {
		margin-top: 3.0rem;
		gap: .5rem;
	}
	.detail-point__list__item {
		font-size: 1.4rem;
        line-height: 1.5;
        padding: .6rem 2.0rem .7rem;
	}
	/*.detail-point__list__item::before {
		top: .55em;
		width: 1.0rem;
		height: 1.0rem;
	}*/
	.detail-note {
		font-size: 1.0rem;
	}
	.detail-box .detail-note {
		display: none;
	}
	.detail-floor {
		width: 100%;
		padding-block: 4.0rem;
		padding-inline: 0;
	}
	.detail-floor__madori {
		width: 90%;
	}
	.detail-floor__legend {
		margin-top: 2.0rem;
	}
	.detail-floor__legend__mark {
		font-size: 1.0rem;
		line-height: 1.5;
		letter-spacing: .03em;
	}
	.detail-floor__legend__mark + .detail-floor__legend__mark {
		margin-top: .5rem;
	}
	.detail-floor__legend__mark span{
		letter-spacing: .03em;
		margin: 0 .8rem 0 0;
	}
	.detail-floor__legend__mark i{
		margin-right: .5rem;
		width: 2.2rem;
	}
	.detail-floor__legend__mark img{
		vertical-align: -.03em;
	}
	.detail-btn {
		margin-top: 3.0rem;
	}
	.detail-btn__item {
		width: 260px;
		height: 50px;
		font-size: 16px;
	}
	.detail-btn__item::before {
		left: 45px;
		top: 48%;
		width: 12px;
		height: 12px;
	}
}



/*=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=
customTab
=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=-=*/
.customTablist {
	gap: 2.0rem;
	margin-bottom: 7.0rem;
}
.customTab {
	position: relative;
	border: none;
	outline: none;
	font: inherit;
	color: inherit;
	background: none;
	cursor: pointer;

	width: 100%;
	height: 5.0rem;
	font-size: 1.8rem;
	line-height: 1;
	letter-spacing: .05em;
	color: #B5715E;
	text-align: center;
    padding-bottom: .2em;
	border: solid 1px #B5715E;
    background-color: #f3f0f0;
}
.customTab.active {
	color: #fff;
	background-color: #B5715E;
}
.customTab:focus-visible {
    outline: auto;
}
.customTabpanel {
	display: none;
	position: relative;
}
.customTabpanel.active {
	display: block;
	animation: tabFadeIn .5s;
}
.customTabpanel.ib.active {
	display: inline-block;
	width: fit-content;
}
@keyframes tabFadeIn{
	0%{ opacity: 0; }
	100%{ opacity: 1; }
}
@media screen and (max-width: 768px){
	.customTablist {
		gap: 1.0rem;
		margin-block: 4.0rem 0;
	}
	.customTab {
		height: 3.6rem;
		font-size: 1.4rem;
	    padding-bottom: .1em;
	}
}