@charset "UTF-8";

div.CaseFlow{
	display:flex;
	gap:60px;
}
div.CaseFlow .CaseFlowChild{
	flex-basis:calc(50% - 30px);
	font-weight:bold;
	position:relative;
	padding:15px 10px 15px;
}
div.CaseFlow .CaseFlowChild:first-child:after{
	content:"";
	display:inline-block;
	border:5px solid rgba(255, 255, 255, 0);
	border-top-color:var(--color-pgray5);
	border-right-color:var(--color-pgray5);
	width:20px;
	height:20px;
	transform:rotate(45deg);
	position:absolute;
	right:-40px;
	top:calc(50% - 21px);
}
div.CaseFlow .CaseFlowChild:first-child + .CaseFlowChild{
	border:3px solid var(--color-pred2);
	box-sizing;border-box;
}
div.CaseFlow .CaseFlowChild:first-child + .CaseFlowChild dt span{
	border-bottom:2px solid var(--color-pred2);
	padding:0 10px;
}
div.CaseFlow .CaseFlowChild dt{
	margin-bottom:20px;
	font-size:120%;
}
.caseAreaInner h4 span{
	margin-right:1em;
}
.caseAreaInner h4 span b{
	font-size:130%;
}
.column__type2 [class^="BoxPattern"]{
	padding:0;
	background:var(--color-pwhite);
}
.column__type2 [class^="BoxPattern"] .Inner{
	padding:calc(var(--unit) * 2);
	margin:inherit;
}
.column__type2 [class^="BoxPattern"] h3{
	font-size:1.375rem;
	background:var(--color-pred2);
}

/* 装飾 */
ul.CircleListStyle {
	list-style:none;
	padding-left:1em;
}
ul.CircleListStyle li::marker {
	content: "・";
}
#caseArea.manualDescribe div.caseFlowDiagram{
	display:flex;
	overflow:hidden;
	margin-bottom:35px;
}
#caseArea.manualDescribe div.caseFlowDiagram dl{
	background:#FFF;
	position:relative;
	padding:10px 20px 10px 40px;
	flex-basis:25%;
}
#caseArea.manualDescribe div.caseFlowDiagram dl:first-child{
	padding-left:15px;
}
#caseArea.manualDescribe div.caseFlowDiagram dl:not(:last-child):after{
	content:"";
	display:block;
	width:14rem;
	height:14rem;
	transform:translateY(-50%) scaleX(0.5) rotate(45deg);
	position:absolute;
	right:-4em;
	top:50%;
	z-index:1;
	border-top:15px solid var(--color-pgray1);
	border-right:15px solid var(--color-pgray1);
}
#caseArea.manualDescribe div.caseFlowDiagram dt{
	font-weight:bold;
	font-size:115%;
	position:relative;
	z-index:2;
	margin-top:var(--unit);
}
#caseArea.manualDescribe div.caseFlowDiagram dt > mark{
	position:relative;
	font-size:1em;
	width:2em;
	height:2em;
	padding:var(--unit);
	color:var(--color-pred2);
	background:none;
	border:3px solid var(--color-pred2);
	border-radius:50%;
	line-height:1;
	left:0;
	display:flex;
	align-items: center;
	justify-content:center;
}
#caseArea.manualDescribe div.caseFlowDiagram dd{
	position:relative;
	z-index:2;
}
@media screen and (max-width:994px){
	.JS #caseArea.manualDescribe div.caseFlowDiagram dl{
		padding-top:10px;
		padding-left:20px;
	}
	.JS #caseArea.manualDescribe div.caseFlowDiagram dl:nth-of-type(n + 2){
		padding-top:40px;
	}
	.JS #caseArea.manualDescribe div.caseFlowDiagram{
		flex-direction:column;
		max-width:400px;
		margin:0 auto 35px;
	}
	.JS #caseArea.manualDescribe div.caseFlowDiagram dl:last-child{ padding-bottom:30px; }
	.JS #caseArea.manualDescribe div.caseFlowDiagram dl:not(:last-child):after{
		transform:scaleX(7) rotate(135deg);
		right:calc(50% - 5em);
		top:auto;
		bottom:-1em;
		width:10em;
		height:10em;
		border-top-width:10px;
		border-right-width:10px;
	}
}
@media screen and (max-width:768px){
	.JS div.CaseFlow{ flex-direction:column; }
	.JS div.CaseFlow .CaseFlowChild:first-child:after{
		top:auto;
		bottom:-40px;
		right:calc(50% - 21px);
		transform:rotate(135deg);
	}
	[class^="BoxPattern"] ul:not(:last-child){
		margin-bottom:inherit;
	}
}