@charset "utf-8";


@media all and (max-width: 980px) {
    .box > p {
        margin: 20px;
    }
}
@media screen and (min-width:768px){
  
  
    /* +++++++++++++++++++++++++++++++

   list.css
   PC、Tablet用

  +++++++++++++++++++++++++++++++ */
  /*
  共通
  -----------------------------------*/
  .box > p {
      width: auto;
      max-width: 980px;
      margin: 20px auto;
      font-size: 16px;
      line-height: 1.8;
  }

  /*
  店舗情報
  -----------------------------------*/
  .info_store {
      position: relative;
      width: auto;
      max-width: 605px;
      margin: 0 auto;
      padding: 15px  360px 15px 15px;
      border-top: 1px solid #d9d9d9;
      min-height: 96px;
  }
  .info_store:last-child { border-bottom: 1px solid #d9d9d9; }

  .info_store .name {
      margin: 0 0 10px;
      font-size: 15px;
      font-weight: 500;
  }
  .info_store .data li { margin-top: 5px; }

  .data .address:before,
  .data .tel:before,
  .data .time:before {
      display: inline-block;
      width: 14px;
      height: 14px;
      margin-right: 3px;
      background-image: url(/images/common/sprite_icon.png);
      background-size: 500px auto;
      vertical-align: -2px;
      content: " ";
  }
  .data .address:before { background-position: -250px -100px; }
  .data .tel:before { background-position: -300px -100px; }
  .data .time:before { background-position: -350px -100px; }

  .list_link {
      position: absolute;
      top: 50%;;
      right: 15px;
      margin-top: -48px;
  }
  .list_link li {
      float: left;
      margin-left: 5px;
  }
  .list_link a {
      position: relative;
      display: block;
      width: 90px;
      height: 30px;
      padding: 60px 5px 0;
      border: 3px solid #333;
      text-align: center;
      transition: 0.1s linear;
  }
  .list_link a:hover,
  .list_link a.hover {
      background: #333;
      color: #fff;
      text-decoration: none;
  }
  .list_link .tel { display: none; }
  .list_link .mail {
      height: 40px;
      padding-top: 50px;
      background: #333;
      color: #fff;
  }
  .list_link .mail:hover {
      background: #fff;
      color: #333;
  }
  .list_link a:after {
      position: absolute;
      top: 10px;
      left: 50%;
      display: block;
      background-image: url(/images/common/sprite_icon.png);
      background-size: 500px auto;
      content: " ";
  }
  .list_link .store:after {
      width: 30px;
      height: 30px;
      margin-left: -15px;
      background-position: -250px -150px;
  }
  .list_link .store:hover:after,
  .list_link .store.hover:after { background-position: -250px -200px; }
  .list_link .access:after {
      width: 21px;
      height: 30px;
      margin-left: -10px;
      background-position: -350px 0;
  }
  .list_link .access:hover:after,
  .list_link .access.hover:after { background-position: -350px -50px; }
  .list_link .mail:after {
      top: 13px;
      width: 40px;
      height: 24px;
      margin-left: -20px;
      background-position: -50px -150px;
  }
  .list_link .mail:hover:after,
  .list_link .mail.hover:after { background-position: -50px -100px; }
}


@media screen and (max-width:767px){

  /* +++++++++++++++++++++++++++++++

   list.css
   Smartphone用

  +++++++++++++++++++++++++++++++ */
  /*
  共通
  -----------------------------------*/
  .box > p {
      margin: 20px 10px;
  }
  .heading01 { padding: 10px; }

  /*
  店舗情報
  -----------------------------------*/
  .info_store {
      width: auto;
      margin: 0 auto;
      padding: 15px  10px;
      border-top: 1px solid #d9d9d9;
  }
  .info_store:last-child { border-bottom: 1px solid #d9d9d9; }

  .info_store .name {
      margin: 0 0 10px;
      font-size: 15px;
      font-weight: 500;
  }
  .info_store .data li {
      position: relative;
      margin-top: 5px;
      padding-left: 25px;
      font-size: 13px;
  }

  .data .address:before,
  .data .tel:before,
  .data .time:before {
      position: absolute;
      top: 0;
      left: 0;
      display: block;
      width: 20px;
      height: 20px;
      background-image: url(/images/sp_common/sprite_icon.png);
      background-size: 500px auto;
      vertical-align: -2px;
      content: " ";
  }
  .data .address:before { background-position: -250px -100px; }
  .data .tel:before { background-position: -300px -100px; }
  .data .time:before { background-position: -350px -100px; }

  .list_link { margin: 0 -5px; }
  .list_link li {
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      float: left;
      display: table;
      width: 25%;
      margin-top: 10px;
      padding-left: 3px;
  }
  .list_link li:first-child { padding-left: 0; }
  .list_link a {
      position: relative;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      display: table-cell;
      width: 100%;
      height: 74px;
      padding-top: 30px;
      border: 2px solid #333;
      font-size: 12px;
      text-align: center;
      vertical-align: middle;
  }

  .list_link .tel,
  .list_link .mail {
      background: #333;
      color: #fff;
  }

  .list_link a:after {
      position: absolute;
      top: 8px;
      left: 50%;
      display: block;
      background-image: url(/images/common/sprite_icon.png);
      background-size: 250px auto;
      content: " ";
  }
  .list_link .store:after {
      width: 15px;
      height: 15px;
      margin-left: -7px;
      background-position: -125px -75px;
  }
  .list_link .access:after {
      width: 10px;
      height: 15px;
      margin-left: -5px;
      background-position: -175px 0;
  }
  .list_link .tel:after {
      width: 15px;
      height: 15px;
      margin-left: -7px;
      background-position: -225px -100px;
  }
  .list_link .mail:after {
      top: 13px;
      width: 20px;
      height: 12px;
      margin-left: -10px;
      background-position: -25px -75px;
  }

}