@charset "UTF-8";

html,
body,
#aspnetForm {
  overflow-x: clip !important;
}

#aspnetForm {
  overflow-y: clip;
}

.lp-page {
  --pc-width: 1366;
  --sp-width: 750;
  --pc-artboard-width: 450;
  --sp-artboard-width: 750;
  --formula: calc(var(--variable) * var(--ratio));
  --formula_pc: calc(var(--variable) * 1);
  --color-text: #7bb649;
  --color-bg: #f0fce2;
  --font-base: "dunbar-text", "dnp-shuei-mgothic-std", "Hiragino Sans", sans-serif;
  --font-jp: "dnp-shuei-mgothic-std", "Hiragino Sans", sans-serif;
  --font-movie: "a-otf-gothic-mb101-pr6n", "Hiragino Sans", sans-serif;
  --ease-base: cubic-bezier(0.25, 0.1, 0.25, 1);
  --duration-base: 0.8s;

  --header-offset: 0px;
}

@media (min-width: 1367px) {
  .lp-page {
    --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width));
    --variable: 1px;
  }
}

@media (min-width: 768px) and (max-width: 1366px) {
  .lp-page {
    --ratio: calc(var(--pc-artboard-width) / var(--sp-artboard-width));
    --variable: calc(100vw / var(--pc-width));
  }
}

@media (max-width: 767px) {
  .lp-page {
    --ratio: 1;
    --variable: calc(100vw / var(--sp-width));
  }
}

.lp-page * {
  box-sizing: border-box;
  font: inherit;
  letter-spacing: inherit;

  font-feature-settings: "pwid";
}

.lp-page img {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
  transition: unset;
}

.lp-page h1,
.lp-page h2,
.lp-page h3,
.lp-page h4,
.lp-page h5,
.lp-page h6,
.lp-page p {
  margin: 0;
}

.lp-page picture {
  display: block;
}

.lp-page button {
  padding: 0;
  cursor: pointer;
  appearance: none;
  color: inherit;
  background-color: unset;
  border: unset;
}

@media (min-width: 768px) {
  .lp-page .is-hidden--desktop {
    display: none !important;
  }
}

@media (max-width: 767px) {
  .lp-page .is-hidden--mobile {
    display: none !important;
  }
}

.lp-page .lp-deco {
  pointer-events: none;
}

.lp-page .lp-slider img,
.lp-page .lp-slider a {
  -webkit-user-drag: none;
  user-select: none;
}

.lp-page .lp-slider__pager {
  position: static;
}

.lp-page section,
.lp-page .lp-item {
  display: flow-root;
}

.lp-page {
  color: var(--color-text);
  background-color: var(--color-bg);
  font-family: var(--font-base);
  line-height: 1.5;
  letter-spacing: 0.05em;
}

.lp-page .ani-inview {
  opacity: 0;
  translate: 0 calc(30 * var(--formula, 1px));
  transition: opacity var(--duration-base) var(--ease-base),
    translate var(--duration-base) var(--ease-base);
}

.lp-page .ani-inview.is-active {
  opacity: 1;
  translate: 0 0;
}

.lp-page .ani-fade {
  opacity: 0;
  transition: opacity var(--duration-base) var(--ease-base);
}

.lp-page .ani-fade.is-active {
  opacity: 1;
}

.lp-page .lp-inner {
  width: calc(var(--sp-artboard-width) * var(--formula));
  margin-inline: auto;
  display: flow-root;
}

@media (min-width: 768px) {
  .lp-page .lp-inner {
    width: calc(var(--pc-artboard-width) * var(--formula_pc));
  }
}

@media (min-width: 768px) {
  .lp-page .lp-layout { display: grid; align-items: start; }
  .lp-page .lp-layout--col-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .lp-page .lp-layout--col-3 {
    grid-template-columns:
      minmax(0, 1fr)
      min(calc(var(--pc-artboard-width) * var(--formula_pc)), 100%)
      minmax(0, 1fr);
  }
}

.lp-page .lp-layout__primary {
  overflow-x: clip;
  display: flow-root;
}

.lp-page .lp-layout__sub { display: none; }

@media (min-width: 768px) {
  .lp-page .lp-layout__sub {
    display: grid;
    place-items: center;
    position: sticky;
    top: var(--header-offset, 0px);
    height: calc(100dvh - var(--header-offset, 0px));
    overflow: hidden;
  }
}

#GP261002 .lp-page .lp-photo--mv {
  width: calc(750 * var(--formula));
}

#GP261002 .lp-page .lp-lead {
  padding-bottom: calc(93 * var(--formula));
}

#GP261002 .lp-page .lp-lead__logo {
  margin-top: calc(95 * var(--formula));
  margin-left: calc(54 * var(--formula));
  width: calc(641 * var(--formula));
}

#GP261002 .lp-page .lp-lead__text--01 {
  margin-top: calc(83 * var(--formula));
  margin-left: calc(40 * var(--formula));
  width: calc(670 * var(--formula));
  font-size: calc(24 * var(--formula));
  line-height: 1.8333;
  letter-spacing: 0.02em;
  text-align: center;
  color: #93b649;
  white-space: nowrap;
}

#GP261002 .lp-page .lp-lead__text--02 {
  margin-top: calc(32 * var(--formula));
  margin-left: calc(40 * var(--formula));
  width: calc(670 * var(--formula));
  font-size: calc(24 * var(--formula));
  line-height: 1.8333;
  letter-spacing: 0.02em;
  text-align: center;
  color: #93b649;
  white-space: nowrap;
}

#GP261002 .lp-page .lp-lead__text--03 {
  margin-top: calc(32 * var(--formula));
  margin-left: calc(40 * var(--formula));
  width: calc(670 * var(--formula));
  font-size: calc(24 * var(--formula));
  line-height: 1.8333;
  letter-spacing: 0.02em;
  text-align: center;
  color: #93b649;
  white-space: nowrap;
}

#GP261002 .lp-page .lp-lead__text--04 {
  margin-top: calc(29 * var(--formula));
  margin-left: calc(47 * var(--formula));
  width: calc(670 * var(--formula));
  font-size: calc(24 * var(--formula));
  line-height: 1.8333;
  letter-spacing: 0em;
  text-align: center;
  color: #93b649;
  white-space: nowrap;
}

#GP261002 .lp-page .lp-movie {
  position: relative;
  margin-top: calc(93 * var(--formula));
  margin-left: calc(60 * var(--formula));
  width: calc(640 * var(--formula));
  height: calc(1129 * var(--formula));
}

#GP261002 .lp-page .lp-movie__video {
  width: calc(630 * var(--formula));
}

#GP261002 .lp-page .lp-movie__label {
  position: absolute;
  top: calc(1047 * var(--formula));
  left: calc(19 * var(--formula));
  width: calc(130 * var(--formula));
  font-size: calc(44 * var(--formula));
  line-height: 1.2192;
  letter-spacing: 0.0em;
  color: #ffffff;
  white-space: nowrap;
}

#GP261002 .lp-page .lp-jacquard {
  padding-bottom: calc(150 * var(--formula));
}

#GP261002 .lp-page .lp-jacquard__block01 {
  position: relative;
  width: calc(750 * var(--formula));
}

#GP261002 .lp-page .lp-photo--jacquard01 {
  width: calc(750 * var(--formula));
}

#GP261002 .lp-page .lp-photo--jacquard02 {
  margin-top: calc(92 * var(--formula));
  margin-left: calc(30 * var(--formula));
  width: calc(551 * var(--formula));
}

#GP261002 .lp-page .lp-jacquard__title {
  position: absolute;
  top: calc(1077 * var(--formula));
  left: calc(331 * var(--formula));
  width: calc(399 * var(--formula));
}

#GP261002 .lp-page .lp-artwork {
  padding-bottom: calc(141 * var(--formula));
}

#GP261002 .lp-page .lp-artwork__lead {
  margin-top: calc(137 * var(--formula));
  margin-left: calc(75 * var(--formula));
  width: calc(601 * var(--formula));
  font-size: calc(34 * var(--formula));
  line-height: 1.4706;
  letter-spacing: 0.02em;
  text-align: center;
  color: #93b649;
  white-space: nowrap;
}

#GP261002 .lp-page .lp-artwork__block {
  position: relative;
  margin-top: calc(48 * var(--formula));
  margin-left: calc(85 * var(--formula));
  width: calc(580 * var(--formula));
  height: calc(940 * var(--formula));
}

#GP261002 .lp-page .lp-artwork__bears {
  margin-left: calc(61 * var(--formula));
  width: calc(458 * var(--formula));
}

#GP261002 .lp-page .lp-photo--artwork {
  position: absolute;
  top: calc(101 * var(--formula));
  left: calc(0 * var(--formula));
  width: calc(578 * var(--formula));
}

#GP261002 .lp-page .lp-cardigan {
  padding-bottom: calc(194 * var(--formula));
}

#GP261002 .lp-page .lp-cardigan__block01 {
  position: relative;
  width: calc(750 * var(--formula));
}

#GP261002 .lp-page .lp-photo--cardigan01 {
  width: calc(750 * var(--formula));
}

#GP261002 .lp-page .lp-cardigan__title {
  position: absolute;
  top: calc(48 * var(--formula));
  left: calc(47 * var(--formula));
  width: calc(362 * var(--formula));
}

#GP261002 .lp-page .lp-cardigan__block02 {
  position: relative;
  margin-top: calc(108 * var(--formula));
  margin-left: calc(61 * var(--formula));
  width: calc(662 * var(--formula));
}

#GP261002 .lp-page .lp-photo--cardigan02 {
  margin-left: calc(159 * var(--formula));
  width: calc(500 * var(--formula));
}

#GP261002 .lp-page .lp-cardigan__copy {
  position: absolute;
  top: calc(181 * var(--formula));
  left: calc(0 * var(--formula));
  width: calc(251 * var(--formula));
  font-size: calc(32 * var(--formula));
  line-height: 1.375;
  letter-spacing: 0.02em;
  text-align: center;
  color: #e6ffd2;
  white-space: nowrap;
}

#GP261002 .lp-page .lp-cardigan__deco01 {
  position: absolute;
  top: calc(322 * var(--formula));
  left: calc(115 * var(--formula));
  width: calc(157 * var(--formula));
}

#GP261002 .lp-page .lp-cardigan__bear {
  position: absolute;
  top: calc(439 * var(--formula));
  left: calc(0 * var(--formula));
  width: calc(200 * var(--formula));
}

#GP261002 .lp-page .lp-cardigan__block03 {
  position: relative;
  margin-top: calc(139 * var(--formula));
  margin-left: calc(20 * var(--formula));
  width: calc(730 * var(--formula));
  height: calc(1777 * var(--formula));
}

#GP261002 .lp-page .lp-photo--cardigan03 {
  width: calc(600 * var(--formula));
}

#GP261002 .lp-page .lp-photo--cardigan04 {
  position: absolute;
  top: calc(799 * var(--formula));
  left: calc(50 * var(--formula));
  width: calc(679 * var(--formula));
}

#GP261002 .lp-page .lp-cardigan__zzz {
  position: absolute;
  top: calc(928 * var(--formula));
  left: calc(519 * var(--formula));
  width: calc(194 * var(--formula));
}

#GP261002 .lp-page .lp-cutsewn {
  padding-bottom: calc(180 * var(--formula));
}

#GP261002 .lp-page .lp-cutsewn__block01 {
  position: relative;
  width: calc(750 * var(--formula));
}

#GP261002 .lp-page .lp-photo--cutsewn01 {
  width: calc(750 * var(--formula));
}

#GP261002 .lp-page .lp-cutsewn__title {
  position: absolute;
  top: calc(95 * var(--formula));
  left: calc(41 * var(--formula));
  width: calc(574 * var(--formula));
}

#GP261002 .lp-page .lp-cutsewn__note {
  position: relative;
  margin-top: calc(59 * var(--formula));
  margin-left: calc(65 * var(--formula));
  width: calc(614 * var(--formula));
  height: calc(240 * var(--formula));
}

#GP261002 .lp-page .lp-cutsewn__copy {
  position: absolute;
  top: calc(53 * var(--formula));
  left: calc(110 * var(--formula));
  width: calc(400 * var(--formula));
  font-size: calc(26 * var(--formula));
  line-height: 1.3077;
  letter-spacing: 0.02em;
  text-align: center;
  color: #96b4d3;
  white-space: nowrap;
}

#GP261002 .lp-page .lp-cutsewn__deco {
  position: absolute;
  top: calc(-11 * var(--formula));
  left: calc(-11 * var(--formula));
  width: calc(635 * var(--formula));
}

#GP261002 .lp-page .lp-goods {
  padding-bottom: calc(197 * var(--formula));
}

#GP261002 .lp-page .lp-footer {
  padding-bottom: calc(255 * var(--formula));
}

#GP261002 .lp-page .lp-footer__logo {
  margin-top: calc(82 * var(--formula));
  margin-left: calc(64 * var(--formula));
  width: calc(625 * var(--formula));
}

#GP261002 .lp-page .lp-photo--footer {
  margin-top: calc(87 * var(--formula));
  margin-left: calc(134 * var(--formula));
  width: calc(481 * var(--formula));
}

#GP261002 .lp-page .lp-footer__copyright {
  margin-top: calc(26 * var(--formula));
  margin-left: calc(212 * var(--formula));
  width: calc(320 * var(--formula));
}

#GP261002 .lp-page .lp-footer__button {
  position: relative;
  margin-top: calc(137 * var(--formula));
  margin-left: calc(74 * var(--formula));
  width: calc(602 * var(--formula));
}

#GP261002 .lp-page .lp-footer__button-bg {
  width: calc(602 * var(--formula));
}

#GP261002 .lp-page .lp-footer__button-text {
  position: absolute;
  top: calc(32 * var(--formula));
  left: calc(114 * var(--formula));
  width: calc(332 * var(--formula));
  font-size: calc(48 * var(--formula));
  line-height: 0.8385;
  letter-spacing: 0.03em;
  text-align: center;
  color: #7bb649;
  white-space: nowrap;
}

#GP261002 .lp-page .lp-footer__featuring {
  margin-top: calc(170 * var(--formula));
  margin-left: calc(272 * var(--formula));
  width: calc(183 * var(--formula));
  font-size: calc(44 * var(--formula));
  line-height: 1.5882;
  letter-spacing: 0.02em;
  text-align: center;
  color: #cfe6b8;
  white-space: nowrap;
  /* DunbarText Bold ＋ 緑の縁取り（約 1.75px / #93b649） */
  font-weight: 700;
  -webkit-text-stroke: calc(1.75 * var(--formula)) #93b649;
}

#GP261002 .lp-page .lp-footer__artist {
  margin-top: calc(70 * var(--formula));
  margin-left: calc(177 * var(--formula));
  width: fit-content;
  font-size: calc(44 * var(--formula));
  line-height: 0.9545;
  letter-spacing: 0.02em;
  text-align: center;
  color: #7bb649;
  white-space: nowrap;
}

#GP261002 .lp-page .lp-credit__row--01 {
  display: flex;
  align-items: flex-start;
  margin-top: calc(90 * var(--formula));
  margin-left: calc(198 * var(--formula));
  width: calc(354 * var(--formula));
}

#GP261002 .lp-page .lp-credit__row--01 .lp-credit__name {
  width: calc(185 * var(--formula));
  font-size: calc(28 * var(--formula));
  line-height: 1.4375;
  letter-spacing: 0.02em;
  color: #7bb649;
  white-space: nowrap;
}

#GP261002 .lp-page .lp-credit__row--01 .lp-credit__sns {
  margin-top: calc(-7 * var(--formula));
  margin-left: calc(70 * var(--formula));
  width: calc(109 * var(--formula));
}

#GP261002 .lp-page .lp-credit__row--02 {
  display: flex;
  align-items: flex-start;
  margin-top: calc(16 * var(--formula));
  margin-left: calc(198 * var(--formula));
  width: calc(298 * var(--formula));
}

#GP261002 .lp-page .lp-credit__row--02 .lp-credit__name {
  width: calc(153 * var(--formula));
  font-size: calc(28 * var(--formula));
  line-height: 1.4375;
  letter-spacing: 0.02em;
  color: #7bb649;
  white-space: nowrap;
}

#GP261002 .lp-page .lp-credit__row--02 .lp-credit__sns {
  margin-top: calc(-8 * var(--formula));
  margin-left: calc(103 * var(--formula));
  width: calc(52 * var(--formula));
}

#GP261002 .lp-page .lp-credit__row--03 {
  display: flex;
  align-items: flex-start;
  margin-top: calc(27 * var(--formula));
  margin-left: calc(198 * var(--formula));
  width: calc(298 * var(--formula));
}

#GP261002 .lp-page .lp-credit__row--03 .lp-credit__name {
  width: calc(184 * var(--formula));
  font-size: calc(28 * var(--formula));
  line-height: 1.4375;
  letter-spacing: 0.02em;
  color: #7bb649;
  white-space: nowrap;
}

#GP261002 .lp-page .lp-credit__row--03 .lp-credit__sns {
  margin-top: calc(-5 * var(--formula));
  margin-left: calc(72 * var(--formula));
  width: calc(52 * var(--formula));
}

#GP261002 .lp-lead     { background-color: #fffcf8; --color-section-bg: #fffcf8; }
#GP261002 .lp-jacquard { background-color: #d2ecb5; --color-section-bg: #d2ecb5; }
#GP261002 .lp-artwork  { background-color: #f0fce2; --color-section-bg: #f0fce2; }
#GP261002 .lp-cardigan { background-color: #39558a; --color-section-bg: #39558a; }
#GP261002 .lp-cutsewn  { background-color: #fff1ff; --color-section-bg: #fff1ff; }
#GP261002 .lp-goods    { background-color: #fffcf8; --color-section-bg: #fffcf8; }
#GP261002 .lp-footer   { background-color: #f0fce2; --color-section-bg: #f0fce2; }

#GP261002 .lp-lead__text { font-family: var(--font-jp); }

#GP261002 .lp-row--jacquard {
  position: relative;
  margin-top: calc(98 * var(--formula));
  margin-left: calc(15 * var(--formula));
  width: calc(735 * var(--formula));
  height: calc(634 * var(--formula));
}

#GP261002 .lp-jacquard__note {
  position: absolute;
  top: calc(108 * var(--formula));
  left: 0;
  width: calc(296 * var(--formula));
  height: calc(247 * var(--formula));
}

#GP261002 .lp-jacquard__note-text {
  position: absolute;
  white-space: normal;
  top: calc(41 * var(--formula));
  left: calc(39 * var(--formula));
  width: calc(257 * var(--formula));
  color: #fff;
  font-size: calc(28 * var(--formula));
  line-height: 1.3571;
  letter-spacing: 0.02em;
  text-align: left;
}

#GP261002 .lp-jacquard__deco {
  position: absolute;
  top: calc(-11 * var(--formula));
  left: calc(-10 * var(--formula));
  width: calc(313 * var(--formula));
}

#GP261002 .lp-jacquard__block02 {
  position: absolute;
  top: 0;
  left: calc(176 * var(--formula));
  width: calc(559 * var(--formula));
  height: calc(634 * var(--formula));
}

#GP261002 .lp-photo--jacquard03 {
  position: absolute;
  top: 0;
  left: calc(144 * var(--formula));
  width: calc(415 * var(--formula));
}

#GP261002 .lp-jacquard__bear {
  position: absolute;
  top: calc(364 * var(--formula));
  left: 0;
  width: calc(260 * var(--formula));
}

#GP261002 .lp-photo--jacquard04 {
  margin-top: calc(101 * var(--formula));
  width: calc(699 * var(--formula));
}

#GP261002 .lp-row--cutsewn {
  display: flex;
  align-items: flex-start;
  margin-top: calc(12 * var(--formula));
  width: calc(750 * var(--formula));
}

#GP261002 .lp-photo--cutsewn03 {
  margin-top: calc(110 * var(--formula));
  width: calc(370 * var(--formula));
}

#GP261002 .lp-cutsewn__block02 {
  position: relative;
  margin-left: calc(10 * var(--formula));
  width: calc(370 * var(--formula));
  height: calc(726 * var(--formula));
}

#GP261002 .lp-photo--cutsewn02 {
  width: calc(370 * var(--formula));
}

#GP261002 .lp-cutsewn__bear {
  position: absolute;
  top: calc(466 * var(--formula));
  left: calc(131 * var(--formula));
  width: calc(202 * var(--formula));
}

#GP261002 .lp-photo--cutsewn04 {
  margin-top: calc(129 * var(--formula));
  margin-left: calc(35 * var(--formula));
  width: calc(680 * var(--formula));
}

#GP261002 .lp-row--goods {
  position: relative;
  margin-top: calc(120 * var(--formula));
  margin-left: calc(20 * var(--formula));
  width: calc(710 * var(--formula));
  height: calc(1081 * var(--formula));
}

#GP261002 .lp-goods__lead {
  position: absolute;
  white-space: nowrap;
  top: 0;
  left: calc(31 * var(--formula));
  width: calc(650 * var(--formula));
  color: #7bb649;
  font-size: calc(26 * var(--formula));
  line-height: 1.2308;
  letter-spacing: 0.02em;
  text-align: center;
}

#GP261002 .lp-goods__block {
  position: absolute;
  top: calc(36 * var(--formula));
  left: 0;
  width: calc(710 * var(--formula));
  height: calc(1045 * var(--formula));
}

#GP261002 .lp-photo--goods {
  position: absolute;
  top: calc(109 * var(--formula));
  left: calc(23 * var(--formula));
  width: calc(664 * var(--formula));
  z-index: 1;
}

#GP261002 .lp-goods__title {
  position: absolute;
  top: calc(-10 * var(--formula));
  left: calc(160 * var(--formula));
  z-index: 2;
  color: #ffe6f5;
  font-size: calc(100 * var(--formula));
  line-height: 2.125;
  letter-spacing: 0em;
  text-align: center;
  white-space: nowrap;
  /* DunbarText Medium ＋ 緑の縁取り（約 2px / #7bb649） */
  font-weight: 500;
  -webkit-text-stroke: calc(2 * var(--formula)) #7bb649;
}

#GP261002 .lp-goods__plate {
  position: absolute;
  top: calc(106 * var(--formula));
  left: calc(23 * var(--formula));
  width: calc(664 * var(--formula));
  height: calc(922 * var(--formula));
  background-color: #7bb649;
  border-radius: calc(8 * var(--formula));
}

#GP261002 .lp-movie { position: relative; }

#GP261002 .lp-movie__video {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* #GP261002 .lp-movie::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgb(0 0 0 / 0.15);
  pointer-events: none;
} */

#GP261002 .lp-movie__label {
  z-index: 1;
  font-family: var(--font-movie);
}

/* 音声 ON/OFF ボタン（44x44、動画の右端から 20・下端から 20。
   .lp-movie は 1129 で動画（1120）より 9 高いので、動画下端基準に合わせて bottom は 29） */
#GP261002 .lp-page .lp-movie__sound {
  position: absolute;
  right: calc(32 * var(--formula));
  bottom: calc(30 * var(--formula));
  z-index: 2;
  width: calc(44 * var(--formula));
  height: calc(44 * var(--formula));
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

#GP261002 .lp-page .lp-movie__sound-icon {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

#GP261002 .lp-page .lp-movie__sound-icon--on,
#GP261002 .lp-page .lp-movie__sound.is-on .lp-movie__sound-icon--off {
  display: none;
}

#GP261002 .lp-page .lp-movie__sound.is-on .lp-movie__sound-icon--on {
  display: block;
}


/* 再生/一時停止ボタン（.js-movie-play）。.lp-movie に is-playing が付くと pause アイコンへ切り替わる。
   .lp-movie--overlay：中央の大きなボタン。再生中は非表示（動画タップで停止する前提）
   .lp-movie--toggle ：右下の 44x44 常時表示。音声ボタン（right 32）の左隣に並べる */
#GP261002 .lp-page .lp-movie__play {
  position: absolute;
  z-index: 2;
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  -webkit-appearance: none;
  appearance: none;
}

#GP261002 .lp-page .lp-movie__play-icon {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
}

#GP261002 .lp-page .lp-movie__play-icon--pause,
#GP261002 .lp-page .lp-movie.is-playing .lp-movie__play-icon--play {
  display: none;
}

#GP261002 .lp-page .lp-movie.is-playing .lp-movie__play-icon--pause {
  display: block;
}

#GP261002 .lp-page .lp-movie--overlay .lp-movie__play {
  top: 50%;
  left: 50%;
  width: calc(120 * var(--formula));
  height: calc(120 * var(--formula));
  transform: translate(-50%, -50%);
  transition: opacity 0.3s;
}

#GP261002 .lp-page .lp-movie--overlay.is-playing .lp-movie__play {
  opacity: 0;
  pointer-events: none;
}

#GP261002 .lp-page .lp-movie--toggle .lp-movie__play {
  right: calc(92 * var(--formula));
  bottom: calc(30 * var(--formula));
  width: calc(44 * var(--formula));
  height: calc(44 * var(--formula));
}

#GP261002 .lp-artwork__bears { position: relative; z-index: 1; }

#GP261002 .lp-photo--cardigan03 { z-index: 1; }
#GP261002 .lp-cardigan__block03 .lp-photo--cardigan03 { position: relative; }

#GP261002 .lp-footer__button {
  display: block;
  position: relative;
  text-decoration: none;
}

#GP261002 .lp-footer__button-text { display: block; }

#GP261002 .lp-credit__sns { display: block; }
#GP261002 .lp-credit__sns-link { display: block; }

/* Instagram と X を別リンクにした行。元の 1 枚 SVG（109 x 52）を x=52 で 2 分割しているので、
   横幅比 52 : 56.55 で並べると見た目は分割前と同じになる */
#GP261002 .lp-credit__sns--double { display: flex; align-items: flex-start; }
#GP261002 .lp-credit__sns--double .lp-credit__sns-link--instagram { width: calc(52 / 108.55 * 100%); }
#GP261002 .lp-credit__sns--double .lp-credit__sns-link--x { width: calc(56.55 / 108.55 * 100%); }
#GP261002 .lp-credit__sns--double img { width: 100%; height: auto; }

#GP261002 .lp-photo {
  position: relative;
  isolation: isolate;
}

/* ===== 演出 =====
   ・写真の出方（is_fadein）… 板 #edfcdf が下から伸び（1s）、0.45s 遅れて写真が下から開きつつ
     板は下から消える。写真は 1.05 → 1 に縮む。イージングは cubic-bezier(0.25, 1, 0.5, 1)
   ・散る写真（is_slidein）… 回転なし・遅延なし。1.2s 同イージング
   ・タイトル（js_random）… 1 文字 0.4s、0.1s 刻みのランダム順。出切ったら 2 文字が alternate-rotate 2s infinite
   ・手書き線（js_draw）… 線の上端が下 30% の線を越えたら、細切れのパスを文書順に 5ms おきに不透明にして描く
   ・クマ（is_sway）… 0 → 10deg → 0 を 3s で繰り返す
   ・回転写真（is_rotate）… rotateY 0 → 360deg を 2.5s ease-in-out
   ・GOODS の板 … 写真の出現 2s 後に不透明 + 3deg 傾く（0.5s）
   ・ページ全体 … load の 1s 後にフェードイン（0.3s）、その 0.5s 後に MV が出る */

#GP261002 {
  opacity: 0;
  transition: opacity 0.3s;
}

#GP261002.is-show { opacity: 1; }

/* 出現前は白い矩形 → 板 #edfcdf が下から伸びる → 写真、の順に見える */
#GP261002 .ani-reveal {
  background-color: #fff;
}

#GP261002 .ani-reveal::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 1;
  background-color: #edfcdf;
  transform: scaleY(0);
  transform-origin: bottom;
  clip-path: inset(0);
  transition: transform 1s cubic-bezier(0.25, 1, 0.5, 1),
    clip-path 1s cubic-bezier(0.25, 1, 0.5, 1) 0.45s;
}

#GP261002 .ani-reveal img {
  position: relative;
  z-index: 2;
  transform: scale(1.05);
  clip-path: inset(100% 0 0 0);
  transition: clip-path 1s cubic-bezier(0.25, 1, 0.5, 1) 0.45s,
    transform 1s cubic-bezier(0.25, 1, 0.5, 1) 0.5s;
}

#GP261002 .ani-reveal.is-active::before {
  transform: scaleY(1);
  clip-path: inset(0 0 100% 0);
}

#GP261002 .ani-reveal.is-active img {
  transform: scale(1);
  clip-path: inset(0);
}

/* 散る写真は板も開きも無し（まとまった状態で見えていて、位置へ動くだけ） */
#GP261002 .ani-move-down::before { content: none; }

#GP261002 .ani-move-down img {
  clip-path: none;
  transform: none;
}

#GP261002 .ani-move-down {
  overflow: hidden;
  will-change: transform;
  translate: var(--move-x, 0) var(--move-y, 0);
  transition: translate 1.2s cubic-bezier(0.25, 1, 0.5, 1);
}

#GP261002 .ani-move-down.is-active { translate: 0 0; }

/* まとまる位置 */
#GP261002 .lp-photo--jacquard02 {
  --move-x: 0;
  --move-y: calc(-100 * var(--formula));
}

#GP261002 .lp-photo--jacquard03 {
  --move-x: calc(-200 * var(--formula));
  --move-y: calc(-750 * var(--formula));
}

#GP261002 .lp-photo--cardigan02 {
  --move-x: 0;
  --move-y: calc(-100 * var(--formula));
}

#GP261002 .lp-photo--cardigan03 {
  --move-x: calc(60 * var(--formula));
  --move-y: calc(-850 * var(--formula));
}

/* カットソーは左が photo03、右が photo02 */
#GP261002 .lp-photo--cutsewn03 {
  --move-x: calc(100 * var(--formula));
  --move-y: calc(-200 * var(--formula));
}

#GP261002 .lp-photo--cutsewn02 {
  --move-x: calc(-100 * var(--formula));
  --move-y: calc(-150 * var(--formula));
}

/* 手書き線。`setupSceneReveal` が <img> をインライン <svg> に置き換え、
   線（直下の <g>）ごとに上端が下 30% の線を越えた時点から、パスを文書順に 5ms おきで
   不透明にしていく（JS が opacity を直接書く）。
   置き換えに失敗した（<img> のままの）ときは画像全体をフェードで出す */
#GP261002 img.ani-draw {
  opacity: 0;
  transition: opacity 0.3s ease;
}

#GP261002 img.ani-draw.is-active { opacity: 1; }

#GP261002 svg.ani-draw {
  display: block;
  height: auto;
}

#GP261002 svg.ani-draw path {
  opacity: 0;
  transition: opacity 0.05s ease;
}

@keyframes ani-sway {
  0%   { rotate: 0deg; }
  50%  { rotate: 10deg; }
  100% { rotate: 0deg; }
}

#GP261002 .ani-shake-deco img {
  animation: ani-sway 3s infinite;
}

@keyframes ani-spin-y {
  0%   { transform: rotateY(0deg); }
  100% { transform: rotateY(360deg); }
}

#GP261002 .ani-rotate-y.is-active {
  animation: ani-spin-y 2.5s ease-in-out forwards;
}

/* GOODS の緑の板。写真の出現（is-active）から 2s 後に出て 3deg 傾く */
#GP261002 .ani-tilt {
  opacity: 0;
  transform-origin: center;
  transition: opacity 0.5s ease 2s, rotate 0.5s ease 2s;
}

#GP261002 .ani-tilt.is-active {
  opacity: 1;
  rotate: 3deg;
}

/* 差し替え前の <img> は見せない（SVG の取得に失敗したときだけ is-active と同時に <img> のまま出す） */
#GP261002 .ani-letters img { opacity: 0; }
#GP261002 .ani-letters.is-active img { opacity: 1; }

#GP261002 .ani-letters svg {
  display: block;
  width: 100%;
  height: auto;
}

#GP261002 .ani-letters svg path {
  opacity: 0;
  transition: opacity 0.4s ease;
}

#GP261002 .ani-letters.is-active svg path { opacity: 1; }

#GP261002 .ani-letters svg .is-spin {
  transform-box: fill-box;
  transform-origin: center;
}

#GP261002 .ani-letters.is-spun svg .is-spin {
  animation: ani-alternate-rotate 2s infinite;
}

@keyframes ani-alternate-rotate {
  0%   { transform: rotate(0deg); }
  50%  { transform: rotate(360deg); }
  100% { transform: rotate(360deg); }
}

@media (min-width: 768px) {

  #GP261002 .lp-rail__logo {
    width: calc(340 * var(--formula_pc));
    height: auto;
  }

  #GP261002 .lp-rail__button {
    display: block;
    position: relative;
    width: calc(282 * var(--formula_pc));
    text-decoration: none;
  }

  #GP261002 .lp-rail__button-text {
    font-size: calc(23 * var(--formula_pc));
  }
}

#GP261002 .lp-rail__button-text {
  display: block;
  position: absolute;
  inset-inline: 0;
  top: 50%;
  translate: 0 -50%;
  color: #7bb649;
  font-family: "dunbar-text", sans-serif;
  font-size: calc(23 * var(--formula_pc));
  font-weight: 700;
  letter-spacing: 0.05em;
  text-align: center;
  white-space: nowrap;
}

#GP261002 .lp-page .lp-credit__sns { flex-shrink: 0; }

#GP261002 .lp-page .lp-lead__text--01 { margin-top: calc(87 * var(--formula)); }
#GP261002 .lp-page .lp-photo--footer {margin-top: calc(89 * var(--formula));}
#GP261002 .lp-page .lp-footer__button { margin-top: calc(144 * var(--formula)); }
#GP261002 .lp-page .lp-credit__row--02 { margin-top: calc(47 * var(--formula)); }
#GP261002 .lp-page .lp-credit__row--03 {margin-top: calc(46 * var(--formula));}

#GP261002 .lp-page .lp-link {
  display: block;
  position: relative;
  z-index: 2;
}

#GP261002 .lp-page .lp-jacquard__bear,
#GP261002 .lp-page .lp-cardigan__bear,
#GP261002 .lp-page .lp-cutsewn__bear,
#GP261002 .lp-page .lp-artwork__bears {
  display: block;
}
