.p-sub-category {
  margin: 10px 10px;
  padding: 0;
  list-style-type: none;
}

.p-sub-category::after {
  display: block;
  clear: both;
  content: '';
}

.p-sub-category__item {
  float: left;
  box-sizing: border-box;
  width: 50%;
  padding: 10px 5px;
}

.p-sub-category__image {
  display: block;
  margin-bottom: 10px;
}

.p-sub-category__link {
  display: block;
  transition: opacity .2s;
  text-decoration: none;
  color: #333;
}

.p-sub-category__link:hover {
  opacity: .66;
}

.p-sub-category__link:active {
  opacity: 1;
}

.p-sub-category__name {
  line-height: 1.3;
  position: relative;
  display: block;
  padding-left: .8em;
}

.p-sub-category__name::before {
  position: absolute;
  top: 0;
  left: 0;
  content: '-';
}

@media screen and (min-width: 600px) {
  .p-sub-category {
    margin-right: 0;
    margin-left: 0;
  }

  .p-sub-category__item {
    width: 25%;
    padding: 15px 10px;
  }

  .p-sub-category__item:nth-child(4n + 1) {
    clear: both;
  }
}

@media screen and (max-width: 599px) {
  .p-sub-category__item:nth-child(2n + 1) {
    clear: both;
  }
}

ul.price-list {
    column-count: 4;
    column-gap: 60px;
    list-style: none;
    margin: 2% 2% 5%;
    padding: 0;
}
ul.price-list li {
    display: flex;
    font-weight: bold;
    padding: 12px;
    border-bottom: #d2d2d2 1px dotted;
    border-bottom-width: 1px;
    border-bottom-style: dotted;
    border-bottom-color: rgb(210, 210, 210);
    margin-bottom: 8px;
    width: 100%;
}
ul.price-list li a {
    display: flex;
    justify-content: center;
    align-items: center;
    text-decoration: none;
    color: #333;
}
ul.price-list li span {
    font-size: 14px;
    margin-right: 15px;
    font-weight: normal;
}

@media screen and (max-width:1300px) {
	ul.price-list {column-count:3;}
}
@media screen and (max-width:600px) {
	ul.price-list {column-count:2;}
}
        /* コンテナスタイル */
        .image-text-container {
            position: relative;
            display: inline-block; /* 画像のサイズに合わせてコンテナを調整するため */
            width: 100%;
            max-width: 1550px; /* この値はお好みに合わせて変更してください */
        }

        /* イメージスタイル */
        .image-text-container img {
            display: block;
            width: 100%;
        }

        /* タイトルとテキストの位置とスタイル */
        .image-text-container h2,
        .image-text-container p {
            position: absolute;
            margin: 0;
            left: 62%;
            color: #333;
            text-shadow: 3px 2px 4px rgba(0,0,0,0.48919392523364486);
            z-index: 1;
        }

        .image-text-container h2 {
            top: 10%;
        }

        .image-text-container p:first-of-type {
            top: 20%;
        }

        .image-text-container p:last-of-type {
            top: 33%;
            max-width: 33%;
          　
        }

        /* メディアクエリでレスポンシブ対応 */
        @media screen and (max-width: 599px) {
            .image-text-container h2,
            .image-text-container p {
                left: 62%;
                font-size: 0.78em;  /* テキストサイズの調整 */
            }

            .image-text-container p:last-of-type {
                max-width: 33%;
            }
        }
		   @media screen and (min-width: 600px) {
            .image-text-container h2,
            .image-text-container p {
                left: 62%;
              　line-height: 1.7;
                font-size: 0.9em; /* テキストサイズの調整 */
            }

            .image-text-container p:last-of-type {
                max-width: 33%;
            }
        }
			@media screen and (min-width: 960px)  {
            .image-text-container h2,
            .image-text-container p {
                left: 62%;
                font-size: 1.4em; /* テキストサイズの調整 */
                line-height: 1.7;           
            }

            .image-text-container p:last-of-type {
                max-width: 33%;
            }
        }

.sale-badge {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 10;  /* この行で.sale-badgeが他の要素より前面に来るように設定 */
  width: 30px;
  height: 30px;
}