@charset "utf-8"; 

* {
	margin: 0;
	padding: 0;
}

/* body（文字やBGの色 (color #000 黒 #fff 白 6EE cee 007 8ac 0aa cec 48e) border-bottom（ボーダーラインの色）a80 (カーキ)f0f (ピンク)b00 (エンジ) 左上 Logo--------------------*/
body {
	color: #444;/* body（文字の色）--------------------*/
	background: #fff; url(../img/body-bg.jpg) 3% 10px no-repeat
	/*fontsize: 17px/1.7;*/
	font: 14px/1.7 Verdana, san-serif; 
	border-bottom: 3px solid #8ae;
	-webkit-text-size-adjust: 100%;
}
/* heading
--------------------*/
h1, h2, h3, h4 {
	line-height: 1.2;
	margin-bottom: 1em;
}
h1 {
	font-size: 140%;
	color: #a80;
}
h2 {
	font-size: 120%;
	color: #008;
}
h3 {
	font-size: 120%;
	color: #600;
}
h4 {
	font-size: 100%;
	color: #900;
}


/* links（リンク）--------------------*/
a {
	color: #009;
	text-decoration: underline;
}
a:hover {
	color: #c0c;
	text-decoration: none;
}

/* list--------------------*/
ul, ol {
	list-style: outside;
	padding-left: 40px;
}
p, table, dl, ol, ul {
	margin-bottom: 1em;
}
dt {
	font-weight: bold;
}
dd {
	margin-left: 40px;
}
dl ul {
	padding: 0;
}
/* images--------------------*/
img {
	border: none;
	max-width: 100%;
	height: auto;
}

/* table（テーブル）-------------------*/
table {
	border-collapse: collapse;
	line-height: 1.5;
	font-size: 100%;
}
table caption {
	display: none;
}
th, td {
	padding: 6px 3px;
	border-bottom: 1px solid #dddcd6;
}
th {
	vertical-align: top;
	text-align: left;
	/*white-space: nowrap;*/
	font-weight: normal;
}

/**/
form div {
	margin-bottom: 1.5em;
}
fieldset {
	border: none;
}
.required {
	color: #c36;margin-left: 3px;
}
form ul {
	list-style: none;padding-left: 10em;margin:0;
}
form li {
	margin-bottom: .2em;
}
.radio {
	margin-right: 10px;
}
label {
	float: left; width: 10em;

}
ul label {
	float: none;
}
.text {
	border: 1px solid #aaa;
	padding: 3px;
}
input:focus, textarea:focus {
	background: #fff;
	outline: 0;
	border-color: #8cf;
}
.btn {
	border: 1px solid #ccc;
	background: #efefef;
	margin-left: 10em;
	padding: 3px 6px;
	cursor: pointer;
	
}
.btn:hover {
	background: #8cf;color: #fff;
	border-color: #8cf;
}

.field .btn {
	margin: 0;
}

/* スクリーンサイズ640px--------------------*/
@media screen and (max-width: 640px) {
	#mailform th, #mailform td {
		display: block;
	}
	#mailform p {
		display: inline;
	}
	#mailform td {
		margin-bottom: 1em;
	}
}
/* ボーダー
--------------------*/
p.sample1 {border: double 10px #0000ff;}
p.sample2 {border: inset 10px #ff0000;}
p.sample3 {
margin: 30px 30px;
padding: 10px;
border: medium solid #ff00ff;
}


/* container
--------------------*/
#container {}

/* header
右上アイコン
--------------------*/
#header {
	margin: 0 auto;
	padding: 0 20px;
	max-width: 950px;
	position: relative;
}
#logo {
	margin: 0;
}


/* スクリーンサイズ1024px--------------------*/

@media screen and (max-width: 1024px) {
	#header {
		padding: 0;
	}
}

/* スクリーンサイズ767px--------------------*/
@media screen and (max-width: 767px) {
	#header {
		position: inherit;
		padding: 0;
	}
	#logo {
		width: 100%;
		background: #fff;
		text-align: right;
	}
}

/* スクリーンサイズ420px--------------------*/
@media screen and (max-width: 420px) {
	#logo img {
		max-width: 260px;
	}
}
/* sns */
#sns {
	position: absolute;
	top: 40px;
	right: 0px;
	padding: 0;
	list-style: none;
}
#sns li {
	float: left;
	margin: 0 10px;
	width: 50px;
}
#sns img {
	display: block;
}

/* スクリーンサイズ767px--------------------*/
@media screen and (max-width: 767px) {
	#sns {
		position: relative;
		top: 10px;
		right: auto;
		text-align: center;
	}
	#sns li {
		display: inline-block;
		float: none;
	}
}
/* nav（その他ページのナビ）-------------e90(オレンジ) 8cf(水色) 099(グリーンブルー) 555 (ダークグレー) f0f (ライトグレー) ec0 (カーキ) f0f (ピンク) 00d (ダークブルー) 初期font Helvetica / Century Gothic / Chalkduster--------------------*/
#nav {
	clear: both;
	background: #fff;
	margin-top: 1em;
}
#nav ul {
	margin: 0;
	padding: 0;
	list-style: none;
	font: 16px "凸版文久見出し明朝", san-serif;
	text-transform: uppercase;
	border-bottom: medium solid #bbbbbb;
	text-align: center;
}
#nav li {
	display: inline;
	margin: 0 6px;
}
#nav li a {
	text-decoration: none;
	color: #777;
}
#nav a:hover {
	color: #c0c;
	text-decoration: underline;
}
#nav #current a{
	color: #24a;
}



/*top nav（トップページのナビ）------------------------------------------------------------------------------------------------------------------------*/
#top #nav ul {
	font-size: 18px;
	letter-spacing: -2px;
	border: none;
}


/* スクリーンサイズ800px--------------------*/
@media screen and (max-width: 800px) {
	#top #nav ul {
		font-size: 22px;
	}
}
#top #nav li {
	margin: 0 8px;
}
#top #nav a {
	color: #777;
}
#top #nav a:hover {
	color: #c0c;
}
#menu-btn {
	display: none;
}







/* スクリーンサイズ767px（スマホ用）--------------------*/
@media screen and (max-width: 767px) {
	body.open {
		overflow: hidden;
	}
	#nav {
		position: absolute;
		top: -100%;
		width: 100%;
		height: 100%;
		margin: 0;
		background: #8ae;
		z-index: 10000;
		overflow: scroll;
		transition: .7s ease;
	}
	.open #nav{
		top: 0;
	}
	#nav ul {
		height: auto;
		line-height: 44px;
		padding: 48px;
		border: none;
	}
	#nav li {
		display: block;
		}
	#nav li a {
		display: block;
		color: #fff;
		border-bottom: 1px solid #333;
	}
	
	/* menu-btn（スマホ用メニューアイコン）------------------------------------------------------------------------------------------------------------------------*/
	#menu-btn {
		display: block;
		position: absolute;
		top: 8px;
		left: 8px;
		width: 40px;
		height: 40px;
	/* （アイコン枠の色）--------------------*/
		border: 1px solid #888;
		border-radius: 3px;
		text-align: center;
		cursor: pointer;
		z-index: 10001;
	}
	.open #menu-btn{
		border: none;
	}
	#menu-btn::before {
		display: block;
		content: '';
		position: absolute;
		top: 14px;
		left: 10px;
		width: 20px;
		height: 2px;
	/* （2番目の線の色）--------------------*/
		background: #888;
	}
	.open #menu-btn::before{
		display: none;
	} 
	#menu-btn a {
		display: block;
		position: absolute;
		bottom: 4px;
		width: 100%;
		height: 10px;
		line-height: 10px;
		text-transform: uppercase;
		text-decoration: none;
	/* （MENUの文字の色）--------------------*/
		color: #888;
		font-size: 10px;
		font-family: 'Avenir Next', Roboto, sans-serif;
	}
	.open #menu-btn a  {
		color: transparent;
	}
	#menu-btn a::before, #menu-btn a::after{
		display: block;
		position: absolute;
		top: 50%;
		left: 10px;
		content: '';
		width: 20px;
		height: 2px;
	/* （1.3番目の線の色）--------------------*/
		background: #888;
		transition: .3s ease;
	}
	#menu-btn a::before{
		margin-top: -23px;
	}
	#menu-btn a::after{
		margin-top: -11px;
	}
	.open #menu-btn a::before, .open #menu-btn a::after {
		margin: -12px 0 0 0;
	/* （閉じたときのxマークの色）--------------------*/
		background: #888;
	}
	.open #menu-btn a::before{
		-webkit-transform: rotate(45deg);
		-moz-transform: rotate(45deg);
		-o-transform: rotate(45deg);
		-ms-transform: rotate(45deg);
		transform: rotate(45deg);
	}
	.open #menu-btn a::after{
		-webkit-transform: rotate(-45deg);
		-moz-transform: rotate(-45deg);
		-o-transform: rotate(-45deg);
		-ms-transform: rotate(-45deg);
		transform: rotate(-45deg);
	}
}

/* content
padding: 20px 20px 40px（高さ）;
background: url(../img/main-bg.jpg) 5% 100% no-repeat;
--------------------*/
#content {
	clear: both;
	margin: 0 auto;
	max-width: 950px;
	padding: 20px 20px 125px;
	background: url(../img/main-bg.jpg) 100% 100% no-repeat;
	
}
/* top content */
#top #content {
	background: none;
}

/* HP タイトル  小塚ゴシック Pr6N 
--------------------*/
.title p {
	margin: 0;
	color: #fff;
	font-size: 24px;
	font-family: "HanziPen TC", san-serif;
	font-weight: bold;
	line-height: 1.2;
}
.title span {
	color: #8ae;
}
/* counter
--------------------*/
#counter {
	color: #ccc;
}

/* トップページ お知らせ Georgia,
--------------------*/
#news h2 {
	color: #900;
	margin-bottom: 20px;
}
#news h2 {
	font-size: 18px;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif
}



/* トップページ お知らせ 日付Icon--------------------*/
#news {}
.date {
	
	float: right;
	display: block;
	margin-bottom:.4em;
	padding: 0 3px;
	font-weight: normal;
	color: #ccc;
	background: #660;
	border: 1px solid #ccc;
	font-family: verdana, "lucida grande", "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", Osaka, "ＭＳ Ｐゴシック", sans-serif;
	
	
	
	
	
/* トップページ（リンクの色）--------------------*/
	
}
#news a {
	color: #ddd;
	text-decoration: underline;
}
#news a:hover {
	color: #ca0;
}

/* main（センター〜右側）
--------------------*/
#main {
	float: right;
	width: 73%;
}

/* 赤文字（ノート）--------------------*/
.notes {
	color: #c00;
	font-weight: bold;
}
#information {
	list-style: none;
	padding: 0;overflow: hidden;
}
#information li {
	float: left;
}
.discography {
	list-style: none;
	padding: 0;
}
.discography li {
	margin-bottom: 1em;
	float: left;
	clear: both;width: 100%;
}
.discography h2 {
	color: #09c;
	margin-bottom: 0;
	font-size: 120%;float: left;
	margin-right: 15px;
}
.discography .artist {
	margin: 0;
	font-size: 90%;
}
.setlist {
	list-style: none;
}
.setlist ul {
	margin-bottom: 0;
}
table ul {
	margin-bottom: 0;
}

/* sub（左側）------------------------------------------------------------------------------------------------------------------------*/
#sub {
	float: left;
	width: 22%;
}
@media screen and (max-width: 768px) {
	#main, #sub {
		float: none;
		width: 100%;
		padding: 0;
		border: none;
	}
}
#sub #menu {
	text-transform: uppercase;
	font-size: 13px;
	list-style: none;
	line-height: 1.2;
	padding: 0;
}
#menu li {
	border-bottom: 1px solid #ddd;
}
#menu a {
	text-decoration: none;
	display: block;
	color: #ddd;
	padding: 8px 0;
	text-decoration: none;
}
#menu a:hover {
	color: #aaa;
}

/* footer------------------------------------------------------------------------------------------------------------------------*/
#footer {
	clear: both;
	margin: 0 auto;
	padding: 0 20px;
	max-width: 930px;
	background: url(../img/footer-bg.png) 100% 100% no-repeat;
}


#footer p {
	margin: 0;
}
/* ソーシャルボタン
--------------------*/
.social > * { vertical-align: bottom; margin: 1px;
}