/*=====CSS初期化=====*/
body,div,ul,li,h1,h2,h3,h4,h5,h6,p,article,aside,footer,header,hgroup,nav,section{
  margin:0;
  padding:0;
  border:0;
  outline:0;
  font-size:100%;
  vertical-align:baseline;
  background:transparent;
}

/*=====フォント=====*/
@font-face {
   font-family:FontAwesome;
   src: url('font/fontawesome-webfont.woff') format("woff"),
url('font/fontawesome-webfont.ttf') format("truetype"),
url('font/fontawesome-webfont.eot?') format("eot");
}
.FontAwesome{font-family: 'FontAwesome';}


/*=====ブロックレベル=====*/
article,aside,footer,header,nav,section{display:block;}

/*=====全体=====*/

html{
    font-size : 16px; 
}

body{
  font-family:"Hiragino Kaku Gothic ProN","Hiragino Kaku Gothic Pro",Meiryo,verdana;
  line-height:2;
  color:#333;
  padding: 0;
  margin: 0;
}

small{font-size:12px;line-height:1.5;color:#777;}
img{border:0;display:block;position:relative;}
a{outline:none;}
ul{list-style:none;}

h1,h2,h3{font-weight:normal;}

/*=====リンク=====*/

a:link,
a:visited,
a:active{
	color:#444;
	text-decoration:none;
	border-bottom:1px black dotted;
}

a:hover{
	color:#888;
	text-decoration:none;
	border-bottom:1px black dotted;
}

#wrapper{
	margin:0 auto;
	width:640px;
}

/*=====ヘッダー=====*/

header{
	width:100%;
	height:auto;
	border:0;
	background:#fff;
	position:relative;
}

.headerBar1{
	width:100%;
	height:50px;
	position:relative;
	display:none;
}

.headerBar2{
	width:100%;
	height:30px;
	background:#03f;
	color:#fff;
	text-align:center;
	font-size:15px;
	font-weight:bold;
	line-height:2;
}

.headerMain{
	width:100%;
	height:550px;
	background-image:url(img/bg1.jpg);
	background-position:50% 40%;
	background-size:cover;
	position:relative;
}

.headerMainWrapper{
	width:100%;
	max-width:960px;
	min-width:650px;
	margin:0 auto;
	position:relative;
}

.imgHead{
	position:absolute;
	left:2%;
	top:3%;
	width:240px;
}

.imgTitle{
	position:absolute;
	width:325px;
	left:12.5%;
	top:110px;
}

.imgCircle{
	position:absolute;
	width:180px;
	left:62%;
	top:290px;
}

/*=====コンテンツ全般=====*/

.contentsBox{
	width:100%;
}

.contentsBox p{
	margin:0 auto;
	width:84%;
	max-width:650px;
}

/*=====キャッチ=====*/

.catch1{
	text-align:center;
	height:150px;
}

.copy1{
	margin:20px auto 0px;
	font-size:36px;
	color:#03f;
	font-weight:bold;
}

/*=====詳細=====*/

.detail{
	padding-top:40px;
	padding-bottom:40px;
	background:#222;
	color:#fff;
}

.date{
	font-size:24px;
	font-weight:bold;
}

/*=====出演者情報=====*/

.performer{
	max-width:650px;
	margin:42px auto;
	overflow:hidden;
}

.performer h1{
	width:94%;
	max-width:650px;
	margin:0 auto 0;
	padding-left:3%;
	height:45px;
	background:url(img/performer.jpg);
	color:#fff;
	font-size:24px;
	font-weight:bold;
	line-height:2;
}

.performer h2{
	font-size:18px;
	margin:42px 0 4px 0;
	width:100%;
	border-bottom:1px #444 dotted;
	font-weight:bold;
}

.performers{
	width:84%;
	max-width:650px;
	margin:0 auto;
}

@media screen and (min-width : 768px){
    .performers{
		width:94%;
		max-width:300px;
		float:left;
		margin:0 12px;
	}
}

.performers p{
	width:100%;
}

/*=====キャッチ=====*/

.catch2{
	margin-top:42px;
	border-top:1px #999 solid;
	padding-top:28px;
	clear:both;
	text-align:center;
}

.copy2{
	margin:0px auto 80px;
	font-size:36px;
	color:#03f;
	font-weight:bold;
}

.last{
	padding-top:24px;
	font-size:20px;
	font-weight:bold;
	text-align:center;
}

/*=====フッター=====*/

footer{
	background:#222;
	color:#fff;
	font-size:12px;
	text-align:center;
	padding:20px 8%;
}

/*=====ソーシャル=====*/

.socialArea{
	text-align:center;
}

.fb_iframe_widget > span {
  vertical-align: baseline !important;
}

/*=====スライドショー=====*/

#slide {
width:640px;
height:300px;
margin:0 auto;
position:relative;
}
#slide img {
position:absolute;
left:0;
top:0;
}