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

h1 {
	margin-bottom: 40px;
}

.container div a {
	color: #333;
}

#box1 div {
	height: 210px;
	padding-left: 72px;
}

.container #box1 li {
	margin: 8px 0px 0px 36px;
}

.container > div#box1 li > a:hover, a:focus {
	color: #d22926;
}

.container div#box2 p > a:hover, a:focus {
	color: #d22926;
}

.container div li > a:visited {
	color: #333;
}

.container div p > a:visited {
	color: #333;
}

h3 {
	color: #333;
	font-weight: bold;
	border-bottom: solid 1px #aaa;
	padding: 4px 0px 6px 16px;
	margin: 0px 12px 0px 12px;
	clear: both;
}

#box2 div {
	margin: 24px 0px 0px 0px;
	padding-left: 52px;
}

footer {
	margin-top: 80px;
}

/*カスタマイズ*/
.sec {
	width: 100%;
	padding: 0;
	margin: 0 auto 50px;
	position: relative;
}
.sec > h2 {
	margin-bottom: 1em;
}
.sec > p {
	margin-bottom: 2em;
}
.sec > h3 {
	border: none;
	padding: 0;
	margin: 0 auto 0.8em;
	text-align: left;
}

@media screen and (min-width: 1200px) {
	/* 1200px以上用（PC用）の記述 */

}

@media screen and (min-width: 980px) and (max-width: 1199px) {
	/* 980px - 1119px用（PC用）の記述 */
	
	#box2 div {
		padding-left: 80px;
	}

}
	
@media screen and (min-width: 768px) and (max-width: 979px) {
	/* 768px - 979px用（タブレット用）の記述 */

	#box2 div {
		padding-left: 80px;
	}

}

@media screen and (min-width: 480px ) and (max-width: 767px){
	/* 480px - 767px用（タブレット／スマートフォン用）の記述 */

}
	
@media screen and (max-width: 479px) {
	/* 479px以下用（スマートフォン用）の記述 */
	
	#box1 div {
		height: auto;
		padding-left: 24px;
		margin-bottom: 18px;
	}


}