@charset "utf-8";

/* =======================================================================================
	TEMPLATE
======================================================================================= */

/* ------------------------------------------------------------------------
	メインビジュアルをスティッキー固定している場合の対策
------------------------------------------------------------------------ */
	.wrapper {
		overflow: clip;
	}



/* bnr_onlinesalonWrap
------------------------------------------------------------------------ */
	.bnr_onlinesalonWrap {}


/* mainElementFooterWrap
------------------------------------------------------------------------ */
	.mainElementFooterWrap {
		padding-top: 50px;
	}
	.pageLastCaptionWrap {
		padding-bottom: 0;
	}
@media screen and (max-width: 736px) {
	.mainElementFooterWrap {
		padding-top: 30px;
	}
	.pageLastCaptionWrap {
		padding-bottom: 20px;
	}
}



/* =======================================================================================
	COMMON
======================================================================================= */

/* main | メインビジュアルをスティッキーヘッダーと重ねる場合「margin-top:0;」にする。 | （ざっくり対応ver ※厳密にする場合はJSで
------------------------------------------------------------------------ */
/*@media screen and (max-width: 1200px) {
	main { margin-top: var(--site-stickyHeader-height); }
}
@media screen and (max-width: 736px) {
	main { margin-top: 0; }
}*/
@media screen and (max-width: 1200px) {
	main {
		margin-top: var(--js-site-actionButtonMenuSP-height);
	}
}



/* =======================================================================================
	PAGE
======================================================================================= */

/* mainVisualWrap
------------------------------------------------------------------------ */
	.mainVisualWrap {
		background: #eee;
	}
	.mainVisualBox {
		text-align: center;
	}
	.mainVisualBox img {
		width: 100%;
		max-width: none;
		height: auto;
	}



/* meritWrap
------------------------------------------------------------------------ */
	.meritWrap {
		position: relative;
		z-index: 0;
		padding: clamp(15px, (30 / 1200 * 100vw), 30px) 0;
	}
	.meritBox {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
		max-width: 1330px;
		margin-left: auto;
		margin-right: auto;
	}
	.meritUnit {
		display: grid;
		place-content: center;
		line-height: 1.65;
		font-size: clamp(1.5rem, (22.8 / 1330 * 100vw), 2.28rem);
		text-align: center;
		letter-spacing: .135em;
		padding: 0 clamp(10px, (25 / 1600 * 100vw), 25px);
		border-left: 1px solid rgba(50, 50, 50, .71);
	}
	.meritUnit:nth-of-type(1) {	flex-basis: 34.75%; border-left: none;}
	.meritUnit:nth-of-type(2) {	flex-basis: 32%;}
	.meritUnit:nth-of-type(3) {	flex-basis: 33.25%;}

	.meritUnit .en {
		line-height: 1.2;
		font-family: var(--site-font_family-en_1);
		font-size: 1.12em;
	}
	.meritUnit .num {
		line-height: .8;
		font-family: var(--site-font_family-en_1);
		font-size: 2.25em;
		font-style: italic;
		letter-spacing: .0125em;
		margin-right: .025em;
	}
	.meritUnit .color {
		color: rgba(var(--site-themeColor-main), 1);
	}
	.meritUnit .txtL {
		line-height: 1.2;
		font-size: 1.25em;
	}
	.meritUnit br.SPs_only {
		display: none;
	}
	/* ---------- trainBox */
	.meritUnit .trainBox {
		text-align: left;
		letter-spacing: .045em;
	}
	.meritUnit .trainBox + .trainBox {
		margin-top: .175em;
	}
	.meritUnit .train_line {
		display: block;
		font-size: max(.95rem, .541667em);
		letter-spacing: .02em;
		margin-bottom: -.4em;
	}
	.meritUnit .train_station {
		display: inline-block;
		width: 5.5em;
		line-height: 1.1;
		font-size: 1.37em;
		font-weight: 500;
		text-align: justify;
		text-align-last: justify;
		letter-spacing: .04em;
	}
	.meritUnit .train_minutes .num {
		display: inline-block;
		width: 1.05em;
		line-height: .7;
		text-align: right;
		letter-spacing: -.02em;
		padding-right: .03em;
	}
@media screen and (max-width: 736px) {
	.meritWrap {
		text-align: center;
		padding: clamp(20px, (40 / 540 * 100vw), 40px) 5vw;
	}
	.meritWrap .bgWavyBox {
		--default-bgWavyBox-pattern-bgPosition:	center 30%;
		--default-bgWavyBox-pattern-scale:		-1.85 1.85;
		--default-bgWavyBox-pattern-rotate:		0deg;
		--default-bgWavyBox-pattern-opacity:	.34;
		--default-bgWavyBox-pattern-translateX:	20%;
		--default-bgWavyBox-pattern-translateY:	16%;
		--default-bgWavyBox-gradient-top-height:	min(25%, 200px);
		--default-bgWavyBox-gradient-bottom-height:	min(25%, 200px);
	}
	.meritBox {
		display: inline-block;
		text-align: left;
	}
	.meritUnit {
		font-size: clamp(1.45rem, (24 / 540 * 100vw), 2.4rem);
		text-align: center;
		letter-spacing: .1em;
		padding: clamp(15px, (25 / 540 * 100vw), 25px) 0;
		border-left: none;
		border-top: 1px solid rgba(50, 50, 50, .3);
	}
	.meritUnit:nth-of-type(1) {	border-top: none;}
	
	.meritUnit .train_line {
		font-size: max(.915rem, .55em);
	}
	/* ---------- trainBox */
	.meritUnit .trainBox + .trainBox {
		margin-top: .35em;
	}
}
@media screen and (max-width: 480px) {
	.meritUnit br.SPs_only {
		display: inline;
	}
}



/* bukkenInfoWrap
------------------------------------------------------------------------ */
	.bukkenInfoWrap {
		background: #dfdfdf url("../images/index/info_bg_01.jpg") center center / cover no-repeat;
		padding: min((115 / 1500 * 100vw), 115px) 0 min((150 / 1500 * 100vw), 150px);
	}
	.bukkenInfoBox {
		width: var(--site-sizeContentWide-M1);
		max-width: 1360px;
		background: #fff;
		margin-left: auto;
		margin-right: auto;
		padding: min((80 / 1500 * 100vw), 80px);
		box-shadow: 0 9px 10px 0 rgba(0, 0, 0, .29);
	}



/* informationSection
------------------------------------------------------------------------ */
	.informationSection {
	}
	.informationHeading {
		display: grid;
		grid-template-columns: minmax(.5em, 1fr) auto minmax(.5em, 1fr);
		align-items: center;
		gap: 0 .9em;
		line-height: 1.35;
		font-family: var(--site-font_family-en_1);
		font-size: clamp(1.52rem, (19 / 1200 * 100vw), 1.9rem);
		text-align: center;
		letter-spacing: .06em;
		margin-bottom: 40px;
	}
	.informationHeading::before,
	.informationHeading::after {
		content: "";
		width: 100%;
		height: 0;
		margin-bottom: -.25em;
		border-top: 1px solid #777;
	}
	.informationBody {
	}
	.informationBody .noticeWrap {}
	.informationBody .noticeWrap .noticeBtnBox {}



/* entryflowSection
------------------------------------------------------------------------ */
	.entryflowSection {
		--index-entryflowSection-color_main:	#114a74;
		--index-entryflowSection-color_sub:		#dfe7f4;
		margin-top: 55px;
	}
	.entryflowHeading {
		line-height: 1.45;
		color: var(--index-entryflowSection-color_main);
		font-size: clamp(2.5rem, (35 / 1350 * 100vw), 3.5rem);
		text-align: center;
		letter-spacing: .1em;
		margin-bottom: 1em;
	}
	.entryflowBody {
		font-size: clamp(1.2rem, (18 / 1500 * 100vw), 1.8rem);
		letter-spacing: .06em;
	}
	.entryflowList {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 0 min((50 / 1360 * 100%), 50px);
	}
	.entryflowList > li {
		position: relative;
		z-index: 0;
		background: var(--index-entryflowSection-color_sub);
	}
	.entryflowList > li:nth-of-type(n+2)::before {
		content: "";
		position: absolute;
		inset: 50% auto auto 0;
		z-index: 1;
		background: #c7b299;
		width: min((16 / 1600 * 100vw), 16px);
		aspect-ratio: 1 / 2.375;
		clip-path: polygon(0 0, 0% 100%, 100% 50%);
		translate: -180% -50%;
	}
	.entryflowList > li .ph {
		position: relative;
	}
	.entryflowList > li .ph .imgcapkeep {
		font-size: 1rem;
		letter-spacing: .01em;
	}
	.entryflowList > li .ttl {
		line-height: 1.35;
		color: #fff;
		font-family: var(--site-font_family-en_1);
		text-align: center;
		background: var(--index-entryflowSection-color_main);
		padding: .9em .65em;
	}
	.entryflowList > li .ttl em {
	}
	.entryflowList > li .description {
		color: #6d6c6c;
		text-align: center;
		padding: 1.3em;
	}
	.entryflowList > li .description .term {
		display: grid;
		place-content: center;
		line-height: 1.556;
		color: var(--index-entryflowSection-color_main);
		margin-bottom: 20px;
	}
	.entryflowList > li .description .term em {
	}
	.entryflowList > li .description .txt {
		line-height: 1.583;
		font-size: max(1.1rem, .667em);
	}
	/* -- Individual -- */
	.entryflowList .flow1 {
	}
	.entryflowList .flow2 {
	}
	.entryflowList .flow2 .ph .imgcapkeep .bk {
		color: #000;
		text-shadow: 0 0 9px rgba(234,237,234,.9), 0 0 9px rgba(234,237,234,.9), 0 0 5px rgba(234,237,234,.5), 0 0 2px rgba(234,237,234,.5), 0 0 1px rgba(234,237,234,.5), 0px 1px 1px rgba(234,237,234,.5), 0px -1px 1px rgba(234,237,234,.5), 1px 0px 1px rgba(234,237,234,.5), -1px 0px 1px rgba(234,237,234,.5), 1px 1px 1px rgba(234,237,234,.5), -1px 1px 1px rgba(234,237,234,.5), 1px -1px 1px rgba(234,237,234,.5), -1px -1px 1px rgba(234,237,234,.5), .5px .5px .5px rgba(234,237,234,.7);
	}
	.entryflowList .flow3 {
	}
	.entryflowList .flow3 .description .txt {
		margin-top: -20px; /* 位置調整。不要なら削除可 */
		margin-bottom: 1.35em;
	}
	.entryflowList .flow3 .description ol {
		display: inline-block;
		line-height: 1.5;
		font-size: max(1rem, .556em);
		text-align: left;
	}
	.entryflowList .flow3 .description ol li {
		display: grid;
		grid-template-columns: .85em 1fr;
		gap: 0 .2em;
		margin-top: .35em;
	}
	.entryflowList .flow3 .description ol li::before {
		content: "";
		background: currentColor;
		height: 1em;
		aspect-ratio: .8 / .95;
		clip-path: polygon(0 0, 0% 100%, 100% 50%);
		translate: 0 .275em;
	}
@media screen and (max-width: 1050px) {
	.entryflowSection {
		margin-top: 65px;
	}
	.entryflowHeading {
		margin-bottom: 1.2em;
	}
	.entryflowBody {
		font-size: clamp(1.2rem, (18 / 1000 * 100vw), 1.8rem);
	}
	.entryflowList {
		grid-template-columns: 1fr;
		gap: 36px 0;
	}
				/* ============
					GRID （1050px～736px）
				============ */
				.entryflowList > li {
					display: grid;
					grid-template: 
						"ph ttl" auto
						"ph desc" 1fr /
						1fr 1fr;
					min-height: 260px;
				}
				.entryflowList > li .ph {			grid-area: ph;}
				.entryflowList > li .ttl {			grid-area: ttl;}
				.entryflowList > li .description {	grid-area: desc; align-self: center;}

	.entryflowList > li:nth-of-type(n+2)::before {
		inset: 0 auto auto 50%;
		width: auto;
		height: calc(36px / 2.3);
		aspect-ratio: 3.5 / 1;
		clip-path: polygon(0 0, 100% 0%, 50% 100%);
		translate: -50% -155%;
	}
	.entryflowList > li .ph {
		position: relative;
	}
	.entryflowList > li .ph img {
		position: absolute;
		inset: 0;
		z-index: 0;
		width: 100%;
		max-width: none;
		height: 100%;
		object-fit: cover;
		object-position: 50% 50%;
	}
	.entryflowList .flow3 .description .txt {
		margin-top: 0; /* リセット */
	}
}
@media screen and (max-width: 736px) {
	.entryflowSection {
		margin-top: 50px;
	}
	.entryflowHeading {
		font-size: clamp(1.7rem, (23 / 540 * 100vw), 2.3rem);
		margin-bottom: 30px;
	}
	.entryflowBody {
		font-size: clamp(1.3rem, (18 / 540 * 100vw), 1.8rem);
	}
	.entryflowList {
		gap: clamp(30px, (55 / 540 * 100vw), 55px) 0;
	}
	.entryflowList > li {
		display: block;
		min-height: 0;
	}
	.entryflowList > li:nth-of-type(n+2)::before {
		height: calc(clamp(30px, (55 / 540 * 100vw), 55px) / 2);
		aspect-ratio: 2 / 1;
		translate: -50% -142%;
	}
	.entryflowList > li .ph {
		display: none;
	}
	.entryflowList > li .description {
		padding: 1.5em 1.1em 1.8em;
	}
	.entryflowList > li .description .term {
		margin-bottom: clamp(.8em, (20 / 540 * 100vw), 20px);
	}
}





/* innerpageLinkWrap
------------------------------------------------------------------------ */
	.innerpageLinkWrap {}



/* innerpageLinkUnit | 共通設定
---------------------------------------------------- */
	.innerpageLinkUnit {
		position: relative;
		z-index: 0;
		padding-top:	clamp(120px, (230 / 1600 * 100vw), 230px);
		padding-bottom:	clamp(140px, (240 / 1600 * 100vw), 240px);
	}
	.innerpageLinkUnit::before { /* 下部白ぼかし（背景画像がある場合の念のための処理） */
		content: "";
		position: absolute;
		inset: auto 0 0;
		z-index: 0;
		height: min(25%, 510px);
		background: linear-gradient(to top, rgba(255, 255, 255, 1) 20%, rgba(255, 255, 255, .05) 95%, rgba(255, 255, 255, 0) 100%);
	}
	.innerpageLinkUnit::after { /* 背景画像のキャプション | HTMLにデータ属性で設定したものを取得します */
		content: attr(data-innerpagelinkunit-bgimg_caption);
		position: absolute;
		inset: 0 0 auto auto;
		z-index: 0;
		line-height: 1.35;
		color: #000;
		font-family: var(--site-font_family-sans);
		font-size: 1rem;
		font-weight: 300;
		letter-spacing: .02em;
		padding: 1.25em;
		opacity: .57;
	}
	.innerpageLinkUnitInner {
		position: relative;
		z-index: 0;
		max-width: var(--site-sizeMaxWidth-XL);
		margin-left: auto;
		margin-right: auto;
	}
@media screen and (max-width: 736px) {
	.innerpageLinkUnit {
		padding-top:	clamp(50px, (70 / 540 * 100vw), 70px);
		padding-bottom:	clamp(50px, (70 / 540 * 100vw), 70px);
	}
	.innerpageLinkUnit::before {
		height: min(50%, 450px);
		background: linear-gradient(to top, rgba(255, 255, 255, 1) 17%, rgba(255, 255, 255, .05) 95%, rgba(255, 255, 255, 0) 100%);
	}
}


/* Ph , Logo , Title , Description | 共通設定
---------------------------------------------------- */
	.innerpageLinkHeadBox {
		position: relative;
		z-index: 0;
	}
	.innerpageLinkHeadBox::before { /* 背面色ベタ(PC) */
		content: "";
		position: absolute;
		inset: 0;
		z-index: -1;
		background: linear-gradient(-135deg, rgba(var(--site-themeColor-sub), 1) 0%, rgba(255,255,255, 0) 100%);
		opacity: .75;
		pointer-events: none;
	}
	.innerpageLinkPh {
	}
	.innerpageLinkPh img {
		width: 100%;
		max-width: none;
		height: auto;
	}
	.innerpageLinkPh .ph {
		position: relative;
	}
	.innerpageLinkPh .ph .imgcapkeep {
		font-size: 1rem;
		padding: 1.1em 1.4em;
	}
	.innerpageLinkLogo {
	}
	.innerpageLinkTitle {
		line-height: 1.933;
		font-size: clamp(1.6rem, (30 / 1800 * 100vw), 3rem);
		letter-spacing: .11em;
		margin-top: min((130 / 1800 * 100vw), 130px);
	}
	.innerpageLinkTitle::before { /* 背面色ベタ(SP) */
		content: none;
	}
	.innerpageLinkDescription {
		width: 75%;
		max-width: 1095px;
		line-height: 2.1;
		font-size: clamp(1.5rem, (20 / 1600 * 100vw), 2rem);
		text-shadow: 0 0 .5em rgba(255, 255, 255, .8), 0 0 1em rgba(255, 255, 255, .7), 0 0 3em rgba(255, 255, 255, .6), 0 0 5em rgba(255, 255, 255, .6);
		letter-spacing: .09em;
		margin-top: clamp(40px, (120 / 1800 * 100vw), 120px);
		margin-left: auto;
		margin-right: auto;
	}
	.innerpageLinkDescription .description {
	}
@media screen and (min-width: 736.02px) {
	/* ===== PC時はそれぞれレイアウトが違うため個別に設定します ===== */
	.innerpageLinkHeadBox {
		display: grid;
	/*	grid-template: 
			"iplHead-logo  iplHead-ph" auto
			"iplHead-title iplHead-ph" 1fr /
			auto auto;
		justify-content: space-between;
		align-items: start;
		grid-template-columns:	1fr	min((1280 / 1920 * 100vw), 1280px);
		gap: 					0	min((75 / 1920 * 100vw), 75px);
		padding-left:				min((150 / 1920 * 100vw), 150px);*/		/* ※個別に設定 */
	}
	:where(.innerpageLinkHeadBox) .innerpageLinkPh {	grid-area: iplHead-ph;}
	:where(.innerpageLinkHeadBox) .innerpageLinkLogo {	grid-area: iplHead-logo;}
	:where(.innerpageLinkHeadBox) .innerpageLinkTitle {	grid-area: iplHead-title;}
}
@media screen and (max-width: 1050px) {
	.innerpageLinkDescription {
		font-size: clamp(1.35rem, (15 / 850 * 100vw), 1.5rem);
	}
}
@media screen and (max-width: 736px) {
	.innerpageLinkHeadBox::before { /* 背面色ベタ(PC) */
		content: none;
	}
	.innerpageLinkPh {
		position: relative;
		z-index: 1; /* 背面色ベタ(SP) より上に来るように */
		width: 100%;
	}
	.innerpageLinkLogo {
		position: relative;
		z-index: 1; /* 背面色ベタ(SP) より上に来るように */
		/*width: 75%;*/
		margin-top: min((60 / 540 * 100vw), 60px);
		margin-left: auto;
		margin-right: auto;
		padding: 0 calc((100% - 75%) / 2);
	}
	.innerpageLinkLogo img {
		max-width: 380px;
	}
	.innerpageLinkTitle {
		position: relative;
		z-index: 0;
		/*width: 75%;*/
		font-size: clamp(1.9rem, (24.5 / 540 * 100vw), 2.45rem);
		margin-top: 0;
		margin-left: auto;
		margin-right: auto;
		padding: clamp(20px, (40 / 540 * 100vw), 40px)
				 calc((100% - 75%) / 2)
				 20px;
	}
	.innerpageLinkTitle::before { /* 背面色ベタ(SP) */
		content: "";
		position: absolute;
		inset: auto 0 0;
		z-index: -1;
		width: 100%;
		height: calc( min((60 / 540 * 100vw), 60px)	/* ロゴの上余白 */
					 + min(90 / 537 * 100vw, 90px)	/* ロゴの高さ */
					 + 100%							/* タイトルエリアの高さ */
					 + 30px );						/* ちょっと多めに */
		background: linear-gradient(-90deg, rgba(var(--site-themeColor-sub), 1) 0%, rgba(255,255,255, 0) 100%);
		opacity: .75;
		pointer-events: none;
	}
	.innerpageLinkDescription {
		width: 75%;
		font-size: clamp(1.3rem, (13 / 540 * 100vw), 1.4rem);
		margin-top: min((20 / 540 * 100vw), 20px);
	}
}
@media screen and (max-width: 420px) {
	.innerpageLinkLogo,
	.innerpageLinkTitle {
		padding-left:	calc((100% - 82%) / 2);
		padding-right:	calc((100% - 82%) / 2);
	}
	.innerpageLinkDescription {
		width: 82%;
	}
	.innerpageLinkDescription .description br[aria-hidden="true"] {
		display: none;
	}
}
/* ==============
	ANIME
============== */
@media screen {
	[data-js_show_target="innerpageLinkHeadBox"] {
		transform: translateY(50px);
		opacity: 0;
	}
	[data-js_show_target-passed="innerpageLinkHeadBox"] {
		transform: translateY(0px);
		opacity: 1;
		transition: transform 600ms var(--M-easing-easeInOutCubic) 100ms,
					opacity 1100ms var(--M-easing-easeInOutCubic) 0ms;
	}
	[data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkLogo,
	[data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkTitle {
		animation: 700ms var(--M-easing-easeInOutCubic) 700ms both ANIME-ipl-moveRight;
	}
	[data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkPh {
		animation: 700ms var(--M-easing-easeInOutCubic) 700ms both ANIME-ipl-moveAndStretchRight;
	}
}
@media screen and (max-width: 736px) {
	[data-js_show_target-passed="innerpageLinkHeadBox"] {
		transition-duration: 0ms, 1000ms;
		transition-delay: 200ms, 0ms;
	}
	[data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkLogo,
	[data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkTitle,
	[data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkPh {
		animation-delay: 200ms;
	}
}
@keyframes ANIME-ipl-moveLeft {
	0% {	opacity: 0;	transform: translateX(30px);}
	70% {	opacity: 1;}
	100% {	opacity: 1;	transform: translateX(0px);}
}
@keyframes ANIME-ipl-moveRight {
	0% {	opacity: 0;	transform: translateX(-30px);}
	70% {	opacity: 1;}
	100% {	opacity: 1;	transform: translateX(0px);}
}
@keyframes ANIME-ipl-moveAndStretchLeft {
	0% {	opacity: 0;	transform: translateX(-50px);	clip-path: inset(0 0 0 100%);}
	70% {	opacity: 1;}
	85% {												clip-path: inset(0 0 0 0);}
	100% {	opacity: 1;	transform: translateX(0px);		clip-path: inset(0 0 0 0);}
}
@keyframes ANIME-ipl-moveAndStretchRight {
	0% {	opacity: 0;	transform: translateX(50px);	clip-path: inset(0 100% 0 0);}
	70% {	opacity: 1;}
	85% {												clip-path: inset(0 0 0 0);}
	100% {	opacity: 1;	transform: translateX(0px);		clip-path: inset(0 0 0 0);}
}
@keyframes ANIME-ipl-stretchLeft {
	0% {	opacity: 0;	clip-path: inset(0 0 0 100%);}
	70% {	opacity: 1;}
	100% {	opacity: 1;	clip-path: inset(0 0 0 0);}
}
@keyframes ANIME-ipl-stretchRight {
	0% {	opacity: 0;	clip-path: inset(0 100% 0 0);}
	70% {	opacity: 1;}
	100% {	opacity: 1;	clip-path: inset(0 0 0 0);}
}


/* innerpageLinkBnBox | 共通設定
---------------------------------------------------- */
	.innerpageLinkBnBox {
		margin-top: min((40 / 736 * 100vw), 60px);
	}
	.innerpageLinkBnBox a {
		display: grid;
		grid-template-columns: 1fr clamp(12em, (270 / 1095 * 100%), 270px);
		justify-content: space-between;
		position: relative;
		z-index: 0;
		width: 75%;
		max-width: 1095px;
		aspect-ratio: 1095 / 220;
		overflow: hidden;
		color: #fff;
		font-size: clamp(1.6rem, (22 / 1650 * 100vw), 2.2rem);
		text-shadow: 0 -1px 1px #000, 0 0 1px #000, 0 0 3px #000, 0 0 .45em #000;
		margin-left: auto;
		margin-right: auto;
	}
	.innerpageLinkBnBox a .bnTxt {
		display: grid;
		align-items: center;
		line-height: 1.69;
		letter-spacing: .08em;
		padding: .75em 4px .75em calc(.75em + 25px);
	}
	.innerpageLinkBnBox a .bnName {
		display: grid;
		grid-template-columns: 1fr;
		align-content: center;
		align-items: center;
		gap: .35em;
		position: relative;
		z-index: 0;
		width: 70.370370%;
		line-height: 1.1;
		color: #fff;
		font-family: var(--site-font_family-en_1);
		font-size: max(1.1rem, .77em);
		text-align: center;
		letter-spacing: .01em;
		margin-left: auto;
		margin-right: auto;
		padding: .575em 0 .725em;
	}
	.innerpageLinkBnBox a .bnName .label {
		padding: 0 1.1em;
	}
	.innerpageLinkBnBox a .bnName .arrow {
		position: relative;
		width: 100%;
		height: 0;
		border-top: 1px solid;
	}
	.innerpageLinkBnBox a .bnName .arrow::after {
		content: "";
		position: absolute;
		inset: auto 0 0 auto;
		width: 1.1em;
		height: 0;
		border-top: 1px solid;
		transform: rotate(45deg) skewX(-45deg);
		transform-origin: right bottom;
	}
	.innerpageLinkBnBox a .bnBg {
		position: absolute;
		inset: 0;
		z-index: -1;
		background: #000;
	}
	.innerpageLinkBnBox a .bnBg img {
		width: 100%;
		max-width: none;
		height: 100%;
		object-fit: cover;
		object-position: 50% 50%;
		opacity: .37;
	}
	.innerpageLinkBnBox a .bnBg .imgcapkeep {
		/*inset: auto auto 0 0;*/
		line-height: 1.1;
		font-family: var(--site-font_family-sans);
		font-size: clamp(.8rem, (9 / 480 * 100vw), .9rem);
		font-weight: 300;
		text-shadow: 0 0 2px #000;
		letter-spacing: .03em;
		padding: .85em .9em;
		opacity: .65;
	}
	
	/* hover */
	.innerpageLinkBnBox a[href] .bnBg img {
		transition: scale .8s var(--M-easing-easeOutQuint),
					opacity .9s var(--M-easing-easeOutQuint);
	}
	@media (hover: hover) and (pointer: fine) {
		.innerpageLinkBnBox a[href]:hover .bnBg img {
			scale: 1.09;
			opacity: .47;
		}
	}
	.innerpageLinkBnBox a[href]:focus-visible .bnBg img {
			scale: 1.09;
			opacity: .47;
	}
@media screen and (max-width: 1050px) {
	.innerpageLinkBnBox a {
		font-size: clamp(1.3rem, (15 / 850 * 100vw), 1.5rem);
	}
	@media (hover: hover) and (pointer: fine) {
		.innerpageLinkBnBox a[href]:hover .bnBg img {
			scale: 1.13;
			opacity: .5;
		}
	}
	.innerpageLinkBnBox a[href]:focus-visible .bnBg img {
			scale: 1.13;
			opacity: .5;
	}
}
@media screen and (max-width: 736px) {
	.innerpageLinkBnBox {
		margin-top: clamp(40px, (60 / 540 * 100vw), 60px);
	}
	.innerpageLinkBnBox a {
		grid-template-columns: 1fr clamp(125px, (140 / 440 * 100%), 140px);
		aspect-ratio: 360 / 80;
		font-size: clamp(1rem, (13 / 460 * 100vw), 1.3rem);
	}
	.innerpageLinkBnBox a .bnTxt {
		display: grid;
		align-items: center;
		line-height: 1.69;
		letter-spacing: .08em;
		padding-left: 20px;
	}
	.innerpageLinkBnBox a .bnName {
		width: 75%;
	}
	.innerpageLinkBnBox a .bnName .label {
		padding: 0 .95em;
	}
}
@media screen and (max-width: 480px) {
	.innerpageLinkBnBox a {
		aspect-ratio: 360 / 90;
	}
}
@media screen and (max-width: 420px) {
	.innerpageLinkBnBox a {
		width: 90%;
		max-width: 360px;
	}
}
@media screen and (max-width: 359.98px) {
	.innerpageLinkBnBox a {
		aspect-ratio: 360 / 100;
	}
	.innerpageLinkBnBox a .bnTxt {
		line-height: 1.555;
	}
	/*.innerpageLinkBnBox a .bnTxt .inbl {
		display: inline;
	}*/
}
/* ==============
	ANIME
============== */
@media screen {
	[data-js_show_target="innerpageLinkBnBox"] {
		opacity: 1;
	}
	[data-js_show_target="innerpageLinkBnBox"] a::before {
		content: "";
		position: absolute;
		inset: 0;
		z-index: 0;
		height: 0;
		width: 100%;
		padding-top: 100%;
		background: rgba(255, 255, 255, .7);
		transform: translate(-100%, -100%) rotate(-45deg) scale(1);
		transform-origin: center center;
		pointer-events: none;
	}
	[data-js_show_target-passed="innerpageLinkBnBox"] a::before {
		animation: 7300ms ease-out 50ms ANIME-M_shinyEffect_toRight;
	}
}



/* ----------------------------------------------------
	conceptContainer
---------------------------------------------------- */
	.conceptContainer {
		background: url("../images/index/concept_bg.jpg") center top / cover no-repeat;
		padding: clamp(130px, (220 / 1600 * 100vw), 220px) 0 clamp(110px, (190 / 1600 * 100vw), 190px);
	}
	.conceptSection {
	}
	.conceptSection > [data-js_show_target_suite="moveUp30"] [data-js_show_target_suite_descendant] {
		opacity: .01;
		/*transition-timing-function: var(--M-easing-easeInOutCubic);*/
	}
	.conceptSection > [data-js_show_target_suite-passed="moveUp30"] [data-js_show_target_suite_descendant] {
		opacity: 1;
	}
	.conceptSection .logo01 {
		width: clamp(260px, (323 / 1450 * 100vw), 323px);		/*width: clamp(204px, (323 / 1450 * 100vw), 323px);*/
		margin-left: auto;
		margin-right: auto;
	}
	.conceptSection .logo02 {
		width: clamp(305px, (355 / 1450 * 100vw), 355px);		/*width: clamp(236px, (355 / 1450 * 100vw), 355px);*/
		margin-top: min(95 / 1600 * 100vw, 95px);
		margin-left: auto;
		margin-right: auto;
	}
	.conceptSection .txtBox {
		line-height: 1.935;
		font-size: clamp(1.95rem, (22 / 1450 * 100vw), 2.2rem);		/*font-size: clamp(1.65rem, (22 / 1450 * 100vw), 2.2rem);*/
		text-align: center;
		letter-spacing: .19em;
		margin-top: 1.35em;
	}
	.conceptSection .txtBox .txtUnit + .txtUnit {
		margin-top: 1.675em;
	}
	.conceptSection .innerpageLinkBnBox {
		margin-top: clamp(90px, (170 / 1600 * 100vw), 170px);
	}
@media screen and (max-width: 1200px) {
	.conceptSection .logo01 {
		width: clamp(210px, (260 / 1050 * 100vw), 260px);
	}
	.conceptSection .logo02 {
		width: clamp(250px, (305 / 1050 * 100vw), 305px);
	}
	.conceptSection .txtBox {
		font-size: clamp(1.6rem, (19 / 1050 * 100vw), 1.9rem);
	}
}
@media screen and (max-width: 736px) {
	.conceptContainer {
		background: url("../images/index/concept_bg.jpg") center top / cover no-repeat;
		padding: clamp(90px, (90 / 540 * 100vw), 130px) 0 clamp(75px, (75 / 540 * 100vw), 110px);
	}
	.conceptSection .logo01 {
		width: clamp(195px, (230 / 540 * 100vw), 230px);
	}
	.conceptSection .logo02 {
		width: clamp(235px, (256 / 540 * 100vw), 256px);
		margin-top: clamp(50px, (75 / 540 * 100vw), 75px);
	}
	.conceptSection .txtBox {
		font-size: clamp(1.35rem, (15 / 540 * 100vw), 1.55rem);
		letter-spacing: .16em;
		margin-top: 1.5em;
	}
	.conceptSection .innerpageLinkBnBox {
		margin-top: clamp(55px, (70 / 540 * 100vw), 70px);
	}
}



/* locationContainer
------------------------------------------------------------------------ */
	.locationContainer {}
	.locationSection {}

@media screen and (min-width: 736.02px) {
	.locationSection .innerpageLinkHeadBox {
		grid-template: 
			"iplHead-logo  iplHead-ph" auto
			"iplHead-title iplHead-ph" 1fr /
			auto auto;
		justify-content: space-between;
		align-items: start;
		grid-template-columns:	1fr	min((1280 / 1920 * 100vw), 1280px);
		gap: 					0	min((75 / 1920 * 100vw), 75px);
		padding-left:				min((150 / 1920 * 100vw), 150px);
		padding-top:				clamp(80px, (170 / 1920 * 100vw), 170px);
		padding-bottom:				clamp(70px, (150 / 1920 * 100vw), 150px);
	}
	.locationSection .innerpageLinkHeadBox::before {
		inset: 0 auto 0 0;
		width: min((1697 / 1920 * 100vw), 1697px);
		aspect-ratio: auto;
		background: linear-gradient(-135deg, rgba(var(--site-themeColor-sub), 1) 0%, rgba(255,255,255, 0) 100%);
		opacity: 1;
	}
	.locationSection .innerpageLinkLogo {
		width: min((380 / 1920 * 100vw), 380px);
	}
}
@media screen and (min-width: 736.02px) and (max-width: 1050px) {
	.locationSection .innerpageLinkHeadBox {
		grid-template-columns:	1fr	min((640 / 1050 * 100vw), 640px);
		gap: 					0	min((30 / 1050 * 100vw), 30px);
		padding-left:				min((45 / 1050 * 100vw), 45px);
	}
}
@media screen and (max-width: 736px) {
	.locationSection .innerpageLinkHeadBox::before {
		margin-top: calc(700 / 1280 * 100vw);
		/*background: linear-gradient(-90deg, rgba(var(--site-themeColor-sub), 1) 0%, rgba(255,255,255, 0) 100%);*/
	}
}

/* ==============
	ANIME
============== */
@media screen {
	.locationContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkLogo,
	.locationContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkTitle {
		animation-name: ANIME-ipl-moveRight;
	}
	.locationContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkPh {
		animation-name: ANIME-ipl-moveAndStretchRight;
	}
}
@media screen and (max-width: 736px) {
	.locationContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkLogo,
	.locationContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkTitle {
		animation-name: ANIME-ipl-moveLeft;
	}
	.locationContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkPh {
		animation-name: ANIME-ipl-stretchRight;
	}
}



/* accessContainer
------------------------------------------------------------------------ */
	.accessContainer {
		background: url("../images/index/innerpagelink_bg.jpg") center top / cover no-repeat;
	}
	.accessSection {}

@media screen and (min-width: 736.02px) {
	.accessSection .innerpageLinkHeadBox {
		grid-template: 
			"iplHead-logo  iplHead-ph" 1fr
			"iplHead-title iplHead-ph" auto /
			auto auto;
		justify-content: space-between;
		align-items: end;
		grid-template-columns:	1fr	min((1070 / 1920 * 100vw), 1070px);
		gap: 					0	min((75 / 1920 * 100vw), 75px);
		padding-left:				min((220 / 1920 * 100vw), 220px);
		padding-top:				clamp(55px, (110 / 1920 * 100vw), 110px);
		padding-bottom:				clamp(55px, (110 / 1920 * 100vw), 110px);
	}
	.accessSection .innerpageLinkHeadBox::before {
		inset: 0;
		width: min((1093 / 1920 * 100vw), 1093px);
		background: #b8cddd;
		margin: auto;
		opacity: .5;
	}
	.accessSection .innerpageLinkLogo {
		width: min((260 / 1920 * 100vw), 260px);
	}
}
@media screen and (min-width: 736.02px) and (max-width: 1050px) {
	.accessSection .innerpageLinkHeadBox {
		grid-template-columns:	1fr	min((560 / 1050 * 100vw), 560px);
		gap: 					0	min((30 / 1050 * 100vw), 30px);
		padding-left:				min((70 / 1050 * 100vw), 70px);
	}
}
@media screen and (max-width: 736px) {
	.accessContainer {
		background-position: 36% top;
	}
	.accessSection .innerpageLinkTitle::before {
		background: linear-gradient(-90deg, rgba(var(--site-themeColor-sub), 1) 0%, rgba(255,255,255, 0) 60%);
	}
}
@media screen and (max-width: 480px) {
	.accessSection .innerpageLinkTitle::before {
		background: linear-gradient(-90deg, rgba(var(--site-themeColor-sub), 1) 0%, rgba(255,255,255, 0) 90%);
	}
}

/* ==============
	ANIME
============== */
@media screen {
	.accessContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkLogo,
	.accessContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkTitle {
		animation-name: ANIME-ipl-moveRight;
	}
	.accessContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkPh {
		animation-name: ANIME-ipl-moveAndStretchRight;
	}
}
@media screen and (max-width: 736px) {
	.accessContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkLogo,
	.accessContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkTitle {
		animation-name: ANIME-ipl-moveLeft;
	}
	.accessContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkPh {
		animation-name: ANIME-ipl-stretchRight;
	}
}



/* designContainer
------------------------------------------------------------------------ */
	.designContainer {
		background: url("../images/index/innerpagelink_bg.jpg") center top / cover no-repeat;
	}
	.designSection {}

@media screen and (min-width: 736.02px) {
	.designSection .innerpageLinkHeadBox {
		grid-template: 
			"iplHead-ph  iplHead-logo" auto
			"iplHead-ph iplHead-title" 1fr /
			auto auto;
		justify-content: space-between;
		align-items: start;
		grid-template-columns:		min((1280 / 1920 * 100vw), 1280px) 1fr;
		gap: 					0	min((100 / 1920 * 100vw), 100px);
		padding-right:				min((35 / 1920 * 100vw), 35px);
		padding-top:				clamp(80px, (170 / 1920 * 100vw), 170px);
		padding-bottom:				clamp(70px, (150 / 1920 * 100vw), 150px);
	}
	.designSection .innerpageLinkHeadBox::before {
		inset: 0 0 0 auto;
		width: min((1697 / 1920 * 100vw), 1697px);
		background: #b8cddd;
		opacity: .42;
	}
	.designSection .innerpageLinkLogo {
		width: min((260 / 1920 * 100vw), 260px);
	}
}
@media screen and (min-width: 736.02px) and (max-width: 1050px) {
	.designSection .innerpageLinkHeadBox {
		grid-template-columns:		min((640 / 1050 * 100vw), 640px) 1fr;
		gap: 					0	min((45 / 1050 * 100vw), 45px);
	/*	padding-right:				min((19 / 1050 * 100vw), 19px);*/
	}
}
@media screen and (max-width: 736px) {
	.designContainer {
		background-position: 11% top;
	}
	.designSection .innerpageLinkTitle::before {
		background: linear-gradient(90deg, rgba(var(--site-themeColor-sub), 1) 0%, rgba(255,255,255, 0) 70%);
	}
}
@media screen and (max-width: 480px) {
	.designSection .innerpageLinkTitle::before {
		background: linear-gradient(90deg, rgba(var(--site-themeColor-sub), 1) 0%, rgba(255,255,255, 0) 90%);
	}
}

/* ==============
	ANIME
============== */
@media screen {
	.designContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkLogo,
	.designContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkTitle {
		animation-name: ANIME-ipl-moveLeft;
	}
	.designContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkPh {
		animation-name: ANIME-ipl-moveAndStretchLeft;
	}
}
@media screen and (max-width: 736px) {
	.designContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkLogo,
	.designContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkTitle {
		animation-name: ANIME-ipl-moveRight;
	}
	.designContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkPh {
		animation-name: ANIME-ipl-stretchLeft;
	}
}



/* planContainer
------------------------------------------------------------------------ */
	.planContainer {
		padding-top: 30px;
	}
	.planSection {}

	.planSection .innerpageLinkTitle small.bl {
		margin-top: 1em;
	}
@media screen and (min-width: 736.02px) {
	.planSection .innerpageLinkHeadBox {
		grid-template: 
			"iplHead-logo  iplHead-ph" auto
			"iplHead-title iplHead-ph" 1fr /
			auto auto;
		justify-content: space-between;
		align-items: start;
		grid-template-columns:	1fr	min((1280 / 1920 * 100vw), 1280px);
		gap: 					0	min((40 / 1920 * 100vw), 40px);
		padding-left:				min((115 / 1920 * 100vw), 115px);
		padding-top:				clamp(80px, (170 / 1920 * 100vw), 170px);
		padding-bottom:				clamp(70px, (150 / 1920 * 100vw), 150px);
	}
	.planSection .innerpageLinkHeadBox::before {
		inset: 0 auto 0 0;
		width: min((1697 / 1920 * 100vw), 1697px);
		aspect-ratio: auto;
		background: linear-gradient(-135deg, rgba(var(--site-themeColor-sub), 1) 0%, rgba(255,255,255, 0) 100%);
		opacity: 1;
	}
	.planSection .innerpageLinkLogo {
		width: min((200 / 1920 * 100vw), 200px);
	}
}
@media screen and (min-width: 736.02px) and (max-width: 1050px) {
	.planSection .innerpageLinkHeadBox {
		grid-template-columns:	1fr	min((640 / 1050 * 100vw), 640px);
		gap: 					0	min((23 / 1050 * 100vw), 23px);
		padding-left:				min((43 / 1050 * 100vw), 43px);
	}
}
@media screen and (max-width: 736px) {
	.planContainer {
		padding-top: 15px;
	}
	.planSection .innerpageLinkTitle::before {
		background: linear-gradient(90deg, rgba(var(--site-themeColor-sub), 1) 0%, rgba(255,255,255, 0) 100%);
	}
}

/* ==============
	ANIME
============== */
@media screen {
	.planContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkLogo,
	.planContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkTitle {
		animation-name: ANIME-ipl-moveRight;
	}
	.planContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkPh {
		animation-name: ANIME-ipl-moveAndStretchRight;
	}
}
@media screen and (max-width: 736px) {
	.planContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkLogo,
	.planContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkTitle {
		animation-name: ANIME-ipl-moveRight;
	}
	.planContainer [data-js_show_target-passed="innerpageLinkHeadBox"] .innerpageLinkPh {
		animation-name: ANIME-ipl-stretchLeft;
	}
}




