/* -----------------------------------------------------------------
  shoplist
----------------------------------------------------------------- */
.page-shoplist {
  img {
    max-width: 100%;
    vertical-align: bottom;
  }
  h2 {
    margin-bottom: 20px;
    & + p {
      text-align: center;
      margin: 20px auto;
    }
  }
  p {
    font-size: 16px;
    line-height: 1.75;
  }
}

.area {
  & > g {
    & > path, & > circle {
      fill:#1a445d;
      transition: .2s;
    }
    &:hover {
      & > path, & > circle {
        fill: #F17B57;
      }
    }
  }
  &:hover {
    opacity: 1;
    & > path, & > circle {
      fill: #F17B57;
    }
  }
}

.page-title {
  width: 100%;
  height: 80px;
  background: #EEE3CE;
  border-top: 8px solid #DECAA6;
  border-bottom: 8px solid #DECAA6;
  font-size: 24px;
  color: #1A445D;
  font-weight: 500;
  text-align: center;
  display: grid;
  place-content: center;
  & > img {
    display: block;
    margin: 4px auto 0;
    height: 11px;
  }
}

.point-title {
  font-size: 20px;
  font-weight: 500;
  padding-left: 43px;
  position: relative;
  margin: 0 auto 20px;
  &::before {
    content: "";
    width: 35px;
    height: 30px;
    background: url(https://gigaplus.makeshop.jp/Orchidee/img/common/item-point.png) no-repeat center/cover;
    position: absolute;
    left: 0;
  }
}

.side-bar-title {
  font-weight: bold;
  color: #1A445D;
  padding: 0 0 0 10px;
  border-left: 3px solid #F17B57;
  margin: 0 auto 10px;
}

.map-content {
  width: 100%;
  background: linear-gradient(#fff 0%, #e3f1ff 100%);
  text-align: center;
  .map {
    padding: 15px 0 20px;
    & > svg {
      max-width: 100%;
      width: 450px;
      height: auto;
    }
  }
}

.area-item {
  padding-top: 97px;
  margin-top: -67px;
  & + .area-item {
    padding-top: 87px;
  }
}

.area-item-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  column-gap: 10px;
  row-gap: 10px;
  li {
    border: 2px solid #1A445D;
    border-radius: 6px;
    background: #FFF;
    padding: 20px;
    p {
      & + p {
        margin-top: 0.4rem;
      }
    }
  }
}


@media screen and (max-width: 768px) {
  .area-item-list {
    grid-template-columns: repeat(1, 1fr);
  }
}