@charset "utf-8";




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

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


}

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

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



#original{
	position:relative;
	width:100%;
	max-width:1400px;
	margin:0 auto 4em;
}

section .head{
	text-align:center;
	padding-bottom:1.5em;
}

section .head h2{
font-family: 'Antic Didone', serif;
	font-size:300%;
letter-spacing:0.1em;
}



.fbox{
	width:100%;
	display:flex;
	/*flex-wrap:wrap;*/
	justify-content:center;
	padding:1em 0em;
}


.f2col .fitem_pic{
flex:0 0 50%;
}

.f3col .fitem_pic{
flex:0 0 33.3%;
}


.f4col .fitem_pic{
flex:0 0 25%;
}


.fitem_pic{
align-self:center;
}

.fbox figure{
	margin:6px 10px;
	overflow:hidden;
	position:relative;
	/*transform: rotate(2deg);*/
	transition: .5s;
}

.fbox figure:hover{
		transform: rotate(0deg);
}



.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(255,255,255,0.5);
}

.fbox figcaption span.blck{
	color:rgba(0,0,0,0.5);
}


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


.fbox img{
	width:100%;
	height:auto;
	vertical-align:middle;
}
	/*height:calc(100vw -10px);
	width:auto;*/



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

.fbox40{
	width:40%;
	margin:0 auto;
}


.fbox50{
	width:50%;
	margin:0 auto;
}

.fbox60{
	width:60%;
	margin:0 auto;
}

.fbox80{
	width:80%;
	margin:0 auto;
}


}





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

.fbox{
	padding:0 1em;
/*flex-direction	:column;*/
flex-wrap:wrap;
}

.fitem_pic{
flex:1 1 50%!important;
}

.sp_wid{
flex:0 0 100%!important;
}



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

.fbox figcaption span{
	padding:0.2em 0.5em 0.1em;
}

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



}