@charset "utf-8";

/* 使用禁止マーク置換（アクセシビリティ対策） */
.tri_mark_dw:before {
  content: "▼";
}

.tri_mark_up:before {
  content: "▲";
}

.asterisk_mark:before {
  content: "＊";
}

.kome_mark:before {
  content: "※";
}

.dot_mark:before {
  content: "・";
}

.list_mark:before {
  content: "▲";
  transform: rotate(90deg);
  display: inline-block;
  margin: 0 5px 0 0;
}

h1 {
  display: none;
}

.wrap {
  width: 960px;
}

/* pの指定 */
.content .wrap p {
  line-height: 1.5;
}

/* ヘッダー */
.area_header_wrap {
  display: flex;
  justify-content: space-between;
  margin: 0 0 1em;
  flex-wrap: wrap;
}

.area_header {
  width: 72%;
}

.area_header_wrap img {
  width: 27%;
  height: auto;
  object-fit: cover;
}

.area_img {
  text-align: right;
  width: 24%;
  position: relative;
  top: -1.4em;
  right: 0.5em;
  color: #fff;
  font-size: 2.3em;
  margin: 0 0 -2em auto;
  font-style: italic;
  font-family: serif;
  font-weight: bold;
  text-shadow: 3px 3px 2px #000,
    -3px 3px 2px #000,
    -3px -3px 0 #000,
    3px -3px 0 #000;
}

.area_title {
  background-color: #0093c1;
  padding: 8px 1em;
  color: #fff;
  font-size: 1.5em;
  width: 100%;
}

.area_title_america {
  font-size: 2.1em;
}

.area_header_name {
  text-align: center;
  font-size: 3em;
  font-family: serif;
  font-weight: bold;
  padding: 12px;
  width: 100%;
  background-color: #e7f1f7;
}

.area_header_menu {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.area_header_info {
  background-color: #cae7ff;
  text-align: center;
  margin: 0 0 3px;
  width: 100%;
}

.area_header_menu a {
  width: 16%;
  text-align: center;
  text-decoration: none;
  padding: 9px;
  font-size: 1.2em;
  margin: 0;
  background-color: #9bd1ff;
}

.area_header_menu a:hover {
  opacity: 0.5;
}


/* メニュー */
.menu_list {
  border: 4px solid #0093c1;
  padding: 0;
}

.menu_list p {
  width: 100%;
  text-align: center;
  background-color: #0093c1;
  padding: 5px 0;
  color: #fff;
  margin: 0 0 0.5em;
}

.menu_list ul {
  margin: 0;
}

/* メニュー 欧州 アジア */
.area_list {
  display: flex;
  flex-wrap: wrap;
  font-size: 1.1em;
  margin: 0 auto 0.5em;
  justify-content: flex-start;
  width: 95%;
  padding: 0 0 0 1%;
}

.area_list a {
  margin: 0 1% 5px 0;
  width: 15.5%;
  padding: 0.3em 0;
  background-color: #ffc1c1;
  text-align: center;
  text-decoration: none;
  display: flex;
  align-items: center;
  justify-content: center;
}

.area_list a:hover {
  opacity: 0.5;
}

.area_name {
  font-weight: bold;
  font-size: 1.3em;
  margin: 1em 0 -0.5em;
  padding: 0.8em 1em;
  background-color: #ccc;
}

.area_list a.eu_info {
  width: 32%;
  font-size: 0.9em;
}

/* メニュー 中近東 */
.area_list_arab {
  padding: 0.5em 0 0 2%;
}

/* .area_list_arab a {
  margin: 0 0% 5px 0;
  width: 18.5%;
} */

/* メニュー 北米 */
.area_list_us {
  justify-content: center;
  width: 85%;
  padding: 0.5em 0 0;
}

.area_list_us a {
  margin: 0 2% 5px;
  width: 18.5%;
  padding: 0.3em 0;
}

/* メニュー 大洋州 */
.area_list_ose {
  justify-content: center;
  width: 85%;
  padding: 0.5em 0 0;
}

.area_list_ose a {
  margin: 0 2% 5px;
  width: 18.5%;
  padding: 0.3em 0;
}

/* メニュー 中南米 */
.area_list_south {
  padding: 0.5em 0 0 2%;
}

/* メニュー アフリカ */
.area_list_africa {
  padding: 0.5em 0 0 2%;
}


/* ▼中近東のJapanese Cuisine */
h2.h-cuisine {
  background-color: #f5e715;
}

.j-cuisine {
  display: flex;
  width: 10em;
  float: left;
  margin: -7px 10px 0 -17px;
  background-color: #575757;
  justify-content: center;
  padding: 5px 0 4px;
}

/* ▲中近東のJapanese Cuisine */

@media screen and (max-width: 959px) {
  .wrap {
    width: 100%;
  }

  /* ヘッダー */
  .area_title_america {
    font-size: 1.8em;
  }

  /* 各エリアのCSS 欧州 アジア */
  .area_list {
    font-size: 1em;
    padding: 0 0 0 2%;
  }

  /* ▼中近東のJapanese Cuisine */
  .j-cuisine {
    width: 100%;
    float: none;
    margin: -7px auto 5px;
  }

}

@media screen and (max-width: 767px) {

  /* ヘッダー部分 */
  .area_header_wrap img {
    display: none;
  }

  .area_img {
    display: none;
  }

  .area_header {
    width: 100%;
  }

  .area_header_menu a {
    width: 32.5%;
    margin: 0 0 5px;
  }

  /* 各エリアのCSS 欧州 アジア */
  .area_list {
    margin: 0 0 1em 6%;
  }

  .area_list a {
    width: 30%;
  }

  .area_list a.eu_info {
    width: 92%;
  }

  /* メニュー 中近東 */
  .area_list_arab {
    padding: 0 0 0 1%;
    margin: 1em 0 0.5em 6%;
  }

  .area_list_arab a {
    width: 45%;
    margin: 0 2% 5px 0;
  }

  /* 各エリアのCSS 北米 */
  .area_list_us {
    padding: 0.5em 0;
    margin: 0 auto;
  }

  .area_list_us a {
    width: 30%;
  }

  /* 各エリアのCSS 大洋州 */
  .area_list_ose {
    padding: 0.5em 0;
    margin: 0 auto;
  }

  .area_list_ose a {
    width: 45%;
  }

  /* メニュー 中南米 */
  .area_list_south {
    margin: 1em 0 0.5em 6%;
    padding: 0 0 0 1%;
  }

  /* メニュー アフリカ */
  .area_list_africa {
    margin: 1em 0 0.5em 6%;
    padding: 0 0 0 1%;
  }

}

@media screen and (max-width: 400px) {}