@charset "UTF-8";
/* CSS Document */
/*-------------------------------*/

/* BUSINESS */

/*------------------------------*/
/* ================================

ページ内リンク

================================ */
.business-navigation {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	gap: var(--gutter-var-md);

	margin-top: var(--section-inner-gutter);
}
.business-navigation a {
	-webkit-box-flex: 1;
	    -ms-flex-positive: 1;
	        flex-grow: 1;

	display: block;
	width: max(
		calc(240rem / 16),
		calc(calc(100% / 2) - var(--gutter-var-md))
	);
	max-width: 100%;
	padding: 1em var(--gutter-var-md);

	text-align: center;

	position: relative;
}
.business-navigation a::before,
.business-navigation a::after {
	content: "";
	display: inline-block;
	position: absolute;
	width: 100%;
	left: 0;
}
.business-navigation a::before {
	top: 0;
	height: 100%;
	z-index: -1;
}
.business-navigation a::after {
	bottom: 0;
	height: 2px;
	z-index: -2;
}
.business-navigation a[href*="core"]::before,
.business-navigation a[href*="core"]::after {
	background-color: var(--color-main);
}
.business-navigation a[href*="custom"]::before,
.business-navigation a[href*="custom"]::after {
	background-color: var(--color-accent);
}
.bn__en ,
.bn__jp {
	color: var(--color-white);
}
.bn__en {
	font-family: var(--alphabet);
	font-weight: 800;
	font-size: var(--txt-lg);
	line-height: 1.1;
}
.bn__jp {
	font-weight: 700;
	font-size: var(--txt-sm);
	line-height: 1.25;
}
@media (any-hover: hover) {
	.business-navigation a[href*="core"]::before,
	.business-navigation a[href*="custom"]::before {
		-webkit-transition: -webkit-transform .2s var(--easeInQuad);
		transition: -webkit-transform .2s var(--easeInQuad);
		transition: transform .2s var(--easeInQuad);
		transition: transform .2s var(--easeInQuad), -webkit-transform .2s var(--easeInQuad);
		-webkit-transform-origin: left top;
		        transform-origin: left top;
	}
	.business-navigation a[href*="core"]:hover::before,
	.business-navigation a[href*="core"]:focus-visible::before,
	.business-navigation a[href*="custom"]:hover::before,
	.business-navigation a[href*="custom"]:focus-visible::before {
		-webkit-transform: scaleX(0);
		        transform: scaleX(0);
		-webkit-transform-origin: right bottom;
		        transform-origin: right bottom;
	}
	.business-navigation a[href*="core"] *:is(.bn__en,.bn__jp),
	.business-navigation a[href*="custom"] *:is(.bn__en,.bn__jp) {
		-webkit-transition: color .2s var(--easeInSine),
		border-color .1s var(--easeInExpo);
		transition: color .2s var(--easeInSine),
		border-color .1s var(--easeInExpo);
	}
	.business-navigation a[href*="core"]:hover *:is(.bn__en,.bn__jp),
	.business-navigation a[href*="core"]:focus-visible *:is(.bn__en,.bn__jp) {
		color: var(--color-main);
	}
	.business-navigation a[href*="custom"]:hover *:is(.bn__en,.bn__jp),
	.business-navigation a[href*="custom"]:focus-visible *:is(.bn__en,.bn__jp) {
		color: var(--color-accent);
	}
}



/* ================================

コアモデル / カスタムモデル

================================ */
/* ======================

リードブロック

*/
/* ---------------
コンテナ */
.model {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	gap: 3.1em var(--gutter-var-10x);
	padding-top: var(--gutter-var-10x);

	position: relative;
}
#core .model {
	margin-left: var(--head-match-space);
}
#custom .model {
	-webkit-box-orient: horizontal;
	-webkit-box-direction: reverse;
	    -ms-flex-direction: row-reverse;
	        flex-direction: row-reverse;
	margin-right: var(--head-match-space);
}
.model::before {
	content: "";
	display: inline-block;
	width: 40vw;
	height: calc(100% - var(--gutter-var-10x));

	position: absolute;
	top: 0;
	z-index: -1;
}
#core .model::before {
	background-color: var(--color-main-pale);
	-webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 20% 100%);
	        clip-path: polygon(0 0, 100% 0, 100% 100%, 20% 100%);
	right: 0;
}
#custom .model::before {
	background-color: var(--color-accent-pale);
	-webkit-clip-path: polygon(0 0, 100% 0, 80% 100%, 0% 100%);
	        clip-path: polygon(0 0, 100% 0, 80% 100%, 0% 100%);
	left: 0;
}
.model__txt-wrapper,
.model__slider {
	-webkit-box-flex: 1;
	    -ms-flex-positive: 1;
	        flex-grow: 1;
}
.model__txt-wrapper {
	width: max(
		calc(336rem / 16),
		calc(50% - var(--gutter-var-10x))
	);
	max-width: calc(448rem / 16);
}
.model__slider {
	width: 50%;
	max-width: 700px;
}
/* ---------------
テキスト */
.core__headline strong {
	color: var(--color-main);
}
.custom__headline .headline__alphabet::first-letter{
	color: var(--color-accent) !important;
}
.custom__headline strong {
	color: var(--color-accent);
}
.model__lead {
	margin-block: 1.9em;
	font-size: var(--txt-lg);
}
@media (min-width: 960px) {
	@supports (container-type: inline-size) {
		.model__txt-wrapper {
			container-type: inline-size;
		}
		@container (max-width: 445px) {
			.model__lead {
				font-size: var(--txt-md);
			}
		}
	}
}
@media (max-width: 959px) {
	.model,
	#core .model,
	#custom .model {
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
		-webkit-box-align: center;
		    -ms-flex-align: center;
		        align-items: center;

		padding-top: calc(var(--gutter-var-10x) * 2);
		margin-right: auto;
		margin-left: auto;
	}
	.model::before {
		width: calc(100% - var(--gutter-var-8x));
		height: var(--gutter-var-10x);
	}
	#core .model::before ,
	#custom .model::before {
		left: 0;
		-webkit-clip-path: polygon(0 0, 100% 0, 95% 100%, 0% 100%);
		        clip-path: polygon(0 0, 100% 0, 95% 100%, 0% 100%);
	}
	.model__txt-wrapper,
	.model__slider {
		width: var(--flexible-width);
		max-width: none;
	}
	/* -------------
	テキスト */
	.model__lead {
		text-align: justify;
	}
	@supports (container-type: inline-size) {
		.model__txt-wrapper {
			container-type: inline-size;
		}
		@container (max-width: 371px) {
			.model__lead {
				font-size: max(calc(var(--txt-md) * 1.2), 5vw);
				letter-spacing: 0.15em;
			}
		}
		@container (max-width: 320px) {
			.model__lead > br {
				display: none;
			}
		}
	}
}


/* ======================

矩計図

*/
/* -----------
テキスト */
.detail__headline {
	text-align: center;
}
.detail__headline--core .detail__headline--en {
	color: var(--color-main);
}
.detail__headline--custom .detail__headline--en {
	color: var(--color-accent);
}
.detail__headline--en {
	font-family: var(--alphabet);
	font-weight: 800;
	font-size: var(--txt-lg);
	line-height: 1.1;
}
.detail__headline--jp {
	font-weight: 700;
	font-size: var(--txt-md);
	line-height: 1.25;
	margin-top: 0.3em;
}
/* -----------
画像 */
.detail__figure-wrapper {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: end;
	    -ms-flex-align: end;
	        align-items: flex-end;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	gap: 3.1em var(--gutter-var-10x);
}
.detail__figure {
	-webkit-box-flex: 1;
	    -ms-flex-positive: 1;
	        flex-grow: 1;
	display: block;
	width: max(
		calc(50% - var(--gutter-var-10x)),
		calc(280rem / 16)
	);
	max-width: min(
		calc(494rem / 16),
		100%
	);

	margin-top: 3.8em;
}
.detail__figure img {
	width: 100%;
	height: auto;
}


/* ======================

スペック

*/
.spec__table {
	margin-top: 3.8em;
}
.common-table.spec__table--custom tr {
	border-top: 1px solid var(--color-accent-pale);
	border-bottom: 1px solid var(--color-accent-pale);
}
@media (max-width: 959px) {
	.spec__table {
		margin-top: 2.8em;
	}
}
@media (max-width: 559px) {
	.spec__table {
		margin-top: 1.8em;
	}
	.common-table.spec__table--custom tr:first-child {
		border-top: 1px solid var(--color-accent-pale);
	}
	.common-table.spec__table--custom tr:last-child {
		border-bottom: 1px solid var(--color-accent-pale);
	}
	.common-table.spec__table--custom tr + tr {
		border-top: 1px solid var(--color-accent-pale);
	}
	.common-table.spec__table--custom th {
		background-color: var(--color-accent-thin);
	}
}