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

/*
オレンジ
f5a60c

茶
7b4b17

*/

/*  -- basic setting --
----------------------------------------------------------------------------------------------------*/
body{
	width:100%;
	background-color:#fff3df;
	color:#7B4B17;
	font-family: "Lucida Grande", "segoe UI", "ヒラギノ丸ゴ ProN W4", "Hiragino Maru Gothic Pro", "メイリオ", Meiryo, Verdana, Arial, sans-serif;
	font-size:100%;
	line-height:1.4;
	-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
	-webkit-text-size-adjust: 100%;
	-moz-text-size-adjust: 100%;
}
/* for WinIE6 */
* html body {
    font-size: 75%;
    font-family: 'メイリオ', Meiryo, Verdana, sans-serif;
}
/* for WinIE7 */
*:first-child+html body {
    font-size: 75%;
    font-family: 'メイリオ', Meiryo, sans-serif;
}
* {
		box-sizing: border-box;
-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
	 -o-box-sizing: border-box;
}

/* link */
a{text-decoration:none;}
a:link, a:visited{
	color:#f5a60c;
-webkit-transition: all 0.5s ease-in-out;
   -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
     -o-transition: all 0.5s ease-in-out;
}
a:active{
	color:#f9bc4a;
}
a:hover{
	color:#f9bc4a;
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}

/* images to scaling */
img {
    max-width: 100%;
    height: auto;
}

/* clearfix */
.clearfix {zoom:1;}
.clearfix:after{
    content: ""; 
    display: block; 
    clear: both;
}

h1,h2,h3,h4,h5{
	clear:both;
}

/*  -- common setting --
----------------------------------------------------------------------------------------------------*/
.accetnt{
	background-color:#fad285;
}
.right{
	text-align:right;
}

/*  -- site framework --
----------------------------------------------------------------------------------------------------*/
#wrap{
	width:100%;
}

/* header */
#headerFrame{
	width:100%;
}
#header{
	margin:0 0 0 50px;
}

/* main */
#main{
	clear:both;
	width:100%;
}
#content{
	width:760px;
	height:100%;
	margin:10px auto 10px 240px;
}

/* footer */
#footer{
	width:100%;
	height:150px;
	background-color:#7B4B17;
}
#footerInner{
	width:960px;
	margin:0 auto;
	padding:15px;
}


/*  -- header --
----------------------------------------------------------------------------------------------------*/

/* -- header logo = h1 -- */
#headerLogo{
	float:left;
}
#headerLogo a {
-webkit-transition: all 0.5s ease-in-out;
   -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
     -o-transition: all 0.5s ease-in-out;
}

/* -- header Banner -- */
#headerBanner{
	float:right;
}

/* ロゴ脇の情報 */
#headerSubTitle{
	float:left;
	margin:60px 0 0 30px;
}

/* -- ★ header navigation -- */
#nav{
	clear:both;
}
#navUl{
	width:180px;
	background-color: #F5A60C;
	border-radius:10px;
	font-size:0px;
	position: absolute;
	top:128px;
	left:30px;
	padding:5px 0;
}
#navUl li{
	font-size:16px;
	font-weight:bold;
	margin:0 0 0 10px;
}
#navUl li a{
	height:30px;
	display:block;
	color:#ffffff;
	background-image :url("../img/arrow.png");
	background-repeat:no-repeat;
	background-size:10px 10px;
	background-position:5px 10px;
-webkit-transition: all 0.3s ease-in-out;
   -moz-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
     -o-transition: all 0.3s ease-in-out;
	padding:5px 10px 10px 20px;
}
#navUl li a:hover{
	color:#7b4b17;
}
#navUl li a.current {
	color:#7b4b17;
}
#navUl {zoom:1;}
#navUl:after{
    content: ""; 
    display: block; 
    clear: both;
}

#navBanner {
	width:180px;
	font-size:0px;
  position: absolute;
	top:380px;
	left:30px;
	padding:5px 0;
}
#navBanner li {
  margin: 3px 0;
}

/*  -- top eyecatch --
----------------------------------------------------------------------------------------------------*/
#topEyecatch{
	height:420px;
	overflow:hidden;
}


/*  -- content --
----------------------------------------------------------------------------------------------------*/
#content h1{
	width:100%;
	background-color:#7B4B17;
	border-radius:10px;
	color:#ffffff;
	font-family:'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック',sans-serif, "Osaka－等幅";
	font-size:300%;
	font-weight:bold;
	margin:0 0 10px 0;
	padding:5px 0 0 20px;
}
#content h2{
	border-bottom:1px solid #7b4b17;
	font-size:125%;
	font-weight:bold;
	margin:10px 0 20px;
}
#content h3{
	font-size:125%;
	font-weight:bold;
	margin:20px 0 10px;
}
#content h4{
	font-size:100%;
	font-weight:bold;
	color:#777777;
	margin:30px 0 0 0;
}
#content a{
	text-decoration:underline;
}
#content section{
	clear:both;
	background-color:#ffffff;
	border-radius:10px;
	margin:10px 0;
	padding: 5px 20px;
}
#content section p {
	font-size:87.5%;
	margin:10px 0;
}
#content section ul {
	margin:10px 0 30px;
}
#content section li {
	font-size:87.5%;
  list-style: disc;
  margin: 0 0 5px 20px;
}
#content img{
	margin:5px 0;
}

#content {zoom:1;}
#content:after{
    content: ""; 
    display: block; 
    clear: both;
}

/*  -- article --
--------------------------------------------------*/
#article{
}
/* innerfade */
#topEyecatch{
	width:700px;
	height: 300px;
	overflow:hidden;
	text-align:center;
	margin:0 auto;
}
.eyecatch li{
	display:block;
	width:700px;
	height: 300px;
    display:table-cell;
    text-align:center;
    vertical-align:middle;
    layout-grid-line:430px;
}
.eyecatch li img{
     vertical-align:middle;
	 box-shadow:0 2px 5px 0px rgba(255,255,255,0.2);
}


/*  -- aside --
----------------------------------------------------------------------------------------------------*/
#aside{
	width:100%;
	position:inherit;
	background-color:#fcf7ef;
	border-radius:5px;
	margin:0;
	padding:10px;
}
#aside li{
	margin:0 10px;
}
#aside {zoom:1;}
#aside:after{
    content: ""; 
    display: block; 
    clear: both;
}

/* sidebar banner */
#sidebarBanner li{
	float:left;
}


/*  -- live --
--------------------------------------------------*/

/* innerfade */
#liveEyecatch{
	width:700px;
	height: 300px;
	overflow:hidden;
	text-align:center;
	margin:0 auto;
}

/*  -- date (ex. 2013.07) --  */
#live_ym{
	color:#7b4b17;
	font-size:300%;
	font-weight:bold;
}

/*  -- prev month & next month --  */
.monthNav{
	clear:both;
	display:block;
	font-size:87.5%;
}
.prevMonth a{
	width:130px;
	height:30px;
	float:left;
	background-color:#f5a60c;
	border-radius:5px;
	color:#ffffff;
	text-decoration:none !important;
	margin:0 0 20px 0;
	padding:5px 10px;
}
.nextMonth a{
	width:130px;
	height:30px;
	float:right;
	text-align:right;
	background-color:#f5a60c;
	border-radius:5px;
	color:#ffffff;
	text-decoration:none !important;
	margin:0 0 20px 0;
	padding:5px 10px;
}
.liveLead section {
  padding: 10px 0 !important;
}

/*  -- 一覧画面のリンクがかかったbox --  */
#live a {
  text-decoration: none !important;
}
#live a h3 {
  color: #7B4B17;
}

/*  -- live ticket --  */
.liveTicket{
	font-size:87.5%;
	margin:10px 20px;
}

/*  -- live schedule Box --  */
.liveContents{
	liveDateclear:both;
	background-color:#ffffff;
	border-radius:10px;
	margin:0 0 5px;
	padding:0 0 1px;
}
.liveContents h2{
	border:none !important;
}
.liveContents {zoom:1;}
.liveContents:after{
    content: ""; 
    display: block; 
    clear: both;
}

/* 写真と本文の横並び */
.liveContents section {
  display: table;
}
.liveTitleBar {
  display: table-cell;
  vertical-align: top;
}
.livePhotoFrame {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  width: 100px;
}

/* date & title */
.liveTitleBar{
}

.liveDateFrame{
	width:20%;
}
.liveDate{
width:200px;
height:40px;
background-color:#F5A60C;
border-radius:5px 0 5px 0;
font-weight:bold;
text-align:center;
line-height:1.0;
margin:0 0 0 -20px;
padding: 5px 0 0;
}
.day{
	color:#ffffff;
	font-size:187.5%;
}
.weekday{
	font-size:162.5%;
	color:#7b4b17;
}
.saturday{
	font-size:162.5%;
	color:#0088cc;
}
.sunday{
	font-size:162.5%;
	color:#cc0000;
}
.liveTitleBar h2{
	width:100%;
	float:left;
}

/*  -- liveInfo --*/
.liveInfoFrame{
	clear:both;
	padding:10px 0 0 0;
}
.liveInfo01{
	width:100%;
}
.liveTable{
}
.liveTable td:nth-child(2n+1){
	width:150px;
	height:20px;
	font-size:87.5%;
	font-weight:bold;
	color:#777777;
	clear:both;
}
.liveTable td:nth-child(2n){
	width:500px;
	font-size:87.5%;
	color:#777777;
}

/*  -- information --*/
.liveInfo02{
	clear:both;
	width:100%;
}
.liveInfo02 p{
	font-size:87.5%;
	color:#777777;
}

/*  -- artistPhoto --*/
.artistPhoto{
	clear:both;
	width:100%;
	height:auto;
	display: inline-block;
	overflow:hidden;
	padding:10px 0px 20px 0px;
}
.artistPhotoInner{
	width:30%;
	display: inline-block;
}
.artistPhotoText{
	width:100%;
	display: inline-block;
	font-size:87.5%;
}


/*  -- menu --
----------------------------------------------------------------------------------------------------*/
.menuImg{
	width:100%;
	overflow:hidden;
	margin:0 auto;
}
.menuImg ul{
	font-size:0;
}
.menuImg li{
	width:31%;
	font-size:16px;
	display:inline-block;
	margin:0 5px;
}
.menuImg img{
	max-width:100%;
}
.menuImg li div{
	background-color:#000000;
	color:#ffffff;
	font-size:87.5%;
	margin:-5px 0 10px 0;
}


/*  -- access --
----------------------------------------------------------------------------------------------------*/
#access{
}
#access section{
}
#access section p{
	margin-bottom:30px;
}


/*  -- about --
----------------------------------------------------------------------------------------------------*/
#about{
}
#aboutIndex{
}
#about img{
	width:100%;
	text-align:center;
	margin:0 auto;
}
/*  -- Table --  */
.aboutTable{
	font-size:87.5%;
	margin:10px 0 0 0;
	width:100%;
}
.aboutTable tr:nth-child(2n+1){
	background-color:#fff3df;
}
.aboutTable td{
	text-align:left;
	padding:5px;
	line-height:1.4;
}
.aboutTable th{ width:30%; }
.aboutTable td:nth-child(1){ width:30%; }
.aboutTable td:nth-child(2){ width:30%; }
.aboutTable td:nth-child(3){ width:auto; }


/*  -- space --
----------------------------------------------------------------------------------------------------*/
#space p {
  margin: 0 0 20px!important;
}
.spaceTable {
  border: 1px solid #eaeaea;
  box-sizing: border-box;
	font-size:87.5%;
	margin:10px 0 15px;
	width:100%;
}
.spaceTable th {
  background-color: #fff3df;
  border: 1px solid #eaeaea;
  box-sizing: border-box;
  padding: 10px;
  text-align: left;
}
.spaceTable td {
  border: 1px solid #eaeaea;
  box-sizing: border-box;
  padding: 10px;
}
.space-text {
  font-size: 87.5%;
  margin: -20px 0 30px;
}
/*  -- Twitter ウィジェット --
----------------------------------------------------------------------------------------------------*/
.tw-box {
  background-color: #fff;
  border-radius: 10px;
  height: 600px;
  overflow: scroll;
  position: absolute;
  top: 120px;
  left: 1020px;
  width: 300px;
}
@media screen and (max-width: 768px) {
  .tw-box {
    display: none;
  }
}


/*  -- footer --
----------------------------------------------------------------------------------------------------*/
#footer{
	color:#ffffff;
}
#footerInner{
}
#footerInner p{
	font-size:75%;
}

/*  -- gohome --
--------------------------------------------------*/
#gohome{
	position: fixed;
	bottom:0px;
	right:20px;
}
#gohome a{
	width:60px;
	height:60px;
	display:block;
-webkit-transition: all 0.5s ease-in-out;
   -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
     -o-transition: all 0.5s ease-in-out;
}
#gohome a:hover{
	filter: alpha(opacity=60);
	-moz-opacity: 0.6;
	opacity: 0.6;
}

/*  -- Facebook likebox --
--------------------------------------------------*/
#fblikebox{
	margin:10px 0 0 0;
	background:#ffffff;
}
div#fblikebox .fbcomments,
div#fblikebox .fb_iframe_widget,
div#fblikebox .fb_iframe_widget[style],
div#fblikebox .fb_iframe_widget iframe[style],
div#fblikebox .fbcomments iframe[style],
div#fblikebox .fb_iframe_widget span{
    width: 100% !important;
}

/*  -- sample --
--------------------------------------------------*/
{
filter: alpha(opacity=80);
-moz-opacity: 0.8;
opacity: 0.8;
}

/*-- media queries - PCのスタイルから記述していく場合
------------------------------------------------------------------*/

/* デフォルト：980px以上用（PC用）の記述 */

@media screen and (max-width: 979px) {
/* 979px以下用（タブレット用）の記述 */
#header{
	margin:0;
}
#headerSubTitle{
	float:left;
	margin:5px;
}
#navUl{
	width:100%;
	position:inherit;
	margin:0;
	padding:5px 0;
}
#navUl li{
	display:inline-block;
}
#navBanner {
  display: none;
}
#content{
	width:100%;
	height:100%;
	margin:10px auto 10px 0px;
}
#content section{
	padding:0 10px;
}
.liveTitleBar h2{
	width:100%;
}
.liveInfoFrame{
	margin:0 0 0 20px;
}
.liveDate{
padding:5px 0 0 0;
margin:0px 0 0 -20px;
}
#footerInner{
	width:100%;
	padding:15px 5px;
}

}
@media screen and (max-width: 767px) {
/* 767px以下用（タブレット／スマートフォン用）の記述 */
#topEyecatch{
	width:100%;
}

#liveEyecatch{
	width:100%;
}

.eyecatch li{
	width:100%;
}
.eyecatch li img{
}

.livePhotoFrame {
  display: none;
}
}
@media screen and (max-width: 479px) {
/* 479px以下用（スマートフォン用）の記述 */
#headerLogo img {
  max-width: 300px;
}
#content section{
	padding:0px 5px;
        box-sizing: border-box;
-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
     -o-box-sizing: border-box;
}
#aside li{
	margin:0 0 0 60px;
}
.menuImg li{
	width:47%;
}
#footerInner{
        box-sizing: border-box;
-webkit-box-sizing: border-box;
   -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
     -o-box-sizing: border-box;
	padding:15px 5px;
}
}