/**********
 style-gallery.css
**********/

/*==========================================
 ヘッダーのスタイル
===========================================*/
/**********
 header
**********/
#headTop #headContentsTop{
	width:100%;
	background:url(../gallery/img/headBg.jpg) no-repeat 50% 65%;
    background-size: cover;
	min-height:70px;
}

/* when under viewport size, .mean-container is added to body */
.mean-container .mean-bar {
	position: relative;
	z-index: 600;
	-webkit-transform: translate3d(0, 0, 0px);
    transform: translate3d(0, 0, 0px);
}


/*==========================================
 コンテンツエリアのスタイル
===========================================*/

/**********
 gallery
**********/
#galleryWrap{}
#galleryWrap ul#gallery{}
#galleryWrap ul#gallery:after{ 
    content: " "; 
    clear: both; 
    height: 0; 
    display: block; 
    visibility: hidden; 
}

#galleryWrap ul#gallery li{
  display:block;
  float:left;
  width:50%;
  margin-bottom:15px;
}

#galleryWrap ul#gallery li a{
	width:95%;
	display:block;
	margin:0 auto;
    overflow:hidden;
    position:relative;
    height:100px;
	background:#f2f0e9;
}

#galleryWrap ul#gallery li a img{
	vertical-align:baseline;
	display:block;
    position: absolute;
    left: -100%;
    right: -100%;
	top:-100%;
	bottom:-100%;
    margin: auto;
    width: 160%;
    height: auto;
}




/* PC・大型タブレット：769px～1200px */
@media only screen and (min-width: 769px) and (max-width: 1200px) {


/*==========================================
 コンテンツエリアのスタイル
===========================================*/
/**********
 gallery
**********/

#galleryWrap ul#gallery li{
  width:25%;
}

#galleryWrap ul#gallery li a{
    height:120px;
}



}



/* PC向け：1201px以上で固定 */
@media only screen and (min-width: 1201px) {


/*==========================================
 コンテンツエリアのスタイル
===========================================*/

#galleryWrap ul#gallery li{
  width:20%;
}
#galleryWrap ul#gallery li a{
    height:120px;
}

}



@media print{
	
/*==========================================
 コンテンツエリアのスタイル
===========================================*/

#galleryWrap ul#gallery li{
  width:20%;
}
	
}