@charset "utf-8";

/*---Reset---*/
body, h1, h2, h3, h4, h5, h6, p, address,
ul, ol, li, dl, dt, dd, img, form, table, tr, th, td {
	margin: 0;
	padding: 0;
	border: none;
	font-style: normal;
	font-weight: normal;
	font-size: 100%;
	text-align: left;
	list-style-type: none;
	border-collapse: collapse;
}

textarea { font-size: 100%; vertical-align:middle;}
img { border-style: none; display: block; }
hr { display: none; }
em{font-style: normal}
input{line-height:auto;vertical-align:middle;}
strong.more{color:#c30}
a{text-decoration: none;}

html {

}

body {
	font-family: 'source-han-sans-japanese', sans-serif, 'Noto Serif JP', serif;
	color: #ffffff;
}


/*クラス定義*/
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	height: 0;
	visibility: hidden;
}

.clearfix {
	display: inline-table;
}

/* Hides from IE-mac \*/
* html .clearfix{height: 1%;}
*+html .clearfix{min-height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}


/*--- ページ基本デザイン ---*/
#wrap{
	width: 100%;
	height: auto;
	background-color: #0A1F29;
	position:relative;
	overflow-y: hidden;
	overflow-x: hidden;
}

/* ファーストビュー */
#fv{
	width: 100%;
	height: 650px;
	background-image: url(../img/fv_pc.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	display: flex;
	justify-content: space-between;
	aspect-ratio: 5 / 2.5;
	/* padding-bottom: 50px; */
}
@media screen and (max-width: 599px){
	#fv{
		width: 100%;
		height: 500px;
		background-image: url(../img/fv_sp.jpg);
		background-size: cover;
		display: block;
		/* aspect-ratio: 1 / 1; */
	}
}

#fv-content{
	width: 100%;
	height: 575px;
	position: relative;
	margin-top: 77px;
}
@media screen and (min-width: 1809px) {
	#fv-content{
		width: 100%;
	}
}
@media screen and (max-width: 768px){
	#fv-content{
		width: 100%;
		height: auto;
	}
}
@media screen and (max-width: 599px){
	#fv-content{
		width: 100%;
		height: 500px;
		margin-top: 0px;
	}
}



#fv-content img.fv_text_pc{
	width: 727px;
	height: 322px;
	position: absolute;
	left: 0;
	right: 0;
	margin: auto;
	z-index: 2;
}
@media screen and (max-width: 1280px) {
	#fv-content img.fv_text_pc{
		width: 627px;
		height: 254px;
	}
}
@media screen and (max-width: 1024px){
	#fv-content img.fv_text_pc{
		display: none !important;
	}
}

#fv-content img.fv_text_sp{
	width: 100%;
	height: 230px;
	position: absolute;
	left: 0;
	margin-top: 50px;
	margin-left: 20px;
	aspect-ratio: 16 / 5;
	z-index: 3;
}
@media screen and (min-width: 1025px) {
	#fv-content img.fv_text_sp{
		display: none !important;
	}
}
@media screen and (max-width: 1024px) {
	#fv-content img.fv_text_sp{
		width: 597px;
		height: 255px;
		margin-top: 0px;
	}
}
@media screen and (max-width: 768px) {
	#fv-content img.fv_text_sp{
		/* width: 561px;
		height: 243px; */
		width: 505px;
		height: 239px;
		margin-top: 0px;
	}
}
@media screen and (max-width: 599px) {
	#fv-content img.fv_text_sp{
		width: 361px;
		height: 155px;
		margin-top: 50px;

	}
}
@media screen and (max-width: 500px) {
	#fv-content img.fv_text_sp{
		width: 279px;
		height: 140px;

	}
}


#fv-content img.maru_button{
	/* width: 100%; */
	height: 155px;
	margin-top: 360px;
	position: absolute;
	left: 0;
}
@media screen and (max-width: 1280px) {
	#fv-content img.maru_button{
		width: 550px;
		height: 155px;
		margin-top: 350px;
		left: 0;
		z-index: 2;
	}
}
@media screen and (max-width: 768px){
	#fv-content img.maru_button{
		width: 500px;
		margin-top: 360px;
		z-index: 2;
	}
}
@media screen and (max-width: 599px) {
	#fv-content img.maru_button{
		width: 313px;
		height: 88px;
		margin-top: 356px;
	}
}


img.marukome{
	width: 442px;
	height: 602px;
	position: absolute;
	right: 0;
	bottom: 0;
}
@media screen and (max-width: 1366px) {
	img.marukome{
		width: 442px;
		height: 602px;
	}
}
@media screen and (max-width: 1024px) {
	img.marukome{
		width: 421px;
		height: 572px;
		right: -28px;
	}
}
@media screen and (max-width: 768px) {
	img.marukome{
		width: 390px;
		height: 540px;
		z-index: 1;
		right: -15px;
		bottom: 0;
	}
}
@media screen and (max-width: 599px) {
	img.marukome{
		width: 280px;
		height: 382px;
		z-index: 1;
		bottom: 0;
		right: -15px;
	}
}




/* CTA */
#LINE{
	width: 100%;
	height: auto;
	background-color: #2B4775;
	margin: 0 auto;
	padding: 0px 20px 0px 20px;
	overflow-wrap: break-all;
	padding-bottom: 50px;
}

#text_line1{
	width: 100%;
	margin: 0 auto;
	font-size: 26px;
	font-weight: bold;
	text-align: center;
	padding-top: 40px;
	letter-spacing: 2px;
}
@media screen and (max-width: 599px) {
	#text_line1{
		font-size: 19px;
	}
}

#text_line2{
	width: 100%;
	margin: 0 auto;
	color: #F5DA7E;
	font-size: 18px;
	font-weight: bold;
	text-align: center;
	padding-top: 40px;
	letter-spacing: 1px;
}
@media screen and (max-width: 599px) {
	#text_line2{
		font-size: 16px;
	}
}


#LINE img{
	width: 100%;
	height: 51px;
	margin: 0 auto;
	margin-top: 30px;
}


/* MESSAGE */
#message{
	width: 100%;
	margin: 0 auto;
	display: flex;
	justify-content: center;
}

#message p.main-text{
	margin-top: 60px;
	font-family: 'Noto Serif JP', serif;
	font-size: 38px;
	letter-spacing: 5px;
	text-align: center;
	font-weight: bold;
	border-bottom: solid#CDB76C;
	display: inline-block;
	padding-bottom: 10px;
}
@media screen and (max-width: 599px) {
	#message p.main-text{
		font-size: 24px;
	}
}

#message-content{
	width: 100%;
	height: auto;
	overflow: hidden;
	position: relative;
	display: flex;
	justify-content: center;
	padding: 60px 30px 100px 30px;
}
@media screen and (max-width: 768px) {
	#message-content{
		display: block;
		text-align: center;
	}
}
@media screen and (max-width: 599px) {
	#message-content{
		display: block;
		text-align: center;
		padding-left: 20px;
		padding-right: 20px;
		padding-bottom: 150px;
	}
}



#message-content iframe{
	width: 40%;
	height: fit-content;
	aspect-ratio: 6 / 3;
}
@media screen and (max-width: 768px) {
	#message-content iframe{
		width: 100%;
		aspect-ratio: 19 / 10;
	}
}

#message-content p.message{
	width: 430px;
	height: auto;
	font-family: 'ta-kobe', sans-serif;
	font-weight: 400;
	font-style: normal;
	line-height: 25px;
	font-size: 16.5px;
	letter-spacing: 5px;
	margin-left: 40px;
}
@media screen and (max-width: 1280px){
	#message-content p.message{
		margin-left: 40px;
	}
}
@media screen and (max-width: 768px) {
	#message-content p.message{
		width: 100%;
		margin-left: 0px;
		letter-spacing: 1px;
		margin-top: 60px;

	}
}


#message-content img.water-1{
	width: 624px;
	height: 532px;
	position: absolute;
	right: -200px;
	top: 300px;
	padding-bottom: 20px;
}
@media screen and (max-width: 1280px){
	#message-content img.water-1{
		position: absolute;
		right: -300px;
		top: 300px;
	}
}
@media screen and (max-width: 768px){
	#message-content img.water-1{
		position: absolute;
		right: -300px;
		top: 630px;
	}
}
@media screen and (max-width: 640px){
	#message-content img.water-1{
		position: absolute;
		right: -300px;
		top: 570px;
	}
}
@media screen and (max-width: 430px){
	#message-content img.water-1{
		position: absolute;
		right: -330px;
		top: 590px;
	}
}




/* PROBLEMS */
#problems{
	width: 100%;
	height: auto;
	margin: 0 auto;
	background-image: url(../img/problems.jpg);
	background-size: auto 100%;
	position: relative;
}

#problems::after {
	content: "";
	position: absolute;
	top: 100%;
	margin-top: -1px;
	box-sizing: border-box;
	border-right: 50vw solid transparent;
	border-left: 50vw solid transparent;
	border-top: 100px solid #0A1F29;
	}

#problems p.main-text{
	margin-top: 60px;
	width: 255px;
	height: 70px;
	margin: 0 auto;
	font-family: 'Noto Serif JP', serif;
	font-size: 38px;
	letter-spacing: 5px;
	text-align: center;
	font-weight: bold;
	border-bottom: solid#CDB76C;
	padding-bottom: 10px;
}
@media screen and (max-width: 599px) {
	#problems p.main-text{
		font-size: 24px;
		width: 170px;
		height: auto;
	}
}


#problems-content{
	margin: 0 auto;
}

#problems-content p.concern{
	font-family: 'Noto Serif JP', serif;
	font-size: 21px;
	text-align: center;
	font-weight: bold;
	margin-top: 60px;
	margin-bottom: 60px;
	letter-spacing: 1px;
	line-height: 30px;
}

.concern-text{
	display: flex;
	margin: 0 auto;
	width: 715px;
	padding-left: 80px;
	margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
	.concern-text{
		width: 100%;
	}
}
@media screen and (max-width: 599px) {
	.concern-text{
		width: 90%;
		padding-left: 10px;
		display: flex;
		align-items: center;
	}
}


.concern-text img.check{
	width: 23px;
	height: 20px;
	margin-right: 15px;
	margin-top: 3px;
}
@media screen and (max-width: 599px) {
	.concern-text img.check{
		width: 40px;
		height: 36px;
		/* position: absolute;
		top: 0;
		bottom: 0; */
	}
}


.concern-text p{
	height: auto;
	font-size: 16px;
	letter-spacing: 1px;
}
@media screen and (max-width:599px) {
	.concern-text p{
		display: table-cell;
		vertical-align: middle;

	}
}

.concern-text p span{
	display: inline-block;
}

.onayami{
	width: 260px;
	margin: 0 auto;
}

.onayami p{
	font-family: 'Noto Serif JP', serif;
	font-size: 16px;
	text-align: center;
	font-weight: bold;
	margin-top: 60px;
	letter-spacing: 1px;
}

.dots span{
	position: relative;
}

.dots span::before {
	content: "・";       /* 文字の上に置くものを指定 */
	position: absolute; /* 相対位置とする */
	top: -1em;          /* 縦方向の表示位置を調整（-1emくらいがちょうどいいかんじ） */
	left: 0;            /* 横方向の表示位置を調整 */
  }

.onayami .under_line1{
	content: "";
	border-bottom: solid 2px #478EB0;
	bottom: 20px;
	left: 0;
	right: 0;
	padding-top: 5px;
}

.onayami .under_line2{
	content: "";
	border-bottom: solid 2px #478EB0;
	bottom: 20px;
	left: 0;
	right: 0;
	padding-top: 3px;
}


/* PROCESS */
#process{
	width: 100%;
	height:	auto;
	margin: 0 auto;
	background-image: url(../img/process-3.jpg);
	background-position: center;
	background-size: 80% 100%;
	padding: 100px 60px 30px 60px;
}
@media screen and (min-width:  1367px) {
	#process{
		padding: 100px 120px 30px 120px;
	}
}
@media screen and (min-width:  834px) {
	#process{
		padding: 100px 50px 30px 50px;
	}
}

@media screen and (max-width:  599px) {
	#process{
		padding-left: 25px;
		padding-right: 25px;
		}
}


#process p.main-text{
	max-width: 215px;
	height: 70px;
	margin: 0 auto;
	margin-top: 80px;
	font-family: 'Noto Serif JP', serif;
	font-size: 38px;
	letter-spacing: 5px;
	text-align: center;
	font-weight: bold;
	border-bottom: solid#CDB76C;
	padding-bottom: 10px;
}
@media screen and (max-width: 599px) {
	#process p.main-text{
		font-size: 24px;
		max-width: 143px;
		height: auto;
	}
}


#process-content{
	margin: 0 auto;
}

#process-content p.program{
	font-family: 'Noto Serif JP', serif;
	font-size: 21px;
	text-align: center;
	font-weight: bold;
	margin-top: 60px;
	margin-bottom: 60px;
}

#flex-box{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
@media screen and (max-width:  768px) {
	#flex-box{
		width: 100%;
		display: block;
		margin: 0 auto;
	}
}

.program-step{
	width: 325px;
	display: flex;
	flex-wrap: wrap;
}
@media screen and (max-width:  768px) {
	.program-step{
		width: 100%;
		margin-top: 20px;
		margin-bottom: 20px;
	}
}


#step1-img{
	background-image: url(../img/STEP01.svg);
	width: 58px;
	height: 58px;
}

.program-step p.step-text{
	font-family: 'Noto Serif JP', serif;
	font-size: 21px;
	font-weight: bold;
	margin-left: 15px;
	margin-top: 15px;
}

.step-disk{
	width: 100%;
	height: 150px;
	margin-top: 15px;
	margin-left: 13px;
}
@media screen and (max-width:  768px) {
	.step-disk{
		height: auto;
	}
}

.step-disk p{
	width: 295px;
	padding-bottom: 30px;
}
@media screen and (max-width:  768px) {
	.step-disk p{
		width: 100%;
	}
}


.step-arrow{
	/* margin-right: 35px; */
	margin-top: 70px;
}
@media screen and (max-width: 1280px){
	.step-arrow{
		margin-right: 20px;
	}
}
@media screen and (max-width: 834px){
	.step-arrow{
		margin-right: 0px;
	}
}
@media  screen and (max-width: 768px) {
	.step-arrow{
		display: none !important;
	}
}

.sp-arrow{
	width: 100%;
	margin: 0 auto;
}
@media screen and (min-width: 769px) {
	.sp-arrow{
		display: none !important;
	}
}

.sp-arrow img.arrow-sp{
	margin: 0 auto;
}

#step2-img{
	background-image: url(../img/STEP02.svg);
	width: 58px;
	height: 58px;
}

#step3-img{
	background-image: url(../img/STEP03.svg);
	width: 58px;
	height: 58px;
}

#step4-img{
	background-image: url(../img/STEP04.svg);
	width: 58px;
	height: 58px;
}

#step5-img{
	background-image: url(../img/STEP05.svg);
	width: 58px;
	height: 58px;
}

#step6-img{
	background-image: url(../img/STEP06.svg);
	width: 58px;
	height: 58px;
}

#step7-img{
	background-image: url(../img/STEP07.svg);
	width: 58px;
	height: 58px;
}


/* SERVICE */
#service{
	width: 100%;
	margin: 0 auto;
	padding-left: 25px;
	padding-right: 25px;
}

#service p.main-text{
	max-width: 200px;
	height: 70px;
	margin: 0 auto;
	margin-top: 60px;
	font-family: 'Noto Serif JP', serif;
	font-size: 38px;
	letter-spacing: 5px;
	text-align: center;
	font-weight: bold;
	border-bottom: solid#CDB76C;
	padding-bottom: 10px;
}
@media screen and (max-width: 599px) {
	#service p.main-text{
		font-size: 24px;
		width: 135px;
		height: auto;
	}
}


#service-content{
	width: 100%;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	margin-top: 60px;
}


.menu{
	width: 291px;
	height: 467px;
	background-color: #F4F4F4;
	margin-top: 60px;
	margin-left: 10px;
	padding-bottom: 40px;
}
@media screen and (max-width: 810px) {
	.menu{
		margin-top: 10px;
		margin-left: 10px;
	}
}
@media screen and (max-width: 768px) {
	.menu{
		width: 343px;
		height: auto;
		margin-top: 10px;
		margin-left: 10px;
	}
}
@media screen and (max-width: 450px) {
	.menu{
		margin-left: 0px;
	}
}



.menu img{
	width: 100%;
}


.menu .menu-text{
	font-family: 'Noto Serif JP', serif;
	font-size: 26px;
	color: #1F507B;
	text-align: center;
	font-weight: bolder;
	margin-top: 20px;
	letter-spacing: 1px;
}

.menu p{
	color: #0A1F29;
	font-size: 16px;
	padding-left: 20px;
	padding-right: 20px;
	margin-top: 20px;
	line-height: 28px;
	padding-bottom: 20px;

}



/* FEATURES */
#features{
	width: 100%;
	height: auto;
	margin: 0 auto;
	display: inline-block;
	padding: 100px 30px 100px 30px;
}

#features .water-2{
	width: 50%;
}

#features .water-2 img{
	height: 877px;
	position: absolute;
	left: -240px;
	background-size: cover;
	background-repeat: no-repeat;
	margin-top: -288px;
	z-index: 1;
}
@media  screen  and (max-width: 599px){
	#features .water-2 img{
		height: 667px;
		left: -180px;
		margin-top: -245px;

	}
}
@media screen and (max-width: 400px) {
	#features .water-2 img{
		height: 580px;
		left: -180px;
		margin-top: -225px;
	}
}

#main{
	width: 100%;
	margin: 0 auto;
}

#main p.main-text{
	max-width: 245px;
	margin: 0 auto;
	font-family: 'Noto Serif JP', serif;
	font-size: 38px;
	letter-spacing: 5px;
	text-align: center;
	font-weight: bold;
	border-bottom: solid#CDB76C;
	padding-bottom: 10px;
	position: relative;
	z-index: 2;
}
@media screen and (max-width: 599px) {
	#main p.main-text{
		font-size: 24px;
		width: 164px;
		height: auto;
	}
}

#feature-content{
	width: 100%;
	height: auto;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	aspect-ratio: 5;
	margin-top: 50px;
	position: relative;
	z-index: 2;
}

.feature{
	width: 358px;
	height: 362px;
	/* padding-top: 100%; */
	/* height: max-content; */
	background-color: #F4F4F4;
	display: flex;
	flex-wrap: wrap;
	margin-top: 10px;
	margin-right: 10px;
	padding: 25px 8px 25px 8px;
	aspect-ratio: 1;
}
@media screen and (max-width: 768px) {
	.feature{
		width: 341px;
		height: auto;
		margin-right: 10px;
	}
}
@media screen and (max-width: 450px) {
	.feature{
		margin-right: 0px;
	}
}



#feature-img{
	width: 100%;
	height: fit-content;
	display: flex;
	align-items: center;
	padding-bottom: 10px;
	aspect-ratio: 5 / 1;
}

#feature-img img{
	width: 60px;
	height: 60px;
	background-size: cover;
}

#feature-img p{
	width: 260px;
	height: 60px;
	display: inline-block;
	font-family: 'Noto Serif JP', serif;
	font-size: 20px;
	color: #1F507B;
	font-weight: bolder;
	margin-left: 15px;
	letter-spacing: 1px;
}

#feature-img p span{
	display: inline-block;
}


.feature-disk{
	width: 100%;
	height: auto;
	margin-left: 10px;
	margin-right: 10px;
}

.feature-disk p{
	width: 100%;
	display: inline-block;
	color: #0A1F29;
	line-height: 26px;
	padding-top: 20px;
	padding-bottom: 10px;
	overflow-wrap: break-all;

}


/* REVIEWS */
#reviews{
	width: 100%;
	height: auto;
	margin: 0 auto;
	background-image: url(../img/review.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	padding-top: 100px;
	padding-left: 25px;
	padding-right: 25px;
	padding-bottom: 80px;
}

#reviews p.main-text{
    max-width: 218px;
	margin: 0 auto;
	font-family: 'Noto Serif JP', serif;
	font-size: 38px;
	letter-spacing: 5px;
	text-align: center;
	font-weight: bold;
	border-bottom: solid#CDB76C;
	padding-bottom: 10px;
	padding-top: 10px;
}
@media screen and (max-width: 599px) {
	#reviews p.main-text{
		font-size: 24px;
		width: 145px;
		height: auto;
	}
}


#review-content{
	width: 100%;
	justify-content: center;
	display: flex;
}
@media  screen  and (max-width: 768px){
	#review-content{
		display: block;
		padding-top: 60px;
	}
}


.review{
	width: 351px;
	height: 241px;
	background-color: #F4F4F4;
	margin-top: 60px;
	margin-right: 10px;
	aspect-ratio: 1;
}
@media  screen  and (max-width: 768px){
	.review{
		margin: 0 auto;
		margin-bottom: 10px;
	}
}
@media  screen  and (max-width: 450px){
	.review{
		width: 100%;
	}
}



.review-png{
	height: 89px;
	position: relative;
}

.review-png img{
	width: 100%;
	height: 89px;
	aspect-ratio: 1 / 1;
}

.review-png p.koe{
	width: 162px;
	height: 30px;
	font-family: 'Noto Serif JP', serif;
	font-size: 21px;
	color: #ffffff;
	font-weight: bolder;
	letter-spacing: 1px;
	position: absolute;
	top: 35%;
  	left: 50%;
  	transform: translate(-50%, -50%);
}

.review-disk{
	padding-left: 20px;
	padding-right: 20px;
}

.review-disk p{
	color: #0A1F29;
	padding-bottom: 30px;
	line-height: 26px;
	margin-top: 30px;
}


/* PLANS */
/* #plans{
	width: 100%;
	height: auto;
	margin: 0 auto;
	background-image: url(../img/plan.jpg);
	background-size: cover;
	background-repeat: no-repeat;
	padding: 120px 60px 130px 60px;
}
@media screen and (max-width: 768px) {
	#plans{
		padding: 100px 10px 100px 10px;

	}
}

#plans p.main-text{
	max-width: 152px;
	margin: 0 auto;
	font-family: 'Noto Serif JP', serif;
	font-size: 38px;
	letter-spacing: 5px;
	text-align: center;
	font-weight: bold;
	border-bottom: solid#CDB76C;
	padding-bottom: 10px;
}
@media screen and (max-width: 599px) {
	#plans p.main-text{
		font-size: 24px;
		width: 100px;
		height: auto;
	}
}


#plans-content{
	width: 100%;
	margin-top: 60px;

}

#plans-content img.price{
	width: 783px;
	height: 565px;
	margin: 0 auto;
}
@media screen and (max-width: 1024px) {
	#plans-content img.price{
		width: 90%;
		height: auto;
	}
}
@media screen and (max-width: 599px) {
	#plans-content img.price{
		display: none !important;
	}
}

#plans-content img.price-sp{
	width: 350px;
	height: 493px;
	margin: 0 auto;
}
@media screen and (min-width: 600px) {
	#plans-content img.price-sp{
		display: none !important;
	}
} */




/* FLOW */
#flow{
	width: 100%;
	height: auto;
	margin: 0 auto;
	padding-left: 60px;
	padding-right: 60px;
	padding-bottom: 120px;
}

.water-3{
	width: 80%;
}
.water-3 img{
	height: 594px;
	position: absolute;
	right: -320px;
	z-index: 1;
}
@media screen and (max-width: 768px) {
	.water-3 img{
		right: -320px;
	}
}
@media screen and (max-width: 599px) {
	.water-3 img{
		right: -458px;
	}
}


#flow p.main-text{
	max-width: 134px;
	margin: 0 auto;
	font-family: 'Noto Serif JP', serif;
	font-size: 38px;
	letter-spacing: 5px;
	text-align: center;
	font-weight: bold;
	border-bottom: solid#CDB76C;
	padding-bottom: 10px;
	padding-top: 120px;
	position: relative;
	z-index: 2;
}
@media screen and (max-width: 599px) {
	#flow p.main-text{
		font-size: 24px;
		width: 85px;
		height: auto;
	}
}



#flow p.program{
	font-family: 'Noto Serif JP', serif;
	font-size: 21px;
	text-align: center;
	font-weight: bold;
	padding-top: 60px;
	padding-bottom: 60px;
	margin: 0 auto;
	position: relative;
	z-index: 2;
}	

#flow-content{
	width: 100%;
	height: auto;
	justify-content: center;
	display: flex;
}
@media screen and (max-width: 1024px) {
	#flow-content{
		display: block;
		width: 100%;
	}
}

.flow-step{
	width: 257px;
	height: 135px;
	border-radius: 15px;
	background-color: #F4F4F4;
	padding: 60px 20px 10px 20px;
	aspect-ratio: 16 / 9;
	position: relative;
	z-index: 2;
}
@media screen and (max-width: 1024px) {
	.flow-step{
		margin: 0 auto;
	}
}


.flow-img {
	width: 58px;
	height: 58px;
	margin: 0 auto;
	margin-top: -80px;
	position: relative;
}

.review-png img{
	width: 100%;
	height: 89px;
	aspect-ratio: 1 / 1;
}

.flow-disk{
	width: 100%;
	height: auto;
	margin: 0 auto;
}

.flow-disk p{
	width: 219px;
	font-family: 'Noto Serif JP', serif;
	font-size: 20px;
	color: #1F507B;
	font-weight: bolder;
	letter-spacing: 1px;
	padding-top: 20px;
	padding-bottom: 15px;
	display: flex;
	justify-content: center;
}

.flow-step p.flow-text3{
	width: 100%;
	height: 60px;
	margin: 0 auto;
	font-family: 'Noto Serif JP', serif;
	font-size: 21px;
	color: #1F507B;
	font-weight: bolder;
	letter-spacing: 1px;
	margin-top: 18px;
	display: flex;
	justify-content: center;
}

.flow-arrow{
	margin-top: 55px;
	height: auto;
	margin-right: 35px;
	margin-left: 35px;
}
@media screen and (max-width: 1280px){
	.flow-arrow{
		margin-right: 20px;
		margin-left: 20px;	
	}
}
@media screen and (max-width: 1024px){
	.flow-arrow{
		display: none !important;
	}
}

.flow-arrow-sp{
	width: 100%;
	margin-top: 20px;
	margin-bottom: 35px;
}
@media screen and (min-width: 1025px) {
	.flow-arrow-sp{
		display: none !important;
	}
}

.flow-arrow-sp img.arrow-sp{
	margin: 0 auto;
}




/* PROFILE */
#profile{
	width: 100%;
	display: flex;
	justify-content: center;
}

#profile p.main-text{
	max-width: 200px;
	margin-top: 60px;
	font-family: 'Noto Serif JP', serif;
	font-size: 38px;
	letter-spacing: 5px;
	text-align: center;
	font-weight: bold;
	border-bottom: solid#CDB76C;
	padding-bottom: 10px;
}
@media screen and (max-width: 599px) {
	#profile p.main-text{
		font-size: 24px;
		height: auto;
	}
}


#profile-content{
	width: 100%;
	height: 921px;
	overflow: hidden;
	position: relative;
	display: flex;
	justify-content: center;
	margin-top: 60px;
	padding-bottom: 100px;
	z-index: 2;
}
@media screen and (min-width: 1366px) {
	#profile-content{
		padding-bottom: 0px;
	}
}
@media screen and (max-width: 1024px) {
	#profile-content{
 		padding-bottom: 200px;
		padding-left: 50px;
		padding-right: 50px;
	}
}
@media screen and (max-width: 768px) {
	#profile-content{
		display: block;
		width: 100%;
		height: 1150px;
		margin-top: 60px;
		padding-left: 50px;
		padding-right: 50px;
	}
}
@media screen and (max-width: 640px) {
	#profile-content{
		height: 1100px;
	}
}
@media screen and (max-width: 599px) {
	#profile-content{
		padding-left: 20px;
		padding-right: 20px;
		height: 990px;
	}
}


#profile-content img{
	width: 45%;
	height: max-content;
	margin-right: 60px;
	aspect-ratio: 16 / 9;
}
@media screen and (max-width: 1024px) {
	#profile-content img{
		width: 45%;
	}
}
@media screen and (max-width: 768px) {
	#profile-content img{
		width: 100%;
		margin-right: 0px;
		aspect-ratio: 16 / 9;
	}
}


#profile-text{
	width: 35%;
	position: relative;
	aspect-ratio: 3 / 5;
	z-index: 2;
}
@media screen and (max-width: 1024px) {
	#profile-text{
		width: 100%;
		height: 700px;
	}
}
@media screen and (max-width: 768px) {
	#profile-text{
		width: 100%;
		height: 700px;
		margin-top: 35px;
	}
}


#profile-content p.marukome{
	width: 346px;
	font-family: 'Noto Serif JP', serif;
	font-weight: bold;
	font-size: 18px;
	letter-spacing: 2px;
	padding-bottom: 10px;
}
@media screen and (max-width: 599px) {
	#profile-content p.marukome{
		font-size: 16px;
	}
}


#profile-content p.prof-disk{
	height: auto;
	font-size: 16px;
	letter-spacing: 5px;
}
@media screen and (max-width: 599px) {
	#profile-content p.prof-disk{
		letter-spacing: 1px;
		line-height: 25px;
	}
}

/* プロフィールとFAQの間の水しぶき１ */
#profile-content img.water-1{
	width: 624px;
    height: 532px;
    position: absolute;
    right: -200px;
    padding-bottom: 20px;
	z-index: 1;
	bottom: 0;
}
@media screen and (min-width: 1536px){
	#profile-content img.water-1{
		width: 824px;
		height: 590px;	
		position: absolute;
		right: -300px;
	}
}
@media screen and (max-width: 1280px){
	#profile-content img.water-1{
		position: absolute;
		right: -300px;
	}
}
@media screen and (max-width: 1024px){
	#profile-content img.water-1{
		position: absolute;
		right: -300px;
	}
}
@media screen and (max-width: 768px){
	#profile-content img.water-1{
		position: absolute;
		right: -284px;
	}
}
@media screen and (max-width: 640px){
	#profile-content img.water-1{
		position: absolute;
		right: -300px;
	}
}
@media screen and (max-width: 430px){
	#profile-content img.water-1{
		position: absolute;
		right: -330px;
	}
}




/* FAQ */
#faq{
	width: 100%;
	height: auto;
	padding-top: 30px;
	margin: 0 auto;
	padding-bottom: 80px;
	position: relative;
	z-index: 1;
}
@media  screen and (max-width: 1024px) {
	#faq{
		padding-top: 0px;
	}
}


#faq p.main-text{
	max-width: 84px;
	margin: 0 auto;
	font-family: 'Noto Serif JP', serif;
	font-size: 38px;
	letter-spacing: 5px;
	text-align: center;
	font-weight: bold;
	border-bottom: solid#CDB76C;
	padding-bottom: 10px;
}
@media screen and (max-width: 599px) {
	#faq p.main-text{
		font-size: 24px;
		height: auto;
	}
}


#faq-content{
	width: 100%;
	height: auto;
	margin: 0 auto;
	margin-top: 60px;
}

.qa{
	width: 705px;
	height: auto;
	/* width: 50%;
	height: max-content; */
	margin: 30px auto 10px auto;
	background-color: #F4F4F4;
	padding: 40px 60px 40px 60px;
	overflow-wrap: break-word;
}
@media screen and (max-width: 768px) {
	.qa{
		width: 75%;
	}
}
@media screen and (max-width: 599px) {
	.qa{
		width: 88%;
		padding: 40px 20px 40px 20px;
	}
}



.qa p.question{
	/* width: 610px; */
	height: auto;
	font-family: 'Noto Serif JP', serif;
	font-size: 21px;
	color: #0068C1;
	font-weight: bolder;
	letter-spacing: 1px;
	margin-bottom: 15px;
}

.qa p.answer{
	font-size: 16px;
	color: #0A1F29;
	letter-spacing: 1px;
}


/* FOOTER */
#footer{
	width: 100%;
	height: 175px;
	padding-top: 50px;
}

#footer p.sns{
	width: 150px;
	font-family: 'Noto Serif JP', serif;
	font-size: 15px;
	letter-spacing: 3px;
	margin: 0 auto;
	margin-bottom: 20px;
}

#footer-content{
	width: 100%;
	display: flex;
	justify-content: center;
	padding-left: 5px;
}

#footer-content .icon{
	width: 36px;
	height: 36px;
	margin-right: 40px;
}

#footer-content .icon4{
	width: 36px;
	height: 36px;
}


/* asct */
#asct{
	width: 100%;
	height: 100px;
	padding-top: 10px;
}

#asct-content{
	width: 170px;
	margin: 0 auto;
}
.asct-link{
	color: #ffffff;
	font-size: 14px;
}











