@charset "utf-8";

/* css Document
*****************************************************************/
@import "../../n_common/css/_variable.css";

.storage-outer{
	font-family: var(--font_min);
	padding: 64px 0 120px;
	color: #494544;
	@media (width < 810px) {
		padding: 32px 0 80px;
	}
}
.storage-catch{
	word-break: keep-all;
	font-size: clamp(18px, -2.769px + 2.564vw, 28px);/*28~18(1200~810)*/
	font-weight: 500;
}
.storage-ttl{
	font-size: clamp(40px, -26.462px + 8.205vw, 72px);/*72~40(1200~810)*/
	font-weight: 600;
	line-height: 1.4;
	color: #90D3EC;
	letter-spacing: 0.2em;
	margin-top: 32px;
	@media (width < 810px) {
		margin-top: 20px;
	}
}
.storage-container{
	padding: 40px 6.6cqw;/*80/1200*/
	background: #EAF6FD;
	margin-top: 24px;
	@media (width < 810px) {
		padding: 24px 20px;
		margin-top: 16px;
	}
}
.storage-closet__ttl{
	position: relative;
	border-bottom: 1px solid var(--main_c);
	container-type: inline-size;
	padding-bottom: 16px;
	@media (width < 810px) {
		padding-bottom: 12px;
	}
}
.storage-closet__ttl__sub{
	word-break: keep-all;
	font-size: clamp(18px, -2.769px + 2.564vw, 28px);/*28~18(1200~810)*/
	font-weight: 600;
	letter-spacing: 0.1em;
	color: var(--main_c);
}
.storage-closet__ttl__main{
	font-size: clamp(28px, -30.154px + 7.179vw, 56px);/*56~28(1200~810)*/
	font-weight: 700;
	line-height: 1.4;
	color: var(--main_c);
	margin-top: 4px;
	@media (width < 810px) {
		margin-top: 2px;
	}
}
.storage-closet__original{
	width: 15.8cqw;/*158/1000*/
	position: absolute;
	top: 3cqw;
	right: 4.8cqw;/*48/1000*/
	@media (width < 810px) {
		width: 88px;
		position: static;
		margin-inline: auto;
		margin-bottom: 10px;
	}
}
.storage-note{
	text-align: left;
	font-family: var(--font_gothic);
	font-size: clamp(14px, 1.538px + 1.538vw, 20px);/*20~14(1200~810)*/
	font-weight: 400;
	text-indent: -1em;
	padding-left: 1em;
	inline-size: fit-content;
	margin-inline: auto;
	margin-top: 16px;
	@media (width < 810px) {
		margin-top: 12px;
	}
}
.storage-txt{
	font-size: clamp(16px, 3.538px + 1.538vw, 22px);/*22~16(1200~810)*/
	font-weight: 500;
	line-height: 1.9;
	margin-top: 20px;
	@media (width < 810px) {
		text-align: left;
		margin-top: 16px;
	}
}
.storage-closet__img{
	margin-top: 40px;
	@media (width < 810px) {
		margin-top: 24px;
	}
	img{
		width: 100%;
	}
}
.img_cap{
	text-align: left;
	font-size: clamp(14px, 9.846px + 0.513vw, 16px);/*16~14(1200~810)*/
	font-family: var(--font_gothic);
	font-weight: 400;
	margin-top: 8px;
	@media (width < 810px) {
		margin-top: 4px;
	}
}
.storage-closet__flex{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	gap: 24px 0;
	margin-top: 24px;
}
.storage-closet__flex__img{
	width: 50%;
	@media (width < 500px) {
		width: 100%;
	}
}
.storage-closet__flex__inner{
	width: 46%;
	@media (width < 500px) {
		width: 100%;
	}
}
.storage-closet__flex__list{
	word-break: keep-all;
	font-size: clamp(18px, -2.769px + 2.564vw, 28px);/*28~18(1200~810)*/
	font-weight: 600;
	line-height: 1.4;
	margin-top: 28px;
	margin-inline: auto;
	max-width: 320px;
	@media (width < 810px) {
		margin-top: 20px;
	}
	@media (width < 500px) {
		max-width: inherit;
	}
	>li {
		padding: 0.4em 0.6em;
		color: var(--main_c);
		background: #90D3EC;
		border-radius: 10px;
		margin-top: 16px;
		@media (width < 810px) {
			border-radius: 6px;
			margin-top: 10px;
		}
		&:first-of-type{
			margin-top: 0;
		}
	}
}
.storage-closet__movie{
	margin-top: 48px;
	@media (width < 810px) {
		margin-top: 32px;
	}
	iframe{
		width: 100%;
		height: 100%;
		object-fit: cover;
		aspect-ratio: 16 / 9;
	}
}

.storage-walkin__block{
	max-width: 300px;
	margin-inline: auto;
	margin-top: 32px;
	@media (width < 810px) {
		margin-top: 16px;
	}
}

.storage-common__ttl{
	max-width: 480px;
	margin-inline: auto;
	padding-bottom: 16px;
	border-bottom: 1px solid var(--main_c);
	@media (width < 810px) {
		max-width: 320px;
		padding-bottom: 12px;
	}
}
.storage-common__ttl__sub{
	word-break: keep-all;
	font-size: clamp(16px, 3.538px + 1.538vw, 22px);/*22~16(1200~810)*/
	font-weight: 600;
	letter-spacing: 0.1em;
	color: var(--main_c);
}
.storage-common__ttl__main{
	font-size: clamp(24px, -9.231px + 4.103vw, 40px);/*40~24(1200~810)*/
	font-weight: 700;
	color: var(--main_c);
	line-height: 1.4;
	margin-top: 4px;
}
.storage-flex{
	display: flex;
	gap: 24px 0;
	margin-top: 64px;
	background: #fff;
	@media (width < 810px) {
		padding: 24px 20px;
		flex-direction: column;
		margin-top: 40px;
	}
	&.--reverse{
		flex-direction: row-reverse;
		@media (width < 810px) {
			flex-direction: column;
		}
	}
}
.storage-flex__inner{
	flex-grow: 1;
	padding: 48px 32px;
	@media (width < 810px) {
		width: 100%;
		padding: 0;
	}
}
.storage-flex__txt{
	text-align: left;
	font-size: clamp(16px, 3.538px + 1.538vw, 22px);/*22~16(1200~810)*/
	font-weight: 500;
	margin-top: 24px;
	@media (width < 810px) {
		margin-top: 16px;
	}
}
.storage-flex__subtxt{
	text-align: left;
	font-family: var(--font_gothic);
	font-size: clamp(0.875rem, 0.787rem + 0.376vw, 1.125rem);/*18~14(1200~810)*/
	font-weight: 400;
	margin-top: 16px;
	@media (width < 810px) {
		margin-top: 12px;
	}
}
.storage-flex__img{
	flex-shrink: 0;
	width: 46.5%;
	position: relative;
	@media (width < 810px) {
		width: 100%;
		max-width: 300px;
		margin-inline: auto;
	}
	img{
		width: 100%;
		height: 100%;
		object-fit: cover;
	}
}
.storage-flex__img__cap{
	font-size: clamp(14px, 9.846px + 0.513vw, 16px);/*16~14(1200~810)*/
	font-weight: 400;
	font-family: var(--font_gothic);
	color: #fff;
	position: absolute;
	bottom: 8px;
	right: 8px;
}
.storage-block{
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 20px;
	margin-top: 32px;
	@media (width < 810px) {
		gap: 20px 16px;
		margin-top: 20px;
	}
	@media (width < 500px) {
		flex-direction: column;
		align-items: stretch;
	}
}
.storage-block__list{
	flex-shrink: 0;
	word-break: keep-all;
	font-size: clamp(17px, 2.462px + 1.795vw, 24px);/*24~17(1200~810)*/
	font-weight: 600;
	line-height: 1.4;
	@media (width < 810px) {
		flex-grow: 1;
	}
	>li {
		padding: 0.4em 0.6em;
		color: var(--main_c);
		background: #90D3EC;
		border-radius: 10px;
		margin-top: 16px;
		@media (width < 810px) {
			border-radius: 6px;
			margin-top: 10px;
		}
		&:first-of-type{
			margin-top: 0;
		}
	}
}
.storage-block__img{
	flex-grow: 1;
}

.storage-place{
	margin-top: 104px;
	@media (width < 810px) {
		margin-top: 64px;
	}
}
.storage-place__ttl{
	padding: 0.3em 0.6em;
	background: var(--main_c);
	color: #fff;
	font-size: clamp(20px, -17.385px + 4.615vw, 38px);/*38~20(1200~810)*/
	font-weight: 600;
	letter-spacing: 0.1em;
	line-height: 1.4;
}
.storage-place__list{
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 40px 4.8cqw;/*48/1000*/
	margin-top: 56px;
	@media (width < 810px) {
		gap: 32px 20px;
		margin-top: 32px;
	}
	@media (width < 500px) {
		grid-template-columns: repeat(1, 1fr);
	}
	&.--second{
		@media (width < 500px) {
			grid-template-columns: repeat(2, 1fr);
		}
	}
	+.storage-place__list{
		margin-top: 40px;
		@media (width < 810px) {
			margin-top: 24px;
		}
	}
}
.storage-place__img{
	@media (width < 500px) {
		max-width: 300px;
		margin-inline: auto;
	}
}
.storage-place__name{
	word-break: keep-all;
	font-size: clamp(19px, -16.308px + 4.359vw, 36px);/*36~19(1200~810)*/
	font-weight: 600;
	color: var(--main_c);
	line-height: 1.4;
	margin-top: 12px;
	@media (width < 810px) {
		margin-top: 10px;
	}
}
.storage-place__note{
	text-align: left;
	font-size: clamp(14px, 1.538px + 1.538vw, 20px);/*20~14(1200~810)*/
	font-family: var(--font_gothic);
	font-weight: 400;
	margin-inline: auto;
	margin-top: 4px;
	inline-size: fit-content;
	text-indent: -1em;
	padding-left: 1em;
}
.storage-place__txt{
	text-align: left;
	font-size: clamp(16px, 3.538px + 1.538vw, 22px);/*22~16(1200~810)*/
	font-weight: 500;
	line-height: 1.5;
	margin-top: 16px;
	@media (width < 810px) {
		margin-top: 10px;
	}
}