@charset "utf-8";
/* CSS Document */

.printSolution {
}

.flow_lists {
	display: flex;
	flex-wrap: wrap;
	background: var(--color_lightgreen);
	.flow_list {
		display: flex;
		align-items: center;
		width: 20.5%;
		overflow: hidden;
		background-color: #fff;
		position: relative;
	}
	.flow_list:before {
		position: absolute;
		top: -2px;
		left: 0;
		background: var(--color_lightgreen);
	}
	.flow_list:first-child {
		width: 18%;
	}
	.flow_list:last-child {
		color: yellow;
		font-weight: bold;
		background-color: inherit;
	}
	.flow_list:before,
	.flow_list:after {
		content: '';
		clip-path: polygon(0 0, 0% 100%, 100% 50%);
		display: block;
	}
	.flow_list:after {
		position: absolute;
		top: 50%;
		left: 0;
		transform: translateY(-50%);
		-webkit-transform: translateY(-50%);
		background: #fff;
	}
	.flow_list:first-child:before,
	.flow_list:first-child:after {
		content: none;
	}
	.flow_list span {
	}
}

.printSolution_lists {
	.printSolution_list {
		display: grid;
		border-bottom: 1px dotted #808080;
	}
	.printSolution_list:last-child {
		border-bottom: none;
	}
	.printSolution_list_title {
		grid-column: 2;
		align-self: end;
		color: var(--color_lightgreen);
	}
	.printSolution_list_thumbnail {
		grid-column: 1 / 2;
		grid-row: 1 / 3;
	}
	.printSolution_list_image {
		display: block;
		width: 100%;
	}
	.printSolution_list_text {
		grid-column: 2;
	}
}

/* --------------------------------------------------
PC
-------------------------------------------------- */
@media screen and (min-width: 768px) {
	.printSolution {
	}

	.flow_lists {
		height: 50px;
		margin-bottom: 20px;
		padding: 2px;
		.flow_list {
			padding-left: 25px;
		}
		.flow_list:first-child {
			padding-left: 15px;
		}
		.flow_list:last-child {
		}
		.flow_list:before {
			width: 20px;
			height: 70px;
			margin-top: -10px;
		}
		.flow_list:after {
			width: 18px;
			height: 64px;
		}
		.flow_list span {
		}
	}
	.printSolution_lists {
		.printSolution_list {
			grid-template-columns: 100px 1fr;
			column-gap: 20px;
			padding: 20px 0;
		}
		.printSolution_list_title {
			font-size: 15px;
			margin-bottom: 5px;
		}
		.printSolution_list_thumbnail {
		}
		.printSolution_list_image {
		}
		.printSolution_list_text {
			font-size: 13px;
		}
	}
}


/* --------------------------------------------------
スマホ
-------------------------------------------------- */
@media all and (max-width: 767px) {
	.printSolution {
	}

	.flow_lists {
		height: 20vw;
		margin-bottom: 5vw;
		padding: 2px;
		.flow_list {
			font-size: 3vw;
			line-height: 1.3;
			padding-left: 5.5vw;
		}
		.flow_list:first-child {
			padding-left: 3vw;
		}
		.flow_list:last-child {
		}
		.flow_list:before {
			width: 5vw;
			height: 24vw;
			margin-top: -2vw;
		}
		.flow_list:after {
			width: 4.5vw;
			height: 22vw;
		}
		.flow_list span {
		}
	}
	.printSolution_lists {
		.printSolution_list {
			grid-template-columns: 20vw 1fr;
			column-gap: 5vw;
			padding: 5vw 0;
		}
		.printSolution_list_title {
			font-size: 3.5vw;
			line-height: 1.4;
			margin-bottom: 1vw;
		}
		.printSolution_list_thumbnail {
		}
		.printSolution_list_image {
		}
		.printSolution_list_text {
			font-size: 3.25vw;
		}
	}
}