@charset "utf-8";

/* ========== COMMON ========== */

/* page-body（LP共通リセット） */
#page-body {
  overflow-x: hidden;
  padding-bottom: 0;
  margin: 0;
  background: #fff;
  --gs-scale: 1;
  --gs-scale-tight: 1;
}

#page-body *,
#page-body *::before,
#page-body *::after {
  box-sizing: border-box;
}

#page-body div,
#page-body span,
#page-body p,
#page-body a,
#page-body hr,
#page-body h1,
#page-body h2,
#page-body h3,
#page-body h4,
#page-body h5,
#page-body h6,
#page-body dl,
#page-body dt,
#page-body dd,
#page-body ol,
#page-body ul,
#page-body li,
#page-body article,
#page-body section,
#page-body header,
#page-body footer,
#page-body menu,
#page-body nav,
#page-body fieldset,
#page-body label,
#page-body button,
#page-body input,
#page-body optgroup,
#page-body select,
#page-body textarea,
#page-body object,
#page-body audio,
#page-body video,
#page-body svg {
  margin: 0;
  padding: 0;
  line-height: 1;
}

/* ul */
#page-body ul,
#page-body li {
  list-style: none;
  margin: 0;
  padding: 0;
}

/* a */
#page-body a {
  transition: opacity 0.3s ease 0s;
  color: inherit;
  opacity: 1;
  text-decoration: none;
}

#page-body a:hover,
#page-body a:active {
  opacity: 0.7;
  text-decoration: none;
}

/* span */
#page-body span {
  display: inline-block;
  line-height: inherit;
}

#page-body img {
  max-width: 100%;
  height: auto;
  vertical-align: top;
}

/* container */
#page-body .container {
  max-width: unset;
  background: none;
}

@media (max-width: 767px) {
  #page-body .container {
    padding: 0;
  }
}

/* breadcrumb */
#page-body .breadcrumb-wrap {
  box-sizing: border-box;
  max-width: 1318px;
  margin: 0 auto;
  padding: 10px;
}

/* ========== ANIMATION ========== */
#page-body .active.animation-text-wh {
  background-position: left;
}

/* fadeIn */
@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

/* ========== ELEMENT ========== */

/* main-textlink */
#page-body a.main-textlink {
  display: inline-block;
  padding-bottom: 1px;
  border-bottom: 1px solid #262626;
}

.sp-only {
  display: none;
}

.pc-only {
  display: block;
}

@media (max-width: 767px) {
  .sp-only {
    display: block;
  }

  .pc-only {
    display: none;
  }
}

/* ========== MAIN-LP ========== */
/* ========== LP tokens ========== */
#page-body #main-lp.p-gift-set-2026 {
  --gs-navy: #001529;
  --gs-navy-deep: #001a33;
  --gs-green: #063c0c;
  --gs-wine: #6b1a1a;
  --gs-gold: #c5a059;
  --gs-gold-light: #d4b76a;
  --gs-cream: #f7f6f2;
  --gs-text: #4a4a4a;
  --gs-footer: #222222;
  --gs-max: 1440px;
  /* FOR HIM レイアウト基準（デザイン幅:高さ） */
  --gs-him-design-w: 1440;
  --gs-him-design-h: 1900;
  --gs-him-bg-h: 1958;
  --gs-serif: "Cormorant Garamond", "Times New Roman", serif;
  --gs-sans: "Noto Sans JP", "Montserrat", "Hiragino Kaku Gothic Pro", Meiryo, sans-serif;
  width: 100%;
  margin: 0;
  padding: 0;
  color: var(--gs-text);
  font-family: var(--gs-sans);
  font-optical-sizing: auto;
  font-style: normal;
  font-size: 15px;
  line-height: 1;
  letter-spacing: 0;
  overflow-x: hidden;
}

/* utility（PC/SP画像出し分け — .lp-gender__media img より詳細度を上げる） */
#page-body img.lp_viewpc_block,
#page-body .lp-gender__media img.lp_viewpc_block {
  display: block;
}

#page-body img.lp_viewsmp_block,
#page-body .lp-gender__media img.lp_viewsmp_block {
  display: none;
}

#page-body .sp-only {
  display: none;
}

@media (max-width: 767px) {

  #page-body img.lp_viewpc_block,
  #page-body .lp-gender__media img.lp_viewpc_block {
    display: none;
  }

  #page-body img.lp_viewsmp_block,
  #page-body .lp-gender__media img.lp_viewsmp_block {
    display: block;
  }

  #page-body .sp-only {
    display: block;
  }
}

/* 768〜1365px：変数だけ更新 → 各所 calc(* var()) が連動して縮む */
@media (min-width: 768px) and (max-width: 1365px) {

  #page-body,
  #page-body #main-lp.p-gift-set-2026 {
    --gs-scale: calc(min(100vw, 1440px) / 1440);
    --gs-scale-tight: calc(min(100vw, 1440px) / 1440 * 0.58);
  }
}

/* ========== Section: MV ========== */
/* 配置基準: main_pc_re.jpg（1980×900）／mv_smp.jpg（750×1100） */
@keyframes lp-mv-left-up-pc {
  from {
    transform: translateY(100%);
    opacity: 0;
  }

  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes lp-mv-right-down-pc {
  from {
    transform: translateY(-100%);
    opacity: 0;
  }

  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes lp-mv-left-in-sp {
  from {
    transform: translateX(-105%);
    opacity: 0;
  }

  to {
    transform: translateX(0);
    opacity: 1;
  }
}

@keyframes lp-mv-right-in-sp {
  from {
    transform: translateX(105%);
    opacity: 0;
  }

  to {
    transform: translateX(0);
    opacity: 1;
  }
}

#page-body .lp-mv {
  position: relative;
  width: 100%;
  line-height: 0;
  overflow: hidden;
}

@media (min-width: 768px) {
  #page-body .lp-mv {
    width: 100vw;
    max-width: none;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
  }
}

#page-body .lp-mv__sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

#page-body .lp-mv__stage {
  width: 100%;
  margin: 0;
}

#page-body .lp-mv__stage--pc {
  display: none;
}

#page-body .lp-mv__stage--sp {
  display: none;
}

@media (min-width: 768px) {
  #page-body .lp-mv__stage--pc {
    display: block;
  }
}

@media (max-width: 767px) {
  #page-body .lp-mv__stage--sp {
    display: block;
  }
}

#page-body .lp-mv__frame {
  position: relative;
  width: 100%;
  margin: 0 auto;
}

#page-body .lp-mv__stage--pc .lp-mv__frame {
  max-width: 1980px;
}

#page-body .lp-mv__stage--sp .lp-mv__frame {
  max-width: 750px;
}

#page-body .lp-mv__bg {
  display: block;
  width: 100%;
  max-width: 100%;
  height: auto;
  vertical-align: top;
}

#page-body .lp-mv__stage--pc .lp-mv__bg--solid {
  aspect-ratio: 1980 / 900;
  background-color: #0e2841;
}

#page-body .lp-mv__copy {
  position: absolute;
  inset: 0;
  z-index: 2;
  pointer-events: none;
}

#page-body .lp-mv__txt {
  position: absolute;
  left: 50%;
  height: auto;
  transform: translateX(-50%);
}

/* main_pc_re 中央カラム基準（1980×900） */
#page-body .lp-mv__txt--sub1 {
  top: 12.3%;
  width: 19.6%;
  max-width: 372px;
  left: 50.22%;
}

#page-body .lp-mv__txt--title {
  top: 36.9%;
  width: 28.4%;
  max-width: 540px;
}

#page-body .lp-mv__txt--sub2 {
  bottom: 9.5%;
  width: 22%;
  max-width: 382px;
}

#page-body .lp-mv__piece {
  position: absolute;
  margin: 0;
  z-index: 1;
  pointer-events: none;
  will-change: transform;
}

#page-body .lp-mv__piece img {
  display: block;
  width: 100%;
  height: auto;
  vertical-align: top;
}

/* PC: left 638×838 @ (0,0) / right 638×837 @ (1342,62) on 1980×900 */
#page-body .lp-mv__stage--pc .lp-mv__piece--left {
  top: 0;
  left: 0;
  width: 32.2222%;
  overflow: hidden;
}

#page-body .lp-mv__stage--pc .lp-mv__piece--left img {
  display: block;
  width: 100%;
  height: auto;
  margin-bottom: -1px;
}

#page-body .lp-mv__stage--pc .lp-mv__piece--right {
  bottom: 0;
  right: 0;
  left: auto;
  width: 32.2222%;
}

#page-body .lp-mv__stage--pc .lp-mv__piece--left.lp-mv__piece--anim {
  animation: lp-mv-left-up-pc 2s cubic-bezier(0.22, 1, 0.36, 1) 1s both;
}

#page-body .lp-mv__stage--pc .lp-mv__piece--right.lp-mv__piece--anim {
  animation: lp-mv-right-down-pc 2s cubic-bezier(0.22, 1, 0.36, 1) 1.15s both;
}

/* SP: left 327×508 @ (40,412) / right @ (386,456) on 750×1100 */
#page-body .lp-mv__stage--sp .lp-mv__piece--left {
  top: 37.5455%;
  left: 5.4667%;
  width: 43.6%;
}

#page-body .lp-mv__stage--sp .lp-mv__piece--right {
  top: 41.4545%;
  left: 51.6%;
  width: 43.6%;
}

#page-body .lp-mv__stage--sp .lp-mv__piece--left.lp-mv__piece--anim {
  animation: lp-mv-left-in-sp 1.9s cubic-bezier(0.22, 1, 0.36, 1) 1s both;
}

#page-body .lp-mv__stage--sp .lp-mv__piece--right.lp-mv__piece--anim {
  animation: lp-mv-right-in-sp 1.9s cubic-bezier(0.22, 1, 0.36, 1) 1.12s both;
}

/* ========== Section: Intro ========== */
#page-body .lp-intro {
  padding: 100px 20px 100px;
  max-width: 1440px;
  margin: 0 auto;
  background: #fff;
}

#page-body .lp-intro__inner {
  width: 100%;
  margin: 0;
}

#page-body .lp-gold-frame {
  position: relative;
  padding: 0;
}

#page-body .lp-gold-frame__side {
  position: absolute;
  top: 24px;
  bottom: 24px;
  left: 0;
  width: 30px;
  background: url("img/flame_l_pc_01.png") no-repeat left center;
  background-size: 30px 100%;
  pointer-events: none;
}

#page-body .lp-intro__block {
  width: fit-content;
  max-width: 100%;
  margin: 0 auto 0 10.2%;
}

#page-body .lp-intro__title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 33px;
  margin: 0;
  font-family: var(--gs-sans);
  font-size: calc(30px * var(--gs-scale));
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1.46;
  text-align: center;
  color: #262626;
}

#page-body .lp-intro__title-text {
  display: block;
  flex: 0 1 auto;
  min-width: 0;
  margin-right: -19px;
}

#page-body .lp-intro__bracket {
  flex: 0 0 auto;
  display: block;
  width: 30px;
  height: 179px;
  max-width: none;
  max-height: none;
}

#page-body .lp-intro__body {
  margin: 10px 0 0;
  font-size: calc(16px * var(--gs-scale));
  font-weight: 400;
  letter-spacing: 0.06em;
  line-height: 1.75;
  text-align: center;
}

/* ----- SP: Intro ----- */
@media (max-width: 767px) {
  #page-body .lp-intro {
    padding: 79px 16px 93px;
  }

  #page-body .lp-gold-frame {
    padding: 0;
  }

  #page-body .lp-intro__block {
    width: 100%;
    max-width: 343px;
    margin: 0 auto;
  }

  #page-body .lp-intro__title-text {
    margin-right: 0;
  }

  #page-body .lp-intro__title {
    gap: 20px;
    font-size: 19px;
    letter-spacing: 0;
    line-height: 1.46;
  }

  #page-body .lp-intro__bracket {
    width: auto;
    height: 143px;
  }

  #page-body .lp-intro__body {
    margin-top: 20px;
    font-size: 13px;
    line-height: 1.9;
    letter-spacing: 0.04em;
    text-align: center;
  }
}

/* ========== Section: FOR HIM / FOR HER common ========== */
#page-body .lp-gender {
  position: relative;
  padding: 0 0 143px;
  background: #fff;
}

#page-body .lp-gender__inner {
  position: relative;
  width: 100%;
  max-width: var(--gs-max);
  margin: 0 auto;
}

/* panel 共通（位置・余白・タイポの数値は HIM / HER で個別指定） */
#page-body .lp-gender__panel {
  position: absolute;
  top: 0;
  color: #fff;
  background: transparent;
  z-index: 5;
}

#page-body .lp-gender__title-img {
  width: fit-content;
  max-width: 100%;
  height: auto;
}

#page-body img.lp-gender__title-img--pc {
  display: block;
}

#page-body img.lp-gender__title-img--smp {
  display: none;
}

@media (max-width: 767px) {
  #page-body img.lp-gender__title-img--pc {
    display: none;
  }

  #page-body img.lp-gender__title-img--smp {
    display: block;
    width: 100%;
    max-width: none;
    height: auto;
  }
}

#page-body .lp-gender__title-sub {
  display: block;
  position: relative;
  z-index: 1;
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-style: normal;
}

@keyframes lp-badge-spin {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}

#page-body .lp-gender__badge,
#page-body .lp-wrapping__badge {
  animation: lp-badge-spin 20s linear infinite;
}

#page-body .lp-gender__badge {
  position: absolute;
  z-index: 3;
  pointer-events: none;
}

#page-body .lp-gender__media {
  position: absolute;
  z-index: 2;
}

#page-body .lp-gender__media img:not(.lp_viewpc_block):not(.lp_viewsmp_block) {
  display: block;
  width: 100%;
  height: auto;
}

#page-body .lp-gender__media img.lp_viewpc_block,
#page-body .lp-gender__media img.lp_viewsmp_block {
  width: 100%;
  height: auto;
}

#page-body .lp-gender__caption {
  font-family: "span-compressed", serif;
  font-optical-sizing: auto;
  font-style: normal;
}

#page-body .lp-gender__caption-sub {
  font-family: "Noto Sans JP", sans-serif;
}

/* ========== FOR HIM ========== */
#page-body .lp-gender--him .lp-gender__inner {
  aspect-ratio: 1440 / 2965;
}

#page-body .lp-gender--him .lp-gender__inner::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 15.3%;
  right: calc(50% - 50vw);
  height: calc(100% * 1255 / 1900);
  background: var(--gs-green);
  z-index: 0;
  pointer-events: none;
}

#page-body .lp-gender--him .lp-gender__panel {
  left: 16.5%;
  width: 62.5%;
  max-width: 634px;
  min-height: 538px;
  padding: 135px 48px 64px;
}

#page-body .lp-gender--him .lp-gender__title-img {
  margin: 0;
}

#page-body .lp-gender--him .lp-gender__title-sub {
  margin: 31px 0 0;
  color: #fff;
  font-size: calc(30px * var(--gs-scale-tight));
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.46;
  text-align: left;
}

#page-body .lp-gender--him .lp-gender__lead {
  margin-top: 15px;
  margin-left: 2px;
  font-size: calc(16px * var(--gs-scale-tight));
  font-weight: 400;
  letter-spacing: 0.06em;
  line-height: 1.75;
}

#page-body .lp-gender--him .lp-gender__badge {
  top: 27.5%;
  right: 2.7%;
  width: 15%;
  height: auto;
  aspect-ratio: 1;
}

#page-body .lp-gender--him .lp-gender__caption {
  margin-top: 16px;
  margin-bottom: 11px;
  font-size: calc(30px * var(--gs-scale-tight));
  font-weight: 500;
  letter-spacing: 0;
  line-height: 1.46;
}

#page-body .lp-gender--him .lp-gender__caption-sub {
  margin-top: 0;
  font-size: calc(16px * var(--gs-scale-tight));
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.75;
}

#page-body .lp-gender--him .lp-gender__text--wallet .lp-gender__caption,
#page-body .lp-gender--him .lp-gender__text--wallet .lp-gender__caption-sub,
#page-body .lp-gender--him .lp-gender__text--wallet .lp-gender__specs {
  color: #fff;
}

#page-body .lp-gender--him .lp-gender__text--key .lp-gender__caption,
#page-body .lp-gender--him .lp-gender__text--key .lp-gender__caption-sub,
#page-body .lp-gender--him .lp-gender__text--key .lp-gender__caption-sub-sub {
  color: #063c0c;
}

#page-body .lp-gender--him .lp-gender__text--key .lp-gender__caption {
  margin-bottom: 19px;
}

#page-body .lp-gender--him .lp-gender__text--key .lp-gender__caption-sub {
  margin-left: 4px;
}

#page-body .lp-gender--him .lp-gender__text--key .lp-gender__caption-sub-sub {
  margin: 23px 0 0 4px;
  font-weight: 500;
}

/* ========== FOR HER ========== */
#page-body .lp-gender--her .lp-gender__inner {
  aspect-ratio: 1440 / 2965;
}

#page-body .lp-gender--her .lp-gender__inner::before {
  content: "";
  position: absolute;
  top: 0;
  left: calc(50% - 50vw);
  right: 15.3%;
  height: calc(100% * 1324 / 1900);
  background: var(--gs-wine);
  z-index: 0;
  pointer-events: none;
}

#page-body .lp-gender--her .lp-gender__panel {
  right: 15.3%;
  width: 47.5%;
  max-width: 642px;
  min-height: 540px;
  padding: 236px 48px 64px;
}

#page-body .lp-gender--her .lp-gender__title-img {
  margin: 0;
}

#page-body .lp-gender--her .lp-gender__title-sub {
  margin: 39px 0 0;
  color: #fff;
  font-size: calc(30px * var(--gs-scale-tight));
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.46;
  text-align: left;
}

#page-body .lp-gender--her .lp-gender__lead {
  margin-top: 25px;
  margin-left: 3px;
  font-size: calc(16px * var(--gs-scale-tight));
  font-weight: 400;
  letter-spacing: 0.06em;
  line-height: 1.75;
}

#page-body .lp-gender--her .lp-gender__badge {
  top: 30%;
  left: 2.1%;
  width: 15%;
  height: auto;
  aspect-ratio: 1;
}

#page-body .lp-gender--her .lp-gender__caption {
  margin-top: 16px;
  margin-bottom: 10px;
  font-size: calc(30px * var(--gs-scale-tight));
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1.46;
}

#page-body .lp-gender--her .lp-gender__caption-sub {
  margin-top: 0;
  font-size: calc(16px * var(--gs-scale-tight));
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.75;
}

#page-body .lp-gender--her .lp-gender__text--wallet .lp-gender__caption,
#page-body .lp-gender--her .lp-gender__text--wallet .lp-gender__caption-sub,
#page-body .lp-gender--her .lp-gender__text--wallet .lp-gender__specs {
  color: #fff;
}

/* 収納・サイズ（FOR HIM / FOR HER 共通） */
#page-body .lp-gender--him .lp-gender__specs,
#page-body .lp-gender--her .lp-gender__specs {
  margin: 22px 0 0;
  padding: 0;
}

#page-body .lp-gender--him .lp-gender__specs-row {
  display: flex;
  align-items: flex-start;
  gap: 2.1em;
  margin: 0;
}

#page-body .lp-gender--her .lp-gender__specs-row {
  display: flex;
  align-items: flex-start;
  gap: 1.97em;
  margin: 0;
}

#page-body .lp-gender--him .lp-gender__specs-row+.lp-gender__specs-row,
#page-body .lp-gender--her .lp-gender__specs-row+.lp-gender__specs-row {
  margin-top: 0;
  gap: 1em;
}

#page-body .lp-gender--him .lp-gender__specs-label,
#page-body .lp-gender--him .lp-gender__specs-body,
#page-body .lp-gender--her .lp-gender__specs-label,
#page-body .lp-gender--her .lp-gender__specs-body {
  margin: 0;
  font-family: "Noto Sans JP", sans-serif;
  font-size: calc(16px * var(--gs-scale-tight));
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1.75;
}

#page-body .lp-gender--him .lp-gender__specs-label,
#page-body .lp-gender--her .lp-gender__specs-label {
  flex: 0 0 auto;
}

#page-body .lp-gender--him .lp-gender__specs-body,
#page-body .lp-gender--her .lp-gender__specs-body {
  flex: 1 1 auto;
  min-width: 0;
}

#page-body .lp-gender--her .lp-gender__text--key .lp-gender__caption,
#page-body .lp-gender--her .lp-gender__text--key .lp-gender__caption-sub,
#page-body .lp-gender--her .lp-gender__text--key .lp-gender__caption-sub-sub {
  color: #811b1b;
}

#page-body .lp-gender--her .lp-gender__text--key .lp-gender__caption {
  margin-bottom: 17px;
}

#page-body .lp-gender--her .lp-gender__text--key .lp-gender__caption-sub {
  margin-left: 4px;
}

#page-body .lp-gender--her .lp-gender__text--key .lp-gender__caption-sub-sub {
  margin: 28px 0 0 4px;
  font-weight: 500;
}

/* FOR HIM positions（基準高さ 1900px → % 換算で拡縮） */
#page-body .lp-gender--him .lp-gender__media--main {
  top: -3.2%;
  right: 0;
  margin: 0;
  width: 40%;
}

#page-body .lp-gender--him .lp-gender__media--frame {
  top: 45.3%;
  right: 28.2%;
  margin: 0;
  width: 28.65%;
}

#page-body .lp-gender--him .lp-gender__media--sub1 {
  top: 23.9%;
  left: 0;
  margin: 0;
  width: 36.7%;
}

#page-body .lp-gender--him .lp-gender__media--sub2 {
  top: 32.2%;
  right: 5.5%;
  margin: 0;
  width: 22.8%;
}

#page-body .lp-gender--him .lp-gender__media--sub3 {
  bottom: 1.9%;
  left: 11.2%;
  margin: 0;
  width: 44.1%;
}

/* 商品情報（画像左下）— HIM */
#page-body .lp-gender--him .lp-gender__media--sub3 .lp-gender__product {
  position: absolute;
  left: 6.4%;
  bottom: 4.8%;
  z-index: 2;
  margin: 0;
  text-align: left;
}

#page-body .lp-gender--him .lp-gender__product-name {
  margin: 0;
  color: #063c0c;
  font-family: "Noto Sans JP", sans-serif;
  font-size: calc(16px * var(--gs-scale-tight));
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.5;
}

#page-body .lp-gender--him .lp-gender__product-price {
  margin: 7px 0 0;
  color: #063c0c;
  font-family: "Montserrat", "Noto Sans JP", sans-serif;
  font-size: calc(16px * var(--gs-scale-tight));
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.5;
}

#page-body .lp-gender--him .lp-gender__product-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 18px;
  padding: 9px 29px;
  border: 2px solid #063c0c;
  background: transparent;
  color: #063c0c;
  font-family: "Noto Sans JP", sans-serif;
  font-size: calc(16px * var(--gs-scale-tight));
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1;
  text-decoration: none;
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

#page-body .lp-gender--him .lp-gender__product-btn:hover {
  opacity: 1;
  background: #063c0c;
  color: #fff;
}

#page-body .lp-gender--him .lp-gender__media--key {
  bottom: 2%;
  right: 11.2%;
  margin: 0;
  width: 32.2%;
}

#page-body .lp-gender--him .lp-gender__text--wallet {
  top: 29%;
  left: 40.2%;
  width: 24%;
}

#page-body .lp-gender--him .lp-gender__text--key {
  bottom: 21.4%;
  right: 18.8%;
  width: 22%;
}

/* FOR HER positions */
#page-body .lp-gender--her .lp-gender__media--main {
  top: 3.4%;
  left: 0%;
  width: 40%;
  margin: 0;
}

#page-body .lp-gender--her .lp-gender__media--frame {
  top: 26.6%;
  right: 3.8%;
  width: 39.9%;
  margin: 0;
}

#page-body .lp-gender--her .lp-gender__media--sub1 {
  top: 34.6%;
  left: 0;
  width: 26%;
  margin: 0;
}

#page-body .lp-gender--her .lp-gender__media--sub2 {
  top: 52.1%;
  left: 18%;
  width: 23%;
  margin: 0;
}

#page-body .lp-gender--her .lp-gender__media--sub3 {
  top: 60.6%;
  right: 11.2%;
  width: 32.1%;
  margin: 0;
}

#page-body .lp-gender--her .lp-gender__media--key {
  top: 89.3%;
  right: 11.1%;
  width: 26%;
  margin: 0;
}

#page-body .lp-gender--her .lp-gender__media--wide {
  top: 73.1%;
  left: 11.4%;
  width: 44%;
  margin: 0;
}

/* 商品情報（画像左下）— HER */
#page-body .lp-gender--her .lp-gender__media--wide .lp-gender__product {
  position: absolute;
  left: 6.4%;
  bottom: 4.8%;
  z-index: 2;
  margin: 0;
  text-align: left;
}

#page-body .lp-gender--her .lp-gender__product-name {
  margin: 0;
  color: #811b1b;
  font-family: "Noto Sans JP", sans-serif;
  font-size: calc(16px * var(--gs-scale-tight));
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.5;
}

#page-body .lp-gender--her .lp-gender__product-price {
  margin: 7px 0 0;
  color: #811b1b;
  font-family: "Montserrat", "Noto Sans JP", sans-serif;
  font-size: calc(16px * var(--gs-scale-tight));
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.5;
}

#page-body .lp-gender--her .lp-gender__product-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 18px;
  padding: 9px 29px;
  border: 2px solid #811b1b;
  background: transparent;
  color: #811b1b;
  font-family: "Noto Sans JP", sans-serif;
  font-size: calc(16px * var(--gs-scale-tight));
  font-weight: 500;
  letter-spacing: 0.08em;
  line-height: 1;
  text-decoration: none;
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

#page-body .lp-gender--her .lp-gender__product-btn:hover {
  opacity: 1;
  background: #811b1b;
  color: #fff;
}

#page-body .lp-gender--her .lp-gender__text--wallet {
  top: 35.9%;
  left: 29.4%;
  width: 24.5%;
  text-align: left;
}

#page-body .lp-gender--her .lp-gender__text--key {
  top: 83.7%;
  right: 23.4%;
  width: 18%;
  text-align: left;
}

/* ----- SP: FOR HIM / FOR HER（カンプ準拠・grid） ----- */
@media (max-width: 767px) {
  #page-body .lp-gender {
    padding-bottom: 0;
    overflow: visible;
  }

  /* FOR HIM：row2〜frame まで画面幅いっぱいの緑（::before を最背面に） */
  #page-body .lp-gender--him .lp-gender__inner {
    position: relative;
    isolation: isolate;
    overflow: visible;
    aspect-ratio: unset;
    height: auto;
  }

  #page-body .lp-gender--him .lp-gender__inner::before {
    content: "";
    display: block;
    position: static;
    top: auto;
    left: auto;
    right: auto;
    height: auto;
    grid-column: 1 / -1;
    grid-row: 2 / 9;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    background: var(--gs-green);
    z-index: 0;
    pointer-events: none;
  }

  /* panel が display:contents のため title-sub / lead は > * に含まれない */
  #page-body .lp-gender--him .lp-gender__title-sub,
  #page-body .lp-gender--him .lp-gender__lead {
    position: relative;
    z-index: 1;
  }

  /* FOR HER：row2〜sub2 まで画面幅いっぱいのワインレッド */
  #page-body .lp-gender--her .lp-gender__inner {
    position: relative;
    isolation: isolate;
    aspect-ratio: unset;
    height: auto;
    overflow: visible;
  }

  #page-body .lp-gender--her .lp-gender__inner::before {
    content: "";
    display: block;
    position: static;
    top: auto;
    left: auto;
    right: auto;
    height: auto;
    grid-column: 1 / -1;
    grid-row: 2 / 9;
    width: 100vw;
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
    background: var(--gs-wine);
    z-index: 0;
    pointer-events: none;
  }

  #page-body .lp-gender--her .lp-gender__title-sub,
  #page-body .lp-gender--her .lp-gender__lead {
    position: relative;
    z-index: 1;
  }

  #page-body .lp-gender__inner {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-auto-rows: auto;
    padding: 0;
    overflow: visible;
  }

  #page-body .lp-gender__panel {
    display: contents;
    position: static;
    width: auto;
    max-width: none;
    min-height: 0;
    padding: 0;
    left: auto;
    right: auto;
  }

  #page-body .lp-gender__title {
    margin: 0;
  }

  #page-body .lp-gender__title-sub {
    grid-column: 1 / -1;
    grid-row: 2;
    margin: 0;
    padding: 3px 20px 0;
    font-size: 17px;
    font-weight: 700;
    line-height: 1.55;
    letter-spacing: 0.05em;
  }

  #page-body .lp-gender__lead {
    grid-column: 1 / -1;
    grid-row: 3;
    margin: 0;
    padding: 2px 18px 22px;
    font-size: 13px;
    font-weight: 400;
    line-height: 1.53;
    letter-spacing: 0.05em;
  }

  #page-body .lp-gender__media {
    position: relative;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    bottom: auto !important;
    width: auto;
    max-width: none !important;
    margin: 0;
  }

  /* SP hero：メイン画像フル幅 + 同一行にタイトル重ね */
  #page-body .lp-gender--him .lp-gender__media--main,
  #page-body .lp-gender--her .lp-gender__media--main {
    grid-column: 1 / -1;
    grid-row: 1;
    z-index: 1;
    width: 100vw !important;
    max-width: 100vw;
    margin-left: calc(50% - 50vw) !important;
    margin-right: calc(50% - 50vw) !important;
    padding: 0;
    background: transparent;
  }

  #page-body .lp-gender--him .lp-gender__media--main img,
  #page-body .lp-gender--her .lp-gender__media--main img {
    width: 100%;
    height: auto;
    vertical-align: top;
  }

  #page-body .lp-gender--him .lp-gender__title {
    grid-column: 1 / -1;
    grid-row: 1;
    position: relative;
    z-index: 2;
    display: flex;
    align-items: flex-start;
    justify-content: flex-start;
    align-self: start;
    width: 100%;
    margin: 0;
    padding: 0 5.3vw;
    background: transparent;
    pointer-events: none;
    box-sizing: border-box;
    overflow: visible;
  }

  #page-body .lp-gender--her .lp-gender__title {
    grid-column: 1 / -1;
    grid-row: 1;
    position: relative;
    z-index: 2;
    display: flex;
    align-items: flex-start;
    justify-content: flex-end;
    align-self: start;
    width: 100%;
    margin: 0;
    padding: 0 5.3vw;
    background: transparent;
    pointer-events: none;
    box-sizing: border-box;
    overflow: visible;
  }

  #page-body .lp-gender--him .lp-gender__title img.lp-gender__title-img--smp,
  #page-body .lp-gender--her .lp-gender__title img.lp-gender__title-img--smp {
    display: block;
    width: 73.7vw;
    max-width: 275px;
    height: auto;
    margin: -4.9vw 0 0;
  }

  #page-body .lp-gender__media img:not(.lp_viewpc_block):not(.lp_viewsmp_block) {
    display: block;
    width: 100%;
    height: auto;
  }

  #page-body .lp-gender__media img.lp_viewpc_block,
  #page-body .lp-gender__media img.lp_viewsmp_block {
    width: 100%;
    height: auto;
  }

  #page-body .lp-gender__badge {
    grid-column: 1 / -1;
    grid-row: 4;
    position: relative;
    z-index: 5;
    width: 108px;
    height: auto;
    margin: -48px 0 0;
    pointer-events: none;
  }

  #page-body .lp-gender__badge img {
    display: block;
    width: 100%;
    height: auto;
  }

  #page-body .lp-gender__product-name,
  #page-body .lp-gender__product-price {
    font-size: 13px;
    line-height: 1.55;
  }

  #page-body .lp-gender__product-btn {
    font-size: 12px;
    letter-spacing: 0.06em;
  }

  #page-body .lp-gender--him .lp-gender__specs,
  #page-body .lp-gender--her .lp-gender__specs {
    margin-top: 12px;
  }

  #page-body .lp-gender__text--wallet {
    grid-column: 1 / -1;
    width: 75% !important;
    margin: 0 !important;
    text-align: left !important;
  }

  #page-body .lp-gender__text--key {
    grid-column: 1 / -1;
    width: 73% !important;
    margin: 0 !important;
    text-align: left !important;
  }

  #page-body .lp-gender__caption {
    margin: 0 0 10px;
    font-size: 22px;
    font-weight: 500;
    letter-spacing: 0.06em;
    line-height: 1.4;
  }

  #page-body .lp-gender--him .lp-gender__caption,
  #page-body .lp-gender--her .lp-gender__caption {
    margin-top: 0;
    margin-bottom: 6px;
    font-size: 22px;
    letter-spacing: 0;
    line-height: 1;
  }

  #page-body .lp-gender__caption-sub,
  #page-body .lp-gender__specs-label,
  #page-body .lp-gender__specs-body {
    font-size: 12px;
    line-height: 1.9;
    letter-spacing: 0.05em;
  }

  #page-body .lp-gender--him .lp-gender__caption-sub,
  #page-body .lp-gender--her .lp-gender__caption-sub {
    font-size: 13px;
    line-height: 1.54;
    letter-spacing: 0.05em;
  }

  #page-body .lp-gender--him .lp-gender__specs-label,
  #page-body .lp-gender--him .lp-gender__specs-body,
  #page-body .lp-gender--her .lp-gender__specs-label,
  #page-body .lp-gender--her .lp-gender__specs-body {
    font-size: 12px;
    line-height: 1.54;
    letter-spacing: 0.05em;
  }

  #page-body .lp-gender--him .lp-gender__specs-row,
  #page-body .lp-gender--her .lp-gender__specs-row {
    gap: 1.8em;
  }

  #page-body .lp-gender--him .lp-gender__specs-row+.lp-gender__specs-row,
  #page-body .lp-gender--her .lp-gender__specs-row+.lp-gender__specs-row {
    gap: 0.9em;
  }

  #page-body .lp-gender__text--key .lp-gender__caption-sub-sub {
    margin-top: 18px;
    font-size: 12px;
  }

  /* FOR HIM */
  #page-body .lp-gender--him {
    background: #fff;
    overflow-x: clip;
  }

  #page-body .lp-gender--him .lp-gender__title-sub {
    background: transparent;
    color: #fff;
    font-size: 22px;
  }

  #page-body .lp-gender--him .lp-gender__lead {
    background: transparent;
    color: #fff;
    font-size: 13px;
    line-height: 1.56;
  }

  /* SP表示順: sub1 → WALLET → badge → sub2 → frame → key → KEY → sub3 */
  #page-body .lp-gender--him .lp-gender__media--sub1 {
    grid-row: 4;
  }

  #page-body .lp-gender--him .lp-gender__text--wallet {
    grid-row: 5;
  }

  #page-body .lp-gender--him .lp-gender__media--sub2 {
    grid-row: 7;
  }

  #page-body .lp-gender--him .lp-gender__media--frame {
    grid-row: 8;
  }

  #page-body .lp-gender--him .lp-gender__media--key {
    grid-row: 9;
  }

  #page-body .lp-gender--him .lp-gender__text--key {
    grid-row: 10;
  }

  #page-body .lp-gender--him .lp-gender__media--sub3 {
    grid-column: 1 / -1;
    grid-row: 11;
    position: relative;
    width: auto !important;
    padding: 0;
    background: #fff;
    box-sizing: border-box;
  }

  /* 緑は画像の高さ分のみ（下余白は白） */
  #page-body .lp-gender--him .lp-gender__media--sub3::before {
    content: "";
    position: absolute;
    z-index: 0;
    top: 0;
    left: 50%;
    width: 100vw;
    max-width: 100vw;
    height: 100%;
    transform: translateX(-50%);
    pointer-events: none;
  }

  #page-body .lp-gender--him .lp-gender__media--sub3 img.lp_viewpc_block,
  #page-body .lp-gender--him .lp-gender__media--sub3 img.lp_viewsmp_block {
    position: relative;
    z-index: 1;
    width: 100%;
    height: auto;
  }

  /* PC同様：画像左下に商品情報 */
  #page-body .lp-gender--him .lp-gender__media--sub3 .lp-gender__product {
    position: absolute;
    left: 3.4%;
    bottom: 3.8%;
    z-index: 2;
    margin: 0;
    padding: 0;
    background: transparent;
    text-align: left;
  }

  #page-body .lp-gender--him .lp-gender__media--sub3 .lp-gender__product-name,
  #page-body .lp-gender--him .lp-gender__media--sub3 .lp-gender__product-price {
    color: #063c0c;
    font-size: 12px;
  }

  #page-body .lp-gender--him .lp-gender__media--sub3 .lp-gender__product-btn {
    margin-top: 15px;
    padding: 8px 23px;
    border-color: #063c0c;
    color: #063c0c;
    font-size: 11px;
  }

  #page-body .lp-gender--him .lp-gender__media--frame {
    grid-column: 1 / -1;
    width: 66% !important;
    margin: -5% 0 19px 3% !important;
    padding: 10px;
    box-sizing: border-box;
  }

  #page-body .lp-gender--him .lp-gender__media--sub1 {
    grid-column: 1 / -1;
    width: 70.3% !important;
    margin: 15.1% auto 39px 0 !important;
  }

  #page-body .lp-gender--him .lp-gender__media--sub2 {
    grid-column: 1 / -1;
    width: 48% !important;
    margin: -5.7% 0 19px auto !important;
  }

  #page-body .lp-gender--him .lp-gender__badge {
    grid-row: 6;
    justify-self: end;
    margin: -73px 0px 8px 0;
    width: 108px;
  }

  #page-body .lp-gender--him .lp-gender__media--key {
    grid-column: 1 / -1;
    width: 62% !important;
    margin: 10% 5% 16px auto !important;
  }

  #page-body .lp-gender--him .lp-gender__text--wallet {
    padding: 0 19px 19px;
    background: transparent;
    color: #fff;
  }

  #page-body .lp-gender--him .lp-gender__text--key {
    padding: 28px 20px 37px;
    margin-top: -26% !important;
    color: #063c0c;
  }

  #page-body .lp-gender--him .lp-gender__text--key .lp-gender__caption {
    margin-bottom: 11px;
  }

  #page-body .lp-gender--him .lp-gender__text--key .lp-gender__caption-sub-sub {
    margin: 18px 0 0 4px;
    font-weight: 500;
  }

  /* FOR HER */
  #page-body .lp-gender--her {
    background: #fff;
    margin-top: 142px;
    overflow-x: clip;
  }

  #page-body .lp-gender--her .lp-gender__title-sub {
    background: transparent;
    color: #fff;
    font-size: 22px;
  }

  #page-body .lp-gender--her .lp-gender__lead {
    font-size: 13px;
    background: transparent;
    color: #fff;
    line-height: 1.56;
  }

  /* SP表示順: frame → WALLET → badge → sub1 → sub2（赤ここまで）→ sub3 → KEY → key → wide */
  #page-body .lp-gender--her .lp-gender__media--frame {
    grid-row: 4;
  }

  #page-body .lp-gender--her .lp-gender__text--wallet {
    grid-row: 5;
  }

  #page-body .lp-gender--her .lp-gender__badge {
    grid-row: 6;
  }

  #page-body .lp-gender--her .lp-gender__media--sub1 {
    grid-row: 7;
  }

  #page-body .lp-gender--her .lp-gender__media--sub2 {
    grid-row: 8;
  }

  #page-body .lp-gender--her .lp-gender__media--sub3 {
    grid-row: 9;
  }

  #page-body .lp-gender--her .lp-gender__text--key {
    grid-row: 10;
  }

  #page-body .lp-gender--her .lp-gender__media--key {
    grid-row: 11;
  }

  #page-body .lp-gender--her .lp-gender__media--wide {
    grid-column: 1 / -1;
    grid-row: 12;
    position: relative;
    width: auto !important;
    padding: 0 0 4px;
    background: #fff;
    box-sizing: border-box;
  }

  #page-body .lp-gender--her .lp-gender__media--wide img {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
  }

  /* PC同様：画像左下に商品情報（字号は HIM sub3 SP 準拠） */
  #page-body .lp-gender--her .lp-gender__media--wide .lp-gender__product {
    position: absolute;
    left: 6.4%;
    bottom: 4.8%;
    z-index: 2;
    margin: 0;
    padding: 0;
    background: transparent;
    text-align: left;
  }

  #page-body .lp-gender--her .lp-gender__media--wide .lp-gender__product-name,
  #page-body .lp-gender--her .lp-gender__media--wide .lp-gender__product-price {
    color: #811b1b;
    font-size: 12px;
  }

  #page-body .lp-gender--her .lp-gender__media--wide .lp-gender__product-btn {
    margin-top: 15px;
    padding: 8px 23px;
    border-color: #811b1b;
    color: #811b1b;
    font-size: 11px;
  }

  #page-body .lp-gender--her .lp-gender__media--frame {
    grid-column: 1 / -1;
    width: 84.5% !important;
    margin: 4.5% 2% 12px auto !important;
    padding: 10px;
    box-sizing: border-box;
  }

  #page-body .lp-gender--her .lp-gender__media--sub1 {
    grid-column: 1 / -1;
    width: 56% !important;
    margin: -10% auto 21px 0 !important;
  }

  #page-body .lp-gender--her .lp-gender__media--sub2 {
    grid-column: 1 / -1;
    width: 49% !important;
    margin: 0 6% 43px auto !important;
  }

  #page-body .lp-gender--her .lp-gender__media--sub3 {
    grid-column: 1 / -1;
    width: 62% !important;
    margin: 10% auto 12px 21% !important;
  }

  #page-body .lp-gender--her .lp-gender__badge {
    grid-column: 1 / -1;
    justify-self: start;
    margin: -31px 0 0 2px;
    width: 29%;
  }

  #page-body .lp-gender--her .lp-gender__media--key {
    grid-column: 1 / -1;
    width: 50% !important;
    margin: -41% 0 50px auto !important;
  }

  #page-body .lp-gender--her .lp-gender__text--wallet {
    grid-column: 1 / -1;
    padding: 0 0px 39px;
    margin: 3px 6% 0 auto !important;
    background: transparent;
    color: #fff;
  }

  #page-body .lp-gender--her .lp-gender__text--key {
    padding: 28px 20px 44px;
    color: #811b1b;
    margin: -5% auto 0 0 !important;
  }
}

/* ========== Section: Gift Wrapping ========== */
#page-body .lp-wrapping {
  margin-top: 120px;
  padding: 0;
  background: #fff;
  overflow: hidden;
}

/* マーキー */
#page-body .lp-wrapping__marquee {
  overflow: hidden;
  white-space: nowrap;
  border: none;
  padding: 31px 0 42px;
}

#page-body .lp-wrapping__marquee-track {
  display: inline-flex;
  gap: 0.6em;
  animation: lp-wrapping-marquee 28s linear infinite;
  will-change: transform;
}

#page-body .lp-wrapping__marquee-track span {
  flex: 0 0 auto;
  color: #c4a56d;
  font-family: "span-compressed", serif;
  font-size: calc(50px * var(--gs-scale));
  font-weight: 300;
  font-style: normal;
  letter-spacing: 0.02em;
  line-height: 1;
}

@keyframes lp-wrapping-marquee {
  from {
    transform: translateX(0);
  }

  to {
    transform: translateX(-50%);
  }
}

/*
absolute 配置（基準幅 1200）
[見出し] [ショッパー]
[ボックス] [説明＋バッジ]
*/
#page-body .lp-wrapping__body {
  position: relative;
  width: 100%;
  max-width: 1338px;
  margin: 86px auto 0;
  padding: 0;
  aspect-ratio: 1221 / 762;
}

#page-body .lp-wrapping__message {
  position: absolute;
  top: 24.1%;
  left: 3.4%;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin: 0;
  width: 51%;
  max-width: 592px;
  z-index: 2;
}

#page-body .lp-wrapping__message-text {
  flex: 0 1 auto;
  min-width: 0;
  color: #002d56;
  font-family: "Noto Sans JP", sans-serif;
  font-size: calc(30px * var(--gs-scale-tight));
  font-weight: 700;
  letter-spacing: 0.05em;
  line-height: 1.46;
  text-align: center;
}

#page-body .lp-wrapping__bracket {
  flex: 0 0 auto;
  display: block;
  width: 30px;
  height: 179px;
  max-width: none;
  max-height: none;
}

#page-body .lp-wrapping__bag {
  position: absolute;
  top: 0;
  right: 5.2%;
  margin: 0;
  width: 46%;
  max-width: 576px;
  z-index: 1;
}

#page-body .lp-wrapping__box {
  position: absolute;
  top: 39%;
  left: 8.4%;
  margin: 0;
  width: 36%;
  max-width: 464px;
  z-index: 1;
}

#page-body .lp-wrapping__box img,
#page-body .lp-wrapping__bag img {
  display: block;
  width: 100%;
  height: auto;
}

#page-body .lp-wrapping__aside {
  position: absolute;
  top: 51.8%;
  left: 10.3%;
  margin: 0;
  width: 36%;
  max-width: 430px;
  z-index: 2;
}

#page-body .lp-wrapping__lead {
  margin: 0;
  color: #0e2841;
  font-family: "Noto Sans JP", sans-serif;
  font-size: calc(16px * var(--gs-scale-tight));
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.75;
  text-align: center;
}

#page-body .lp-wrapping__badge {
  position: absolute;
  top: 73.2%;
  right: 1.6%;
  width: 14%;
  max-width: 167px;
  height: auto;
  z-index: 3;
  pointer-events: none;
}

/* ----- SP: Gift Wrapping ----- */
@media (max-width: 767px) {
  #page-body .lp-wrapping {
    margin-top: 70px;
    padding: 0 0 17px;
  }

  #page-body .lp-wrapping__marquee {
    padding: 24px 0 108px;
  }

  #page-body .lp-wrapping__marquee-track span {
    font-size: 26px;
  }

  #page-body .lp-wrapping__body {
    display: flex;
    flex-direction: column;
    aspect-ratio: unset;
    height: auto;
    max-width: none;
    margin: 0;
    padding: 0 16px;
  }

  #page-body .lp-wrapping__message,
  #page-body .lp-wrapping__bag,
  #page-body .lp-wrapping__box,
  #page-body .lp-wrapping__aside,
  #page-body .lp-wrapping__badge {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    width: 100%;
    max-width: none;
    margin: 0;
  }

  #page-body .lp-wrapping__message {
    gap: 13px;
    margin-bottom: 18px;
    order: 1;
  }

  #page-body .lp-wrapping__message-text {
    font-size: 19px;
    line-height: 1.55;
    letter-spacing: 0;
  }

  #page-body .lp-wrapping__bracket {
    width: auto;
    height: 125px;
  }

  #page-body .lp-wrapping__aside {
    order: 2;
    margin-bottom: 41px;
  }

  #page-body .lp-wrapping__bag {
    order: 3;
    width: 97%;
    margin: 0 auto 41px;
  }

  #page-body .lp-wrapping__lead {
    font-size: 14px;
    line-height: 1.78;
    letter-spacing: 0.05em;
    text-align: center;
  }

  #page-body .lp-wrapping__badge {
    order: 4;
    display: block;
    width: 84px;
    max-width: none;
    margin: -21% -2% 0 auto;
  }
}

/* ========== Section: Lineup ========== */
#page-body .lp-lineup {
  padding: 99px 40px 100px;
  background: #0e2841;
  color: #fff;
}

#page-body .lp-lineup__title {
  margin: 0 auto;
  line-height: 0;
  text-align: center;
}

#page-body .lp-lineup__title-img {
  display: inline-block;
  width: auto;
  height: auto;
  max-width: 634px;
  margin: 0 auto;
}

#page-body .lp-lineup__list {
  display: flex;
  justify-content: center;
  gap: 23px;
  max-width: 980px;
  margin: 80px auto 0;
}

#page-body .lp-lineup__item {
  flex: 0 1 480px;
  width: 100%;
  max-width: 480px;
  text-align: left;
}

#page-body .lp-lineup__photo {
  margin: 0;
  background: none;
  padding: 0;
}

#page-body .lp-lineup__photo img {
  display: block;
  width: 100%;
  height: auto;
}

#page-body .lp-lineup__name {
  margin: 14px 0 0;
  color: #fff;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.04em;
  line-height: 1.6;
}

#page-body .lp-lineup__price {
  margin: 3px 0 0;
  color: #fff;
  font-family: "Montserrat", "Noto Sans JP", sans-serif;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.04em;
  line-height: 1.6;
}

#page-body .lp-lineup__delivery {
  margin: 3px 0 0;
  color: #fff;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.04em;
  line-height: 1.6;
}

#page-body .lp-lineup__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  margin-top: 20px;
  margin-left: 2px;
  padding: 9px 30px 10px 30px;
  border: 1px solid #fff;
  background: transparent;
  color: #fff;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.06em;
  line-height: 1;
  text-decoration: none;
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

#page-body .lp-lineup__btn:hover {
  opacity: 1;
  background: #fff;
  color: #001529;
}

@media (max-width: 767px) {
  #page-body .lp-lineup {
    padding: 54px 16px 12px;
  }

  #page-body .lp-lineup__title-img {
    max-width: 212px;
  }

  #page-body .lp-lineup__list {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
    margin-top: 53px;
  }

  #page-body .lp-lineup__item {
    max-width: 98%;
    margin: 0 auto;
  }

  #page-body .lp-lineup__name,
  #page-body .lp-lineup__price,
  #page-body .lp-lineup__delivery {
    font-size: 12px;
  }

  #page-body .lp-lineup__name {
    margin-top: 8px;
  }

  #page-body .lp-lineup__btn {
    font-size: 12px;
    margin-top: 16px;
    padding: 8px 23px 8px 21px;
  }
}

/* ========== Section: ご予約について ========== */
#page-body .lp-reserve {
  padding: 92px 20px 0;
  background: #fff;
  text-align: center;
}

#page-body .lp-reserve__title {
  margin: 0;
  color: #0e2841;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 25px;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1.4;
  text-align: center;
}

#page-body .lp-reserve__list {
  box-sizing: border-box;
  width: fit-content;
  max-width: 747px;
  margin: 17px auto 0;
  padding: 0;
  list-style: none;
  text-align: left;
}

#page-body .lp-reserve__list li {
  margin: 0;
  padding: 0;
  color: #0e2841;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.06em;
  line-height: 1.75;
}

#page-body .lp-reserve__btn {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  max-width: 600px;
  margin: 52px auto 0;
  padding: 28px 28px;
  border: 1px solid #1c1c1c;
  background: #1c1c1c;
  color: #fff;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.4;
  text-decoration: none;
  border-radius: 5px;
  transition: background-color 0.3s ease, color 0.3s ease, border-color 0.3s ease;
}

#page-body .lp-reserve__btn-text {
  flex: 1 1 auto;
  text-align: center;
}

#page-body .lp-reserve__btn-arrow {
  box-sizing: border-box;
  flex: 0 0 auto;
  display: block;
  width: 11px;
  height: 11px;
  margin-left: 16px;
  position: relative;
  border-top: 1px solid #fff;
  border-right: 1px solid #fff;
  transform: rotate(45deg);
}

#page-body .lp-reserve__btn:hover {
  opacity: 1;
  background: #fff;
  color: #1c1c1c;
}

#page-body .lp-reserve__btn:hover .lp-reserve__btn-arrow {
  border-top-color: #1c1c1c;
  border-right-color: #1c1c1c;
}

#page-body .lp-reserve__back {
  margin: 56px 0 0;
  text-align: center;
}

#page-body .lp-reserve__back a {
  color: #001529;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 0.06em;
  line-height: 1.4;
  text-decoration: none;
}

#page-body .lp-reserve__back a:hover {
  opacity: 0.7;
}

@media (max-width: 767px) {
  #page-body .lp-reserve {
    padding: 43px 16px 30px;
  }

  #page-body .lp-reserve__title {
    font-size: 22px;
  }

  #page-body .lp-reserve__list {
    max-width: 98%;
    margin-top: 20px;
  }

  #page-body .lp-reserve__list li {
    font-size: 12px;
    line-height: 2.08;
  }

  #page-body .lp-reserve__btn {
    max-width: 98%;
    margin-top: 44px;
    padding: 25px 20px;
    font-size: 15px;
  }

  #page-body .lp-reserve__back {
    margin-top: 40px;
  }
}

/* ========== Section: LP footer (preview) ========== */
#page-body .lp-site-footer {
  padding: 56px 20px 40px;
  background: var(--gs-footer);
  color: rgba(255, 255, 255, 0.75);
  font-size: 11px;
  letter-spacing: 0.06em;
  line-height: 1.8;
}

#page-body .lp-site-footer__grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 24px;
  max-width: 1100px;
  margin: 0 auto;
}

#page-body .lp-site-footer__col h3 {
  margin-bottom: 12px;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.14em;
}

#page-body .lp-site-footer__copy {
  max-width: 1100px;
  margin: 32px auto 0;
  padding-top: 24px;
  border-top: 1px solid rgba(255, 255, 255, 0.15);
  text-align: center;
  font-size: 10px;
}

@media (max-width: 767px) {
  #page-body .lp-site-footer__grid {
    grid-template-columns: 1fr 1fr;
  }
}

/* ========== Section: Back to top (EC common) ========== */
#page-body .main-footer {
  width: 100%;
  margin-top: 20px;
  padding: 56px 0 63px;
  background: #FFF;
  text-align: center;
}

#page-body .main-footer a {
  font-weight: 600;
  font-size: 18px;
  line-height: 1;
  letter-spacing: 0.1em;
  color: #262626;
}

#page-body .main-footer a .arrow {
  position: relative;
  display: inline-block;
  margin-right: 15px;
  padding: 10px;
}

#page-body .main-footer a .arrow::before {
  content: "";
  position: absolute;
  left: 10px;
  top: 8px;
  width: 10px;
  height: 10px;
  border-top: solid 1px #262626;
  border-right: solid 1px #262626;
  transform: rotate(-135deg);
}

@media (max-width: 767px) {
  #page-body .main-footer a {
    font-size: 15px;
    margin-top: 24px;
    padding: 56px 0 11px;
  }
}
