@charset "UTF-8";
/* ===============================================
  * サイトマップ　のスタイル *
=============================================== */
a {
  color: inherit;
  text-decoration: none;
}

@media screen and (min-width: 768px) {
  .global-contents__inner {
    width: 100%;
  }
}

.c-breadcrumb {
  margin-bottom: 0;
  margin: auto;
}
@media screen and (min-width: 768px) {
  .c-breadcrumb {
    width: min(90%, 114rem);
    margin: 0 auto;
  }
}
#shop {
  display: grid;
  grid-gap: 6rem;
}
@media screen and (min-width: 768px) {
  #shop {
    grid-gap: 8rem;
  }
}
#shop .p-shop-content {
  padding: 0 1rem;
  display: grid;
  grid-gap: 3rem;
  margin-top: 5rem;
}
@media screen and (min-width: 768px) {
  #shop .p-shop-content {
    width: min(90%, 80rem);
    margin: 5rem auto 0;
  }
}
#shop .p-shop-content__item {
  font-size: 1.5rem;
  line-height: 1.75;
}
@media screen and (min-width: 768px) {
  #shop .p-shop-content__item {
    grid-gap: 8rem;
  }
}


#shop .img__container {
            display: flex;
            justify-content: center;
            gap: 10px; /* 画像間の間隔 */
}
@media screen and (min-width: 768px) {
  #shop .img__container {
    grid-gap: 8rem;
  }
}

#shop .img__container img{
           max-width: 100%; /* 画面幅に応じて縮小 */
            height: auto; /* 縦横比を維持 */
            width: 80%; /* 初期の横幅 */
}

@media screen and (min-width: 768px) {
  #shop .img__container img {
    grid-gap: 8rem;
  }
}

#shop .flex {
  display: flex; /*横並び*/
}

@media screen and (min-width: 768px) {
  #shop .flex {
    grid-gap: 8rem;
	display: flex;
  }
}

#shop .flex .image {
  width: 60%; /*画像サイズ指定*/
  margin: 0;
  padding: 0;
  overflow: hidden;
  position: relative;
}

@media screen and (min-width: 768px) {
  #shop .flex .image {
    grid-gap: 8rem;
  }
}
#shop .flex .text {
  margin: 0 0 0 20px;
  padding: 0;
}

@media screen and (min-width: 768px) {
  #shop .flex .text {
    grid-gap: 8rem;
  }
}

/*# sourceMappingURL=static_shop.css.map */