@charset "utf-8";


@media only screen and (min-width: 769px) {

#mv{
background:url(../img/fun_top.jpg) no-repeat;
}


}

@media only screen and (max-width: 768px) {
	
#mv{
background:url(../img/fun_top_sp.jpg) no-repeat;
}
}


#mv{
width:100%;
height:350px;
background-position: center;
background-size: cover;
margin-bottom:3em;
}



.fbox figcaption{
	position:absolute;
	left:0;
	bottom:0;
	background:rgba(0,0,0,0.05);
	text-align:right;
	width:100%;
	height:100%;
	border-top:6px solid rgba(0,0,0,0.20);
	border-right:6px solid rgba(0,0,0,0.4);
	border-bottom:6px solid rgba(0,0,0,0.5);
	border-left:6px solid rgba(0,0,0,0.3);
	transition: .5s;
	display:flex;
}

.fbox figcaption span{
	padding:0.2em 0.5em 0.1em;
	font-size:70%;
/*	background:linear-gradient(to right, rgba(0,0,0,0) 50%, rgba(0,0,0,0.4));
	align-self :flex-end;
	width:100%;
	letter-spacing:0.1em;*/
	color:rgba(0,0,0,0.7);
}

.fbox figcaption span.white{
	color:rgba(255,255,255,0.5);
}


.fbox figcaption:hover{
	background:rgba(0,0,0,0);
	border:6px solid rgba(0,0,0,0.2);
}


}



@media only screen and (min-width: 769px) { /*pc*/




}





@media only screen and (max-width: 768px) {



.fbox figcaption{
	border:5px solid rgba(255,255,255,0.5);
	transition: .5s;
	display:flex;
}

.fbox figcaption span{
	padding:0.2em 0.5em 0.1em;
font-size:70%;}

.fbox figcaption:hover{
	border:5px solid rgba(0,0,0,0.2);
}



}