@charset "UTF-8";
.universe-strip {
  position: relative;
  height: 8.90625vw;
  overflow-x: clip;
}

.universe-marquee {
  display: flex;
  width: max-content;
  height: 100%;
  animation: universe-marquee 60s linear infinite;
  will-change: transform;
}

.universe-strip.is-offscreen .universe-marquee {
  animation-play-state: paused;
}

.universe-track {
  position: relative;
  flex: 0 0 auto;
  height: 100%;
  padding-right: 6.25vw;
}

@keyframes universe-marquee {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-50%, 0, 0);
  }
}
.universe-text {
  position: relative;
  top: 2.6171875vw;
  left: -0.0390625vw;
  font-family: var(--FontFamilyEn, "Climate Crisis", sans-serif);
  font-variation-settings: "YEAR" 1979;
  font-weight: 400;
  font-size: 6.1328125vw;
  line-height: 1;
  letter-spacing: 0;
  white-space: nowrap;
  color: #E5E5E5;
  pointer-events: none;
  -webkit-user-select: none;
  user-select: none;
}

.universe-char {
  position: absolute;
  z-index: 1;
  height: auto;
  max-width: none;
  transform-origin: 50% 100%;
}
.universe-char.is-pop {
  animation: universe-pop 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) both;
}

@keyframes universe-pop {
  0% {
    transform: scale(0.55) translateY(18%);
  }
  60% {
    transform: scale(1.12) translateY(-6%);
  }
  80% {
    transform: scale(0.96) translateY(2%);
  }
  100% {
    transform: scale(1) translateY(0);
  }
}
.char-onion {
  left: 6.015625vw;
  top: 0.859375vw;
  width: 8.5546875vw;
}

.char-rooster {
  left: 30.46875vw;
  top: 0.15625vw;
  width: 6.796875vw;
}

.char-corn {
  left: 57.7734375vw;
  top: 0.8984375vw;
  width: 6.3671875vw;
}

.char-garlic {
  left: 87.421875vw;
  top: -0.234375vw;
  width: 8.0078125vw;
}

@media (prefers-reduced-motion: reduce) {
  .universe-marquee,
  .universe-char.is-pop {
    animation: none;
  }
}
@media (max-width: 1199px) {
  .universe-strip {
    height: max(95.76px, 8.90625vw);
  }
  .universe-marquee {
    animation-duration: 26.6s;
  }
  .universe-track {
    padding-right: max(67.2px, 6.25vw);
  }
  .universe-text {
    top: max(28.14px, 2.6171875vw);
    font-size: max(65.94px, 6.1328125vw);
  }
  .char-onion {
    left: max(64.68px, 6.015625vw);
    top: max(9.24px, 0.859375vw);
    width: max(91.98px, 8.5546875vw);
  }
  .char-rooster {
    left: max(327.6px, 30.46875vw);
    top: max(1.68px, 0.15625vw);
    width: max(73.08px, 6.796875vw);
  }
  .char-corn {
    left: max(621.18px, 57.7734375vw);
    top: max(9.66px, 0.8984375vw);
    width: max(68.46px, 6.3671875vw);
  }
  .char-garlic {
    left: max(939.96px, 87.421875vw);
    width: max(86.1px, 8.0078125vw);
  }
}
@media (max-width: 1024px) {
  .universe-marquee {
    animation-duration: 25.2s;
  }
}
@media (max-width: 850px) {
  .universe-strip {
    height: 86.64px;
  }
  .universe-marquee {
    animation-duration: 22.8s;
  }
  .universe-track {
    padding-right: 60.8px;
  }
  .universe-text {
    top: 25.46px;
    font-size: 59.66px;
  }
  .char-onion {
    left: 58.52px;
    top: 8.36px;
    width: 83.22px;
  }
  .char-rooster {
    left: 296.4px;
    top: 1.52px;
    width: 66.12px;
  }
  .char-corn {
    left: 562.02px;
    top: 8.74px;
    width: 61.94px;
  }
  .char-garlic {
    left: 850.44px;
    top: -2.28px;
    width: 77.9px;
  }
}
@keyframes map-pulse-ring {
  0% {
    transform: scale(0.6);
    opacity: 0.85;
  }
  70%, 100% {
    transform: scale(4.2);
    opacity: 0;
  }
}
@keyframes map-pulse-core {
  0%, 100% {
    opacity: 0;
    transform: scale(0.45);
  }
  20% {
    opacity: 0.9;
    transform: scale(0.6);
  }
  45% {
    opacity: 0;
    transform: scale(0.45);
  }
}
.tpl-products,
.tpl-quality,
.tpl-news {
  background: #F3F3F3;
}

.tpl-loader {
  position: fixed;
  inset: 0;
  z-index: 1000;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: var(--Space3, 32px);
  background: var(--BgColorHero, #FFC85B);
  transition: opacity 0.4s ease, visibility 0s linear 0.4s;
  animation: loader-failsafe 0.4s ease 6s forwards;
}
.tpl-loader.is-hidden {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}
.tpl-loader.is-done {
  display: none;
}
.tpl-loader .loader-logo {
  width: clamp(140px, 14vw, 220px);
  height: auto;
  animation: loader-logo 1.2s ease-in-out infinite;
}
.tpl-loader .loader-dots {
  display: flex;
  gap: var(--SpaceS, 12px);
}
.tpl-loader .loader-dots i {
  width: 12px;
  height: 12px;
  border-radius: 50%;
  background: var(--ColorSecondary, #E8380D);
  animation: loader-dot 0.9s ease-in-out infinite;
}
.tpl-loader .loader-dots i:nth-child(2) {
  background: var(--ColorPrimary, #F08300);
  animation-delay: 0.15s;
}
.tpl-loader .loader-dots i:nth-child(3) {
  background: #111;
  animation-delay: 0.3s;
}
@media (prefers-reduced-motion: reduce) {
  .tpl-loader {
    transition: none;
  }
  .tpl-loader .loader-logo,
  .tpl-loader .loader-dots i {
    animation: none;
  }
}

@keyframes loader-failsafe {
  to {
    opacity: 0;
    visibility: hidden;
  }
}
@keyframes loader-logo {
  50% {
    scale: 1.05;
  }
}
@keyframes loader-dot {
  0%, 60%, 100% {
    translate: 0 0;
  }
  30% {
    translate: 0 -10px;
  }
}
@keyframes hero-intro-bg {
  from {
    scale: 1.06;
  }
}
@keyframes hero-intro-text {
  from {
    opacity: 0;
    translate: -4% 0;
  }
}
@keyframes hero-intro-visual {
  from {
    opacity: 0;
    translate: 0 6%;
    scale: 0.94;
  }
}
@keyframes hero-chip-pop {
  from {
    opacity: 0;
    scale: 0;
    rotate: -25deg;
  }
}
@keyframes hero-ring-spin {
  from {
    rotate: -360deg;
  }
}
@keyframes hero-badge-swing {
  18% {
    rotate: 12deg;
  }
  42% {
    rotate: -7deg;
  }
  65% {
    rotate: 4deg;
  }
  85% {
    rotate: -1.5deg;
  }
}
@keyframes hero-intro-ui {
  from {
    opacity: 0;
    translate: 0 14px;
  }
}
.tpl-hero {
  position: relative;
  height: min(100vh, 50vw);
  min-height: 720px;
  overflow: hidden;
  background: #FAA733;
}
.tpl-hero .hero-slider {
  height: 100%;
}
.tpl-hero .hero-slide {
  position: relative;
  display: flex;
  align-items: flex-end;
  height: 100%;
  overflow: hidden;
}
.tpl-hero .hero-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tpl-hero .hero-layer {
  pointer-events: none;
}
.tpl-hero .hero-ring {
  pointer-events: none;
}
.tpl-hero .hero-ring .hero-badge,
.tpl-hero .hero-ring .hero-badge-ring {
  transform-box: view-box;
}
.tpl-hero .hero-ring-d :is(.hero-badge, .hero-badge-ring) {
  transform-origin: 246.76px 466.95px;
}
.tpl-hero .hero-ring-m {
  display: none;
}
.tpl-hero .hero-ring-m :is(.hero-badge, .hero-badge-ring) {
  transform-origin: 1210px 232.97px;
}
.tpl-hero .hero-badge-cover {
  fill: var(--BgColorHero, #FFC85B);
}
.tpl-hero .hero-defs {
  position: absolute;
  width: 0;
  height: 0;
  overflow: hidden;
}
.tpl-hero .hero-deco {
  pointer-events: none;
}
.tpl-hero .hero-deco-m {
  display: none;
}
.tpl-hero .hero-chip {
  transform-box: view-box;
}
.tpl-hero .chip-1 {
  transform-origin: 863.5px 428.5px;
}
.tpl-hero .chip-2 {
  transform-origin: 1827px 257px;
}
.tpl-hero .chip-3 {
  transform-origin: 2173px 263px;
}
.tpl-hero.is-intro-ready .slide-01 .hero-layer,
.tpl-hero.is-intro-ready .slide-01 .hero-deco,
.tpl-hero.is-intro-ready .hero-controls,
.tpl-hero.is-intro-ready .hero-scroll {
  opacity: 0;
}
.tpl-hero.is-intro .slide-01 picture .hero-bg,
.tpl-hero.is-intro .slide-01 .hero-ring-m,
.tpl-hero.is-intro .slide-01 .hero-deco {
  animation: hero-intro-bg 1.2s cubic-bezier(0.16, 1, 0.3, 1) backwards;
}
.tpl-hero.is-intro .slide-01 .hero-chip {
  animation: hero-chip-pop 0.7s cubic-bezier(0.34, 1.56, 0.64, 1) 0.55s backwards;
}
.tpl-hero.is-intro .slide-01 .chip-2 {
  animation-delay: 0.67s;
}
.tpl-hero.is-intro .slide-01 .chip-3 {
  animation-delay: 0.79s;
}
.tpl-hero.is-intro .slide-01 .hero-badge-ring {
  animation: hero-ring-spin 1.2s cubic-bezier(0.45, 0, 0.2, 1) 0.15s backwards;
}
.tpl-hero.is-intro .slide-01 .hero-badge {
  animation: hero-badge-swing 1.35s cubic-bezier(0.37, 0, 0.63, 1) 1.2s;
}
.tpl-hero.is-intro .slide-01 .layer-text {
  animation: hero-intro-text 0.8s cubic-bezier(0.16, 1, 0.3, 1) 0.1s backwards;
}
.tpl-hero.is-intro .slide-01 .layer-visual {
  animation: hero-intro-visual 0.9s cubic-bezier(0.34, 1.4, 0.64, 1) 0.25s backwards;
}
.tpl-hero.is-intro .hero-controls,
.tpl-hero.is-intro .hero-scroll {
  animation: hero-intro-ui 0.5s ease-out 0.9s backwards;
}
.tpl-hero .hero-visual {
  position: absolute;
  z-index: 1;
  right: 0;
  bottom: 0;
  height: auto;
  max-width: none;
}
.tpl-hero .hero-content {
  position: relative;
  z-index: 2;
  margin: auto auto 0;
  padding-bottom: 6.640625vw;
  color: var(--TextColorTitle, #111);
}
.tpl-hero .hero-badge {
  display: block;
  width: clamp(120px, 9.4vw, 240px);
  height: clamp(120px, 9.4vw, 240px);
  margin: 0 0 var(--SpaceFluidS, 0.78125vw) 0.390625vw;
}
.tpl-hero .hero-text {
  margin: 0 0 0 var(--SpaceFluidXS, 0.46875vw);
}
.tpl-hero .hero-text img {
  display: block;
  height: auto;
  max-width: none;
}
.tpl-hero {
  /* 第 2、3 張的文字圖寬度與主圖位置 */
}
.tpl-hero .slide-02 .hero-text img {
  width: 44.921875vw;
}
.tpl-hero .slide-02 .hero-visual {
  right: 10.15625vw;
  width: 33.59375vw;
}
.tpl-hero .slide-03 .hero-text img {
  width: 47.1484375vw;
}
.tpl-hero .slide-03 .hero-visual {
  right: 6.25vw;
  bottom: 2.34375vw;
  width: 39.0625vw;
}
.tpl-hero .swiper-initialized .hero-content > *,
.tpl-hero .swiper-initialized .hero-visual {
  transition: opacity 0.8s ease, transform 1s cubic-bezier(0.16, 1, 0.3, 1);
}
.tpl-hero .swiper-initialized .hero-slide:not(.swiper-slide-active) .hero-content > * {
  opacity: 0;
  transform: translateY(40px);
}
.tpl-hero .swiper-initialized .hero-slide:not(.swiper-slide-active) .hero-visual {
  opacity: 0;
  transform: translateX(4%) scale(0.96);
}
.tpl-hero .swiper-initialized .swiper-slide-active .hero-visual {
  transition-delay: 0.1s;
}
.tpl-hero .swiper-initialized .swiper-slide-active .hero-content > :nth-child(2) {
  transition-delay: 0.15s;
}
.tpl-hero .hero-controls {
  position: absolute;
  z-index: 3;
  left: 0;
  right: 0;
  bottom: 2.734375vw;
  display: flex;
  align-items: center;
  gap: var(--Space2, 24px);
  pointer-events: none;
}
.tpl-hero .hero-controls > * {
  pointer-events: auto;
}
.tpl-hero .hero-pagination {
  display: flex;
  align-items: center;
  gap: var(--SpaceS, 12px);
  width: auto;
  margin-left: var(--SpaceFluidXS, 0.46875vw);
}
.tpl-hero .hero-pagination .swiper-pagination-bullet {
  display: block;
  width: 14px;
  height: 14px;
  margin: 0;
  padding: 0;
  border: 2px solid var(--BorderColorTertiary, #111);
  border-radius: 999px;
  background: var(--BgColor, #fff);
  opacity: 1;
  cursor: pointer;
  transition: width var(--TransitionDefault, 0.3s ease), background-color var(--TransitionDefault, 0.3s ease);
  scroll-margin-bottom: -380px;
}
@media (hover: hover) and (pointer: fine) {
  .tpl-hero .hero-pagination .swiper-pagination-bullet:hover {
    background: var(--ColorTertiary, #FBCA4D);
  }
}
.tpl-hero .hero-pagination .swiper-pagination-bullet:is(:active, :focus-visible) {
  background: var(--ColorTertiary, #FBCA4D);
}
.tpl-hero .hero-pagination .swiper-pagination-bullet:focus-visible {
  outline: 2px solid var(--BorderColorTertiary, #111);
  outline-offset: 3px;
}
.tpl-hero .hero-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  width: 44px;
  background: var(--ColorSecondary, #E8380D);
}
.tpl-hero .hero-scroll {
  scroll-margin-bottom: -380px;
  position: absolute;
  z-index: 3;
  left: 50%;
  bottom: 1.953125vw;
  transform: var(--TransformXCenter, translateX(-50%));
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--SpaceS, 12px);
  font-family: var(--FontFamilyEn, "Climate Crisis", sans-serif);
  font-variation-settings: "YEAR" 1979;
  font-size: 16px;
  letter-spacing: 0.12em;
  line-height: 1;
  color: var(--TextColorTitle, #111);
}
.tpl-hero .hero-scroll .scroll-label {
  padding: var(--SpaceXS, 8px) var(--Space1, 16px) var(--SpaceXS, 8px);
  border: 2px solid var(--BorderColorTertiary, #111);
  border-radius: 999px;
  background: var(--BgColor, #fff);
  transition: background-color var(--TransitionDefault, 0.3s ease);
}
.tpl-hero .hero-scroll::after {
  content: "";
  width: 48px;
  height: 48px;
  border: 2px solid var(--BorderColorTertiary, #111);
  border-radius: 50%;
  background: var(--BgColor, #fff) url("../image/icon-arrow-down.svg") center/18px no-repeat;
  animation: hero-scroll-bounce 1.8s ease-in-out 2;
  transition: background-color var(--TransitionDefault, 0.3s ease);
}
@media (hover: hover) and (pointer: fine) {
  .tpl-hero .hero-scroll:hover {
    color: var(--TextColorTitle, #111);
  }
  .tpl-hero .hero-scroll:hover .scroll-label, .tpl-hero .hero-scroll:hover::after {
    background-color: var(--ColorTertiary, #FBCA4D);
  }
}
.tpl-hero .hero-scroll:is(:active, :focus-visible) {
  color: var(--TextColorTitle, #111);
}
.tpl-hero .hero-scroll:is(:active, :focus-visible) .scroll-label, .tpl-hero .hero-scroll:is(:active, :focus-visible)::after {
  background-color: var(--ColorTertiary, #FBCA4D);
}

@keyframes hero-scroll-bounce {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(8px);
  }
}
.tpl-partners {
  position: relative;
  overflow: hidden;
  padding: var(--SectionPadding, 80px) 0;
  background: var(--BgColor, #fff);
}
.tpl-partners .partner-deco {
  position: absolute;
  pointer-events: none;
}
.tpl-partners .deco-shape {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background: var(--ColorSecondary, #E8380D);
}
.tpl-partners .deco-top {
  width: 240px;
  height: 240px;
  top: -140px;
  right: 240px;
}
.tpl-partners .deco-bottom {
  width: 420px;
  height: 420px;
  left: -130px;
  bottom: -310px;
}
.tpl-partners .deco-hatch {
  width: 300px;
  height: 300px;
  right: -17%;
  bottom: -200px;
  opacity: 0.5;
}
.tpl-partners .deco-hatch .deco-shape {
  background: repeating-linear-gradient(45deg, var(--ColorSecondary, #E8380D) 0 1px, transparent 1px 10px), repeating-linear-gradient(-45deg, var(--ColorSecondary, #E8380D) 0 1px, transparent 1px 10px);
}
.tpl-partners .partner-marquee {
  overflow: hidden;
  padding-bottom: 54px;
}
.tpl-partners .partner-marquee.is-offscreen .partner-list {
  animation-play-state: paused;
}
.tpl-partners .partner-list {
  display: flex;
  align-items: center;
  width: max-content;
  list-style: none;
  animation: partner-marquee 40s linear infinite;
  will-change: transform;
}
.tpl-partners .partner-item {
  flex: 0 0 auto;
  padding-right: max(var(--Space4, 40px), 3.75vw);
}
.tpl-partners .partner-item img {
  display: block;
  width: auto;
  height: max(56px, 3.7109375vw);
}

@keyframes partner-marquee {
  from {
    transform: translate3d(0, 0, 0);
  }
  to {
    transform: translate3d(-33.3333%, 0, 0);
  }
}
.scene-track.is-scene-track {
  height: 220vh;
}

.crispy-scene {
  position: relative;
}
.crispy-scene.is-scene {
  position: sticky;
  top: 0;
  height: 100vh;
  overflow: hidden;
}
.crispy-scene.is-scene .tpl-brand-visual,
.crispy-scene.is-scene .tpl-evolution {
  position: absolute;
  inset: 0;
  height: auto;
}
.crispy-scene.is-scene .tpl-brand-visual {
  --BurstSize: min(39.84375vw, 100vh - 180px);
  z-index: 2;
  pointer-events: none;
}
.crispy-scene.is-scene .tpl-brand-visual .slogan {
  top: var(--NaviBottom, 140px);
}
.crispy-scene.is-scene .tpl-brand-visual .burst-visual {
  inset: var(--NaviBottom, 140px) 0 0;
  width: var(--BurstSize, 39.84375vw);
  height: var(--BurstSize, 39.84375vw);
  margin: auto;
}
.crispy-scene.is-scene .tpl-brand-visual .burst-spill-clip {
  display: block;
  clip-path: var(--BurstRim, none);
}
.crispy-scene.is-scene .tpl-evolution {
  z-index: 1;
}

.scene-anchor {
  scroll-margin-top: -156px;
}

.tpl-brand-visual {
  position: relative;
  height: 42.96875vw;
  overflow: hidden;
  background: var(--ColorSecondary, #E8380D);
}
.tpl-brand-visual .slogan {
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  width: 76.328125vw;
  height: max-content;
  transform: var(--TransformXCenter, translateX(-50%));
  margin: auto 0;
  pointer-events: none;
}
.tpl-brand-visual .slogan-lines {
  display: block;
  font-family: var(--FontFamilyEn, "Climate Crisis", sans-serif);
  font-variation-settings: "YEAR" 1979;
  font-size: 6.25vw;
  line-height: 6.25vw;
  letter-spacing: 0;
  text-align: center;
  color: transparent;
  -webkit-text-stroke: max(1.5px, 0.1171875vw) #FCC858;
}
.tpl-brand-visual .slogan-line {
  display: block;
  white-space: nowrap;
}
.tpl-brand-visual .burst-visual {
  position: absolute;
  z-index: 1;
  left: 50%;
  top: 1.171875vw;
  width: 39.84375vw;
  height: 39.84375vw;
  margin-left: -19.921875vw;
}
.tpl-brand-visual .burst-inner {
  position: relative;
  width: 100%;
  height: 100%;
}
.tpl-brand-visual .burst-layer {
  position: absolute;
  display: block;
  height: auto;
  max-width: none;
}
.tpl-brand-visual .burst-inner {
  --BurstRim: polygon(0% 0%, 100% 0%, 100% 53.381%, 91.171% 53.381%, 90.558% 53.764%, 89.946% 54.606%, 89.333% 54.912%, 88.721% 55.678%, 88.108% 56.290%, 87.496% 56.903%, 86.884% 57.362%, 86.271% 58.281%, 85.659% 58.893%, 85.046% 59.199%, 84.434% 59.888%, 83.821% 60.501%, 83.209% 61.190%, 82.596% 61.879%, 81.984% 62.262%, 81.372% 62.874%, 80.759% 63.410%, 80.147% 63.869%, 79.534% 64.405%, 78.922% 64.788%, 78.309% 65.324%, 77.697% 65.553%, 77.085% 66.242%, 76.472% 66.472%, 75.860% 66.855%, 75.247% 66.931%, 74.635% 67.391%, 74.022% 67.774%, 73.410% 68.156%, 72.797% 68.922%, 72.185% 69.458%, 71.573% 69.687%, 70.960% 70.376%, 70.348% 70.606%, 69.735% 70.836%, 69.123% 71.601%, 68.510% 72.443%, 67.898% 73.209%, 67.285% 73.898%, 66.673% 74.663%, 66.061% 75.429%, 65.448% 75.812%, 64.836% 76.654%, 64.223% 77.343%, 63.611% 78.032%, 62.998% 78.644%, 62.386% 79.333%, 61.774% 79.793%, 61.161% 80.482%, 60.549% 81.094%, 59.936% 81.630%, 59.324% 81.936%, 58.711% 82.625%, 58.099% 83.238%, 57.486% 83.774%, 56.874% 84.080%, 56.262% 84.769%, 55.649% 85.305%, 55.037% 85.841%, 54.424% 86.376%, 53.812% 86.989%, 53.199% 87.448%, 52.587% 87.065%, 51.974% 86.453%, 51.362% 85.994%, 50.750% 85.152%, 50.137% 84.386%, 49.525% 83.544%, 48.912% 82.549%, 48.300% 82.013%, 47.687% 81.400%, 47.075% 80.941%, 46.463% 80.099%, 45.850% 79.563%, 45.238% 79.104%, 44.625% 78.262%, 44.013% 77.955%, 43.400% 77.419%, 42.788% 76.730%, 42.175% 75.888%, 41.563% 75.812%, 40.951% 75.352%, 40.338% 74.587%, 39.726% 73.821%, 39.113% 72.903%, 38.501% 71.984%, 37.888% 71.065%, 37.276% 69.917%, 36.663% 68.998%, 36.051% 68.233%, 35.439% 67.697%, 34.826% 66.396%, 34.214% 65.553%, 33.601% 64.941%, 32.989% 64.405%, 32.376% 63.640%, 31.764% 62.951%, 31.152% 62.338%, 30.539% 61.649%, 29.927% 61.037%, 29.314% 60.501%, 28.702% 59.965%, 28.089% 59.276%, 27.477% 58.663%, 26.864% 58.051%, 26.252% 57.439%, 25.640% 57.132%, 25.027% 56.520%, 24.415% 55.984%, 23.802% 55.448%, 23.190% 54.912%, 22.577% 54.683%, 21.965% 54.147%, 21.352% 53.917%, 20.740% 53.458%, 20.128% 52.998%, 19.515% 52.386%, 18.903% 51.774%, 18.290% 51.620%, 17.678% 51.467%, 17.065% 51.238%, 16.453% 50.778%, 15.841% 50.396%, 15.228% 49.936%, 14.616% 49.860%, 14.003% 49.400%, 13.391% 49.018%, 12.778% 48.558%, 0% 48.558%);
  --BurstRimRooster: polygon(0% -10%, 100% -10%, 100% 53.381%, 91.171% 53.381%, 90.558% 53.764%, 89.946% 54.606%, 89.333% 54.912%, 88.721% 55.678%, 88.108% 56.290%, 87.496% 56.903%, 86.884% 57.362%, 86.271% 58.281%, 85.659% 58.893%, 85.046% 59.199%, 84.434% 59.888%, 83.821% 60.501%, 83.209% 61.190%, 82.596% 61.879%, 81.984% 62.262%, 81.372% 62.874%, 80.759% 63.410%, 80.147% 63.869%, 79.534% 64.405%, 78.922% 64.788%, 78.309% 65.324%, 77.697% 65.553%, 77.085% 66.242%, 76.472% 66.472%, 75.860% 66.855%, 75.247% 66.931%, 74.635% 67.391%, 74.022% 67.774%, 73.410% 68.156%, 72.797% 68.922%, 72.185% 69.458%, 71.573% 69.687%, 70.960% 70.376%, 70.348% 70.606%, 69.735% 70.836%, 69.123% 71.601%, 68.510% 72.443%, 67.898% 73.209%, 67.285% 73.898%, 66.673% 74.000%, 66.061% 74.000%, 65.448% 74.000%, 64.836% 74.000%, 64.223% 74.000%, 63.611% 74.000%, 62.998% 74.000%, 62.386% 74.000%, 61.774% 74.000%, 61.161% 74.000%, 60.549% 74.000%, 59.936% 74.000%, 59.324% 74.000%, 58.711% 74.000%, 58.099% 74.000%, 57.486% 74.000%, 56.874% 74.000%, 56.262% 74.000%, 55.649% 74.000%, 55.037% 74.000%, 54.424% 74.000%, 53.812% 74.000%, 53.199% 74.000%, 52.587% 74.000%, 51.974% 74.000%, 51.362% 74.000%, 50.750% 74.000%, 50.137% 74.000%, 49.525% 74.000%, 48.912% 74.000%, 48.300% 74.000%, 47.687% 74.000%, 47.075% 74.000%, 46.463% 74.000%, 45.850% 74.000%, 45.238% 74.000%, 44.625% 74.000%, 44.013% 74.000%, 43.400% 74.000%, 42.788% 74.000%, 42.175% 74.000%, 41.563% 74.000%, 40.951% 74.000%, 40.338% 74.000%, 39.726% 73.821%, 39.113% 72.903%, 38.501% 71.984%, 37.888% 71.065%, 37.276% 69.917%, 36.663% 68.998%, 36.051% 68.233%, 35.439% 67.697%, 34.826% 66.396%, 34.214% 65.553%, 33.601% 64.941%, 32.989% 64.405%, 32.376% 63.640%, 31.764% 62.951%, 31.152% 62.338%, 30.539% 61.649%, 29.927% 61.037%, 29.314% 60.501%, 28.702% 59.965%, 28.089% 59.276%, 27.477% 58.663%, 26.864% 58.051%, 26.252% 57.439%, 25.640% 57.132%, 25.027% 56.520%, 24.415% 55.984%, 23.802% 55.448%, 23.190% 54.912%, 22.577% 54.683%, 21.965% 54.147%, 21.352% 53.917%, 20.740% 53.458%, 20.128% 52.998%, 19.515% 52.386%, 18.903% 51.774%, 18.290% 51.620%, 17.678% 51.467%, 17.065% 51.238%, 16.453% 50.778%, 15.841% 50.396%, 15.228% 49.936%, 14.616% 49.860%, 14.003% 49.400%, 13.391% 49.018%, 12.778% 48.558%, 0% 48.558%);
}
.tpl-brand-visual .burst-stage {
  position: absolute;
  inset: 0;
}
.tpl-brand-visual .burst-pile,
.tpl-brand-visual .burst-rooster-wrap {
  position: absolute;
  inset: 0;
  clip-path: var(--BurstRim, none);
}
.tpl-brand-visual .burst-rooster-wrap {
  clip-path: var(--BurstRimRooster, none);
}
.tpl-brand-visual .burst-spill {
  position: absolute;
  inset: 0;
}
.tpl-brand-visual .burst-spill-clip {
  display: none;
}
.tpl-brand-visual .burst-rooster {
  transform-origin: 50% 85%;
}
.tpl-brand-visual .burst-bag {
  left: 1.754%;
  top: 5.742%;
  width: 96.013%;
}
.tpl-brand-visual .burst-chips-back {
  left: 20.734%;
  top: 30.303%;
  width: 61.085%;
}
.tpl-brand-visual .burst-rooster {
  left: 22.967%;
  top: 2.313%;
  width: 60.686%;
}
.tpl-brand-visual .burst-chips-front {
  left: 22.807%;
  top: 47.847%;
  width: 60.048%;
}
.tpl-brand-visual .burst-spill-01 {
  left: 22.727%;
  top: 53.349%;
  width: 20.734%;
}
.tpl-brand-visual .burst-spill-02 {
  left: 29.187%;
  top: 61.005%;
  width: 18.102%;
}
.tpl-brand-visual .burst-spill-03 {
  left: 48.804%;
  top: 63.397%;
  width: 24.242%;
}
.tpl-brand-visual .burst-chip-01 {
  left: 12.121%;
  top: 9.968%;
  width: 23.923%;
}
.tpl-brand-visual .burst-chip-02 {
  left: 0.638%;
  top: 21.691%;
  width: 15.949%;
}
.tpl-brand-visual .burst-chip-03 {
  left: 70.335%;
  top: 2.711%;
  width: 19.936%;
}
.tpl-brand-visual .burst-chip-04 {
  left: 74.96%;
  top: 33.333%;
  width: 23.923%;
}
.tpl-brand-visual .burst-chip-05 {
  left: 21.531%;
  top: 2.711%;
  width: 10.766%;
}
.tpl-brand-visual .burst-chip-06 {
  left: 5.821%;
  top: 64.195%;
  width: 5.502%;
}
.tpl-brand-visual .burst-chip-07 {
  left: 18.581%;
  top: 78.868%;
  width: 7.337%;
}
.tpl-brand-visual .burst-chip-08 {
  left: 32.855%;
  top: 85.327%;
  width: 4.466%;
}
.tpl-brand-visual .burst-chip-09 {
  left: 87.081%;
  top: 73.445%;
  width: 7.097%;
}
.tpl-brand-visual .burst-chip-10 {
  left: 80.861%;
  top: 66.986%;
  width: 7.257%;
}
.tpl-brand-visual .burst-chip-11 {
  left: 74.163%;
  top: 80.542%;
  width: 4.944%;
}
.tpl-brand-visual .burst-chip-12 {
  left: 87.879%;
  top: 24.88%;
  width: 6.38%;
}
.tpl-brand-visual .burst-chip-13 {
  left: 70.016%;
  top: 21.85%;
  width: 5.582%;
}
.tpl-brand-visual .burst-chip-14 {
  left: 16.587%;
  top: 33.094%;
  width: 3.509%;
}
.tpl-brand-visual .burst-chip-15 {
  left: 16.108%;
  top: 76.475%;
  width: 3.349%;
}
.tpl-brand-visual .burst-chip-16 {
  left: 95.614%;
  top: 46.73%;
  width: 3.19%;
}
.tpl-brand-visual .burst-chip-17 {
  left: 3%;
  top: 71%;
  width: 11.5%;
}
.tpl-brand-visual .burst-chip-18 {
  left: 85%;
  top: 55%;
  width: 13%;
}
.tpl-brand-visual .burst-chip-19 {
  left: 23.5%;
  top: 63.5%;
  width: 8.5%;
}
.tpl-brand-visual .burst-chip-20 {
  left: 77%;
  top: 85.5%;
  width: 8%;
}
.tpl-brand-visual .burst-chip-21 {
  left: 92%;
  top: 6%;
  width: 7%;
}
.tpl-brand-visual .burst-chip-22 {
  left: 6%;
  top: 52.5%;
  width: 4.2%;
}
.tpl-brand-visual .burst-chip-23 {
  left: 44.5%;
  top: 86%;
  width: 4%;
}
.tpl-brand-visual .burst-chip-24 {
  left: 57.5%;
  top: 87%;
  width: 3.6%;
}

.tpl-evolution {
  position: relative;
  height: 42.96875vw;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  background: var(--ColorTertiary, #FBCA4D);
}
.tpl-evolution::before, .tpl-evolution::after {
  content: "";
  position: absolute;
  background: url("../image/evolution-texture.webp") center/100% 100% no-repeat;
  opacity: 0.2;
  pointer-events: none;
}
.tpl-evolution::before {
  left: -26.6015625vw;
  top: 50%;
  margin-top: -39.0625vw;
  width: 63.8671875vw;
  height: 66.265625vw;
  transform-origin: 76.6015625vw 39.0625vw;
  transform: scale(var(--texture-scale, 1)) rotate(-10deg);
}
.tpl-evolution::after {
  left: 64.7265625vw;
  top: 50%;
  margin-top: -29.453125vw;
  width: 62.359375vw;
  height: 64.69921875vw;
  transform-origin: -14.7265625vw 29.453125vw;
  transform: scale(var(--texture-scale, 1)) rotate(-12deg);
}
.tpl-evolution .evolution-deco {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  pointer-events: none;
}
.tpl-evolution .deco-first {
  width: 26.953125vw;
  height: 31.9921875vw;
}
.tpl-evolution .deco-first .deco-transform {
  position: absolute;
  inset: 0;
  transform: scaleX(-1);
}
.tpl-evolution .deco-first .deco-art {
  left: -0.47%;
  top: 0.11%;
  width: 93.59%;
  height: 99.8%;
}
.tpl-evolution .deco-first .deco-piece.piece-01 {
  left: 0.98%;
  top: 49.287%;
  width: 78.877%;
}
.tpl-evolution .deco-first .deco-piece.piece-02 {
  left: 14.617%;
  top: 7.846%;
  width: 66.221%;
}
.tpl-evolution .deco-first .deco-piece.piece-crumbs {
  left: 19.43%;
  top: 0.856%;
  width: 77.807%;
}
.tpl-evolution .deco-second {
  width: 27.4969140625vw;
  height: 32.835625vw;
  display: flex;
  align-items: center;
  justify-content: center;
}
.tpl-evolution .deco-second .deco-transform {
  position: relative;
  flex: 0 0 auto;
  width: 25.2734375vw;
  height: 31.0546875vw;
  transform: rotate(4.23deg) scaleX(-1);
}
.tpl-evolution .deco-second .deco-art {
  left: 0.23%;
  top: 0.61%;
  width: 99.44%;
  height: 99.44%;
}
.tpl-evolution .deco-second .deco-piece.piece-01 {
  left: 12.567%;
  top: 56.419%;
  width: 64.617%;
}
.tpl-evolution .deco-second .deco-piece.piece-02 {
  left: 62.478%;
  top: 5.563%;
  width: 36.453%;
}
.tpl-evolution .deco-second .deco-piece.piece-03 {
  left: 21.034%;
  top: 36.591%;
  width: 42.692%;
}
.tpl-evolution .deco-second .deco-piece.piece-04 {
  left: 42.424%;
  top: 2.425%;
  width: 30.125%;
}
.tpl-evolution .deco-second .deco-piece.piece-crumbs {
  left: 1.337%;
  top: 18.188%;
  width: 81.818%;
}
.tpl-evolution .deco-art {
  position: absolute;
}
.tpl-evolution .deco-piece {
  position: absolute;
  display: block;
  height: auto;
  max-width: none;
}
.tpl-evolution .deco-piece.piece-01 {
  z-index: 4;
}
.tpl-evolution .deco-piece.piece-02 {
  z-index: 3;
}
.tpl-evolution .deco-piece.piece-03,
.tpl-evolution .deco-piece.piece-04 {
  z-index: 2;
}
.tpl-evolution .deco-piece.piece-crumbs {
  z-index: 1;
}
.tpl-evolution .text-block {
  position: relative;
  z-index: 2;
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--CardPadding, 1.40625vw);
}
.tpl-evolution .evolution-title {
  width: 37.65625vw;
  height: 11.6796875vw;
  margin: 0;
}
.tpl-evolution .evolution-title img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tpl-evolution .evolution-copy {
  width: 24.296875vw;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--SpaceFluidS, 0.78125vw);
  text-align: center;
}
.tpl-evolution .sub-title {
  color: var(--TextColorBlack, #000);
  white-space: nowrap;
}
.tpl-evolution .description {
  color: var(--TextColorSecondary, #333);
}

.tpl-value {
  display: grid;
  grid-template-columns: 1fr 1fr 2fr;
  height: 37.34375vw;
  background: var(--BgColor, #fff);
}
.tpl-value .value-tile {
  position: relative;
  overflow: hidden;
}
.tpl-value .tile-visual {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tpl-value .tile-content {
  position: absolute;
  z-index: 1;
  left: 2.8515625vw;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  color: var(--TextColorWhite, #fff);
}
.tpl-value .tile-figure {
  width: 19.296875vw;
  line-height: 0.9;
  letter-spacing: 1px;
  text-align: center;
  color: var(--TextColorWhite, #fff);
}
.tpl-value .tile-caption {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
}
.tpl-value .caption-line {
  display: block;
  font-size: 2.03125vw;
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 1px;
  white-space: nowrap;
  border-bottom: max(3px, 0.1953125vw) solid var(--ColorTertiary, #FBCA4D);
}
.tpl-value .tile-ratio .tile-content {
  top: 14.8828125vw;
  gap: 3.125vw;
}
.tpl-value .tile-ratio .tile-figure {
  font-family: "Outfit", sans-serif;
  font-size: 10.9375vw;
  font-weight: 700;
}
.tpl-value .tile-oil .tile-content {
  top: 15.15625vw;
  gap: 5.46875vw;
}
.tpl-value .tile-oil .tile-figure {
  font-size: 7.8125vw;
  font-weight: 800;
}
.tpl-value .tile-oil .tile-caption {
  width: 16.640625vw;
}
.tpl-value .tile-brand {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--CardPadding, 1.40625vw);
  padding: var(--BlockPadding, 7.03125vw);
  color: var(--TextColorBlack, #000);
}
.tpl-value .value-en-title {
  line-height: 1.15;
  color: #E5E5E5;
  white-space: nowrap;
}
.tpl-value .value-body {
  display: flex;
  width: 37.2265625vw;
}
.tpl-value .text-block {
  flex: 0 0 auto;
  width: 29.0234375vw;
  min-width: min-content;
  display: flex;
  flex-direction: column;
  gap: var(--CardPadding, 1.40625vw);
  padding: var(--SpaceFluidXL, 2.34375vw) var(--Space1, 16px) var(--SpaceFluidS, 0.78125vw) 0;
  border-top: 1px solid #EAEAEA;
}
.tpl-value .value-title {
  font-size: max(40px, 2.96875vw);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0;
}
.tpl-value .value-title .title-line {
  display: block;
  white-space: nowrap;
}
.tpl-value .value-title em {
  font-style: normal;
  color: var(--ColorSecondary, #E8380D);
}
.tpl-value .value-copy {
  display: flex;
  flex-direction: column;
  gap: var(--SpaceFluidXS, 0.46875vw);
}
.tpl-value .value-sub-title {
  font-size: var(--FontSizeSecondary, clamp(18px, 1.09375vw, 28px));
  font-weight: 500;
  line-height: 1.5;
  letter-spacing: 1px;
}
.tpl-value .description {
  width: 26.953125vw;
  color: var(--TextColorSecondary, #333);
}
.tpl-value .award-box {
  position: relative;
  flex: 0 0 auto;
  width: 6.875vw;
}
.tpl-value .award-box img {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.tpl-products {
  position: relative;
  padding: var(--SectionPadding, 80px) 0;
}
.tpl-products .value-peek {
  position: absolute;
  z-index: 2;
  bottom: 100%;
  overflow: hidden;
  pointer-events: none;
}
.tpl-products .peek-rooster {
  display: block;
  height: auto;
  max-width: none;
  margin: 1.40625vw auto -2.6171875vw;
  transform-origin: 50% 100%;
}
.tpl-products .value-peek {
  left: 13.046875vw;
  width: 23.90625vw;
}
.tpl-products .peek-rooster {
  width: 21.5625vw;
}
.tpl-products .product-tabs {
  position: sticky;
  top: var(--NaviBottom, 140px);
  z-index: 2;
  display: flex;
  justify-content: center;
  justify-content: safe center;
  flex-wrap: nowrap;
  gap: 1.171875vw;
  margin-bottom: var(--SpaceFluidXL, 2.34375vw);
  padding-block: var(--SpaceS, 12px);
  overflow-x: auto;
  background: var(--BgColorAlt, #F3F3F3);
}
.tpl-products .tab-btn {
  position: relative;
  width: max(150px, 7.8125vw);
  min-width: 150px;
  height: auto;
  padding: var(--SpaceS, 12px);
  border: 2px solid var(--BorderColorPrimary, #000);
  border-radius: var(--BtnBorderRadius, 10px);
  font-size: clamp(15px, 0.703125vw, 18px);
  font-weight: 400;
  letter-spacing: 1px;
  line-height: 1.5;
  color: var(--TextColorBlack, #000);
  background: var(--BgColor, #fff);
  overflow: hidden;
  isolation: isolate;
}
.tpl-products .tab-btn::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  width: 150%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--BtnFill, var(--ColorPrimary, #F08300));
  transform: var(--TransformCenter, translateX(-50%) translateY(-50%)) scale(0);
  transition: transform 0.5s cubic-bezier(0.65, 0, 0.35, 1);
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  .tpl-products .tab-btn::before {
    transition: none;
  }
}
.tpl-products .tab-btn.is-active {
  background: var(--ColorPrimary, #F08300);
  font-weight: 500;
}
@media (hover: hover) and (pointer: fine) {
  .tpl-products .tab-btn:not(.is-active):hover::before {
    transform: var(--TransformCenter, translateX(-50%) translateY(-50%)) scale(1);
  }
}
.tpl-products .tab-btn:not(.is-active):is(:active, :focus-visible)::before {
  transform: var(--TransformCenter, translateX(-50%) translateY(-50%)) scale(1);
}
.tpl-products .product-list {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--ItemPadding, 1.875vw);
}
.tpl-products .product-card .image-block {
  position: relative;
}
.tpl-products .product-card .image-block .img-scene {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0.4s ease, transform 0.4s ease;
}
.tpl-products .product-card.is-scene-shown .image-block .img-scene {
  opacity: 1;
}
@media (hover: hover) and (pointer: fine) {
  .tpl-products .product-card .card-link:hover .img-scene {
    opacity: 1;
  }
}
.tpl-products .product-card .card-link:is(:active, :focus-visible) .img-scene {
  opacity: 1;
}
.tpl-products .product-card .text-block {
  align-items: center;
  gap: var(--SpaceS, 12px);
  text-align: center;
}
.tpl-products .product-card .card-title {
  font-size: clamp(18px, 0.9375vw, 24px);
  font-weight: 800;
  letter-spacing: 1px;
}
.tpl-products .product-card .card-text {
  font-size: var(--FontSizeBodyL, clamp(14px, 0.703125vw, 18px));
  font-weight: 400;
  letter-spacing: 1px;
  color: var(--TextColorBlack, #000);
}
.tpl-products {
  /* 分類無商品資料時的提示 */
}
.tpl-products .product-empty {
  text-align: center;
  padding: var(--Space6, 60px) 0;
  font-size: var(--FontSizeHint, 22px);
  color: #666;
}
.tpl-products .btn-group {
  margin-top: max(var(--Space3, 32px), 3.515625vw);
}
.tpl-products .product-more {
  margin-top: 0;
}
.tpl-products .universe-strip {
  margin-top: var(--SpaceFluid3XL, 4.6875vw);
}

.tpl-quality {
  padding: 0 0 var(--SectionPadding, 80px);
}
.tpl-quality .quality-list {
  list-style: none;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: var(--ItemPadding, 1.875vw);
}
.tpl-quality .card-box {
  position: relative;
  overflow: hidden;
  padding: var(--SpaceFluid2XL, 3.125vw) var(--SpaceFluidXL, 2.34375vw) 25.390625vw;
  border-radius: 10px;
  color: var(--TextColorBlack, #000);
}
.tpl-quality .card-box.card-first {
  background: var(--ColorTertiary, #FBCA4D);
}
.tpl-quality .card-box.card-second {
  background: var(--ColorOrangeLight, #F8912C);
}
.tpl-quality .card-box.card-third {
  background: var(--ColorSecondary, #E8380D);
}
.tpl-quality .card-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.tpl-quality .text-block {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  gap: var(--Space1, 16px);
}
.tpl-quality .card-title {
  font-size: clamp(26px, 1.71875vw, 44px);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0;
}
.tpl-quality .card-text {
  font-size: clamp(15px, 0.859375vw, 22px);
  line-height: 1.5;
}

.tpl-b2b {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: stretch;
  justify-content: center;
  gap: var(--CardPadding, 1.40625vw);
  min-height: 40.8203125vw;
  padding: 0 11.71875vw 0 7.8125vw;
  background: var(--ColorTertiary, #FBCA4D);
  color: var(--TextColorBlack, #000);
}
.tpl-b2b::before, .tpl-b2b::after {
  content: "";
  position: absolute;
  z-index: 0;
  background: center/100% 100% no-repeat;
  pointer-events: none;
}
.tpl-b2b::before {
  left: 0;
  top: -0.0390625vw;
  bottom: 0;
  aspect-ratio: 1155/1046;
  background-image: url("../image/b2b-texture-01.webp");
}
.tpl-b2b::after {
  left: 64.453125vw;
  bottom: -1.3671875vw;
  width: 35.625vw;
  height: 32.7734375vw;
  background-image: url("../image/b2b-texture-02.webp");
}
.tpl-b2b .b2b-visual {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  width: 31.25vw;
}
.tpl-b2b .b2b-art {
  position: absolute;
  left: 1.50390625vw;
  bottom: -2.15234375vw;
  width: 31.23046875vw;
  height: 42.03125vw;
}
.tpl-b2b .b2b-art img {
  position: absolute;
  max-width: none;
}
.tpl-b2b .b2b-rooster {
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
.tpl-b2b .b2b-arrow {
  transform-origin: 0% 100%;
}
.tpl-b2b .b2b-arrow.arrow-01 {
  left: 22.906%;
  top: 20.399%;
  width: 69.786%;
  height: 40.799%;
}
.tpl-b2b .b2b-arrow.arrow-02 {
  left: 26.649%;
  top: 40.942%;
  width: 69.251%;
  height: 26.32%;
}
.tpl-b2b .b2b-arrow.arrow-03 {
  left: 29.857%;
  top: 58.488%;
  width: 66.221%;
  height: 15.692%;
}
.tpl-b2b .b2b-deco {
  position: absolute;
  z-index: 2;
  display: block;
  pointer-events: none;
}
.tpl-b2b .b2b-deco .b2b-deco-img {
  display: block;
  width: 100%;
  height: 100%;
  max-width: none;
  object-fit: cover;
}
.tpl-b2b .b2b-deco.deco-feather-first {
  left: 3.984375vw;
  top: 7.44921875vw;
  width: 10.234375vw;
  height: 6.9921875vw;
  transform: rotate(-46.09deg) scaleY(-1);
}
.tpl-b2b .b2b-deco.deco-feather-second {
  left: 90.10546875vw;
  top: 25.18359375vw;
  width: 7.265625vw;
  height: 6.015625vw;
  transform: rotate(27.37deg);
}
.tpl-b2b .b2b-deco.deco-garlic {
  left: 4.44140625vw;
  top: 27.30859375vw;
  width: 3.61328125vw;
  height: 3.03515625vw;
  transform: rotate(-7.63deg);
}
.tpl-b2b .b2b-content {
  position: relative;
  z-index: 3;
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  gap: var(--SpaceFluidXL, 2.34375vw);
  padding: var(--SectionPadding, 80px) 0;
}
.tpl-b2b .b2b-head {
  display: flex;
  flex-direction: column;
  gap: var(--CardPadding, 1.40625vw);
}
.tpl-b2b .b2b-en-title {
  line-height: 1.2;
  color: rgba(255, 255, 255, 0.5);
  white-space: nowrap;
}
.tpl-b2b .text-block {
  display: flex;
  flex-direction: column;
  gap: var(--SpaceFluidXS, 0.46875vw);
}
.tpl-b2b .b2b-title {
  font-size: var(--FontSizePrimary, clamp(40px, 2.8125vw, 72px));
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: 2px;
}
.tpl-b2b .sub-title {
  color: var(--TextColorBlack, #000);
}
.tpl-b2b .b2b-list {
  list-style: none;
  display: flex;
  gap: var(--CardPadding, 1.40625vw);
}
.tpl-b2b .card-box {
  flex: 1 1 0;
  min-width: 0;
  background: var(--BgColor, #fff);
  border-radius: 10px;
}
.tpl-b2b .card-link {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: var(--CardPadding, 1.40625vw);
  height: 100%;
  padding: var(--ItemPadding, 1.875vw);
  border-radius: 10px;
  color: var(--TextColorBlack, #000);
  text-align: center;
  transition: transform var(--TransitionDefault, 0.3s ease), box-shadow var(--TransitionDefault, 0.3s ease);
}
.tpl-b2b .card-link img {
  display: block;
  width: 3.90625vw;
  height: 3.90625vw;
  border-radius: 5px;
  object-fit: cover;
}
@media (hover: hover) and (pointer: fine) {
  .tpl-b2b .card-link:hover {
    color: var(--TextColorBlack, #000);
    transform: translateY(-6px);
    box-shadow: 0 16px 32px rgba(0, 0, 0, 0.1333333333);
  }
  .tpl-b2b .card-link:hover .card-btn::before {
    transform: var(--TransformCenter, translateX(-50%) translateY(-50%)) scale(1);
  }
  .tpl-b2b .card-link:hover .card-btn::after {
    background-position: 24px 50%, 0 50%;
  }
}
.tpl-b2b .card-link:is(:active, :focus-visible) {
  color: var(--TextColorBlack, #000);
  transform: translateY(-6px);
  box-shadow: 0 16px 32px rgba(0, 0, 0, 0.1333333333);
}
.tpl-b2b .card-link:is(:active, :focus-visible) .card-btn::before {
  transform: var(--TransformCenter, translateX(-50%) translateY(-50%)) scale(1);
}
.tpl-b2b .card-link:is(:active, :focus-visible) .card-btn::after {
  background-position: 24px 50%, 0 50%;
}
.tpl-b2b .card-text-group {
  display: flex;
  flex-direction: column;
  gap: var(--SpaceFluidXS, 0.46875vw);
  width: 100%;
}
.tpl-b2b .card-title {
  display: block;
  font-size: clamp(20px, 1.25vw, 32px);
  font-weight: 700;
  letter-spacing: 1px;
  line-height: 1.2;
}
.tpl-b2b .card-title-en {
  font-family: "Outfit", sans-serif;
}
.tpl-b2b .card-text {
  display: block;
  font-size: var(--FontSizeBodyL, clamp(14px, 0.703125vw, 18px));
  line-height: 1.5;
  letter-spacing: 1px;
  color: var(--TextColorSecondary, #333);
}
.tpl-b2b .card-btn {
  position: relative;
  display: inline-flex;
  flex-shrink: 0;
  align-items: center;
  gap: var(--SpaceS, 12px);
  margin-top: var(--Space1, 16px);
  height: 44px;
  padding: 0 clamp(14px, 1.1vw, 22px);
  white-space: nowrap;
  border: 2px solid var(--BorderColorPrimary, #000);
  border-radius: var(--BtnBorderRadius, 10px);
  font-size: var(--BtnFontSize, 17px);
  font-weight: 500;
  letter-spacing: 1px;
  overflow: hidden;
  isolation: isolate;
}
.tpl-b2b .card-btn::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  width: 150%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--BtnFill, var(--ColorTertiary, #FBCA4D));
  transform: var(--TransformCenter, translateX(-50%) translateY(-50%)) scale(0);
  transition: transform 0.5s cubic-bezier(0.65, 0, 0.35, 1);
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  .tpl-b2b .card-btn::before {
    transition: none;
  }
}
.tpl-b2b .card-btn::after {
  content: "";
  flex: 0 0 auto;
  width: 16px;
  height: 14px;
  background: url("../image/icon-btn-arrow.svg") 0 50%/contain no-repeat, url("../image/icon-btn-arrow.svg") -24px 50%/contain no-repeat;
  transition: background-position 0.45s cubic-bezier(0.65, 0, 0.35, 1);
}
@media (prefers-reduced-motion: reduce) {
  .tpl-b2b .card-btn::after {
    transition: none;
  }
}

.tpl-news .news-card .image-block img {
  aspect-ratio: 4/3;
  object-fit: cover;
}
.tpl-news {
  padding: var(--SectionPadding, 80px) 0;
}
.tpl-news .news-slider {
  position: relative;
}
.tpl-news .news-list {
  list-style: none;
}
.tpl-news .news-card {
  height: auto;
}
.tpl-news .news-card .image-block img {
  height: 18.4375vw;
  object-fit: cover;
}
.tpl-news .news-card .text-block {
  gap: var(--SpaceXS, 8px);
}
.tpl-news .news-card .card-title {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  font-size: clamp(17px, 0.859375vw, 22px);
  font-weight: 700;
  letter-spacing: 1px;
}
.tpl-news .news-card .card-text {
  display: -webkit-box;
  overflow: hidden;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  font-size: var(--FontSizeBodyL, clamp(14px, 0.703125vw, 18px));
  letter-spacing: 1.8px;
  color: var(--TextColorSecondary, #333);
}
.tpl-news .news-nav {
  position: absolute;
  top: 50%;
  z-index: 2;
  width: 80px;
  height: 80px;
  transform: var(--TransformYCenter, translateY(-50%));
  border: 2px solid var(--BorderColorPrimary, #000);
  border-radius: var(--BtnBorderRadius, 10px);
  background: var(--BgColor, #fff);
  font-size: 0;
  color: transparent;
  cursor: pointer;
  overflow: hidden;
  isolation: isolate;
}
.tpl-news .news-nav::before {
  content: "";
  position: absolute;
  z-index: -1;
  top: 50%;
  left: 50%;
  width: 150%;
  aspect-ratio: 1;
  border-radius: 50%;
  background: var(--BtnFill, var(--ColorTertiary, #FBCA4D));
  transform: var(--TransformCenter, translateX(-50%) translateY(-50%)) scale(0);
  transition: transform 0.5s cubic-bezier(0.65, 0, 0.35, 1);
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  .tpl-news .news-nav::before {
    transition: none;
  }
}
.tpl-news .news-nav::after {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: -12px 0 0 -12px;
}
.tpl-news .news-nav.news-prev {
  right: 100%;
  margin-right: 0.78125vw;
}
.tpl-news .news-nav.news-prev::after {
  content: "";
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  background: url("../image/icon-arrow-prev.svg") 0 50%/contain no-repeat, url("../image/icon-arrow-prev.svg") 32px 50%/contain no-repeat;
  transition: background-position 0.45s cubic-bezier(0.65, 0, 0.35, 1);
}
@media (prefers-reduced-motion: reduce) {
  .tpl-news .news-nav.news-prev::after {
    transition: none;
  }
}
.tpl-news .news-nav.news-next {
  left: 100%;
  margin-left: 0.78125vw;
}
.tpl-news .news-nav.news-next::after {
  content: "";
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  background: url("../image/icon-arrow-next.svg") 0 50%/contain no-repeat, url("../image/icon-arrow-next.svg") -32px 50%/contain no-repeat;
  transition: background-position 0.45s cubic-bezier(0.65, 0, 0.35, 1);
}
@media (prefers-reduced-motion: reduce) {
  .tpl-news .news-nav.news-next::after {
    transition: none;
  }
}
.tpl-news .news-nav.swiper-button-disabled {
  opacity: 0.4;
  cursor: default;
}
@media (hover: hover) and (pointer: fine) {
  .tpl-news .news-nav:not(.swiper-button-disabled):hover::before {
    transform: var(--TransformCenter, translateX(-50%) translateY(-50%)) scale(1);
  }
  .tpl-news .news-nav:not(.swiper-button-disabled):hover.news-prev::after {
    background-position: -32px 50%, 0 50%;
  }
  .tpl-news .news-nav:not(.swiper-button-disabled):hover.news-next::after {
    background-position: 32px 50%, 0 50%;
  }
}
.tpl-news .news-nav:is(:active, :focus-visible)::before {
  transform: var(--TransformCenter, translateX(-50%) translateY(-50%)) scale(1);
}
.tpl-news .news-nav:is(:active, :focus-visible).news-prev::after {
  background-position: -32px 50%, 0 50%;
}
.tpl-news .news-nav:is(:active, :focus-visible).news-next::after {
  background-position: 32px 50%, 0 50%;
}

.tpl-contact {
  display: grid;
  grid-template-columns: 1fr 1fr;
  background: var(--BgColor, #fff);
}
.tpl-contact .contact-map {
  position: relative;
  overflow: hidden;
  background: var(--ColorTertiary, #FBCA4D);
}
.tpl-contact .map-stage {
  position: absolute;
  left: 0;
  top: 50%;
  width: 100%;
  aspect-ratio: 1280/1161;
  transform: var(--TransformYCenter, translateY(-50%));
}
.tpl-contact .map-image {
  position: absolute;
  left: -1.304%;
  top: -2.061%;
  width: 102.893%;
  height: 96.744%;
  max-width: none;
  -webkit-mask-image: linear-gradient(to bottom, transparent, #000 12%, #000 90%, transparent);
  mask-image: linear-gradient(to bottom, transparent, #000 12%, #000 90%, transparent);
}
.tpl-contact .map-layer {
  position: absolute;
  inset: 0;
}
.tpl-contact .map-dots {
  position: absolute;
  left: 12.421%;
  top: 23.581%;
  width: 78.047%;
  height: 40.482%;
  max-width: none;
  pointer-events: none;
}
.tpl-contact .map-routes {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}
.tpl-contact .map-route {
  fill: none;
  stroke: var(--ColorOrangeVivid, #FF5D00);
  stroke-width: 2.7;
  stroke-linecap: round;
  stroke-dasharray: 1;
  stroke-dashoffset: 0;
  opacity: 0.7;
}
.tpl-contact .map-origin {
  position: absolute;
  aspect-ratio: 1;
  transform: var(--TransformCenter, translateX(-50%) translateY(-50%));
  pointer-events: none;
}
.tpl-contact .map-origin::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: radial-gradient(circle, var(--ColorSecondary, #E8380D) 0%, rgba(232, 56, 13, 0.8) 35%, rgba(232, 56, 13, 0) 70%);
  animation: map-pulse-ring 2.4s cubic-bezier(0.22, 1, 0.36, 1) infinite;
}
.tpl-contact .map-origin {
  left: 76.19%;
  top: 48.514%;
  width: 2.2%;
}
.tpl-contact.is-offscreen .map-origin::before {
  animation-play-state: paused;
}
.tpl-contact .map-pulse {
  position: absolute;
  aspect-ratio: 1;
  transform: var(--TransformCenter, translateX(-50%) translateY(-50%));
  pointer-events: none;
}
.tpl-contact .map-pulse::before, .tpl-contact .map-pulse::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: 50%;
}
.tpl-contact .map-pulse::before {
  background: radial-gradient(circle, var(--ColorOrangeVivid, #FF5D00) 0%, rgba(255, 93, 0, 0.8) 35%, rgba(255, 93, 0, 0) 70%);
  animation: map-pulse-ring 2.4s cubic-bezier(0.22, 1, 0.36, 1) infinite;
  animation-delay: var(--pulse-delay, 0s);
}
.tpl-contact .map-pulse::after {
  background: #FFF4C2;
  opacity: 0;
  transform: scale(0.45);
  animation: map-pulse-core 2.4s ease-in-out infinite;
  animation-delay: var(--pulse-delay, 0s);
}
.tpl-contact .map-pulse {
  width: 1.25%;
}
.tpl-contact .map-pulse.pulse-01 {
  left: 20.238%;
  top: 31.757%;
  --pulse-delay: 0s;
}
.tpl-contact .map-pulse.pulse-02 {
  left: 56.176%;
  top: 48.098%;
  --pulse-delay: 0.9s;
}
.tpl-contact .map-pulse.pulse-03 {
  left: 22.812%;
  top: 38.156%;
  --pulse-delay: 0.3s;
}
.tpl-contact .map-pulse.pulse-04 {
  left: 30.543%;
  top: 57.328%;
  --pulse-delay: 1.5s;
}
.tpl-contact .map-pulse.pulse-05 {
  left: 48.147%;
  top: 36.189%;
  --pulse-delay: 0.6s;
}
.tpl-contact .map-pulse.pulse-06 {
  left: 72.365%;
  top: 52.638%;
  --pulse-delay: 1.8s;
}
.tpl-contact .map-pulse.pulse-07 {
  left: 80.086%;
  top: 39.714%;
  --pulse-delay: 1.2s;
}
.tpl-contact .map-pulse.pulse-08 {
  left: 73.361%;
  top: 42.771%;
  --pulse-delay: 2.1s;
}
.tpl-contact .pulse-flash {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  background: radial-gradient(circle, #FFF4C2 0%, var(--ColorOrangeVivid, #FF5D00) 30%, rgba(255, 93, 0, 0) 70%);
  opacity: 0;
  pointer-events: none;
}
.tpl-contact.is-offscreen .map-pulse::before, .tpl-contact.is-offscreen .map-pulse::after {
  animation-play-state: paused;
}
.tpl-contact .contact-panel {
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: var(--SpaceFluid2XL, 3.125vw);
  padding: var(--BlockPadding, 7.03125vw) 5.46875vw;
  color: var(--TextColorBlack, #000);
}
.tpl-contact .contact-head {
  position: relative;
}
.tpl-contact .text-block {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: var(--SpaceFluidS, 0.78125vw);
}
.tpl-contact .contact-title {
  font-size: var(--FontSizePrimary, clamp(40px, 2.8125vw, 72px));
  font-weight: 800;
  line-height: 1.3;
  letter-spacing: 2px;
  color: #020202;
  border-bottom: 5px solid var(--ColorSecondary, #E8380D);
}
.tpl-contact .sub-title {
  color: var(--TextColorBlack, #000);
}
.tpl-contact .contact-badge-spin {
  position: absolute;
  left: 31.04296875vw;
  top: -1.58203125vw;
  width: 8.42578125vw;
}
.tpl-contact .contact-badge {
  display: block;
  width: 100%;
  height: auto;
  transform: rotate(9.75deg);
}
.tpl-contact .contact-badge-swing {
  position: relative;
  display: block;
  transform-origin: 49.96% 49.8%;
}
.tpl-contact .contact-badge-ring {
  position: absolute;
  inset: 0;
  width: 100%;
  height: auto;
  transform: rotate(9.75deg);
  transform-origin: 49.96% 49.8%;
  pointer-events: none;
}
.tpl-contact .contact-form {
  display: flex;
  flex-direction: column;
}
.tpl-contact .form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: var(--CardPadding, 1.40625vw);
}
.tpl-contact .field-full {
  grid-column: 1/-1;
}
.tpl-contact .form-field {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  display: flex;
  align-items: center;
  gap: var(--CardPadding, 1.40625vw);
  min-width: 0;
  min-height: 52px;
  padding: 0 var(--SpaceFluidS, 0.78125vw);
  border: 1px solid var(--BorderColorPrimary, #000);
  border-radius: 10px;
  background: var(--BgColor, #fff);
}
.tpl-contact .form-field::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 0;
  background: #F3F3F3;
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform 0.45s cubic-bezier(0.65, 0, 0.35, 1);
  pointer-events: none;
}
@media (prefers-reduced-motion: reduce) {
  .tpl-contact .form-field::before {
    transition: none;
  }
}
.tpl-contact .form-field:focus-within {
  box-shadow: inset 0 0 0 1px var(--BorderColorTertiary, #111);
}
.tpl-contact .form-field:focus-within::before {
  transform: scaleX(1);
}
.tpl-contact .required-mark {
  margin-left: var(--Space2XS, 4px);
  color: #CC300B;
}
.tpl-contact .field-label {
  flex: 0 0 auto;
  font-size: var(--FontSizeHint, 22px);
  font-weight: 700;
  letter-spacing: 1.1px;
  line-height: 1.4;
  color: var(--TextColorBlack, #000);
  cursor: pointer;
}
.tpl-contact input,
.tpl-contact select,
.tpl-contact textarea {
  flex: 1 1 auto;
  min-width: 0;
  height: 50px;
  padding: 0;
  border: none;
  background: transparent;
  font-size: var(--FontSizeHint, 22px);
  font-weight: 400;
  letter-spacing: 1px;
  color: var(--TextColorBlack, #000);
}
.tpl-contact input:focus-visible,
.tpl-contact select:focus-visible,
.tpl-contact textarea:focus-visible {
  outline: none;
}
.tpl-contact select {
  appearance: none;
  padding-right: var(--Space5, 48px);
  background: url("../image/icon-triangle-down.svg") right center/24px 24px no-repeat;
  cursor: pointer;
}
.tpl-contact select:invalid {
  color: #6B6B6B;
}
.tpl-contact .field-textarea {
  align-items: flex-start;
  padding: 11px var(--SpaceFluidS, 0.78125vw);
}
.tpl-contact .field-textarea .field-label {
  line-height: 30px;
}
.tpl-contact .field-textarea textarea {
  height: 130px;
  padding: 3px 0 0;
  line-height: 1.5;
  resize: vertical;
}
.tpl-contact .form-notice {
  margin-top: var(--Space2, 24px);
  padding: var(--Space1, 16px) 18px;
  border-radius: 8px;
  background: var(--BgColorCream, #FFF4D6);
  font-size: var(--FontSizeBody, 17px);
  color: #8A4B00;
}
.tpl-contact .btn-group {
  margin-top: var(--SpaceFluid2XL, 3.125vw);
}
.tpl-contact .form-submit {
  margin-top: 0;
}

@media (prefers-reduced-motion: reduce) {
  .tpl-partners .partner-list {
    animation: none;
  }
  .tpl-hero .swiper-initialized .hero-content > *,
  .tpl-hero .swiper-initialized .hero-visual {
    transform: none;
    transition: opacity var(--TransitionDefault, 0.3s ease);
  }
  .tpl-hero .swiper-initialized .hero-slide:not(.swiper-slide-active) .hero-content > *,
  .tpl-hero .swiper-initialized .hero-slide:not(.swiper-slide-active) .hero-visual {
    transform: none;
  }
  .tpl-hero .hero-scroll::after {
    animation: none;
  }
  .tpl-contact .map-pulse::before, .tpl-contact .map-pulse::after,
  .tpl-contact .map-origin::before,
  .tpl-contact .map-origin::after {
    animation: none;
  }
}
@media (max-width: 1680px) {
  .scene-anchor {
    scroll-margin-top: -136px;
  }
}
@media (max-width: 1536px) {
  .scene-anchor {
    scroll-margin-top: -126px;
  }
  .tpl-evolution .evolution-copy {
    width: 31.25vw;
  }
  .tpl-contact .contact-badge-spin {
    width: 9.765625vw;
  }
}
@media (max-width: 1440px) {
  .tpl-news .news-nav {
    width: 60px;
    height: 60px;
  }
}
@media (max-width: 1439px) {
  .tpl-hero {
    height: auto;
    min-height: 0;
    aspect-ratio: 2/1;
  }
  .tpl-hero .hero-controls {
    bottom: 33px;
    gap: var(--Space2, 24px);
  }
  .tpl-hero .hero-scroll {
    bottom: 18px;
    flex-direction: row;
    gap: var(--SpaceS, 12px);
  }
  .tpl-hero .hero-scroll::after {
    width: 44px;
    height: 44px;
  }
  .tpl-hero .hero-pagination {
    gap: var(--Space3, 32px);
  }
  .tpl-hero .hero-pagination .swiper-pagination-bullet {
    position: relative;
  }
  .tpl-hero .hero-pagination .swiper-pagination-bullet::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 44px;
    height: 44px;
    transform: var(--TransformCenter, translateX(-50%) translateY(-50%));
  }
}
@media (max-width: 1280px) {
  .tpl-evolution .evolution-copy {
    width: 37.65625vw;
  }
  .tpl-b2b {
    padding: 0 calc(2.5% + 15px) 0 0;
  }
  .tpl-value {
    height: auto;
  }
}
@media (max-width: 1199px) {
  .tpl-hero .hero-pagination .swiper-pagination-bullet,
  .tpl-hero .hero-scroll {
    scroll-margin-bottom: -340px;
  }
  .tpl-partners .deco-top {
    width: 20vw;
    height: 20vw;
    top: -11.667vw;
    right: 4vw;
  }
  .tpl-partners .deco-bottom {
    width: 35vw;
    height: 35vw;
    left: -10.833vw;
    bottom: -25.833vw;
  }
  .tpl-partners .deco-hatch {
    width: 25vw;
    height: 25vw;
    top: 100%;
    bottom: auto;
    margin-top: -38px;
  }
  .tpl-products .value-peek {
    left: 10vw;
    width: 30vw;
  }
  .tpl-products .peek-rooster {
    width: 27vw;
    margin: 1.8vw auto -3.3vw;
  }
  .scene-anchor {
    scroll-margin-top: 0;
  }
  .tpl-brand-visual {
    --BurstSize: 39.84375vw;
  }
  .tpl-brand-visual .burst-visual {
    inset: 0;
    width: var(--BurstSize, 39.84375vw);
    height: var(--BurstSize, 39.84375vw);
    margin: auto;
  }
  .tpl-brand-visual.is-intro .burst-spill-clip {
    display: block;
    clip-path: var(--BurstRim, none);
  }
  .tpl-evolution {
    height: auto;
    min-height: 42.96875vw;
    padding: var(--SectionPadding, 80px) 0;
  }
  .tpl-evolution .evolution-deco {
    margin-block: -80px;
  }
  .tpl-evolution .description {
    font-size: var(--FontSizeBody, 17px);
  }
  .tpl-value {
    height: auto;
    min-height: 37.34375vw;
  }
  .tpl-value .description {
    font-size: var(--FontSizeBody, 17px);
  }
  .tpl-value .tile-ratio .tile-content {
    top: 100%;
    margin-top: -22.4609375vw;
  }
  .tpl-value .tile-oil .tile-content {
    top: 100%;
    margin-top: -22.1875vw;
  }
  .tpl-value .tile-brand {
    height: auto;
  }
  .tpl-products .product-tabs {
    gap: max(10px, 1.171875vw);
    margin-bottom: var(--Space2, 24px);
  }
  .tpl-products .product-card .text-block {
    container-type: inline-size;
    padding: var(--Space1, 16px);
  }
  .tpl-products .product-card .card-title {
    font-size: min(18px, 7.6cqi);
  }
  .tpl-products .product-card .card-text {
    font-size: var(--FontSizeBody, 17px);
  }
  .tpl-products .universe-strip {
    margin-top: var(--Space5, 48px);
  }
  .tpl-quality .card-box {
    padding-bottom: 110%;
  }
  .tpl-quality .card-box.card-third {
    background: #FA3D12;
  }
  .tpl-quality .card-bg {
    inset: auto 0 0;
    height: auto;
  }
  .tpl-b2b .card-link {
    padding: var(--Space3, 32px) var(--Space2, 24px);
  }
  .tpl-b2b .card-link img {
    width: max(6vw, 56px);
    height: max(6vw, 56px);
  }
  .tpl-b2b .card-text {
    font-size: var(--FontSizeBody, 17px);
  }
  .tpl-news {
    --NewsNav: 56px;
  }
  .tpl-news .news-card .image-block img {
    height: auto;
    aspect-ratio: 6/5;
  }
  .tpl-news .news-card .text-block {
    padding: var(--Space2, 24px);
  }
  .tpl-news .news-card .card-text {
    font-size: var(--FontSizeBody, 17px);
  }
  .tpl-news .news-nav {
    width: var(--NewsNav, 56px);
    height: var(--NewsNav, 56px);
  }
  .tpl-news .news-nav.news-prev {
    margin-right: 0;
    transform: translate(50%, -50%);
  }
  .tpl-news .news-nav.news-next {
    margin-left: 0;
    transform: var(--TransformCenter, translateX(-50%) translateY(-50%));
  }
  .tpl-contact .contact-panel {
    gap: var(--Space3, 32px);
    padding: var(--SectionPadding, 80px) var(--Space4, 40px);
  }
  .tpl-contact .contact-head {
    --BadgeSize: clamp(120px, 8.5vw, 150px);
    container-type: inline-size;
  }
  .tpl-contact .text-block {
    gap: var(--Space1, 16px);
    padding-right: var(--BadgeSize, 120px);
    margin-right: var(--SpaceS, 12px);
  }
  .tpl-contact .sub-title {
    text-wrap: balance;
    word-break: keep-all;
  }
  .tpl-contact .contact-badge-spin {
    inset: 0 0 auto auto;
    width: var(--BadgeSize, 120px);
  }
  .tpl-contact .form-grid {
    grid-template-columns: 1fr;
    gap: var(--Space1, 16px);
  }
  .tpl-contact .form-field {
    gap: var(--SpaceS, 12px);
    padding: 0 var(--Space1, 16px);
  }
  .tpl-contact .field-label {
    white-space: nowrap;
  }
  .tpl-contact .field-textarea {
    padding: var(--SpaceS, 12px) var(--Space1, 16px);
  }
  .tpl-contact .btn-group {
    margin-top: var(--Space3, 32px);
  }
}
@media (max-width: 1024px) {
  .tpl-evolution .sub-title {
    white-space: normal;
    text-wrap: balance;
  }
}
@media (min-width: 851px) and (max-width: 1199px) and (min-height: 501px) {
  .scene-anchor {
    scroll-margin-top: -96px;
  }
  .tpl-brand-visual {
    --BurstSize: min(45.9vw, 80vh);
    --SloganFont: min(7.2vw, 12.55vh);
    height: min(100vh, 75vw);
  }
  @supports (height: 100svh) {
    .tpl-brand-visual {
      --BurstSize: min(45.9vw, 80svh);
      --SloganFont: min(7.2vw, 12.55svh);
      height: min(100svh, 75vw);
    }
  }
  .tpl-brand-visual .slogan {
    top: var(--NaviBottom, 80px);
    width: 100%;
  }
  .tpl-brand-visual .slogan-lines {
    font-size: var(--SloganFont, 7.2vw);
    line-height: var(--SloganFont, 7.2vw);
  }
  .tpl-brand-visual .burst-visual {
    top: var(--NaviBottom, 80px);
  }
  .tpl-evolution {
    min-height: min(100vh, 75vw);
    min-height: min(100svh, 75vw);
  }
  .tpl-evolution::before {
    left: 50%;
    top: -40.91%;
    margin-top: 0;
    width: auto;
    height: 154.22%;
    aspect-ratio: 1635/1696.4;
    translate: -119.94% 0;
    transform-origin: 119.94% 58.95%;
    transform: rotate(-10deg);
  }
  .tpl-evolution::after {
    left: 50%;
    top: -18.55%;
    margin-top: 0;
    width: auto;
    height: 150.57%;
    aspect-ratio: 1596.4/1656.3;
    translate: 23.62% 0;
    transform-origin: -23.62% 45.52%;
    transform: rotate(-12deg);
  }
}
@media (min-width: 851px) and (max-width: 1100px) {
  .tpl-value .value-body {
    flex-direction: column;
  }
  .tpl-value .text-block {
    width: 100%;
    flex: auto;
    padding-right: 0;
  }
  .tpl-value .description {
    width: 100%;
  }
  .tpl-value .award-box {
    flex: auto;
    width: 45%;
    aspect-ratio: 758/636;
  }
  .tpl-contact {
    grid-template-columns: 1fr;
    scroll-margin-top: calc(-56vw - 56px);
  }
  .tpl-contact .contact-map {
    height: 56vw;
  }
  .tpl-contact .map-route {
    vector-effect: non-scaling-stroke;
    stroke-width: 1.5px;
  }
}
@media (max-width: 991px) {
  .tpl-products .product-tabs {
    justify-content: flex-end;
    justify-content: safe flex-end;
  }
  .tpl-value {
    grid-template-columns: 1fr 1fr;
    grid-template-areas: "brand brand" "ratio oil";
    min-height: 0;
  }
  .tpl-value .tile-ratio,
  .tpl-value .tile-oil {
    aspect-ratio: 640/956;
    container-type: inline-size;
  }
  .tpl-value .tile-ratio {
    grid-area: ratio;
  }
  .tpl-value .tile-ratio .tile-content {
    margin-top: -89.84375cqw;
    gap: 12.5cqw;
  }
  .tpl-value .tile-ratio .tile-figure {
    font-size: 43.75cqw;
  }
  .tpl-value .tile-oil {
    grid-area: oil;
  }
  .tpl-value .tile-oil .tile-content {
    margin-top: -88.75cqw;
    gap: 21.875cqw;
  }
  .tpl-value .tile-oil .tile-figure {
    font-size: 31.25cqw;
  }
  .tpl-value .tile-oil .tile-caption {
    width: 66.5625cqw;
  }
  .tpl-value .tile-content {
    left: 11.40625cqw;
  }
  .tpl-value .tile-figure {
    width: 77.1875cqw;
  }
  .tpl-value .caption-line {
    font-size: min(8.125cqw, 26px);
    border-bottom-width: max(2px, 0.78125cqw);
  }
  .tpl-value .tile-brand {
    grid-area: brand;
  }
  .tpl-value .value-body {
    width: auto;
  }
  @supports not (container-type: inline-size) {
    .tpl-value .tile-ratio .tile-content {
      margin-top: -44.921875vw;
      gap: 6.25vw;
    }
    .tpl-value .tile-ratio .tile-figure {
      font-size: 21.875vw;
    }
    .tpl-value .tile-oil .tile-content {
      margin-top: -44.375vw;
      gap: 10.9375vw;
    }
    .tpl-value .tile-oil .tile-figure {
      font-size: 15.625vw;
    }
    .tpl-value .tile-oil .tile-caption {
      width: 33.28125vw;
    }
    .tpl-value .tile-content {
      left: 5.703125vw;
    }
    .tpl-value .tile-figure {
      width: 38.59375vw;
    }
    .tpl-value .caption-line {
      font-size: min(4.0625vw, 26px);
      border-bottom-width: max(2px, 0.390625vw);
    }
  }
  .tpl-products .value-peek {
    left: 26.09375vw;
    width: 47.8125vw;
  }
  .tpl-products .peek-rooster {
    width: 43.125vw;
    margin: 2.8125vw auto -5.25vw;
  }
  .tpl-b2b {
    flex-direction: column;
    gap: 0;
    min-height: 0;
    padding: 0;
  }
  .tpl-b2b .b2b-visual {
    order: 1;
    width: 400px;
    height: 510.7px;
    margin: var(--SpaceXS, 8px) auto 0;
  }
  .tpl-b2b .b2b-art {
    left: 0;
    bottom: -27.6px;
    width: 400px;
    height: 538.3px;
  }
  .tpl-b2b .b2b-deco.deco-feather-first {
    width: 13vw;
    height: auto;
    aspect-ratio: 11/7;
  }
  .tpl-b2b .b2b-deco.deco-feather-second {
    inset: auto 8px 20px auto;
    width: 15vw;
    height: auto;
    aspect-ratio: 11/9;
  }
  .tpl-b2b .b2b-deco.deco-garlic {
    width: 7vw;
    height: auto;
    aspect-ratio: 25/21;
  }
  .tpl-b2b .b2b-content {
    padding: var(--SectionPadding, 80px) var(--Space3, 32px) 0;
  }
  .tpl-b2b .b2b-head,
  .tpl-b2b .text-block {
    align-items: center;
    text-align: center;
  }
}
@media (min-width: 851px) and (max-width: 991px) {
  .tpl-value .tile-brand {
    text-align: center;
  }
  .tpl-value .value-body,
  .tpl-value .text-block {
    align-items: center;
  }
  .tpl-value .award-box {
    width: 180px;
  }
}
@media (max-width: 850px) {
  .tpl-hero .hero-pagination .swiper-pagination-bullet,
  .tpl-hero .hero-scroll {
    scroll-margin-bottom: -76px;
  }
  .tpl-partners {
    padding-bottom: max(15vw, 64px);
  }
  .tpl-partners .partner-item img {
    height: 48px;
  }
  .tpl-partners .deco-top {
    width: 15vw;
    height: 15vw;
    top: -7.5vw;
    right: 4vw;
  }
  .tpl-partners .deco-bottom {
    width: 24vw;
    height: 24vw;
    left: -12vw;
    bottom: -12vw;
  }
  .tpl-partners .deco-hatch {
    width: 18vw;
    height: 18vw;
    top: 100%;
    right: -10vw;
    bottom: auto;
    margin-top: 16px;
  }
  .tpl-brand-visual {
    --BurstSize: min(80vw, 640px, 100vh - 180px);
    --BurstPad: clamp(32px, 8vh, 80px);
    --SloganFont: min(7.2vw, 15.7vh - 28px);
    height: auto;
    padding: var(--BurstPad, 32px) 0;
  }
  @supports (height: 100svh) {
    .tpl-brand-visual {
      --BurstSize: min(80vw, 640px, 100svh - 180px);
      --BurstPad: clamp(32px, 8svh, 80px);
      --SloganFont: min(7.2vw, 15.7svh - 28px);
    }
  }
  .tpl-brand-visual .slogan {
    width: 100%;
  }
  .tpl-brand-visual .burst-visual {
    position: relative;
    inset: auto;
    margin: 0 auto;
  }
  .tpl-brand-visual .slogan-lines {
    font-size: var(--SloganFont, 7.2vw);
    line-height: var(--SloganFont, 7.2vw);
    -webkit-text-stroke-width: 2px;
  }
  .tpl-evolution {
    min-height: 0;
    padding: var(--SectionPadding, 80px) var(--Space2, 24px) max(20vw, 120px);
  }
  .tpl-evolution::before {
    left: -38vw;
    top: -30vw;
    margin-top: 0;
    width: 96vw;
    height: 99.6vw;
    transform-origin: 50% 50%;
    transform: rotate(-10deg);
  }
  .tpl-evolution::after {
    inset: auto -38vw -30vw auto;
    width: 96vw;
    height: 99.6vw;
    transform-origin: 50% 50%;
    transform: rotate(-12deg);
  }
  .tpl-evolution .evolution-deco {
    position: absolute;
    margin: 0;
  }
  .tpl-evolution .deco-first {
    left: -8vw;
    top: -12vw;
    width: 34vw;
    height: auto;
    aspect-ratio: 690/819;
  }
  .tpl-evolution .deco-second {
    right: -8vw;
    bottom: -16vw;
    width: 34vw;
    height: auto;
    aspect-ratio: 703.921/840.592;
  }
  .tpl-evolution .deco-second .deco-transform {
    width: 91.914%;
    height: auto;
    aspect-ratio: 647/795;
  }
  .tpl-evolution .text-block {
    flex: 0 1 auto;
    gap: var(--Space2, 24px);
  }
  .tpl-evolution .evolution-title {
    width: min(80vw, 560px);
    height: auto;
    aspect-ratio: 964/299;
  }
  .tpl-evolution .evolution-copy {
    width: auto;
    gap: var(--SpaceS, 12px);
  }
  .tpl-evolution .sub-title {
    white-space: normal;
    text-wrap: balance;
  }
  .tpl-evolution .description {
    max-width: 34em;
  }
  .tpl-value .tile-brand {
    gap: var(--Space1, 16px);
    padding: var(--Space6, 60px) var(--Space3, 32px);
  }
  .tpl-value .value-en-title,
  .tpl-value .value-title,
  .tpl-value .value-sub-title {
    text-align: center;
  }
  .tpl-value .value-body {
    flex-direction: column;
    align-items: center;
    gap: var(--Space2, 24px);
    width: auto;
  }
  .tpl-value .text-block {
    flex: 1 1 auto;
    width: auto;
    gap: var(--Space1, 16px);
    padding: var(--Space2, 24px) 0 0;
  }
  .tpl-value .value-title .title-line {
    white-space: normal;
  }
  .tpl-value .value-title em {
    display: inline-block;
  }
  .tpl-value .value-copy {
    gap: var(--SpaceXS, 8px);
  }
  .tpl-value .description {
    width: auto;
  }
  .tpl-value .award-box {
    width: 160px;
    aspect-ratio: 758/636;
  }
  .tpl-products .product-list {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--Space2, 24px);
  }
  .tpl-products .tab-btn {
    width: auto;
  }
  .tpl-products .product-card .card-title {
    font-size: 16px;
    letter-spacing: 0;
  }
  .tpl-quality .quality-list {
    grid-template-columns: repeat(2, 1fr);
    gap: var(--Space2, 24px);
  }
  .tpl-quality .card-box {
    padding: var(--Space3, 32px) var(--Space3, 32px) 110%;
  }
  .tpl-quality .card-box.card-third {
    grid-column: 1/3;
  }
  .tpl-b2b::before {
    bottom: auto;
    width: 62vw;
  }
  .tpl-b2b::after {
    inset: auto 0 0 auto;
    width: 46vw;
    height: auto;
    aspect-ratio: 912/839;
  }
  .tpl-b2b .b2b-content {
    gap: var(--Space3, 32px);
  }
  .tpl-b2b .b2b-head {
    gap: var(--SpaceXS, 8px);
  }
  .tpl-b2b .text-block {
    gap: var(--SpaceXS, 8px);
  }
  .tpl-b2b .sub-title {
    text-wrap: balance;
    word-break: keep-all;
  }
  .tpl-b2b .b2b-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: var(--Space1, 16px);
  }
  .tpl-b2b .card-box:last-child {
    grid-column: 1/-1;
  }
  .tpl-b2b .card-link {
    gap: var(--SpaceS, 12px);
    padding: var(--Space2, 24px) var(--Space1, 16px);
  }
  .tpl-b2b .card-link img {
    width: 56px;
    height: 56px;
  }
  .tpl-b2b .card-text-group {
    gap: var(--SpaceXS, 8px);
  }
  .tpl-news {
    --NewsNav: 52px;
  }
  .tpl-contact {
    grid-template-columns: 1fr;
    scroll-margin-top: max(-78.125vw - 56px, var(--NaviHeight, 80px) - 100vh - 56px);
    scroll-margin-top: max(-78.125vw - 56px, var(--NaviHeight, 80px) - 100svh - 56px);
  }
  .tpl-contact .contact-map {
    height: min(78.125vw, 100vh - var(--NaviHeight, 75px));
    height: min(78.125vw, 100svh - var(--NaviHeight, 75px));
  }
  .tpl-contact .map-stage {
    left: 50%;
    width: auto;
    height: 116.1%;
    transform: var(--TransformCenter, translateX(-50%) translateY(-50%));
  }
  .tpl-contact .map-route {
    vector-effect: non-scaling-stroke;
    stroke-width: 1.5px;
  }
  .tpl-contact .contact-head {
    --BadgeSize: max(10vw, 120px);
  }
}
@media (min-width: 651px) and (max-width: 850px) {
  .tpl-quality .card-box.card-third {
    aspect-ratio: 2048/2069;
    padding-bottom: 0;
  }
  .tpl-quality .card-box.card-third .card-bg {
    inset: 0 0 auto;
  }
}
@media (min-width: 651px) and (max-width: 850px) and (orientation: portrait), (min-width: 851px) and (max-width: 991px) and (min-height: 501px) {
  .tpl-hero {
    height: 113.9vw;
    aspect-ratio: auto;
  }
  .tpl-hero .hero-layer {
    max-width: none;
  }
  .tpl-hero .layer-text {
    inset: auto;
    top: -14.509vw;
    left: 12.227vw;
    width: 148.198vw;
    height: 74.099vw;
  }
  .tpl-hero .layer-visual,
  .tpl-hero .layer-deco {
    inset: auto;
    top: 45.302vw;
    left: -33.241vw;
    width: 137.171vw;
    height: 68.586vw;
  }
  .tpl-hero .hero-controls {
    bottom: 24px;
  }
  .tpl-hero .hero-scroll {
    display: none;
  }
}
@media (max-width: 850px) and (orientation: portrait) {
  .tpl-brand-visual {
    --BurstSize: min(80vw, 640px, 65vh);
    --BurstPad: clamp(32px, 10vw, 80px);
    --SloganFont: 7.2vw;
  }
  @supports (height: 100svh) {
    .tpl-brand-visual {
      --BurstSize: min(80vw, 640px, 65svh);
    }
  }
  .tpl-brand-visual .slogan {
    top: var(--BurstPad, 32px);
    bottom: auto;
    margin-top: 1.6vw;
  }
  .tpl-brand-visual .burst-visual {
    margin-top: 14.4vw;
  }
}
@media (max-width: 850px) and (orientation: landscape), (max-width: 1199px) and (orientation: landscape) and (max-height: 500px) {
  .tpl-hero {
    margin-bottom: var(--FloatSafeBottom, 76px);
    background: var(--BgColorHero, #FFC85B);
  }
  .tpl-hero .hero-controls {
    inset: auto 5% 8px;
    width: auto;
    max-width: none;
    margin: 0;
  }
  .tpl-hero .hero-scroll {
    display: none;
  }
}
@media (max-width: 850px) and (orientation: landscape) {
  .tpl-contact .map-stage {
    -webkit-mask-image: linear-gradient(to right, transparent, #000 32px, #000 calc(100% - 32px), transparent);
    mask-image: linear-gradient(to right, transparent, #000 32px, #000 calc(100% - 32px), transparent);
  }
}
@media (max-width: 1199px) and (orientation: landscape) and (max-height: 500px) {
  .tpl-hero {
    --HeroVH: 100vh;
    aspect-ratio: auto;
    height: min(50vw - 110px, var(--HeroVH, 100vh) - var(--FloatSafeBottom, 76px) - var(--NaviHeight, 64px));
  }
  @supports (height: 100svh) {
    .tpl-hero {
      --HeroVH: 100svh;
    }
  }
  .tpl-hero .hero-bg {
    left: auto;
    width: auto;
    aspect-ratio: 2/1;
  }
  .tpl-hero .hero-controls {
    inset: auto auto 12px 5%;
  }
}
@media (max-width: 800px) {
  .tpl-quality .card-title {
    font-size: 22px;
  }
}
@media (max-width: 767px) {
  .tpl-contact .contact-badge-spin {
    width: 20vw;
    top: -5vw;
  }
}
@media (max-width: 650px) {
  .tpl-contact .sub-title,
  .tpl-evolution .sub-title,
  .tpl-b2b .sub-title {
    text-wrap: wrap;
    word-break: normal;
  }
  .tpl-hero .hero-scroll {
    display: none;
  }
  .tpl-partners .partner-item img {
    height: 40px;
  }
  .tpl-brand-visual {
    --BurstSize: min(90vw, 100vh - 180px);
  }
  @supports (height: 100svh) {
    .tpl-brand-visual {
      --BurstSize: min(90vw, 100svh - 180px);
    }
  }
  .tpl-brand-visual .slogan-lines {
    -webkit-text-stroke-width: 1.5px;
  }
  .tpl-evolution {
    padding-bottom: var(--SectionPadding, 80px);
  }
  .tpl-evolution .deco-first,
  .tpl-evolution .deco-second {
    display: none;
  }
  .tpl-evolution .evolution-title {
    width: 86vw;
  }
  .tpl-value {
    grid-template-columns: 1fr;
    grid-template-areas: "brand" "ratio" "oil";
  }
  .tpl-value .tile-ratio,
  .tpl-value .tile-oil {
    aspect-ratio: auto;
  }
  .tpl-value .tile-visual {
    object-position: 50% 0;
  }
  .tpl-value .tile-ratio .tile-content,
  .tpl-value .tile-oil .tile-content {
    position: relative;
    top: auto;
    left: 50%;
    margin-top: 0;
    transform: var(--TransformXCenter, translateX(-50%));
  }
  .tpl-value .tile-ratio .tile-content {
    padding: 59.53125cqw 0 var(--Space5, 48px);
  }
  .tpl-value .tile-oil .tile-content {
    padding: 60.625cqw 0 36cqw;
  }
  .tpl-value .tile-ratio .tile-figure,
  .tpl-value .tile-oil .tile-figure {
    width: 100%;
  }
  .tpl-value .tile-ratio .tile-caption,
  .tpl-value .tile-oil .tile-caption {
    width: 100%;
    align-items: center;
    text-align: center;
  }
  .tpl-value .caption-line {
    font-size: max(6vw, 2rem);
    text-align: center;
  }
  @supports not (container-type: inline-size) {
    .tpl-value .tile-ratio .tile-content {
      padding: 59.53125vw 0 var(--Space5, 48px);
      gap: 12.5vw;
    }
    .tpl-value .tile-ratio .tile-figure {
      font-size: 43.75vw;
    }
    .tpl-value .tile-oil .tile-content {
      padding: 60.625vw 0 36vw;
      gap: 21.875vw;
    }
    .tpl-value .tile-oil .tile-figure {
      font-size: 31.25vw;
    }
    .tpl-value .caption-line {
      border-bottom-width: max(2px, 0.78125vw);
    }
  }
  .tpl-products .value-peek {
    left: 14.140625vw;
    width: 71.71875vw;
  }
  .tpl-products .peek-rooster {
    width: 64.6875vw;
    margin: 4.21875vw auto -7.875vw;
  }
  .tpl-products .product-list {
    grid-template-columns: 1fr;
    max-width: 480px;
    margin-inline: auto;
  }
  .tpl-products .product-card .card-title {
    font-size: 18px;
  }
  .tpl-products .product-more {
    width: 100%;
  }
  .tpl-quality .quality-list {
    grid-template-columns: 1fr;
    max-width: 480px;
    margin-inline: auto;
  }
  .tpl-quality .card-box {
    padding: var(--Space3, 32px) var(--Space3, 32px) 110%;
  }
  .tpl-quality .card-box.card-third {
    grid-column: auto;
  }
  .tpl-quality .card-title {
    text-align: center;
  }
  .tpl-b2b::before {
    width: 70vw;
  }
  .tpl-b2b::after {
    width: 60vw;
  }
  .tpl-b2b .b2b-visual {
    width: 93vw;
    height: 118.76vw;
  }
  .tpl-b2b .b2b-art {
    bottom: -6.4vw;
    width: 93vw;
    height: 125.16vw;
  }
  .tpl-b2b .b2b-deco.deco-feather-first {
    left: 4vw;
    top: 104px;
    width: 19.5vw;
  }
  .tpl-b2b .b2b-deco.deco-feather-second {
    right: -6px;
    bottom: 118.8vw;
    width: 22.5vw;
    margin-bottom: var(--Space2, 24px);
  }
  .tpl-b2b .b2b-deco.deco-garlic {
    inset: auto auto 78vw 6vw;
    width: 10.5vw;
  }
  .tpl-b2b .b2b-content {
    gap: var(--Space2, 24px);
    padding: var(--SectionPadding, 80px) var(--Space2, 24px) 0;
  }
  .tpl-b2b .b2b-list {
    grid-template-columns: 1fr;
    gap: var(--SpaceS, 12px);
  }
  .tpl-b2b .card-link {
    padding: var(--Space3, 32px);
  }
  .tpl-b2b .card-link img {
    width: 48px;
    height: 48px;
  }
  .tpl-b2b .card-btn {
    gap: var(--SpaceXS, 8px);
    height: 36px;
    padding: 0 var(--SpaceXS, 8px);
  }
  .tpl-news {
    --NewsNav: 45.6px;
  }
  .tpl-news .news-card .text-block {
    padding: var(--Space1, 16px);
  }
  .tpl-contact {
    scroll-margin-top: max(-78.125vw - 48px, var(--NaviHeight, 64px) - 100vh - 48px);
    scroll-margin-top: max(-78.125vw - 48px, var(--NaviHeight, 64px) - 100svh - 48px);
  }
  .tpl-contact .map-layer {
    left: 50%;
    width: 120%;
    transform: var(--TransformXCenter, translateX(-50%));
  }
  .tpl-contact .map-pulse {
    width: 2.4%;
  }
  .tpl-contact .map-origin {
    width: 3.6%;
  }
  .tpl-contact .contact-panel {
    gap: var(--Space3, 32px);
    margin-top: -15vw;
    padding: 0 var(--Space2, 24px) var(--Space5, 48px);
  }
  .tpl-contact .contact-head {
    display: flex;
    flex-direction: column-reverse;
    align-items: end;
    gap: var(--Space2, 24px);
  }
  .tpl-contact .contact-badge-spin {
    position: relative;
    inset: auto;
    display: block;
    width: 27vw;
  }
  .tpl-contact .text-block {
    align-self: center;
    align-items: center;
    padding: 0;
    margin-right: 0;
    text-align: center;
  }
  .tpl-contact .form-grid {
    gap: var(--SpaceS, 12px);
  }
  .tpl-contact .form-field {
    padding: 0 var(--SpaceS, 12px);
  }
  .tpl-contact .field-textarea {
    padding: var(--SpaceS, 12px);
  }
  .tpl-contact .btn-group {
    margin-top: var(--Space2, 24px);
  }
  .tpl-contact .form-submit {
    width: var(--BtnWidth, 100%);
    height: 52px;
  }
}
@media (max-width: 650px) and (orientation: portrait) {
  .tpl-hero {
    display: flex;
    flex-direction: column;
    aspect-ratio: auto;
    padding-bottom: 0;
    background: var(--BgColor, #fff);
  }
  .tpl-hero .hero-bg.hero-layer {
    display: none;
  }
  .tpl-hero .hero-slider {
    width: 100%;
    height: auto;
    background: var(--BgColorHero, #FFC85B);
  }
  .tpl-hero .hero-slider .swiper-wrapper {
    height: auto;
  }
  .tpl-hero .hero-slide {
    height: auto;
  }
  .tpl-hero .hero-slide picture {
    display: block;
    width: 100%;
  }
  .tpl-hero .hero-bg {
    position: relative;
    inset: auto;
    display: block;
    width: 100%;
    height: auto;
    margin: 0;
  }
  .tpl-hero .hero-bg,
  .tpl-hero .hero-ring-m,
  .tpl-hero .hero-deco-m {
    aspect-ratio: 1440/2129;
  }
  .tpl-hero .hero-ring-m,
  .tpl-hero .hero-deco-m {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: auto;
  }
  .tpl-hero .hero-content {
    position: absolute;
    inset: auto 0 0;
    padding: 0;
  }
  .tpl-hero .hero-controls {
    inset: auto auto 64px 4.24%;
    width: auto;
    max-width: none;
    margin: 0;
    padding: 0;
  }
  .tpl-hero .hero-pagination {
    margin-left: 0;
  }
  .tpl-brand-visual {
    --BurstSize: min(90vw, 70vh);
    --BurstPad: clamp(32px, 11vw, 48px);
  }
  @supports (height: 100svh) {
    .tpl-brand-visual {
      --BurstSize: min(90vw, 70svh);
    }
  }
  .tpl-brand-visual .slogan {
    margin-top: 1.8vw;
  }
}
@media (max-width: 480px) {
  .tpl-value .value-title {
    font-size: 8vw;
  }
  .tpl-evolution .sub-title {
    letter-spacing: 0;
  }
  .tpl-evolution .description {
    text-align: center;
  }
  .tpl-value .description {
    text-align: center;
  }
  .tpl-b2b .card-btn {
    justify-content: center;
    width: 100%;
    height: auto;
    padding: var(--SpaceXS, 8px);
  }
  .tpl-b2b .card-link img {
    width: 56px;
    height: 56px;
  }
}
@media (max-width: 374px) {
  .tpl-contact .form-field {
    gap: var(--SpaceXS, 8px);
    padding-inline: var(--SpaceXS, 8px);
  }
  .tpl-contact select {
    padding-right: 28px;
  }
}