@charset "utf-8";
/*------------------------------------------------------------
	index
------------------------------------------------------------*/
.mainVisual {
	position: relative;
}
.mainVisual img {
	width: 100%;
}
.mainVisual .ttl {
	width: 115.6rem;
	position: absolute;
	left: 50%;
	top: 20.1rem;
	font-size: 3.2rem;
	font-weight: 700;
	line-height: 1.75;
	letter-spacing: 0.14em;
	transform: translateX(-50%);
}
#main {
	background-color: transparent;
}
#main .imgBox {
	width: 91.5rem;
	margin: 0 auto 13.2rem;
	position: relative;
}
#main .imgBox .textBox {
	width: 54.8rem;
	padding: 5.5rem 0 2.7rem;
	position: relative;
}
#main .imgBox .textBox::before {
	position: absolute;
	left: -1000rem;
	top: 0;
	right: 0;
	bottom: 0;
	background-color: #CDEBEF;
	content: "";
	mix-blend-mode: multiply; 
}
#main .imgBox .textBox > * {
	position: relative;
	z-index: 1;
}
#main .imgBox .title {
	margin-bottom: 0.4rem;
	color: #0181a8;
	font-size: 1.8rem;
	font-weight: 500;
	letter-spacing: 0.08em;
}
#main .imgBox p {
	margin-bottom: 1.7rem;
	line-height: 1.78;
}
#main .imgBox .pho {
	padding: 3.2rem;
}
#main .imgBox .pho img {
	position: relative;
	z-index: 1;
}
#main .imgBox .pho::before {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background : #CDEBEF;
	mix-blend-mode: multiply;
	content: "";
}
#main .imgInfo {
	width: 120rem;
	margin: 0 auto 6.7rem;
	position: relative;
}
#main .imgInfo .textBox {
	width: 44.5rem;
}
#main .imgInfo p {
	text-indent: -1em;
	padding: 0 0 1.4rem 1em;
	text-align: justify;
	font-size: 1.8rem;
	line-height: 1.55;
	font-weight: 700;
	color: #0181a8;
}
#main .imgInfo li {
	position: relative;
	padding-left: 1.8rem;
	font-size: 1.8rem;
	line-height: 1.55;
	font-weight: 500;
	text-align: justify;
}
#main .imgInfo li::before {
	position: absolute;
	left: 0;
	top: 0;
	content: "・";
}
#main .imgInfo img {
	position: relative;
	z-index: 1;
}
#main .imgInfo .pho01::before {
	position: absolute;
	left: -12.9rem;
	top: -8rem;
	bottom: -6.5rem;
	right: -1000rem;
	background : #CDEBEF;
	mix-blend-mode: multiply;
	content: "";
}
#main .imgInfo .pho02 {
	margin-top: 10.7rem;
	position: relative;
	width: 41.3rem;
}
#main .imgInfo .pho02::before {
	position: absolute;
	right: -13.1rem;
	top: -4.1rem;
	bottom: -2.8rem;
	left: -1000rem;
	background : #CDEBEF;
	mix-blend-mode: multiply;
	content: "";
}
@media all and (min-width: 897px) {
	#main .imgBox .pho {
		position: absolute;
		right: -14.4rem;
		top: 12.3rem;
		width: 67.1rem;
	}
	#main .imgInfo .pho01 {
		position: absolute;
		right: -0.1rem;
		top: 17.7rem;
		width: 59.4rem;
	}
	#main .imgInfo .textInfo {
		position: absolute;
		right: 0;
		top: 72.8rem;
		width: 61rem;
	}
}
@media all and (max-width: 896px) {
	.mainVisual .ttl {
		width: 37.5rem;
		padding-left: 3.4rem;
		top: 6.5rem;
		font-size: 1.67rem;
		line-height: 1.7;
		letter-spacing: 0.1em;
	}
	#main .imgBox {
		width: auto;
		margin: 0 auto 3.3rem;
	}
	#main .imgBox .textBox {
		width: auto;
		padding: 2.2rem 2.5rem 8.1rem;
	}
	#main .imgBox .textBox::before {
		right: 8.3rem;
	}
	#main .imgBox .title {
		margin-bottom: 0.3rem;
		font-size: 1.6rem;
	}
	#main .imgBox p {
		margin-bottom: 0.7rem;
		line-height: 1.75;
	}
	#main .imgBox .pho {
		margin: -7.2rem 0.3rem 0 3.7rem;
		padding: 1.6rem;
		position: relative;
	}
	#main .imgBox .pho img {
		width: 100%;
	}
	#main .imgInfo {
		width: auto;
		margin: 0 1.3rem 2rem;
	}
	#main .imgInfo .textBox {
		margin-bottom: 3.1rem;
		width: auto;
	}
	#main .imgInfo p {
		padding-bottom: 0.4rem;
		font-size: 1.4rem;
		line-height: 1.71;
	}
	#main .imgInfo li {
		padding-left: 0.9rem;
		font-size: 1.4rem;
		line-height: 1.71;
	}
	#main .imgInfo img {
		width: 100%;
	}
	#main .imgInfo .pho01 {
		position: relative;
		margin: 4.5rem 0 0 6.7rem;
	}
	#main .imgInfo .pho01::before {
		left: -2rem;
		top: -2.4rem;
		bottom: -1.9rem;
	}
	#main .imgInfo .pho02 {
		margin: 3.1rem 15.7rem 0 1.2rem;
		width: auto;
	}
	#main .imgInfo .pho02::before {
		right: -2.4rem;
		top: -6.5rem;
		bottom: -2rem;
	}
}