@charset "utf-8";

/* -------------------------------------------------- */
/* PC*/
/* -------------------------------------------------- */

/* page title */
/* -------------------------------------------------- */
.pageFlow {
	background: url(../../../img/flow/flow_title_bg.jpg) no-repeat center center / cover;
}

/* flow */
/* -------------------------------------------------- */
.flowInner {
	margin-top: 70px;
}

.flowBody {
	margin-bottom: 100px;
	padding-bottom: 25px;
	position: relative;
}

.flowBody:before {
	width: 1px;
	height: 100%;
	position: absolute;
	top: 0;
	left: 20px;
	z-index: -1;
	background: #E1E3DE;
	content: '';
}

.flowCont {
	margin-bottom: 60px;
}

.flowContHead {
	margin-bottom: 10px;
}

.flowHeadNum {
	width: 40px;
	height: 40px;
	padding-top: 9px;
	display: inline-block;
	font-size: 2.0rem;
	line-height: 1.0;
	letter-spacing: 0;
	text-align: center;
	color: #FFFFFF;
	background: #3EB134;
	border-radius: 50%;
}

.flowHeadTtl {
	width: calc(100% - 40px);
	padding: 5px 0 0 15px;
	font-size: 2.0rem;
}

.flowContDes {
	padding: 0 0 0 55px;
}

.flowContTxt {
	line-height: 1.8;
}

.flowContactDes {
	margin: 20px 0 0 240px;
}

.flowContactTel {
	padding-right: 70px;
}

.flowContactTelNum {
	margin-bottom: 15px;
	line-height: 1.0;
	color: #3EB134;
}

.flowContactTelNum span,
.flowContactTelNum a {
	font-size: 2.5rem;
	line-height: 1.0;
	letter-spacing: 0.1em;
	color: #3EB134;
}

.flowContactBtn {
	width: 300px;
}

.flowContactGuide {
	font-size: 1.4rem;
	line-height: 1.0;
	color: #666666;
}

.flowContactLink {
	display: block;
	padding: 21px 0 20px;
	line-height: 1.0;
	font-size: 1.4rem;
	text-align: center;
	color: #3EB134;
	border: 1px solid #3EB134;
	border-radius: 15px;
	transition: all .3s ease-in-out;
}

.flowContactLink:before {
	width: 20px;
	height: 16px;
	margin-right: 15px;
	display: inline-block;
	background: url(../../../img/common/icon_mail.svg) no-repeat 0 0 / 100%;
	content: '';
	vertical-align: -3px;
}

.flowDesBox {
	margin-top: 15px;
	padding: 30px 30px 35px;
	background: #F2F4EC;
	border-radius: 5px;
}

.flowBoxHead {
	margin-bottom: 15px;
	line-height: 1.0;
}

.flowBoxHead:before {
	width: 10px;
	height: 2px;
	margin-right: 8px;
	display: inline-block;
	background: #3EB134;
	content: '';
	vertical-align: 5px;
}

.flowBoxList {
	margin-bottom: 30px;
	padding-left: 20px;
}

.flowBoxItem {
	margin-bottom: 15px;
}

.flowBoxBtn {
	display: inline-block;
	width: 155px;
	margin-left: 18px;
}

.btnflowBoxLink {
	padding: 7px 0;
	font-size: 1.4rem;
	background: #FFFFFF;
	border-radius: 10px;
	letter-spacing: 0;
}

.btnflowBoxLink:after {
	width: 7px;
	height: 7px;
	margin-top: -5px;
	right: 9px;
}

/* history */
/* -------------------------------------------------- */
#history {
	margin-bottom: 110px;
	padding-top: 110px;
}

.historyTtl {
	margin-bottom: 50px;
	letter-spacing: 0.17em;
}

.historyColDazaifu {
	padding-right: 20px;
}

.historyColOgori {
	padding-left: 20px;
}

.hisotyColTtl {
	margin-bottom: 30px;
	padding: 14px 0;
	font-size: 2.0rem;
	line-height: 1.0;
	text-align: center;
	color: #3EB134;
	border: 1px solid #3EB134;
}

.historyColHead {
	margin-bottom: 25px;
	font-size: 2.2rem;
	line-height: 1.0;
	text-align: center;
}

.historyColBox {
	display: flex;
}

.hisotyColTxt {
	padding-left: 24px;
	font-size: 1.4rem;
	line-height: 1.8;
}

.historyArr {
	margin: 30px auto 30px;
	text-align: center;
}

.hisotyArrTxt {
	font-size: 2.2rem;
	line-height: 1.0;
	color: #FFFFFF;
}


/* -------------------------------------------------- */
/* TAB&SP */
/* -------------------------------------------------- */
@media screen and (min-width: 1025px) {
	.flowContactLink:hover {
		color: #FFFFFF;
		background: #3EB134;
	}

	.flowContactLink:hover:before {
		background: url(../../../img/common/icon_mail_w.svg) no-repeat 0 0 / 100%;
	}
}


@media screen and (max-width: 1024px) {
	.pageFlow {
		background: url(../../../img/flow/mv_sp.jpg) no-repeat center center / cover;
	}
	
	.flowContactTel {
		display: inline-block;
		width: auto !important;
		margin-right: 5%;
		padding-right: 0;
	}

	.flowContactDes {
		margin: 21px 0 0 10%;
	}

	.historyColDazaifu {
		padding-right: 0px;
		margin-bottom: 20px;
	}
}


/* -------------------------------------------------- */
/* TAB(調整) */
/* -------------------------------------------------- */
@media screen and (min-width: 768px) and (max-width: 1024px) {

}

/* -------------------------------------------------- */
/* SP(調整) */
/* -------------------------------------------------- */
@media screen and (max-width: 767px) {

	/* flow */
	/* -------------------------------------------------- */
	.flowContactDes {
		margin: 21px 0 0 5%;
	}

	.flowContactTel {
		width: 100% !important;
	}

	.flowContactBtn {
		width: 100%;
		max-width: 300px;
		margin-top: 25px;
	}
}

@media screen and (max-width: 374px) {

	/* history */
	/* -------------------------------------------------- */
	.historyColBox {
		display: block;
		text-align: center;
	}

	.hisotyColTxt {
		margin-top: 15px;
		padding-left: 0px;
		line-height: 1.8;
		text-align: left;
	}
}