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

/* ========== CLEAR ========== */
header { height: auto; padding: 0; }
	
/* ========== HEADER ========== */
header { background: #3a8a53; height: 20px; }

/* ========== ARTICLE ========== */
article { background: #f8f6f4; }
article li { float: left; }

@media screen and (max-width:768px) {
	
	article .inner { padding: 50px 5px; }
	article .sep3 li { width: calc((100%/2) - 10px); padding: 0 5px; margin-bottom: 20px; }
	article .sep3 li.d4 { width: 100%; }
	article .sep4 li { width: calc((100%/2) - 10px); padding: 0 5px; margin-bottom: 20px; }
	article li img { max-width: 100%; height: auto; }
	article .sep3 p.cap-text{padding-bottom: 60px;}
	p.cap-text{padding-bottom: 20px;}
}

@media screen and (min-width:769px) {
	
	article .inner { padding: 100px 0; }
	article .sep3 li { width: calc(100%/3); height: 300px; margin-bottom: 60px; }
	article .sep3 li.d4 { width: 520px; }
	article .sep3 li.d5 { width: 280px; }
	article .sep4 li { width: calc(100%/4); margin-bottom: 60px; }
	p.cap-text{padding-bottom: 20px;}
	
}