@charset "Shift_JIS";
/* COMMON.CSS_start
-------------------------------------------------- */
/*  BODY_start ------------------------- */
.slicknav_menu {display:none;}
.clearfix:after { content: ""; display:block; clear:both;}
html{
	font-size:62.5%;
	overflow-x:hidden;
	}
body{
	position:relative;
	font-size:1.4rem;
	color:#FFF;
	background:url(../images/top_bg.jpg) fixed center center no-repeat #000;
	background-size: cover;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

a{	transition:.3s;
	color:#FFF;
	text-decoration:underline;
}

a:hover{color:rgba(255,238,191,1.00);}

img{vertical-align: bottom; height:auto;}

/* 背景ビデオ start
------------------------- */

#bgv{
	position:fixed;
	margin:0;
	padding:0;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:-2;
	filter: alpha(opacity=100);
	-moz-opacity: 1.00;
	-khtml-opacity: 1.00;
	opacity: 1.00;
}

#bgv_filter{
	position: fixed;
	margin:0;
	padding:0;
	top:0;
	left:0;
	width:100%;
	height:100%;
	z-index:-1;
	background:url(../images/bg_img.png);
}

header{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 1000;
	background:rgba(0,0,0,0.40);
}

.header_p{
	display:block;
	text-align:center;
	width:50%;
	padding:10px 0 40px;
	margin:0 auto;
	}
	
h1{ width:360px; float:left;}
h1 img{ width:100%; height:auto;}

/* MENU start */

header ul{
margin-top:10px;
float:right;
width:540px;
}

header ul li{
float:left;
width:30%;
font-family: 'Open Sans', sans-serif;
display:inline-block;
text-align:right;
}

header ul li span{ display:none;}
header ul li{width:160px; height:20px; padding-bottom:10px; float:left;}
header ul li:nth-child(1){width:130px;}
header ul li:nth-child(2){width:130px;}
/* header ul li:nth-child(2){width:170px;}
header ul li:nth-child(5){width:170px;} */
header ul li img{float:left;}
header ul li img:hover{
	transition:.3s;
	filter: alpha(opacity=75);
	-moz-opacity: 0.75;
	-khtml-opacity: 0.75;
	opacity: 0.75;
}

/* ご購入予約 */
header ul li:nth-child(1) img{width:110px;}
/* オリジナル購入特典 
header ul li:nth-child(2) img{width:154px;}*/
/* Track List */
header ul li:nth-child(2) img{width:110px;}
/* spot movie */
header ul li:nth-child(3) img{width:115px;}
/* official banner
header ul li:nth-child(5) img{width:154px;} */
/* official banner
header ul li:nth-child(6) img{width:157px;} */

header ul li a{
font-size:1.5rem;
font-weight:bold;
color:#FFF;
}

header .inner{
	position:relative;
	margin:0 auto;
	padding:0 0 20px;
	width:1100px;
}
.inner{
	position:relative;
	margin:0 auto;
	width:1100px;
}

/* メインエリア mainpage start ------------------------- */
#main .inner{
	position:relative;
	margin:0 auto 0;
	padding:300px 40px 120px;
	background:url(../images/jkt_bg.png) no-repeat -10px 380px;
	overflow:hidden;
}

.ycbtn{
	position: absolute;
	display:block;
	width:160px;
	height:160px;
	bottom:230px;
	right:150px;
	background:rgba(0,0,0,0);
	border-radius:80px;
}

.ycbtn:hover{background:rgba(217,0,0,0.30);}
.ycbtn img{width:100%; height:auto;}


/*ジャケット*/
#main .inner h2{ float:left; width:380px; margin-right:40px;}
#main .inner h2 img{ display:block; float:right; width:300px; height:auto;}

/* タイトル */
#main .inner h3{ float:left; margin-top:20px; width:640px;}
#main .inner h3 img{ width:100%;}
#main .inner h3 span{ display: none;}

/* テキストエリア */
#main .inner p{ float: left; margin-top:20px; width:640px;
font-size:1.5rem;
line-height:2.8rem;
}

/* 特典影像・詳しく　ボタン */
#main .inner .subbtn{ float: left; margin-top:20px; width:640px; overflow:hidden;}

/* 購入・オリ特　ボタン */
#main .inner .subbtn ul li:nth-child(1){ float:left; width:75px; margin-right:20px;}
#main .inner .subbtn ul li:nth-child(1) img{width:100%;}
#main .inner .subbtn ul li:nth-child(2){ float:left; width:284px; margin-top:11px;}
#main .inner .subbtn ul li:nth-child(2) img{ width:100%;}
#main .inner .subbtn ul li:nth-child(2) a{ display:block;}
#main .inner .subbtn ul li:nth-child(2) a:hover{ background-color:rgba(255,255,255,0.50)}
 
/* 特典影像・詳しく　ボタン */
#main .inner .mainbtn{ padding-top:30px; clear:both; overflow:hidden;}
#main .inner .mainbtn ul{ width:64%; margin:0 auto;}
#main .inner .mainbtn li{ width:50%; float:left;}
#main .inner .mainbtn li img{width:90%; height:auto; float: left;}
#main .inner .mainbtn li img:hover{ background:rgba(255,238,191,0.50); transition:.3s;}


/* トラックリスト／収録曲 ------------------------- */
#track{}
#track .inner{
	margin:0 auto 0;
	padding:280px 0 120px;
}

/* h2 */
#track .inner h2{}
#track .inner h2 img{
	width:290px;
	text-align:left;
	display:block;
	margin:0;
	padding-bottom:20px;
	border-bottom:1px solid #FFF;
}

/* 楽曲リスト */
#track .inner ul{
	float:left;
	margin-top:60px;
	width:260px;
	}

#track .inner ul li{
	padding:1px 0;
	font-weight:bold;
	font-size:1.3rem;
	}
	
#track .inner ul li span{
	display:block;
	font-size:1.2rem;
	text-indent:1.2rem;
	}

#track .inner ul li ul{
	text-indent:2.4rem; 
	margin-top:0;
}
#track .inner ul li ul span{text-indent:3.6rem;}
#track .inner ul li.mc_en{color:#FFEDBF;}

#thumbnail{
	width:380px;
	height:280px;
	float:left;
	margin-top:160px;
	position:relative;
	}

#thumbnail img.thumb_chatch{
	position:absolute;
	top:0;
	left:0;
	width:65px;
	height:auto;
	z-index:0;
}

#thumbnail img.thumb_img{
	position:absolute;
	top:20px;
	left:20px;
	width:360px;
	height:auto;
}

#thumbnail p{
	position:absolute;
	bottom:5px;
	left:20px;
	width:360px;
	font-size:1.3rem;
}

#thumbnail a{
	position:absolute;
	top:20px;
	left:20px;
	display:block;
	width:360px;
	height:203px;
	background-color:rgba(255,255,255,0.00);
}

#thumbnail a:hover{ background-color:rgba(255,255,255,0.25);}

.boss{
	position:absolute;
	top:100px;
	right:-260px;
	z-index:-1;
	width:776px;
	height:995px;
	background:url(../images/boss_bg_img.png);
}
 	


/* スポットムービー Spot Movie ------------------------- */
#spot{}
#spot .inner{
	margin:0 auto 0;
	padding:280px 0 120px;
	}
/* h2 タイトル */
#spot .inner h2{padding-bottom:60px;}
#spot .inner h2 img{
	width:185px;
	text-align:center;
	display:block;
	margin:0 auto;
	padding-bottom:20px;
	border-bottom:1px solid #FFF;
}

/* YOUTUBE start */
.iframe_outer{
width:1000px;
height:563px;
margin:0 auto 0;
overflow:hidden;
box-shadow:rgba(255, 255, 255, .75) 0px 0px 2px 2px;
-webkit-box-shadow:rgba(255, 255, 255, .75) 0px 0px 2px 2px;
-moz-box-shadow:rgba(255, 255, 255, .75) 0px 0px 2px 2px;
}

.iframe_outer iframe{
display:block;
width:1000px;
height:563px;
margin:0 auto;
overflow:hidden;
z-index:1;
}

.iframe_outer iframe{}

/* 体験者様の声 ------------------------- */
#voice{}
#voice .inner{
	margin:0 auto 0;
	padding:280px 0 120px;
}

/* h2 タイトル */
#voice .inner h2{padding-bottom:60px;}
#voice .inner h2 img{
	width:460px;
	text-align:center;
	display:block;
	margin:0 auto;
	padding-bottom:20px;
	border-bottom:1px solid #FFF;
}
#voice .inner h3{
	text-align:center;
	margin:0 auto;
	font-size:1.5rem;
	line-height:2.3rem;
	color:#FFEEBF;
}

#voice .inner p{
	width:680px;
	text-align:left;
	margin:20px auto 0;
	font-size:1.4rem;
	line-height:2.0rem;
	color:#FFF;
}

.vote_btn{
	width:680px;
	margin:0 auto;
	}

.vote_btn ul{ margin-top:20px;}
.vote_btn ul li{
	float:left;
	width:50%;}


.vote_btn img{
		width:99%;
	}
.vote_btn img:hover{background:rgba(255,238,191,0.50); transition:.3s;}

/* 体験者様の声  ------------------------- */
.experience{
	position:relative;
	margin:30px auto 0;
	padding:60px 0;
	width:680px;
	background:#fff;
}

.update{
	position:absolute;
	top:-15px;
	left:10px;
	padding-top:13px;
	width:60px;
	height:47px;
	background-color:#09F;
	color:#333;
	font-weight:bold;
	font-size:1.2rem;
	line-height:1.6rem;
	text-align:center;
	vertical-align:middle;
	border-radius:35px;
	
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffeebf+0,ffeebf+100&1+0,0+100 */
background: -moz-linear-gradient(top,  rgba(255,238,191,1) 50%, rgba(255,238,191,0) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,238,191,1) 50%,rgba(255,238,191,0) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,238,191,1) 50%,rgba(255,238,191,0) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffeebf', endColorstr='#00ffeebf',GradientType=0 ); /* IE6-9 */


	}

.experience ul{
	margin:0 auto;
	padding:0;
	width:560px;
	height:560px;
	overflow: auto;
}

.experience ul li{
	font-size:1.5rem;
	line-height:2.4rem;
	font-weight:bold;
	color: #333;
	width:510px;
	margin:0 0 0px;
	padding:20px 10px 0;
	border-bottom:1px solid #999;
}
.experience ul li:nth-child(even){background:rgba(0,0,0,0.025);}

.experience ul li span{
	font-weight:bold;
	padding:15px 0;
	display:block;
	font-size:1.3rem;
	line-height:2.0rem;
}

/* OFFICIAL BANNER ------------------------- */

#official{}
#official .inner{
	margin:0 auto 0;
	padding:280px 0 120px;
}

/* h2 タイトル */
#official .inner h2{padding-bottom:60px;}
#official .inner h2 img{
	width:263px;
	text-align:center;
	display:block;
	margin:0 auto;
	padding-bottom:20px;
	border-bottom:1px solid #FFF;
}
#official .inner div{
	margin:0 auto;
	padding:50px;
	background:rgba(255,255,255,.15);
}

#official .inner div h3{
	text-align:center;
	margin:0 auto;
	font-size:1.5rem;
	line-height:2.6rem;
	color:#FFEEBF;
}

#official .inner div p{
	width:60%;
	margin:20px auto 0;
	font-size:1.2rem;
	line-height:2.0rem;
}


#official .inner div ul li h4{
	padding:0 0 10px;
	font-size:1.4rem; text-align:center; color:#FFEEBF;}

#official .inner ul li div{
	width:400px;
	margin:40px auto 0;
	padding:0;
	background:none;
}

#official .inner div ul li img{ width:100%;}
#official .inner div ul li img:hover{
cursor: pointer;
filter: alpha(opacity=75);
-moz-opacity: 0.75;
-khtml-opacity: 0.75;
opacity: 0.75;
transition:.3s;
}

#official .inner div ul li a{display: block; background:rgba(255,238,191,1.00);}


/* SNSシェアボタン ------------------------- */

.sns_outer{
clear:both;
margin:0 auto;
width:320px;
overflow:hidden;
}

.sns_outer ul.sns{
clear:both;
width:150px;
height:30px;
margin:300px auto 0;
padding:0;
}

.sns_outer ul.sns li{
width:70px;
float:left;
text-align:center;
}

.sns_outer ul.sns li:nth-child(1){ margin-right:10px;}

/* Footer start ------------------------- */

footer{
margin:15px auto 0;
padding:0 0 15px;
}

footer ul{
clear:both;
width:260px;
height:50px;
margin:0 auto;
}

footer ul li{
width:25%;
float:left;
text-align:center;
}

footer ul li img{
width:80%;
height: auto;
}

/* Small start ------------------------- */
small{
display:block;
clear:both;
color:#FFF;
font-weight:bold;
margin:50px auto 0;
padding:0 0 125px;
text-align:center;
}

small a{
color:#FFF;
font-weight:bold;
}

/* ページトップへ ------------------------- */

.pagetop{
position:fixed;
right:10px;
bottom:10px;
width:70px;
z-index:999;
cursor: pointer;
filter: alpha(opacity=75);
-moz-opacity: 0.75;
-khtml-opacity: 0.75;
opacity: 0.75;
}

.pagetop:hover{
filter: alpha(opacity=100);
-moz-opacity: 1.00;
-khtml-opacity: 1.00;
opacity: 1.00;
}

.pagetop span{
font-size:1.1rem;
display:block;
text-align:center;
}

.pagetop img{
width:100%;
height:auto;
top:0;
left:0;
}

/* ポップアップ内 h1 ------------------------- */
#experience h1{
	width:100%;
	display:block;
	float:none;
}

#experience div{
	margin:0 auto;
	width:800px;
}

#experience table
#experience table th,
#experience table td{
	border:0;
}
#experience table{
	border:0;
}

/* ポップアップ MORE INFORMATION ------------------------- */

#information{
	padding:15px 0 0;
	min-height:400px;
}

#information h1{
	width:80%;
	margin:0 auto;
	color:#FFF000;
	text-align:center;
	vertical-align:middle;
	float:none;
	font-size:2.6rem;
	margin-top:2.0rem;
}

#information h1 br{ display:none;}

#information p{
	width:80%;
	margin:0 auto;
	font-size:1.3rem;
	margin-top:1.8rem;
}






/*  ポップアップ 購入するリンク・バナー ------------------------- */
#preorder_buy{
	padding:15px 0 0;
	min-height:400px;
}

#preorder_buy h1{
	color:#FFEDBF;
	text-align:center;
	font-size:1.6rem;
	line-height:2.0rem;
	vertical-align:middle;
	float:none;
	width:100%;
}

#preorder_buy ul{
	margin:15px auto 0;
	width:60%;
}

#preorder_buy ul li{
	float:left;
	width:48%;
	margin:0 0 3px;
	padding:3px 0;
	font-size:1.2rem;
	text-align:center;
}

#preorder_buy ul li:nth-child(odd){clear:left;}
#preorder_buy ul li img{
	display:block;
	width:80%;
	margin:0 auto 3px;
	padding:2%;
	border-radius:3px;
	background:#fff;
}

#preorder_buy ul li a{ text-decoration:underline;
}

/* ポップアップ オリ特 ------------------------- */
#originalbenefits{
	min-height:400px;
	padding:15px 0 0;
}

#originalbenefits h1{
	color:#FFEDBF;
	text-align:center;
	font-size:1.6rem;
	line-height:2.0rem;
	vertical-align:middle;
	float:none;
	width:100%;
}

#originalbenefits table{
	clear:both;
	margin-top:10px;
	margin-left:auto;
	margin-right:auto;
	width:80%;
	border-collapse:collapse;
}
#originalbenefits th,
#originalbenefits td{
	padding:5px 10px;
	width:50%;
	}


#originalbenefits th{ font-weight:bold;}
#originalbenefits td a{text-decoration:underline;}
#originalbenefits th{ text-align:center;}
#originalbenefits tr:nth-child(even){background-color:rgba(255,255,255,0.15)}
#originalbenefits tr:nth-child(odd){background-color: rgba(128,128,128,0.15)}


#originalbenefits p{ text-align:center; padding:3px 0;}

/*  ポップアップ 体験談 投稿フォーム ------------------------- */
#vote{
	padding:40px 0 0;
	margin:0;
}
#vote h1{
	color:#FFEDBF;
	text-align:center;
	font-size:1.6rem;
	line-height:2.0rem;
	vertical-align:middle;
	float:none;
	width:100%;
}
.hissu{
	font-weight:bold;
	font-size:1.5rem; padding:1px;
	color:rgba(0,0,0,1.00);
	background-color:#FFEDBF;
	border-radius:2px;
}

.mail_form{
	width:480px;
	margin:0 auto;}

.mail_form div{
	margin-top:25px;}
	
#vote form input{
	display:block;
	padding:5px;
	border:none;
	border-radius:6px;}
	
#vote form textarea{
	display:block;
	padding:5px;
	border:none;
	border-radius:6px;
}

#vote .vote_btn{
	marign:0 auto;}

#vote .vote_btn a{
	display: inline-block;
	margin:0 auto;
	text-align:center;
	padding:3px 5px;
	color:#FFF;
	font-weight:bold;
	border:2px solid #FFF;
	text-decoration:none;
}

#vote .vote_btn a:hover{ 
	color:#333; background:rgba(255,237,191,1.00);}
	
	
.mob{ display:none;}