@charset "utf-8";
.storelist-lead{
  text-align:center;
  font-weight:600;
  max-width:90%;
  margin: 0 auto 50px
}
.storelist-lead span{
    margin: 3px 0 0;
    font-size: 20px;
    color: #2c4e9b;
    border-bottom: 2px solid;
    display: inline-block;
}
.list_link {
      display: flex;
      gap: 3px;
      height: 90%;
      justify-content: flex-start;
  }
.info_store > ul {
    width: calc((100% - 50px) / 2);
}
  .list_link li {
  width: calc((100% - 9px) / 4);
  aspect-ratio: 1/1;
  border: 3px solid #333;
  margin: 0;
  box-sizing: border-box;
  }
.list_link li:nth-of-type(3){
    display:none
}
  .list_link a {
      position: relative;
      display: flex;
      flex-direction: column-reverse;
      justify-content: center;
      align-items: center;
      gap: 5px;
      height: 100%;
      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 {background: #333;color: #fff;}
  .list_link .mail {
      background: #333;
      color: #fff;
  }
  .list_link .mail:hover {
      background: #fff;
      color: #333;
  }
  .list_link a:after {
      display: block;
      background-image: url(/images/common/sprite_icon.png);
      background-size: 500px auto;
      content: " ";
  }
  .list_link .store:after {
      width: 30px;
      height: 30px;
      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;
      background-position: -350px 0;
  }
  .list_link .access:hover:after,
  .list_link .access.hover:after { background-position: -350px -50px; }
  .list_link .mail:after {
      width: 40px;
      height: 24px;
      background-position: -50px -150px;
  }
  .list_link .mail:hover:after,
  .list_link .mail.hover:after { background-position: -50px -100px; }
  .list_link .tel:after {
    width: 30px;
    height: 30px;
    background-position: -450px -201px;
}
li.tel.shoptel {
    margin: 9px 0 7px;
    background: #2c4e9b;
    color: #fff;
    border-radius: 100vh;
    position: relative;
    max-width:500px
}
li.tel.shoptel a{
  padding: 18px 20px;
  color:#fff;
  display:inline-block;
  text-align:center;
  height:100%;
  width: 100%;
  box-sizing: border-box;
}

li.tel.shoptel::before {
    position: absolute;
    top: 50%;
    left: 10%;
    width: 30px;
    height: 30px;
    background-size: 500px auto;
    background-position: -450px -201px;
    transform: translateY(-50%);
}
@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;
      margin: 0 auto;
      padding: 15px 15px;
      border-top: 1px solid #d9d9d9;
      min-height: 96px;
      display: flex;
      flex-wrap: wrap;
      gap: 20px 50px;
      max-width: 1200px;
  }
  .info_store:last-child { border-bottom: 1px solid #d9d9d9; }

  .info_store .name {
      margin: 0;
      font-size: 15px;
      font-weight: 500;
      width: 100%;
  }
  .info_store .data li {margin-top: 11px;}

  .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 .tel.white::after {
    background-position: -450px -150px;
}
}
.list_link .tel.white {
    background: #ffffff;
    color: #333;
}
@media screen and (max-width:767px){

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

   list.css
   Smartphone用

  +++++++++++++++++++++++++++++++ */
  /*
  共通
  -----------------------------------*/
  .box > p {
      margin: 20px 10px;
  }
  .heading01 { padding: 10px; }
.storelist-lead span{
    font-size:15px;
    border-bottom:none;
    text-decoration:underline
}
  /*
  店舗情報
  -----------------------------------*/
  .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;
  }
li.tel.shoptel {
    margin: 9px 0 7px;
    padding: 0;
}
li.tel.shoptel a{
  padding: 10px 20px;
  font-weight: 600;
}
  .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; }
.info_store > ul {
    width: 100%;
    justify-content: center;
}
  .list_link {
      margin-top:10px;
      position: relative;
      top: 0;
      right:0;
      transform: translateY(0);
      width: 100%;
      height: 90%;
  }
    .list_link a {
    font-size:12px
}
  .list_link a:after {
      display: block;
      background-image: url(/images/common/sprite_icon.png);
      background-size: 250px auto;
      content: " ";
  }
  .list_link .store:after {
      width: 15px;
      height: 15px;
      background-position: -125px -75px;
  }
  .list_link .access:after {
      width: 10px;
      height: 15px;
      background-position: -175px 0;
  }
    li.tel.shoptel::before{
       width: 15px;
       height: 15px;
       background-image: url(/images/common/sprite_icon.png);
       background-size: 250px auto;
       content: " ";
       background-position: -225px -100px;
    }
      .list_link .tel:after {
      width: 15px;
      height: 15px;
      background-position: -225px -100px;
  }
      .list_link .tel.white:after {
      width: 15px;
      height: 15px;
      background-position: -225px -75px;
  }
  .list_link .mail:after {
      width: 20px;
      height: 12px;
      background-position: -25px -75px;
  }

}