@charset "UTF-8";



#top{
	width:100%;
	margin:0 auto;
	position:relative;
	background:url("../images/top_bg_pc.jpg") center top no-repeat;
	position:relative;
	
}

@media screen and (min-width:641px) and (max-width:980px){
	#top{
	width:980px;
	margin:3vW auto 0 auto;
	position:relative;
	background:url("../images/top_bg_pc.jpg") center top -0.5vw no-repeat;
	background-size:245% auto;
	}
}
@media screen and (max-width:640px){
	#top{
	width:100%;
	margin:0;
	position:relative;
	background:url("../images/top_sp_bg.jpg") left top no-repeat;
	background-size:100% auto;
	}
}
#top #main h1,
#top #main h2,
#top #main h3,
#top #main h4,
#top #main h5,
#top #main h6{
	display:none;
}

@media screen and (min-width:981px){
	#top #main {
	width:980px;
	height:849px;
	margin:0 auto;
	background:url("../images/top_txt_pc.png") no-repeat;
		z-index:100 !important;
	}
}
@media screen and (min-width:641px) and (max-width:980px){
	#top #main {
	width:100%;
	height:92vW;
	margin:0 auto;
	background:url("../images/top_txt_pc.png") no-repeat;
	background-size:103% auto;
		z-index:100;
	}
	
}

@media screen and (max-width: 640px){
	#top #main {	
	width:100%;
	height:215vW;
	}
}


/* TRAILER
----------------------------------------------------- */
#trailerBtn img{
	width:100%;
}

@media screen and (min-width:981px){
	#trailerBtn{
	width:200px;
	position:absolute;
	top:280px;
	right:14%;
	}
}
@media screen and (min-width:641px) and (max-width:980px){
	#trailerBtn{
	width:22%;
	position:absolute;
	top:29vW;
	right:12%;
	}
}
#spfooter{
	width:100%;
	margin:5% 0 -6% 0;
	padding:0% 0 10% 0 ;
}
@media screen and (max-width: 640px){
	#trailerBtnSP{
	width:90%;
	margin:0 auto;
	position:relative;
	display:block;
	}
	#trailerBtnSP img{
	width:100%;
}
}


/* COMMENT BANNER
----------------------------------------------------- */
#comBtn img{
	width:100%;
}
@media screen and (min-width:1081px) {
	#comBtn{
	width:125px;
	position:absolute;
	top:625px;
	right:110px;
	}
}
@media screen and (min-width:981px) and (max-width:1080px) {
	#comBtn{
	width:125px;
	position:absolute;
	top:635px;
	left:120px;
	}
}
@media screen and (min-width:641px) and (max-width:980px){
	#comBtn{
	width:14vw;
	max-width:150px;
	position:absolute;
	top:64vw;
	right:8vw;
	}
}
@media screen and (max-width:640px){
	#comBtn{
	width:21%;
	position:absolute;
	top:146vW;
	right:30vw;
	left:auto;
	}
}


/* DVD BANNER
----------------------------------------------------- */
#dvdBtn img{
	width:100%;
}
@media screen and (min-width:1081px) {
	#dvdBtn{
	width:235px;
	position:absolute;
	top:335px;
	left:20px;
	}
}
@media screen and (min-width:981px) and (max-width:1080px) {
	#dvdBtn{
	width:22vw;
	position:absolute;
	top:335px;
	left:2vw;
	}
}
@media screen and (min-width:641px) and (max-width:980px){
	#dvdBtn{
	width:24vw;
	position:absolute;;
	top:35vw;
	left:2vw;
	}
}
@media screen and (max-width:640px){
	#dvdBtn{
	width:91%;
	margin:0 auto ;
	}
}


/* TOP CREDIT
----------------------------------------------------- */


@media screen and (max-width: 640px){
	.credit{
	font-size:7px;
	line-height:1.2;
	}
}
@media screen and (min-width:980px)  {
	#topCredit{
	position:absolute;
	width:150px;
	right:0px;
	bottom:100px;
	background:none;
		z-index:100;
	padding-bottom:55px;
	}
	.credit{
		font-size:10px;
		line-height:1.3;
		color:#846c24;
		font-weight:500;
		text-align:left;
		display:none;
	}
}
@media screen and (min-width:640px) and (max-width:980px) {
	#topCredit{
	position:absolute;
	width:100%;
	right:auto;
	left:0px;
	bottom:2vW;
	background:none;
		z-index:100;
	padding-bottom:4vw;
	}
	.credit{
		display:none;
	}
}

/* Banner Area 
----------------------------------------------------- */
@media screen and (max-width: 640px){
	#bannerArea{
		position:relative;
		margin:0 auto 2% auto;
		width:90%;
	}
	#bannerArea img{
		width:100%;
	}
	#bannerArea li{
		float:left;
		width:32%;
		margin-right:2%;
	}
	#bannerArea li:last-child{
		margin-right:0px;
	}
}
@media screen and (min-width: 981px){
	#bannerArea{
		width:140px;
		line-height:0;
	}
	#bannerArea img{
		width:140px;
		height:auto;
	}
	#bannerArea li{
		margin-bottom:5px;
	}
}
@media screen and (min-width: 641px) and (max-width:980px) {
	#bannerArea{
		width:14vw;
		line-height:0;
	}
	#bannerArea img{
		width:100%;
		height:auto;
	}
	#bannerArea li{
		margin-bottom:5px;
		float:left;
	}
}

/* SNS LINK
----------------------------------------------------- */
#twiBtn{
		width:250px;
		height:55px;
	display:block;
	margin:0 auto;
	-webkit-transition: 0.2s;
	-moz-transition: 0.2s;
	transition: 0.2s;
	opacity:1;
	margin:10px auto;
}
#twiBtn:hover{
	opacity:0.8;
}
#twiBtn img{ width:100%; }
@media screen and (max-width:980px)  {
	#twiBtn{
	}
	
}

@media screen and (max-width: 776px) and (min-width: 640px) {
	#twiBtn{
		width:200px;
		height:45px;
	}
}
@media screen and (max-width:640px)  {
	#twiBtn{
		width:154px;
		height:25px;
	}
	
}


/* SOCIAL BOOKMARK
----------------------------------------------------- */
#socialBookmark{
	margin:10px 0 0 0;
	width:230px;
	position:relative;
	}
@media screen and (min-width: 981px)  {
	#socialBookmark{
	
	position:absolute;
	bottom:0;
	right:10px;
	}
}
@media screen and (min-width: 641px) and (max-width:980px)  {
	#socialBookmark{
	width:26vw;
	min-width:230px;
	position:absolute;
	bottom:-20px;
	right:0;
	}
}
#socialBookmark li{
		
		overflow:hidden;
		height:25px;
	}
	#socialBookmark li#tw {
		width:75px;
        
		}
	#socialBookmark li#fb {
		width:84px;
		}
	#socialBookmark li#line {
		width:84px;
		}
	#socialBookmark li#eigacom {
		width:110px;
		}
@media screen and (min-width: 980px)  {
	
	#socialBookmark li{
		float:right;
	}
	
}
@media screen and (min-width: 640px) and (max-width:980px)   {
	
	#socialBookmark li{
		float:right;
		margin-right:5px;
	}
	
}

@media screen and (max-width: 640px)  {
	#socialBookmark{
	width:310px;
	margin:0px auto 0 auto;
	}
	#socialBookmark li{
		float:left;
	}
	#socialBookmark li:first-child{
	}
	#socialBookmark li:last-child{
	
	}
	#socialBookmark li#eigacom {
		width:110px;
		float:none;
		margin:0 auto;
		}
}


