@charset "UTF-8";

/* common parts
============================================================================= */
:root {
	--scrollbar-w:0;
	--pc-min-size:1024;

  /* Timing Function */
  --ttf-linear:cubic-bezier(0.250, 0.250, 0.750, 0.750);
  --ttf-default:cubic-bezier(0.250, 0.100, 0.250, 1.000);

  --ttf-ei:cubic-bezier(0.420, 0.000, 1.000, 1.000);
  --ttf-eo:cubic-bezier(0.000, 0.000, 0.580, 1.000);
  --ttf-eio:cubic-bezier(0.420, 0.000, 0.580, 1.000);

  --ttf-ei-quad:cubic-bezier(0.550, 0.085, 0.680, 0.530);
  --ttf-eo-quad:cubic-bezier(0.250, 0.460, 0.450, 0.940);
  --ttf-eio-quad:cubic-bezier(0.455, 0.030, 0.515, 0.955);

  --ttf-ei-cubic:cubic-bezier(0.550, 0.055, 0.675, 0.190);
  --ttf-eo-cubic:cubic-bezier(0.215, 0.610, 0.355, 1.000);
  --ttf-eio-cubic:cubic-bezier(0.645, 0.045, 0.355, 1.000);

  --ttf-ei-quart:cubic-bezier(0.895, 0.030, 0.685, 0.220);
  --ttf-eo-quart:cubic-bezier(0.165, 0.840, 0.440, 1.000);
  --ttf-eio-quart:cubic-bezier(0.770, 0.000, 0.175, 1.000);

  --ttf-ei-quint:cubic-bezier(0.755, 0.050, 0.855, 0.060);
  --ttf-eo-quint:cubic-bezier(0.230, 1.000, 0.320, 1.000);
  --ttf-eio-quint:cubic-bezier(0.860, 0.000, 0.070, 1.000);

  --ttf-ei-sine:cubic-bezier(0.470, 0.000, 0.745, 0.715);
  --ttf-eo-sine:cubic-bezier(0.390, 0.575, 0.565, 1.000);
  --ttf-eio-sine:cubic-bezier(0.445, 0.050, 0.550, 0.950);

  --ttf-ei-expo:cubic-bezier(0.950, 0.050, 0.795, 0.035);
  --ttf-eo-expo:cubic-bezier(0.190, 1.000, 0.220, 1.000);
  --ttf-eio-expo:cubic-bezier(1.000, 0.000, 0.000, 1.000);

  --ttf-ei-circ:cubic-bezier(0.600, 0.040, 0.980, 0.335);
  --ttf-eo-circ:cubic-bezier(0.075, 0.820, 0.165, 1.000);
  --ttf-eio-circ:cubic-bezier(0.785, 0.135, 0.150, 0.860);

  --ttf-ei-back:cubic-bezier(0.600, -0.280, 0.735, 0.045);
  --ttf-eo-back:cubic-bezier(0.175, 0.885, 0.320, 1.275);
  --ttf-eio-back:cubic-bezier(0.680, -0.550, 0.265, 1.550);
}
body {
	padding-top:0 !important;
	overflow:visible;
}
.mod_main {
	overflow: visible;
}
:where(.page_container *) {
	box-sizing: border-box;
}
:where(.page_container img) {
	display:block;
	max-width:100%;
	height:auto;
}

.top-l-heading {
	display:flex;
	flex-direction: column-reverse;
	gap:.12rem;
	line-height:1;
}
.top-l-heading .ja {
	font-size:.20rem;
	font-weight:700;
	letter-spacing: .05em;
}
.top-l-heading .ff-bv_p {
	font-size:.60rem;
	letter-spacing: .05em;
	line-height:1.1;
}
@media (min-width: 768px) {
}
@media (max-width: 767px) {
	.top-l-heading {
		gap:.08rem;
	}
	.top-l-heading .ja {
		font-size:.14rem;
		letter-spacing: 0;
	}
	.top-l-heading .ff-bv_p {
		font-size:.45rem;
		letter-spacing: 0;
	}
}

body:is(.is-kv_fixed) main {
}


.main_visual {
	z-index: 10;
	position:relative;
}
.main_visual > .inner {
	display:flex;
	justify-content: center;
	align-items: flex-end;
	width:100%;
	height:100svh;
	transition-property: opacity;
	transition-duration: 1s;
	color:#fff;
}
body:not(.is-kv_fixed) .main_visual > .inner {
	opacity:0;
	pointer-events:none;
}
.main_visual .copy_1 {
	width:fit-content;
	font-size:.36rem;
	font-weight:700;
	font-feature-settings: "palt" 0;
	letter-spacing: .15em;
	line-height:2;
	writing-mode: vertical-rl;
	position:absolute;
	top:2.00rem;
}
.main_visual .copy_1:not(.is-active) {
}
.main_visual .copy_1_inner > span {
	display:inline-block;
	transition-property:opacity,transform;
	transition-duration:1s;
	transition-timing-function: var(--ttf-eo-quart);
}
.main_visual .copy_1_inner > span:not(.is-active) {
	opacity:0;
	transform:translateY(-.32rem);
}
.main_visual .bottom {
	width:min(13.08rem,100%);
	padding-bottom:.40rem;
}
.main_visual .bottom img {
	display:block;
	width:100%;
	height:auto;
}
.main_visual .bottom .logo {
	margin-bottom:.24rem;
	width:1.68rem;
	filter:invert(1);
	transition-property: transform,clip-path;
	transition-duration: 1.5s;
	transition-delay:.5s;
	transition-timing-function: var(--ttf-eo-quint);
	clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%);
}
.main_visual .bottom:not(.is-active) .logo {
	transform:translateY(.40rem);
	clip-path:polygon(0 0, 100% 0, 100% 0, 0 0);
}
.main_visual .bottom .en img {
	transition-property: transform,clip-path;
	transition-duration: 1.5s;
	transition-delay:.5s;
	transition-timing-function: var(--ttf-eo-quint);
	clip-path:polygon(0 0, 100% 0, 100% 100%, 0 100%);
}
.main_visual .bottom:not(.is-active) .en img {
	transform:translateY(.40rem);
	clip-path:polygon(0 0, 100% 0, 100% 0, 0 0);
}
.main_visual .bottom .en {
	margin-bottom:.30rem;
	padding-bottom:1px;
	width:100%;
	position:relative;

	&::after {
		content:"";
		width:100%;
		border-bottom:1px solid;
		position:absolute;
		left:0;
		bottom:0;
		transition-property: transform;
		transition-duration: 1s;
		transition-timing-function: var(--ttf-eo-quart);
		transform-origin:0% 50%;
	}
}
.main_visual .bottom:not(.is-active) .en::after {
	transform:scaleX(0);
}
.main_visual .copy_2 {
	font-size:.20rem;
	font-weight:700;
	letter-spacing: .1em;
	transition-property: opacity;
	transition-duration: 1s;
	transition-delay:1.5s;
	transition-timing-function: var(--ttf-eo-quint);
}
.main_visual .bottom:not(.is-active) .copy_2 {
	opacity:0;
}
.main_visual .scroll {
	margin-bottom:-.40rem;
	border-left:1px solid;
	padding-left:.20rem;
	padding-bottom:.40rem;
	font-size:.14rem;
	letter-spacing: .05em;
	transition-property: opacity;
	transition-duration: 1s;
	transition-delay:1.75s;
	transition-timing-function: var(--ttf-eo-quint);
}
.main_visual .bottom:not(.is-active) .scroll {
	opacity:0;
}
.main_visual .kv {
	width:100%;
	height:100%;
	pointer-events:none;
	position:absolute;
	top:0;
	left:0;
	z-index: -1;
	background-color:#fff;
	pointer-events: none;
}
.main_visual .kv_inner {
	width:100%;
	height:100svh;
	position:sticky;
	top:0;
}
.main_visual .kv_inner::after {
	content:"";
	margin:auto;
	background-image:linear-gradient(
		to bottom,
		hsl(from #C8C8C8 h s l) 10%,
		hsl(from #fff h s l) 40%,
		hsl(from #fff h s l) 71%,
		hsl(from #C8C8C8 h s l) 90%
	);
	mix-blend-mode: multiply;
	position:absolute;
	inset:0;
	transition-property:opacity;
	transition-duration:1s;
	opacity:1;
}
.main_visual .kv_inner::before {
	content:"";
	margin:auto;
	background-color:#C8C8C8;
	mix-blend-mode: multiply;
	position:absolute;
	inset:0;
	transition-property:opacity;
	transition-duration:1s;
	opacity:0;
}
.main_visual .kv_inner :is(.splide__track,.splide__list,.splide__slide) {
	height:100%;
}
.main_visual .kv .splide__slide {
	will-change:opacity;
}
.main_visual .kv img {
	width:100%;
	height:100%;
	object-fit: cover;
}
@media (min-width: 768px) {
	.main_visual {
		width:100%;
	}
	.main_visual .bottom {
		display:grid;
		grid-template-columns:auto 1fr auto;
		grid-auto-flow: column;
	}
	.main_visual .bottom :is(.logo,.en) {
		grid-column:1/-1;
	}
	.main_visual .bottom :is(.copy_2) {
		grid-column:3/4;
	}
	.main_visual > .inner {
		z-index: -1;
		position:sticky;
		top:0;
		/* clip-path:polygon(0 0, calc((1 - var(--tftl)) * 100%) 0, calc((1 - var(--tftl)) * 100%) 100%, 0 100%); */
	}
	.main_visual .kv {
		z-index: -2;
	}
	.main_visual .kv_inner {
		height:100svh;
		width:calc(100% * (1 - var(--tftl)));
		min-width:5.34rem;
		will-change: width;
		filter:brightness(calc((1 - var(--tftl)) * .3 + .7));
	}
	
	body:not(.is-kv_fixed) .main_visual .kv_inner {
		width:calc(50vw - 2.65rem);
	}
}
@media (max-width: 767px) {
	.main_visual {
		position:relative;
		z-index: 10;
		transition-property: height;
		transition-duration: 1s;
	}
	body:not(.is-kv_fixed) .main_visual {
		height:2.40rem;
	}
	.main_visual > .inner {
		display:flex;
		justify-content: center;
		align-items: flex-end;
		width:100%;
		position:relative;
		z-index: 101;
	}
	.main_visual .copy_1 {
		width:fit-content;
		font-size:.24rem;
		top:1.20rem;
	}
	.main_visual .bottom {
		padding-inline:.30rem;
		padding-bottom:.30rem;
	}
	.main_visual .bottom .logo {
		margin-bottom:.20rem;
		width:.90rem;
	}
	.main_visual .bottom .en {
		margin-bottom:.16rem;
	}
	.main_visual .copy_2 {
		font-size:.15rem;
		line-height:2;
		letter-spacing: .05em;
	}
	.main_visual .kv {
		width:100%;
		height:100%;
		pointer-events:none;
		position:absolute;
		top:0;
		left:0;
		z-index: 100;
		background-color:transparent;
	}
	.main_visual .kv_inner {
		height:calc(100svh * (1 - var(--tftl)));
		min-height:1.80rem;
		filter:brightness(calc((1 - var(--tftl)) * .3 + .7));
		will-chenge:height,filter;
		backface-visibility: hidden;
	}
	.main_visual .kv_inner::before {
		content:"";
		margin:auto;
		background-color:#C8C8C8;
		mix-blend-mode: multiply;
		position:absolute;
		inset:0;
		transition-property:opacity;
		transition-duration:1s;
		opacity:0;
		will-chenge:height;
	}
	.main_visual .kv img {
		width:100%;
		height:100%;
		object-fit: cover;
		will-chenge:height;
	}
	.main_visual.is-intro_fix .kv_inner {
		height:2.40rem;
	}

	.main_visual .blank {
		height:75svh;
		pointer-events: none;
	}
}

.main_visual .blank {
	height:100svh;
	pointer-events: none;
}
@media (max-width: 767px) {
	.main_visual .blank {
		height:50svh;
	}
}

.top-intro {

}
.top-intro .header {
	color:#fff;
	position:relative;
}
.top-intro .header_inner {
	z-index:20;
}
.top-intro .header_inner img {
	z-index:-1;
	width:100%;
	height:100%;
	object-fit: cover;
	position:absolute;
	top:0;
	left:0;
}
.top-intro .top-l-heading {
	z-index: 20;
}
body:not(.is-kv_fixed) .top-intro-pickup .header {
	opacity:1;
}
@media (min-width: 768px) {
	.top-intro {
		display:grid;
		grid-template-columns: 5.34rem 1fr;
		height:100svh;
	}
	.top-intro .header {
		z-index: 11;
	}
	.top-intro .header_inner {
		padding-left:1.00rem;
	}
	.top-intro .header_inner {
		display:flex;
		align-items: center;
		height:100svh;
		position:sticky;
		top:0;
		transition-property:opacity;
		transition-duration:1s;
		will-change: opacity;
		opacity:1;
	}
	.top-intro-pickup .header {
		/* margin-bottom:-100svh; */
	}
	.top-intro-pickup .header {
	}
	.top_js-intro-news .header {
		margin-top:-100svh;
		height:200svh;
	}
	.top_js-intro-news:not(.is-active) .header_inner {
		opacity:0;
	}
	.top-intro .contents {
		display:flex;
		flex-direction: column;
		justify-content: center;
		margin-inline:auto;
		width:8.00rem;
		height:100%;
		overflow:hidden;
	}
}
@media (max-width: 767px) {
	.top-intro-pickup {
		margin-top:-1.80rem;
	}
	.top-intro .header {
		height:1.80rem;
		position:sticky;
		top:0;
		z-index:100;
	}
	.top-intro .header_inner {
	}
	.top-intro .header_inner {
		display:flex;
		align-items: center;
		padding-left:.35rem;
		height:100%;
	}
}


.top_js-pickup-carousel {
	width:100%;
	transition-property: opacity;
	transition-duration: .5s;
	/* opacity:0; */
	position:relative;
}
.main_visual.is-intro_fix ~ .top-intro-pickup .top_js-pickup-carousel {
	opacity:1;
}
.top_js-pickup-carousel .splide__slide {

}
.top_js-pickup-carousel .splide__arrows {
	display:flex;
	gap:.20rem;
	position:absolute;
}
.top_js-pickup-carousel .splide__arrow {
  display:flex;
  justify-content: center;
  align-items: center;
	border-radius:50%;
	border:1px solid var(--cc-green-A);
  width:.46rem;
  height:auto;
  aspect-ratio: 1/1;
}
.top_js-pickup-carousel .splide__arrow svg {
	width:100%;
	height:auto;
	fill:var(--cc-green-A);
}
.top_js-pickup-carousel .splide__arrow svg path {
}
.top_js-pickup-carousel.is-initialized:not(.is-active) .splide__list {
  display:flex;
}
@media (hover) {
  .top_js-pickup-carousel .splide__arrow:hover {
    background-color:var(--cc-orange-B-hex);
  }
}
.top_js-pickup-carousel .splide__arrow.is-prev svg {
  transform:scaleX(-1);
}
.top_js-pickup-carousel .splide__slide > a {
  display:block;
  gap:1.6rem;
	transition-property:opacity;
	transition-duration:.5s;
}
@media (hover) {
	.top_js-pickup-carousel .splide__slide > a:hover {
		opacity:.7;
	}
	.top_js-pickup-carousel .splide__slide > a:hover img {
		transform:scale(1.05);
	}
}
.top_js-pickup-carousel .label {
	display:flex;
	align-items: center;
	gap:.10rem;
	margin-bottom:.16rem;
	font-size:.20rem;
	letter-spacing: 0;
}
.top_js-pickup-carousel .label::before {
	content:"";
	margin-top:-.1em;
	width:.16rem;
	border-bottom:1px solid var(--cc-green-A);
}
.top_js-pickup-carousel .splide__slide .ph {
	margin-bottom:.30rem;
	overflow:hidden;
}
.top_js-pickup-carousel .splide__slide .ph img {
	width:100%;
	aspect-ratio: 1/1;
	object-fit: cover;
	transition-property:transform;
	transition-duration:.5s;
}
.top_js-pickup-carousel .type_date {
	display:flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom:.20rem;
}
.top_js-pickup-carousel .type_date .type {
	font-size:.16rem;
	font-weight:700;
}
.top_js-pickup-carousel .type_date .date {
	font-size:.12rem;
}
.top_js-pickup-carousel .desc {
	font-size:.14rem;
	line-height:calc(26/14);
}
@media (min-width: 768px) {
	.top_js-pickup-carousel .splide__arrows {
		position:absolute;
		top:calc(100% + .60rem);
		right:0;
	}
	.top_js-pickup-carousel.is-initialized:not(.is-active) .splide__list {
		gap:.40rem;
	}
	.top_js-pickup-carousel.is-initialized:not(.is-active) .splide__list .splide__slide {
		width:calc(100% / 3 - .40rem * 2 / 3);
	}
}
@media (max-width: 767px) {
	.top-intro-pickup .contents {
		padding-block:1.00rem 1.70rem;
		overflow:hidden;
	}
	.top_js-pickup-carousel {
		display:flex;
		flex-direction: column-reverse;
		box-sizing: content-box;
		gap:.35rem;
		padding-left:.40rem;
		width:2.40rem;
	}
	.main_visual.is-intro_fix ~ .top-intro-pickup .top_js-pickup-carousel {
		opacity:1;
	}
	.top_js-pickup-carousel .splide__track {
		overflow:visible;
	}
	.top_js-pickup-carousel .splide__arrows {
		margin-right:-.60rem;
		margin-left:auto;
		position:static;
	}
	.top_js-pickup-carousel.is-initialized:not(.is-active) .splide__slide  {
		width:100%;
	}
}


.top-intro-news {

}
.top-intro-news .item > a {
	display:grid;
	transition-property: opacity;
	transition-duration: .5s;
}
@media (hover) {
	.top-intro-news .item > a:hover {
		opacity:.7;
	}
}
.top-intro-news .item {
	border-bottom:1px solid #C8C8C8;
	position:relative;
}
.top-intro-news .item::after {
	content:"";
	border-bottom:1px solid var(--cc-green-A);
	width:1.60rem;
	position:absolute;
	bottom:-1px;
	left:0;
}
.top-intro-news .item .date {
	font-size:.14rem;
	letter-spacing: .05em;
}
.top-intro-news .item .type {
	font-size:.12rem;
	font-weight:700;
	letter-spacing: .05em;
}
.top-intro-news .item .title {
	font-size:.15rem;
	font-weight:700;
	letter-spacing: 0;
}
.top-intro-news + .r-button-B {
	margin-top:1.00rem;;
}
@media (min-width: 768px) {
	.top-intro-news .item > a {
		padding-block:.24rem;
		grid-template-columns:auto auto 1fr;
		align-items: centers;
		line-height:1;
	}
	.top-intro-news .item :is(.date,.type) {
	}
	.top-intro-news .item .date {
	}
	.top-intro-news .item .type {
		padding-left:.28rem;
		margin-bottom:-.1em;
	}
	.top-intro-news .item .title {
		padding-left:.46rem;
		margin-top:-.1em;
	}
}
@media (max-width: 767px) {
	.top_js-intro-news .contents {
		padding-block:1.00rem 0;
		overflow:hidden;
	}
	.top_js-intro-news:last-child {
		padding-bottom:1.00rem;
	}
	.top-intro-news {
		padding-right:.40rem;
	}
	.top-intro-news .item {
		padding-left:.40rem;
	}
	.top-intro-news .item::after {
		width:.40rem;
	}
	.top-intro-news .item + .item {
		margin-top:.40rem;
	}
	.top-intro-news .item > a {
		grid-template-columns:auto 1fr;
		gap:.15rem .24rem;
		padding-bottom:.24rem;
	}
	.top-intro-news .item :is(.date,.type) {
	}
	.top-intro-news .item .date {
	}
	.top-intro-news .item .type {
	}
	.top-intro-news .item .title {
		grid-column:1/-1;
	}
	.top-intro-news + .r-button-B {
		margin-top:.50rem;
	}
}


/* About
============================================================================= */
.top-about {
	--s1-ftl:0;
	--s1-ftl-nega:1;
	--s2-ftl:0;
	--s2-ftl-nega:1;
	--s3-ftl:0;
	--s3-ftl-nega:1;
	--s1_3-ftl:0;
	--s1_3-ftl-nega:1;
	--s1_2-ftl:0;
	--s1_2-ftl-nega:1;
	--s2_3-ftl:0;
	--s2_3-ftl-nega:1;
	--s4-ftl:0;
	--s4-ftl-nega:1;
	--s1-h:125svh;
	--s2-h:150svh;
	--s3-h:100svh;
	padding-top:calc(var(--s1-h) + var(--s2-h) + var(--s3-h));
	background-color:#F0F0F0;
	color:#fff;
	font-weight:700;
	position:relative;
	z-index:11;
}
.top-about .top_js-about-scene1 {
	height:var(--s1-h);
	position:absolute;
	top:0;
}
.top-about .top_js-about-scene1_2 {
	height:calc(var(--s1-h) + var(--s2-h));
	position:absolute;
	top:0;
}
.top-about .top_js-about-scene1_3 {
	height:calc(var(--s1-h) + var(--s2-h) + var(--s3-h));
	position:absolute;
	top:0;
}
.top-about .top_js-about-scene2 {
	height:var(--s2-h);
	position:absolute;
	top:var(--s1-h);
}
.top-about .top_js-about-scene2_3 {
	height:calc(var(--s2-h) + var(--s3-h));
	position:absolute;
	top:var(--s1-h);
}
.top-about .top_js-about-scene3 {
	height:var(--s3-h);
	position:absolute;
	top:calc(var(--s1-h) + var(--s2-h));
}
.top-about .top_js-about-scene4 {
	height:calc((100% - var(--s1-h) - var(--s2-h) - var(--s3-h)) * .9);
	position:absolute;
	top:calc(var(--s1-h) + var(--s2-h) + var(--s3-h));
}
.top-about .scene_inner {
	padding-top:1.40rem;
	position:relative;
}
.top-about :is(.scene-1,.scene-2) {
	height:100lvh;
	position:sticky;
	top:0;
	overflow:hidden;
}
.top-about .scene-1 {
	margin-top:calc((var(--s1-h) + var(--s2-h) + var(--s3-h)) * -1);
}
.top-about .scene-2 {
	margin-top:-100lvh;
}
.top-about .scene-3 {
	margin-top:calc((var(--s1-h) + var(--s2-h) + var(--s3-h)));
}
.top-about > :not(.scene-3) .scene_inner {
	height:100%;
}
.top-about .catch {
	font-size:.36rem;
	line-height:2;
	letter-spacing: .15em;
	writing-mode: vertical-rl;
	font-feature-settings: "palt" 0;
	white-space: nowrap;
	position:absolute;
	right:0;
}
.top-about .bg {
	--base-ratio-w:1600;
	--base-ratio-h:900;
	--ratio-w:var(--base-ratio-w);
	--ratio-h:var(--base-ratio-h);
	margin-block:auto;
	width:100%;
	position:absolute;
	inset-block:0;
	pointer-events: none;
}
.top-about .bg .bg_inner {
	display:flex;
	justify-content: center;
	align-items: center;
	width:100%;
	height:100lvh;
	position:sticky;
	top:0;
	z-index: -1;
	overflow: hidden;
}
.top-about .bg :is(img,video) {
	width:100%;
	height:100%;
	object-fit:cover;
}
.top-about .bg_item {
	--my-ftl:
	width:100%;
	height:auto;
	aspect-ratio: 16/9;
	aspect-ratio:
		calc(var(--ratio-w) - (var(--s2-ftl) * (var(--ratio-w) - var(--base-ratio-w))))
		/
		calc(var(--ratio-h) - (var(--s2-ftl) * (var(--ratio-h) - var(--base-ratio-h))))
	;
	transform:scale(calc(var(--s2-ftl-nega) * .55 + .45));
	position:relative;
	will-change:transform,aspect-ratio;
}
.top-about .bg_item::before {
	content:"";
	margin:auto;
	position:absolute;
	inset:0;
	transform:translate3d(0,0,0);
	/*
	-webkit-backdrop-filter:blur(calc(var(--s3-ftl-nega) * 10px)) brightness(calc(var(--s3-ftl) * .3 + .7));
	backdrop-filter:blur(calc(var(--s3-ftl-nega) * 10px)) brightness(calc(var(--s3-ftl) * .3 + .7));
	*/
	-webkit-backdrop-filter:brightness(calc(var(--s3-ftl) * .3 + .7));
	backdrop-filter:brightness(calc(var(--s3-ftl) * .3 + .7));
	backface-visibility: hidden;
	will-change:backdrop-filter;
	z-index: 1;
}
.top-about .scene-1 {
	pointer-events: none;
}
.top-about .scene-1 .catch {
	color:#000;
	opacity:var(--s2-ftl);
}
.top-about .scene-1 .copy {
	margin-block:auto;
	font-size:1.30rem;
	height:fit-content;
	line-height:1;
	position:absolute;
	left:100%;
	inset-block:0;
	white-space: nowrap;
	transform:translateX(calc(var(--s1_3-ftl-nega) * -200%));
	opacity:var(--s3-ftl);
	/* filter:invert(var(--s1-ftl)); */
}
.top-about .scene-2 {
	opacity:calc(var(--s4-ftl));
}
.top-about .scene-2 .catch {
	opacity:var(--s3-ftl-nega);
}
.top-about .scene-2 .top-l-heading {
	opacity:var(--s3-ftl-nega);
}
.top-about .scene-2 .detail {
	display:grid;
	grid-template-rows:auto 2.00rem auto;
	grid-template-columns:2.70rem 2.00rem 2.70rem;
	justify-content: center;
	align-items: center;
	row-gap:.28rem;
	margin-inline:auto;
	position:absolute;
	inset-inline:0;
	bottom:.60rem;
	opacity:var(--s3-ftl-nega);
}
@media (height <= 750px) and (width > 767px) {
	.top-about .scene-2 .detail {
		transform:scale(.8);
		bottom:.40rem;
	}
}
.top-about .scene-2 .detail .top {
	grid-row:1/2;
	grid-column:1/4;
}
.top-about .scene-2 .detail .left {
	grid-row:2/3;
	grid-column:1/2;
}
.top-about .scene-2 .detail .right {
	grid-row:2/3;
	grid-column:3/4;
}
.top-about .scene-2 .detail .bottom {
	grid-row:3/4;
	grid-column:1/4;
}
.top-about .scene-2 .detail .center {
	grid-row:2/3;
	grid-column:2/3;
	display:flex;
	justify-content: center;
	align-items: center;
	position:relative;
}
.top-about .scene-2 .detail .center::before,
.top-about .scene-2 .detail .center::after {
	content:"";
	width:calc(100% + .80rem);
	height:2px;
	position:absolute;
}
.top-about .scene-2 .detail .center::before {
	background-color:var(--cc-blue-A);
	transform:rotate(45deg);
}
.top-about .scene-2 .detail .center::after {
	background-color:var(--cc-green-A);
	transform:rotate(-45deg);
}
.top-about .scene-2 .detail > p {
	display:flex;
	flex-direction: column-reverse;
	align-items: center;
	gap:.12rem;
	line-height:1;
}
.top-about .scene-2 .detail > p .ja {
	font-size:.16rem;
	font-weight:700;
	letter-spacing: .05em;
}
.top-about .scene-2 .detail > p .ff-bv_p {
	font-size:.74rem;
	letter-spacing: .05em;
	line-height:1.1;
}
.top-about .scene-3 .scene_inner {
	padding-bottom:1.80rem;
}
.top-about .scene-3 .heading {
	margin-bottom:.36rem;
	font-size:.28rem;
	font-weight:700;
	line-height:calc(60/28);
	letter-spacing: .1em;
}
.top-about .scene-3 .desc {
	margin-bottom:.52rem;
	font-size:.16rem;
	line-height:calc(42/16);
	letter-spacing: .15em;
}
.top-about .scene-3 img {
	width:5.40rem;
	position:absolute;
	right:0;
	bottom:-1.00rem;
}
@media (min-width: 768px) {
	.top-about .scene_inner {
		margin-inline:auto;
		width:12.50rem;
	}
	.top-about .scene-3 .desc {
		width:6.40rem;
		white-space: nowrap;
	}
}
@media (max-width: 767px) {
	.top-about {
		--s1-h:125svh;
		--s2-h:75svh;
		--s3-h:75svh;
		background-color:#F0F0F0;
		color:#fff;
		font-weight:700;
		position:relative;
		z-index:1;
	}
	.top-about :is(.scene-1,.scene-2) {
	}
	.top-about .scene_inner {
		padding-top:.75rem;
		padding-inline:.40rem;
	}
	.top-about :not(.scene-3) .scene_inner {
		height:100svh;
	}
	.top-about .catch {
		font-size:.24rem;
		line-height:calc(50/28);
	}
	.top-about .bg {
		--base-ratio-w:295;
		--base-ratio-h:240;
	}
	.top-about .bg .bg_inner {
	}
	.top-about .bg img {
	}
	.top-about .scene-1 .catch {
		top:.80rem;
		right:.40rem;
	}
	.top-about .scene-1 .copy {
		margin-block:auto;
		font-size:1.00rem;
		left:0;
		transform:translateX(calc(var(--s2_3-ftl-nega) * -150%));
	}
	.top-about .scene-2 .catch {
		top:2.10rem;
		right:.40rem;
		letter-spacing: 0;
	}
	.top-about .scene-2 .detail {
		grid-template-rows:auto 1.00rem auto;
		grid-template-columns:1.36rem 1.00rem 1.36rem;
		row-gap:.16rem;
		bottom:auto;
		top:3.30rem;
	}
	.top-about .scene-2 .detail .center::before,
	.top-about .scene-2 .detail .center::after {
		width:calc(100% + .40rem);
	}
	.top-about .scene-2 .detail > p {
		gap:.06rem;
	}
	.top-about .scene-2 .detail > p .ja {
		font-size:.12rem;
	}
	.top-about .scene-2 .detail > p .ff-bv_p {
		font-size:.34rem;
		letter-spacing: 0;
	}
	.top-about .scene-3 .scene_inner {
		padding-bottom:1.60rem;
	}
	.top-about .scene-3 .heading {
		margin-right:-.40rem;
		margin-bottom:.24rem;
		font-size:.20rem;
		font-weight:700;
		line-height:2;
	}
	.top-about .scene-3 .desc {
		margin-bottom:.50rem;
		font-size:.14rem;
		line-height:calc(68/28);
		word-break: break-all;
	}
	.top-about .scene-3 img {
		width:2.40rem;
		position:absolute;
		right:0;
		bottom:-.80rem;
	}
	.top-about .bg_item {
		transform:scale(calc(var(--s2-ftl-nega) * .25 + .75));
	}
}


/* Building Sales House
============================================================================= */
.top-bsh {
	padding-block:1.90rem 1.60rem;
}
.top-bsh .bsh-list {
	display:grid;
}
.top-bsh .bsh-list .list-item {
	display:grid;
	font-size:.14rem;
	line-height:calc(24/14);
}
.top-bsh .img img {
	width:100%;
	aspect-ratio: 34/28;
	object-fit: cover;
}
.top-bsh .heading {
	margin-block:.16rem;
	font-size:.18rem;
	font-weight:700;
	line-height:calc(28/18);
	letter-spacing: 0;
}
.top-bsh .table {
	display:grid;
	grid-template-columns:.56rem 1fr;
	margin-bottom:.08rem;
}
.top-bsh .table > dt {
	font-weight:700;
}
.top-bsh :is(.price,.repayment) {
	display:flex;
	align-items: baseline;
	font-weight:700;
}
.top-bsh :is(.price,.repayment) dd {
	display:flex;
	align-items: baseline;
}
.top-bsh :is(.price,.repayment) small {
	font-size:.12rem;	
}
.top-bsh .price {
	border-bottom:1px solid var(--cc-green-A);
	padding-bottom:.14rem;
}
.top-bsh .price dd {
	gap:.2em;
	margin-left:auto;
}
.top-bsh .price .ff-roboto-400 {
	font-size:.40rem;
	line-height:1;
	letter-spacing: .05em;
	position:relative;
	bottom:-.05em;
}
.top-bsh .repayment {
	gap:.06rem;
	margin-top:.16rem;
}
.top-bsh .repayment > dt {
	padding-block:.06rem;
	padding-inline:.08rem .18rem;
	color:#fff;
	background-color:#666;
	line-height:1;
	clip-path:polygon(0 0, 100% 0, calc(100% - .12rem) 100%, 0 100%);
}
.top-bsh .repayment > dd {
	gap:.2em;
}
.top-bsh .repayment .ff-roboto-400 {
	font-size:.26rem;
	line-height:1;
	letter-spacing: .05em;
	position:relative;
	bottom:-.05em;
}
.top-bsh .links {
	display:grid;
	grid-template-columns:repeat(2,1fr);
	gap:.20rem;
	margin-top:.28rem;
}
.top-bsh .links > .r-button-A {
	width:auto;
	border-radius:100px;
}
@media (min-width: 768px) {
	.top-bsh {
		display:grid;
		grid-template-columns:1fr auto;
		row-gap:.76rem;
		margin-inline:auto;
		width:12.00rem;
	}
	.top-bsh .bsh-list {
		grid-column:1/3;
		grid-template-columns: repeat(3,1fr);
		gap:.90rem;
	}
	.top-bsh .price {
		margin-top:auto;
	}
	.top-bsh .r-button-B {
		grid-row:1/2;
		grid-column:2/3;
		margin-top:auto;
	}
	.top-bsh .price > span:not(.ff-roboto-400) {
		display:contents;
	}
}
@media (max-width: 767px) {
	.top-bsh {
		padding:1.50rem .40rem 1.00rem;
	}
	.top-bsh .top-l-heading {
		margin-bottom:.36rem;
	}
	.top-bsh .bsh-list {
		gap:.80rem;
	}
	.top-bsh .img img {
		aspect-ratio: 59/40;
	}
	.top-bsh .price {
		padding-bottom:.08rem;
	}
	.top-bsh .price dd {
		align-items: flex-end;
		gap:.2em;
	}
	.top-bsh .price .ff-roboto-400 {
		font-size:.38rem;
	}
	.top-bsh .price dd > span:not(.ff-roboto-400) {
		display:grid;
		gap:.15em;
		line-height:1;
	}
	.top-bsh .price dd > span:not(.ff-roboto-400) > span {
		margin-left:.25em;
	}
	.top-bsh .repayment {
		gap:.06rem;
		margin-top:.12rem;
	}
	.top-bsh .repayment > dt {
	}
	.top-bsh .repayment > dd {
		gap:.2em;
	}
	.top-bsh .repayment .ff-roboto-400 {
		font-size:.26rem;
	}
	.top-bsh .links {
		gap:.15rem;
		margin-top:.18rem;
	}
	.top-bsh .links > .r-button-A {
		width:auto;
		border-radius:.10rem;
	}
	.top-bsh .r-button-B {
		margin-top:.40rem;
	}
}


/* Achievements
============================================================================= */
.top-achievements {
	position:relative;
	overflow:hidden;
	background-color:rgb(from var(--cc-blue-B) r g b / 0.85);;
	color:#fff;
	z-index: 1;
}
.top-achievements::before {
	content:"";
	display:block;
	background-color:#C8C8C8;
	mix-blend-mode:multiply;
	position:absolute;
	z-index: -1;
}
.top-achievements > .deco {
	margin-inline:auto;
	writing-mode: vertical-rl;
	inline-size:fit-content;
	font-size:1.70rem;
	letter-spacing: .03em;
	line-height:.58;
	color:#001432;
	position:absolute;
	inset-block-end:0;
	inset-inline:0;
	opacity:.2;
	z-index: -1;
}
.top-achievements .imgs {
	display:flex;
	align-items: flex-start;
	margin-top:1.00rem;
}
.top-achievements .imgs .img01 {
	transform:translateY(calc(var(--cftl) * -2.00rem));
}
.top-achievements .imgs .img02 {
	transform:translateY(calc(var(--cftl) * -2.20rem));
}
.main_visual > .inner {
	transition-property: opacity,transform;
	transition-duration: 1s;
}
.main_visual:not([style*="--tftl: 0;"]) > .inner {
	transform:translateY(-1.00rem);
	opacity:0;
}
.top-achievements .top-l-heading {
	margin-bottom:.40rem;
}
.top-achievements .desc {
	font-size:.16rem;
	font-weight:700;
	line-height:calc(42/16);
	letter-spacing: .15em;
}
.top-achievements .r-button-B {
	margin-top:.40rem;
}
@media (min-width: 768px) {
	.top-achievements {
		padding-block:1.20rem;
	}
	.top-achievements::before {
		width:calc(50vw + 5.50rem);
		inset-block:1.20rem;
		right:0;
	}
	.top-achievements > .inner {
		display:grid;
		grid-template-columns: auto 1fr;
		gap:.90rem;
		margin-inline:auto;
		padding-block:.80rem 1.20rem;
		width:12.50rem;
	}
	.top-achievements .imgs {
		gap:.20rem;
	}
	.top-achievements .imgs img {
		width:2.90rem;
	}
	.top-achievements .imgs .img02 {
		margin-top:.80rem;
	}
	.top-achievements .text {
		margin-top:.80rem;
	}
	.top-achievements .text {
	}
}
@media (max-width: 767px) {
	.top-achievements {
		padding-block:.60rem 1.00rem;
	}
	.top-achievements .inner {
		padding-bottom:1.00rem;
	}
	.top-achievements::before {
		width:calc(100% - .20rem);
		inset-block:1.40rem 1.00rem;
		right:0;
	}
	.top-achievements > .deco {
		font-size:1.80rem;
		line-height:.58;
	}
	.top-achievements .imgs {
		width:fit-content;
		margin-left:auto;
		gap:.10rem;
		margin-top:.50rem;
	}
	.top-achievements .imgs img {
		width:1.42rem;
	}
	.top-achievements .imgs .img01 {
		transform:translateY(calc(var(--cftl) * -1.00rem));
	}
	.top-achievements .imgs .img02 {
		margin-top:.40rem;
		transform:translateY(calc(var(--cftl) * -1.20rem));
	}
	.top-achievements .text {
		padding-inline:.60rem .45rem;
	}
	.top-achievements .top-l-heading {
		margin-block:.40rem;
	}
	.top-achievements .desc {
		font-size:.14rem;
		line-height:calc(68/28);
	}
	.top-achievements .r-button-B {
		margin-top:.50rem;
	}
}


/* Gallery
============================================================================= */
.top-gallery {
	margin-top:1.40rem;
}
.top-gallery .inner {
	position:relative;
	overflow:hidden;
}
.top-gallery .inner .imgs {
	display:grid;
}
.top-gallery .inner .top-l-heading {
	color:#fff;
	position:absolute;
}
@media (min-width: 768px) {
	.top-gallery {
		height:600svh;
	}
	.top-gallery .inner {

	}
	.top-gallery .inner .top-l-heading {
		top:1.56rem;
		left:1.30rem;
	}
	.top-gallery .inner {
		height:100svh;
		padding:.20rem;
		position:sticky;
		top:0;
	}
	.top-gallery .inner .imgs {
		--ftl:0;
    transform:translateX(calc(var(--ftl) * -100% + var(--ftl) * (100vw - .40rem - var(--scrollbar-w))));
		grid-template-rows:1fr 1fr;
		grid-auto-flow:column;
		gap:.20rem;
		width:fit-content;
	}
	.top-gallery .img:not(.-half) {
		grid-row:1/3;
	}
	.top-gallery .img img {
		max-width:unset;
		width:auto;
	}
	.top-gallery .img:not(.-half) img {
		height:calc(100svh - .40rem);
	}
	.top-gallery .img.-half img {
		height:calc(50svh - .30rem);
	}
}
@media (max-width: 767px) {
	.top-gallery {
		margin-block:1.00rem .80rem;
		padding-inline:.20rem;
	}
	.top-gallery .inner {
	}
	.top-gallery .inner .imgs {
		grid-template-columns:1fr 1fr;
		gap:.10rem;
	}
	.top-gallery .img:not(.-half) {
		grid-column:1/3;
	}
	.top-gallery .img img {
		width:100%;
	}
}



@media (min-width: 768px) {
}
@media (max-width: 767px) {
}