@charset "utf-8";
/* CSS Document */

body{background:#000;}

@font-face {
  font-family: 'typicons';
  src: url('../fonts/typicons.eot');
  src: url('../fonts/typicons.eot?#iefix') format('embedded-opentype'),
  url('../fonts/typicons.woff') format('woff'),
  url('../fonts/typicons.ttf') format('truetype'),
  url('../fonts/typicons.svg#typicons') format('svg');
  font-weight: normal;
  font-style: normal;
  }

img{max-width:100%;}


/*--------共通設定--------*/

#outerFrame{
	width: 100%;
	min-height:100%;
	height:auto;
	margin-left:auto;
	margin-right:auto;
	background-color: #000;
	position: relative;
	}


#menu,h2,h3,.onikoube_story p{font-family:"Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝",serif;}


#oniMainMenu li{
	-webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all  0.5s ease;
	}


/*--------メニュー--------*/

#menu{
	width:100%;
	top:0;
	position:fixed;
	z-index:1000;
	background:#720000;
	}

/*PC・タブレット用*/
#oniMainMenu {
	max-width:1040px;
	margin:0 auto;
	height:50px;
	padding:0px;
	list-style-type:none;
	}

#oniMainMenu li{
	width:16.58%;
	height:50px;
	margin:0px;
	float:left;
	overflow:hidden;
	box-sizing:border-box;
	border-right:1px #330000 solid;
	}

#oniMainMenu li:last-child {border:none;}

#oniMainMenu li a {
	display:block;
	font-size:1.0em;
	height:auto;
	text-align:center;
	font-weight:bold;
	line-height:50px;
	color:#FFF;
	}

#oniMainMenu li:hover, #oniMainMenu li:active {background-color:#330000;}


/*PC・タブレット非表示設定*/

#mobileMenu {display:none;}



/*--------コンテンツ全体--------*/

#Content {
    width:100%;
	max-width:1040px;
    float:none;
    height:auto;
	margin-top:0px;
    margin-left:auto;
    margin-right:auto;
    clear:none;
    display:block;
	background:url(../images/onikoube_bg.jpg) no-repeat top;
	background-size:100%;
	overflow:hidden;
	}


#Content p,li,dt,dd,table{
	color:#e6e6e6;
	line-height:1.6em;
	}


/*注意書き・サウンドON_OFF*/

.topArea{
	width:100%;
	padding-top:70px;
	}

.annotation{
	width:35%;
	max-width:250px;
	margin:0;
	padding:0;
	}

.sound{
	margin:1.5em 1em;
	float:right;
	}

.sound ul{padding:0; margin:0;}

.sound li{
	margin-right:0.25em;
	display:inline-block;
	}

	

/*見出し*/
h1{width:40%; margin:0 auto;}

h2{
	padding:0.25em 0.8em;
	font-size:1.3em;
	color:#000;
	background:#720000;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #5d5d5d), color-stop(1.00, #dedede));
	background: -webkit-linear-gradient(#5d5d5d, #dedede);
	background: -moz-linear-gradient(#5d5d5d, #dedede);
	background: -o-linear-gradient(#5d5d5d, #dedede);
	background: -ms-linear-gradient(#5d5d5d, #dedede);
	background: linear-gradient(#5d5d5d, #dedede);
	}

h3{
	padding:0.25em;
	color:#a40000;
	border-bottom:dotted 1px;
	}
	
h4{color:#e6e6e6;}
	

/*--------開催概要--------*/
#eventArticle{
	width:100%;
	padding:0 0 1em;
	background:rgba(0,0,0,0.6);
	filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=0,StartColorStr=#00000066,EndColorStr=#00000066);
	clear:right;
	}


/*記事*/
.article {
	padding:60px 1em 20px 1em;
	margin-bottom:-60px;
	}

.article li{margin-bottom:0.5em;}

.article a{color:#7ecef4 !important;}
.article a:hover{color:#acdbf2 !important;}

#footer a{color:#7ecef4 !important;}
#footer a:hover{color:#acdbf2 !important;}



/*ストーリー*/
.onikoube_story{
	width:70%;
	margin:0 auto 6em auto;
	}

.onikoube_story p{
	margin-left:0 !important;
	margin-bottom:1.2em;
	line-height:1.8em !important;
	}
	

/*開催概要*/
.place{
	width:70%;
	margin:auto;
	padding: 2%;
	border:double #a40000;
	}

.place ul{margin:0 !important; padding:0 !important;}

.place li{
	font-size:1.2em;
	text-align:center;
	list-style-type:none;
	}


/*Twitterウィジェット*/
.tw_widget{width:55%; margin:auto;}
.twitter-timeline{width:100% !important;}


/*FAQ*/
dl.QandA{margin:1.5em 1.5em 2.5em 1.5em;}
dl.QandA dt{font-weight:bold;}
dl.QandA dd{margin:0 0 1em 0;}


/*アクセス*/
.article table{
	width:90%;
	margin-bottom:1.5em;
	text-align:center;
	border-top:1px solid #e6e6e6;
	border-left:1px solid #e6e6e6;
	border-right:1px solid #e6e6e6;
	}

.article table.small{width:60%;}


.article th{border-left:1px solid #e6e6e6;}
.article th.title{width:20%;}
.article th.s_title{width:40%;}

.article th.schedule{width:60%;}
.article td.time{width:10%;}

.article td{border-left:1px dotted #e6e6e6;}

.article th,td{border-bottom:1px solid #e6e6e6;}



/*予約受付*/
div.form{
	width:96%;
	margin:2em auto 0.8em auto;
	padding:0.8em 0;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	background:#FF0004;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #ff0002), color-stop(1.00, #5c0909));
	background: -webkit-linear-gradient(#ff0002, #5c0909);
	background: -moz-linear-gradient(#ff0002, #5c0909);
	background: -o-linear-gradient(#ff0002, #5c0909);
	background: -ms-linear-gradient(#ff0002, #5c0909);
	background: linear-gradient(#ff0002, #5c0909);
	}

div.form p{
	font-size:1.6em;
	font-weight:bold;
	color:#FFF;
	margin-left:0 !important;
	text-align:center;
	font-family:"Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝",serif;
	}	

div.form:hover{
	background:#c20104;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #d20004), color-stop(1.00, #130505));
	background: -webkit-linear-gradient(#d20004, #130505);
	background: -moz-linear-gradient(#d20004, #130505);
	background: -o-linear-gradient(#d20004, #130505);
	background: -ms-linear-gradient(#d20004, #130505);
	background: linear-gradient(#d20004, #130505);
	}



/*--------SNSシェアボタン--------*/
.shareBox {
	float:none;
	width:auto;
	height:auto;
	margin:60px auto;
	clear:both;
	padding:2%;
	text-align:center;
	}

.shareButtons {
	width:auto;
	height:auto;
	margin:0px auto;
	clear:none;
	display:inline-block;
	}

.fb-like {
	width:170px;
	margin-bottom:10px;
	float:left;
	}
	
.tweetBtn {
	width:110px;
	margin-bottom:10px;
	float:left;
	}
	
.googleBtn {
	width:90px;
	margin-bottom:10px;
	float:left;
	}
	
.lineBtn {
	width:90px;
	margin-bottom:10px;
	float:left;
	display:none;
	}


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

#footer {
	float: none;
	height: auto;
	width: 100%;
	position: relative;
	max-width: 1040px;
	margin: 0 auto 20px;
	}


#footer p {
	font-size: 0.9em;
	color: #e6e6e6;
	line-height: 1.6;
	text-align: center;
	}

#footer img {
	display: block;
	margin: 0 auto;
	}


#footMenu {
	}

#footMenu ul {
	width: 50%;
	margin: 50px auto 40px;
	padding: 0;
	}

#footMenu li {
	list-style-type: none;
	border-right: 1px #666 solid;
	width: 25%;
	float: left;
	font-size: 0.9em;
	text-align: center;
	line-height: 1em;
	}

#footMenu li:first-child {
	width: 49%
	}

#footMenu li:last-child {
	border: none;
	}

#siteCopyright {
    float: none;
    font-size: 0.9em;
    height: auto;
    text-align: center;
    font-weight: normal;
    line-height: 1em;
    margin: 0px;
    clear: both;
    min-height: 0px;
    color: #e6e6e6;
    padding: 2%;
	margin-bottom: 40px;
	}
	
	
	
/*--------ページトップへ戻る--------*/
#pageTop {
	position: fixed;
	bottom: 20px;
	right: 20px;
	font-size: 0.9em;
	padding: 0;
	margin: 0;
	width: 70px;
	height: 70px;
	border-radius: 8px;
	-webkit-border-radius: 8px;
	background-color: #c1141b;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0.00, #ff0002), color-stop(1.00, #5c0909));
	background: -webkit-linear-gradient(#ff0002, #5c0909);
	background: -moz-linear-gradient(#ff0002, #5c0909);
	background: -o-linear-gradient(#ff0002, #5c0909);
	background: -ms-linear-gradient(#ff0002, #5c0909);
	background: linear-gradient(#ff0002, #5c0909);
	}

#pageTop a {
	border-radius: 8px;
	-webkit-border-radius: 8px;
	display: block;
	text-decoration: none;
	line-height: 70px;
	color: #FFF !important;
	text-align: center; 
	text-shadow: rgba(0,0,0,0.51) -1px -1px 1px;
	}

#pageTop a:hover, #pageTop a:active {
	background-color: rgba(235,235,235,0.4);
	}

/*20150910*/
#movie {
	margin-top: 20px;
	}

#movie iframe{
	display: block;
	margin: 0 auto;
	}

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

/*--------メニュー--------*/

/*PC・タブレット用*/
#oniMainMenu li a {font-size:0.8em;}



/*--------コンテンツ全体--------*/


/*ストーリー*/
.onikoube_story{
	width:90%;
	margin:0 auto 4em auto;
	}

/*開催概要*/
.place{
	width:85%;
	padding: 2%;
	}

/*Twitterウィジェット*/
.tw_widget{width:75%; margin:auto;}

/*アクセス*/
.article table{width:100%;}

.article table.small{width:80%;}

/*20150910*/
#movie {
	padding: 10px;
	}

#movie iframe{
	width: 100%!important;
	max-width: 560px;
	height: 315px!important;
	}
}



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


/*--------コンテンツ全体--------*/

/*注意書き・サウンドON_OFF*/

.topArea{padding-top:45px;}

.annotation{width:50%; margin-left:0.5em;}


/*ストーリー*/
.onikoube_story{
	width:100%;
	margin:0 auto 2em auto;
	}


/*開催概要*/
.place{
	width:100%;
	margin:auto;
	padding: 2%;
	border:double #a40000;
	}

.place li{font-size:1em;}


/*Twitterウィジェット*/
.tw_widget{width:90%; margin:auto;}


/*予約受付*/
div.form p{font-size:1.4em;}	


/*アクセス*/
.article table.small{width:100%;}



/*スマホ用メニュー*/
#menu {
	z-index: 1000;
	padding: 0;
	box-shadow: rgba(0, 0, 0, 0.298039) 1px 5px 10px 1px;
	}

#mobileMenu {
	display: block;
	width: 100%;
	background-color: #720000;
	}

	#mobileMenu:hover {opacity: 0.9;}
	#mobileMenu:active {background: #fff;}


/*ボックス固定用クラス*/
.fixed {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	}

/*メインメニュートグル*/
#oniToggle{
	width: 100%;
	float: right;
	position: relative;
	}

	#oniToggle a{
		display: block;
		position: relative;
		padding: 10px 0px 10px 0px;
		color: #fff;
		text-decoration: none;
		text-align: center;
		}

	#oniToggle a span:after {content: "メニュー";}


#oniToggle:before{
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 10px;
	width: 25px;
	height: 20px;
	margin-top: -10px;
	background-color: rgb(255,255,255);
	border-radius: 2px;
	}

#oniToggle a:before, #oniToggle a:after{
	display: block;
	content: "";
	position: absolute;
	top: 50%;
	right: 10px;
	width: 25px;
	height: 4px;
	background-color: #720000;
	}

#oniToggle a:before{margin-top: -6px;}
#oniToggle a:after{margin-top: 2px;}

#oniMainMenu {
	display: none;
	border-radius: 0;
	-webkit-border-radius: 0;
	height: auto;
	box-shadow: none;
	}

	#oniMainMenu li  {
		margin: 0px;
		clear: none;
		float: none;
		width: 100%;
		border: none;
		border-bottom: 1px #fff solid;
		background-color: #333;
		height: auto;
		padding-left: 10px;
		}

	#oniMainMenu li:first-child {
		border-radius: 0;
		-webkit-border-radius: 0;
		}

	#oniMainMenu li:last-child {
		border-radius: 0;
		-webkit-border-radius: 0;
		border-bottom: 1px #fff solid;
		}
	
	#oniMainMenu li a {
		line-height: 2.5em;
		font-size: 1.2em;
		text-align: left;
		text-shadow: none;
		}

	#oniMainMenu li a:before {
		font-family: "typicons";
		content: '\e0b0';
		font-size: 1.0em;
		margin-right: 10px;
		}



	#oniMainMenu li:hover, #oniMainMenu li:active {
		background-color: #330000;
		}

/*20150910*/
#movie iframe{
	max-width: 560px;
	height: 200px!important;
	}


}