@charset "utf-8";
/* CSS Information========

Table of Contents:
 * info
 
========================== */

/*IE11だけに適用されるCSSハック*/
@media all and (-ms-high-contrast: none) {
  *::-ms-backdrop,
  #container .topicpath dd {
    margin: 97px 0 5px;
  }
}

section h2 {
  text-align: center;
  margin-bottom: 20px;
}

/* =======================
		#restaurant_type
========================== */
#restaurant_type {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 60px 2%;
}
#restaurant_type .card {
  display: grid;
  row-gap: 8px;
}

#restaurant_type .card h3 {
  text-align: center;
}

#restaurant_type .card p img {
  width: 100%;
}

#restaurant_type .card .kind {
  text-align: center;
}

#restaurant_type .card ul li {
  display: block;
  margin: 0 5px 0 0;
  background-color: #937f49;
  color: #fff;
  width: 90px;
  float: left;
}
#restaurant_type .card ul li p {
  margin: 3px 0;
  display: block;
  text-align: center;
}

/*タブレット*/
@media screen and (max-width: 1000px) {
  /* =======================
		restaurant_type
========================== */
  #restaurant_type {
    grid-template-columns: repeat(2, 1fr);
  }
}

/*スマートフォン*/
@media screen and (max-width: 640px) {
  /* =======================
		page_image
========================== */
  .page_image {
    margin-bottom: 10px;
  }
  /* =======================
		container
========================== */
  #container {
    width: 93.75%;
    margin: 0 auto;
  }

  /* =======================
		#restaurant_type
========================== */
  #restaurant_type {
    grid-template-columns: repeat(1, 1fr);
  }
}