body.recallPopup-is-open {
  overflow: hidden;
}

.recallPopup-trigger {
  position: relative;
  width: 100%;
  padding-right: min(48px, 3.3333333333vw);
  cursor: pointer;
  text-align: left;
}

.recallPopup-trigger:hover {
  opacity: 0.75;
  transition: opacity 0.3s ease;
}

.recallPopup-trigger-arrow {
  position: absolute;
  top: 50%;
  right: min(8px, 0.5555555556vw);
  color: #755034;
  font-size: min(54px, 3.75vw);
  line-height: 1;
  transform: translateY(-50%);
}

.recallPopup {
  position: fixed;
  inset: 0;
  z-index: 1000000;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 24px;
  opacity: 0;
  visibility: hidden;
  transition: opacity 0.25s ease, visibility 0.25s ease;
}

.recallPopup.is-open {
  opacity: 1;
  visibility: visible;
}

.recallPopup-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(33, 24, 21, 0.72);
  backdrop-filter: blur(3px);
}

.recallPopup-dialog {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: min(900px, 92vw);
  height: min(900px, 92vh);
  padding: 22px;
  overflow: hidden;
  border: 5px solid #f1d77b;
  border-radius: 20px;
  background: #fffdf8;
  box-shadow: 0 24px 70px rgba(33, 24, 21, 0.35);
}

.recallPopup-close {
  position: absolute;
  top: 10px;
  right: 12px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  background: #755034;
  color: #ffffff;
  font-family: Arial, sans-serif;
  font-size: 32px;
  line-height: 1;
}

.recallPopup-close:hover {
  opacity: 0.8;
}

.recallPopup-heading {
  flex: 0 0 auto;
  padding: 2px 56px 16px 4px;
  color: #755034;
  font-family: "Zen Maru Gothic", sans-serif;
}

.recallPopup-label {
  margin-bottom: 7px;
  color: #b52222;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.recallPopup-title {
  font-size: clamp(18px, 2.15vw, 28px);
  font-weight: 700;
  line-height: 1.45;
}

.recallPopup-document {
  flex: 1 1 auto;
  display: block;
  width: 100%;
  min-height: 0;
  height: auto;
  overflow-y: auto;
  overscroll-behavior: contain;
  border: 1px solid #d8c9b7;
  background: #ffffff;
}

.recallPopup-document img {
  width: 100%;
  height: auto;
}

/* LINE UP：商品2点を中央に固定配置（スライドなし・矢印なし）2026-09-05 */
.top .lineUpSection-slider-inner {
  display: flex;
  justify-content: center;
  align-items: flex-start;
}

.top .lineUpSection-slider-inner-item {
  flex: 0 0 auto;
}

/* 箱・パッケージ柄の写真はPCだけ先方見本の横長版に差し替え（<picture>）。SPは従来の縦長写真 */
.top .lineUpSection-slider-inner-item-images picture {
  display: block;
  width: 100%;
}

.top .lineUpSection-slider-inner-item-images picture img {
  width: 100%;
  height: auto;
}

/* Safari：slick初期化時にjQueryの.show()がドットのulへ inline の display:block を書き込み、縦並びになる。CSSで強制 */
.top .lineUpSection-slider-inner-item .dots-wrap {
  display: flex !important;
}

@media only screen and (min-width: 769px) {
  /* 2026-09-05 先方見本（1550px幅スクショ実測：カード555×520・間隔42・名前まで64）に合わせる */
  .top .lineUpSection-slider-inner {
    gap: min(40px, 2.7777777778vw);
  }

  .top .lineUpSection-slider-inner-item-images {
    aspect-ratio: 555 / 520;
    /* 角丸は元PNGに焼き込み（773px幅で半径60px）。上下トリミングで欠けるので枠側で再現 */
    border-radius: min(40px, 2.7777777778vw);
    overflow: hidden;
  }

  .top .lineUpSection-slider-inner-item-images .slick-list,
  .top .lineUpSection-slider-inner-item-images .slick-track {
    height: 100%;
  }

  .top .lineUpSection-slider-inner-item-images picture,
  .top .lineUpSection-slider-inner-item-images img {
    height: 100%;
    object-fit: cover;
    object-position: center;
  }

  .top .lineUpSection-slider-inner-item-text {
    margin-top: min(56px, 3.8888888889vw);
  }

  .top .lineUpSection-slider {
    margin-top: min(40px, 2.7777777778vw);
  }

  .top .lineUpSection-slider-inner-item {
    padding-right: 0;
    padding-left: 0;
  }

  .top .lineUpSection-slider-inner-item-images-wrapper,
  .top .lineUpSection-slider-inner-item-images-wrapper-mask,
  .top .lineUpSection-slider-inner-item-images {
    width: min(520px, 36.1111111111vw);
  }

  .top .lineUpSection-slider-inner-item-images-wrapper {
    margin-right: auto;
    margin-left: auto;
  }
}

@media only screen and (max-width: 768px) {
  .top .lineUpSection-slider-inner {
    flex-direction: column;
    align-items: center;
    gap: 8vw;
  }

  .top .lineUpSection-slider-inner-item {
    width: 100%;
    padding-right: 0;
    padding-left: 0;
  }

  .recallPopup-trigger {
    padding-right: 8vw;
  }

  .recallPopup-trigger-arrow {
    right: 1.3333333333vw;
    font-size: 8vw;
  }

  .recallPopup {
    padding: 3.2vw;
  }

  .recallPopup-dialog {
    width: 93.6vw;
    height: 94vh;
    padding: 4vw 3.2vw 3.2vw;
    border-width: 3px;
    border-radius: 3.2vw;
  }

  .recallPopup-close {
    top: 2.4vw;
    right: 2.4vw;
    width: 9.6vw;
    height: 9.6vw;
    font-size: 7.2vw;
  }

  .recallPopup-heading {
    padding: 0 12vw 3.2vw 0.8vw;
  }

  .recallPopup-label {
    margin-bottom: 1.3333333333vw;
    font-size: 3.2vw;
  }

  .recallPopup-title {
    font-size: 4.2666666667vw;
  }
}

@media (prefers-reduced-motion: reduce) {
  .recallPopup,
  .recallPopup-trigger {
    transition: none;
  }
}
