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

@import url('https://fonts.googleapis.com/css?family=Josefin+Sans:300,400');

* {box-sizing:border-box;}
a, a:after {-webkit-transition: all 0.5s ease; -moz-transition: all 0.5s ease; -o-transition: all 0.5s ease; transition: all 0.5s ease; outline:none;}
a {cursor:pointer;text-decoration: none;}
div,ol,ul,li,p,span,a {position:relative;}
ol,ul,li {list-style:none;list-style-type:none;padding:0;}
body,header,footer,menu,p,ul {padding:0;margin:0;}
h1,h2,h3,h4,h5,h6 {font-weight:normal;margin:0;padding:0;line-height:1em;}
div,a,img,p,li {display:block;}
/*a:hover img {opacity:0.75;}*/

body {background-color:#fff;color:#222;font-size:16px;width:100%;font-weight: 500;
font-family: "游明朝", "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}

/*ヘッダー*/
header {width:100%;background: #fff; color:#000;}
header > div {width: 100%;margin:0 auto;padding:0;}
header h1 {width: 100%;}
header img {width: 100%;}
header ul#menu {width:99.9%;margin:0 auto;}
header ul#menu li {float:left;width:33.3%;padding:0.5em;}
header ul#menu li a {color:#fff;background: #111;border-radius: 5px;padding: 0.5em;text-align: center;font-size: 1.2em;font-weight: 400;}
header ul#menu li a:hover {color:#f90;}
/*contents*/
#contentWrapper {width:100%;}
#content {width:100%;height: auto;min-height: 100%;}

/*section*/
section > img {width:100%;}
section > div {width: 98%;padding:1em 0.5em;margin:0 auto;}
section > div > h3 {font-size:2em;}
section > div > h3 span {font-size:0.5em;font-weight: 400;display:block;}
section a {background-color: #d33;color:#fff;padding:0.5em 0.75em;border-radius: 4px;display: inline-block;text-align: center;font-size: 1.25em;font-weight: 400;}
section a:hover {background-color: #3a3;}
section h2 {text-align: center;font-size: 2.5em;margin-bottom: 0.25em;font-weight: 300;font-family: 'Josefin Sans', sans-serif, "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic";}
section > div > p {margin-bottom: 1em;}



/*disk*/
#disk {background: #111;color: #fff;font-weight: 400;}
#disk h2 {}
#disk > div > img {margin-bottom:0.5em;width:100%;box-shadow: 3px 3px 10px 1px rgba(0,0,0,0.5);}
#disk span.special {color:#f00;font-size:1.35em;font-weight: 600;}
#disk span.specialsub {font-size:90%;line-height: 1em;margin-bottom: 1em;display: inline-block;}
section .exp p {margin-top: 1em;}
section .exp p span {display:block;}
section .exp p span.credit {font-size: 0.875em;line-height: 1.3em;padding-top: 1em;}
div.youtube {width:100%;overflow: hidden;padding-top: 56.25%;margin-top: 2em;}
div.youtube:first-child {margin-top: 0;}
div.youtube iframe {position: absolute;top:0;left:0;width: 100% !important;height: 100% !important;}
#tokuten {border:1px solid #f00;padding:0.5em 0.5em;border-radius:5px;margin:1em 0 0;}
#tokuten a {padding: 0;background: none;}
#tokuten img {width:100%;}


/*live*/
#live h2 {line-height: 1.2em;}
#live ul {width:99.99%;margin:0 auto;}
#live ul li {padding: 0.5em;}
#live ul li div {background-color: #fff;border-radius: 5px;padding: 0.5em;box-shadow: 3px 3px 10px 1px rgba(0,0,0,0.5);color:#222;}
#live ul li h4 {font-size: 1.5em;font-weight: 600;}
#live ul li span {display: block;font-size: 1.125em;}
#live ul li span.date {font-size: 1.35em;}
#live ul li span.place {line-height: 1.1em;}
#live ul li span.address {font-size: 0.875em;}
#live ul li span.open {display:inline-block;line-height: 1.1em;}
#live ul li span.start {display:inline-block;line-height: 1.1em;}
#live ul li p {}
#live ul li a {display: block;font-size: 1.125em;}
#live ul li a.info {padding:0.25em 0.5em;display: inline-block;position: absolute;right:0.5em;bottom:0.5em;}
#live ul li a.livehouse {background: none;color:#222;padding:0;text-align: left;font-weight: 600;margin-bottom: 0.5em;}
#live ul li a.livehouse:hover {color:#d33;}
#live > div > p span {font-size: 0.9em;line-height: 1.2em;}
#live ul li p.csinfo {background-color: #666;color:#fff;padding:0.75em auto;border-radius: 4px;display: block;text-align: center;font-size: 1em;font-weight: 400;line-height: 2em;}

/*profile*/
#profile {}
#profile > div > img {width:100%;margin-bottom:0.5em;}
#profile h3 {font-size: 2em;font-family: 'Josefin Sans', sans-serif;font-weight: 300;}
#profile a.twitter {background: none;color:#222;padding:0;}
#profile a.twitter i {color:#00aced;font-size: 2em;top:0.125em;position: relative;}
#profile a.twitter:hover {color:#d33;}

/*グッズ*/
#goods {background: linear-gradient(to right bottom, rgba(100,50,100,0.3), rgba(135,215,195,0.5));}
#goods ul, ul.item {width:90%;margin:0 auto;}
#goods ul li, ul.item li {width:100%;float:none;padding:0.5em;margin-bottom: 0.5em;}
#goods ul li.sold img, ul.item li.sold img {opacity: 0.5;}
#goods ul li img, ul.item li img {width:80%;margin:0 auto;}
#goods ul li p {font-weight: 600;display: inline-block;line-height: 1.1em;}
ul.item li p {font-weight: 400;display: inline-block;line-height: 1.1em;}
#goods ul li span, ul.item li span {/*display: block;*/line-height:1.2em;padding: 0;}
#goods ul li span.alert, ul.item li span.alert {text-align: left;}
#goods ul li span.exp, ul.item li span.exp {font-size: 0.875em;}
#goods ul li span.tokuten, ul.item li span.tokuten {font-size: 0.75em;}
#goods ul li span.price {font-weight: 600;color:red;text-align: right;display: block;}
#goods ul li span.price:after, ul.item li span.price:after {content:"\0028\0074\0061\0078\0020\0069\006e\002e\0029";font-size: 0.65em;}
ul.item li span.price {font-weight: 400;color:red;text-align: right;display: block;}
#goods ul li.sold span.price:after, ul.item li.sold span.price:after {content:"";}
#goods ul li.sold a, ul.item li.sold a {cursor: default;}

#goods > div > p span {font-size: 0.9em;line-height: 1.2em;}
#goods a, .item a {background: none;/*cursor: zoom-in;*/padding: 0;}
.item a:hover {background: none;}

#cmovie {background: #000;}
section#cmovie > div {padding:0 0 !important;}
div.tour {color:#fff;padding: 1em;font-weight: 400;}
div.tour h3 {display: inline;line-height: 1.2em;margin-right: 0.5em;}
div.tour span {display:block;}

#movie {background-color: #333;color:#fff;}
.ytdemos {}
#movie div.youtube {width:100%;overflow: hidden;padding-top: 56.25%;margin-top: 1em;}
#movie div.youtube:first-child {margin-top: 0;}
#movie div.youtube iframe {position: absolute;top:0;left:0;width: 100% !important;height: 100% !important;}
#movie .item {font-size: 0.9em;font-weight: 400;}

/*フッター*/
footer {background-color:#222;color:rgba(255,255,255,0.6);width:100%;border-top:1px solid rgba(0,0,0,0.3);}
footer div {padding:20px 0;}
p.copyright {font-weight:400;font-size:0.75em;text-align:center;line-height:2em;}
footer a {color:rgba(255,255,255,0.6);}

/*ページトップへ*/
.pagetop {display: block;position: absolute;right: 50px/*185px*/;z-index:+20;bottom: 50px;}
.pagetop a {display: block;background-color: #222;color: rgba(255,255,255,0.6); text-align: center;text-decoration: none;outline:none;transform: rotate(-45deg);border-top:1px solid rgba(0,0,0,0.9);border-right:1px solid rgba(0,0,0,0.3);width: 30px;height: 30px;border-radius:0px 10px 0 0;line-height: 30px;font-size: 30px;}
.pagetop a i {transform: rotate(45deg);}
.pagetop a:hover {color:#d33;}

/*汎用*/
.mincho {font-family: "游明朝", "ヒラギノ明朝 ProN W4", "HiraMinProN-W4", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;}
.serif {font-family:  "Times New Roman", Times, serif, "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝";}
.gothic {font-family: "游ゴシック", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;}
.txtwshadow {text-shadow:1px 1px 0.1em #000,-1px 1px 0.1em #000,-1px -1px 0.1em #000,1px -1px 0.1em #000;}
.clearfix:after, ul:after {content:"";display:block;position:relative;clear:both;}

.mlshow {display: block;}
.mlhide {display: none;}
.xlshow {display: none;}

/**/
@media screen and (min-width: 480px) {
}

@media screen and (min-width: 750px) {
header > div {width: 90%;}
	.pagetop {bottom: 40px;}
	.pagetop a {width: 50px;height: 50px;border-radius:0px 20px 0 0;line-height: 50px;font-size: 40px;}
	section > div {width: 90%;padding:2em;}
	section > div > h3 {margin-bottom: 0.25em;}
	#disk > div > img {width:40%;float: left;}
	#disk .exp {float:right;width:58%;}
	div.youtube {float:left;}
	#profile > div > img {width:40%;float: left;}
	#profile > div > div {float:right;width:58%;}
		#goods ul li, ul.item li {width:50%;float:left;padding:0.5em;font-size: 1.5em;}
	#goods ul li span.exp, ul.item li span.exp {font-size: 0.75em;}
	#goods ul li p, ul.item li p {display: block;}
	#movie .ytdemos.mov2 div.youtube {width: 49.5%;float:left;margin-top: 0;padding-top:27.56%;}
	#movie .ytdemos.mov2 div.youtube:last-child {margin-left: 1%;}
	#cmovie .youtube {float: left;width: 49.5%;margin-top: 0;padding-top:27.56%;}
	#cmovie .youtube iframe {padding-top: 0;}
	#cmovie .tour {float: left;width: 49.5%;margin-left: 1%;}
}

@media screen and (min-width: 920px) {
/*	#live ul li {float: left;width:33.33%;}*/
	.mlshow {display: none;}
	.mlhide {display: block;}
	#live > div > p {text-align: center;}
	#live ul li a {font-size: 1.125em;line-height: 1.3em;}
		#goods > div > p {text-align: center;}
}

@media screen and (min-width: 1200px) {
	header > div {width: 80%;max-width:1136px;}
	section > div {width: 80%;max-width:1136px;}
	#live ul li span.date {font-size: 1.5em;}
	section .exp p span {float:left;}
	section .exp p span.credit {padding-left:2em;}
	.xlshow {display:inline-block;}
}