﻿@charset "UTF-8";

:root{
	--fontA1: "MFW-PA1GothicStd-Regular", "Noto Sans JP", sans-serif;
	--fontA1Medium: "MFW-PA1GothicStd-Medium", "Noto Sans JP", sans-serif;
	--fontA1Bold: "MFW-PA1GothicStd-bold", "Noto Sans JP", sans-serif;
	--fontDisplay: "Oswald", sans-serif;
	--color-black: #1f1d1b;
	--border-width: 0.1vw;
	--border-default: solid var(--border-width) var(--color-black);
	--brand-water: #008cb2;
	--brand-blue: #003c9e;
	--brand-green: #4e9750;
	--brand-orange: #db7a28;
	--brand-yellow: #f2ce01;
	--brand-pink: #ce3a56;
	--brand-purple: #8059b2;
	--content-outer-width: 90vw;
	--service-detail-width: var(--content-outer-width);
	--vermilion: #d52b25;
}
html,
body{
	overflow-x: hidden;
}
html{
	height: 100%;
	scroll-behavior: smooth;
}
body{
	font-size: 1.145vw;
	line-height: 1.717vw;
	font-style: normal;
	-webkit-text-size-adjust: 100%;
	font-family: var(--fontA1);
	color: var(--color-black);
	overflow-y: hidden;
	overscroll-behavior: none;
}
body.is-loaded{
	overflow-y: auto;
	overscroll-behavior: auto;
}
body.privacyModalOpen{
	overflow: hidden;
}
@media screen and (min-width: 1400px){
	:root{
		--border-width: 0.0875rem;
		--content-outer-width: 78.75rem;
	}
	body{
		font-size: 1.002rem;
		line-height: 1.502rem;
	}
}
.br_sp{
	display: none;
}
.br_pc{
	display: inline;
}
@media screen and (max-width: 768px){
	:root{
		--border-width: 1px;
	}
	.br_sp{
		display: inline;
	}
	.br_pc{
		display: none;
	}
}
img{
	width: 100%;
}
:focus{
	outline: 0;
}
.loadingScreen{
	position: fixed;
	inset: 0;
	z-index: 3000;
	display: grid;
	place-items: center;
	background: #fff;
	opacity: 1;
	visibility: visible;
	transition: opacity 0.8s ease 0.35s, visibility 0s linear 1.15s;
}
.loadingImages{
	display: grid;
	place-items: center;
	width: 48vw;
	max-width: 36rem;
	opacity: 1;
	transform: scale(1);
	transition: opacity 1.4s ease, transform 1.4s cubic-bezier(0.22, 1, 0.36, 1);
}
.loadingScreen img{
	grid-area: 1 / 1;
	width: 100%;
	max-width: none;
	opacity: 0;
	transform: translate(0, 0) rotate(0) scale(1);
	animation-duration: 3.6s;
	animation-timing-function: ease-out;
	animation-iteration-count: infinite;
	transition: opacity 0.8s ease, transform 1s cubic-bezier(0.22, 1, 0.36, 1);
}
.loadingScreen img:nth-of-type(1){
	animation-name: loadingLayer1;
	--loading-out-x: 0;
	--loading-out-y: -32vw;
	--loading-out-rotate: -4deg;
}
.loadingScreen img:nth-of-type(2){
	animation-name: loadingLayer2;
	--loading-out-x: 19vw;
	--loading-out-y: -26vw;
	--loading-out-rotate: 5deg;
}
.loadingScreen img:nth-of-type(3){
	animation-name: loadingLayer3;
	--loading-out-x: 31vw;
	--loading-out-y: -10vw;
	--loading-out-rotate: 10deg;
}
.loadingScreen img:nth-of-type(4){
	animation-name: loadingLayer4;
	--loading-out-x: 31vw;
	--loading-out-y: 10vw;
	--loading-out-rotate: 7deg;
}
.loadingScreen img:nth-of-type(5){
	animation-name: loadingLayer5;
	--loading-out-x: 19vw;
	--loading-out-y: 26vw;
	--loading-out-rotate: 3deg;
}
.loadingScreen img:nth-of-type(6){
	animation-name: loadingLayer6;
	--loading-out-x: 0;
	--loading-out-y: 32vw;
	--loading-out-rotate: -4deg;
}
.loadingScreen img:nth-of-type(7){
	animation-name: loadingLayer7;
	--loading-out-x: -19vw;
	--loading-out-y: 26vw;
	--loading-out-rotate: -8deg;
}
.loadingScreen img:nth-of-type(8){
	animation-name: loadingLayer8;
	--loading-out-x: -31vw;
	--loading-out-y: 10vw;
	--loading-out-rotate: -11deg;
}
.loadingScreen img:nth-of-type(9){
	animation-name: loadingLayer9;
	--loading-out-x: -31vw;
	--loading-out-y: -10vw;
	--loading-out-rotate: -8deg;
}
.loadingScreen img:nth-of-type(10){
	animation-name: loadingLayer10;
	--loading-out-x: -19vw;
	--loading-out-y: -26vw;
	--loading-out-rotate: -4deg;
}
@keyframes loadingLayer1{
	0%, 98%{opacity: 1;}
	100%{opacity: 0;}
}
@keyframes loadingLayer2{
	0%, 3%{opacity: 0;}
	7%, 98%{opacity: 1;}
	100%{opacity: 0;}
}
@keyframes loadingLayer3{
	0%, 7%{opacity: 0;}
	11%, 98%{opacity: 1;}
	100%{opacity: 0;}
}
@keyframes loadingLayer4{
	0%, 11%{opacity: 0;}
	15%, 98%{opacity: 1;}
	100%{opacity: 0;}
}
@keyframes loadingLayer5{
	0%, 15%{opacity: 0;}
	19%, 98%{opacity: 1;}
	100%{opacity: 0;}
}
@keyframes loadingLayer6{
	0%, 19%{opacity: 0;}
	23%, 98%{opacity: 1;}
	100%{opacity: 0;}
}
@keyframes loadingLayer7{
	0%, 23%{opacity: 0;}
	27%, 98%{opacity: 1;}
	100%{opacity: 0;}
}
@keyframes loadingLayer8{
	0%, 27%{opacity: 0;}
	31%, 98%{opacity: 1;}
	100%{opacity: 0;}
}
@keyframes loadingLayer9{
	0%, 31%{opacity: 0;}
	35%, 98%{opacity: 1;}
	100%{opacity: 0;}
}
@keyframes loadingLayer10{
	0%, 35%{opacity: 0;}
	39%, 98%{opacity: 1;}
	100%{opacity: 0;}
}
body.is-loaded .loadingScreen{
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}
body.is-loaded .loadingScreen img{
	animation: none;
	opacity: 1;
	transform: translate(var(--loading-out-x), var(--loading-out-y)) rotate(var(--loading-out-rotate)) scale(0.92);
}
@media screen and (min-width: 1400px){
	.loadingImages{
		width: 36rem;
	}
}
@media screen and (max-width: 768px){
	.loadingImages{
		width: 72vw;
		max-width: none;
	}
}

/* header, globalNav */

header{
	position: absolute;
	top: 0;
	left: 0;
	width: 100vw;
	z-index: 999;
}
header img{
	width: 25vw;
	max-width: 400px;
	padding: 1vw;
	box-sizing: content-box;
}
.menuBtn{
	position: fixed;
	top: 0.6vw;
	right: 1vw;
	width: 7.8vw;
	height: 7.8vw;
	max-width: 122px;
	max-height: 122px;
	min-width: 86px;
	min-height: 86px;
	border-radius: 50%;
	color: var(--color-black);
	letter-spacing: 0;
	z-index: 1002;
	transition: opacity 0.4s;
}
.menuBtnCircle{
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	animation: menuCircleRotate 18s linear infinite;
	transform-origin: center;
}
.menuBtnCircle text{
	font-family: var(--fontA1Medium);
	font-size: 8px;
	letter-spacing: 3px;
	fill: var(--color-black);
}
.menuBtn span{
	position: absolute;
	top: 50%;
	left: 50%;
	font-family: var(--fontA1Medium);
	font-size: 1vw;
	line-height: 1;
	letter-spacing: 0.12em;
	transform: translate(-50%, -50%);
}
@keyframes menuCircleRotate{
	to{
		transform: rotate(360deg);
	}
}
.globalNav{
	position: fixed;
	top: 0;
	right: 0;
	width: 32vw;
	height: 100dvh;
	background: rgba(255, 255, 255, 0.96);
	box-shadow: -1vw 0 3vw rgba(31, 29, 27, 0.08);
	padding: 10vw 5vw 5vw;
	transform: translateX(105%);
	visibility: hidden;
	pointer-events: none;
	transition: transform 0.55s ease, visibility 0.55s;
	z-index: 1001;
}
.globalNav.open{
	transform: translateX(0);
	visibility: visible;
	pointer-events: auto;
}
.globalNav ul li{
	font-family: var(--fontA1Medium);
	font-size: 1.6vw;
	line-height: 2.8vw;
	letter-spacing: 0.12em;
}
.globalNav ul li:not(:last-of-type){
	margin-bottom: 1.6vw;
}
.lineLinks a{
	position: relative;
	display: inline-block;
}
.globalNav a{
	color: var(--color-black);
	text-decoration: none;
}
.lineLinks a::after{
	content: '';
	position: absolute;
	left: 0;
	bottom: -0.18em;
	width: 100%;
	border-bottom: solid 0.08vw currentColor;
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.28s ease;
}
.lineLinks a:focus-visible::after{
	transform: scaleX(1);
}
@media screen and (min-width: 769px){
	.menuBtn:hover{
		opacity: 0.72;
	}
	.lineLinks a:hover::after{
		transform: scaleX(1);
	}
}
@media screen and (min-width: 1400px){
	header img{
		width: 21.875rem;
		padding: 0.875rem;
	}
	.menuBtn{
		top: 0.525rem;
		right: 0.875rem;
		width: 6.825rem;
		height: 6.825rem;
	}
	.menuBtn span{
		font-size: 0.875rem;
	}
	.globalNav{
		width: 28rem;
		box-shadow: -0.875rem 0 2.625rem rgba(31, 29, 27, 0.08);
		padding: 8.75rem 4.375rem 4.375rem;
	}
	.globalNav ul li{
		font-size: 1.4rem;
		line-height: 2.45rem;
	}
	.globalNav ul li:not(:last-of-type){
		margin-bottom: 1.4rem;
	}
	.globalNav .lineLinks a::after{
		border-bottom-width: 0.07rem;
	}
}

/* mainVisual */

.mainVisualWrap{
	position: relative;
	width: 100vw;
	max-width: 1400px;
	aspect-ratio: 100 / 54.15;
	margin: 0 auto;
	overflow: visible;
}
#mainVisualBg,
#mainVisualBgInner,
#mainVisual{
	width: 100vw;
}
#mainVisualBg,
#mainVisualBgInner,
#mainVisualCopy,
#mainVisual,
#mainVisualSub{
	position: relative;
}
#mainVisualBg,
#mainVisual{
	position: absolute;
	top: 0;
	left: 50%;
	transform: translateX(-50%);
}
#mainVisualBgInner,
#mainVisual{
	max-width: 1400px;
	height: 52vw;
	margin: 4.75vw auto 0;
}
#mainVisualBg{
	z-index: 1;
	height: 100%;
	overflow: visible;
}
#mainVisualBgInner{
	pointer-events: none;
}
#mainVisualBg img{
	position: absolute;
	z-index: 1;
}
#mainVisualBg img:first-of-type{
	width: 45%;
	top: 0;
	right: 1.5vw;
	transform: translate(0, 0) scale(1);
}
#mainVisualBg img:last-of-type{
	width: 45%;
	bottom: 0;
	left: 1.5vw;
	transform: translate(0, 0) scale(1);
}
#mainVisualCopy{
	height: 100%;
}
#mainVisual{
	z-index: 2;
}
#mainVisual h1,
#mainVisual h2{
	position: absolute;
	white-space: nowrap;
}
.mainVisualScroll{
	display: none;
}
#mainVisual h1{
	font-family: var(--fontA1Medium);
	top: 8.5vw;
	left: 19vw;
	font-size: 4.262vw;
	line-height: 7.37vw;
	letter-spacing: 0.541vw;
}
#mainVisual h1 [data-main-copy]{
	display: inline-block;
	color: var(--color-black);
	transform: scale(1);
	transform-origin: center;
	animation-fill-mode: forwards;
	will-change: color, transform;
}
#mainVisual h1 [data-main-copy="water"]{
	--main-copy-color: var(--brand-water);
}
#mainVisual h1 [data-main-copy="green"]{
	--main-copy-color: var(--brand-green);
}
#mainVisual h1 [data-main-copy="pink"]{
	--main-copy-color: var(--brand-pink);
}
body.is-loaded #mainVisual h1 [data-main-copy]{
	animation-name: mainCopyColor;
	animation-duration: var(--main-copy-duration);
	animation-timing-function: ease;
	animation-delay: var(--main-copy-delay);
}
#mainVisual h1 [data-main-copy="water"]{
	--main-copy-delay: 0s;
	--main-copy-duration: 6.3s;
}
#mainVisual h1 [data-main-copy="green"]{
	--main-copy-delay: 1.2s;
	--main-copy-duration: 5.1s;
}
#mainVisual h1 [data-main-copy="pink"]{
	--main-copy-delay: 2.4s;
	--main-copy-duration: 3.5s;
}
@keyframes mainCopyColor{
	0%, 4%, 100%{
		color: var(--color-black);
		transform: scale(1);
	}
	10%{
		color: var(--main-copy-color);
		transform: scale(1.12);
	}
	18%, 74%{
		color: var(--main-copy-color);
		transform: scale(1);
	}
}
#mainVisual h2{
	bottom: 3vw;
	right: 15vw;
	font-size: 1.289vw;
	line-height: 2.838vw;
	letter-spacing: 0.108vw;
}
#mainVisual h2 p:not(:last-of-type){
	margin-bottom: 2.266vw;
}
@media screen and (min-width: 1400px){
	#mainVisualBgInner,
	#mainVisual{
		height: 45.5rem;
		margin: 4.156rem auto 0;
	}
	#mainVisualBg img:first-of-type{
		right: 1.313rem;
	}
	#mainVisualBg img:last-of-type{
		left: 1.313rem;
	}
	#mainVisual h1{
		top: 7.438rem;
		left: 16.625rem;
		font-size: 3.729rem;
		line-height: 6.449rem;
		letter-spacing: 0.473rem;
	}
	#mainVisual h2{
		right: 13.125rem;
		bottom: 2.625rem;
		font-size: 1.128rem;
		line-height: 2.483rem;
		letter-spacing: 0.095rem;
	}
	#mainVisual h2 p:not(:last-of-type){
		margin-bottom: 1.983rem;
	}
}
@media screen and (max-width: 768px){
	.mainVisualWrap{
		position: static;
		width: 100vw;
		max-width: inherit;
		aspect-ratio: auto;
		margin: 0;
	}
	body.is-loaded:not(.mainVisualMainActive){
		overflow-y: hidden;
	}
	body.is-loaded:not(.mainVisualMainActive) main,
	body.is-loaded:not(.mainVisualMainActive) footer{
		visibility: hidden;
		opacity: 0;
	}
	body.mainVisualMainActive main,
	body.mainVisualMainActive footer{
		visibility: visible;
		opacity: 1;
		transition: opacity 1.6s ease;
	}
	header img{
		position: fixed;
		top: 0;
		left: 0;
		width: 60vw;
		padding: 2vw;
		transition: opacity 0.65s ease;
	}
	body.mainVisualSubActive header img{
		opacity: 0;
		pointer-events: none;
	}
	.menuBtn{
		top: 1vw;
		right: 1vw;
		width: 17vw;
		height: 17vw;
		min-width: inherit;
		min-height: inherit;
		max-width: inherit;
		max-height: inherit;
		-webkit-tap-highlight-color: transparent;
	}
	.menuBtn span{
		font-size: 2.3vw;
	}
	.menuBtn:active{
		background: transparent;
	}
	.lineLinks a{
		-webkit-tap-highlight-color: transparent;
	}
	.lineLinks a:active{
		background: transparent;
	}
	.globalNav{
		width: 100vw;
		padding: 26vw 10vw 10vw;
	}
	.globalNav ul li{
		font-size: 4.85vw;
		line-height: 10vw;
	}
	.globalNav ul li:not(:last-of-type){
		margin-bottom: 4vw;
	}
	#mainVisualBgInner{
		height: 100dvh;
		margin: 0 auto;
	}
	#mainVisualBg{
		position: fixed;
		top: 0;
		left: 0;
		transform: none;
		height: 100dvh;
		z-index: 4;
		overflow: hidden;
		visibility: visible;
		transition: opacity 0.55s ease, visibility 0s linear 0s;
	}
	#mainVisualBg img:first-of-type{
		width: 85vw;
		top: 11vw;
		right: 2vw;
		transition: opacity 0.65s ease, transform 0.65s ease;
	}
	#mainVisualBg img:last-of-type{
		width: 85vw;
		bottom: 5vw;
		left: 2vw;
		transition: opacity 0.65s ease, transform 0.65s ease;
	}
	body.mainVisualSubActive #mainVisualBg img:first-of-type{
		opacity: 0;
		transform: translate(8vw, -6vw) scale(0.98);
	}
	body.mainVisualSubActive #mainVisualBg img:last-of-type{
		opacity: 0;
		transform: translate(-8vw, 6vw) scale(0.98);
	}
	body.mainVisualMainActive #mainVisualBg{
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transition: opacity 0.55s ease, visibility 0s linear 0.55s;
	}
	#mainVisual{
		position: fixed;
		inset: 0;
		width: 100vw;
		height: 100dvh;
		max-height: inherit;
		margin-top: 0;
		transform: none;
		z-index: 5;
		visibility: visible;
		pointer-events: none;
		transition: opacity 0.55s ease, visibility 0s linear 0s;
	}
	.mainVisualScroll{
		display: block;
		position: fixed;
		left: 1.5vw;
		bottom: 3vw;
		z-index: 6;
		width: 11vw;
		text-align: center;
		color: var(--color-black);
		opacity: 0;
	}
	body.is-loaded .mainVisualScroll{
		animation: mainVisualScrollAppear 0.45s ease 4.45s forwards, mainVisualScrollCue 1.6s ease-in-out 4.9s infinite;
	}
	.mainVisualScroll span{
		display: block;
		font-family: var(--fontDisplay);
		font-size: 2.45vw;
		line-height: 1;
		letter-spacing: 0.08em;
	}
	.mainVisualScroll svg{
		display: block;
		width: 5.2vw;
		height: auto;
		margin: 1vw auto 0;
	}
	.mainVisualScroll path{
		fill: none;
		stroke: var(--color-black);
		stroke-width: 1.6;
		stroke-linecap: round;
		stroke-linejoin: round;
	}
	body.mainVisualMainActive .mainVisualScroll{
		display: none;
	}
	@keyframes mainVisualScrollAppear{
		0%{
			opacity: 0;
		}
		100%{
			opacity: 1;
		}
	}
	@keyframes mainVisualScrollCue{
		0%, 100%{
			transform: translateY(0);
		}
		50%{
			transform: translateY(1.2vw);
		}
	}
	#mainVisualCopy,
	#mainVisualSub{
		position: fixed;
		inset: 0;
		display: block;
		height: 100dvh;
		z-index: 2;
		transition: opacity 0.55s ease;
	}
	#mainVisualCopy{
		opacity: 1;
	}
	#mainVisualSub{
		opacity: 0;
		pointer-events: none;
	}
	body.mainVisualSubActive #mainVisualCopy{
		opacity: 0;
	}
	body.mainVisualSubActive #mainVisualSub{
		opacity: 1;
	}
	body.mainVisualMainActive #mainVisualCopy,
	body.mainVisualMainActive #mainVisualSub{
		opacity: 0;
		pointer-events: none;
	}
	body.mainVisualMainActive #mainVisual{
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transition: opacity 0.55s ease, visibility 0s linear 0.55s;
	}
	#mainVisual h1{
		font-size: 8.75vw;
		line-height: 17vw;
		letter-spacing: 1.25vw;
		margin: -5vw 0 0 5vw;
		top: 50%;
		left: 50%;
		transform: translate(-50%, -50%);
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
	}
	#mainVisual h2{
		font-family: var(--fontA1Medium);
		font-size: 4vw;
		line-height: 2.6;
		letter-spacing: 0.08em;
		margin-top: -5vw;
		top: 50%;
		left: 50%;
		bottom: inherit;
		right: inherit;
		width: max-content;
		text-align: left;
		transform: translate(-50%, -50%);
		-webkit-transform: translate(-50%, -50%);
		-ms-transform: translate(-50%, -50%);
	}
	#mainVisual h2 p:not(:last-of-type){
		margin-bottom: 8.5vw;
	}
}

/* main, about, common */

main{
	margin-top: 0;
	width: 100vw;
	position: relative;
	z-index: 3;
}
.mainInner{
	width: 100vw;
}
.aboutWrap{
	position: relative;
	width: var(--content-outer-width);
	margin: 0 auto;
	padding: 7.84vw 0 10.11vw;
	text-align: center;
}
.aboutHeader{
	position: relative;
	z-index: 3;
	grid-column: 2;
	grid-row: 1;
	align-self: end;
	margin-bottom: 0;
	text-align: left;
	transform: none;
}
.aboutHeader h2,
.aboutHeader p{
	text-align: left;
}
.aboutHeader ul{
	justify-content: flex-start;
}
.aboutInner{
	position: relative;
	z-index: 2;
	display: grid;
	grid-template-columns: 39.18vw 37.06vw;
	grid-template-rows: auto auto;
	align-content: center;
	align-items: start;
	column-gap: 5.6vw;
	row-gap: 3vw;
	width: 100%;
	margin: 10.59vw auto 0;
	text-align: left;
}
.aboutLead{
	position: relative;
	grid-column: 1;
	grid-row: 1 / 3;
	height: 58.24vw;
}
.aboutLead::before{
	content: '';
	position: absolute;
	top: 50%;
	left: -7vw;
	z-index: 1;
	width: 36vw;
	height: 21.18vw;
	background: #fff;
	transform: translateY(-50%);
}
.aboutInner h3{
	position: absolute;
	top: 50%;
	left: 22%;
	z-index: 2;
	font-family: var(--fontA1Medium);
	font-size: 3vw;
	line-height: 1.7;
	letter-spacing: 0.02em;
	white-space: nowrap;
	transform: translateY(-50%);
}
.aboutInner h3 span{
	color: var(--brand-water);
}
.aboutText{
	grid-column: 2;
	grid-row: 2;
}
.aboutHeader,
.aboutText{
	transform: translateX(-2.12vw);
}
.aboutText p{
	font-family: var(--fontA1Medium);
	font-size: 1.25vw;
	line-height: 2.3;
	letter-spacing: 0.08em;
}
.aboutText p:not(:last-of-type){
	margin-bottom: 1.85vw;
}
.aboutArc{
	position: absolute;
	top: 50%;
	left: 45vw;
	z-index: 0;
	width: 70.41vw;
	height: 70.41vw;
	max-width: none;
	transform: translate(-50%, -50%);
	overflow: visible;
	pointer-events: none;
}
.aboutArc circle{
	fill: none;
	stroke: var(--color-black);
	stroke-width: 1.5;
	stroke-linecap: round;
	stroke-dasharray: 1000;
	stroke-dashoffset: 1000;
	transform-box: fill-box;
	transform-origin: center;
	transform: rotate(180deg);
}
.aboutWrap.is-visible .aboutArc circle{
	animation: aboutArcDraw 1.8s cubic-bezier(0.65, 0, 0.35, 1) 0s forwards;
}
@keyframes aboutArcDraw{
	to{
		stroke-dashoffset: 0;
	}
}
.commonTtl{
	text-align: center;
}
.commonTtl h2{
	width: auto;
	display: block;
	margin-bottom: 0.95vw;
	font-family: var(--fontDisplay);
	font-size: 2.94vw;
	font-weight: 700;
	line-height: 1;
	letter-spacing: 0.08em;
	text-align: center;
}
.commonTtl p{
	font-family: var(--fontA1Medium);
	font-size: 1.02vw;
	line-height: 1;
	margin-bottom: 1.59vw;
}
.commonTtl ul{
	display: flex;
	justify-content: center;
	gap: 0.59vw;
}
.commonTtl li{
	width: 0.68vw;
	height: 0.68vw;
	border-radius: 50%;
}
.commonTtl li:nth-of-type(1){
	background: var(--brand-water);
}
.commonTtl li:nth-of-type(2){
	background: var(--brand-green);
}
.commonTtl li:nth-of-type(3){
	background: var(--brand-yellow);
}
.commonTtl li:nth-of-type(4){
	background: var(--brand-orange);
}
.commonTtl li:nth-of-type(5){
	background: var(--brand-pink);
}
.commonTtl.aboutHeader h2,
.commonTtl.aboutHeader p{
	text-align: left;
}
.commonTtl.aboutHeader ul{
	justify-content: flex-start;
}
.commonTtl.is-ready h2,
.commonTtl.is-ready p,
.commonTtl.is-ready li{
	opacity: 0;
}
.commonTtl.is-visible h2{
	opacity: 1;
	animation: commonTtlFadeUp 1.25s cubic-bezier(0.22, 1, 0.36, 1) 0s both;
}
.commonTtl.is-visible p{
	opacity: 1;
	animation: commonTtlFadeUp 1.25s cubic-bezier(0.22, 1, 0.36, 1) 0.16s both;
}
.commonTtl.is-visible li{
	opacity: 1;
	transform-origin: center bottom;
	animation: commonTtlDotBounce 0.48s cubic-bezier(0.22, 1, 0.36, 1) both;
}
.commonTtl.is-visible li:nth-of-type(1){
	animation-delay: 0.28s;
}
.commonTtl.is-visible li:nth-of-type(2){
	animation-delay: 0.36s;
}
.commonTtl.is-visible li:nth-of-type(3){
	animation-delay: 0.44s;
}
.commonTtl.is-visible li:nth-of-type(4){
	animation-delay: 0.52s;
}
.commonTtl.is-visible li:nth-of-type(5){
	animation-delay: 0.6s;
}
.commonTtl.is-leaving h2,
.commonTtl.is-leaving p,
.commonTtl.is-leaving li{
	animation: commonTtlFadeOut 0.8s ease both;
}
@keyframes commonTtlFadeUp{
	0%{
		opacity: 0;
		transform: translateY(0.7vw);
	}
	100%{
		opacity: 1;
		transform: translateY(0);
	}
}
@keyframes commonTtlDotBounce{
	0%{
		opacity: 0;
		transform: translateY(0.55vw) scale(0.6);
	}
	58%{
		opacity: 1;
		transform: translateY(-0.22vw) scale(1.16);
	}
	100%{
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}
@keyframes commonTtlFadeOut{
	0%{
		opacity: 1;
	}
	100%{
		opacity: 0;
	}
}
@media screen and (min-width: 1400px){
	.aboutWrap{
		padding: 6.86rem 0 8.846rem;
	}
	.aboutInner{
		grid-template-columns: 34.283rem 32.428rem;
		column-gap: 4.9rem;
		row-gap: 2.625rem;
		margin: 9.266rem auto 0;
	}
	.aboutLead{
		height: 50.96rem;
	}
	.aboutLead::before{
		left: -6.125rem;
		width: 31.5rem;
		height: 18.533rem;
	}
	.aboutInner h3{
		font-size: 2.625rem;
	}
	.aboutText p{
		font-size: 1.094rem;
	}
	.aboutText p:not(:last-of-type){
		margin-bottom: 1.619rem;
	}
	.aboutArc{
		left: 39.375rem;
		width: 61.609rem;
		height: 61.609rem;
	}
	.commonTtl h2{
		margin-bottom: 0.831rem;
		font-size: 2.573rem;
	}
	.commonTtl p{
		font-size: 0.893rem;
		margin-bottom: 1.391rem;
	}
	.commonTtl ul{
		gap: 0.516rem;
	}
	.commonTtl li{
		width: 0.595rem;
		height: 0.595rem;
	}
	@keyframes commonTtlFadeUp{
		0%{
			opacity: 0;
			transform: translateY(0.613rem);
		}
		100%{
			opacity: 1;
			transform: translateY(0);
		}
	}
	@keyframes commonTtlDotBounce{
		0%{
			opacity: 0;
			transform: translateY(0.481rem) scale(0.6);
		}
		58%{
			opacity: 1;
			transform: translateY(-0.193rem) scale(1.16);
		}
		100%{
			opacity: 1;
			transform: translateY(0) scale(1);
		}
	}
}
@media screen and (max-width: 768px){
	main{
		margin-top: 0;
	}
	.aboutWrap{
		width: 96vw;
		padding: 0 0 12vw;
	}
	.aboutHeader{
		position: static;
		grid-column: auto;
		grid-row: auto;
		align-self: auto;
		transform: none;
	}
	.aboutHeader h2,
	.aboutHeader p{
		text-align: center;
	}
	.aboutHeader ul{
		justify-content: center;
	}
	.commonTtl.aboutHeader h2,
	.commonTtl.aboutHeader p{
		text-align: center;
	}
	.commonTtl.aboutHeader ul{
		justify-content: center;
	}
	.commonTtl.aboutHeader.is-ready h2,
	.commonTtl.aboutHeader.is-ready p,
	.commonTtl.aboutHeader.is-ready li,
	.commonTtl.aboutHeader.is-visible h2,
	.commonTtl.aboutHeader.is-visible p,
	.commonTtl.aboutHeader.is-visible li{
		opacity: 1;
		transform: none;
		animation: none;
	}
	.aboutInner{
		grid-template-columns: 1fr;
		grid-template-rows: auto;
		gap: 8vw;
		width: 96%;
		margin: 0 auto;
		padding: 6vw 0 0;
		text-align: left;
	}
	.aboutLead{
		position: relative;
		grid-column: auto;
		grid-row: auto;
		height: 60vw;
	}
	.aboutLead::before{
		display: none;
	}
	.aboutInner h3{
		position: absolute;
		top: 50%;
		left: 9vw;
		display: block;
		background: transparent;
		font-size: 6.25vw;
		line-height: 1.8;
		text-align: left;
		transform: translateY(-50%);
		white-space: nowrap;
	}
	.aboutInner h3::before{
		content: '';
		position: absolute;
		top: 50%;
		left: -9vw;
		z-index: -1;
		width: 35vw;
		height: 37vw;
		background: #fff;
		transform: translateY(-50%);
	}
	.aboutText{
		grid-column: auto;
		grid-row: auto;
		text-align: left;
		padding: 0 0 0 9vw;
		margin-top: -1.5vw;
		transform: none;
	}
	.aboutText p{
		font-size: 3.65vw;
		line-height: 2;
		letter-spacing: 0.08em;
		text-align: left;
	}
	.aboutText p:not(:last-of-type){
		margin-bottom: 4.75vw;
	}
	.aboutArc{
		top: 50%;
		left: 50%;
		width: 72vw;
		height: 72vw;
	}
	.aboutArc circle{
		stroke-width: 2.2;
	}
	.commonTtl h2{
		width: auto;
		display: block;
		margin-bottom: 3vw;
		font-size: 8vw;
	}
	.commonTtl p{
		font-size: 2.9vw;
		line-height: 1;
		margin-bottom: 3.4vw;
	}
	.commonTtl ul{
		gap: 1.7vw;
	}
	.commonTtl li{
		width: 2.05vw;
		height: 2.05vw;
	}
	@keyframes commonTtlFadeUp{
		0%{
			opacity: 0;
			transform: translateY(4vw);
		}
		100%{
			opacity: 1;
			transform: translateY(0);
		}
	}
}

/* service */

.serviceWrap{
	padding: 5vw 0 3vw;
}
.serviceMap{
	position: relative;
	width: var(--content-outer-width);
	height: 44.5vw;
	max-height: none;
	margin: 0 auto;
}
.serviceMap>h3{
	position: absolute;
	top: 12vw;
	left: 50%;
	z-index: 1;
	width: 40vw;
	transform: translateX(-50%);
	font-family: var(--fontA1Medium);
	font-size: 3.54vw;
	line-height: 1.75;
	text-align: center;
	letter-spacing: 0.02em;
}
.serviceMap>h3 em{
	display: inline-block;
	font-style: normal;
}
.serviceMap>h3 em:first-of-type{
	margin-left: -0.8em;
}
.serviceMap>h3 em:last-of-type{
	margin-left: -0.25em;
	margin-right: 0.1em;
}
.serviceMap>h3 span{
	display: inline-block;
	font-family: var(--fontA1Medium);
	font-size: 1.2em;
	font-weight: inherit;
	color: var(--brand-water);
	line-height: inherit;
	margin-right: 0.08em;
	position: relative;
	transform-origin: center;
	vertical-align: baseline;
	z-index: 1;
}
.serviceMap>h3 span::before{
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: -1;
	width: 1.5em;
	height: 1.5em;
	border: solid 0.045em currentColor;
	border-radius: 50%;
	opacity: 0;
	transform: translate(-50%, -50%) scale(0.55);
}
.serviceMap.is-visible>h3 span{
	animation: serviceMapCopyBeat 1.05s cubic-bezier(0.33, 1, 0.68, 1) both;
}
.serviceMap.is-visible>h3 span::before{
	animation: serviceMapCopyRipple 1.15s ease-out both;
}
@keyframes serviceMapCopyBeat{
	0%{
		transform: scale(1);
	}
	36%{
		transform: scale(1.3);
	}
	62%{
		transform: scale(1.1);
	}
	100%{
		transform: scale(1);
	}
}
@keyframes serviceMapCopyRipple{
	0%{
		opacity: 0;
		transform: translate(-50%, -50%) scale(0.5);
	}
	24%{
		opacity: 0.24;
	}
	100%{
		opacity: 0;
		transform: translate(-50%, -50%) scale(1.85);
	}
}
.serviceList{
	position: absolute;
	inset: 0;
	width: 100%;
	max-width: none;
	text-align: center;
}
.serviceList li{
	--service-color: var(--brand-blue);
	position: absolute;
	width: 25vw;
	display: grid;
	grid-template-rows: auto auto;
	justify-items: center;
	justify-content: center;
	overflow: visible;
	z-index: 2;
}
.serviceList li hgroup{
	position: relative;
	grid-row: 2;
	z-index: 2;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 1vw;
	text-align: center;
}
.serviceList li hgroup p{
	position: relative;
	font-family: var(--fontDisplay);
	font-size: 2.25vw;
	font-weight: 700;
	line-height: 1;
	margin-left: -0.05em;
	color: var(--service-color);
}
.serviceList li a{
	position: absolute;
	inset: -1vw;
	z-index: 5;
	display: block;
}
.serviceList li a:focus-visible{
	outline: solid 0.2vw var(--service-color);
	outline-offset: 0.5vw;
	border-radius: 1vw;
}
.serviceList li:nth-of-type(1){
	top: 7vw;
	left: 0;
}
.serviceList li:nth-of-type(2){
	--service-color: var(--brand-green);
	top: 25vw;
	left: 9.25vw;
}
.serviceList li:nth-of-type(3){
	--service-color: var(--brand-orange);
	top: 32vw;
	left: 50%;
	transform: translateX(-50%);
}
.serviceList li:nth-of-type(4){
	--service-color: var(--brand-pink);
	top: 25vw;
	right: 9.25vw;
}
.serviceList li:nth-of-type(5){
	--service-color: var(--brand-purple);
	top: 7vw;
	right: 0;
}
.serviceList li img{
	position: relative;
	grid-row: 1;
	z-index: 1;
	width: 90%;
	object-fit: contain;
	margin: 0 auto 0.25vw;
}
.serviceList li h4{
	position: relative;
	font-family: var(--fontA1Medium);
	font-size: 1.32vw;
	line-height: 1.3;
	white-space: nowrap;
	transform: translateY(0.09em);
}
.serviceList li>p{
	display: none;
}
.serviceInner{
	margin: 11.22vw auto 0;
}
.serviceInner article{
	--service-color: var(--brand-blue);
	--service-line-inset: 0.6vw;
	position: relative;
	scroll-margin-top: 4.24vw;
	width: var(--service-detail-width);
	margin: 0 auto;
	overflow: visible;
}
.serviceDetailInner{
	width: 100%;
	padding: 6vw 0 6.8vw;
	position: relative;
	display: grid;
	--service-detail-number-width: 10.4vw;
	--service-detail-number-gap: 3.5vw;
	--service-detail-text-gap: 4.25vw;
	--service-detail-illust-gap: 1.5vw;
	grid-template-columns: var(--service-detail-number-width) var(--service-detail-number-gap) 0 var(--service-detail-text-gap) 35vw var(--service-detail-illust-gap) 35vw;
	align-items: start;
	row-gap: 2vw;
}
.serviceInner article::before,
.serviceInner article:last-of-type::after{
	content: '';
	display: block;
	position: absolute;
	left: var(--service-line-inset);
	width: calc(100% - var(--service-line-inset) * 2);
	margin: 0;
	border-bottom: var(--border-default);
}
.serviceInner article::before{
	top: 0;
}
.serviceInner article:last-of-type::after{
	bottom: 0;
}
.serviceInner article:nth-of-type(2){
	--service-color: var(--brand-green);
}
.serviceInner article:nth-of-type(3){
	--service-color: var(--brand-orange);
}
.serviceInner article:nth-of-type(4){
	--service-color: var(--brand-pink);
}
.serviceInner article:nth-of-type(5){
	--service-color: var(--brand-purple);
}
.serviceDetailInner::before{
	content: '';
	position: absolute;
	top: 3.45vw;
	bottom: 3.45vw;
	left: calc(var(--service-detail-number-width) + var(--service-detail-number-gap));
	width: 0;
	border-left: var(--border-default);
}
.serviceInner article h3{
	display: contents;
	font-family: var(--fontA1Bold);
	font-size: 2.6vw;
	line-height: 1.35;
	letter-spacing: 0.08em;
	margin: 0;
}
.serviceInner article h3 b::after{
	content: '';
	display: block;
	width: 4.6vw;
	margin-top: 1.3vw;
	border-bottom: solid 0.24vw var(--service-color);
}
.serviceInner article h3 span{
	grid-column: 1;
	grid-row: 1 / 3;
	display: block;
	font-family: var(--fontDisplay);
	font-size: 7.7vw;
	font-weight: 700;
	line-height: 0.9;
	justify-self: end;
	color: var(--service-color);
}
.serviceInner article h3 b{
	grid-column: 5;
	grid-row: 1;
	display: block;
	font: inherit;
	white-space: nowrap;
}
.serviceDetailIllust{
	display: block;
	grid-column: 7;
	grid-row: 1 / 3;
	width: 100%;
	height: 19vw;
	object-fit: contain;
	justify-self: start;
	align-self: end;
}
.serviceInner .serviceDetailText h6{
	font-family: var(--fontA1Medium);
	font-size: 2vw;
	line-height: 1.6;
	letter-spacing: 0.06em;
	margin: 0 0 0.5vw;
}
.serviceInner .serviceDetailText p{
	font-family: var(--fontA1Medium);
	font-size: 1.1vw;
	line-height: 2.53vw;
	letter-spacing: 0.06em;
	margin-bottom: 0;
}
.serviceInner article.is-ready .serviceDetailIllust,
.serviceInner article.is-ready h3 span,
.serviceInner article.is-ready h3 b,
.serviceInner article.is-ready .serviceDetailText,
.serviceInner article:first-of-type.is-ready .serviceSenkyo,
.serviceInner article:first-of-type.is-ready .serviceAcvList{
	opacity: 0;
}
.serviceInner article.is-visible h3 span,
.serviceInner article.is-visible h3 b,
.serviceInner article.is-visible .serviceDetailIllust{
	opacity: 1;
	animation: serviceDetailIllustIn 1.35s cubic-bezier(0.22, 1, 0.36, 1) 0s both;
}
.serviceInner article.is-visible .serviceDetailText{
	opacity: 1;
	animation: serviceDetailTextIn 1.35s cubic-bezier(0.22, 1, 0.36, 1) 0s both;
}
.serviceInner article:first-of-type.is-visible .serviceSenkyo,
.serviceInner article:first-of-type.is-visible .serviceAcvList{
	opacity: 1;
	animation: serviceDetailTextIn 1.35s cubic-bezier(0.22, 1, 0.36, 1) 0s both;
}
.serviceInner article.is-leaving .serviceDetailIllust,
.serviceInner article.is-leaving h3 span,
.serviceInner article.is-leaving h3 b,
.serviceInner article.is-leaving .serviceDetailText,
.serviceInner article:first-of-type.is-leaving .serviceSenkyo,
.serviceInner article:first-of-type.is-leaving .serviceAcvList{
	animation: serviceDetailOut 0.8s ease both;
}
.serviceInner article.is-ready::before,
.serviceInner article:last-of-type.is-ready::after,
.contactWrap.is-ready::before,
footer.is-ready::before{
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 0.75s cubic-bezier(0.65, 0, 0.35, 1);
}
.serviceInner article.is-ready .serviceDetailInner::before{
	opacity: 0;
	transition: opacity 0.65s ease 0.18s;
}
.serviceInner article.is-visible::before,
.serviceInner article:last-of-type.is-visible::after,
.contactWrap.is-visible::before,
footer.is-visible::before{
	transform: scaleX(1);
}
.serviceInner article.is-visible .serviceDetailInner::before{
	opacity: 1;
}
.serviceInner article.is-leaving::before,
.serviceInner article:last-of-type.is-leaving::after,
.contactWrap.is-leaving::before,
footer.is-leaving::before{
	transform: scaleX(0);
}
.serviceInner article.is-leaving .serviceDetailInner::before{
	opacity: 0;
}
@keyframes serviceDetailIllustIn{
	0%{
		opacity: 0;
		transform: scale(0.97);
	}
	100%{
		opacity: 1;
		transform: scale(1);
	}
}
@keyframes serviceDetailTextIn{
	0%{
		opacity: 0;
		transform: translateY(1.69vw);
	}
	100%{
		opacity: 1;
		transform: translateY(0);
	}
}
@keyframes serviceDetailOut{
	0%{
		opacity: 1;
	}
	100%{
		opacity: 0;
	}
}
.serviceDetailText{
	grid-column: 5;
	grid-row: 2;
	width: 34.5vw;
}
.serviceCaseBox{
	grid-column: 5 / -1;
	position: relative;
	z-index: 3;
	justify-self: stretch;
	margin: 2vw 0 0;
	background: #fff;
}
.serviceSenkyo{
	display: flex;
	align-items: stretch;
	border: var(--border-default);
}
.serviceSenkyoText{
	width: 52%;
	background: #fff;
	padding: 2.91vw;
}
.serviceSenkyo h4{
	font-family: var(--fontA1Bold);
	font-size: 2.13vw;
	line-height: 1.55;
	margin-bottom: 0.75vw;
	color: var(--brand-blue);
	text-align: left;
}
.serviceSenkyo h4::before{
	content: 'SPECIAL PROJECT';
	display: block;
	color: var(--color-black);
	font-size: 0.85vw;
	line-height: 1;
	margin-bottom: 1.12vw;
}
.serviceSenkyoText p{
	font-family: var(--fontA1Medium);
	font-size: 1.12vw;
	line-height: 2;
	letter-spacing: 0.04em;
}
.serviceSenkyo>img{
	width: 48%;
	height: auto;
	min-height: 0;
	aspect-ratio: 4 / 2.6;
	object-fit: cover;
	border-left: var(--border-default);
}
.serviceAcvList{
	display: grid;
	grid-template-columns: 15.2vw minmax(0, 1fr);
	grid-template-rows: 1fr auto auto 1fr;
	column-gap: 1.12vw;
	align-items: start;
	margin-top: 2.3vw;
	padding-top: 1.2vw;
}
.serviceAcvList h4{
	grid-column: 1;
	grid-row: 2;
	font-family: var(--fontA1Medium);
	font-size: 2.02vw;
	line-height: 1.35;
	margin: 0;
	padding-bottom: 0;
	border-bottom: none;
	text-align: left;
}
.serviceAcvList h4 small{
	display: block;
	font-size: 0.75em;
	line-height: 1;
	margin-bottom: 0.48vw;
}
.serviceAcvList h4::before{
	content: 'Results';
	display: table;
	background: transparent;
	color: var(--color-black);
	font-family: var(--fontDisplay);
	font-size: 3.78vw;
	line-height: 1;
	font-weight: 700;
	letter-spacing: 0.04em;
	margin: 0 0 1.27vw;
	padding: 0 0 1.27vw;
	border-bottom: var(--border-default);
}
.serviceAcvSlider{
	grid-column: 2;
	grid-row: 1 / 5;
	overflow: hidden;
}
.serviceAcvList ul{
	display: flex;
	flex-wrap: nowrap;
	gap: 0.98vw;
	overflow-x: auto;
	scroll-behavior: smooth;
	scroll-snap-type: x mandatory;
	scrollbar-width: none;
	cursor: grab;
}
.serviceAcvList ul.is-dragging{
	scroll-behavior: auto;
	scroll-snap-type: none;
	cursor: grabbing;
}
.serviceAcvList ul.is-dragging *{
	user-select: none;
}
.serviceAcvList ul::-webkit-scrollbar{
	display: none;
}
.serviceAcvList ul li{
	width: calc((100% - 0.98vw) / 2);
	min-width: calc((100% - 0.98vw) / 2);
	scroll-snap-align: start;
	background: #fff;
	border: var(--border-default);
}
.serviceAcvList h6,
.serviceAcvList h5,
.serviceAcvList p{
	padding: 0 1.34vw;
}
.serviceAcvList h6{
	font-family: var(--fontA1Medium);
	display: inline-block;
	font-size: 0.85vw;
	line-height: 1;
	margin: 1.06vw 1.34vw 1.05vw;
	padding: 0.58vw 1.01vw 0.44vw;
	border: var(--border-default);
	border-radius: 10vw;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}
.serviceAcvList h6 + h6{
	margin-left: -0.84vw;
}
.serviceAcvList h5{
	font-family: var(--fontA1Bold);
	font-size: 1.63vw;
	line-height: 1.5;
	margin-top: 1.6vw;
}
.serviceAcvList p{
	font-family: "MFW-PA1GothicStd-Light", "Noto Sans JP", sans-serif;
	font-size: 1vw;
	line-height: 1.75;
	margin: 0.75vw 0 0;
}
.serviceAcvList ul li img{
	width: 100%;
	aspect-ratio: 1.35 / 1;
	object-fit: cover;
	background: #d9d9d9;
}
.serviceAcvNav{
	grid-column: 1;
	grid-row: 3;
	display: flex;
	justify-content: flex-start;
	gap: 1.29vw;
	margin: 2.01vw 0 0 1.57vw;
}
.serviceAcvNav button{
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 3.49vw;
	height: 3.49vw;
	border: var(--border-default);
	border-radius: 50%;
	background: #fff;
	color: var(--color-black);
	font-family: var(--fontA1);
	font-size: 0;
	line-height: 1;
	touch-action: manipulation;
}
.serviceAcvNav button::before{
	position: absolute;
	top: 50%;
	left: 50%;
	font-size: 1.41vw;
	line-height: 1;
	transform: translate(-50%, -50%);
}
.serviceAcvNav button:first-child::before{
	content: '←';
}
.serviceAcvNav button:last-child::before{
	content: '→';
}
.serviceBtn{
	grid-column: 5;
	grid-row: 3;
	justify-self: start;
	align-self: start;
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 16.84vw;
	background: var(--service-color);
	border-radius: 3.39vw;
	color: #fff;
	font-family: var(--fontA1Medium);
	font-size: 1.25vw;
	line-height: 1;
	text-align: center;
	text-decoration: none;
	margin: 1vw 0 0;
	padding: 1.51vw 0;
}
.serviceBtn::after{
	content: '';
	width: 0.54vw;
	height: 0.54vw;
	margin-left: 1vw;
	border-top: solid 0.21vw currentColor;
	border-right: solid 0.21vw currentColor;
	transform: rotate(45deg);
}
@media screen and (min-width: 1400px){
	.serviceWrap{
		padding: 4.375rem 0 2.625rem;
	}
	.serviceMap{
		height: 39.375rem;
		margin: 0 auto 7.875rem;
	}
	.serviceMap>h3{
		top: 10.5rem;
		left: 50%;
		width: 35rem;
		font-size: 3.098rem;
	}
	.serviceList li{
		width: 21.875rem;
	}
	.serviceList li hgroup{
		gap: 0.875rem;
	}
	.serviceList li hgroup p{
		font-size: 1.969rem;
	}
	.serviceList li img{
		margin: 0 auto 0.464rem;
	}
	.serviceList li:nth-of-type(1){
		top: 6.125rem;
		left: 0;
	}
	.serviceList li:nth-of-type(2){
		top: 21.875rem;
		left: 8.094rem;
	}
	.serviceList li:nth-of-type(3){
		top: 26.25rem;
	}
	.serviceList li:nth-of-type(4){
		top: 21.875rem;
		right: 8.094rem;
	}
	.serviceList li:nth-of-type(5){
		top: 6.125rem;
		right: 0;
	}
	.serviceList li h4{
		font-size: 1.155rem;
	}
	.serviceList li a:focus-visible{
		outline: solid 0.175rem var(--service-color);
		outline-offset: 0.438rem;
		border-radius: 0.875rem;
	}
	.serviceInner{
		margin: 9.818rem auto 0;
	}
	.serviceInner article{
		--service-line-inset: 0.525rem;
		scroll-margin-top: 3.71rem;
	}
	.serviceDetailInner{
		padding: 5.25rem 0 5.95rem;
		--service-detail-number-width: 9.1rem;
		--service-detail-number-gap: 3.063rem;
		--service-detail-text-gap: 3.719rem;
		--service-detail-illust-gap: 1.313rem;
		grid-template-columns: var(--service-detail-number-width) var(--service-detail-number-gap) 0 var(--service-detail-text-gap) 30.625rem var(--service-detail-illust-gap) 30.625rem;
		row-gap: 1.75rem;
	}
	.serviceDetailInner::before{
		top: 3.02rem;
		bottom: 3.02rem;
	}
	.serviceInner article h3{
		font-size: 2.275rem;
	}
	.serviceInner article h3 b::after{
		width: 4.025rem;
		margin-top: 1.135rem;
		border-bottom-width: 0.21rem;
	}
	.serviceInner article h3 span{
		font-size: 6.738rem;
	}
	.serviceDetailIllust{
		height: 16.625rem;
	}
	.serviceDetailText{
		width: 30.188rem;
	}
	.serviceInner .serviceDetailText p{
		font-size: 0.96rem;
		line-height: 2.21rem;
	}
	.serviceInner .serviceDetailText h6{
		font-size: 1.75rem;
		line-height: 1.85;
		margin: 0 0 0.438rem;
	}
	.serviceBtn{
		width: 14.735rem;
		border-radius: 2.96rem;
		font-size: 1.094rem;
		margin-top: 1.665rem;
		padding: 1.325rem 0;
	}
	.serviceBtn::after{
		width: 0.473rem;
		height: 0.473rem;
		margin-left: 0.875rem;
		border-top-width: 0.184rem;
		border-right-width: 0.184rem;
	}
	.serviceCaseBox{
		margin: 1.75rem 0 0;
	}
	.serviceSenkyoText{
		padding: 2.545rem;
	}
	.serviceSenkyo h4{
		font-size: 1.86rem;
		margin-bottom: 0.656rem;
	}
	.serviceSenkyo h4::before{
		font-size: 0.74rem;
		margin-bottom: 0.98rem;
	}
	.serviceSenkyoText p{
		font-size: 0.98rem;
	}
	.serviceAcvList{
		grid-template-columns: 13.3rem minmax(0, 1fr);
		column-gap: 0.98rem;
		margin-top: 2.01rem;
		padding-top: 1.05rem;
	}
	.serviceAcvList h4::before{
		font-size: 3.31rem;
		margin-bottom: 1.11rem;
		padding-bottom: 1.11rem;
	}
	.serviceAcvList h4{
		font-size: 1.77rem;
	}
	.serviceAcvList h4 small{
		margin-bottom: 0.42rem;
	}
	.serviceAcvList ul{
		gap: 0.86rem;
	}
	.serviceAcvList ul li{
		width: calc((100% - 0.86rem) / 2);
		min-width: calc((100% - 0.86rem) / 2);
	}
	.serviceAcvList h6,
	.serviceAcvList h5,
	.serviceAcvList p{
		padding: 0 1.175rem;
	}
	.serviceAcvList h6{
		font-size: 0.74rem;
		margin: 0.925rem 1.175rem 0.92rem;
		padding: 0.505rem 0.88rem 0.385rem;
	}
	.serviceAcvList h6 + h6{
		margin-left: -0.735rem;
	}
	.serviceAcvList h5{
		font-size: 1.42rem;
		margin-top: 1.4rem;
	}
	.serviceAcvList p{
		font-size: 0.875rem;
		margin-top: 0.656rem;
	}
	.serviceAcvNav{
		gap: 1.13rem;
		margin: 1.76rem 0 0 1.37rem;
	}
	.serviceAcvNav button{
		width: 3.055rem;
		height: 3.055rem;
	}
	.serviceAcvNav button::before{
		font-size: 1.23rem;
	}
}
@media screen and (max-width: 768px){
	:root{
		--service-detail-width: 94vw;
	}
	.serviceWrap{
		padding: 18vw 0 0;
	}
	.serviceMap{
		width: 96vw;
		height: 126vw;
		max-height: none;
		margin: 8vw auto 0;
		padding-top: 0;
		position: relative;
	}
	.serviceMap>h3{
		position: absolute;
		top: 44vw;
		left: 50%;
		width: 80vw;
		transform: translateX(-50%);
		font-size: 7.35vw;
		line-height: 1.5;
	}
	.serviceList{
		position: absolute;
		width: 100%;
		display: block;
		overflow: visible;
	}
	.serviceList li{
		width: 42vw;
		height: auto;
	}
	.serviceList li:nth-of-type(1){
		top: 4vw;
		left: 4vw;
		right: auto;
	}
	.serviceList li:nth-of-type(2){
		top: 4vw;
		left: auto;
		right: 4vw;
	}
	.serviceList li:nth-of-type(3){
		top: 72vw;
		left: -3.5vw;
		right: auto;
		transform: none;
	}
	.serviceList li:nth-of-type(4){
		top: 72vw;
		left: auto;
		right: -3.5vw;
		transform: none;
	}
	.serviceList li:nth-of-type(5){
		top: 93vw;
		left: 0;
		right: 0;
		margin: 0 auto;
		transform: none;
	}
	.serviceList li hgroup{
		position: absolute;
		top: 19.5vw;
		left: 0;
		right: 0;
		width: 100%;
		max-width: 100%;
		margin: 0 auto;
		gap: 1.5vw;
		justify-content: center;
	}
	.serviceList li hgroup p{
		font-size: 5vw;
	}
	.serviceList li img{
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		width: 32vw;
		height: auto;
		margin: 0 auto;
		object-fit: contain;
	}
	.serviceList li h4{
		font-size: 3.25vw;
		line-height: 1.3;
		margin: 0;
	}
	.serviceList li a:focus-visible{
		outline: solid 0.4vw var(--service-color);
		outline-offset: 1vw;
		border-radius: 2vw;
	}
	.serviceList li a{
		top: 0;
		left: 0;
		right: 0;
		bottom: auto;
		height: 30vw;
	}
	.serviceList li>p{
		display: none;
	}
	.serviceInner{
		width: 100%;
		max-width: inherit;
		margin: 8vw auto 0;
	}
	.serviceInner article{
		width: var(--service-detail-width);
		padding: 0;
		overflow: visible;
	}
	.serviceInner article::before,
	.serviceInner article:last-of-type::after{
		display: block;
	}
	.serviceDetailInner{
		width: calc(100% - var(--service-line-inset) * 2);
		margin: 0 auto;
		padding: 7.6vw 0;
		grid-template-columns: 12vw 3vw var(--border-width) 5.6vw 1fr;
		grid-template-rows: auto auto auto;
		row-gap: 2vw;
	}
	.serviceDetailInner::before{
		position: static;
		grid-column: 3;
		grid-row: 1 / 3;
		display: block;
		align-self: stretch;
		width: 0;
		border-left: var(--border-default);
	}
	.serviceInner article:not(:first-of-type) .serviceDetailInner::before{
		grid-row: 1 / 4;
	}
	.serviceInner article h3{
		position: relative;
		grid-column: 1;
		grid-row: 1 / 3;
		display: flex;
		flex-direction: column;
		align-items: center;
		font-size: 6.2vw;
		line-height: 1;
		letter-spacing: 0;
		margin: 0;
		white-space: nowrap;
	}
	.serviceInner .serviceDetailText h6{
		font-size: 5.25vw;
		line-height: 1.65;
		letter-spacing: 0.04em;
		margin: 0 0 2.5vw;
	}
	.serviceInner article h3 span{
		display: block;
		font-size: 9.4vw;
		letter-spacing: 0.04em;
		line-height: 0.9;
		margin: 0 0 3.5vw;
		padding-bottom: 2.2vw;
		border-bottom: solid 0.6vw var(--service-color);
	}
	.serviceInner article h3 b{
		display: block;
		font: inherit;
		line-height: 1.7;
		letter-spacing: 0.22em;
		writing-mode: vertical-rl;
		white-space: nowrap;
	}
	.serviceInner article h3 b::after{
		display: none;
	}
	.serviceDetailIllust{
		grid-column: 5;
		grid-row: 2;
		width: 100%;
		height: auto;
		margin: 0 0 0 auto;
	}
	.serviceDetailText{
		grid-column: 5;
		grid-row: 1;
		width: 100%;
	}
	.serviceInner .serviceDetailText p{
		font-size: 3.45vw;
		line-height: 2;
		letter-spacing: 0.02em;
		margin-bottom: 0;
	}
	@keyframes serviceDetailTextIn{
		0%{
			opacity: 0;
			transform: translateY(5vw);
		}
		100%{
			opacity: 1;
			transform: translateY(0);
		}
	}
	.serviceCaseBox{
		grid-column: 1 / -1;
		grid-row: 3;
		margin: 7vw auto 0;
	}
	.serviceSenkyo{
		display: flex;
		flex-direction: column;
		width: 95%;
		margin: -3vw auto 6vw;
	}
	.serviceSenkyoText{
		width: 100%;
		order: 2;
		padding: 5vw;
	}
	.serviceSenkyo h4{
		font-size: 5.4vw;
		line-height: 1.55;
		margin-bottom: 1.5vw;
	}
	.serviceSenkyo h4::before{
		font-size: 2.4vw;
		margin-bottom: 3vw;
	}
	.serviceSenkyoText p{
		font-size: 3.2vw;
		line-height: 2;
	}
	.serviceSenkyo>img{
		width: 100%;
		order: 1;
		height: auto;
		min-height: 0;
		aspect-ratio: 4 / 2.6;
		border-left: none;
		border-bottom: none;
	}
	.serviceAcvList{
		display: grid;
		grid-template-columns: 1fr;
		grid-template-rows: auto auto auto;
	}
	.serviceAcvList h4{
		grid-column: 1;
		grid-row: 1;
		font-size: 5vw;
		line-height: 1.35;
		margin: 0 0 5vw;
		padding-bottom: 0;
		border-bottom: none;
		text-align: center;
	}
	.serviceAcvList h4 small{
		font-size: 0.74em;
		line-height: 1;
		margin-bottom: 1.2vw;
	}
	.serviceAcvList h4 br{
		display: none;
	}
	.serviceAcvList h4::before{
		display: table;
		font-size: 10vw;
		margin: 0 auto 3vw;
		padding: 0 0 3vw;
		border-bottom: var(--border-default);
	}
	.serviceAcvSlider{
		grid-column: 1;
		grid-row: 2;
	}
	.serviceAcvList ul{
		width: 100%;
		display: flex;
		flex-wrap: nowrap;
		gap: 1.8vw;
		overflow-x: auto;
		overflow-y: hidden;
		-webkit-overflow-scrolling: touch;
		padding-right: 1px;
	}
	.serviceAcvList ul li{
		width: 76vw;
		min-width: 76vw;
	}
	.serviceAcvList h6,
	.serviceAcvList h5,
	.serviceAcvList p{
		padding: 0 4vw;
	}
	.serviceAcvList h6{
		max-width: calc(100% - 8vw);
		font-size: 2.4vw;
		margin: 3vw 4vw 4.7vw;
		padding: 2vw 2.4vw;
	}
	.serviceAcvList h6 + h6{
		margin-left: -2.8vw;
	}
	.serviceAcvList h5{
		font-size: 4.5vw;
		line-height: 7vw;
		margin-top: 5vw;
	}
	.serviceAcvList p{
		font-family: var(--fontA1Medium);
		font-size: 3.15vw;
		line-height: 6vw;
		margin: 1.5vw 0 0 0;
	}
	.serviceAcvNav{
		grid-column: 1;
		grid-row: 3;
		justify-content: center;
		gap: 3.4vw;
		margin: 5vw 0 0;
	}
	.serviceAcvNav button{
		width: 10vw;
		height: 10vw;
	}
	.serviceAcvNav button::before{
		font-size: 3.55vw;
	}
	.serviceBtn{
		width: 70vw;
		border-radius: 10vw;
		font-size: 3.6vw;
		justify-self: center;
		margin: 2vw auto 4vw;
		padding: 4vw 0;
	}
	.serviceBtn::after{
		width: 1.6vw;
		height: 1.6vw;
		margin-left: 2.8vw;
		border-top-width: 0.38vw;
		border-right-width: 0.38vw;
	}
}

/* company */

.companyWrap{
	padding-top: 5.5vw;
}
.companyInner{
	width: var(--content-outer-width);
	max-width: 1400px;
	margin: 6.5vw auto 8.9vw;
}
.companyInner table{
	max-width: 1400px;
	margin: 0 auto;
}
.companyInner table th,
.companyInner table td{
	vertical-align: top;
	letter-spacing: 0.101vw;
	font-size: 1.29vw;
	line-height: 2.31vw;
}
.companyInner table th{
	font-family: var(--fontA1Bold);
	letter-spacing: 0.121vw;
	padding-right: 4.5vw;
	font-weight: normal;
}
.companyInner table td{
	font-family: var(--fontA1);
}
.companyInner table tr:not(:last-of-type) td{
	padding-bottom: 2.25vw;
}
@media screen and (min-width: 1400px){
	.companyWrap{
		padding-top: 4.813rem;
	}
	.companyInner{
		max-width: 87.5rem;
		margin: 5.688rem auto 7.788rem;
	}
	.companyInner table{
		max-width: 87.5rem;
	}
	.companyInner table th,
	.companyInner table td{
		letter-spacing: 0.088rem;
		font-size: 1.13rem;
		line-height: 2.021rem;
	}
	.companyInner table th{
		letter-spacing: 0.106rem;
		padding-right: 3.938rem;
	}
	.companyInner table tr:not(:last-of-type) td{
		padding-bottom: 1.969rem;
	}
}
@media screen and (max-width: 768px){
	.companyWrap{
		padding-top: 14vw;
	}
	.companyInner{
		width: 94vw;
		padding: 0 6vw;
		margin: 12vw auto 15vw;
	}
	.companyInner table th,
	.companyInner table td{
		letter-spacing: 0.104vw;
		font-size: 3.5vw;
		line-height: 6.5vw;
	}
	.companyInner table th{
		width: 24vw;
		padding-right: 4vw;
	}
	.companyInner table td{
		width: 58vw;
	}
	.companyInner table tr:not(:last-of-type) td{
		padding-bottom: 5vw;
	}
	.companyInner table tr td span{
		display: inline-block;
	}
}

/* form */

.contactWrap{
	position: relative;
	margin: 0 auto;
	padding: 8.9vw 0;
	background: #fff;
}
.contactWrap::before,
footer::before{
	content: '';
	position: absolute;
	top: 0;
	left: calc((100% - var(--content-outer-width)) / 2 + 0.6vw);
	width: calc(var(--content-outer-width) - 1.2vw);
	height: var(--border-width);
	background: var(--color-black);
}
.formTable{
	width: var(--content-outer-width);
	max-width: 720px;
	margin: 3.39vw auto;
	letter-spacing: 0.06vw;
}
.formTable th,
.formTable td{
	vertical-align: top;
}
.formTable th{
	font-family: var(--fontA1Medium);
	font-weight: normal;
	font-size: 1.24vw;
	width: 16.84vw;
	padding-top: 2.47vw;
}
.formTable td{
	padding: 1.57vw 0 0 1.57vw;
}
.formTable th span{
	font-size: 0.8em;
	color: #d52b25;
	margin-left: 0.68vw;
	letter-spacing: 0;
}
.formTable th small{
	display: block;
	font-family: "MFW-PA1GothicStd-Light", "Noto Sans JP", sans-serif;
}
.formTable label{
	display: none;
}
.formGroupInline{
	display: flex;
	gap: 1vw;
}
.hpField{
	position: absolute;
	left: -9999px;
	opacity: 0;
	pointer-events: none;
}
.formSubmit{
	text-align: center;
}
.formSubmit p{
	font-family: var(--fontA1Medium);
	font-size: 0.96em;
	padding: 1.69vw 0 0.9vw;
}
.formSubmit p a{
	color: var(--brand-water);
	text-decoration: underline;
	text-underline-offset: 0.18em;
}
.formSubmit .formPrivacyPolicy{
	font-family: var(--fontA1Bold);
	display: flex;
	gap: 0.68vw;
	align-items: center;
	justify-content: center;
}
.formSubmit .submit-button{
	width: 24.67vw;
	margin: 3.65vw 0 0;
	padding: 1.51vw 0;
	border: var(--border-default);
	border-radius: 0;
	background: #fff;
	color: var(--color-black);
	font-family: var(--fontA1Bold);
	font-size: 1.41vw;
	line-height: 1;
	letter-spacing: 0.12em;
	transition: 0.8s;
}
.formSubmit .submit-button span{
	display: inline-block;
}
.contactNotice[hidden]{
	display: none;
}
.contactNotice{
	position: fixed;
	left: 50%;
	top: 45%;
	z-index: 2200;
	overflow: visible;
	width: 29.65vw;
	padding: 2.33vw 3.18vw;
	border: var(--border-default);
	background: #fff;
	color: var(--color-black);
	text-align: center;
	transform: translate(-50%, -50%);
	animation: contactNoticeIn 0.45s ease forwards;
}
.contactNotice button,
.privacyModalClose{
	position: absolute;
	top: -0.79vw;
	right: -0.79vw;
	display: block;
	width: 2.54vw;
	height: 2.54vw;
	border: var(--border-default);
	border-radius: 50%;
	background: #fff;
	color: var(--color-black);
}
.contactNotice button::before,
.contactNotice button::after,
.privacyModalClose::before,
.privacyModalClose::after{
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	width: 1.06vw;
	border-top: var(--border-default);
}
.contactNotice button::before,
.privacyModalClose::before{
	transform: translate(-50%, -50%) rotate(45deg);
}
.contactNotice button::after,
.privacyModalClose::after{
	transform: translate(-50%, -50%) rotate(-45deg);
}
.contactNotice button:hover,
.contactNotice button:focus-visible,
.privacyModalClose:hover,
.privacyModalClose:focus-visible{
	opacity: 1;
	background: #f5f5f5;
}
.contactNotice p{
	font-family: var(--fontA1Bold);
	font-size: 1.22vw;
	line-height: 1.5;
	letter-spacing: 0.08em;
}
.contactNotice span{
	display: block;
	margin-top: 0.69vw;
	font-family: var(--fontA1Medium);
	font-size: 0.87vw;
	line-height: 1.8;
	letter-spacing: 0.06em;
}
.contactNotice.error{
	border-color: var(--vermilion);
}
.contactNotice.error p{
	color: var(--vermilion);
}
@keyframes contactNoticeIn{
	0%{
		opacity: 0;
		transform: translate(-50%, calc(-50% + 1vw));
	}
	100%{
		opacity: 1;
		transform: translate(-50%, -50%);
	}
}
.privacyModal[hidden]{
	display: none;
}
.privacyModal{
	position: fixed;
	inset: 0;
	width: 100vw;
	height: 100dvh;
	z-index: 2500;
	display: grid;
	place-items: center;
	padding: 4.24vw;
}
.privacyModalOverlay{
	position: absolute;
	inset: 0;
	background: rgba(31, 29, 27, 0.45);
}
.privacyModalContent{
	position: relative;
	z-index: 1;
	width: 57.18vw;
	overflow: visible;
	background: #fff;
	border: var(--border-default);
}
.privacyModalBody{
	max-height: 78vh;
	overflow-y: auto;
	padding: 2.75vw 3.18vw 3.18vw;
}
.privacyModalContent h3{
	font-family: var(--fontA1Bold);
	font-size: 1.91vw;
	line-height: 1.4;
	margin: 0 3.6vw 1.27vw 0;
}
.privacyModalContent section{
	margin-top: 1.59vw;
}
.privacyModalContent section:last-of-type{
	padding-top: 1.48vw;
	border-top: var(--border-default);
}
.privacyModalContent h4{
	font-family: var(--fontA1Bold);
	font-size: 1.01vw;
	line-height: 1.55;
	letter-spacing: 0.06em;
	margin-bottom: 0.53vw;
}
.privacyModalContent p,
.privacyModalContent li{
	font-family: var(--fontA1);
	font-size: 0.91vw;
	line-height: 1.75;
	letter-spacing: 0.05em;
}
.privacyModalContent p{
	margin-top: 0.74vw;
}
.privacyModalContent ul{
	margin: 0.74vw 0 0;
}
.privacyModalContent li{
	position: relative;
	padding-left: 1.2em;
}
.privacyModalContent li::before{
	content: '・';
	position: absolute;
	top: 0;
	left: 0;
}
.privacyModalClose{
	z-index: 2;
	transition: background 0.25s ease;
}
.privacyModalBottomClose{
	display: block;
	width: 12.71vw;
	margin: 2.33vw auto 0;
	padding: 0.95vw 0;
	border: var(--border-default);
	border-radius: 0;
	background: #fff;
	color: var(--color-black);
	font-family: var(--fontA1Bold);
	font-size: 1.01vw;
	line-height: 1;
	letter-spacing: 0.12em;
}
.privacyModalBottomClose:hover,
.privacyModalBottomClose:focus-visible{
	opacity: 1;
	color: #fff;
	background: var(--color-black);
}
input,
select,
textarea{
	font-size: 16px;
	padding: 6px 14px;
	border-radius: 3px;
}
input,
textarea{
	background: #f1f1f1;
	border: solid 1px #f1f1f1;
	width: 100%;
}
input:focus,
select:focus,
textarea:focus{
	border: solid 1px #c3c3c3;
}
textarea{
	height: 15vw;
}
select{
	background-color: #f1f1f1;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='10' viewBox='0 0 16 10'%3E%3Cpath d='M1 1.2 8 8.2 15 1.2' fill='none' stroke='%23242323' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
	background-repeat: no-repeat;
	background-position: right 1.1vw center;
	background-size: 1vw auto;
	color: #242323;
	border: solid 1px #f1f1f1;
	width: 100%;
	min-height: 2.8vw;
	line-height: 1.4;
	padding-top: 0.75vw;
	padding-right: 3vw;
	padding-bottom: 0.65vw;
	appearance: none;
	-webkit-appearance: none;
	cursor: pointer;
}
@media screen and (min-width: 1480px){
	select{
		background-position: right 1.017rem center;
		background-size: 0.925rem auto;
		min-height: 2.59rem;
		padding-top: 0.694rem;
		padding-right: 2.775rem;
		padding-bottom: 0.601rem;
	}
}
input::placeholder{
	opacity: 0.35;
}
input:focus::-webkit-input-placeholder{
	color: transparent;
}
input:focus::-moz-placeholder{
	color: transparent;
}
input:focus::-ms-input-placeholder{
	color: transparent;
}
input:focus::placeholder{
	color: transparent;
}
input[type="checkbox"]{
	position: relative;
	padding: 8px;
	width: 17px;
	height: 17px;
	border: 1px solid #666;
	background: #f8f8f8;
	border-radius: 3px;
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
input[type="checkbox"]:checked{
	background: var(--brand-water);
	border: 1px solid var(--brand-water);
}
input[type="checkbox"]:checked:before{
	content: '';
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -58%) rotate(50deg);
	width: 4px;
	height: 8px;
	border-right: 2px solid #fff;
	border-bottom: 2px solid #fff;
}
.formSubmit .submit-button:hover,
.formSubmit .submit-button:focus-visible,
.formSubmit .submit-button.is-complete{
	opacity: 1;
	color: #fff;
	background: var(--color-black);
}
.formSubmit .submit-button:disabled{
	opacity: 1;
	cursor: default;
}
.formSubmit .submit-button.is-error{
	color: #fff;
	background: var(--vermilion);
	border-color: var(--vermilion);
}
@media screen and (min-width: 1400px){
	.contactWrap{
		padding: 7.788rem 0;
	}
	.contactWrap::before,
	footer::before{
		left: calc((100% - var(--content-outer-width)) / 2 + 0.525rem);
		width: calc(var(--content-outer-width) - 1.05rem);
	}
	.formTable{
		margin: 2.96rem auto;
		letter-spacing: 0.053rem;
	}
	.formTable th{
		width: 14.735rem;
		padding-top: 2.161rem;
		font-size: 1.085rem;
	}
	.formTable td{
		padding: 1.374rem 0 0 1.374rem;
	}
	.formTable th span{
		margin-left: 0.595rem;
	}
	.formSubmit p{
		padding: 1.479rem 0 0.788rem;
	}
	.formSubmit .submit-button{
		width: 21.586rem;
		margin: 3.194rem 0 0;
		padding: 1.321rem 0;
		font-size: 1.234rem;
	}
	.contactNotice{
		width: 25.944rem;
		padding: 2.039rem 2.783rem;
	}
	.contactNotice button,
	.privacyModalClose{
		top: -0.691rem;
		right: -0.691rem;
		width: 2.223rem;
		height: 2.223rem;
	}
	.contactNotice button::before,
	.contactNotice button::after,
	.privacyModalClose::before,
	.privacyModalClose::after{
		width: 0.928rem;
	}
	.contactNotice p{
		font-size: 1.068rem;
	}
	.contactNotice span{
		margin-top: 0.604rem;
		font-size: 0.761rem;
	}
	.formSubmit .formPrivacyPolicy{
		gap: 0.595rem;
	}
	.privacyModalContent section{
		margin-top: 1.391rem;
	}
	.privacyModalContent section:last-of-type{
		padding-top: 1.295rem;
	}
	.privacyModalBody{
		padding: 2.406rem 2.783rem 2.783rem;
	}
	.privacyModalContent{
		width: 50.033rem;
	}
	.privacyModalContent h4{
		font-size: 0.884rem;
		margin-bottom: 0.464rem;
	}
	.privacyModalContent p,
	.privacyModalContent li{
		font-size: 0.796rem;
	}
	.privacyModalContent ul{
		margin-top: 0.648rem;
	}
	.privacyModalBottomClose{
		width: 11.121rem;
		margin-top: 2.039rem;
		padding: 0.831rem 0;
		font-size: 0.884rem;
	}
}
@media screen and (max-width: 768px){
	.contactWrap{
		padding: 14vw 0 16vw;
	}
	.contactWrap::before,
	footer::before{
		left: 3vw;
		width: 94vw;
	}
	.formTable{
		width: 94vw;
		margin: 10vw auto 3vw;
	}
	.formTable th,
	.formTable td{
		display: block;
		width: 100%;
	}
	.formTable th{
		padding: 0 0 1.5vw;
		font-size: 3.5vw;
	}
	.formTable td{
		padding: 0 0 5vw;
	}
	.formTable th small{
		display: inline;
		margin-left: 2vw;
	}
	.formGroupInline{
		gap: 1.5vw;
	}
	.formSubmit p{
		padding: 0 6vw 5vw;
		font-size: 3.5vw;
		line-height: 7vw;
	}
	.formSubmit p a{
		text-underline-offset: 0.2em;
	}
	.formSubmit .formPrivacyPolicy{
		gap: 1.8vw;
		font-size: 3.5vw;
		line-height: 1.6;
	}
	.formSubmit .submit-button{
		width: 76vw;
		margin: 10vw 0 0;
		padding: 4.6vw 0;
		font-size: 4vw;
	}
	.contactNotice{
		width: 84vw;
		padding: 8vw 10vw;
	}
	.contactNotice button,
	.privacyModalClose{
		top: -2.5vw;
		right: -2.5vw;
		width: 8vw;
		height: 8vw;
	}
	.contactNotice button::before,
	.contactNotice button::after,
	.privacyModalClose::before,
	.privacyModalClose::after{
		width: 3.2vw;
	}
	.contactNotice p{
		font-size: 4.2vw;
	}
	.contactNotice span{
		margin-top: 2vw;
		font-size: 3.2vw;
	}
	.privacyModal{
		padding: 6vw;
	}
	.privacyModalContent{
		width: 88vw;
	}
	.privacyModalBody{
		max-height: 78vh;
		padding: 7vw 6vw 7vw;
	}
	.privacyModalContent h3{
		font-size: 5vw;
		line-height: 1.4;
		margin: 0 10vw 4vw 0;
	}
	.privacyModalContent section{
		margin-top: 5.5vw;
	}
	.privacyModalContent section:last-of-type{
		padding-top: 5vw;
	}
	.privacyModalContent h4{
		font-size: 3.35vw;
		line-height: 1.55;
		margin-bottom: 1.6vw;
	}
	.privacyModalContent p,
	.privacyModalContent li{
		font-size: 3vw;
		line-height: 1.75;
	}
	.privacyModalContent p{
		margin-top: 2.5vw;
	}
	.privacyModalContent ul{
		margin-top: 2.5vw;
	}
	.privacyModalBottomClose{
		width: 40vw;
		margin-top: 8vw;
		padding: 3.2vw 0;
		font-size: 3.5vw;
	}
	textarea{
		height: 60vw;
		padding: 3.75vw;
	}
	select{
		min-height: 11vw;
		padding: 2.5vw 10vw 2.5vw 3.5vw;
		background-position: right 3.6vw center;
		background-size: 2.4vw auto;
	}
}

/* footer */

footer{
	width: 100vw;
	padding: 7.75vw 0 0;
	position: relative;
	background: #fff;
}
.footerInner{
	width: 39.28vw;
	display: flex;
	align-items: center;
	margin: 0 auto;
	gap: 16.84vw;
}
footer img{
	display: block;
	width: 11.22vw;
}
footer a{
	color: inherit;
	text-decoration: none;
}
.footerInner>a{
	display: block;
	flex-shrink: 0;
}
.footerInner ul{
	width: 100%;
}
.footerInner ul li{
	font-size: 1.22vw;
	line-height: 1.9;
	margin-bottom: 1.12vw;
}
footer p{
	font-size: 0.95vw;
	padding: 7.84vw 0 1.12vw;
	position: relative;
	z-index: 3;
	text-align: center;
}
@media screen and (min-width: 1400px){
	footer{
		padding-top: 6.781rem;
	}
	.footerInner{
		width: 34.37rem;
		gap: 14.735rem;
	}
	footer img{
		width: 9.818rem;
	}
	.footerInner ul li{
		font-size: 1.068rem;
		margin-bottom: 0.98rem;
	}
	footer p{
		font-size: 0.831rem;
		padding: 6.86rem 0 0.98rem;
	}
}
@media screen and (max-width: 768px){
	footer{
		padding-top: 15vw;
	}
	.footerInner{
		width: 65vw;
		margin: 0 auto 10vw;
		gap: 12vw;
	}
	footer img{
		width: 27vw;
	}
	.footerInner ul{
		margin-top: 1.5vw;
	}
	.footerInner ul li{
		font-size: 3.5vw;
		line-height: 7.5vw;
		font-family: var(--fontA1Medium);
	}
	footer p{
		font-size: 2.5vw;
		padding: 7vw 0 8vw;
	}
}
