@charset "utf-8";

/*==========================================
 EFFECT 
===========================================*/
/* HOVERでラインイン */
.frame {
	position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;
	border: 0 solid #fff;
	z-index: 50 !important;
	box-sizing: border-box; /* BORDERをBOXの内側に含む */
	-webkit-transition: border-width 0.3s ease;
	-moz-transition: border-width 0.3s ease;
	-ms-transition: border-width 0.3s ease;
	transition: border-width 0.3s ease;
		-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
	overflow:hidden;
}
a:hover .frame {
	border: 0 solid #fff;
	border-width: 10px;
	opacity: 0.5;
}

/* HOVERで画像拡大 */
.cng {
	margin: 0;
	overflow: hidden;
	position: relative;
}
.cng:after {
	position: absolute;
	content: "";
	display: block;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	opacity: 0.5;
	transition: all .3s ease-out;
	transform: scale(1.0, 1.0);
}
.cng:hover:after {
	opacity: 1;
	transform: scale(1.0, 1.0);
}
.cng img {
	height: auto;
	width: 100%;
	vertical-align: bottom;
		-webkit-transition: -webkit-transform 0.4s ease-in-out;
		-moz-transition: -moz-transform 0.4s ease-in-out;
	transition: transform 0.4s ease-in-out;
		-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
}
a:hover .cng img {
	transform: scale(1.2,1.2);
		-webkit-transform:scale(1.2,1.2);
		-moz-transform:scale(1.2,1.2);
		-ms-transform:scale(1.2,1.2);
		-o-transform:scale(1.2,1.2);
	
	-webkit-backface-visibility:hidden;
	backface-visibility:hidden;
	overflow:hidden;
}

/* HOVERで画像_透明70% */
a.alpa70:hover {
	filter:alpha(opacity=70);
	-moz-opacity: 0.7;
	opacity: 0.7;
}