:root {
  --color-pink-01:   #ffe4e1;
  --color-pink-02:   #f4acb3;
  --color-beige:     #ffd8d2;
  --color-mauve:     #b56c71;
  --color-accent-1:  #da507d;
  --color-accent-2:  #fd9082;
  --color-text:      #595757;
  --color-text-2:    #864c4d;
  --color-white:     #ffffff;
  --color-black:     #000000;
  --color-pink-grad: #f6bdc0;
  --font-en:    'Bodoni Moda', serif;
  --font-ja:    'Noto Sans JP', sans-serif;
  --font-serif: 'Noto Serif JP', serif;
  --font-num:   'Be Vietnam Pro', var(--font-ja);
  --fz-h2:       3rem;
  --fz-h3:       2.5rem;
  --fz-h4:       2rem;
  --fz-h5:       1.5rem;
  --fz-body:     1.125rem;
  --fz-caption:  0.875rem;
  --sp-0:   0;
  --sp-xs:  0.25rem;
  --sp-sm:  0.5rem;
  --sp-md:  0.75rem;
  --sp-md2: 1rem;
  --sp-lg:  1.5rem;
  --sp-xl:  2rem;
  --mg-md:  3rem;
  --mg-lg:  4rem;
  --mg-xl:  8rem;
  --side-space:    7.5rem;
  --side-space-02: 5.5rem;
  --radius-24:   1.5rem;
  --radius-full: 62.4375rem;
  --content-w: 31.25rem;
  --gutter: 2rem;
  --mv-body-delay: .95s;
  --mv-body-step:  .22s;
  --mv-body-ease:  cubic-bezier(.22, .61, .36, 1);
}
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

html {
  font-size: 16px;
}

@media (max-width: 767px) {
  html {
    font-size: 3.2vw;
  }
}

body {
  font-family: var(--font-ja);
  font-size: 1rem;
  line-height: 1.7;
  color: var(--color-text);
  background-color: var(--color-white);
  overflow-x: clip;
}

img {
  max-width: 100%;
  height: auto;
  display: block;
}

a {
  color: inherit;
  text-decoration: none;
}

button {
  font: inherit;
  color: inherit;
  background: none;
  border: none;
  cursor: pointer;
}
html.is-loading,
html.is-navopen {
  overflow: hidden;
}
.container {
  width: 31.25rem;
  margin: 0 auto;
  padding: 0 1.25rem;
}

.inner {
  max-width: 31.25rem;
  margin: 0 auto;
}

@media (max-width: 767px) {
  .container {
    width: 100%;
    padding: 0 1rem;
  }
  .inner {
    max-width: 100%;
  }
}
.pc-only { display: block; }
.sp-only { display: none; }

@media (max-width: 767px) {
  .pc-only { display: none; }
  .sp-only { display: block; }
}
.js-blur-in .ch,
.js-focus-in .ch {
  display: inline-block;
  vertical-align: top;
  white-space: pre;
  opacity: 0;
}
.js-focus-in.is-unit {
  opacity: 0;
}

.js-blur-in.is-in .ch {
  animation: text-blur-in .8s ease forwards;
  animation-delay: calc(var(--base, 0s) + var(--i) * var(--step, .05s));
}

.js-focus-in.is-in .ch,
.js-focus-in.is-unit.is-in {
  animation: text-focus-in .8s ease forwards;
  animation-delay: calc(var(--base, 0s) + var(--i) * var(--step, .05s));
}

@keyframes text-blur-in {
  from { opacity: 0; filter: blur(0.75rem); transform: scale(1.1); }
  to   { opacity: 1; filter: blur(0);    transform: scale(1); }
}

@keyframes text-focus-in {
  from { opacity: 0; filter: blur(0.75rem); transform: scale(1.5); }
  to   { opacity: 1; filter: blur(0);    transform: scale(1); }
}
.js-blur-in.is-done .ch,
.js-focus-in.is-done .ch,
.js-focus-in.is-unit.is-done {
  animation: none;
  opacity: 1;
  filter: none;
  transform: none;
}
.js-fade.is-anim,
.js-fade--up.is-anim,
.js-fade--blur.is-anim {
  will-change: transform, opacity, filter;
}
.loading {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(180deg, var(--color-pink-01), var(--color-pink-grad));
}
.loading__weave {
  position: absolute;
  inset: 0;
  overflow: hidden;
  pointer-events: none;
}

.loading__thread {
  position: absolute;
  display: block;
}
.loading__logo {
  position: relative;
  width: 25.8125rem;
  height: auto;
}

.loading__thread--v {
  top: 0;
  height: 100%;
  width: var(--w, 1px);
}

.loading__thread--h {
  left: 0;
  width: 100%;
  height: var(--w, 1px);
}

.loading__thread::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  display: block;
  animation-duration: 10s;
  animation-delay: var(--delay, 0s);
  animation-iteration-count: infinite;
  animation-timing-function: cubic-bezier(.4, .26, 0, .97);
}

.loading__thread--v::after {
  width: 100%;
  height: 15vh;
  background: linear-gradient(to bottom, transparent 0%, var(--c) 75%, var(--c) 100%);
  animation-name: thread-v;
}

.loading__thread--h::after {
  height: 100%;
  width: 15vw;
  background: linear-gradient(to right, transparent 0%, var(--c) 75%, var(--c) 100%);
  animation-name: thread-h;
}
@keyframes thread-v {
  from { transform: translate3d(0, -50vh, 0); }
  to   { transform: translate3d(0, 110vh, 0); }
}

@keyframes thread-h {
  from { transform: translate3d(-50vw, 0, 0); }
  to   { transform: translate3d(110vw, 0, 0); }
}
.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 100;
}

.header__inner {
  display: flex;
  align-items: center;
  justify-content: flex-end;
  position: relative;
  z-index: 2;
  max-width: var(--content-w);
  height: 4rem;
  margin: 0 auto;
  padding: var(--sp-md2) var(--sp-xl);
  background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(134, 76, 77, .3) 100%);
}

.header__menu-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 6.125rem;
  padding: var(--sp-sm) var(--sp-md2);
  border-radius: var(--radius-24);
  background: var(--color-pink-01);
  color: var(--color-mauve);
  font-family: var(--font-en);
  font-weight: 513;
  font-variation-settings: 'opsz' 6;
  font-size: var(--fz-body);
  line-height: 1.5;
  letter-spacing: .36px;
}
.header__menu-label {
  text-box: trim-both cap alphabetic;
}
@media (min-width: 768px) {
  .header__inner {
    max-width: none;
  }
}
@media (min-width: 1400px) {
  .header {
    display: none;
  }
}

.header__menu-label--close { display: none; }

.header__menu-btn.is-open .header__menu-label--open  { display: none; }
.header__menu-btn.is-open .header__menu-label--close { display: block; }
.header__menu-btn.is-open {
  background: var(--color-white);
}
.header__nav {
  position: fixed;
  inset: 0;
  z-index: 1;
  visibility: hidden;
  opacity: 0;
  transition: opacity .4s ease, visibility 0s linear .4s;
}

.header__nav.is-open {
  visibility: visible;
  opacity: 1;
  transition: opacity .4s ease, visibility 0s linear 0s;
}

.header__nav-inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--mg-xl);
  max-width: var(--content-w);
  height: 100%;
  margin: 0 auto;
  padding: var(--side-space) 0 var(--mg-lg);
  background: linear-gradient(180deg, var(--color-pink-01) 0%, var(--color-pink-grad) 100%);
  overflow-y: auto;
}

.header__nav-body {
  display: flex;
  flex-direction: column;
  gap: var(--mg-md);
  width: 100%;
}

.header__nav-title {
  width: 100%;
  font-family: var(--font-en);
  font-weight: 400;
  font-variation-settings: 'opsz' 9;
  font-size: var(--fz-h2);
  line-height: 1;
  letter-spacing: 0.24rem;
  color: var(--color-mauve);
  text-align: center;
}

.header__nav-list {
  display: flex;
  flex-direction: column;
  gap: var(--sp-xl);
  width: 100%;
  padding: 0 var(--side-space-02);
  list-style: none;
}

.header__nav-list li {
  display: flex;
  align-items: center;
  gap: var(--sp-sm);
}
.header__nav-list li::before {
  content: "";
  flex-shrink: 0;
  width: 0.1875rem;
  height: 0.1875rem;
  border-radius: 50%;
  background: #d9d9d9;
}

.header__nav-link {
  flex: 1 0 0;
  min-width: 0;
  font-family: var(--font-en);
  font-weight: 449;
  font-variation-settings: 'opsz' 6;
  font-size: var(--fz-h5);
  line-height: 1.5;
  color: var(--color-mauve);
  text-box: trim-both cap alphabetic;
}

.header__nav-official {
  width: 100%;
  padding: 0 var(--side-space-02);
}

.header__nav-official a {
  display: block;
  padding: var(--sp-lg) 0;
  border-top: 1px solid var(--color-mauve);
  border-bottom: 1px solid var(--color-mauve);
  font-family: var(--font-ja);
  font-size: var(--fz-body);
  line-height: 1;
  color: var(--color-mauve);
  text-align: center;
}

.header__nav-logo {
  width: 20rem;
}

.header__nav-logo img {
  width: 100%;
  height: auto;

}
@media (min-width: 768px) {
  .header__nav-inner {
    max-width: none;
  }

  .header__nav-body {
    max-width: var(--content-w);
  }
}
.pcnav {
  display: none;
}

@media (min-width: 1400px) {
  .pcnav {
    display: block;
    position: fixed;
    top: 5rem;
    left: calc(75% - 4.875rem);
    z-index: 90;
    width: 25.375rem;
    max-height: calc(100dvh - 10rem);
    overflow-y: auto;
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translateX(1rem);
    transition: opacity .4s ease, transform .4s ease, visibility 0s linear .4s;
  }

  .pcnav.is-visible {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    transform: translateX(0);
    transition: opacity .4s ease, transform .4s ease, visibility 0s linear 0s;
  }

  .pcnav__inner {
    display: flex;
    flex-direction: column;
    gap: var(--mg-md);
    padding: var(--mg-lg) 0;
    background: linear-gradient(180deg, var(--color-pink-01) 0%, var(--color-pink-grad) 100%);
  }
  .pcnav .header__nav-link {
    text-align: center;
  }
}
.mv {
  background-color: var(--color-mauve);
}

.mv__visual {
  max-width: var(--content-w);
  margin: 0 auto;
}
.mv__kv {
  display: none;
}

@media (min-width: 768px) {
  .mv__kv {
    display: block;
    position: relative;
    height: 52.7778vw;
    max-height: 47.5rem;
    background-color: var(--color-white);
    overflow: hidden;
  }
  .mv__kv-bg {
    position: absolute;
    inset: -10% 0;
    will-change: transform;
  }

  .mv__kv-img,
  .mv__kv-img img {
    display: block;
    width: 100%;
    height: 100%;
  }

  .mv__kv-img img {
    object-fit: cover;
  }
  .mv__kv::after {
    content: '';
    position: absolute;
    top: 30.6579%;
    left: min(62.3611vw, calc(50% + 11.125rem));
    width: min(27.7548vw, 24.97931rem);
    aspect-ratio: 399.669 / 457.5;
    background: url('../img/kv_lockup.png') no-repeat center / 100% 100%;
  }
  .mv__kv.is-lockup-hold::after {
    opacity: 0;
  }

  .mv__kv.is-lockup-in::after {
    animation: kv-lockup-in 1.2s cubic-bezier(.22, .61, .36, 1) forwards;
  }

  .mv__visual {
    display: none;
  }
}

@keyframes kv-lockup-in {
  from { opacity: 0; filter: blur(0.625rem); transform: scale(1.06); }
  to   { opacity: 1; filter: blur(0);    transform: scale(1); }
}

.mv__img img {
  width: 100%;
  height: auto;
}
.mv.is-body-in .mv__lockup,
.mv.is-body-in .mv__release {
  animation: mv-body-in .9s var(--mv-body-ease) both;
}

.mv.is-body-in .mv__lockup  { animation-delay: var(--mv-body-delay); }
.mv.is-body-in .mv__release { animation-delay: calc(var(--mv-body-delay) + var(--mv-body-step)); }
.mv__lead { --base: calc(var(--mv-body-delay) + var(--mv-body-step) * 2); }

@keyframes mv-body-in {
  from { opacity: 0; transform: translateY(0.875rem); }
  to   { opacity: 1; transform: none; }
}

.mv__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sp-lg);
  overflow: clip;
  max-width: var(--content-w);
  margin: 0 auto;
    padding: var(--mg-lg) var(--mg-md);
  /* padding: 11%; */
  scale: 0.98;
}
.mv__lockup {
  position: relative;
  width: 24.8125rem;
  height: 8.5625rem;
}

.mv__lockup img {
  position: absolute;
  top: 0;
  left: -2.0625rem;
  width: 28.9375rem;
  height: 14.0625rem;
  max-width: none;
}

.mv__release {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-xs);
  width: 100%;
    padding: 1%;
  background: rgba(255, 255, 255, .82);
  color: var(--color-mauve);
    margin-top: 3%;
}

.mv__release-date,
.mv__release-day {
  font-family: var(--font-en);
  font-weight: 500;
  font-variation-settings: 'opsz' 6;
  font-size: var(--fz-h5);
  line-height: 1.5;
}

.mv__release-day {
  padding: 0 0.375rem;
}

.mv__release-label {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: var(--fz-h5);
  line-height: 1.5;
  letter-spacing: .48px;
}

.mv__lead {
  width: 100%;
  padding-top: var(--sp-md2);
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--fz-body);
  line-height: 1.6;
  letter-spacing: 1.44px;
  color: var(--color-white);
  text-align: center;
}
.c-btn-outline {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  padding: var(--sp-md2) var(--sp-lg);
  border: 1px solid var(--color-mauve);
  border-radius: var(--radius-full);
  background: transparent;
  color: var(--color-mauve);
  font-family: var(--font-ja);
  font-weight: 700;
  font-size: var(--fz-body);
  line-height: 1.6;
  transition: background-color .3s ease, color .3s ease;
}
.c-btn-outline::before {
  content: "";
  width: 1.25rem;
}
.c-btn-outline__arrow {
  width: 1.28125rem;
  height: 0.3625rem;
  background-color: currentColor;
  -webkit-mask: url(../img/arrow.png) no-repeat center / 100% 100%;
  mask: url(../img/arrow.png) no-repeat center / 100% 100%;
}
.c-btn-outline--fill {
  background: var(--color-mauve);
  color: var(--color-white);
}
@media (hover: hover) {
  .c-btn-outline:hover {
    background: var(--color-mauve);
    color: var(--color-white);
  }

  .c-btn-outline--fill:hover {
    background: var(--color-white);
    color: var(--color-mauve);
  }
}
.c-label {
  --label-bg: var(--color-mauve);
  --label-fg: var(--color-white);
  display: flex;
}

.c-label span {
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--label-bg);
  color: var(--label-fg);
}
.campaign {
  padding: var(--sp-lg) var(--sp-lg) var(--side-space-02);
  background-color: var(--color-mauve);
}

.campaign__card {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-md2);
  max-width: 28.25rem;
  margin: 0 auto;
  padding: var(--sp-xl);
  background: linear-gradient(180deg, var(--color-pink-01) 0%, var(--color-pink-grad) 100%);
}
.campaign__card > .c-btn-outline {
  margin-bottom: var(--sp-xl);
}

.campaign__title {
  width: 100%;
  font-family: var(--font-en);
  font-weight: 471;
  font-variation-settings: 'opsz' 9;
  font-size: var(--fz-h3);
  line-height: 1.5;
  color: var(--color-mauve);
  text-align: center;
}

.campaign__period {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-md);
  padding-bottom: var(--sp-xs);
  border-bottom: 1px solid var(--color-mauve);
  font-family: var(--font-num);
  font-size: var(--fz-body);
  line-height: 1.5;
  color: var(--color-mauve);
  white-space: nowrap;
}

.campaign__period-set {
  display: flex;
  align-items: center;
  gap: var(--sp-xs);
}

.campaign__period-date {
  letter-spacing: .36px;
}
.campaign__pattern {
  display: flex;
  flex-direction: column;
  gap: var(--sp-md2);
  width: 100%;
}
.campaign__gift-group {
  display: flex;
  flex-direction: column;
  gap: var(--sp-sm);
  width: 100%;
}
.campaign__note {
  padding-left: var(--sp-md2);
  font-family: var(--font-ja);
  font-size: var(--fz-caption);
  line-height: 1.8;
  color: var(--color-mauve);
}
.campaign__note--center {
  padding-left: 0;
  text-align: center;
}
.campaign__pattern--single .campaign__read {
  padding-bottom: 0;
}

.campaign__pattern--single .campaign__gifts {
  padding-inline: var(--side-space-02);
}

.campaign__pattern--single .campaign__gift {
  gap: 0;
  padding: 0;
}
.campaign__pattern--single .campaign__gift-img {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 10rem;
}

.campaign__pattern--single .campaign__gift-img img {
  width: 8.75rem;
}

.campaign__read {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sp-sm);
  width: 100%;
  padding-bottom: 1.5rem;
  color: var(--color-mauve);
  text-align: center;
}

.campaign__read-sub {
  font-size: var(--fz-caption);
  line-height: 1.8;
}

.campaign__read-main {
  font-weight: 700;
  font-size: var(--fz-body);
  line-height: 1.5;
  letter-spacing: 1.44px;
}
.campaign__gifts {
  display: flex;
  align-items: center;
  gap: var(--sp-sm);
  width: 100%;
}

.campaign__gift {
  position: relative;
  display: flex;
  flex: 1 0 0;
  flex-direction: column;
  gap: var(--sp-md);
  min-width: 0;
  padding: var(--sp-md2);
    scale: 1.1;
}

.campaign__gift-img {
  filter: drop-shadow(0 0.5rem 1rem rgba(139, 80, 86, .23));
}

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

.campaign__gift-label {
  width: 100%;
  height: 1.625rem;
}

.campaign__gift-label span {
  flex: 1 0 0;
  min-width: 0;
  font-weight: 500;
  font-size: var(--fz-caption);
  line-height: 2;
  letter-spacing: 1.12px;
}
.campaign__gift--bonus {
  padding-top: 1.75rem;
  gap: 0;
}

.campaign__gift--bonus .campaign__gift-label {
  --label-bg: var(--color-pink-02);
  --label-fg: var(--color-text-2);
}

.campaign__gift--bonus .campaign__gift-label span {
  font-weight: 700;
}

.campaign__gift-badge {
    position: absolute;
    top: -1.0rem;
    right: -0.6rem;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 5rem;
    height: 5rem;
    border-radius: var(--radius-full);
    background: var(--color-pink-02);
    color: var(--color-text-2);
    font-weight: 700;
    font-size: 0.75rem;
    line-height: 1.2;
    letter-spacing: .96px;
    text-align: center;
}

.campaign__plus {
  flex-shrink: 0;
  width: 1.75rem;
}
.campaign__set {
  position: relative;
  width: 100%;
  height: 10.25rem;
}

.campaign__set::before {
  content: "";
  position: absolute;
  top: 1.6875rem;
  left: 3.6875rem;
  width: 20.5625rem;
  height: 7.1875rem;
  background: var(--color-mauve);
}

.campaign__set-img {
  position: absolute;
  top: 0.75rem;
  left: 0;
  width: 8.75rem;
  filter:
    drop-shadow(0 0.25rem 0.5625rem rgba(139, 80, 86, .26))
    drop-shadow(0 1rem 1rem rgba(139, 80, 86, .23))
    drop-shadow(0 2.1875rem 1.3125rem rgba(139, 80, 86, .13))
    drop-shadow(0 3.9375rem 1.5625rem rgba(139, 80, 86, .04));
}

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

.campaign__set-body {
  position: absolute;
  top: 2.90625rem;
  left: 9rem;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-sm);
  width: 13.75rem;
    scale: 1.05;
}

.campaign__set-label {
  font-weight: 500;
  font-size: 0.75rem;
  line-height: 1.6;
  letter-spacing: .96px;
  color: var(--color-white);
  text-decoration: underline;
}

.campaign__set-text {
  font-size: var(--fz-caption);
  line-height: 1.6;
  letter-spacing: .28px;
  color: var(--color-white);
  text-align: center;
}

.campaign__set-text b {
  font-weight: 700;
}
.coffret {
  background-color: var(--color-pink-01);
}
@media (min-width: 768px) {
  .coffret {
    padding-top: var(--mg-md);
  }

  .items {
    padding-bottom: var(--mg-md);
  }
}

.coffret__inner {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: var(--sp-md2);
  max-width: var(--content-w);
  margin: 0 auto;
  padding: var(--side-space-02) var(--gutter) var(--mg-md);
}

.coffret__inner > * {
  position: relative;
  z-index: 1;
}
.coffret__title {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  font-family: var(--font-en);
  font-weight: 400;
  font-variation-settings: 'opsz' 15;
  color: var(--color-text-2);
  white-space: nowrap;
}

.coffret__title-sub {
  font-size: var(--fz-h5);
  line-height: 1.5;
}

.coffret__title-main {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-xs);
  width: 100%;
}

.coffret__title-year {
  font-size: 2.75rem;
  line-height: 1.5;
  letter-spacing: 1.76px;
}
.coffret__title-name {
  font-size: var(--fz-h2);
  line-height: 1.5;
}
.coffret__visual {
  height: 22.5rem;
  width: 100%;
}

.coffret__item {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
    filter: drop-shadow(0 0.5625rem 1.3125rem #a8676018) drop-shadow(0 2.375rem 2.375rem #a8676018) drop-shadow(0 5.3125rem 3.1875rem #a8676018);
}

.coffret__item img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.coffret__item--box     { bottom: 0.9375rem;  width: 24.5rem; height: 24.5rem; }
.coffret__item--palette { bottom: -1.125rem; left: calc(50% - 7.9375rem);   width: 11.25rem; height: 11.25rem; }
.coffret__item--base    { bottom: -3.9375rem; left: calc(50% - 0.5rem);     width: 9.5rem; height: 18.9375rem; }
.coffret__item--lip     { bottom: -5.3125rem; left: calc(50% + 10.96875rem); width: 7.1875rem; height: 20.25rem; }
.coffret__item--powder  { bottom: -2.6875rem; left: calc(50% + 5.1875rem);    width: 15rem; height: 15rem; }
.coffret__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sp-md);
  width: 100%;
  padding: var(--sp-xs) 0 var(--sp-md2);
}

.coffret__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-md2);
  width: 100%;
  padding: var(--sp-md) 0 var(--sp-lg);
  border-bottom: 1px solid rgba(89, 87, 87, .4);
}

.coffret__name {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-sm);
}

.coffret__name-ja {
  /* font-family: var(--font-serif); */
  font-weight: 500;
  font-size: var(--fz-h5);
  line-height: 1.5;
  color: var(--color-text);
}

.coffret__limited {
  --label-bg: var(--color-accent-1);
}

.coffret__limited span {
  padding: var(--sp-sm) var(--sp-md);
  font-weight: 500;
  font-size: 0.75rem;
  line-height: 1.5;
}

.coffret__text {
  width: 100%;
  font-weight: 500;
  font-size: var(--fz-body);
  line-height: 1.5;
  color: var(--color-text);
}
.coffret__price {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 0.125rem;
  color: var(--color-text);
  font-weight: 500;
}

.coffret__price-num {
  font-size: var(--fz-h5);
  line-height: 1.5;
}

.coffret__price-unit {
  width: 0.75rem;
  padding-bottom: 0.1875rem;
  font-size: var(--fz-caption);
  line-height: 1.5;
  text-align: center;
}

.coffret__price-tax {
  margin-left: var(--sp-sm);
  padding-bottom: 0.1875rem;
  font-size: var(--fz-caption);
  line-height: 1.5;
}

.coffret__price-ship {
  margin-left: var(--sp-sm);
  padding: var(--sp-sm);
  border: 1px solid var(--color-text);
  font-size: 1rem;
  line-height: 1.5;
}
.coffret__cta.is-fixed {
  z-index: 90;
  height: var(--cta-h);
}

.coffret__cta.is-fixed .c-btn-outline {
  position: fixed;
  left: 0;
  right: 0;
  bottom: var(--sp-lg);
  z-index: 90;
  margin-inline: auto;
  max-width: calc(var(--content-w) - var(--gutter) * 2);
  transition: background-color .3s ease, color .3s ease, opacity .4s ease;
}
.coffret__cta.is-done .c-btn-outline {
  opacity: 0;
  pointer-events: none;
}
.items {
  background-color: var(--color-pink-01);
}

.items__inner {
  position: relative;
  display: flex;
  flex-direction: column;
  /* gap: var(--side-space-02); */
  max-width: var(--content-w);
  margin: 0 auto;
  padding: var(--sp-lg) var(--gutter) var(--side-space-02);
}

.items__inner > * {
  position: relative;
  z-index: 1;
}
.items__intro {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sp-lg);
}

.items__title {
  font-family: var(--font-en);
  font-weight: 400;
  font-variation-settings: 'opsz' 15;
  font-size: var(--fz-h2);
  line-height: 1.5;
  color: var(--color-text-2);
}

.items__lead {
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: var(--fz-body);
  line-height: 1.5;
  letter-spacing: .72px;
  color: var(--color-text-2);
  text-align: center;
}
.items__stack-inner {
  display: flex;
  flex-direction: column;
  gap: var(--side-space-02);
}
.items {
  --stack-top: max(4.75rem, calc((100svh - 40.4375rem) / 2));
}

@media (min-width: 1400px) {
  .items {
    --stack-top: max(2rem, calc((100svh - 40.4375rem) / 2));
  }
}

@media (max-width: 767px) and (max-aspect-ratio: 69/100),
       (min-width: 768px) and (max-width: 1399px) and (min-height: 730px),
       (min-width: 1400px) and (min-height: 690px) {
  .items {
    --stack-step: 62svh;
  }
  .items__stack {
    height: calc(100svh + 3 * var(--stack-step));
  }

  .items__stack-inner {
    position: sticky;
    top: 0;
    display: grid;
    grid-template-columns: 100%;
    align-content: start;
    height: 100svh;
    padding-top: var(--stack-top);
    /* padding-top: 23%; */
    overflow: hidden;
  }

  .items__card {
    grid-area: 1 / 1;
  }
}

@media (min-width: 450px) {
  .items__stack {
    margin-top: 10%;
  }  
}

.items__card {
  display: flex;
  flex-direction: column;
  background: linear-gradient(180deg, var(--color-pink-01) 0%, var(--color-pink-grad) 100%);
  --shadow-a: 1;
  box-shadow:
    0 0.375rem 0.4375rem rgba(118, 65, 65, calc(.1 * var(--shadow-a))),
    0 1.5625rem 0.78125rem rgba(118, 65, 65, calc(.09 * var(--shadow-a))),
    0 3.5625rem 1.0625rem rgba(118, 65, 65, calc(.05 * var(--shadow-a))),
    0 6.3125rem 1.28125rem rgba(118, 65, 65, calc(.01 * var(--shadow-a)));
}

.items__visual {
  position: relative;
  height: 21.25rem;
}

.items__photo {
  display: block;
  position: relative;
  height: 100%;
  overflow: hidden;
}

.items__photo img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.items__en {
  animation: item-en-focus 1s cubic-bezier(.2, .7, .2, 1) both;
}

@keyframes item-en-focus {
  from { filter: blur(0.375rem); letter-spacing: .07em; }
  to   { filter: blur(0);   letter-spacing: 0; }
}
.items__en {
  position: absolute;
  top: -2rem;
  /* left: 0.4375rem; */
  z-index: 1;
  display: flex;
  align-items: center;
  width: 100%;
  padding: var(--sp-sm);
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: 2.15rem;
  line-height: 1.2;
  color: var(--color-text-2);
  text-shadow:
    0 1px 0.1875rem rgba(254, 243, 241, .2),
    0 0 0.125rem rgba(254, 229, 224, .45);
}

.items__en--right {
  justify-content: flex-end;
  text-align: right;
}
.items__count {
  position: absolute;
  top: 19.4375rem;
  left: calc(50% + 8.9375rem);
  transform: translateX(-50%);
  display: flex;
  align-items: flex-end;
  gap: var(--sp-xs);
  font-family: var(--font-serif);
  color: var(--color-white);
  /* filter:
    drop-shadow(0 1px 1.5px rgba(101, 42, 42, .4))
    drop-shadow(0 0.3125rem 0.15625rem rgba(101, 42, 42, .17))
    drop-shadow(0 0.75rem 0.21875rem rgba(101, 42, 42, .1)); */
    scale: 0.98;
    filter: drop-shadow(1.5px 1.5px 1.5px #460b0970);
}

.items__count-label,
.items__count-num {
  font-weight: 600;
  font-size: var(--fz-body);
  line-height: 1.6;
}

.items__count-sep {
  margin: 0 0.125rem;
  font-weight: 400;
  font-size: var(--fz-caption);
  line-height: 1.6;
}

.items__count-line {
  width: 0.5rem;
  height: 1px;
  margin-bottom: .55em;
  background: currentColor;
}
.items__body {
  display: flex;
  flex-direction: column;
  gap: var(--sp-sm);
  padding: 0 var(--sp-lg) var(--sp-lg);
}

.items__head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-md2);
    padding: 1.2rem 0 1.5rem;
  border-bottom: 1px solid rgba(89, 87, 87, .25);
}

.items__name-group {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sp-md);
  width: 100%;
}

.items__name {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-sm);
  font-weight: 700;
  font-size: 1.0625rem;
  line-height: 1.5;
  color: var(--color-mauve);
  text-align: center;
}
.items__name span {
  flex-shrink: 0;
  white-space: nowrap;
}

.items__badges {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: var(--sp-md);
  width: 100%;
}

.items__badge {
  --label-bg: var(--color-accent-1);
  width: 9.375rem;
}

.items__badge--spf {
  --label-bg: var(--color-accent-2);
}

.items__badge span {
  flex: 1 0 0;
  min-width: 0;
  padding: var(--sp-xs) var(--sp-md);
  font-weight: 500;
  font-size: 0.75rem;
  line-height: 1.5;
}

.items__copy {
  font-weight: 400;
    font-size: 1.05rem;
  line-height: 1.5;
  letter-spacing: .72px;
  color: var(--color-text);
  text-align: center;
  font-feature-settings: 'halt' 1;
}
.items__mark {
  font-size: 0.72563rem;
}

.items__color {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: var(--sp-md);
  padding-top: var(--sp-sm);
}

.items__color-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  align-self: stretch;
  width: 4.125rem;
  padding: var(--sp-xs) var(--sp-sm);
  background: var(--color-pink-01);
  color: var(--color-text-2);
  font-family: var(--font-en);
  font-weight: 500;
  font-size: var(--fz-caption);
  line-height: 1.5;
  transition: background-color .3s ease, color .3s ease;
}

@media (hover: hover) {
  .items__color-btn:hover {
    background: var(--color-text-2);
    color: var(--color-pink-01);
  }
}

.items__color-text {
  display: flex;
  flex: 1 0 0;
  flex-direction: column;
  justify-content: center;
  min-width: 0;
  height: 2.625rem;
  font-weight: 500;
  font-size: var(--fz-caption);
  line-height: 1.5;
  color: var(--color-text-2);
}

.items__note {
  font-weight: 500;
  font-size: 0.625rem;
  line-height: 1.5;
  letter-spacing: .4px;
  color: var(--color-text);
  font-feature-settings: 'halt' 1;
}
.modal {
  position: fixed;
  inset: 0;
  z-index: 200;
  display: none;
}

.modal.is-open {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: auto;
}
.modal__overlay {
  position: fixed;
  inset: 0;
  opacity: .8;
  background-color: #1e1e1e;
}

.modal__body {
  position: relative;
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 0.5rem;
  width: var(--content-w);
  margin: auto;
  padding: 4rem 1.5rem;
}
.modal__body:focus {
  outline: none;
}

.modal__frame {
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.5rem;
}

.modal__content {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 0.75rem;
}

.modal__content img {
  display: block;
  width: 22rem;
  height: 16.6875rem;
  object-fit: cover;
}

.modal__label {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15rem;
  height: 2rem;
}

.modal__label-text {
  flex-shrink: 0;
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: var(--fz-body);
  line-height: normal;
  letter-spacing: 1.44px;
  white-space: nowrap;
  color: var(--color-white);
  text-box: trim-both cap alphabetic;
}
.modal__nav {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.875rem;
  height: 2.75rem;
  color: var(--color-accent-1);
}

.modal__nav svg {
  display: block;
  width: 0.875rem;
  height: 1.75rem;
  fill: none;
  stroke: currentColor;
  stroke-width: 1;
}
.modal__close {
  position: absolute;
  top: -0.25rem;
  right: 2.0625rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.75rem;
  height: 2.75rem;
}

.modal__close-mark {
  position: relative;
  width: 1.25rem;
  height: 1.25rem;
}

.modal__close-mark::before,
.modal__close-mark::after {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1.7675rem;
  height: 1px;
  background-color: var(--color-white);
}

.modal__close-mark::before {
  transform: translate(-50%, -50%) rotate(45deg);
}

.modal__close-mark::after {
  transform: translate(-50%, -50%) rotate(-45deg);
}

@media (hover: hover) {
  .modal__nav:hover,
  .modal__close:hover {
    opacity: .7;
  }
}
.modal__nav:focus-visible,
.modal__close:focus-visible {
  outline: 1px solid var(--color-white);
  outline-offset: 0.125rem;
}
.intro {
  background-color: var(--color-mauve);
}

.intro__inner {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sp-xl);
  max-width: var(--content-w);
  margin: 0 auto;
  padding: var(--side-space-02) var(--gutter);
}

.intro__logo {
  width: 20rem;
  padding: var(--sp-lg) 0 0;
}

.intro__logo img {
  width: 100%;
  height: auto;
}

.intro__text {
  padding-bottom: var(--sp-lg);
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--fz-body);
  line-height: 1.6;
  letter-spacing: 1.44px;
  color: var(--color-white);
  text-align: center;
}
@media (min-width: 768px) {
  .intro__inner {
    padding: var(--mg-lg) var(--gutter);
  }

  .intro__logo {
    padding-top: var(--sp-xl);
  }

  .intro__text {
    padding-bottom: var(--sp-xl);
  }
}
.look {
  background: linear-gradient(180deg, var(--color-pink-01) 0%, var(--color-pink-grad) 100%);
}

.look__inner {
  max-width: var(--content-w);
  margin: 0 auto;
}

.look__head {
  display: flex;
  flex-direction: column;
  gap: var(--sp-xl);
  padding: var(--mg-lg) var(--sp-xl) var(--sp-lg);
}

.look__title {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-xs);
  font-family: var(--font-en);
  font-weight: 400;
  font-variation-settings: 'opsz' 15;
  line-height: 1.5;
  color: var(--color-text-2);
}

.look__title-sub  { font-size: var(--fz-h5); }
.look__title-main { font-size: 3.25rem; }

.look__model img {
  width: 100%;
  height: auto;
}

.look__body {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--sp-xl);
  padding: 0 var(--sp-xl) var(--mg-lg);
}

.look__lead {
  width: 100%;
  font-family: var(--font-serif);
  font-weight: 400;
  font-size: var(--fz-h4);
  line-height: 1.6;
  color: var(--color-text-2);
  text-align: center;
}

.look__note {
  width: 100%;
  padding: var(--sp-md) 0;
  white-space: nowrap;
  border-top: 1px solid var(--color-text-2);
  border-bottom: 1px solid var(--color-text-2);
  font-family: var(--font-serif);
  font-weight: 500;
  font-size: var(--fz-h5);
  line-height: 1.5;
  letter-spacing: .48px;
  color: var(--color-text-2);
  text-align: center;
}
.look__items {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--sp-lg);
  width: 100%;
  padding-bottom: var(--sp-lg);
}

.look__item {
  display: flex;
  flex-direction: column;
  gap: var(--sp-md);
  text-align: left;
}
.look__item-img {
  margin: -0.3125rem -0.75rem -0.75rem;
}

.look__item-img img {
  display: block;
  width: 100%;
  height: auto;
}

.look__item-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: var(--sp-sm);
  padding: var(--sp-sm);
  background: rgba(255, 255, 255, .1);
  border-top: 1px solid rgba(255, 255, 255, .4);
  border-bottom: 1px solid rgba(255, 255, 255, .4);
}
.look__item-label::before {
  content: "";
  flex-shrink: 0;
  width: 1.875rem;
  height: 1.875rem;
}

.look__item-name {
  flex: 1 0 0;
  min-width: 0;
  font-family: var(--font-en);
  font-weight: 484;
  font-variation-settings: 'opsz' 6;
  font-size: var(--fz-body);
  line-height: 1.5;
  color: var(--color-text-2);
  text-align: center;
}

.look__item-plus {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 1.875rem;
  height: 1.875rem;
  border-radius: var(--radius-full);
  background: var(--color-mauve);
  color: var(--color-white);
  font-family: var(--font-en);
  font-weight: 500;
  font-size: var(--fz-caption);
  line-height: 1.5;
}
.release {
  background-color: var(--color-mauve);
}

.release__box {
  display: flex;
  flex-direction: column;
  gap: 0;
  max-width: var(--content-w);
  margin: 0 auto;
  padding: var(--mg-md) var(--sp-lg);
}
.release__frame {
  display: flex;
  flex-direction: column;
  gap: var(--sp-md2);
  padding-bottom: var(--sp-md2);
  border-left: 1px solid var(--color-white);
  border-right: 1px solid var(--color-white);
}
.release__date,
.release__label,
.release__stores p,
.release__shops-badge,
.release__shops-body p {
  text-box: trim-both cap alphabetic;
}

.release__title {
  padding: var(--sp-sm) 0;
  border-top: 1px solid var(--color-white);
  border-bottom: 1px solid var(--color-white);
  font-family: var(--font-en);
  font-weight: 534;
  font-variation-settings: 'opsz' 6;
  font-size: var(--fz-h4);
  line-height: 1;
  letter-spacing: 0.16rem;
  color: var(--color-white);
  text-align: center;
}

.release__date {
  font-family: var(--font-en);
  font-variation-settings: 'opsz' 6;
  font-size: 2.5rem;
  letter-spacing: 1.6px;
}

.release__date-dow { font-size: var(--fz-h4); }

.release__label {
  font-family: var(--font-serif);
  font-weight: 600;
  font-size: var(--fz-h5);
  letter-spacing: .96px;
}
.release__preorder {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-md2);
  padding: var(--sp-lg) 0 var(--sp-md);
  color: var(--color-white);
}

.release__preorder .release__date {
  font-weight: 500;
}

.release__stores {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-md);
  padding: var(--sp-xs) 0 var(--sp-lg);
  font-weight: 700;
  font-size: var(--fz-body);
  letter-spacing: .72px;
  color: var(--color-white);
}
.release__onsale {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-lg);
  padding: var(--sp-xl) 0 var(--sp-lg);
  background: var(--color-pink-01);
  color: var(--color-mauve);
}

.release__onsale-head {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--sp-md2);
}

.release__onsale .release__date {
  font-weight: 421;
}

.release__shops {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  gap: var(--sp-md);
  width: 100%;
  padding: var(--sp-xs) var(--sp-lg);
}

.release__shops-badge {
  flex-shrink: 0;
  padding: 0.375rem var(--sp-sm);
  border: 1px solid var(--color-mauve);
  font-size: 0.75rem;
  letter-spacing: .48px;
}

.release__shops-body {
  display: flex;
  flex-direction: column;
  gap: var(--sp-md);
  font-size: var(--fz-caption);
  letter-spacing: .56px;
  font-feature-settings: 'hwid' 1;
}
@media (min-width: 768px) {
  .release {
    padding: var(--mg-md) 0;
  }

  .release__box {
    padding: var(--sp-xl) var(--sp-lg);
  }
}
footer {
  padding: var(--sp-xl) 0 !important;
  text-align: center !important;
  background-color: #dcd6d8 !important;
}

footer a {
  color: #000 !important;
}

footer a:link,
footer a:visited {
  color: #000 !important;
  text-decoration: none !important;
}

.footer .sns_area {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
}

.footer .f_list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  column-gap: var(--sp-md2);
  row-gap: 0.375rem;
  max-width: 21.25rem;
  margin: 2.125rem auto 0;
  padding: 0;
  list-style: none;
}

.footer .f_list li {
  font-size: 0.8125rem;
  line-height: normal;
  letter-spacing: .52px;
}

.footer .container p {
  margin-top: 1.75rem;
  font-size: 0.9375rem;
  letter-spacing: .6px;
}