@charset "UTF-8";

/*----------------------------------------

　index

-----------------------------------------*/

#content .visual {
	position: relative;
	background: #1a1816;
}
#content .visual .img {transition: 4s ease all;opacity: 0;position: relative;}

#content .visual.active .img {
	opacity: 1;
}
#content .visual .video {position: absolute;left: 0;top: 0;z-index: 100;transition: all ease 2s;width: 100%;}
#content .visual.end .video {
	opacity: 0;
	pointer-events: none;
}
#content .visual .video video {display: block;width: 100%;}
#content .visual > .inner {
	
}
#content .visual h1 {
	position: absolute;
	left: 50%;
	top: 30.5%;
	transform: translate(-50%, -50%);
	width: 38%;
	transition: 4s ease all +1.5s;
	opacity: 0;
}
#content .visual.active h1 {
	opacity: 1;
}
#content .content {
	
}
#content .content .intro {
	background: url(../img/index/bg_intro.webp) no-repeat center 5vw / cover;
	color: #fff;
	position: relative;
	z-index: 100;
}
#content .content .intro .textbox {
	background: #94745e;
	padding: 1.2vw 0;
}
#content .content .intro .textbox .fbox {display: flex;justify-content: center;align-items: center;gap: 0 1vw;}
#content .content .intro .textbox .fbox .box {}
#content .content .intro .textbox .fbox .box p {font-size: 1.7vw;display: flex;letter-spacing: 0.1em;line-height: 1em;text-indent: 0.1em;position: relative;}
#content .content .intro .textbox .fbox .box p span {
	display: block;
	line-height: 1em;
}
#content .content .intro .textbox .fbox .box p span.f1 {font-size: 2.9vw;}
#content .content .intro .textbox .fbox .box p span.f2 {font-size: 1.1vw;}
#content .content .intro .textbox .fbox .box p span.f3 {font-size: 3.5vw;margin-bottom: -0.5vw;padding: 0 0.3vw;}
#content .content .intro .textbox .fbox .box p span.f4 {font-size: 2.6vw;}
#content .content .intro .textbox .fbox .box p span.f5 {font-size: 2.2vw;}
#content .content .intro .textbox .fbox .box p sup {
	font-size: 0.6vw;
	line-height: 1em;
	display: inline-block;
	position: relative;
	top: -2.8vw;
	left: -1vw;
	margin-right: -0.9vw;
	letter-spacing: 0;
}
#content .content .intro .textbox2 {
	background: no-repeat;
	border-bottom: 1px solid #fff;
}
#content .content .intro .textbox2 .fbox {
	gap: 0;
	align-items: initial;
}
#content .content .intro .textbox2 .fbox .box {
	border-left: 1px solid #fff;
	padding: 1.4vw 1.4vw;
	display: flex;
	align-items: end;
}
#content .content .intro .textbox2 .fbox .box .sub {position: absolute;left: 0;top: 0.2vw;font-size: 0.8vw;}
#content .content .intro .textbox2 .fbox .box:nth-child(1) {
	border-left: none;
}
#content .content .intro .textbox2 .fbox .box p {
  align-items: end;
}
#content .content .intro .information {
	padding: 55px 0 70px 0;
	text-align: center;
}
#content .content .intro .information h2 {
	font-size: 26px;
	color: #fff;
	font-weight: 600;
	line-height: 1.5em;
	letter-spacing: 0.2em;
	text-indent: 0.2em;
}
#content .content .intro .information > .text {
	font-size: 34px;
	letter-spacing: 0.1em;
	line-height: 1.5em;
	margin-top: 8px;
}
#content .content .intro .information .bt_more {
	display: block;
	background: #75787c;
	width: 380px;
	margin: 33px auto 0 auto;
	padding: 12px 0;
	border-radius: 100px;
	font-size: 20px;
}
#content .content .intro .information .merit {
	margin-top: 60px;
}
#content .content .intro .information .merit > .title {
	border: 1px solid #ac8870;
	border-bottom: 0;
	width: 270px;
	margin: 0 auto;
	height: 26px;
	position: relative;
}
#content .content .intro .information .merit > .title::before,
#content .content .intro .information .merit > .title::after {
	content: "";
	display: block;
	width: 170px;
	background: #ac8870;
	height: 1px;
	position: absolute;
	right: 100%;
	bottom: 0;
}
#content .content .intro .information .merit > .title::after {right: auto;left: 100%;}
#content .content .intro .information .merit > .title span {
	font-size: 22px;
	display: block;
	padding: 10px 0;
}
#content .content .intro .information .merit .text {
	font-size: 19px;
	margin-top: 24px;
	line-height: 1.8em;
}
#content .content .intro .information .merit .limitedcontent {
	width: 1100px;
	margin: 60px auto 0 auto;
	border: 2px solid #ac8870;
	position: relative;
}
#content .content .intro .information .merit .limitedcontent::before {
	content: "";
	display: block;
	width: 35px;
	height: 35px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	transform: translate(-50%, 0) scale(1, 0.6) rotate(135deg);
	top: -62px;
	position: absolute;
	left: 50%;
}
#content .content .intro .information .merit .limitedcontent .title {
	background: #ac8870;
	color: #fff;
	font-size: 20px;
	letter-spacing: 0.1em;
}
#content .content .intro .information .merit .limitedcontent .fbox {
	display: flex;
	padding: 40px 50px;
	gap: 30px;
}
#content .content .intro .information .merit .limitedcontent .fbox .img {
	position: relative;
}
#content .content .intro .information .merit .limitedcontent .fbox .img .img {
	
}
#content .content .intro .information .merit .limitedcontent .fbox .img .label {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	background: linear-gradient(135deg,  rgba(119,96,70,1) 0%,rgba(170,134,110,1) 0%,rgba(127,100,81,1) 100%);
	display: block;
	width: 190px;
	font-size: 18px;
	border-radius: 100px;
	padding: 5px 0;
}
#content .content .intro .information .merit .limitedcontent .fbox .img .caption {
	
}
#content .content .intro .information .flow {
	margin-top: 60px;
}
#content .content .intro .information .flow .title {
	font-size: 17px;
}
#content .content .intro .information .flow .fbox {
	margin-top: 30px;
	display: flex;
	justify-content: center;
}
#content .content .intro .information .flow .fbox .box {
	border-left: 1px solid #878787;
	text-align: left;
	padding: 0 60px 0 20px;
	position: relative;
}
#content .content .intro .information .flow .fbox .box::after {
	content: "";
	display: block;
	width: 34px;
	height: 34px;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	transform: scale(0.5, 1) rotate(45deg);
	right: 20px;
	bottom: 20px;
	position: absolute;
}
#content .content .intro .information .flow .fbox .box:last-child {
	padding-right: 20px;
}
#content .content .intro .information .flow .fbox .box:last-child::after {
	display: none;
}
#content .content .intro .information .flow .fbox .box .label {
	color: #b08b71;
	display: flex;
	align-items: center;
	line-height: 1em;
	font-size: 13px;
	letter-spacing: 0.1em;			.let:;
}
#content .content .intro .information .flow .fbox .box .label span {
	font-size: 38px;
	line-height: 1em;
	margin-left: 6px;
	position: relative;
	top: -2px;
}
#content .content .intro .information .flow .fbox .box .text {
	font-size: 14px;
	line-height: 1.5em;
	margin-top: 9px;
}
#content .content .intro .information .flow .fbox .box .text span {
	font-size: 18px;
	line-height: 1.5em;
	margin-bottom: 6px;
	display: inline-block;
}
#content .content .towervalue {
	background: url(../img/index/bg_towervalue.webp) repeat-x center top / 1920px auto;
	position: relative;
}
#content .content .towervalue::before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 70px;
	background: linear-gradient(to bottom, #b9aa9a 0%, #b9aa9a00 100%);
	z-index: 100;
	opacity: 0.7;
	pointer-events: none;
	mix-blend-mode: multiply;
}
#content .content .towervalue .fade {
	position: relative;top: 20px;transition: all ease 2s;opacity: 0;
}
#content .content .towervalue > .inner.active .fade {
	opacity: 1;top: 0;
}
#content .content .towervalue .lead .fade:nth-child(1) { transition-delay: 0.0s;}
#content .content .towervalue .lead .fade:nth-child(3) { transition-delay: 0.3s;}
#content .content .towervalue .img .fade{ transition-delay: 0.6s;}
#content .content .towervalue .text .fade:nth-child(1) { transition-delay: 0.9s;}
#content .content .towervalue .text .fade:nth-child(3) { transition-delay: 1.2s;}
#content .content .towervalue .text .fade:nth-child(5) { transition-delay: 1.5s;}
#content .content .towervalue .text .fade:nth-child(7) { transition-delay: 1.8s;}
#content .content .towervalue .text .fade:nth-child(9) { transition-delay: 2.1s;}
#content .content .towervalue .lead2 .fade:nth-child(1) { transition-delay: 2.4s;}
#content .content .towervalue .lead2 .fade:nth-child(3) { transition-delay: 2.7s;}
#content .content .towervalue .bt_more.fade { transition-delay: 3s;}
#content .content .towervalue h2 {
	text-align: center;
	background: #94745e;
	color: #e5dfda;
	font-size: 34px;
	letter-spacing: 0.3em;
	font-weight: 600;
	line-height: 1.5em;
	text-indent: 0.3em;
	padding: 6px 0;
	box-shadow: 0 0 30px #664e3d;
}
#content .content .towervalue > .inner {text-align: center;padding: 79px 0;}
#content .content .towervalue .lead {
	font-size: 24px;
	letter-spacing: 0.15em;
}
#content .content .towervalue .img {
	width: 510px;
	margin: 57px auto 0 auto;
}
#content .content .towervalue .text {
	font-size: 17px;
	margin-top: 50px;
}
#content .content .towervalue .lead2 {
	margin-top: 40px;
}
#content .content .towervalue .bt_more {
	display: block;
	background: #94745e;
	width: 530px;
	height: 88px;
	margin: 33px auto 0 auto;
	border-radius: 100px;
	font-size: 20px;
	color: #fff;
	display: flex;
	box-sizing: border-box;
	flex-direction: column;
	align-items: start;
	justify-content: center;
	line-height: 1em;
	padding: 0 40px;
	font-size: 16px;
	letter-spacing: 0.1em;
	box-shadow: 5px 5px 5px #00000030;
	position: relative;
}
#content .content .towervalue .bt_more.activeend {
	transition: 0.6s ease all;
}
.pc_view #content .content .towervalue .bt_more.activeend:hover {
	opacity: 0.75;
}
#content .content .towervalue .bt_more::before {
	content: "";
	display: block;
	width: 46px;
	height: 46px;
	border: 1px solid #fff;
	border-radius: 100px;
	position: absolute;
	right: 21px;
	top: 50%;
	transform: translate(0, -50%);
}
#content .content .towervalue .bt_more::after {
	content: "";
	display: block;
	position: absolute;
	right: 51px;
	top: 48px;
	width: 130px;
	height: 7px;
	border-bottom: 1px solid #fff;
	border-right: 1px solid #fff;
	transform: skew(45deg, 0deg);
	
  transition: 0.6s ease all;
}
.pc_view #content .content .towervalue .bt_more:hover::after {
	right: 42px;
}
#content .content .towervalue .bt_more span {line-height: 1em;letter-spacing: 0.3em;font-size: 23px;font-weight: 600;display: block;margin-bottom: 6px;}
#content .content .scrollarea {
	height: 450vh;
	height: 450dvh;
	background: #1a1816;
}
#content .content .scrollarea section {
	height: 100vh;
	height: 100dvh;
	position: sticky;
	top: 0;
	margin-bottom: 50vh;
	margin-bottom: 50dvh;
}
#content .content .scrollarea .position {
	opacity: 0;
	transition: 2.5s ease opacity;
}
#content .content .scrollarea .position.active {
	opacity: 1;
}
#content .content .scrollarea section::before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 70px;
	background: linear-gradient(to bottom,  rgba(0,0,0,1) 0%,rgba(0,0,0,0.99) 1%,rgba(0,0,0,0) 100%);
	z-index: 100;
	opacity: 0.2;
	pointer-events: none;
}
#content .content .scrollarea section:last-child {margin-bottom: 0;}
#content .content .scrollarea section > .inner {
	height: 100%;
	display: flex;
	height: 100%;
}
#content .content .scrollarea section h2 {
	position: absolute;
	line-height: 1em;
	z-index: 100;
	transform: rotate(90deg);
	transform-origin: 0 100%;
	font-size: 80px;
	font-weight: 600;
	color: #ffff;
	letter-spacing: 0.1em;
	top: 40px;
	left: 20px;
	letter-spacing: 0.25em;
	text-shadow: 4px 0 5px #0000005e;
}
#content .content .scrollarea section .img {
	width: calc(100% - 460px);
}
#content .content .scrollarea section .img img {
	height: 100%;
	width: 100%;
	object-fit: cover;
	object-position: center bottom;
}
#content .content .scrollarea section .info {width: 460px;background: #fff;position: relative;}
#content .content .scrollarea section .info .scroll {position: absolute;left: 34px;bottom: 58px;transform: rotate(90deg);}
#content .content .scrollarea section .info .scroll::after {
	content: "";
	display: block;
	width: 100px;
	height: 1px;
	background: #fff;
	position: absolute;
	left: 0;
	bottom: -7px;
	animation: a_scroll 2s ease infinite;
}
#content .content .scrollarea section .info .scroll span {color: #fff;font-size: 14px;display: block;font-weight: 500;letter-spacing: 0.1em;padding-left: 0;}
#content .content .scrollarea section.plan .info .scroll span {color: #4d2e1e; }
#content .content .scrollarea section.plan .info .scroll::after {background: #4d2e1e; }
 
@keyframes a_scroll {
  0% {
    width: 0;
	left: 0%;
  }
  50% {
    width: 100px;
	left: 0%;
  }
  51% {
    width: 100px;
	left: 0px;
  }
  99% {
    width: 0px;
	left: 100px;
  }
  100% {
    width: 0px;
	left: 100px;
  }
}
 
#content .content .scrollarea section .info a {background: #94745e;background: linear-gradient(135deg,  rgba(119,96,70,1) 0%,rgba(119,96,70,1) 0%,rgba(160,127,103,1) 100%);color: #fff;box-sizing: border-box;padding: 140px 0 0 50px;display: block;height: 100%;position: relative;}
#content .content .scrollarea section .info a .text {font-size: 30px;letter-spacing: 0.2em;line-height: 2.2em;}
#content .content .scrollarea section .info a .label {
	position: absolute;
	right: 40px;
	bottom: 20px;
	z-index: 100;
	font-size: 15px;
	letter-spacing: 0.2em;
}
#content .content .scrollarea section .info a .label::before {
	content: "";
	display: block;
	width: 32px;
	height: 32px;
	border-top: 1px solid #fff;
	border-right: 1px solid #fff;
	right: 3px;
	top: -43px;
	position: absolute;
}
#content .content .scrollarea section .info a .label::after {
	content: "";
	display: block;
	width: 46px;
	height: 1px;
	right: -3px;
	top: -26px;
	position: absolute;
	transform: rotate(-45deg);
	background: #fff;
}
#content .content .scrollarea section.position h2 {}
#content .content .scrollarea section.residence h2 {/* color: #e5dfda; */}
#content .content .scrollarea section.residence .info a {background: #7f9980;background: linear-gradient(135deg,  rgba(119,96,70,1) 0%,rgba(73,106,83,1) 0%,rgba(113,141,117,1) 100%);}
#content .content .scrollarea section.residence .img img {
	object-position: center top;
}
#content .content .scrollarea section.plan .info a {background: #e5dfda;background: linear-gradient(135deg,  rgba(119,96,70,1) 0%,rgba(227,225,216,1) 0%,rgba(243,240,230,1) 100%);color: #4d2e1e;}
#content .content .scrollarea section.plan .info a .label::before {border-color: #4d2e1e;}
#content .content .scrollarea section.plan .info a .label::after {background: #94745e;}

@media screen and (max-width: 768px) {

	#content .visual {
		position: relative;
		background: #1a1816;
	}
	#content .visual.end .video {
		opacity: 1;
	}
	#content .visual.end_sp .video {
		opacity: 0;
	}
	#content .visual .img {}
	#content .visual .img::after {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 36px;
	background: linear-gradient(to top, rgb(129 103 85) 0%, rgba(0, 0, 0, 0) 100%);
	z-index: 50;
	opacity: 1;
	pointer-events: none;
	mix-blend-mode: multiply;
}
	#content .visual.active .img {
		opacity: 1;
	}
	#content .visual h1 {
		position: absolute;
		left: 50%;
		top: 27.5%;
		transform: translate(-50%, -50%);
		width: 68%;
		opacity: 0;
	}
	#content .visual.active h1 {
		opacity: 1;
	}
	#content .content {

	}
	#content .content .intro {
		background: url(../img/index/bg_intro_sp.webp) no-repeat center 19vw / cover;
		color: #fff;
		position: relative;
		z-index: 100;
	}
	#content .content .intro .textbox {
		background: #94745e;
		padding: 3.1vw 0 2.8vw 0;
	}
	#content .content .intro .textbox .fbox {display: flex;justify-content: center;align-items: center;gap: 1.6vw;flex-direction: column;}
	#content .content .intro .textbox .fbox .box {}
	#content .content .intro .textbox .fbox .box p {font-size: 3.5vw;display: flex;letter-spacing: 0.1em;line-height: 1em;text-indent: 0.1em;}
	#content .content .intro .textbox .fbox .box p span {
		display: block;
		line-height: 1em;
	}
	#content .content .intro .textbox .fbox .box p span.f1 {font-size: 6.2vw;}
	#content .content .intro .textbox .fbox .box p span.f2 {font-size: 4.1vw;position: relative;top: -0.4vw;}
	#content .content .intro .textbox .fbox .box p span.f3 {font-size: 10.5vw;margin-bottom: -1.1vw;padding: 0 0.3vw;}
	#content .content .intro .textbox .fbox .box p span.f4 {font-size: 8.6vw;}
	#content .content .intro .textbox .fbox .box p span.f5 {font-size: 4.8vw;margin-bottom:3px; }
	#content .content .intro .textbox .fbox .box p sup {
		font-size: 1.6vw;
		line-height: 1em;
		display: inline-block;
		position: relative;
		top: -5vw;
		left: -0.9vw;
		margin-right: -2vw;
		letter-spacing: 0;
	}
	#content .content .intro .textbox2 {
		background: no-repeat;
		border-bottom: none;
		padding: 10px 10vw 0 10vw;
	}
	#content .content .intro .textbox2 .fbox {
		gap: 0;
		align-items: initial;
	}
	#content .content .intro .textbox2 .fbox .box {
		border-left: magenta;
		border-bottom: 1px solid #ffffff2e;
		padding: 3vw 0 2vw 0;
		display: flex;
		align-items: end;
		justify-content: center;
	}
	#content .content .intro .textbox2 .fbox .box:nth-child(1) {
		border-left: none;
	}
	#content .content .intro .textbox2 .fbox .box p {
	  align-items: end;
	  font-size: 6vw;
	  min-height: 9.3vw;
	}
	#content .content .intro .textbox2 .fbox .box .sub {position: absolute;left: 0;top: -0.2vw;font-size: 2.6vw;}

	#content .content .intro .information {
		padding: 55px 0 50px 0;
		text-align: center;
	}
	#content .content .intro .information h2 {
		font-size: 18px;
		color: #fff;
		font-weight: 600;
		line-height: 1.5em;
		letter-spacing: 0.2em;
		text-indent: 0.2em;
	}
	#content .content .intro .information > .text {
		font-size: 22px;
		letter-spacing: 0.1em;
		line-height: 1.5em;
		margin-top: 5px;
	}
	#content .content .intro .information .bt_more {
		display: block;
		background: #75787c;
		width: 260px;
		margin: 22px auto 0 auto;
		padding: 9px 0;
		border-radius: 100px;
		font-size: 15px;
	}
	#content .content .intro .information .merit {
		margin-top: 45px;
	}
	#content .content .intro .information .merit > .title {
		border: 1px solid #ac8870;
		border-bottom: 0;
		width: 190px;
		margin: 0 auto;
		height: 18px;
		position: relative;
	}
	#content .content .intro .information .merit > .title::before,
	#content .content .intro .information .merit > .title::after {
		content: "";
		display: block;
		width: 61px;
		background: #ac8870;
		height: 1px;
		position: absolute;
		right: 100%;
		bottom: 0;
	}
	#content .content .intro .information .merit > .title::after {right: auto;left: 100%;}
	#content .content .intro .information .merit > .title span {
		font-size: 16px;
		display: block;
		padding: 7px 0;
	}
	#content .content .intro .information .merit .text {
		font-size: 14px;
		margin-top: 24px;
	}
	#content .content .intro .information .merit .limitedcontent {
		width: 280px;
		margin: 46px auto 0 auto;
		border: 2px solid #ac8870;
		position: relative;
	}
	#content .content .intro .information .merit .limitedcontent::before {
		content: "";
		display: block;
		width: 32px;
		height: 32px;
		border-top: 1px solid #fff;
		border-right: 1px solid #fff;
		transform: translate(-50%, 0) scale(1, 0.6) rotate(135deg);
		top: -49px;
		position: absolute;
		left: 50%;
	}
	#content .content .intro .information .merit .limitedcontent .title {
		background: #ac8870;
		color: #fff;
		font-size: 14px;
	}
	#content .content .intro .information .merit .limitedcontent .fbox {
		display: flex;
		padding: 25px 25px;
		gap: 25px;
		flex-direction: column;
	}
	#content .content .intro .information .merit .limitedcontent .fbox .img {
		position: relative;
	}
	#content .content .intro .information .merit .limitedcontent .fbox .img .img {
		
	}
	#content .content .intro .information .merit .limitedcontent .fbox .img .label {
		position: absolute;
		left: 50%;
		top: 50%;
		transform: translate(-50%, -50%);
		background: linear-gradient(135deg,  rgba(119,96,70,1) 0%,rgba(170,134,110,1) 0%,rgba(127,100,81,1) 100%);
		display: block;
		width: 150px;
		font-size: 14px;
		border-radius: 100px;
		padding: 4px 0;
	}
	#content .content .intro .information .merit .limitedcontent .fbox .img .caption {
		
	}
	#content .content .intro .information .flow {
		margin-top: 30px;
	}
	#content .content .intro .information .flow .title {
		font-size: 14px;
		line-height: 1.5em;
	}
	#content .content .intro .information .flow .fbox {
		margin-top: 30px;
		display: flex;
		justify-content: center;
		flex-direction: column;
		gap: 40px 0;
		width: 80%;
		margin: 15px auto 0 auto;
		border-top: 1px solid #ffffff2e;
		padding: 20px 0 0 0;
	}
	#content .content .intro .information .flow .fbox .box {
		border-left: none;
		text-align: left;
		padding: 0 0 0 10px;
		position: relative;
		display: flex;
		justify-content: space-between;
		align-items: start;
	}
	#content .content .intro .information .flow .fbox .box::after {
		content: "";
		display: block;
		width: 24px;
		height: 24px;
		border-top: 2px solid #fff;
		border-right: 2px solid #fff;
		transform: scale(1, 0.5) rotate(135deg);
		right: auto;
		left: 145px;
		bottom: -30px;
		position: absolute;
	}
	#content .content .intro .information .flow .fbox .box:last-child {
		padding-right: 20px;
	}
	#content .content .intro .information .flow .fbox .box:last-child::after {
		display: none;
	}
	#content .content .intro .information .flow .fbox .box .label {
		color: #b08b71;
		display: flex;
		align-items: center;
		line-height: 1em;
		font-size: 11px;
		letter-spacing: 0.1em;			.let:;
		width: 90px;
		align-items: center;
	}
	#content .content .intro .information .flow .fbox .box .label span {
		font-size: 32px;
		line-height: 1em;
		margin-left: 6px;
		position: relative;
		top: -2px;
	}
	#content .content .intro .information .flow .fbox .box .text {
		font-size: 10px;
		line-height: 1.5em;
		margin-top: 0;
		width: calc(100% - 90px);
		border-left: 1px solid #b08b71;
		box-sizing: border-box;
		padding-left: 20px;
	}
	#content .content .intro .information .flow .fbox .box .text span {
		font-size: 15px;
		line-height: 1.5em;
		margin-bottom: 6px;
		display: inline-block;
	}
	#content .content .towervalue {
		background: url(../img/index/bg_towervalue.webp) repeat-x center top / 1100px auto;
	}
	#content .content .towervalue::before {
	height: 40px;
	}
	#content .content .towervalue h2 {
		text-align: center;
		background: #94745e;
		color: #e5dfda;
		font-size: 21px;
		letter-spacing: 0.3em;
		font-weight: 600;
		line-height: 1.5em;
		text-indent: 0.3em;
		padding: 6px 0;
		box-shadow: 0 0 20px #664e3d;
	}
	#content .content .towervalue > .inner {text-align: center;padding: 40px 0;}
	#content .content .towervalue .lead {
		font-size: 15px;
		letter-spacing: 0.05em;
	}
	#content .content .towervalue .img {
		width: 260px;
		margin: 50px auto 0 auto;
	}
	#content .content .towervalue .text {
		font-size: 11px;
		margin-top: 40px;
	}
	#content .content .towervalue .lead2 {
		margin-top: 30px;
	}
	#content .content .towervalue .bt_more {
		display: block;
		background: #94745e;
		width: 320px;
		height: 54px;
		margin: 33px auto 0 auto;
		border-radius: 100px;
		font-size: 20px;
		color: #fff;
		display: flex;
		box-sizing: border-box;
		flex-direction: column;
		align-items: start;
		justify-content: center;
		line-height: 1em;
		padding: 0px 26px;
		font-size: 11px;
		letter-spacing: 0.1em;
		box-shadow: 5px 5px 5px #00000030;
		position: relative;
	}
	#content .content .towervalue .bt_more::before {
		content: "";
		display: block;
		width: 28px;
		height: 28px;
		border: 1px solid #fff;
		border-radius: 100px;
		position: absolute;
		right: 12px;
		top: 50%;
		transform: translate(0, -50%);
	}
	#content .content .towervalue .bt_more::after {
		content: "";
		display: block;
		position: absolute;
		right: 30px;
		top: 27px;
		width: 74px;
		height: 4px;
		border-bottom: 1px solid #fff;
		border-right: 1px solid #fff;
		transform: skew(45deg, 0deg);
	}
	#content .content .towervalue .bt_more span {line-height: 1em;letter-spacing: 0.3em;font-size: 15px;font-weight: 600;display: block;margin-bottom: 3px;}
	#content .content .scrollarea {
		height: calc(450vh - 76px - 75px - 76px - 75px - 76px - 75px - 76px - 75px - 76px - 75px - 76px - 75px);
		background: #1a1816;
	}
	#content .content .scrollarea section {
		height: calc(100vh - 76px - 75px);
		height: calc(100dvh - 76px - 75px);
		position: sticky;
		top: 76px;
		margin-bottom: calc(50vh - 76px - 75px);
		margin-bottom: calc(50dvh - 76px - 75px);
	}
	#content .content .scrollarea .position {
		opacity: 0;
		/* transition: 1s ease opacity; */
	}
	#content .content .scrollarea .position.active {
		opacity: 1;
	}
	#content .content .scrollarea section::before {
		content: "";
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 70px;
		background: linear-gradient(to bottom,  rgba(0,0,0,1) 0%,rgba(0,0,0,0.99) 1%,rgba(0,0,0,0) 100%);
		z-index: 100;
		opacity: 0.2;
		pointer-events: none;
	}
	#content .content .scrollarea section:last-child {margin-bottom: 0;}
	#content .content .scrollarea section > .inner {
		height: 100%;
		display: flex;
		height: 100%;
		flex-direction: column;
	}
	#content .content .scrollarea section h2 {
		position: absolute;
		line-height: 1em;
		z-index: 100;
		transform: rotate(90deg);
		transform-origin: 0 100%;
		font-size: 48px;
		font-weight: 600;
		color: #ffff;
		letter-spacing: 0.1em;
		top: -29px;
		left: 10px;
		letter-spacing: 0.15em;
	}
	#content .content .scrollarea section .img {
		width: 100%;
		height: calc(100% - 190px);
	}
	#content .content .scrollarea section .img img {
		height: 100%;
		width: 100%;
		object-fit: cover;
		object-position: center bottom;
	}
	#content .content .scrollarea section .info {width: 100%;height: 190px;background: #fff;}
	#content .content .scrollarea section .info .scroll {position: absolute;left: auto;top: 25px;transform: rotate(90deg);bottom: auto;right: 5px;}
	#content .content .scrollarea section .info .scroll::after {
		content: "";
		display: block;
		width: 100px;
		height: 1px;
		background: #fff;
		position: absolute;
		left: 0;
		bottom: auto;
		top: -7px;
		animation: a_scroll_sp 2s ease infinite;
	}
	#content .content .scrollarea section .info .scroll span {color: #fff;font-size: 11px;display: block;font-weight: 500;letter-spacing: 0.1em;padding-left: 15px;}
	 
	@keyframes a_scroll_sp {
	  0% {
	    width: 0;
		left: 0%;
	  }
	  50% {
	    width: 60px;
		left: 0%;
	  }
	  51% {
	    width: 60px;
		left: 0px;
	  }
	  99% {
	    width: 0px;
		left: 60px;
	  }
	  100% {
	    width: 0px;
		left: 60px;
	  }
	}
	#content .content .scrollarea section .info a {/* background: #94745e; */color: #fff;box-sizing: border-box;padding: 20px 0 0 20px;display: block;height: 100%;position: relative;}
	#content .content .scrollarea section .info a .text {font-size: 21px;letter-spacing: 0.2em;line-height: 2em;}
	#content .content .scrollarea section .info a .label {
		position: absolute;
		right: 20px;
		bottom: 8px;
		z-index: 100;
		font-size: 13px;
		letter-spacing: 0.2em;
	}
	#content .content .scrollarea section .info a .label::before {
		content: "";
		display: block;
		width: 32px;
		height: 32px;
		border-top: 1px solid #fff;
		border-right: 1px solid #fff;
		right: 3px;
		top: -43px;
		position: absolute;
	}
	#content .content .scrollarea section .info a .label::after {
		content: "";
		display: block;
		width: 46px;
		height: 1px;
		right: -3px;
		top: -26px;
		position: absolute;
		transform: rotate(-45deg);
		background: #fff;
	}
	#content .content .scrollarea section.position h2 {/* text-shadow: 4px 0 5px #0000005e; */}
	#content .content .scrollarea section.residence h2 {/* color: #e5dfda; */}
	#content .content .scrollarea section.residence .info a {/* background: #7f9980; */}
	#content .content .scrollarea section.plan .info a {/* background: #e5dfda; *//* color: #94745e; */}
	#content .content .scrollarea section.plan .info a .label::before {/* border-color: #94745e; */}
	#content .content .scrollarea section.plan .info a .label::after {background: #94745e;}
}