@charset "utf-8";

/* --------------------------------------------------
  Base
-------------------------------------------------- */
body {
	background-color: var(--primary-color);
}

/* --------------------------------------------------
  Breadcrumb
-------------------------------------------------- */
.breadcrumb {
	display: none;
	padding-block: 2em;
	border-bottom: none;
}


/* --------------------------------------------------
  Sections
-------------------------------------------------- */
.section__inner {
	padding-block: var(--sp-5x) var(--sp-13x);
}
@media screen and (max-width: 768px) {
	.section__inner {
		padding-block: var(--sp-5x) var(--sp-8x);
	}
}


/* --------------------------------------------------
  Section - KV
-------------------------------------------------- */
.section-kv {
	display: flex;
	min-height: calc(100vh - var(--headerHeight));
	background: url('/assets/img/001/index/kv.webp') no-repeat center / cover;;
	background-color: var(--primary-color);
	font-family: "Noto Serif JP", serif;
	color: #fff;
	position: relative;
}
.section-kv__overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: var(--primary-color);
	opacity: 0.398;
}
.section-kv__inner {
	display: flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	padding: var(--sp-4x) var(--contentInlinePadding);
	position: relative;
	z-index: 1;
}
.kv-content__title {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--sp-4x);
	line-height: 1.4;
}
.kv-content__title-sub,
.kv-content__title-main {
	margin-block: var(--leading-trim);
	text-align: center;
}
.kv-content__title-sub {
	font-size: var(--fs-28);
	font-weight: var(--fw-light);
}
.kv-content__title-main {
	font-size: var(--fs-56);
	font-weight: var(--fw-regular);
}
@media screen and (max-width: 1080px) {
	.kv-content__title {
		gap: var(--sp-3x);
	}
	.kv-content__title-sub {
		font-size: var(--fs-22);
	}
	.kv-content__title-main {
		font-size: var(--fs-42);
	}
}
@media screen and (max-width: 540px) {
	.kv-content__title-sub {
		font-size: var(--fs-16);
	}
	.kv-content__title-main {
		font-size: var(--fs-28);
	}
}


/* --------------------------------------------------
  Section - News
-------------------------------------------------- */
.section-news .section__inner {
	padding-block: var(--sp-14x) var(--sp-10x);
}
.section-news .news-wrapper {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: var(--sp-6x) var(--sp-10x);
	column-rule: 1px solid var(--primary-color);
}
.section-news .section-title {
	padding-block: 0;
}
.section-news .section-title-block {
	align-self: center;
}
.section-news .section-title::before,
.section-news .section-title::after {
	display: none;
}
.section-news .section-title__sub {
	font-size: var(--fs-48);
}
.section-news .news-block {
	margin-top: 0;
}
.section-news .news-list {
	margin-top: 0;
}
.section-news .news-list + * {
	margin-top: var(--sp-8);
}
.section-news .btn-wrapper {
	display: flex;
	justify-content: flex-end;
}
@media screen and (max-width: 768px) {
	.section-news .section__inner {
		padding-block: var(--sp-5x) var(--sp-10x);
	}
	.section-news .news-wrapper {
		grid-template-columns: 100%;
		gap: var(--sp-5);
	}
	.section-news .section-title {
		gap: var(--sp-2x);
		padding-bottom: var(--sp-6x);
	}
	.section-news .section-title__sub {
		font-size: var(--fs-32);
	}
	.section-news .section-title::after {
		display: block;
	}
	.section-news .news-block {
		margin-top: var(--sp-1x);
	}
}


/* --------------------------------------------------
  Section - Fund Data
-------------------------------------------------- */
/* fund-data-cards */
.fund-data-cards {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(400px, 100%), 1fr));
	gap: var(--sp-4x) 0;
}
.fund-data-card {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	gap: 2em;
	padding: 0.8em 1.2em;
	font-family: "Noto Serif JP", serif;
	font-size: var(--fs-20);
	position: relative;
}
.fund-data-card::before,
.fund-data-card::after {
	content: '';
	display: block;
	width: 1px;
	height: 100%;
	background-color: var(--primary-color);
	position: absolute;
	top: 0;
}
.fund-data-card::before {
	left: 0;
	transform: translateX(-50%);
}
.fund-data-card::after {
	right: 0;
	transform: translateX(50%);
}
.fund-data-card__label {
	margin-block: var(--leading-trim);
	font-weight: var(--fw-regular);
	line-height: 1.4;
	text-align: center;
}
.fund-data-card__label .sub-text {
	display: inline-block;
	font-weight: 400;
}
.fund-data-card__body {
	color: var(--primary-color);
	line-height: 1;
}
.fund-data-card__value {
	font-family: "Cinzel", serif;
	font-size: var(--fs-96);
	line-height: 1;
}
.fund-data-card__unit {
	font-size: var(--fs-30);
	font-weight: var(--fw-regular);
	line-height: 1;
}
.fund-data-cards + .fund-data-cards__note-wrapper {
	margin-top: var(--sp-5x);
}
.fund-data-cards__note-wrapper {
	grid-template-columns: auto auto;
	justify-content: end;
}
.fund-data-cards__note-wrapper .annotation {
	font-size: var(--fs-14);
}
@media screen and (max-width: 1080px) {
	.fund-data-card {
		font-size: var(--fs-18);
	}
	.fund-data-card__value {
		font-size: var(--fs-80);
	}
	.fund-data-card__unit {
		font-size: var(--fs-24);
	}
}
@media screen and (max-width: 840px) {
	.fund-data-cards {
		gap: 0;
	}
	.fund-data-card {
		padding-block: var(--sp-5x) var(--sp-4x);
		border-top: 1px solid var(--primary-color);
	}
	.fund-data-card:last-of-type {
		border-bottom: 1px solid var(--primary-color);
	}
	.fund-data-card::before,
	.fund-data-card::after {
		display: none;
	}
	.fund-data-card__unit {
		/* font: var(--fs-20); */
	}
}
@media screen and (max-width: 540px) {
	/* .fund-data-card {
		font-size: var(--fs-16);
	}
	.fund-data-card__value {
		font-size: var(--fs-64);
	} */
}


/* --------------------------------------------------
  Section - Concept
-------------------------------------------------- */
.concept-block::after {
	content: '';
	display: block;
	clear: both;
}
.concept-block__image-wrapper {
	width: 51.25%;
	padding-right: var(--sp-5x);
	margin-bottom: var(--sp-3x);
	float: left;
}
.concept-block p {
	line-height: 1.92;
	letter-spacing: 0.025em;
}
.concept-block p.margin-top {
	margin-top: 1.75em;
}
@media screen and (max-width: 768px) {
	.concept-block__image-wrapper {
		width: 100%;
		max-width: 540px;
		margin-inline: auto;
		margin-bottom: var(--sp-4x);
		padding: 0;
		float: none;
	}
	.concept-block p.margin-top {
    margin-top: var(--sp-4x);
	}
}


/* --------------------------------------------------
  Section - Gallery
-------------------------------------------------- */
.gallery__main {
	position: relative;
	width: 100%;
	aspect-ratio: 334 / 172;
	overflow: hidden;
	padding-bottom: 2.2em;
}
.gallery__main-list {
	position: relative;
	width: 100%;
	height: 100%;
}
.gallery__main-item {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	transition: opacity var(--gallery-main-transition-duration, 0.4s) ease;
	pointer-events: none;
}
.gallery__main-item.is-active {
	opacity: 1;
}
.gallery__main-item-inner {
	width: 100%;
	height: 100%;
	position: relative;
}
.gallery__main-item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.gallery__main-caption {
	width: 100%;
	font-size: var(--fs-16);
	line-height: 1.4;
	text-align: center;
	position: absolute;
	/* bottom: 1em;
	right: 1em;
	max-width: 100%;
	padding: 0.5em 1em;
	background-color: rgba(0, 0, 0, 0.5); */
	left: 0;
	top: 100%;
	transform: translateY(0.25em);
}
.gallery__thumbs {
	--gallery-thumbs-gap: var(--sp-1x);
	--gallery-thumbs-count: 5;
	container-type: inline-size;
	width: 100%;
	overflow: hidden;
	cursor: grab;
}
.gallery__thumbs-track {
	display: flex;
	will-change: transform;
}
.gallery__thumbs-track.is-dragging {
	cursor: grabbing;
}
.gallery__thumbs-item {
	flex: 0 0 auto;
	width: calc((100cqw - var(--gallery-thumbs-gap) * (var(--gallery-thumbs-count) - 1)) / var(--gallery-thumbs-count));
	margin-right: var(--gallery-thumbs-gap);
	opacity: 0.5;
}
.gallery__thumbs-item.is-active {
	opacity: 1;
}
.gallery__thumbs-item button {
	display: block;
	width: 100%;
	aspect-ratio: 66 / 34;
	padding: 0;
	border: none;
	cursor: pointer;
}
.gallery__thumbs-item.is-active button {
	opacity: 1;
}
.gallery__thumbs-item img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	pointer-events: none; /* ドラッグ操作中に画像自体がドラッグされるのを防止 */
	-webkit-user-drag: none;
}
@media screen and (max-width: 768px) {
	.gallery__thumbs {
    --gallery-thumbs-gap: 2px;
	}
}
@media screen and (max-width: 540px) {
	.gallery__main {
		padding-bottom: 3.5em;
	}
}



/* --------------------------------------------------
  Section - Location
-------------------------------------------------- */
.location-map,
.location-map-picture {
	margin-bottom: var(--sp-8x);
}
.location-map {
	height: 480px;
}
.location-map .google-map {
	height: 100%;
}
@media screen and (max-width: 768px) {
	.location-map {
		height: 320px;
	}
}
@media screen and (max-width: 540px) {
	.location-map {
		height: auto;
		aspect-ratio: 333 / 165;
	}
}
 
/* location-info */
.location-info {
	display: grid;
	grid-template-columns: auto 1fr;
	align-items: center;
	column-rule: 1px solid var(--primary-color);
	gap: var(--sp-16x);
}
.location-info__title {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: var(--sp-2x);
	font-family: "Noto Serif JP", serif;
	font-size: var(--fs-32);
	color: var(--primary-color);
}
.location-info__title-main {
	margin-block: var(--leading-trim);
	font-family: "Cinzel", serif;
	font-weight: var(--fw-regular);
	line-height: 1.2;
}
.location-info__title-sub {
	margin-block: var(--leading-trim);
	font-size: var(--fs-16);
	letter-spacing: 0.08em;
}
.location-info__body {
	display: flex;
	flex-direction: column;
	gap: var(--sp-3x);
}
.location-info__address {
	margin-block: var(--leading-trim);
	padding-block: 0.5em 1em;
	border-bottom: 1px solid var(--primary-color);
	font-size: var(--fs-18);
	line-height: 1.6;
}
.location-info__access-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(400px, 100%), 1fr));
	gap: var(--sp-3x) var(--sp-8x);
}
.location-info__access-item {
	display: flex;
	align-items: center;
	gap: var(--sp-3x);
}
.location-info__access-icon {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: var(--sp-1x);
	flex-shrink: 0;
	width: 84px;
	min-height: 72px;
	padding: var(--sp-1x) var(--sp-4x) var(--sp-1x) var(--sp-2x);
	background-color: #ECF0F2;
	clip-path: polygon(0 0, 78% 0, 100% 50%, 78% 100%, 0 100%);
	font-size: var(--fs-12);
	line-height: 1.2;
	text-align: center;
}
.location-info__access-icon::before {
	content: '';
	display: block;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}
.location-info__access-icon.icon-airplane::before {
	aspect-ratio: 34 / 22;
	width: 34px;
	background-image: url('/assets/img/common/icon-airplane.svg');
}
.location-info__access-icon.icon-train::before {
	aspect-ratio: 22 / 26;
	width: 23px;
	background-image: url('/assets/img/common/icon-train.svg');
}
/* .location-info__access-icon.icon-airplane img {
	width: 34px;
}
.location-info__access-icon.icon-train img {
	width: 23px;
} */
.location-info__access-icon span {
	font-size: var(--fs-12);
}
.location-info__access-text {
	display: flex;
	flex-direction: column;
	gap: var(--sp-1);
	/* padding-top: 0.4em; */
	line-height: 1.4;
}
.location-info__access-text p {
	margin-block: var(--leading-trim);
}
.location-info__access-text p + p {
	margin-top: 1em;
}
.section-location .btn-wrapper {
	display: flex;
	justify-content: center;
	width: 100%;
	margin-top: var(--sp-10x);
}
.section-location .btn-back {
	display: flex;
	align-items: center;
	gap: 1em;
	width: 100%;
	justify-content: center;
	max-width: 368px;
	border-bottom: 1px solid var(--primary-color);
	padding-inline: var(--sp-3x) var(--sp-2x);
	padding-bottom: 1em;
	font-size: var(--fs-16);
	text-decoration: none;
	position: relative;
}
.section-location .btn-back::after {
	content: '';
	display: block;
	aspect-ratio: 10 / 6.19;
	width: 10px;
	background-color: currentColor;
	clip-path: polygon(0 0, 0% 100%, 100% 50%);
	
}
@media screen and (max-width: 980px) {
	.location-info {
		grid-template-columns: minmax(0, 1fr);
		gap: var(--sp-4x);
	}
}
@media screen and (max-width: 768px) {
	.location-info__body {
		gap: var(--sp-4x);
	}
	.location-info__address {
		font-size: var(--fs-14);
	}
	.location-info__access-list {
		grid-template-columns: minmax(0, 1fr);
	}
	.location-info__access-item {
		gap: var(--sp-1x);
	}
	.location-info__access-icon {
		gap: 6px;
		width: 58px;
		min-height: 48px;
		padding: var(--sp-1x) var(--sp-2x) var(--sp-1x) var(--sp-1x);
	}
	.location-info__access-icon span {
		font-size: var(--fs-10);
	}
	.location-info__access-icon.icon-airplane::before {
		width: 24px;
	}
	.location-info__access-icon.icon-train::before {
		width: 17px;
	}
	/* .location-info__access-icon.icon-airplane img {
		width: 24px;
	}
	.location-info__access-icon.icon-train img {
		width: 17px;
	} */
	.location-info__access-text p {
		font-size: var(--fs-14);
	}
	.section-location .btn-wrapper {
		margin-top: var(--sp-8x);
	}
	.section-location .btn-back {
		font-size: var(--fs-14);
	}
	.location-info__title {
		padding-bottom: var(--sp-2x);
		gap: var(--sp-1x);
		position: relative;
	}
	.location-info__title::after {
		content: '';
		display: block;
		width: 1em;
		height: 1px;
		background-color: var(--primary-color);
		position: absolute;
		bottom: 0;
	}
	.location-info__title-sub {
		font-size: var(--fs-12);
	}
}
@media screen and (max-width: 540px) {
	.location-info__access-item {
		gap: var(--sp-2x);
	}
	.location-info__access-icon {
		width: 56px;
	}
}