@charset "Shift_JIS";
/* CSS Document */

/*****************************************************
	
	GenesinFlags
	
*****************************************************/
.GF_box {
border: none;
background-color: #fff;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
text-align: left;
line-height: 1.4em;
font-weight: normal;
font-size: medium;
}

.GF_box-img {
border: none;
margin: 0;
}
.GF_box-lead {
color: #000;
background-color: #fff;
border: none;
padding: 10px;
}
.GF_box-left {
float: left;
border: none;
padding: 10px;
background-color: #fff;
}
.GF_box-right {
float: right;
border: none;
padding: 10px;
background-color: #fff;
}

.GF_box-item{
	display: flex;
	flex-wrap:wrap;
}
.GF_box-item li {
	width: calc(100%/3);/*←画像を横に3つ並べる場合*/
	padding:0 2px;/*←画像の左右に余白を入れる場合*/
	box-sizing:border-box;
}
.GF_box-item li img {
	max-width:100%; /*画像のはみだしを防ぐ*/
	height: auto; /*画像の縦横比を維持 */
	border:solid none; /*←画像を枠線で囲む指定の場合には値を入れる*/
}

.GF_box-cb{
  /* floatを解除 */
  clear: both;
}

.GF_box-cr{
  /* floatを解除 */
  clear: right;
}

.GF_box-cl{
  /* floatを解除 */
  clear: left;
}

.container {
margin-bottom: 30px;
}

/*****************************************************
	
	img zoom
	
*****************************************************/

.zoom_box{
 width:600px; // サイズがサンプルなので適時変更してください。
 margin:0 auto; //サンプルで中央に寄せたいので書かせていただいております。
 overflow:hidden; //これを記述することではみ出た部分を非表示にします。
}
.zoom_box img{
 transition:1s all;
}
.zoom_box img:hover{
  transform:scale(1.2,1.2);
  transition:1s all;
}