@charset "utf-8";

/*--------------------------------------
vis
---------------------------------------*/
#visArea {
	position: relative;
	margin: 0 0 12rem 0;
	background: #fffdf6 url(img/vis_bg_01.png) repeat center center;
	border-top: 4px solid #21a937;
}
#visArea .mainArea {
	width: 1100px;
	min-height: 460px;
	margin: 0 auto;
	padding: 8rem 0 8rem 4rem;
	background: #fff url(img/vis_bg_02.png) no-repeat right bottom;
}
#visArea .mainTxtBox .catch {
	width: 450px;
	margin: 0 0 2.5rem 0;
	color: #21a937;
	font-size: 3.4rem;
	font-weight: 500;
}
#visArea .mainTxtBox .txtArea {
	width: 410px;
	margin: 0;
	padding: 0;
}

/*--------------------------------------
addParts
---------------------------------------*/
.titleArea {
	position: relative;
	padding: 3.5rem 0 0 0;
}
.titleArea .enTtl {
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	z-index: 1;
}
.partTtl {
	position: relative;
	margin: 0 auto 3rem auto;
	padding: 3.5rem 12rem 2rem 12rem;
	background: url(img/h1_bg_01.png) repeat center center;
	border: 3px solid #1a9b2e;
	font-family: "Noto Sans Japanese", sans-serif;
	font-size: 3rem;
	font-weight: 700;
	line-height: 1.4;
	text-align: center;
}
.partTtl::before {
	position: absolute;
	left: 0.5rem;
	top: 0.5rem;
	width: 113px;
	height: 76px;
	background: url(img/h1_bg_02.png) no-repeat left top;
	background-size: 100% auto;
	content: "";
}
.partTtl::after {
	position: absolute;
	right: 0.5rem;
	bottom: 0.5rem;
	width: 77px;
	height: 48px;
	background: url(img/h1_bg_03.png) no-repeat left top;
	background-size: 100% auto;
	content: "";
}
.partTxt {
	width: 90%;
	margin: 0 auto 4rem auto;
}
.enTtl .step {
	width: 50%;
	padding: 1rem 0 0 1.5rem;
	font-size: 1.6rem;
	text-align: center;
}
.enTtl .num {
	width: 50%;
	padding: 0 1.5rem 0 0;
	font-size: 3.6rem;
	text-align: center;
}

/*--------------------------------------
addParts01
---------------------------------------*/
.addParts01 {
	clear: both;
	margin: 0 0 8rem 0;
}
.addParts01 .note {
	width: 90%;
	margin: 0 auto;
	font-size: 1.2rem;
}

/*--------------------------------------
addParts02
---------------------------------------*/
.addParts02 {
	clear: both;
	margin: 0 0 8rem 0;
}
.companyArea {
	clear: both;
	background: #f6f2eb;
}
.companyArea::after {
	clear: both;
	display: block;
	content: "";
}
.companyArea .name {
	position: relative;
	margin: 0;
	padding: 2.1rem 7rem;
	background: #189a2d;
	color: #fff;
	font-family: "Noto Sans Japanese", sans-serif;
	font-size: 2.8rem;
	font-weight: 700;
	line-height: 1.4;
	text-align: center;
}
.companyArea .name::before {
	position: absolute;
	left: 0.5rem;
	top: 0.5rem;
	width: 66px;
	height: 67px;
	background: url(img/h2_bg_01.png) no-repeat left top;
	background-size: 100% auto;
	content: "";
}
.companyArea .name::after {
	position: absolute;
	right: 0.5rem;
	bottom: 0.5rem;
	width: 77px;
	height: 48px;
	background: url(img/h2_bg_02.png) no-repeat left top;
	background-size: 100% auto;
	content: "";
}
.companyArea .boxTtl {
	clear: both;
	margin: 6rem 0 4rem 0;
	padding: 1.8rem 0 2rem 0;
	border-top: 2px solid #21a937;
	border-bottom: 1px solid #21a937;
	color: #189a2d;
	font-family: "Noto Sans Japanese", sans-serif;
	font-size: 2.4rem;
	font-weight: 700;
	line-height: 1.4;
	text-align: center;
}
.companyArea .inner {
	padding: 4rem;
}
.block-summary::after {
	clear: both;
	display: block;
	content: "";
}
.block-summary .box-txt {
	float: left;
	width: calc(100% - 320px);
	margin: 0 4rem 0 0;
}
.block-summary .box-fig {
	float: left;
	width: 280px;
	text-align: center;
}
.block-summary .catch {
	margin: 0 0 1.5rem 0;
	color: #f07100;
	font-size: 1.8rem;
}
.block-summary table {
	width: 100%;
	margin: 2.5rem 0 0 0;
	border: 1px solid #f3780a;
}
.block-summary table th {
	width: 36%;
	padding: 1.5rem;
	background: #f6d6a9;
	border: 1px solid #f3780a;
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1.4;
	text-align: center;
	word-break: break-all;
}
.block-summary table td {
	padding: 1.5rem;
	background: #fff;
	border: 1px solid #f3780a;
	font-size: 1.6rem;
	font-weight: bold;
	line-height: 1.4;
	text-align: center;
	word-break: break-all;
}
.block-summary table td span {
	font-size: 2.8rem;
}
.addParts02 .boxPart .personR,
.addParts02 .boxPart .personL {
	margin: 0 0 3rem 0;
}
.addParts02 .boxPart .personR .person {
	float: right;
	padding: 2rem 0 0 0
}
.addParts02 .boxPart .personL .person {
	float: left;
	padding: 2rem 0 0 0
}
.addParts02 .boxPart .fuki {
	position: relative;
	width: 624px;
	padding: 2.5rem 3.5rem 1.5rem 3.5rem;
	background: #d5ebde;
	border-radius: 2rem;
}
.addParts02 .boxPart .personL .fuki {
	float: right;
}
.addParts02 .boxPart .personL .fuki::before {
	position: absolute;
	left: -1.5rem;
	top: 5rem;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 10px 16px 10px 0;
	border-color: transparent #d5ebde transparent transparent;
	content: "";
}
.addParts02 .boxPart .personR .fuki::before {
	position: absolute;
	right: -1.5rem;
	top: 5rem;
	width: 0;
	height: 0;
	border-style: solid;
	border-width: 10px 0 10px 16px;
	border-color: transparent transparent transparent #d5ebde;
	content: "";
}
.addParts02 .boxPart .personR .fuki p,
.addParts02 .boxPart .personL .fuki p {
	margin: 0;
}
.addParts02 .boxPart .fuki .catch {
	margin: 0 0 1.5rem 0;
	font-size: 1.8rem;
}
.addParts02 .boxPart .fuki .caption {
	margin: 1rem 0 0 0;
	text-align: right;
}
.addParts02 .boxPart ul {
	margin: 3rem 0;
	padding: 0;
}
.addParts02 .boxPart ul li {
	position: relative;
	padding: 0 0 0.5rem 2.1rem;
}
.addParts02 .boxPart ul li:last-child {
	padding: 0 0 0 2.1rem;
}
.addParts02 .boxPart ul li::before {
	position: absolute;
	left: 0;
	top: 0.7rem;
	width: 10px;
	height: 10px;
	background: #f07100;
	border-radius: 50%;
	content: "";
}
.block-feature {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	margin: 0 0 8rem 0;
}
.block-feature .box {
	width: 48.5%;
	padding: 3rem;
	background: #fff;
	border-radius: 1rem;
}
.block-feature .box .ttl {
	position: relative;
	min-height: 35px;
	margin: 0 0 1.5rem 0;
	padding: 0 0 0 4rem;
	font-size: 2.2rem;
}
.block-feature .box .ttl::before {
	position: absolute;
	left: -1.5rem;
	top: -1.5rem;
	width: 48px;
	height: 49px;
	background: url(img/parts02_bg_01.png) no-repeat left top;
	background-size: 100% auto;
	content: "";
}

/*--------------------------------------
addParts03
---------------------------------------*/
.addParts03 {
	clear: both;
	margin: 0 -200%;
	padding: 5rem 200%;
	background: #f3faf5;
}
.addParts03 .enTtl {
	background: url(img/engtit_bg_02.png) no-repeat center top;
}
.addParts03 .float-wrap .ttl {
	margin: 0 0 2rem 0;
	color: #21a937;
	font-size: 2.2rem;
}
.addParts03 .float-wrap .ttl a {
	padding: 0 2.5rem 0 0;
	background: url(img/arrow01_green.png) no-repeat right center;
	background-size: 14px auto;
	color: #21a937;
	text-decoration: none;
}

/*--------------------------------------
addParts04
---------------------------------------*/
.addParts04 {
	clear: both;
	margin: 0;
	padding: 5rem 0;
}



/* SP -------------------------------------------------------------------------------------------------------------------------- */

@media screen and (max-width: 599px) {
/*--------------------------------------
vis
---------------------------------------*/
#visArea {
	position: relative;
	margin: 0 0 4rem 0;
	padding: 0 2rem;
	background: #fffdf6 url(img/vis_bg_01.png) repeat center center;
	border-top: 4px solid #21a937;
}
#visArea .mainArea {
	width: 100%;
	min-height: auto;
	margin: 0 auto;
	padding: 1.5rem;
	background: #fff;
	background-image: none;
}
#visArea .mainTxtBox .catch {
	width: 100%;
	margin: 0 0 1.5rem 0;
	color: #21a937;
	font-size: 2.1rem;
	font-weight: 500;
}
#visArea .mainTxtBox .txtArea {
	width: 100%;
	margin: 0;
	padding: 0;
}
#visArea .fig {
	margin: 0 0 1.5rem 0;
	text-align: center;
}

/*--------------------------------------
addParts
---------------------------------------*/
.titleArea {
	position: relative;
	padding: 3.5rem 0 0 0;
}
.titleArea .enTtl {
	position: absolute;
	left: 50%;
	top: 0;
	transform: translateX(-50%);
	z-index: 1;
}
.partTtl {
	position: relative;
	margin: 0 auto 3rem auto;
	padding: 3.5rem 2rem 2rem 2rem;
	background: url(img/h1_bg_01.png) repeat center center;
	border: 3px solid #1a9b2e;
	font-size: 2.4rem;
	text-align: center;
}
.partTtl::before {
	position: absolute;
	left: 0.5rem;
	top: 0.5rem;
	width: 70px;
	height: 50px;
	background: url(img/h1_bg_02.png) no-repeat left top;
	background-size: 100% auto;
	content: "";
}
.partTtl::after {
	position: absolute;
	right: 0.5rem;
	bottom: 0.5rem;
	width: 48px;
	height: 30px;
	background: url(img/h1_bg_03.png) no-repeat left top;
	background-size: 100% auto;
	content: "";
}
.partTxt {
	width: 100%;
	margin: 0 auto 3rem auto;
}
.enTtl .step {
	width: 50%;
	padding: 1.5rem 0 0 1.5rem;
	font-size: 1.6rem;
	text-align: center;
}
.enTtl .num {
	width: 50%;
	padding: 0 1rem 0 0;
	font-size: 3.6rem;
	text-align: center;
}

/*--------------------------------------
addParts01
---------------------------------------*/
.addParts01 {
	clear: both;
	margin: 0 0 4rem 0;
	padding: 0 1rem;
}
.addParts01 .note {
	width: 100%;
	margin: 0 auto;
	font-size: 1.2rem;
}

/*--------------------------------------
addParts02
---------------------------------------*/
.addParts02 {
	clear: both;
	margin: 0 0 4rem 0;
	padding: 0 1rem;
}
.companyArea {
	clear: both;
	background: #f6f2eb;
}
.companyArea::after {
	clear: both;
	display: block;
	content: "";
}
.companyArea .name {
	position: relative;
	margin: 0 auto;
	padding: 2.1rem 2rem;
	background: #189a2d;
	color: #fff;
	font-size: 2.1rem;
	text-align: center;
}
.companyArea .name::before {
	position: absolute;
	left: 0.5rem;
	top: 0.5rem;
	width: 40px;
	height: 41px;
	background: url(img/h2_bg_01.png) no-repeat left top;
	background-size: 100% auto;
	content: "";
}
.companyArea .name::after {
	position: absolute;
	right: 0.5rem;
	bottom: 0.5rem;
	width: 48px;
	height: 30px;
	background: url(img/h2_bg_02.png) no-repeat left top;
	background-size: 100% auto;
	content: "";
}
.companyArea .boxTtl {
	clear: both;
	margin: 4rem 0 2rem 0;
	padding: 1.4rem 0 1.5rem 0;
	border-top: 2px solid #21a937;
	border-bottom: 1px solid #21a937;
	color: #189a2d;
	font-family: "Noto Sans Japanese", sans-serif;
	font-size: 2rem;
	font-weight: 700;
	line-height: 1.4;
	text-align: center;
}
.companyArea .inner {
	padding: 1.5rem;
}
.block-summary::after {
	clear: both;
	display: block;
	content: "";
}
.block-summary .box-txt {
	float: none;
	width: 100%;
	margin: 0 0 2rem 0;
}
.block-summary .box-fig {
	float: none;
	width: 100%;
	text-align: center;
}
.block-summary .catch {
	margin: 0 0 1.5rem 0;
	color: #f07100;
	font-size: 1.8rem;
}
.block-summary table {
	width: 100%;
	margin: 2.5rem 0 0 0;
	border: 1px solid #f3780a;
}
.block-summary table th {
	width: 38%;
	padding: 1rem;
	background: #f6d6a9;
	border: 1px solid #f3780a;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 1.4;
	text-align: center;
	word-break: break-all;
}
.block-summary table td {
	padding: 1rem;
	background: #fff;
	border: 1px solid #f3780a;
	font-size: 1.4rem;
	font-weight: bold;
	line-height: 1.4;
	text-align: center;
	word-break: break-all;
}
.block-summary table td span {
	font-size: 2.4rem;
}
#contents .addParts02 .boxPart .personBox:first-of-type {
	margin: 5rem 0;
}
#contents .addParts02 .boxPart .personR,
#contents .addParts02 .boxPart .personL {
	position: relative;
	margin: 0 0 5rem 0;
}
#contents .addParts02 .boxPart .person,
#contents .addParts02 .boxPart .personR .person {
	float: none;
	position: absolute;
	left: 50%;
	top: 0;
	transform: translate(-50%, -50%);
	width: 60px;
	padding: 0;
	z-index: 1;
}
#contents .addParts02 .boxPart .fuki {
	position: relative;
	width: 100%;
	padding: 4rem 2rem 2rem 2rem;
	background: #d5ebde;
	border-radius: 2rem;
}
#contents .addParts02 .boxPart .personR .fuki::before,
#contents .addParts02 .boxPart .personL .fuki::before {
	content: none;
}
#contents .addParts02 .boxPart .personR .fuki p,
#contents .addParts02 .boxPart .personL .fuki p {
	margin: 0;
}
#contents .addParts02 .boxPart .fuki .caption {
	margin: 1rem 0 0 0;
	text-align: right;
}
.addParts02 .boxPart ul {
	margin: 3rem 0;
	padding: 0;
}
.addParts02 .boxPart ul li {
	position: relative;
	padding: 0 0 0.5rem 2.1rem;
}
.addParts02 .boxPart ul li:last-child {
	padding: 0 0 0 2.1rem;
}
.addParts02 .boxPart ul li::before {
	position: absolute;
	left: 0;
	top: 0.7rem;
	width: 10px;
	height: 10px;
	background: #f07100;
	border-radius: 50%;
	content: "";
}
.block-feature {
	display: block;
	margin: 0 0 4rem 0;
}
.block-feature .box {
	width: 100%;
	margin: 0 0 2rem 0;
	padding: 1.5rem;
	background: #fff;
	border-radius: 1rem;
}
.block-feature .box .ttl {
	position: relative;
	min-height: 32px;
	margin: 0 0 1.5rem 0;
	padding: 0 0 0 4rem;
	font-size: 2rem;
}
.block-feature .box .ttl::before {
	position: absolute;
	left: -0.5rem;
	top: -0.5rem;
	width: 36px;
	height: 37px;
	background: url(img/parts02_bg_01.png) no-repeat left top;
	background-size: 100% auto;
	content: "";
}

/*--------------------------------------
addParts03
---------------------------------------*/
.addParts03 {
	clear: both;
	margin: 0 auto;
	padding: 4rem 1rem;
	background: #f3faf5;
}
.addParts03 .enTtl {
	background: url(img/engtit_bg_02.png) no-repeat center top;
}
.addParts03 .float-wrap .ttl {
	margin: 0 0 2rem 0;
	color: #21a937;
	font-size: 2.2rem;
}
.addParts03 .float-wrap .ttl a {
	padding: 0 2.5rem 0 0;
	background: url(img/arrow01_green.png) no-repeat right center;
	background-size: 14px auto;
	color: #21a937;
	text-decoration: none;
}

/*--------------------------------------
addParts04
---------------------------------------*/
.addParts04 {
	clear: both;
	margin: 0;
	padding: 4rem 1rem;
}

} /* SP_End */