a {
	display: block;
}

img {
  width: 100%;
}

a.btn {
  font-size: clamp(9px, 2vw, 12px);
  letter-spacing: 0;
  width: clamp(80px, 18vw, 102px);
  aspect-ratio: 195.2 / 41.6;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-inline: auto;
  border-radius: 100px;
  color: #fff;
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 700;
  background-color: #ffa7c5;
  position: relative;
}

a.btn::after {
  content: "";
  width: 26%;
  aspect-ratio: 53.3531 / 40.6099;
  background: url(../images/ribbon-pink.svg) center center / contain no-repeat;
  position: absolute;
  top: -45%;
  right: -7%;
}

a.btn-red {
  background-color: #c1272d;
}

a.btn-red::after {
  background: url(../images/apple.svg) center center / contain no-repeat;
  width: 19%;
  aspect-ratio: 37.4605 / 41.8493;
  right: -1%;
  top: -40%;
}

.scroll-fade {
  opacity: 0;
  transition: opacity 0.8s ease-out;
}

.scroll-fade.show {
  opacity: 1;
}

.scroll-scale {
  opacity: 0;
  transform: scale(1.1);
  transition: transform 0.8s cubic-bezier(.17,.67,.83,.67), opacity 0.3s ease;
}

.scroll-scale.show {
  opacity: 1;
  transform: scale(1);
}

.blur-anime.show {
  -webkit-mask-size: 160% 160%;
  mask-size: 160% 160%;
}

.blur-anime {
  -webkit-mask-image: radial-gradient(circle, rgba(0, 0, 0, 1) 60%, rgba(0, 0, 0, 0) 75%);
  mask-image: radial-gradient(circle, rgba(0, 0, 0, 1) 60%, rgba(0, 0, 0, 0) 75%);
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: 50% 50%;
  mask-position: 50% 50%;
  -webkit-mask-size: 0 0;
  mask-size: 0 0;
  transition: -webkit-mask-size 2s ease, mask-size 2s ease;
}

.lp-contents {
  background-color: #fcf6ef;
  color: #a8816c;
  font-family: "source-han-sans-japanese", sans-serif;
  font-weight: 500;
}

.pc-bg {
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  display: flex;
}

.pc-bg img {
  position: absolute;
  top: 0;
  left: 0;
  height: 100%;
  object-fit: cover;
  object-position: center left;
}

.pc-bg img:nth-child(2) {
  opacity: 0;
  transition: opacity 0.8s ease;
  z-index: 1;
}

.pc-bg.bg2 img:nth-child(2) {
  opacity: 1;
}

.pc-bg img:last-child {
  opacity: 0;
  transition: opacity 0.8s ease;
  z-index: 2;
}

.pc-bg.bg3 img:last-child {
  opacity: 1;
}

.main-contents {
  margin-left: auto;
  margin-right: 15%;
  max-width: 550px;
  width: 100%;
  height: auto;
  overflow: hidden;
  z-index: 10;
  background-color: #fcebec;
  position: relative;
}

@media (max-width: 1200px) {
  .lp-contents {
    background-color: #FEBBC3;
  }
  .pc-bg {
    display: none;
  }
  .main-contents {
    margin-inline: auto;
  }
}

.mv {
  position: relative;
}

.mv-swiper {
  width: 102%;
  margin-left: -1%;
}

.mv-logo {
width: 41%;
position: absolute;
top: 10%;
left: 50%;
transform: translateX(-50%);
z-index: 2;
}

.intro {
  margin-top: 9%;
}

.intro-text {
  color: #a37a5a;
  text-align: center;
  font-family: "Zen Kaku Gothic New", sans-serif;
  font-weight: 400;
  font-size: clamp(10px, 3.2vw, 17px);
  letter-spacing: 0.13em;
  line-height: 1.55;
}

.intro ul {
  margin-top: 10%;
  display: flex;
  justify-content: center;
  gap: 2%;
}

.intro ul li {
  width: 40%;
}

.intro-img1,
.intro-img2 {
  opacity: 0;
  transform: translateY(40px) scale(0.6);
  transform-origin: center bottom;
  transition-delay: 1.2s;
}

.intro-item.show .intro-img1,
.intro-item.show .intro-img2 { 
  opacity: 1;
  animation: jump 0.9s forwards;
}

@keyframes jump {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  60% {
    transform: translateY(-20px);
  }
  90% {
    transform: translateY(1px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.intro-btn {
  margin-top: 8%;
}

#dream-princess {
  scroll-margin-top: -100px;
}

@media (max-width: 550px) {
  #dream-princess {
    scroll-margin-top: -80px;
  }
}

.dream-princess {
  margin-top: 8%;
  padding-top: 6%;
}

.dream-princess-img1 {
  width: 90%;
  margin-inline: auto;
  position: relative;
  z-index: 2;
}

.dream-princess-img1::before {
  content:"";
  width: 12.5%;
  aspect-ratio: 121.572 / 165.7569;
  background: url(../images/perl.png) center center / contain no-repeat;
  position: absolute;
  top: -5%;
  left: -3%;
  z-index: 1;
}

.dream-princess-img1::after {
  content: "";
  width: 15%;
  aspect-ratio: 138.0023 / 147.4974;
  background: url(../images/perl2.png) center center / contain no-repeat;
  position: absolute;
  bottom: -3.5%;
  right: -5%;
  z-index: 1;
}

.dream-princess-img2-wrap {
  margin-top: 10%;
  display: flex;
  padding-inline: 1.7%;
}

.dream-princess-img2-price {
  width: 52%;
  text-align: center;
  padding-top: 22%;
  position: relative;
}

@keyframes ribbon-fall {
  0%   { translate: 0 -100px; }
  100% { translate: 0 0; }
}

@keyframes ribbon-sway {
  0%   { rotate: 2deg; opacity: 0;}
  20%  { rotate: -4deg; opacity: 1; }
  40%  { rotate: 4deg; opacity: 1; }
  60%  { rotate: -4deg; opacity: 1; }
  80%  { rotate: 4deg; opacity: 1; }
  100% { rotate: -4deg; opacity: 0; }
}

.petal {
  animation: ribbon-fall 5s ease-in-out infinite;
}

.petal img {
  animation: ribbon-sway 5s ease-in-out infinite;
  transform-origin: top center;
}

.petal-1 {
  width: 54%;
  aspect-ratio: 272.8906 / 239.3911;
  position: absolute;
  top: 15%;
  right: -3%;
  z-index: 1;
}

.petal-2 {
  width: 49%;
    aspect-ratio: 247.2345 / 174.6039;
    position: absolute;
    bottom: -19%;
    left: 1%;
    z-index: 4;
    animation-delay: 3s;
}

.petal-2 img {
  animation-delay: 3s;
}

.dream-princess-img2-price p {
  position: relative;
  color: #ffa7c5;
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 700;
  font-size: clamp(9px, 2vw, 12px);
  letter-spacing: 0.05em;
  padding-left: 6%;
  margin-bottom: 6%;
  position: relative;
}

.dream-princess-img2-price p::after {
  content:"";
  width: 8%;
  aspect-ratio: 40.3604 / 45.9762;
  background: url(../images/perl3.png) center center / contain no-repeat;
  position: absolute;
  top: -38%;
  left: 22%;
}

.dream-princess-img2-price a.btn {
  aspect-ratio: 169.0159 / 41.6;
  width: clamp(80px, 16vw, 102px);
}

.dream-princess-img2 {
  width: 55%;
  position: relative;
  z-index: 4;
}

.dream-princess-img3-wrap {
  display: flex;
  margin-top: -5%;
  padding-inline: 5.5%;
}

.dream-princess-img3 {
  width: 58%;
  position: relative;
  z-index: 3;
}

.dream-princess-img3-right {
  width: 45%;
  aspect-ratio: 386.9542 / 599.7144;
  position: relative;
}

.petal-3 {
  width: 47%;
  position: absolute;
  top: 22%;
  right: 5%;
  z-index: 1;
  animation-delay: 1s;
}

.petal-3 img {
  animation-delay: 1s;
}

.petal-4 {
  width: 46%;
  position: absolute;
  top: 66%;
  left: 18%;
  z-index: 1;
  animation-delay: 6s;
}

.petal-4 img {
  animation-delay: 6s;
}

.petal-5 {
  width: 32%;
  position: absolute;
  bottom: -13%;
  right: -11%;
  z-index: 1;
  animation-delay: 3s;
}

.petal-5 img {
  animation-delay: 3s;
}

.dream-princess-swiper {
  margin-top: 8%;
  width: 102%;
  margin-left: -1%;
}

.swiper-pagination {
  position: static;
  margin-top: 3%;
  text-align: right;
  padding-inline: 6%;
}

.swiper-pagination-bullet {
  background: url(../images/ribbon-pink.svg) center center /contain no-repeat;
  border-radius: 0;
  width: 6%;
  height: auto;
  aspect-ratio: 53.3531 / 40.6099;
  opacity: 0.5;
}

.swiper-pagination-bullet.swiper-pagination-bullet-active {
  opacity: 1;
}

.dream-princess-img6 {
  margin-top: 8%;
  width: 105%;
  margin-left: -2%;
}

#girly-doll {
  scroll-margin-top: -120px;
}

@media (max-width: 550px) {
  #girly-doll {
    scroll-margin-top: -100px;
  }
}

.girly-doll {
  margin-top: 67%;
  background-color: #FFF;
}

.girly-doll-img1 {
  transform: translateY(-50%);
}

.girly-doll-kitty {
  margin-top: -35%;
  text-align: center;
  z-index: 1;
  position: relative;
}

.girly-doll-kitty::before {
  content:"";
  width: 100%;
  height: 35%;
  background-color: #FFF;
  position: absolute;
  bottom: 18%;
  left: 0;
  z-index: -1;
}

@keyframes kitty {
  0% {
    opacity: 0;
    transform: translateY(40px);
  }
  20% {
    opacity: 1;
  }
  60% {
    transform: translateY(-6px);
  }
  90% {
    transform: translateY(1px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.girly-doll-kitty img:first-child {
  opacity: 0;
  width: 12%;
  display: block;
  margin-inline: auto;
  transform: translateY(40px) scale(0.6);
  transform-origin: center bottom;
  z-index: -2;
  position: relative;
}

.girly-doll-kitty.show img:first-child {
  animation: kitty 0.9s forwards;
  animation-delay: 0.8s;
}

.girly-doll-kitty img:last-child {
  width: 66.2%;
  margin-top: 5.5%;
}

.girly-doll-img2 {
  margin-top: -4%;
  width: 112%;
  margin-left: -6%;
}

.girly-doll-img-circle {
  margin-top: 18%;
  position: relative;
  margin-inline: 8%;
}

.yurayura {
  animation: yurayura 1s steps(2) infinite;
}

@keyframes yurayura {
  0%   { rotate: 0deg; }
  100%  { rotate: 20deg; }
}

@keyframes yurayura2 {
  0%   { rotate: 20deg; }
  100%  { rotate: 0deg; }
}

.girly-doll-img-circle::before {
  content: "";
  width: 13%;
  aspect-ratio: 114 / 97;
  background: url(../images/ribbon-red2.svg) center center / contain no-repeat;
  position: absolute;
  top: -3%;
  left: 4%;
  animation: yurayura 1s steps(2) infinite;
}

.girly-doll-img-circle::after {
  content: "";
  width: 23%;
  aspect-ratio: 109.1287 / 94.6392;
  background: url(../images/bear.svg) center center / contain no-repeat;
  position: absolute;
  bottom: 3%;
  right: -7%;
  animation: yurayura2 1s steps(2) infinite;
}

.girly-doll-img-circle a {
  width: 90%;
  overflow: hidden;
  border-radius: 50%;
}

.girly-doll-img3 {
  width: 90%;
  transition-delay: 2s;
}

.girly-doll-img-circle.show .girly-doll-img3 {
  opacity: 0;
}

.girly-doll-img4-wrap {
  width: 101%;
  position: absolute;
  top: 0;
  left: 0;
  transform: translateX(-200%);
  opacity: 0;
}

.girly-doll-img-circle.show .girly-doll-img4-wrap {
  animation: circle-fall 2s ease-out forwards;
  opacity: 1;
}

.girly-doll-img-circle.show .girly-doll-img4 {
  animation: circle-is 2s ease-out forwards;
}

@keyframes circle-fall {
  0% {
    transform: translateX(-200%);
  }

  100% {
    transform: translateX(0);
  }
}

@keyframes circle-is {
  0% {
    transform: translateY(100%);
  }

  65% {
    transform: translateY(-10%);
  }

  100% {
    transform: translateY(0);
  }
}

.girly-doll-img-circle-price {
  margin-top: 7.3%;
  padding-inline: 12%;
  text-align: right;
  position: relative;
}

.girly-doll-img-circle-price::before {
  content: "";
  width: 11%;
  aspect-ratio: 117.1031 / 139.7601;
  background: url(../images/apple.svg) center center / contain no-repeat;
  position: absolute;
  top: 28%;
  left: 16%;
  transform: rotate(-15deg);
  animation: yurayura 1s steps(2) infinite;
}

.girly-doll-img-circle-price p {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 700;
  font-size: clamp(9px, 2vw, 12px);
  letter-spacing: 0.05em;
  color: #c1272d;
}

.girly-doll-img-circle-price .btn {
  margin-top: 4%;
  margin-right: 1%;
  width: clamp(80px, 16vw, 102px);
  aspect-ratio: 169.0159 / 41.6;
}

.girly-doll-swiper {
  margin-top: 10%;
  width: 102%;
  margin-left: -1%;
}

.swiper-pagination2 {
  position: static;
  margin-top: 3%;
  text-align: right;
  padding-inline: 5%;
}

.swiper-pagination2 .swiper-pagination-bullet {
  background: url(../images/apple.svg) center center /contain no-repeat;
  border-radius: 0;
  width: 5%;
  height: auto;
  aspect-ratio: 37.4605 / 41.8493;
  opacity: 0.6;
  margin: 0;
}

.swiper-pagination2 .swiper-pagination-bullet.swiper-pagination-bullet-active {
  opacity: 1;
}

.girly-doll-movie {
  margin-left: 3%;
  margin-right: 2%;
  margin-top: 11%;
  padding-top: 17%;
  background: url(../images/kitty-bg.png) center center / contain no-repeat;
  aspect-ratio: 1022.9137 / 1194.331;
}

.girly-doll-movie .movie {
  width: 86%;
  aspect-ratio: 1;
  margin-inline: auto;
  border-radius: 50%;
  overflow: hidden;
  position: relative;
}

.girly-doll-movie .movie video {
  position: absolute;
    top: -45%;
    left: 3%;
    transform: scale(1.2);
}

.girly-doll-img7 {
  margin-top: 11%;
  width: 105.5%;
  margin-left: -3%;
}

.girly-doll-foot-btn {
  margin-top: 14%;
  padding-bottom: 9%;
}

.foot-info {
  position: relative;
}

.footer-img {
  width: 106%;
  margin-left: -2%;
}

.footer-sns {
  width: 23%;
  position: absolute;
  top: 6%;
  right: 5%;
}

.footer-sns p {
  color: #FFF;
  font-size: clamp(8px, 3.5vw, 18px);
  letter-spacing: 0;
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 700;
}

.footer-sns ul {
  margin-top: 8%;
  padding-left: 11%;
}

.footer-sns ul li {
  margin-bottom: 9%;
}

.footer-sns a {
  display: flex;
  gap: 6%;
}

.footer-sns a img {
  width: 20%;
}

.footer-sns a p {
  font-family: "Zen Maru Gothic", sans-serif;
  font-weight: 700;
  letter-spacing: 0;
  font-size: clamp(8px, 1.8vw, 10px);
}

.foot-info > p {
  font-family: "fot-seurat-pron", sans-serif;
  color: #FFF;
  font-size: clamp(8px, 1.8vw, 10px);
  letter-spacing: -0.03em;
  position: absolute;
  bottom: 1%;
  left: 4.5%;
}