body{
	max-width:100%;
}

.content{
	background:#333;
	max-width:768px;
	width:100%;
	margin:0 auto;
	padding:0px;
	box-sizing: content-box;
}

.header{
	max-width:768px;
	width:100%;
	background:#fff;
	position:fixed;
	top:0;

}

h1{
	margin:10px 10px 0;


	}

.chenge_image{
	max-width:768px;
	width:100%;
}

.btn{
	max-width:100%;
	margin-top: 340px;
}



.btn ul{
	display:flex;
	flex-wrap: wrap;
	flex-direction: row;
	justify-content: space-evenly;
	padding: 10px 0;
	width:100%;
	max-width:768px;
	overflow:hidden;
	text-align: center;
}


.btn li{
	list-style:none;
	padding:5px;
	width: 30%;
    box-sizing: border-box;
}

.btn li img{
	max-width:100px;
	max-height:100px;
	box-shadow: 1px 1px 2px #9c9a9a;
}


figcaption{
	color:#fff;
	box-sizing:border-box;
	font-size:0.9em;
	text-align:center;
}



#box{
	width:500px;
	height:500px;
	background:#ffc0cb;
}

@media screen and (min-width: 410px) {
.btn{
	margin-top:400px;

}
}

@media screen and (min-width: 440px) {
.btn{
	margin-top:430px;

}
}


@media screen and (min-width: 480px) {
.btn{
	margin-top:450px;

}
}

@media screen and (min-width: 768px) {

.header h1{
	position: fixed;
    top: 0;
}

.top_image img.chenge_image{
	z-index:1;
}

.btn{
	margin-top:530px;

}

.btn ul{
	width:100%;
	max-width:767px;
}

.btn li{
	padding:5px;
	width: 20%;

}

}