
@media only screen and (max-width: 767px){
	body{

		background-image: url(../image/bg.jpg);
		background-repeat: no-repeat;
		 background-position:top center;
		 background-size:contain; 
		background-color: black;
		width:100%;
	}

	#center_Box{
		margin:14% 0% 0% 24%;

		}
	img#img_size{
		  width:70%;
	}
	#center_Box2{
		margin:-5% 21% 0% 21%;
		width:60%;
		text-align:center;
	}
	img#img_size2{
	display: inline-block;
  	width:20%;
	}
	img#img_size3{
	display: inline-block;
  	width:20%;
	
	}
		#center_Box3{
		margin:0% 21% 0% 21%;
		text-align:center;
		margin:2.2% 0.1% 0.1% 0.1%;
			
	}
	img#img_button{
		
	}

}
@media only screen and (max-width: 315px){
		body{
background-image: url(../image/b.jpg);
		background-color: black;
	}
}
@media only screen and (min-width: 768px), print{
	
		body{
		background-color: black;
		background-image: url(../image/bg.jpg);
		background-repeat: no-repeat;
		 background-position:top center;
		 max-width:1000px;
		height:800px;
	}
		#center_Box{
        color: white;
        position: absolute;
        left: 50%;
        margin-right: -50%;
		margin-top: 350px;
        transform: translate(-50%, -50%)

		}
	img#img_size{
		  width:524px;
	}
	
		#center_Box2{
		  position: absolute;
 		 top: 550px;
		text-align:center;
 		 bottom: 0;
		left: 0;
 		 right: 0;
 		 margin: auto;
 		 max-width: 100%;
 		 max-height: 100%;
	}
	img#img_size2{
	display: inline-block;
  	width:160px;
	margin:4px 4px 4px 4px;
	}
		img#img_size3{
	display: inline-block;
  	width:180px;
	
	}
		#center_Box3{
		  position: absolute;
 		 top: 700px;
		text-align:center;
 		 bottom: 0;
		left: 0;
 		 right: 0;
 		 margin: auto;
 		 max-width: 100%;
 		 max-height: 100%;
			
	}
}