@charset "utf-8";
/* 
Theme Name: renew_cloudsoft_theme
File: style.css
Author: Genova Design
Version: 1.0
*/

@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap');

/******************
 Reset
******************/
html {font-size: 62.5%; color: #000; background: #fff;}
body {font-size: 15px; font-size: 1.5rem;}
body,div,figure,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,
p,blockquote,th,td {margin: 0;padding: 0;}
fieldset,img {border: 0;}
address,caption,cite,code,dfn,em,th,var,optgroup {font-style: inherit;font-weight:inherit;}
li {list-style: none;}
caption,th {text-align: left;}
h1,h2,h3,h4,h5,h6 {font-size: 100%;	font-weight: normal;}
q:before,q:after {content: '';}
abbr,acronym {border: 0;font-variant: normal;}
hr {margin:0;}
img {vertical-align: bottom;}
a {outline: none;}
img[src$=".svg"] {width: 100%;}

/*because legend doesn't inherit in IE */
legend {color: #000;}
input,button,textarea,select,optgroup,option {font-family: inherit;font-size:inherit;font-style:inherit;font-weight: inherit;}

/******************************/
/* Clearfix */
.clearfix:after,.clearfix:after {content: " "; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: inline-block;min-height: 1%;}
/* Hides from IE-mac \*/
.clearfix {display: block;}
/* End hide from IE-Mac */
/**tag**************************/
.clearfix {overflow:hidden;}
* {box-sizing: border-box;}

a[href^="tel:"] {
	pointer-events: none;
	cursor: text;
}
@media screen and (max-width: 767px) {
	a[href^="tel:"] {
		pointer-events: auto;
		cursor: pointer;
	}
}

body {
	font-family: "zen-kaku-gothic-antique", "Noto Sans JP", sans-serif;
	font-weight: 400;
	font-size: 1.6rem;
	line-height: 1.5;
	letter-spacing: 0;
	color: #040000;
	padding: 0;
	word-break: break-word;
	overflow-wrap: anywhere;
	-webkit-font-smoothing: antialiased;
}

@media screen and (max-width: 767px) {
	body {
		font-size: 1.3rem;
		line-height: 1.5;
		letter-spacing: 0;
	}
}

:root {
	--font-noto: "Noto Sans JP", sans-serif;
	--color-red: #238e3a;
	--color-brown: #9a8c7a;
	--color-black: #040000;
}
.color-red{
	color: var(--color-red);
}
.color-red-bold{
	font-weight: 700;
	color: var(--color-red);
}

a,
a:hover{
  text-decoration: none;
}

img{
  width: 100%;
}
strong{
  font-weight: 700;
}

.sp-none{
  display: none;
}
.tab-only {
	display: none;
  }

@media screen and (min-width: 768px) and (max-width: 1024px) {
	.tab-only {
		display: block;
	}
	br.tab-none {
		display: none;
	}
}

@media screen and (min-width:768px) {
  .sp-none{
    display: block;
  }
  .pc-none{
    display: none;
  }
}

@keyframes btnIconRotation {
	0% {
		transform: translateY(-50%) rotate(0deg);
	}
	100% {
		transform: translateY(-50%) rotate(-360deg);
	}	
}

@keyframes btnIconRotation2 {
	0% {
	 transform: rotate(0deg);
	}
	100% {
		transform: rotate(-360deg);
	}	
}

.top-header{
	position: absolute;
	top: 31px;
	right: 44px;
	max-width: 860px;
	width: 100%;
	height: 61px;
	z-index: 6;
}
.top-header{
	font-family: var(--font-noto);
}
.top-header-inner{
	display: grid;
	grid-template-columns: 1fr 232px;
	grid-gap: 14px;
}
.top-header-nav{
	display: flex;
	align-items: center;
}
.top-header-nav-inner{
	width: 100%;
}
.top-header-nav-list{
	display: flex;
}
.top-header-nav-list > li{
	position: relative;
	flex-grow: 1;
	display: flex;
	justify-content: center;
	align-items: center;
}
.top-header-nav-parent{
	font-weight: 500;
	font-size: 1.6rem;
	line-height: 1;
	letter-spacing: .1em;
	color: #fff;
	padding: 13px 0;
}
.top-header-nav-parent a{
	color: #fff;
}
.top-header-nav-menu{
	visibility: hidden;
	opacity: 0;
	position: absolute;
	top: 24px;
	left: 50%;
	transform: translateX(-50%);
	padding: 27px 0 0;
	transition: all 0.32s;
}
.top-header-nav-menu-block{
	position: relative;
	padding: 33px 24px 38px 41px;
}
.top-header-nav-menu-block::after{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: #fff;
	border-radius: 20px;
	filter: drop-shadow(0 3px 20px rgba(0, 0, 0, .09));
	z-index: -1;
}
.menu-about{
	width: 515px;
}
.menu-company{
	width: 181px;
}
.top-header-nav-lower.active .top-header-nav-menu {
	visibility: visible;
	opacity: 1;
}
.top-header-nav-parent{
	position: relative;
	cursor: pointer;
}
.top-header-nav-parent::after{
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: #fff;
	border-radius: 10px;
	opacity: 0;
	transition: all 0.32s;
}
.top-header-nav-lower.active .top-header-nav-parent::after,
.top-header-nav-parent:hover::after {
	opacity: 1;
}
.top-header-nav-menu-parent a{
	position: relative;
	display: inline-block;
	padding: 0 26px 0 0;
}
.top-header-nav-menu-parent a{
	font-weight: 700;
	font-size: 1.8rem;
	line-height: 1.3;
	letter-spacing: .05em;
	color: #040000;
}
.top-header-nav-menu-parent a::after{
	content: '';
	position: absolute;
	top: 2px;
	right: 0;
	width: 22px;
	height: 22px;
	background-image: url(./img/common/menu-icon.png);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.top-header-nav-menu-child{
	margin: 26px 0 0;
	display: flex;
	gap: 24px;
}
.top-header-nav-menu-child-list{
	flex-grow: 1;
}
.top-header-nav-menu-child-list > li + li{
	margin: 9px 0 0;
}
.top-header-nav-menu-child-list > li a{
	position: relative;
	padding: 0 0 0 21px;
}
.top-header-nav-menu-child-list > li a{
	font-weight: 500;
	font-size: 1.4rem;
	line-height: 1.3;
	color: #040000;
	transition: all 0.15s;
}
.top-header-nav-menu-child-list > li a::after{
	content: '';
	position: absolute;
	top: 10px;
	left: 0;
	width: 14px;
	height: 1px;
	background: var(--color-brown);
}
.top-header-nav-menu-child-list > li a:hover{
	opacity: .65;
}
.informal-chat a{
	position: relative;
	min-height: 61px;
	display: flex;
	align-items: center;
	padding: 0 30px;
}
.informal-chat a{
	font-weight: 700;
	font-size: 1.8rem;
	line-height: 1;
	letter-spacing: .05em;
	color: #040000;
}
.informal-chat a::after{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: #fff;
	border-radius: 32px;
	z-index: -1;
}
.informal-chat a::before{
	content: '';
	position: absolute;
	top: 50%;
	right: 14px;
	transform: translateY(-50%);
	width: 34px;
	height: 33px;
	background-image: url(./img/common/informal-icon.png);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}

.informal-chat a:hover::before{
	animation: btnIconRotation .5s cubic-bezier(0.76, 0, 0.24, 1);
}

#header{
	display: none;
}

@media screen and (max-width: 1145px) {
	.top-header{
		display: none;
	}
	#header {
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		right: 0;
		z-index: 800;
	}
	#header::after {
		content: '';
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background: #fff;
		z-index: -1;
	}
	.header-inner{
		min-height: 75px;
		display: flex;
		align-items: center;
		padding: 0 64px 0 20px;
		background-color: #fff;
	}
	.header-logo{
		max-width: 120px;
		width: 100%;
		display: flex;
		align-items: center;
	}
	.header-informal-chat{
		display: flex;
		align-items: center;
	}
	.header-informal-chat a{
		position: relative;
		width: 168px;
		min-height: 49px;
		display: flex;
		align-items: center;
		padding: 0 18px;
		z-index: 6;
	}
	.header-informal-chat a{
		font-weight: 700;
		font-size: 1.5rem;
		line-height: 1;
		letter-spacing: .05em;
		color: #fff;
	}
	.header-informal-chat a::after{
		content: '';
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background: var(--color-red);
		border-radius: 32px;
		z-index: -1;
	}
	.header-informal-chat a::before{
		content: '';
		position: absolute;
		top: 50%;
		right: 14px;
		transform: translateY(-50%);
		width: 16px;
		height: 16px;
		background-image: url(./img/common/head-informal-icon.png);
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
	}

	.menu-btn{
		position: fixed;
		top: 0;
		right: 0;
		width: 64px;
		height: 75px;
		display: flex;
		justify-content: center;
		align-items: center;
		transition-duration: .3s;
		z-index: 980;
	}
	.menu-btn::before{
		content: "";
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background: #fff;
	}
	.hamburger,
	.hamburger-fil{
		right: 0;
	}
	.hamburger{
		position: relative;
		display: block;
		box-sizing: content-box;
		width: 30px;
		height: 17px;
		padding: 0 20px 0 14px;
		-webkit-transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
		transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0);
		border: 0;
		outline: 0;
		background-color: transparent;
		margin: 0 auto;
		cursor: pointer;
	}
	.hamburger-icon {
		position: relative;
		display: block;
	}
	.hamburger-icon,
	.hamburger-icon:before,
	.hamburger-icon:after{
		width: 100%;
		height: 2px;
		-webkit-transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
		transition: all .6s cubic-bezier(0.190, 1.000, 0.220, 1.000);
		background-color: var(--color-black);
	}
	.hamburger-icon:before,
	.hamburger-icon:after{
		position: absolute;
		top: -8px;
		left: 0;
		content: '';
	}
	.hamburger-icon:after{
		top: 8px;
	}
	.hfixed .hamburger-icon {
		background-color: transparent;
	}
	.hfixed .hamburger-icon:before,
	.hfixed .hamburger-icon:after {
		top: 0;
		width: 34px;
		background-color: var(--color-black);
	}
	.hfixed .hamburger-icon:before {
		-webkit-transform: rotate(150deg);
		transform: rotate(150deg);
	}
	.hfixed .hamburger-icon:after {
		-webkit-transform: rotate(-150deg);
		transform: rotate(-150deg);
	}
	.hfixed .hamburger:after{
		color: #fff;
	}
	.menu-wrap{
		position: fixed;
		top: 75px;
		right: 0;
		display: block;
		opacity: 1;
		visibility: hidden;
		width: 100%;
		height: calc(100vh - 75px);
		height: calc(100dvh - 75px);
		overflow-y: hidden;
		padding: 0;
		margin: 0;
		z-index: 890;
		transition: all .5s;
		-webkit-clip-path: inset(0 0 100% 0);
		clip-path: inset(0 0 100% 0);
	}
	.menu-wrap::after{
		content: '';
		position: fixed;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background: #fff;
		z-index: -1;
	}
	.hfixed .menu-wrap{
		opacity: 1;
		visibility: visible;
		overflow-y: scroll;
		width: 100%;
		-webkit-clip-path: inset(0);
		clip-path: inset(0);
	}
	.menu-wrap-inner{
		max-width: 520px;
		width: 100%;
		margin: 0 auto;
		padding: 14px 40px 36px;
	}
	.menu-gnav{
		position: relative;
		font-family: var(--font-noto);
		font-weight: 600;
		z-index: 6;
	}
	.menu-gnav-list{
		display: block;
	}
	.menu-gnav-list > li{
		position: relative;
		border-bottom: 1px rgba(173, 173, 173, .6) solid;
	}
	.menu-gnav-list a{
		text-align: left;
		font-size: 1.6rem;
		line-height: 1;
		letter-spacing: .1em;
		color: var(--color-black);
	}
	.menu-gnav-list a{
		display: inline-block;
		padding: 22px 0;
	}
	.menu-gnav-list a:hover{
		opacity: 1;
	}
	.menu-gnav-lower{
		position: absolute;
		top: 22px;
		right: 14px;
		display: inline-block;
		width: 16px;
		height: 16px;
	}
	.menu-gnav-lower::before{
		content: '';
		position: absolute;
		top: 50%;
		left: 0;
		transform: translateY(-50%);
		width: 100%;
		height: 2px;
		background-color: var(--color-red);
	}
	.menu-gnav-lower::after{
		content: '';
		position: absolute;
		top: 50%;
		left: 0;
		transform: translateY(-50%) rotate(90deg);
		width: 100%;
		height: 4px;
		height: 2px;
		background-color: var(--color-red);
		transition: all 0.32s;
	}
	.menu-gnav-lower.open::after{
		transform: rotate(180deg);
	}
	.menu-gnav-child{
		display: none;
		padding: 0 21px 17px;
	}
	.menu-gnav-child-list > li a{
		font-size: 1.5rem;
		line-height: 1.3;
		letter-spacing: .1em;
		color: var(--color-black);
	}
	.menu-gnav-child-list > li a{
		position: relative;
		display: block;
		padding: 9px 0 9px 12px;
	}
	.menu-gnav-child-list > li a::before{
		content: '';
		position: absolute;
		top: 19px;
		left: 0;
		width: 5px;
		height: 2px;
		background: var(--color-red);
	}
	.menu-informal-chat{
		max-width: 520px;
		width: 100%;
		margin: 15px auto 0;
	}
	.menu-informal-chat-speech{
		position: relative;
		display: flex;
		flex-direction: column;
		align-items: center;
		padding: 0 15px;
		z-index: 6;
	}
	.menu-informal-chat-read{
		position: relative;
		font-weight: 500;
		font-size: 1.6rem;
		line-height: 1.6;
		text-align: center;
		padding: 0 34px;
	}
	.menu-informal-chat-read::before,
	.menu-informal-chat-read::after{
		content: '';
		position: absolute;
		bottom: 6px;
		width: 36px;
		height: 49px;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: bottom center;
	}
	.menu-informal-chat-read::before{
		left: 0;
		background-image: url(./img/common/menu-speech-left.png);
	}
	.menu-informal-chat-read::after{
		right: 0;
		background-image: url(./img/common/menu-speech-right.png);
	}
	.menu-informal-chat-btn{
		max-width: 350px;
		width: 100%;
		margin: 15px auto 0;
	}
	.menu-special-btn{
		max-width: 350px;
		width: 100%;
		margin: 24px auto;
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-gap: 22px;
	}
}
.fixed-header{
	position: fixed;
	top: 18px;
	width: 100%;
	z-index: 800;
	opacity: 1;
	visibility: visible;
	font-family: var(--font-noto);
	transition: all 0.5s;
}
#fixed-header.is-show {
	opacity: 1;
	visibility: visible;
}
.fixed-header-wrap{
	padding: 0 32px;
}
.fixed-header-block{
	position: relative;
	max-width: 1308px;
	width: 100%;
	margin: 0 auto;
}
.fixed-header-block::after{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: #fff;
	border-radius: 80px;
	filter: drop-shadow(0 3px 20px rgba(0, 0, 0, .07));
	z-index: -1;
}
.fixed-header-block-inner{
	display: grid;
	grid-template-columns: 230px 1fr;
	grid-gap: 15px;
}
.fixed-header-logo{
	display: flex;
	justify-content: flex-end;
	align-items: center;
	justify-content: center;
}
.fixed-header-logo a{
	display: block;
	max-width: 144px;
	width: 100%;
}
.fixed-header-nav{
	display: flex;
	justify-content: flex-end;
	padding: 0 13px 0 0;
}
.fixed-header-nav-wrap{
	max-width: 885px;
	width: 100%;
	display: grid;
	grid-template-columns: 1fr 232px;
}
.fixed-header-nav-block{
	padding: 0 16px 0 0;
}
.fixed-header-nav-inner{
	width: 100%;
}
.fixed-header-nav-list{
	display: flex;
}
.fixed-header-nav-list > li{
	position: relative;
	flex-grow: 1;
	display: flex;
	justify-content: center;
	align-items: center;
}
.fixed-header-nav-parent{
	min-height: 87px;
	display: flex;
	align-items: center;
	font-weight: 500;
	font-size: 1.4rem;
	line-height: 1;
	letter-spacing: .1em;
	color: var(--color-black);
}
.fixed-header-nav-parent a{
	display: flex;
	align-items: center;
	min-height: 87px;
	color: var(--color-black);
}
.fixed-header-nav-menu{
	visibility: hidden;
	opacity: 0;
	position: absolute;
	top: 87px;
	left: 50%;
	transform: translateX(-50%);
	padding: 14px 0 0;
	transition: all 0.32s;
}
.fixed-header-nav-menu-block{
	position: relative;
	padding: 33px 24px 38px 41px;
}
.fixed-header-nav-menu-block::after{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: #fff;
	border-radius: 20px;
	filter: drop-shadow(0 3px 20px rgba(0, 0, 0, .09));
	z-index: -1;
}
.fixed-menu-about{
	width: 540px;
}
.fixed-menu-company{
	width: 203px;
}
.fixed-header-nav-lower.active .fixed-header-nav-menu {
	visibility: visible;
	opacity: 1;
}
.fixed-header-nav-parent{
	position: relative;
	cursor: pointer;
}
.fixed-header-nav-parent::after{
	content: '';
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	height: 3px;
	background: var(--color-brown);
	border-radius: 10px 10px 0 0;
	opacity: 0;
	transition: all 0.32s;
}
.fixed-header-nav-lower.active .fixed-header-nav-parent::after,
.fixed-header-nav-parent:hover::after {
	opacity: 1;
}
.fixed-header-nav-menu-parent a{
	position: relative;
	display: inline-block;
	padding: 0 26px 0 22px;
}
.fixed-header-nav-menu-parent a{
	font-weight: 700;
	font-size: 1.8rem;
	line-height: 1.3;
	letter-spacing: .05em;
	color: #040000;
}
.fixed-header-nav-menu-parent a::before{
	content: '';
	position: absolute;
	top: 12px;
	left: 0;
	width: 14px;
	height: 1px;
	background: var(--color-brown);
}
.fixed-header-nav-menu-parent a::after{
	content: '';
	position: absolute;
	top: 2px;
	right: 0;
	width: 22px;
	height: 22px;
	background-image: url(./img/common/menu-icon.png);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.fixed-header-nav-menu-parent a:hover::after {	
	animation: btnIconRotation2 .5s cubic-bezier(0.76, 0, 0.24, 1);
}
.fixed-header-nav-menu-child{
	margin: 26px 0 0;
	display: flex;
	gap: 24px;
}
.fixed-header-nav-menu-child-list{
	flex-grow: 1;
}
.fixed-header-nav-menu-child-list > li + li{
	margin: 9px 0 0;
}
.fixed-header-nav-menu-child-list > li a{
	position: relative;
	padding: 0 0 0 21px;
}
.fixed-header-nav-menu-child-list > li a{
	font-weight: 500;
	font-size: 1.4rem;
	line-height: 1.3;
	color: #040000;
	white-space: nowrap;
	transition: all 0.15s;
}
.fixed-header-nav-menu-child-list > li a::after{
	content: '';
	position: absolute;
	top: 10px;
	left: 0;
	width: 14px;
	height: 1px;
	background: var(--color-brown);
}
.fixed-header-nav-menu-child-list > li a:hover{
	opacity: .65;
}
.fixed-header-informal-chat{
	display: flex;
	align-items: center;
}
.fixed-header-informal-chat a{
	position: relative;
	width: 232px;
	min-height: 61px;
	display: flex;
	align-items: center;
	padding: 0 30px;
	z-index: 6;
}
.fixed-header-informal-chat a{
	font-weight: 700;
	font-size: 1.8rem;
	line-height: 1;
	letter-spacing: .05em;
	color: #fff;
}
.fixed-header-informal-chat a::after{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-image: linear-gradient(135deg, #238e3a 0%, #1a7a6d 100%);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
	border-radius: 32px;
	z-index: -1;
}
.fixed-header-informal-chat a::before{
	content: '';
	position: absolute;
	top: 50%;
	right: 14px;
	transform: translateY(-50%);
	width: 34px;
	height: 33px;
	background-image: url(./img/common/fixed-informal-icon.png);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.fixed-header-informal-chat a:hover::before {	
	animation: btnIconRotation .5s cubic-bezier(0.76, 0, 0.24, 1);
}

@media screen and (max-width: 1145px) and (min-width: 768px) {
	.fixed-header{
		display: none;
	}
}

@media screen and (max-width: 767px) {
	.fixed-header{
		display: none;
	}
}



a.button{
	position: relative;
	min-height: 66px;
	display: inline-flex;
	align-items: center;
	padding: 0 53px 0 29px;
	z-index: 3;
}
a.button{
	font-family: var(--font-noto);
	font-weight: 700;
	font-size: 1.8rem;
	line-height: 1;
	letter-spacing: .05em;
	color: #fff;
	white-space: nowrap;
}
a.button::after{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: var(--color-brown);
	border-radius: 50px;
	z-index: -1;
}
a.button::before{
	content: '';
	position: absolute;
	top: 50%;
	right: 23px;
	transform: translateY(-50%);
	width: 22px;
	height: 22px;
	background-image: url(./img/common/btn-icon.png);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;		
}

a.button:hover::before {	
	animation: btnIconRotation .5s cubic-bezier(0.76, 0, 0.24, 1);
}


.recruit{
	position: relative;
	width: 100%;
	margin: 0 auto;
	padding: 137px 0 155px;
	margin: -110px 0 0;
	z-index: 6;
}

.recruit-bg {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -2;	
	border-radius: 100px 100px 0 0;
	overflow: hidden;
	background-color: #fff;
}

/* .recruit::after{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background-image: url(./img/common/recruit-bg.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: top center;
	border-radius: 100px 100px 0 0;
	z-index: -1;
} */
.recruit-deco-wrap {
	position: absolute;
	border-radius: 100px 100px 0 0;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	z-index: -1;
}
.recruit-deco {
	background-color: #fff;
	border-radius: 50%;
	aspect-ratio: 1;
	pointer-events: none;
	user-select: none;
	position: absolute;
	z-index: 10;
}
.recruit-deco.__is1 {
	width: 15px;
	top: 20%;
	left: 30%;
	opacity: 0.3;
}
.recruit-deco.__is2 {
	width: 15px;
	top: 10%;
	left: -5%;
	opacity: 0.3;
}
.recruit-deco.__is3 {
	width: 20px;
	top: 40%;
	left: -3%;
	opacity: 0.6;
}
.recruit-deco.__is4 {
	width: 12px;
	top: 50%;
	right: -3%;
	opacity: 0.25;
}
.recruit-deco.__is5 {
	width: 12px;
	top: 20%;
	right: 10%;
	opacity: 0.1;
}
.recruit-deco.__is6 {
	width: 23px;
	top: 80%;
	right: 5%;
	opacity: 0.5;
}
.recruit-deco.__is7 {
	width: 16px;
	top: 60%;
	right: 55%;
	opacity: 0.15;
}
.recruit-deco.__is8 {
	width: 10px;
	top: 10%;
	right: 25%;
	opacity: 0.15;
}
.recruit-deco.__is8 {
	width: 5px;
	top: 8%;
	right: 15%;
	opacity: 0.15;
}
.recruit-deco.__is9 {
	width: 20px;
	bottom: 8%;
	left: 10%;
	opacity: 0.85;
}
.recruit-deco.__is10 {
	width: 20px;
	bottom: 14%;
	left: 30%;
	opacity: 0.65;
} 
/* 20250411追記 */
/* .recruit::before */
.recruit-pic{
	/* content: ''; */
	position: absolute;
	top: -89px;
	right: 0;
	width: 295px;
	height: 490px;
	/* background-image: url(); */
	/* background-size: cover; */
	/* background-repeat: no-repeat; */
	/* background-position: center; */
	overflow: hidden;
	border-radius: 50px 0 0 50px;
	z-index: 11;
}
.recruit-pic img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1.2);
}
/* 20250411追記 end */
.recruit-wrap{
	position: relative;
	max-width: 1144px;
	width: 100%;
	margin: 0 auto;
	padding: 0 32px;
	z-index: 32;
}
.recruit-eng-txt{
	display: inline-block;
	font-weight: 700;
	font-size: 2.0rem;
	line-height: 1;
	color: rgba(255, 255, 255, .5);
}
.recruit-inner{
	margin: 25px 0 0;
	display: grid;
	grid-template-columns: 470px 1fr;
	grid-gap: 70px;
}
.recruit-h2-txt{
	font-weight: 700;
	font-size: 4.8rem;
	line-height: 1.45;
	letter-spacing: .08em;
	color: #fff;
}
.recruit-read{
	margin: 28px 0 0;
}
.recruit-read p{
	font-family: var(--font-noto);
	font-weight: 500;
	font-size: 1.6rem;
	line-height: 1.875;
	color: #fff;
}
.recruit-contact{
	padding: 15px 0 0;
}
.recruit-informal{
	max-width: 321px;
	width: 100%;
}
.recruit-informal a{
	position: relative;
	min-height: 200px;
	display: flex;
	flex-direction: column;
	align-items: center;
	color: var(--color-black);
	padding: 33px 15px 31px;
	z-index: 6;
}
.recruit-informal a::after{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: #fff;
	border-radius: 40px;
	z-index: -1;
}
.recruit-informal-read{
	position: relative;
	font-weight: 500;
	font-size: 1.6rem;
	line-height: 1.6;
	text-align: center;
	padding: 0 36px;
}
.recruit-informal-read::before,
.recruit-informal-read::after{
	content: '';
	position: absolute;
	bottom: 6px;
	width: 36px;
	height: 49px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: bottom center;
}
.recruit-informal-read::before{
	left: 0;
	background-image: url(./img/common/recruit-speech-left.png);
}
.recruit-informal-read::after{
	right: 0;
	background-image: url(./img/common/recruit-speech-right.png);
}
.recruit-informal-btn{
	position: relative;
	font-weight: 700;
	font-size: 2.8rem;
	line-height: 1;
	letter-spacing: .1em;
	text-align: center;
	white-space: nowrap;
	margin: 24px 0 0;
	padding: 0 48px 0 0;
}
.recruit-informal-btn::after{
	content: '';
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	width: 34px;
	height: 33px;
	background-image: url(./img/common/informal-icon.png);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.recruit-informal:hover .recruit-informal-btn::after {	
	animation: btnIconRotation .5s cubic-bezier(0.76, 0, 0.24, 1);
}
.recruit-btn{
	max-width: 317px;
	width: 100%;
	margin: 28px 0 0;
}
.recruit-btn a{
	font-family: var(--font-noto);
	font-weight: 700;
	font-size: 1.8rem;
	line-height: 1;
	letter-spacing: .05em;
	color: var(--color-black);
	white-space: nowrap;
	padding: 0 22px;
}
.recruit-btn a{
	position: relative;
	min-height: 78px;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 6;
}
.recruit-btn a::after{
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	background: #fff;
	border-radius: 58px;
	z-index: -1;
}
.recruit-btn a::before{
	content: '';
	position: absolute;
	top: 50%;
	right: 27px;
	transform: translateY(-50%);
	width: 22px;
	height: 22px;
	background-image: url(./img/common/menu-icon.png);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.recruit-btn:hover a::before {	
	animation: btnIconRotation .5s cubic-bezier(0.76, 0, 0.24, 1);
}

@media screen and (max-width: 1023px) and (min-width: 768px) {
	.recruit{
		position: relative;
		width: 100%;
		margin: 0 auto;
		padding: 137px 0 105px;
		margin: -110px 0 0;
		z-index: 6;
	}
	/* 20250411追記 */
	/* .recruit::before{ */
	.recruit-pic{
		width: 250px;
		height: 415px;
	}
	.recruit-inner{
		display: grid;
		grid-template-columns: 1fr;
		grid-gap: 40px;
	}
	.recruit-contact{
		margin: 0 auto;
	}
}

@media screen and (max-width: 767px) {
	.recruit{
		position: relative;
		width: 100%;
		margin: 0 auto;
		padding: 54px 0 38px;
		margin: -50px 0 0;
		z-index: 6;
	}
	/* .recruit::after{
		background-image: url(./img/common/recruit-bg_sp.jpg);
		border-radius: 40px 40px 0 0;
	} */
	.recruit-bg,
	.recruit-deco-wrap {
		border-radius: 40px 40px 0 0;
	}	
	/* 20250411追記 */
	.recruit-pic{
		content: '';
		position: absolute;
		top: -111px;
		right: 0;
		width: 273px;
		height: 189px;		
		/* background-image: url(./img/common/recruit-img_sp.jpg); */
		/* background-size: cover; */
		/* background-repeat: no-repeat; */
		/* background-position: center; */
		border-radius: 40px 0 0 40px;
	}
	/* 20250411追記 end */
	.recruit-wrap{
		padding: 0 40px;
	}
	.recruit-inner{
		margin: 32px 0 0;
		display: block;
	}
	.recruit-h2-txt{
		font-weight: 700;
		font-size: 2.9rem;
		line-height: 1.689;
		letter-spacing: .1m;
		color: #fff;
	}
	.recruit-read{
		margin: 32px 0 0;
	}
	.recruit-read p{
		font-family: var(--font-noto);
		font-weight: 500;
		font-size: 1.5rem;
		line-height: 1.8;
		color: #fff;
	}
	.recruit-contact{
		padding: 0;
		margin: 29px 0 0;
	}
	.recruit-informal{
		max-width: 350px;
		width: 100%;
		margin: 0 auto;
	}
	.recruit-informal a{
		position: relative;
		min-height: 175px;
		display: flex;
		flex-direction: column;
		align-items: center;
		color: var(--color-black);
		padding: 20px 15px 24px;
		z-index: 6;
	}
	.recruit-informal a::after{
		content: '';
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background: #fff;
		border-radius: 40px;
		z-index: -1;
	}
	.recruit-informal-read{
		position: relative;
		font-weight: 500;
		font-size: 1.6rem;
		line-height: 1.6;
		text-align: center;
		padding: 0 36px;
	}
	.recruit-informal-read::before,
	.recruit-informal-read::after{
		content: '';
		position: absolute;
		bottom: 6px;
		width: 36px;
		height: 49px;
		background-size: cover;
		background-repeat: no-repeat;
		background-position: bottom center;
	}
	.recruit-informal-read::before{
		left: 0;
		background-image: url(./img/common/recruit-speech-left.png);
	}
	.recruit-informal-read::after{
		right: 0;
		background-image: url(./img/common/recruit-speech-right.png);
	}
	.recruit-informal-btn{
		position: relative;
		font-weight: 700;
		font-size: 2.8rem;
		line-height: 1;
		letter-spacing: .1em;
		text-align: center;
		margin: 18px 0 0;
		padding: 0 43px 0 0;
	}
	.recruit-informal-btn::after{
		content: '';
		position: absolute;
		top: 50%;
		right: 0;
		transform: translateY(-50%);
		width: 34px;
		height: 33px;
		background-image: url(./img/common/informal-icon.png);
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
	}
	.recruit-btn{
		max-width: 350px;
		width: 100%;
		margin: 18px auto 0;
	}
	.recruit-btn a{
		font-family: var(--font-noto);
		font-weight: 700;
		font-size: 1.8rem;
		line-height: 1;
		letter-spacing: .05em;
		color: var(--color-black);
		padding: 0 22px;
	}
	.recruit-btn a{
		position: relative;
		min-height: 78px;
		display: flex;
		justify-content: center;
		align-items: center;
		z-index: 6;
	}
	.recruit-btn a::after{
		content: '';
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		right: 0;
		background: #fff;
		border-radius: 58px;
		z-index: -1;
	}
	.recruit-btn a::before{
		content: '';
		position: absolute;
		top: 50%;
		right: 50%;
		transform: translate(calc(50% + 92px), -50%);
		width: 22px;
		height: 22px;
		background-image: url(./img/common/menu-icon.png);
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
	}
}


.footer{
	font-family: var(--font-noto);
	background: #f4f2f0;
}
.footer-wrap{
	position: relative;
	max-width: 1144px;
	width: 100%;
	margin: 0 auto;
	padding: 121px 32px 112px;
	z-index: 8;
}
.footer-logo{
	max-width: 200px;
	width: 100%;
}
.footer-nav{
	display: grid;
	grid-template-columns: 47% 1fr;
	grid-gap: 24px;
	margin: 51px 0 0;
}
.footer-nav-menu{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-gap: 32px;
}
.footer-nav-menu-list > li + li{
	margin: 13px 0 0;
}
.footer-nav-menu-2 .footer-nav-menu-list > li + li{
	margin: 23px 0 0;
}
.footer-nav-menu-parent a{
	display: inline-block;
	font-weight: 700;
	font-size: 1.6rem;
	line-height: 1.6;
	color: var(--color-black);
	transition: all 0.52s;
}
.footer-nav-menu-parent a:hover{
	opacity: .6;
}
.footer-nav-menu-child{
	padding: 9px 0 0 26px;
}
.footer-nav-menu-child-list > li{
	position: relative;
	padding: 0 0 0 27px;
}
.footer-nav-menu-child-list > li::before{
	content: '';
	position: absolute;
	top: 17px;
	left: 0;
	width: 15px;
	height: 1px;
	background: var(--color-brown);
}
.footer-nav-menu-child-list > li a{
	display: inline-block;
	font-weight: 500;
	font-size: 1.4rem;
	line-height: 1.5;
	color: var(--color-black);
	padding: 6px 0;
	transition: all 0.52s;
}
.footer-nav-menu-child-list > li a:hover{
	opacity: .6;
}
.footer-nav-other{
	display: grid;
	grid-template-columns: repeat(2, 1fr);
}
.footer-nav-other-menu{
	padding: 0 15px 0 0;
}
.footer-nav-other-menu-list > li + li{
	margin: 13px 0 0;
}
.footer-nav-other-sns-cloudsoft{
	margin-block: 21px 0;
}
.footer-nav-other-sns-list > li + li{
	margin: 21px 0 0;
}
.footer-nav-other-sns-line a,
.footer-nav-other-sns-x a,
.footer-nav-other-sns-note a{
	position: relative;
	min-height: 60px;
	padding: 0 0 0 73px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	gap: 5px;
}
.footer-nav-other-sns-line a,
.footer-nav-other-sns-x a,
.footer-nav-other-sns-note a{
	font-weight: 700;
	font-size: 1.6rem;
	line-height: 1.4375;
	color: var(--color-black);
	transition: all 0.52s;
}
.footer-nav-other-sns-line a::before,
.footer-nav-other-sns-x a::before,
.footer-nav-other-sns-note a::before
{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 60px;
	height: 60px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.footer-nav-other-sns-line a::before{
	background-image: url(./img/common/line-icon.png);
}
.footer-nav-other-sns-x a::before{
	background-image: url(./img/common/x-icon.png);
}
.footer-nav-other-sns-x.matsushita a::before{
	background-image: url(./img/common/x-icon-m.png);
}
.footer-nav-other-sns-note a::before{
	background-image: url(./img/common/note-icon.png);
}
.footer-nav-other-sns-note.matsushita a::before{
	background-image: url(./img/common/note-icon-m.png);
}
.footer-nav-other-sns-line a .sns-sub,
.footer-nav-other-sns-x a .sns-sub,
.footer-nav-other-sns-note a .sns-sub{
	display: block;
	font-size: 1.2rem;
	color: #adadad;
}
.footer-nav-other-sns-line a:hover,
.footer-nav-other-sns-x a:hover,
.footer-nav-other-sns-note a:hover{
	opacity: .6;
}
.footer-nav-other-sns-position{
	margin-block: 0 3px;
}
.footer-nav-other-sns-position p{
	display: block;
	font-weight: 700;
	font-size: 1.2rem;
	line-height: 1.4375;
	color: #adadad;
}
.footer-nav-other-sns-name p{
	display: block;
	font-weight: 700;
	font-size: 1.6rem;
	line-height: 1.4375;
	color: var(--color-black);
}
.footer-nav-other-sns-media{
	display: flex;
	gap: 15px;
	margin-block: 8px 0;
}
.footer-nav-other-sns-media a{
	display: block;
	width: 60px;
	height: 60px;
	transition: all 0.32s;
}
.footer-nav-other-sns-media .x-umeno,
.footer-nav-other-sns-media .note-umeno,
.footer-nav-other-sns-media .x-matsushita,
.footer-nav-other-sns-media .note-matsushita{
	position: relative;
}
.footer-nav-other-sns-media .x-umeno::after,
.footer-nav-other-sns-media .note-umeno::after,
.footer-nav-other-sns-media .x-matsushita::after,
.footer-nav-other-sns-media .note-matsushita::after{
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 60px;
	height: 60px;
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.footer-nav-other-sns-media .x-umeno::after{
	background-image: url(./img/common/x-icon.png);
}
.footer-nav-other-sns-media .note-umeno::after{
	background-image: url(./img/common/note-icon.png);
}
.footer-nav-other-sns-media .x-matsushita::after{
	background-image: url(./img/common/x-icon-m.png);
}
.footer-nav-other-sns-media .note-matsushita::after{
	background-image: url(./img/common/note-icon-m.png);
}
.footer-nav-other-sns-media a:hover{
	opacity: .6;
}
.footer-nav-other-charnavi{
	display: none;
}
.footer-copy{
	margin: 32px 0 0;
	display: flex;
	flex-direction: column;
	align-items: flex-end;
}
.footer-copy small{
	font-weight: 100;
	font-size: 1.0rem;
	line-height: 1;
	letter-spacing: .1em;
}
.footer-copy-privacy{
	margin-block: 4px 0;
}
.footer-copy-privacy a{
	font-weight: 100;
	font-size: 1.0rem;
	line-height: 1;
	letter-spacing: .1em;
	color: #040000;
}
.pagetop-sp{
	display: none;
}

@media screen and (max-width: 1023px) and (min-width: 768px) {
	.footer-wrap{
		padding: 80px 32px 80px;
	}
	.footer-nav{
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-gap: 24px;
		margin: 51px 0 0;
	}
	.footer-nav-menu{
		display: grid;
		grid-template-columns: 1fr;
		grid-gap: 13px;
	}
	.footer-nav-menu-list > li + li{
		margin: 13px 0 0;
	}
	.footer-nav-menu-2 .footer-nav-menu-list > li + li{
		margin: 13px 0 0;
	}
	.footer-nav-other{
		display: block;
	}
	.footer-nav-other-sns{
		margin: 36px 0 0;
	}
}

@media screen and (max-width: 767px) {
	.footer-wrap{
		max-width: 1144px;
		width: 100%;
		margin: 0 auto;
		padding: 49px 40px 121px;
	}
	.footer-logo{
		max-width: 176px;
		width: 100%;
	}
	.footer-nav{
		display: block;
		margin: 40px 0 0;
	}
	.footer-nav-menu{
		display: block;
	}
	.footer-nav-menu-list > li{
		position: relative;
	}
	.footer-nav-menu-list > li + li{
		margin: 20px 0 0;
	}
	.footer-nav-menu-2{
		margin: 20px 0 0;
	}
	.footer-nav-menu-2 .footer-nav-menu-list > li + li{
		margin: 20px 0 0;
	}
	.footer-nav-menu-parent a{
		display: inline-block;
		font-weight: 700;
		font-size: 1.8rem;
		line-height: 1.6;
		color: var(--color-black);
		transition: all 0.52s;
	}
	.footer-nav-menu-parent a:hover{
		opacity: .6;
	}
	.footer-nav-menu-lower{
		position: absolute;
		top: 11px;
		right: 0;
		display: inline-block;
		width: 16px;
		height: 9px;
		background-image: url(./img/common/footer-nav-arrow.png);
		background-size: cover;
		background-repeat: no-repeat;
		background-position: center;
		transition: all 0.32s;
	}
	.footer-nav-menu-lower.open{
		transform: rotate(-180deg);
	}
	.footer-nav-menu-child{
		display: none;
		padding: 9px 0 0 26px;
	}
	.footer-nav-menu-child-list > li{
		position: relative;
		padding: 0 0 0 27px;
	}
	.footer-nav-menu-child-list > li::before{
		content: '';
		position: absolute;
		top: 17px;
		left: 0;
		width: 15px;
		height: 1px;
		background: var(--color-brown);
	}
	.footer-nav-menu-child-list > li a{
		display: inline-block;
		font-weight: 500;
		font-size: 1.4rem;
		line-height: 1.5;
		color: var(--color-black);
		padding: 8px 0;
		transition: all 0.52s;
	}
	.footer-nav-menu-child-list > li a:hover{
		opacity: .6;
	}
	.footer-nav-other{
		display: block;
		margin: 20px 0 0;
	}
	.footer-nav-other-menu{
		padding: 0 15px 0 0;
	}
	.footer-nav-other-menu-list > li + li{
		margin: 20px 0 0;
	}
	.footer-nav-other-sns{
		margin: 46px 0 0;
	}
	.footer-nav-other-sns-list{
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-gap: 16px;
	}
	.footer-nav-other-sns-list > li{
		display: flex;
		flex-direction: column;
		justify-content: flex-end;
	}
	.footer-nav-other-sns-list > li + li{
		margin: 0;
	}
	.footer-nav-other-sns-media a:hover{
		opacity: 1;
	}
	.footer-nav-other-charnavi{
		display: block;
		max-width: 281px;
		width: 100%;
		margin: 38px auto 0 0;
	}
	.footer-copy{
		margin: 45px 0 0;
		align-items: center;
	}
	.pagetop-sp{
		display: block;
		position: absolute;
		top: 47px;
		right: 26px;
		width: 44px;
		height: 44px;
	}
}

@media screen and (min-width: 768px) {
	.footer-nav-menu-child {
		display: block !important;
	}
}
@media screen and (max-width: 339px) {
	.footer-nav-other-sns-list{
		display: grid;
		grid-template-columns: 1fr;
		grid-gap: 38px;
	}
}


.floating-bnr{
	position: fixed;
	bottom: 48px;
	right: 0;
	width: 180px;
	z-index: 999;
}
.floating-bnr-list > li + li{
	margin: 12px 0 0;
}
.floating-bnr-list > li a{
	position: relative;
	display: block;
}
.floating-bnr-list > li a img{
	filter: drop-shadow(3px 3px 6px rgba(0, 0, 0, .16));
}
.floating-bnr-list > li a::after{
	content: '';
	position: absolute;
	top: 50%;
	right: 11px;
	width: 22px;
	height: 22px;
	transform: translateY(-50%);
	width: 22px;
	height: 22px;
	background-image: url(./img/common/btn-icon.png);
	background-size: cover;
	background-repeat: no-repeat;
	background-position: center;
}
.floating-bnr-list > li a:hover::after{
	animation: btnIconRotation .5s cubic-bezier(0.76, 0, 0.24, 1);
}
.pagetop{
	display: none;
}

@media screen and (max-width: 767px) {
	.floating-bnr{
		position: fixed;
		bottom: 17px;
		left: 0;
		right: 0;
		width: 100%;
		padding: 0 24px;
		display: flex;
		justify-content: space-between;
		align-items: center;
		z-index: 780;
	}
	.floating-bnr-list{
		max-width: 390px;
		width: 100%;
		display: grid;
		grid-template-columns: repeat(2, 1fr) 15.38%;
		grid-gap: 5px;
		margin: 0 auto;
	}
	.floating-bnr-list > li + li{
		margin: 0;
	}
	.pagetop{
		display: block;
		width: 36px;
		height: 36px;
		margin: 0 0 0 8px;
	}
	.pagetop img{
		filter: drop-shadow(0 3px 6px rgba(0, 0, 0, .16));
	}
	.floating-bnr-list > li a::after{
		display: none;
	}
	.floating-bnr-ai{
		position: fixed;
		bottom: 96px;
		right: 0;
		width: 93px;
		z-index: 780;
	}
	.floating-bnr-ai img{
		filter: drop-shadow(0 3px 6px rgba(0, 0, 0, .16));
	}
}


[data-inview="up"] {
	opacity: 0;
	transform: translateY(50px);
}

[data-inview-each="up"] {
	opacity: 0;
	transform: translateY(50px);
} 

@keyframes loopX {
	0% {
		transform: translateX(-10%);
	}
	50% {
		transform: translateX(10%);
	}
	100% {
		transform: translateX(-10%);
	}
}

@keyframes loopY {
	0% {
		transform: translateY(-10%);
	}
	50% {
		transform: translateY(10%);
	}
	100% {
		transform: translateY(-10%);
	}
}

[data-anim-loop="x"] {
	animation: loopX 50s ease-in-out infinite;	
}

[data-anim-loop="y"] {
	animation: loopY 55s ease-in-out infinite;	
	animation-delay: -60s;
}

#bg,
#bg-content {
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100lvh;
	z-index: -1;	
	pointer-events: none;
	user-select: none;
}

#bg_noise,
#bg-content_noise,
.recruit-bg-noise {
	position: absolute;	
	inset: 0;	
	z-index: 10;
	background-image: url('./img/common//noise.png');
	background-repeat: repeat;
	background-size: 1000px 1000px;
	background-position: center;
	opacity: 0.04;
}

#bg-content_canvas {
	position: absolute;
	inset: 0;
	z-index: -2;
}

.recruit-bg-particle {
	position: absolute;
	inset: 0;
	z-index: 20;
}