@charset "UTF-8";


/* ========================================================
  
  common

======================================================== */


/*---------------------------------------------------------
 
---------------------------------------------------------*/

/* PC,Tablet
------------------------------------------*/
@media only screen and (min-width: 768px) {

}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

}



/* ========================================================
  
  

======================================================== */


/*---------------------------------------------------------
 notice
---------------------------------------------------------*/
.notice_box {
	--corner-accent-color: #85c16c;
	text-align: center;
	background-color: #E8EEE0;
}
.notice_box .com_h__deco {
	--deco-color: #85c16c;
	--deco-bg-color: #E8EEE0;
}
.notice_box .com_h__bld {
	font-size: clamp(15px,2vw,120%);
	margin-bottom: 1em;
}
.notice_box .com_h__bld::before {
	color: #85c16c;
}
.notice_box .bdr_b {
	border-color: #FFF;
}
.notice_box .com_list {
	max-width: 960px;
	margin-inline: auto;
}

.notice_box .belongs {
	display: grid;
	grid-template-columns: repeat(3,min(32%,260px));
	justify-content: space-between;
	max-width: 872px;
	line-height: 1.5;
	margin: 0 auto 3%;
}
.notice_box .belongs dl {
	display: flex;
	flex-direction: column;
	gap: .8em;
	text-align: center;
	padding: 15% 5%;
	background-color: #fff;
	border: 1px solid #85c16c;
	border-radius: 50px;
}
.notice_box .belongs dl dd {
	font-size: 120%;
	font-weight: var(--fw-bold);
	margin: auto;
}
.notice_box .belongs dl dd span {
	font-size: 78%;
}
/* PC,Tablet
------------------------------------------*/
@media only screen and (min-width: 768px) {

.notice_box .com_flt .img_l {
	width: 45%;
}
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.notice_box .com_h__bld {
	font-size: 105%;
}

.notice_box .com_flt .img_l {
	width: 100%;
}

.notice_box .belongs {
	display: flex;
	flex-wrap: wrap;
	row-gap: .5em;
	margin-bottom: 5%;
}
.notice_box .belongs dl:first-of-type {
	width: 100%;
}
.notice_box .belongs dl {
	width: 48.5%;
	padding: 8% 5%;
	border-radius: 8vw;
}
.notice_box .belongs dl dd {
	font-size: 120%;
	font-weight: var(--fw-bold);
	margin: auto;
}
.notice_box .belongs dl dd span {
	font-size: 78%;
}
}



/*---------------------------------------------------------
 FLOW
---------------------------------------------------------*/
#flow .com_bg__color {background-color: #E0EDE6;}

#flow hr {
	background-color: #fff;
	margin-bottom: 11%;
}
.flow_title {
	color: #FFF;
	text-align: center;
	margin-bottom: 4%;
}
/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {
#flow hr {
	margin-bottom: 20%;
}
#flow .com_bg__img {
	width: 130vw;
	left: -15vw;
}
}

/*FLOW: flow_sum
---------------------------------------------------------*/
.flow_sum {
	max-width: 1100px;
	display: grid;
	justify-content: space-between;
	grid-template-columns: repeat(7,12.8%);
	row-gap: .5em;
	text-align: center;
	font-size: min(1.6vw,120%);
	font-weight: var(--fw-bold);
	line-height: 1.4;
	margin-inline: auto;
}
.flow_sum > li {
	position: relative;
	display: flex;
	flex-direction: column;
	background-color: #fff;
	padding: 14% 7% 22%;
	border-radius: 1.6em;
}
.flow_sum > li::after {
	position: absolute;
	content: "";
	background-color: var(--color-base);
	width: 10.8%;
	aspect-ratio: 15/16;
	clip-path: polygon(0 0, 100% 50%, 0 100%);
	left: 107%;
	top: 50%;
	translate: -50% -50%;
}
.flow_sum > li:last-of-type::after {
	display: none;
}
.flow_sum .time {
	font-size: 95%;
	background-color: #f0f3ec;
	padding: .2em;
	border-radius: 2em;
	margin-bottom: 1em;
}
.flow_sum p:last-of-type {
	margin: auto;
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.flow_sum {
	width: 220%;
	font-size: 90%;
}
.flow_sum > li {
	padding: 10% 7%;
	border-radius: 1.4em;
}
.flow_sum .time {
	font-size: 95%;
	margin-bottom: .6em;
}
}

/*FLOW: flow_step
---------------------------------------------------------*/
.flow_step {
	list-style: none;
}
.flow_step > li {
	position: relative;
	background-color: #fff;
	padding: 5%;
	margin-bottom: 10%;
}
.flow_step > li:last-of-type {
	margin-bottom: 0;
}
.flow_step > li::after {
	position: absolute;
	content: "";
	background-color: var(--color-base);
	width: 58px;
	aspect-ratio: 58/38;
	clip-path: polygon(0 0, 100% 0, 50% 100%);
	inset: 100% 0 auto 0;
	margin: auto;
}
.flow_step > li:last-of-type:after {
	display: none;
}
.flow_step .step_no {
	position: absolute;
	--deco-bg-color: #E0EDE6;
	line-height: 0.73;
	letter-spacing: .08em;
	left: 5%;
	bottom: 100%;
	margin-bottom: 0;
}
.flow_step .step_title {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: .2em 1.2em;
	margin-bottom: .8em;
}
.flow_step .step_title .com_h__min {
	margin-bottom: 0;
}
.flow_step .step_title .time {
	color: var(--color-mgrn);
	font-size: 113%;
	font-weight: var(--fw-bold);
}
/* PC,Tablet
------------------------------------------*/
@media only screen and (min-width: 768px) {

.flow_step .com_flt .img_r {
	width: 41%;
	margin-top: -10%;
}
}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

.flow_step > li {
	padding: 1px 8% 6%;
	margin-bottom: 20%;
}
.flow_step > li::after {
	width: 10%;
}
.flow_step .step_no {
	font-size: 11vw;
	left: 4%;
}
.flow_step .step_title .time {
	font-size: 95%;
}
.flow_step .com_flt .img_r {
	margin-right: 0;
	margin-top: -12%;
}
}



/*---------------------------------------------------------
 
---------------------------------------------------------*/

/* PC,Tablet
------------------------------------------*/
@media only screen and (min-width: 768px) {

}

/* Mobile (Portrait)
------------------------------------------*/
@media only screen and (max-width: 767px) {

}