/* ボディ */
/* 全体に適用するCSS */
body{
	font-size: 18px; /* 文字サイズ */
}

/* タブレットだけに適用するCSS(0~768px) */
@media screen and (min-width: 768px){
	body{
		font-size: 19x; /* 文字サイズ */
	}
}

/* PCだけに適用するCSS */
@media screen and (min-width: 960px){
	body{
		margin: 0; /* スペース */
		padding: 0;  /* 余白 */
		font-size: 20px; /* 文字サイズ */
		line-height: 1.168; /* 行の高さ */
	}
}

/* メイン*/
/* 全体に適用するCSS */
.main{
	background: url(img/dtm_musician.png);
	background-size: 200px auto;
	background-repeat;
}

/* タブレットだけに適用するCSS(0~768px) */
@media screen and (min-width: 768px){
	.main{
	}
}

/* PCだけに適用するCSS */
@media screen and ( min-width:960px ){
	.main{
	width: auto ;
	margin: 0 auto ;	/* 左右に[auto]を指定することで、真ん中に寄る */
	text-align: center;
	}
}

/* 背景画像の透過用css */
.bkRGBA{
	background: rgba(255,255,255,0.85);
}

/* ヘッダー */
.header{
	color : Yellow;
	font-weight: bold;
	text-shadow: -3px -3px 0 coral, -3px 0 0 coral, -3px 3px 0 coral,
			    0 -3px 0 coral,                    0 3px 0 coral,
			  3px -3px 0 coral,  3px 0 0 coral,  3px 3px 0 coral,
			  6px 6px 3px black;
	border-bottom: 3px solid #888 ;		/* 枠線 */
	text-align: center ;				/* テキスト、画像の真ん中寄せ */
	padding: 1em 0 ;					/* 上下の余白 */
	margin-bottom: 2em ;				/* 他のブロックとのスペース */
	background: #e8e8e8 ;				/* 背景色(確認用) */
}

/* フッター */
.footer{
	border-top: 3px solid #888 ;		/* 枠線 */
	text-align: center ;				/* テキスト、画像の真ん中寄せ */
	margin-top: 2em ;					/* 他のブロックとのスペース */
	padding: 1em 0 ;					/* 上下の余白 */
	background: #e8e8e8 ;
}

/* パンくずリスト */
li{
	display: inline;
}

a{
	text-decoration:none; 
}

/* 動画全体の横幅を指定するためのdiv */
.video-wrap {
  max-width: 500px; /* ここに動画の横幅を指定 */
  margin-left: auto;
  margin-right: auto;
}

/* 動画を囲うdiv */
.video {
  position: relative;
  width:100%; /* 横幅は100%で固定 */
  height:0; /* 高さは0にしておく(padding-topで高さを指定するため) */
  padding-top: 56.25%; /* 高さを指定(16:9) */
}

/* YouTube埋め込み用のiframe */
.video iframe{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/* 本 */
/* 全体に適用するCSS */
.book img{
	max-width: 35%;
}

/* タブレットだけに適用するCSS(0~768px) */
@media screen and (min-width: 768px){
	.book img{
		max-width: 20%;
	}
}

/* PCだけに適用するCSS */
@media screen and (min-width:960px){
	.book img{
		max-width: 15%;
	}
}

/* 本2 */
/* 全体に適用するCSS */
.book2 img{
	max-width: 30%;
}

/* タブレットだけに適用するCSS(0~768px) */
@media screen and (min-width: 768px){
	.book2 img{
		max-width: 20%;
	}
}

/* PCだけに適用するCSS */
@media screen and (min-width:960px){
	.book2 img{
		max-width: 15%;
	}
}

/* 応用 */
/* 全体に適用するCSS */
.apcom img{
	max-width: 60%;
}

/* タブレットだけに適用するCSS(0~768px) */
@media screen and (min-width: 768px){
	.apcom img{
		max-width: 35%;
	}
}

/* PCだけに適用するCSS */
@media screen and (min-width:960px){
	.apcom img{
		max-width: 30%;
	}
}

/* 結果 */
/* 全体に適用するCSS */
.result img{
	max-width: 90%;
}

/* タブレットだけに適用するCSS(0~768px) */
@media screen and (min-width: 768px){
	.result img{
		max-width: 90%;
	}
}

/* PCだけに適用するCSS */
@media screen and (min-width:960px){
	.result img{
		max-width: 90%;
	}
}

/* プラモの写真 */
/* 全体に適用するCSS */
.gunpla img{
	max-width: 80%;
}

/* タブレットだけに適用するCSS(0~768px) */
@media screen and (min-width: 768px){
	.gunpla img{
		max-width: 70%;
	}
}

/* PCだけに適用するCSS */
@media screen and (min-width:960px){
	.gunpla img{
		max-width: 30%;
	}
}

a{
	text-decoration:none; 
}