.flow-container .article-container {
	margin-bottom: 80px;
}

.flow-wrapper {
	position: relative;
}

.flow-content-inner {
	position: relative;
	padding-bottom: 60px;
}

.flow-article-box {
	margin-bottom: 60px;
}

.flow-ttl-fill {
	margin-bottom: 30px;
	padding: 10px 20px;
	background: #e3e1d5;
	font-size: 1.5rem;
}

.flow-img-box {
	width: 50%;
	margin-bottom: 30px;
}

.flow-img-box img {
	vertical-align: top;
}

.flow-stap {
	position: relative;
	margin-top: -50px;
	font-size: 1.5rem;
	text-align: center;
}

.flow-stap::before {
	content: '';
	position: absolute;
	left: 50%;
	display: block;
	width: 1px;
	height: 100%;
	background: #ccc;
	z-index: -1;
}

.flow-step-phase {
	margin-top: 50px;
	padding: 10px;
	background: #e3e1d5;
	font-size: 1.5rem;
}

.flow-step-img {
	display: inline-block;
	width: 30%;
	margin-top: 50px;
}

.flow-stepbox {
	position: relative;
	margin-top: 50px;
	background: #fff;
	border: 1px solid #ccc;
}

.flow-stepbox-img {
	width: 40%;
	float: left;
}

.flow-stepbox-img img {
	vertical-align: middle;
}

.flow-stepbox-content {
	position: absolute;
	top: 50%;
	right: 0;
	transform: translateY(-50%);
	width: 60%;
	padding: 0 40px;
	text-align: left;
	box-sizing: border-box;
	float: right;
}

body.page-template-page-flow .flow-wrapper a {
    color: #9e2330;
}

body.page-template-page-flow .flow-wrapper a {
    text-decoration: none;
}

body.page-template-page-flow .flow-wrapper a:hover {
    text-decoration: underline;
}

body.page-template-page-flow .flow-stepbox-content a {
    text-decoration: underline;
}

body.page-template-page-flow .flow-stepbox-content a:hover {
    text-decoration: none;
}

.flow-stepbox-content a {
	color: #9e2330;
    text-decoration: underline;
}

.flow-stepbox-content a:hover {
    text-decoration: none;
}

.flow-stepbox-ttl {
	margin-bottom: 10px;
	font-size: 2rem;
}

.flow-stepbox-txt {
	font-size: 1.4rem;
}

.flow-openhouse-txt {
	background: url(../images/flow/openhouse_bg.jpg) top right / 250px 250px no-repeat;
}

.flow-financial-txt {
	background: url(../images/flow/financial_bg.jpg) top right / 250px 250px no-repeat;
}


@media screen and (max-width: 640px) {
	.flow-img-box {
		width: 100%;
	}
	.flow-openhouse-txt,
	.flow-financial-txt {
		padding-top: 540px;
		background-size: 480px;
		background-position: top center;
	}

	.flow-step-img {
		width: 50%;
	}

	.flow-stepbox-img {
		width: 100%;
		float: none;
	}

	.flow-stepbox-content {
		position: relative;
		top: auto;
		right: auto;
		transform: translateY(0);
		width: 100%;
		padding: 40px;
		float: none;
	}
}
