@charset "UTF-8";

/* intro
---------------------------------------------- */
.intro{
	padding: 110px 0;
}
	.introDes{
		margin: 30px auto 40px;
		font-size: 18px;
		line-height: 2.3;
		letter-spacing: .1em;
		text-align: center;
	}
	.introImg{
	}
		.intro .annotation{
			font-size: 11px;
			margin-top: 5px;
			text-align: right;
		}

@media screen and (max-width: 1000px){
	.introDes{
		font-size: 16px;
	}
}

@media screen and (max-width: 768px){
	.intro{
		padding-top: 50px;
		padding-bottom: 50px;
	}
		.introDes{
			margin: 15px auto 25px;
			font-size: 14px;
			line-height: 1.93;
			text-align: justify;
			text-justify: inter-ideograph;
		}

		.intro .annotation{
			font-size: 10px;
			text-align: left;
		}

}

/* merit
---------------------------------------------- */
.merit{
	padding-top: 110px;
	padding-bottom: 120px;
}
	.meritWrap{
		margin-top: 70px;
	}
		.meritList{
		}
			.meritList li{
				position: relative;
				width: 31.818182%;
				padding: 30px 40px;
				background: #fff;
			}
			.meritList li::after{
				content: '';
				position: absolute;
				right: 0;
				bottom: 0;
				border-top: 30px solid transparent;
				border-right: 30px solid #e5efe8;
			}
				.meritListTtl{
					font-size: 24px;
					letter-spacing: .1em;
					text-align: center;
					border-bottom: 1px solid #aeceb8;
					padding-bottom: 10px;
				}
				.meritListDes{
					padding-top: 10px;
					font-size: 16px;
					line-height: 2.125;
					letter-spacing: .08em;
					text-align: justify;
					text-justify: inter-ideograph;
				}

@media screen and (max-width: 1200px){
	.meritListTtl{
		font-size: 20px;
		letter-spacing: .08em;
	}
}
@media screen and (max-width: 1000px){
	.meritListTtl{
		font-size: 18px;
		letter-spacing: .05em;
	}
}

@media screen and (max-width: 768px){
	.merit{
		padding-top: 45px;
		padding-bottom: 50px;
	}
		.meritWrap{
			margin-top: 25px;
		}
			.meritList{
				margin-top: -30px;
			}
				.meritList li{
					width: 100%;
					padding: 30px 30px;
					margin-top: 30px;
				}
					.meritListTtl{
						font-size: 20px;
						letter-spacing: .1em;
					}
					.meritListDes{
						font-size: 14px;
					}
}

/* question
---------------------------------------------- */
.question{
	padding: 110px 0;
}
	.questionWrap{
		margin-top: 80px;
	}
		.questionList{
		}
			.questionList li{
				width: 20.909091%;
			}
				.questionBox{
					background: #f5f2e9;
				}
					.questionImg{
						position: relative;
					}
						.questionImg .icon_q{
							position: absolute;
							width: 21.73914%;
							bottom: -15px;
							left: 6.5217392%;
						}
					.questionTxtBox{
						padding: 25px;
					}
						.questionTxt{
							position: relative;
							font-size: 16px;
							line-height: 2;
							text-align: center;
						}
						.questionTxt::after{
							content: '';
							position: absolute;
							bottom: -45px;
							left: 50%;
							transform: translateX(-50%);
							border-top: 20px solid #f5f2e9;
							border-right: 15px solid transparent;
							border-left: 15px solid transparent;
						}

					.answerBox{
						margin-top: 25px;
					}
						.answerBox img{
							float: left;
							width: 28.2608691%;
							margin-right: 10px;
						}
						.answerTxt{
							font-size: 16px;
							line-height: 2;
							letter-spacing: .15em;
							padding-top: 5px;
							text-align: justify;
							text-justify: inter-ideograph;
						}

@media screen and (max-width: 1100px){
	.questionTxtBox{
		padding: 15px;
	}
		.questionTxt{
			font-size: 14px;
			line-height: 1.6;
		}
		.questionTxt::after{
			bottom: -35px;
		}
		.answerTxt{
			font-size: 14px;
			line-height: 1.7;
			letter-spacing: .1em;
		}
}

@media screen and (max-width: 768px){
	.question{
		padding: 50px 0;
	}
		.question .inner{
			width: 90%;
		}
		.questionWrap{
			margin-top: 80px;
		}
			.questionList{
				margin-top: -80px;
			}
				.questionList li{
					width: 46.783626%;
					margin-top: 80px;
				}
					.questionBox{
						position: relative;
						padding-top: 50%;
					}
					.questionImg{
						position: absolute;
						top: -31.25%;
						left: 50%;
						transform: translateX(-50%);
						width: 87.5%;
						max-width: 200px;
					}
						.questionImg .icon_q{
							bottom: -10.714285%;
							left: -5px;
							width: 28.571428%;
							max-width: 40px;
						}
					.questionTxtBox{
						padding: 0 8px 15px;
					}
						.questionTxt{
							position: relative;
							font-size: 13px;
							line-height: 1.8;
						}
						.questionTxt::after{
							border-right: 20px solid transparent;
							border-left: 20px solid transparent;
						}

					.answerBox{
						margin-top: 25px;
					}
						.answerBox img{
							display: block;
							width: 28.125%;
							max-width: 45px;
							margin-right: 4.375%;
						}
						.answerTxt{
							font-size: 13px;
							line-height: 2;
							padding-top: 0;
						}
}


/* targetParts
---------------------------------------------- */
.targetParts{
	padding: 110px 0;
}
	.targetPartsDes{
		font-size: 18px;
		line-height: 2.3;
		letter-spacing: .1em;
		margin-top: 35px;
		text-align: center;
	}
	.targetPartsWrap{
		margin-top: 50px;
		/* margin-bottom: 25px; */
	}
		.targetPartsList{
		}
			.targetPartsList li{
				width: 47.727273%;
			}

@media screen and (max-width: 768px){
	.targetParts{
		padding: 45px 0;
	}
		.targetPartsDes{
			font-size: 14px;
			line-height: 1.9;
			letter-spacing: .08em;
			margin-top: 30px;
			text-align: justify;
			text-justify: inter-ideograph;
		}
		.targetPartsWrap{
			margin-top: 30px;
			/* margin-bottom: 20px; */
		}
			.targetPartsList{
				margin-top: -30px
			}
				.targetPartsList li{
					width: 100%;
					margin-top: 30px;
				}
}

/* m_flow
---------------------------------------------- */
.m_flow{
	padding-top: 110px;
	padding-bottom: 60px;
}
	.m_flowWrap{
		margin-top: 60px;
		/* margin-bottom: 25px; */
	}
		.m_flowList{
		}
			.m_flowList li{
				position: relative;
				width: 22.272728%;
				padding: 40px 20px 20px;
				border: 1px solid #006e38;
			}
			.m_flowList li::after{
				content: '';
				position: absolute;
				top: 50%;
				right: -20px;
				transform: translateY(-50%);
				border-top: 15px solid transparent;
				border-bottom: 15px solid transparent;
				border-left: 20px solid #006e38;
			}
			.m_flowList li:last-child::after{
				content: none;
			}
				.m_flowList li img{
					position: absolute;
					top: 0;
					left: 0;
					width: 18.367346%;
				}
				.m_flowListTtl{
					font-size: 24px;
					letter-spacing: .1em;
					margin-bottom: 10px;
					text-align: center;
				}
				.m_flowListDes{
					font-size: 16px;
					line-height: 2;
					text-align: justify;
					text-justify: inter-ideograph;
				}

@media screen and (max-width: 1000px){
	.m_flowListTtl{
		font-size: 20px;
		letter-spacing: .05em;
	}
	.m_flowListDes{
		font-size: 14px;
	}
}

@media screen and (max-width: 768px){
	.m_flow{
		padding-top: 45px;
		padding-bottom: 45px;
	}
		.m_flowWrap{
			margin-top: 40px;
			margin-bottom: 0;
		}
			.m_flowList{
				margin-top: -30px;
			}
				.m_flowList li{
					width: 100%;
					margin-top: 30px;
					padding: 10px 25px 15px;
				}
				.m_flowList li::after{
					top: auto;
					right: 50%;
					bottom: -20px;
					transform: translate(50%, 0);
					border-top: 20px solid #006e38;
					border-right: 15px solid transparent;
					border-bottom: none;
					border-left: 15px solid transparent;
				}
					.m_flowList li img{
						width: 14.0625%;
					}
					.m_flowListTtl{
						letter-spacing: .08em;
						margin-bottom: 1%;
						/* text-align: center; */
					}
					.m_flowListDes{
					}

}