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

.notes-area {
margin: 0% auto 0;
}
#pageWrap {
padding: 0px 0 0;
	background-color: #fff;
	color: #000;
	text-align: left;
}

#pageWrap #secTit {
 padding: 30px 0;
	max-width: 1000px;
}
#pageWrap #secTit h3 {
	text-align: center;
	font-size: 24px;
	letter-spacing: 0.2em;
	padding: 1em 0;
}

#pageWrap .sec {
	max-width: 1000px;
 padding: 30px 0;
}
#pageWrap .sec .flex {
	align-items: flex-start;
}
#pageWrap .sec h3 {
	background-color: #A2915D;
	color: #fff;
	text-align: center;
	font-size: 24px;
	padding: 0.6em 0;
	margin-bottom: 0.5em;
}
#pageWrap .sec h3 sup {
	font-size: 50%;
}
#pageWrap .sec p {
	font-size: 15px;
	padding: 0.5em 0;
	line-height: 2;
}
#pageWrap .sec p.caption {
	font-size: 12px;
	line-height: 1.4;
}
#pageWrap .sec .capIP {
	position: relative;
}
#pageWrap .sec .capIP::after {
	content: 'image photo';
	position: absolute;
	top: 101%;
	font-size: 10px;
	right: 0;
	
}

#pageWrap #sec01 {}
#pageWrap #sec01 .leftBox {
	width: 48%;
}
#pageWrap #sec01 .rightBox {
	width: 48%;
	max-width: 474px;
	padding-top: 1em;
	
}
#pageWrap #sec01 .rightBox p {
	line-height: 1.5;
	padding-top: 1em;
}

#pageWrap #sec02 {}
#pageWrap #sec02 .leftBox, #pageWrap #sec03 .leftBox {
	width: 65%;
}
#pageWrap #sec02 .leftBox p.tel {
	max-width: 620px;
	padding: 0;
	padding-top: 0.5em;
}
#pageWrap #sec02 .rightBox, #pageWrap #sec03 .rightBox {
	width: 26%;
	max-width: 256px;
}
#pageWrap #sec03 .leftBox p.logo {
	max-width: 520px;
	padding: 0;
}

#pageWrap #sec04 {}
#pageWrap #sec04 .flex {
	margin-bottom: 30px;
}
#pageWrap #sec04 .flex .leftBox {
	width: 54%;
	max-width: 536px;
}
#pageWrap #sec04 .flex .leftBox h4 {
	padding: 1em 0;
}
#pageWrap #sec04 .flex .rightBox {
	width: 25%;
	max-width: 246px;
}
#pageWrap #sec04 .sBox h5 {
	font-size: 21px;
	color: #9F404E;
	border: #9F404E solid 1px;
	border-left-width: 10px;
	padding: 0.3em 0.5em;
}
#pageWrap #sec04 .sBox ul {
	padding: 1em 0;
}
#pageWrap #sec04 .sBox li {
	font-size: 16px;
	padding: 0.2em 0;
	
}
#pageWrap #sec04 .sBox li::before {
	content: '■';
	margin-right: 0.3em;
	color: #9F404E;
}
#pageWrap #sec04 .flex01 {
	margin-bottom: 30px;
}
#pageWrap #sec04  .sBox {
	width: 45%;
}
#pageWrap #sec04 .flex01 .imgBox {
	width: 37%;
	max-width: 366px;
	
}
#pageWrap #sec04 .box02 h5 {
	color: #C17D19;
	border: #C17D19 solid 1px;
	border-left-width: 10px;
}
#pageWrap #sec04 .box02 li::before {
	color: #C17D19;
}
#pageWrap #sec04 .box03 h5 {
	color: #227B3D;
	border: #227B3D solid 1px;
	border-left-width: 10px;
}
#pageWrap #sec04 .box03 li::before {
	color: #227B3D;
}
#pageWrap #sec04 .box04 h5 {
	color: #087483;
	border: #087483 solid 1px;
	border-left-width: 10px;
}
#pageWrap #sec04 .box04 li::before {
	color: #087483;
}
#pageWrap #sec04 .box05 h5 {
	color: #764E78;
	border: #764E78 solid 1px;
	border-left-width: 10px;
}
#pageWrap #sec04 .box05 li::before {
	color: #764E78;
}

#pageWrap #sec05 {}
#pageWrap #sec05 .itemBox {
	width: 30%;
	max-width: 300px;
}
#pageWrap #sec05 .itemBox h3 {
	font-size: 2vw;
	font-size: clamp(12px, 2vw, 21px);
}


@media screen and (max-width : 959px ){
	#pageWrap #secTit h3 {
		font-size: clamp(20px, 2.7vw, 22px);
	}
	#pageWrap .sec h3 {
		font-size: clamp(20px, 2.7vw, 22px);
	}
	#pageWrap .sec p, #pageWrap #sec04 .sBox li {
		font-size: clamp(14px, 2vw, 16px);
	}
	#pageWrap #sec04 .sBox h5 {
		font-size: 2.2vw;
			font-size: clamp(16px, 2.2vw, 18px);
		
	}
	

}

@media screen and (max-width : 599px ){
	#pageWrap #secTit {
		padding-bottom: 0;
	}
	#pageWrap #secTit h3 {
		font-size: 5.1vw;
		font-size: clamp(18px, 5.1vw, 20px);
		padding: 0;
	}
	#pageWrap .sec h3 {
		font-size: 4.3vw;
		font-size: clamp(15px, 4.3vw, 17px);
		padding: 0.5em;
	}
	#pageWrap .sec p, #pageWrap #sec04 .sBox li {
		font-size: 3.7vw;
		font-size: clamp(13px, 3.7vw, 15px);
		line-height: 1.6;
	}
	#pageWrap #sec01 .leftBox {
		width: 100%;
	}
	#pageWrap #sec01 .rightBox {
		width: 100%;
		max-width: 100%;
		padding-top: 1em;

	}
	#pageWrap #sec02 .leftBox, #pageWrap #sec03 .leftBox {
		width: 100%;
	}
	#pageWrap #sec02 .rightBox, #pageWrap #sec03 .rightBox {
		width: 100%;
		max-width: 256px;
		margin: 1em auto 0;
	}
	#pageWrap #sec04 .flex .leftBox {
		width: 100%;
		max-width: 100%;
	}

	#pageWrap #sec04 .flex .rightBox {
		width: 60%;
		max-width: 246px;
		margin: 1em auto 0;
	}
	#pageWrap #sec04  .sBox {
		width: 100%;
	}
	#pageWrap #sec04 .flex01 .imgBox {
		width: 80%;
		max-width: 366px;
		margin: 0 auto;

		
	}
	#pageWrap #sec04 .sBox h5 {
		font-size: 4.3vw;
		font-size: clamp(15px, 4.3vw, 17px);
	}
	#pageWrap #sec04 .sBox li {
		padding: 0;
	}
	#pageWrap #sec05 .itemBox {
		width: 100%;
		max-width: 100%;
	}
	#pageWrap #sec05 .itemBox .imgBox {
		width: 80%;
		margin: 0 auto;
		max-width: 280px;
	}
	#pageWrap #sec05 .itemBox h3 {
		font-size: 4.3vw;
		font-size: clamp(15px, 4.3vw, 17px);
		
	}
	#pageWrap #sec06 .imgBox {
		max-width: 400px;
		margin: 0 auto;
	}
	
}