@charset "UTF-8";
/* CSS Document */
*{
	margin: 0;
	padding: 0;
}
body{
	width: 100%;
	background-color: #222;
	color: #FFFFFF;
	font-family: 'Noto Serif JP', sans-serif;
}
h2{
	text-align: center;
	padding: 20px 20px;
}

/* header */
header{
	background-image: url(images/header_S.jpg);
	background-size: 100%;
}
header img{
	width: 50%;
	margin-top: 15px;
	margin-left: 10px;
}
/* menu */
#menu{
  position: fixed;
  top:52px;
  right:14px;
  z-index: 9999;
  display:none;
}
#menu ul{
	border:#fff 1px solid;
}
#menu li{
	  border:#fff solid 1px;
	  width:180px;
	  height:35px;
	  margin-bottom:-2px;
	  background-color:#000;
	  color:#fff;
	  vertical-align:middle;
	  list-style-type:none;
	  padding:5px;
	  display:block;
}
#menu li a{
	background-color:#000;
 color:#fff;
 vertical-align:middle;
	display:block;
	font-size:15px;
	text-decoration:none;
	padding-top:8px;
	text-align: center;
}
#hamburger,
#hamburger span {
	display: inline-block;
	transition: all .4s;
	box-sizing: border-box;
}
#hamburger_outer{
	border:1px solid #fff;
	border-radius:3px;
	width:40px;
	height:40px;
	position:fixed;
	top:11px;
	right:14px;
	background-color:rgba(0,0,0,0.5);
}
#hamburger {
	position: fixed;
	top:20px;
	right:0px;
	width: 50px;
	height: 44px;
	z-index:999;
	text-align:center;
	border-radius:5px;
}
#hamburger span {
	position: absolute;
	left: 0;
	width: 60%;
	height: 4px;
	background-color: #fff;
	border-radius: 4px;
}
#hamburger span:nth-of-type(1) {
	top: 0px;
}
#hamburger span:nth-of-type(2) {
	top: 10px;
}
#hamburger span:nth-of-type(3) {
	top: 20px;
}

#hamburger.open span:nth-of-type(1) {
	-webkit-transform: translateY(10px) rotate(-45deg);
	transform: translateY(10px) rotate(-45deg);
}
#hamburger.open span:nth-of-type(2) {
	left: 50%;
	opacity: 0;
	-webkit-animation: active-menu-bar02 .8s forwards;
	animation: active-menu-bar02 .8s forwards;
}
@-webkit-keyframes active-menu-bar02 {
	100% {
		height: 0;
	}
}
@keyframes active-menu-bar02 {
	100% {
		height: 0;
	}
}
#hamburger.open span:nth-of-type(3) {
	-webkit-transform: translateY(-10px) rotate(45deg);
	transform: translateY(-10px) rotate(45deg);
}

/* contents */
section{
	padding-bottom: 30px;
}
/* home */
#home{
	border-bottom: #FFFFFF 1px solid;
}
#sns{
	width: 100%;
	margin: auto;
}
#sns ul li img{
	height: 30px;
}
#sns ul li{
	display: inline-block;
	padding: 10px 10px;
}
#sns ul{
	list-style: none;
	text-align: center;
	margin: auto;
}
#news h3{
	text-align: center;
	margin-bottom: 10px;
}
#news p{
	text-align: center;
}
#store img{
	width: 80%;
	display: block;
	margin: auto;
	margin-bottom: 30px;
}
.movie-titlle{
	text-align: center;
}
iframe{
	width: 80%;
	margin: auto;
	display: block;
}
#news{
	width: 60%;
	margin: auto;
	padding: 20px 20px;
}
#news p{
	font-size: 13px;
}
.movie-titlle{
	display: block;
	width: 80%;
	margin: auto;
	font-size: 15px;
}
/* show */
#show{
	border-bottom: #FFFFFF 1px solid;
}
.live h3{
	text-align: center;
	margin-bottom: 10px;
}
.live h3 a{
	color: #777777;
}
.show-data{
	width: 90%;
	display: block;
	margin: auto;
	font-size: 15px;
}
.flier img{
	width: 60%;
	display: block;
	margin: auto;
	
}
.info{
	width: 60%;
	margin: auto;
	text-align: center;
}
.info p{
	font-size: 15px;
}
.reserve{
	text-align: center;
	margin-bottom: 30px;
}
.reserve a{
	display: inline-block;
	color: #FFFFFF;
	text-decoration: none;
	border-radius: 3px;
	margin-top: 20px;
	font-size: 15px;
	padding: 5px 10px;
	background-color:#FC662A;
}
.cs{
	text-align: center;
}
/* disco */
#discography{
	border-bottom: #FFFFFF 1px solid;
	text-align: center;
}
.jake{
	width: 60%;
}
.album{
	padding-bottom: 40px;
}
.album p a{
	display: inline-block;
	text-decoration: none;
	color: #FFFFFF;
	background-color: #00648B;
	border-radius: 3px;
	margin-top: 10px;
	padding: 3px 5px;
}

/* bio */
#biography{
	border-bottom: #FFFFFF 1px solid;
}
#biography h3{
	margin-bottom: 10px;
}
#zanm-photo img{
	display: block;
	width: 90%;
	margin: auto;
}
#zanm-photo p{
	width: 90%;
	display: block;
	margin: auto;
	padding-bottom: 15px;
	font-size: 12px;
}
#menber{
	width: 90%;
	display: block;
	margin: auto;
}
#menber a{
	color: #777777;
}
#menber img{
	width: 18px;
	margin-left: 8px;
}
#menber .blog{
	margin-left: -5px;
}
.ex-menber{
	margin-top: 10px;
}
#history{
	width: 90%;
	display: block;
	margin: auto;
	margin-top: 20px;
}
#history p{
	font-size: 13px;
}
.history-date{
	margin-top: 10px;
}
/* contact */
#contact{
	border-bottom: #FFFFFF 1px solid;
}
#contact .message{
	width: 90%;
	display: block;
	margin: auto;
	font-size: 13px;
}
#contact p{
	text-align: center;
}
#contact p a{
	color: #777777;
}
/* footer */
footer p{
	text-align: center;
}

/*ticket*/
#ticket h2{
	font-size: 25px;
}
#ticket{
	width: 190px;
	margin: auto;
}
#ticket div{
	text-align: left;
}
#ticket p{
	margin-top: 25px;
	text-align: left;
}

#ticket form{
	text-align: center;
	margin: auto;
	width: 100%;
	display: block;
}
#ticket .cleartext{
	width: 180px;
}
#ticket .button{
	margin-top: 40px;
	margin-bottom: 40px;
	width: 100px;
}
#result{
	text-align: center;
	margin-top: 30px;
	font-size: 12px;
}
