@charset "utf-8";

body {
	background-color: #000;
}

/*ページタイトル*/
header {
	width: 880px;
	margin: 0 auto;
}
.title {
	margin-top: 5.5rem;
	text-align: center;
}
.title li:nth-child(1) {
	color: #F39D00;
	font-size: 1.7rem;
}
.title li:nth-child(2) {
	font-size: 3.3rem;
	font-weight: 300;
	margin: 10px 0 20px 0;
}
.title li:nth-child(3) {
	border: #F39D00 solid 1px;
	width: 440px;
	margin: 0 auto;
}
.title li:nth-child(4) {
	font-size: 1.0rem;
	line-height: 1.6;
	margin: 50px 0 40px 0;
}

/*メインコンテンツ*/
main {
	background-color: #333333;
	width: 100%;
	padding-top: 70px;
}
.parent_box {
	width: 960px;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, 300px), 1fr));
	height: auto;
	margin: 0 auto;
}
.child_box {
	margin-bottom: 50px;
	padding: 0 15px;
	transition-duration: 0.3s;
}
.child_box img {
	width: 100%;
	height: auto;
	vertical-align: bottom;
}
.child_box:hover {
	transform: scale(1.1);transition-duration: 0.3s;
}


/*ここから1000px以下表示*/
@media only screen and (max-width: 1000px) {
	header,
	.parent_box {
		width: 80%;
	}
}

/*ここから667px以下表示*/
@media only screen and (max-width: 667px) {
	.parent_box {
		width: 70%;
	}
	header ul li {
		line-height: 1.2;
	}
	.title li:nth-child(3) {
		width: 90%;
	}
	.title li:nth-child(4) {
		margin: 35px 0;
	}
	.title li:nth-child(1) {
		font-size: 1.3rem;
	}
	.title li:nth-child(2) {
		font-size: 2.8rem;
	}
}