@charset "UTF-8";
/* CSS Document */

/*--------------------------------------------------------------
## 要素左から（画像専用）
--------------------------------------------------------------*/
.effect-l{
	position:relative;
}
.effect-l img{
	transform: translateX(-50px);
	-webkit-transition: linear 0.7s, opacity 0.7s;
	transition: linear 0.7s, opacity 0.7s;
	opacity:0;
}
.effect-l::before{
	content:"";
	width:100%;
	height:100%;
	background-color:#f0f0f0;
	position:absolute;
	opacity:1;
	-webkit-transition: opacity 0.7s;
	transition: opacity 0.7s;
}

.effect-l-open img{
	transform: translateX(0);
	opacity:1;
}
.effect-l-open::before{
	opacity:0;
}
/*黒背景から写真へスライド*/
.effect-l2{
	position:relative;
}
.effect-l2::before{
	content:"";
	width:100%;
	height:100%;
	background-color:#000;
	position:absolute;
	-webkit-transition:linear 0.7s, opacity 0.7s;
	transition:linear 0.7s, opacity 0.7s;
	transform:translateX(0);
}
.effect-l2-open::before{
	transform:translateX(-100%);
}


/*--------------------------------------------------------------
## 要素右から
--------------------------------------------------------------*/

.effect-r{
	position:relative;
	transform: translateX(50px);
	-webkit-transition: linear 0.7s, opacity 0.7s;
	transition: linear 0.7s, opacity 0.7s;
	opacity:0;
}
.effect-r-open{
	transform: translateX(0);
	opacity:1;
}

/*--------------------------------------------------------------
## 要素下から
--------------------------------------------------------------*/

.effect-b{
	position:relative;
	transform: translateY(50px);
	-webkit-transition: linear 0.7s, opacity 0.7s;
	transition: linear 0.7s, opacity 0.7s;
	opacity:0;
}
.effect-b-open{
	transform: translateY(0);
	opacity:1;
}


/*--------------------------------------------------------------
## 要素ホバー
--------------------------------------------------------------*/
a img{
	-webkit-transition:opacity 0.7s;
	transition: opacity 0.7s;
	opacity:1;
}
a img:hover{
	opacity:0.7;
}
a .bnrImg img:hover{
	opacity:1;
}


/*--------------------------------------------------------------
## Delay
--------------------------------------------------------------*/

delay03s{
	transition-delay:0.3s;
}
delay05s{
	transition-delay:0.5s;
}
delay07s{
	transition-delay:0.7s;
}
delay1s{
	transition-delay:1s;
}