@charset "UTF-8";

/* ========== ARTICLE ========== */
.txt_center .catch { text-align: center; }
.txt_center .lead { display: block; margin: 0 auto; }
/* HD */
#hd { background: #f3ede0; }
/* SEC0 */
#sec0 .catch font { color: #264993; }
#sec0 ul { display: flex; flex-flow: wrap; justify-content: space-between; }
#sec0 ul li { text-align: center; }
#sec0 ul li p { color: #264993; font-weight: bold; }
/* SEC1 */
#sec1 { background: #dce6fa; }
#sec1 .achievement { display: flex; flex-flow: wrap; justify-content: space-between; }
#sec1 .achievement div { background: #ffffff; border-radius: 5px; position: relative; }
#sec1 .achievement div font { font-family: Arial; color: #92a4c9; font-weight: bold; line-height: 1; background: #dce6fa; text-align: center; vertical-align: middle; display: grid; align-items: center; border-radius: 100%; position: absolute; }
#sec1 .achievement div p, #sec1 .achievement div h4 { font-weight: bold; }
#sec1 .achievement div p { color: #264993; }
/* SEC2 */
#sec2 .list { display: flex; flex-flow: wrap; justify-content: space-between; }
#sec2 .list div h4 { color: #264993; font-weight: bold; background: #dce6fa; text-align: center; vertical-align: middle; display: grid; align-items: center; }
#sec2 h3 { color: #264993; font-weight: bold; text-align: center; }
#sec2 table td, #sec2 table th { border-bottom: 1px solid #636363; }
#sec2 table th { border-right: 1px solid #636363; }
#sec2 table .hd td, #sec2 table .hd th { color: #ffffff; font-weight: bold; background: #516da9; text-align: center; }
/* SEC3 */
#sec3 { background: #f0f0f0; }

@media screen and (max-width:768px) {
	
	/* ========== ARTICLE ========== */
	#sec1, #sec2, #sec3 { padding: 15px 0; }
	.catch { font-size: 1.6rem; margin-bottom: 10px; }
	.lead { margin-bottom: 10px; }
	.img_left, .img_right { margin-bottom: 20px; }
	/* SEC0 */
	#sec0 .catch { font-size: 1.7rem; text-align: center; margin-bottom: 20px; }
	#sec0 .catch font { font-size: 1.5rem; }
	#sec0 .lead { margin: 0 0 20px; }
	#sec0 .img img { max-width: 100%; }
	#sec0 ul li { margin-bottom: 10px; }
	#sec0 ul li p { font-size: 1.6rem; }
	#sec0 .cap { text-align: left; margin-bottom: 20px; }
	/* SEC1 */
	#sec1 .lead { margin-bottom: 20px; }
	#sec1 .achievement div { padding: 10px; margin-bottom: 10px; }
	#sec1 .achievement div font { font-size: 2.0rem; width: 40px; height: 40px; top: 10px; left: 10px; }
	#sec1 .achievement div p, #sec1 .achievement div h4 { line-height: 1; margin-left: 50px; }
	#sec1 .achievement div p { margin-bottom: 5px; }
	#sec1 .achievement div h4 { font-size: 2.3rem; margin-bottom: 15px; }
	#sec1 .achievement div .img { text-align: center; }
	#sec1 .achievement div .img img { max-width: 100%; }
	/* SEC2 */
	#sec2 .list { margin-bottom: 20px; }
	#sec2 .list div { width: calc((100%/2) - 5px); margin-bottom: 10px; }
	#sec2 .list div.f1, #sec2 .list div.f2 { width: 100%; }
	#sec2 .list div h4 { font-size: 1.5rem; line-height: 1.25; height: 50px; }
	#sec2 .list div p { font-size: 1.2rem; }
	#sec2 table { width: 100%; }
	#sec2 table td, #sec2 table th { padding: 5px; }
	#sec2 table th { width: 20%; }
	/* SEC3 */
	#sec3 .img2 { margin-bottom: 20px; }
}

@media screen and (min-width:769px) {
		
	/* ========== ARTICLE ========== */
	#sec1, #sec2, #sec3 { padding: 100px 0 90px;}
	.catch { font-size: 3.6rem; margin-bottom: 30px; }
	/* SEC0 */
	#sec0 { padding: 20px 0 70px; }
	#sec0 .catch { margin-bottom: 40px; }
	#sec0 .catch font { font-size: 3.0rem; }
	#sec0 .lead, #sec1 .lead { font-size: 1.8rem; display: block; width: 1000px; margin: 0 auto 40px; }
	#sec0 ul { width: 1000px; margin: 0 auto; }
	#sec0 ul li p { font-size: 2.4rem; }
	#sec0 .cap { font-size: 1.7rem; margin-bottom: 50px; }
	/* SEC1 */
	#sec1 .achievement div { width: 530px; padding: 20px 25px; margin-bottom: 40px; }
	#sec1 .achievement div font { font-size: 5.3rem; width: 68px; height: 68px; top: 25px; left: 25px; }
	#sec1 .achievement div p, #sec1 .achievement div h4 { line-height: 1; margin-left: 85px; }
	#sec1 .achievement div p { margin-bottom: 10px; }
	#sec1 .achievement div h4 { font-size: 5.5rem; margin-bottom: 20px; }
	/* SEC2 */
	#sec2 .img_right { margin: 0 0 50px 100px; }
	#sec2 .img_right .txt { position: absolute; left: 0; top: 0; }
	#sec2 .img_right .img { text-align: right; }
	#sec2 .list { width: 1000px; margin: 0 auto 40px; }
	#sec2 .list div { width: 310px; margin-bottom: 40px; }
	#sec2 .list div.f1 { width: 800px; margin: 0 auto; }
	#sec2 .list div.f2 { width: 473px; }
	#sec2 .list div h4 { font-size: 2.8rem; line-height: 1.25; height: 100px; }
	#sec2 .list div p { font-size: 1.6rem; }
	#sec2 .list div.f1 p { text-align: center; }
	#sec2 h3 { font-size: 2.8rem; margin-bottom: 20px; }
	#sec2 table { width: 1080px; margin: 0 auto; }
	#sec2 table td, #sec2 table th { padding: 10px; }
	#sec2 table th { width: 225px; }
	/* SEC3 */
	#sec3 .img_left { width: 1100px; margin: 0 auto 80px; }
	#sec3 .img_left .txt { position: absolute; left: 560px; top: 0;  }
	#sec3 .img2 { text-align: center; margin-bottom: 100px; }
}
