@charset "utf-8";
/* CSS Document */

/*div {
        font-size: 2rem;
        text-align: center;
        margin: 10px;
        padding: 10px;
      }*/

      
	  .container {
      padding: 5% 1% 0% 1%;
}

.child {
	width: calc(16.6% - 2px); /* margin padding分を引く */
	margin: 1px;
	padding: 1px;
	color: #FFF;
	background: #000;
}

      .child {
        background: #fff;
		vertical-align: middle;
      }
	   .child img {
		vertical-align: bottom;
      }

      @media screen and (max-width: 800px) {
      	  .container {
		  background: white;
		  display: flex; /* flexbox */
		  align-items: center;
		  justify-content: center;
		  flex-wrap: wrap; /* 折返し指定 */
}

.child {
	width: calc(33.3% - 2px); /* margin padding分を引く */
	margin: 1px;
	padding: 1px;
	color: #FFF;
	background: #000;
}
.child {
        background: #fff;
		vertical-align: middle;
      }
      }

      @media screen and (max-width: 400px) {
        	  .container {
		  background: white;
		  display: flex; /* flexbox */
		  align-items: center;
		  justify-content: center;
		  flex-wrap: wrap; /* 折返し指定 */
}
		.child {
	width: calc(33.3% - 2px); /* margin padding分を引く */
	margin: 1px;
	padding: 1px;
	color: #FFF;
	background: #000;
}
.child {
        background: #fff;
		vertical-align: middle;
      }
      }