@charset "utf-8";

header {
    height: 360px;
}


/*-------------------------------------------------------------
			main
-------------------------------------------------------------*/


.box{
	width:940px;
	margin:0 auto;
	padding-top:50px;
	
	/*
	opacity:0;
	transform:translate(0px, 10px);
	transition: .6s all ease;*/
}
.active{
	opacity:1;
	transform:translate(0px, 0px);
}

/*-------------------------------------------------------------
			bar
-------------------------------------------------------------*/
#loader{
	width: 150px;
	height: 3px;
	position:absolute;
	margin:0 auto;
	left:0;
	right:0;
	top:100px;
	text-align:center;
}

#loader-wrap{
	width: 100%;
	height: 100%;
	border: 1px solid #ffafbc;
	background-color:#FFF;
	box-shadow: 0 0 2px #FFF;
}
#load-bar{
	display:block;
	width:0%;
	height:4px;
	/*ckground-color:gray;*/
	transition:all ease 0.1s;
}
/*-------------------------------------------------------------
			main
-------------------------------------------------------------*/

.list-box-wrap{
	font-size:0px;
}


.list-box{
	display:inline-block;
	vertical-align: top;
	width:300px;
	height:225px;
	margin-bottom:40px;
	
	/*background-color:#FFF;*/
	/*border-radius:2px;*/
	/*border:1px solid #D3D3D3;*/
	box-sizing:border-box;
	font-size:.6875rem;
	line-height:21px;
	color:inherit;
	text-align:left;
	letter-spacing:0.5;
	text-decoration:none;
	opacity:0;
	transform:translate(0, 10px);
}

.no-image{
	background-image:url(../img/special/comingsoon@1x.jpg);
}


.list-box:nth-child(3n-1){
	margin-left:20px;
	margin-right:20px;
}

.list-box a{
	display:block;
	width:100%;
	height:100%;
	/*box-shadow: 0px 1px 5px grey;*/
	box-sizing:border-box;
	transform:translate(0px, 0px);
	opacity:1.0;
	
	font-size:.6875rem;
	line-height:21px;
	color:inherit;
	text-align:left;
	letter-spacing:0.5;
	text-decoration:none;
	transition:0.2s all  ease;
}

.list-box a:hover{
	opacity:0.7;
	/*transform:translate(0px, 8px);*/
}