/* ============================================
   RESET & BASE
============================================ */
*, *::before, *::after {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
:root {
  --color-navy: #394e8f;
  --color-white: #FFFFFF;
  --color-gold: #C4973B;
  --color-gold-2: #a78b49;
  --color-gold-3: #b9a26d;
  --color-black: #231815;
  --color-gray: #666666;
  --font-ja: 'FOT-筑紫Aオールド明朝 Pr6 M', 'Shippori Mincho', serif;
  --font-en: 'Cormorant Garamond', serif;
  --content-width: 1200px;
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --ease-in-quad: cubic-bezier(0.11, 0, 0.5, 0);
  --ease-out-cubic: cubic-bezier(0.33, 1, 0.68, 1);
}
html {
  font-size: 16px;
  scroll-behavior: smooth;
  overflow-x: hidden;
}
body {
  font-family: var(--font-ja);
  color: var(--color-white);
  background-color: var(--color-navy);
  line-height: 1.8;
  overflow-x: hidden;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
a {
  color: inherit;
  text-decoration: none;
}
ul {
  list-style: none;
}
img {
  max-width: 100%;
  height: auto;
  display: block;
}
picture {
  display: contents; 
}
.sp-only {
  display: none !important;
}
.pc-only {
  display: inline !important;
}

/* ============================================
   PLACEHOLDER IMAGES
============================================ */
.placeholder-img {
  width: 100%;
  aspect-ratio: 16 / 10;
}
.placeholder-img--lg {
  aspect-ratio: 4 / 3;
}
.placeholder-img--md {
  aspect-ratio: 1 / 1;
}
.placeholder-img--wide {
  aspect-ratio: 16 / 9;
}
/* ============================================
   SPLIT TEXT ANIMATION
============================================ */
.split {
  --ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
  --ease-in-quad: cubic-bezier(0.11, 0, 0.5, 0);
}
.split .splitText .char {
  display: inline-block;
  opacity: 0;
  translate: 0 100%;
}
.split.isActive .headline .char {
  --delay: 0.05s;
  opacity: 1;
  translate: 0;
  transition:
    opacity 0.7s var(--ease-in-quad) calc(var(--delay) * var(--index)), translate 1.4s var(--ease-out-quart) calc(var(--delay) * var(--index));
}
.split.isActive .lead .char {
  --delay: 0.003s;
  opacity: 1;
  translate: 0;
  transition:
    opacity 0.5s var(--ease-in-quad) calc(var(--delay) * var(--index) + 0.23s), translate 1.3s var(--ease-out-quart) calc(var(--delay) * var(--index) + 0.23s);
}
.split.isActive .description .char {
  --delay: 0.003s;
  opacity: 1;
  translate: 0;
  transition:
    opacity 0.5s var(--ease-in-quad) calc(var(--delay) * var(--index) + 0.23s), translate 1.3s var(--ease-out-quart) calc(var(--delay) * var(--index) + 0.23s);
}
/* ============================================
   LOADING
============================================ */
.loading {
  /*display: none !important;*/
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: var(--color-navy);
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: opacity 0.8s ease, visibility 0.8s ease;
}
.loading::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-image: url('../images/slide-00.jpg');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  opacity: 0;
  animation: loadingBgFadeIn 1.5s ease forwards;
}
@keyframes loadingBgFadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
.loading.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.loading__inner {
  position: relative;
  z-index: 1;
  text-align: center;
}
.loading__logo {
  font-family: var(--font-en);
  font-size: 48px;
  font-weight: 400;
  letter-spacing: 0.15em;
  color: var(--color-white);
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 1.2s ease, transform 1.2s ease;
}
.loading.is-visible .loading__logo {
  opacity: 1;
  transform: translateY(0);
}
/* ============================================
   HEADER
============================================ */
.header__hamburger {
  display: none;
}
.header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  padding: clamp(14px, 1.46vw, 28px) 0;
  opacity: 0;
  transform: translateY(-20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
  pointer-events: none;
}
.header.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.header__nav {
  margin: 0 auto;
  padding: 0 clamp(20px, 3.39vw, 65px);
}

.header__nav-list {
  display: flex;
  justify-content: flex-end;
  gap: clamp(20px, 3.39vw, 65px);
  align-items: center; 
}

.header__nav-item {
  display: flex;
  align-items: center;
  height: 1.2em; 
}

.header__nav-link {
  display: block;
  font-family: var(--font-ja); 
  font-size: clamp(14px, 1.09vw, 21px);
  font-weight: 500;
  letter-spacing: 0.05em;
  color: var(--color-white);
  text-decoration: none;
  text-align: center;
  line-height: 1.2;
}

@media screen and (min-width: 768px) {
  .header__nav-link {
    max-height: 1.2em; 
    overflow: hidden;
    transition: max-height 0.4s var(--ease-out-cubic);
  }
  
  .header__nav-link:hover {
    max-height: 2.4em; 
  }
}
/* ============================================
   HERO
============================================ */
.hero {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}
.hero__slides {
  position: relative;
  width: 100%;
  height: 100%;
}
.hero__slide {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  z-index: 1;
  transition: opacity 0.8s ease;
}
.hero__slide.is-active {
  opacity: 1;
  z-index: 2;
}
.hero__slide-bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: scale(1);
  transition: transform 4s ease-in-out;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
.hero__slide--1 .hero__slide-bg {
  background-image: url('../images/slide-01.png');
}
.hero__slide--2 .hero__slide-bg {
  background-image: url('../images/slide-02.png');
}
.hero__slide--3 .hero__slide-bg {
  background-image: url('../images/slide-03.png');
}
.hero__slide--4 .hero__slide-bg {
  background-image: url('../images/slide-04.png');
}
.hero__slide--4 .hero__slide-content {
  justify-content: flex-end;
  align-items: center;
  padding-right: clamp(40px, 10vw, 192px);
  padding-left: 0;
  padding-top: 0;
}
.hero__slide--4 .hero__lead {
  text-align: right;
  writing-mode: horizontal-tb;
}
.hero__slide--4 .hero__lead-line {
  margin-left: 0;
  line-height: 2;
}
.hero__slide.is-active .hero__slide-bg {
  transform: scale(1.1);
}
.hero__slide-content {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 100%;
}
.hero__lead {
  text-align: center;
}
.hero__lead-line {
  font-family: var(--font-ja);
  font-size: clamp(20px, 2.03vw, 39px);
  font-weight: 400;
  letter-spacing: 0.2em;
  line-height: 2;
  color: var(--color-white);
}
.hero__dots {
  position: absolute;
  right: clamp(16px, 1.56vw, 30px);
  top: 50%;
  transform: translateY(-50%);
  z-index: 100;
  display: flex;
  flex-direction: column;
  gap: clamp(8px, 0.73vw, 14px);
  opacity: 0;
  transition: opacity 0.6s ease;
}
.hero__dots.is-visible {
  opacity: 1;
}
.hero__dot {
  width: clamp(6px, 0.52vw, 10px);
  height: clamp(6px, 0.52vw, 10px);
  border-radius: 50%;
  border: none;
  background: var(--color-white);
  cursor: pointer;
  transition: background-color 0.3s ease;
  padding: 0;
}
.hero__dot.is-active {
  background-color: #d3c5a4;
}
.hero__scroll {
    display: block;
    position: absolute;
    bottom: 50px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 100;
    width: 60px;
    animation: scrollBounce 2s infinite;
  }
  .hero__scroll img { width: 100%; height: auto; display: block; }
/* ============================================
   CONCEPT
============================================ */
.concept {
  position: relative;
  padding: 6.25vw 11.6666666666667vw 150px 18.75vw;
  background-color: var(--color-white);
  color: var(--color-black);
  overflow: hidden;
  height: auto;
  white-space: nowrap;
}
.concept__inner {
  width: 100%;
  max-width: 1920px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.concept__text {
  writing-mode: vertical-rl;
  text-orientation: upright;
  width: 100%;
  height: auto;
  margin: 0 auto;
}
.concept__headline {
  position: relative;
  margin: 0 0 0 6.9792vw;
  width: auto;
}
.concept__en {
  writing-mode: vertical-rl;
  text-orientation: mixed;
  font-family: var(--font-en);
  font-size: 4.0625vw;
  color: #ede8db;
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1;
  position: absolute;
  top: 0%;
  left: 50%;
  z-index: 0;
  transform: translate(-50%, 0)
}
.concept__ja {
  white-space: nowrap;
  writing-mode: horizontal-tb;
  display: inline-block;
  font-family: var(--font-ja);
  font-size: 1.25vw;
  color: var(--color-black);
  font-weight: 400;
  letter-spacing: 0.4em;
  line-height: 2.1875vw;
  text-align: center;
  position: absolute;
  top: 21%;
  left: 50%;
  z-index: 1;
  transform: translate(-50%, 0);
}
.concept__lead {
  font-family: var(--font-ja);
  font-size: 2.0833vw;
  color: var(--color-black);
  font-weight: 500;
  line-height: 2;
  letter-spacing: 0em;
  margin-block-end: 1.5vw;
  writing-mode: vertical-rl;
  text-orientation: upright;
}
.concept__lead .line-1 {
  display: inline-block;
  transform: translateY(-1em);
}
.concept__description {
  font-size: 1.0417vw;
  font-weight: 400;
  line-height: 2.3438vw;
  letter-spacing: 0;
  text-align: justify;
  margin-block-end: 3.125vw;
}
.concept__image {
  display: block;
  max-width: 21.3542vw;
  width: 100%;
  height: auto;
  position: relative;
  left: calc(50vw - 18.75vw); 
  transform: translateX(-50%) !important;
  writing-mode: horizontal-tb;
  margin: 0;
}
/* ============================================
   LOOP
============================================ */
.concept__loop {
  padding: 0 0 150px;
  overflow: hidden;
  width: 100%;
  background-color: var(--color-white);
  opacity: 1 !important;
  transform: none !important;
}
.concept__loop-track {
  display: flex;
  gap: 20px;
  animation: loopScroll 40s linear infinite;
  width: max-content;
  opacity: 0;
  transition: opacity 1s var(--ease-out-quart);
}
.concept__loop.is-visible .concept__loop-track {
  opacity: 1;
}
.concept__loop-item {
  flex-shrink: 0;
  width: 45.7292vw;
}
.concept__loop-img {
  width: 100%;
  height: auto;
}
@keyframes loopScroll {
  0% { 
    transform: translateX(0); 
  }
  100% { 
    transform: translateX(calc(-1 * (45.7292vw + 20px) * 7)); 
  }
}


/* ============================================
   PRODUCT
============================================ */
.product {
  position: relative;
  margin: 0;
  padding: clamp(80px, 7.81vw, 150px) clamp(20px, 2.6vw, 50px);
  background-color: var(--color-navy);
}
.product__inner {
  width: 62.5%;
  max-width: var(--content-width);
  margin: 0 auto;
  padding: 0 0;
}
.product__visual-wrapper {
  position: relative;
  margin-bottom: clamp(40px, 4.17vw, 80px);
  width: 100%;
}
.product__visual {
  width: 100%;
  aspect-ratio: 1200 / 603;
  background-image: url('../images/product-image.png');
  background-size: cover;
  background-position: center;
}
.product__header {
  position: absolute;
  top: 8%;
  right: -20.5%;
  text-align: right;
  z-index: 10;
  pointer-events: none;
}
.product__title {
  font-family: var(--font-en);
  font-size: clamp(32px, 4.06vw, 78px);
  font-weight: 400;
  letter-spacing: 0em;
  color: var(--color-white);
  line-height: 1;
}
.product__subtitle {
  font-size: clamp(12px, 1.25vw, 24px);
  font-weight: 300;
  letter-spacing: 0.4em;
  color: var(--color-white);
  display: block;
  margin-top: 4px;
}
.product__card {
  position: relative;
  background-color: none;
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 1s ease, transform 1s ease;
}
.product__card.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.product__card-inner {
  text-align: center;
  margin: 0 auto;
}
.product__card-body {
  background-color: var(--color-white);
}
.product__tags {
  padding: clamp(40px, 3.65vw, 70px) 0 clamp(15px, 1.3vw, 25px);
  font-size: clamp(14px, 1.3vw, 25px);
  line-height: 1.8;
  margin-bottom: 0;
  color: var(--color-black);
}
.product__tag {
  display: block;
}
.product__name {
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: var(--font-ja);
  font-size: clamp(24px, 3.91vw, 75px);
  font-weight: 500;
  letter-spacing: 0.15em;
  color: var(--color-black);
  margin: 0 -0.8em 10px 0;
}
.product__manufacturer {
  font-size: clamp(18px, 3.13vw, 60px);
  font-weight: 500;
  color: var(--color-black);
  letter-spacing: 0.1em;
  margin-right: -0.5em;
}
.product__badges {
  width: calc(100% - 40px); 
  max-width: 700px;
  display: flex;
  align-items: center;
  margin: 0 auto clamp(12px, 1.04vw, 20px);
  border-top: 1px solid var(--color-gold-2);
  border-bottom: 1px solid var(--color-gold-2);
  padding: 8px 0;
}
.product__badge {
  flex: 1;
  text-align: center;
  font-size: clamp(14px, 1.88vw, 36px);
  letter-spacing: 0.1em;
  padding: 0 clamp(8px, 1.25vw, 24px);
  color: var(--color-gold-2);
  line-height: 1.4;
}
.product__badge:not(:last-child) {
  border-right: 1px solid var(--color-gold-2);
}
.product__price {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: clamp(16px, 1.56vw, 30px);
}
.product__price-unit {
  font-size: clamp(13px, 1.41vw, 27px);
  font-weight: 500;
  letter-spacing: 0.08em;
  margin-right: clamp(8px, 0.83vw, 16px);
  color: var(--color-gold-2);
}
.product__price-amount {
  font-family: var(--font-ja);
  font-size: clamp(32px, 4.17vw, 80px);
  font-weight: 500;
  letter-spacing: 0.05em;
  line-height: 1;
  color: var(--color-gold-2);
}
.product__price-yen {
  font-family: var(--font-ja);
  font-size: clamp(28px, 3.65vw, 70px);
  font-weight: 500;
  margin-left: 4px;
}
.product__price-tax {
  font-size: clamp(13px, 1.46vw, 28px);
  font-weight: 500;
  letter-spacing: 0.08em;
  margin-left: 8px;
  color: var(--color-gold-2);
}
.product__cta {
  width: calc(100% - 40px); 
  max-width: 716px;
  display: block;
  position: relative;
  overflow: hidden; 
  background: linear-gradient(to bottom, #a28c53 50%, #856c39 50%);
  color: var(--color-white);
  font-size: clamp(20px, 2.34vw, 45px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.15em;
  padding: clamp(12px, 0.94vw, 18px) clamp(20px, 2.08vw, 40px);
  margin: 0 auto clamp(40px, 3.85vw, 74px);
  transition: opacity 0.3s ease, transform 0.3s ease;
}

.product__cta:hover {
  opacity: 0.6 !important;
}

.product__cta::before,.gift__cta::before {
  content: '';
  position: absolute;
  top: 0;
  left: -150%;
  width: 50%;
  height: 100%;
  background: linear-gradient(
    to right, 
    rgba(255, 255, 255, 0) 0%, 
    rgba(255, 255, 255, 0.4) 50%, 
    rgba(255, 255, 255, 0) 100%
  );
  transform: skewX(-25deg);
  animation: btnShine 4s infinite;
  pointer-events: none;
}

@keyframes btnShine {
  0% {
    left: -150%;
  }
  20% {
    left: 100%;
  }
  100% {
    left: 200%;
  }
}
.product__note {
  margin: 0 clamp(20px, 2.6vw, 50px) 10px;
  font-size: clamp(12px, 1.25vw, 24px);
  color: var(--color-black);
  letter-spacing: 0.08em;
  background: #d7dce9;
}
.product__detail {
  margin: 0 clamp(20px, 2.6vw, 50px) 0;
  padding: 0 0 clamp(30px, 2.6vw, 50px);
  font-size: clamp(12px, 0.94vw, 18px);
  line-height: 2;
  color: var(--color-black);
  text-align: left;
  letter-spacing: 0;
}
.product__detail p {
  margin-bottom: 4px;
}
/* ============================================
   MATERIAL
============================================ */
.material {
  position: relative;
  padding: clamp(80px, 7.81vw, 150px) 0;
  background-color: var(--color-white);
}
.material__inner {
  max-width: 1300px;
  margin: 0 auto;
  padding: 0 clamp(20px, 2.6vw, 50px);
}
.material__visual-wrapper {
  position: relative;
  width: 100%;
  margin-bottom: clamp(60px, 6.25vw, 120px);
}
.material__visual {
  width: 81.25vw;
  aspect-ratio: 1560 / 775;
  margin-left: auto;
  background-image: url('../images/material-image-1.png');
  background-size: cover;
  background-position: center;
}
.material__header {
  position: absolute;
  top: 22%;
  left: 4.5%;
  transform: translateY(-50%);
  text-align: left;
  margin-bottom: 0;
  z-index: 10;
}
.material__title {
  font-family: var(--font-en);
  font-size: clamp(36px, 4.06vw, 78px);
  font-weight: 400;
  letter-spacing: 0em;
  line-height: 1;
  color: var(--color-gold-2);
  margin-bottom: clamp(16px, 2.08vw, 40px);
}
.material__lead {
  font-size: clamp(14px, 1.25vw, 24px);
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 1.75;
  color: var(--color-black);
  text-align: right;
  letter-spacing: 0.4em;
}
.material__item {
  display: flex;
  align-items: center;
  gap: clamp(30px, 4.17vw, 80px);
  margin-bottom: clamp(60px, 6.25vw, 120px);
  opacity: 0;
  transform: translateY(60px);
  transition: opacity 1s ease, transform 1s var(--ease-out-quart);
}
.material__item.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.material__item--reverse {
  flex-direction: row-reverse;
}
.material__item-text {
  flex: 1;
}
.material__item-name {
  font-size: clamp(20px, 1.88vw, 36px);
  font-weight: 400;
  letter-spacing: 0.25em;
  line-height: 1.75;
  margin-bottom: clamp(24px, 2.6vw, 50px);
  color: var(--color-black);
}
.material__item-desc {
  font-size: clamp(14px, 1.04vw, 20px);
  font-weight: 400;
  line-height: 2;
  letter-spacing: 0.1em;
  color: var(--color-black);
}
.material__item-img {
  flex: 1;
  overflow: hidden;
}
.material__item-imgs {
  flex: 0 0 clamp(200px, 19.27vw, 370px);
  max-width: 100%;
  display: flex;
  flex-direction: column;
  gap: clamp(16px, 1.56vw, 30px);
}
.material__item-img-box {
  width: 100%;
  aspect-ratio: 370 / 233;
  overflow: hidden;
}
.material__item-img--single {
  flex: 0 0 clamp(200px, 19.27vw, 370px);
  max-width: 100%;
  aspect-ratio: 370 / 482;
  overflow: hidden;
}
.material__photo {
  width: 100%;
  object-fit: cover;
  display: block;
}
.material__full {
  margin-top: clamp(20px, 2.08vw, 40px);
  overflow: hidden;
}
.material__full-mask {
  width: 100%;
  overflow: hidden;
  clip-path: inset(50% 50% 50% 50%);
  transition: clip-path 1.2s var(--ease-out-quart);
}
.material__full-mask.is-visible {
  clip-path: inset(0% 0% 0% 0%);
}
.material__full-img {
  width: 100%;
  aspect-ratio: 1200 / 700;
  object-fit: cover;
  display: block;
  transform: scale(1.1);
  transition: transform 1.4s var(--ease-out-quart);
}
.material__full-mask.is-visible .material__full-img {
  transform: scale(1);
}
/* ============================================
   PROCESSING
============================================ */
.processing {
  background-color: var(--color-navy);
}
.processing__inner {
  max-width: 1300px;
  margin: clamp(80px, 7.81vw, 150px) auto;
  padding: 0 clamp(20px, 2.6vw, 50px);
}
.processing__title {
  font-family: var(--font-en);
  font-size: clamp(36px, 4.06vw, 78px);
  font-weight: 400;
  letter-spacing: 0em;
  color: var(--color-gold-2);
  margin-bottom: clamp(8px, 0.83vw, 16px);
}
.processing__lead {
  font-size: clamp(12px, 0.73vw, 14px);
  font-weight: 300;
  letter-spacing: 0.1em;
  color: var(--color-white);
  text-align: right;
}
.processing__item {
  display: flex;
  align-items: center;
  gap: clamp(30px, 4.17vw, 80px);
  margin-bottom: clamp(60px, 6.25vw, 120px);
  opacity: 0;
  transform: translateY(60px);
  transition: opacity 1s ease, transform 1s var(--ease-out-quart);
}
.processing__item.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.processing__item--reverse {
  flex-direction: row-reverse;
}
.processing__item-text {
  flex: 1;
}
.processing__item-name {
  font-size: clamp(20px, 1.88vw, 36px);
  font-weight: 400;
  line-height: 1.75;
  letter-spacing: 0.2em;
  margin-bottom: clamp(12px, 1.25vw, 24px);
  color: var(--color-white);
  text-align: center;
  width: 100%;
  padding-left: 0.2em;
}
.processing__item-desc {
  font-size: clamp(14px, 1.04vw, 20px);
  font-weight: 400;
  line-height: 2;
  letter-spacing: 0;
  color: var(--color-white);
  padding-left: 0.2em;
}
.processing__item-img {
  flex: 1;
  overflow: hidden;
}
.processing__item--special {
  display: flex;
  align-items: center;
  gap: 9.25%;
  margin-bottom: clamp(60px, 6.25vw, 120px);
}
.processing__img-box {
  flex: 0 0 52.75%;
  max-width: 52.75%;
  aspect-ratio: 633 / 964;
  overflow: hidden;
}
.processing__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.processing__text-box {
  flex: 0 0 37.91%;
  max-width: 37.91%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
}
.processing__title-wrapper {
  position: relative;
  margin-bottom: clamp(60px, 8.07vw, 155px);
  display: inline-block;
}
.processing__title-bg {
  font-family: var(--font-en);
  font-size: clamp(40px, 6vw, 78px);
  font-weight: 400;
  letter-spacing: 0;
  color: var(--color-gold-3);
  line-height: 1;
  white-space: nowrap;
}
.processing__subtitle-vertical {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  writing-mode: vertical-rl;
  white-space: nowrap;
  font-family: var(--font-ja);
  font-size: clamp(14px, 1.5vw, 20px);
  font-weight: 400;
  letter-spacing: 0.3em;
  color: var(--color-white);
}
/* ============================================
   BRANDING
============================================ */
.branding {
  position: relative;
  padding: clamp(80px, 7.29vw, 140px) 0;
  background-color: var(--color-white);
}
.branding__inner {
  max-width: 1300px;
  margin: 0 auto;
  padding: 0 clamp(20px, 2.6vw, 50px);
}
.branding__title {
  font-family: var(--font-en);
  font-size: clamp(36px, 4.06vw, 78px);
  font-weight: 400;
  letter-spacing: 0em;
  color: var(--color-gold);
  margin-bottom: clamp(8px, 0.83vw, 16px);
}
.branding__lead {
  font-size: clamp(12px, 0.73vw, 14px);
  font-weight: 300;
  letter-spacing: 0.1em;
  color: var(--color-black);
  text-align: right;
}
.branding__grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(30px, 3.13vw, 60px);
}
.branding__item {
  opacity: 0;
  transform: translateY(clamp(30px, 3.13vw, 60px));
  transition: opacity 1s ease, transform 1s var(--ease-out-quart);
}
.branding__item.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.branding__item-img {
  margin-bottom: clamp(12px, 1.25vw, 24px);
  overflow: hidden;
}
.branding__item-name {
  font-size: clamp(16px, 1.04vw, 20px);
  font-weight: 400;
  letter-spacing: 0.1em;
  margin-bottom: clamp(8px, 0.83vw, 16px);
  color: var(--color-black);
}
.branding__item-desc {
  font-size: clamp(12px, 0.73vw, 14px);
  font-weight: 300;
  line-height: 2.2;
  letter-spacing: 0.06em;
  color: var(--color-black);
}
/* ============================================
   BRANDING
============================================ */
.branding__visual-wrapper {
  position: relative;
  width: 100%;
  margin-bottom: clamp(60px, 6.25vw, 120px);
}
.branding__visual {
  width: 81.25%;
  aspect-ratio: 1560 / 775;
  margin-right: auto;
  background-image: url('../images/branding-image-1.png');
  background-size: cover;
  background-position: center;
}
.branding__header {
  position: absolute;
  top: 26%;
  right: -1.7%;
  width: 100%;
  transform: translateY(-50%);
  text-align: right;
  margin-bottom: 0;
  z-index: 10;
}
.branding__title {
  font-family: var(--font-en);
  font-size: clamp(36px, 4.06vw, 78px);
  font-weight: 400;
  letter-spacing: 0em;
  color: var(--color-gold-2);
  margin-bottom: clamp(8px, 0.83vw, 16px);
  line-height: 1.1;
  padding-right: 8%;
  box-sizing: border-box;
}
.branding__lead {
  font-size: clamp(14px, 1.25vw, 24px);
  font-weight: 400;
  letter-spacing: 0;
  line-height: 1.75;
  text-align: right;
  margin-top: clamp(8px, 0.63vw, 12px);
  padding-right: 8%;
  box-sizing: border-box;
  background: linear-gradient(
    to right, 
    var(--color-white) 0%, 
    var(--color-white) 79.55%, 
    var(--color-black) 79.55%, 
    var(--color-black) 100%
  );
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  background-clip: text;
  color: transparent;
  letter-spacing: 0.4em;
}

.branding__section-title {
  text-align: center;
  font-family: var(--font-ja);
  font-size: clamp(20px, 1.88vw, 36px);
  font-weight: 500;
  line-height: 1.75;
  letter-spacing: 0.25em;
  color: var(--color-black);
  margin-bottom: clamp(40px, 4.17vw, 80px);
}
.branding__block {
  display: flex;
  align-items: center;
  gap: 8.75%;
  margin-bottom: clamp(60px, 6.25vw, 120px);
}
.branding__block-img {
  flex: 0 0 50%;
  max-width: 50%;
  aspect-ratio: 600 / 510;
  overflow: hidden;
  order: -1; 
}
.branding__photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.branding__block-text {
  flex: 0 0 41.25%;
  max-width: 41.25%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  order: 1; 
}
.branding__block-title {
  font-size: clamp(20px, 1.88vw, 36px);
  font-weight: 400;
  letter-spacing: 0.1em;
  line-height: 1.75;
  margin-bottom: clamp(24px, 2.6vw, 50px);
  color: var(--color-black);
}
.branding__block-desc {
  font-size: clamp(14px, 1.04vw, 20px);
  font-weight: 400;
  line-height: 2;
  letter-spacing: 0;
  color: var(--color-black);
}
/* ============================================
   VOICE
============================================ */
.voice {
  position: relative;
  padding: clamp(80px, 7.29vw, 140px) 0 0;
  background-color: var(--color-navy);
}
.voice__inner {
  max-width: var(--content-width);
  margin: 0 auto;
}
.voice__header {
  text-align: center;
  margin-bottom: clamp(30px, 3.13vw, 60px);
}
.voice__title {
  font-family: var(--font-en);
  font-size: clamp(36px, 4.06vw, 78px);
  font-weight: 400;
  letter-spacing: 0em;
  color: var(--color-white);
  margin-bottom: clamp(8px, 0.83vw, 16px);
}
.voice__lead {
  font-size: clamp(16px, 1.88vw, 36px);
  font-weight: 300;
  letter-spacing: 0.1em;
  color: var(--color-white);
}
.voice__grid {
  position: relative;
  display: grid;
  grid-template-columns: clamp(180px, 16.67vw, 320px) clamp(180px, 16.67vw, 320px);
  justify-content: space-between;
  align-content: center;
  gap: clamp(20px, 3.13vw, 60px);
  width: 100%;
  aspect-ratio: 1200 / 800;
  background-color: var(--color-white);
  background-image: url('../images/voice-image-1.png');
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  padding: clamp(24px, 3.13vw, 60px) clamp(16px, 2.08vw, 40px);
  border-radius: 2px;
  opacity: 0;
  transform: translateY(clamp(20px, 2.08vw, 40px));
  transition: opacity 1s ease, transform 1s ease;
}
.voice__grid.is-visible {
  opacity: 1;
  transform: translateY(0);
}
.voice__card {
  width: 100%;
  max-width: 100%;
  padding: clamp(12px, 1.25vw, 24px) 0;
}
.voice__card-text {
  position: relative;
  display: block;
  font-size: clamp(14px, 1.25vw, 24px);
  line-height: clamp(28px, 2.6vw, 50px);
  color: var(--color-white);
  letter-spacing: 0;
  margin-bottom: clamp(12px, 1.25vw, 24px);
  z-index: 1;
  white-space: nowrap;
}
.voice__card-text::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -1;
  background-image: url('../images/dotted.png');
  background-repeat: repeat;
  background-size: auto 2px;
  -webkit-mask-image: linear-gradient(to bottom, transparent 0, transparent calc(100% - 2px), black calc(100% - 2px), black 100%);
  mask-image: linear-gradient(to bottom, transparent 0, transparent calc(100% - 2px), black calc(100% - 2px), black 100%);
  -webkit-mask-size: 100% clamp(28px, 2.6vw, 50px);
  mask-size: 100% clamp(28px, 2.6vw, 50px);
  -webkit-mask-repeat: repeat;
  mask-repeat: repeat;
}
.voice__footer-text {
  text-align: center;
  margin-top: clamp(60px, 7.81vw, 150px);
  font-size: clamp(16px, 1.88vw, 36px);
  font-weight: 400;
  line-height: 1.75;
  letter-spacing: 0.25em;
  color: var(--color-white);
}

.voice__annotation {
  position: absolute !important;
  bottom: clamp(12px, 1.25vw, 24px) !important;
  right: clamp(16px, 1.67vw, 32px) !important;
  left: auto !important;
  top: auto !important;
  font-size: clamp(10px, 0.94vw, 18px);
  font-weight: 400;
  letter-spacing: 0.12em;
  color: var(--color-white);
  z-index: 10;
}


.gift__annotation {
  margin-top: 16px;
  font-size: clamp(10px, 0.94vw, 18px);
  letter-spacing: 0.1em;
  color: var(--color-white);
  text-align: center;
}
.gift__annotation {
  margin-top: 16px;
  font-size: clamp(10px, 0.94vw, 18px);
  letter-spacing: 0.1em;
  color: var(color--white);
  text-align: center;
}
/* ============================================
   GIFT
============================================ */
.gift {
  position: relative;
  padding: 0 0 clamp(60px, 5.21vw, 100px);
  background-color: var(--color-navy);
}
.gift__inner {
  text-align: center;
  max-width: 1300px;
  margin: 0 auto;
  padding: 0 clamp(20px, 2.6vw, 50px);
}
.gift__header {
  margin-bottom: clamp(30px, 3.13vw, 60px);
}
.gift__title {
  font-family: var(--font-en);
  font-size: clamp(36px, 4.06vw, 78px);
  font-weight: 400;
  letter-spacing: 0em;
  color: var(--color-white);
  margin-bottom: clamp(8px, 0.83vw, 16px);
}
.gift__lead {
  font-size: clamp(16px, 1.88vw, 36px);
  font-weight: 400;
  letter-spacing: 0.25em;
  line-height: 1.6;
  color: var(--color-white);
}
.gift__image {
  width: 100%;
  aspect-ratio: 1200 / 603;
  margin-bottom: clamp(30px, 3.13vw, 60px);
  overflow: hidden;
}
.gift__main-photo {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
.gift__description {
  font-size: clamp(14px, 1.25vw, 24px);
  font-weight: 400;
  line-height: 2.375;
  letter-spacing: 0.3em;
  color: var(--color-white);
  margin-bottom: clamp(40px, 5.21vw, 100px);
}
.gift__options {
  display: flex;
  justify-content: center;
  gap: clamp(20px, 3.13vw, 60px);
}
.gift__option-circle {
  width: clamp(120px, 14.06vw, 270px);
  height: clamp(120px, 14.06vw, 270px);
  border-radius: 50%;
  background-size: cover;
  background-position: center;
}
.gift__option-circle--1 {
  background-image: url('../images/gift-image-2.png');
}
.gift__option-circle--2 {
  background-image: url('../images/gift-image-3.png');
}
.gift__cta {
  width: 100%;
  max-width: 716px;
  display: block;
  background: linear-gradient(to bottom, #a28c53 50%, #856c39 50%);
  color: var(--color-white);
  font-size: clamp(20px, 2.34vw, 45px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.15em;
  padding: clamp(12px, 0.94vw, 18px) clamp(20px, 2.08vw, 40px);
  margin: clamp(40px, 4.17vw, 80px) auto 0;
  transition: opacity 0.3s ease, transform 0.3s ease;
  position: relative;
  overflow: hidden; 
}
.gift__cta:hover {
  opacity: 0.6!important;
}
/* ============================================
   FIXED CART BUTTON
============================================ */
.cart-fixed {
  position: fixed;
  right: 30px;
  bottom: 40px;
  z-index: 900;
  text-align: center;
  opacity: 0;
  transform: translateY(20px);
  transition: opacity 0.6s ease, transform 0.6s ease;
  pointer-events: none;
  cursor: pointer;
}
.cart-fixed.is-visible {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}
.cart-fixed__label {
  display: block;
  font-size: 21px;
  letter-spacing: 0.15em;
  line-height: 33px;
  margin-bottom: 8px;
  color: var(--color-gold-2);
}
.cart-fixed__icon {
  width: 100px;
  height: 100px;
  border-radius: 50%;
  background-color: var(--color-gold-2);
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 0 auto;
  animation: cartFloatGlow 3s ease-in-out infinite;
  transition: all 0.3s ease;
}

.cart-fixed__icon a {
  display: flex;
  justify-content: center;
}

.cart-fixed__icon:hover {
  animation: none; 
  transform: scale(1.05);
  box-shadow: 0 10px 25px rgba(167, 139, 73, 0.5);
}


@keyframes cartFloatGlow {
  0%, 100% {
    transform: translateY(0);
    box-shadow: 0 0 0 rgba(167, 139, 73, 0);
    background-color: var(--color-gold-2);
  }
  50% {
    transform: translateY(-8px);
    box-shadow: 0 10px 20px rgba(167, 139, 73, 0.5);
    background-color: var(--color-gold-3); 
  }
}
.cart-fixed__img {
  width: 50%;
  height: auto;
  display: block;
}
/* ============================================
   BOTTOM CART BAR
============================================ */
.cart-bar {
  position: fixed;
  bottom: 0;
  left: 0;
  width: 100%;
  z-index: 800;
  padding: 16px 40px;
  text-align: center;
  opacity: 0;
  transform: translateY(100%);
  transition: opacity 0.5s ease, transform 0.5s ease;
  pointer-events: none;
  display: none;
}


/* ============================================
   UTILITY / SCROLL REVEAL HELPERS
============================================ */
[data-scroll-reveal] {
  opacity: 0;
  transform: translateY(60px);
  transition: opacity 1s ease, transform 1s cubic-bezier(0.25, 1, 0.5, 1);
}
[data-scroll-reveal].is-visible {
  opacity: 1;
  transform: translateY(0);
}
.lp_footer_container{
  width:100%;
  padding: 40px 20px;
  background: #ffffff;
}
.lp_footer_inner{
  width:100%;
  max-width: 1200px;
  margin: 0 auto;
}

@media screen and (max-width: 767px) {
  .sp-only { display: inline !important; }
  .pc-only { display: none !important; }
  .header {
    background-color: transparent !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  
  /* HAMBURGER MENU */
  .header__hamburger {
    display: block;
    position: absolute;
    top: 3.7333vw;
    right: 3.7333vw;
    width: 4.6666vw;
    height: 2.6666vw;
    background: transparent;
    border: none;
    cursor: pointer;
    z-index: 1100;
  }
  .header__hamburger span {
    position: absolute;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: var(--color-white);
    transition: all 0.3s ease;
  }
  .header__hamburger span:nth-of-type(1) { top: 0; }
  .header__hamburger span:nth-of-type(2) { top: 50%; transform: translateY(-50%); }
  .header__hamburger span:nth-of-type(3) { bottom: 0; }
  .header.is-menu-open .header__hamburger span:nth-of-type(1) {
    top: 50%;
    transform: translateY(-50%) rotate(40deg);
  }
  .header.is-menu-open .header__hamburger span:nth-of-type(2) { opacity: 0; }
  .header.is-menu-open .header__hamburger span:nth-of-type(3) {
    bottom: auto;
    top: 50%;
    transform: translateY(-50%) rotate(-40deg);
  }
  .header__nav-list {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background-color: var(--color-navy);
    display: grid;
    align-content: center;
    justify-content: center;
    justify-items: start;
    gap: 8vw; 
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    z-index: 1000;
    transition: none; 
  }

  .header.is-animatable .header__nav-list {
    transition: opacity 0.4s ease, visibility 0.4s ease;
  }

  .header.is-menu-open .header__nav-list {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
  }
   .header__nav-item {
    height: auto !important; 
    display: block !important;
    text-align: left;
  }

    .header__nav-link {
    font-size: 5.3333vw;
    line-height: 1.6 !important; 
    letter-spacing: 0.1em;
    color: var(--color-white);
    text-align: left;
    
    display: block !important; 
    
    position: relative;
    padding-left: 1.2em; 
    
    transition: none;
  }
  
  .header__nav-link:hover {
    transform: none;
  }

  .header__nav-link::before { 
    content: '・'; 
    position: absolute;
    left: 0;
    top: 0;
    line-height: 1.6 !important; 
  }

  .header__nav-link::after { 
    display: none; 
  }

  .header__nav-link .nav-en {
    display: block;
    font-size: 0.65em; 
    font-family: var(--font-en); 
    margin-top: -0.2em;
  }

  .loading::before {
    background-image: url('../images/slide-00_sp.jpg'); 
  }

  .loading__logo {
  }

  /* HERO */
  .hero__slide--1 .hero__slide-bg { background-image: url('../images/slide-01_sp.png'); }
  .hero__slide--2 .hero__slide-bg { background-image: url('../images/slide-02_sp.png'); }
  .hero__slide--3 .hero__slide-bg { background-image: url('../images/slide-03_sp.png'); }
  .hero__slide--4 .hero__slide-bg { background-image: url('../images/slide-04_sp.png'); }
  .hero__slide--4 .hero__slide-content {
    justify-content: flex-start;
    align-items: flex-start;
    padding-right: 0;
    padding-left: 8vw;
    padding-top: 15vh;
  }
  .hero__slide--4 .hero__lead {
    text-align: left;
    writing-mode: vertical-rl;
    text-orientation: upright;
  }
  .hero__slide--4 .hero__lead-line { margin-left: 4vw; line-height: 1.5; }
  .hero__scroll {
    display: block;
    position: absolute;
    bottom: 50px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 100;
    width: 60px;
    animation: scrollBounce 2s infinite;
  }
  .hero__scroll img { width: 100%; height: auto; display: block; }

  /* CONCEPT */
  .concept { padding: 80px 20px; white-space: normal; }
  .concept__text { writing-mode: horizontal-tb; text-orientation: mixed; }
  .concept__headline { margin: 0 0 40px 0; text-align: center; width: 100%; }
  .concept__en {
    position: relative;
    top: auto; left: auto; transform: none;
    writing-mode: horizontal-tb;
    font-size: 10.4vw;
    display: block;
    margin-bottom: 2.6666vw;
    color: var(--color-gold-3);
  }
  .concept__ja {
    position: relative;
    top: auto; left: auto; transform: none;
    font-size: 3.7333vw;
    line-height: 1.6;
    display: block;
  }
  .concept__lead {
    writing-mode: horizontal-tb;
    font-size: 5.3vw;
    margin-block-end: 30px;
    text-align: center;
  }
  .concept__lead .line-1 { transform: none; display: inline; }
  .concept__description {
    font-size: 3.7333vw;
    line-height: 2;
    text-align: center;
    margin-block-end: 40px;
  }
  .concept__image { max-width: 240px; margin: 0 auto; position: static;
  left: auto;
  transform: none !important; }
  .concept__loop { padding: 0 0 60px; }
  .concept__loop-item { width: 58.4vw; }

  /* PRODUCT */
  .product { padding: 10.6666vw 5.3333vw 5.3333vw; }
  .product__inner { width: 100%; margin: 0 auto; padding: 0; background: none; }
  .product__visual-wrapper { margin-bottom: 5.3333vw; }
  .product__visual {
    width: 100%;
    aspect-ratio: 640 / 400;
    background-image: url('../images/product-image_sp.png');
    background-size: cover;
    background-position: center;
  }
  .product__header {
    position: relative;
    top: auto; right: auto;
    text-align: left;
    margin-bottom: 8vw;
    padding: 0 5.3333vw;
  }
  .product__title { font-size: 10.4vw; text-align: center; color: var(--color-gold-3); margin-bottom: 2.6666vw; }
  .product__subtitle { font-size: 3.7333vw; text-align: center; margin: 0; }
  .product__card-body { background-color: var(--color-white); padding: 5.3333vw 0; }
  .product__tags { margin: 0 0 4vw; padding: 2vw 0 0; font-size: 3.7333vw; line-height: 1.8; }
  .product__name {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    font-size: 8.8vw;
    font-weight: 600;
    margin: 0 0 4vw 5vw;
    white-space: nowrap;
    letter-spacing: 0;
  }
  .product__manufacturer {
    font-size: 7.2vw;
    font-weight: 600;
    margin-right: -3.6vw;
    margin-bottom: 0;
    white-space: nowrap;
    letter-spacing: 0;
  }
  .product__badges {
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 0;
    border-top: 1px solid var(--color-gold-2);
    border-bottom: 1px solid var(--color-gold-2);
    padding: 0.5vw 0;
    margin-bottom: 5.3333vw;
  }
  .product__badge { font-size: 4.6666vw; font-weight: 500; border: none; padding: 0 3vw; width: auto; letter-spacing: 0.1em; }
  .product__badge:not(:last-child) { border-right: 1px solid var(--color-gold-2); }
  .product__price { flex-direction: row; flex-wrap: wrap; justify-content: center; align-items: baseline; margin-bottom: 5.3333vw; }
  .product__price-unit { width: 100%; text-align: center; margin-right: 0; margin-bottom: 1.5vw; font-size: 3.7333vw; }
  .product__price-amount { font-size: 10.6666vw; }
  .product__price-yen { font-size: 9.3333vw; }
  .product__price-tax { font-size: 4.2666vw; margin: 2vw 2vw 0; }
  .product__cta { font-size: 4.8vw; font-weight: 700; padding: 3vw 5vw; margin: 0 auto 10.6666vw; }
  .product__note { margin: 0 0 4vw; padding: 2vw 5.3333vw; font-size: 3.2vw; }
  .product__detail { margin: 0; padding: 0 5.3333vw 2.6666vw; font-size: 3.2vw; line-height: 2; }

  /* MATERIAL */
  .material { padding: 10.6666vw 0; }
  .material__inner { padding: 0 20px; }
  .material__visual-wrapper { margin-bottom: 5.3333vw; display: flex; flex-direction: column-reverse; }
  .material__visual { width: calc(100% - 40px); aspect-ratio: 670 / 400;margin: 0 20px;  background-image: url('../images/material-image-1_sp.png');} 
  .material__header {
    position: relative;
    top: auto; left: auto; transform: none;
    padding: 0 20px;
    margin-top: 0;
    margin-bottom: 8vw;
  }
  .material__title { font-size: 10.4vw; margin-bottom: 2.6666vw; text-align: center; }
  .material__lead { font-size: 3.7333vw; line-height: 1.6; text-align: center; }
  .material__item { display: flex; flex-direction: column; align-items: flex-start; gap: 32px; margin-bottom: 6.6666vw; }
  .material__item-text { order: -1; width: 100%; }
  .material__item--reverse { flex-direction: column; }
  .material__item-name { font-size: 5.3333vw; line-height: 1.5; margin-bottom: 5.3333vw; text-align: center; width: 100%; }
  .material__item-desc { font-size: 3.7333vw; line-height: 2; }
  .material__item-imgs { flex: auto; width: 100%; display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
  .material__item-img-box { width: 100%; aspect-ratio: 4 / 3; }
  .material__item-img--single { flex: auto; width: 100%; aspect-ratio: 670 / 240; }
  .material__full-img { aspect-ratio: 4 / 3; }

  /* PROCESSING */
  .processing__inner { margin: 10.6666vw auto; padding: 0 5.3333vw; }
  .processing__item { flex-direction: column; gap: 8.5333vw; margin-bottom: 16vw; }
  .processing__item--reverse { flex-direction: column; }
  .processing__item-name { font-size: 5.3333vw; line-height: 1.5; margin-bottom: 4.2666vw; text-align: center; width: 100%; padding-left: 0;}
  .processing__item-desc { font-size: 3.7333vw; line-height: 2; text-align: left; padding-left: 0; }
  .processing__item--special { display: flex; flex-direction: column; gap: 0; margin-bottom: 10.6666vw; }
  .processing__text-box { display: contents; }
  .processing__title-wrapper { order: 1; margin-bottom: 8vw; display: flex; flex-direction: column; align-items: center; width: 100%; }
  .processing__title-bg { font-size: 10.4vw; margin-bottom: 2.6666vw; line-height: 1; text-align: center; }
  .processing__subtitle-vertical {
    position: static;
    transform: none;
    top: auto; left: auto;
    writing-mode: horizontal-tb;
    font-size: 3.7333vw;
    letter-spacing: 0.15em;
    width: 100%;
    text-align: center;
  }
  .processing__img-box { order: 2; flex: auto; max-width: 100%; width: 100%; aspect-ratio: 670 / 400; margin-bottom: 8vw; }
  .processing__item--special .processing__item-name { order: 3; margin-bottom: 4.2666vw; }
  .processing__item--special .processing__item-desc { order: 4; }

  /* BRANDING */
  .branding { padding: 10.6666vw 0;margin: 0 0 -10.6666vw }
  .branding__inner { padding: 0 5.3333vw; }
  .branding__title { font-size: 10.4vw; margin-bottom: 2.1333vw; text-align: center; }
  .branding__lead { font-size: 3.7333vw; text-align: center; }
  .branding__grid { grid-template-columns: 1fr; gap: 10.6666vw; }
  .branding__item-img { margin-bottom: 4.2666vw; }
  .branding__item-name { font-size: 5.3333vw; margin-bottom: 2.1333vw; }
  .branding__item-desc { font-size: 3.7333vw; line-height: 2; }
  .branding__visual-wrapper { margin-bottom: 10.3333vw; display: flex; flex-direction: column-reverse; }
  .branding__visual { width: calc(100% - 40px); aspect-ratio: 670 / 400;margin: 0 20px;  } 
  .branding__header {
    position: relative;
    top: auto; left: auto; transform: none;
    padding: 0 5.3333vw;
    text-align: center;
    margin-top: 0;
    margin-bottom: 6vw;
  }
  .branding__header .branding__title { font-size: 10.4vw; margin-bottom: 2.6666vw; padding-right: 0; line-height: 1; text-align: center; }
  .branding__header .branding__lead {
    font-size: 3.7333vw;
    padding-right: 0; margin-top: 0;
    text-align: center;
    line-height: 1.6;
    background: none;
    -webkit-background-clip: initial;
    -webkit-text-fill-color: initial;
    background-clip: initial;
    color: var(--color-black);
  }
  .branding__section-title { font-size: 5.3333vw; line-height: 1.5; margin-bottom: 10.6666vw; text-align: center; }
  .branding__block { flex-direction: column; gap: 8.5333vw; margin-bottom: 10.6666vw; }
  .branding__block-img { max-width: 100%; flex: auto; width: 100%; aspect-ratio: 670 / 400; }
  .branding__block-text { max-width: 100%; flex: auto; width: 100%; }
  .branding__block-title { font-size: 5.3333vw; margin-bottom: 5.3333vw; line-height: 1.5; text-align: center; }
  .branding__block-desc { font-size: 3.7333vw; line-height: 2; }

  /* VOICE */
  .voice { padding: 10.6666vw 0 0; }
  .voice__inner { padding: 0 20px; }
  .voice__header { margin-bottom: 40px; }
  .voice__title { font-size: 10.4vw; margin-bottom: 6.6666vw; color: var(--color-gold-3); line-height: 1; }
  .voice__lead { font-size: 5.3333vw; }
  .voice__grid {
    grid-template-columns: 1fr;
    gap: 5vw;
    padding: 0 4vw;
    aspect-ratio: 670 / 1055; 
    background-image: url('../images/voice-image-1_sp.png');
    background-size: contain;
  }
  .voice__card:nth-child(4) { display: none; }
  .voice__card { padding: 0; }
  .voice__card-text { width: 46vw; font-size: 3.7333vw; line-height: 32px; margin-bottom: 4.6666vw; white-space: nowrap; }
  .voice__card-text::before { -webkit-mask-size: 100% 32px; mask-size: 100% 32px; }
  .voice__footer-text { margin-top: 60px; font-size: 16px; line-height: 1.8; letter-spacing: 0.1em; }
  .voice__annotation {position: absolute !important;
    bottom: 16px !important;
    right: auto !important;
    left: 20px !important;
    top: auto !important;
    font-size: 10px; 
    z-index: 10;}
  
  .voice__card:nth-child(1) {
    order: 1;
  }
  .voice__card:nth-child(2) {
    order: 3;
  }
  .voice__card:nth-child(3) {
    order: 2;
  }
  .voice__card:nth-child(4) {
    order: 4;
  }
  .voice__card:nth-child(5) {
    order: 5;
  }

  /* GIFT */
  .gift { padding: 5.3333vw 5.3333vw 5.3333vw; }
  .gift__inner { padding: 0 20px; }
  .gift__header { margin-bottom: 32px; }
  .gift__title { font-size: 10.4vw; text-align: center; color: var(--color-gold-3); margin-bottom: 5.3333vw; line-height: 1; }
  .gift__lead { font-size: 5.3333vw; line-height: 1.6; letter-spacing: 0.1em; }
  .gift__image { margin-bottom: 32px; }
  .gift__description { font-size: 3.7333vw; line-height: 2; letter-spacing: 0.1em; margin-bottom: 10.6666vw; }
  .gift__options { gap: 3.2vw; }
  .gift__option-circle { width: 28.8vw; height: 28.8vw; }
  .gift__cta { font-size: 4.8vw; font-weight: 700; padding: 3vw 5vw; margin: 40px auto 50px; }
  .gift__annotation { margin-top: 3.2vw; font-size: 2.9333vw; }

  /* FIXED CART BUTTON */
  .cart-fixed { right: 16px; bottom: 24px; }
  .cart-fixed__label { font-size: 12px; line-height: 1.4; margin-bottom: 4px; }
  .cart-fixed__icon { width: 64px; height: 64px; animation: cartFloatGlowSP 3s ease-in-out infinite; }
}

@keyframes scrollBounce {
  0%, 20%, 50%, 80%, 100% { transform: translate(-50%, 0); }
  40% { transform: translate(-50%, -10px); }
  60% { transform: translate(-50%, -5px); }
}
@media screen and (max-width: 767px) {
  @keyframes loopScroll {
    0% { 
      transform: translateX(0); 
    }
    100% { 
      transform: translateX(calc(-1 * (58.4vw + 20px) * 7)); 
    }
  }
}
@keyframes cartFloatGlowSP {
  0%, 100% {
    transform: translateY(0);
    box-shadow: 0 0 0 rgba(167, 139, 73, 0);
    background-color: var(--color-gold-2);
  }
  50% {
    transform: translateY(-4px); 
    box-shadow: 0 5px 10px rgba(167, 139, 73, 0.5); 
    background-color: var(--color-gold-3);
  }
}

/* ============================================
   CONCEPT
============================================ */
.concept__accordion-fade {
  display: none !important;
}

.concept__accordion-box,
.concept__accordion-content {
  display: contents; 
}

@media screen and (max-width: 767px) {
  
  .concept__accordion-box {
    display: block;
    position: relative;
    padding-bottom: 0; 
  }

  .concept__accordion-content {
    display: block;
    max-height: 80vw; 
    overflow: hidden;
    transition: max-height 0.8s ease;
  }

  .concept__accordion-box.is-open .concept__accordion-content {
    max-height: 2000px; 
  }

  .concept__accordion-fade {
    display: flex !important;
    position: absolute;
    bottom: 0; 
    left: 0;
    width: 100%;
    height: 40vw; 
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 40%, rgba(255, 255, 255, 1) 100%);
    align-items: flex-end;
    justify-content: center;
    z-index: 10;
  }

  .concept__readmore-btn {
    background: none;
    border: none;
    cursor: pointer;
    padding: 0;
    width: 20%; 
    max-width: 96px;
    margin-bottom: 8vw; 
    transition: transform 0.3s ease;
  }
  .concept__readmore-btn img {
    width: 100%; height: auto; display: block;
  }
  .concept__readmore-btn:hover {
    transform: scale(1.05);
  }

  .concept__accordion-box.is-open .concept__accordion-fade {
    display: none !important;
  }
}