@charset "utf-8";

/* gallery
----------------------------------------------------------------------------------*/
#gallery-navi{
	width:720px;
	margin:20px -20px 10px 0;
	overflow:hidden;
	zoom:1;
}
#gallery-navi li{
	float:left;
	width:160px;
	margin:0 20px 0 0;
	text-indent:-999999px;
}
#gallery-navi li a{
	display:block;
	height:56px;
	background:url(../../gallery/img/gallery-navi.gif) no-repeat;
}
#gallery-navi li.nav01 a{background-position:0 0;}
#gallery-navi li.nav02 a{background-position:-160px 0;}
#gallery-navi li.nav03 a{background-position:-320px 0;}
#gallery-navi li.nav04 a{background-position:right 0;}

#gallery-navi li.nav01 a:hover,
#gallery-navi li.nav01 a.select{background-position:0 bottom;}
#gallery-navi li.nav02 a:hover,
#gallery-navi li.nav02 a.select{background-position:-160px bottom;}
#gallery-navi li.nav03 a:hover,
#gallery-navi li.nav03 a.select{background-position:-320px bottom;}
#gallery-navi li.nav04 a:hover,
#gallery-navi li.nav04 a.select{background-position:right bottom;}

ul.gallery{
	clear:both;
	width:712px;
	margin:0 -12px 0 0;
	letter-spacing:-0.4em;
	overflow:hidden;
	zoom:1;
}
ul.photo-S{
	padding:0 0 20px;
	background:url(../img/decoration.png) no-repeat 0 bottom;
}
ul.gallery li{
	display:inline-block;
	*display:inline;
	margin:0 12px 20px 0;
	vertical-align:top;
	letter-spacing:normal;
	zoom:1;
}
ul.gallery li a img{
	max-width:100%;
	height:auto;
}
ul.gallery li p{
	margin:5px 0 0;
}

ul.photo-L li{width:344px;}
ul.photo-S li{width:166px;}

/*.season{display:none;}*/

.cboxElement{
	display:block;
	text-align:center;
}
@media only screen and (max-width: 767px){
	#gallery-navi{
		width:auto;
		margin:20px -5px 10px;
	}
	#gallery-navi li{
		width:25%;
		margin:0;
		padding: 0 5px;
		text-indent: 0;
	}
	#gallery-navi li a{
		display:block;
		height:inherit;
		padding: 10px;
		font-size: 16px;
		text-decoration: none;
		text-align: center;
		border: 1px solid #c8c8c8;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		-ms-border-radius: 10px;
		-o-border-radius: 10px;
		border-radius: 10px;
		background:none;
	}
	#gallery-navi li a.select{
		color: #fff;
		background: #068B00 0;
	}
	ul.gallery{
		width:auto;
		margin:0 -10px 0 0;
	}
	ul.gallery li{
		margin:0 0 20px;
		padding: 0 10px;
	}

	ul.photo-L li{width:50%;}
	ul.photo-S li{width:25%;}
}
@media only screen and (max-width: 480px){
	ul.photo-L li{width:100%;}
	ul.photo-S li{width:50%;}
}