@charset "utf-8";

/***************** 基本構造 *****************/

* {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	-o-box-sizing: border-box;
	box-sizing: border-box;
}

html {
	width: 100%;
	height: 100%;
}

/* ------------------------------------------------------------------------------------------------------ Pagetop */


#pagetop {
	display: none;
	position: fixed;
	right: 0;
	bottom: 0;
	z-index: 99;
	width: 60px;
	height: 60px;
	overflow: hidden;
	}

	#pagetop a {
		display: block;
		height: 100%;
		background-image: url(/common/btn_pagetop.gif);
		text-decoration: none;
		text-indent: -9999px;
		background-position: center;
		background-repeat: no-repeat;
		
		filter: alpha(opacity=80);
		-moz-opacity: 0.8;
		opacity: 0.8;
		
		-webkit-transition: 0.5s;
		-moz-transition: 0.5s;
		-ms-transition: 0.5s;
		-o-transition: 0.5s;
		transition: 0.5s;
		}
	
		#pagetop a:hover {
			filter: alpha(opacity=100);
			-moz-opacity: 1.0;
			opacity: 1.0;
		}
		
@media screen and (max-width: 768px) {


#pagetop {
	display: none;
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 99;
	width: 100%;
	height: 40px;
	background-position: center;
	background-repeat: no-repeat;
	
	filter: alpha(opacity=80);
	-moz-opacity: 0.8;
	opacity: 0.8;
	}

	#pagetop a {
		display: block;
		height: 100%;
		text-decoration: none;
		text-indent: -9999px;
		background-color: #000;
		background-size: 38px 20px;
		background-image: url(/common/sp_pagetop.png);
	}
}

/* ------------------------------------------------------------------------------------------------------ Footer */

#footer {
	margin:10px 0 40px;
	padding:0;
	text-align: center;
	}

body {
	width: 100%;
	height: 100%;
	margin: 0;
	padding: 0;
	background: #fff;
	font-size: 12px;
	line-height: 21px;
	font-family: 'メイリオ',Meiryo,'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
	color: #333;
	overflow: scroll;
	overflow-x: hidden;
}

img {
	max-width: 100%;
	height: auto;
	width: auto\9; /* ie8 */
	border: none;
	vertical-align: text-bottom;
}

a:link {
	text-decoration: none;
	color:#B83333;
}

a:visited {
	color: #333;
}

a:hover {
	color:#FF0000;
	text-decoration: none
}

a:active {
	color: #781417;
}

.ftxt {
	display:inline-block;
	}

/***********************************************
 グローバルビートインデックス
 ***********************************************/

 #wrapper {
	 margin:0 auto;
     padding-top: 30px;
	 }
    #wrapper a {
		 -webkit-transition: 0.5s;
		 -moz-transition: 0.5s;
		 -ms-transition: 0.5s;
		 -o-transition: 0.5s;
		 transition: 0.5s;
		}
  main > div h2 {
	  color: #628BD6;
  }

  #covers {
	  width:90%;
	  margin:0 auto;
	  margin-top: 50px;
	  }
   #covers a img {
	   border:none;
	   }
   #covers h1 {
	   text-align:center;
	   font-size:1.2em;
	   color:#006633;
	   }
	#covers h2 {
		font-size:1em;
		color:#CC0000;
		}
  #covers .tleft {
	  width:48%;
	  float:left;
	  border-collapse:collapse;
	  }
  #covers .tright {
	  width:48%;
	  float:right;
	  border-collapse:collapse;
	  }
   #covers .icon {
	   width:20%;
	   padding:5px 5px 4px;
	   text-align:center;
	   background:#FFEAB9;
	   }
	 #covers .icon a:hover {		 
		 filter: alpha(opacity=40);
		 -moz-opacity:0.40;
		 opacity:0.40;
		 }
   #covers th {
	   width:48%;
	   background:#E3FEBC;
	   text-align:left;
	   padding:0 0 0 10px;
	   border:solid 1px #CCC;
	   }
	 #covers th a {
		 font-weight:normal;
		 font-size:1.1em;
		 }
   #covers td {
	   width:32%;
	   padding:0 0 0 10px;
	   border:solid 1px #CCC;
	   }



/*---- 戻る ----*/
 .return {
	 margin:20px auto;
	 text-align:center;
	 }
  .return ul {
	  margin:0 auto;
	  padding:0;
	  list-style:none;
	  }
  .return li {
	  display:inline-block;
	  margin:10px 20px;
	  font-size:1.1em;
	  }	
  .return li a {
	  padding:5px 7px;
	  background-color:#24a540;
	  border: none;
	  border-radius: 3px;
	  text-align: center;
	  color: #fff;
	  }
  .return li a:hover {
	  background-color:#ee0000;
	  }

.clear{clear:both;}

/***********************************************
 グローバルビート詳細
 ***********************************************/

#person {
	  width:90%;
	  margin:20px auto 0;
	  background:#FFEAB9;
	  padding-bottom:20px;	  
	  }
	  
 #person h1 {
	 background:#FF9900;
	 margin:0 0 20px;
	 padding:5px;
	 text-align:center;
	 color:#FFF;
	 font-size:1.3em;
	 letter-spacing:2px;
	 }
  #person h2 {
	  width:90%;
	  margin:0 auto;
	  font-size:1.1em;
	  text-align:center;
	  letter-spacing:2px;
	  background:#f3fdff;
	  padding:5px 0;
	  border-bottom:solid 1px #CCC;
	  }
  #person h3 {
	  width:90%;
	  margin:0 auto;
	  padding-top:10px;
	  font-size:1.1em;
	  text-align:center;
	  font-weight:normal;
	  background:#FFF;
	  }
	  
 #person-p {
	 margin:0 auto;
	 text-align:center;
	 padding:0;
	 }
   #person-p table {
	   width:100%;
	   margin:0;
	   padding:0;
	   border:none;
	   }
	 #person-p td {
	   text-align:center;
	   padding:0 20px 20px;
	   border:none;
	   }
	  #person-p img {
		  border:solid 1px #999;
		  }

 #person-pro {
	 width:90%;
	 margin:0 auto 10px;
	 padding:0;
	 }
	 
  #person-pro .person-img {
	  text-align:center;
	  }
   #person-pro .person-img ul {
	   margin:0 auto;
	   padding:0;
	   text-align:center;
	   list-style:none;
	   } 
	#person-pro .person-img li {
		display:inline-block;
		margin:20px;
		padding:0;
		}
	 #person-pro .person-img img {
		 border-radius: 5px;
		  -webkit-border-radius: 5px;
		  -moz-border-radius: 5px;
		 }

	   
 #person .text {
	 width:90%;
	 margin:0 auto 20px;
	 padding:10px 0;
	 background:#FFF;
	 }
	#person .text p {
		margin:10px 20px;
		}
	#person .littl {
		margin:10px 15px 0;
		}
	#person .text ul {
		margin:0 10px 0 0;
		}
	 

.litxt { margin:5px 10px !important; }
	 
#intable { width:75%; margin:0 auto 30px;}
#intable-2 { width:90%; margin:0 auto 30px;}
.pimg { width:40%; float:left;}
.pimg ul { list-style:none; margin:0; padding:0; text-align:center;}
.pimg li { display:inline-block; margin:0 10px 15px; }
.pimg img { border-radius: 5px; -webkit-border-radius: 5px; -moz-border-radius: 5px;}
.innre { width:58%; float:right; border-collapse:collapse; margin-bottom:20px; line-height:1.3em;}
.innre th { padding:7px 10px 7px 5px; background:#ffc977; text-align:left; border:solid 1px #999; white-space:nowrap; vertical-align:top;}
.innre td { padding:7px 5px; background:#fff; border:solid 1px #999;}
#intable h3 { padding:10px; border:solid 1px #999;}

@media screen and (max-width: 1024px) {

/***********************************************
 スマホ-グローバルビートインデックス
 ***********************************************/
 #wrapper {
	 width:100%;
     padding-top: 0;
	 }

  #covers h2 { margin-left:10px; }

  #covers {
	  width:100%;	  
	  }

  #covers .tleft {
	  float:none;
	  width:96%;
	  margin:0 auto;
	  }
  #covers .tright {
	  float:none;
	  width:96%;
	  margin:0 auto;
	  }	

/***********************************************
  スマホ-グローバルビート詳細
 ***********************************************/

#person { width:100%; }


	 
#intable { width:96%; }
#intable-2 { width:96%; }
.pimg { width:100%; float:none; text-align:center; }
.pimg img { margin:10px 0; }
.innre { width:100%; float:none; }
.innre th { padding:5px 10px 5px 5px; }
.innre td { padding:5px;}
#intable h3 { width:100%; padding:10px 0; }


}


@media screen and (max-width: 520px) {

  #header {
	  text-align:center;
	  }

     #header h1 {
		 float:none
		 }
     #header h2 {
		 float:none
		 }
		 
}

/***********************************************
 FMKラベル
 ***********************************************/

#fmklbl {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 999;
	width: 100%;
	height: 30px;
	background-color: #252525;
	background-image: url(../common/img_fmklogo_S.png);
	background-position: 15px center;
	background-repeat: no-repeat;
}

	#fmklbl ul {
		float: right;
		width: 200px;
		margin: 0;
		padding: 0;
		list-style: none;
		font-size: 0.9em;
	}

	#fmklbl li {
		float: left;
		width: 100px;
		text-align: center;
		overflow: hidden;
		font-size:13px;
	}

		#fmklbl li a {
			display: block;
			height: 30px;
			line-height: 30px;
			color: #fff;
			
			-webkit-transition: 0.5s;
			-moz-transition: 0.5s;
			-ms-transition: 0.5s;
			-o-transition: 0.5s;
			transition: 0.5s;
		}

			#fmklbl li a:hover {
				background-color: #fc1b1c;
				text-decoration: none;
			}
			
@media screen and (max-width: 768px) {

#fmklbl {
	position: fixed;
	top: 0;
	z-index: 999;
	width: 100%;
	height: auto;
	background-image: none;
}

	#fmklbl ul {
		width: 100%;
	}

	#fmklbl li {
		display: block;
		float: left;
		width: 50%;
		background: #fc1b1c;
	}

	#fmklbl li + li {
		background-color: #000;
	}

		#fmklbl li a {
			height: 30px;
			line-height: 30px;
			color: #fff;
		}
		#fmklbl li a:hover {
			height: 30px;
			line-height: 30px;
			background-color: #fff;
			color:#fc1b1c;
			border-bottom:solid 1px #000;
			font-weight:bold;
			}
	    #fmklbl li + li a:hover {
		    background-color: #fff;
			color:#000;
			border-bottom:solid 1px #fc1b1c;
			font-weight:bold;
			}

}
