@charset "UTF-8";
body{
}
.flow_list li{
	border: solid 1px #C4C4C4;
	border-radius: 24px;
}



/*--------------------------------------------------
**************************************************
  PC用
**************************************************
--------------------------------------------------*/
@media screen and (min-width: 768px) {
	.flow_list li{
		padding: 40px 64px;
		display: flex;
		-webkit-align-items: center;
		align-items: center;
		margin-bottom: 48px;
		position: relative;
		background: #fff;

	}
	
	.flow_list li::after{
		position: absolute;
		content: "";
		bottom: -32px;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		border-right: 32px solid transparent;
		border-left: 32px solid transparent;
		border-top: 32px solid #c4c4c4;
		border-bottom: 0;

	}
	.flow_list li:last-child::after{
		content: none;
	}
	.step{
		text-align: center;
		color: #56B3E7;
		font-family: Poppins;
		font-size: 2.4rem;
		font-weight: 600;
		line-height: 1;
		width: 18%;
		
	}

	.step span{
		display: block;
		font-size: 7.0rem;
		font-weight: 500;

		
	}
	.flow_img{
		border-left: solid 2px #BBE1F5;
		padding: 24px 0;
		width: 18%;
		text-align: center;
	}
	.flow_contents{
		width:59%;
	}
	.flow_icon{
		width: 80px;
		height: 80px;
	}
	.flow_contents dt{
		font-size: 3.4rem;
		font-weight: 900;
		color: #56B3E7;
		margin-bottom: 8px;
	}
	.flow_contents dd{
		font-weight: 500;
	}
}/* End PC */



/*--------------------------------------------------
**************************************************
  SP用
**************************************************
--------------------------------------------------*/
@media screen and (max-width: 767px) {
	.flow_list{
		width: 80%;
		margin: 0 auto;
	}
	.flow_list li{
		padding: 40px 24px;
		margin-bottom: 24px;
		position: relative;
		background: #fff;

	}
	
	.flow_list li::after{
		position: absolute;
		content: "";
		bottom: -16px;
		left: 50%;
		transform: translateX(-50%);
		-webkit-transform: translateX(-50%);
		-ms-transform: translateX(-50%);
		border-right: 16px solid transparent;
		border-left: 16px solid transparent;
		border-top: 16px solid #c4c4c4;
		border-bottom: 0;

	}
	.flow_list li:last-child::after{
		content: none;
	}
	.step{
		text-align: center;
		color: #56B3E7;
		font-family: Poppins;
		font-size: 1.4rem;
		font-weight: 600;
		line-height: 1;

		
	}

	.step span{
		display: block;
		font-size: 4.0rem;
		font-weight: 500;

		
	}
	.flow_img{

		padding: 16px 0;
		text-align: center;
	}
	.flow_contents{
	}
	.flow_icon{
		width: 60px;
		height: 60px;
	}
	.flow_contents dt{
		font-size: 2.0rem;
		font-weight: 900;
		color: #56B3E7;
		margin-bottom: 8px;
		text-align: center;
	}
	.flow_contents dd{
		font-weight: 500;
		font-size: 1.5rem;
	}

	
}/* End SP */
