@charset "UTF-8";

/* CSS Document */

body{
	 height: 100%;
margin: 0;

	background-color:#000000
		;
}
#main{
	width: 100%;
margin: 75px 0 0px ;
	padding: 0;
    line-height: 0;
    align-items: center;
		}

img{
 max-width: 100%;
width: auto; /* これないと縦横比崩れる*/


}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
img.pc { display: block !important; }
img.sp { display: none !important; }

/*====================
スマホを基本設計にする
 - 〜479px：スマートフォン縦
 - 480px〜599px：スマートフォン横
 - 600px〜959px：タブレット
 - 960px〜1279px：小型PC
 - 1280px〜：大型PC
====================*/

/* 960px〜1279px：小型PC
------------------------------ */
@media screen and (min-width:960px) and (max-width:1279px) {
 /* パソコンで見たときは"pc"のclassがついた画像が表示される */
 img { max-width: 100%; }
}
 
/* パソコンで見たときは"pc"のclassがついた画像が表示される */
img.pc { display: block !important; }
img.sp { display: none !important; }
 
/* 600px〜959px：タブレット
------------------------------ */
@media only screen and ( max-width : 767px ) {
	/* パソコンで見たときは"pc"のclassがついた画像が表示される */

	 img { max-width: 100%; 
	 margin:  auto; /*マージン左右autoでセンター合わせになる*/}
 	

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
img.pc { display: block !important; }
img.sp { display: none !important; }
}

/* 480px〜599px：SP横
------------------------------ */
@media screen and (min-width:480px) and (max-width:599px) { 
	
	/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
 img { max-width: 100%; 
	   margin :  auto; /*マージン左右autoでセンター合わせになる*/}
 img.pc { display: none !important; }
	img.sp { display: block !important; }
 
}
 

/* 〜479px：SP縦
------------------------------ */
@media screen and (max-width: 480px) {
	/* 480px以下に適用されるCSS（スマホ用） */
	
	/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
	img { max-width: 100% ;}
    img.pc { display: none !important; }
   img.sp { display: block !important; }
	main{
	width: 100%;
margin: 100px 0 0px ;
	
	}
	
}