@charset "UTF-8";
/* WEBフォントの読み込み
---------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Bebas+Neue&family=Noto+Sans+JP:wght@100..900&display=swap');
/* ==============================================
   Reset
   ============================================= */
html{
	-webkit-text-size-adjust: 100%;
	scroll-behavior: smooth;
}
main{
	display: block;
}
h1,
h1,
h2,
h3,
h4,
h5,
h6{
	font-size: inherit;
	font-weight: inherit;
	margin: 0;
}
pre{
	font-family: monospace, monospace;
	font-size: 1em;
}
a{
	background: transparent;
}
abbr[title]{
	border-bottom: none;
	text-decoration: underline dotted;
}
b,
strong{
	font-weight: bold;
}
code,
kbd,
samp{
	font-family: monospace, monospace;
	font-size: 1em;
}
small{
	font-size: 80%;
}
sub,
sup{
	font-size: 75%;
	line-height: 0;
	position: relative;
	vertical-align: baseline;
}
sub{
	bottom: -0.25em;
}
sup{
	top: -0.5em;
}
img{
	border-style: none;
}
button,
input,
optgroup,
select,
textarea{
	font-family: inherit;
	font-size: 100%;
	margin: 0;
}
button{
	background: transparent;
	cursor: pointer;
	line-height: 1.7;
}
button,
[type="button"],
[type="reset"],
[type="submit"]{
	-webkit-appearance: none;
	border: none;
}
fieldset{
	border: none;
	margin: 0;
	padding: 0;
}
ul,
ol{
	margin: 0;
	padding: 0;
	list-style: none;
}
table{
	border-collapse: collapse;
	border-spacing: 0;
}
details{
	display: block;
}
summary{
	display: list-item;
}
template{
	display: none;
}
[hidden]{
	display: none;
}
article,
aside,
footer,
header,
nav,
section{
	display: block;
}
address{
	font-style: normal;
}


/* ==============================================
   Settings
   ============================================= */
:root{
	/* フォントサイズ */
	--fs-12: clamp(0.543rem, 0.2rem + 1.5vw, 0.75rem);
	--fs-14: clamp(0.636rem, 0.25rem + 1.5vw, 0.875rem);
	--fs-16: clamp(0.725rem, 0.25rem + 1.5vw, 1rem);
	--fs-18: clamp(0.817rem, 0.4rem + 1.5vw, 1.125rem);
	/* 基準 */
	--fs-22: clamp(1rem, 0.5rem + 1.5vw, 1.375rem);
	--fs-26: clamp(1.182rem, 0.696rem + 1.392vw, 1.625rem);
	--fs-28: clamp(1.2725rem, 0.75rem + 1.5vw, 1.75rem);
	--fs-28--tr: clamp(1.2725rem, 0.75rem + 1.5vw, 1.75rem);
	--fs-36: clamp(1.635rem, 0.75rem + 1.5vw, 2.25rem);
	--fs-48: clamp(1.636rem, 1.25rem + 1.5vw, 3rem);
	--fs-54: clamp(1.842rem, 1.5rem + 1.5vw, 3.375rem);
	--fs-60: clamp(2.044rem, 1.75rem + 1.5vw, 3.75rem);
	--fs-60--tr: clamp(2.044rem, 1.75rem + 1.5vw, 3.75rem);
	--fs-70: clamp(2.385rem, 1.5rem + 1.5vw, 4.375rem);
	--fs-90: clamp(2.043rem, 2rem + 1.5vw, 5.625rem);
	--fs-100: clamp(3.407rem, 2.25rem + 1.5vw, 6.25rem);
	--fs-110: clamp(5.156rem, 2.375rem + 1.5vw, 6.875rem);
}
@media (max-width: 1200px){
	:root{
		--fs-110: clamp(3.407rem, 2.25rem + 1.5vw, 6.25rem);
	}
}
@media (max-width: 812px){
	--fs-70: clamp(2.188rem, 1.5rem + 1.5vw, 4.375rem);
	--fs-110: clamp(3.407rem, 2.25rem + 1.5vw, 6.25rem);
}
@media (max-width: 450px){
	:root{
		--fs-28--tr: clamp(1.182rem, 0.696rem + 1.392vw, 1.625rem);
		--fs-60--tr: clamp(1.842rem, 1.5rem + 1.5vw, 3.375rem);
		--fs-70: clamp(1.094rem, 1.5rem + 1.5vw, 4.375rem);
		--fs-110: clamp(3.125rem, 2.25rem + 1.5vw, 6.25rem);
	}
}
:root{
	/* 色 */
	--color-blue: #2979d5;
	--color-paleBlue: #E9F3FF;
	--color-red: #FF6E5D;
	/* グラデーション */
	--gradation-blue: linear-gradient(135deg, #1768c4, #56a3fe);
	/* 線 */
	--border-gray: 2px solid #ddd;
}


/* ==============================================
   Base
   ============================================= */
/* 全体 */
*{
	box-sizing: border-box;
	letter-spacing: 0.16em;
}
:focus-visible{
	outline: 3px solid #0bf;
	outline-offset: 3px;
}
/* body */
body{
	font-family: "Noto Sans JP", sans-serif;
	font-size: var(--fs-18);
	font-weight: 500;
	line-height: 1.7;
	color: #3e4449;
	margin: 0;
	position: relative;
	-webkit-font-smoothing: antialiased;
}
/* 段落 */
p{
	margin: 0;
}
/* 定義リスト */
dl{
	margin: 0;
}
dt{
	font-weight: bold;
}
dd{
	padding-left: 0.8em;
	margin: 0;
}
/* テーブル */
table{
	border-collapse: collapse;
	border-spacing: 0;
	max-width: 100% !important;
	color: #3e4449;
	text-align: left;
}
table th, table td{
	border: 1px solid #B2C6DF;
	vertical-align: middle;
	padding: 0.5em 1em;
	background: #fff;
}
table th{
	font-weight: bold;
	background: #EFF6FF;
	min-width: 140px;
}
tfoot tr:nth-child(1){
	border-top: 3px double #B2C6DF;
}
/* リンク */
a{
	cursor: pointer;
	color: inherit;
}
a:not([class]){
	text-decoration: underline;
	transition: opacity 0.15s;
}
a:not([class]):hover{
	opacity: 0.5;
}
a:not([href]){
	pointer-events: none;
	text-decoration: none;
}
a:not([class*="btn"])[target="_blank"]::after,
a[href$=".pdf"]::after,
a[href$=".xlsx"]::after,
a[href$=".word"]::after{
	position: relative;
	display: inline-block;
	font-size: 0.75em;
	font-weight: 400;
}
a:not([class])[target="_blank"]::after{
	content: "";
	width: 1em;
	height: 1em;
	margin-right: 0.25em;
	display: inline-block;
	background-color: currentColor;
	mask: url("./img/icon_gaibu.svg") no-repeat center / contain;
}
a:not([class*="btn"])[href$=".pdf"]::after{
	content: "(pdf)";
}
a:not([class*="btn"])[href$=".xlsx"]::after{
	content: "(Excel)";
}
a:not([class*="btn"])[href$=".word"]::after{
	content: "(Word)";
}
.js-telLink[href="javascript:void(0);"]{
	text-decoration: none;
	pointer-events: none;
	color: inherit;
}
/* 引用 */
blockquote{
	position: relative;
	background: rgba(0, 0, 0, 0.05);
	padding: 2.5em 1.5em;
	margin: 1em 0;
	border-radius: 6px;
	font-style: italic;
}
/* メディア */
iframe{
	width: auto;
	height: 100%;
	max-width: 100%;
	border: none;
}
img{
	max-width: 100%;
	height: auto;
	object-fit: contain;
}
video{
	max-width: 100%;
}
/* 強調 */
em{
	font-style: italic;
}
strong{
	font-weight: bold;
}
ins{
	text-decoration: underline;
}
del{
	text-decoration: line-through double;
}
s{
	text-decoration: line-through;
}
/* hr */
hr{
	border-top: 1px solid #ccc;
}
/* mark */
mark{
	background: #ff9;
	color: #333;
}


/* ===============================================================
   Layout
   =============================================================== */
/* ---------------------------------------
   l-header
   ---------------------------------------- */
.l-header{
	position: fixed;
	display: flex;
	justify-content: flex-end;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
	width: 100%;
	max-width: 1920px;
	margin: 0;
	padding: 0 min(80px, 8vw);
	background: #fff;
	z-index: 1000;
}
.l-header__inner{
	position: relative;
	display: flex;
	justify-content: space-between;
	align-items: center;
	width: 100%;
	max-width: 1640px;
	height: 70px;
}
@media (max-width: 812px){
	.l-header{
		padding: 0 min(24px, 3vw);
	}
	.l-header__inner{
		height: 64px;
	}
}
.l-header__logo{
	width: 300px;
	line-height: 1;
}
@media (max-width: 812px){
	.l-header__logo{
		max-width: min(380px, 50vw);
		height: auto;
	}
}
/* メニューを開くボタン
---------------------------------------- */
.l-header__btn{
	padding: 0;
	z-index: 1000;
	background: none;
	border: none;
	cursor: pointer;
}
.l-header__btn__line,
.l-header__btn__line::before,
.l-header__btn__line::after{
	display: block;
	width: 34px;
	height: 2px;
	background: #56A3FE;
	transition: transform 0.3s;
	transform-origin: top;
}
.l-header__btn__line{
	margin: 12px auto;
}
.l-header__btn__line::before,
.l-header__btn__line::after{
	content: "";
}
.l-header__btn__line::before{
	transform: translateY(-8px);
}
.l-header__btn__line::after{
	transform: translateY(6px);
}
/* オープン時のライン変形 */
[data-drawer-open="true"] .l-header__btn__line{
	background-color: transparent;
}
[data-drawer-open="true"] .l-header__btn__line::before{
	transform: rotate(45deg);
}
[data-drawer-open="true"] .l-header__btn__line::after{
	transform: rotate(-45deg) translateY(-2px);
}
/* グローバルナビ
---------------------------------------- */
.l-gnav{
	position: fixed;
	top: 70px;
	right: -520px;
	width: 100%;
	max-width: min(520px, calc(100% - 2em));
	height: 90vh;
	height: 90dvh;
	padding: 2em;
	background: var(--gradation-blue);
	overflow-y: auto;
	z-index: 998;
	transition: right 0.5s;
	border-bottom-left-radius: 3.5vw;
}
@media (max-width: 812px){
	.l-gnav{
		top: 64px;
	}
}
@media (min-width: 1921px){
	.l-gnav{
		right: -100%;
	}
}
/* オープン時 */
[data-drawer-open="true"] .l-gnav{
	right: 0;
}
[data-drawer-open="true"] body{
	overflow: clip;
}
/* リンクリスト
---------------------------------------- */
.l-gnav__items{
	margin: 0;
	padding: 0;
	padding-bottom: 1em;
}
.l-gnav__item,
.l-gnav__sub__item{
	list-style: none;
}
.l-gnav__link,
.l-gnav__sub__link{
	display: block;
	color: #fff;
	text-decoration: none;
}
.l-gnav__link{
	position: relative;
	font-size: var(--fs-22);
	border-bottom: 1px solid #fff;
	padding: 1em;
	transition: background 0.3s;
}
.l-gnav__link:hover{
	background: rgba(255, 255, 255, 0.15);
}
.l-gnav__link::after{
	position: absolute;
	content: "";
	display: inline-block;
	width: 10px;
	height: 12px;
	background-color: currentColor;
	mask: url("img/arrow.svg") no-repeat center / contain;
	top: 50%;
	right: 24px;
	transform: translateY(-50%);
}
.l-gnav__sub__link{
	width: fit-content;
	font-size: var(--fs-18);
	padding: 0.35em 0;
	transition: opacity 0.3s;
}
.l-gnav__sub__link::before{
	content: "-";
	margin-right: 8px;
}
.l-gnav__sub__link:hover{
	opacity: 0.6;
}
.l-gnav__sub__link--other{
	width: fit-content;
	font-size: var(--fs-14);
	transition: opacity 0.3s;
}
.l-gnav__sub__link--other:hover{
	opacity: 0.6;
}
/* 施工実績のアコーディオン
---------------------------------------- */
.l-gnav__accordion__btn{
	position: relative;
	width: 100%;
	padding: 1em;
	text-align: left;
	background: none;
	border: none;
	color: #fff;
	font-size: var(--fs-22);
	font-weight: 500;
	cursor: pointer;
	transition: background 0.3s;
}
.l-gnav__accordion__btn:hover{
	background: rgba(255, 255, 255, 0.15);
}
.l-gnav__accordion__btn::before,
.l-gnav__accordion__btn::after{
	position: absolute;
	content: "";
	display: inline-block;
	width: 20px;
	height: 2px;
	top: 50%;
	right: 24px;
	transform: translateY(-50%);
	background: #fff;
	transition: transform 0.3s ease;
}
.l-gnav__accordion__btn::after{
	transform: rotate(90deg);
}
/* 小さいリンク */
.l-gnav__sub{
	max-height: 0;
	overflow: hidden;
	border-bottom: 1px solid #fff;
	transition: max-height 0.3s ease, padding 0.4s ease;
	padding-left: 0;
}
.l-gnav__item--open.l-gnav__item--accordion .l-gnav__sub{
	max-height: 500px;
	padding: 0.51em 0 1em;
}
.l-gnav__item--open .l-gnav__accordion__btn::after{
	transform: translateY(-50%) rotate(0);
}
/* バックドロップ
---------------------------------------- */
.l-header__backdrop{
	visibility: hidden;
	opacity: 0;
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100%;
	background: rgba(255, 255, 255, 0.5);
	backdrop-filter: blur(12px);
	-webkit-backdrop-filter: blur(12px);
	z-index: 997;
	transition: visibility 0.3s, opacity 0.3s;
}
[data-drawer-open="true"] .l-header__backdrop{
	visibility: visible;
	opacity: 1;
}
/* ---------------------------------------
   メインビジュアル
   ---------------------------------------- */
.l-mainVisual{
	position: relative;
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	animation: appear 1s ease-out 0.25s forwards;
	opacity: 0;
}
@keyframes appear{
	from{
		opacity: 0;
	}
	to{
		opacity: 1;
	}
}
.l-mainVisual__inner{
	position: relative;
	display: flex;
	justify-content: flex-start;
	align-items: center;
	width: 100%;
	max-width: 1920px;
	height: 100vh;
	margin: 70px 0 auto;
	z-index: -100;
}
.l-mainVisual__inner::after{
	content: "";
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	width: 50%;
	height: 100vh;
	background: linear-gradient(90deg,
			rgba(23, 104, 196, 1),
			rgba(86, 163, 254, 0.58),
			rgba(86, 163, 254, 0));
	z-index: 1;
}
@media (max-width: 812px){
	.l-mainVisual__inner{
		align-items: flex-end;
		height: calc(100vh - 64px + 50px);
		padding: 3vh 0;
		margin: 64px 0 auto;
	}
	.l-mainVisual__inner::after{
		width: 100%;
		height: calc(100vh - 64px);
		margin-top: 30%;
		background: linear-gradient(0deg,
				rgba(23, 104, 196, 1),
				rgba(86, 163, 254, 0.58),
				rgba(86, 163, 254, 0));
	}
}
/* スライドショー */
.l-mainVisual__splide{
	position: relative;
	background: #fff;
}
.l-mainVisual__splide__list{
	position: fixed;
	width: 100%;
	height: 100%;
	top: 0;
	background: #fff;
}
.l-mainVisual__splide__list > .splide__slide.l-mainVisual__splide__img01,
.l-mainVisual__splide__list > .splide__slide.l-mainVisual__splide__img02,
.l-mainVisual__splide__list > .splide__slide.l-mainVisual__splide__img03{
	max-width: 1920px;
	width: 100%;
	margin: 0 auto;
	height: 100vh;
	background-repeat: no-repeat;
	background-size: cover;
}
.l-mainVisual__splide__list > .splide__slide.l-mainVisual__splide__img01{
	background-image: url("./img/img_mainVisual01.jpg");
	background-position: 60% top;
}
.l-mainVisual__splide__list > .splide__slide.l-mainVisual__splide__img02{
	background-image: url("./img/img_mainVisual02.jpg");
	background-position: 60% center;
}
.l-mainVisual__splide__list > .splide__slide.l-mainVisual__splide__img03{
	background-image: url("./img/img_mainVisual03.jpg");
	background-position: 60% bottom;
}
@media (max-width: 812px){
	.l-mainVisual__splide__list > .splide__slide.l-mainVisual__splide__img02{
		background-position: 80% center;
	}
}
/* スライドショーが表示されない時 */
.l-mainVisual__fallBack{
	position: relative;
}
.l-mainVisual__fallBack__inner{
	position: fixed;
	max-width: 1920px;
	width: 100%;
	margin: 0 auto;
	height: 100vh;
	top: 0;
	background: var(--gradation-red);
	background-image: url("./img/img_mainVisual01.jpg");
	background-repeat: no-repeat;
	background-position: 60% top;
	background-size: cover;
}
.l-mainVisual__fallBack__inner::after{
	content: "";
	position: absolute;
	display: block;
	width: 50%;
	height: 100vh;
	background: linear-gradient(90deg,
			rgba(23, 104, 196, 1),
			rgba(86, 163, 254, 0.58),
			rgba(86, 163, 254, 0));
}
/* 文字 */
.l-mainVisual__text{
	position: relative;
	width: 100%;
	max-width: 1700px;
	margin: 0 auto;
	padding: 24px min(80px, 8vw);
	color: #fff;
	font-size: var(--fs-90);
	z-index: 2;
	opacity: 0;
	animation: appear 0.2s ease-out 1s forwards;
}
@media (max-width: 812px){
	.l-mainVisual__text{
		padding: 24px min(24px, 3vw);
		font-size: var(--fs-70);
		margin-bottom: 1em;
	}
}
@media (max-width: 450px){
	.l-mainVisual__text{
		font-size: var(--fs-54);
	}
}
/* ---------------------------------------
   main
   ---------------------------------------- */
/*通常*/
.l-main{
	position: relative;
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	z-index: 1;
	background: #fff;
}
/*狭い幅（404などのサブコンテンツ）*/
.l-main--narrow{
	position: relative;
	width: 100%;
	margin: 0 auto 1em;
	z-index: 1;
	background: #fff;
	max-width: 1200px;
	padding: min(60px, 4vw) min(80px, 8vw) min(24px, 3vw);
}
@media (max-width: 812px){
	.l-main--narrow{
		position: relative;
		width: 100%;
		margin: 0 auto 1em;
		z-index: 1;
		background: #fff;
		max-width: 1200px;
		padding: min(60px, 4vw) min(24px, 3vw) min(24px, 3vw);
	}
}

/*-------------通常-------------*/
.l-content{
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	padding: min(60px, 10vw) min(80px, 8vw);
}
@media (max-width: 812px){
	.l-content{
		padding: min(60px, 10vw) min(24px, 3vw);
	}
}

/*paddingを広く*/
.l-content--paddingWide{
	padding: min(180px, 12vw) min(80px, 8vw);
}
@media (max-width: 812px){
	.l-content--paddingWide{
		padding: min(180px, 12vw) min(24px, 3vw);
	}
}
/*インナー*/
.l-content__inner--normal{
	width: 100%;
	max-width: 1520px;
	margin: 0 auto;
	padding: min(24px, 3vw) 0;
}
/*-------------右寄せ-------------*/
.l-content--right{
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	padding: min(100px, 12vw) 0 min(100px, 12vw) min(80px, 8vw);
	overflow: hidden;
}
@media (max-width: 812px){
	.l-content--right{
		padding: min(100px, 12vw) 0 min(100px, 12vw) min(24px, 3vw);
	}
}

/*paddingを広く*/
.l-content--right.l-content--paddingWide{
	padding: min(200px, 12vw) 0 min(200px, 12vw) min(80px, 8vw);
}
@media (max-width: 812px){
	.l-content--right.l-content--paddingWide{
		padding: min(200px, 12vw) 0 min(200px, 12vw) min(24px, 3vw);
	}
}

/*インナー*/
.l-content__inner--right{
	width: 100%;
	max-width: 1720px;
	margin: 0 0 0 auto;
	padding: min(24px, 3vw) 0;
}
/*-------------左寄せ-------------*/
.l-content--left{
	width: 100%;
	max-width: 1920px;
	margin: 0 auto;
	padding: min(100px, 12vw) min(24px, 3vw) min(100px, 12vw) 0;
	overflow: hidden;
}
@media (max-width: 812px){
	.l-content--left{
		padding: min(100px, 12vw) min(80px, 8vw) min(100px, 12vw) 0;
	}
}

/*paddingを広く*/
.l-content--left.l-content--paddingWide{
	padding: min(200px, 12vw) min(80px, 8vw) min(200px, 12vw) 0;
}
@media (max-width: 812px){
	.l-content--left.l-content--paddingWide{
		padding: min(200px, 12vw) min(24px, 3vw) min(200px, 12vw) 0;
	}
}

/*インナー*/
.l-content__inner--left{
	width: 100%;
	max-width: 1720px;
	margin: 0 auto 0 0;
	padding: min(24px, 3vw) 0;
}
/*-------------背景色が二重-------------*/
/*二重且つ中央*/
.l-content--layeredCenter{
	padding-left: min(24px, 3vw);
	padding-right: min(24px, 3vw);
}
.l-content__inner--layered{
	padding: min(160px, 10vw) min(80px, 8vw);
	border-radius: 3.5vw;
}
.l-content__inner--right.l-content__inner--layered{
	border-top-right-radius: 0;
	border-bottom-right-radius: 0;
}
.l-content__inner--left.l-content__inner--layered{
	border-top-left-radius: 0;
	border-bottom-left-radius: 0;
}
.l-layered--1520px{
	max-width: 1520px;
	margin: 0 auto;
}
.l-layered--1400px{
	max-width: 1400px;
	margin: 0 auto;
}
@media (max-width: 812px){
	.l-content--layered{
		padding-left: 1.5vw;
		padding-right: 1.5vw;
	}
	.l-content--right.l-content--layered{
		padding-right: 0;
	}
	.l-content--left.l-content--layered{
		padding-left: 0;
	}
	.l-content__inner--layered{
		padding: min(160px, 20vw) min(36px, 4.5vw);
	}
}
/* ---------------------------------------
   footer
   ---------------------------------------- */
/* contact
---------------------------------------- */
.l-contact{
	position: relative;
	background: #fff;
	z-index: 1;
	max-width: 1920px;
}
.l-contact__inner{
	width: 100%;
	max-width: 1520px;
	margin: 0 auto;
}
.l-contact__items{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	gap: 2em 4em;
}
/* footer
---------------------------------------- */
.l-footer{
	position: relative;
	width: 100%;
	max-width: 1920px;
	padding: 0 min(80px, 8vw);
	background: #fff;
	color: #324D6B;
	margin: 0 auto;
	z-index: 1;
}
.l-footer__wrap{
	width: 100%;
	max-width: 1920px;
	background: var(--color-paleBlue);
	border-top-left-radius: 2vw;
	border-top-right-radius: 2vw;
}
.l-footer__inner{
	width: 100%;
	max-width: 1520px;
	margin: 0 auto;
	padding: min(128px, 6vw) min(80px, 8vw) min(64px, 6vw);
}
.l-footer__flex{
	align-items: center;
}
.l-footer__logo{
	display: flex;
	align-items: center;
	justify-content: center;
	max-width: 300px;
	background: #fff;
	margin-bottom: 1em;
}
.l-footer__logoLink{
	padding: 0.75em 1em 0.4em;
}
.l-footer__mark{
	display: flex;
	align-items: flex-end;
	gap: 1em;
}
.l-footer__markInner{
	width: 4em;
}
.l-footer__markImg{
	width: 100%;
}
@media (max-width: 812px){
	.l-footer{
		padding: 0 min(24px, 3vw);
	}
	.l-footer__inner{
		padding: min(128px, 12vw) min(64px, 6vw);
	}
	.l-footer__flex{
		align-items: flex-start;
		width: 100%;
		max-width: 80vw;
	}
	.l-footer__logo{
		max-width: 50vw;
	}
	.l-footer__mark{
		max-width: 40vw;
	}
}
/* ---------------------------------------
/* 2階層目共通
   ---------------------------------------- */
.l-2ndHead{
	position: relative;
	width: 100%;
	max-width: 1920px;
	margin: 70px auto 0;
	padding: 0 min(24px, 3vw) min(24px, 3vw);
}
.l-2ndHead__inner{
	width: 100%;
	margin: 0 0 0 auto;
	padding: min(36px, 4.5vw) min(160px, 10vw) min(60px, 9vw);
	border-bottom-left-radius: 3.5vw;
	border-bottom-right-radius: 3.5vw;
	color: #fff;
	background: linear-gradient(130deg, #1768C4 0%, #56A3FE 50%, #DEEBF4 100%);
}
@media (max-width: 812px){
	.l-2ndHead{
		margin: 64px auto 0;
	}
	.l-2ndHead__inner{
		max-width: 1600px;
		margin: 0 auto;
		padding: min(36px, 4.5vw) min(48px, 6vw) min(60px, 8vw);
	}
}


/* ===============================================================
   Component
   =============================================================== */
/* 見出し
---------------------------------------- */
/* --------------- H2 --------------- */
/* 通常 */
.c-h2__wrap{
	position: relative;
	width: 100%;
	max-width: 1284px;
	height: auto;
	margin-bottom: 5em;
	aspect-ratio: 300 / 34;
	box-sizing: content-box;
	padding-bottom: 1.5em;
}
.c-h2__wrap::after{
	position: relative;
	content: "";
	display: block;
	width: 100%;
	height: auto;
	background-position: left top;
	background-size: contain;
	background-repeat: no-repeat;
	background-image: url("./img/h2_company.svg");
	aspect-ratio: 300 / 34;
	z-index: 1;
}
.c-heading--lv2{
	width: auto;
	font-size: var(--fs-48);
	font-weight: 600;
	display: inline-block;
}
.c-h2__wrap .c-heading--lv2{
	position: absolute;
	bottom: 0;
	left: 0;
	width: max-content;
	border-bottom: 2px solid currentColor;
	padding: 0 0.5em;
	z-index: 2;
}
@media (max-width: 812px){
	.c-h2__wrap{
		aspect-ratio: 300 / 47;
	}
	.c-h2__wrap::after{
		aspect-ratio: 300 / 47;
	}
}
/* 中央寄せ */
.c-h2__wrap--center{
	margin-left: auto;
	margin-right: auto;
}
.c-h2__wrap--center::after{
	margin: 0 auto;
	background-position: center top;
}
.c-h2__wrap--center .c-heading--lv2{
	left: 50%;
	transform: translateX(-50%);
}
/* 縦書き */
@media (min-width:813px){
	.c-h2__wrap--vertical{
		margin: 0 5em 0 0;
		padding: 0 1.5em 0 0;
		max-width: 146px;
		aspect-ratio: auto;
	}
	.c-heading--lv2.u-text--vertical{
		top: 0;
		bottom: inherit;
		right: 0;
		left: inherit;
		border-bottom: none;
		border-right: 2px solid currentColor;
		padding: 0.5em 0;
		letter-spacing: 0.36em;
	}
}
/* 各階層見出し
---------------------------------------- */
/*--------企業情報---------*/
#company::after{
	background-image: url("./img/h2_company.svg");
}
/*トップ*/
.c-h2--top[id="company"]{
	aspect-ratio: 300 / 47;
	max-width: 943px;
}
.c-h2--top[id="company"]::after{
	aspect-ratio: 300 / 47;
}

/*--------施工実績--------*/
#works::after{
	background-image: url("./img/h2_works.svg");
}
/*トップ横書き*/
@media(max-width:812px){
	.c-h2--top[id="works"]{
		aspect-ratio: 300 / 65;
		max-width: 600px;
	}
	.c-h2--top[id="works"]::after{
		aspect-ratio: 300 / 65;
	}
}
/*トップ縦書き*/
@media(min-width:813px){
	#works[class*="c-h2__wrap--vertical"]::after{
		background-image: url("./img/h2_works--vertical.svg");
		height: 100%;
		aspect-ratio: 150 / 33;
	}
}
/*2階層目横書き*/
.l-2ndHead #works::after{
	opacity: 0.4;
}

/*--------私たちの強み--------*/
/*pc版*/
#ourFeature::after{
	background-image: url("./img/h2_ourFeature--pc.svg");
}
/*sp版*/
@media(max-width:812px){
	#ourFeature{
		aspect-ratio: 300/124;
		max-width: 620px;
	}
	#ourFeature::after{
		background-image: url("./img/h2_ourFeature--sp.svg");
		aspect-ratio: 300/124;
	}
}

/*--------採用情報--------*/
#recruit::after{
	background-image: url("./img/h2_recruit.svg");
}
.c-h2--top[id="recruit"]{
	aspect-ratio: 300 / 56;
	max-width: 810px;
}
.c-h2--top[id="recruit"]::after{
	aspect-ratio: 300 / 56;
}

/*--------お問い合わせ（フッター）--------*/
#contact--footer{
	aspect-ratio: 300 / 50;
	max-width: 884px;
}
#contact--footer::after{
	background-image: url("./img/h2_contact.svg");
	aspect-ratio: 300 / 50;
}

/*--------お問い合わせ（2階層目）--------*/
#contact::after{
	background-image: url("./img/h2_contact--2nd.svg");
}

/*--------お知らせ--------*/
#news::after{
	background-image: url("./img/h2_news.svg");
}

/*2階層目*/
.l-2ndHead .c-h2__wrap{
	max-width: 943px;
	margin-bottom: 0;
}
.l-2ndHead .c-h2__wrap::after{
	width: 100%;
	height: auto;
	aspect-ratio: 300/34;
}
@media(max-width:812px){
	.l-2ndHead .c-h2__wrap{
		aspect-ratio: 220 / 35;
	}
	.l-2ndHead .c-h2__wrap::after{
		aspect-ratio: 220 / 35;
	}
}
/* ----------------- H3 ----------------- */
.c-heading--lv3{
	position: relative;
	font-size: var(--fs-36);
	font-weight: 600;
	padding-left: 1em;
	margin-bottom: 1em;
	letter-spacing: 0.25em;
}
.c-heading--lv3::before{
	content: "";
	position: absolute;
	top: 0.4em;
	left: 0;
	display: inline-block;
	width: 0.5em;
	height: 1em;
	background: #d6e7fb;
	border-radius: 0.1em;
}
@media(min-width:813px){
	.u-text--vertical.c-heading--lv3{
		position: relative;
		font-size: var(--fs-36);
		font-weight: 600;
		padding-left: 0;
		padding-top: 1em;
		margin-bottom: 1em;
	}
	.u-text--vertical.c-heading--lv3::before{
		content: "";
		position: absolute;
		top: -0.2em;
		left: 50%;
		transform: translateX(-50%);
		display: inline-block;
		width: 1em;
		height: 0.5em;
	}
}
/* ----------------- H4 ----------------- */
.c-heading--lv4{
	width: auto;
	font-size: var(--fs-28);
	font-weight: bold;
	display: inline-block;
	border-bottom: 2px solid currentColor;
	padding: 0 0.5em;
	margin-bottom: 1em;
	letter-spacing: 0.3em;
}
/* ----------------- H5 ----------------- */
.c-heading--lv5{
	font-size: var(--fs-22);
	font-weight: bold;
	padding-bottom: 0.5em;
	margin-bottom: 0.5em;
}
.c-heading--lv5::after{
	content: "";
	display: block;
	width: 2em;
	height: 2px;
	background-color: currentColor;
}
/* ----------------- H6 ----------------- */
.c-heading--lv6{
	font-size: var(--fs-18);
	font-weight: bold;
}
/* パンくず
----------------------------------------*/
.c-breadline{
	color: #fff;
	font-size: var(--fs-14);
	margin-bottom: 1em;
}
.c-breadline__inner{
	display: flex;
	width: 100%;
	margin: 0 auto;
	flex-wrap: wrap;
}
.c-breadline__item{
	margin-right: 1rem;
}
.c-breadline__item span{
	display: inline-block;
	max-width: 45vw;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	vertical-align: bottom;
}
.c-breadline__item a{
	opacity: 1;
}
.c-breadline__item:not(:last-child)::after{
	content: ">";
	margin-left: 0.5em;
}
/* ボタン
---------------------------------------- */
.c-btn{
	position: relative;
	display: inline-flex;
	flex-direction: column;
	justify-content: center;
	min-width: 16vw;
	height: 100%;
	padding: 1em 5em 1em 2em;
	margin: 0;
	color: #fff;
	text-decoration: none;
	background: linear-gradient(120deg, #0d65a9, #004aab, #333, rgba(51, 51, 51, 0.5));
	background-size: 300% 100%;
	background-position: 100% 0%;
	transition: background-position 0.3s;
	border-radius: 0.4em;
	font-size: var(--fs-22);
	font-weight: 500;
}
.c-btn:hover{
	background-position: 0% 0%;
}
.c-btn::after{
	content: "";
	position: absolute;
	top: 50%;
	right: 2.5em;
	transform: translateY(-50%);
	width: 10px;
	height: 12px;
	background: currentcolor;
	mask: url("./img/arrow.svg") no-repeat center / contain;
	transition: right 0.3s, transform 0.3s;
}
@media (max-width: 450px){
	.c-btn::after{
		right: 2em;
	}
}
.c-btn:hover::after{
	right: 1.8em;
	transform: translateY(-50%) scale(1.3);
}
@media (max-width: 812px){
	.c-btn{
		width: 100%;
		flex-direction: row;
		justify-content: center;
		align-items: center;
	}
}
/* 戻るボタン */
.c-btn--back{
	padding: 1em 2em 1em 5em;
}
.c-btn--back::after{
	left: 2.5em;
	right: auto;
	transform: translateY(-50%) scale(-1, 1);
	transition: left 0.3s, transform 0.3s;
}
.c-btn--back:hover::after{
	left: 1.8em;
	transform: translateY(-50%) scale(-1.3, 1.3);
}
.c-btn--short{
	min-width: inherit;
	padding: 1em 5em 1em 4em;
}
.c-btn--short.c-btn--back{
	min-width: inherit;
	padding: 1em 4em 1em 5em;
}
@media (max-width: 812px){
	.c-btn--short{
		width: fit-content;
	}
}
.c-btn--pale{
	background: var(--color-paleBlue);
	color: #3e4449;
	transition: filter 0.3s;
}
.c-btn--pale:hover{
	filter: brightness(0.9);
}
.c-btn[target="_blank"]::after{
	background: currentcolor;
    mask: url(./img/icon_gaibu.svg) no-repeat center / contain;
	width: 1em;
	height: 0.85em;
}
.c-btn--mail{
	background: linear-gradient(120deg,
			#316CC4,
			#1C92B7,
			#67BED5,
			rgba(19, 59, 152, 0.5));
	background-size: 300% 100%;
	background-position: 100% 0%;
	font-size: var(--fs-28--tr);
}
/* お電話でのお問い合わせ */
.c-btn--tel{
	text-decoration: none;
}
.c-btn--tel[href*="tel"]{
	position: relative;
	padding: 2em 4em 2em 2em;
	border-radius: 0.8em;
	background: #fff;
	box-shadow: 0 0 20px 0 rgba(11, 103, 183, 0.3);
}
.c-btn--tel[href*="tel"]::after{
	content: "";
	position: absolute;
	top: 50%;
	right: 2.5em;
	transform: translateY(-50%);
	width: 10px;
	height: 12px;
	background: currentcolor;
	mask: url("./img/arrow.svg") no-repeat center / contain;
	transition: right 0.3s, transform 0.3s;
}
@media (max-width:812px){
	.c-btn--tel{
		width: 100%
	}
}
@media (max-width:812px){
	.c-btn--tel[href*="tel"]{
		width: 100%;
	}
}
/* disabledのスタイル */
.c-btn:disabled{
	color: #fff;
	background: #ccc;
	pointer-events: none;
}
.c-btn:disabled::before{
	content: none;
}
/* お知らせリスト
---------------------------------------- */
.c-newsList{
	width: 100%;
	padding-left: 0;
}
.c-newsList__item{
	position: relative;
	margin: 0;
	list-style-type: none;
	width: 100%;
}
.c-newsList__item + .c-newsList__item{
	margin-top: 1em;
}
.c-newsList__link{
	position: relative;
	display: flex;
	align-items: flex-start;
	gap: 0 1em;
	padding: 1.5em 5em 1.5em 3em;
	background: #fff;
	border-radius: 0.5em;
	text-decoration: none;
	transition: filter 0.3s;
}
.c-newsList__link:hover{
	filter: brightness(0.93);
}
.c-newsList__link::after{
	content: "";
	position: absolute;
	top: 50%;
	right: 2.5em;
	transform: translateY(-50%);
	width: 10px;
	height: 12px;
	background: currentcolor;
	mask: url("./img/arrow.svg") no-repeat center / contain;
	transition: right 0.3s, transform 0.3s;
}
.c-newsList__link:hover::after{
	right: 1.8em;
	transform: translateY(-50%) scale(1.3);
}

@media (max-width: 812px){
	.c-newsList__link{
		flex-direction: column;
		padding: 1em 4em 1em 2em
	}
}
.c-newsList__date{
	position: relative;
	padding-right: 3em;
}
.c-newsList__item.new .c-newsList__date::after{
	content: "NEW";
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	display: inline-block;
	padding: 4px 8px;
	margin-left: 8px;
	color: #555;
	background: #DCFF48;
	line-height: 1;
	font-size: 0.75em;
	letter-spacing: 1px;
	border-radius: 4px;
}
/* ページャー
---------------------------------------- */
.c-pager{
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 1em;
	width: 100%;
	margin: 0 auto;
	text-align: center;
	margin-top: 3em;
}
.c-pager__list{
	display: inline-block;
	width: fit-content;
	min-width: 3em;
	height: 3em;
	margin-left: 0;
	font-size: var(--fs-22);
}
.c-pager__list__link,
.c-pager__arrow{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
	margin: auto;
	padding: 0 0.5em;
	text-decoration: none;
	border-radius: 100px;
	background: var(--color-paleBlue);
	transition: color 0.2s, filter 0.2s;
}
.c-pager__arrow{
	position: relative;
}
.c-pager__arrow::before{
	content: "";
	position: absolute;
	display: inline-block;
	top: 50%;
	left: 50%;
	width: 0.5em;
	height: 0.5em;
	border-bottom: 2px solid currentcolor;
	border-right: 2px solid currentcolor;
	transform: translate(-70%, -50%) rotate(-45deg);
}
.c-pager__arrow--prev{
	transform: scale(-1);
}
.c-pager__link--current{
	color: #fff;
	background-color: var(--color-blue);
	cursor: pointer
}
.c-pager__list__link:hover,
.c-pager__arrow:hover{
	filter: brightness(0.9);
}
/* カード
---------------------------------------- */
.c-card{
	padding: 1.6em;
	background: #fff;
	color: #3e4449;
	border-radius: 0.4em;
}
@media (min-width: 813px){
	.c-card--paddingWide{
		padding: 2.4em;
	}
}
/*アイコン付き*/
.c-iconCard__head{
	display: flex;
	gap: 1em;
	align-items: center;
}
.c-iconCard__img{
	width: 3.5rem;
	height: 3.5rem;
	padding: 0.5rem;
	border-radius: 0.2em;
	background: #D6E7FB;
}
/* リスト
---------------------------------------- */
.c-list--ul,
.c-list--ol{
	padding-left: 2em;
}
.c-list--ul > li{
	list-style-type: disc;
}
.c-list--ul li::marker{
	color: #999;
	font-size: 1.2em;
	line-height: 1;
}
.c-list--ol > li{
	list-style: decimal;
}
.c-list--wide li + li{
	margin-top: 1em;
}
.c-list__heading::marker,
.c-list__headingText{
	font-weight: bold;
	color: #095CBC;
}
.c-list__inList .c-list--ul,
.c-list__inList .c-list--ol{
	padding-left: 1em;
}
.c-list__inList > li{
	margin-top: 0.5em;
}
.c-list__inList > li > .c-list--ul > li,
.c-list__inList > li > .c-list--ol > li{
	margin-top: 0;
}
.c-list__inList > li > .c-list--ul > li::marker,
.c-list__inList > li > .c-list--ol > li::marker{
	color: #ccc;
	font-size: 1em;
}
/* テーブル
---------------------------------------- */
.c-table--thWide th{
	min-width: 180px;
}
/* focus
---------------------------------------- */
.c-focus{
	padding: 1em;
	background: #eff6ff;
	border-radius: 0.4em;
}
/* attention
---------------------------------------- */
.c-attention{
	padding: 1em;
	background: #FFEFF2;
	border-radius: 0.4em;
}
/* 画像のwrap（中央寄せ・角丸）
---------------------------------------- */
.c-imgWrap{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: auto;
	overflow: hidden;
	border-radius: 0.4em;
}
/* ロゴのリンク
---------------------------------------- */
.c-logo__link{
	width: 100%;
	height: 100%;
	display: inline-block;
	transition: opacity 0.3s;
	background: #fff;
}
.c-logo__link[href]{
	cursor: pointer;
}
.c-logo__link[href]:hover{
	opacity: 0.5;
}
.c-logo__img{
	width: 100%;
}
/* 数字で見る 項目
---------------------------------------- */
.c-data__card{
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 2em;
}
.c-data__card--column{
	flex-direction: column;
}
.c-data__card--columnSP{
	justify-content: space-between;
}
@media(max-width:430px){
	.c-data__card--columnSP{
		flex-direction: column-reverse;
	}
}
.c-data__img{
	display: flex;
	justify-content: center;
	align-items: center;
}
@media(max-width:430px){
	.c-data__img{
		max-width: 150px;
	}
	.c-data__card{
		gap: 1em;
	}
}
.c-data__text{
	display: flex;
	flex-direction: column;
	align-items: center;
}
.c-data__value{
	display: flex;
	align-items: flex-end;
}
.c-data__number{
	font-family: "Bebas Neue", sans-serif;
	font-weight: 400;
	letter-spacing: 0.05em;
	line-height: 1;
	margin-top: 0.1em;
}
.c-data__unit{
	margin-bottom: 0.4em;
}
.c-data__grade{
	width: fit-content;
	padding: 0.1em 1em;
	background: var(--color-paleBlue);
	border-radius: 0.2vw;
}


/* ===============================================================
   object
   =============================================================== */
.o-width--100{
	width: 100%;
}
.o-flex{
	display: flex;
	gap: 2em 1em;
}
.o-flex--spacebetween{
	justify-content: space-between;
}
.o-flex--alignCenter{
	align-items: center;
}
.o-flex--row{
	display: flex;
	gap: 1em;
}
.o-flex--wrap{
	flex-wrap: wrap;
}
.o-inline-flex{
	display: inline-flex;
	gap: 1em;
	align-items: center;
}
.o-flex__inner{
	width: 50%;
}
@media (max-width: 812px){
	.o-flex{
		flex-direction: column;
	}
	.o-flex--row{
		flex-direction: row;
	}
	.o-flex__inner{
		width: 100%;
	}
	.o-flex--reverse{
		flex-direction: column-reverse;
	}
}
.o-grid--2{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1.5em;
}
@media (max-width: 812px){
	.o-grid--2{
		grid-template-columns: 1fr;
		gap: 1em;
	}
}
.o-grid--3{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	gap: 1.5em;
}
@media (max-width: 1200px){
	.o-grid--3{
		grid-template-columns: 1fr 1fr;
	}
}
@media (max-width: 812px){
	.o-grid--3{
		grid-template-columns: 1fr;
		gap: 1em;
	}
}
.o-grid--4{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr 1fr;
	gap: 1em;
}
@media (max-width: 1200px){
	.o-grid--4{
		grid-template-columns: 1fr 1fr;
	}
}
@media (max-width: 812px){
	.o-grid--4{
		grid-template-columns: 1fr;
		gap: 1em;
	}
}
.o-center{
	display: flex;
	justify-content: center;
}
.o-right{
	display: flex;
	justify-content: flex-end;
}
.o-text__center{
	text-align: center
}
.o-text__right{
	text-align: right
}


/* ===============================================================
   Utility
   =============================================================== */
/* 文字
---------------------------------------- */
/* フォントサイズ */
.u-fs--12{
	font-size: var(--fs-12);
}
.u-fs--14{
	font-size: var(--fs-14);
}
.u-fs--16{
	font-size: var(--fs-16);
}
.u-fs--18{
	font-size: var(--fs-18);
}
.u-fs--22{
	font-size: var(--fs-22);
}
.u-fs--26{
	font-size: var(--fs-26);
}
.u-fs--28{
	font-size: var(--fs-28);
}
.u-fs--28--tr{
	font-size: var(--fs-28--tr);
}
.u-fs--36{
	font-size: var(--fs-36);
}
.u-fs--48{
	font-size: var(--fs-48);
}
.u-fs--54{
	font-size: var(--fs-54);
}
.u-fs--60{
	font-size: var(--fs-60);
}
.u-fs--60--tr{
	font-size: var(--fs-60--tr);
}
.u-fs--70{
	font-size: var(--fs-70);
}
.u-fs--90{
	font-size: var(--fs-90);
}
.u-fs--100{
	font-size: var(--fs-100);
}
.u-fs--110{
	font-size: var(--fs-110);
}
/* 色 */
.u-text--white{
	color: #fff;
}
.u-text--yellow{
	color: #FFFB8A;
}
.u-text--lime{
	color: #DCFF48;
}
.u-text--red{
	color: var(--color-red);
}
.u-text--gray{
	color: #aaa;
}
.u-text--blue{
	color: #095CBC;
}
/* 太さ */
.u-font--bold{
	font-weight: 700;
}
.u-font--semibold{
	font-weight: 600;
}
/* 行間 */
.u-lineheight--m{
	line-height: 2;
}
.u-lineheight--l{
	line-height: 2.8;
}
.u-lineheight--s{
	line-height: 1.3;
}
.u-letterspacing--s{
	letter-spacing: 0.1em;
}
/* 縦書き */
@media (min-width:813px){
	.u-text--vertical{
		writing-mode: vertical-rl;
		-webkit-writing-mode: vertical-rl;
		text-orientation: upright;
	}
}
/* マーカー */
.u-marker {
	display: inline;
	background: linear-gradient(transparent 70%, rgba(86, 163, 254, 0.3) 30%);
}
.is-show .u-marker{
	display: inline;
	background-image: linear-gradient(
		transparent 70%,
		rgba(86, 163, 254, 0.3) 0
	);
	background-repeat: no-repeat;
	background-size: 0% 100%;
	background-position: left bottom;
	animation: markerLine 0.6s ease-out 0.5s forwards;
}
@keyframes markerLine {
	from {
		background-size: 0% 100%;
	}
	to {
		background-size: 100% 100%;
	}
}
/* margin
---------------------------------------- */
/* 上 */
.u-marginTop--0{
	margin-top: 0;
}
.u-marginTop--0-5em{
	margin-top: 0.5em;
}
.u-marginTop--1em{
	margin-top: 1em;
}
.u-marginTop--1-5em{
	margin-top: 1.5em;
}
.u-marginTop--2em{
	margin-top: 2em;
}
.u-marginTop--3em{
	margin-top: 3em;
}
.u-marginTop--4em{
	margin-top: 4em;
}
.u-marginTop--5em{
	margin-top: 5em;
}
.u-marginTop--8em{
	margin-top: 8em;
}
/* 下 */
.u-marginBottom--0{
	margin-bottom: 0;
}
.u-marginBottom--0-5em{
	margin-bottom: 0.5em;
}
.u-marginBottom--1em{
	margin-bottom: 1em;
}
.u-marginBottom--1-5em{
	margin-bottom: 1.5em;
}
.u-marginBottom--2em{
	margin-bottom: 2em;
}
.u-marginBottom--3em{
	margin-bottom: 3em;
}
.u-marginBottom--4em{
	margin-bottom: 4em;
}
.u-marginBottom--5em{
	margin-bottom: 5em;
}
.u-marginBottom--8em{
	margin-bottom: 8em;
}
/* padding
---------------------------------------- */
/* 上 */
.u-paddingTop--0{
	padding-top: 0;
}
.u-paddingTop--0-5em{
	padding-top: 0.5em;
}
.u-paddingTop--1em{
	padding-top: 1em;
}
.u-paddingTop--1-5em{
	padding-top: 1.5em;
}
.u-paddingTop--2em{
	padding-top: 2em;
}
.u-paddingTop--3em{
	padding-top: 3em;
}
.u-paddingTop--4em{
	padding-top: 4em;
}
.u-paddingTop--4-5em{
	padding-top: 4.5em;
}
/* 下 */
.u-paddingBottom--0{
	padding-bottom: 0;
}
.u-paddingBottom--0-5em{
	padding-bottom: 0.5em;
}
.u-paddingBottom--1em{
	padding-bottom: 1em;
}
.u-paddingBottom--1-5em{
	padding-bottom: 1.5em;
}
.u-paddingBottom--2em{
	padding-bottom: 2em;
}
.u-paddingBottom--3em{
	padding-bottom: 3em;
}
.u-paddingBottom--4em{
	padding-bottom: 4em;
}
/* gap
---------------------------------------- */
.u-gap--1em{
	gap: 1em;
}
.u-gap--2em{
	gap: 2em;
}
.u-gap--3vw{
	gap: 3vw;
}
.u-gap--4vw{
	gap: 4vw;
}
.u-gap--5vw{
	gap: 5vw;
}
/* 色
---------------------------------------- */
/* 背景色 */
.u-bg--white{
	background: #fff;
	color: #3e4449;
}
.u-bg--blue{
	color: #fff;
	background: var(--gradation-blue);
}
.u-bg--whiteToBlue{
	background: linear-gradient(to bottom, #fff 0%, #eff6ff 10%, #fff 100%);
}
.u-bg--paleBlue{
	background: #F8FBFF;
	color: #3e4449;
}
.u-bg--mediumBlue{
	background: #92c3fa;
}
.u-bg--gray{
	background: #f8f8f8;
	color: #3e4449;
}
.u-bg--grid{
	background-color: #fff;
	background-image: linear-gradient(#e4ebf1 1px, transparent 1px),
		linear-gradient(90deg, #e4ebf1 1px, transparent 1px);
	background-size: min(50px, 7vw) min(50px, 7vw);
	color: #3e4449;
}
.u-bg--sunrise{
	color: #fff;
	background: linear-gradient(to bottom right,
			#1768c4 0%,
			#56a3fe 50%,
			#ffd677 100%);
}
.u-bg--transparent{
	background: transparent;
}
@media (max-width: 812px){
	.l-content__inner--layered.u-bg--sunrise{
		color: #fff;
		background: linear-gradient(150deg,
				#1768c4 0%,
				#56a3fe 50%,
				#ffd677 100%);
	}
}
/* ボックスシャドウ */
.u-boxshadow{
	background: #fff;
	box-shadow: 0 0 20px 0 rgba(50, 78, 112, 0.2);
}
/* 画像などに線を付ける */
.u-border--paleBlue{
	border: 2px solid #e4ebf1;
}
/* 表示・非表示
---------------------------------------- */
/*画面上に表示しない */
.u-visually-hidden{
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}
/* レスポンシブで表示を切替
---------------------------------------- */
/* スマホでは非表示 */
@media (max-width: 812px){
	.u-hidden-sp{
		display: none;
	}
}
/* PCでは非表示 */
@media (min-width: 813px){
	.u-hidden-pc{
		display: none;
	}
}
/* 小さいスマホのみ表示 */
@media (min-width: 481px){
	.u-visible-mini{
		display: none;
	}
}
/* 小さいスマホのみ表示 */
@media (max-width: 480px){
	.u-visible-mini{
		display: inherit;
	}
}
/* アニメーション遅延
---------------------------------------- */
@media (min-width: 813px){
	.u-delay-1{
		transition-delay: 0.3s !important;
	}
	.u-delay-2{
		transition-delay: 0.6s !important;
	}
	.u-delay-3{
		transition-delay: 0.9s !important;
	}
}
/* アンカーリンクをヘッダー分ずらす
---------------------------------------- */
.u-anchorLink{
	scroll-margin-top: 180px;
}


/* ==============================================
   JS
   ============================================= */
/* ふわっと表示
---------------------------------------- */
.js .js-fade:not(.is-show){
	opacity: 0;
	will-change: transform, opacity;
}
/* 共通 */
.js .js-fade.is-show{
	opacity: 1;
}
/* 下から */
.js .js-fade--slideUp{
	transform: translate3d(0, 100px, 0);
	transition:
		opacity 0.5s,
		transform 1s ease-out;
}
.js .js-fade--slideUp.is-show{
	transform: translate3d(0, 0, 0);
}
/* 右から */
@media (min-width: 813px){
	.js .js-fade--right{
		transform: translate3d(20%, 0, 0);
		transition:
			opacity 1.5s,
			transform 1.5s;
	}
	.js .js-fade--right.is-show{
		transform: translate3d(0, 0, 0);
	}
}
@media (max-width: 812px){
	.js .js-fade--right{
		transform: translate3d(0, 100px, 0);
		transition:
			opacity 0.5s,
			transform 1s ease-out;
	}
	.js .js-fade--right.is-show{
		transform: translate3d(0, 0, 0);
	}
}
/* 左から */
@media (min-width: 813px){
	.js .js-fade--left{
		transform: translate3d(-100px, 0, 0);
		transition:
			opacity 1.5s,
			transform 1.5s;
	}
	.js .js-fade--left.is-show{
		transform: translate3d(0, 0, 0);
	}
}
@media (max-width: 812px){
	.js .js-fade--left{
		transform: translate3d(0, 100px, 0);
		transition:
			opacity 0.5s,
			transform 1s ease-out;
	}
	.js .js-fade--left.is-show{
		transform: translate3d(0, 0, 0);
	}
}
.js .js-fade--slideUp,
.js .js-fade--right,
.js .js-fade--left{
	backface-visibility: hidden;
	transform-style: preserve-3d;
}
.is-show.js-fade--shadow-x,
.is-show .js-fade--shadow-x{
	animation: shadowShrink-x 2s ease forwards;
}
@media (max-width: 812px){
	.is-show.js-fade--shadow-x,
	.is-show .js-fade--shadow-x{
		animation: shadowShrink-top 2s ease forwards;
	}
}
@keyframes shadowShrink-x {
	from {
		box-shadow: -2em 0 0 rgba(220, 255, 72, 0.2);
	}
	to {
		box-shadow: 0 0 0 0 rgba(220, 255, 72, 0.2);
	}
}


.is-show.js-fade--shadow-top,
.is-show .js-fade--shadow-top{
	animation: shadowShrink-top 2s ease forwards;
}
@keyframes shadowShrink-top {
	from {
		box-shadow: 0 -2em 0 0 rgba(220, 255, 72, 0.2);
	}
	to {
		box-shadow: 0 0 0 0 rgba(220, 255, 72, 0.2);
	}
}
.is-show.js-fade--shadow-bottom,
.is-show .js-fade--shadow-bottom{
	animation: shadowShrink-bottom 2s ease forwards;
}
@keyframes shadowShrink-bottom {
	from {
		box-shadow: 0 2em 0 0 rgba(220, 255, 72, 0.2);
	}
	to {
		box-shadow: 0 0 0 0 rgba(220, 255, 72, 0.2);
	}
}


/*==============================================
/* project
/* ============================================= */
/* ---------------------------------------
/* トップページ
   ---------------------------------------- */
/*ニュースのリスト*/
.p-top__news{
	padding: 0 min(80px, 8vw);
}
@media (max-width: 812px){
	.p-top__news{
		padding: 0 min(24px, 3vw);
	}
}

.p-top__news__inner{
	max-width: 1200px;
	margin: 0 auto;
	transform: translateY(-50%);
}
/*施工実績*/
.p-top__works__wrap{
	display: flex;
	justify-content: space-between;
	padding-right: min(24px, 3vw);
}
@media(max-width:812px){
	.p-top__works__wrap{
		flex-direction: column;
	}
}
.p-top__works__items{
	width: calc(100% - 7vw - min(166px, 13vw));
	height: fit-content;
	display: flex;
	gap: 1.5em;
}
.p-top__works__item{
	width: 100%;
	background: #fff;
	border-radius: 0.75em;
	overflow: hidden;
}
.p-top__works__itemsTop{
	display: contents;
}
.p-top__works__imgWrap{
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	height: auto;
	aspect-ratio: 1/1;
	overflow: hidden;
}
.p-top__works__img{
	width: auto;
	max-width: inherit;
	height: 100%;
}
.p-top__works__btnWrap{
	position: relative;
	padding-top: min(30px, 4vw);
}
.p-top__works__btn{
	content: "";
	position: absolute;
	bottom: 0;
	right: 0;
	display: inline-block;
	width: min(90px, 10vw);
	height: min(90px, 10vw);
	background: linear-gradient(120deg,
			#0d65a9,
			#004aab,
			#333,
			#004A61);
	background-size: 300% 100%;
	background-position: 100% 0%;
	transition: background-position 0.3s;
	border-top-left-radius: 0.4em;
	border-bottom-left-radius: 0.4em;
}
.p-top__works__btn::after{
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 10px;
	height: 12px;
	background: url(./img/arrow.svg) no-repeat center / contain;
	transition: right 0.3s, transform 0.3s;
}
.p-top__works__btn:hover{
	background-position: 0% 0%;
}
.p-top__works__btn:hover::after{
	right: 1.8em;
	transform: translateY(-50%) scale(1.3);
}
.p-top__works__text{
	padding: min(12px, 1.5vw) min(24px, 3vw) min(24px, 3vw);
}
@media(max-width:1200px){
	.p-top__works__items{
		flex-direction: column;
		width: fit-content;
	}
	.p-top__works__itemsTop{
		height: fit-content;
		display: flex;
		gap: 1.5em;
	}
	.p-top__works__itemBottom{
		width: calc((100% - 1.5em) / 2);
	}
	.p-top__works__imgWrap{
		aspect-ratio: 5/3;
	}
	.p-top__works__img{
		width: 100%;
		max-width: 100%;
		height: auto;
	}
}
@media(max-width:480px){
	.p-top__works__itemsTop{
		display: contents;
	}
	.p-top__works__itemBottom{
		width: auto;
	}
	.p-top__works__imgWrap{
		aspect-ratio: 2/1;
	}
	.p-top__works__btn{
		width: 15vw;
		height: 15vw;
	}
	.p-top__works__btn::after{
		content: "";
		position: absolute;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		width: 10px;
		height: 12px;
		background: url(./img/arrow.svg) no-repeat center / contain;
		transition: right 0.3s, transform 0.3s;
	}
	.p-top__works__text{
		padding: min(12px, 1.5vw) min(24px, 3vw) min(48px, 6vw);
	}
}
.p-top__ourFeature__item{
	margin-top: 8em;
}
.p-top__ourFeature__imgWrap{
	display: flex;
	align-items: center;
	justify-content: center;
	height: auto;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	border-radius: 0.75em;
}
.p-top__ourFeature__img--left{
	justify-content: flex-start;
}
.p-top__ourFeature__img{
	width: auto;
	max-width: inherit;
	height: 100%;
}
.p-top__ourFeature__onestop{
		width: 100%;
		max-width: 100%;
		height: auto;
}
@media(min-width:813px){
	.p-top__ourFeature__text{
		max-width: min(650px, 43vw);
		width: 100%;
	}
}
@media(max-width:1200px){
	.p-top__ourFeature__imgWrap{
		max-height: 400px;
	}
}
@media(max-width:812px){
	.p-top__ourFeature__item{
		margin-top: 5em;
	}
	.p-top__ourFeature__imgWrap{
		max-height: inherit;
		aspect-ratio: 2 / 1;
	}
	.p-top__ourFeature__img{
		width: 100%;
		max-width: 100%;
		height: auto;
	}
}
.p-top_data__flexInner{
	width: 50%;
}
@media(max-width:1200px){
	.p-top_data__flex{
		flex-direction: column;
	}
	.p-top_data__flexInner{
		width: 100%;
		min-width: inherit;
	}
}
.p-top_data__splideWrap{
	width: 50%;
}
@media(max-width:1200px){
	.p-top_data__splideWrap{
		width: 100%;
	}
}
.p-top_data__splidePadding{
	width: 100%;
	max-width: 700px;
	height: 100%;
	padding: 0 2em 0.75em;
}
@media(max-width:1200px){
	.p-top_data__splidePadding{
		height: auto;
		aspect-ratio: 5/3;
	}
}
.p-top_data__splide{
	width: 100%;
	height: 100%;
	color: #333;
}
.p-top_data__splide .splide__arrow{
	background: #3e4449;
	height: 3.8em;
	width: 3.8em;
	transition: opacity 0.15s;
}
.p-top_data__splide .splide__arrow--prev{
	left: -2em;
}
.p-top_data__splide .splide__arrow--next{
	right: -2em;
}
.p-top_data__splide .splide__arrow--prev svg{
	transform: scaleX(-1);
}
.p-top_data__splide .splide__arrow svg{
	fill: #fff;
	height: 0.6em;
	width: 0.6em;
}
.p-top_data__splide__track{
	height: calc(100% - 2em);
	overflow: hidden;
	border-radius: 0.4em;
}
.p-top_data__splide__slide{
	width: 100%;
	height: 100%;
	padding: 2em;
	background: #fff;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	font-weight: bold;
}
.p-top_data__splide__pagination{
	bottom: -1em;
	flex-wrap: nowrap;
}
.p-top_data__splide__pagination .splide__pagination__page{
	background: #fff;
	border: 0;
	border-radius: 50%;
	display: inline-block;
	width: 0.75em;
	height: 0.75em;
	margin: 0.6em;
	opacity: 1;
	padding: 0;
	position: relative;
	transition: transform .2s linear background 0.3s;
}
.p-top_data__splide__pagination .splide__pagination__page.is-active{
	background: #DCFF48;
	transform: scale(1.4);
	z-index: 1;
}
.p-top_data__splide__card{
	transform: scale(1.7);
}
@media(max-width:1300px){
	.p-top_data__splide__card{
		transform: scale(1.4);
	}
}
@media(max-width:1200px){
	.p-top_data__splide__card{
		transform: scale(2);
	}
}
@media(max-width:812px){
	.p-top_data__splide__card{
		transform: scale(1.7);
	}
}
@media(max-width:430px){
	.p-top_data__splidePadding{
		height: auto;
		aspect-ratio: inherit;
		padding: 0 2em 3em;
	}
	.p-top_data__splide__pagination{
		bottom: -3em;
	}
	.p-top_data__splide__card{
		transform: scale(1.2);
	}
}

/* タブレットの時だけ表示 */
@media (min-width: 1400px){
	.p-top_data__br{
		display: none;
	}
}
@media (max-width: 1200px){
	.p-top_data__br{
		display: none;
	}
}
/* ---------------------------------------
/* お知らせ
   ---------------------------------------- */
.p-news__new::after{
	content: "NEW";
	position: relative;
	display: inline-block;
	padding: 4px 8px;
	margin-left: 8px;
	transform: translateY(-2px);
	color: #555;
	background: #DCFF48;
	line-height: 1;
	font-size: 0.75em;
	letter-spacing: 1px;
	border-radius: 4px;
	font-weight: 500;
}
/* CMSエディタ用
---------------------------------------- */
.p-news__article{
	display:flow-root;
}
.p-news__article ul,
.p-news__article ol{
	padding-left: 2em;
}
.p-news__article ul > li{
	list-style-type: disc;
}
.p-news__article ul li::marker{
	color: #999;
	font-size: 1.2em;
	line-height: 1;
}
.p-news__article ol > li{
	list-style: decimal;
}

.p-news__article h3{
	position: relative;
	font-size: var(--fs-36);
	font-weight: 600;
	padding-left: 1em;
	margin-bottom: 1em;
	letter-spacing: 0.25em;
}
.p-news__article h3::before{
	content: "";
	position: absolute;
	top: 0.4em;
	left: 0;
	display: inline-block;
	width: 0.5em;
	height: 1em;
	background: #d6e7fb;
	border-radius: 0.1em;
}
/* ----------------- H4 ----------------- */
.p-news__article h4{
	width: auto;
	font-size: var(--fs-28);
	font-weight: bold;
	display: inline-block;
	border-bottom: 2px solid currentColor;
	padding: 0 0.5em;
	margin-bottom: 1em;
	letter-spacing: 0.3em;
}
/* ----------------- H5 ----------------- */
.p-news__article h5{
	font-size: var(--fs-22);
	font-weight: bold;
	padding-bottom: 0.5em;
	margin-bottom: 0.5em;
}
.p-news__article h5::after{
	content: "";
	display: block;
	width: 2em;
	height: 2px;
	background-color: currentColor;
}
/* ----------------- H6 ----------------- */
.p-news__article h6{
	font-size: var(--fs-18);
	font-weight: bold;
}
/* ---------------------------------------
/* 企業情報
   ---------------------------------------- */
@media (max-width: 812px){
	.p-company__ifame{
		aspect-ratio: 5/3;
	}
}
/* ---------------------------------------
/* 施工実績
   ---------------------------------------- */
/*リニューアル工事*/
@media (max-width: 812px){
	.p-works__imgWrap{
		max-width: 530px
	}
}
/* ---------------------------------------
/* 採用情報
   ---------------------------------------- */
.p-recruitBtn{
	position: relative;
	display: block;
	text-align: center;
	border-radius: 0.4em;
}
.p-recruitBtn--newGraduate{
	background: #f8f8f8;
}
.p-recruitBtn--career{
	color: #fff;
	background: linear-gradient(130deg,
			#cc52c4 0%,
			#1768c4 50%,
			#56a3fe 70%,
			#ffd677 100%);
	background-size: 200% 100%;
	background-position: 100% 0;
	transition: background-position 0.3s ease;
}
.p-recruitBtn--career:hover{
	background-position: 0% 0;
}
.p-recruitBtn--career::after{
	position: absolute;
	content: "";
	bottom: 1.6em;
	right: 1.6em;
	width: 2em;
	height: 2em;
	display: inline-block;
	background: currentcolor;
	mask: url("./img/icon_gaibu.svg") no-repeat center / contain;
}
.p-recruitBtn__link{
	display: block;
	padding: 1.6em;
	text-decoration: none;
}
.p-recruit__eventImg{
	aspect-ratio: 2/1;
}
@media (max-width: 812px){
	.p-recruit__event{
		grid-template-columns: 1fr;
		gap: 2em 1em;
	}
}

.p-recruit__jobImgWrap{
	width: 40%
}
.p-recruit__jobImg{
	width: 100%;
}
.p-recruit__jobComment{
	position: relative;
	padding: 0.5em 1em;
}
.p-recruit__jobComment::before,
.p-recruit__jobComment::after {
    position: absolute;
}
.p-recruit__jobComment::before {
	content: '「';
	top: 0;
	left: -0.5em;
}
.p-recruit__jobComment::after {
	content: '」';
	bottom: 0em;
    right: -0.5em;
}
@media (max-width: 812px){
	.p-recruit__jobImgWrap{
		width: 100%
	}
}
.p-recruit__data__grid{
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-template-rows: repeat(3, 1fr);
	gap: 1em;
}
.p-recruit__data--01{
	grid-area: 1 / 1 / 3 / 2;
}
.p-recruit__data--02{
	grid-area: 1 / 2 / 2 / 3;
}
.p-recruit__data--03{
	grid-area: 2 / 2 / 3 / 3;
}
.p-recruit__data--04{
	grid-area: 1 / 3 / 2 / 4;
}
.p-recruit__data--05{
	grid-area: 1 / 4 / 2 / 5;
}
.p-recruit__data--06{
	grid-area: 2 / 3 / 3 / 4;
}
.p-recruit__data--07{
	grid-area: 2 / 4 / 3 / 5;
}
.p-recruit__data--08{
	grid-area: 3 / 1 / 4 / 2;
}
.p-recruit__data--09{
	grid-area: 3 / 2 / 4 / 3;
}
.p-recruit__data--10{
	grid-area: 3 / 3 / 4 / 5;
}
@media(max-width:1200px){
	.p-recruit__data__grid{
		grid-template-columns: repeat(2, 1fr);
		grid-template-rows: repeat(6, 1fr);
	}
	.p-recruit__data--01{
		grid-area: 1 / 1 / 3 / 2;
	}
	.p-recruit__data--02{
		grid-area: 1 / 2 / 2 / 3;
	}
	.p-recruit__data--03{
		grid-area: 2 / 2 / 3 / 3;
	}
	.p-recruit__data--04{
		grid-area: 3 / 1 / 4 / 2;
	}
	.p-recruit__data--05{
		grid-area: 3 / 2 / 4 / 3;
	}
	.p-recruit__data--06{
		grid-area: 4 / 1 / 5 / 2;
	}
	.p-recruit__data--07{
		grid-area: 4 / 2 / 5 / 3;
	}
	.p-recruit__data--08{
		grid-area: 5 / 1 / 6 / 2;
	}
	.p-recruit__data--09{
		grid-area: 5 / 2 / 6 / 3;
	}
	.p-recruit__data--10{
		grid-area: 6 / 1 / 7 / 3;
	}
}
@media(max-width:430px){
	.p-recruit__data__grid{
		display: flex;
		flex-direction: column;
		gap: 1em;
	}
}

.p-data__qualified{
	display: flex;
	margin: 0 auto;
	gap: 20%;
	width: 70%;
	margin-top: 1em;
	justify-content: center;
}

.c-card[data-job="qualified-supervisor"]{
	background: url("./recruit/img/icon_qualified_00.svg") no-repeat right 10% bottom / auto 80%;
	background-color: #fff;
}

.c-card[data-job="qualified-architecture"]{
	background: url("./recruit/img/icon_qualified_01.svg") no-repeat center bottom / auto 50%;
	background-color: #fff;
}

.c-card[data-job="qualified-electric"]{
	background: url("./recruit/img/icon_qualified_02.svg") no-repeat 10% bottom / auto 80%;
	background-color: #fff;
}

.c-card[data-job="qualified-plumbing"]{
	background: url("./recruit/img/icon_qualified_03.svg") no-repeat right bottom / auto 80%;
	background-color: #fff;
}

.c-card[data-job="qualified-civil"]{
	background: url("./recruit/img/icon_qualified_04.svg") no-repeat right 10% bottom / auto 70%;
	background-color: #fff;
}

.c-card[data-job="qualified-landscape"]{
	background: url("./recruit/img/icon_qualified_05.svg") no-repeat right 10% bottom / auto 70%;
	background-color: #fff;
}

.c-card[data-job="qualified-architect"]{
	background: url("./recruit/img/icon_qualified_06.svg") no-repeat center / auto 70%;
	background-color: #fff;
}

.c-card[data-job="qualified-electrician"]{
	background: url("./recruit/img/icon_qualified_07.svg") no-repeat right 10% bottom / auto 80%;
	background-color: #fff;
}

.c-card[data-job="qualified-fire"]{
	background: url("./recruit/img/icon_qualified_08.svg") no-repeat right 10% bottom / auto 80%;
	background-color: #fff;
}


/*==============================================
/* フォーム
/* ============================================= */
.c-form{
	width: 100%;
	max-width: 860px;
}
/*共通------------------------------------*/
input[type="text"], input[type="email"], input[type="tel"], textarea, select{
	appearance: none;
	display: block;
	width: 100%;
	min-height: 52px;
	padding: 0.6em 1.2em;
	color: currentColor;
	background-color: #fff;
	font-weight: 500;
	border: var(--border-gray);
	border-radius: 4px;
	font-size: clamp(1rem, 0.25rem + 1vw, 1.125rem);
}
input::placeholder, textarea::placeholder{
	color: #aaa;
}
input:disabled, textarea:disabled, select:disabled{
	background: #e3e3e3;
	border-color: #aaa;
}
/*textarea--------------------------------------*/
textarea{
	min-height: 160px;
	resize: vertical;
}
/*select------------------------------------*/
/*疑似要素が使用できないため、divで囲む*/
.c-form__select{
	position: relative;
	width: 100%;
}
.c-form__select::after{
	content: "";
	display: inline-block;
	position: absolute;
	top: 50%;
	right: 20px;
	width: 10px;
	height: 10px;
	border-bottom: 2px solid #aaa;
	border-right: 2px solid #aaa;
	transform: translateY(-50%) rotate(45deg);
}
/*チェックボックス----------------------------*/
.c-checkbox__label{
	cursor: pointer;
}
input[type="checkbox"]{
	appearance: none;
	position: relative;
	width: 24px;
	height: 24px;
	margin-right: 7px;
	background-color: #fff;
	border: var(--border-gray);
	border-radius: 2px;
	cursor: pointer;
}
input[type="checkbox"]:checked{
	background-color: var(--color-blue);
	border: 2px solid var(--color-blue);
}
input[type="checkbox"]:checked::after{
	content: "";
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -60%) rotate(45deg);
	width: 8px;
	height: 16px;
	border-bottom: 3px solid #fff;
	border-right: 3px solid #fff;
}
/*radio--------------------------------------*/
.c-radio__grid{
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 1em;
}
@media(max-width: 430px){
	.c-radio__grid{
		grid-template-columns: 1fr;
	}
}
/*ラジオボタンをリストのようなスタイルに調整*/
.c-radio__wrap{
	display: flex;
	border: var(--border-gray);
	border-radius: 4px;
	transition: background 0.2s;
}
.c-radio__label{
	display: flex;
	align-items: center;
	width: 100%;
	padding: 12px 20px;
	cursor: pointer;
}
.c-radio__wrap:hover,
.c-radio__wrap:focus-within{
	background: #F6FDFF;
}
.c-radio__wrap:focus-within{
	outline: 3px solid #0bf;
	outline-offset: 3px;
}
.c-radio__wrap:has(:checked){
	background: #E9F5FF;
}
input[type="radio"]{
	appearance: none;
	position: relative;
	width: 1.4em;
	height: 1.4em;
	margin-right: 7px;
	border: var(--border-gray);
	background-color: #fff;
	border-radius: 50%;
	cursor: pointer;
}
input[type="radio"]:checked::after{
	content: "";
	display: inline-block;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 60%;
	height: 60%;
	background-color: var(--color-blue);
	border-radius: 50%;
}
input[type="radio"]:focus{
	outline: none;
}
/*・必須・任意 -------------------------------------- */
.is-required,
.is-optional{
	display: inline-block;
	padding: 4px 8px;
	margin-left: 8px;
	line-height: 1;
	font-size: 0.6em;
	letter-spacing: 1px;
	border-radius: 4px;
}
/* 必須 */
.is-required{
	color: #555;
	background: #E5FF76;
}
/* 任意 */
.is-optional{
	color: #fff;
	background: #ccc;
}
/*注釈--------------------------------------*/
.inputNote{
	width: fit-content;
	margin-bottom: 10px;
	color: #aaa;
	font-size: var(--fs-14);
}
/*エラー--------------------------------------*/
.c-errorSummary{
	margin-bottom: 40px;
	padding: 1.3em 2.5em;
	background: #FFEFF2;
	border-radius: 4px;
}
.c-errorSummary__title{
	position: relative;
	margin: 0 0 8px;
	padding-left: 1.2em;
	color: var(--color-red);
	font-size: var(--fs-3);
	font-weight: bold;
}
.c-errorSummary__title::before{
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	display: inline-block;
	width: 1em;
	height: 1em;
	background: url("./img/icon_attention.svg") no-repeat center /contain;
}
.c-errorSummary__link{
	display: block;
	width: fit-content;
	color: var(--color-red);
	transition: opacity 0.15s;
}
.c-errorSummary__link:hover{
	opacity: 0.5;
}
.is-error input:not([type="radio"]),
.is-error textarea,
.is-error select{
	border-color: var(--color-red);
	background: #FFEFF2;
}
.is-error select option{
	color: #3e4449;
	background-color: #fff;
}
.c-form__select.is-error::after{
	color: var(--color-red);
	border-color: var(--color-red);
}
.c-errorMessage{
	position: relative;
	display: inline-block;
	padding-left: 1.2em;
	letter-spacing: 0.1em;
	color: var(--color-red);
	font-size: var(--fs-14);
}
.c-errorMessage::before{
	content: "";
	position: absolute;
	top: 0.4em;
	left: 0;
	display: inline-block;
	width: 1em;
	height: 1em;
	margin-right: 0.5em;
	background: url("./img/icon_attention.svg") no-repeat center /contain;
	vertical-align: middle;
}
/*フォームのレイアウト------------------------------------*/
.c-form__label,
.c-form__legend{
	display: inline-block;
	margin-bottom: 4px;
	font-size: var(--fs-22);
	font-weight: bold;
}
@media (max-width:812px){
	.c-form__label{
		justify-content: flex-start;
		gap: 10px;
	}
}
.c-form__item{
	margin-bottom: 48px;
}
.c-form__item [id]{
	scroll-margin-top: 180px;
}
.c-form__fieldset[id]{
	scroll-margin-top: 90px;
}
/*fieldset*/
.c-form__fieldset{
	margin-bottom: 24px;
}
.c-form__fieldset .c-form__label{
	font-size: var(--fs-18);
	font-weight: 500;
}
.c-form__fieldset .c-form__label::before{
	content: none;
}
.c-form__fieldset .c-form__item{
	margin-bottom: 24px;
}
/*2カラム*/
.c-form__itemWrap{
	width: 100%;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	gap: 8px 16px;
}
.c-form__item--half{
	width: calc(50% - 8px);
}
@media (max-width:812px){
	.c-form__itemWrap{
		flex-direction: column;
		width: 100%;
	}
	.c-form__item--half{
		width: 100%;
	}
}
/*電話番号------------------------------------*/
.c-form--tel__input{
	max-width: 240px;
}
/*住所------------------------------------*/
/*郵便番号*/
.c-form--postalCode__flex{
	width: 100%;
	display: flex;
	gap: 8px;
}
.c-form--postalCode__input{
	max-width: 160px;
}
.c-form--postalCode__btn{
	width: 112px;
	padding: 8px 0;
	color: #fff;
	background: var(--color-blue);
	border: none;
	text-align: center;
	border-radius: 4px;
	transition: opacity 0.3s;
}
.c-form--postalCode__btn:hover{
	opacity: 0.7;
}
/*都道府県*/
.c-form--prefecture__select{
	max-width: 240px;
}
/*同意------------------------------------*/
.c-form__policy__agree{
	display: flex;
	align-items: center;
	justify-content: center;
	width: fit-content;
	cursor: pointer;
	transition: background 0.3s;
	padding: 0.6em 1.6em;
	border: var(--border-gray);
	border-radius: 4px;
	background: #fff;
}
.c-form__policy__agree:hover,
.c-form__policy__agree:focus-within{
	background: #F6FDFF;
}
.c-form__policy__agree:focus-within{
	outline: 3px solid #0bf;
	outline-offset: 3px;
}
.c-form__policy__agree:has(:checked){
	background: #E9F5FF;
}
.c-form__policy__agree input[type="checkbox"]:focus{
	outline: none;
}
@media (max-width:812px){
	.c-form__policy{
		padding: 20px;
		text-align: inherit;
	}
	.c-form__policy__agree{
		margin-top: 20px;
	}
}
/*確認ページ------------------------------------*/
.c-form__confirm .c-form__item{
	padding-bottom: 0.5em;
	border-bottom: 2px solid #ddd;
}
.c-form__confirm{
	color: #aaa;
}
.c-form__confirmText{
	font-size: var(--fs-22);
	font-weight: bold;
	color: #3e4449;
}
.c-form__confirmBtn{
	padding: 1em 2em;
	min-width: min(400px,100%);
}