@charset "UTF-8";
/* -----------------------------------------------------------
   BASE
------------------------------------------------------------*/
@media all and (min-width: 768px) {
.inner{
	width:980px;
	margin:0 auto;
	}
#contents{
	padding:30px 0 10px;
	}
}
@media all and (max-width: 767px) {
#contents{
	padding:20px 0;
	}
}

/* -----------------------------------------------------------
   HEADER
------------------------------------------------------------*/

header h1{
	text-indent:-9999px;
	}
header img{
	position:absolute;
	top:0;
	left:0;
	}
header #sky{
	background-image:url(../img/top_image_bg.jpg);
	}
header #cast{
	background-image:url(../img/top_image_cast.png);
	}
header #last{
	background-image:url(../img/top_image_text.png?);
	}

@media all and (min-width: 768px) {
header{
	width:100%;
	height:660px;
	background:url(../img/bg_top.jpg) repeat-x;
	}
header section{
	width:980px;
	height:660px;
	margin:0 auto;
	position:relative;
	}
header div{
	width:980px;
	height:660px;
	position:absolute;
	top:0;
	left:0;
	}
/*header h1{
	width:980px;
	height:660px;
	background:url(../img/top_image.jpg) center center no-repeat;
	margin:0 auto;
	position:relative;
	text-indent:-9999px;
	opacity:0;
	}
*/
header img{
	width:980px;
	height:660px;
	}
}
@media all and (max-width: 767px) {
header section{
	width:100%;
	height: 0;
	position:relative;
	padding-top:67.34%;
}
header div{
	width:100%;
	background-size:cover;
	padding-top:67.34%;
	overflow:hidden;
	height: 0;
	position:absolute;
	top:0;
	left:0;
	}
}

/* -----------------------------------------------------------
   BANNER-AREA TOP
------------------------------------------------------------*/

#contents a{
	display:block;
	}
#contents a:hover{
	filter: alpha(opacity=80);-moz-opacity:0.80;opacity:0.80;
	}
	
@media all and (min-width: 768px) {
#contents{
	width:980px;
	margin:0 auto;
	position:relative;
	}
#contents ul{
	list-style:none;
	}
#contents li{
	float:left;
	width:310px;
	margin-right:25px;
	margin-bottom:25px;
	background-color:#000;
	text-indent:-9999px;
	}
#contents a{
	height:246px;
	text-indent:-9999px;
	}
#contents li:nth-child(3n) {
	margin-right:0px;
}
#contents #spot{ background-image:url(../img/top_spot.jpg);height:246px;text-indent:-9999px;} 
#contents #report a{ background-image:url(../img/top_btn.jpg); }
#contents #comment a{ background-image:url(../img/top_btn.jpg); background-position: 0 -246px;} 
#contents #chart a{ background-image:url(../img/top_btn.jpg); background-position:0 -492px;} 
#contents #part a{ background-image:url(../img/top_btn.jpg); background-position:0 -738px;} 
#contents #interview a{ background-image:url(../img/top_btn.jpg?); background-position:0 -984px;} 
#contents #image1{ background-image:url(../img/top_btn.jpg); background-position:0 -1968px;height:246px;} 
#contents #column a{ background-image:url(../img/top_btn.jpg?); background-position:0 -1230px;} 
#contents #theme_bbs a{ background-image:url(../img/top_btn.jpg?); background-position:0 -1476px;} 
#contents #gallery a{ background-image:url(../img/top_btn.jpg?); background-position:0 -2214px;} 
#contents #line_stamp a{ background-image:url(../img/top_btn.jpg?); background-position:0 -1722px;} 
#contents #tbsfree{ background-image:url(../img/top_btn.jpg?); background-position:0 -2460px;height:190px;text-indent:-9999px;} 
#contents #spmovie a{ background-image:url(../img/top_btn.jpg?); background-position:0 -2650px;height:190px;} 
#contents #odm{ background-image:url(../img/top_btn.jpg?); background-position:0 -2840px; height:90px; text-indent:-9999px;} 
#contents #goods a{ background-image:url(../img/top_btn.jpg?); background-position:0 -2930px;width:310px;height:90px; } 
#contents #goods{margin-right:0;position:absolute; right:0; bottom:10px;}
}
@media all and (max-width: 767px) {
#contents ul{
	overflow:hidden;
	position:relative;
	}
#contents li{
	width:100%;
	margin:0 auto 6px;	
	}
#contents ul a{
	width:90%;
	margin:0 auto;
	background-size:cover;
	height:0;
	overflow:hidden;
	}
#contents #spot{ background-image:url(../img/smpbn_spot.jpg); padding-top:31.25%;width:90%;	background-size:cover;height:0;overflow:hidden;} 
#contents #report a{ background-image:url(../img/smpbn_report.jpg); padding-top:17.18%;} 
#contents #comment a{ background-image:url(../img/smpbn_comment.jpg); padding-top:17.18%;} 
#contents #chart a{ background-image:url(../img/smpbn_chart.jpg); padding-top:17.18%;} 
#contents #part a{ background-image:url(../img/smpbn_part.jpg); padding-top:17.18%;} 
#contents #interview a{ background-image:url(../img/smpbn_interview.jpg?); padding-top:17.18%;} 
#contents #image1{ display:none;} 
#contents #column a{ background-image:url(../img/smpbn_column.jpg); padding-top:17.18%;} 
#contents #theme_bbs a{ background-image:url(../img/smpbn_themebbs.jpg); padding-top:17.18%;} 
#contents #gallery a{ background-image:url(../img/smpbn_gallery.jpg); padding-top:17.18%;} 
#contents #line_stamp a{ background-image:url(../img/smpbn_line.jpg); padding-top:17.18%; } 
#contents #tbsfree{ background-image:url(../img/smpbn_tbsfree.jpg); padding-top:31.25%;width:90%;	background-size:cover;height:0;overflow:hidden;} 
#contents #spmovie a{ background-image:url(../img/smpbn_spmovie.jpg); padding-top:17.18%;} 
#contents #odm{ background-image:url(../img/smpbn_odm.jpg); padding-top:17.18%; width:90%;	background-size:cover;height:0;overflow:hidden;} 
#contents #goods a{ background-image:url(../img/smpbn_goods.jpg); padding-top:17.18%; } 
}


/* -----------------------------------------------------------
   UPDATE
------------------------------------------------------------*/
#update{
	background-image:url(../img/bg_update.jpg);
	clear:both;
	}
#update h2{
	text-indent:-9999px;
	}
#update dl{	
	font-size:85%;
	letter-spacing:0.04em;
	line-height:140%;
	overflow:auto;
	}
#update dt{
	color:#974e22;
	}
#update dd{
	border-bottom:1px solid #dbc09f;
	padding-bottom:5px;
	margin-bottom:5px;
	}
#update dd a{
	color:#382921;
	text-decoration:none;
	}
#update dd:last-child{
	border-bottom:none;
	}
	
@media all and (min-width: 768px) {
#update{
	height:200px;
	}
#update section{
	width:980px;
	margin:0 auto;
	padding-top:18px;
	position:relative;
	}
#update h2{
	display:block;
	width:164px;
	height:164px;
	background:url(../img/update_parts.png) no-repeat;
	}
#update dl{
	width:770px;
	height:120px;
	position:absolute;
	top:40px;
	left:210px;
	}
#update dt{
	float:left;
	clear:both;
	padding-bottom:5px;
	margin-bottom:5px;
	}
#update dd{
	border-bottom:1px solid #dbc09f;
	padding-left:80px;
	}


#update dd a:hover{
	text-decoration:underline;
	}
	
/*extra-btn*/
#update #extra{
	position:absolute;
	top:40px;
	right:0;
	}
#update #extra a{
	display:block;
	width:280px;
	height:120px;
	background:url(../img/extra_btn.jpg) no-repeat;
	text-indent:-9999px;
	}
}
@media all and (max-width: 767px) {
#update{
	width:100%;
	padding:20px 0;
	}
#update h2{
	width:12%;
	position: relative;
	margin:0 auto;
	display:block;
	overflow:hidden;
	height:0;
	padding:5.538%;
	background-image:url(../img/update_smp.png);
	background-size:cover;
	}
#update dl{
	height:200px;
	overflow:auto;
	margin:0;
	padding:0 25px;
	}
#update dd{
	padding-bottom:5px;
	text-align:left;
	margin-left:0;
	}
/*extra-btn*/
#update #extra{
	width:100%;
	margin:0 auto;	
	}
#update #extra a{
	display:block;
	width:90%;
	margin:20px auto;
	background-size:cover;
	height:0;
	overflow:hidden;
	background-image:url(../img/smpbn_extra.jpg);
	padding-top:17.18%;
	}

}



/* -----------------------------------------------------------
   TWITTER-TIMELINE TOP
------------------------------------------------------------*/

@media all and (min-width: 768px) {
#bottom{
	background:url(../img/bg_bottom.png);
	padding:30px 0;
	}
#twit_tl{
	width:650px;
	height:300px;
	background:url(../img/twitter_tl.png) no-repeat;
	float:left;
	margin-right:30px;
	}
#twit_tl h2 a{
	display:block;
	width:476px;
	height:56px;
	}
#twit_tl .box{
	padding:20px 20px 20px;
	}
.SandboxRoot.env-bp-550 .timeline-Tweet-text{
	font-size:12px !important;
	}
}
@media all and (max-width: 767px) {
#bottom{
	padding:0 20px 20px;
	}
#twit_tl{
	background:url(../img/bg_bottom.png);
	padding:20px;
	margin-bottom:20px;
	}
#twit_tl h2 a{
	display:block;
	width:100%;
	height:0;
	overflow:hidden;
	padding-top:18.47%;
	margin:0 auto;
	background-size:cover;
	background-image:url(../img/twitter_tl_smp.png);
	}
}
