﻿
#footer nav li:nth-child(1) { order: 1; }
#footer nav li:nth-child(2) { order: 3; }
#footer nav li:nth-child(3) { order: 2; }

#footer nav li:nth-child(3) button,
#footer nav li:nth-child(3) a.button
{
  width: auto;
  padding-left: 1em;
  padding-right: 1em;
  color: #FFF;
  background-color: #e60000;
}

@media (max-width: 768px)
{
  #footer nav ul
  {
    height: auto;
    flex-wrap: wrap;
  }
  #footer nav button,
  #footer nav a.button
  {
    line-height: 35px;
  }
  #footer nav button,
  #footer nav a.button,
  #footer nav button.btn-menu
  {
    font-size: 15px;
  }
}

@media (max-width: 450px)
{

  #footer nav li:nth-child(1) { order: 1; }
  #footer nav li:nth-child(2) { order: 2; }
  #footer nav li:nth-child(3) { order: 3; }

  #footer nav
  {
    padding: 10px;
  }

  #footer nav ul
  {
    gap: 10px;
    width: calc( 100% - 40px );
    margin-left: auto;
    margin-right: auto;
  }

  #footer nav li:nth-child(1),
  #footer nav li:nth-child(2)
  {
    width: calc( 50% - 5px );
  }
  #footer nav li:nth-child(3)
  {
    width: 100%;
    display: flex;
    justify-content: center;
  }

  #footer nav button,
  #footer nav a.button,
  #footer nav button.btn-menu
  {
    width: 100%;
  }
  #footer nav li:nth-child(3) button,
  #footer nav li:nth-child(3) a.button
  {
    width: 100%;/* PC時 width: auto; を解除 */
  }

  #map,
  .drawer
  {
    height: calc(100% - 101px);
  }
  .info-panel
  {
    bottom: 101px;
  }

}
