/******************************/
/* スライドショー */
/******************************/
.c-indexHeroCarousel {
  max-height: 750px;
  overflow: hidden;
  width: 100%;
}

.swiper-container {
  overflow: hidden;
  width: 100%;
}

.c-indexHeroCarouselItem {
  display: block;
  width: 100%;
}

.c-indexHeroCarouselItem__thumb {
  display: block;
  width: 100%;
}

.c-indexHeroCarouselItem__thumb img {
  width: 100%;
  height: 750px;
  object-fit: cover;
  object-position: center; /* centerに統一 */
  display: block;
}

@media (max-width: 896px) {
  .c-indexHeroCarousel {
    max-height: 480px;
  }

  .c-indexHeroCarouselItem__thumb img {
    height: 480px;
  }
}


/******************************/
/* NEWS */
/******************************/
.p-line-informaiton {
padding-top: 20px;
padding-bottom: 20px;
background: #f3f3f3;
}
@media screen and (max-width: 767px) {
.p-line-informaiton {
padding-left: 20px;
padding-right: 20px;
}
}
.p-line-informaiton__wrap {
margin-left: auto;
margin-right: auto;
max-width: 750px;
}
@media only screen and (max-width: 1023px) {
.p-line-informaiton__wrap {
margin-left: 25px;
margin-right: 25px;
max-width: inherit;
}
}
@media only screen and (max-width: 767px) {
.p-line-informaiton__wrap {
margin-left: 0;
margin-right: 0;
}
}
.p-line-informaiton-list {
overflow-y: auto;
max-height: 160px;
}
.p-line-informaiton-list__item {
display: flex;
margin-bottom: 15px;
font-size: 14px;
}
@media screen and (max-width: 767px) {
.p-line-informaiton-list__item {
display: block;
}
}
.p-line-informaiton-list__item:last-child {
margin-bottom: 0;
}
.p-line-informaiton-list__date {
width: 120px;
font-family: "Noto Sans JP", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "Lucida Grande", sans-serif;
}
.p-line-informaiton-list__ttl {
flex: 1;
}

@media screen and (max-width: 767px) {
  .p-line-informaiton-list {
    overflow-y: auto;
    max-height: 160px;
  }
}
/******************************/
/* CONCEPT */
/******************************/
.p-concept {
overflow: hidden;
display: flex;
flex-wrap: wrap;
align-items: center;
margin-top: 120px;
margin-bottom: 120px;
background: #a0a0a1;
}
@media screen and (max-width: 1023px) {
.p-concept {
margin-top: 60px;
margin-bottom: 75px;
margin-left: 25px;
margin-right: 25px;
}
}
@media screen and (max-width: 767px) {
.p-concept {
display: block;
margin-bottom: 60px;
margin-left: 0;
margin-right: 0;
}
}
.p-concept__img {
box-sizing: border-box;
display: flex;
justify-content: center;
align-items: center;
width: 50%;
min-height: 550px;
background-image: url(https://img21.shop-pro.jp/PA01521/955/etc_base64/cGhvdG9fZWM.jpg?cmsp_timestamp=20260513133945);
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}
@media screen and (max-width: 767px) {
.p-concept__img {
display: block;
width: auto;
min-height: 200px;
height: 0;
padding-bottom: 54.29%;
}
}
.p-concept__txt {
box-sizing: border-box;
display: flex;
flex-direction: column;
justify-content: center;
align-items: center;
padding: 30px 200px;
width: 50%;
color: #ffffff;
}
@media only screen and (max-width: 1023px) {
.p-concept__txt {
padding: 30px 30px;
}
}
@media screen and (max-width: 767px) {
.p-concept__txt {
padding: 40px 20px;
width: auto;
}
}
.p-concept__ttl {
margin-top: 0;
margin-bottom: 25px;
font-size: 28px;
font-weight: normal;
}
@media screen and (max-width: 767px) {
.p-concept__ttl {
margin-bottom: 15px;
font-size: 22px;
}
}
.p-concept__body {
line-height: 2;
font-size: 12px;
text-align: left;
width: 100%;
}
@media screen and (max-width: 767px) {
.p-concept__body {
font-size: 11px;
}
}
/******************************/
/* RECOMMEND ITEMS */
/******************************/
.p-recommend {
overflow: hidden;
padding-bottom: 45px;
}
@media screen and (max-width: 1023px) {
.p-recommend {
padding-bottom: 45px;
}
}
@media screen and (max-width: 767px) {
.p-recommend {
padding-bottom: 30px;
}
}
@media screen and (max-width: 767px) {
.p-recommend-list {
margin-left: 0;
margin-right: 0;
}
}
.p-recommend-item-list {
display: flex;
flex-wrap: wrap;
margin-left: -27px;
margin-right: -27px;
}
@media screen and (max-width: 1023px) {
.p-recommend-item-list {
margin-left: -17px;
margin-right: -17px;
}
}
@media screen and (max-width: 767px) {
.p-recommend-item-list {
margin-left: -8px;
margin-right: -8px;
}
}
.p-recommend-item-list__item {
position: relative;
box-sizing: border-box;
margin-bottom: 50px;
padding-left: 27px;
padding-right: 27px;
width: 25%;
word-break: break-all;
}
@media screen and (max-width: 1023px) {
.p-recommend-item-list__item {
margin-bottom: 30px;
padding-left: 17px;
padding-right: 17px;
width: 33.3333%;
}
}
@media screen and (max-width: 767px) {
.p-recommend-item-list__item {
margin-bottom: 25px;
padding-left: 8px;
padding-right: 8px;
width: 50%;
}
}
.p-recommend-item-list__item.is-hidden {
display: none;
}
/******************************/
/* TOP GALLERY */
/******************************/
.p-gallery {
padding-top: 60px;
padding-bottom: 45px;
background: #f6f6f6;
}
@media screen and (max-width: 767px) {
.p-gallery {
padding-top: 50px;
}
}
.p-gallery__wrap {
display: flex;
flex-wrap: wrap;
align-items: center;
}
@media screen and (max-width: 767px) {
.p-gallery__wrap {
display: block;
}
}
.p-gallery__img {
width: 50%;
}
@media screen and (max-width: 767px) {
.p-gallery__img {
width: auto;
}
}
.p-gallery__img img {
width: 100%;
}
.p-gallery__img .slick-dots {
bottom: -40px;
}
.p-gallery__img .slick-dots li {
height: auto;
padding: 5px 0;
display: inline-flex;
align-items: center;
justify-content: center;
}
.p-gallery__img .slick-dots li button {
display: inline-block;
width: 10px;
height: 10px;
border-radius: 50%;
background: #2d2d2d;
}
.p-gallery__img .slick-dots li.slick-active button:before {
top: 1px;
left: 1px;
width: 16px;
height: 16px;
border: 1px solid #2d2d2d;
border-radius: 50%;
}
.p-gallery__img .p-gallery-slider__item {
background-repeat: no-repeat;
background-size: cover;
background-position: center;
min-height: 400px;
margin: 0;
}
@media screen and (max-width: 767px) {
.p-gallery__img .p-gallery-slider__item {
min-height: 250px;
height: 0;
}
}
.p-gallery__img .p-gallery-slider__item01 {
background-image: url(https://img21.shop-pro.jp/PA01521/955/etc_base64/dW5pZm9ybWVjMDI.jpg?cmsp_timestamp=20260422103510);
}
.p-gallery__img .p-gallery-slider__item02 {
background-image: url(https://img.shop-pro.jp/tmpl_img/87/bg.gif);
}
.p-gallery__img .p-gallery-slider__item03 {
background-image: url(https://img.shop-pro.jp/tmpl_img/87/bg.gif);
}
.p-gallery__txt {
box-sizing: border-box;
padding: 30px 0px 30px 90px;
width: 50%;
}
@media only screen and (max-width: 1023px) {
.p-gallery__txt {
padding: 30px 0px 30px 30px;
}
}
@media screen and (max-width: 767px) {
.p-gallery__txt {
padding: 35px 0px 0px 0px;
width: auto;
}
}
.p-gallery__ttl {
margin-top: 0;
margin-bottom: 25px;
font-size: 28px;
font-weight: normal;
}
@media screen and (max-width: 767px) {
.p-gallery__ttl {
margin-bottom: 20px;
font-size: 22px;
}
}
.p-gallery__body {
line-height: 2;
font-size: 14px;
}
/******************************/
/* TOP RANKING */
/******************************/
.p-ranking {
overflow: hidden;
padding-top: 130px;
padding-bottom: 130px;
}
@media screen and (max-width: 1023px) {
.p-ranking {
padding-top: 90px;
}
}
@media screen and (max-width: 767px) {
.p-ranking {
padding-top: 75px;
padding-bottom: 0;
}
}
.p-ranking-list {
box-sizing: border-box;
padding-left: 6%;
padding-right: 6%;
}
@media screen and (max-width: 1050px) {
.p-ranking-list {
margin-left: 20px;
margin-right: 20px;
}
}
@media screen and (max-width: 1023px) {
.p-ranking-list {
margin-left: 0;
margin-right: 0;
}
}
@media screen and (max-width: 767px) {
.p-ranking-list {
padding-left: 12%;
padding-right: 12%;
}
}
.p-ranking-list .slick-list {
overflow: visible;
}
.p-ranking-list .slick-prev {
left: -5px;
margin-top: -43px;
}
@media screen and (max-width: 1023px) {
.p-ranking-list .slick-prev {
left: 0;
}
}
@media screen and (max-width: 767px) {
.p-ranking-list .slick-prev {
margin-top: -30px;
}
}
.p-ranking-list .slick-next {
right: -5px;
margin-top: -43px;
}
@media screen and (max-width: 1023px) {
.p-ranking-list .slick-next {
right: 0;
}
}
@media screen and (max-width: 767px) {
.p-ranking-list .slick-next {
margin-top: -30px;
}
}
.p-ranking-list .slick-dotted.slick-slider {
margin-bottom: 60px;
}
.p-ranking-list .slick-dots {
bottom: -45px;
}
.p-ranking-list .slick-dots li {
margin: 0 2px;
}
.p-ranking-list__item {
position: relative;
box-sizing: border-box;
margin-right: 10px;
margin-left: 10px;
word-break: break-all;
}
@media screen and (max-width: 1023px) {
.p-ranking-list__item {
margin-right: 20px;
margin-left: 20px;
}
}
@media screen and (max-width: 767px) {
.p-ranking-list__item {
margin-right: 8px;
margin-left: 8px;
}
}
.p-ranking-list__item.slick-active .p-ranking-list__num {
opacity: 1;
animation: rankingfadein 0.2s 0s;
}
.p-ranking-list__img {
margin-bottom: 20px;
background: #ffffff;
}
@media screen and (max-width: 767px) {
.p-ranking-list__img {
margin-bottom: 10px;
text-align: center;
}
}
.p-ranking-list__num {
box-sizing: border-box;
position: absolute;
top: 0px;
right: 0px;
padding-top: 3px;
min-width: 30px;
line-height: 27px;
font-size: 16px;
font-weight: bold;
background: #ffffff;
color: #2d2d2d;
text-align: center;
opacity: 0;
transition: all ease 0.1s;
}
.p-ranking-list__num.is-1 {
background: #c5b597;
color: #ffffff;
}
.p-ranking-list__num.is-2 {
background: #b1b9bb;
color: #ffffff;
}
.p-ranking-list__num.is-3 {
background: #714d3b;
color: #ffffff;
}
@keyframes rankingfadein {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}
.p-ranking-list__txt {
text-align: center;
}
.p-ranking-list__ttl {
font-size: 14px;
}
.p-ranking-list__ttl img {
vertical-align: middle;
}
.p-ranking-list__price {
margin-top: 15px;
font-size: 14px;
}
@media screen and (max-width: 767px) {
.p-ranking-list__price {
margin-top: 5px;
font-size: 13px;
}
}
.p-ranking-list__price.is-default {
margin-top: 0;
}
.p-ranking-list__btn {
position: absolute;
bottom: 0;
right: 0;
}
/******************************/
/* TOP 店舗紹介 */
/******************************/
.p-shop {
overflow: hidden;
display: flex;
flex-wrap: wrap;
margin-top: 120px;
margin-bottom: 120px;
background: #b3a37e;
}
@media screen and (max-width: 1023px) {
.p-shop {
margin-top: 60px;
margin-bottom: 75px;
margin-left: 25px;
margin-right: 25px;
}
}
@media screen and (max-width: 767px) {
.p-shop {
display: block;
margin-bottom: 60px;
margin-left: 0;
margin-right: 0;
}
}
.p-shop__img {
box-sizing: border-box;
display: flex;
justify-content: center;
align-items: center;
width: 50%;
min-height: 380px;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}
@media screen and (max-width: 767px) {
.p-shop__img {
display: block;
width: auto;
min-height: 200px;
height: 0;
padding-bottom: 54.29%;
}
}
.p-shop__txt {
box-sizing: border-box;
display: flex;
flex-direction: column;
justify-content: center;
padding: 30px 90px;
width: 50%;
color: #ffffff;
}
@media only screen and (max-width: 1023px) {
.p-shop__txt {
padding: 30px 30px;
}
}
@media screen and (max-width: 767px) {
.p-shop__txt {
padding: 40px 20px;
width: auto;
}
}
.p-shop__ttl {
margin-top: 0;
margin-bottom: 25px;
font-size: 28px;
font-weight: normal;
}
@media screen and (max-width: 767px) {
.p-shop__ttl {
margin-bottom: 15px;
font-size: 22px;
}
}
.p-shop__ttl-s {
margin-top: 0;
margin-bottom: 25px;
font-size: 16px;
font-weight: normal;
}
@media screen and (max-width: 767px) {
.p-shop__ttl-s {
margin-bottom: 15px;
font-size: 15px;
}
}
.p-shop__body {
line-height: 2;
font-size: 14px;
}
@media screen and (max-width: 767px) {
.p-shop__body {
font-size: 13px;
}
}
.p-shop__url {
margin-top: 15px;
}
.p-shop__url a {
color: #ffffff;
}

/******************************/
/* CATEGORY */
/******************************/

.category-section {
background: #f5f5f5;
padding: 50px 20px 60px;
}

.category-inner {
max-width: 1100px;
margin: 0 auto;
}

.category-title {
margin: 0;
text-align: center;
font-size: 40px;
font-weight: 500;
letter-spacing: 0.12em;
color: #4a4a4a;
line-height: 1.2;
}

.category-subtitle {
margin: 8px 0 35px;
text-align: center;
font-size: 14px;
color: #666;
line-height: 1.4;
}

.category-grid {
display: grid;
grid-template-columns: repeat(3, 1fr); /* PC：3列 */
gap: 20px;
}

/* ★ カード（PC含めて縦＋中央） */
.category-card {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
min-height: 160px;
padding: 20px 18px;
background: #f8f8f8;
border: 1px solid #d8d8d8;
border-radius: 12px;
text-decoration: none;
color: #333;
box-sizing: border-box;
transition: all 0.25s ease;
text-align: center;
}

.category-card:hover {
background: #ffffff;
border-color: #bdbdbd;
transform: translateY(-2px);
}

/* テキスト */
.category-text {
display: flex;
flex-direction: column;
align-items: center;
gap: 6px;
line-height: 1.4;
letter-spacing: 0.04em;
}

.category-text span:first-child {
font-size: 18px;
font-weight: 600;
}

.category-text span:last-child {
font-size: 12px;
color: #777;
font-weight: 400;
}

/* 画像 */
.category-image {
margin-top: 12px;
width: 100%;
text-align: center;
}

.category-image img {
max-width: 100%;
max-height: 110px; /* PCは少し大きめ */
object-fit: contain;
display: block;
margin: 0 auto;
}

/* タブレット */
@media screen and (max-width: 1024px) {
.category-grid {
grid-template-columns: repeat(2, 1fr);
}

.category-title {
font-size: 34px;
}
}

/* スマホ */
@media screen and (max-width: 767px) {
.category-section {
padding: 40px 15px 50px;
}

.category-grid {
grid-template-columns: repeat(2, 1fr); /* 2列 */
gap: 12px;
}

.category-card {
min-height: 140px;
padding: 14px;
}

.category-text {
gap: 4px;
line-height: 1.3;
}

.category-text span:first-child {
font-size: 16px;
font-weight: 600;
word-break: break-word;
}

.category-text span:last-child {
font-size: 11px;
color: #777;
}

.category-image img {
max-height: 70px; /* スマホは少し小さく */
}

.category-title {
font-size: 26px;
}

.category-subtitle {
margin-bottom: 20px;
}
}

/* ★ テキスト下線消し */
.category-card {
text-decoration: none;
color: inherit;
}

.category-card:hover {
text-decoration: none;
}

.category-card span {
text-decoration: none;
}
/* =========================
PC：横並び・中央寄せ・高さ控えめ
========================= */
@media screen and (min-width: 768px) {
.category-card {
display: flex;
flex-direction: row;
align-items: center;
justify-content: center;
gap: 48px;
min-height: 170px;
padding: 20px 28px;
text-align: center;
}

.category-text {
display: flex;
flex-direction: column;
align-items: center;
justify-content: center;
flex: 0 0 auto;
gap: 6px;
text-align: center;
}

.category-text span:first-child {
font-size: 20px;
font-weight: 600;
}

.category-text span:last-child {
font-size: 13px;
}

.category-image {
flex: 0 0 auto;
width: 140px;
margin: 0;
text-align: center;
}

.category-image img {
width: 100%;
max-width: 140px;
max-height: 120px;
object-fit: contain;
display: block;
margin: 0 auto;
}
}