@charset "utf-8";

/* =base
------------------------------------------------------------------------------------------*/
*{ box-sizing: border-box;}

body {
	text-align: center;
	color: #eee;
	font-family: "メイリオ","Meiryo","MS PGothic","Osaka",Arial,sans-serif;
	font-size: 14px;
	line-height: 1.5em;
	height: 100%;
	background-color: #000; 
background-image:url(../images/bg.png);
 background-position: top left;
 background-repeat: no-repeat;
background-attachment: fixed;
background-size: cover;
}
html {overflow-y:scroll; height:100%;}

a {color: #C00;text-decoration: none; outline:none;}
a:hover {color: #C00;text-decoration: underline;}
a:hover img{opacity:0.8;filter: alpha(opacity=80);}

@media print {
  body {
    -webkit-print-color-adjust: exact;
  }
}

.pcnone{ display:none;}

@media only screen and (max-width: 639px){
body{
background-attachment: inherit; background-position:0 25px; background-size:250%;
}
.pcnone{ display:block;}

}

/* =bg
------------------------------------------------------------------------------------------*/
/*
body {min-height: 100%; background:url('../images/amanohyde_bg.jpg') no-repeat center; background-size:cover; }
*/

/* =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:100;}

/* =コンテイナー
------------------------------------------------------------------------------------------*/
.fade_container{}
/*
#container {width: 100%;position: relative;height: 100%;margin:0 auto; overflow:visible; min-width:900px; z-index:60;}
*/
#container {
	width: 100%;
}

#wrap{position:relative;text-align:left;float: left;}

/* =header
------------------------------------------------------------------------------------------*/
header{position: fixed;top: 0;z-index: 10;width: 100%;z-index: 20; background-color:rgba(0,0,0,0.5); height:40px;}
header h1{ float:left; padding:14px 0 0 20px;}
header h1 img{ width:260px;}

header nav{ float:right; padding-right:20px;}
header nav li{ float:left; height:40px;}

header nav li a{ display:block; background-image:url(../images/head_navro.png); height:40px;overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  -moz-transition: .2s;
  -webkit-transition: .2s;
  -o-transition: .2s;
  -ms-transition: .2s;
  transition: .2s;
}


header nav li a.home{ background-position:-7px -40px; width:53px;}
header nav li a.about{ background-position:-60px -40px; width:64px;}
header nav li a.bands{ background-position:-124px -40px; width:68px;}
header nav li a.tickets{ background-position:-192px -40px; width:74px;}
header nav li a.buy{ background-position:-284px -40px; width:186px; margin-left:10px}

header nav li a:hover{ background-position-y: 0;}
header nav li.active a{background-position-y: 0;}


.nav_trigger{display: none;}

@media only screen and (max-width: 639px){
header{ height:50px;}
header h1{ text-align:left; padding:0;}
header h1 a{ display:block; line-height:50px; width:70%; padding-left:3%;}
header h1 img{ width:100%;}

header nav li{ height: initial; float:inherit;}
header nav li a{ background:none; text-indent:inherit; width:100%!important; color:#fff; text-align:center; font-family: 'Oswald'; height:inherit; }
header nav li a:hover{ text-decoration:none; color:#016b96;}

nav#innavi2{ display:none;}

.global{width:100%; position:fixed; z-index:10; top:0; left:0; overflow-y: hidden; padding-top:0; height:0; background-color:rgba(0,0,0,0.7); box-sizing: border-box;
 -webkit-transition: 1s ease;  -moz-transition: 0.5s ease;  -o-transition: 0.5s ease;  -ms-transition: 0.5s ease;  transition:0.5s ease;}
.global li{width: 100%; display:inherit; background-color:#000;}

.nav-active .global{ height:100vh;padding-top:45px;}

.nav li.sp_top{ display: inherit;}

.toggle_nav{ -webkit-transition: 0.2s ease;  -moz-transition: 0.2s ease;  -o-transition: 0.2s ease;  -ms-transition: 0.2s ease;  transition: 0.2s ease;}
.nav{ margin-bottom:0; width:100%; height:inherit;}
.nav li{ border-bottom:1px solid #004f6f; line-height:3.6em; padding-right: 0;}
.nav li:first-child{ border-top:1px solid #004f6f;}
.nav li a:hover,nav li a.at{  border-bottom: none;}

/* Default navigation icon */
.nav_trigger { display: block; position: fixed; width: 30px; height: 25px; right: 15px; top: 13px; z-index: 200;}
.nav-active .nav_trigger { opacity: 0.7;}
.nav_icon { display: inline-block; position: relative; width: 30px; height: 5px; background-color: #fff;
  -webkit-transition-property: background-color, -webkit-transform;
  transition-property: background-color, -webkit-transform;
  transition-property: background-color, transform;
  transition-property: background-color, transform, -webkit-transform;
  -webkit-transition-duration: 300ms;
          transition-duration: 300ms;
}
.nav_icon:before,
.nav_icon:after { content: ''; display: block; width: 30px; height: 5px; position: absolute; background: #fff;
  -webkit-transition-property: margin, -webkit-transform;
  transition-property: margin, -webkit-transform;
  transition-property: margin, transform;
  transition-property: margin, transform, -webkit-transform;
  -webkit-transition-duration: 300ms;
          transition-duration: 300ms;
}
.nav_icon:before { margin-top: -10px;}
.nav_icon:after { margin-top: 10px;}

.nav-active .nav_icon { background: rgba(0, 0, 0, 0);}
.nav-active .nav_icon:before { margin-top: 0;
  -webkit-transform: rotate(45deg);
          transform: rotate(45deg);
}
.nav-active .nav_icon:after { margin-top: 0;
  -webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
}

}





/* =foot
-----------------------------------------------------------------------------------------*/
footer{ width:94%; margin:0 auto; margin-bottom:40px; text-align:right;}
.foot_credit a{ display:block; float:right; background-image:url(../images/foot_hip.png); background-repeat:no-repeat; background-position:right; color:#fff; padding-right:110px;}
.foot_credit a:hover{ text-decoration:none; opacity:0.8;}
footer .copy{ float:left; padding-top:1.5em;}


@media only screen and (max-width: 639px){
footer{ margin-bottom:20px; text-align:left; border-top:1px solid #016b96; padding-top:15px;}
.foot_credit a{ font-size:10px; line-height:1.4em;padding-right:0px; background:none; float:inherit;}
footer .copy{ float: inherit; background-image:url(../images/foot_hip.png); background-repeat:no-repeat; background-position:right bottom; background-size:20%; padding-top:10px;}
}


/* =ページトップ
------------------------------------------------------------------------------------------*/
.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:#eee;display:block;border-radius: 50%;height:80px; width:80px; line-height:80px; color:#333;behavior: url(js/PIE.htc);}
.page_top a:hover{background-color:#c5960f; 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:".";}
/*.clearfix{overflow: hidden;}*/

/* font
------------------------------------------------------ */
/* = Trajan font
/* 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';}