/* CSS Document */
/* shoplist.css */
/*==============================================
ショップリスト
==============================================*/

#shoplist-area {
}
.table-filter {
  margin: 0;
  padding: 30px 0 10px 0;
  display: flex;
  justify-content: center;
  background: #f3f1f2;
}
.shoplist-select-wrapper {
  display: inline-block;
  border: 1px solid #cacaca;
  border-radius: 5px;
}
.shoplist-text-wrapper {
  display: inline-block;
  border: 1px solid #cacaca;
  background: #fff;
  border-radius: 5px;
}
.table-filter dt {
  margin: 0 20px 0 0;
  padding: 0;
  flex: 0 0 auto;
}
.table-filter dd {
  margin: 0 20px 0 0;
  padding: 0;
  flex: 0 0 auto;
}
.table-filter dd input,
.table-filter dd select {
  padding: 0;
  border: none;
  border-radius: 5px;
}
.table-filter dd select {
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: url("../image/share/shoplist-arrow.png") right center no-repeat
    #fff;
}
.table-filter dd:last-child {
  margin-right: 0;
}

#shoplist-table {
  display: block;
  /*background: #e7e7e7;*/
  color: #171717;
}
#shoplist-table tbody {
  display: block;
}
#shoplist-table tr {
  padding: 15px;
  border: 1px solid rgba(196, 196, 196, 1);
  background: #fff;
  display: flex;
  flex-wrap: wrap;
}
#shoplist-table td {
  margin: 0;
  padding: 0;
  background: #fff;
}
#shoplist-table .shop-name {
  flex: 1 1 64%;
  font-size: 123.07%;
  font-size: 1.6rem;
  line-height: 1.5;
  font-weight: bold;
  display: block;
}
#shoplist-table .shop-directly,
#shoplist-table .shop-mens,
#shoplist-table .shop-ladies {
  flex: 0 0 auto;
  display: block;
}
#shoplist-table .shop-zip,
#shoplist-table .shop-preff {
  flex: 0 0 auto;
  font-size: 107.7%;
  font-size: 1.4rem;
  line-height: 1.65;
  display: block;
}
#shoplist-table .shop-address {
  flex: 1 1 70%;
  font-size: 107.7%;
  font-size: 1.4rem;
  line-height: 1.65;
  display: block;
}
#shoplist-table td span {
  display: none;
}

/*20200407追記*/
#shoplist-table .shop-sub-close {
  flex: 0 0 auto;
  padding: 5px 10px;
}
#shoplist-table .shop-sub-info {
  flex: 0 0 auto;
  padding: 5px 10px 5px 0;
}
#shoplist-table .shop-sub-info span,
#shoplist-table .shop-sub-close span,
#shoplist-table .shop-sub-afte span {
  display: inline-block;
  font-weight: bold;
}
#shoplist-table .sub-title {
  padding: 0 20px 0 0;
  color: red;
}
#shoplist-table .shop-sub-afte {
  flex: 0 0 auto;
  padding: 5px 10px;
  color: #d70000;
}
#shoplist-table .shop-sub-afte span {
  color: #000;
}
#shoplist-table .close {
  background-color: red;
  padding: 1px 12px;
  color: #ffff;
  border-radius: 4px;
}

#shoplist-area iframe {
	width: 100%;
	height: 600px;
  }
  

@media screen and (max-width: 768px) {
  .table-filter {
    padding: 20px 20px 5px 20px;
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  .table-filter dt {
    flex: 0 0 100%;
  }
  .shoplist-select-wrapper {
    padding: 0;
    margin-left: 0;
  }
  dt + .concessionary-pref-area .shoplist-select-wrapper,
  .shoplist-text-wrapper {
    margin-left: 28px;
  }
  #shoplist-table .shop-name {
    flex: 1 1 100%;
  }
  #shoplist-table .shop-directly,
  #shoplist-table .shop-mens,
  #shoplist-table .shop-ladies {
    flex: 0 0 33%;
  }
  #shoplist-table .shop-address {
    flex: 1 1 auto;
  }
  #shoplist-table .shop-sub-info .sub-title {
    display: block;
    padding: 15px 0 0 0;
  }
  #shoplist-table .shop-sub-info {
    flex: 0 0 100%;
    display: block;
  }
  #shoplist-table .shop-sub-afte {
    flex: 0 0 100%;
    padding-left: 0;
  }
}