@charset "utf-8";

/* -------------------------------------
SHOP GUIDE
----------------------------------------*/
#shopGuide {
  position: relative;
  min-height: 1228px;
  padding-bottom: 90px;
}
#south {
  float: left;
}
#north {
  float: right;
}
.florMap,
.shopList {
  width: 300px;
  text-align: center;
}
.florMap {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  margin: auto;
}
.shopList .name {
  position: relative;
  text-align: center;
  padding: 11px 0;
  border: 1px solid #000;
  margin-bottom: 1px;
}
.shopList .name p {
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.13em;
}
.shopList li>a {
  display: table;
  width: 100%;
  margin-bottom: 1px;
}
.shopList li>a>div {
  display: table-cell;
  vertical-align: middle;
}
.shopList li .no {
  width: 13.5%;
  background-color: #6ea51e;
  text-align: center;
}
.shopList li .no p {
  font-family: 'Ropa Sans', sans-serif;
  color: #fff;
  font-size: 20px;
  font-weight: 600;
  letter-spacing: 0.05em;
}
.shopList li.type02 .no {
  background-color: #e85464;
}
.shopList li>a>div+div {
  width: 86%;
  text-align: left;
  padding: 13px 13px 14px;
}
.shopList li:nth-child(odd)>a>div+div {
  background-color: #eee;
}
.shopList li dt {
  font-size: 14px;
  color: #666;
  padding-bottom: 6px;
}
.shopList li dd {
  color: #221815;
  font-weight: 600;
  letter-spacing: 0.1em;
}
@media screen and (min-width: 768px) {
  .shopList ul {
    display: block!important;
  }
}
@media screen and (max-width: 767px) {
  #shopGuide {
    min-height: inherit;
  }
  #south,
  #north {
    float: none;
  }
  .florMap,
  .shopList {
    width: 100%;
  }
  .florMap {
    position: relative;
    padding-bottom: 40px;
  }
  .florMap img {
    max-width: inherit;
    width: 100%;
  }
  .shopList ul {
    display: none;
  }
  .shopList .name {
    cursor: pointer;
    padding: 15px 0;
  }
  .shopList .name p {
    font-size: 18px;
  }
  .shopList .name:before {
    position: absolute;
    right: 22px;
    top: 0;
    bottom: 0;
    content: "";
    display: block;
    width: 8px;
    height: 8px;
    margin: auto;
    border: 2px solid;
    border-color: #000 #000 transparent transparent;
    transform: rotate(135deg);
    z-index: 1;
  }
  .shopList.open .name:before {
    transform: rotate(-45deg);
    top: 50%;
    bottom: auto;
  }
  #north {
    padding-bottom: 20px;
  }
}

/* -------------------------------------
SHOP DETAIL
----------------------------------------*/
#shopImage {
  background-color: #faf5ea;
  text-align: center;
  padding: 48px 0;
}
.shopName {
  padding: 25px 30px 25px 0;
  margin-bottom: 20px;
  border-bottom: 1px solid #ccc;
}
.shopName>div {
  float: left;
  padding-top: 20px;
}
.shopName>div+div {
  width: 105px;
  float: right;
  padding-top: 0;
}
.shopName .no,
.shopName dl {
  display: inline-block;
  vertical-align: middle;
}
.shopName .no {
  width:25px;
	height:25px;
  text-align: center;
  background-color: #e85464;
  font-family: 'Ropa Sans', sans-serif;
  color: #fff;
  font-size: 22px;
  letter-spacing: 0.1em;
  padding: 19px 17px;
  margin-right: 13px;
}
.shopName dt {
  font-size: 24px;
  font-weight: 600;
  padding-bottom: 12px;
}
.shopName+p {
  letter-spacing: 0.05em;
  line-height: 1.4;
  padding-bottom: 65px;
}
#shopDetail {
  padding-bottom: 65px;
}
#shopDetail li {
  padding: 18px 25px;
}
#shopDetail li dt,
#shopDetail li dd {
  display: inline-block;
  vertical-align: middle;
  letter-spacing: 0.1em;
  line-height: 1.4;
}
#shopDetail li dt {
  font-weight: 600;
  width: 11%;
}
#shopDetail li dd {
  width: 87%;
}
#shopDetail li dd span.rd {
  color: #e85464;
}
#shopDetail li dd.url a {
  color: #ff6600;
}
#shopDetail li:nth-child(odd) {
  background-color: #eee;
}
.shopImageList {
  padding-bottom: 150px;
}
.shopImageList li {
  width: 320px;
  float: left;
  text-align: center;
}
.shopImageList li+li {
  margin-left: 20px;
}
@media screen and (max-width: 767px) {
  #shopImage {
    background-color: #faf5ea;
    text-align: center;
    padding: 0;
  }
  #shopImage .inner {
    width: 100%;
    padding: 0;
  }
  .shopName {
    padding: 15px 0;
    margin-bottom: 10px;
    border-bottom: 1px solid #ccc;
  }
  .shopName>div {
    width: 85%;
    float: left;
    padding-top: 8px;
  }
  .shopName>div+div {
    width: 15%;
    float: right;
    padding-top: 0;
  }
  .shopName .no,
  .shopName dl {
    display: inline-block;
    vertical-align: middle;
  }
  .shopName .no {
    font-size: 20px;
    padding: 8px;
    margin-right: 10px;
  }
  .shopName dt {
    font-size: 18px;
    padding-bottom: 5px;
  }
  .shopName+p {
    line-height: 1.4;
    padding-bottom: 20px;
  }
  #shopDetail {
    padding-bottom: 10px;
  }
  #shopDetail li {
    padding: 15px 4%;
  }
  #shopDetail li dt {
    font-weight: 600;
    width: 22%;
  }
  #shopDetail li dd {
    width: 76%;
    line-height: 1.4;
  }
  #shopDetail li:nth-child(odd) {
    background-color: #eee;
  }
  .shopImageList {
    padding-bottom: 60px;
  }
  .shopImageList li {
    width: 100%;
    float: none;
  }
  .shopImageList li+li {
    margin: 10px 0 0;
  }
  .shopImageList li img {
    max-width: inherit;
    width: 100%;
  }
}
@media screen and (max-width: 350px) {
  .shopName>div+div {
    width: 15%;
    float: right;
    padding-top: 5px;
  }
}