/* --------------------------------------------------------------------------------
reset
-------------------------------------------------------------------------------- */

*,
*::before,
*::after {
	box-sizing: border-box;
	font: inherit;
	border: none;
	margin: 0px;
	padding: 0px;
}
html {
	-webkit-text-size-adjust: none;
	-webkit-tap-highlight-color: transparent;
}
a {
	text-decoration: none;
	color: inherit;
}
ul,
ol {
	list-style: none;
}
table {
	border-collapse: collapse;
}
iframe,
img,
svg,
video {
	display: block;
}
img {
	max-width: 100%;
	height: auto;
}



/* --------------------------------------------------------------------------------
essential
-------------------------------------------------------------------------------- */

html {
	font-size: 16px;
}
body {
	text-align: justify;
	overflow-wrap: break-word;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 1rem;
	font-weight: 400;
	font-feature-settings: "palt";
	line-height: 1.75rem;
	color: #1a1a1a;
	letter-spacing: 0.025em;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}
a.underline {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.1em;
}
a.color {
	transition: 0.25s color ease;
}
a.color:hover {
	color: #4d85c7;
}
h1 {
	font-size: 1.5rem;
}
h2 {
	font-size: 1.375rem;
}
h3 {
	font-size: 1.25rem;
}
h4,
h5,
h6 {
	font-size: 1rem;
}
p.note {
	font-size: 0.875rem;
	line-height: 1.5rem;
}
p.indent {
	text-indent: -1em;
	padding-left: 1em;
}
p:empty:before {
	content: none;
}
span.required {
	color: #4d85c7;
}



/* --------------------------------------------------------------------------------
form
-------------------------------------------------------------------------------- */

input:where([type=text], [type=email], [type=number], [type=password], [type=search], [type=button], [type=submit]),
button,
textarea,
select {
	max-width: 100%;
	font-family: "Noto Sans JP", sans-serif;
	font-size: 1rem;
	outline: none;
	appearance: none;
}
input:where([type=text], [type=email], [type=number], [type=password], [type=search]),
textarea,
select {
	vertical-align: top;
	color: #1a1a1a;
	border: none;
	background-color: #f0f4f9;
	border-radius: 5px;
}
input:where([type=text], [type=email], [type=number], [type=password], [type=search]),
select {
	height: 50px;
	padding: 0px 15px;
}
input:where([type=button], [type=submit]),
button {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	width: 300px;
	height: 50px;
	text-align: center;
	font-weight: 500;
	color: #ffffff;
	border: none;
	cursor: pointer;
	background-color: #4d85c7;
	border-radius: 10px;
}
input:where([type=button], [type=submit]) {
	transition: 0.25s background-color ease;
}
input:where([type=button], [type=submit]):hover {
	background-color: #404040;
}
button {
	position: relative;
	overflow: hidden;
}
button::before {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	background: linear-gradient(115deg, #4561d8 -25%, #57b2b2);
	content: "";
	opacity: 0;
	transition: 0.25s opacity ease;
}
button:hover::before {
	opacity: 1;
}
button > * {
	position: relative;
}
input:where([type=radio], [type=checkbox]),
input:where([type=radio], [type=checkbox])::before,
label.alternate input:where([type=radio], [type=checkbox]) + span {
	width: 25px;
	height: 25px;
}
input:where([type=radio], [type=checkbox]),
label.alternate {
	margin-right: 5px;
}
input:where([type=radio], [type=checkbox]) {
	position: relative;
	vertical-align: middle;
	transform: translateX(-9999px);
}
input:where([type=radio], [type=checkbox])::before,
input:where([type=radio], [type=checkbox])::after,
label.alternate {
	cursor: pointer;
}
input:where([type=radio], [type=checkbox])::before,
input:where([type=radio], [type=checkbox])::after,
label.alternate input:where([type=radio], [type=checkbox]) + span::before {
	position: absolute;
	content: "";
}
input:where([type=radio], [type=checkbox])::before,
input:where([type=radio], [type=checkbox])::after {
	transform: translate(9999px, -1px);
}
input:where([type=radio], [type=checkbox])::before,
label.alternate input:where([type=radio], [type=checkbox]) + span {
	border: 1px solid #999999;
}
input:where([type=radio], [type=checkbox])::after,
label.alternate input:where([type=radio], [type=checkbox]) + span::before {
	opacity: 0;
	transition: 0.25s opacity ease;
}
input:where([type=radio], [type=checkbox]):checked::after,
label.alternate input:where([type=radio], [type=checkbox]):checked + span::before {
	opacity: 1;
}
input[type=radio]::before,
input[type=radio]::after,
label.alternate input[type=radio] + span,
label.alternate input[type=radio] + span::before {
	border-radius: 50%;
}
input[type=radio]::after,
label.alternate input[type=radio] + span::before {
	width: 12px;
	height: 12px;
	left: calc(50% - calc(12px * 0.5));
	top: calc(50% - calc(12px * 0.5));
	background-color: #4d85c7;
}
input[type=checkbox]::before,
label.alternate input[type=checkbox] + span {
	border-radius: 5px;
}
input[type=checkbox]::after,
label.alternate input[type=checkbox] + span::before {
	width: 10px;
	height: 15px;
	left: calc(calc(50% - calc(10px * 0.5)) + 1px);
	top: calc(50% - calc(15px * 0.5));
	border-right: 2px solid #4d85c7;
	border-bottom: 2px solid #4d85c7;
}
input[type=checkbox]::after {
	transform: translate(calc(9999px - 1px), -3px) rotate(45deg);
}
@-moz-document url-prefix() {
	input[type=radio],
	input[type=checkbox] {
		transform: translate(0px, -1px);
	}
}
label {
	display: inline-block;
	vertical-align: text-top;
}
label.alternate input:where([type=radio], [type=checkbox]) {
	display: none;
}
label.alternate input:where([type=radio], [type=checkbox]) + span {
	display: block;
	position: relative;
	cursor: pointer;
}
label.alternate input[type=checkbox] + span::before {
	transform: translate(-1px, -3px) rotate(45deg);
}
textarea {
	padding: 10px 15px;
}
select {
	padding-right: 40px;
	background-image: url(../images/arrow-select.svg);
	background-repeat: no-repeat;
	background-position: right 15px center;
	background-size: auto 10px;
}
::placeholder {
	color: #999999;
}
form#searchform label.screen-reader-text {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(1px, 1px, 1px, 1px);
}



/* --------------------------------------------------------------------------------
icon
-------------------------------------------------------------------------------- */

@font-face {
	font-family: "icon";
	src: url("../fonts/icon.woff") format("woff");
	font-weight: normal;
	font-style: normal;
}
i.icon {
	font-family: "icon";
	line-height: 1em;
}
i.icon-arrow:before {
	content: "\e900";
}
i.icon-list:before {
	content: "\e901";
}
i.icon-download:before {
	content: "\e902";
}
i.icon-tel:before {
	content: "\e903";
}
i.icon-mail:before {
	content: "\e904";
}
i.icon-instagram:before {
	content: "\e905";
}
i.icon-youtube:before {
	content: "\e906";
}
i.icon-list-alternate:before {
	content: "\e907";
}
i.icon-quotation:before {
	content: "\e908";
}



/* --------------------------------------------------------------------------------
misc
-------------------------------------------------------------------------------- */

br.small {
	display: none;
}
br.large {
	display: inline;
}
img.small {
	display: none;
}
img.large {
	display: block;
}
hr {
	height: 0px;
	border: none;
	border-bottom: 1px solid #999999;
	margin: 20px 0px;
}
iframe:where([src*="youtube.com"], .wp-embedded-content),
video {
	width: 100%;
}
iframe[src*="youtube.com"],
video {
	aspect-ratio: 16 / 9;
	height: auto;
}
mark {
	margin: 0px 5px;
	padding: 0px 5px;
	background-color: #f2f2f2;
	border-radius: 5px;
}
span.no-large {
	display: none;
}
*.margin-bottom {
	margin-bottom: 40px;
}
*.margin-bottom-wide {
	margin-bottom: 80px;
}
*.margin-bottom-narrow {
	margin-bottom: 20px;
}



/* --------------------------------------------------------------------------------
page
-------------------------------------------------------------------------------- */

div#page {
	position: relative;
	overflow: hidden;
}
body:not(.home):not(:has(div#title p.image)) div#page {
	padding-top: 120px;
}
div#trigger {
	position: absolute;
	top: 50svh;
	pointer-events: none;
}
div.sns ul li a {
	transition: 0.25s opacity ease;
}
div.sns ul li a:hover {
	opacity: 0.625;
}
span.arrow {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 50px;
	height: 50px;
	overflow: hidden;
	font-family: "icon";
	font-size: 0.625rem;
	font-weight: 400;
	line-height: 1em;
	color: #4d85c7;
	background-color: #ffffff;
	border-radius: 50%;
	transition: 0.25s color ease-in-out;
}
a:hover span.arrow,
*.anchor-alternate:hover span.arrow {
	color: #ffffff;
}
span.arrow::before {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	content: "";
	opacity: 0;
	background-color: #404040;
	border-radius: 50%;
	transform: scale(0);
	transition: 0.25s opacity ease, 0.25s transform ease;
}
a:hover span.arrow::before,
*.anchor-alternate:hover span.arrow::before {
	opacity: 1;
	transform: scale(1.025);
}
span.arrow::after {
	position: relative;
	content: "\e900";
}
p.button-default,
p.button-default > * {
	display: flex;
	flex-wrap: wrap;
}
p.button-default {
	font-weight: 500;
	line-height: 1.5rem;
}
p.button-default > *,
p.button-default > * > * {
	position: relative;
}
p.button-default > * {
	align-items: center;
	width: 300px;
	height: 50px;
	overflow: hidden;
	color: #ffffff;
	padding: 0px 25px;
	background-color: #4d85c7;
	border-radius: 10px;
}
p.button-default > *::before {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	background: linear-gradient(115deg, #4561d8 -25%, #57b2b2);
	content: "";
	opacity: 0;
	transition: 0.25s opacity ease;
}
p.button-default > *:hover::before {
	opacity: 1;
}
p.button-default span.text {
	display: block;
}
p.button-default span.arrow {
	position: absolute;
	width: 25px;
	height: 25px;
	right: 12.5px;
	top: calc(50% - 12.5px);
	font-size: 0.5rem;
	background-color: #ffffff;
}
p.button-more > * {
	width: 160px;
	border-radius: 25px;
}
p.button-catalog {
	justify-content: center;
	margin-top: 120px;
}
p.button-catalog {
	font-size: 1.125rem;
}
p.button-catalog > * {
	width: 480px;
	height: 100px;
}
p.button-catalog span.arrow {
	width: 50px;
	height: 50px;
	right: 20px;
	top: calc(50% - 25px);
	font-size: 0.625rem;
}
nav#navi-side {
	position: fixed;
	z-index: 10;
	right: 0px;
	bottom: 90px;
}
nav#navi-side p.button-default {
	text-align: left;
	font-size: 0.875rem;
	line-height: 1.25rem;
}
nav#navi-side p.button-default:not(:last-child) {
	margin-bottom: 10px;
}
nav#navi-side p.button-default a {
	width: 160px;
	height: 60px;
	padding-left: 15px;
	border-radius: 10px 0px 0px 10px;
	transition: 0.25s transform ease;
}
nav#navi-side p.button-default a:hover {
	transform: translateX(5px);
}
nav#navi-side p.button-default span.arrow {
	right: 10px;
}
p:where(.diagram, .illust, .image),
div:where(.diagram, .illust, .image) p.row {
	overflow: hidden;
}
p:where(.diagram, .illust, .image) img,
div:where(.diagram, .illust, .image) p.row img {
	width: 100%;
}
p.image-zoom img {
	transition: 0.375s transform ease;
}
a:hover p.image-zoom img,
p.image-zoom a:hover img {
	transform: scale(1.0375);
}
*.scroll:where(.fade, .fade-slide, .fade-zoom, .fade-bounce),
*.scroll:where(.fade-each, .fade-each-slide, .fade-each-zoom, .fade-each-bounce) > * {
	opacity: 0;
	transition-duration: 1.25s;
}
*.scroll:where(.fade, .fade-slide, .fade-zoom, .fade-bounce).active,
*.scroll:where(.fade-each, .fade-each-slide, .fade-each-zoom, .fade-each-bounce).active > * {
	opacity: 1;
}
*.scroll.fade,
*.scroll.fade-each > * {
	transition-property: opacity;
	transition-timing-function: ease-in-out;
}
*.scroll.fade-slide,
*.scroll.fade-each-slide > * {
	transition-property: opacity, transform;
	transition-timing-function: ease-in-out, ease;
}
*.scroll.fade-slide-left,
*.scroll.fade-each-slide-left > * {
	transform: translate(40px, 0px);
}
*.scroll.fade-slide-right,
*.scroll.fade-each-slide-right > * {
	transform: translate(-40px, 0px);
}
*.scroll.fade-slide-up,
*.scroll.fade-each-slide-up > * {
	transform: translate(0px, 40px);
}
*.scroll.fade-slide-down,
*.scroll.fade-each-slide-down > * {
	transform: translate(0px, -40px);
}
*.scroll.fade-slide.active,
*.scroll.fade-each-slide.active > * {
	transform: translate(0px, 0px);
}
*.scroll:where(.fade-zoom, .fade-bounce),
*.scroll:where(.fade-each-zoom, .fade-each-bounce) > * {
	transition-property: opacity, transform;
}
*.scroll:where(.fade-zoom, .fade-bounce).active,
*.scroll:where(.fade-each-zoom, .fade-each-bounce).active > * {
	transform: scale(1);
}
*.scroll.fade-zoom,
*.scroll.fade-each-zoom > * {
	transition-timing-function: ease-in-out, ease;
	transform: scale(0.875);
}
*.scroll.fade-zoom.active,
*.scroll.fade-each-zoom.active > *,
*.scroll.fade-bounce.active,
*.scroll.fade-each-bounce.active > * {
	transform: scale(1);
}
*.scroll.fade-bounce,
*.scroll.fade-each-bounce > * {
	transition-timing-function: ease-in-out, linear(0, 0.016, 0.063 9.1%, 0.25, 0.563, 1, 0.813 45.5%, 0.766, 0.75, 0.766, 0.813 63.6%, 1 72.7%, 0.953, 0.938, 0.953, 1, 0.984, 1);
	transform: scale(0.75);
}
*.split-text {
	opacity: 0;
}
html.active *.split-text {
	opacity: 1;
}
*.split-text > * {
	display: inline-block;
}
*.delay-01 {
	transition-delay: calc(0.125s * 1);
}
*.delay-02 {
	transition-delay: calc(0.125s * 2);
}
*.delay-03 {
	transition-delay: calc(0.125s * 3);
}
*.delay-04 {
	transition-delay: calc(0.125s * 4);
}
*.delay-05 {
	transition-delay: calc(0.125s * 5);
}
*.delay-06 {
	transition-delay: calc(0.125s * 6);
}
*.delay-07 {
	transition-delay: calc(0.125s * 7);
}
*.delay-08 {
	transition-delay: calc(0.125s * 8);
}
*.delay-09 {
	transition-delay: calc(0.125s * 9);
}
*.delay-10 {
	transition-delay: calc(0.125s * 10);
}
div.grecaptcha-badge {
	z-index: 1;
	bottom: 20px !important;
}



/* --------------------------------------------------------------------------------
header
-------------------------------------------------------------------------------- */

header#header {
	position: relative;
	z-index: 100;
}
header#header :where(*#logo, p#button-menu, div#menu) {
	position: fixed;
}
header#header *#logo {
	left: 40px;
	top: 39px;
	z-index: 20;
}
body.admin-bar header#header *#logo {
	top: 71px;
}
header#header *#logo a {
	display: block;
	height: 42px;
}
header#header *#logo a::before {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	background: url(../images/logo-white.svg) no-repeat center;
	background-size: auto 100%;
	content: "";
	opacity: 0;
	transition: 0.25s opacity ease;
}
div.menu-header header#header *#logo a::before {
	opacity: 1;
}
header#header *#logo img {
	position: relative;
	width: auto;
	height: 100%;
	transition: 0.25s opacity ease;
}
div.menu-header header#header *#logo img {
	opacity: 0;
}
header#header p#button-menu {
	width: 60px;
	height: 60px;
	right: 40px;
	top: 40px;
	z-index: 30;
  cursor: pointer;
}
body.admin-bar header#header p#button-menu {
	top: 72px;
}
header#header p#button-menu::before {
	position: absolute;
	width: 100%;
	left: 0px;
	bottom: 5px;
	text-align: center;
	font-size: 0.875rem;
	line-height: 1.5rem;
	content: "MENU";
  transition: 0.25s color ease;
}
div.menu-header header#header p#button-menu::before {
	color: #ffffff;
	content: "CLOSE";
}
header#header p#button-menu i {
  display: block;
  position: absolute;
  width: 60px;
  height: 0px;
  left: calc(50% - 30px);
  top: calc(50% - 10.5px);
	border-bottom: 1px solid #1a1a1a;
  transition: 0.25s all ease;
  transform-origin: 50% 50%;
}
div.menu-header header#header p#button-menu i {
	border-color: #ffffff;
}
header#header p#button-menu i:nth-child(1) {
	transform: translateY(-6px);
}
header#header p#button-menu i:nth-child(2) {
	transform: translateY(6px);
}
div.menu-header header#header p#button-menu i:where(:nth-child(1),:nth-child(2)) {
  width: 0px;
  left: 50%;
  opacity: 0;
	transform: translateY(0px);
}
header#header p#button-menu i:nth-child(3),
header#header p#button-menu i:nth-child(4) {
	opacity: 0;
}
div.menu-header header#header p#button-menu i:where(:nth-child(3),:nth-child(4)) {
	opacity: 1;
}
div.menu-header header#header p#button-menu i:nth-child(3) {
	transform: rotate(15deg);
}
div.menu-header header#header p#button-menu i:nth-child(4) {
	transform: rotate(-15deg);
}
header#header div#menu {
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	overflow: hidden;
	z-index: 10;
	transform: translateY(-100%);
	transition: 0.375s transform ease;
	-webkit-overflow-scrolling: touch;
}
body.admin-bar header#header div#menu {
	height: calc(100% - 32px);
	top: 32px;
}
div.menu-header header#header div#menu {
	transform: translateY(0%);
}
header#header div#menu::-webkit-scrollbar {
  display: none;
}
header#header nav#navi {
	position: relative;
	height: 100%;
}
header#header nav#navi div:where(.products, .misc-sns, .background) {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	position: absolute;
	height: 100%;
	top: 0px;
}
header#header nav#navi div.products {
	justify-content: flex-end;
	width: calc(50% - 120px);
	left: 0px;
	z-index: 2;
	padding-right: 80px;
	background-color: #404040;
}
header#header nav#navi div.products::before {
	position: absolute;
	width: 520px;
	height: 100%;
	left: 100%;
	top: 0%;
	pointer-events: none;
	background-color: #404040;
	content: "";
	transition: 0.25s transform ease;
	transform-origin: left center;
	transform: scaleX(0);
}
header#header.open-products nav#navi div.products::before {
	pointer-events: auto;
	transform: scaleX(1);
}
header#header nav#navi div.products div.inner-products {
	width: 100%;
	max-width: 400px;
}
header#header nav#navi div.products h2 {
	font-size: 3.5rem;
	font-weight: 500;
	line-height: 4rem;
	letter-spacing: 0.05em;
	margin-bottom: 40px;
}
header#header nav#navi div.products h2 a {
	color: #7db7db;
}
header#header nav#navi div.products h2 a:hover {
	color: #ffffff;
}
header#header nav#navi div.products div.list div.row {
	position: relative;
	color: #999999;
	border-bottom: 1px solid #999999;
}
header#header nav#navi div.products div.list div.row p.headline {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	font-size: 1.125rem;
	font-weight: 500;
	line-height: 2rem;
	cursor: pointer;
	padding: 20px 0px 20px 30px;
	transition: 0.25s color ease;
}
header#header nav#navi div.products div.list div.row p.headline:hover,
header#header nav#navi div.products div.list div.row.open p.headline {
	color: #ffffff;
}
header#header nav#navi div.products div.list div.row p.headline span.arrow {
	width: 25px;
	height: 25px;
	font-size: 0.375rem;
	color: #404040;
	margin-right: 15px;
	background-color: #999999;
}
header#header nav#navi div.products div.list div.row p.headline span.arrow::before {
	background-color: #ffffff;
}
header#header nav#navi div.products div.list div.row div.nest {
	position: absolute;
	width: 600px;
	left: 100%;
	top: 0px;
	color: #ffffff;
	pointer-events: none;
	padding: 0px 80px;
	opacity: 0;
	transition: 0.25s opacity ease;
}
header#header nav#navi div.products div.list div.row div.nest-child {
	padding-top: 70px;
}
header#header nav#navi div.products div.list div.row div.nest:not(.nest-child) {
	padding-top: 20px;
}
header#header nav#navi div.products div.list div.row div.nest:not(.nest-child)::before {
	position: absolute;
	width: calc(100% - 80px);
	height: 0px;
	left: 0px;
	top: -1px;
	border-bottom: 1px solid #999999;
	content: "";
	transition: 0.25s transform ease;
	transform-origin: left top;
	transform: scaleX(0);
}
header#header nav#navi div.products div.list div.row.open div.nest:not(.nest-child)::before {
	transform: scaleX(1);
}
header#header nav#navi div.products div.list div.row.open div.nest {
	pointer-events: auto;
	opacity: 1;
}
header#header nav#navi div.products div.list div.row div.nest div.list-nest {
	display: flex;
	flex-wrap: wrap;
	flex-direction: column;
	height: 400px;
}
header#header nav#navi div.products div.list div.row div.nest p {
	font-size: 1.125rem;
	font-weight: 500;
	margin-bottom: 10px;
}
header#header nav#navi div.products div.list div.row div.nest ul {
	padding-bottom: 40px;
}
header#header nav#navi div.products div.list div.row div.nest ul li:not(:last-child) {
	margin-bottom: 5px;
}
header#header nav#navi div.products div.list div.row div.nest ul li a {
	display: block;
	position: relative;
	padding-left: 10px;
	transition: 0.25s color ease;
}
header#header nav#navi div.products div.list div.row div.nest ul li a:hover {
	color: #999999;
}
header#header nav#navi div.products div.list div.row div.nest ul li a::before {
	position: absolute;
	width: 5px;
	height: 0px;
	left: 0px;
	top: 15px;
	border-bottom: 1px solid #ffffff;
	content: "";
	transition: 0.25s border-color ease;
}
header#header nav#navi div.products div.list div.row div.nest ul li a:hover::before {
	border-color: #999999;
}
header#header nav#navi div.misc-sns {
	justify-content: flex-start;
	width: calc(50% + 120px);
	right: 0px;
	color: #ffffff;
	padding: 40px 0px 0px 120px;
	background: linear-gradient(150deg, #4561d8 -50%, #57b2b2 87.5%);
}
header#header nav#navi div.misc-sns div.inner-misc-sns {
	position: relative;
	width: 100%;
	max-width: 600px;
}
header#header nav#navi div.misc-sns div.misc {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
header#header nav#navi div.misc-sns div.misc > ul {
	width: 50%;
}
header#header nav#navi div.misc-sns div.misc > ul:nth-child(2) {
	margin-bottom: 80px;
}
header#header nav#navi div.misc-sns div.misc > ul > li {
	display: flex;
	flex-wrap: wrap;
}
header#header nav#navi div.misc-sns div.misc > ul > li:not(.sustainability):not(.site-map) {
	margin-bottom: 40px;
}
header#header nav#navi div.misc-sns div.misc > ul > li:where(.home, .products, .privacy-policy) {
	display: none;
}
header#header nav#navi div.misc-sns div.misc > ul > li > a {
	font-size: 1.75rem;
	font-weight: 500;
	line-height: 2.5rem;
	transition: 0.25s color ease;
}
header#header nav#navi div.misc-sns div.misc > ul > li > a:hover {
	color: #1a1a1a;
}
header#header nav#navi div.misc-sns div.misc div.button-wrapper {
	display: flex;
	flex-wrap: wrap;
	width: calc(100% + 10px);
	margin: 0px -10px 40px 0px;
}
header#header nav#navi div.misc-sns div.misc p.button-default {
	width: calc(33.33% - 10px);
	text-align: left;
	margin-right: 10px;
}
header#header nav#navi div.misc-sns div.misc p.button-default a {
	width: 100%;
	height: 60px;
	color: #1a1a1a;
	padding-left: 15px;
	background-color: #ffffff;
	transition: 0.25s color ease;
}
header#header nav#navi div.misc-sns div.misc p.button-default a:hover {
	color: #ffffff;
}
header#header nav#navi div.misc-sns div.misc p.button-default span.text i {
	display: block;
}
header#header nav#navi div.misc-sns div.misc p.button-default span.text i.main {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	font-size: 1.125rem;
	font-weight: 500;
	height: 1.5rem;
}
header#header nav#navi div.misc-sns div.misc p.button-default span.text i.main :where(img, svg) {
	width: calc(150px * 0.375);
	height: auto;
	transform: translateY(2.5px);
}
header#header nav#navi div.misc-sns div.misc p.button-default span.text i.main svg path {
	transition: 0.25s fill ease;
	fill: #1a1a1a !important;
}
header#header nav#navi div.misc-sns div.misc p.button-default a:hover span.text i.main svg path {
	fill: #ffffff !important;
}
header#header nav#navi div.misc-sns div.misc p.button-default span.text i.sub {
	font-size: 0.75rem;
}
header#header nav#navi div.misc-sns div.misc p.button-default span.arrow {
	width: 35px;
	height: 35px;
	right: 10px;
	top: calc(50% - 17.5px);
	color: #ffffff;
	background: linear-gradient(150deg, #4561d8 -50%, #57b2b2 87.5%);
}
header#header nav#navi div.misc-sns div.sns {
	border-top: 1px solid #ffffff;
	padding-top: 30px;
}
header#header nav#navi div.misc-sns div.sns ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
header#header nav#navi div.misc-sns div.sns ul li:not(:last-child) {
	margin-right: 30px;
}
header#header nav#navi div.background {
	left: 0px;
	z-index: 1;
	pointer-events: none;
}
header#header.open-products nav#navi div.background {
	width: 100%;
	pointer-events: auto;
}
header#header div.wrapper-navi-alternate {
	position: fixed;
	width: 100%;
	height: 120px;
	left: 0px;
	top: 0px;
	pointer-events: none;
}
body.admin-bar header#header div.wrapper-navi-alternate {
	top: 32px;
}
header#header nav#navi-alternate {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items: center;
	padding-right: 140px;
	background-color: rgba(255, 255, 255, 0.875);
}
header#header nav#navi-alternate > ul,
header#header nav#navi-alternate p.button-roop {
	pointer-events: auto;
}
header#header nav#navi-alternate > ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	margin-right: 20px;
}
header#header nav#navi-alternate > ul > li {
	font-size: 1.125rem;
	font-weight: 500;
}
header#header nav#navi-alternate > ul > li > a {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	position: relative;
	height: 120px;
	padding: 0px 15px;
	transition: 0.25s color ease;
}
header#header nav#navi-alternate > ul > li:hover > a {
	color: #4d85c7;
}
header#header nav#navi-alternate > ul > li > a::before {
	position: absolute;
	width: 6px;
	height: 6px;
	left: calc(50% - 3px);
	top: calc(50% + 20px);
	background-color: #4d85c7;
	content: "";
	opacity: 0;
	border-radius: 50%;
	transition: 0.25s opacity ease, 0.25s transform ease;
	transform: scale(0);
}
header#header nav#navi-alternate > ul > li:hover > a::before,
body.about-us header#header nav#navi-alternate > ul > li.about-us > a::before,
body.business header#header nav#navi-alternate > ul > li.business > a::before,
body.products header#header nav#navi-alternate > ul > li.products > a::before,
body.works header#header nav#navi-alternate > ul > li.works > a::before,
body.faq header#header nav#navi-alternate > ul > li.faq > a::before {
	opacity: 1;
	transform: scale(1);
}
header#header nav#navi-alternate > ul > li div.nest {
	position: absolute;
	width: 100%;
	height: 0px;
	left: 0px;
	top: 120px;
	overflow: hidden;
	background-color: rgba(255, 255, 255, 0.875);
	transition: 0.25s height ease;
}
header#header nav#navi-alternate > ul > li:hover div.nest {
	height: 140px;
}
header#header nav#navi-alternate > ul > li div.nest div.inner-nest {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding: 0px 40px;
}
header#header nav#navi-alternate > ul > li div.nest p.headline {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	height: 80px;
	font-size: 1.75rem;
	font-weight: 500;
	color: #4d85c7;
}
header#header nav#navi-alternate > ul > li div.nest ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
header#header nav#navi-alternate > ul > li div.nest ul li:not(:last-child) {
	margin-right: 20px;
}
header#header nav#navi-alternate > ul > li div.nest ul li p.image {
	width: 120px;
	height: 80px;
	margin-bottom: 10px;
	border-radius: 10px;
}
header#header nav#navi-alternate > ul > li div.nest ul li p.image img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}
header#header nav#navi-alternate > ul > li div.nest ul li a:hover p.image img {
	transform: scale(1.0875);
}
header#header nav#navi-alternate > ul > li div.nest ul li p.caption {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	height: 2.25rem;
	text-align: center;
	font-size: 0.875rem;
	line-height: 1.125rem;
}
header#header nav#navi-alternate p.button-roop a {
	width: 85px;
	height: 30px;
	overflow: hidden;
	padding: 0px 15px;
	border-radius: 15px;
}
header#header nav#navi-alternate p.button-roop a::before {
	opacity: 1;
}
header#header nav#navi-alternate p.button-roop a:hover::before {
	opacity: 0;
}
header#header nav#navi-alternate p.button-roop img {
	position: relative;
	width: calc(150px * 0.25);
}
header#header nav#navi-alternate p.button-roop span.arrow {
	width: 15px;
	height: 15px;
	right: 7.5px;
	top: calc(50% - 7.5px);
	font-size: 0.375rem;
}



/* --------------------------------------------------------------------------------
breadcrumb
-------------------------------------------------------------------------------- */

div#breadcrumb {
	position: absolute;
	width: 100%;
	left: 0px;
	top: 140px;
	z-index: 1;
	text-align: left;
	padding: 0px 40px;
}
:has(div#title p.image) div#breadcrumb {
	color: #ffffff;
}
div#breadcrumb a {
	transition: 0.25s color ease;
}
div#breadcrumb a:hover {
	color: #4d85c7;
}
div#breadcrumb p {
	font-size: 0.75rem;
	line-height: 1.25rem;
}
div#breadcrumb p span {
	position: relative;
}
div#breadcrumb p span:not(:last-child) {
	margin-right: 30px;
}
div#breadcrumb p span:not(:last-child)::before {
	position: absolute;
	width: 6px;
	height: 6px;
	right: -16px;
	top: 7px;
	border-right: 1px solid #1a1a1a;
	border-top: 1px solid #1a1a1a;
	content: "";
	transform: rotate(45deg);
}
:has(div#title p.image) div#breadcrumb p span:not(:last-child)::before {
	border-color: #ffffff;
}



/* --------------------------------------------------------------------------------
cover
-------------------------------------------------------------------------------- */

div#cover {
	position: relative;
	margin: 0px -160px;
	padding: 160px 0px 120px 0px;
}
div#cover h1 {
	position: absolute;
	left: calc(50% - 500px);
	top: 160px;
	z-index: 1;
	font-size: 2.5rem;
	font-weight: 500;
	line-height: 4rem;
	letter-spacing: 0.05em;
}
div#cover p.illust {
	max-width: 1326px;
	margin: 0px auto;
}
div#cover p.illust:not(.active) {
	transform: scale(0.975);
}



/* --------------------------------------------------------------------------------
title
-------------------------------------------------------------------------------- */

div#title:not(:has(p.image)) {
	padding-top: 160px;
}
div#title:has(p.image) {
	position: relative;
	height: 700px;
}
div#title p.image {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
}
div#title p.image::before {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	background-color: #57b2b2;
	content: "";
	opacity: 0.5;
	mix-blend-mode: multiply;
}
div#title p.image img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}
div#title div.text {
	width: 1000px;
	margin: 0px auto;
}
div#title:has(p.image) div.text {
	position: absolute;
	left: calc(50% - 490px);
	bottom: 60px;
	z-index: 1;
	color: #ffffff;
}
div#title div.text h1 {
	font-size: 3rem;
	font-weight: 500;
	line-height: 4rem;
}
div#title:not(:has(p.image)) div.text h1 {
	color: #2a5cac;
}
div#title div.text h1:not(:last-child) {
	margin-bottom: 40px;
}



/* --------------------------------------------------------------------------------
main
-------------------------------------------------------------------------------- */

main,
main section,
main section div.inner-section {
	position: relative;
}
main section div.inner-section {
	width: 1000px;
	margin: 0px auto;
	padding: 120px 0px;
}
main:has(aside#sidebar) section div.inner-section {
	min-height: 720px;
}
@media (max-width:1560px) {
main:has(aside#sidebar) section div.inner-section {
	width: 1140px;
	padding-left: 280px;
}
}
main aside#sidebar {
	position: absolute;
	width: 200px;
	left: 40px;
	top: 120px;
	z-index: 10;
	padding: 30px;
	background-color: #f2f2f2;
	border-radius: 10px;
}
main aside#sidebar.fixed {
	position: fixed;
}
body.admin-bar main aside#sidebar.fixed {
	top: 152px;
}
main aside#sidebar.release {
	position: absolute;
	top: auto;
	bottom: 120px;
}
body.admin-bar main aside#sidebar.release {
	top: auto;
}
main aside#sidebar div.block:not(:last-child) {
	margin-bottom: 40px;
}
main aside#sidebar div.block h3,
main aside#sidebar div.block ul li {
	font-size: 0.875rem; 
	font-weight: 500;
	line-height: 1.25rem;
}
main aside#sidebar div.block h3 {
	position: relative;
	margin-bottom: 30px;
}
main aside#sidebar div.block h3::before {
	position: absolute;
	width: 20px;
	height: 0px;
	left: 0px;
	bottom: -10px;
	border-bottom: 1px solid #1a1a1a;
	content: "";
}
main aside#sidebar div.block ul li {
	color: #696969;
}
main aside#sidebar div.block ul li:not(:last-child) {
	margin-bottom: 10px;
}
main aside#sidebar div.block ul li a {
	transition: 0.25s color ease;
}
main aside#sidebar div.block ul li.active a,
main aside#sidebar div.block ul li a:hover {
	color: #ea8a43;
}
main aside#sidebar div.block select {
	display: none;
}
main div#trigger-sidebar {
	position: absolute;
}
main h2.headline-alternate {
	position: relative;
	font-size: 2.5rem;
	font-weight: 500;
	line-height: 3.5rem;
	color: #2a5cac;
	margin-bottom: 120px;
}
main h2.headline-alternate::before {
	position: absolute;
	width: 80px;
	height: 0px;
	left: 0px;
	bottom: -40px;
	border-bottom: 1px solid #1a1a1a;
	content: "";
}
main ul.bullet li,
main article.common div.body ul li {
	position: relative;
	padding-left: 20px;
}
main ul.bullet li::before,
main article.common div.body ul li::before {
	position: absolute;
	width: 6px;
	height: 6px;
	left: 4px;
	top: 12px;
	background-color: #1a1a1a;
	content: "";
	border-radius: 50%;
}
main ol.decimal,
main article.common div.body ol {
	padding-left: 20px;
}
main ol.decimal li,
main article.common div.body ol li {
	list-style-type: decimal;
}
main article.common div.body a {
	text-decoration: underline;
	text-decoration-thickness: 1px;
	text-underline-offset: 0.1em;
}
main article.common div.body :where(h1, h2, h3, h4, h5, h6, p, blockquote, ul, ol, table) {
	clear: both;
}
main article.common div.body :where(h1, h2, h3, h4, h5, h6, strong) {
	font-weight: 500;
}
main article.common div.body em {
	font-style: italic;
}
main article.common div.body blockquote {
	padding: 20px;
	background-color: #f2f2f2;
}
main article.common div.body table {
	width: 100%;
}
main article.common div.body table :where(th, td) {
	border: 1px solid #999999;
	padding: 10px;
}
main article.common div.body table th {
	background-color: #f2f2f2;
}
main article.common div.body img.alignleft {
	float: left;
}
main article.common div.body img.alignright {
	float: right;
}
main article.common div.body img.aligncenter {
	margin-left: auto;
	margin-right: auto;
}
main article.common div.body :where(a.wp-block-button__link, a.wp-block-file__button) {
	display: inline-block;
	height: 40px;
	text-decoration: none;
	font-size: 1rem;
	line-height: 38px;
	border: 1px solid #4d85c7;
	padding: 0px 20px;
	background-color: #4d85c7;
	border-radius: 20px;
	transition: 0.25s background-color ease;
}
main article.common div.body :where(a.wp-block-button__link, a.wp-block-file__button):hover {
	background-color: #404040;
}
main article.common div.body :where(h2, h3, h4).headline {
	position: relative;
	font-weight: 500;
}
main article.common div.body :where(h2, h3).headline {
	margin-bottom: 20px;
}
main article.common div.body :where(h2, h3, h4).headline * {
	font-weight: 500 !important;
}
main article.common div.body h2.headline {
	font-size: 1.75rem;
	line-height: 2.5rem;
	padding-left: 20px;
}
main article.common div.body h2.headline::before {
	position: absolute;
	width: 0px;
	height: calc(100% - 4px);
	left: 0px;
	top: 3px;
	border-right: 5px solid #4d85c7;
	content: "";
	border-radius: 2.5px;
}
main article.common div.body h3.headline {
	font-size: 1.375rem;
	line-height: 2rem;
	color: #4d85c7;
	padding-left: 20px;
}
main article.common div.body h3.headline::before {
	position: absolute;
	width: 10px;
	height: 10px;
	left: 3px;
	top: 13px;
	background-color: #4d85c7;
	content: "";
	border-radius: 50%;
}
main article.common div.body h4.headline {
	font-size: 1.125rem;
	margin-bottom: 10px;
}
main article.common div.body div#index {
	border: 1px solid #4d85c7;
	padding: 30px 40px 40px 40px;
	background-color: #ffffff;
	border-radius: 10px;
}
main article.common div.body div#index p.headline {
	font-size: 1.375rem;
	font-weight: 500;
	color: #4d85c7;
	margin-bottom: 20px;
}
main article.common div.body div#index p.headline::before {
	display: inline-block;
	font-family: "icon";
	font-size: 1.125rem;
	font-weight: 400;
	margin-right: 10px;
	content: "\e907";
}
main article.common div.body div#index ul {
	padding-left: 40px;
}
main article.common div.body div#index ul li {
	font-size: 1.125rem;
	padding-left: 0px;
}
main article.common div.body div#index ul li.h2 {
	font-weight: 500;
}
main article.common div.body div#index ul li::before {
	display: none;
}
main article.common div.body div#index ul li:not(:last-child) {
	margin-bottom: 10px;
}
main article.common div.body div#index ul li a {
	display: block;
	position: relative;
	text-decoration: none;
}
main article.common div.body div#index ul li.h2 a {
	padding-left: 20px;
}
main article.common div.body div#index ul li.h3 a {
	padding-left: 40px;
}
main article.common div.body div#index ul li a::before {
	position: absolute;
	content: "";
}
main article.common div.body div#index ul li.h2 a::before {
	width: 10px;
	height: 10px;
	left: 0px;
	top: 8px;
	border-right: 2px solid #4d85c7;
	border-top: 2px solid #4d85c7;
	transform: rotate(135deg);
}
main article.common div.body div#index ul li.h3 a::before {
	width: 6px;
	height: 6px;
	left: 24px;
	top: 12px;
	background-color: #4d85c7;
	border-radius: 50%;
}
main article.common div.body div.column-related:last-child {
	padding-top: 80px;
}
main article.common div.body div.column-related h2.headline {
	margin-bottom: 40px;
}
main article.common div.body div.column-related div.list-column-related div.row:not(:last-child) {
	margin-bottom: 40px;
}
main article.common div.body div.column-related div.list-column-related div.row a {
	justify-content: space-between;
	align-items: flex-start;
	position: relative;
	text-decoration: none;
	padding: 40px;
	background-color: #f0f4f9;
	border-radius: 10px;
}
main article.common div.body div.column-related div.list-column-related div.row a::before {
	position: absolute;
	left: 40px;
	top: -15px;
	font-family: "icon";
	font-size: 2.5rem;
	line-height: 2.5rem;
	color: #4d85c7;
	content: "\e908";
}
main article.common div.body div.column-related div.list-column-related div.row h3 {
	width: 100%;
	text-align: left;
	font-size: 1.375rem;
	font-weight: 500;
	margin-bottom: 20px;
	transition: 0.25s color ease;
}
main article.common div.body div.column-related div.list-column-related div.row a:hover h3 {
	color: #4d85c7;
}
main article.common div.body div.column-related div.list-column-related div.row p.image {
	width: 200px;
}
main article.common div.body div.column-related div.list-column-related div.row div.text {
	width: calc(100% - 220px);
}
main article.common div.body div.column-related div.list-column-related div.row div.text div.created-category div.category ul li::before {
	display: none;
}
main :where(div#pager, nav#navi-article) {
	line-height: 1rem;
	margin-top: 120px;
}
main div#pager,
main nav#navi-article ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
}
main div#pager {
	color: #999999;
}
main div#pager :where(span.current, a),
main nav#navi-article ul li a {
	display: block;
}
main div#pager :where(span.current, a:hover:not(.prev):not(.next)),
main nav#navi-article ul li.list a:hover {
	color: #1a1a1a;
}
main div#pager :where(span.current, a:not(.prev):not(.next)) {
	margin: 0px 10px;
}
main div#pager a:not(.prev):not(.next) {
	transition: 0.25s color ease;
}
main div#pager a.prev {
	margin-right: 40px;
}
main div#pager a.next {
	margin-left: 40px;
}
main div#pager span.arrow,
main nav#navi-article span.arrow {
	width: 50px;
	height: 50px;
	color: #ffffff;
	background-color: #696969;
}
main div#pager a.prev span.arrow,
main nav#navi-article ul li.prev span.arrow {
	transform: scaleX(-1);
}
main nav#navi-article ul {
	position: relative;
	width: 440px;
	height: 50px;
	margin-left: auto;
	margin-right: auto;
}
main nav#navi-article ul li:where(.prev, .next) {
	position: absolute;
	top: 0px;
	font-weight: 500;
}
main nav#navi-article ul li.prev {
	left: 0px;
}
main nav#navi-article ul li.next {
	right: 0px;
}
main nav#navi-article ul li.prev span.arrow {
	margin-right: 20px;
}
main nav#navi-article ul li.next span.arrow {
	margin-left: 20px;
}
main nav#navi-article ul li.list {
	font-size: 2.5rem;
	line-height: 2.5rem;
	color: #696969;
}
main nav#navi-article ul li a {
	transition: 0.25s color ease;
}
main nav#navi-article ul li:where(.prev, .next) a {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	color: #999999;
}
main nav#navi-article ul li:where(.prev, .next) a:hover {
	color: #1a1a1a;
}

/* home
-------------------------------------------------------------------------------- */

main section#home-news div.inner-section {
	padding: 80px;
	background-color: #f0f4f9;
	border-radius: 10px;
}
main section:where(#home-news, #home-column) header {
	margin-bottom: 60px;
}
main section:where(#home-news, #home-column) header h2 {
	font-size: 3rem;
	font-weight: 500;
	line-height: 3.125rem;
	color: #2a5cac;
}
main section:where(#home-news, #home-column) p.button-more {
	position: absolute;
}
main section#home-news p.button-more {
	right: 80px;
	top: 80px;
}
main section#home-column p.button-more {
	right: 0px;
	top: 120px;
}
main section#home-menu div.list div.row {
	overflow: hidden;
	color: #ffffff;
	background: linear-gradient(115deg, #4561d8, #57b2b2);
	border-radius: 10px;
}
main section#home-menu div.list div.row:not(:last-child) {
	margin-bottom: 60px;
}
main section#home-menu div.list div.row p.image {
	position: relative;
}
main section#home-menu div.list div.row p.image::before {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	z-index: 1;
	background-color: #57b2b2;
	content: "";
	opacity: 0.5;
	mix-blend-mode: multiply;
}
main section#home-menu div.list div.row a:hover p.image img {
	transform: scale(1.01875);
}
main section#home-menu div.list div.row p.image span {
	position: absolute;
	right: 0px;
	top: 80px;
	z-index: 2;
	writing-mode: vertical-rl;
	white-space: pre;
	font-size: 4.5rem;
	line-height: 4rem;
	opacity: 0.75;
	transform: rotate(180deg);
}
main section#home-menu div.list div.row div.text {
	padding: 40px 40px 40px 60px;
}
main section#home-menu div.list div.row div.text h3 {
	position: relative;
	font-size: 1.75rem;
	font-weight: 500;
	line-height: 2.5rem;
	margin-bottom: 30px;
	padding-left: 80px;
}
main section#home-menu div.list div.row div.text h3::before {
	position: absolute;
	width: 60px;
	height: 0px;
	left: 0px;
	top: 20px;
	border-bottom: 1px solid #ffffff;
	content: "";
}
main section#home-menu div.list div.row div.text p.description {
	font-weight: 500;
	margin-bottom: 10px;
}
main section#home-menu div.list div.row div.text p.more {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items: center;
}
main section#home-menu div.list div.row div.text p.more span.text {
	display: block;
	font-weight: 500;
	margin-right: 10px;
}

/* about-us
-------------------------------------------------------------------------------- */

main section#statement div.list div.row:not(:last-child) {
	margin-bottom: 80px;
}
main section#statement div.list div.row h2 {
	font-size: 1.75rem;
	font-weight: 500;
	color: #2a5cac;
	margin-bottom: 20px;
}
main section#statement div.list div.row p.description {
	font-size: 2.5rem;
	line-height: 4rem;
}
main section#top-message {
	background-color: #f0f4f9;
}
main section#top-message div.image-text {
	display: flex;
	flex-wrap: wrap;
	flex-direction: row-reverse;
	justify-content: space-between;
	align-items: flex-start;
}
main section#top-message div.image-text p.image {
	width: 380px;
	margin-top: 75px;
	border-radius: 10px;
}
main section#top-message div.image-text div.text {
	width: calc(100% - 440px);
}
main section#top-message div.image-text div.text :where(h3, p.description) {
	margin-bottom: 40px;
}
main section#top-message div.image-text div.text h3 {
	font-size: 1.375rem;
	font-weight: 500;
}
main section#top-message div.image-text div.text p.name {
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	align-items: center;
}
main section#top-message div.image-text div.text p.name span {
	display: block;
}
main section#top-message div.image-text div.text p.name span.sub {
	font-size: 0.875rem;
	line-height: 1.125rem;
	margin-right: 30px;
}
main section#top-message div.image-text div.text p.name span.main {
	font-size: 1.375rem;
	font-weight: 500;
}
main section#outline div.list {
	margin-bottom: 80px;
}
main section#outline div.list div.row {
	display: flex;
	flex-wrap: wrap;
	text-align: left;
	padding: 30px 40px;
	border-radius: 10px;
}
main section#outline div.list div.row:nth-child(2n+1) {
	background-color: #f0f4f9;
}
main section#outline div.list div.row p.label {
	width: 280px;
	font-weight: 500;
}
main section#outline div.list div.row div.body {
	width: calc(100% - 280px);
}
main section#outline div.list div.row div.body a.color {
	color: #4d85c7;
}
main section#outline div.list div.row div.body a.color:hover {
	color: #1a1a1a;
}
main section#outline div.image {
	overflow: hidden;
	margin: 0px calc(50% - 50vw);
}
main section#outline div.image div.inner-image {
	display: flex;
	flex-wrap: wrap;
	width: 9999px;
	height: 500px;
	animation: outline 60s linear infinite forwards;
}
@keyframes outline {
	0% { transform: translateX(0px); }
	100% { transform: translateX(-1520px); }
}
main section#outline div.image div.group {
	position: relative;
	width: 1520px;
	height: 500px;
}
main section#outline div.image div.group p.row {
	position: absolute;
	overflow: hidden;
	border-radius: 10px;
}
main section#outline div.image div.group p.row img {
	width: 100%;
}
main section#outline div.image div.group p.row:not(:nth-child(3n)) {
	width: 320px;
	height: 240px;
}
main section#outline div.image div.group p.row:nth-child(3n) {
	width: 400px;
	height: 400px;
	top: 50px;
}
main section#outline div.image div.group p.row:nth-child(3n+1) {
	top: 0px;
}
main section#outline div.image div.group p.row:nth-child(3n+2) {
	top: 260px;
}
main section#outline div.image div.group p.row:where(:nth-child(1), :nth-child(2)) {
	left: 0px;
}
main section#outline div.image div.group p.row:nth-child(3) {
	left: 340px;
}
main section#outline div.image div.group p.row:where(:nth-child(4), :nth-child(5)) {
	left: 760px;
}
main section#outline div.image div.group p.row:nth-child(6) {
	left: 1100px;
}
main section#history div.list {
	position: relative;
}
main section#history div.list::before {
	position: absolute;
	width: 0px;
	height: 100%;
	left: 69px;
	top: 0px;
	border-right: 2px dotted #999999;
	content: "";
}
main section#history div.list div.row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	position: relative;
	text-align: left;
}
main section#history div.list div.row:last-child:before,
main section#history div.list div.row::after {
	position: absolute;
	content: "";
}
main section#history div.list div.row::before {
	width: 10px;
	height: 50%;
	left: 65px;
	top: 50%;
	background-color: #ffffff;
}
main section#history div.list div.row::after {
	width: 14px;
	height: 14px;
	left: 63px;
	top: calc(50% - 7px);
	border: 2px solid #ffffff;
	background-color: #ea8a43;
	border-radius: 50%;
}
main section#history div.list div.row p.year {
	width: 90px;
	font-family: "Roboto", sans-serif;
	font-size: 1.375rem;
	color: #4d85c7;
}
main section#history div.list div.row div.body-wrapper {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: calc(100% - 90px);
	padding: 30px 40px;
	border-radius: 10px;
}
main section#history div.list div.row:nth-child(2n+1) div.body-wrapper {
	background-color: #f0f4f9;
}
main section#history div.list div.row div.body {
	width: 50%;
}
main section#history div.list div.row div.body p.label {
	font-weight: 500;
}
main section#history div.list div.row div.body div.month-description {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	font-weight: 500;
}
main section#history div.list div.row div.body div.month-description p.month {
	width: 50px;
}
main section#history div.list div.row div.body div.month-description p.description {
	width: calc(100% - 50px);
}
main section#office div.list div.row,
main section#office div.list div.row div.text {
	display: flex;
	flex-wrap: wrap;
}
main section#office div.list div.row {
	overflow: hidden;
	background-color: #f0f4f9;
	border-radius: 10px;
}
main section#office div.list div.row:not(:last-child) {
	margin-bottom: 40px;
}
main section#office div.list div.row div.text {
	align-items: center;
	width: calc(100% - 550px);
}
main section#office div.list div.row div.text div.inner-text {
	padding-left: 60px;
}
main section#office div.list div.row div.text h3 {
	position: relative;
	font-size: 1.375rem;
	font-weight: 500;
	margin-bottom: 20px;
	padding-left: 20px;
}
main section#office div.list div.row div.text h3::before {
	position: absolute;
	width: 10px;
	height: 10px;
	left: 0px;
	top: 11px;
	background-color: #ea8a43;
	content: "";
	border-radius: 50%;
}
main section#office div.list div.row div.map {
	width: 550px;
}
main section#office div.list div.row div.map iframe {
	width: 100%;
	height: 350px;
}

/* business
-------------------------------------------------------------------------------- */

main section#business header {
	text-align: center;
	margin-bottom: 80px;
}
main section#business div.list div.row,
main section#business div.list div.row div.text {
	display: flex;
	flex-wrap: wrap;
}
main section#business div.list div.row {
	flex-direction: row-reverse;
	overflow: hidden;
	background-color: #f0f4f9;
	border-radius: 10px;
}
main section#business div.list div.row:not(:last-child) {
	margin-bottom: 40px;
}
main section#business div.list div.row div.text {
	align-items: center;
	width: calc(100% - 550px);
}
main section#business div.list div.row div.text div.inner-text {
	padding: 0px 60px;
}
main section#business div.list div.row div.text p.number {
	font-family: "Roboto", sans-serif;
	font-size: 1.75rem;
	color: #4d85c7;
	margin-bottom: 10px;
}
main section#business div.list div.row div.text h2 {
	position: relative;
	font-size: 2rem;
	font-weight: 500;
	line-height: 2.75rem;
	margin-bottom: 40px;
}
main section#business div.list div.row div.text h2::before {
	position: absolute;
	width: 40px;
	height: 0px;
	left: 0px;
	bottom: -20px;
	border-bottom: 1px solid #1a1a1a;
	content: "";
}
main section#business div.list div.row p.image {
	width: 550px;
}
main section#flow {
	background-color: #f0f4f9;
}
main section#flow header {
	margin-bottom: 80px;
}
main section#flow header h2.headline-alternate {
	margin-bottom: 80px;
}
main section#flow div.list {
	display: flex;
	flex-wrap: wrap;
	margin: 0px -40px -40px 0px;
}
main section#flow div.list div.row {
	width: calc(33.33% - 40px);
	margin: 0px 40px 40px 0px;
	padding: 40px;
	background-color: #ffffff;
	border-radius: 10px;
}
main section#flow div.list div.row h3 {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	position: relative;
	margin: 0px -40px 20px -40px;
	padding-bottom: 20px;
}
main section#flow div.list div.row h3::before {
	position: absolute;
	width: calc(100% - 80px);
	height: 0px;
	left: 40px;
	bottom: 0px;
	border-bottom: 2px solid #4d85c7;
	content: "";
}
main section#flow div.list div.row h3 span {
	display: block;
}
main section#flow div.list div.row h3 span.number {
	font-family: "Roboto", sans-serif;
	font-size: 1.75rem;
	color: #4d85c7;
	margin-right: 10px;
	transform: translateY(2px);
}
main section#flow div.list div.row h3 span.main {
	font-size: 1.375rem;
	font-weight: 500;
}
main section#flow div.list div.row p.icon {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-bottom: 10px;
}
main section#flow div.list div.row p.icon img {
	width: 48px;
}

/* products
-------------------------------------------------------------------------------- */

main div.list-products {
	display: flex;
	flex-wrap: wrap;
	margin: 0px -40px -40px 0px;
}
main div.list-products div.row {
	display: none;
	position: relative;
	width: calc(33.33% - 40px);
	overflow: hidden;
	margin: 0px 40px 40px 0px;
	background-color: #f0f4f9;
	border-radius: 10px;
}
main div.list-products div.row.active {
	display: block;
}
main div.list-products div.row a {
	display: block;
	height: 100%;
}
main div.list-products div.row p.image {
	aspect-ratio: 350 / 230;
}
main div.list-products div.row p.image img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}
main div.list-products div.row div.text {
	padding: 20px 20px 55px 20px;
}
main div.list-products div.row div.text div.category {
	margin-bottom: 10px;
}
main div.list-products div.row div.text div.category ul {
	display: flex;
	flex-wrap: wrap;
}
main div.list-products div.row div.text div:where(.category, .data) ul li {
	font-size: 0.875rem;
	line-height: 1.5rem;
}
main div.list-products div.row div.text h3 {
	font-size: 1.375rem;
	font-weight: 500;
}
main div.list-products div.row div.text h3:not(:last-child) {
	position: relative;
	margin-bottom: 40px;
}
main div.list-products div.row div.text h3:not(:last-child)::before {
	position: absolute;
	width: 20px;
	height: 0px;
	left: 0px;
	bottom: -20px;
	border-bottom: 1px solid #1a1a1a;
	content: "";
}
main div.list-products div.row div.text div.data ul li {
	display: flex;
	flex-wrap: wrap;
}
main div.list-products div.row div.text div.data ul li span {
	display: block;
}
main div.list-products div.row div.text div.data ul li span.label {
	position: relative;
	width: 45px;
}
main div.list-products div.row div.text div.data ul li span.label::after {
	position: absolute;
	right: 5px;
	top: 0px;
	content: "：";
}
main div.list-products div.row div.text div.data ul li span.body {
	width: calc(100% - 45px);
}
main div.list-products div.row div.text span.arrow {
	position: absolute;
	width: 35px;
	height: 35px;
	right: 20px;
	bottom: 20px;
	font-size: 0.5rem;
}
main article.products header,
main article.products div.block:not(:last-child) {
	margin-bottom: 120px;
}
main article.products header div.column {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	position: relative;
}
main article.products header div.column:not(:last-child) {
	margin-bottom: 40px;
}
main article.products header div.column::before {
	position: absolute;
	width: 0px;
	height: 100%;
	left: 460px;
	top: 0px;
	border-right: 1px solid #999999;
	content: "";
}
main article.products header div.column div:where(.main, .sub) {
	padding-bottom: calc(3.5rem + 10px);
}
main article.products header div.column div.main {
	width: 460px;
}
main article.products header div.column div.main div.category {
	margin-bottom: 20px;
}
main article.products header div.column div.main div.category ul,
main article.products header div.column div.main div.category ul li {
	display: flex;
	flex-wrap: wrap;
}
main article.products header div.column div.main div.category ul li {
	justify-content: center;
	align-items: center;
	height: 30px;
	font-weight: 500;
	color: #ffffff;
	padding: 0px 15px;
	background-color: #ea8a43;
	border-radius: 15px;
}
main article.products header div.column div.main div.category ul li:not(:last-child) {
	margin-right: 10px;
}
main article.products header div.column div.main h1 {
	font-size: 2.5rem;
	font-weight: 500;
	line-height: 3.5rem;
	margin-bottom: 10px;
}
main article.products header div.column div.main p.sub {
	font-weight: 500;
}
main article.products header div.column div.sub {
	position: relative;
	width: calc(100% - 500px);
}
main article.products header div.column div.sub h2 {
	text-align: left;
	font-size: 1.375rem;
	font-weight: 500;
	line-height: 2rem;
	margin-bottom: 20px;
}
main article.products header div.column div.sub div.navi {
	position: absolute;
	left: 0px;
	bottom: 0px;
}
main article.products header div.column div.sub div.navi ul {
	display: flex;
	flex-wrap: wrap;
	margin: 0px -30px -5px 0px;
}
main article.products header div.column div.sub div.navi ul li {
	font-weight: 500;
	margin: 0px 30px 5px 0px;
}
main article.products header div.column div.sub div.navi ul li a {
	position: relative;
	color: #696969;
}
main article.products header div.column div.sub div.navi ul li a:hover,
div.block0:not(.block1) main article.products header div.column div.sub div.navi ul li:nth-child(1) a,
div.block1:not(.block2) main article.products header div.column div.sub div.navi ul li:nth-child(2) a,
div.block2:not(.block3) main article.products header div.column div.sub div.navi ul li:nth-child(3) a,
div.block3:not(.block4) main article.products header div.column div.sub div.navi ul li:nth-child(4) a,
div.block4:not(.block5) main article.products header div.column div.sub div.navi ul li:nth-child(5) a,
div.block5:not(.block6) main article.products header div.column div.sub div.navi ul li:nth-child(6) a,
div.block6 main article.products header div.column div.sub div.navi ul li:nth-child(7) a {
	color: #ea8a43;
}
main article.products header div.column div.sub div.navi ul li a::before {
position: absolute;
	width: 6px;
	height: 6px;
	left: calc(50% - 3px);
	top: calc(50% + 20px);
	background-color: #ea8a43;
	content: "";
	opacity: 0;
	border-radius: 50%;
	transition: 0.25s opacity ease, 0.25s transform ease;
	transform: scale(0);
}
main article.products header div.column div.sub div.navi ul li a:hover::before,
div.block0:not(.block1) main article.products header div.column div.sub div.navi ul li:nth-child(1) a::before,
div.block1:not(.block2) main article.products header div.column div.sub div.navi ul li:nth-child(2) a::before,
div.block2:not(.block3) main article.products header div.column div.sub div.navi ul li:nth-child(3) a::before,
div.block3:not(.block4) main article.products header div.column div.sub div.navi ul li:nth-child(4) a::before,
div.block4:not(.block5) main article.products header div.column div.sub div.navi ul li:nth-child(5) a::before,
div.block5:not(.block6) main article.products header div.column div.sub div.navi ul li:nth-child(6) a::before,
div.block6 main article.products header div.column div.sub div.navi ul li:nth-child(7) a::before {
	opacity: 1;
	transform: scale(1);
}
main article.products header div.slide,
main article.products header div.slide div.image {
	position: relative;
}
main article.products header div.slide div.image {
	aspect-ratio: 1000 / 600;
}
main article.products header div.slide div.image p.row {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
}
main article.products header div.slide div.image p.row img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}
main article.products header div.slide :where(div.pager, p.good-design, p.point) {
	position: absolute;
	z-index: 5;
}
main article.products header div.slide div.pager {
	display: none;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	pointer-events: none;
}
main article.products header div.slide:has(div.image p.row:nth-child(2)) div.pager {
	display: block;
}
main article.products header div.slide div.pager p.button {
	position: absolute;
	width: 50px;
	height: 50px;
	top: calc(50% - 25px);
	pointer-events: auto;
	cursor: pointer;
}
main article.products header div.slide div.pager p.button span.arrow {
	width: 50px;
	height: 50px;
	color: #ffffff;
	background-color: #4d85c7;
}
main article.products header div.slide div.pager p.button:hover span.arrow::before {
	opacity: 1;
	transform: scale(1.025);
}
main article.products header div.slide div.pager p.button-prev {
	left: -25px;
}
main article.products header div.slide div.pager p.button-prev span.arrow {
	transform: scaleX(-1);
}
main article.products header div.slide div.pager p.button-next {
	right: -25px;
}
main article.products header div.slide p.good-design {
	left: 40px;
	top: 40px;
}
main article.products header div.slide p.good-design img {
	width: 74px;
}
main article.products header div.slide p.point {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	height: 40px;
	right: 20px;
	bottom: 20px;
	font-size: 1.125rem;
	font-weight: 500;
	line-height: 1.125rem;
	color: #ffffff;
	padding: 0px 20px;
	background-color: #ea8a43;
	border-radius: 20px;
}
main article.products header.alternate {
	position: fixed;
	width: 100%;
	left: 0px;
	top: 120px;
	z-index: 10;
	margin-bottom: 0px;
}
body.admin-bar main article.products header.alternate {
	top: 152px;
}
main article.products header.alternate div.inner-header {
	height: 0px;
	overflow: hidden;
	background-color: rgba(255, 255, 255, 0.875);
	opacity: 0;
	transition: 0.25s height ease, 0.25s opacity ease;
}
div.scroll main article.products header.alternate div.inner-header,
main article.products header.alternate div.column {
	height: 120px;
}
div.scroll main article.products header.alternate div.inner-header {
	opacity: 1;
}
main article.products header.alternate div.column {
	align-items: center;
	position: relative;
	border-top: 1px solid #f2f2f2;
	border-bottom: 1px solid #f2f2f2;
	padding: 20px 40px;
}
main article.products header.alternate div.column::before {
	height: calc(100% - 40px);
	left: 420px;
	top: 20px;
}
main article.products header.alternate div.column div:where(.main, .sub) {
	padding-bottom: 0px;
}
main article.products header.alternate div.column div.main {
	width: 420px;
}
main article.products header.alternate div.column div.main div.category {
	margin-bottom: 10px;
}
main article.products header.alternate div.column div.main div.category ul li {
	height: 20px;
	font-size: 0.75rem;
	line-height: 1.25rem;
	padding: 0px 10px;
	border-radius: 10px;
}
main article.products header.alternate div.column div.main div.category ul li:not(:last-child) {
	margin-right: 5px;
}
main article.products header.alternate div.column div.main h1 {
	font-size: 2rem;
	line-height: 2.75rem;
	margin-bottom: 0px;
}
main article.products header.alternate div.column div.sub {
	width: calc(100% - 460px);
}
main article.products header.alternate div.column div.sub div.navi {
	position: static;
	left: auto;
	bottom: auto;
}
main article.products div.block h2 {
	font-size: 2rem;
	font-weight: 500;
	line-height: 2.75rem;
	color: #2a5cac;
	margin-bottom: 40px;
}
main article.products div.block h3 {
	text-align: left;
	font-size: 1.375rem;
	font-weight: 500;
}
main article.products div.block h3:has(span.number) {
	display: flex;
	flex-wrap: wrap;
}
main article.products div.block h3:has(span.number) span {
	display: block;
}
main article.products div.block h3 span.number {
	width: 50px;
	font-family: "Roboto", sans-serif;
	font-size: 1.75rem;
	font-weight: 400;
	color: #4d85c7;
	transform: translateY(2px);
}
main article.products div.block h3:has(span.number) span.main {
	width: calc(100% - 50px);
}
main article.products div.block div.diagram p.row :where(img, span):not(:last-child),
main article.products div.block p.diagram :where(img, span):not(:last-child) {
	margin-bottom: 20px;
}
main article.products div.block div.diagram p.row span,
main article.products div.block p.diagram span {
	display: block;
	text-align: center;
	font-size: 0.875rem;
	line-height: 1.5rem;
}
main article.products div.block div.diagram p.row span:first-child,
main article.products div.block p.diagram span:first-child {
	font-weight: 500;
}
main article.products div.block table:not(:where(.spec-01, .spec-02, .spec-04, .spec-05, .example)):has(th:nth-child(3)) {
	width: 330px;
}
main article.products div.block table:not(:where(.spec-01, .spec-02, .spec-04, .spec-05, .example)):has(th:nth-child(4)) {
	width: 440px;
}
main article.products div.block table:not(:where(.spec-01, .spec-02, .spec-04, .spec-05, .example)):has(th:nth-child(6)) {
	width: 660px;
}
main article.products div.block table :where(th, td) {
	width: 110px;
	text-align: center;
	vertical-align: middle;
	font-size: 0.875rem;
	line-height: 1.25rem;
	padding: 10px 0px;
}
main article.products div.block table :where(thead, tbody) :where(th, td) {
	border-top: 1px solid #e2e2e2;
	border-bottom: 1px solid #e2e2e2;
}
main article.products div.block table :where(thead, tbody) :where(th, td):not(:last-child),
main article.products div.block table :where(thead, tbody) :where(th, td).border {
	border-right: 1px solid #e2e2e2;
}
main article.products div.block table tfoot td {
	text-align: left;
}
main article.products div.block table:where(.spec-01, .spec-04, .spec-05, .example) {
	width: 1000px;
}
main article.products div.block table.spec-01 :where(th, td),
main article.products div.block table.spec-04 td:nth-child(4) {
	text-align: left;
	padding: 10px;
}
main article.products div.block table.spec-01 thead th:nth-child(1) {
	width: 140px;
}
main article.products div.block table.spec-01 thead th:nth-child(2) {
	width: 550px;
}
main article.products div.block table.spec-01 thead th:nth-child(3) {
	width: 310px;
}
main article.products div.block table.spec-02 {
	width: 330px;
}
main article.products div.block table.spec-02 tbody td {
	width: 220px;
}
main article.products div.block table.spec-03 {
	width: 770px;
}
main article.products div.block table.spec-03 thead th:first-child {
	position: relative;
	overflow: hidden;
}
main article.products div.block table.spec-03 thead th:first-child::before {
	position: absolute;
	width: 110px;
	height: 0px;
	left: calc(50% - 55px);
	top: calc(50% - 0.5px);
	border-bottom: 1px solid #e2e2e2;
	content: "";
	transform: rotate(22.5deg);
}
main article.products div.block table.spec-03 thead th:first-child span {
	position: absolute;
}
main article.products div.block table.spec-03 thead th:first-child span:nth-child(1) {
	right: 5px;
	top: 5px;
}
main article.products div.block table.spec-03 thead th:first-child span:nth-child(2) {
	left: 5px;
	bottom: 5px;
}



main article.products div.block table.spec-04 thead th:nth-child(4) {
	width: 670px;
}
main article.products div.block table.spec-05 thead th {
	width: 125px;
}
main article.products div.block table.example thead th:not(:nth-child(3)) {
	width: 280px;
}
main article.products div.block table.example thead th:nth-child(3) {
	width: 440px;
}
main article.products div.block-feature div:where(.list, .diagram, .list-alternate):not(:last-child) {
	margin-bottom: 80px;
}
main article.products div.block-feature div.list div.row:not(:last-child) {
	margin-bottom: 40px;
}
main article.products div.block-feature div.list div.row h3 {
	margin-bottom: 10px;
}
main article.products div.block-feature div.list div.row p.description {
	padding-left: 50px;
}
main article.products div.block-feature div:where(.diagram, .image, .diagram-image, .list-alternate) {
	display: flex;
	flex-wrap: wrap;
}
main article.products div.block-feature div.diagram p.row:not(:last-child) {
	margin-right: 80px;
}
main article.products div.block-feature div.image {
	margin: 0px -20px -20px 0px;
}
main article.products div.block-feature div.image p.row {
	width: calc(50% - 20px);
	margin: 0px 20px 20px 0px;
}
body:where(.arch-drain, .arch-drain-surface-drain) main article.products div.block-feature div.diagram p.row {
	width: auto;
	max-width: 320px;
}
body.mitsuba-drain main article.products div.block-feature div.diagram-image p.diagram {
	width: auto;
	max-width: 305px;
	margin-right: 80px;
}
body.mitsuba-drain main article.products div.block-feature div.diagram-image p.image {
	width: 615px;
}
body.artifact main article.products div.block-feature div.list-alternate {
	margin-right: -60px;
}
body.artifact main article.products div.block-feature div.list-alternate div.row {
	width: calc(33.33% - 60px);
	margin-right: 60px;
}
body.artifact main article.products div.block-feature div.list-alternate div.row :where(h3, h4) {
	text-align: center;
	font-weight: 500;
}
body.artifact main article.products div.block-feature div.list-alternate div.row h3 {
	font-size: 1.375rem;
	border-bottom: 1px solid #4d85c7;
	margin-bottom: 10px;
	padding-bottom: 10px;
}
body.artifact main article.products div.block-feature div.list-alternate div.row h4 {
	font-size: 1.125rem;
	color: #4d85c7;
	margin-bottom: 10px;
}
body.artifact main article.products div.block-feature > p.description {
	text-align: center;
}
main article.products div.block-spec > p:where(.description, .diagram):not(:last-child),
main article.products div.block-spec > div.table-wrapper:not(:last-child),
main article.products div.block-spec div:where(.diagram, .diagram-table-wrapper, .image-table-wrapper):not(:last-child) {
	margin-bottom: 80px;
}
main article.products div.block-spec h3 {
	margin-bottom: 20px;
}
main article.products div.block-spec div:where(.diagram, .diagram-table-wrapper, .image-table-wrapper) {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
main article.products div.block-spec div.diagram p.row:not(:last-child),
main article.products div.block-spec div:where(.diagram-table-wrapper, .image-table-wrapper) div.table-wrapper:not(:last-child) {
	margin-right: 80px;
}
main article.products div.block-spec div.image {
	display: flex;
	flex-wrap: wrap;
	margin: 0px -20px -20px 0px;
}
main article.products div.block-spec div.image p.row {
	width: calc(50% - 20px);
	margin: 0px 20px 20px 0px;
}
body.arch-drain main article.products div.block-spec div.diagram-table-wrapper p.diagram {
	max-width: 410px;
}
body.arch-roofing main article.products div.block-spec div.diagram-table-wrapper p.diagram {
	max-width: 475px;
}
body.side-drain main article.products div.block-spec div.diagram-table-wrapper p.diagram {
	max-width: 225px;
}
body.rec-drain main article.products div.block-spec div.diagram-table-wrapper p.diagram {
	max-width: 245px;
}
body.elasto-drain main article.products div.block-spec div.diagram-table-wrapper p.diagram {
	max-width: 400px;
}
body.elasto-drain main article.products div.block-spec div.image-table-wrapper div.table-wrapper {
	margin-right: 190px;
}
body.elasto-drain main article.products div.block-spec div.image-table-wrapper p.image {
	max-width: 450px;
}
body.arch-drain-surface-drain main article.products div.block-spec p.diagram {
	max-width: 750px;
	margin-left: 120px;
}
body.arch-roofing-surface-drain main article.products div.block-spec p.diagram {
	max-width: 820px;
	margin-left: 80px;
}
body.bury-drain main article.products div.block-spec div.diagram-table-wrapper p.diagram {
	max-width: 340px;
}
body.seal-drain main article.products div.block-spec div.diagram-table-wrapper p.diagram {
	max-width: 510px;
}
body.mitsuba-drain main article.products div.block-spec div.diagram p.row {
	max-width: 350px;
}
body.driven-in-drain main article.products div.block-spec div.diagram-table-wrapper p.diagram {
	max-width: 545px;
}
body.mizuderun main article.products div.block-spec div.diagram-table-wrapper p.diagram {
	max-width: 220px;
}
body.slope-drain main article.products div.block-spec div.diagram p.row-01 {
	max-width: 450px;
}
body.slope-drain main article.products div.block-spec div.diagram p.row-02 {
	max-width: 400px;
}
main article.products div.block-example div.list {
	padding: 40px;
	background-color: #f0f4f9;
	border-radius: 10px;
}
main article.products div.block-example div.list div.row:not(:last-child) {
	margin-bottom: 40px;
}
main article.products div.block-example div.list div.row > h3 {
	margin-bottom: 20px;
}
main article.products div.block-example div:where(.headline-diagram, .image-diagram) {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}
main article.products div.block-example div.headline-diagram :where(h3, p.diagram),
main article.products div.block-example div.image-diagram p:where(.image, .diagram) {
	width: calc(50% - 10px);
}
body.driven-in-drain main article.products div.block-example p.diagram {
	max-width: 305px;
	margin-left: 120px;
}
body.mizuderun main article.products div.block-example div.list-alternate div.row {
	display: flex;
	flex-wrap: wrap;
}
body.mizuderun main article.products div.block-example div.list-alternate div.row:not(:last-child) {
	margin-bottom: 80px;
}
body.mizuderun main article.products div.block-example div.list-alternate div.row h3 {
	margin: 120px 40px 0px 80px;
}
body.mizuderun main article.products div.block-example div.list-alternate div.row-01 p.diagram {
	max-width: 630px;
}
body.mizuderun main article.products div.block-example div.list-alternate div.row-02 p.diagram {
	max-width: 480px;
}
body.slope-drain main article.products div.block-example div.list-alternate {
	margin: 0px -80px -80px 0px;
}
body.slope-drain main article.products div.block-example div.list-alternate {
	display: flex;
	flex-wrap: wrap;
}
body.slope-drain main article.products div.block-example div.list-alternate div.row {
	margin: 0px 80px 80px 0px;
}
body.slope-drain main article.products div.block-example div.list-alternate div.row h3 {
	margin-bottom: 40px;
}
body.slope-drain main article.products div.block-example div.list-alternate div.row-01 p.diagram {
	max-width: 410px;
}
body.slope-drain main article.products div.block-example div.list-alternate div.row-02 p.diagram {
	max-width: 510px;
}
body.slope-drain main article.products div.block-example div.list-alternate div.row-03 div.diagram-table-wrapper {
	display: flex;
	flex-wrap: wrap;
}
body.slope-drain main article.products div.block-example div.list-alternate div.row-03 p.diagram {
	max-width: 470px;
	margin-right: 80px;
}
body.slope-drain main article.products div.block-example div.list-alternate div.row-03 table {
	width: 450px;
}
body.slope-drain main article.products div.block-example div.list-alternate div.row-03 table tbody td {
	width: 90px;
}
body.slope-drain main article.products div.block-example div.list-alternate div.row-04 p.diagram {
	max-width: 340px;
}
body.slope-drain main article.products div.block-example div.list-alternate div.row-05 p.diagram {
	max-width: 560px;
}
main article.products div.block-products-alternate h3 {
	margin-bottom: 40px;
}
main article.products div.block-products-alternate div.diagram-table-wrapper {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
main article.products div.block-products-alternate div.diagram-table-wrapper:not(:last-child) {
	margin-bottom: 80px;
}
main article.products div.block-products-alternate div.diagram-table-wrapper p.diagram {
	margin-right: 80px;
}
body.extrusions main article.products div.block-products-alternate div.diagram-table-wrapper p.diagram {
	max-width: 270px;
	margin-left: 120px;
}
main article.products div.block-works div.list-works-wrapper {
	margin-bottom: -40px;
}
main article.products div.block-works div.list-works {
	height: 0px;
	overflow: hidden;
	margin-bottom: 0px;
	opacity: 0;
	transition: 0.25s opacity ease;
}
main article.products div.block-works div.list-works.active {
	height: auto;
	opacity: 1;
}
main article.products div.block-works div.list-works div.row div.text :where(div.category, p.products) {
	display: none;
}
main article.products div.block-works div.navi,
main article.products div.block-works div.navi ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
main article.products div.block-works div.navi {
	align-items: center;
	margin-top: 40px;
}
main article.products div.block-works div.navi p.button,
main article.products div.block-works div.navi ul li {
	cursor: pointer;
}
main article.products div.block-works div.navi p.button {
	visibility: hidden;
	pointer-events: none;
}
main article.products div.block-works div.navi p.button.active {
	visibility: visible;
	pointer-events: auto;
}
main article.products div.block-works div.navi p.button span.arrow {
	color: #ffffff;
	background-color: #696969;
}
main article.products div.block-works div.navi p.button:hover span.arrow::before {
	opacity: 1;
	transform: scale(1.025);
}
main article.products div.block-works div.navi p.button-prev {
	margin-right: 40px;
}
main article.products div.block-works div.navi p.button-prev span.arrow {
	transform: scaleX(-1);
}
main article.products div.block-works div.navi p.button-next {
	margin-left: 40px;
}
main article.products div.block-works div.navi ul li {
	color: #999999;
	margin: 0px 10px;
	transition: 0.25s color ease;
}
main article.products div.block-works div.navi ul li:hover,
main article.products div.block-works div.navi ul li.active {
	color: #1a1a1a;
}
main article.products div.block-faq div.segment-faq-wrapper {
	padding: 80px 40px;
	background-color: #f0f4f9;
	border-radius: 10px;
}
main article.products div.block-faq div.segment-faq h3 span {
	background-color: #4d85c7;
}
main div#search {
	margin-bottom: 80px;
}
main div#search div.headline-form {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}
main div#search h2 {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	position: relative;
	width: calc(4em + 55px);
	font-size: 2rem;
	font-weight: 500;
	line-height: 2.75rem;
	color: #2a5cac;
	padding-bottom: 5px;
}
main div#search h2,
main div#search div.detail p.button-clear {
	cursor: pointer;
}
main div#search h2 span {
	position: absolute;
	width: 35px;
	height: 35px;
	right: 0px;
	top: calc(50% - 17.5px);
	overflow: hidden;
	background-color: #2a5cac;
	border-radius: 50%;
}
main div#search h2 span::before,
main div#search h2 span i {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
}
main div#search h2 span::before {
	content: "";
	opacity: 0;
	background-color: #404040;
	border-radius: 50%;
	transform: scale(0);
	transition: 0.25s opacity ease, 0.25s transform ease;
}
main div#search h2:hover span::before {
	opacity: 1;
	transform: scale(1.025);
}
main div#search h2 span i {
	z-index: 1;
}
main div#search h2 span i::before,
main div#search h2 span i::after {
	position: absolute;
	width: 10px;
	height: 0px;
	left: calc(50% - 5px);
	top: calc(50% - 1px);
	border-bottom: 2px solid #ffffff;
	content: "";
	transition: 0.25s opacity ease, 0.25s transform ease;
}
main div#search h2 span i::after {
	transform: rotate(90deg);
}
main div#search.open h2 span i::before {
	opacity: 0;
	transform: rotate(90deg);
}
main div#search.open h2 span i::after {
	transform: rotate(180deg);
}
main div#search form {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 600px;
}
main div#search form p.label {
	width: 160px;
	font-size: 1.125rem;
	font-weight: 500;
	color: #4d85c7;
}
main div#search form input[type=text] {
	width: calc(100% - 250px);
	margin-right: 10px;
}
main div#search form button {
	width: 80px;
}
main div#search div.detail {
	height: 0px;
	overflow: hidden;
}
main div#search div.detail div.inner-detail {
	position: relative;
	margin-top: 20px;
	padding: 40px;
	background-color: #f0f4f9;
	border-radius: 10px;
}
main div#search div.detail p.button-clear {
	position: absolute;
	right: 40px;
	bottom: 40px;
}
main div#search div.detail p.button-clear span {
	justify-content: center;
	width: 80px;
	padding: 0px;
}
main div#search div.detail div.segment:not(:last-child) {
	margin-bottom: 40px;
}
main div#search div.detail div.segment:last-child {
	padding-right: 55px;
}
main div#search div.detail div.segment p.label {
	font-size: 1.125rem;
	font-weight: 500;
	color: #4d85c7;
	margin-bottom: 10px;
}
main div#search div.detail div.segment ul {
	display: flex;
	flex-wrap: wrap;
	margin: 0px -10px -10px 0px;
}
main div#search div.detail div.segment ul li {
	font-weight: 500;
	line-height: 1rem;
	cursor: pointer;
	margin: 0px 10px 10px 0px;
	padding: 10px;
	background-color: #ffffff;
	border-radius: 5px;
	transition: 0.25s color ease, 0.25s background-color ease;
}
main div#search div.detail div.segment ul li.active {
	color: #ffffff;
	background-color: #4d85c7;
}

/* news, column
-------------------------------------------------------------------------------- */

main div.created-category {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}
main div.created-category {
	margin-bottom: 10px;
}
main div.created-category p.created {
	width: 100px;
	font-size: 0.875rem;
	font-weight: 500;
}
main div.created-category p.created:has(span) {
	width: 220px;
}
main div.created-category p.created span {
	margin-left: 5px;
}
main div.created-category div.category ul,
main div.created-category div.category ul li {
	display: flex;
	flex-wrap: wrap;
}
main div.created-category div.category ul {
	margin-bottom: -10px;
}
main div.created-category div.category ul li {
	justify-content: center;
	align-items: center;
	height: 25px;
	overflow: hidden;
	font-size: 0.75rem;
	font-weight: 500;
	line-height: 1rem;
	color: #ffffff;
	margin-bottom: 10px;
	padding: 0px 10px;
	background-color: #ea8a43;
	border-radius: 12.5px;
}
main div.created-category div.category ul li:not(:last-child) {
	margin-right: 5px;
}
main div.list-news-column div.row a,
main div.list-news-alternate div.row a,
main div.list-column-alternate {
	display: flex;
	flex-wrap: wrap;
}
main div.list-news-column div.row a {
	justify-content: space-between;
	align-items: center;
	position: relative;
}
main div.list-news-column div.row:not(:last-child) {
	margin-bottom: 60px;
}
main div.list-news-column div.row p.image,
main div.list-column-alternate div.row p.image {
	aspect-ratio: 350 / 230;
}
main div.list-news-column div.row p.image {
	border-radius: 10px;
}
main div.list-news-column div.row p.image img,
main div.list-column-alternate div.row p.image img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}
main div.list-news-column div.row p.image {
	width: 350px;
}
main div.list-news-column div.row div.text {
	width: calc(100% - 410px);
}
main div.list-news-column div.row div.text h3,
main div.list-news-alternate div.row h3 {
	font-size: 1rem;
	font-weight: 500;
	padding-right: 55px;
	transition: 0.25s color ease;
}
main div.list-news-column div.row div.text h3 {
	position: relative;
	margin-bottom: 20px;
}
main div.list-news-column div.row a:hover div.text h3,
main div.list-news-alternate div.row a:hover h3 {
	color: #4d85c7;
}
main div.list-news-column div.row div.text h3 span.arrow,
main div.list-news-alternate div.row h3 span.arrow,
main div.list-column-alternate div.row div.text h3 span.arrow {
	position: absolute;
	width: 35px;
	height: 35px;
	right: 0px;
	top: -3.5px;
	font-size: 0.5rem;
}
main div.list-news-column div.row div.text h3 span.arrow {
	color: #ffffff;
	background-color: #696969;
}
main div.list-news-column div.row div.text p.more-alternate {
	display: none;
}
main div.list-news-alternate div.row {
	align-items: center;
	border-bottom: 1px solid #ffffff;
	padding-bottom: 30px;
}
main div.list-news-alternate div.row:not(:last-child) {
	margin-bottom: 30px;
}
main div.list-news-alternate div.row a {
	align-items: flex-start;
}
main div.list-news-alternate div.row div.created-category {
	width: 230px;
	margin-bottom: 0px;
}
main div:where(.list-news-alternate, .list-column-alternate) div.row div.created-category div.category ul li:not(:first-child) {
	display: none;
}
main div.list-news-alternate div.row h3 {
	position: relative;
	width: calc(100% - 230px);
}
main div.list-column-alternate {
	margin: 0px -40px -40px 0px;
}
main div.list-column-alternate div.row {
	position: relative;
	width: calc(33.33% - 40px);
	overflow: hidden;
	margin: 0px 40px 40px 0px;
	background-color: #f0f4f9;
	border-radius: 10px;
}
main div.list-column-alternate div.row a {
	display: block;
	height: 100%;
}
main div.list-column-alternate div.row div.text {
	padding: 20px 20px 60px 20px;
}
main div.list-column-alternate div.row div.text h3 {
	position: relative;
	font-size: 1rem;
	font-weight: 500;
}
main div.list-column-alternate div.row div.text span.arrow {
	position: absolute;
	width: 35px;
	height: 35px;
	right: 20px;
	bottom: 20px;
	font-size: 0.5rem;
}
main article.news-column header {
	margin-bottom: 30px;
}
main article.news-column header div.created-category {
	margin-bottom: 20px;
}
main article.news-column header h1 {
	text-align: left;
	font-size: 1.75rem;
	font-weight: 500;
	line-height: 2.5rem;
	letter-spacing: 0.05em;
}

/* sustainability
-------------------------------------------------------------------------------- */

main section#basic header {
	margin-bottom: 120px;
}
main section#basic header p.image {
	padding: 80px;
	background-color: #f2f2f2;
	border-radius: 10px;
}
main section:where(#basic, #contribution, #activity) h2 {
	position: relative;
	text-align: center;
	font-size: 1.375rem;
	font-weight: 500;
	margin-bottom: 70px;
}
main section:where(#basic, #contribution, #activity) h2::before {
	position: absolute;
	width: 40px;
	height: 0px;
	left: calc(50% - 20px);
	bottom: -30px;
	border-bottom: 1px solid #1a1a1a;
	content: "";
}
main section#basic div.headline-symbol {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	margin-bottom: 40px;
}
main section#basic div.headline-symbol p.headline {
	font-size: 2.5rem;
	font-weight: 500;
	line-height: 3.5rem;
	margin-right: 60px;
}
main section#basic div.headline-symbol p.symbol {
	width: 345px;
}
main section#basic div.headline-symbol p.symbol img {
	width: 100%;
}
main section:where(#basic, #contribution) p.description {
	padding: 0px 80px;
}
main section:where(#basic, #contribution) p.description strong {
	font-size: 1.125rem;
	font-weight: 500;
}
main section#contribution p.logo {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-bottom: 80px;
}
main section#contribution p.logo img {
	width: 590px;
}
main section#activity div.list div.row {
	padding: 80px;
	background-color: #f0f4f9;
	border-radius: 10px;
}
main section#activity div.list div.row:not(:last-child) {
	margin-bottom: 40px;
}
main section#activity div.list div.row div.icon-text {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	align-items: center;
}
main section#activity div.list div.row:has(div.busters) div.icon-text {
	border-bottom: 1px solid #999999;
	margin-bottom: 80px;
	padding-bottom: 80px;
}
main section#activity div.list div.row div.icon-text p.icon {
	width: 215px;
}
main section#activity div.list div.row div.icon-text p.icon img {
	width: 100%;
}
main section#activity div.list div.row div.icon-text div.text {
	width: calc(100% - 275px);
}
main section#activity div.list div.row div.icon-text div.text h3 {
	font-size: 1.375rem;
	font-weight: 500;
	margin-bottom: 20px;
}
main section#activity div.list div.row div.busters {
	padding: 0px 40px;
}
main section#activity div.list div.row div.busters p.image {
	margin-bottom: 20px;
	border-radius: 10px;
}
main section#activity div.list div.row div.busters h4 {
	font-size: 1.375rem;
	font-weight: 500;
	margin-bottom: 20px;
}
main section#activity div.list div.row div.busters p.description {
	width: calc(100% - 440px);
}
main section#activity div.list div.row div.busters p.button-default {
	justify-content: flex-end;
	font-size: 1.125rem;
}
main section#activity div.list div.row div.busters p.button-default {
	margin-top: -100px;
}
main section#activity div.list div.row div.busters p.button-default a {
	width: 380px;
	height: 100px;
}
main section#activity div.list div.row div.busters p.button-default span.arrow {
	width: 50px;
	height: 50px;
	right: 20px;
	top: calc(50% - 25px);
	font-size: 0.625rem;
}

/* works
-------------------------------------------------------------------------------- */

main div.list-works {
	display: flex;
	flex-wrap: wrap;
	margin: 0px -20px -40px 0px;
}
main div.list-works div.row {
	width: calc(33.33% - 20px);
	cursor: pointer;
	margin: 0px 20px 40px 0px;
}
main div.list-works div.row p.image {
	aspect-ratio: 280 / 210;
	margin-bottom: 10px;
	border-radius: 10px;
}
main div.list-works div.row p.image img {
	object-fit: cover;
	width: 100%;
	height: 100%;
	transition: 0.375s transform ease;
}
main div.list-works div.row:hover p.image img {
	transform: scale(1.0375);
}
main div.list-works div.row div.text {
	text-align: center;
}
main div.list-works div.row div.text div.category ul {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}
main div.list-works div.row div.text div.category ul li {
	font-size: 0.875rem;
}
main div.list-works div.row div.text div.category ul li:not(:last-child) {
	margin-right: 1em;
}
main div.list-works div.row div.text p.products {
	font-size: 1.125rem;
	font-weight: 500;
	margin-bottom: 5px;
}
main div.list-works div.row div.text h3 {
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 1.5rem;
	color: #999999;
}

/* faq
-------------------------------------------------------------------------------- */

main div.segment-faq {
	border-bottom: 1px solid #999999;
}
main div.segment-faq:first-child {
	margin-top: -40px;
}
main div.segment-faq h3 {
	position: relative;
	font-size: 1.375rem;
	font-weight: 500;
	cursor: pointer;
	padding: 40px 90px 40px 20px;
	transition: 0.25s color ease;
}
main div.segment-faq h3:hover {
	color: #4d85c7;
}
main div.segment-faq h3 span {
	position: absolute;
	width: 50px;
	height: 50px;
	right: 20px;
	top: calc(50% - 25px);
	overflow: hidden;
	cursor: pointer;
	background-color: #696969;
	border-radius: 50%;
}
main div.segment-faq h3 span::before,
main div.segment-faq h3 span i {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
}
main div.segment-faq h3 span::before {
	content: "";
	opacity: 0;
	background-color: #404040;
	border-radius: 50%;
	transform: scale(0);
	transition: 0.25s opacity ease, 0.25s transform ease;
}
main div.segment-faq h3:hover span::before {
	opacity: 1;
	transform: scale(1.025);
}
main div.segment-faq h3 span i {
	z-index: 1;
}
main div.segment-faq h3 span i::before,
main div.segment-faq h3 span i::after {
	position: absolute;
	width: 12px;
	height: 0px;
	left: calc(50% - 6px);
	top: calc(50% - 1px);
	border-bottom: 2px solid #ffffff;
	content: "";
	transition: 0.25s opacity ease, 0.25s transform ease;
}
main div.segment-faq h3 span i::after {
	transform: rotate(90deg);
}
main div.segment-faq.open h3 span i::before {
	opacity: 0;
	transform: rotate(90deg);
}
main div.segment-faq.open h3 span i::after {
	transform: rotate(180deg);
}
main div.segment-faq div.list-faq {
	height: 0px;
	overflow: hidden;
	pointer-events: none;
}
main div.segment-faq.open div.list-faq {
	pointer-events: auto;
}
main div.list-faq div.row {
	padding: 40px 0px 40px 40px;
}
main div.list-faq div.row:first-child {
	padding-top: 0px;
}
main div.list-faq div.row:not(:last-child) {
	border-bottom: 1px solid #999999;
}
main div.list-faq div.row h4,
main div.list-faq div.row div.answer {
	position: relative;
}
main div.list-faq div.row h4 {
	font-size: 1.125rem;
	font-weight: 500;
	margin-bottom: 25px;
	padding-left: 50px;
}
main div.list-faq div.row h4::before,
main div.list-faq div.row div.answer::before {
	position: absolute;
	width: 40px;
	height: 50px;
	top: -6px;
	font-size: 2.5rem;
	font-weight: 500;
	line-height: 2.5rem;
	color: transparent;
}
main div.list-faq div.row h4::before {
	left: 0px;
	color: #4d85c7;
	content: "Q";
}
main div.list-faq div.row div.answer {
	padding-left: 100px;
}
main div.list-faq div.row div.answer::before {
	left: 50px;
	color: #57b2b2;
	content: "A";
}
main div.list-faq div.row div.answer div.body {
	margin-bottom: 40px;
}
main div.list-faq div.row div.answer div.category-products,
main div.list-faq div.row div.answer div.category-products div:where(.category, .products),
main div.list-faq div.row div.answer div.category-products div:where(.category, .products) ul {
	display: flex;
	flex-wrap: wrap;
}
main div.list-faq div.row div.answer div.category-products {
	margin-left: -50px;
}
main div.list-faq div.row div.answer div.category-products div:where(.category, .products) {
	align-items: center;
	font-size: 0.875rem;
	line-height: 1.5rem;
}
main div.list-faq div.row div.answer div.category-products div:where(.category, .products):not(:last-child) {
	margin-right: 20px;
}
main div.list-faq div.row div.answer div.category-products div:where(.category, .products) p.label {
	font-size: 0.75rem;
	margin-right: 5px;
}
main div.list-faq div.row div.answer div.category-products div:where(.category, .products) ul li:not(:last-child)::after {
	content: "、";
}

/* form
-------------------------------------------------------------------------------- */

main section.form div.header {
	margin-bottom: 80px;
}
main section.form div.mw_wp_form_preview div.header {
	display: none;
}
main section.form div.form div.component {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	margin-bottom: 40px;
}
main section.form div.form div.component-catalog {
	margin-right: -120px;
}
main section.form div.mw_wp_form_preview div.form div.component {
	border-bottom: 1px solid #999999;
	margin-bottom: 0px;
	padding: 40px 20px;
}
main section.form div.mw_wp_form_preview div.form div.component-first {
	border-top: 1px solid #999999;
}
main section.form div.mw_wp_form_preview div.form div.component-last {
	margin-bottom: 60px;
}
main section.form div.form div.component p.label {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: 220px;
	height: 50px;
	font-weight: 500;
}
main section.form div.mw_wp_form_preview div.form div.component p.label {
	display: block;
	height: auto;
}
main section.form div.form div.component p.label span.require {
	margin-left: 10px;
}
main section.form div.mw_wp_form_preview div.form div.component p.label span.require {
	display: none;
}
main section.form div.form div.component div.body {
	width: calc(100% - 220px);
}
main section.form div.form div:where(.component-catalog, .component-name, .component-name-furigana) div.body {
	display: flex;
	flex-wrap: wrap;
}
main section.form div.mw_wp_form_preview div.form div:where(.component-radio, .component-checkbox) div.body {
	padding-top: 0px;
}
main section.form div.form div.component-name div.body div:where(.name-sei, .name-mei),
main section.form div.form div.component-name-furigana div.body div:where(.name-furigana-sei, .name-furigana-mei) {
	width: calc(50% - 5px);
}
main section.form div.mw_wp_form_preview div.form div.component-name div:where(.name-sei, .name-mei),
main section.form div.mw_wp_form_preview div.form div.component-name-furigana div.body div:where(.name-furigana-sei, .name-furigana-mei) {
	width: auto;
}
main section.form div.form div.component-name div.body div.name-sei,
main section.form div.form div.component-name-furigana div.body div.name-furigana-sei {
	margin-right: 10px;
}
main section.form div.form div.component div.body div.list div.row {
	display: flex;
	flex-wrap: wrap;
}
main section.form div.form div.component div.body div.list div.row:not(:last-child) {
	margin-bottom: 20px;
}
main section.form div.form div.component div.body div.list div.row p.label-row,
main section.form div.form div.component div.body div.list div.row div.body-row p:where(.separate, #button-auto, .note) {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	height: 50px;
}
main section.form div.form div.component div.body div.list div.row p.label-row {
	width: 100px;
}
main section.form div.mw_wp_form_preview div.form div.component div.body div.list div.row p.label-row,
main section.form div.mw_wp_form_preview div.form div.component div.body div.list div.row div.body-row p.separate {
	display: block;
	height: auto;
}
main section.form div.mw_wp_form_preview div.form div.component div.body div.list div.row p.label-row {
	width: 120px;
}
main section.form div.form div.component div.body div.list div.row div.body-row {
	display: flex;
	flex-wrap: wrap;
	position: relative;
	width: calc(100% - 100px);
}
main section.form div.mw_wp_form_preview div.form div.component div.body div.list div.row div.body-row {
	width: calc(100% - 120px);
}
main section.form div.form div.component div.body div.list div.row div.body-row div.postal-code-01 {
	width: 90px;
}
main section.form div.mw_wp_form_preview div.form div.component div.body div.list div.row div.body-row div.postal-code-01 {
	width: auto;
}
main section.form div.form div.component div.body div.list div.row div.body-row div.postal-code-02 {
	width: 110px;
	margin-right: 10px;
}
main section.form div.form div.component div.body div.list div.row div.body-row div.postal-code-alternate {
	width: 185px;
	margin-right: 10px;
}
main section.form div.form div.component div.body div.list div.row div.body-row p:where(.separate, #button-auto) {
	justify-content: center;
	text-align: center;
}
main section.form div.form div.component div.body div.list div.row div.body-row p.separate {
	width: 20px;
}
main section.form div.form div.component div.body div.list div.row div.body-row p:where(#button-auto, .note) {
	font-size: 0.875rem;
	line-height: 1.25rem;
}
main section.form div.form div.component div.body div.list div.row div.body-row p#button-auto {
	position: relative;
	width: 90px;
	overflow: hidden;
	font-weight: 500;
	color: #ffffff;
	cursor: pointer;
	margin-right: 10px;
	background-color: #4d85c7;
	border-radius: 10px;
}
main section.form div.mw_wp_form_preview div.form div.component div.body div.list div.row div.body-row p:where(#button-auto, .note) {
	display: none;
}
main section.form div.form div.component div.body div.list div.row div.body-row p#button-auto::before {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	background: linear-gradient(115deg, #4561d8 -25%, #57b2b2);
	content: "";
	opacity: 0;
	transition: 0.25s opacity ease;
}
main section.form div.form div.component div.body div.list div.row div.body-row p#button-auto:hover::before {
	opacity: 1;
}
main section.form div.form div.component div.body div.list div.row div.body-row p#button-auto span {
	position: relative;
}
main section.form div.form div.component div.body :where(input:where([type=text], [type=email]), select, textarea) {
	width: 100%;
}
main section.form div.form textarea[name=download_url] {
	display: none;
}
main section.form div.form div.component div.body span:where(.mwform-radio-field, .mwform-checkbox-field) {
	margin: 9px 0px 0px 0px;
}
main section.form div.form div.component div.body span.mwform-radio-field.horizontal-item,
main section.form div.form div.component:not(.component-catalog) div.body span.mwform-checkbox-field.horizontal-item {
	display: inline-block;
}
main section.form div.form div.component div.body span.mwform-radio-field.horizontal-item:not(:last-child),
main section.form div.form div.component:not(.component-catalog) div.body span.mwform-checkbox-field.horizontal-item:not(:last-child) {
	margin-right: 20px;
}
main section.form div.form div.component-catalog div.body span.mwform-checkbox-field {
	width: 33.33%;
	margin-right: 0px;
}
main section.form div.form div.component div.body span.error,
main section.form div.form div.agreement span.error {
	font-size: 0.875rem;
	color: #4d85c7;
}
main section.form div.form div.component-catalog div.body span.error {
	width: 100%;
}
main section.form div.form div.agreement {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	width: calc(100% - 220px);
	position: relative;
	margin: 0px 0px 60px auto;
}
main section.form div.mw_wp_form_preview div.form div.agreement {
	display: none;
}
main section.form div.form div.agreement span.horizontal-item {
	margin-right: 5px;
}
main section.form div.form div.agreement span.mwform-checkbox-field-text {
	display: none;
}
main section.form div.form div.agreement span.error {
	position: absolute;
	right: 0px;
	top: 0px;
}
main section.form div.form div.agreement p.note {
	width: 100%;
	padding: 10px 0px 0px 35px;
}
main section.form div.form div.action {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	padding-left: 220px;
}
main section.form div.mw_wp_form_preview div.form div.action {
	padding-left: 0px;
}
main section.form div.form div.action button {
	width: 100%;
	height: 100px;
	font-size: 1.125rem;
}
main section.form div.mw_wp_form_preview div.form div.action button {
	width: calc(50% - 10px);
}
main section.form div.form div.action button:not(:last-child) {
	margin-right: 20px;
}
main section.form div.mw_wp_form_complete p.description {
	text-align: center;
}
main section.form div.form div:has(> input[name=download_url]) {
	display: none;
}
main section#contact div.header div.list div.row:not(:last-child) {
	margin-bottom: 40px;
}
main section#contact div.header div.list div.row p.label {
	font-weight: 500;
	margin-bottom: 10px;
}
main section#contact div.header div.list div.row-tel p.tel {
	font-weight: 500;
}
main section#contact div.header div.list div.row-tel p.tel span.prefix {
	font-size: 1.375rem;
	margin-right: 10px;
}
main section#contact div.header div.list div.row-tel p.tel span.number {
	font-size: 1.75rem;
	margin-right: 10px;
}
main section#contact div.header div.list div.row-mail p.description,
main section#catalog div.header p.description {
	margin-bottom: 20px;
}
main section#catalog div.header h2 {
	font-size: 1.125rem;
	font-weight: 500;
	line-height: 2rem;
	letter-spacing: 0.05em;
	margin-bottom: 40px;
}
main section#catalog div.catalog {
	position: relative;
	margin-bottom: 80px;
	padding: 80px 0px;
}
main section#catalog div.catalog::before {
	position: absolute;
	width: 100vw;
	height: 100%;
	left: calc(50% - 50vw);
	top: 0px;
	background-color: #f0f4f9;
	content: "";
}
main section#catalog div.mw_wp_form_preview div.catalog {
	display: none;
}
main section#catalog div.catalog :where(p.description, div.list) {
	position: relative;
}
main section#catalog div.catalog p.description {
	text-align: center;
	font-weight: 500;
	margin-bottom: 60px;
}
main section#catalog div.catalog div.list {
	display: flex;
	flex-wrap: wrap;
	margin: 0px -20px -20px 0px;
}
main section#catalog div.catalog div.list div.row {
	width: calc(25% - 20px);
	margin: 0px 20px 20px 0px;
	padding: 30px 30px 15px 30px;
	background-color: #ffffff;
	border-radius: 10px;
	box-shadow: 2.5px 2.5px 7.5px rgba(0, 0, 0, 0.05);
}
main section#catalog div.catalog div.list div.row label {
	display: block;
}
main section#catalog div.catalog div.list div.row p.image {
	cursor: pointer;
	margin-bottom: 15px;
}
main section#catalog div.catalog div.list div.row div.label-text {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 0px -10px;
}
main section#catalog div.catalog div.list div.row div.label-text span.text {
	display: block;
	width: calc(100% - 35px);
	min-height: 3rem;
	line-height: 1.5rem;
}
main section#catalog-download div.list {
	display: flex;
	flex-wrap: wrap;
	margin: 0px -20px -20px 0px;
}
main section#catalog-download div.list div.row {
	width: calc(25% - 20px);
	margin: 0px 20px 20px 0px;
	padding: 30px 30px 15px 30px;
	background-color: #ffffff;
	border-radius: 10px;
	box-shadow: 2.5px 2.5px 7.5px rgba(0, 0, 0, 0.05);
}
main section#catalog-download div.list div.row p.image {
	cursor: pointer;
	margin-bottom: 15px;
}
main section#catalog-download div.list div.row p.image img {
	transition: 0.25s opacity ease;
}
main section#catalog-download div.list div.row p.image a:hover img {
	opacity: 0.875;
}
main section#catalog-download div.list div.row p.label {
	position: relative;
	line-height: 1.5rem;
	padding-right: 30px;
}
main section#catalog-download div.list div.row p.label i.icon {
	position: absolute;
	right: 0px;
	top: 3px;
	font-size: 1.125rem;
	margin-left: 5px;
}

/* site-map
-------------------------------------------------------------------------------- */

main section#site-map ul {
	display: flex;
	flex-wrap: wrap;
	margin: 0px -50px -20px 0px;
}
main section#site-map ul li {
	width: calc(33.33% - 50px);
	margin: 0px 50px 20px 0px;
}
main section#site-map ul li.products {
	width: calc(100% - 50px);
}
main section#site-map ul li a {
	display: block;
	position: relative;
	font-size: 1.125rem;
	font-weight: 500;
	color: #4d85c7;
	border-bottom: 1px solid #4d85c7;
	padding: 20px 0px;
	transition: 0.25s color ease;
}
main section#site-map ul li a:hover {
	color: #1a1a1a;
}
main section#site-map ul li a span.arrow {
	position: absolute;
	width: 35px;
	height: 35px;
	right: 0px;
	top: 18px;
	font-size: 0.5rem;
	color: #ffffff;
	background-color: #4d85c7;
	transition: 0.25s background-color ease;
}
main section#site-map div.nest {
	padding: 30px 0px;
}
main section#site-map div.nest ul li a {
	height: auto;
	font-size: 1rem;
	font-weight: 500;
	color: #1a1a1a;
	border-bottom: none;
	padding: 0px 0px 0px 35px;
}
main section#site-map div.nest ul li a:hover {
	color: #4d85c7;
}
main section#site-map div.nest ul li a span.arrow {
	width: 25px;
	height: 25px;
	left: 0px;
	right: auto;
	top: 3px;
	font-size: 0.375rem;
	background-color: #696969;
}
main section#site-map div.nest ul li a span.arrow::before {
	background-color: #404040;
}

/* privacy-policy
-------------------------------------------------------------------------------- */

main section#privacy-policy div.list div.row:not(:last-child) {
	margin-bottom: 60px;
}
main section#privacy-policy div.list div.row h2 {
	font-size: 1.125rem;
	font-weight: 500;
	margin-bottom: 15px;
}
main section#privacy-policy div.list div.row ul:not(:last-child) {
	margin-bottom: 1.75rem;
}
main section#privacy-policy div.list div.row ul li {
	position: relative;
	padding-left: 1.5em;
}
main section#privacy-policy div.list div.row ul li span {
	position: absolute;
	left: 0px;
	top: 0px;
}



/* --------------------------------------------------------------------------------
modal
-------------------------------------------------------------------------------- */

div#modal {
	position: fixed;
	width: 100%;
	height: 0%;
	left: 0px;
	top: 0px;
	overflow: auto;
	z-index: 9999;
	color: #ffffff;
	pointer-events: none;
	opacity: 0;
	transition: 0.25s opacity ease;
	-webkit-overflow-scrolling: touch;
}
div#modal.active {
	height: 100%;
	pointer-events: auto;
}
div#modal.fade {
	opacity: 1;
}
div#modal::before,
div#modal div.inner-modal {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
}
div#modal::before {
	background-color: rgba(0, 0, 0, 0.875);
	content: "";
}
div#modal div.inner-modal {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	overflow: auto;
	padding: 40px 0px;
}
div#modal div.inner-modal::-webkit-scrollbar {
	display: none;
}
div#modal p.button-close {
	position: fixed;
	width: 60px;
	height: 60px;
	right: 40px;
	top: 40px;
	z-index: 10;
	cursor: pointer;
}
body.admin-bar div#modal p.button-close {
	top: 72px;
}
div#modal p.button-close::before,
div#modal p.button-close::after {
	position: absolute;
	width: 60px;
	height: 0px;
  left: calc(50% - 30px);
	top: calc(50% - 10.5px);
	border-bottom: 1px solid #ffffff;
	content: "";
}
div#modal p.button-close::before {
	transform: rotate(15deg);
}
div#modal p.button-close::after {
	transform: rotate(-15deg);
}
div#modal p.button-close span {
	position: absolute;
	width: 100%;
	left: 0px;
	bottom: 10px;
	text-align: center;
	font-size: 0.75rem;
	line-height: 1.25rem;
	color: #ffffff;
}
div#modal p.button-close span::before {
	content: "CLOSE";
}
div#modal div.slide {
	position: relative;
	width: calc(100% - 160px);
	max-width: 860px;
}
div#modal div.slide div.list div.row {
	position: relative;
	height: 0px;
	overflow: hidden;
}
div#modal div.slide div.list div.row.active {
	height: auto;
}
div#modal div.slide div.list div.row div.image {
	position: relative;
	aspect-ratio: 2000 / 1500;
	margin-bottom: 10px;
}
div#modal div.slide div.list div.row div.image p.row-image {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
}
div#modal div.slide div.list div.row div.image p.row-image img {
	object-fit: cover;
	width: 100%;
	height: 100%;
}
div#modal div.slide div.list div.row div.text h3 {
	font-size: 1rem;
	font-weight: 500;
	margin-bottom: 20px;
}
div#modal div.slide div.list div.row div.text div.category ul {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 5px;
}
div#modal div.slide div.list div.row div.text div.category ul li:not(:last-child) {
	margin-right: 1em;
}
div#modal div.slide div.list div.row div.text p.products {
	font-size: 1.375rem;
	font-weight: 500;
	padding-right: 270px;
}
div#modal div.slide div.list div.row div.text div.navi {
	display: flex;
	flex-wrap: wrap;
	position: absolute;
	right: 0px;
	bottom: 0px;
}
div#modal div.slide div.list div.row div.text div.navi p.button {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 120px;
	height: 40px;
	overflow: hidden;
	cursor: pointer;
	background-color: #4d85c7;
	border-radius: 20px;
	transition: 0.25s filter ease;
	filter: brightness(0.625);
}
div#modal div.slide div.list div.row div.text div.navi p.button:where(:hover, .active) {
	filter: brightness(1);
}
div#modal div.slide div.list div.row div.text div.navi p.button:not(:last-child) {
	margin-right: 10px;
}
div#modal div.slide div.list div.row div.text div.navi p.button::before {
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0px;
	top: 0px;
	content: "";
	background: linear-gradient(115deg, #4561d8, #57b2b2);
	transition: 0.25s opacity ease;
}
div#modal div.slide div.list div.row div.text div.navi p.button:hover::before {
	opacity: 0;
}
div#modal div.slide div.list div.row div.text div.navi p.button span {
	position: relative;
}



/* --------------------------------------------------------------------------------
footer
-------------------------------------------------------------------------------- */

footer#footer {
	position: relative;
}
footer#footer p#button-page-top {
	position: fixed;
	right: 20px;
	bottom: 20px;
	z-index: 10;
	pointer-events: none;
	opacity: 0;
	transition: 0.25s opacity ease;
}
div.scroll footer#footer p#button-page-top {
	pointer-events: auto;
	opacity: 1;
}
footer#footer p#button-page-top span.arrow {
	color: #ffffff;
	background-color: #ea8a43;
}
footer#footer p#button-page-top span.arrow::before {
	background-color: #404040;
}
footer#footer p#button-page-top span.arrow::after {
	transform: rotate(-90deg);
}
footer#footer div.contact {
	padding: 80px 0px;
}
footer#footer div.contact p.description {
	text-align: center;
	margin-bottom: 40px;
}
footer#footer div.contact div.button-wrapper {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-right: -40px;
}
footer#footer div.contact p.button-default {
	width: 410px;
	text-align: left;
	margin-right: 40px;
}
footer#footer div.contact p.button-default a {
	justify-content: flex-start;
	width: 100%;
	height: 120px;
	padding: 0px 0px 0px 100px;
	background-color: #2a5cac;
	border-radius: 10px;
}
footer#footer div.contact p.button-default i.icon {
	position: absolute;
	left: 30px;
	top: calc(50% - 1.375rem);
	font-size: 2.75rem;
}
footer#footer div.contact p.button-default span.text {
	font-size: 1.375rem;
	font-weight: 500;
	line-height: 2rem;
}
footer#footer div.contact p.button-default span.text i.label {
	font-size: 1.125rem;
	margin-right: 10px;
}
footer#footer div.contact p.button-default span.text i.time {
	display: block;
	font-size: 1rem;
	line-height: 1.5rem;
}
footer#footer nav#navi-footer {
	position: relative;
	color: #999999;
	padding: 60px 0px;
	background-color: #404040;
}
footer#footer nav#navi-footer div:where(.main, .sub) {
	width: 860px;
	margin: 0px auto;
}
footer#footer nav#navi-footer div.main {
	position: relative;
	border-bottom: 1px solid #999999;
	margin-bottom: 20px;
	padding-right: 200px;
	padding-bottom: 20px;
}
footer#footer nav#navi-footer div:where(.main, .sub) ul {
	display: flex;
	flex-wrap: wrap;
}
footer#footer nav#navi-footer div.main ul li {
	font-size: 1.375rem;
	font-weight: 500;
}
footer#footer nav#navi-footer div.main ul li:not(:last-child) {
	margin-right: 40px;
}
footer#footer nav#navi-footer div:where(.main, .sub) ul li a {
	transition: 0.25s color ease;
}
footer#footer nav#navi-footer div.main ul li a {
	padding-right: 45px;
}
footer#footer nav#navi-footer div:where(.main, .sub) ul li a:hover {
	color: #ffffff;
}
footer#footer nav#navi-footer div.main ul li a {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	position: relative;
	height: 75px;
}
footer#footer nav#navi-footer div.main ul li span.arrow {
	position: absolute;
	width: 35px;
	height: 35px;
	right: 0px;
	top: calc(50% - 17.5px);
	font-size: 0.5rem;
	color: #404040;
	background-color: #999999;
}
footer#footer nav#navi-footer div.main ul li span.arrow::before {
	background-color: #ffffff;
}
footer#footer nav#navi-footer div.sub {
	position: relative;
	letter-spacing: 0.05em;
	padding-right: 180px;
}
footer#footer nav#navi-footer div.sub ul:first-child {
	margin-bottom: 5px;
}
footer#footer nav#navi-footer div.sub ul li {
	font-size: 0.875rem;
	font-weight: 500;
	line-height: 35px;
}
footer#footer nav#navi-footer div.sub ul li:not(:last-child) {
	margin-right: 40px;
}
footer#footer div.misc {
	width: 1000px;
	margin: 0px auto;
	padding: 30px 0px 40px 0px;
}
footer#footer nav#navi-footer div.banner {
	position: absolute;
	right: calc(50% - 430px);
	top: 60px;
}
footer#footer nav#navi-footer div.banner p.row:not(:last-child) {
	margin-bottom: 41px;
}
footer#footer nav#navi-footer div.banner p.row a {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	width: 160px;
	height: 75px;
	border: 1px solid #999999;
	transition: 0.25s background-color ease;
}
footer#footer nav#navi-footer div.banner p.row a:hover {
	background-color: #999999;
}
footer#footer nav#navi-footer div.banner p.row-busters img {
	width: calc(150px * 0.625);
}
footer#footer nav#navi-footer div.banner p.row-roop img {
	width: calc(150px * 0.525);
}
footer#footer div.misc div.information-sns {
	position: relative;
	margin-bottom: 30px;
}
footer#footer div.misc div.information-sns div.information {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	letter-spacing: 0.05em;
}
footer#footer div.misc div.information-sns div.information p.logo {
	margin-right: 60px;
}
footer#footer div.misc div.information-sns div.information p.logo img {
	width: auto;
	height: 42px;
}
footer#footer div.misc div.information-sns div.information h3 {
	font-size: 1rem;
	margin-right: 20px;
}
footer#footer div.misc div.information-sns div.sns {
	position: absolute;
	right: 0px;
	top: 10px;
}
footer#footer div.misc div.information-sns div.sns ul {
	display: flex;
	flex-wrap: wrap;
}
footer#footer div.misc div.information-sns div.sns ul li:not(:last-child) {
	margin-right: 30px;
}
footer#footer div.misc div.information-sns div.sns ul li img {
	width: auto;
	height: 24px;
}
footer#footer div.misc p.copyright {
	text-align: center;
	font-size: 0.75rem;
	font-weight: 500;
	line-height: 1.25rem;
}