@charset "UTF-8";
:root{
	--color-white: #fff;
	--color-black: #000;
	--color-gray: rgba(51, 51, 51, .2);
	--color-gray2: #a7a7a7;
	--color-green: #007b89;
	--color-gold: #987b53;
	--en-font: "optima-nova-lt-pro", sans-serif;
	--jp-font: "游明朝", "Yu Mincho", YuMincho, "游明朝体", 'ヒラギノ明朝 Pro W3','Hiragino Mincho Pro','HGS明朝E','ＭＳ Ｐ明朝', serif;
}
.mv{
	overflow: hidden;
}
.mv-text{
	width: 100%;
	height: 100%;
	position: absolute;
	top: 5%;
	left: .5%;
}
.mv-text img{
	width: auto;
	height: 92%;
}
@media screen and (max-width: 767px) {
	.mv-text{
		top: .5%;
	}
	.mv-text img{
		height: 46%;
	}
}
.general-section .inner.inner-wide{
	max-width: 1348px;
}
.general-section .inner.inner-mid{
	margin-inline: 0 auto;
	max-width: 1140px;
}
.facility .secondary-heading{
    font-size: clamp(2rem, 3vw, 3rem);
}
.facility .tertiary-heading{
	margin-bottom: 0;
    font-size: clamp(4rem, 7.8vw, 7.8rem);
	line-height: 1;
}
.tab-lists{
	margin: clamp(6rem, 10vw, 10em) 0;
	justify-content: center;
}
.tab-lists.has-gap{
	gap: 20px;
}
.tab-lists.has-gap > .col-2{
	width: calc(50% - 10px);
}
.tab-lists-bottom{
	margin: 0;
}
.tab{
	width: 100%;
	display: block;
	position: relative;
	aspect-ratio: 560 / 180;
	overflow: hidden;
	filter: grayscale(100%);
	transition: all .3s ease-out;
}
.tab:before{
	content: "";
	width: 100%;
	height: 100%;
	display: block;
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, .4);
	transition: all .2s ease-out;
}
.tab.is-active,
.tab:hover{
	filter: grayscale(0);
}
.tab.is-active::before,
.tab:hover::before{
	opacity: 0;
}
.tab-text{
	width: 100%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-family: var(--en-font);
	font-size: clamp(2rem, 3.4vw, 3.4rem);
}
.contents-container{
	display: grid;
	grid-template-columns: 210px auto;
}
.contents-wrap{
	padding: 0 4vw clamp(104px, 16vw, 160px);
}
.side-nav-wrap {
	margin: 35vw 0 0;
	min-height: 100svh;
}
.side-nav {
	padding: 25vw 20px;
	height: 100%;
    background: url(../images/facility/nav-bg.jpg) no-repeat top center / cover;
    -webkit-mask-image: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 1.5%, rgba(0,0,0,1) 100%);
    mask-image: linear-gradient(180deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 1.5%, rgba(0,0,0,1) 100%);
}
.side-nav-lists{
    position: sticky;
    top: 40%;
	z-index: 3;
	transition: opacity 0.3s ease-out, visibility 0.3s ease-out;
    opacity: 1;
    visibility: visible;
}
.side-nav-lists.is-scrolling {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
}
.side-nav-item{
	margin-bottom: 32px;
}
.side-nav-item,
.sp-nav-item{
	counter-increment: li-num;
}
.nav-name{
	font-family: var(--en-font);
	font-size: 16px;
	color: var(--color-gray2);
	transition: all .3s ease-out;
}
.nav-name::before{
	content: "0"counter(li-num)". ";
}
.nav-name.is-active,
.nav-name:hover{
	color: var(--color-green);
}
.is-gold{
	color: var(--color-gold);
}
.is-gray{
	color: var(--color-gray);
}
.is-green{
	color: var(--color-green);
}
.page-heading{
	margin: 0 auto clamp(12px, 3vw, 54px);
	width: fit-content;
	display: flex;
	flex-direction: column;
	gap: 8px;
	font-size: clamp(3.6rem, 5vw, 5rem);
	letter-spacing: 0;
}
.font-jp{
	font-family: var(--jp-font);
}
.page-heading .small-text{
	font-size: clamp(13px, 1.4vw, 14px);
	color: var(--color-black);
	letter-spacing: .3rem;
	position: relative;
}
.page-heading .small-text::before,
.page-heading .small-text::after{
	content: "";
	position: absolute;
	top: 50%;
	background: var(--color-black);
	width: min(5vw, 58px);
	height: 1px;
}
.page-heading .small-text::before{
	left: 0;
}
.page-heading .small-text::after{
	right: 0;
}
.heading-wrap{
	margin-bottom: 2.2em;
	align-items: flex-end;
	justify-content: space-between;
	gap: 10px;
}
.heading-wrap .lead{
	margin: 0;
	font-size: clamp(1.8rem, 2.5vw, 2.5rem);
}
.solo-img{
	margin-bottom: 64px;
}
.grid-col-3{
	grid-template-columns: repeat(3, 1fr);
}
.grid-col-3-1{
	grid-template-columns: 1fr 1fr 1fr .92fr;
}
.grid-col-1-3{
	grid-template-columns: .86fr 1fr 1fr 1fr;
}
.grid-col-4{
	grid-template-columns: repeat(4, 1fr);
}
.eq-grid{
	gap: 40px clamp(16px, 2.4vw, 24px);
}
.eq-grid + .eq-grid{
	margin-top: 48px;
}
.eq-grid figure{
	margin-bottom: 16px;
}
.eq-name{
	font-size: clamp(1.5rem, 2vw, 2rem);
	line-height: 1.3;
}
.eq-grid .note{
	margin-bottom: 0;
}
.row-span2{
	grid-row: span 2;
}
.col-span2{
	grid-column: span 2;
}
.col-span3{
	grid-column: span 3;
}
.col-span4{
	grid-column: span 4;
}
.over-right{
    margin-inline: 0 min(-16px, calc(17 / 340 * -100vw));
}
.over-right.row-span2 .note{
	padding-right: 32%;
}
.inner.pb-0{
	padding-bottom: 0;
}
/* .kitchen{
	overflow: hidden;
} */
.kitchen .inner + .inner{
	padding-top: 0;
}
.sp-nav-wrap{
	display: none;
}
/* @media screen and (max-width: 1650px) {
	.over-right{
		margin-inline: 0 max(-16px, calc(12 / 340 * -100vw));
	}
} */
@media screen and (max-width: 767px) {
	.facility .main-content{
		position: relative;
		overflow: hidden;
	}
	.facility .main-content::before{
        content: "";
        width: 3%;
        height: 100%;
        display: block;
        position: absolute;
        inset: 0;
		top: -12%;
		left: -1.5%;
        z-index: -1;
        background: url(../images/facility/sp-bg-gra.png) repeat-y top left;
	}
	.contents-container{
		grid-template-columns: auto;
	}
	.contents-wrap{
		padding-inline: 0;
	}
	.side-nav-wrap{
		display: none;
	}
	.general-section .inner.inner-mid {
		margin-inline: auto;
	}
	.tab-lists.has-gap{
		gap: 8px;
	}
	.tab-lists.has-gap > .col-2{
		width: calc(50% - 4px);
	}
	.tab-lists-bottom{
		margin: 32px 0 0;
	}
	.tab{
		aspect-ratio: 340 / 180;
	}
	.heading-wrap .lead{
		margin-bottom: 1em;
		text-align: center;
	}
	.page-heading .small-text::before,
	.page-heading .small-text::after{
		width: 10vw;
	}
	.grid-col-3-1,
	.grid-col-4{
		grid-template-columns: repeat(2, 1fr);
	}
	
	.over-right{
		margin-right: -16px;
	}
	.kv-wrap{
		width: 100vw;
        margin: 0 calc(50% - 50vw);
		position: relative;
	}
	.heading-wrap{
		display: contents;
	}
	.facility .tertiary-heading{
		position: absolute;
        bottom: 4px;
        right: 8px;
		z-index: 1;
		color: var(--color-white);
		opacity: .8;
	}
	.sp-nav-wrap{
		margin: 32px calc(50% - 50vw) 48px;
		padding: 20px 10px 16px 42px;
		width: 100vw;
		display: block;
		background: rgba(235, 234, 234, .4);
	}
	.sp-nav-lists{
		gap: 16px 12px;
	}
	.sp-nav-item{
		width: calc(50% - 6px);
	}
	.solo-img{
		margin-inline: calc(50% - 50vw);
		width: 100vw;
	}
	.sp-order-0-1{
		order: -1;
	}
	.sp-order-1{
		order: 1;
	}
	.sp-order-2{
		order: 2;
	}
	.sp-order-3{
		order: 3;
	}
	.sp-order-4{
		order: 4;
	}
	.sp-order-5{
		order: 5;
	}
	.sp-order-6{
		order: 6;
	}
	.col-span4,
	.sp-col-2{
		grid-column: span 2;
	}
	.sp-col-1{
		grid-column: span 1;
	}
	.sp-mt-0{
		margin-top: 0;
	}
}


.security .page-heading .small-text::before,
.security .page-heading .small-text::after{
	width: 8vw;
}
.security-text-wrap .eq-name + .note{
	margin-bottom: 16px;
}
.security-grid{
	grid-template-columns: repeat(2, 1fr);
	gap: clamp(16px, 2.4vw, 24px);
}
.security-grid2{
	grid-template-columns: repeat(3, 1fr);
	gap: 0 8px;
}
.security-grid2 figure{
	margin-bottom: 0;
}
.security-grid2 + .caption + .note{
	margin-block: 0;
}
.caption.cap-sec{
	left: auto;
    right: 22%;
    bottom: -9px;
    margin: 0;
}
.caption.cap-sec2{
	bottom: -10px;
}
@media screen and (max-width: 767px) {
	.security .sp-nav-wrap{
		padding: 20px 10px 16px 56px;
	}
	.security-grid{
		display: flex;
		flex-direction: column;
		gap: 0;
	}
	.security-text-wrap{
		display: contents;
		gap: 0;
	}
	.security-grid2{
		margin-bottom: 32px;
		grid-template-columns: repeat(2, 1fr);
		gap: 8px;
	}
	.sp-security-flex{
		margin-top: 6px;
		display: flex;
		flex-direction: column-reverse;
		justify-content: center;
		gap: 6px;
	}
	.sp-security-flex .caption{
		text-align: left;
	}
	.sp-security-flex .note{
		margin-top: 0;
	}
	.caption.cap-sec{
		right: 8px;
		bottom: 0;
	}
	.eq-grid .circle-graph{
		margin-bottom: -6px;
	}
}