@charset "UTF-8";




/* CSS STYLE */

html {
	font-size: 10px;
}
@media screen and (max-width: 1180px) {
	html {
		font-size: 0.8474576vw;
	}
}
body {
	font-size: 1.6rem;
	line-height: 1.66;
}

a:hover,
a:active {
	color: var(--color-green);
	text-decoration: underline;
}

a,
a img,
a video {
	transition: 0.3s ease;
}
a:hover img {
	opacity: 0.6;
}

.pcnone {
	display: none !important;
}

iframe[src*="youtube.com"], iframe[src*="youtube-nocookie.com"] {
	aspect-ratio: 16 / 9;
	width: 100%;
	height: auto;
}










/* SITEPARTS */

#warp {
	width: 100%;
}

.inner {
	position: relative;
	width: 100%;
	max-width: 128rem;
	margin-left: auto;
	margin-right: auto;
	padding-left: 4rem;
	padding-right: 4rem;
	z-index: 1;
}
.inner-mid {
	position: relative;
	width: 100%;
	max-width: 118rem;
	margin-left: auto;
	margin-right: auto;
	padding-left: 4rem;
	padding-right: 4rem;
	z-index: 1;
}
.inner-sml {
	position: relative;
	width: 100%;
	max-width: 88rem;
	margin-left: auto;
	margin-right: auto;
	padding-left: 4rem;
	padding-right: 4rem;
	z-index: 1;
}

.head1 {
	margin-bottom: 2rem;
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.3;
	text-align: center;
	span {
		display: block;
		margin-bottom: 1rem;
		font-family: var(--font-en);
		font-size: 1.5rem;
		font-weight: 700;
		letter-spacing: 0.02em;
		color: var(--color-green);
	}
	& + p {
		margin-bottom: 6rem;
		font-feature-settings: "palt" !important;
		font-size: 4.6rem;
		font-weight: 700;
		line-height: 1.3;
		letter-spacing: 0.05em;
		text-align: center;
		span {
			color: var(--color-green);
		}
	}
}

.btn {
	position: relative;
	line-height: 1;
	a, button {
		position: relative;
		display: inline-flex;
		justify-content: center;
		align-items: center;
		border: none;
		border-radius: 7rem;
		background-color: var(--color-orange);
		width: 35rem;
		height: 7rem;
		margin: 0;
		padding: 0.8rem 3rem 1rem 1rem;
		font-size: 2rem;
		font-weight: 700;
		line-height: 1;
		text-decoration: none;
		color: var(--color-w);
		transition: 0.3s ease;
		&:after {
			content: "";
			display: block;
			position: absolute;
			top: 50%;
			right: 2.2rem;
			background: url(../img/btn-ar.png) no-repeat center center / cover;
			width: 2.6rem;
			height: 2.6rem;
			margin-top: -1.3rem;
			transition: 0.3s ease;
		}
		&:hover {
			background-color: #ffb57f;
			&:after {
				right: 1.8rem;
			}
		}
	}
}

.big {
	font-size: 120%;
}
.sml {
	font-size: 85%;
}
.note {
	font-size: 85%;
}

.img-box {
	position: relative;
	width: 100%;
	padding-top: 56.25%;
	overflow: hidden;
	img {
		position: absolute;
		top: 0;
		left: 0;
		object-fit: cover;
		max-width: initial;
		width: 100%;
		height: 100%;
		z-index: 1;
	}
	a {
		display: block;
		position: absolute;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
	}
}
.img-box a:hover img,
a:hover .img-box img {
	transform: scale(1.05,1.05);
}


/* FADE */

.fade {
	opacity: 0;
	transition: 0.8s linear;
}
.fade.active {
	opacity: 1;
}
.fade-l {
	position: relative;
	opacity: 0;
	transform: translate(-2rem, 0);
	transition: 0.8s ease-out;
}
.fade-l.active {
	opacity: 1;
	transform: translate(0, 0);
}
.fade-r {
	position: relative;
	opacity: 0;
	transform: translate(2rem, 0);
	transition: 0.8s ease-out;
}
.fade-r.active {
	opacity: 1;
	-webkit-transform: translate(0, 0);
	transform: translate(0, 0);
}
.fade-t {
	position: relative;
	opacity: 0;
	transform: translate(0, -2rem);
	transition: 0.8s ease-out;
}
.fade-t.active {
	opacity: 1;
	-webkit-transform: translate(0, 0);
	transform: translate(0, 0);
}
.fade-b {
	position: relative;
	opacity: 0;
	transform: translate(0, 2rem);
	transition: 0.8s ease-out;
}
.fade-b.active {
	opacity: 1;
	-webkit-transform: translate(0, 0);
	transform: translate(0, 0);
}
.fade-w {
	transition: 0.8s ease-out;
	transform: scale(1.1,1.1);
	opacity: 0;
}
.fade-z {
	transition: 0.8s ease-out;
	transform: scale(0.9,0.9);
	opacity: 0;
}
.fade-w.active,
.fade-z.active {
	transform: scale(1,1);
	opacity: 1;
}
.blur {
	transition: 5s ease;
	filter: blur(10rem);
	transform: scale(1.5,1.5);
	opacity: 1;
}
.blur.active {
	filter: blur(0);
	transform: scale(1,1);
	opacity: 1;
}










/* HEADER */

#header {
	position: sticky;
	top: 0;
	display: flex;
	justify-content: space-between;
	align-items: center;
	background-color: var(--color-w);
	width: 100%;
	height: 7rem;
	padding: 1rem 6rem;
	font-size: 1.7rem;
	line-height: 1;
	transition: 0.2s ease;
	z-index: 1000;
	.header-logo {
		width: 22rem;
	}
	ul {
		display: flex;
		align-items: center;
		li {
			white-space: nowrap;
			&:after {
				content: "\30FB";
				margin: 0 1.2rem;
				font-weight: 700;
				line-height: 1;
				color: var(--color-green);
			}
			&:nth-last-of-type(-n+2) {
				&:after {
					display: none;
				}
			}
		}
		.btn {
			margin-left: 4rem;
			a {
				width: 16rem;
				height: 4.8rem;
				padding: 0;
				font-size: 1.6rem;
				&:after {
					display: none;
				}
			}
		}
	}
	&.active {
		box-shadow: 0 0 1rem rgba(0,0,0,0.2);
	}
}










/* CONTENTS */

.aggregation {
	display: block;
	width: 40.4rem;
	height: 5rem;
}

.mv-area {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	background-color: #243427;
	width: 100%;
	height: calc(100vh + 4rem);
	color: var(--color-w);
	z-index: 1;
	overflow: hidden;
	.mv-main {
		position: relative;
		width: 100%;
		padding: 0 7.5rem 4rem 7.5rem;
		font-size: 1.9rem;
		z-index: 2;
		h1 {
			margin-bottom: 0.5rem;
			line-height: 1;
			.aggregation {
				margin-bottom: 3rem;
			}
			strong {
				position: relative;
				display: inline-block;
				bottom: -0.7rem;
				margin: 0 0.2rem 0 0.5rem;
				font-family: var(--font-jp);
				font-size: 15rem;
				font-weight: 700;
				color: var(--color-green);
			}
			em {
				position: relative;
				display: inline-block;
				bottom: -0.7rem;
				font-size: 10rem;
				font-weight: 700;
			}
			.txt1 {
				position: relative;
				display: flex;
				justify-content: center;
				align-items: center;
				width: 40rem;
				font-size: 3.5rem;
				font-weight: 500;
				&:before, &:after {
					content: "";
					position: relative;
					display: block;
					height: 3.5rem;
					border-left: 2px solid var(--color-w);
					margin-bottom: -0.4rem;
				}
				&:before {
					margin-right: 2.2rem;
					transform: rotate(-30deg);
				}
				&:after {
					margin-left: 2.2rem;
					transform: rotate(30deg);
				}
			}
			.txt2 {
				position: relative;
				display: table;
				margin-top: -5rem;
				font-size: 8rem;
				font-weight: 700;
				white-space: nowrap;
				sup {
					position: absolute;
					top: 5.4rem;
					right: 7.7rem;
					font-size: 1.4rem;
					font-weight: 400;
					color: #aaa;
				}
			}
			.txt3 {
				position: relative;
				display: table;
				margin-top: -3.4rem;
				font-size: 8rem;
				font-weight: 700;
				white-space: nowrap;
				sup {
					position: absolute;
					top: 6.1rem;
					right: 6.1rem;
					font-size: 1.4rem;
					font-weight: 400;
					color: #aaa;
				}
				strong {
					bottom: -1.9rem;
				}
			}
			.plus {
				display: inline-block;
				vertical-align: bottom;
				background: url(../img/mv-plus.png) no-repeat center center / 4.2rem;
				width: 0.8em;
				height: 1em;
				margin-right: 0.2em;
				padding-top: 1em;
				overflow: hidden;
			}
			.note {
				display: block;
				width: 57.5rem;
				margin-top: 1.2rem;
				font-size: 1.3rem;
				font-weight: 400;
				text-align: right;
				color: #aaa;
			}
		}
		.btn {
			margin-top: 3.5rem;
		}
	}
	.mv-logo {
		position: absolute;
		top: 3.5rem;
		right: 6rem;
		width: 28rem;
		z-index: 3;
	}
	.mv-point {
		position: absolute;
		right: 6rem;
		bottom: 8rem;
		display: flex;
		gap: 1rem;
		z-index: 3;
		li {
			border-radius: 1rem;
			background: no-repeat center bottom / 15.6rem;
			width: 15.6rem;
			height: 15.6rem;
			box-shadow: 0 0 2rem rgba(0,0,0,0.15);
			strong {
				display: block;
				border-radius: 1rem 1rem 0 0;
				background-color: var(--color-txt);
				width: 100%;
				height: 3.6rem;
				font-size: 1.8rem;
				font-weight: 500;
				line-height: 3.6rem;
				text-align: center;
				color: var(--color-w);
			}
			&:nth-of-type(1) {
				background-image: url(../img/mv-icon_01_pc.png);
			}
			&:nth-of-type(2) {
				background-image: url(../img/mv-icon_02_pc.png);
			}
			&:nth-of-type(3) {
				background-image: url(../img/mv-icon_03_pc.png);
			}
			&:nth-of-type(4) {
				background-image: url(../img/mv-icon_04_pc.png);
			}
		}
	}
	video {
		position: absolute;
		bottom: 0;
		left: 0;
		width: auto;
		height: auto;
		min-width: 106%;
		min-height: 106vh;
		opacity: 0.6;
		z-index: 1;
	}
	@media (aspect-ratio: 16/9), (min-aspect-ratio: 16/9) {
		video {
			width: 106%;
		}
	}
	@media (max-aspect-ratio: 16/9) {
		video {
			height: 106%;
		}
	}
}

.contents {
	position: relative;
	border-radius: 4rem 4rem 0 0;
	background-color: var(--color-w);
	width: 100%;
	margin-top: -4rem;
	padding-top: 1rem;
	overflow: hidden;
	z-index: 2;
	&.active {
		overflow: inherit;
	}
}

.maximize-area {
	position: relative;
	border-radius: 4rem 4rem 0 0;
	background-color: var(--color-bg);
	width: 100%;
	margin-top: 1rem;
	padding: 8rem 0 19rem 0;
	overflow: hidden;
	z-index: 3;
	h2 {
		margin-bottom: 6rem;
		font-feature-settings: "palt" !important;
		font-size: 6rem;
		font-weight: 700;
		line-height: 1.3;
		letter-spacing: 0.03em;
		text-align: center;
		span {
			color: var(--color-green);
		}
		.max {
			display: block;
			margin-bottom: 2rem;
			font-family: var(--font-en);
			font-size: 1.5rem;
			font-weight: 700;
			text-align: center;
			letter-spacing: 0.02em;
		}
		.appeal {
			position: relative;
			display: flex;
			justify-content: center;
			align-items: center;
			margin-bottom: 0.6rem;
			font-size: 3.5rem;
			font-weight: 500;
			letter-spacing: 0;
			color: var(--color-txt);
			&:before, &:after {
				content: "";
				position: relative;
				display: block;
				height: 3.5rem;
				border-left: 2px solid var(--color-txt);
				margin-bottom: -0.4rem;
			}
			&:before {
				margin-right: 2.2rem;
				transform: rotate(-30deg);
			}
			&:after {
				margin-left: 2.2rem;
				transform: rotate(30deg);
			}
		}
	}
	.inner-mid {
		z-index: 2;
	}
	.maximize-profits {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		margin-top: 7rem;
		.read {
			width: calc(100% - 58rem);
			h3 {
				margin-bottom: 2rem;
				font-size: 3.2rem;
				font-weight: 700;
				line-height: 1.3;
				letter-spacing: 0;
				strong {
					font-size: 4.8rem;
					font-weight: 700;
					color: var(--color-green);
				}
			}
			p {
				margin-top: 1.5rem;
			}
			.note {
				margin-top: 0.5rem;
				font-size: 1.4rem;
				color: #666;
			}
		}
		.image {
			border-radius: 2rem;
			width: 52rem;
			font-size: 0;
			overflow: hidden;
			box-shadow: 0 0 2rem rgba(0,0,0,0.15);
		}
		&.rev {
			flex-direction: row-reverse;
		}
	}
	.text {
		animation: aggretext 40s linear infinite;
		position: absolute;
		bottom: -0.5rem;
		left: 0;
		background: url(../img/aggregation-service-txt.png) repeat-x left top / 255rem;
		width: 510rem;
		height: 23rem;
		z-index: 1;
	}
}
@keyframes aggretext {
	0% {
		left: 0;
	}
	100% {
		left: -255rem;
	}
}

.supplement {
	display: table;
	border: 4px solid #e2e3da;
	border-radius: 2rem;
	background-color: var(--color-w);
	margin: 8rem auto 0 auto;
	padding: 3.4rem 6rem 3.8rem 6rem;
	font-size: 2.6rem;
	font-weight: 500;
	text-align: center;
	strong {
		background: linear-gradient(to bottom,  rgba(252,243,136,0) 0%,rgba(252,243,136,0) 70%,rgba(252,243,136,1) 71%,rgba(252,243,136,1) 100%);
		font-weight: 700;
	}
}

.problem-area {
	position: relative;
	border-radius: 4rem 4rem 0 0;
	background-color: var(--color-w);
	width: 100%;
	margin-top: -4rem;
	padding: 8rem 0 30rem 0;
	z-index: 4;
	.problem-list {
		display: flex;
		flex-direction: row-reverse;
		justify-content: space-between;
		align-items: center;
		width: 100%;
		.read {
			width: calc(100% - 26rem);
			dl {
				border-radius: 1rem;
				width: 80rem;
				min-height: 16rem;
				margin: 3rem 0;
				box-shadow: 0 0 2rem rgba(0,0,0,0.1);
				dt {
					position: relative;
					display: flex;
					align-items: center;
					border-radius: 1rem 1rem 0 0;
					background-color: #8ba891;
					width: 100%;
					min-height: 8rem;
					padding: 1.4rem 3.6rem 1.8rem 3.6rem;
					font-size: 2.6rem;
					font-weight: 500;
					color: #fff;
					&:before {
						content: "";
						position: absolute;
						top: 50%;
						left: -2.5rem;
						display: block;
						background: url(../img/problem-ar_01.png) no-repeat right center / cover;
						width: 2.5rem;
						height: 3rem;
						margin-top: -1.5rem;
					}
				}
				dd {
					display: flex;
					align-items: center;
					border-radius: 0 0 1rem 1rem;
					background-color: #fff;
					width: 100%;
					min-height: 8rem;
					padding: 1.4rem 3.6rem 1.8rem 3.6rem;
					font-size: 2rem;
					font-weight: 400;
				}
				&:first-child {
					margin-top: 0;
				}
				&:last-child {
					margin-bottom: 0;
				}
				&:nth-of-type(odd) {
					margin-right: auto;
				}
				&:nth-of-type(even) {
					margin-left: auto;
				}
				&:nth-of-type(2) {
					dt:before {
						background-image: url(../img/problem-ar_02.png);
					}
				}
				&:nth-of-type(3) {
					dt:before {
						background-image: url(../img/problem-ar_03.png);
					}
				}
				&:nth-of-type(4) {
					dt:before {
						background-image: url(../img/problem-ar_04.png);
					}
				}
			}
		}
		.image {
			width: 22rem;
			text-align: center;
			img {
				width: 17rem;
			}
		}
	}
}

.cv-area {
	position: relative;
	display: flex;
	align-items: center;
	border-radius: 4rem;
	background: var(--color-green) url(../img/cv-bg_pc.png) no-repeat center center / cover;
	width: 100%;
	max-width: 111rem;
	height: 40rem;
	margin: -20rem auto;
	padding: 4rem 9rem;
	font-size: 2rem;
	color: var(--color-w);
	z-index: 10;
	.contact {
		position: absolute;
		top: 4.5rem;
		right: 5rem;
		display: inline-block;
		border-bottom: 1px solid var(--color-w);
		padding-bottom: 0.8rem;
		font-family: var(--font-en);
		font-size: 1.5rem;
		font-weight: 700;
		text-align: center;
		line-height: 1;
		letter-spacing: 0.02em;
	}
	p {
		margin-bottom: 1rem;
		strong {
			font-size: 3.4rem;
			font-weight: 700;
		}
	}
	.btn {
		margin-top: 3rem;
	}
}

.features-area {
	position: relative;
	border-radius: 4rem 4rem 0 0;
	background-color: var(--color-bg);
	width: 100%;
	padding: 30rem 0;
	.head1 {
		text-align: left;
		& + p {
			text-align: left;
		}
	}
	.features-list {
		display: flex;
		justify-content: space-between;
		align-items: flex-start;
		border-bottom: 1px solid #d4d6cf;
		width: 100%;
		padding: 3rem 0;
		.num {
			width: 9rem;
			padding: 0.6rem 0;
			font-family: var(--font-en);
			font-size: 2rem;
			font-weight: 700;
			color: var(--color-green);
		}
		.read {
			width: calc(100% - 42.6rem);
			padding: 0.6rem 5rem 0.6rem 0;
			font-size: 1.8rem;
			line-height: 1.65;
			h3 {
				margin-bottom: 1.8rem;
				font-size: 2.8rem;
				font-weight: 700;
				line-height: 1.3;
			}
			p {
				margin-top: 0.6rem;
			}
			.note {
				font-size: 1.4rem;
				color: #666;
			}
		}
		.image {
			border-radius: 1rem;
			width: 33.6rem;
			font-size: 0;
			overflow: hidden;
		}
		&:nth-of-type(1) {
			border-top: 1px solid #d4d6cf;
		}
	}
}

.comparison-area {
	position: relative;
	border-radius: 4rem 4rem 0 0;
	background-color: var(--color-w);
	width: 100%;
	padding: 30rem 0 10rem 0;
	&:before {
		content: "";
		background-color: var(--color-bg);
		position: absolute;
		top: 0;
		left: 0;
		display: block;
		width: 100%;
		height: 4rem;
		z-index: -1;
	}
	.comparison-list {
		width: 100%;
		margin-top: 7rem;
		th {
			position: relative;
			border-bottom: 1px solid #d4d6cf;
			background-color: var(--color-bg);
			width: 18.18%;
			height: 9rem;
			padding: 1.3rem 1rem 1.6rem 1rem;
			font-size: 1.7rem;
			font-weight: 500;
			line-height: 1.3;
			text-align: center;
			vertical-align: middle;
		}
		td {
			position: relative;
			border-bottom: 1px solid #d4d6cf;
			background-color: var(--color-w);
			width: 27.27%;
			height: 9rem;
			padding: 1.3rem 1.5rem 1.6rem 1.5rem;
			font-size: 1.7rem;
			font-weight: 500;
			line-height: 1.3;
			text-align: center;
			vertical-align: middle;
			&.re {
				border-left: 3px solid var(--color-green);
				border-right: 3px solid var(--color-green);
				background-color: #fcfced;
				font-weight: 700;
				color: #1d7701;
				&.btm {
					border-bottom: none;
					&:after {
						content: "";
						position: absolute;
						bottom: -1rem;
						left: -3px;
						display: block;
						border-bottom: 3px solid var(--color-green);
						border-left: 3px solid var(--color-green);
						border-right: 3px solid var(--color-green);
						border-radius: 0 0 1rem 1rem;
						background-color: #fcfced;
						width: calc(100% + 6px);
						height: 1rem;
					}
				}
			}
		}
		.top {
			td {
				width: 18.18%;
			}
			th {
				border-left: 1px solid var(--color-w);
				border-bottom: none;
				background-color: #808080;
				width: 27.27%;
				padding: 2rem 3rem;
				font-weight: 700;
				color: #fff;
				&.re {
					border-left: 3px solid var(--color-green);
					border-right: 3px solid var(--color-green);
					background-color: #d1edb2;
					padding: 1.3rem 3rem 2rem 3rem;
					color: var(--color-green);
					&:before {
						content: "";
						position: absolute;
						top: -1rem;
						left: -3px;
						display: block;
						border-top: 3px solid var(--color-green);
						border-left: 3px solid var(--color-green);
						border-right: 3px solid var(--color-green);
						border-radius: 1rem 1rem 0 0;
						background-color: #d1edb2;
						width: calc(100% + 6px);
						height: 1rem;
					}
				}
			}
		}
	}
	.note {
		margin-top: 2rem;
		font-size: 1.4rem;
		color: #666;
	}
}

.flow-area {
	position: relative;
	border-radius: 4rem 4rem 0 0;
	background-color: var(--color-bg);
	width: 100%;
	padding: 10rem 0 14rem 0;
	z-index: 1;
	.flow-list {
		position: relative;
		display: flex;
		border-bottom: 1px solid #d4d6cf;
		width: 100%;
		max-width: 80rem;
		margin: 0 auto;
		.num {
			position: relative;
			padding: 3.2rem 0;
			width: 3.5rem;
			font-family: var(--font-en);
			font-size: 2rem;
			font-weight: 700;
			color: var(--color-green);
			&:after {
				content: "";
				position: absolute;
				bottom: -1px;
				left: 0;
				display: block;
				border-bottom: 1px solid var(--color-green);
				width: 3.5rem;
			}
		}
		.read {
			width: calc(100% - 3.5rem);
			padding: 3.2rem 0 3.5rem 5.5rem;
			font-size: 1.6rem;
			line-height: 1.65;
			h3 {
				font-size: 2.8rem;
				font-weight: 700;
				line-height: 1.3;
			}
			p {
				margin-top: 1.5rem;
			}
			.btn {
				margin-top: 1.8rem;
				a {
					width: 30rem;
					height: 5rem;
					padding: 0.8rem 2.5rem 1rem 1rem;
					font-size: 1.6rem;
					&:after {
						right: 1.5rem;
					}
					&:hover {
						&:after {
							right: 1.1rem;
						}
					}
				}
			}
		}
		&:nth-of-type(1) {
			border-top: 1px solid #d4d6cf;
			&:after {
				content: "";
				position: absolute;
				top: -1px;
				left: 0;
				display: block;
				border-top: 1px solid var(--color-green);
				width: 3.5rem;
			}
		}
	}
}

.faq-area {
	position: relative;
	border-radius: 4rem 4rem 0 0;
	background-color: var(--color-w);
	width: 100%;
	margin-top: -4rem;
	padding: 10rem 0;
	z-index: 2;
	.faq-list {
		width: 100%;
		max-width: 80rem;
		margin: 0 auto;
		a {
			text-decoration: underline;
			&:hover {
				text-decoration: none;
			}
		}
		dt {
			position: relative;
			border-bottom: 1px solid #d4d6cf;
			margin-bottom: 2.5rem;
			padding: 2.5rem 5.5rem;
			font-size: 2rem;
			font-weight: 700;
			line-height: 1.3;
			cursor: pointer;
			&:before {
				content: "Q";
				position: absolute;
				top: 50%;
				left: 0;
				display: block;
				border-radius: 4rem;
				background-color: var(--color-green);
				width: 4rem;
				height: 4rem;
				margin-top: -2rem;
				font-family: var(--font-en);
				font-size: 2.2rem;
				font-weight: 700;
				line-height: 4rem;
				letter-spacing: 0;
				text-align: center;
				color: var(--color-w);
			}
			&:after {
				content: "";
				position: absolute;
				top: 50%;
				right: 0.5rem;
				display: block;
				background: url(../img/logo-open.png) no-repeat center center / cover;
				width: 1.7rem;
				height: 1.7rem;
				margin-top: -0.8rem;
			}
			&.active {
				text-decoration: underline;
				&:after {
					background-image: url(../img/logo-close.png);
				}
			}
		}
		dd {
			display: none;
			margin-bottom: 2.5rem;
			padding: 0 5.5rem;
			font-size: 1.7rem;
		}
	}
}

.contact-area {
	position: relative;
	border-radius: 4rem 4rem 0 0;
	background: var(--color-green) url(../img/form-bg_pc.png) no-repeat center center / cover;
	padding: 10rem 0 19rem 0;
	color: var(--color-w) !important;
	overflow: hidden;
	.head1, .head1 span {
		color: var(--color-w) !important;
	}
	.inner {
		z-index: 2;
	}
	.form-inner {
		width: 64rem;
		margin: 0 auto;
		dl {
			font-size: 1.8rem;
			line-height: 1.45;
			dt {
				display: flex;
				align-items: center;
				margin-bottom: 1.4rem;
				font-weight: 700;
				.required {
					display: block;
					border-radius: 0.4rem;
					background-color: var(--color-yellow);
					margin-left: 1rem;
					padding: 0 0.5rem;
					font-size: 1.4rem;
					font-weight: 400;
					line-height: 2.1rem;
					color: var(--color-green);
				}
			}
			dd {
				margin-bottom: 3.8rem;
			}
		}
		input[type="text"], input[type="tel"], input[type="url"], input[type="email"], input[type="number"], select {
			border-radius: 0.6rem;
			background-color: var(--color-w);
			width: 100%;
			height: 5.4rem;
			padding: 0.5rem 2rem;
			color: var(--color-txt);
			&:focus {
				background-color: #ffd;
			}
		}
		select {
			background: var(--color-w) url(../img/icon-sekect.png) no-repeat right center / 3.4rem;
			padding-right: 4rem;
		}
		textarea {
			border-radius: 0.6rem;
			background-color: var(--color-w);
			width: 100%;
			height: 20rem;
			padding: 1rem 2rem;
			color: var(--color-txt);
			&:focus {
				background-color: #ffd;
			}
		}
		label {
			position: relative;
			display: inline-block;
			white-space: nowrap;
			margin: 0.3rem 2rem 0.3rem 0;
			font-size: 1.7rem;
			line-height: 1;
			input[type="radio"], input[type="checkbox"] {
				display: none;
				& + span {
					position: relative;
					display: inline-flex;
					align-items: center;
					font-size: 1.7rem;
					line-height: 1.2;
					white-space: nowrap;
					cursor: pointer;
					&:before {
						content: "";
						display: block;
						border-radius: 2.8rem;
						background-color: var(--color-w);
						width: 2.8rem;
						height: 2.8rem;
						margin-right: 1rem;
					}
				}
				&:checked {
					& + span {
						color: var(--color-yellow);
						&:after {
							content: "";
							position: absolute;
							top: 50%;
							left: 0.4rem;
							display: block;
							background: url(../img/icon-check.png) no-repeat center center / 2.6rem;
							width: 2.6rem;
							height: 2rem;
							margin-top: -1.2rem;
						}
					}
				}
			}
			input[type="checkbox"] {
				& + span {
					&:before {
						border-radius: 0.6rem;
					}
				}
			}
		}
		.error {
			background: url(../img/icon-error.png) no-repeat left center / 1.8rem;
			margin-top: 1rem;
			padding-left: 2.4rem;
			font-size: 1.6rem;
			line-height: 1.3;
			color: var(--color-yellow);
		}
		.privacy-box {
			background-color: var(--color-w);
			width: 100%;
			height: 12rem;
			padding: 1.5rem 2rem;
			font-size: 1.4rem;
			line-height: 1.4;
			color: var(--color-txt);
			overflow-y: scroll;
			-webkit-overflow-scrolling: touch;
			h3 {
				margin: 2rem 0 1rem;
				font-size: 1.5rem;
				font-weight: 700;
			}
			h4 {
				margin: 1.5rem 0 1rem;
				font-weight: 500;
			}
			p {
				margin: 1rem 0;
				&:first-child {
					margin-top: 0;
				}
			}
		}
		.privacy {
			margin-top: 5rem;
			text-align: center;
			label {
				margin: 0;
			}
		}
		.btn {
			width: 35rem;
			margin: 5rem auto 0 auto;
		}
	}
}

.completed-head {
	position: absolute;
	top: 0;
	left: 0;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	width: 100%;
	padding: 3rem 6rem;
	.header-logo {
		width: 28rem;
	}
	.bread {
		display: flex;
		font-size: 1.2rem;
		li {
			white-space: nowrap;
			&:after {
				content: "　/　";
			}
			&:last-child {
				&:after {
					display: none;
				}
			}
		}
	}
	z-index: 10;
}
.completed-area {
	position: relative;
	background-color: var(--color-bg);
	padding: 18rem 0 14rem 0;
	font-size: 1.8rem;
	line-height: 1.65;
	z-index: 1;
	h1 {
		margin-bottom: 4rem;
		font-feature-settings: "palt" !important;
		font-size: 3.6rem;
		font-weight: 700;
		line-height: 1.3;
		letter-spacing: 0.05em;
		text-align: center;
	}
	p {
		margin-top: 2.5rem;
		text-align: center;
	}
	a {
		text-decoration: underline;
		&:hover {
			text-decoration: none;
		}
	}
	.completed-btn {
		margin-top: 5rem;
		a {
			position: relative;
			display: inline-flex;
			justify-content: center;
			align-items: center;
			border: 1px solid #d4d6cf;
			border-radius: 7rem;
			width: 35rem;
			height: 7rem;
			margin: 0;
			padding: 0.7rem 2rem 1rem 2rem;
			font-size: 1.7rem;
			font-weight: 500;
			line-height: 1;
			text-decoration: none;
			transition: 0.3s ease;
			&:after {
				content: "";
				display: block;
				position: absolute;
				top: 50%;
				right: 2.2rem;
				background: url(../img/btn-ar2.png) no-repeat center center / cover;
				width: 2.6rem;
				height: 2.6rem;
				margin-top: -1.3rem;
				transition: 0.3s ease;
			}
			&:hover {
				background-color: #d4d6cf;
				&:after {
					right: 1.8rem;
				}
			}
		}
	}
}










/* FOOTER */

#footer {
	position: relative;
	border-radius: 4rem 4rem 0 0;
	background-color: var(--color-w);
	width: 100%;
	margin-top: -4rem;
	padding: 6rem 4rem;
	line-height: 1;
	z-index: 2;
	.logo {
		width: 30rem;
		margin: 0 auto 1.8rem auto;
	}
	.aggre {
		width: 32.4rem;
		margin: 0 auto;
	}
	ul {
		display: flex;
		justify-content: center;
		margin-top: 5rem;
		font-size: 1.3rem;
		li {
			&:after {
				content: "|";
				margin: 0 1rem;
				color: #aaa;
			}
			&:last-child {
				&:after {
					display: none;
				}
			}
			a{
				&:not([class])[target=_blank]{
					&::after {
						content: "　";
						display: inline;
						background: url(../img/blank.svg) bottom right / 1.5rem no-repeat;
						margin: 0 0 0 .4rem;
					}
				}
			}
		}
	}
	.copy {
		margin-top: 2rem;
		font-size: 1.2rem;
		font-family: var(--font-en);
		font-weight: 400;
		text-align: center;
	}
}