/*---------------------
共通
-----------------------*/

.sp_view{
	display:none !important;
}
.pc_view{
	display:block;
}

/*hover_opacity*/
.over_anim{
	transition:0.3s;
}
.over_anim:hover{
	opacity:0.8 !important;
}
/*hover_画像*/
.over_anim2 img{
	transition:0.3s;
}
.over_anim2 :hover{
	opacity:0 !important;
}


/*---------------------
CHECK!アイコン
-----------------------*/
.check1,.check2{
	position: absolute;
    top: 480px;
    right: 122px;
	-webkit-animation: check .7s infinite;
	-moz-animation: check .7s infinite;
	animation: check .7s infinite;
}
.check2{
    top: 530px;
	right: 110px;
}

@keyframes check {
  50% { transform: translate(-5px,0);}
}

/*---------------------
navi
-----------------------*/

/*page_top*/
.page_top{
	position:fixed;
	width:67px;
	height:58px;
	/*right:20px;*/
	bottom:20px;
	cursor:pointer;
	z-index:1000;
	display:none;
    left: 50%;
    margin-left: 860px;	
}
.page_top:hover{
	opacity:0.8;
}

/*隠し*/
.left_mask{
    position: fixed;
    right:0;
    top:0;
    height: 100%;
    background: #000;
    z-index: 1001;
}

.animation{
	transition: 0.5s;
}



#navi{
	position: fixed;
    top: 60px;
    right: -300px;
    width: 261px;
    height: 100%;
    z-index: 10;
	background: url("../img/menu/navi_bg.jpg") no-repeat top center;
	background-color: #cd9319;
}

#navi ul{
	margin: 112px 30px 0;
}
#navi li{
	padding-top: 12px;
	padding-bottom: 10px;
	text-align: right;
	border-bottom: 1px solid #e29c3a;
}

/*open　closeボタン*/
.open{
	position: fixed;
    top: 78px;
	cursor: pointer;
	z-index: 2;
	right: -80px;
	transition: 0.3s;
}
.open img{
	transition: 0.3s;
}
.open:hover{
	right: -70px!important;
}

.close{
	position: absolute;
    top: 42px;
	cursor: pointer;
	z-index: 11;
	right: 30px;
	background: url("../img/menu/close_over.png") no-repeat center right;
}
.close img{
	transition: 0.3s;
}
.close:hover img{
	opacity: 0;
}


/*定番ボタン*/
.bt_home{
	position: relative;
	left: 0px;
	height: 27px!important;
}
.bt_home:hover img{
	opacity: 0;
}
.bt_home:hover {
	background: url("../img/menu/home_over.png") no-repeat center right;
}

.bt_news{
	position: relative;
	left: 0px;
	height: 29px!important;
}
.bt_news:hover img{
	opacity: 0;
}
.bt_news:hover {
	background: url("../img/menu/news_over.png") no-repeat center right;
}

.bt_about{
	position: relative;
	left: 0px;
	height: 29px!important;
}
.bt_about:hover img{
	opacity: 0;
}
.bt_about:hover {
	background: url("../img/menu/about_over.png") no-repeat center right;
}

.bt_character{
	position: relative;
	left: 0px;
	height: 29px!important;
}
.bt_character:hover img{
	opacity: 0;
}
.bt_character:hover {
	background: url("../img/menu/ww_over.png") no-repeat center right;
}

.bt_character2{
	position: relative;
	left: 0px;
	height: 28px!important;
}
.bt_character2:hover img{
	opacity: 0;
}
.bt_character2:hover {
	background: url("../img/menu/character_over.png") no-repeat center right;
}

.bt_gallery{
	position: relative;
	left: 0px;
	height: 28px!important;
}
.bt_gallery:hover img{
	opacity: 0;
}
.bt_gallery:hover {
	background: url("../img/menu/gallery_over.png") no-repeat center right;
}

.bt_fanart{
	position: relative;
	left: 0px;
	height: 28px!important;
}
.bt_fanart:hover img{
	opacity: 0;
}
.bt_fanart:hover {
	background: url("../img/menu/fanart_over.png") no-repeat center right;
}

.bt_voicecast{
	position: relative;
	left: 0px;
	height: 28px!important;
}
.bt_voicecast:hover img{
	opacity: 0;
}
.bt_voicecast:hover {
	background: url("../img/menu/voicecast_over.png") no-repeat center right;
}

.bt_tickets{
	position: relative;
	left: 0px;
	height: 28px!important;
}
.bt_tickets:hover img{
	opacity: 0;
}
.bt_tickets:hover {
	background: url("../img/menu/theater_over.png") no-repeat center right;
}

.bt_goldencp{
	position: relative;
	left: 0px;
	height: 28px!important;
}
.bt_goldencp:hover img{
	opacity: 0;
}
.bt_goldencp:hover {
	background: url("../img/menu/goldencp_over.png") no-repeat center right;
}

.bt_comment{
	position: relative;
	left: 0px;
	height: 28px!important;
}
.bt_comment:hover img{
	opacity: 0;
}
.bt_comment:hover {
	background: url("../img/menu/comment_over.png") no-repeat center right;
}

.bt_special{
	position: relative;
	left: 0px;
	height: 29px!important;
}
.bt_special:hover img{
	opacity: 0;
}
.bt_special:hover {
	background: url("../img/menu/special_over.png") no-repeat center right;
}

.bt_dvd{
	position: relative;
	left: 0px;
	height: 29px!important;
}
.bt_dvd:hover img{
	opacity: 0;
}
.bt_dvd:hover {
	background: url("../img/menu/dvd_hover.png") no-repeat center right;
}



/*DC SNS*/
.menu_dc_wrap li{
	border-bottom: none!important;
	padding: 0!important;
}
.menu_dc_wrap{
	position: relative;
    right: 0px;
	margin-top: 150px!important;
	height: 55px;
	border-bottom: 1px solid #e29c3a;
}
.menu_dc{
	position: absolute;
	right: 109px;
}
.menu_dc_ig{
	position: absolute;
	right: 57px;
	transition: 0.3s;
}
.menu_dc_ig a{
	display: block;
}

.menu_dc_ig :hover img{
	opacity: 0;
}
.menu_dc_ig :hover{
	background: url(../img/wb_common/dc_ig_over.png) no-repeat center top;
	background-size: 41px 40px;
}
.menu_dc_tw{
	position: absolute;
	right: 15px;
}
.menu_dc_tw a{
	display: block;
}
.menu_dc_tw:hover img{
	opacity: 0;
}
.menu_dc_tw :hover{
	background: url(../img/wb_common/dc_tw_over.png) no-repeat center left;
	background-size: 41px 40px;
}


/*---------------------
SP
-----------------------*/
@media screen and (min-width: 0px) and (max-width: 800px) {
	/*---------------------
	共通
	-----------------------*/
	.sp_view{
		display:block !important;
	}
	.pc_view{
		display:none !important;
	}
	
	/*hover*/
	.over_anim{
		transition:0s;
	}
	.over_anim:hover{
		opacity:1;
	}
	
	.check1,.check2{
		width: 14%;
		left: 24%;
		top: 0;
		margin-top: 140%;
	}
	.check2{
		margin-top: 157%;		
		left: 25%;
	}

	/*---------------------
	header
	-----------------------*/
	#head_logo{
        position: relative;
        background-size:100% auto;
    }
	.sp_title_link{
		position: absolute;
		width: 40%;
		height: 0;
		padding-bottom: 23%;
		top: 0px;
		right: 0;
		left: 0;
		margin: 0 auto;
		z-index: 1;
		/*background: rgba(0,0,0,0.8);*/
	}
	/*---------------------
	page_top
	-----------------------*/
	.page_top{
		left: inherit;
		margin-left: inherit;	
	}
	/*---------------------
	SPチケットボタン固定
	-----------------------*/
	.tickets_bottom{
		position: fixed;
		bottom: 0;
		z-index: 10;
	}
	
	/*---------------------
	navi
	-----------------------*/	
	#navi_sp{
		position: fixed;
		width: 100%;
		right: 0;
		top: -150%;
		z-index: 900;
		background: url("../img/menu/sp/menu_bg.jpg") no-repeat;
		background-size: 100% auto;
		background-color: #cd9319;
		height: 100%;
		overflow: auto;
	}
	.menu_title{
		margin-bottom: 13%!important;
	}
	.open_sp{
		position: fixed;
		top: 60px;
		right: 1.56%;
		height: 0%;
		width: 11.25%;
		padding-bottom: 15%;
		z-index: 10;
	}
	.close_sp{
		position: absolute;
		top: 0;
		right: 1.56%;
		height: 0%;
		width: 11.25%;
	}
	.menu_item_sp{
		position: absolute;
    	top: 710px;
		z-index: 10;
	}
	.menu_title_sp{
		margin: 40px 0;
	}
	#navi_sp ul{
		margin-top:16%;
	}
	#navi_sp li {
    	width: 100%!important;
		margin-bottom: 0%;
	}
	
	
	/*定番ボタン*/
	.sp_menu_home{
		background: url("../img/menu/sp/home_over.png") no-repeat center top ;
		background-size: 100% auto;
	}
	.sp_menu_home:hover img{
		opacity: 0;
	}
	
	.sp_menu_news{
		background: url("../img/menu/sp/news_over.png") no-repeat center top ;
		background-size: 100% auto;
	}
	.sp_menu_news:hover img{
		opacity: 0;
	}
	
	.sp_menu_about{
		background: url("../img/menu/sp/about_over.png") no-repeat center top ;
		background-size: 100% auto;
	}
	.sp_menu_about:hover img{
		opacity: 0;
	}
	
	.sp_menu_character{
		background: url("../img/menu/sp/ww_over.png") no-repeat center top ;
		background-size: 100% auto;
	}
	.sp_menu_character:hover img{
		opacity: 0;
	}
	
	.sp_menu_gallery{
		background: url("../img/menu/sp/gallery_over.png") no-repeat center top ;
		background-size: 100% auto;
	}
	.sp_menu_about:hover img{
		opacity: 0;
	}
	
	.sp_menu_fanart{
		background: url("../img/menu/sp/fanart_over.png") no-repeat center top ;
		background-size: 100% auto;
	}
	.sp_menu_harleyquinn:hover img{
		opacity: 0;
	}
	
	.sp_menu_chara{
		background: url("../img/menu/sp/characters_over.png") no-repeat center top ;
		background-size: 100% auto;
	}
	.sp_menu_chara:hover img{
		opacity: 0;
	}
	
	.sp_menu_voicecast{
		background: url("../img/menu/sp/voicecast_over.png") no-repeat center top ;
		background-size: 100% auto;
	}
	.sp_menu_voicecast:hover img{
		opacity: 0;
	}
	
	.sp_menu_tickets{
		background: url("../img/menu/sp/theater_over.png") no-repeat center top ;
		background-size: 100% auto;
	}
	.sp_menu_tickets:hover img{
		opacity: 0;
	}
	
	.sp_menu_goldencp{
		background: url("../img/menu/sp/goldencp_over.png") no-repeat center top ;
		background-size: 100% auto;
	}
	.sp_menu_goldencp:hover img{
		opacity: 0;
	}
	
	.sp_menu_special{
		background: url("../img/menu/sp/special_over.png") no-repeat center top ;
		background-size: 100% auto;
	}
	.sp_menu_special:hover img{
		opacity: 0;
	}
	
	.sp_menu_character2{
		background: url("../img/menu/sp/character_over.png") no-repeat center top ;
		background-size: 100% auto;
	}
	.sp_menu_character2:hover img{
		opacity: 0;
	}
	
	.sp_menu_comment{
		background: url("../img/menu/sp/comment_over.png") no-repeat center top ;
		background-size: 100% auto;
	}
	.sp_menu_comment:hover img{
		opacity: 0;
	}
	
	.sp_menu_dvd{
		background: url("../img/menu/sp/dvd_over.png") no-repeat center top ;
		background-size: 100% auto;
	}
	.sp_menu_dvd:hover img{
		opacity: 0;
	}
	
	/*DCSNSボタン*/
	.sp_menu_dc_wrap{
		margin-top: 26.8%;
		padding-bottom: 100px;
	}
	.sp_menu_dc_wrap:after {
		border-bottom: solid 1.5px #e29c3a;
		content: "";
		display: block;
		width: 74%;
		margin: 0 auto;
		padding-top: 17%;
	}	
	.dcico_wrap {
		width: 29%;
		margin: 0 auto 0%;
	}
	.sp_menu_dc_ig{
		float: left;
		width: 48%;
		background: url("../img/menu/sp/menu_ig_over.png") no-repeat;
		background-size: 100% auto;
	}
	.sp_menu_dc_ig img:hover{
		opacity: 0;
	}
	.sp_menu_dc_tw{
		float: right;
		width: 48%;
		background: url("../img/menu/sp/menu_tw_over.png") no-repeat;
		background-size: 100% auto;
	}
	.sp_menu_dc_tw img:hover{
		opacity: 0;
	}
		


}