@charset "UTF-8";
@import url(http://fonts.googleapis.com/css?family=Josefin+Sans:300,400,600,700);
@import url(http://fonts.googleapis.com/css?family=Roboto:500,900,100,300,700,400);
@import url(http://fonts.googleapis.com/css?family=Roboto+Condensed:400,300,700);

/*初期設定
----------------------------------------------------*/
html {
	min-height:100%;
    background:url('../images/bg_smoke.jpg') fixed no-repeat center #000000;
    background-size:cover;
}
body {
	width: 100%;
	min-width: 320px;
	color: #333;
	font-family: 'Josefin Sans', sans-serif;
	*font-size:small;
	*font:x-small;
}

/*
reset
*/
html {overflow-y: scroll;}
body,div,dl,dt,dd,ul,ol,li,
h1,h2,h3,h4,h5,h6,
pre,code,form,fieldset,legend,
p,blockquote,table,th,td {margin: 0; padding: 0;}

img { vertical-align: bottom; }
ul,dl,ol {text-indent: 0;}
li {list-style: none;}
.ie8 img{
  width: auto;
}
.clear { clear:both; }

a {
	color:#FFF;
}
a:hover {
	color:#C00;
}
a:focus { outline:none;}

#fade {
  width: 100%;
  height: 100%;
  display: none;
  position: absolute;
  background: #000000;
  top: 0px;
  left: 0px;
  z-index: 2000;
}

#loading {
  position: absolute;
  left: 50%;
  top: 40%;
  margin-left: -12px;
  margin-bottom: -15px;
  z-index: 2300;
}

#container {
	display:none;
}

#main {
	height:640px;
　　min-height: 100%;
    background:url('../images/manson.jpg') no-repeat center #000000;
    background-size:cover;
}
#main h1 {
	padding-top:260px;
	text-align:center;
}
#main p {
	color:#FFFFFF;
	font-size:30px;
	font-family: 'Josefin Sans', sans-serif;
	letter-spacing:0.2em;
	padding-top:50px;
	text-align:center;
}
#main p.lead {
	color:#eee;
	font-size:18px;
	letter-spacing:0em;
	padding-top:40px;
	text-align:center;
}

.cntBody {
	width:940px;
	margin: 0px auto;
	padding: 40px 0px;
}
	
#latestnews {
}
#latestnews h2 {
	color:#ccc;
	font-size:22px;
	font-weight:400;
	margin:0px 0px 30px 0px;
	text-align:center;
}
#latestnews ul {
	color:#ccc;
	font-size:12px;
	font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-weight:400;
	line-height:150%;
	margin:20px 0px;
	text-align:center;
}
#latestnews ul li {
	margin:10px 0px;
}


/*trailer */
#trailer {
	background-color: rgba(0,0,0,0.5);
	padding:20px 0px;
	text-align:center;
}
#trailer .ytWrap {
	width:720px;
	margin:0px auto;
}


/*release*/
#release {
	color:#eee;
	font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}
#release .artwork {
	width:300px;
	float:left;
	text-align:center;
	margin:0px 10px;
}
#release .artwork img {
	margin:0px 0px 10px 0px;
}
#release .data {
	text-align:left;
	width:600px;
	float:left;
	margin: 0px 0px 0px 20px;
}
#release .data h3 {
	font-size:12px;
	font-family: 'Josefin Sans', sans-serif;
	font-weight:600;
	margin-top:20px;
}
#release p {
	font-family: 'Josefin Sans', sans-serif;
	font-weight:400;
}
#release p.item_title {
	font-size:24px;
	color:#fff;
}
#release p.item_title2 {
	font-size:24px;
	color:#fff;
	text-indent:-14px;
	margin-bottom:20px;
}
.data p.release {
	font-size:24px;
	color:#fff;
	margin-bottom:20px;
}
.data p.price {
	font-size:12px;
	line-height:20px;
	text-indent:-5px;
	font-weight:300;
	font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif!important;
}
.data p.price span {
	font-size:90%;
}
.data p.note {
	font-size:12px;
	line-height:15px;
	margin-bottom:10px;
}
.data ol {
	clear:both;
	font-size:12px;
	margin-top:20px;
	margin-bottom:10px;
	text-align:left;
}
.data ol li {
	font-size:12px;
	line-height:170%;
	list-style-type:decimal;
	margin: 0px 30px 0px 30px;
}
.data ol li span{
	font-size:80%;
}


/*btn*/
ul.btns {
	margin:10px 0px 20px 0px;
}
ul.btns li {		
	font-size:12px;
	float: left;
}
ul.btns li a {
	color:#fff;
	font-size:12px;
	text-decoration:none;
	text-align:center;
	width:90px;
	padding:5px 0px;
	margin:0px 10px 0px 0px;
	display:inline-block;
	background:transparent;
	border:solid 1px #eee;
}

.btn {
	display: inline-block;
	text-align: center;
	text-decoration: none;
	outline: none;
}
.btn::before,
.btn::after {
	position: absolute;
	z-index: -1;
	display: block;
	content: '';
}
.btn,
.btn::before,
.btn::after {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-transition: all .3s;
	transition: all .3s;
}
.btns .btn {
	background-color: transparent;
	border: 1px solid #fff;
	color: #fff;
}
.btns .btn:hover {
	background-color: rgba(255, 255, 255, 0.2);
}

.newsUnit a.btn {
	color:#fff;
	font-size:12px;
	line-height:18px;
	text-decoration:none;
	text-align:center;
	padding:2px 10px 0px 10px;
	margin:0px 10px 0px 0px;
	display:inline-block;
	background:#55acee;
	border: 1px solid #55acee;
}
.newsUnit .btn {
	background-color: transparent;
	color: #fff;
}
.newsUnit .btn:hover {
	background-color: rgba(0,0,0, 1);
	border: 1px solid #55acee;
}


/*news*/
#news {
	background-color: rgba(200,211,220,0.6);
}
#news h2 {
	color:#000;
	font-size:22px;
	font-weight:400;
	margin:0px 0px 30px 0px;
	text-align:center;
}
#news h3 {
	font-size:14px;
	line-height:150%;
	padding-left:5px;
	margin:20px 0px 10px 0px;
	border-left:5px solid #333;
}
#news p {
	font-size:13px;
	line-height:20px;
	margin:0px 0px 10px 0px;
}
#news p.note {
	font-size:11px;
	line-height:15px;
	margin:0px 0px 10px 0px;
}
#news .comment {
	padding:10px;
	background-color:#fff;
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}
#news dl {
	font-size:13px;
	line-height:150%;
	margin:0px 0px 10px 0px;
}
#news dt {
	font-weight:bold;
	margin:10px 0px 5px 0px;
	border-bottom:1px solid #666;
}
#news dd {
	margin:5px 0px 10px 0px;
}
#news .newsUnit .cl {
	clear:both;
}
#news .newsUnit {
	text-align:left;
	margin:10px 0px 30px 0px;
	border-top:1px solid #333;
}
#news .newsUnit .news_img1,
#news .newsUnit .news_content1 {
	width:220px;
	float:left;
	margin:10px 10px 10px 0px;
}
#news .newsUnit .news_img2,
#news .newsUnit .news_content2 {
	width:440px;
	float:left;
	margin:10px 10px 10px 0px;
}
#news .newsUnit .news_img3,
#news .newsUnit .news_content3 {
	width:700px;
	float:left;
	margin:10px 10px 10px 0px;
}
#news .newsUnit .news_img4,
#news .newsUnit .news_content4 {
	width:940px;
	float:left;
	margin:10px 0px 10px 0px;
}
#news .newsUnit .news_img1,
#news .newsUnit .news_img2,
#news .newsUnit .news_img3,
#news .newsUnit .news_img4 {
	text-align:left;
}
#news .newsUnit .news_img1 img,
#news .newsUnit .news_img2 img,
#news .newsUnit .news_img3 img,
#news .newsUnit .news_img4 img {
	width:100%;
	margin-bottom:10px;
}

/*sns*/
#sns {
	background-color: rgba(15,21,31,0.8);
	margin:0px 0px 0px 0px;
}
#sns h2 {
	text-align:center;
	margin-bottom:20px;
}
#facebook {
	width:400px;
	margin:20px;
	padding:5px;
	float:left;
}
#facebook div {
	width:400px;
	padding:5px;
}
#twitter {
	width:400px;
	margin:20px;
	padding:5px;
	float:right;
}
#twitter div {
	width:400px;
	padding:5px;
}


.totop {
	margin:0px auto;
	padding-top:40px;
	width:100%;
    z-index: 1000;
	text-align:center;
}    
.totop a {
	display:block;
	margin:0px auto;
	width: 42px;
	height:42px;
}


footer {
	margin: 0px 0px 0px 0px;
	text-align: center;
	background-color: rgba(0,0,0,0.5);
}
footer p.copy {
	color: #ccc;
	font-size:10px;
	font-weight:400;
	padding:40px 0px 80px 0px;
}
footer p.copy a {
	color: #ccc;
	text-decoration:none;
	border-bottom:1px dotted #666;
}
footer p.copy a:hover {
	color: #C00;
}

.brk {clear:both;}

.br_sp {
	display:none;
}


/*media Queries
----------------------------------------------------*/
@media only screen and (min-width: 320px) and (max-width: 640px) {
	#main {
		height:320px;
	　　min-height: 50%;
		background:url('../images/manson.jpg') no-repeat center #000000;
		background-size:cover;
	}
	#main h1 {
		padding-top:120px;
		text-align:center;
	}
	#main h1 img {
		width:100%;
		height:auto;
	}
	#main p {
		color:#be4768;
		font-size:22px;
		font-family: 'Josefin Sans', sans-serif;
		letter-spacing:0.2em;
		padding-top:30px;
		text-align:center;
	}
	#main p.lead {
		color:#eee;
		font-size:14px;
		letter-spacing:0em;
		padding-top:20px;
		text-align:center;
	}
	
	.cntBody {
		width:100%;
		margin: 0px auto;
		padding: 20px 0px;
	}
		
	#latestnews h2 {
		margin:0px 0px 10px 0px;
	}
	#latestnews ul {
		margin:20px 20px;
	}
	#latestnews ul li {
		margin:10px 0px;
	}
	
	
	/*trailer */
	#trailer {
		background-color: rgba(0,0,0,0.5);
		padding:20px 0px;
		text-align:center;
	}
	#trailer .ytWrap {
		width:100%;
		margin:0px auto;
	}
	
	/*release*/
	#release {
		color:#eee;
		font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	}
	#release .artwork {
		width:100%;
		text-align:center;
		margin:0px 10px;
	}
	#release .artwork img {
		margin:0px 0px 20px 0px;
	}
	#release .data {
		width:100%;
		text-align:left;
		margin: 0px 10px 0px 10px;
	}
	#release .data h3 {
		font-size:12px;
		font-family: 'Josefin Sans', sans-serif;
		font-weight:600;
		margin-top:20px;
	}
	#release p {
		font-family: 'Josefin Sans', sans-serif;
		font-weight:400;
	}
	#release p.item_title {
		font-size:24px;
		color:#fff;
		text-align:center;
	}
	#release p.item_title2 {
		font-size:24px;
		color:#fff;
		text-indent:0px;
		margin-bottom:20px;
		text-align:center;
	}
	.data p.release {
		font-size:24px;
		color:#fff;
		margin-bottom:20px;
		text-align:center;
	}
	.data p.price {
		font-size:12px;
		line-height:20px;
		text-indent:-5px;
		font-weight:300;
		font-family:"メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif!important;
		margin: 0px 10px 10px 10px;
	}
	.data p.price span {
		font-size:90%;
	}
	.data p.note {
		font-size:12px;
		line-height:15px;
		margin-bottom:10px;
	}
	.data ol {
		clear:both;
		font-size:12px;
		margin-top:20px;
		margin-bottom:10px;
		text-align:left;
	}
	.data ol li {
		font-size:12px;
		line-height:170%;
		list-style-type:decimal;
		margin: 0px 30px 0px 30px;
	}
	.data ol li span{
		font-size:80%;
	}
	
	
	/*btn*/
	ul.btns {
		margin:10px 0px 20px 0px;
	}
	ul.btns li {		
		font-size:12px;
		float: left;
	}
	ul.btns li a {
		color:#fff;
		font-size:10px;
		text-decoration:none;
		text-align:center;
		width:60px;
		padding:5px 0px;
		margin:0px 5px 0px 0px;
		display:inline-block;
		background:transparent;
		border:solid 1px #eee;
	}
	
	.btn {
		display: inline-block;
		text-align: center;
		text-decoration: none;
		outline: none;
	}
	.btn::before,
	.btn::after {
		position: absolute;
		z-index: -1;
		display: block;
		content: '';
	}
	.btn,
	.btn::before,
	.btn::after {
		-webkit-box-sizing: border-box;
		-moz-box-sizing: border-box;
		box-sizing: border-box;
		-webkit-transition: all .3s;
		transition: all .3s;
	}
	.btns .btn {
		background-color: transparent;
		border: 1px solid #fff;
		color: #fff;
	}
	.btns .btn:hover {
		background-color: rgba(255, 255, 255, 0.2);
	}
	
	.newsUnit a.btn {
		color:#fff;
		font-size:12px;
		line-height:18px;
		text-decoration:none;
		text-align:center;
		padding:2px 10px 0px 10px;
		margin:0px 10px 0px 0px;
		display:inline-block;
		background:#55acee;
		border: 1px solid #55acee;
	}
	.newsUnit .btn {
		background-color: transparent;
		color: #fff;
	}
	.newsUnit .btn:hover {
		background-color: rgba(0,0,0, 1);
		border: 1px solid #55acee;
	}
	
	
	/*news*/
	#news {
		background-color: rgba(200,211,220,0.6);
	}
	#news h2 {
		color:#000;
		font-size:22px;
		font-weight:400;
		margin:0px 0px 30px 0px;
		text-align:center;
	}
	#news h3 {
		font-size:14px;
		line-height:150%;
		padding-left:5px;
		margin:20px 0px 10px 0px;
		border-left:5px solid #333;
	}
	#news p {
		font-size:13px;
		line-height:20px;
		margin:0px 0px 10px 0px;
	}
	#news p.note {
		font-size:11px;
		line-height:15px;
		margin:0px 0px 10px 0px;
	}
	#news .comment {
		padding:10px;
		background-color:#fff;
		border-radius: 5px;
		-webkit-border-radius: 5px;
		-moz-border-radius: 5px;
	}
	#news dl {
		font-size:13px;
		line-height:150%;
		margin:0px 0px 10px 0px;
	}
	#news dt {
		font-weight:bold;
		margin:10px 0px 5px 0px;
		border-bottom:1px solid #666;
	}
	#news dd {
		margin:5px 0px 10px 0px;
	}
	#news .newsUnit .cl {
		clear:both;
	}
	#news .newsUnit {
		text-align:left;
		width:90%;
		margin:0px auto;
		border-top:1px solid #333;
	}
	#news .newsUnit .news_img1,
	#news .newsUnit .news_content1 {
		width:100%;
		float:none;
		margin:10px 0px 0px 0px;
	}
	#news .newsUnit .news_img2,
	#news .newsUnit .news_content2 {
		width:100%;
		float:none;
		margin:10px 0px 0px 0px;
	}
	#news .newsUnit .news_img3,
	#news .newsUnit .news_content3 {
		width:100%;
		float:none;
		margin:10px 0px 0px 0px;
	}
	#news .newsUnit .news_img4,
	#news .newsUnit .news_content4 {
		width:100%;
		float:none;
		margin:10px 0px 0px 0px;
	}
	#news .newsUnit .news_img1,
	#news .newsUnit .news_img2,
	#news .newsUnit .news_img3,
	#news .newsUnit .news_img4 {
		text-align:left;
	}
	#news .newsUnit .news_img1 img,
	#news .newsUnit .news_img2 img,
	#news .newsUnit .news_img3 img,
	#news .newsUnit .news_img4 img {
		width:100%;
		margin-bottom:0px;
	}
	.mb {
		margin-bottom:10px!important;
	}
	
	/*sns*/
	#sns {
		background-color: rgba(15,21,31,0.8);
		margin:0px 0px 0px 0px;
	}
	#sns h2 {
		text-align:center;
		margin-bottom:20px;
	}
	#facebook {
		width:90%;
		margin:0px auto;
		float:none;
	}
	#facebook div {
		width:100%;
	}
	#twitter {
		width:90%;
		margin:0px auto;
		float:none;
	}
	#twitter div {
		width:100%;
	}
	
	
	.totop {
		margin:0px auto;
		padding-top:40px;
		width:100%;
		z-index: 1000;
		text-align:center;
	}    
	.totop a {
		display:block;
		margin:0px auto;
		width: 42px;
		height:42px;
	}
	
	
	footer {
		margin: 0px 0px 0px 0px;
		text-align: center;
		background-color: rgba(0,0,0,0.5);
	}
	footer p.copy {
		color: #ccc;
		font-size:10px;
		font-weight:400;
		padding:40px 0px 80px 0px;
	}
	footer p.copy a {
		color: #ccc;
		text-decoration:none;
		border-bottom:1px dotted #666;
	}
	footer p.copy a:hover {
		color: #C00;
	}
	
	.brk {clear:both;}
	
	.br_sp {
		display:block;
	}
	
}

	

/*
*/
.newsUnit,
.clearfix { /zoom : 1; }
.newsUnit:after,
.clearfix:after { content : ''; display : block; clear : both; height:0; }