  h2 {
    text-align: center
  }

  #insta {
    display: flex;
    flex-wrap: wrap;
  }

  #insta .card {
    width: 25%;
  }

  #insta .card img{
  display: inline-block;
  background: #fff;
  border: 0.1875em solid #333;
  color: #333;
  cursor: pointer;
  transition: all 0.3s ease 0s;
  
  }

.sample7 {

	overflow:		hidden;
	margin:			10px 3px 10px 3px;
	position:		relative;
}
.sample7 .caption {
	font-size:		100%;
	color:			#fff;
	text-align: 		center;
	padding-top:		10px;
margin:			10px 15px 10px 15px;
}
.sample7 .mask {
	width:			100%;
	height:			100%;
	position:		absolute;
	top:			0;
	left:			0;
	opacity:		0;	/* 表示させない */
	background-color:	rgba(0,0,0,0.4);
	-webkit-transform:	rotateX(-180deg);
	transform:		rotateX(-180deg);
	-webkit-transition:	all 0.6s ease;
	transition:		all 0.6s ease;
}
.sample7:hover .mask {
	-webkit-transform:	rotateX(0deg);
	transform:		rotateX(0deg);
	opacity:		1;	/* ホバーで表示する */
}



.left-column {

  float: left;

  width: 45%; /* 要素の幅を50%に定義 */
  background-color: #aaa; /* 視覚化のための背景色 */

}

.right-column {

  float: right;

  width: 45%; /* 要素の幅を50%に定義 */

  background-color: #ddd; /* 視覚化のための背景色 */

}

.cb{
  /* floatを解除 */
  clear: both;
}
/*************
テーブル
*************/
table.top{
border-collapse:collapse;
margin:5px auto 15px auto;
}

table.top td{
font-color:#000;
border-collapse:collapse;
background-color:#fff;
text-align:left;
padding:8px;
border:1px solid #000;
line-height:20px;
width:500px;
}

table.top th{
font-color:#ffffff;
background-color:#CC0289;
text-align:center;
padding:8px;
white-space:nowrap;
border-top:1px solid #D4D4D4;
border-right:4px solid #D4D4D4;
border-bottom:1px solid #D4D4D4;
border-left:1px solid #D4D4D4;
font-size:14px;
font-weight:normal;
letter-spacing:1px;
background-repeat:repeat-x;
background-position:top;
}