
/* TABLE OF CONTENTS:
 * 
 * 01 どのサイズでも共通で適用されるスタイル
 *    - 会社情報
 *    - マップ調整
 * 02 幅 480px 以上
 * 03 幅 768px 以上
 *    - 会社情報
 * 04 幅 880px 以上
 * 05 幅 1072px 以上
 * 06 幅 1264px 以上
 */

/* --------------------------------------------------------------------------------------------------------
   01
 *
 * どのサイズでも共通で適用されるスタイル
 */

  /* 会社情報 */
  .layout-wrapper .image {
    text-align: center;
    margin: 0;
  }
  .layout-wrapper .image p {
    text-align: left;
    margin: 10px 0 0;
  }
  table,
  table th,
  table td {
    border: none;
  }
  table th {
    background: #e7ded4;
    color: #7c6348;
  }

  a[href*="#map"] {
    background: #663333;
    color: #FFF;
    border: 3px #ae9b92 solid;
    border-radius: 8px;
    font-size: 0.8em;
    display: inline-block;
    padding: 0 0.8em;
  }
  a[href*="#map"]:hover {
    background: #8a4949;
    color: #FFF !important;
    border: 3px #ae9b92 solid;
  }


  @media screen and (max-width: 48em) {
      table,
      table tbody,
      table tr,
      table th,
      table td {
        display: block;
      }
      table tr + tr {
        margin-top: 1em;
      }
      .layout-wrapper .image {
        border-top: 1px #7c6348 dashed;
        padding-top: 1em;
      }
  }/* End max 48em ( 768px ) */



  /* マップ調整 */
  .gmap {
    height: 0;
    overflow: hidden;
    padding-bottom: 56.25%;
    position: relative;
  }
  .gmap iframe {
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    width: 100%;
  }



/* --------------------------------------------------------------------------------------------------------
   02
 *
 * 幅 480px 以上
 */
@media screen and (min-width: 30em) {

    /* ここにスタイル */

}/* End 620px Mobile Large */



/* --------------------------------------------------------------------------------------------------------
   03
 *
 * 幅 768px 以上
 */
@media screen and (min-width: 48em) {

    /* 会社情報 */
      table {
        border-spacing: 2px;
        table-layout: auto;
      }
      table th {
        padding-left: 1em;
      }
      table td {
        background: #dcd8d5;
        padding-left: 1em;
      }

      .layout-wrapper {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
            -ms-flex-pack: justify;
                justify-content: space-between;
        width: 100%;
      }
      .layout-wrapper .image {
        margin-left: 2em;
        max-width: 400px;
      }
      .layout-wrapper .cont {
        -webkit-box-flex: 1;
            -ms-flex: 1;
                flex: 1;
        width: auto;
      }


}/* End 768px Tablet Small */



/* --------------------------------------------------------------------------------------------------------
   04
 *
 * 幅 880px 以上
 */
@media screen and (min-width: 55em) {

    /* ここにスタイル */

}/* End 880px Tablet Large */



/* --------------------------------------------------------------------------------------------------------
   05
 *
 * 幅 1072px 以上
 */
@media screen and (min-width: 67em) {

    /* ここにスタイル */

}/* End 955px Desktop Small */



/* --------------------------------------------------------------------------------------------------------
   06
 *
 * 幅 1264px 以上
 */
@media screen and (min-width: 79em) {

    /* ここにスタイル */

}/* End 1100px Desktop Medium */