/* CSS Document */

/* =================================================
WEB FONTS:
====================================================
[Zen Old mincho] midashi
	https://fonts.google.com/specimen/Zen+Old+Mincho
		font-family: "Zen Old Mincho", serif;
		font-weight: 400;

[Noto Sans japanese] Txt
	https://fonts.google.com/noto/specimen/Noto+Sans+JP
		font-family: "Noto Sans JP", sans-serif;
		font-optical-sizing: auto;
		font-weight: <weight>;

[Roboto] Iconic Txt
	https://fonts.google.com/specimen/Roboto
	  font-family: "Roboto", sans-serif;
	  font-optical-sizing: auto;
	  font-weight: <weight>;
	  font-variation-settings:"wdth" 100;

[Roboto Condensed] Iconic Txt
	https://fonts.google.com/specimen/Roboto+Condensed
	  font-family: "Roboto Condensed", sans-serif;
	  font-optical-sizing: auto;
	  font-weight: <weight>;
====================================================

@media print, screen and (min-width: 750.02px) and (max-width: 900px) {}
@media print, screen and (min-width: 750.02px) {}
@media screen and (max-width: 750px) {}

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

/* =================================================
	common setting
================================================= */
	:root {
		/* フォント */
		--site-font_family-sans: "YakuHanJP", 'Noto Sans JP', 'Noto Sans', YuGothic,'Hiragino Kaku Gothic ProN','Yu Gothic',Meiryo,sans-serif;
		--site-font_family-serif: "YakuHanMP", "Zen Old Mincho", YuMincho,'Hiragino Mincho ProN','Yu Mincho',serif;
		--site-font_family-en_1: "Roboto", var(--site-font_family-serif);
		--site-font_family-en_2: "Roboto Condensed", var(--site-font_family-serif);
		--site-font_family-basic: var(--site-font_family-sans);
		--site-font_family-caption: var(--site-font_family-sans);

		/* テーマカラー */
		--site-themeColor-base: 		0, 0, 0;	 		/* #000000 black */
		--site-themeColor-base_accent: 	70, 77, 83; 		/* #464d53 gray_1 */
		--site-themeColor-base_text: 	255, 255, 255; 		/* #FFFFFF white */
		--site-themeColor-wall: 		107, 105, 104; 		/* #6b6968 gray_2 */
		--site-themeColor-roof: 		97, 87, 123; 		/* #61577b purple */
		--site-themeColor-heatshield: 	181, 113, 114; 		/* #b57172 pale_red */

		--site-productColor-base: 		45, 50, 56; 		/* #2d3238 blue_gray */
		--site-productColor-blue: 		20, 56, 79; 		/* #14384f dark_blue */
		--site-productColor-yellow:		70, 61, 28; 		/* #463d1c dark_yellow */
		--site-productColor-red: 		90, 40, 47; 		/* #5a282f wine_red */

		--site-gradientColor-base: 		linear-gradient(to right, #1e1512 0% , #57463c 11% , #57463c 27% , #7e6759 43% , #a48875 56% , #7a6456 67% , #57463c 77% , #57453c 89% , #231917 100%);

		/* 幅 */
		--site-sizeContentWide-L:	100%;
		--site-sizeContentWide-XM:	94%;	/* XMは750以下からLと同じ幅にする */
		--site-sizeContentWide-M:	88%;
		--site-sizeContentWide-S:	86.111%;
		--site-sizeMaxWidth-L:		1900px;
		--site-sizeMaxWidth-XM:		1440px;
		--site-sizeMaxWidth-M:		1260px;	/* Mは1200以下からSと同じ幅にする */
		--site-sizeMaxWidth-S:		1000px;

		/* 余白 */
		--site-marpad-XXXL:			150px;
		--site-marpad-XXL:			150px;	/* 750以下の下げ幅大 */
		--site-marpad-XL:			120px;
		--site-marpad-L:			100px;
		--site-marpad-M:			80px;
		--site-marpad-S:			60px;
		--site-marpad-XS:			40px;
		--site-marpad-XXS:			20px;

	}

@media screen and (max-width: 1200px) {
	:root {
		/* 幅 */
		/*--site-sizeContentWide-M:	94%;*/
		--site-sizeMaxWidth-M:		1000px;		/* Mは1200以下からSと同じ幅にする */
	}
}
@media screen and (max-width: 750px) {
	:root {
		/* 幅 */
		--site-sizeContentWide-XM:	100%;	/* XMは--site-sizeContentWide-XMからLと同じ幅にする */
		/* 余白 */
		--site-marpad-XXXL:			120px;
		--site-marpad-XXL:			100px;	/* 750以下の下げ幅大 */
		--site-marpad-XL:			100px;
		--site-marpad-L:			80px;
		--site-marpad-M:			60px;
		--site-marpad-S:			40px;
		--site-marpad-XS:			30px;
		--site-marpad-XXS:			15px;
	}
}



/* simpleShowTarget_v3 | setting.js									2024.03
---------------------------------------------------------------------------
div[data-js_show_target="blur"]
div[data-js_show_target_suite="blur"]>div[data-js_show_target_suite_descendant="000ms"]
---------------------------------------------------------------------------
- 対象要素とビューポートが交差したら(=要素が画面に入ったら)関数を実行する（≒inview）
	- 動作例：
	- <div data-js_show_target="blur"> → <div data-js_show_target="blur" data-js_show_target-passed="blur">
- カスタムデータ属性（^= と = の違いに注意。^=先頭の値）
---------------------------------------------------------------------------
- 「単独設定（通常通り）」と「一揃い（スイート）」の2種類を用意。
	- 「単独設定」はターゲット（[data-js_show_target]を設定した要素）自身がアニメーションする。
	- 「一揃い」はターゲット（[data-js_show_target_suite]を設定した要素）の“子孫要素”がアニメーションする。
		- 子孫要素のdata属性の値でディレイ秒数を設定できる。設定したくない場合は値を空にする。（[data-js_show_target_suite_descendant="300ms"] ＝ 300ミリ秒遅延）
---------------------------------------------------------------------------
- 2022.04	開始時の opacity を0より少し高くすることでスクロールを促す（但しChromeはバグがあるため0とする。※CSSハック）
------------------------------------------------------------------------ */
@media screen {
	/* ----------------------------------------------------
		共通設定
	---------------------------------------------------- */
	/* 開始時、初期値 ========== */
	[data-js_show_target],
	[data-js_show_target_suite_descendant] {
		--default-jsShowTarget-transition-opacity:		opacity 1500ms ease-out 300ms;
		--default-jsShowTarget-transition-translate:	transform 1000ms ease-out 100ms;
		--default-jsShowTarget-transition-blur:			filter 1000ms ease-out 0ms;
		/*opacity: .05;*/
		opacity: 0;
	}
	_:lang(x)::-internal-media-controls-overlay-cast-button, /* CSSハック */
	[data-js_show_target],
	[data-js_show_target_suite_descendant] {	/* for Chrome. | Chromeでは「transform + opacity」で「transition (animation) のフェードイン」をするときに、「開始時の opacity が 0 以外」では正しくフェードしないバグがある模様。 */
		opacity: 0;
	}
	/* 終了時 ================== */
	[data-js_show_target-passed],
	[data-js_show_target_suite-passed] :where([data-js_show_target_suite_descendant]) {
		opacity: 1;
	}
	/* ----------------------------------------------------
		単独設定（通常）
	-------------------------------------------------------
	 * 2023.09	データ属性の値を変更、設定を追加
	-------------------------------------------------------
	フェードイン、上へスライド、ブラー、
	ストレッチレフト、ストレッチライト
	---------------------------------------------------- */
	[data-js_show_target="fadeIn"] {				transition: var(--default-jsShowTarget-transition-opacity);}

	[data-js_show_target="fadeIn_slowly"] {			transition: opacity 2500ms ease-out 300ms;}
	[data-js_show_target="fadeIn_quickly"] {		transition: opacity 900ms ease-out 100ms;}

	[data-js_show_target^="moveUp"] {				transition: var(--default-jsShowTarget-transition-opacity), var(--default-jsShowTarget-transition-translate);}
	[data-js_show_target="moveUp20"] {				transform: translateY(20px);}
	[data-js_show_target="moveUp30"] {				transform: translateY(30px);}
	[data-js_show_target="moveUp40"] {				transform: translateY(40px);}
	[data-js_show_target-passed^="moveUp"] {		transform: translateY(0);}

	[data-js_show_target^="moveDown"] {				transition: var(--default-jsShowTarget-transition-opacity), var(--default-jsShowTarget-transition-translate);}
	[data-js_show_target="moveDown20"] {			transform: translateY(-20px);}
	[data-js_show_target="moveDown30"] {			transform: translateY(-30px);}
	[data-js_show_target="moveDown40"] {			transform: translateY(-40px);}
	[data-js_show_target-passed^="moveDown"] {		transform: translateY(0);}

	[data-js_show_target^="moveLeft"] {				transition: var(--default-jsShowTarget-transition-opacity), var(--default-jsShowTarget-transition-translate);}
	[data-js_show_target="moveLeft20"] {			transform: translateX(20px);}
	[data-js_show_target="moveLeft30"] {			transform: translateX(30px);}
	[data-js_show_target="moveLeft40"] {			transform: translateX(40px);}
	[data-js_show_target-passed^="moveLeft"] {		transform: translateX(0);}

	[data-js_show_target^="moveRight"] {			transition: var(--default-jsShowTarget-transition-opacity), var(--default-jsShowTarget-transition-translate);}
	[data-js_show_target="moveRight20"] {			transform: translateX(-20px);}
	[data-js_show_target="moveRight30"] {			transform: translateX(-30px);}
	[data-js_show_target="moveRight40"] {			transform: translateX(-40px);}
	[data-js_show_target-passed^="moveRight"] {		transform: translateX(0);}

	[data-js_show_target="blur"] {					opacity: .7; filter: blur(6px); transition: var(--default-jsShowTarget-transition-opacity), var(--default-jsShowTarget-transition-blur);}
	[data-js_show_target-passed="blur"] {			opacity: 1; filter: blur(0);}

	[data-js_show_target="blur_opacity0"] {			opacity: 0; filter: blur(6px); transition: var(--default-jsShowTarget-transition-opacity), var(--default-jsShowTarget-transition-blur);}
	[data-js_show_target-passed="blur_opacity0"] {	opacity: 1; filter: blur(0);}

	[data-js_show_target="blur_slowly"] {			opacity: .7; filter: blur(6px); transition: var(--default-jsShowTarget-transition-opacity), filter 2000ms ease-out 600ms;}
	[data-js_show_target-passed="blur_slowly"] {	opacity: 1; filter: blur(0);}

	[data-js_show_target="blur_slowly_opacity0"] {			opacity: 0; filter: blur(6px); transition: var(--default-jsShowTarget-transition-opacity), filter 2000ms ease-out 600ms;}
	[data-js_show_target-passed="blur_slowly_opacity0"] {	opacity: 1; filter: blur(0);}

	[data-js_show_target^="scale"] {				opacity: 0; scale: 0; transition: var(--default-jsShowTarget-transition-opacity), scale 1500ms ease-out 300ms;}
	[data-js_show_target="scale095"] {				scale: 0.95;}
	[data-js_show_target="scale105"] {				scale: 1.05;}
	[data-js_show_target="scale110"] {				scale: 1.1;}
	[data-js_show_target="scale115"] {				scale: 1.15;}
	[data-js_show_target="scale120"] {				scale: 1.2;}
	[data-js_show_target-passed^="scale"] {			opacity: 1; scale: 1;}

	[data-js_show_target="fadeInStretchLeft"],
	[data-js_show_target="fadeInStretchRight"] {		opacity: 0; transition: opacity 500ms, clip-path 1000ms; transition-delay: 100ms; transition-timing-function: ease-out;}
	[data-js_show_target="fadeInStretchLeft"] {			clip-path: inset(0 100% 0 0);}
	[data-js_show_target="fadeInStretchRight"] {		clip-path: inset(0 0 0 100%);}
	[data-js_show_target-passed="fadeInStretchLeft"],
	[data-js_show_target-passed="fadeInStretchRight"] {	opacity: 1; clip-path: inset(0 0 0 0);}

	[data-js_show_target="fadeInStretchUp"],
	[data-js_show_target="fadeInStretchDown"] {			opacity: 0; transition: opacity 500ms, clip-path 1000ms; transition-delay: 100ms; transition-timing-function: ease-out;}
	[data-js_show_target="fadeInStretchUp"] {			clip-path: inset(100% 0 0 0);}
	[data-js_show_target="fadeInStretchDown"] {			clip-path: inset(0 0 100% 0);}
	[data-js_show_target-passed="fadeInStretchUp"],
	[data-js_show_target-passed="fadeInStretchDown"] {	opacity: 1; clip-path: inset(0 0 0 0);}

	[data-js_show_target="fadeIn_scaleGetBigger_blur"] {		opacity: 0;	transform: scale(.5); filter: blur(10px);}
	[data-js_show_target-passed="fadeIn_scaleGetBigger_blur"] {	animation: 700ms ease both M_fadeIn_and_scaleGetBigger_and_blur;}

	[data-js_show_target="fadeIn_scaleGetBigger_blur myEaseOutBack"] {			opacity: 0;	transform: scale(.5); filter: blur(10px);}
	[data-js_show_target-passed="fadeIn_scaleGetBigger_blur myEaseOutBack"] {	animation: 700ms var(--M-easing-myEaseOutBack_01) both M_fadeIn_and_scaleGetBigger_and_blur;}


	/* ----------------------------------------------------
		一揃い(suite) | 子孫要素にスタイルを設定する
	-------------------------------------------------------
	フェードイン、上へスライド
	---------------------------------------------------- */
	[data-js_show_target_suite="fadeIn"] :where([data-js_show_target_suite_descendant]) {			transition: var(--default-jsShowTarget-transition-opacity);}

	[data-js_show_target_suite="fadeIn_slowly"] :where([data-js_show_target_suite_descendant]) {	transition: opacity 2500ms ease-out 100ms;}
	[data-js_show_target_suite="fadeIn_quickly"] :where([data-js_show_target_suite_descendant]) {	transition: opacity 900ms ease-out 100ms;}

	[data-js_show_target_suite^="moveUp"] :where([data-js_show_target_suite_descendant]) {			transition: var(--default-jsShowTarget-transition-opacity), var(--default-jsShowTarget-transition-translate);}
	[data-js_show_target_suite="moveUp20"] :where([data-js_show_target_suite_descendant]) {			transform: translateY(20px);}
	[data-js_show_target_suite="moveUp30"] :where([data-js_show_target_suite_descendant]) {			transform: translateY(30px);}
	[data-js_show_target_suite="moveUp40"] :where([data-js_show_target_suite_descendant]) {			transform: translateY(40px);}
	[data-js_show_target_suite-passed^="moveUp"] :where([data-js_show_target_suite_descendant]) {	transform: translateY(0);}

	[data-js_show_target_suite^="moveLeft"] :where([data-js_show_target_suite_descendant]) {		transition: var(--default-jsShowTarget-transition-opacity), var(--default-jsShowTarget-transition-translate);}
	[data-js_show_target_suite="moveLeft20"] :where([data-js_show_target_suite_descendant]) {		transform: translateX(20px);}
	[data-js_show_target_suite="moveLeft30"] :where([data-js_show_target_suite_descendant]) {		transform: translateX(30px);}
	[data-js_show_target_suite="moveLeft40"] :where([data-js_show_target_suite_descendant]) {		transform: translateX(40px);}
	[data-js_show_target_suite-passed^="moveLeft"] :where([data-js_show_target_suite_descendant]) {	transform: translateX(0);}

}



/* ============================================================================
	Setting
============================================================================ */
/* html */
	html {font-size:.625em;}
/* Img */
	img,
	object[data-obj-roleimg*="roleImg"] {
		border: 0;
		max-width: 100%;
		height: auto;	
		vertical-align: bottom;											/* 余白対策 */
	}
	.picUnit {
		text-align: center;
	}
/* svg */
	svg:not(:root) {
		overflow: hidden;
	}
/* form */
	:is(button, input, select, textarea) {
		font: inherit;
	}
/* hr */
	hr {
		display: none;
	}


/* body */
	body {
		min-height: 0.001vw;		/* for safari | font-sizeにclamp()使用時必須 */
		line-height: 1.75;
		color: rgba(var(--site-themeColor-base_text), 1);
		font-family: var(--site-font_family-basic);
		font-optical-sizing: auto;
		font-weight: 400;
		font-size: clamp(1.3rem, (15 / 1000 * 100vw), 1.5rem); /* ww1000以下から小さくなる */
		/*font-size: 1.6rem;*/
		/*letter-spacing: .09em;*/
		background: rgba(var(--site-themeColor-base), 1);

	}

	small, figcaption {
		line-height: 1.5;
		color: inherit;
		font-family: var(--site-font_family-caption);
		font-size: 1.1rem;
		text-align: left;
		letter-spacing: .04em;
		opacity: .92; 
	}
@media screen and (max-width: 750px) {
	body {
		font-size: 1.325rem;
	}
	small, figcaption {
		font-size: 1rem;
	}
}
/* Font Family */
	.fontSerif,
	.fontSerifBox * {
		font-family: var(--site-font_family-serif);
	}
	.breadcrumbBox,
	.fontSans,
	.fontSansBox * {
		font-family: var(--site-font_family-sans);
	}
	.fontEn01,
	.fontEn01Box * {
		font-family: var(--site-font_family-en_1);
	}
	.fontEn02,
	.fontEn02Box * {
		font-family: var(--site-font_family-en_2);
	}
/* Small Text */
	small.bl,
	small.bltr,
	small.blPCtrSPtl {display:block;/*line-height:1.4;*/margin-top:.35em;}
	small.bltr,
	small.blPCtrSPtl {text-align:right;}
	small .punc {margin-right:-.5em;}/* punctuation mark（約物）｜※inline-block内の文末使用は不可。inline-block自身への使用は可。 */
	
	.captionWrap {display:block;/*line-height:1.7;*/}
	.captionWrap small {display:inline-block;line-height: 1.7;/*font-size:1.1rem;*/letter-spacing:.07em;}
@media screen and (max-width: 750px) {
	small.blPCtrSPtl {text-align:left;}
	/*.captionWrap small {font-size:1rem;}*/
}
/* Text */
	.inbl {		display: inline-block;	}
	.bl {		display: block;}


/* Imgcap | 例:	 <p class="imgcapParent"><img><small class="imgcap bk">caption</small></p>	 <p class="imgcapParent"><img><small class="imgcap"><span class="wh">caption</span></small></p> */
	.imgcapParent {
		position: relative;
	}
	.imgcap, .imgcapkeep {
		display: block;
		position: absolute;
		bottom: 0;
		right: 0;
		line-height: 1.5;
		padding: 5px 10px;
	}
	.imgcap.capLeft, .imgcapkeep.capLeft {
		right: auto;
		left: 0;
	}
	.imgcap.bg, .imgcapkeep.bg {
		padding: 2px 6px;
	}
	.imgcap > span,
	.imgcapkeep > span {
		display: inline-block;
	}
	.imgcap.wh, .imgcapkeep.wh {color:#ffffff;text-shadow:0 0 3px rgba(0,0,0,.3);}
	.imgcap.bk, .imgcapkeep.bk {color:#202020;text-shadow:0 0 3px rgba(255,255,255,.3);}
	.imgcap.gr, .imgcapkeep.gr {color:#767676;text-shadow:0 0 3px rgba(255,255,255,.3);}
	.imgcap .wh, .imgcapkeep .wh {color:#ffffff;text-shadow:0 0 5px rgba(0,0,0,.9), 0 0 4px rgba(0,0,0,.9), 0 0 3px rgba(0,0,0,1), 0 0 2px rgba(0,0,0,1);}
	.imgcap .bk, .imgcapkeep .bk {color:#202020;text-shadow:0 0 9px rgba(255,255,255,.9), 0 0 9px rgba(255,255,255,.9), 0 0 5px rgba(255,255,255,.5), 0 0 2px rgba(255,255,255,.5), 0 0 1px rgba(255,255,255,.5), 0px 1px 1px rgba(255,255,255,.5), 0px -1px 1px rgba(255,255,255,.5), 1px 0px 1px rgba(255,255,255,.5), -1px 0px 1px rgba(255,255,255,.5), 1px 1px 1px rgba(255,255,255,.5), -1px 1px 1px rgba(255,255,255,.5), 1px -1px 1px rgba(255,255,255,.5), -1px -1px 1px rgba(255,255,255,.5), .5px .5px .5px rgba(255,255,255,.7);}
	.imgcap .gr, .imgcapkeep .gr {color:#767676;text-shadow:0 0 9px rgba(255,255,255,.9), 0 0 9px rgba(255,255,255,.9), 0 0 5px rgba(255,255,255,.5), 0 0 2px rgba(255,255,255,.5), 0 0 1px rgba(255,255,255,.5), 0px 1px 1px rgba(255,255,255,.5), 0px -1px 1px rgba(255,255,255,.5), 1px 0px 1px rgba(255,255,255,.5), -1px 0px 1px rgba(255,255,255,.5), 1px 1px 1px rgba(255,255,255,.5), -1px 1px 1px rgba(255,255,255,.5), 1px -1px 1px rgba(255,255,255,.5), -1px -1px 1px rgba(255,255,255,.5), .5px .5px .5px rgba(255,255,255,.7);}
	.imgcap.wh.bg, .imgcapkeep.wh.bg {background-color:rgba(0,0,0,.5);text-shadow:none;}
	.imgcap.bk.bg, .imgcapkeep.bk.bg {background-color:rgba(255,255,255,.6);text-shadow:none;}
	.imgcap.gr.bg, .imgcapkeep.gr.bg {background-color:rgba(255,255,255,.6);text-shadow:none;}
@media screen and (max-width: 750px) {
	.imgcap {
		position: static;
		padding: .3em .5em 0;
	}
	.imgcap.wh,
	.imgcap.bk,
	.imgcap.gr,
	.imgcap > span {
		display: block;
		color: inherit;
		text-shadow: none!important;
		margin: .3em 0 0;
	}
	.imgcap.wh.bg,
	.imgcap.bk.bg,
	.imgcap.gr.bg {
		background-color: transparent;
	}
}
/* Symbol List */
	/* ul.symList>li.symItem*2>div.sym+div.symItemText */
	.symList > .symItem {display:flex;width:100%;}
	.symList > .symItem::before,
	.symList > .symItem .sym {display:block;white-space:nowrap;padding-right:.25em;}
	.symList > .symItem .symItemText {flex:1 1;display:block;}
	.symList[data-star-symlist-styletype="circleFill"] > .symItem::before { content: "●";}
	.symList[data-star-symlist-styletype="squareFill"] > .symItem::before { content: "■";}
	.symList[data-star-symlist-styletype="squareLine"] > .symItem::before { content: "□";}
	
	/* small.symList-kome>span.symItem*2>span.sym{※}+span.symItemText{xxx}>br */
	.symList-kome {display:block!important;}
	.symList-kome .symItem {display:flex;width:100%;}
	.symList-kome .sym {display:block;white-space:nowrap;padding-right:.25em;}
	.symList-kome .symItemText {flex:1 1;display:block;}
	
	/* small.symList-kome>span.symItem.legendBox>(i*3>img[src="xxx"][alt="xxx色"][width="000"][height="000"])+(i*3>{XXXxxxxxx})+br */
	.symList-kome .legendBox {display:flex;flex-wrap:wrap;justify-content:flex-start;margin-top:.2em;margin-bottom:.2em;}
	.symList-kome .legendBox i {display:inline-block;margin-right:1.5em;}
	.symList-kome .legendBox img {vertical-align:middle;line-height:1;margin-right:4px; margin-top:-3px; height:1em;}
	.symList-kome .legendBox img.outframe {margin-right:6px;}
	.symList-kome .legendBox br:last-child {display: none;}

/* ---------------------------------
	Link
--------------------------------- */
	/* ----- tmplリセット ----- */
	:where(main) a {
		color: inherit;
		text-decoration: none;
	}
	:where(main) a .inbl {
		color: inherit;
		text-decoration: inherit;
	}
	:where(main) a:hover {
		text-decoration: none; /* base.cssのリセット */
	}
	/* ----- 汎用：文字色青・下線付き ----- */
	a.txtLink,
	.txtLink a {
		/*color: #4d92ff!important;*/
		text-decoration: underline !important;
	}
	/* ----- 汎用：hover時_透過フェード ----- */
	a.hover,
	.hover a,
	.hoverItem {
		transition: opacity .15s ease-out;
	}
	@media (hover: hover) and (pointer: fine) {
		a.txtLink:hover,
		.txtLink a:hover {
			text-decoration: none !important;
		}
		a.hover:hover,
		.hover a:hover,
		.hoverItem:hover {
			opacity: .63;
		}
	}
	a.txtLink:focus-visible,
	.txtLink a:focus-visible {
		text-decoration: none !important;
	}
	a.hover:focus-visible,
	.hover a:focus-visible,
	.hoverItem:focus-visible {
		opacity: .63;
	}



/* js_swipeMe
---------------------------------------------------------------------------
- スワイプを促すアイコンを表示させる。
---------------------------------------------------------------------------
- (JS)		setting.jsの「js_swipeMe」と連携
- (HTML)	スクロールしたい要素の親に「(div).js_swipeMe」を指定する。「.js_swipeMe[data-js_swipeme-maxwidth="000"]」でメディアクエリの値も設定可能（000＝単位なし数値）
- (CSS)		[data-js_swipeme-maxwidth]を設定しない場合は、各ページCSS内の必要なタイミングで設定する（下記参考に。メディアクエリは自由）
---------------------------------------------------------------------------
div.xxx>div.js_swipeMe[data-js_swipeme-maxwidth="000"](>div.yyyPicBox>img)+small.bltr.mt05em
---------------------------------------------------------------------------
// -------------
	スワイプ
-------------- //
@media screen and (max-width: 736px) {
	.xxx .js_swipeMeIcon,
	.xxx .js_swipeMeInnerBoxOverlay { display: block;}
	.xxx .js_swipeMeInnerBox { overflow-x: scroll;}
	.xxx .js_swipeMeInnerBox img {max-width: none; padding: 7px;}
	.xxx .js_swipeMeInnerBoxOverlay,
	.xxx .js_swipeMeInnerBox img {width: 160%;}
}
@media screen and (max-width: 480px) {
	.xxx .js_swipeMeInnerBoxOverlay,
	.xxx .js_swipeMeInnerBox img { width: 180%;}
}
------------------------------------------------------------------------ */
	.js_swipeMe {
		position: relative;
		z-index: 0;
	}
	.js_swipeMeIcon { /* ※各ページCSS内のタイミングで block にする */
		display: none; position: absolute; top: 0; bottom: 0; left: 0; right: 0; z-index: 1;
		width: 90px;
		aspect-ratio: 1;
		margin: auto;
		background: url("../images/share/ico_swipe.svg") 50% center / contain no-repeat;
		animation: 1.1s ease-in-out .2s infinite alternate both js_swipeMeIcon_motion;
	}
	.js_swipeMeInnerBox {
		display: block;
		position: relative;
		width: 100%;
		-webkit-overflow-scrolling: touch;
	}
	.js_swipeMeInnerBoxOverlay { /* ※各ページCSS内のタイミングで block にする */
		display: none; position: absolute; top: 0; left: 0; width: 100%; height: 100%;
		background: rgba(0, 0, 0, .28);
	}
	/* [data-js_swipeme-maxwidth]でメディアクエリを設定した場合の初期値 */
	.js_swipeMe_active .js_swipeMeIcon,
	.js_swipeMe_active .js_swipeMeInnerBoxOverlay { display: block;}
	.js_swipeMe_active .js_swipeMeInnerBox { overflow-x: scroll;}
	.js_swipeMe_active .js_swipeMeInnerBox img {max-width: none;}
	.js_swipeMe_active .js_swipeMeInnerBoxOverlay,
	.js_swipeMe_active .js_swipeMeInnerBox img {width: 200%; max-width: none !important;}
/* =================================
	@KEYFRAMES
================================= */
@keyframes js_swipeMeIcon_motion {
	0% {	transform: translateX(-20px);}
	100% {	transform: translateX(20px);}
}




/* ---------------------------------
	Btn
--------------------------------- */
	.btnUnit {
		max-width: 650px;
		margin: var(--site-marpad-XS) auto 0;
	}
	.btnUnit a {
		position: relative;
		display: block;
		color: #FFF;
		line-height: 3.0em;
		text-align: center;
		background: var(--site-gradientColor-base);
		margin-top: 1.25em;
		padding: 0 1.3em;
		border: 1px solid rgba(255, 255, 255, .3);
		transition: all 0.3s ease;
	}
	.btnUnit a::after {
		content: "";
		display: block;
		position: absolute;
		top: 50%;
		right: 1em;
		width: 0px;
		height: 0px;
		transform: translateY(-50%);
		line-height: 0px;
		border: 3px solid transparent;
		border-left-color: #FFF;
		transition: all 0.3s ease;
	}
	.btnUnit.cateColorBtn a {
		background: var(--cate-baseColor);
	}


	.btnUnit a:hover {		opacity: .8;	}
	.btnUnit a:hover::after {		transform: translate(2px, -50%);}

@media screen and (max-width: 750px) {
	.btnUnit {
		width: 80%;
	}
}


	.pageTopBtn {
		opacity: 0;
		position: fixed;
		z-index: 50;
		bottom: 20px;
		right: 20px;
		width: 80px;
		height: 80px;
		transition: all 0.3s ease;
	}
	.pageTopBtn .Icon {
		position: relative;
		display: block;
		width: 80px;
		height: 80px;
		background: rgba(0, 0, 0, .7);
		border-radius: 3px;
	}
	.pageTopBtn .Icon::after {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -70%);
		content: "";
		display: block;
		width: 0px;
		height: 0px;
		line-height: 0;
		border: 10px solid transparent;
		border-bottom-color: #FFF;
	}
	.pageTopBtn.active {
		opacity: 1;
	}

@media screen and (max-width: 750px) {
	.pageTopBtn {
		bottom: 10px;
		right: 10px;
		width: 50px;
		height: 50px;
	}
	.pageTopBtn .Icon {
		width: 50px;
		height: 50px;
	}
}



/* col
==========================*/
	.col--2,
	.col--3 {
		--colGap: 60px;
		--rowGap: 30px;
		
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		column-gap: var(--colGap);
		grid-row-gap: var(--rowGap);
	}
	.col--2.wrapCol,
	.col--3.wrapCol {
		flex-wrap: wrap;
	}
	.col--2 > * {		width: calc((100% / 2) - (var(--colGap) / 2));	}
	.col--3 > * {		width: calc((100% / 3) - (var(--colGap) / 2));	}

	.col--2 .fgWidth {		flex-grow: 2;}
	.col--2 .fsWidth {		flex-shrink: 2;	}

@media screen and (max-width: 900px) {
	.col--3 {	flex-wrap: wrap; }
	.col--3 > * {		width: calc((100% / 2));	}
}
@media screen and (max-width: 750px) {
	.col--2 {	flex-wrap: wrap; column-gap: 30px; }
	.col--2 > *,
	.col--3 > * {	width: 100%;	}
	.col--2 > *:not(:first-child),
	.col--3 > *:not(:first-child) {}
}




/* ---------------------------------
	fontSize
--------------------------------- */
	h2.ptHeading {
		font-family: var(--site-font_family-serif);
		font-size: clamp(2.2rem, (32 / 1500 * 100vw), 3.2rem);
		text-shadow: 0 0 2px rgba(255, 255, 255, .55);
	}
	h3.ptHeading {
		font-size: clamp(2.2rem, (28 / 1000 * 100vw), 2.8rem);
	}

	.ptHeading .kana {
		letter-spacing: -.05em;
		margin-right: .05em;
	}




/* ---------------------------------
	outer setting
--------------------------------- */
/* wrapper ==================== */
	.wrapper {
		position: relative;
	}

/* header ==================== */
	header {
		position: relative;
		z-index: 100;
		padding: var(--site-marpad-XXS) 0;
	}
	.headerCont {
		width: var(--site-sizeContentWide-M);
		max-width: var(--site-sizeMaxWidth-XM);
		margin: 0 auto;
	}
	.headerLogo {
		max-width: 135px;
	}
@media print, screen and (min-width: 750.02px) {
	header {
		position: sticky;
		top: 0;
		backdrop-filter: blur(50px);
	}
	.headerCont {
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	header nav ul {
		display: flex;
		justify-content: flex-end;
	}
	header nav ul li:not(:nth-of-type(1)) {
		border-left: 1px solid rgba(255, 255, 255, .6);
		margin-left: 0.8em;
		padding-left: 0.8em;
	}
	header nav ul dl,
	header nab .spIcon {
		display: none;
	}
}

@media screen and (max-width: 750px) {
	header {
		overflow: hidden;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	header nav {
		position: fixed;
		top: 0;
		right: 0;
		width: 80%;
	}
	header nav .spIcon {
		transform: translateX(-50px);
		position: absolute;
		top: calc(var(--site-marpad-XXS) / 2);
		left: 0;
		display: block;
		width: 50px;
		height: 50px;
		backdrop-filter: blur(10px);
	}
	header nav .spIcon span,
	header nav .spIcon::before,
	header nav .spIcon::after {
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		display: block;
		width: 30px;
		height: 3px;
		background: #FFF;
	}
	header nav .spIcon::before {
		content: "";
		top: 30%;
	}
	header nav .spIcon::after {
		content: "";
		top: 70%;
	}
	header nav ul {
		height: 100dvh;
		flex-grow: 1;
		background: rgba(var(--site-themeColor-base), 1);
		padding: var(--site-marpad-XXS) var(--site-marpad-XS);
	}
	header nav ul li a {
		display: block;
	}
	header nav ul li > a {
		position: relative;
		font-size: 1.2em;
		line-height: 2.8em;
		padding-left: 1em;
		border-top: 1px solid rgba(255, 255, 255, .8);
	}
	header nav ul li > a::before {
		content: "";
		display: block;
		position: absolute;
		left: 0;
		top: 50%;
		transform: translateY(-50%);
		border: 5px solid transparent;
		border-left-color: #FFF;
	}
	header nav ul li dl {
		margin-left: 1em;
	}
	header nav ul li dt {
		background: rgba(255, 255, 255, .15);
		padding: 0 0.5em;
	}
	header nav ul li dd {
		display: block;
		line-height: 1.2;
		padding: 0.3em;
	}
	header nav ul li dd a {
		line-height: 2.0em;
	}
	header nav ul li dd:not(:nth-of-type(1)) {
		border-top: 1px dotted rgba(255, 255, 255, .6);
	}
	header nav ul li dl dd span {
		display: inline-block;
	}
	
	
	/* menu Open / Close */
	body::after {
		opacity: 0;
		content: "";
		position: fixed;
		top: 0;
		left: 0;
		z-index: 10;
		display: block;
		width: 100%;
		height: 100%;
		background: rgba(0, 0, 0, .6);
		pointer-events: none;
	}
	body.spMenuOpen {
		overflow-y: hidden;
	}
	body.spMenuOpen::after {
		opacity: 1;
		transition: 0.3s all ease;
		pointer-events: all;
	}
	

	header nav {
		transform: translateX(100%);
		transition: 0.5s all ease;
	}
	body.spMenuOpen header nav {
		transform: translateX(0);
	}
	
	body.spMenuOpen header nav .spIcon span {
		display: none;
	}
	body.spMenuOpen header nav .spIcon::before {
		top: 50%;
		transform: translate(-50%, -50%) rotate(45deg);
	}
	body.spMenuOpen header nav .spIcon::after {
		top: 50%;
		transform: translate(-50%, -50%) rotate(-45deg);
	}
}
/* footer ==================== */

	footer {
		text-align: center;
	}
	.footerLogo {
		margin: var(--site-marpad-XS) auto ;
	}
	.footerLogo img {
		max-width: 135px;
	}









/* ---------------------------------
	common parts
--------------------------------- */
	.techDetailUnit dt {
		text-align: center;
		line-height: 2.0em;
		font-weight: normal;
		font-size: 1.1em;
		background: rgba(255, 255, 255, .15);
		margin-bottom: 2em;
	}
	.techDetailUnit dd {
		text-align: center;
	}


/* mainVisual ====================== */
	.mainVisual {
		position: relative;
		display: flex;
		gap: 40px;
		justify-content: space-between;
		width: var(--site-sizeContentWide-M);
		max-width: var(--site-sizeMaxWidth-M);
		margin: 0 auto;
		text-align: right;
		padding: var(--site-marpad-M) 0;
	}
	.mainVisual .productLogoArea {
		position: relative;
		z-index: 5;
	}
	.mainVisual .productLogoArea .btnUnit {
		width: 80%;
		max-width: 200px;
		margin: var(--site-marpad-XS) auto 0;
	}
	.mainVisual .productCopyArea {
		z-index: 5;
		position: relative;
		text-align: left;
		font-family: var(--site-font_family-serif);
	}
	.mainVisual .productCopyArea .mainCopy {
		width: 100%;
		max-width: 360px;
	}
	.mainVisual .productCopyArea p + p {
		font-size: 1.4em;
		font-size: clamp(1.6rem, (17 / 1260 * 100vw), 1.7rem);
		letter-spacing: 0.1em;
		line-height: 2;
		margin-top: 2.3em;
	}
	.mainVisual .productCopyArea p {
	}
	.mainVisual .productBtn {
	}
	body:not(.indexP) .mainVisual .productPicArea {
		position: absolute;
		z-index: 0;
		top: 43%;
		left: 20%;
		transform: translate(-30%, -50%);
		width: 60%;
		max-width: 650px;
		mix-blend-mode: lighten;
	}
	.mainVisual .productPicArea img {
		max-width: 100%;
		mix-blend-mode: lighten;
	}


@media screen and (max-width: 1260px) {
	.mainVisual .productCopyArea p + p {
		font-size: 1.30vw;
	}
}
@media screen and (min-width: 900.02px) {
	.mainVisual .productLogoArea {
		order: 2;
	}
}
@media screen and (max-width: 900px) {
	.mainVisual {
		display: block;
		text-align: center;
	}
	body:not(.indexP) .mainVisual .productLogoArea {
		padding: 0 0 var(--site-marpad-S);
	}
	body:not(.indexP) .mainVisual .productCopyArea {
		width: 90%;
		margin-left: auto;
		margin-right: 5%;
		padding: var(--site-marpad-S) 0 var(--site-marpad-XS);
	}
	body:not(.indexP) .mainVisual .productCopyArea .mainCopy {
	}
	.mainVisual .productCopyArea p + p {
		font-size: 2.37vw;
	}
	body:not(.indexP) .mainVisual .productPicArea {
		width: 100%;
		max-width: none;
		top: 37vw;
		left: 0;
		transform: translate(-50%, -50%);
	}
}
@media screen and (min-width: 750.02px) and (max-width: 900px) {
}
@media screen and (max-width: 750px) {
	.mainVisual .productCopyArea p + p {
		font-size: 3.2vw;
	}
}
@media screen and (max-width: 480px) {	
	body:not(.indexP) .mainVisual .productCopyArea {
		width: 100%;
		margin-right: auto;
		padding: var(--site-marpad-S) 0 var(--site-marpad-XS);
	}
	body:not(.indexP) .mainVisual .productCopyArea .mainCopy {
		width: 80%;
	}
	body:not(.indexP) .mainVisual .productPicArea {
		top: 46vw;
		left: -2vw;
	}
}


/*	productsTech ==================== */

	.productsTechBg {
		position: relative;
		background: url("../images/index/bg.jpg") bottom center no-repeat;
		background-size: 100% auto;
		padding-bottom: 100px;
	}

@media screen and (max-width: 480px) {	
	.productsTechBg {
		background-size: 180% auto;
	}
}
	.productsTech {
		position: relative;
		z-index: 3;
		width: var(--site-sizeContentWide-M);
		max-width: var(--site-sizeMaxWidth-XM);
		margin: 0 auto;
		padding: 0 0 var(--site-marpad-L);
	}

	.productsTech section {
		margin-top: var(--site-marpad-M);
	}

	.productsTech ol {
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between;
		align-items: flex-start;
		
		--colGap: 60px;
		--rowGap: 30px;
	}
	.productsTech ol li {
		width: calc((100% / 2) - var(--colGap) / 2);
		margin-top: var(--site-marpad-M);
	}
	.productsTech ol li.colWidthFull {
		width: 100%;
	}
	.productsTech ol li .leadTxt {
		font-size: 1.1em;
		font-weight: 300;
		margin-bottom: 1.8em;
		line-height: 2.0em;
		letter-spacing: 0.05em;
	}

@media screen and (max-width: 900px) {
	.productsTech ol li {	width: 100%;	}

	.productsTech .col--2 {	flex-wrap: wrap; }
	.productsTech .col--2 > *,
	.productsTech .col--3 > * {	width: 100%;	}
}



	.hybridPointUnit {
		margin-top: var(--site-marpad-S);
	}
	.hybridPointUnit dt {		display: inline-block;	padding: 0 0.3em;	font-weight: 400;	}
	.hybridPointUnit dt::after {
		content: "：";
		display: inline;
	}
	.hybridPointUnit dt:nth-of-type(1) {
		background: linear-gradient(to bottom, transparent 50%, #035c69 50% 80%, transparent 80%);
	}
	.hybridPointUnit dt:nth-of-type(2) {
		background: linear-gradient(to bottom, transparent 50%, #7b3f79 50% 80%, transparent 80%);
	}

	.hybridPointUnit dd {		display: inline;	}
	.hybridPointUnit dd::after {
		content: "";
		display: block;
		margin-bottom: var(--site-marpad-XS);
	}






	.productsTech ol li .radicalPointUnit {
		margin-bottom: var(--site-marpad-XS);
	}
	.productsTech ol li .radicalPointUnit div {
		display: grid;
		grid-template-rows: auto auto;
		grid-template-columns: 130px 1fr;
		grid-column-gap: 15px;
		margin-bottom: 15px;
	}
	.productsTech ol li .radicalPointUnit div dt {
		grid-row: 1 / 2;
		grid-column: 2 / 3;
		margin-top: auto;
	}
	.productsTech ol li .radicalPointUnit div dt > span {
	}
	.productsTech ol li .radicalPointUnit div dt span span {
		display: inline-block;
		font-family: var(--site-font_family-en_1);
		font-size: 0.9em;
		font-weight: 300;
		padding-right: 0.5em;
		background: linear-gradient(to bottom, transparent 50%, rgba(255, 255, 255, .2) 50% 80%, transparent 80%);
	}
	.productsTech ol li .radicalPointUnit div dt span i {
		display: inline-block;
		font-weight: 400;
		font-size: 1.2em;
		margin-left: 0.1em;
	}
	.productsTech ol li .radicalPointUnit div dt em {
		display: inline-block;
		font-style: normal;
		font-size: 1.1em;
		padding-right: 0.5em;
		background: linear-gradient(to bottom, transparent 50%, rgba(255, 255, 255, .2) 50% 80%, transparent 80%);
	}
	.productsTech ol li .radicalPointUnit div dd.picUnit {
		grid-row: 1 / 3;
		grid-column: 1 / 2;
	}
	.productsTech ol li .radicalPointUnit div dd.txtUnit {
		grid-row: 2 / 3;
		grid-column: 2 / 3;
	}

	/*.productsTech .col--2 {		width: calc((100% / 2) - 40px);	}
	.productsTech .col--3 > * {		width: calc((100% / 3) - 40px);	}*/


	.productsTech hgroup {
		margin-bottom: var(--site-marpad-XS);
	}
	.productsTech hgroup p {
		display: flex;
		align-items: flex-end;
		margin-bottom: var(--site-marpad-XS);
	}
	.productsTech hgroup p em {
		display: block;
		font-style: normal;
		font-family: var(--site-font_family-en_1);
		font-size: 2.5em;
		line-height: .8;
		margin-right: 8px;
	}
	.productsTech hgroup p i {
		display: block;
		line-height: 1.2;
		font-family: var(--site-font_family-en_2);
		font-size: .8em;
		margin-right: 10px;
	}
	.productsTech hgroup p::after{
		content: "";
		flex-grow: 1;
		display: block;
		width: 100%;
		height: 3px;
		margin-bottom: 5px;
		border: 1px solid rgba(255, 255, 255, .6);
		border-width: 1px 0;
	}

@media screen and (max-width: 480px) {	
	.productsTech ol li .radicalPointUnit div {
		grid-template-columns: 110px 1fr;
	}
	.productsTech ol li .radicalPointUnit div dt {
		margin-bottom: 0.3em;
		line-height: 1.6;
	}
}



/* colWidthFull */
@media screen and (min-width: 900.02px) {
	.productsTech .colWidthFull .fullUnitHeader {
		display: grid;
		grid-template-columns: auto 1fr;
		grid-template-rows: auto 1fr;
		column-gap: 30px;
		margin-bottom: var(--site-marpad-XS);
	}
	.productsTech .colWidthFull .fullUnitHeader hgroup {
		grid-column: 1 / 3;
		grid-row: 1 / 2;
		margin-bottom: 0;
	}
	.productsTech .colWidthFull .fullUnitHeader h2 {
		grid-column: 1 / 2;
		grid-row: 2 / 3;
	}
	.productsTech .colWidthFull .fullUnitHeader .leadTxt {
		display: flex;
		align-items: flex-end;
		grid-column: 2 / 3;
		grid-row: 2 / 3;
		margin-bottom: 0;
	}
}







/* uniqueTechOutline=================================*/
	.uniqueTechOutline {
		text-align: center;
	}
	.uniqueTechOutline section {
		position: relative;
		margin-top: -100px;
	}
	.uniqueTechOutline .uniqueTechHgroupWrap {
		position: relative;
	}
	.uniqueTechOutline > * {
		position: relative;
		z-index: 3;
	}
	.uniqueTechOutline hgroup {
		display: block;
		width: 100%;
		background: url("../images/share/line_bg_wall.png") center center no-repeat;
		background-size: 100% auto;
		mask-image: url("../images/share/line_mask.svg");
		mask-position: center;
		mask-size: cover;
		mask-repeat: no-repeat;
		mask-clip: border-box;
		padding: 3px 0 10px;
	}
	.uniqueTechOutline .uniqueTech-wall hgroup {background-image: url("../images/share/line_bg_wall.png");	}
	.uniqueTechOutline .uniqueTech-roof hgroup {background-image: url("../images/share/line_bg_roof.png");	}
	.uniqueTechOutline .uniqueTech-heatShield hgroup {background-image: url("../images/share/line_bg_heatshield.png");	}

	.uniqueTechOutline hgroup > div {
		display: flex;
		align-items: flex-start;
		width: 96%;
		max-width: 1100px;
		margin: 0 auto;
	}
	.uniqueTechOutline hgroup > div > h2 {
		width: 6em;
		font-family: var(--site-font_family-basic);
		font-size: clamp(3.0rem, (40 / 1000 * 100vw), 4.0rem);
		letter-spacing: 0.8em;
	}
	.uniqueTechOutline .uniqueTech-heatShield hgroup > div > h2 {
		letter-spacing: 0.4em;
	}
	.uniqueTechOutline hgroup > div > p {
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: center;
		column-gap: 1em;
		text-align: left;
		font-size: 1.8em;
		font-weight: bold;
		line-height: 1.2;
	}
	.uniqueTechOutline hgroup > div > p > span {
		display: block;
		line-height: 1;
	}
	.uniqueTechOutline hgroup > div > p > span small {
		display: inline-block;
		margin-bottom: 0.3em;
		line-height: 1;
	}

@media screen and (max-width: 900px) {
	.uniqueTechOutline hgroup {
		padding: 1.2em 0;
		background-size: 150%;
	}
	.uniqueTechOutline hgroup > div {
		flex-direction: column;
		align-items: center;
		column-gap: 1em;
	}
	.uniqueTechOutline hgroup > div > h2 {
		width: 94%;
		text-align: center;
		font-size: 3.5vw;
		border: 1px solid rgba(255, 255, 255, .8);
	}
	.uniqueTechOutline hgroup > div > p {
	}
	.uniqueTechOutline hgroup > div > p > br {
		display: none;
	}
}
@media screen and (max-width: 750px) {
	.uniqueTechOutline hgroup {
	}
	.uniqueTechOutline hgroup > div {
	}
	.uniqueTechOutline hgroup > div > h2 {
		font-size: 4vw;
	}
	.uniqueTechOutline hgroup > div > p {
		width: 94%;
		flex-direction: column;
		align-items: center;
		gap: 0.5em;
		font-size: 5.6vw;
		text-align: left;
	}
	.uniqueTechOutline hgroup > div > p > span small {
		font-size: 2.2vw;
	}
}


	.uniqueTechOutline .uniqueTechHgroupWrap + div {
		background: url("../images/share/bg_products.jpg") left -100px repeat;
		background-size: 100% calc(100% + 100px);
		padding-top: 5px;
	}
	.uniqueTechOutline section:not(:last-child) .uniqueTechHgroupWrap + div {
		padding-bottom: 100px;
	}
			.uniqueTechOutline section .uniqueTechHgroupWrap::before {
				content: "";
				position: absolute;
				top: 0;
				left: 0;
				display: block;
				width: 50%;
				height: 100%;
				background: url("../images/share/bg_products.jpg") left 0 repeat;
				background-size: 200% ;
			}
	.uniqueTechOutline .uniqueTech-wall .uniqueTechHgroupWrap + div,
	.uniqueTechOutline section.uniqueTech-wall .uniqueTechHgroupWrap::before {
		background-image: url("../images/wall/bg_wh.jpg") ;
	}
	.uniqueTechOutline .uniqueTech-roof .uniqueTechHgroupWrap + div,
	.uniqueTechOutline section.uniqueTech-roof .uniqueTechHgroupWrap::before {
		background-image: url("../images/roof/bg_wh.jpg") ;
	}
	.uniqueTechOutline .uniqueTech-heatShield .uniqueTechHgroupWrap + div,
	.uniqueTechOutline section.uniqueTech-heatShield .uniqueTechHgroupWrap::before {
		background-image: url("../images/roof_heatshield/bg_wh.jpg") ;
	}



	.uniqueTechOutline .uniqueTechHgroupWrap + div > div {
		width: var(--site-sizeContentWide-M);
		max-width: var(--site-sizeMaxWidth-S);
		color: #000;
		margin: 10px auto 0;
		padding: var(--site-marpad-XS);
	}
	.uniqueTechOutline .uniqueTechHgroupWrap + div .col--2 {
		display: flex;
		justify-content: space-between;
		column-gap: 20px;
		align-items: center;
		margin-bottom: var(--site-marpad-S);
	}
	.uniqueTechOutline .uniqueTechHgroupWrap + div .col--2 .txtArea {
		width: 48%;
	}
	.uniqueTechOutline .uniqueTech-heatShield .uniqueTechHgroupWrap + div .col--2 .txtArea {
		width: 60%;
	}
	.uniqueTechOutline .uniqueTechHgroupWrap + div h3.ptHeading {
		font-family: var(--site-font_family-serif);
		text-align: left;
	}
	.uniqueTechOutline .uniqueTechHgroupWrap + div h3.ptHeading span {
		
		background: linear-gradient(to bottom, transparent 60%, rgba(var(--marker-color), .2) 60% 80%, transparent 80%);
	}
	.uniqueTechOutline .uniqueTechHgroupWrap + div h3.ptHeading + p{
		text-align: left;
		margin-top: 1.8em; 
	}


	.uniqueTechOutline .uniqueTech-wall {	--marker-color: 0, 0, 0;	}

	.uniqueTechOutline .uniqueTech-wall {			--marker-color: 0, 0, 0;	}
	.uniqueTechOutline .uniqueTech-roof {			--marker-color: 136, 125, 170;	}
	.uniqueTechOutline .uniqueTech-heatShield {		--marker-color: 170, 125, 125;	}


	.uniqueTechOutline .samplePic {
		display: flex;
		justify-content: space-between;
		column-gap: 20px;
	}
	.uniqueTechOutline .samplePic small {
		display: block;
		text-align: center;
		font-size: 1.0em;
	}

@media screen and (max-width: 750px) {
	.uniqueTechOutline .uniqueTechHgroupWrap + div > div {
		padding: var(--site-marpad-XS) var(--site-marpad-XXS);
	}
	.uniqueTechOutline .uniqueTechHgroupWrap + div .col--2 {
		/*display: block;*/
	}
	/*.uniqueTechOutline .uniqueTechHgroupWrap + div .col--2 > *:nth-of-type(2) {
		margin-top: 2em;
	}*/
	.uniqueTechOutline .uniqueTechHgroupWrap + div .col--2 .txtArea {
		width: 100% !important;
		/*margin-bottom: 3em;*/
	}
	.uniqueTechOutline .uniqueTechHgroupWrap + div .col--2 .txtArea h3 {
		font-size: 5.6vw;
	}
	/*
	.uniqueTechOutline .uniqueTechHgroupWrap + div .col--2 .txtArea h3 br {
		display: none;
	}*/
	.uniqueTechOutline .samplePic {
		width: 100%;
		max-width: 600px;
		justify-content: space-around;
		margin: 0 auto;
	}
	.uniqueTechOutline .uniqueTechHgroupWrap + div h3.ptHeading + p {
		font-size: 1.4rem;
	}
	.uniqueTechOutline .uniqueTechHgroupWrap + div h3.ptHeading + p br {
		display: none;
	}
}





/*	uniqueTech ==================== */
	.uniqueTechWrap {
		position: relative;
	}
	.uniqueTechWrap::before {
		content: "";
		width: 100%;
		height: calc(var(--site-marpad-L) * 2.3);
		position: absolute;
		z-index: 0;
		top: 0;
		left: 0;
		background: linear-gradient(to bottom, transparent 0%, #262424 40% 60%, transparent 100%)
	}

	.uniqueTech {
		--partsColor: 224, 224, 224;
		
		position: relative;
		z-index: 1;
		width: var(--site-sizeContentWide-M);
		max-width: var(--site-sizeMaxWidth-S);
		margin: 0 auto;
		padding: var(--site-marpad-L) 0;
	}
	.uniqueTech > div {
	}
	.uniqueTech h2.ptHeading {
		text-align: center;
		font-family: var(--site-font_family-sans);
		font-size: clamp(2.2rem, (30 / 1000 * 100vw), 3.0rem);
	}
	.uniqueTech h3.ptHeading {
		display: flex;
		align-items: center;
		color: rgba(var(--partsColor), 1);
		font-family: var(--site-font_family-serif);
		font-size: clamp(2.0rem, (26 / 1000 * 100vw), 2.6rem);
		border-bottom: 1px solid rgba(var(--partsColor), .8);
		margin-bottom: 0.6em;
		padding: 0px;
	}
	.uniqueTech h3.ptHeading::before {
		content: "";
		display: inline-block;
		width: 1.5em;
		height: 1.4em;
		background: url("../images/share/ico_default.svg") bottom left no-repeat;
		background-size: auto 100%;
		margin-right: 0.5em;
	}
	.uniqueTech section {
		margin-top: calc(var(--site-marpad-M) * .75);
	}
	.uniqueTech .picUnit {
		text-align: center;
		margin-top: var(--site-marpad-XS);
	}
	.uniqueTech .picTtl {
		display: block;
		line-height: 2em;
		text-align: center;
		background: rgba(255, 255, 255, .15);
		margin-bottom: var(--site-marpad-XXS);
	}

	.uniqueTech .col--2 h3.ptHeading,
	.uniqueTech .col--3 h3.ptHeading {
		font-size: clamp(1.8rem, (22 / 1000 * 100vw), 2.2rem);
	}
	.uniqueTech .col--2 h3.ptHeading::before,
	.uniqueTech .col--3 h3.ptHeading::before {
		height: 1.2em;
	}









/*	productDetail ==================== */

	.productsDetailWrap {
		position: relative;
		background: rgba(var(--site-productColor-base),1);
	}
	.productsDetailWrap::before {
		content: "";
		width: 100%;
		height: calc(var(--site-marpad-L) * 2.3);
		position: absolute;
		z-index: 0;
		top: 0;
		left: 0;
		background: linear-gradient(to bottom, transparent 0%, #181d20 40% 60%, transparent 100%)
	}
	.productsDetail {
		position: relative;
		z-index: 1;
		--partsColor: 224, 224, 224;
		
		width: var(--site-sizeContentWide-M);
		max-width: var(--site-sizeMaxWidth-S);
		font-size: 1.2rem;
		margin: 0 auto;
		padding: var(--site-marpad-L) 0;
	}
	.productsDetail h2.ptHeading {
		text-align: center;
		font-family: var(--site-font_family-sans);
		font-size: clamp(2.2rem, (30 / 1000 * 100vw), 3.0rem);
		margin-bottom: var(--site-marpad-S);
	}
	.productsDetailWrap h2 + div {
		font-size: 1.1em;
	}

	.productsDetail section + section {
		margin-top: var(--site-marpad-M);
	}

	.productsDetail h3.ptHeading {
		display: flex;
		color: rgba(var(--partsColor), 1);
		align-items: flex-start;
		font-family: var(--site-font_family-serif);
		font-size: clamp(2.0rem, (26 / 1000 * 100vw), 2.6rem);
		border-bottom: 1px solid rgba(var(--partsColor), .8);
		margin-bottom: var(--site-marpad-XS);
		padding: 0px;
	}
	.productsDetail h3.ptHeading::before {
		content: "";
		display: inline-block;
		width: 1.5em;
		height: 1.4em;
		background: url("../images/share/ico_default.svg") bottom left no-repeat;
		background-size: auto 100%;
		margin-right: 0.5em;
		margin-bottom: 5px;
	}

@media screen and (max-width: 750px) {
	.productsDetail h3.ptHeading::before {
		width: 2.5em;
	}
}
	.productsDetail h3.ptHeading > span {
		display: block;
		line-height: 1.6;
		
	}
	.productsDetail h4 {
		margin-bottom: 8px;
		padding-left: 8px;
		border-left: 5px solid rgba(var(--partsColor), 1);
		margin-top: var(--site-marpad-XXS);
	}
	.productsDetail .tableWrap + h4 {
		margin-top: var(--site-marpad-XS);
	}
	.productsDetail h4 i {
		display: inline-block;
		background: rgba(255, 255, 255, .3);
		font-size: 0.9em;
		font-style: normal;
		margin: 0 0.5em;
		padding: 0 0.2em;
	}
	
	.productsDetail .specList {
		display: flex;
		justify-content: space-between;
		column-gap: 20px;
	}
	.productsDetail .specList dl {
		flex-grow: 2;
	}
	.productsDetail .specList dt {
		font-weight: bold;
		border-bottom: 1px solid rgba(255, 255, 255, .6);
		margin-bottom: 0.5em;
	}
	.productsDetail .specList dd:not(:nth-of-type(1)) {
		margin-top: 0.8em;
	}
	.productsDetail .specList p {
		text-align: center;
	}
	.productsDetail .specList small {
		display: block;
		color: rgba(255, 255, 255, .6);
	}

	.productsDetailBg {
		background: rgba(0, 0, 0, .15);
		margin-top: var(--site-marpad-XS);
		padding: var(--site-marpad-XXS) var(--site-marpad-XS);
	}
	.productsDetailBg dt {
		font-weight: bold;
		border-bottom: 1px solid rgba(255, 255, 255, .6);
		margin-bottom: 0.5em;
	}
	.productsDetailBg dd:nth-of-type(1) {
		display: flex;
		align-items: flex-start;
		justify-content: flex-start;
		margin: 0.8em 0 0.5em;
	}
	.productsDetailBg dd:nth-of-type(1) i {
		color: #000;
		width: 2.8em;
		text-align: center;
		font-style: normal;
		background: #FFF;
		margin-right: 1em;
		border-radius: 2px;
		padding: 0 0.2em;
	}
	.productsDetailBg dd > span + span {
		margin-top: 0.5em;
	}
	.productsDetail .col--3 {
		gap: 30px;
	}

@media screen and (max-width: 900px) {
	.productsDetail .col--3 {	flex-wrap: nowrap; }
	.productsDetail .col--3 > * {		width: calc((100% / 3));	}
}
@media screen and (max-width: 750px) {
	.productsDetail .col--3 {	flex-wrap: wrap; }
	.productsDetail .col--3 > * {		width: calc((100% / 2) - 15px);	}
}
@media screen and (max-width: 480px) {
	.productsDetail .col--3 > * {	width: 100%;	}
	.productsDetail h3.ptHeading {
		margin-bottom: var(--site-marpad-XXS);
	}
	.productsDetail .specList {
		display: block;
		margin-bottom: var(--site-marpad-S);
	}
	.productsDetail .specList:nth-of-type(2) {
		margin-bottom: var(--site-marpad-M);
	}
	.productsDetail .specList > p {
		margin-top: 2em;
	}
}



/* =================================================
	tableWrap: 	;
================================================= */


	.tableWrap table {
		width: 100%;
		border-bottom: 1px solid rgba(255, 255, 255, .3);
	}
	.tableWrap tr {
		border-top: 1px solid rgba(255, 255, 255, .3);
	}
	.tableWrap table:not(.subTable) th:nth-of-type(1) {
		width: 4em;
	}
	.tableWrap th.cellWidthS {
		width: 4em
	}
	.tableWrap th,
	.tableWrap td {
		text-align: center;
		vertical-align: middle;
		padding: 0.3em 0.8em;
		background: rgba(var(--site-productColor-base),1);
	}
				.uniqueTechWrap .tableWrap th,
				.uniqueTechWrap .tableWrap td {
					background: #121416;
				}
	.tableWrap .tl th,
	.tableWrap .tl td,
	.tableWrap th.tl,
	.tableWrap td.tl {
		text-align: left;
	}

	.tableWrap th + th,
	.tableWrap td,
	.tableWrap .borderCell {
		border-left: 1px solid rgba(255, 255, 255, .3);
	}

	.tableWrap .bgColor-blue th,
	.tableWrap .bgColor-blue td,
	.tableWrap th.bgColor-blue ,
	.tableWrap td.bgColor-blue  {		background: rgba(var(--site-productColor-blue), 1);	}
	.tableWrap .bgColor-yellow th,
	.tableWrap .bgColor-yellow td,
	.tableWrap th.bgColor-yellow ,
	.tableWrap td.bgColor-yellow  {	background: rgba(var(--site-productColor-yellow), 1);	}
	.tableWrap .bgColor-red th,
	.tableWrap .bgColor-red td,
	.tableWrap th.bgColor-red ,
	.tableWrap td.bgColor-red  {		background: rgba(var(--site-productColor-red), 1);	}

	.blueUnit {		--partsColor: 139, 163, 175;	}
	.yellowUnit {	--partsColor: 211, 201, 170;	}
	.redUnit {		--partsColor: 200, 120, 122;	}

	.blueUnit  h3.ptHeading::before {	background-image: url("../images/share/ico_blue.svg");	}
	.yellowUnit  h3.ptHeading::before {	background-image: url("../images/share/ico_yellow.svg");	}
	.redUnit  h3.ptHeading::before {	background-image: url("../images/share/ico_red.svg");	}



@media screen and (max-width: 750px) {
	.tableWrap {
		overflow-x: scroll;
	}
	.tableWrap table:not(.colorTable) {
		min-width: 750px;
	}
	.tableWrap th {
		position: sticky;
		left: 0;
	}
	.tableWrap th:not(:nth-of-type(1)),
	.tableWrap th + td,
	.tableWrap .borderCell{
		position: static;
	}
}






/* =================================================
	common setting
================================================= */