@charset "utf-8";
@media screen and (max-width: 767px) {
/*HEADER*/
.keyvisual {
	background-image:url(../images/flowchart/keyvisual.jpg);
	/*background-position-y:bottom;*/
	
}


/*CONTENTS*/


#flowchart section {
	text-align:center;
	overflow:hidden;
	padding:4rem 0;
}
#flowchart section .title-box {
	padding:0 1rem 3rem;
	margin-bottom:2rem;
	border-bottom: solid 1px #999;
}
#flowchart section .title-box h1.title {
	font-size: 24px;
	letter-spacing: 2px;
	border-left: none 0px;
	margin-bottom: 1em;
	padding:0;
}

#flowchart section .title-box p.summary {
	text-align:left;
}
#flowchart section h2.title {
	font-size:24px;
	letter-spacing:2px;
	font-weight:bold;
	border-left:none 0px;
	margin-bottom:40px;
	padding:0 10px 10px;
	display:inline-block;
	border-bottom:solid 4px #C30;
	min-width:100px;
}
#flowchart section .flow-main {
	position:relative;
	padding:2rem;
}
#flowchart section .flow-main:nth-child(odd) {
	background-color:#E5E5E5;
}
#flowchart section .flow-main:nth-child(odd)::after {
	content: "▼";
	color:#E5E5E5;
	font-size:40px;
	line-height:40px;
	transform: scale(4, 1);
	position:absolute;
	bottom:-30px;
	left:0;
	right:0;
	z-index:1;
}
#flowchart section .flow-main:nth-child(even) {
	background-color:#FFF;
}

#flowchart section .flow-main:nth-child(even)::after {
	content:"▼";
	color:#FFF;
	font-size:40px;
	line-height:40px;
	transform: scale(4, 1);
	position:absolute;
	bottom:-30px;
	left:0;
	right:0;
	z-index:1;
}
#flowchart section .flow-main:last-child::after {
	content:"";
}
#flowchart section .flow-sub {
	display:flex;
	align-items:stretch;
	justify-content:space-between;
}
#flowchart section .flow-sub li {
	background-color:#FFF;
	border: solid 1px #999;
	border-radius:6px;
}
#flowchart section .flow-sub h3 {
	font-size:15px;
	padding:10px 20px;
	border-bottom: solid 1px #999;
}
#flowchart section .flow-sub p {
	font-size:12px;
	padding:10px 20px;
	margin:0;
}
#flowchart section .flow-box img,
#flowchart section .flow-img img {
	width:100%;
	height:auto;
}
#flowchart section .flow-box {
	margin-bottom:20px;
}
#flowchart section .flow-img p {
	font-size:12px;
	padding:10px 20px;
}
}

@media screen and (min-width: 768px) {
/*HEADER*/
.keyvisual {
	background-image:url(../images/flowchart/keyvisual.jpg);
	/*background-position-y:bottom;*/
	
}


/*CONTENTS*/


#flowchart section {
	text-align:center;
	overflow:hidden;
	padding:60px 0;
}
#flowchart section .title-box {
	padding-bottom:40px;
	margin-bottom:20px;
	border-bottom: solid 1px #999;
}
#flowchart section .title-box h1.title {
	font-size: 24px;
	letter-spacing: 2px;
	border-left: none 0px;
	margin-bottom: 1em;
	padding:0;
}

#flowchart section .title-box p.summary {
	font-size: 15px;
}
#flowchart section h2.title {
	font-size:20px;
	letter-spacing:2px;
	font-weight:bold;
	border-left:none 0px;
	margin-bottom:40px;
	padding:0 10px 10px;
	display:inline-block;
	border-bottom:solid 4px #C30;
	min-width:100px;
}
#flowchart section .flow-main {
	position:relative;
	padding:40px;
}
#flowchart section .flow-main:nth-child(odd) {
	background-color:#E5E5E5;
}
#flowchart section .flow-main:nth-child(odd)::after {
	content: "▼";
	color:#E5E5E5;
	font-size:40px;
	line-height:40px;
	transform: scale(4, 1);
	position:absolute;
	bottom:-30px;
	left:0;
	right:0;
	z-index:1;
}
#flowchart section .flow-main:nth-child(even) {
	background-color:#FFF;
}

#flowchart section .flow-main:nth-child(even)::after {
	content:"▼";
	color:#FFF;
	font-size:40px;
	line-height:40px;
	transform: scale(4, 1);
	position:absolute;
	bottom:-30px;
	left:0;
	right:0;
	z-index:1;
}
#flowchart section .flow-main:last-child::after {
	content:"";
}
#flowchart section .flow-sub {
	display:flex;
	align-items:stretch;
	justify-content:space-between;
}
#flowchart section .flow-sub li {
	background-color:#FFF;
	border: solid 1px #999;
	border-radius:6px;
}
#flowchart section .flow-sub h3 {
	font-size:15px;
	padding:10px 20px;
	border-bottom: solid 1px #999;
}
#flowchart section .flow-sub p {
	font-size:12px;
	padding:10px 20px;
	margin:0;
}
#flowchart section .flow-box {
	margin-bottom:20px;
}
#flowchart section .flow-img p {
	font-size:12px;
	padding:10px 20px;
}
}