@charset "UTF-8";
/* 

	site.css 2025/01/24 - 
______________________________________________________________________________ */



/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* --var >> */
/* __________________________________________________________________ */
/*
@media (max-width:1279px) {}
@media (max-width: 959px) {}
@media (max-width: 755px) {}
@media (max-width: 639px) {}
@media (max-width: 479px) {}
*/
:root {
	--spacing-base: calc(16 / 20);
	--scroll-padding: 3rem;
	/*
	--width-base: 1280px;
	--header-offset-base: 0px;
	--wrap-inpad: min(var(--spacing-xl),7vw);
	--radius-base: var(--spacing-md);
	
	--co-act-theme-ease: ease;
	--transition: all 200ms var(--co-act-theme-ease) 50ms;
	*/
	letter-spacing: .02em;

	--fallback-bg: url(../img/common/bg_fallback.jpg);
	--lr-1-bg: url(../img/common/ph_01.jpg);
	--lr-2-bg: url(../img/common/ph_02.jpg);
	--main-bg: var(--fallback-bg);

	--font-base: 20;
	--font-sp-base: 13;
	--font-base-weight: 350;
	--font-p: "Noto Sans JP";
	/*--font-p-weight: 350;*/
	--font-hx: "new-frank", "Noto Sans JP";
	--font-hx-weight: 400;
	--font-en: "new-frank", "Noto Sans JP";
	/*--font-en-weight: 350;*/
	--font-din: "din-condensed", Arial;
	--font-din-weight: 400;
	--font-family-base:-apple-system,BlinkMacSystemFont,"Segoe UI","Hiragino Sans","Noto Sans CJK JP",Roboto,Meiryo,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol";
	--fwmin: 375;

	--col-key: #8ebd45;		/* #70bd44 green */
	--col-key-rgb: 142 189 69;
	--col-key-a: #65c643b2;	/* #5fbf29a1 green + alpha */
	--col-act: #ed8b00;		/*  #ff8d00orange */
	--col-act-b: #cc7800;		/* #dd8200 orange (dark) */
	--col-light_green: #cfe8a9;	/* #ceeaab light_green #9ec153 */
	--col-soft_green: #b5d485;
	--col-vivid_green: #4ab520;
	--col-black: #3f464b;		/* #43494a black */
	--col-black-a: #3f464b78;	/* #5e6066a3 black + alpha */
	--col-gray: #a7adb6;		/* #a6abb3 gray */
	--col-gray-a: #a7adb6c9;
	--col-visited: #068db4;
	--col-txt: #43494a;
	--col-bg: #fefefe;
	--col-selection: rgb(20 20 20 / .3);
	--base-deg: 30deg;

	--om-bt-oc: var(--col-white);
/*
	--om-bt-ma: calc(var(--spacing-unit) * 7);
	--om-bt-lh: 2px;
	--body-width: 100vw;
	--max-width: min(var(--width-base,100vw),100vw);
	--current-width: var(--body-width);
	--offset-top: calc( var(--header-offset) + env(safe-area-inset-top, 0px));
*/
}
@media (max-width:375px){
	:where(html,.co_f,.co_fp p,h1,h2,h3,h4,h5,dt,.bt) {
		font-size: calc(var(--fmin) * 1px);
	}
}/* common.css>site.css */

html.func {
	--scroll-padding: 0px;
}


.fn_60deg {
	transform: skewX(calc(var(--base-deg) * -1));
}
.fn_reset_60deg {
	transform: skewX(var(--base-deg));
}


/* lang >> */
html[lang="en"] .is_ja,
html[lang="ja"] .is_en {display:none}
.lang_ja {font-family:var(--font-p),var(--font-family-base)}
.lang_en {font-family:var(--font-en),var(--font-family-base)}

.co_func_lang {
	height: auto;
	min-height: auto;
	grid-template-columns: 1fr 1fr;
	font-family: var(--font-en),var(--font-family-base);
	gap: .2em;
	transition: var(--transition);
	display: grid;
	text-decoration: none;
}
.co_func_lang > div {
	display: grid;
	place-content: center;
	padding-top: .3em;
	min-height: 1.2em;
	min-width: 1.8em;
	line-height: 1;
}
	html[lang="en"] .bt_en,
	html[lang="ja"] .bt_ja {
		color: var(--col-white);
		background-color: var(--col-act);
		padding-left: .3em;
		font-weight: 400;
	}
	html[lang="en"] a:hover > .bt_ja,
	html[lang="ja"] a:hover > .bt_en {
		color: var(--col-white);
		background-color: var(--col-key);
	}
.co_global .co_func_lang {
	font-size: .72em;
}
/* << lang */


/* marker >> */
.co_marker {
	background-image: linear-gradient(var(--col-light_green),var(--col-light_green));
	padding-inline: .3em;
	color: inherit;
	text-decoration: none;
	font-weight: var(--font-base-weight);
	transition: var(--transition);
}
	.co_marker +.co_marker {
		margin-left: .3em;
	}
	.co_marker {	/* +.act */
		background-size: 0% 100%;
		transition-delay: 700ms;
		transition-duration: 600ms;
	}
	p.inview .co_marker {
		background-size: 100% 100%;
	}
/* << marker */


/*
#main {}
*/
:where(section.sec:not(.width_full)) {
	padding-block: calc(var(--spacing-2xl) * 1.65);
}

:where(.inner.co_contents, .co_inpad) {
	padding-block: var(--spacing-xl) var(--spacing-2xl);
}
:where(.co_contents .co_box) {
	padding: var(--spacing-xl) var(--wrap-inpad) 0;
	border: 1px solid var(--col-key);
	/* background-color: rgb(var(--col-key-rgb) / .05); */
}
:where(.co_contents .co_box)>:last-child {
	margin-bottom: var(--spacing-xl);
}
:where(.co_contents .info_box) {
	border-style: solid;
	border-width: 3px 0 1px;
	border-block-color: var(--col-black) var(--col-gray);
	padding: var(--spacing-lg) 0 var(--spacing-xl);
}
* + :where(.co_contents .info_box) {
	margin-top: var(--spacing-3xl);
}

.co_img figcaption {
	color: var(--col-key);
	margin: 0;
	padding: .3em;
}
.co_f figcaption {
	font-size: inherit;
}
.co_contents.co_float_lr>figure {
	order: 2;
	--g-float: none;
	--g-w: min(50%, 350px);
	--g-m: var(--spacing-lg);
	float: var(--g-float, none);
}

.co_img.co_center.co_f {
	--fmax: 20;
	--fmin: 13;
	--fmax: 25;									/* font */
	--fmin: 15;
}
.co_img,
figure.co_img.co_center {
	text-align: center;
}
figure.co_img.co_left {
	--g-float: left;
	text-align: left;
	margin: 0 var(--g-m) var(--g-m) 0;
	width: var(--g-w);
}
figure.co_img.co_right {
	--g-float: right;
	text-align: right;
	margin: 0 0 var(--g-m) var(--g-m) ;
	width: var(--g-w);
}
.co_box>figure.co_img.co_left {
	width: min(50%,250px);
	float: left;
	padding: 0 var(--spacing-xl) var(--spacing-xl) 0;
}
.co_box>figure.co_img>:is(img,video) {
	object-fit: cover;
	aspect-ratio: 1/1;
}

.co_box>hgroup.h_4:first-of-type {
	padding-top: 0;
}

@media (max-width: 639px) {
	.co_contents.co_float_lr {
		display: flex;
		flex-direction: column;
		gap: var(--spacing-md);
	}
	.co_contents.co_float_lr>* {
		margin: 0;
		order: 3;
	}
	.co_contents.co_float_lr>p:first-of-type {
		order: 1;
	}
	.co_contents.co_float_lr>figure {
		--g-w: 85%;
		margin: var(--spacing-lg) auto;
		text-align: center;
	}
}


/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* << --var */
/* __________________________________________________________________ */



/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* bg / color >> */
/* __________________________________________________________________ */

/* .page_feature>#main {--main-bg: url(../img/pages/feature/bg.jpg)}
.page_column>#main {--main-bg: url(../img/pages/column/bg.jpg)}
.page_inquire-form>#main {--main-bg: url(../img/pages/inquire-form/bg.jpg)} */
.page_applications>#main {--main-bg: url(../img/pages/applications/bg.jpg)}
.page_support>#main {--main-bg: url(../img/pages/support/bg.jpg)}
.page_properties>#main {--main-bg: url(../img/pages/properties/bg.jpg)}
#main {
	background-image: var(--main-bg);
	background-attachment: fixed;
	background-size: cover;
}
:where(.co_m_dash.co_mark>li) {
	--m-col: var(--col-gray);
	--c1: var(--m-col);
}
	:where(.co_m_dash.co_mark>li)::before {
		width: calc(var(--m-gap) - var(--m-lw));
		height: 1px;
		background-color: var(--c1);
		aspect-ratio: auto;
	}

:where(.co_m_square.co_mark) {
	--c2: var(--col-key);
}
	.co_m_square.co_mark > li::before {
		font-size: .75em;
		top: 50%;
		translate: 0 -40%;
	}
.bg_gray {
	background-color: #787D80;
	background-image: radial-gradient(circle min(960px,120vw) at center 10% ,#fff4,#5e6066);
}
.bg_hr {
	background-image: linear-gradient(#eff0ee,var(--col-white) var(--spacing-3xl));
}

/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* << bg / color */
/* __________________________________________________________________ */



/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* co_global >> */
/* __________________________________________________________________ */

.co_header .co_nav {
	flex-wrap: nowrap;
	height: 100%;
	--gap: var(--spacing-xs);
}

.co_global {
	z-index: 9991;
	display: grid;
	min-height: var(--hamburger-height);
	background-color: var(--col-white);
}
.co_global::after {
	content: "";
	position: absolute;
	right: 0;
	transition: opacity 500ms ease-out 0ms;
	background-color: var(--col-black);
	width: var(--ll);
	height: 100%;
	--ll: calc((var(--om-bt-pd) * 2) + var(--om-bt-wx) + (var(--wrap-inpad) / 1.5));
	opacity: 0;
}
#om-off:not(:checked) ~ .co_global {
	position: fixed;
}
#om-off:not(:checked) ~ .co_global::after {
	opacity: 1;
}
#om-off:not(:checked) ~ main {
	padding-top: var(--offset-top);
}
.co_global > .co_flex {
	justify-content: space-between;
	padding-inline: 0;
}
	.co_global menu.co_nav {
		font-size: 15px;									/* font */
		font-weight: 450;
		font-feature-settings: initial;
		letter-spacing: .2em;
		--gap: 1.2vw;
	}
		.co_global a span {	/* 2文字対策 */
			min-width: 3em;
			text-align: justify;
			text-align-last: justify;
			display: block;
		}
		.co_global .co_nav.co_mark a::before {
			transition: var(--transition);
			opacity: 0;
		}
		.co_global .co_nav.co_mark a:hover::before,
		.co_global .co_nav.co_mark .current a::before {
			opacity: 1;
		}
	.co_nav.co_func {
		--fmax:22;
		--fmin:15;										/* font */
		--gap: var(--spacing-lg);
	}
		.co_nav.co_func>.link_mail a {
			min-width: 30px;
		}
		.co_global .link_mail > a > img {
			height: 1em;
		}
@media (max-width:1279px) {
	.co_global menu {
		display: none;
	}
	.co_nav.co_func {
		margin-right: var(--spacing-md);
	}
}
@media (max-width: 639px) {
	.co_nav.co_func {
		--gap: var(--spacing-sm);
	}
}


/* om >> */
:root {
	--om-bt-ma: calc(var(--spacing-unit) * 7);
	--om-bt-lh: 2px;
}
.om {
	background-color: var(--col-black);
	color: var(--col-white);
}
	.om-page {
		background-color: var(--col-transparent);
	}
	.om a {
		color: var(--col-white);
		text-decoration: none;
	}

.om-bt span:nth-of-type(2),
.om-bt-base {
	display: none;
}
	.om-bt-base {
		border-radius: var(--radius-m);
		translate: 0 6px;
	}
	.om-bt-base .om-bt {
		--om-bt-sp: 5px;
	}
@media (max-width:1279px) {
	:root {
		--om-bt-ma: calc(var(--spacing-unit) * 4);
	}
	.co_global > .co_flex {
		padding-inline: 0 calc(var(--wrap-inpad) / 2 + var(--hamburger-offset,0px));
	}
	.om-bt-base {
		display: block;
	}
}
@media (max-width: 639px) {
	:root {
		--om-bt-ma: calc(var(--spacing-unit) * 3);
		--om-bt-lh: 1px;
	}
	.co_global > .co_flex {
		padding-inline: 0 var(--hamburger-offset,0px);
	}
	.om-bt-base .om-bt {
		--om-bt-sp: 4px;
	}
}
/* << om */
/* om-page >> */
.om-has-space .om-page {
	margin-bottom: 0;
}
.om-page .list.co_nav li + li {
	border-top: 1px solid var(--col-bg);
	padding-top: var(--spacing-sm);
	margin-top: var(--spacing-sm);
}
.om-page .co_nav.co_mark a::before {
	opacity: 0;
}
	.om-page .co_nav.co_mark .current a::before {
		opacity: 1;
	}
.om-page .co_nav.co_mark a::after {
	content: "";
	position: absolute;
	inset: 50% 0 0 auto;
	translate: 0 -50%;
	width: 1.5em;
	height: 2em;
	aspect-ratio: 3/4;
	background-image: url(../img/common/arrow_white.svg);
	background-position: center;
	background-size: auto 90%;
	opacity: .7;
}
	.om-page .co_nav.co_mark .current a::after {
		content: none;
	}
.om-page :is(.is_ja, .is_en) {
	margin-inline: auto;
	width: 100%;
}
.om-page hr {
	color: rgb(var(--col-bg-rgb) / .8);
}
.om-page a.bt {
	color: var(--col-black);
}
.om-page .list.co_mark.co_m_dash {
	margin-block: var(--spacing-2xl);
}
.om-page .list.co_mark.co_m_dash a {
	min-height: auto;
}
/* << om-page */


/* logo >> */
.logo img {
	display: block;
	width: auto;
	height: 1em;
}
.co_global .logo {
	margin-right: 0;
	grid-auto-flow: column;
	gap: var(--spacing-sm);
}
	.co_global .logo a {
		padding-block: var(--spacing-sm);
	}
	.co_global .logo img {
		height: 1.52rem;
	}
@media (max-width: 639px) {
	.co_global .logo img {
		height: 1.21rem;
	}
}
/* << logo */

/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* << co_global */
/* __________________________________________________________________ */



/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* co_main_header >> */
/* __________________________________________________________________ */

:root {
	--hsmax: calc(15 * 16);
	--hsmin: calc(5.2 * 13);
	--slash_base_width: calc((1vw * ( var(--hsmax) - var(--hsmin) ) / (var(--fwmax) - var(--fwmin)) * 100) + (((var(--fwmax) / 100 * var(--hsmin)) - (var(--fwmin) / 100 * var(--hsmax))) / (var(--fwmax) - var(--fwmin)) * 100 * 1px));
	/* --slash_base_width: 15rem; */
	--head_position: .62;	/* 16:9のどこにヘッダ下限がくるか */
}
@media (min-width:1280px){
	:root {
		--slash_base_width: calc(var(--hsmax) * 1px);
	}
}
@media (max-width:375px){
	:root {
		--slash_base_width: calc(var(--hsmin) * 1px);
	}
}

.co_main_header {
	aspect-ratio: 16/9;
	padding: 0;
	margin-top: calc(var(--hamburger-height) * -1 );
}
	.co_main_header>.inner {
		height: calc((min(1920px,100vw) * var(--head_position) / 16 * 9) - var(--hamburger-height));
		padding-left: 0;
		position: relative;
	}
	.co_main_header .co_header_elem {
		height: 100%;
		margin-top: var(--hamburger-height);
		width: calc(var(--slash_base_width) + (min(1920px,100vw) * calc(1 - var(--head_position)) / 16 * 9 / 1.732050));
		position: relative;
		padding-left: 3em;
	}
/* header_elem.act >> */
.co_header_elem>*,
.co_header_elem::after,
.co_header_elem::before {
	transition: var(--transition);
}
.co_header_elem>* {
	opacity: 0;
	translate: -10vw 0;
	transition-duration: 800ms;
	transition-delay: 800ms;
}
.co_function_header .co_header_elem>* {
	translate: 0 -5vh;
}
.co_header_elem::after,
.co_header_elem::before {
	translate: -100vw 0;
	transition-duration: 800ms;
	transition-delay: 400ms;
}
.view .co_header_elem>*,
.view .co_header_elem::after,
.view .co_header_elem::before {
	translate: 0 0;
}
.view .co_header_elem>* {
	opacity: 1;
}
/* << header_elem.act */

.co_main_header .co_header_elem>hgroup {
	display: flex;
	flex-direction: column;
	justify-content: center;
	justify-content: flex-end;
}
	.co_main_header .co_header_elem>* {	/* for border-image */
		position: relative;
		z-index: 1;
	}
	.co_main_header .co_header_elem::after,
	.co_main_header .co_header_elem::before {
		--head-element-right: var(--col-key-a);
		content: "";
		height: 100%;
		position: absolute;
	}
	.co_main_header .co_header_elem::after {
		transform: skewX(calc(var(--base-deg) * -1));
		transform-origin: bottom;
		left: 100%;
		top: 0;
		width: 0;
		background-color: var(--head-element-right);
		border-right: calc(3 * 1rem) solid;
		border-image: linear-gradient(var(--col-white),var(--col-white)) 0 fill/1/0 0px 0 200vw;
	}
	.co_main_header .co_header_elem::before {
		right: 100%;
		border-image-outset: 0 0px 0 50vw;
	}

.co_header_elem hgroup>h1 {
	line-height: 1.3;
	margin-block: 1em -.15em;
	position: relative;
	white-space: nowrap;
}
	.co_header_elem hgroup>h1::before {
		content: "";
		background-color: var(--col-key);
		height: 2px;
		width: max(.45em,1.6rem);
		display: block;
		position: absolute;
		left: calc(var(--leading-trim) / -2);
		top: -.25em;
	}
	.co_center.co_header_elem hgroup>h1::before {
		left: calc(50% - (max(.45em,1.6rem) / 2));
	}
.co_header_elem .tagline {
	font-size: 15px;										/* font */
	line-height: 2.5;
	translate: 0 2.5em;
	letter-spacing: -.03em;
	margin-right: -9em;
	white-space: nowrap;
}
/* tagline.act >> */
.co_header_elem .tagline {
	opacity: 0;
	translate: 0 calc(2.5em + 10px);
	transition: var(--transition);
	transition-duration: 400ms;
	transition-delay: 1800ms;
}
.view .co_header_elem .tagline {
	opacity: 1;
	translate: 0 2.5em;
}
/* << tagline.act */
@media (max-width:1279px) {
	/* tagline.act >> */
	.view .co_header_elem .tagline {
		translate: 0;
	}
	/* << tagline.act */
	.co_header_elem .tagline {
		translate: 0;
		margin-right: 0;
		white-space: normal;
		margin-block: 3em 2em;
	}
	.co_main_header .co_header_elem {
		width: fit-content;
		display: flow-root;
	}
	.co_main_header > .inner {
		height: auto;
	}
	.co_main_header {
		aspect-ratio: auto;
		margin-bottom: 15rem;
	}
}
@media (max-width: 959px) {
	.co_main_header {
		aspect-ratio: auto;
		height: 85vh;
		margin-bottom: 0;
	}
	.co_main_header > .inner {
		position: static;
		height: calc( 0.5 * 57vw);
	}
	.co_main_header .co_header_elem {
		padding-left: 2.4em;
		/* padding-right: 5.5em; */
		width: fit-content;
		min-height: 11.2rem;
		width: max-content;
		padding-bottom: 3.5rem;
	}
	.co_header_elem hgroup > h1 {
		margin-top: 1.5em;
	}
	.co_header_elem .tagline {
		display: none;
	}
	.co_act_under {
		left: var(--wrap-inpad);
	}
}

/* function_header */
.co_function_header .co_header_elem {
	aspect-ratio: 16/9;
}

/* ↓ >> */
.co_act_under {
	bottom: calc(var(--hu) / -2);
	writing-mode: vertical-rl;
	min-width: auto;
	display: grid;
	align-content: end;
	width: 44px;
	letter-spacing: .1em;
	--hu: min(12vh,5.6rem);
	--co: var(--col-act);
	--fw: 400;
	--fs: 1em;										/* font */
}
.co_act_under::after {
	bottom: -.3em;
	left: .65em;
	opacity: .7;
}
/* << ↓ */
/* ↓.act >> */
.co_act_under {
	opacity: 0;
	translate: 0 -15px;
	transition: var(--transition);
	transition-duration: 400ms;
	transition-delay: 2200ms;
}
.view .co_act_under {
	opacity: 1;
	translate: 0 0;
}
/* << ↓.act */


/* ／ >> */
.bg_slash {
	position: relative;
	padding-left: max(calc(var(--slash_base_width,5vw) - 4rem),calc(var(--wrap-inpad) / 2));
	padding-block: calc(var(--spacing-2xl) * 1.4) var(--spacing-2xl);
}
	.bg_slash::after,
	.bg_slash::before {
		content: "";
		transform-origin: top;
		height: 100%;
		width: 0;
		display: block;
		position: absolute;
		left: var(--slash_base_width,5vw);
		bottom: 0;
		top: 0;
		border-image: linear-gradient(var(--col-white),var(--col-white)) 0 fill/1/0 400vw 0 0px;
	}
	.bg_slash::before {
		transform: skewX(calc(var(--base-deg) * -1));
	}
	.bg_slash>* {
		position: relative;
		z-index: 1;
	}
/* << ／ */
/* ／.act >> */
.bg_slash::after,
.bg_slash::before {
	translate: 100vw 0;
	transition: var(--transition);
	transition-duration: 600ms;
	transition-delay: 100ms;
}
.view.bg_slash::after,
.view.bg_slash::before {
	translate: 0 0;
}
/* << ／.act */
	
#next:has(.bg_slash) {
	padding-block: 0;
}
.slash_padding,
.bg_slash>.h_2.txt_center {
	padding-right: calc((var(--slash_base_width,5vw) - 4rem) - (var(--wrap-inpad) / 2));
}
/* ／.act >> */
.bg_slash.inner>:nth-child(1){--co-act-base-delay:800ms}
.bg_slash.inner>:nth-child(2){--co-act-base-delay:calc(800ms + (var(--co-act-delay-step) * 1))}
.bg_slash.inner>:nth-child(3){--co-act-base-delay:calc(800ms + (var(--co-act-delay-step) * 2))}
.bg_slash.inner>:nth-child(4){--co-act-base-delay:calc(800ms + (var(--co-act-delay-step) * 3))}
/* << ／.act */

/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* << co_main_header */
/* __________________________________________________________________ */



/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* tri_menu >> */
/* __________________________________________________________________ */

.tri_menu {
	--gap: 0px;
	--co: var(--col-key-a);
	aspect-ratio: 2.414/1;
}
/* tri_menu.act >> */
.tri_menu {
	--co-act-delay-step: 500ms;
}
/* << tri_menu.act */
.tri_menu > li {
	background-color: var(--co);
	padding-block: var(--spacing-2xl);
	display: grid;
	align-content: center;
	margin-bottom: -1px;										/* Firefox-Fix*/
}
	.tri_menu > li:nth-child(3n+2) {
		--co: var(--col-black-a);
	}
.tri_menu > li > a {
	max-width: 490px;
	width: 100%;
	height: 100%;
	color: var(--col-white);
	padding: var(--spacing-2xl) var(--spacing-xl) var(--spacing-2xl);
	align-content: start;
	justify-content: stretch;
}
.tri_menu .h_2.h_link {
	margin-bottom: var(--spacing-lg);
}
.tri_menu a > *:not(.bt) {
	--co-duration: 200ms;
	--co-delay: 0ms;
	transition: all var(--co-duration,var(--co-act-theme-duration)) var(--co-ease,var(--co-act-theme-ease)) var(--co-delay,var(--co-act-theme-delay));
}
.tri_menu a > *:nth-child(1) {--co-duration: 200ms;--co-delay: 0ms}
.tri_menu a > *:nth-child(2) {--co-duration: 300ms;--co-delay: 0ms}
/* .tri_menu a > *:nth-child(3) {--co-duration: 400ms;--co-delay: 0ms} */
	.tri_menu a:hover > *:not(.bt) {
		translate: 0 -1.5em;
	}
@media (max-width: 959px) {
	.tri_menu {
		aspect-ratio: auto;
	}
	.tri_menu > li {
		padding-block: calc(var(--spacing-sm) * 2.5) var(--spacing-sm);
	}
}

/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* << tri_menu */
/* __________________________________________________________________ */



/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* footer >> */
/* __________________________________________________________________ */

.co_site_footer {
	color: var(--col-e);
}
.co_site_footer>.inner {
	padding-block: var(--spacing-2xl);
	flex-wrap: nowrap;
	justify-content: center;
	--gap: var(--spacing-3xl);
}
	.co_site_footer nav {
		width: fit-content;
		min-width: 160px;
		display: grid;
		align-content: center;
		gap: var(--spacing-sm);
		letter-spacing: .2em;
	}
		.co_site_footer nav ul {
			width: fit-content;
			justify-self: center;
		}
		.co_site_footer nav ul.co_f {
			--fmax: 16;
			--fmin: 12;										/* font */
		}
		.co_site_footer nav li {
			place-items: stretch;
		}
		.co_site_footer nav a {
			min-height: auto;
			padding-block: .05em;
		}
		.co_site_footer hr {
			color: var(--col-gray);
			width: 100%;
		}
	.co_site_footer .panel {
		aspect-ratio: 3.303/1;
		flex-grow: 1;
		width: auto;
		display: flex;
		flex-direction: column;
		align-content: center;
		justify-content: stretch;
		text-align: center;
		gap: var(--spacing-lg);
		padding: var(--spacing-xl);
		color: var(--col-txt);
		background-color: var(--col-white);
	}
		.co_site_footer h2 {
			--fmax:30;
			--fmin:17;										/* font */
			font-weight: 550;
		}
		.co_site_footer a.co_f {
			min-height: auto;
			color: var(--col-key);
			--fmax:40;
			--fmin:20;										/* font */
			font-weight: 400;
			font-family: var(--font-en),var(--font-family-base);
			line-height: 1.05;
			margin-bottom: -.25em;
		}
@media (max-width: 755px) {
	.co_site_footer>.inner {
		flex-wrap: wrap;
		flex-direction: column-reverse;
		gap: var(--spacing-2xl);
	}
	.co_site_footer .panel {
		aspect-ratio: auto;
	}
	.co_site_footer nav {
		width: 100%;
		grid-template-columns: 1fr 2px 1fr;
		gap: var(--spacing-lg);
	}
	.co_site_footer hr {
		height: 100%;
	}
}

#footer {
	padding-block: var(--spacing-lg);
	display: grid;
	place-content: center;
}
	#footer img {
		height: 1.2rem;
	}

/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* << footer */
/* __________________________________________________________________ */



/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* [fonts] >> */
/* __________________________________________________________________ */

/* Hx+ :: fonts >> */

hgroup:where(.h_1,.h_2,.h_3,.h_4,.h_side)>* {
	line-height: 1.1;
	font-family: var(--font-hx,var(--font-p,"")), var(--font-family-base);
	font-weight: var(--font-hx-weight,var(--font-base-weight));
	--font-hx-weight: 400;
}

/* h1 */
	hgroup.h_1>h1 {
		--font-hx: var(--font-en);
		--fmax: 90;
		--fmin: 32;
		--font-hx-weight: 400;
		font-style: italic;
		letter-spacing: -.035em;
	}
	hgroup.h_1>h2 {
		--font-hx: var(--font-p);
		--fmax: 30;
		--fmin: 14;
		--font-hx-weight: 300;
		letter-spacing: .375em;
	}
/* h2 */
	hgroup.h_2>h2 {
		--font-hx: var(--font-en);
		--fmax: 60;
		--fmin: 31;
		font-style: italic;
		letter-spacing: -.018em;
		color: var(--col-gray);
	}
	.bg_black hgroup.h_2 > h2 {
		color: var(--col-bg);
	}
	hgroup.h_2>h3 {
		--font-hx: var(--font-p);
		--fmax: 20;
		--fmin: 10.4;
		--font-hx-weight: 300;
		letter-spacing: .8em;
		margin-top: -.2em;
	}
		hgroup.h_2.h_link>h2 {
			--fmax: 40;
			--fmin: 21;
			--font-hx-weight: 300;
			letter-spacing: .035em;
			color: var(--col-white);
		}
		.co_f.co_f_25,
		hgroup.h_2.h_link>h3 {
			--fmax: 25;
			--fmin: 15;
			--fmax: 20;
			--fmin: 13;
			--font-hx-weight: 350;
			letter-spacing: .28em;
		}
/* h3 */
hgroup.h_3,
hgroup.h_3>h3 {
	--fmax: 20;
	--fmin: 13;
}
hgroup.h_3 {
	margin-bottom: var(--spacing-lg);
}
.co_contents>:not(hgroup)+hgroup.h_3 {
	margin-top: var(--spacing-3xl);
}
	hgroup.h_3>h3 {
		--font-hx: var(--font-en);
		--font-hx-weight: 300;
		color: var(--col-gray);
	}
	hgroup.h_3>h4 {
		--font-hx: var(--font-p);
		--fmax: 35;
		--fmin: 18;
		--font-hx-weight: 500;
		letter-spacing: .05em;
	}
	hgroup.h_3.h_plus {
		padding-top: 1.0em;
	}
		hgroup.h_3.h_plus>h3 {
			letter-spacing: .41em;
			padding-left: .2em;
		}
		hgroup.h_3.h_plus>h4 {
			margin-top: .05em;
		}
	hgroup.h_3.h_column {
		padding: var(--spacing-lg);
		position: relative;
	}
		hgroup.h_3.h_column::after,
		hgroup.h_3.h_column::before {
			content: "";
			position: absolute;
			border: solid var(--col-key);
			--g-w: 3rem;
			--g-lh: 2px;
			width: var(--g-w);
			height: var(--g-w);
			pointer-events: none;
		}
		hgroup.h_3.h_column::after {
			bottom: 0;
			right: 0;
			border-width: 0 var(--g-lh) var(--g-lh) 0;
		}
		hgroup.h_3.h_column::before {
			top: 0;
			left: 0;
			border-width: var(--g-lh) 0 0 var(--g-lh);
		}
		hgroup.h_3.h_column>h3 {
			--font-hx: var(--font-ja);
			--fmax: 35;
			--fmin: 18;
			color: var(--col-black);
			word-break: auto-phrase
		}
		hgroup.h_3.h_column>h4 {
			--fmax: 20;
			--fmin: 13;
			--fmax: 25;
			--fmin: 15;
			--font-hx-weight: 350;
			color: var(--col-key);
			margin-top: .5em;
		}
/* h4 */
hgroup.h_4 {
	position: relative;
	padding-top: 1em
}
/* .co_contents>:not(hgroup)+hgroup.h_4 {
	margin-top: var(--spacing-2xl);
} */
	.h_article,
	hgroup.h_4>h4 {
		--font-hx: var(--font-p);
		--fmax: 24;
		--fmin: 14.6;
		--font-hx-weight: 500;
		letter-spacing: .028em;
	}
	article .h_key::before,
	hgroup.h_4::before {
		content: "";
		background-color: var(--col-key);
		height: 2px;
		width: 1em;
		display: block;
		position: absolute;
		left: calc(var(--leading-trim) / -2);
		top: 0;
	}
	hgroup.h_4.h_key>h4 {
		--font-hx: var(--font-en);
		--font-hx-weight: 400;
		font-style: italic;
		--fmax: 24;
		--fmin: 14.6;
		letter-spacing: -.01em;
		color: var(--col-key);
	}
	hgroup.h_4.h_key::before {
		content: none;
	}
	hgroup.h_4.h_key>h5 {
		--font-hx: var(--font-p);
		--font-hx-weight: 700;
		--fmax: 20;
		--fmin: 13;
		margin-top: .5em;
	}
/* article */
article .h_key {
	position: relative;
	margin-top: 2em;
	padding-top: .5em;
}
.h_article {
	padding-bottom: var(--spacing-lg);
	border-bottom: 1px solid var(--col-gray);
}
article h5 {
	--font-hx: var(--font-p);
	--font-hx-weight: 400;
	--fmax: 20;
	--fmin: 13;
}
/* hgroup.h_plus */
	hgroup.h_plus {
		min-height: 5em;
		padding-left: calc(var(--wu) + var(--wp) - .3em);
		--fmax: 20;
	}
	.h_plus {
		overflow: hidden;
		position: relative;
		--wu: 3.2em;
		--wp: .35em;
		--co-b: var(--col-black);
		--co-c: var(--col-key);
	}
	.h_plus.has_num {
		--wu: 5.4em;
	}
		.h_plus::after,
		.h_plus::before {
			content: "";
			transform-origin: top left;
			width: var(--wu);
			display: block;
			position: absolute;
			bottom: 0;
			top: 0;
			left: 0;
			--co: var(--co-b);
			border-image: linear-gradient(var(--co),var(--co)) 0 fill/1/0 0px 0 2em;
			transform: skewX(calc(var(--base-deg) * -1));
		}
		.h_plus::before {
			left: var(--wp);
			--co: var(--co-c);
		}
	.h_plus.has_num > [data-num]::before {
		content: attr(data-num);
		color: var(--col-white);
		position: absolute;
		left: .13em;
		display: grid;
		place-content: center;
		top: 0;
		bottom: 0;
		z-index: 1;
		font-size: 4.5em;
		font-family: var(--font-din),var(--font-family-base);
		font-weight: var(--font-din-weight);
	}

hgroup p {
	line-height: 1.3;
}

/* .co_font_p_{n}px */
.co_font_p_14px p{--fmax:14;--fmin:11}
.co_font_p_15px p{--fmax:15;--fmin:11.36}
.co_font_p_16px p{--fmax:16;--fmin:11.72}
.co_font_p_17px p{--fmax:17;--fmin:12.08}
.co_font_p_18px p{--fmax:18;--fmin:12.44}
.co_font_p_19px p{--fmax:19;--fmin:12.80}
.co_font_p_20px p{--fmax:20;--fmin:13.16}
.co_font_p_21px p{--fmax:21;--fmin:13.52}
.co_font_p_22px p{--fmax:22;--fmin:13.88}
.co_font_p_23px p{--fmax:23;--fmin:14.24}
.co_font_p_24px p{--fmax:24;--fmin:14.60}

/* -h2- */
hgroup.h_2.txt_center {
	margin-bottom: 2.5em;
}


/* side */
hgroup.h_side>h3 {
	--font-hx: var(--font-en);
	font-style: italic;
	letter-spacing: .042em;
	--fmax:30;
	--fmin:17;
	line-height: 1.05;
	margin-bottom: -.09em;
}
hgroup.h_side>h4 {
	--font-hx: var(--font-p);
	--fmax:14;
	--fmin:11;
	letter-spacing: .1em;
}


/* bt_h */
.bt_h>hgroup.h_3>h3 {
	--fmax: 10;
	--fmin: 9;
}
.bt_h>hgroup.h_3>h4 {
	--fmax:30;
	--fmin:17;
	--font-hx-weight: 350;
	color: var(--col-black);
}



p {
	letter-spacing: .05em;
}

dt {
	font-weight: 600;
	float: none;
}
dd {
	margin-left: 0;
}

dt,dd,
.co_site_footer,
.co_site_footer p {
	--fmax:14;
	--fmin:11;
}

:where(hgroup.h_plus,.co_site_footer,.co_site_footer p,dd) {
	font-size: calc((1vw * ( var(--fmax) - var(--fmin) ) / (var(--fwmax) - var(--fwmin)) * 100) + (((var(--fwmax) / 100 * var(--fmin)) - (var(--fwmin) / 100 * var(--fmax))) / (var(--fwmax) - var(--fwmin)) * 100 * 1px));
}
@media (min-width:1280px){
	:where(hgroup.h_plus,.co_site_footer,.co_site_footer p,dd) {
		font-size: calc(var(--fmax) * 1px);
	}
}

/* << Hx+ :: fonts */

/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* << [fonts] */
/* __________________________________________________________________ */



/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* [button] >> */
/* __________________________________________________________________ */

/* .bt >> */
.bt {
	--b-h: 3.3em;
	--b-r: 2.8em;
	--b-c-bg: rgb(var(--col-f-rgb) / .8);
	--b-c-o: rgb(var(--col-f-rgb) / .6);
	--b-c-v: rgb(var(--col-f-rgb) / 1);
	--b-c-a: var(--col-act);
	--b-c-ab: var(--col-act-b);
	--b-svg-sw: 1px;
	--b-svg-v-sw: 2px;
	--b-svg-hover-sw: 3px;
	--fmax: 18;									/* font */
	--fmin: 12;
	position: relative;
	grid-template-columns: auto;
	border-radius: var(--radius-o);
	color: var(--col-black);
	min-width: min(400px,100%,90vw);
	max-width: min(100%,640px);
	min-height: var(--b-h);
	padding-top: .2em;
	padding-inline: calc(var(--b-h) / 2) calc(var(--b-r) * 2);
}
:where(.bt) {
	margin-block: calc(var(--b-r) - (var(--b-h) / 2));
}
:where(.inview.co_div) .bt,
.bt:where(.inview) {
	--b-c-o: var(--b-c-v);
	--b-svg-sw: var(--b-svg-v-sw);
}
	.bt::after,
	.bt::before {
		position: absolute;
		border: 1px solid;
		border-radius: var(--radius-o);
	}
	.bt::before {
		inset: 0;
		background-color: var(--b-c-bg);
		border-right-color: transparent;
	}
	.bt::after {
		--b-img: url(../img/common/arrow_orange.svg);
		background-color: var(--b-c-o);
		background-image: var(--b-img);
		background-position: center;
		color: var(--b-c-ab);
		transition: var(--transition);
	}
		.bt:hover::after {
			--b-img: url(../img/common/arrow_white.svg);
			--b-c-o: var(--b-c-a);
		}
	.bt::after,
	.bt>:is(svg,canvas,img,picture) {
		inset: 50% 0 0 auto;
		aspect-ratio: 1/1;
		width: calc(var(--b-r) * 2);
		height: calc(var(--b-r)* 2);
		translate: 0 -50%;
	}
	.bt>:is(svg,canvas,img,picture) {
		position: absolute;
		z-index: 1;
	}
	.bt>div {
		position: relative;
		z-index: 1;
	}

.sec > .inner > .bt {
	margin-top: calc(var(--b-r) - (var(--b-h) / 2) + var(--spacing-3xl));
	width: 640px;
}
.co_contents > .bt {
	margin-block: calc(var(--b-r) - (var(--b-h) / 2) + var(--spacing-xl));
}

.bt > svg {
	overflow: visible;
}
.bt > svg > * {
	transition: var(--transition);
}
.bt > svg > circle {
	fill: var(--b-c-o);
	stroke: var(--b-c-ab);
}
	.bt:hover > svg > circle {
		--b-c-o: var(--b-c-a);
	}
.bt > svg > path {
	fill: none;
	stroke: var(--b-c-ab);
	stroke-width: var(--b-svg-sw);
	stroke-linecap: round;
	stroke-linejoin: round;
}
	.bt:hover > svg > path {
		--b-svg-sw: var(--b-svg-hover-sw);
		stroke: var(--b-c-v);
	}
/* << .bt */

/* .bt_h >> */
.bt_h {
	position: relative;
	display: block;
	height: 100%;
	padding: var(--spacing-sm);
	margin-left: var(--spacing-sm);
	background-color: var(--col-white);
	text-align: center;
	text-decoration: none;
}
.bt_h .h_plus {
	position: absolute;
	height: 80%;
	top: calc(var(--spacing-sm) * -1);
	left: calc(var(--spacing-sm) * -1);
	width: var(--wu);
	--wu: 3.2em;
}
.bt_h .h_plus::after,
.bt_h .h_plus::before {
	right: var(--wp);
	left: auto;
}
.bt_h .h_plus::before {
	right: 0;
}
.h_plus.has_num > [data-label]::after,
.bt_h .h_plus.has_num > [data-num]::before {
	--de: 1.2;
	font-size: calc(1em * var(--de));
	width: auto;
	bottom: auto;
	left: var(--spacing-md);
	top: calc(var(--spacing-sm) + (1.5em * .4 / var(--de)));
}
.bt_h .h_plus.has_num > [data-label]::after {
	content: attr(data-label);
	color: var(--col-white);
	position: absolute;
	left: var(--spacing-sm);
	display: grid;
	place-content: center;
	top: var(--spacing-sm);
	z-index: 1;
	font-family: var(--font-en),var(--font-family-base);
	font-weight: var(--font-din-weight);
	--de: .4;
}
.bt_h>hgroup {
	margin-bottom: 0;
	padding: var(--spacing-lg) var(--spacing-sm);
	border: 1px solid var(--col-key);
	background-color: var(--col-white);
	position: relative;
	z-index: 1;
}
.bt_h::after {
	content: "";
	z-index: 0;
	position: absolute;
	inset: 0;
	background-image: linear-gradient(calc(var(--base-deg) + 90deg),var(--col-key) 50.7%,var(--col-white) 51%);
	background-size: 200% auto;
	background-position: 100% 0;
	transition: var(--transition);
	transition-duration: 100ms;
	transition-timing-function: linear;
}
.bt_h:hover::after {
	background-position: 10% 0;
	transition-duration: 300ms;
	transition-timing-function: cubic-bezier(.55,.06,.68,.19);
}

/* << .bt_h */

/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* << [button] */
/* __________________________________________________________________ */



/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* [accordion] >> */
/* __________________________________________________________________ */

/* .co_accordion >> */
.co_accordion {
	--ac-eace: ease-in-out;
	--ac-eace: cubic-bezier(.7,0,.1,1);
	--ac-duration: 300ms;
	--ac-delay: 0ms;
	--ac-rows: 0fr;
}
.co_accordion > div + div {
	border-top: 1px solid var(--col-gray);
	margin-top: var(--spacing-sm);
	padding-top: var(--spacing-sm);
}

.co_accordion dt ~ dd {
	display: grid;
	grid-template-rows: var(--ac-rows,0fr);
	transition: grid-template-rows var(--ac-duration) var(--ac-eace);
	margin-left: auto;
}
.co_accordion dt ~ dd > div {
	overflow: hidden;
}
.co_accordion dt:not(:has(:checked)) ~ dd {
	--ac-rows: 1fr;
}

.co_accordion dt>label {
	position: relative;
	display: grid;
	padding-right: 1.5em;
}
.co_accordion dt>label>svg,
.co_accordion dt>label::after {
	position: absolute;
	right: 0;
	top: 50%;
	translate: 0 -50%;
	height: 1.3em;
	width: 1.3em;
	font-size: .9em;
	opacity: .8;
}
.co_accordion dt>label::after {
	content: "";
	display: grid;
	place-content: center;
	background-image: url(../img/common/icon_plus.svg);
	background-size: 100% auto;
	border-radius: var(--radius-o);
	background-color: var(--col-black);
	color: var(--col-white);
	line-height: 1;
	transition: background-color var(--ac-duration) var(--ac-eace);
}
.co_accordion label:not(:has(:checked))::after {
	background-image: url(../img/common/icon_minus.svg);
	background-color: var(--col-gray);
}

@media (min-width: 960px) {
	.co_accordion dt ~ dd {
		--ac-rows: 1fr;
	}
	.co_accordion dt>label::after {
		content: none !important;
	}
}
/* << .co_accordion via: https://b.0218.jp/202301311714.html */

/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* << [accordion] */
/* __________________________________________________________________ */



/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* [table] >> */
/* __________________________________________________________________ */

tr > :nth-child(4) {
	border-left: 1px solid var(--col-border);
}
:where(table) {
	--col-border: #e4e6e291;
}
:where(table, thead, tbody, tr) {
	border: 0 none;
}
:where(th, td) {
	border-width: 0px;
	padding-block: var(--spacing-lg);
	font-weight: 400;
}
:where(thead th) {
	background-color: var(--col-black);
	opacity: .8;
	--col-border: #e2f7c391;
}
:where(thead th.co_key) {
	background-color: var(--col-vivid_green);
	min-width: 25%;
}
:where(tbody) {
	background-color: #c9cdd3b5;
}
:where(tbody :where(th, td)) {
	color: var(--col-black);
}
:where(tbody th) {
	background-color: transparent;
	color: var(--col-black);
}
:where(tbody > tr:nth-child(2n) > :where(td)) {
	background-color: #bfe189a6;
	--col-border: #ccc6;
}
:where(tbody > tr:nth-child(2n+1) > :where(th, td)) {
	background-color: #ffffff5e;
	opacity: .8;
}

/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* << [table] */
/* __________________________________________________________________ */



/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* [000] >> */
/* __________________________________________________________________ */

/**/
.co_div_wide {
	--gap: var(--spacing-3xl);
}
@media (max-width: 959px) {
	.co_div_wide {
		--gap: var(--spacing-2xl);
	}
}
.co_div_wide hgroup.co_center {
	text-align: center;
	gap: .5em;
	align-content: end;
	min-height: 4.1em;
	margin-bottom: 1.2em;
}
.co_div_wide hgroup.co_center p {
	--fmax:14;
	--fmin:10;										/* font */
}
.co_div_wide hgroup.co_center img {
	margin-inline: auto;
	height: 1.15em;
}
/**/



/* .co_lrl & .side_panel >> */
.co_lrl {
	--template: "a b" "c b" 1fr / 1fr 340px;
	--break-template: "a" "b" "c" / auto;
	--gap: 120px;
	--gap2: var(--spacing-xl);
}
:where(.co_lrl > .co_contents) > :where(hgroup){
	margin-top: var(--spacing-xl);
}
@media (max-width:1279px) {
	.co_lrl {
		--gap: var(--spacing-xl);
	}
}
@media (max-width: 959px) {
	.co_lrl {
		--template: var(--break-template);
	}
	.side_panel {
		margin-inline: calc(var(--wrap-inpad) / 2);
	}
	:where(.co_lrl > :nth-child(2)):empty {
		display: contents;
	}
}

.side_panel {
	border: 2px solid var(--col-soft_green);
	padding: var(--spacing-lg) var(--spacing-lg) var(--spacing-sm);
	height: fit-content;
	max-height: 95vh;
	overflow: auto;
	background-color: rgb(var(--col-f-rgb) / .9);
}
/* side_panel.act >> */
.side_panel {
	--co-act-base-delay: 1100ms;
	--co-act-trY: 20px;
}
@media (min-width: 960px) {
	.side_panel {
		--co-act-base-delay: 400ms;
	}
}
/* << side_panel.act */
.side_panel.h_plus {
	--wu: 1.5em;
	--wp: .5em;
	--co-b: var(--col-soft_green);
	--co-c: var(--col-black);
}
	.side_panel.h_plus::before {
		opacity: .7;
	}
.side_panel dt>label {
	padding-block: var(--spacing-xs);
}
.side_panel>dl>div+div {
	margin-top: var(--spacing-lg-trim);
	padding-top: var(--spacing-lg-trim);
	border-top: 1px solid var(--col-black-a);
}

@media (min-width: 960px) {
	.co_accordion label {
		margin-inline: calc(var(--spacing-xs) * -1);
		padding-inline: var(--spacing-xs);
		/**/
		background-image: linear-gradient(var(--col-light_green),var(--col-light_green));
		transition: var(--transition);
		background-size: 0% 100%;
		transition-delay: 300ms;
		transition-duration: 200ms;
	}
	.co_accordion label:not(:has(:checked)) {
		background-size: 100% 100%;
		/* background-color: var(--col-light_green); */
	}
}
/* << .co_lrl & .side_panel */



/* .co_nav.co_center>ul>(li>a.prev{&laquo;})+(li*3>a{$})+(li>span.dots{...})+(li>a{10})+li>a.next{&raquo;} */
	main>section .co_nav > :where(.prev,.next) {
		border-radius: var(--radius-s);
		background-color: var(--col-key-a);
		color: var(--col-white);
	}
	main>section .co_nav li > * {
		border-radius: var(--radius-s);
	}
	main>section .co_nav li > a {
		background-color: var(--col-key-a);
		color: var(--col-white);
	}
	main>section .co_nav > :where(.prev,.next):hover,
	main>section .co_nav li > a:hover,
	main>section .co_nav li > .current {
		color: var(--col-white);
		background-color: var(--col-act);
	}
	main>section .co_nav li > .current:hover {
		opacity: .6;
	}
	/* has border
	main>section .co_nav li > *:not(.dots) {
		border: 1px solid var(--col-act);
	} */



.lr_garnish::after,
.lr_garnish::before {
	content: "";
	position: absolute;
	width: min(30vw,300px);
	height: min(30vw,300px);
	border-radius: var(--radius-o);
	background-color: var(--col-key-a);
	background-image: var(--ph-lr,var(--lr-1-bg));
	z-index: 1;
	/* https://blog.grinee.net/animation-fluffy/ */
	animation: var(--act-d1) 0s fluffy_r cubic-bezier(.27,.54,.79,.49) infinite, var(--act-d2) 0s fluffy_x cubic-bezier(.59,.21,.35,1.34) infinite;
	animation-play-state: paused;
	--act-d1: 20s;
	--act-d2: 15s;
	--act-w: 1280px;
	--act-y: 20px;
	--act-x-base: 5%;
	--act-x: -15%;
	transform-origin: var(--act-w) center;
}
.lr_garnish::after {
	--ph-lr: var(--lr-2-bg);
	top: 100%;
	translate: 50% -50%;
	right: var(--outer-lr);
	/**/
	--act-x-base: 5%;
	--act-x: -20%;
	animation-delay: 1s;
}
.lr_garnish::before {
	bottom: 100%;
	translate: -50% 80%;
	left: var(--outer-lr);
}
.inview.lr_garnish::after,
.inview.lr_garnish::before {
	animation-play-state: running;
}
@keyframes fluffy_r {
	0%, 100% {
		rotate: calc(atan2(var(--act-y),var(--act-w)) * -2);
	}
	50% {
		rotate: calc(atan2(var(--act-y),var(--act-w)) * 2);
	}
}
@keyframes fluffy_x {
	0%, 100% {
		transform: translateX(var(--co-act-x-base,0px));
	}
	50% {
		transform: translateX(var(--co-act-x,-20px));
	}
}



.bt::after {
	--b-c-o: var(--b-c-a);
	--co-act-base-delay: 0ms;
	--co-act-duration-1: 4000ms;
	--co-act-animation-1: pulse-animation2;
	animation: var(--co-act-animation-1)  var(--co-act-duration-1) cubic-bezier(0.24, 0, 0.38, 1) infinite var(--co-act-base-delay);
	z-index: 0;
}
.bt:hover:after {
	--co-act-duration-1: 1300ms;
	--co-act-animation-1: pulse-animation;
	--co-act-base-delay: 0ms !important;
}
@keyframes pulse-animation2 {
	50% {
		opacity:.8;
		transform:scale(1)
	}
	75% {
		opacity:0;
		transform:scale(1.7)
	}
	100% {
		opacity:0;
		transform:scale(1.7)
	}
}
@keyframes pulse-animation {
	0% {
		opacity:1;
		transform:scale(1)
	}
	50% {
		opacity:0;
		transform:scale(1.8)
	}
	100% {
		opacity:0;
		transform:scale(1.8)
	}
}
.tri_menu>li:nth-child(1) .bt::after{--co-act-base-delay:calc(800ms + (var(--co-act-delay-step) * 1))}
.tri_menu>li:nth-child(2) .bt::after{--co-act-base-delay:calc(800ms + (var(--co-act-delay-step) * 3))}
.tri_menu>li:nth-child(3) .bt::after{--co-act-base-delay:calc(800ms + (var(--co-act-delay-step) * 5))}




body.index .sec.bg_white + .bg_white {
	padding-top: 0;
}

body.index header.co_global {
	height: 100vh;
	background-color: var(--col-transparent);
	z-index: 9992;
}
body.index .om-bt-base {
	z-index: 9992;
}
	body.index #om-off:not(:checked) ~ .co_global {
		position: fixed;
		height: var(--hamburger-height);
	}
	body.index #om-off:not(:checked) ~ main {
		margin-top: calc(100vh - var(--hamburger-height));
	}
	body.index #om-off:not(:checked) ~ .co_global::after,
	body.index #om-off:not(:checked) ~ .co_global .co_lead,
	body.index #om-off:not(:checked) ~ .co_global .co_act_under {
		display: none;
	}
	body.index #om-off:not(:checked) ~ .co_global > .inner::before {
		content: "";
		background-color: var(--col-white);
		position: absolute;
		inset: 0 calc((var(--wrap-inpad) / 4) + var(--hamburger-offset,0px)) 0 calc(var(--wrap-inpad) / -2);
		z-index: -1;
	}
body.index header.co_global>.inner {
	position: sticky;
	top: 0;
	height: var(--hamburger-height);
	z-index: 9992;
}
body.index nav.co_global {
	position: absolute;
	inset: 0;
	top: auto;
}
body.index nav.co_global>.inner {
	justify-content: center;
}
@media (min-width:1279.1px) {
	body.index header.co_global>.inner {
		width: 0;
		margin-left: calc(var(--outer-lr) - var(--wrap-inpad));
	}
	body.index .co_global .logo {
		position: absolute;
		width: max-content;
		top: 50%;
		translate: 0 -50%;
	}
	body.index .co_global .co_nav.co_func {
		position: absolute;
		left: calc(min(var(--max-width),100vw) - var(--wrap-inpad) );
		translate: -100%;
	}
}
@media (max-width:1279px) {
	body.index nav.co_global {
		display: none;
	}
}

body.index .co_lead {
	position: absolute;
	inset: 0 auto;
	left: max(50px,calc(var(--outer-lr) + (min(1280px,100vw) - min(960px,100vw)) / 2));
	bottom: var(--hamburger-height);	/* ADD */
	display: grid;
	place-content: center;
	font-weight: 600;
	letter-spacing: .2em;
	line-height: 2;
}
body.index .co_lead::before {
	content: "";
	position: absolute;
	width: 120%;
	inset: 0;
	left: calc(min(100vw,1280px) / 2);
	background-image: linear-gradient(var(--col-key-a) var(--sl),var(--col-black-a) var(--sl));
	transform: skewX(calc(var(--base-deg) * -1));
	--sl: 60%;
	--sl: 70%;	/* ADD */
}
@media (max-width: 1279px) {
	body.index .co_lead {
		bottom: 0;
	}
	body.index .co_lead::before {
		--sl: 77%;
	}
}
body.index .co_act_under {
	opacity: 1;
	bottom: calc(var(--hamburger-height) + 2em);
	left: var(--outer-lr);
	z-index: 9999;
}

body.index .v_wrap {
	position: fixed;
	inset: 0;
}

body.index #next {
	border-block: var(--spacing-2xl) solid var(--col-bg);
	padding-block: 0;
}
body.index #next .inner {
	display: flow-root;
	animation: none;
	visibility: visible;
	padding-bottom: var(--spacing-xl);
}
	body.index #next .view.inner::after,
	body.index #next .view.inner::before {
		translate: 0;
	}
	body.index #next .inner::after,
	body.index #next .inner::before {
		content: "";
		background-color: var(--col-bg);
		transform: skewX(calc(var(--base-deg) * -1));
		position: absolute;
		inset: -1px;
		transform-origin: right bottom;
		z-index: -1;
		translate: calc(min(var(--max-width),100vw) / var(--sl)) 0;
		transition: var(--transition);
		transition-delay: 300ms;
		transition-duration: 700ms;
		transition-timing-function: cubic-bezier(.22,.61,.36,1);
		--sl: 3;
	}
	body.index #next .inner::before {
		transform-origin: left top;
		translate: calc(min(var(--max-width),100vw) / var(--sl) * -1) 0;
	}
body.index #next .list li>:where(a,div) {
	display: grid;
	grid-template-columns: auto 1fr;
	gap: var(--spacing-md);
	min-height: auto;
}
body.index #next .list a:hover {
	color: var(--col-act);
}
body.index #next .list time {
	transition: var(--transition);
}
body.index #next .list a:hover time {
	color: var(--col-gray);
}
@media (max-width: 479px) {
	body.index #next .inner::after,
	body.index #next .inner::before {
		--sl: 4;
	}
	body.index #next .list {
		display: grid;
		gap: var(--spacing-lg);
	}
	body.index #next .list li>:where(a,div) {
		grid-template-columns: auto;
		gap: 0;
	}
}

.sec_feature::after,
.sec_feature::before {
	content: "";
	position: absolute;
	inset-block: 0;
	width: 50%;
	height: 100%;
	background-size: cover;
	box-shadow: 0 160px 150px -80px #0002 inset;
}
.sec_feature::after {
	right: 0;
	background-image: url(../img/pages/index/bg_02.jpg);
}
.sec_feature::before {
	left: 0;
	background-image: url(../img/pages/index/bg_01.jpg);
}
@media (max-width: 959px) {
	.sec_feature::after {
		width: 100%;
	}
	.sec_feature::before {
		content: none;
	}
}
.sec_feature .inner {
	position: relative;
	z-index: 1;
}
.sec_feature hgroup.h_2 > h2 {
	color: var(--col-white);
}
.sec_retail .co_div>li {
	position: relative;
	padding: var(--spacing-md) 0 0 var(--spacing-lg);
	overflow: hidden;
}
.sec_retail .co_div a::before {
	content: "";
	position: absolute;
	z-index: -1;
	width: 34%;
	inset: 0 auto 0 0;
	background-color: var(--col-key);
	transform: skewX(calc(var(--base-deg) * -1));
	transform-origin: right top;
	transition: var(--transition);
	transition-timing-function: cubic-bezier(.55,.06,.68,.19);
}
.sec_retail .co_div a:hover:before {
	width: 95%;
}
.sec_retail .co_div a {
	flex-direction: column;
	display: flex;
	text-decoration: none;
	color: inherit;
	height: 100%;
	border: 1px solid var(--col-black);
}
.sec_retail .co_div a>* {
	margin: 0;
}
.sec_retail .co_div a>p {
	flex-grow: 1;
	display: grid;
	place-content: center;
	padding: var(--spacing-sm);
	background-color: var(--col-white);
}
.sec_retail .co_div h3 {
	background-color: var(--col-black);
	color: var(--col-white);
	--fmax: 20;										/* font */
	--fmin: 13;
	--font-hx-weight: 600;
	padding: var(--spacing-sm);
}
.sec_retail .co_img {
	order: -1;
}


.column_header {
	height: 85vh;
}
.column_header + #next {
	padding-top: var(--spacing-2xl);
}
.column_header>.inner {
	position: static;
}
@media (max-width: 1279px) {
	.column_header {
		aspect-ratio: 16/9;
		margin-bottom: 0;
	}
}
.column_header .co_hi.co_img {
	position: absolute;
	inset: 0;
	padding-top: var(--hamburger-height);
}
.column_header .h_1 {
	color: var(--col-white);
}
.column_header img {
	object-fit: cover;
	height: 100%;
}
.column_header .co_header_elem::after,
.column_header .co_header_elem::before {
	content: none;
}
.column_num {
	position: absolute;
	bottom: 0;
	left: calc(min(1280px,100vw) - var(--g-l));
	translate: -100% 0;
	color: var(--col-white);
	white-space: nowrap;
	font-family: "trajan-pro-3", serif;
	--fmax: 80;										/* font */
	--fmin: 32;
	--g-l: 6rem;
}
@media (max-width: 959px) {
	.column_num {
		--g-l: 4.8rem;
	}
}
.sec_column>.inner {
	padding-bottom: var(--spacing-2xl);
}
.sec_column>.view.inner::after,
.sec_column>.view.inner::before {
	translate: 0;
}
.sec_column>.inner::after,
.sec_column>.inner::before {
	content: "";
	transform: skewX(calc(var(--base-deg) * -1));
	position: absolute;
	inset-block: 0;
	right: 0;
	width: 0;
	z-index: 2;
	transform-origin: right bottom;
	translate: calc(min(var(--max-width),100vw) / var(--sl)) 0;
	border-image: linear-gradient(var(--col-gray-a),var(--col-gray-a)) 0 fill/1/0 200vw 0 5rem;
	transition: var(--transition);
	transition-delay: 300ms;
	transition-duration: 700ms;
	transition-timing-function: cubic-bezier(.22,.61,.36,1);
	--sl: 3;
}
.sec_column>.inner::before {
	left: 0;
	transform-origin: left top;
	translate: calc(min(var(--max-width),100vw) / var(--sl) * -1) 0;
	border-image-outset: 0 7rem 0 200vw;
}

.sec.sec_column .co_scroll + .co_act_under {
	opacity: 0;
}
.sec.sec_column .is_scroll + .co_act_under {
	opacity: 1;
}
.sec.sec_column .co_act_under {
	right: 10rem;
	left: auto;
	rotate: -90deg;
	bottom: -2rem;
	transition-delay: 1000ms;
}

.sec_column .co_scroll {
	overflow-x: hidden;
	/* scroll-snap-type: x mandatory; */
}
.sec_column .co_flex {
	margin-right: calc(var(--outer-lr) - 40px);
}
.sec_column .co_flex > li {
	width: min(var(--max-width),90vw);
	scroll-snap-align: center;
}
.sec_column .co_flex a {
	display: grid;
	grid-template-columns: 35% auto;
	height: 100%;
	background-color: var(--col-black);
	color: var(--col-white);
	text-decoration: none;
}
@media (max-width: 639px) {
	.sec_column .co_flex a {
		grid-template-columns: 1fr;
		grid-template-rows: clamp(100px,30vh,400px) 1fr;
	}
}
.sec_column .co_flex .co_img {
	position: relative;
}
.sec_column .co_flex .co_img :where(img, video) {
	object-fit: cover;
	position: absolute;
	max-height: none;
	height: 100%;
	width: 100%;
}
.sec_column .co_flex .co_img + div {
	padding: var(--spacing-xl) var(--spacing-lg);
	flex-direction: column;
	display: flex;
}
.sec_column .co_flex .lang_ja {
	color: var(--col-white);
	--fmax: 35;										/* font */
	--fmin: 18;
	--font-hx-weight: 600;
}
.sec_column .co_flex .lang_en {
	color: var(--col-gray);
	font-family: "trajan-pro-3", serif;
	--fmax: 80;										/* font */
	--fmin: 32;
}
.sec_column .co_flex div>p {
	--fmax: 16;										/* font */
	--fmin: 11.72;
	margin-bottom: auto;
	padding-bottom: var(--spacing-lg);
}


.co_step {
	--step-w: 7rem;
	margin-left: calc(( (var(--wrap-inpad) / 2) + 2.5rem) * -1);
}
.co_step > li {
	border: none;
	min-height: var(--step-w);
	padding-left: calc(var(--step-w) + var(--spacing-lg));
}
ol.co_step > li::before {
	top: 0;
	right: auto;
	left: 0;
	display: grid;
	place-content: center;
	border-radius: var(--radius-o);
	width: var(--step-w);
	height: var(--step-w);
	padding-top: .5em;
}
ol.co_step > li>h4::before,
ol.co_step > li::before {
	font-size: calc((1vw * ( var(--fmax) - var(--fmin) ) / (var(--fwmax) - var(--fwmin)) * 100) + (((var(--fwmax) / 100 * var(--fmin)) - (var(--fwmin) / 100 * var(--fmax))) / (var(--fwmax) - var(--fwmin)) * 100 * 1px));
	--fmax: 40;										/* font */
	--fmin: 21;
	font-family: var(--font-din),var(--font-family-base);
	font-weight: var(--font-din-weight);
}
ol.co_step > li>h4::before {
	content: "STEP";
	--fmax: 20;
	--fmin: 13;
	position: absolute;
	left: calc(var(--step-w) / 2);
	translate: -50% -1em;
	color: var(--col-white);
}
ol.co_step > li:nth-child(2n+1):before {
	background-color: var(--col-gray);
}
.co_step > li::after {
	rotate: 0deg;
	clip-path: none;
	aspect-ratio: auto;
	translate: none;
	top: var(--gap2, var(--gap, var(--gap-base)));
	left: calc(var(--step-w) / 2);
	z-index: -1;
	width: 2px;
	height: 100%;
	background-color: var(--col-gray);
}
.co_step h4 {
	margin-block: calc(var(--step-w) / 2 - 1em) .5em;
	--fmax: 35;										/* font */
	--fmin: 18;
}
section.sec .co_step .co_img {
	position: absolute;
	right: 0;
	top: 0;
	height: calc((var(--step-w) * 2) + var(--gap2, var(--gap, var(--gap-base))));
	max-width: calc(100% - (var(--step-w) * 2));
}
section.sec .co_step .co_img > img {
	object-fit: cover;
	height: 100%;
	width: auto;
	margin-right: 0;
}

.list_fields {
	--gap: var(--spacing-3xl);
	--gap2: var(--spacing-2xl);
	--m-gap: calc( .5em * 3.5);
	font-size: .9em;
	line-height: 1.1;
	margin-bottom: var(--spacing-3xl);
}
.page_applications .list_fields > :first-child {
	margin-left: calc((var(--div-base-width) - (var(--gap, var(--gap-base)) * (max(var(--div,2),1) - 1))) / var(--div,2) / 2);
}
.list_fields h4 {
	display: grid;
	place-content: center;
}
.list_fields img {
	width: 12em;
	aspect-ratio: 232/214;
	object-fit: contain;
	object-position: bottom;
}
.list_fields ul {
	width: max-content;
	margin-inline: auto;
	translate: -1em;
}
.list_fields>li:last-child {
	margin-left: -1px;
}
@media (max-width: 959px) {
	.list_fields img {
		width: 7em;
	}
}
@media (max-width: 755px) {
	.list_fields {
		--gap: unset;
		--gap2: unset;
	}
	.page_applications .list_fields > :first-child {
		margin-left: auto;
	}
}


.properties_box {
	padding-bottom: var(--spacing-xl);
	--gap: var(--spacing-md);
}
.properties_box img.bio45 {
	width: min(13vw,3em);
}
:where(.co_contents .co_box).properties_box > :last-child {
	margin-bottom: 0;
}



.news_list {
	padding: 0;
}
.news_list li + li {
	margin-top: -1px;
}
.news_list a {
	padding: var(--spacing-lg) var(--spacing-xl);
	border: 1px solid var(--col-gray);
	display: grid;
	grid-template-columns: max-content auto;
	gap: var(--spacing-lg);
}
.news_list a::after {
	content: "";
	position: absolute;
	inset: 50% 2em 0 auto;
	translate: -50% -50%;
	width: 1.5em;
	height: 2em;
	aspect-ratio: 3/4;
	background-image: url(../img/common/arrow_orange.svg);
	background-position: center;
	background-size: auto 90%;
	opacity: 0;
	transition: var(--transition);
}
.news_list a:hover {
	color: var(--col-act);
}
.news_list a:hover::after {
	translate: 0 -50%;
	opacity: 1;
}
.news_list time {
	line-height: 1.1;
	margin-top: calc(var(--spacing-xs-trim) * -1);
	color: var(--col-gray);
}
.page_news hgroup.h_plus {
	margin-left: calc(min(var(--outer-lr),(var(--wu) + var(--wp) - .3em)) * -1);
}
.page_news hgroup.h_3.h_plus > h3 {
	letter-spacing: .15em;
}
.page_news #next>article {
	margin-bottom: var(--spacing-3xl);
}


.bg_safari {
	display: none;
	position: fixed;
	inset: 0;
	object-fit: cover;
	height: 100%;
	width: 100%;
}
/* @media (max-width: 639px) {
	.bg_safari {
		display: block;
	}
} */
.ios .bg_safari {
	display: block;
}



/*
@media (max-width:1279px) {}
@media (max-width: 959px) {}
@media (max-width: 755px) {}
@media (max-width: 639px) {}
@media (max-width: 479px) {}
*/

/* ￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣￣ */
			/* << [000] */
/* __________________________________________________________________ */