@charset "UTF-8"; 
/*
Theme Name: METOX-H2
Text Domain: 
Author URI: 
Version: 0.9
*/
/******************/

*,
*::before,
*::after {box-sizing:border-box;}
* {
	margin:0; 
	vertical-align:baseline; 
	padding:0; 
	font-size:100%; 
	font-style:inherit; 
	font-family:inherit; 
	font-weight:inherit; 
	text-decoration:none; 
	border:0; 
	outline:0; 

	font:inherit; 
/*	all:unset; 
	display:revert; */
}
article, aside, dialog, figure, footer, header, main, nav, section {display:block;}
img, picture, audio, canvas, video, svg {display:inline-block; max-width:100%;}
img {display:block; width:100%; max-width:100%; height:auto;}
video {height:auto;}
picture {display:contents;}
h1, h2, h3, h4, h5, h6 {overflow-wrap:break-word;}
br,
hr {display:block;}
ol,
ul {list-style:none;}
blockquote, q {quotes:none;}
blockquote:before, blockquote:after, q:before, q:after {content:none;}
input,
select {vertical-align:middle;}
html {font-size:62.5%;}
body {
	position:relative; 
	width:100%; 
	height:auto; 
	text-align:center; 
	line-height:1.4; 
	font-size:1.6rem; 
	font-family:"NotoSerifJP","YuMincho", "Yu Mincho", "�����", "Hiragino Mincho ProN", "����Ǫ�ʩ��� ProN W3", "Meiryo", "���~��Ǧ", "Times New Roman", serif; 
	color:#000000; 
	color:var(--color-dark); 
	background-color:#ffffff; 
	overflow-x:hidden; 
	-webkit-text-size-adjust:100%; 
	-moz-text-size-adjust:100%; 
	-ms-text-size-adjust:100%; 
	-o-text-size-adjust:100%; 
	text-size-adjust:100%; 
	font-feature-settings:"palt"; 
	-webkit-font-smoothing:antialiased; 
	font-smoothing:antialiased; 
	/* text-rendering:optimizeLegibility; �e�G���v�Q���b����L�� */
	-webkit-tap-highlight-color:transparent; 
}
/* * {outline:2px solid #ff0000!important;} */
body.animation-none * {transition:0s!important;}
@media screen and (max-width:800px) {
	body {font-size:1.4rem;}
}
.is-navi,
.is-modal {padding-right:var(--scrollbar-width,0); overflow:hidden;}
a,
a:link,
a:visited,
a:hover,
a:active {
	text-decoration:none; 
	color:inherit; 
	transition:color .2s; 

	-webkit-tap-highlight-color:transparent rgba(0,0,0,0); 
	-moz-tap-highlight-color:transparent rgba(0,0,0,0); 
	-ms-tap-highlight-color:transparent rgba(0,0,0,0); 
	-o-tap-highlight-color:transparent rgba(0,0,0,0); 
	tap-highlight-color:transparent rgba(0,0,0,0); 
	-webkit-text-decoration-skip:objects; 
}
a:hover {color:var(--color-navy);}
h1,
h2,
h3,
h4,
h5,
h6 {display:block;}

b {color:var(--color-navy);}
i {font-style:normal;}
u {text-decoration:underline;}
em {font-weight:inherit;}
strong {font-size:inherit; font-weight:bold;}
mark {background:transparent;}

q {}
q:before,
q:after {content:"\"";}
s {text-decoration:underline;}
del {text-decoration:line-through;}

ins {}
iframe {}

ruby {}
rt {font-size:.5em;}

sup {vertical-align:super; font-size:smaller;}
sub {vertical-align:sub; font-size:smaller;}

details {margin:0 0 40px 0;}

hr {margin:0 0 40px 0; height:0; border:0; border-top:1px solid #cccccc; border-color:var(--color-light);}

table {width:100%; border-collapse:collapse; border-spacing:0; empty-cells:show; border:0;}
table th,
table td {vertical-align:top;}

::-moz-selection {color:#ffffff; background-color:var(--color-navy);}
::selection {color:#ffffff; background-color:var(--color-navy);}

:root {
	--color-lightblue:#99ccff; 
	--color-sky:#e7f0fa; 
	--color-grayishblue:#aaccdd; 
	--color-white:#ffffff; 
	--color-blue:#0054aa; 
	--color-navy:#213b5a; 
	--color-darkblue:#292971; 

	--text-color-dark:#000000; 
	--text-color-white:#ffffff; 
	--text-color-blue:#0054aa; 
	--text-color-navy:#004184; 
	--text-color-darknavy:#193b5d; 
	--text-color-brown:#a3802f; 
	--text-color-darkbrown:#714f00; 
	--text-gradient-gold:linear-gradient(0deg,#bbbb44,#aaaa22); 
	--text-gradient-lightgold:linear-gradient(0deg,#e9e99c,#baba59); 

	--text-shadow:0 0 .125em rgba(0,0,0,.8); 
	--text-shadow-blue:0 0 .125em rgba(0,0,255,.5); 
	--text-shadow-brown:0 0 .125em rgba(255,255,125,.5); 
	--text-glow:0 0 .125em rgba(255,255,255,1); 
	
	--content-padding:40px; 
	--content-width-min:min(880px,calc(100vw - var(--content-padding) * 2)); 
	--content-width-med:min(1000px,calc(100vw - var(--content-padding) * 2)); 
	--content-width-max:min(1280px,calc(100vw - var(--content-padding) * 2)); 

	--polygon-hexagon-a:polygon(25% 0%, 75% 0%, 100% 50%, 75% 100%, 25% 100%, 0% 50%); 
	--polygon-hexagon-b:polygon(50% 0%, 100% 25%, 100% 75%, 50% 100%, 0% 75%, 0% 25%); 
	
	--window-height:100vh; 
	--scrollbar-width:0; 
}
@media screen and (max-width:800px) {
	:root {--content-padding:5%;}
}

._nowrap {white-space:nowrap;}
@media not screen and (max-width:800px) {
	._pc-hide {display:none!important;}
	._pc-displaycontents {display:contents!important; ;}
}
@media screen and (max-width:800px) {
	._sp-hide {display:none!important;}
}
.site-header {position:fixed; top:0; left:0; z-index:8; width:100%; box-shadow:0 0 40px rgba(0,0,0,0.4);}

/* #post-top {z-index:0; padding:6.25vw 0 0;} */
#post-top {z-index:0;}
#post-top:before {content:""; position:fixed; top:0; right:0; bottom:0; left:0; z-index:-1; display:block; background:url("images/top-bg.jpg") center no-repeat; background-position:90% 50%; background-size:cover;}

.page-section {
	clear:both; display:flow-root; display:block;
	position:relative; padding:80px 0; overflow-x:hidden;
}
.page-section>.background {position:absolute; top:0; right:0; bottom:0; left:0; z-index:-1;}
.page-section>.background img {width:100%; height:100%; object-fit:cover;}
.page-section>.subsection {margin:0 auto; max-width:var(--content-width-med); padding:80px 0;}
@media screen and (max-width:800px) {
	.page-section {padding:48px 0;}
	.page-section>.subsection {padding:56px 0;}
}

.section-title {margin:0 auto 1em; max-width:var(--content-width-med); padding:.25em 0; text-align:center; font-size:5.0rem; text-shadow:var(--text-glow); color:var(--text-color-darknavy); background:linear-gradient(90deg,rgba(255,255,255,0),#f1f6fb 20%,#dceaf8,#f1f6fb 80%,rgba(255,255,255,0));}
.section-title.-brown {color:var(--text-color-darkbrown); background:linear-gradient(90deg,rgba(255,255,255,0),#fdfbef 20%,#ebe2c5,#fdfbef 80%,rgba(255,255,255,0));}
.section-title.-white {background:linear-gradient(90deg,rgba(255,255,255,0),#ffffff,rgba(255,255,255,0));}

.section-subtitle {margin:0 auto 1em; max-width:var(--content-width-med); text-align:center; font-size:2.8rem;}
.section-title+.section-subtitle {margin-top:-.75em;}
.section-subtitle.-brown {color:var(--text-color-darkbrown);}
.section-subtitle.-blue {color:var(--text-color-darknavy);}
@media screen and (max-width:800px) {
	.section-title {margin-bottom:1.5em; font-size:2.6rem;}
	.section-subtitle {font-size:1.8rem;}
}


.body-text {text-align:left; line-height:2;}
.body-text p {margin-bottom:1em;}
.body-text p:last-child {margin-bottom:0;}

.top-mainvisual {position:relative; z-index:0; height:calc(var(--window-height,100vh) - 6.25vw); min-height:600px;}
.top-mainvisual>.inner {display:flex; margin:0 auto; max-width:var(--content-width-max); height:100%; flex-direction:column; justify-content:center;}
.top-mainvisual .background {position:absolute; top:0; right:0; bottom:0; left:0; z-index:-1; -webkit-mask:linear-gradient(#ffffff,#ffffff 80%,transparent); mask:linear-gradient(#ffffff,#ffffff 80%,transparent);}
.top-mainvisual .background img {width:100%; height:100%; object-fit:cover;}
.top-mainvisual .copy {margin:0 0 40px; width:auto; height:48%;}
.top-mainvisual .copy>img {width:auto; height:100%; object-fit:contain; object-position:0,50%;}

.top-fv img {display:block; object-fit:cover; width:100%; height:auto;}
.top-fv img.large {display:block;}
.top-fv img.medium {display:none;}
.top-fv img.small {display:none;}
@media screen and (max-width:800px){
	.top-fv img.large {display:none;}
	.top-fv img.medium {display:block;}
	.top-fv img.small {display:none;}
}
@media screen and (max-width:375px){
	.top-fv img.large {display:none;}
	.top-fv img.medium {display:none;}
	.top-fv img.small {display:block;}
}
.mainvisual-description {position:relative; z-index:0; display:block; width:fit-content; padding:24px 0; text-align:left; line-height:1.4; font-size:min(calc(0.75rem + 1vw),2rem); font-weight:bold; color:var(--text-color-darknavy); filter:drop-shadow(0 0 10px rgba(0,84,114,.26));}
.mainvisual-description:before {content:""; position:absolute; top:0; right:-56px; bottom:0; left:-50vw; z-index:-1; background:linear-gradient(270deg,#f4f8ff,#cae6f2); clip-path:var(--polygon); --polygon:polygon(0 0, calc(100% - 50px)0,100% 50%,calc(100% - 50px) 100%,0 100%); -webkit-clip-path:var(--polygon);}
.mainvisual-description>.description>.line {display:block;}
.mainvisual-description>.description>.-strong {font-size:2.75em; color:transparent; background:linear-gradient(270deg,#72a9e2,#0058b2); background-clip:text; -webkit-background-clip:text;}
.mainvisual-description>.description>.-align-right {text-align:right;}
.mainvisual-description>.note {position:absolute; bottom:-1em; left:0; display:block; font-size:1.3rem; transform:translate(0,100%);}

@media screen and (max-width:800px) {
	#post-top {padding-top:10vw;}
	.top-mainvisual {height:calc(var(--window-height,100vh) - 10vw); min-height:0;}
	.top-mainvisual>.inner {padding-bottom:20%;}
	.top-mainvisual .copy {height:44%;}
	.top-mainvisual .copy {margin-bottom:0;}
	.top-mainvisual .patent-copy {width:fit-content; height:20%; transform:scale(1.2);}
	.top-mainvisual .patent-copy>img {width:auto; height:100%;}
	.mainvisual-description {text-align:center; font-size:1.4rem;}
	.mainvisual-description:before {right:-28px; --polygon:polygon(0 0, calc(100% - 20px)0,100% 50%,calc(100% - 20px) 100%,0 100%);}
	.mainvisual-description>.description>.-align-right {text-align:center;}
	.mainvisual-description>.description>.-strong {font-size:2em;}
}
@media screen and (max-width:360px) {
	.mainvisual-description {font-size:1.2rem;}
}

.top-mainvisual .top-fv {width:100%; height:100%;}
.top-mainvisual {height:auto; min-height:0;}


.fixed-buttons {position:fixed; right:24px; bottom:24px; z-index:8; width:min(calc(200px + 15vw),400px); transition:opacity 0.5s;}
.fixed-buttons .contactlink {position:absolute; right:0; display:block; width:58%; height:65%; color:transparent;}
.fixed-buttons.-avoid-footer {opacity:0; pointer-events:none;}
@media screen and (max-width:800px) {
	.fixed-buttons-sp {position:fixed; right:0; bottom:0; left:0; z-index:8;}
	.fixed-buttons-sp>img {width:100%;}
}

.top-introduction-outline {position:relative; margin:5% 0 0;}
.top-introduction-outline>.background {display:grid; grid-template-rows:auto auto; grid-auto-flow:column;}
.top-introduction-outline>.background>.item {display:contents;}
.top-introduction-outline>.background>.item.-left>.title {padding-right:20%;}
.top-introduction-outline>.background>.item.-right>.title {padding-left:20%;}
.top-introduction-outline>.background .title {display:block; padding:.8em 0; line-height:1.2; font-size:calc(1.5rem + 1vw); text-shadow:var(--text-shadow); color:var(--text-color-white); background:linear-gradient(180deg,#5997d8,#0058b2);}
.top-introduction-outline>.background .title>.-large {margin:0 .2em; font-size:1.8em;}
.top-introduction-outline>.productimage {position:absolute; top:50%; left:50%; width:25%; transform:translate(-50%,-50%);}
.top-introduction-outline>.productimage>.title {position:absolute; top:50%; left:50%; width:140%; transform:translate(-50%,-50%); filter:drop-shadow(0 0 4px rgba(255,255,255,1));}

@media screen and (max-width:800px) {
	.top-introduction-outline {margin:0;}
	.top-introduction-outline>.productimage {position:static; width:100%; height:auto; transform:none;}
}

.top-introduction-purpose {margin:160px auto 0; max-width:var(--content-width-med);}

.purpose-title {margin:0 0 1em; font-size:5.2rem;}

.purpose-list {display:grid; gap:16px; grid-template-columns:1fr 1fr;}
.purpose-list>.item {position:relative;}
.purpose-list>.item>.title {position:absolute; bottom:1em; left:0; z-index:2; padding:.75em 2em .75em 1em; font-size:2rem; color:var(--text-color-white); background:linear-gradient(180deg,#5997d8,#0058b2); clip-path:polygon(0 0, calc(100% - 16px)0,100% 50%,calc(100% - 16px) 100%,0 100%);}
@media screen and (max-width:800px) {
	.purpose-title {font-size:3.0rem;}
	.top-introduction-purpose {margin:80px auto 0;}
	.purpose-list {row-gap:12px; column-gap:6px;}
	.purpose-list>.item>.title {position:static; padding:.25em 0.5em; clip-path:none; -webkit-clip-path:none;}
}

.approach-title {position:relative; z-index:2; margin:0 auto -2em; max-width:var(--content-width-min); text-align:left; font-size:min(calc(1.0rem + 1.25vw),2.5rem); font-weight:bold; text-shadow:var(--text-glow);}
.approach-title>.logo {display:inline-block; height:3em; width:auto; vertical-align:-75%;}
.approach-title>.logo>img {height:100%; width:auto;}
.approach-title>.-medium {margin-right:.5em; vertical-align:-12%; font-size:2em; font-style:italic;}
.approach-title>.-large {font-size:2em; text-shadow:var(--text-glow); color:inherit;}

.approach-list {display:grid; margin:80px auto; max-width:var(--content-width-med); grid-template-columns:1fr 1fr;}
.approach-list>.item {transform:scale(1.15);}
.approach-title+.approach-list {margin-top:56px;}
.approach-list+.approach-details {margin-top:140px;}

.approach-details {margin:0 auto; max-width:var(--content-width-med);}
.approach-details .item+.item {margin-top:40px;}
.approach-details .item {padding:56px 0 32px; background:url("images/approach-details-01-bg.png") center no-repeat; background-size:cover;}
.approach-details .item>.title {font-size:5.2rem; text-shadow:0 0 .125em rgba(255,255,255,1);}
.approach-details .item>.content {height:auto; padding:40px 0; transform:scale(1.2);}
.approach-details .item-01 {background:url("images/approach-details-01-bg.png");}
.approach-details .item-01>.title {color:var(--text-color-blue);}
.approach-details .item-02 {background-image:url("images/approach-details-02-bg.png");}
.approach-details .item-02>.title {color:var(--text-color-brown);}
@media screen and (max-width:1200px) {
	.approach-details .item>.content {transform:scale(1.05);}
}
@media screen and (max-width:800px) {
	.approach-list {display:block; width:100%; max-width:none; margin:0 0;}
	.approach-list+.approach-details {margin-top:64px;}
	.approach-details .item {padding:32px 0 0;}
	.approach-details .item>.title {font-size:2.8rem;}
	.approach-details .item>.content {width:100%; padding:0; transform:none;}
}

#top-worries {z-index:2; overflow: visible;}

.worries-title {margin:0 0 .5em; font-size:5.2rem; font-weight:bold;}

.worries-container {position:relative; display:flex; margin:0 auto; max-width:var(--content-width-max); justify-content:space-around; align-items:flex-end; z-index:2;}
.worries-container>.image {flex-basis:20%;}
.worries-container>.worries-list {flex-basis:60%;}

.worries-list {display:grid; margin-bottom:-80px; gap:16px; grid-template-columns:1fr 1fr;}
.worries-list>.item {position:relative; z-index:0; display:grid; padding:24px; gap:12px; grid-template-rows:1fr 1fr; filter:drop-shadow(0 0 10px rgba(0,0,0,.16)); grid-auto-flow:row;}
.worries-list>.item>li {z-index:0; display:flex; padding:16px; font-size:min(calc(0.5rem + 1.5vw),2.4rem); word-break:keep-all; flex-direction:column; justify-content:center; background:var(--color-white); box-shadow:0 0 6px rgba(0,0,0,.16);}
.worries-list>.item:before {content:""; position:absolute; top:0; right:0; bottom:0; left:0; z-index:-1; display:block; clip-path:var(--polygon); -webkit-clip-path:var(--polygon);}
.worries-list>.item.-left {color:var(--text-color-darknavy);}
.worries-list>.item.-left:before {left:-12px; background:#f2f9fc; --polygon:polygon(12px 0 ,100% 0, 100% 100%,12px 100%,12px calc(100% - 36px),0 calc(100% - 60px),12px calc(100% - 84px));}
.worries-list>.item.-right {color:var(--text-color-darkbrown);}
.worries-list>.item.-right:before {right:-12px; background:#f3f3eb; --polygon:polygon(0 0,calc(100% - 12px) 0, calc(100% - 12px) calc(100% - 84px),100% calc(100% - 60px),calc(100% - 12px) calc(100% - 36px),calc(100% - 12px) 100%,0 100%);}
.worries-list>.item.-bottom {padding-right:48px; color:var(--text-color-darknavy); grid-column:span 2;}
.worries-list>.item.-bottom:before {right:-12px; left:-12px; background:linear-gradient(90deg,#f2f9fc,#f3f3eb); --polygon:polygon(12px 0,calc(100% - 12px) 0,calc(100% - 12px) 88px,100% 60px,calc(100% - 12px) 36px,calc(100% - 12px) 100%,12px 100%,12px 88px,0 60px,12px 36px);}
@media screen and (max-width:800px) {
	#top-worries {margin-bottom:-24px;}
	.worries-title {position:relative; z-index:0; margin:0 auto 1em; width:fit-content; padding:.5em 1em 1.25em; font-size:min(calc(1.0rem + 2vw),2.4rem); filter:drop-shadow(0 0 10px rgba(0,0,0,.2));}
	.worries-title:before {content:""; position:absolute; top:0; right:0; bottom:0; left:0; z-index:-1; background:var(--color-white); clip-path:var(--polygon); --polygon:polygon(0 0 ,100% 0,100% calc(100% - 0.6em),calc(50%  + 24px)  calc(100% - 0.6em),50% 100%,calc(50%  - 24px)  calc(100% - 0.6em),0 calc(100% - 0.6em)); -webkit-clip-path:var(--polygon);}
}

#top-solution {position:relative; overflow:visible;}
#top-solution:before {content:""; position:absolute; top:-80px; right:0; bottom:0; left:0; z-index:-1; display:block; background:rgba(225,234,244,.7);}

.solution-arrow {margin:0 auto; width:200px; height:100px; background:url("images/arrow-bottom-large-blue.png") center no-repeat; background-size:contain;}

.solution-title {margin:0 auto 1em; word-break:keep-all; max-width:var(--content-width-med); font-size:4.9rem; color:var(--text-color-darknavy);}

.solution-tags {display:grid; margin:0 auto; max-width:var(--content-width-min); gap:12px; grid-template-columns:repeat(4,1fr);}
.solution-tags>.item {padding:.625em; font-size:2.8rem; font-weight:bold; text-shadow:var(--text-shadow); color:var(--text-color-white); background:linear-gradient(0deg,#afafaf,#4b4b4b);}

.solution-content {display:flex; margin:0 auto; max-width:var(--content-width-med); justify-content:space-between; align-items:center;}
.solution-content>.image {flex-basis:25%;}
.solution-content>.solution-list-pc {display: grid; grid-auto-flow:row; gap:16px; margin:40px 0; flex-basis:70%;}

.solution-list {display:grid; gap:16px; grid-template-rows:1fr 1fr; grid-auto-flow:column;}
.solution-list>.item {padding:2em 4em; text-align:left; line-height:1.6; font-weight:bold; text-shadow:var(--text-shadow); color:var(--text-color-white); background:linear-gradient(90deg,#5997d8,#0058b2); clip-path:polygon(0 50%,40px 0,100% 0,100% 100%,40px 100%);}
.solution-list>.item>.title {margin:0 0 .5em; font-size:2.6rem;}
.solution-list>.item>.description {font-size:2.2rem;}
.solution-list>.item>.note {font-size:1.8rem;}
@media screen and (max-width:800px) {
	.solution-arrow {width:120px; height:60px;}
	.solution-content {display:block;}
	.solution-content>.imagesp {margin:0 0 -64px; width:100%;}
	.solution-list {grid-template-rows:auto auto;}
	.solution-list>.item {padding:1.5em; clip-path:none;}
	.solution-list>.item>.title {font-size:1.6rem;}
	.solution-list>.item>.description {font-size:1.4rem;}
	.solution-list>.item>.note {font-size:1.2rem;}
}

#top-contact {clear:both; display:block;}
.top-contact-entry-a {padding:80px 0 0; z-index:2; overflow:visible;}
.top-contact-entry-a>.background {bottom:80px;}

.contact-entry-a {margin:0 auto; max-width:var(--content-width-med);}
.contact-entry-a>.copy {font-size:min(calc(2em + 1vw),5.0rem); color:var(--text-color-dark);}
.contact-entry-a>.content {display:flex; margin:-40px 0 0; justify-content:space-between; align-items:center;}
.contact-entry-a>.content>.copy {flex-basis:50%; text-align:left; line-height:1.2; white-space:nowrap; font-size:min(calc(2em + 1vw),5.0rem);}
.contact-entry-a>.content>.copy>.-large {font-size:2.4em;}
.contact-entry-a>.content>.copy>.-medium {font-size:1.25em;}
.contact-entry-a>.content>.copy>.-gold {color:transparent; background:linear-gradient(180deg,#deb969,#79582b); background-clip:text; -webkit-background-clip:text;}
.contact-entry-a>.content>.image {position:relative; z-index:0; flex-basis:50%; transform:translate(5%,0);}

.contact-entry-a-sp {width:100%;}
@media screen and (max-width:800px) {
	.top-contact-entry-a {padding:0;}
}

.contact-button[class] {margin:0 auto; position:relative; z-index:0; display:block; margin:0 auto; width:fit-content; padding:.75em .75em 1.25em; line-height:1; font-size:4.2rem; font-weight:bold; text-shadow:var(--text-shadow); color:var(--text-color-white); transition:opacity 0.2s;}
.contact-button[class]:before,
.contact-button[class]:after {content:""; position:absolute; top:0; right:0; bottom:0; left:0; z-index:-1; background:linear-gradient(#deb969,#79582b); clip-path:var(--polygon); --polygon:polygon(0 0,100% 0,100% calc(100% - 24px),50% 100%, 0 calc(100% - 24px)); -webkit-clip-path:var(--polygon);}
.contact-button[class]:before {opacity:.5; transform:translate(0,12.5%);}
.contact-button[class]:hover {opacity:0.5;}
@media screen and (max-width:800px) {
	.contact-button[class] {font-size:2.8rem; width:100%; max-width:min(520px,var(--content-width-med));}
	.contact-button[class]:before,
	.contact-button[class]:after {--polygon:polygon(0 0,100% 0,100% calc(100% - 16px),50% 100%, 0 calc(100% - 16px));}
}
@media screen and (max-width:480px){
	.contact-button[class] {margin-left:calc(50% - 50vw); width:100vw; max-width:none;}
}

.installation-detail-button[class] {position:relative; z-index:0; display:block; margin:0 auto; width:fit-content; padding:.75em .75em 1.25em; line-height:1; font-size:4.2rem; font-weight:bold; text-shadow:var(--text-shadow); color:var(--text-color-white); transition:opacity 0.2s;}
.installation-detail-button[class]:before,
.installation-detail-button[class]:after {content:""; position:absolute; top:0; right:0; bottom:0; left:0; z-index:-1; background:linear-gradient(180deg,#5997d8,#0058b2); clip-path:var(--polygon); --polygon:polygon(0 0,100% 0,100% calc(100% - 24px),50% 100%, 0 calc(100% - 24px)); -webkit-clip-path:var(--polygon);}
.installation-detail-button[class]:before {opacity:.5; transform:translate(0,12.5%);}
.installation-detail-button[class]:hover {opacity:0.5;}
@media screen and (max-width:800px) {
	.installation-detail-button[class] {margin:calc(50% - 50vw); width:100vw; font-size:2.8rem;}
	.installation-detail-button[class]:before,
	.installation-detail-button[class]:after {--polygon:polygon(0 0,100% 0,100% calc(100% - 16px),50% 100%, 0 calc(100% - 16px));}
}

.more-button[class] {display:block; width:fit-content; padding:.5em 1em; text-align:center; font-size:3.2rem; text-shadow:var(--text-shadow); color:var(--text-color-white); background:linear-gradient(180deg,#5997d8,#0058b2); transition:opacity 0.5s;}
.more-button[class]:hover {opacity:0.5;}
.more-button[class].-center {margin-left:auto; margin-right:auto;}
@media screen and (max-width:800px){
	.more-button[class] {font-size: 2.4rem;}
}

.menu-info {margin:0 auto; max-width:var(--content-width-med);}

.menu-title {margin:1.5em 0 .25em; text-align:left; font-size:4.6rem;}
.menu-title:first-child {margin-top:0;}
.menu-title.-navy {color:var(--text-color-darknavy);}
.menu-title.-blue {color:var(--text-color-blue);}
.menu-title {display:flex; justify-content:space-between; align-items:flex-end; line-height:1;}
.menu-title .note {font-size:max(.4em,1.2rem); color:var(--text-color-dark);}

.menu-table {border-collapse:separate; border-spacing:10px; text-align:center; font-size:2.4rem;}
.menu-table.-columns-4 {grid-template-columns:repeat(4,auto);}
.menu-table thead th {padding:.5em; font-size:2.2rem; text-shadow:var(--text-shadow); color:var(--text-color-white); background:linear-gradient(90deg,#5b8cbf,#052e58);}
.menu-table th,
.menu-table td {vertical-align:middle; padding:1em; background:#ecf2f9;}
.menu-table.-blue thead th {background:linear-gradient(90deg,#5997d8,#0058b2);}
.menu-table+.productprice-box {margin-top:80px;}

.productprice-box {position:relative; display:flex; justify-content:space-between; background:linear-gradient(0deg,#f4f8ff,#ffffff); box-shadow:0 0 6px rgba(0,0,0,.16);}
.productprice-box>.title {position:absolute; top:0; left:0; z-index:2; font-size:4.5rem; text-shadow:0 0 10px #a5ccde; color:var(--text-color-navy); transform:translate(0,-50%);}
.productprice-box>.left {position:relative; z-index:0; display:flex; flex-basis:47.5%; padding:2.5%; flex-direction:column; justify-content:center; filter:drop-shadow(3px 0 6px rgba(0,0,0,.08));}
.productprice-box>.left:before {content:""; position:absolute; top:0; right:-8px; bottom:0; left:0; z-index:-1; background:linear-gradient(180deg,#e8f0fa,#d6e0ea); opacity:1; clip-path:var(--polygon); --polygon:polygon(0 0,calc(100% - 24px) 0, 100% 50%, calc(100% - 24px) 100%, 0 100%); -webkit-clip-path:var(--polygon);}
.productprice-box>.left>p {font-size:min(calc(1.75em + 0.75vw),4.0rem); --text-shadow:var(--text-glow);}
.productprice-box>.left>p .-large {margin:0 .125em; font-size:1.375em; text-shadow:var(--text-glow); color:var(--text-color-darknavy);}
.productprice-box>.right {display:flex; flex-basis:50%; padding:1em; flex-direction:column; justify-content:center; text-align:center;}
.productprice-box>.right dl>.item {display:flex; align-items:center; justify-content: center;}
.productprice-box>.right dl>.item+.item {margin-top:0.125em;}
.productprice-box>.right dt {margin-right:1em; width:9em; padding:.5em 1em; font-size:1.4rem; color:var(--text-color-white); background:var(--color-navy); clip-path:var(--polygon); --polygon:polygon(0 0,calc(100% - .5em) 0, 100% 50%, calc(100% - .5em) 100%, 0 100%); -webkit-clip-path:var(--polygon);}
.productprice-box>.right dd {font-size:2.8rem;}
.productprice-box>.right dd .-large {display:inline-block; margin:0 .2em; vertical-align:-2.5%; font-size:3.8rem; color:var(--text-color-navy);}
.productprice-box>.right dd .-small {font-size:1.6rem;}
.productprice-box>.right p {margin-top:.25em; font-size:2.8rem;}
.productprice-box.-blue>.title {color:var(--text-color-blue);}
.productprice-box>.left:before {background:linear-gradient(#f4f8ff,#badcff);}
.productprice-box.-blue>.right dt {background:var(--color-blue);}
.productprice-box.-blue>.right dd .-large {color:var(--text-color-blue);}
.productprice-box.-blue>.left>p .-large {color:var(--text-color-blue);}
.productprice-box+.menu-title {margin-top:1em;}
@media screen and (max-width:1000px) {
	.menu-table {font-size:1.8rem;}
}
@media screen and (max-width:800px) {
	.menu-title {font-size:2.8rem;}
	.menu-table {border-spacing:4px; font-size:1.3rem;}
	.menu-table th,
	.menu-table td {padding: 0.75em;}
	.menu-table thead th {font-size:1.1rem;}
	.productprice-box-sp {margin:32px 0 56px; filter:drop-shadow(0 0 5px rgba(0,0,0,0.2));}
	.productprice-box-sp:last-child {margin-bottom:0;}
}

.top-contact-entry-b {margin-bottom:0;}
.top-contact-entry-b>.background {bottom:120px;}

.contact-entry-b {position:relative; margin:0 auto; max-width:var(--content-width-med);}
.contact-entry-b>.copy {font-size:2.6rem;}
.contact-entry-b>.copy+.copy {margin-top:.25em;}
.contact-entry-b>.copy>.-large {font-size:1.2em;}
.contact-entry-b>.copy>.-darkblown {color:var(--text-color-brown);}
.contact-entry-b>.copy.-large {margin:.25em 0 .5em; line-height:1.25; font-size:min(calc(2.5rem + 2.5vw),5.8rem); font-weight:bold; text-shadow:var(--text-glow); color:var(--text-color-brown);}
.contact-entry-b-sp {width:100%;}
.contact-entry-b-sp>.contact-button {margin-top:-40px;}
@media screen and (max-width:800px) {
	.contact-entry-b {margin-left:calc(50% - 50vw); width:100vw; max-width:none;}
}

#top-step1 .subsection {position: relative; z-index:0;}
#top-step1 .subsection:before {content:""; position:absolute; top:0; bottom:0; left:50%; z-index:-1; display:block; width:100vw; background:#e1eaf4; opacity:.7; transform:translate(-50%,0);}
#top-step1 .subsection-02:before {background-color:#eff5fc; opacity:.6;}
#top-step1 .subsection-03:before {background:#ffffff; opacity:1;}

@media screen and (max-width:800px){
	#top-step1 .subsection-02 {padding-top:0;}
}

.step-title {position:relative; z-index:0; display:flex; margin:0 auto; max-width:var(--content-width-max); justify-content:space-between; --polygon:polygon(132px 0,100% 0,100% 100%,0 100%);}
.step-title:before {content:""; position:absolute; top:0; right:-100vw; bottom:0; left:calc(40% - 88px); z-index:2; z-index:0; display:block; background:linear-gradient(#c0d8e5,#0058b2); opacity:.86; clip-path:var(--polygon); -webkit-clip-path:var(--polygon); mix-blend-mode:multiply;}
.step-title>.title {position:relative; flex-basis:40%; flex-shrink:0; padding:80px 0; text-align:left; line-height:1.25; font-size:5.8rem; text-shadow:var(--text-shadow); color:var(--text-color-white);}
.step-title>.title:before {content:""; position:absolute; top:0; right:0; bottom:0; left:-100vw; z-index:-2; display:block; background:linear-gradient(0deg,#5997d8,#004081);}
.step-title>.title>.number {display:block; font-size:1.6em;}
.step-title>.description {z-index:2; display:flex; flex-basis:100%; flex-shrink:1; padding:0 0 0 80px; flex-direction:column; justify-content:center; text-align:left;}
.step-title>.description>.text {font-size:4.2rem; text-shadow:var(--text-shadow); color:var(--text-color-white);}
.step-title>.description>.text .emphasys {display:inline-block; padding:.25em .5em; background:rgba(1, 60, 149, .8);}
.step-title>.description>.text.-center {text-align:center;}
.step-title>.description>.text .-small {font-size:.75em;}
.step-title>.description>.text .-large {font-size:1.125em;}
.step-title>.background {position:absolute; top:0; right:calc(50% - 100vw); bottom:0; left:calc(35% - 72px); z-index:-1;}
.step-title>.background img {width:100%; height:100%; clip-path:var(--polygon); object-fit:cover; -webkit-clip-path:var(--polygon);}

.step1-copy {display:flex; justify-content:space-between; align-items:center;}
.step1-copy>.title {flex-basis:40%; flex-shrink:0; text-align:left; font-size:min(calc(2rem + 2vw),4.2rem);}
.step1-copy>.title>.-large {font-size:1.625em; white-space:nowrap;}
.step1-copy>.image {flex-basis:60%; transform:translate(5%,0);}

.step1-patent {display:flex; margin:64px 0; justify-content:space-between; align-items:center;}
.step1-patent>.caption {flex-basis:35%; text-align:left;}
.step1-patent>.caption>.title {position:relative; display:block; margin:0 0 .375em; padding:0 0 .2em; font-size:min(calc(1.5rem + 1.5vw), 3.6rem); font-weight:bold; color:var(--text-color-blue);}
.step1-patent>.caption>.title:after {content:""; position:absolute; right:-40%; bottom:0; left:0; display:block; height:4px; background:var(--color-blue);}
.step1-patent>.caption>.title>.-large {font-size:1.4em;}
.step1-patent>.caption>.description {font-size:3.0rem; font-weight:bold;}
.step1-patent>.points {display:grid; flex-basis:65%; gap:12px; grid-template-columns:1fr 1fr 1fr;}
.step1-patent>.points>.item {position:relative; padding:5%; background:linear-gradient(225deg,#5997d8,#194674); border-radius:400px;}
.step1-patent>.points>.item:before {content:""; display:block; height:0; background:linear-gradient(45deg, #5997d8,#0058b2); border-radius:400px; padding-top:100%;}
.step1-patent>.points>.item>.text {position:absolute; position:absolute; top:50%; left:50%; width:100%; font-size:min(calc(1.0rem + 1vw),2.7rem); text-shadow:0 0 .25em rgba(0,0,0,.68); color:var(--text-color-white); transform:translate(-50%,-50%);}
.step1-patent>.points>.item>.text>.number {font-size:1.4em;}

.step1-effect {display:grid; grid-template-columns:45% 55%; grid-template-rows:1fr 1fr; row-gap:40px;}
.step1-effect>.left {z-index:2; text-align:left;}
.step1-effect>.left>.title {margin-bottom:.5em; font-size:5.0rem; color:var(--text-color-blue);}
.step1-effect>.left>.effect {display:grid; gap:16px; grid-template-rows:1fr 1fr; grid-auto-flow:column;}
.step1-effect>.left>.effect>.item {position:relative; text-align: center; display: flex; justify-content: center; flex-direction: column; z-index:0; padding:1em; font-size:2.8rem; text-shadow:var(--text-shadow); color:var(--text-color-white);}
.step1-effect>.left>.effect>.item:before {content:""; position:absolute; top:0; right:-40px; bottom:0; left:-40px; z-index:-1; display:block; background:linear-gradient(90deg,#5997d8,#0058b2); clip-path:var(--polygon); --polygon:polygon(0 0,calc(100% - 24px) 0, 100% 50%,calc(100% - 24px) 100%,0 100%); -webkit-clip-path:var(--polygon);}
.step1-effect>.right {position:relative; margin-top:64px;}
.step1-effect>.right>.bubble {position:absolute; top:-10%; right:-5%; width:150px; height:150px;}
.step1-effect>.bottom {grid-column:span 2;}
.step1-effect>.bottom {display:flex; justify-content:space-between; align-items:center;}
.step1-effect>.bottom>.caption {position:relative; z-index:0; margin:0 5%; flex-basis:240px; font-size:2.6rem; text-shadow:var(--text-shadow); color:var(--text-color-white); filter:drop-shadow(0 0 6px rgba(0,0,0,.5));}
.step1-effect>.bottom>.caption:before {content:""; position:absolute; top:50%; left:50%; z-index:-1; display:block; width:100%; height:0; background:linear-gradient(180deg,#5997d8,#0058b2); clip-path:var(--polygon-hexagon-b); transform:translate(-50%,-50%); padding-top:115.5%; -webkit-clip-path:var(--polygon-hexagon-b);}
.step1-effect>.bottom>.image {flex-basis:70%;}

.step1-patent-sp {margin:0 0 40px;}

@media screen and (max-width:800px) {
	.step1-effect {display:block;}
	.step1-effect>.left>.title {font-size:2.8rem;}
	.step1-effect>.right {margin:0 auto 40px;}
	.step1-effect>.right>.bubble {right:0; width:100px; height:100px;}
	.step1-effect>.right>.effect {display:grid; gap:8px; grid-auto-flow:row;}
	.step1-effect>.right>.effect>.item {padding:.25em 1em; font-size:2.0rem; text-shadow:var(--text-shadow); color:var(--text-color-white); background:linear-gradient(90deg,#5997d8,#0058b2);}
	.step1-effect>.bottom {display:block;}
	.step1-effect>.bottom>.image {margin-bottom:1em;}
	.step1-effect>.bottom>.caption {margin-bottom:1em; font-size:2.8rem; text-shadow:none; color:var(--text-color-blue); filter:none;}
	.step1-effect>.bottom>.caption:before {display:none;}
}


.step1-hydrogen {z-index:0; padding:80px; background:url("images/top-step1-hydrogen-bg.jpg") center no-repeat; background-size:cover;}
.step1-hydrogen>.title {margin:0 0 1em; text-align:center; font-size:4.6rem; font-weight:bold; color:var(--text-color-blue);}
@media screen and (max-width:800px) {
	.step1-hydrogen {padding:40px var(--content-padding);}
	.step1-hydrogen>.title {font-size:2.6rem;}
	.step1-hydrogen {margin:0 0 0 calc(50% - 50vw); width:100vw; box-shadow:0 0 24px rgba(0,0,0,.2);}
}

.step1-reason {margin:80px auto; max-width:var(--content-width-min);}
.step1-reason>.title {margin:0 0 1em; text-align:center; font-size:4.6rem; font-weight:bold; color:var(--text-color-blue);}
.step1-reason>.content {display:flex; justify-content:space-between; align-items:center;}
.step1-reason>.content>.textcontent {flex-basis:48%; text-align:left;}
.step1-reason>.content>.textcontent>.copy {margin:0 0 .5em; font-size:2.8rem; color:var(--text-color-blue);}
.step1-reason>.content>.image {flex-basis:48%;}
@media screen and (max-width:800px) {
	.step1-reason {margin:48px 0;}
	.step1-reason>.title {font-size:2.8rem;}
	.step1-reason>.content {display:block;}
	.step1-reason>.content>.textcontent>.copy {font-size:2.2rem;}
}

.step1-attack {margin:0 auto; max-width:var(--content-width-min);}

.step1-conclusion>.title {margin:0 0 1em; font-size:5.6rem; font-weight:bold; color:transparent; background:linear-gradient(270deg,#72a9e2,#0058b2); background-clip:text; -webkit-background-clip:text;}

.step1-causes>.title {margin:1em 0; text-align:center; font-size:3.6rem;}
.step1-causes>.title>.-blue {color:var(--text-color-blue);}

.usually-product>.title {margin:0 0 1em; text-align:center; font-size:2.8rem;}
.usually-product {position:relative; display:flex; margin:0 auto; max-width:780px; padding:48px; flex-direction:row-reverse; justify-content:space-between; align-items:center; background:linear-gradient(0deg,#ededed,#ffffff);}
.usually-product:before {content:""; position:absolute; top:50%; left:5%; display:block; width:25%; height:90%; background:url("images/usual-product-bg.png") center no-repeat; background-size:contain; transform:translate(0,-50%);}
.usually-product>.textcontent {flex-basis:48%; text-align:left;}
.usually-product>.textcontent>.title {margin:0 0 .75em; font-size:2.8rem;}
.usually-product>.textcontent>.description {margin:0 0 .5em; font-size:2rem;}
.usually-product>.textcontent>.list>li+li {margin-top:.5em;}
.usually-product>.image {position:relative; flex-basis:48%;}
.usually-product>.image:before {content:""; position:absolute; top:-7.5%; left:5%; display:block; width:64px; height:64px; background:url("images/worrie-icon.png") center no-repeat; background-size:contain;}
@media screen and (max-width:800px) {
	.step1-conclusion>.title {font-size:2.8rem;}
	.step1-causes>.title {margin:1em 0 2em; text-align:center; font-size:2.1rem;}

	.usually-product {display:block; padding:22px;}
	.usually-product>.title {font-size: 2.4rem;}
	.usually-product>.image {margin-bottom:24px;}
	.usually-product:before {bottom:0; height:35%; width:40%; top:auto; transform:none; right:0; left:auto;}
}

.new-product {position:relative; margin:56px auto; max-width:var(--content-width-med); padding:48px; background:linear-gradient(0deg,#ededed,#ffffff); box-shadow:0 0 10px rgba(0,0,0,.2);}
.new-product:before {content:""; position:absolute; top:0; left:50%; display:block; width:200px; height:140px; background:url("images/arrow-bottom-large-blue-b.png") center no-repeat; background-size:contain; transform:translate(-50%,-50%);}
.new-product>.copy {margin:0 0 .25em; width:80%; text-align:left; line-height:1.375; font-size:4.8rem;}
.new-product>.copy>.-large {font-size:1.2em;}
.new-product>.copy>.-blue {color:var(--text-color-blue);}
.new-product>.description {margin:0 0 1em; width:80%; text-align:left; font-size:3.2rem;}
.new-product>.description>.-blue {font-weight:inherit; color:var(--text-color-blue);}
.new-product>.description>.astarisk {font-size:0.75em; vertical-align:top;}
.new-product>.image {position:absolute; top:-15%; right:0; width:20%;}
.new-product>.points {display:grid; gap:16px; grid-template-columns:1fr 1fr 1fr;}
.new-product>.points>.item {display:flex; padding:1em; flex-direction:column; justify-content:center; font-size:2rem; text-shadow:var(--text-shadow); color:var(--text-color-white); background:linear-gradient(0deg,#72a9e2,#0058b2);}
.new-product>.points>.item.-text-large {font-size:2.4rem;}
.new-product>.note {position:absolute; right:0; bottom:-.75em; transform:translate(0,100%);}
.new-product+.contact-button {margin-top:64px;}
.new-product-sp {margin:40px 0 40px calc(50% - 50vw); width:100vw;}

#top-step2 {padding-top:0;}
#top-step2>.subsection {position:relative; z-index:0;}
#top-step2>.subsection:before {content:""; position:absolute; top:0; bottom:0; left:50%; z-index:-1; display:block; width:100vw; transform:translate(-50%,0);}
#top-step2>.subsection-01:before {background-color:#e1eaf4; opacity:.7;}
#top-step2>.subsection-02:before {background-color:#eff5fc; opacity:0.6;}
#top-step2>.subsection-04:before {bottom:144px; background:linear-gradient(#75b6d9,#003a96); opacity:.2;}
@media screen and (max-width:800px){
	#top-step2>.subsection-04:before {bottom:80px;}
}

.point-outline-title {display:flex; align-items:center; margin:0 0 .5em; text-align:left; font-size:min(calc(1rem + 3.2vw),5.2rem); color:var(--text-color-blue);}
.point-outline-title>.label {line-height:1; font-size:min(calc(1rem + 1vw),1.8rem); text-align:center; margin:0 16px 0 0; vertical-align:middle;}
.point-outline-title>.label>.number {display:block; font-size:3em;}

.step2-point01-outline {position:relative;}
.step2-point01-outline .point-outline-title {width:80%;}
.step2-point01-outline>.bodytext {text-align:left; line-height:1.75; font-size:2.2rem;}
.step2-point01-outline>.image {position:absolute; top:50%; right:-4%; width:62%; transform:translate(0,-50%);}
.step2-point01-outline>.image img {position:relative; z-index:2;}
.step2-point01-outline>.image>.title {position:absolute; bottom:-12%; white-space:nowrap; font-size:6.8rem; text-shadow:0 0 10px rgba(37,128,221,.32); color:var(--text-color-white);}

.step2-point01-effect {display:flex; justify-content:space-between; align-items:center;}
.step2-point01-effect>.image {flex-basis:55%;}
.step2-point01-effect>.textcontent {flex-basis:45%;}
.step2-point01-effect>.textcontent>.pointlist {margin:0 0 1em; padding:0 0 0 32px; text-align:left; font-size:2.8rem; color:var(--text-color-blue);}
.step2-point01-effect>.textcontent>.caption {position:relative; z-index:0; margin-bottom:.25em; padding:.25em 1em; text-align:left; font-size:min(calc(2.5rem + 2vw),5.0rem); text-shadow:var(--text-shadow); color:var(--text-color-white);}
.step2-point01-effect>.textcontent>.caption:before {content:""; position:absolute; top:0; right:0; bottom:0; left:-1em; z-index:-1; display:block; background:linear-gradient(270deg, #5997d8,#0058b2); clip-path:var(--polygon); --polygon:polygon(0 50%,24px 0,100% 0,100% 100%,24px 100%); -webkit-clip-path:var(--polygon);}
.step2-point01-effect>.textcontent>.caption>em {font-weight:inherit;}
.step2-point01-effect>.textcontent>.caption .asterisk {font-size: 0.5em; vertical-align:super;}
.step2-point01-effect>.textcontent>.note {text-align:right;}
.step2-point01-outline+.step2-point01-effect {margin-top:80px;}
@media screen and (max-width:800px){
	.step2-point01-outline {display: grid; grid-template-columns:1fr 1fr; align-items:center;}
	.step2-point01-outline .point-outline-title {width:100%; grid-column:span 2;}
	.step2-point01-outline>.bodytext {font-size:1.4rem;}
	.step2-point01-outline>.image {position: static; width:100%; transform:translate(5%,0) scale(1.75);}

	.step2-point01-effect {display: grid;}
	.step2-point01-effect .textcontent {display:contents;}
	.step2-point01-effect>.textcontent>.caption {grid-row:2; width:fit-content; margin-bottom:-1em;}
	.step2-point01-effect>.textcontent>.caption:before {--polygon:polygon(0 0,calc(100% - 24px) 0,100% 50%,calc(100% - 24px) 100%,0 100%); left:0; right:-1em;}
	.step2-point01-effect .textcontent>.pointlist {display: grid; grid-template-columns:auto auto auto; grid-row:1; gap:0.25em; padding:0;}
	.step2-point01-effect>.textcontent>.pointlist>li {font-size:1.28rem; padding:0.5em 0em; background:var(--color-white); text-align: center;}
}

.step2-point02-outline {display:flex; justify-content:space-between; align-items:center; flex-wrap:wrap;}
.step2-point02-outline .point-outline-title {flex-basis:100%;}
.step2-point02-outline>.bodytext {flex-basis:50%; text-align:left; line-height:1.75; font-size:2.2rem;}
.step2-point02-outline>.bodytext>.title {font-size:4.0rem;}
.step2-point02-outline>.image {position:relative; z-index:2; flex-basis:50%;}
.step2-point02-outline>.image img {position:absolute; top:50%; right:0; left:0; width:100%; height:auto; transform:translate(0,-50%);}

.step2-point02-aging {margin:40px 0; padding:48px; background:var(--color-sky);}
.step2-point02-aging>.bodytext {text-align:left; line-height:1.8;}
.step2-point02-aging>.figures {display:grid; margin:40px 0 0; gap:40px; grid-template-columns:auto auto;}
.step2-point02-aging>.figures img {height:auto;}
.step2-point02-aging>.figures>.figure {display:flex; flex-direction:column;}
.step2-point02-aging>.figures .caption.-blue {color:var(--text-color-darknavy);}
.step2-point02-aging>.figures .caption.-brown {color:var(--text-color-darkbrown);}
.step2-point02-aging>.note {margin:1em 0 0; text-align:right; font-size:1.2rem;}
@media screen and (max-width:800px) {
	.step2-point02-outline {display: block;}
	.step2-point02-outline>.bodytext {font-size: 1.4rem; margin-bottom:24px;}
	.step2-point02-outline>.bodytext>.title {font-size:2.2rem;}
	.step2-point02-outline>.image img {position: static; transform:scale(1.2);}

	.step2-point02-aging {padding:32px; margin:0;}
	.step2-point02-aging>.bodytext .-sp-blue {color:var(--text-color-blue);}
	.step2-point02-aging>.figures {grid-template-columns:1fr;}
}

.step2-point02-supernatant>.outline {position:relative; z-index:0; margin:56px 0; padding:64px 72px; box-shadow:0 0 20px rgba(0,0,0,.2);}
.step2-point02-supernatant>.outline>.title {margin:0 0 .75em; font-size:4.4rem;}
.step2-point02-supernatant>.outline>.title>.-blue {color:var(--text-color-blue);}
.step2-point02-supernatant>.outline>.bodytext {text-align:left; line-height:1.75;}
.step2-point02-supernatant>.outline>.background {position:absolute; top:0; right:0; bottom:0; left:0; z-index:-1;}
.step2-point02-supernatant>.outline>.background img {width:100%; height:100%; object-fit:cover;}
.step2-point02-supernatant>.flow>.conclude {margin:2em 0; line-height:1.5; font-size:3rem; word-break:keep-all;}
.step2-point02-supernatant>.flow>.conclude>.-blue {color:var(--text-color-blue);}
.step2-point02-supernatant>.flow>.conclude>.-large {font-size:1.2em;}
@media screen and (max-width:800px) {
	.step2-point02-supernatant>.outline>.title {font-size:2.0rem;}
	.step2-point02-supernatant>.outline {margin:40px 0 40px calc(50% - 50vw); width:100vw; padding:40px var(--content-padding);}
	.step2-point02-supernatant>.flow>.conclude {font-size:1.4rem; text-align:left;}
}

.supernatant-flow {display:grid; align-items:center; gap:40px; grid-template-columns:1fr 1fr 1fr;}
.supernatant-flow>.item {display:block;}
.supernatant-flow>.item>.title {margin:0 0 1em; padding:.5em 1em; font-size:2.4rem; font-weight:bold; color:var(--text-color-blue); background:var(--color-sky);}
.supernatant-flow>.item>.description {height:8em; text-align:left; line-height:1.5;}
.supernatant-flow>.item>.image {position: relative;}
.supernatant-flow>.item>.image:before {content:""; display: block; padding-top:80%;}
.supernatant-flow>.item>.image:after {content:""; position:absolute; top:64%; right:-20px; transform:translate(50%,-50%); width:40px; height:32px; background:url("images/flow-arrow-right.png") center/contain no-repeat;}
.supernatant-flow>.item:last-of-type>.image:after {display: none;}
.supernatant-flow>.item>.image>img {position: absolute; top: 0; left: 0; width:100%; height:100%; object-fit:contain; object-position:50% 100%;}
.supernatant-flow>.arrow {display:block; width:40px; height:32px; background:url("images/flow-arrow-right.png") center/contain no-repeat;}
.supernatant-flow>.arrow {display: none;}
@media screen and (max-width:800px) {
	.supernatant-flow {justify-content:center; gap:24px; grid-template-columns:1fr; font-size:1.4rem; grid-auto-flow:row;}
	.supernatant-flow>.item {display:grid; gap:16px; grid-auto-flow:row;}
	.supernatant-flow>.item>.image {margin:0 auto; max-width:400px;}
	.supernatant-flow>.item>.image:before {display: none;}
	.supernatant-flow>.item>.image:after {display: none;}
	.supernatant-flow>.item>.image>img {position: static;}
	.supernatant-flow>.item>.description {height:auto;}
	.supernatant-flow>.arrow {display: block; margin:0 auto; width:32px; height:40px; background-image:url("images/flow-arrow-bottom.png");}
	.supernatant-flow>.item>.title {font-size:1.6rem;}
}

.step2-point02-reasons {padding:64px 72px; background:var(--color-white); box-shadow:0 0 20px rgba(0,0,0,.2);}
.step2-point02-reasons>.title {margin:0 0 1em; text-align:center; font-size:4.4rem;}
.step2-point02-reasons>.title img {height:4.4rem; width:auto; margin:0 auto;}
.step2-point02-reasons>.title>.-blue {color:var(--text-color-blue);}
.step2-point02-reasons .reasonitem {position:relative; padding:0 0 0 132px; text-align:left;}
.step2-point02-reasons .reasonitem>.number {position:absolute; top:0; left:0; z-index:0; display:flex; width:100px; height:100px; flex-shrink:0; justify-content:center; align-items:center; text-align:center; font-size:4.0rem; font-weight:bold; color:var(--text-color-white); filter:drop-shadow(0 0 10px rgba(0,0,0,.25));}
.step2-point02-reasons .reasonitem>.number:before {content:""; position:absolute; top:50%; right:0; left:0; z-index:-1; background:linear-gradient(180deg,#5997d8,#0058b2); clip-path:var(--polygon-hexagon-b); transform:translate(0,-50%); padding-top:115.5%; -webkit-clip-path:var(--polygon-hexagon-b);}
.step2-point02-reasons .reasonitem>.textcontent {flex-basis:calc(100% - 128px);}
.step2-point02-reasons .reasonitem .copy {margin:0 0 .5em; line-height:1.75; font-size:1.25em; color:var(--text-color-blue); }
.step2-point02-reasons .reasonitem .bodytext {line-height:2;}
.step2-point02-reasons .reasonitem .bodytext .-blue {color:var(--text-color-blue);}
.step2-point02-reasons .reasonitem .bodytext .-large {font-size:1.4em;}
.step2-point02-reasons .reasonitem .figures {display:grid; margin:24px 0 0; column-gap:32px; grid-template-columns:var(--grid-template-columns,auto auto); grid-template-rows:auto auto; grid-auto-flow:column; row-gap:16px;}
.step2-point02-reasons .reasonitem .figures>.figure {display:contents;}
.step2-point02-reasons .reasonitem .figures .image {background:#F5F9FD;}
.step2-point02-reasons .reasonitem .figures .image>img {height:100%; object-fit:contain;}
.step2-point02-reasons .reasonitem .figureinfo {margin:1em 0 0 auto; max-width:240px;}
@media screen and (max-width:800px) {
	.step2-point02-reasons {display:contents;}
	.step2-point02-reasons>.content {background:var(--color-white); padding:22px; box-shadow:0 0 20px rgba(0,0,0,.2);}
	.step2-point02-reasons>.title {font-size:2.6rem; margin-top:64px;}
	.step2-point02-reasons>.title img {height:2.6rem;}
	.step2-point02-reasons .reasonitem {position:relative; padding:0;}
	.step2-point02-reasons .reasonitem>.number {top:0; left:-32px; width:48px; height:48px; font-size:2.8rem;}
	.step2-point02-reasons .reasonitem .title {padding-left:28px;}
	.step2-point02-reasons .reasonitem .image {margin-top:24px;}
	.step2-point02-reasons .reasonitem .figures {grid-template-columns:1fr;}
	.step2-point02-reasons .reasonitem .figures>.figure {display:block;}
	.step2-point02-reasons .reasonitem .figures img {height:auto;}
	.step2-point02-reasons .reasonitem .figures img {margin-bottom:16px;}
	.step2-point02-reasons .reasonitem .figureinfo {margin:0;}
}

.step2-conclusion>.conclusion {position:relative; text-align:left;}
.step2-conclusion>.conclusion+.conclusion {margin-top:64px;}
.step2-conclusion>.conclusion>.title {margin:0 0 .5em; width:70%; font-size:4.0rem; color:var(--text-color-blue);}
.step2-conclusion>.conclusion>.bodytext {width:65%; line-height:2;}
.step2-conclusion>.conclusion>.image {position:absolute; top:50%; right:0; width:30%; transform:translate(0,-50%);}
.step2-conclusion>.conclusion-02>.title {width:60%;}
.step2-conclusion>.conclusion-02>.bodytext {width:60%;}
.step2-conclusion>.conclusion-02>.image {right:10%;}
.step2-conclusion>.installation {display:flex; margin:80px auto; max-width:600px; justify-content:space-between; align-items:center;}
.step2-conclusion>.installation>.title {position:relative; z-index:0; flex-basis:240px; flex-shrink:0; text-align:center; font-size:3.2rem; text-shadow:var(--text-shadow); color:var(--text-color-white); filter:drop-shadow(0 0 10px rgba(0,0,0,.2));}
.step2-conclusion>.installation>.title:before {content:""; position:absolute; top:50%; right:0; left:0; z-index:-1; display:block; background:linear-gradient(180deg,#5997d8,#0058b2); clip-path:var(--polygon-hexagon-b); transform:translate(0,-50%); padding-top:115.5%; -webkit-clip-path:var(--polygon-hexagon-b);}
.step2-conclusion>.installation>.image {flex-basis:50%;}
@media screen and (max-width:800px) {
	.step2-conclusion>.conclusion>.title {width:100%; text-align:center; font-size:2.4rem;}
	.step2-conclusion>.conclusion>.image {position:static; margin:0 auto; width:60%; transform:none;}
	.step2-conclusion>.conclusion>.bodytext {width:100%;}
	.step2-conclusion>.installation {display:block; margin:40px auto;}
	.step2-conclusion>.installation>.title:before {display:none;}
	.step2-conclusion>.installation>.title {margin:0 0 .5em; font-size:2.8rem; text-shadow:none; color:var(--text-color-blue); filter:none;}
}

.step2-support>.titleimage {float:right; margin:-104px 0 0; width:calc(100px + 20%); filter:drop-shadow(0 0 20px rgba(0,0,0,.2));}
.step2-support>.title {text-align:left; line-height:1.5; font-size:min(calc(1.5rem + 1.5vw),3.6rem);}

.support-list {display:grid; clear:both; gap:12px; grid-template-columns:1fr 1fr;}
.support-list>.item {position:relative; padding:24px; background:var(--color-white); overflow:hidden;}
.support-list>.item:before {content:""; position:absolute; top:0; left:0; display:block; width:60px; height:60px; background:var(--color-blue); transform:translate(-50%,-50%) rotate(45deg);}
.support-list>.item>.title {margin:0 0 .25em; font-weight: bold; text-align:center; font-size:2.6rem; color:var(--text-color-blue);}
.support-list>.item>.title.-large {color:transparent; background:linear-gradient(#5997D8,#004081); -webkit-background-clip:text; background-clip:text; font-size:3.6rem;}
.support-list>.item>.description {display:flex; justify-content:center; text-align:left; line-height:1.75;}
.support-list>.item.-colspan-2 {grid-column:span 2;}
.support-list>.item>.images {display:grid; margin:40px auto; max-width:800px; gap:32px; grid-template-columns:1fr 1fr;}
.support-list>.item>.images img {box-shadow:0 0 20px rgba(0,0,0,.2);}
.support-list+.installation-detail-button {margin-top:80px;}
.support-list+.installation-detail-button {margin-top:64px;}
@media screen and (max-width:1000px){
	.support-list>.item>.title {font-size:2.2rem;}
}
@media screen and (max-width:800px) {
	.support-list>.item>.images {margin:16px 0 0; gap:16px;}
	.support-list>.item>.title {font-size:2rem;}
	.support-list>.item>.title.-large {font-size: 2.4rem;}
}

.step2-supportdetail {position:relative; z-index:0; padding:120px 72px 160px; filter:drop-shadow(0 10px 10px rgba(0,0,0,.1)); --poligon:polygon(0 0 ,100% 0,100% calc(100% - 80px),50% 100%,0 calc(100% - 80px));}
.step2-supportdetail>.background {position:absolute; top:0; right:0; bottom:0; left:0; z-index:-1; filter:drop-shadow(0 10px 10px rgba(0,0,0,.1));}
.step2-supportdetail:before,
.step2-supportdetail>.background:before {content:""; position:absolute; top:0; right:0; bottom:0; left:0; z-index:-1; display:block; clip-path:var(--poligon); -webkit-cli-path:var(--poligon);}
.step2-supportdetail:before {background:var(--color-white);}
.step2-supportdetail>.background:before {bottom:40px; background:linear-gradient(#f2faff,#fffced);}
.step2-supportdetail>.title {position:absolute; top:0; left:50%; width:100%; font-size:4.8rem; transform:translate(-50%,-32%);}
.step2-supportdetail>.subtitle {margin:0 0 1em; text-align:center; font-size:3.6rem;}
.step2-supportdetail .pointlist {display:grid; margin:0 auto; max-width:720px; gap:12px; grid-template-columns:1fr 1fr 1fr; filter:drop-shadow(0 0 10px rgba(0,0,0,.2));}
.step2-supportdetail .pointlist+.earningsimage {margin-top:-8%;}
.step2-supportdetail .benefitlist {display:grid; margin:40px 0 64px; gap:40px; grid-template-columns:1fr 1fr;}
.step2-supportdetail .benefitlist>.item {display:flex; align-items:center; justify-content: space-between;}
.step2-supportdetail .benefitlist>.item>.description {flex-basis:60%; word-break:keep-all; text-align:left; font-size:min(2vw,2.0rem); font-weight:bold;}
.step2-supportdetail .benefitlist>.item>.image {display: flex; justify-content: center; flex-direction: column; flex-basis:38%; filter:drop-shadow(0 0 6px rgba(0,0,0,.2));}
.step2-supportdetail .benefitlist>.item>.image>img {clip-path:var(--polygon-hexagon-b); -webkit-clip-path:var(--polygon-hexagon-b);}
.step2-supportdetail>.conclude {text-align:center; font-size:min(calc(1.5rem + 1.5vw),3.6rem);}
.step2-supportdetail>.conclude>.maintext {position: relative; display: block; width:fit-content; margin:0 auto; z-index:0;}
.step2-supportdetail>.conclude>.maintext:before {content:""; width:calc(100% + 4em); height:calc(100% + 4em); position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:radial-gradient(#fff 25%,rgba(255,255,255,0)); z-index:-1;}
.step2-supportdetail>.conclude>.-large {display:inline-block; margin:0 0 0; font-size:2em; font-weight:bold;}
@media screen and (max-width:1000px) {
	.step2-supportdetail {padding:120px 56px 160px;}
}
@media screen and (max-width:800px) {
	.step2-support>.titlesp {margin-top:-80px;}
	.support-list {grid-template-columns:1fr; grid-auto-flow:row;}
	.support-list>.item.-colspan-2 {grid-column:span 1;}
	.step2-supportdetail {padding:80px 22px 148px;}
	.step2-supportdetail>.title {font-size:2.2rem;}
	.step2-supportdetail>.subtitle {font-size: 2.2rem;}
	.step2-supportdetail .eaningssp {transform:scale(1.35); padding:17.5% 0 12.5%;}
	.step2-supportdetail .benefitlist {grid-template-columns:1fr; gap:0;}
	.step2-supportdetail .benefitlist>.item {align-items:stretch;}
	.step2-supportdetail .benefitlist>.item>.image {flex-basis:40%; transform:translate(-5%,0) scale(1.125); max-width:180px;}
	.step2-supportdetail .benefitlist>.item:nth-child(2n)>.image {transform:translate(25%,0) scale(1.125);}
	.step2-supportdetail .benefitlist>.item>.description {display: flex; flex-direction:column; justify-content: center; font-size: 1.6rem; border-bottom:1px solid #E6E6E6; padding:2.5em 1.5em 2.5em 0; line-height:1.75;}
	.step2-supportdetail .benefitlist>.item:last-of-type>.description {border:none;}
	.step2-supportdetail>.conclude {font-size: 2.2rem;}
}

#top-contact-entry-b-02 {margin-top:-200px;}
@media screen and (max-width:800px) {
	#top-contact-entry-b-02 {margin-top:-100px;}
}

.staff-message {position:relative; display:grid; margin:0 auto; max-width:var(--content-width-med); padding:64px 40px 40px; column-gap:40px; justify-content:center; align-items:center; align-items:center; grid-template-columns:35% auto; grid-template-rows:auto auto; background:var(--color-white); box-shadow:0 0 20px rgba(0,0,0,.1); row-gap:24px;}
.staff-message>.title {position:absolute; top:0; left:50%; width:100%; font-size:4rem; transform:translate(-50%,-50%);}
.staff-message>.image {position:relative; z-index:0; flex-basis:35%; grid-row:span 2;}
.staff-message>.image:before {content:""; position:absolute; top:0; right:0; bottom:0; left:0; z-index:-1; display:block; background:var(--color-sky); transform:translate(5%,5%);}
.staff-message>.info {text-align:left;}
.staff-message .post {margin:0 0 .25em; font-size:2.4rem;}
.staff-message .post>.position {display:inline-block; font-size:1.8rem; white-space:nowrap;}
.staff-message .name {font-size:5.4rem;}
.staff-message .message {text-align:left; line-height:2;}
@media screen and (max-width:800px) {
	.staff-message {padding:40px 22px 22px; gap:20px; grid-template-columns:1fr 1fr;}
	.staff-message>.title {font-size:2.8rem;}
	.staff-message>.image {grid-row:span 1;}
	.staff-message .post {font-size:1.4rem;}
	.staff-message .post>.position {margin-left:0; font-size:1.4rem;}
	.staff-message .message {grid-column:span 2;}
	.staff-message .name {font-size:2.4rem;}
}

.top-points-title {position:relative; z-index:0; margin:0 0 80px; padding:64px 0 80px;}
.top-points-title>.background {position:absolute; top:0; right:0; bottom:0; left:0; z-index:-1;}
.top-points-title>.background>img {width:100%; height:100%; object-fit:cover;}
.top-points-title>.inner {display:flex; margin:0 auto;  max-width:var(--content-width-med); justify-content:space-between; align-items:center;}
.top-points-title>.inner>.title {margin:0 1em 0 0; font-size:6.8rem; text-shadow:var(--text-glow); color:var(--text-color-darknavy);}
.top-points-title>.inner>.description {flex-basis:100%; text-align:left; font-size:3.8rem; text-shadow:var(--text-glow);}
.top-points-title+.points-list {margin-top:-120px;}

.points-list {position:relative; z-index:2; display:grid; margin:0 auto; max-width:var(--content-width-med); gap:24px; grid-template-columns:1fr;}
.points-list>.item {display:flex; justify-content:space-between; box-shadow:0 0 10px rgba(0,0,0,.2);}
.points-list>.item>.title {position:relative; z-index:0; display:flex; flex-basis:30%; padding:1em; flex-direction:column; justify-content:center; text-align:left; font-size:3.0rem; color:var(--text-color-white); word-break:keep-all;}
.points-list>.item>.title:before {content:""; position:absolute; top:0; right:-1em; bottom:0; left:0; z-index:-1; background:var(--color-navy); clip-path:var(--polygon); --polygon:polygon(0 0,90% 0,100% 50%,90% 100%,0 100%); -webkit-clip-path:var(--polygon);}
.points-list>.item>.description {display:flex; flex-basis:70%; padding:1.5em 1.5em 1.5em 2em; flex-direction:column; justify-content:center; align-items:center; text-align:left; line-height:1.75; font-size:2.6rem; background:linear-gradient(#ffffff,#ebe2c4);}
.points-list>.item>.description>.-small {font-size:.875em;}
.points-list>.item>.description>.-medium {line-height:1.5; font-size:1.125em;}
.points-list>.item>.description>.-large {line-height:1.5; font-size:1.5em;}
.points-list>.item>.description>.-huge {line-height:1.25; font-size:1.75em;}
.points-list>.item>.description>.-brown {color:var(--text-color-darkbrown);}
.points-list>.item>.description>.-center {text-align:center;}
.points-list+.contact-button {margin-top:64px;}
@media screen and (max-width:800px) {
	.top-points-title {margin-bottom:16px; padding:48px 0;}
	.top-points-title>.inner>.title {font-size:3.2rem;}
	.top-points-title>.inner>.description {font-size:1.6rem;}
	.top-points-title+.points-list {margin-top:0;}
	.points-list {gap:16px;}
	.points-list>.item>.title {font-size:1.4rem; flex-basis: 32.5%;}
	.points-list>.item>.description {font-size:1.2rem; text-align: center;}
}

.product-price {position:relative; margin:-7.5% auto -2.5%; max-width:var(--content-width-med); z-index:2;}

.product-info {position:relative; z-index:0; margin:0 auto; max-width:var(--content-width-min); padding:56px 72px; background:url("images/product-info-bg.png") center no-repeat,#ffffff; background-size:cover; box-shadow:0 0 20px rgba(0,0,0,.2);}
.product-info::before {content:""; position:absolute; top:0; right:0; bottom:0; left:0; z-index:-1; display:block; background:linear-gradient(#fffef5,#ebe2c4); opacity:.9;}
.product-info>.title {margin:0 0 1em; font-size:3.2rem;}

.productinfo-table {display:grid; gap:12px; grid-template-columns:repeat(4,auto); text-align:left;}
.productinfo-table tbody,
.productinfo-table tr {display:contents;}
.productinfo-table th {width:auto; padding:.5em .5em; white-space:nowrap; font-size:1.8rem; color:var(--text-color-white); background:linear-gradient(270deg,#deb969,#79582b);}
.productinfo-table td {display:flex; flex-direction:column; justify-content:center; font-size:2.0rem;}
.productinfo-table [colspan="2"] {grid-column:span 2;}
.productinfo-table [colspan="3"] {grid-column:span 3;}
@media screen and (max-width:800px) {
	.product-price {width:100vw; max-width:none; margin:-7.5% 0 24px calc(50% - 50vw);}
	.product-info {padding:32px;}
	.productinfo-table {grid-template-columns:6em auto;}
	.productinfo-table [colspan="2"] {grid-column:span 1;}
	.productinfo-table [colspan="3"] {grid-column:span 1;}
	.product-info>.title {font-size:2.4rem;}
	.productinfo-table th {text-align:center; font-size:1.4rem;}
	.productinfo-table td {font-size:1.4rem;}
}

#top-safety {background:rgba(225,234,244,.7);}
.product-safety {margin:0 auto; max-width:var(--content-width-med);}
.product-safety>.images {display:flex; margin:0 auto 32px; max-width:var(--content-width-min); justify-content:space-between;}
.product-safety>.images>.image {box-shadow:0 0 30px rgba(10,100,153,.4);}
.product-safety>.images>.image+.image {margin-left:32px;}
.product-safety>.images img {width:auto;}
.product-safety>.descritpion {text-align:left; line-height:1.75;}
@media screen and (max-width:800px) {
	.product-safety>.images>.image+.image {margin-left:16px;}
}

.installation-flow {display:grid; margin:0 auto; max-width:var(--content-width-min); gap:16px; grid-template-columns:1fr; grid-template-rows:repeat(var(--grid-repeat),1fr); grid-auto-flow:row;}
.installation-flow>.item {display:flex; flex-basis:10em; justify-content:space-between;}
.installation-flow>.item>.title {position:relative; display:flex; margin-right:16px; flex-basis:12em; padding:1em; flex-direction:column; justify-content:center; font-size:2.2rem; text-shadow:var(--text-shadow); color:var(--text-color-white); background:linear-gradient(270deg,#deb969,#79582b);}
.installation-flow>.item>.title:before {content:""; position:absolute; bottom:0; left:50%; display:block; width:25%; height:12px; background:linear-gradient(0deg,#deb969,#79582b); clip-path:var(--polygon); transform:translate(-50%,100%); --polygon:polygon(0 0,100% 0,50% 100%); -webkit-clip-path:var(--polygon);}
.installation-flow>.item:last-of-type>.title:before {display:none;}
.installation-flow>.item>.description {display:flex; flex-basis:100%; padding:1em; flex-direction:column; justify-content:center; line-height:1.5; font-size:1.8rem; background:#faf8f0; box-shadow:0 0 10px rgba(0,0,0,.2);}
.installation-flow>.item>.image {position: relative;}

.installation-note {margin:0 auto; max-width:var(--content-width-med); text-align:center; line-height:1.75; font-size:2.8rem; color:var(--text-color-brown);}
.installation-flow+.installation-note {margin-top:1em;}
@media screen and (max-width:800px) {
	.installation-flow>.item>.title {font-size:1.6rem; margin-right:12px; padding:0.5em;}
	.installation-flow>.item>.description {font-size:1.4rem;}
	.installation-note {font-size:1.6rem;}
}


#post-thanks,
#post-confirm {padding-top:104px;}

.contact-form {position: relative; padding:64px; background:var(--color-sky); max-width:var(--content-width-med); margin:0 auto;}
.contact-form:before {content:""; display: block; position: absolute; top: -7.5vw; right:-7.5vw; width:320px; height: 320px; background:url("images/contact-decoration.png") center no-repeat; background-size:contain;}
.contact-form>.note {font-size: 1.4rem; text-align: left; margin:0 0 2em; color:var(--text-color-darknavy);}

.contact-confirm {padding:64px; background:var(--color-sky); max-width:var(--content-width-med); margin:0 auto;}
.contact-confirm .more-button {width:100%; max-width:380px;}

.form-table {text-align:left; font-size:1.8rem; color:var(--text-color-darknavy);}
.form-table input {border:none; background:var(--color-white); padding:0.75em; width:100%; border-radius:0;}
.form-table textarea {width:100%; resize:vertical; height:200px; padding:1em;}
.form-table th {padding:0.75em 0; width:320px; font-size:2.6rem; color:var(--text-color-darknavy);}
.form-table td {padding:0.5em 0; vertical-align:middle;}
.form-table th .required {font-size: 0.625em; vertical-align:top;}
.form-table td input {margin-bottom:0;}
.form-table .subfield th {font-size:2.0rem; padding-left:4em; vertical-align:middle;}
.form-table.-confirm th {padding:0.5em 0;}
.form-table.-confirm td {border-bottom:2px solid #909FB0; padding:1em 0 0.75em; font-size: 2.4rem;}
.form-table.-confirm tr:last-of-type td {border-bottom:none;}

.contact-selector {display: grid; grid-auto-flow:row; gap:1em;}
.contact-selector input[type="radio"] {display: none;}
.contact-selector label {position: relative; padding-left:2em;}
.contact-selector input[type="radio"] + .label:before {position: absolute; content: ''; display: block; width: 1.375em; height: 1.375em; border-radius: 50%; background:var(--color-white); border: 4px solid var(--color-white); box-shadow:0 0 0 1px var(--color-navy); left: 0; top: 0;}
.contact-selector input[type="radio"]:checked + .label:before {background-color:var(--color-navy);}

.contact-agree {display:inline-block; margin:1.5em 0; font-size: 2.4rem; color:var(--text-color-darknavy);}
.contact-agree input[type="checkbox"] {display: none;}
.contact-agree {position: relative; padding-left:1.75em;}
.contact-agree input[type="checkbox"] + .label:before {position: absolute; content: ''; display: block; width: 1.25em; height: 1.25em; border-radius: 50%; background:var(--color-white); border: 4px solid var(--color-white); box-shadow:0 0 0 1px var(--color-navy); left: 0; top: 0;}
.contact-agree input[type="checkbox"]:checked + .label:before {background-color:var(--color-navy);}

.submit-button[class] {display:block; margin:0 auto; width:fit-content; padding:.5em 2em; text-align:center; font-size:3.2rem; text-shadow:var(--text-shadow); color:var(--text-color-white); background:linear-gradient(180deg,#5997d8,#0058b2); transition:opacity 0.5s; cursor:pointer;}
.submit-button[class]:hover {opacity:0.5;}
.submit-button.-back {background:linear-gradient(0deg,#013972,#3677B9);}

.confirm-buttons {margin:40px 0 0; display: grid; grid-template-columns:1fr 1fr; gap:16px;}
.confirm-buttons>.submit-button {width:100%;}

.privacy-container {height:320px; overflow-y:auto; padding:3em; background:var(--color-white);}
.privacy-container p {margin-bottom:1em;}

.contact-thanks {padding:64px; background:var(--color-sky); max-width:var(--content-width-med); margin:0 auto;}

.thanks-message {font-size: 2.4rem; text-align: center; margin:0 0 2em; line-height:1.75;}

@media screen and (max-width:800px){
	.contact-form {max-width:none; width:100%; padding:40px var(--content-padding); font-size: 1.4rem;}
	.contact-form:before {display:none;}
	.contact-form .submit-button {width:100%;}

	.contact-confirm {max-width:none; padding:40px var(--content-padding);}

	.contact-selector {margin-top:1em;}

	.form-table tbody,
	.form-table tr,
	.form-table th,
	.form-table td {display:block;}
	.form-table th,
	.form-table td {padding:0; margin:0 0 2em;}
	.form-table tr:last-of-type td {margin-bottom:0;}
	.form-table th {margin-bottom:0.5em; font-size: 2.2rem; width:fit-content;}
	.form-table th[colspan="2"] {margin-bottom:1em;}
	.form-table th .required {float:right;}
	.form-table .subfield th {text-align: left; padding:0; font-size: 1.4rem;}
	.form-table .subfield td {margin-bottom:1em;}
	
	.form-table.-confirm th {padding:0; font-size: 1.8rem;}
	.form-table.-confirm td {padding:0 0 0.75em; font-size: 1.6rem;}

	.submit-button[class] {font-size: 2.4rem; padding:1em 2em;}

	.privacy-container {padding:2em;}

	.thanks-message {font-size: 1.8rem;}
}

.footer-info {display:flex; margin:0 auto; max-width:var(--content-width-med); padding:40px 0; justify-content:space-between; justify-content:space-between; align-items:center; text-align:left; border-top:3px solid var(--color-blue);}
.footer-info>.footer-contact {margin:0 5% 0 0; flex-basis:55%; flex-shrink:0;}
.footer-info>.footer-company {flex-basis:100%; flex-shrink:1;}

.footer-contact>.title {margin:0 0 .25em; text-align:left; font-size:min(calc(1.4rem + 1.5vw),3.2rem)}
.footer-contact>.title>img {height:1.75em; width:auto;}

.footer-company {text-align:left;}
.footer-company>.title {margin:0 0 .25em; font-size:min(calc(1.4rem + 1.5vw),3.2rem);}
.footer-company>.title>img {height:1.75em; width:auto;}
.footer-company>.more-button[class] {margin:0 auto; width:100%; max-width:400px;}
@media screen and (max-width:800px) {
	.footer-info {display:block;}
	.footer-info>.footer-contact-sp {margin-bottom:32px;}
	.footer-info .footer-contact {margin:0 0 40px;}
	.footer-info.-top {padding-bottom:25%;}
	.footer-company>.title {font-size:2.4rem;}
	.footer-company {text-align:center;}
}

.horizontal-rule {margin:3em 0; border-color:#b8cdea;}

.flex-container {display:flex; justify-content:space-between; align-items:stretch;}
.flex-container>.-fb-40 {flex-basis:40%;}
.flex-container>.-fb-45 {flex-basis:45%;}
.flex-container>.-fb-50 {flex-basis:50%;}
.flex-container>.-fb-55 {flex-basis:55%;}
.flex-container>.-fb-60 {flex-basis:60%;}
@media screen and (max-width:800px) {
	.flex-container {display:block;}
}

@font-face {
	font-family:"NotoSerifJP";
	font-style:normal;
	font-weight:400;
	font-display:swap;
	src:url('fonts/NotoSerifJP-SemiBold.woff') format('woff');
}
@font-face {
	font-family:"NotoSerifJP";
	font-style:bold;
	font-weight:500;
	font-display:swap;
	src:url('fonts/NotoSerifJP-Bold.woff') format('woff');
}


/* end */
/***********/