@charset "UTF-8";

:root {
	--color-black:#231815;
	--color-white:#ffffff;
	--color-green: #22c795;
	--color-yellow: #f7f23e;
	--color-orange: #ffa228;
	--font-family: "Noto Sans JP", sans-serif;
	--font-family-en: "Outfit", sans-serif;
	--drop-shadow: drop-shadow(3px 3px 3px rgba(0, 0, 0, 0.25));
}
	
/* RESET CSS */

*,*::before,*::after{box-sizing:border-box}*{border:0;margin:0;outline:0;padding:0;font:inherit;font-family:inherit;font-size:100%;font-style:inherit;font-weight:inherit;text-decoration:none;vertical-align:baseline}article,aside,footer,header,main,nav,article,section{display:block}img,picture,audio,canvas,video,svg{display:block;width:100%;height:auto}br,hr{display:block}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}input,select{vertical-align:middle}body{line-height:1;line-break:strict;overflow-wrap:break-word;overflow-wrap:anywhere;word-break:normal;font-feature-settings:"palt";-webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased}a{-webkit-tap-highlight-color:transparent}

/* html format */
html {
	font-size: 62.5%;
}
@media screen and (max-width: 1120px) {
	html {
		font-size: 0.9vw;
	}
}
@media screen and (max-width: 750px) {
	html {
		font-size: 2.4vw;
	}
}
body {
	background-color: #fff;
	color: #231815;
	color: var(--color-dark);
	font-family: "Noto Sans JP", 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', 'Meiryo', 'メイリオ', 'Helvetica', sans-serif;
	font-weight: 700;
	font-style: normal;
	font-size: 16px;
	font-size: 1.6rem;
	position: relative;
	text-align: center;
	width: 100%;
}
a,
a:link,
a:visited,
a:hover,
a:active {
	color: inherit;
	-webkit-tap-highlight-color: transparent rgba(0, 0, 0, 0);
	text-decoration: none;
	-webkit-text-decoration-skip: objects;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	display: block;
	line-height: 1.3;
}
b {
	font-weight: bold;
}
i {
	font-style: normal;
}
u {
	text-decoration: underline;
}
em {
	font-weight: bold;
}
strong {
	font-weight: bold;
	font-size: 1.4em;
}
mark {
	background: transparent;
}
q {}
q:before,
q:after {
	content: '"';
}
s {
	text-decoration: underline;
}
del {
	text-decoration: line-through;
}
ins {}
iframe {}
ruby {}
rt {
	font-size: 0.5em;
}
sup {
	vertical-align: super;
	font-size: smaller;
}
sub {
	vertical-align: sub;
	font-size: smaller;
}
details {
	margin: 0 0 40px 0;
}
hr {
	margin: 0 0 40px 0;
	border: 0;
	border-top: 1px solid #DEE2DF;
	border-color: var(--color-border);
	height: 0;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
	empty-cells: show;
	border: 0;
	width: 100%;
	margin: 0 0 2em 0;
	border-top: 1px solid #DEE2DF;
	border-color: var(--color-border);
}
table th,
table td {
	padding: 1.5em 1em;
	vertical-align: top;
	border-bottom: 1px solid;
	border-color: var(--color-border);
}
table caption {
	text-align: left;
	padding: 8px;
}


/* テンプレート */

.image-wrapper{
	height: fit-content;
	width: 100%;
	display: block;
	line-height: 1;
}
.image-wrapper img {
	width: 100%;
	height: auto;
	line-height: 0;
}
.wrapper {
	position: relative;
	z-index: 2;
	min-height:100vh;
}
@media screen and (min-width: 1280px) {
	.wrapper {
		margin: 0 0 0;
		position: relative;
		line-height: 1.5;
	}
}

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

.site-main {
	padding: 0;
	line-height: 1.6;
	text-align: center;
	margin: 0;
	-webkit-hyphens: auto;
	-moz-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
}
.section {
	position: relative;
	display: block;
	padding: 9rem 0;
	margin: 0;
}
@media screen and (max-width: 750px) {
	.section {
		padding: 4rem 0;
	}
}
.inner {
	clear: both;
	display: block;
	margin: 0 auto;
	position: relative;
	max-width: 1120px;
	width: 100%;
	padding: 0 60px;
}
@media (max-width:750px) {
	.inner {
		padding: 0 5%;
	}
}






.line a,
.mail a,
.tel a {
	padding: 0.8em 2.5em;
	border-radius: 999px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	color: var(--color-white);
	font-size: 1.5rem;
	white-space: nowrap;
	filter: var(--drop-shadow);
	font-weight: 800;
}
.line a::before,
.mail a::before,
.tel a::before {
	content: "";
	display: block;
	width: 1.5em;
	height: 1.5em;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	position: relative;
}
.line a {
	background-color: #06c755;
}
.line a::before {
	background-image: url("images/icon-line.svg");
	top: 0.07em;
}
.mail a {
	background-color: var(--color-green);
}
.mail a::before {
	background-image: url("images/icon-mail.svg");
	top: 0.07em;
}
.tel a {
	background-color: var(--color-orange);
	font-size: 2.4rem;
	padding: 0.3em 1.5em;
	font-family: var(--font-family-en);
	font-weight: 500;
	line-height: 1;
}
.tel a::before {
	background-image: url("images/icon-tel.svg");
	top: 0.07em;
}
.tel a .small {
	display: block;
	font-size: 0.5em;
	font-family: var(--font-family);
}


.section-title {
	font-size: 4.8rem;
	font-weight: 800;
	letter-spacing: 0.1em;
}
.section-title i {
	display: block;
	font-family: var(--font-family-en);
	text-transform: uppercase;
	letter-spacing: 0.2em;
	color: var(--color-green);
	font-size: 0.6em;
	margin-bottom: 1rem;
}
@media screen and (max-width: 750px) {
	.section-title {
		font-size: 3.6rem;
	}
	.section-title i {
		margin-bottom: 0;
	}
}





/* ////////////////////////// */
#header {
	background-color: var(--color-white);
	height: fit-content;
	padding: 20px 5%;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
#header .site-title a {
	width: 240px;
	height: 56px;
}
#header .site-description {
	display: none;
}
#header .site-title a {
	width: 240px;
	height: 56px;
	display: block;
}
#header .header-utility ul {
	display: flex;
	column-gap: 1em;
}
@media screen and (max-width: 750px) {
	#header{
		justify-content: center;
		padding: 12px 5%;
	}
	#header .site-title a{
		height: 50px;
		width: 180px;
	}
	#header .header-utility {
		position: fixed;
		bottom: 0;
		left: 0;
		z-index: 999;
		width: 100%;
	}
	#header .header-utility ul{
		column-gap: 0;
		align-items: stretch;
		z-index: -1;
	}
	#header .header-utility ul li {
		outline: 2px solid var(--color-white);
		outline-offset: -1px;
		z-index: 1;
	}
	#header .header-utility .line {
		width: 25%;
	}
	#header .header-utility .mail {
		width: 25%;
	}
	#header .header-utility .tel {
		width: 50%;
	}
	#header .header-utility .line a, 
	#header .header-utility .mail a, 
	#header .header-utility .tel a {
		padding: 0.8em 0;
		border-radius: 0;
		height: 100%;
	}
	#header .header-utility .line a, 
	#header .header-utility .mail a {
		display: block;
	} 
	#header .header-utility .line a::before, 
	#header .header-utility .mail a::before {
		margin: 0 auto 0.5rem auto;
		height: 1.5em;
	} 
	#header .header-utility .tel a {
		font-size: 2.2rem;
		column-gap: 0.5rem;
	}
	#header .header-utility .tel a::before {
		width: 1.2em;
		height: 1.2em;
	}
}



.section-top-hero {
	background-image: repeating-linear-gradient(
		45deg,
		rgba(247, 242, 62, 0.3) 0px,
		rgba(247, 242, 62, 0.3) 10px,
		rgba(254, 254, 237, 0.3) 10px,
		rgba(254, 254, 237, 0.3) 20px
		);
	overflow: hidden;
	padding: 0;
}
.section-top-hero h2 {
	padding-top: 5rem;
	padding-bottom: 10rem;
	position: relative;
	z-index: 1;
	width: 100%;
}
.section-top-hero h2 img {
	width: 80%;
}
.section-top-hero h2::after {
	content: "";
	position: absolute;
	bottom: 0;
	right: -5%;
	display: block;
	width: 45%;
	aspect-ratio: 475 / 393;
	height: auto;
	background-image: url("images/top-hero-background.webp");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	z-index: -1;
}
.section-top-hero .content {
	background-color: var(--color-green);
	position: relative;
	z-index: 1;
}
.section-top-hero .content::before,
.section-top-hero .content::after {
	background-color: var(--color-green);
	content: "";
	position: absolute;
	top: 0;
	left: 99%;
	width: 100vw;
	height: 100%;
	display: block;
	z-index: -1;
}
.section-top-hero .content::after {
	right: 99%;
	left: auto;
}
.section-top-hero .content {
	position: relative;
	display: flex;
	align-items: flex-end;
	justify-content: space-between;
	padding-bottom: 5rem;
}
.section-top-hero .content .point {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	column-gap: 1rem;
	position: absolute;
	top: 0;
	left: 0;
	transform: translateY(-50%);
}
.section-top-hero .content .point  li {
	flex-basis: 15rem;
	filter: var(--drop-shadow);
}
.section-top-hero .content .pay {
	flex-basis: 50%;
	margin-top: 11rem;
}
.section-top-hero .card {
	display: flex;
	white-space: nowrap;
	color: var(--color-white);
	border: 2px solid var(--color-black);
	border-radius: 0.3em;
	margin-top: 1rem;
	background-color: var(--color-white);
}
.section-top-hero .card span {
	background-color: var(--color-black);
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 2em;
}
.section-top-hero .card .image-wrapper {
	padding: 0.3em 1.5em;
}
.section-top-hero .contact {
	flex-basis: 45%;
}
.section-top-hero .contact .tel {
	position: relative;
}
.section-top-hero .contact .tel .image-wrapper {
	position: absolute;
	width: 80%;
	height: auto;
	bottom: calc(100% + 1rem);
	left: 10%;
	filter: brightness(0) invert(1);
}
.section-top-hero .contact .tel a {
	font-size: 4rem;
	padding-left: 1em;
	padding-right: 1em;
	border: 2px solid var(--color-white);
}
.section-top-hero .contact .tel a::before {
	width: 4.5rem;
    height: 4.5rem;
}
.section-top-hero .contact .message {
	display: flex;
	justify-content: space-between;
	margin-top: 1rem;
}
.section-top-hero .contact .message .line,
.section-top-hero .contact .message .mail {
	flex-basis: 49%;
}
.section-top-hero .contact .message .line a,
.section-top-hero .contact .message .mail a {
	border: 2px solid var(--color-white);
	font-size: 2.2rem;
	padding: 0.4em;
}
.section-top-hero .belt {
	width: 100%;
	background-color: var(--color-yellow);
	color: var(--color-green);
	letter-spacing: 0.1em;
	font-size: 2.8rem;
	font-weight: 800;
	padding: 0.4em 0;
	position: relative;
}
.section-top-hero .belt::before,
.section-top-hero .belt::after {
	content: "";
	position: absolute;
	top: 0;
	left: 100%;
	display: block;
	width: 100vw;
	height: 100%;
	background-color: var(--color-yellow);
}
.section-top-hero .belt::after {
	right: 100%;
	left: auto;
}
.section-top-hero .belt::after {
	right: 100%;
	left: auto;
}
@media screen and (max-width: 750px) {
	.section-top-hero h2{
		padding-top: 3rem;
		padding-bottom: 20rem;
	}
	.section-top-hero h2 img{
		width: 95%;
		margin: 0 auto;
	}
	.section-top-hero h2::after{
		width: 70%;
		right: 50%;
		transform: translateX(50%);
	}
	.section-top-hero .content{
		display: block;
	}
	.section-top-hero .content .pay{
		margin-top: 0;
		padding-top: 8rem;
	}
	.section-top-hero .contact{
		margin-top: 6rem;
	}
	.section-top-hero .contact .tel a{
		font-size: 3.5rem;
	}
	.section-top-hero .contact .tel a::before{
		width: 3.5rem;
		height: 3.5rem;
	}
	.section-top-hero .contact .message .line a, 
	.section-top-hero .contact .message .mail a {
		font-size: 1.9rem;
	}
	.section-top-hero .belt{
		letter-spacing: 0em;
		font-size: 1.6rem;
	}
}


.section-top-trouble {
	background-color: var(--color-green);
	position: relative;
	margin-bottom: 7vw;
	padding-top: 7rem;
	padding-bottom: 0;
}
.section-top-trouble::after {
	content: "";
	position: absolute;
	left: 0;
	top: calc(100% - 1px);
	display: block;
	background-image: url("images/top-trouble-decoration.svg");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	width: 100%;
	aspect-ratio: 1400 / 94;
}
.section-top-trouble .bubble {
	width: 75%;
	margin: 0 auto;
}
.section-top-trouble .content {
	width: fit-content;
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;

}
.section-top-trouble .content .illust {
	flex-basis: 30%;
}
.section-top-trouble .content ul {
	flex-basis: 60%;
	margin-top: 3rem;
}
.section-top-trouble .content ul li {
	margin-bottom: 1.5rem;
	color: var(--color-white);
	font-size: 2rem;
	text-align: left;
	position: relative;
	padding-left: 2.2em;
}
.section-top-trouble .content ul li::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	display: block;
	width: 1.3em;
	height: 1.3em;
	background-image: url("images/top-trouble-check.svg");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}
.section-top-trouble .content ul li .color-yellow {
	color: var(--color-yellow);
}
@media screen and (max-width: 750px) {
	.section-top-trouble {
		padding-top: 3.5rem;
	}
	.section-top-trouble .bubble{
		width: 100%;
	}
	.section-top-trouble .content{
		display: block;
	}
	.section-top-trouble .content .illust{
		width: 40%;
		margin: 0 auto;
	}
	.section-top-trouble .content ul{
		width: fit-content;
		margin: 2rem auto 0 auto;
	}
	.section-top-trouble .content ul li{
		font-size: 1.6rem;
		margin-bottom: 1rem;
	}
}

.section-top-collect h3 {
	width: 80%;
	margin: 0 auto;
}
.section-top-collect .content {
	margin-top: 5rem;
}
.section-top-collect .content ul {
	display: flex;
	justify-content: space-between;
	row-gap: 2rem;
	column-gap: 1.5rem;
}
.section-top-collect .content ul li {
	border-top: 1rem solid var(--color-green);
	outline: 1px solid var(--color-black);
	padding: 2rem 0;
	filter: var(--drop-shadow);
	background-color: var(--color-white);
}
.section-top-collect .content ul li .text {
	font-size: 1.8rem;
	line-height: 1.2;
	height: 2.6em;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-bottom: 1rem;
}
.section-top-collect .content ul li .icon {
	width: 80%;
	margin: 0 auto;
}
@media screen and (max-width: 750px) {
	.section-top-collect h3 {
		width: 95%;
	}
	.section-top-collect .content ul{
		row-gap: 1rem;
		column-gap: 2%;
		flex-wrap: wrap;
		width: 85%;
        margin: 0 auto;
	}
	.section-top-collect .content ul li{
		flex-basis: 32%;
	}
}

.section-top-appeal {
	background-image: repeating-linear-gradient(45deg, rgba(247, 242, 62, 0.3) 0px, rgba(247, 242, 62, 0.3) 10px, rgba(254, 254, 237, 0.3) 10px, rgba(254, 254, 237, 0.3) 20px);
	padding-top: 4rem;
	overflow: hidden;
	padding-bottom: 4rem;
}

.section-top-appeal .inner::after {
	content: "";
	position: absolute;
	top: 5%;
	right: -10%;
	display: block;
	width: 25%;
	aspect-ratio: 285 / 266;
	background-image: url("images/top-appeal-decoration.webp");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}
.section-top-appeal .belt {
	width: 100%;
    background-color: var(--color-green);
    color: var(--color-white);
    letter-spacing: 0.1em;
    font-size: 2.8rem;
    font-weight: 800;
    padding: 0.2em 0;
    position: relative;
	margin-bottom: 5rem;
}
.section-top-appeal .belt::before,
.section-top-appeal .belt::after {
    content: "";
    position: absolute;
    top: 0;
    left: 100%;
    display: block;
    width: 100vw;
    height: 100%;
    background-color: var(--color-green);
}
.section-top-appeal .belt::after {
	left: auto;
	right: 100%;
}
.section-top-appeal h3 {
	width: 80%;
	margin: 0 auto 6rem auto;
}
.section-top-appeal .content {
	display: flex;
	justify-content: space-between;
	flex-direction: row-reverse;
}
.section-top-appeal .content .contact {
	flex-basis: 47%;
}
.section-top-appeal .content .point {
	flex-basis: 47%;
}
.section-top-appeal .content .contact .tel {
	position: relative;
}
.section-top-appeal .content .contact .tel .image-wrapper {
	position: absolute;
	width: 80%;
	height: auto;
	bottom: calc(100% + 0.5rem);
	left: 10%;
}
.section-top-appeal .content .contact .tel a {
	font-size: 4rem;
	padding-left: 1em;
	padding-right: 1em;
	border: 2px solid var(--color-white);
}
.section-top-appeal .content .contact .tel a::before {
	width: 4.5rem;
    height: 4.5rem;
}
.section-top-appeal .content .contact .message {
	display: flex;
	justify-content: space-between;
	margin-top: 1rem;
}
.section-top-appeal .content .contact .message .line,
.section-top-appeal .content .contact .message .mail {
	flex-basis: 49%;
}
.section-top-appeal .content .contact .message .line a,
.section-top-appeal .content .contact .message .mail a {
	border: 2px solid var(--color-white);
	font-size: 2.2rem;
	padding: 0.4em;
}
.section-top-appeal .content .point {
	display: flex;
	align-items: center;
	justify-content: flex-start;
	column-gap: 1rem;
}
.section-top-appeal .content .point  li {
	filter: var(--drop-shadow);
}
@media screen and (max-width: 750px) {
	.section-top-appeal .inner{
		z-index: 1;
	}
	.section-top-appeal .inner::after{
		background-image: url(images/top-appeal-decoration-sp.webp);
		width: 90%;
		right: 5%;
		top: 12%;
		z-index: -1;
	}
	.section-top-appeal h3{
		width: 95%;
		margin: 0 auto 2.5rem auto;
	}
	.section-top-appeal .belt{
		letter-spacing: 0em;
		font-size: 1.9rem;
		margin-bottom: 2.5rem;
	}
	.section-top-appeal .content{
		display: block;
	}
	.section-top-appeal .content .contact{
		margin-top: 6rem;
	}
	.section-top-appeal .content .contact .tel a{
        font-size: 3.5rem;
	}
	.section-top-appeal .content .contact .tel a::before{
		width: 3.5rem;
        height: 3.5rem;
	}
	.section-top-appeal .content .contact .message .line a, 
	.section-top-appeal .content .contact .message .mail a {
		font-size: 1.9rem;
	}
	.section-top-appeal .content .point{
		width: 85%;
    	margin: 0 auto;
	}
}


.section-top-price {
	background-color: #d7f2db;
}
.section-top-price .section-description {
	font-size: 2rem;
	margin-top: 5rem;
}
.section-top-price ul {
	display: flex;
	column-gap: 1.5rem;
	margin-top: 12rem;
	margin-bottom: 5rem;
}
.section-top-price ul li {
	position: relative
}
.section-top-price ul li .pack {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 60%;
	filter: var(--drop-shadow);
}
@media screen and (max-width: 750px) {
	.section-top-price .section-description {
		font-size: 1.6rem;
		line-height: 1.8;
	}
	.section-top-price ul {
		column-gap: 2%;
		row-gap: 7rem;
		flex-wrap: wrap;
		margin-top: 7rem;
		margin-bottom: 3rem;
	}
	.section-top-price ul li {
		width: 48%;
	}
}


.section-top-account {
	background-image: url("images/top-account-background.webp");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}
.section-top-account h3 {
	width: 60%;
	margin: 0 auto;
}
.section-top-account .section-description {
	color: var(--color-white);
	margin-top: 3rem;
	font-size: 2rem;
	line-height: 1.8;
	letter-spacing: 0.1em;
}
.section-top-account .price {
	display: flex;
	align-items: center;
	justify-content: space-between;
	max-width: 700px;
	margin: 5rem auto 0 auto;
}
.section-top-account .price .box {
	flex-basis: 26%;
}
.section-top-account .price .plus {
	flex-basis: 5%;
}
@media screen and (max-width: 750px) {
	.section-top-account h3 {
		width: 85%;
	}
	.section-top-account .section-description{
		font-size: 1.5rem;
	}
	.section-top-account .price{
		display: block;
		margin: 3rem auto 0 auto;
	}
	.section-top-account .price .box{
		width: 85%;
		margin: 0 auto;
	}
	.section-top-account .price .plus{
		width: 5%;
    	margin: 1rem auto;
	}
}


.section-top-comparison {
	background-color: var(--color-green);
	overflow: hidden;
}
.section-top-comparison .inner::after {
	content: "";
	position: absolute;
	bottom: 0;
	right: 0;
	transform: translateX(50%);
	display: block;
	width: 30%;
	aspect-ratio: 275 / 367;
	background-image: url("images/top-comparison-decoration.webp");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}
.section-top-comparison .section-title {
	color: var(--color-white);
}
.section-top-comparison .section-title i {
	color: #d7f2db;
}
.section-top-comparison .table {
	max-width: 900px;
	margin: 5rem auto 0 auto;
}
@media screen and (max-width: 1280px) {
	.section-top-comparison .inner {
		padding-bottom: 37rem;
	}
	.section-top-comparison .inner::after {
		right: 50%;
		width: 30%;
	}
}
@media screen and (max-width: 750px) {
	.section-top-comparison .inner {
		padding-bottom: 25rem;
	}
	.section-top-comparison .inner::after {
		width: 50%;
	}
}


.section-top-reason .section-title .large {
	font-size: 1.4em;
	font-family: var(--font-family-en);
}
.section-top-reason ol {
	display: flex;
	justify-content: space-between;
	margin-top: 7rem;
}
.section-top-reason ol li {
	flex-basis: 32%;
	padding: 4rem 2rem 2rem 2rem;
	border: 1px solid var(--color-black);
	position: relative;
	box-shadow: 3px 3px 8px 0px rgba(0, 0, 0, 0.25);
	background-color: var(--color-white);
}
.section-top-reason ol li .caption {
	position: absolute;
	top: 0;
	left: 0;
	transform: translate(-10%, -50%);
	width: 40%;
	aspect-ratio: 140 / 70;
	filter: none;
}
.section-top-reason ol li h4 {
	color: var(--color-green);
	font-size: 2.4rem;
	margin-bottom: 2rem;
}
.section-top-reason ol li p {
	margin-top: 2rem;
	font-weight: 400;
	text-align: justify;
}
@media screen and (max-width: 750px) {
	.section-top-reason .section-title {
		font-size: 2.8rem;
	}
	.section-top-reason ol{
		display: block;
	}
	.section-top-reason ol li {
		margin-bottom: 6rem;
	}
	.section-top-reason ol li:last-child {
		margin-bottom: 0;
	}
	.section-top-reason ol li .caption{
		width: 30%;
		transform: translate(-5%, -50%);
	}
	.section-top-reason ol li h4{
		font-size: 2rem;
	}
	.section-top-reason ol li .thumbnail {
		width: 80%;
		margin: 0 auto;
	}
}


.section-top-voice {
	background-color: var(--color-green);
}
.section-top-voice .section-title {
	color: var(--color-white);
	margin-bottom: 5rem;
}
.section-top-voice .section-title i {
	color: #d7f2db;
}
.section-top-voice .box {
	border: 1px solid var(--color-white);
	padding: 4rem;
	position: relative;
	display: flex;
	justify-content: space-between;
	max-width: 860px;
	margin: 4rem auto;
}
.section-top-voice .box:last-child{
	margin-bottom: 0;
}
.section-top-voice .box::after {
	content: "";
	position: absolute;
	top: 0;
	right: 5rem;
	transform: translateY(-50%);
	display: block;
	width: 5rem;
	aspect-ratio: 106 / 75;
	background-image: url("images/top-voice-decoration.svg");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
}
.section-top-voice .box .picture {
	flex-basis: 30%;
}
.section-top-voice .box .content {
	flex-basis: 65%;
}
.section-top-voice .box .content .caption {
	background-color: var(--color-black);
	padding: 0.3em 2em;
	color: var(--color-white);
	display: block;
	width: fit-content;
	margin-bottom: 2rem;
	font-size: 1.4rem;
}
.section-top-voice .box .content h4 {
	font-size: 2.8rem;
	text-align: left;
	color: var(--color-white);
	margin-bottom: 2rem;
}
.section-top-voice .box .content h4 .color-yellow {
	color: var(--color-yellow);
}
.section-top-voice .box .content p {
	color: var(--color-white);
	text-align: left;
	font-weight: 400;
	font-size: 1.8rem;
}
.section-top-voice .box .picture {
	text-align: left;
	position: relative;
}
.section-top-voice .box .picture .name {
	position: absolute;
	bottom: -2em;
	left: -3em;
}
.section-top-voice .box .picture .name .name-wrapper {
	background-color: var(--color-white);
	color: var(--color-green);
	padding: 0.1em 0.5em;
	line-height: 1.8;
}
@media screen and (max-width: 750px) {
	.section-top-voice .box{
		display: block;
		padding: 3rem;
	}
	.section-top-voice .box::after {
		right: 3rem;
		width: 4rem;
	}
	.section-top-voice .box .picture{
		width: 70%;
    	margin: 0 auto 6rem auto;
	}
	.section-top-voice .box .content .caption{
		font-size: 1.6rem;
		padding: 0.1em 1em;
		margin-bottom: 1rem;
	}
	.section-top-voice .box .content h4{
		font-size: 2.2rem;
	}
}


.section-top-flow {
	background-color: #d7f2db;
}
.section-top-flow .section-title .large {
	font-size: 1.4em;
}
.section-top-flow .section-title .alphabet {
	font-family: var(--font-family-en);
}
.section-top-flow .section-title .small {
	font-size: 0.75em;
	display: block;
	line-height: 1;
	margin-bottom: 1rem;
}
.section-top-flow ol {
	max-width: 900px;
	margin: 5rem auto 0 auto;
}
.section-top-flow ol li {
	display: flex;
	flex-wrap: wrap;
	padding: 3rem;
	border: 2px solid var(--color-green);
	border-left: 1.5rem solid var(--color-green);
	border-radius: 1em;
	margin-bottom: 1.5rem;
	background-color: var(--color-white);
}
.section-top-flow ol li:last-child {
	border: 2px solid var(--color-orange);
	border-left: 1.5rem solid var(--color-orange);
	margin-bottom: 0;
}
.section-top-flow ol li h4 {
	font-size: 2.8rem;
	font-weight: 800;
	white-space: nowrap;
	text-align: left;
	padding-left: 3em;
	width: 11.5em;
	position: relative;
}
.section-top-flow ol li h4::before {
	content: "";
	position: absolute;
	top: 50%;
	left: 0;
	transform: translateY(-50%);
	display: block;
	width: 2em;
	height: 2em;
	background-color: var(--color-green);
	background-repeat: no-repeat;
	background-size: 50%;
	background-position: center;
	border-radius: 50%;
}
.section-top-flow ol li:nth-child(1) h4::before {
	background-image: url("images/top-flow-01.svg");
}
.section-top-flow ol li:nth-child(2) h4::before {
	background-image: url("images/top-flow-02.svg");
	background-size: 70%;
}
.section-top-flow ol li:nth-child(3) h4::before {
	background-image: url("images/top-flow-03.svg");
}
.section-top-flow ol li:nth-child(4) h4::before {
	background-image: url("images/top-flow-04.svg");
	background-color: var(--color-orange);
}
.section-top-flow ol li h4 i {
	font-size: 0.5em;
	display: block;
	text-transform: uppercase;
	color: var(--color-green);
}
.section-top-flow ol li:last-child h4 i {
	color: var(--color-orange);
}
.section-top-flow ol li p {
	text-align: left;
	font-weight: 400;
}
.section-top-flow ol li .pay {
	width: 100%;
	background-color: #fff7ed;
	border-radius: 0.5em;
	padding: 1.5rem;
	text-align: center;
	margin-top: 2rem;
}
.section-top-flow ol li .pay p {
	text-align: center;
}
.section-top-flow ol li .pay .image-wrapper {
	max-width: 290px;
	margin: 0.5rem auto 0 auto;
}
@media screen and (max-width: 750px) {
	.section-top-flow ol li {
		border-left-width: 2px;
		border-top-width: 1.5rem;
		display: block;
	}
	.section-top-flow ol li:last-child{
		padding-bottom: 2rem;
		border-left-width: 2px;
		border-top-width: 1.5rem;
	}
	.section-top-flow ol li h4{
		font-size: 2.2rem;
		margin-bottom: 2rem;
	}
	.section-top-flow ol li .pay p {
		font-size: 1.4rem;
		font-weight: 800;
	}
}

.section-top-area .image-wrapper {
	max-width: 760px;
	margin: 5rem auto 0 auto;
}
@media screen and (max-width: 750px) {
	.section-top-area .inner {
		padding: 0;
	}
}


.section-top-faq {
	background-color: var(--color-green);
}
.section-top-faq .section-title {
	color: var(--color-white);
}
.section-top-faq .section-title i {
	color: var(--color-white);
}
.section-top-faq .faq-list {
	margin-top: 5rem;
	text-align: left;
}
.section-top-faq dl {
	margin-bottom: 1.5rem;
	overflow: hidden;
	border-radius: 1rem;
	cursor: pointer;
	filter: var(--drop-shadow);
}
.section-top-faq dl dt {
	color: var(--color-green);
	background-color: #d7f2db;
	font-size: 2.2rem;
	padding: 0.5em 7rem;
	position: relative;
}
.section-top-faq dl dt::before {
	content: "Q";
	font-size: 1.5em;
	font-family: var(--font-family-en);
	position: absolute;
	top: 50%;
	left: 2rem;
	display: block;
	transform: translateY(-50%);
}
.section-top-faq dl dt::after {
	content: "";
	position: absolute;
	top: 50%;
	right: 2rem;
	display: block;
	background-image: url("images/top-faq-arrow.svg");
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center;
	width: 1.25em;
	height: 1.25em;
	transition: 0.7s;
	transform: translateY(-50%);
}
.section-top-faq dl.accordion-active dt::after {
	transform: rotate(180deg);
}
.section-top-faq dl dd {
	padding: 1em 7rem;
	font-weight: 400;
	position: relative;
	background-color: var(--color-white);
}
.section-top-faq dl dd::before {
	content: "A";
	font-size: 2.2em;
	font-family: var(--font-family-en);
	position: absolute;
	top: 0.06em;
	left: 2rem;
	display: block;
}
@media screen and (max-width: 750px) {
	.section-top-faq dl dt {
		font-size: 1.8rem;
		padding: 0.5em 5rem 0.5em 6rem;
	}
	.section-top-faq dl dt::after{
		width: 1em;
		height: 1em;
		right: 1.5rem;
	}
	.section-top-faq dl dd {
		font-weight: 500;
	}
}


/* コンタクトフォーム */
.section-top-contact {
	background-color: #f0f0f0;
}
.section-top-contact .content {
	margin-top: 5rem;
}
.section-top-contact .content .section-description {
	font-size: 1.8rem;
	letter-spacing: 0.1em;
}
.section-top-contact form {
	max-width: 850px;
	margin: 5rem auto 0 auto;
}


#section-top-contact form table {
	border: none;
}
#section-top-contact form td,
#section-top-contact form th {
	padding: 0;
	padding-bottom: 1rem;
	padding-top: 1rem;
}
#section-top-contact form th {
	font-size: 2rem;
	border: none;
	width: 13em;
	white-space: nowrap;
	text-align: left;
	vertical-align: middle;
}
#section-top-contact form th.position-top {
	vertical-align: top;
}
#section-top-contact form th b,
#section-top-contact form th em {
	font-size: 1.6rem;
	background-color: var(--color-orange);
	padding: 0.1em 0.5em;
	display: inline-block;
	margin-right: 1.5rem;
	color: var(--color-white);
	white-space: nowrap;
}
#section-top-contact form th em {
	background-color: #969696;
}
#section-top-contact form td {
	border: none;
	padding-left: 5rem;
	width: calc(100% - 15em);
	vertical-align: middle;
}
#section-top-contact form input {
	font-size: 2rem;
	padding: 1rem 2rem;
	border-radius: 0.5rem;
	width: 100%;
	border: 1px solid #323232;
	background-color: #f5f5f5;
}
#section-top-contact form input::placeholder {
	color: #b4b4b4;
}
#section-top-contact form textarea {
	font-size: 2rem;
	padding: 1rem 2rem;
	border-radius: 0.5rem;
	width: 100%;
	min-height: 6em;
	border: 1px solid #323232;
	background-color: #f5f5f5;
	resize: vertical;
}
#section-top-contact form textarea::placeholder {
	color: #b4b4b4;
}
#section-top-contact .submit {
	position: relative;
	width: fit-content;
	margin: 3rem auto 0 auto;
}
#section-top-contact .submit input {
	background-color: var(--color-green);
	border-radius: 999px;
	text-align: center;
	display: block;
	padding: 0.75em;
	font-size: 2.4rem;
	color: var(--color-white);
	filter: var(--drop-shadow);
	width: 400px;
	letter-spacing: 0.1em;
	cursor: pointer;
	border: none;
	transition: 0.3s;
}
#section-top-contact .submit input:disabled {
	background-color: #969696;
}


#section-top-contact .privacy-text {
	height: 150px;
	overflow-y: scroll;
	padding: 0 3rem;
	background-color: #f5f5f5;
	border: 1px solid #323232;
	border-radius: 0.5rem;
}
#section-top-contact .privacy-text .title {
	font-size: 1.8rem;
	margin: 2rem auto;
	display: block;
}
#section-top-contact .privacy-text dt {
	text-align: left;
	font-weight: 800;
	margin-bottom: 0.5rem;
}
#section-top-contact .privacy-text dd {
	text-align: left;
	font-weight: 400;
	margin-bottom: 2rem;
}

#section-top-contact .privacy {
	margin-top: 3rem;
}
#section-top-contact .privacy label {
	cursor: pointer;
	width: fit-content;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: center;
	position: relative;
	font-size: 2.2rem;
	padding-left: 1.5em;
}
#section-top-contact .privacy label::before {
	border: 1px solid var(--color-black);
	display: block;
	content: "";
	width: 1em;
	height: 1em;
	position: absolute;
	left: 0;
	top: 0.4em;
}
#section-top-contact .privacy label::after {
	border-right: 3px solid var(--color-green);
	border-bottom: 3px solid var(--color-green);
	display: block;
	content: "";
	width: 1.2rem;
	height: 1.5em;
	position: absolute;
	top: -0.2em;
	left: 0.55em;
	opacity: 0;
	transform: rotate(45deg);
}
#section-top-contact .privacy input[type=checkbox]:checked+label::after {
	opacity: 1;
}
#section-top-contact .privacy input {
	display: none;
}
@media screen and (max-width: 750px) {
	.section-top-contact .content .section-description {
		font-size: 1.6rem;
	}
	#section-top-contact form td,
	#section-top-contact form th {
		display: block;
	}
	#section-top-contact form th {
		font-size: 1.8rem;
	}
	#section-top-contact form td {
		padding-left: 0;
		width: 100%;
		padding-top: 0;
		padding-bottom: 2.5rem;
		font-size: 1.6rem;
	}
	#section-top-contact .submit{
		width: 80%;
		margin: 3rem auto 0 auto;
	}
	#section-top-contact .submit input {
		width: 100%;
		font-size: 2rem;
	}
}












.section-contact-content {
	padding-top: 7rem;
	padding-bottom: 7rem;
	min-height: 80vh;
}
.section-contact-content h3 {
	margin-bottom: 3rem;
}
.section-contact-content p {
	font-size: 2rem;
	margin-bottom: 3rem;
	line-height: 1.5;
	letter-spacing: 0.1em;
}
.section-contact-content table {
	color: var(--color-black);
	font-size: 2rem;
	margin-bottom: 3rem;
	border-top: 1px solid var(--color-black);
	background-color: transparent;
}
.section-contact-content table th,
.section-contact-content table td {
	color: var(--color-black);
	padding: 3rem 1rem;
	border-bottom: 1px solid var(--color-black);
	background-color: transparent;
	text-align: left;
}
.section-contact-content .buttons {
	display: flex;
	gap: 3rem;
	justify-content: center;
}
.section-contact-content .button-wrapper {
	position: relative;
	width: fit-content;
}
.section-contact-content .button-wrapper .button {
	background-color: var(--color-green);
    border-radius: 999px;
    text-align: center;
    display: block;
    padding: 0.75em;
    font-size: 2.4rem;
    color: var(--color-white);
    filter: var(--drop-shadow);
    width: 400px;
    letter-spacing: 0.1em;
    cursor: pointer;
    border: none;
    transition: 0.3s;
}
.section-contact-content .button-wrapper.back .button {
	background-color: var(--color-white);
	color: var(--color-black);
}
@media screen and (max-width: 750px) {
	.section-contact-content .buttons {
		display: block;
	}
	.section-contact-content .button-wrapper .button {
		width: 100%;
	}
	.section-contact-content .button-wrapper .button {
		font-size: 2rem;
	}
	.section-contact-content .button-wrapper {
		width: 80%;
		margin: 0 auto 3rem auto;
	}
	.section-contact-content table th,
	.section-contact-content table td {
		display: block;
	}
	.section-contact-content table th {
		border: none;
		padding-bottom: 0;
		font-size: 1.8rem;
		color: var(--color-green);
	}
	.section-contact-content table td {
		padding-top: 0.5rem;
		font-size: 1.6rem;
	}
	.section-contact-content p{
		font-size: 1.6rem;
	}
}




#footer {
	background-color: var(--color-green);
	padding-top: 7rem;
	padding-bottom: 3rem;
}
#footer .inner {
	display: flex;
	justify-content: space-between;
	max-width: 960px;
	flex-wrap: wrap;
}
#footer .content dl {
	display: flex;
	align-items: flex-start;
	width: fit-content;
	column-gap: 1rem;
	color: var(--color-white);
	font-weight: 400;
	margin-bottom: 2rem;
}
#footer .content dl dt {
	padding: 0.2em 1em;
	min-width: 6em;
	border: 1px solid var(--color-white);
}
#footer .content dl dd {
	text-align: left;
	line-height: 1.4;
}
#footer .footer-logo {
	width: 240px;
	height: 56px;
}
#footer .copy {
	display: block;
	text-align: right;
	color: var(--color-white);
	width: 100%;
	font-size: 1.3rem;
	font-weight: 400;
	margin-top: 3rem;
}
@media screen and (max-width: 750px) {
	#footer {
		padding-top: 4rem;
		padding-bottom: 12rem;
	}
	#footer .inner {
		display: block;
	}
	#footer .footer-logo{
		margin: 0 auto 3rem auto;
	}
	#footer .content dl{
		font-size: 1.5rem;
	}
	#footer .copy{
		text-align: center;
	}
}