@charset "UTF-8";
@import url("base.css");
/*共通設定-------------------------------------------------------------------------------------------------------------------------------------*/
/*基本設定*/
/*メイン*/
h1 {
  background-color: #000;
  color: #fff;
  font-size: 156%;
  padding: 0.25em 2%;
  margin: 2em auto 0; }

#torigara, #temahima, #cospa, #topping {
  margin: 5em auto 0; }
  #torigara h2, #temahima h2, #cospa h2, #topping h2 {
    font-size: 125%;
    background-color: yellow;
    padding: 0.25em 2%;
    text-align: center !important; }
  #torigara .area, #temahima .area, #cospa .area, #topping .area {
    margin: 3em 0 0;
    display: flex;
    flex-wrap: wrap;
    flex-direction: row-reverse;
    justify-content: space-between;
    width: 100%; }
    #torigara .area p, #temahima .area p, #cospa .area p, #topping .area p {
      width: 50%; }
    #torigara .area figure, #temahima .area figure, #cospa .area figure, #topping .area figure {
      width: 46%; }
  #torigara .area02, #temahima .area02, #cospa .area02, #topping .area02 {
    margin: 3em 0 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%; }
    #torigara .area02 p, #temahima .area02 p, #cospa .area02 p, #topping .area02 p {
      width: 50%; }
    #torigara .area02 figure, #temahima .area02 figure, #cospa .area02 figure, #topping .area02 figure {
      width: 46%; }

#bottom_image {
  margin: 5em auto 0;
  padding: 5em 0 0;
  border-top: 5px solid #000; }
  #bottom_image #bottom_image_inner {
    width: 80%;
    margin: 0 auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between; }
    #bottom_image #bottom_image_inner figure {
      width: 40%; }
    #bottom_image #bottom_image_inner ul {
      width: 40%; }
      #bottom_image #bottom_image_inner ul li {
        margin: 0 0 2em; }

/*フッター*/
/*共通設定ここまで-------------------------------------------------------------------------------------------------------------------------------------*/
/* pc */
@media screen and (min-width: 1100px) {
  /*ヘッダー*/
  /*メイン*/
  h1 {
    width: 1080px; }

  #torigara, #temahima, #cospa, #topping {
    width: 830px; }

  #bottom_image {
    width: 1080px; }

  /*フッター*/ }
/* tablet以下共通 ------------------------------------------------------------------------------------------*/
@media screen and (max-width: 1099px) {
  /*ヘッダー*/
  /*メイン*/
  h1 {
    width: 90%; }

  #torigara, #temahima, #cospa, #topping {
    width: 90%; }

  #bottom_image {
    width: 90%; }

  /*フッター*/ }
/* tablet以下共通 ------------------------------------------------------------------------------------------*/
@media only screen and (min-width: 1024px) and (max-width: 1099px) {
  /*ヘッダー*/
  /*メイン*/
  /*フッター*/ }
/* tablet以下共通ここまで ------------------------------------------------------------------------------------------*/
/* tablet1  */
@media only screen and (min-width: 768px) and (max-width: 1023px) {
  /*基本設定*/
  /*ヘッダー*/
  /*メイン*/
  /*フッター*/ }
/* tablet2  */
@media only screen and (max-width: 767px) {
  /*基本設定*/
  /*ヘッダー*/
  /*メイン*/
  h1 {
    font-size: 130%; }

  #torigara, #temahima, #cospa, #topping {
    margin: 3em auto 0; }
    #torigara h2, #temahima h2, #cospa h2, #topping h2 {
      font-size: 115%; }
    #torigara .area, #torigara .area02, #temahima .area, #temahima .area02, #cospa .area, #cospa .area02, #topping .area, #topping .area02 {
      margin: 2em 0 0;
      flex-direction: column; }
      #torigara .area p, #torigara .area02 p, #temahima .area p, #temahima .area02 p, #cospa .area p, #cospa .area02 p, #topping .area p, #topping .area02 p {
        width: 100%;
        margin: 1em 0 0; }
      #torigara .area figure, #torigara .area02 figure, #temahima .area figure, #temahima .area02 figure, #cospa .area figure, #cospa .area02 figure, #topping .area figure, #topping .area02 figure {
        width: 100%; }

  #bottom_image {
    margin: 2.5em auto 0;
    padding: 2.5em 0 0; }
    #bottom_image #bottom_image_inner {
      width: 80%;
      margin: 0 auto;
      flex-direction: column; }
      #bottom_image #bottom_image_inner figure {
        width: 100%; }
      #bottom_image #bottom_image_inner ul {
        width: 100%;
        margin: 2em 0 0; }

  /*フッター*/ }
/* smartPhone1 */
@media only screen and (max-width: 499px) {
  /*基本設定*/
  /*ヘッダー*/
  /*メイン*/
  /*フッター*/ }