@charset "utf-8";

/* =base
------------------------------------------------------------------------------------------*/
body {
	text-align: center;
	color: #ccc;
	background-color:#000;
	font-family:"メイリオ","Meiryo","MS PGothic","Osaka",Arial,sans-serif;
	font-size: 14px;
	line-height:20px;
	height:100%;
}
html {overflow-y:scroll; height:100%;}

a {color: #cc9933;text-decoration: none; outline:none;}
a:hover {color: #9a751c;text-decoration: underline;}
a:hover img{opacity:0.8;filter: alpha(opacity=80);}

@media print {
  body {
    -webkit-print-color-adjust: exact;
  }
}

/* =fade
------------------------------------------------------------------------------------------*/
#js_fade2 {position : fixed;top : 0;left : 0;width: 100%; height : 100%;background-color : #000;background-image : url( ../images/loading_b.gif );background-repeat : no-repeat; background-position : 50% 50%; z-index: 999;}
#js_fadein {position : fixed;top : 0;left : 0;width: 100%; height : 100%;background-color : #000;background-image : url( ../images/loading_b.gif );background-repeat : no-repeat; background-position : 55% 50%; z-index: 10;}

/* =コンテイナー
------------------------------------------------------------------------------------------*/
.fade_container{}
#container {width: 100%;position: relative;height: 100%;margin:0 auto;min-height: 630px; overflow:visible;}
#wrap{position:relative;text-align:left;float: left;}

/* =ヘッダーCSS
------------------------------------------------------------------------------------------*/
#top_head{
	position:fixed;
	width:220px;
	text-align:left;
	height:auto;
	height:100%; background-color:#000;
	background-image:url(../images/nav_bg.jpg); background-repeat:no-repeat;
	z-index: 15;
	left: 0px;-webkit-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.75);
-moz-box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.75);
box-shadow: 0px 0px 20px 0px rgba(0,0,0,0.75);
}
.leftlogo a{ margin-bottom:2px; width:220px; height:118px; background-image:url(../images/nav_logo.jpg); text-indent:-9999px; display:block;}
.leftlogo a:hover{opacity:0.8;filter: alpha(opacity=80);}

/* =navi CSS
------------------------------------------------------------------------------------------*/

.mainnav{margin-bottom:4px;}
.mainnav li{margin:0; height:39px; position:relative;}

.mainnav li a{ background-image:url(../images/nav_menu5.jpg); display:block; height:39px; text-indent:-9999px;
  -moz-transition: .2s;
  -webkit-transition: .2s;
  -o-transition: .2s;
  -ms-transition: .2s;
  transition: .2s;}

.mainnav li a.nav_news{ background-position:0 0px;}
.mainnav li a.nav_news:hover,.mainnav li.at a.nav_news{ background-position:220px 0}

.mainnav li a.nav_about{ background-position:0 -39px;}
.mainnav li a.nav_about:hover,.mainnav li.at a.nav_about{ background-position:220px -39px}
.mainnav li a.nav_bands{ background-position:0 -78px;}
.mainnav li a.nav_bands:hover,.mainnav li.at a.nav_bands{ background-position:220px -78px}

.mainnav li a.nav_timetable{ background-position:0 -117px;}
.mainnav li a.nav_timetable:hover,.mainnav li.at a.nav_timetable{ background-position:220px -117px;}

.mainnav li a.nav_tickets{ background-position:0 -156px;}
.mainnav li a.nav_tickets:hover,.mainnav li.at a.nav_tickets{ background-position:220px -156px;}
.mainnav li a.nav_access{ background-position:0 -195px;}
.mainnav li a.nav_access:hover,.mainnav li.at a.nav_access{ background-position:220px -195px;}

.mainnav li a.nav_notice{ background-position:0 -234px;}
.mainnav li a.nav_notice:hover,.mainnav li.at a.nav_notice{ background-position:220px -234px;}

.mainnav li a.nav_ozztv{ background-position:0 -273px;}
.mainnav li a.nav_ozztv:hover,.mainnav li.at a.nav_ozztv{ background-position:220px -273px;}

.mainnav li a.nav_goods{ background-position:0 -312px;}
.mainnav li a.nav_goods:hover,.mainnav li.at a.nav_goods{ background-position:220px -312px;}

.subnav li a{ display:block; width:220px; height:47px; text-indent:-9999px;}
.subnav li a:hover{opacity:0.7;filter: alpha(opacity=70);}
  
.subnav li a.nav_goods{ background-image:url(../images/left_goods3.png); background-repeat:no-repeat; background-position:27px 0; height:60px; margin-bottom:3px;}
.subnav li a.nav_en{ background-image:url(../images/nav_en.png)}
.subnav li a.nav_twt{ background-image:url(../images/nav_tw.png)}
.subnav li a.nav_fb{ background-image:url(../images/nav_fb.png)}


/* =footer
------------------------------------------------------------------------------------------*/
footer{ position:relative;  z-index:5; background-image:url(../images/foot_bg.jpg);bottom:0; padding-left:220px;}
.copyright{ float:left; padding:15px 20px 10px 20px; margin:0; font-size:11px;}
.hiplogo{ float:right; padding:10px 25px 15px 10px;}

footer.about_foot{ padding-left:0px; position:absolute; bottom:0; width:100%; padding-bottom:5px; line-height:20px;}


.sharearea{ position:fixed; right:20px; top:0px;text-align:left;background-color: rgba(0,0,0,0.6); z-index:99;
padding:9px 15px 1px 15px;
border-radius: 0px 0px 10px 10px;
-moz-border-radius: 0px 0px 10px 10px;
-webkit-border-radius: 0px 0px 10px 10px;
}
.sharearea h2{ float: left; width:70px;}
.sharearea ul{ padding:8px 0 0 0;}
.sharearea li{ float:right;margin-left:5px;}
.sharearea li.fb{ display: block;overflow: hidden;}
.sharearea li.twt{display:block;overflow: hidden;}


/* =ページトップ
------------------------------------------------------------------------------------------*/
.page_top{text-align: right;margin: 0;  width:80px;  text-align:center;position:fixed; right:30px; bottom:40px; font-size:10px; z-index:10}
.page_top a{background-color:#A00;display:block;border-radius: 50%;height:80px; width:80px; line-height:80px; color:#fff;}
.page_top a:hover{background-color:#C00; text-decoration:none; color:#FFF;}


/* =見出し
------------------------------------------------------------------------------------------*/
h1{margin:0;}
h2{margin:0;}
h3{margin:0;}
h4{margin:0;}
h5{margin:0;}


/* =clearfix
------------------------------------------------------------------------------------------*/
.clearfix:after{clear:both;display:block;height:0;line-height:0;visibility:hidden;font-size:0.1em;content:".";}


/* =likebox
------------------------------------------------------------------------------------------*/


/* フォント
------------------------------------------------------ */
/* = フォント
/* IE */
@font-face {font-family: 'cserif';src: url('../fonts/TrajanPro-Regular.eot');}
/* Firefox, Opera, Safari */
@font-face {font-family: 'cserif';src: url('../fonts/TrajanPro-Regular.otf') format('opentype');}
.cserif{font-family: 'cserif';}
