@charset "UTF-8";




トップ


html{
 Font-size: 100%;
}

Img{
  width: 100vw;
  height: auto;
}

.afterword {
  margin: 0px 0px 0px;
  padding: 0px 0px 200px;
}

.toptext {
  color: #ee5697;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  line-height: 2.5;
  margin: 50px 50px 0px;
  padding: 0px 30px 0px;
}


.top {
  background: linear-gradient(180deg, #073390 0%, #26bbe3 30%, #f6c3d9 70%, #fffde6 90%, #ffffff 100%);
}

.petalanime01 {
  padding: 0px 0px 0px;
  margin: -1000px -170px 0px;
}
.petalanime02 {
  padding: 0px 0px 0px;
  margin: -1200px -170px 0px;
}

.petalanime03 {
  padding: 0px 0px 0px;
  margin: 5000px 0px 0px;
}

.petalanime04 {
  padding: 0px 0px 0px;
  margin: 750px 0px 0px;
}

.petalanime05 {
  padding: 0px 0px 0px;
  margin: -1500px 0px 0px;
}

.petalanime06 {
  padding: 0px 0px 0px;
  margin: -1500px 0px 0px;
}

.petalanime07 {
  padding: 0px 0px 0px;
  margin: -1500px 0px 0px;
}

.petalanime08 {
  padding: 0px 0px 0px;
  margin: -300px 0px 0px;
}

.petalanime09 {
  padding: 0px 0px 0px;
  margin: -200px 0px 0px;
}

.secondcolor {
  background: linear-gradient(rgba(255,255,255,0) 30%, rgba(138,198,222,1) 37%,rgba(43,119,153,1) 55%,rgba(255,255,255,0) 80%);
  padding: ; 200px 80px;
  margin: -850px 0px -1000px;
  width: 100vw;
}

.thirdcolor {
  background-color: rgba(244,225,232));
  background-image: url(../img/whitepetal02.png);
  background-size: cover;
  padding: ; 0px 80px;
  margin: -6150px 0px 0px;
}

.fourthcolor {
  background: linear-gradient(rgba(107,199,221,0) 0%, rgba(107,199,221,1) 10%, rgba(161,216,229,1) 35%, rgba(219,239,244,1) 45%, rgba(243,250,252,1) 60%, rgba(255,255,255,1) 100%);
  padding: ; -1000px 80px;
  margin: -2000px 0px 0px;
}

.fifthcolor {
  background: linear-gradient(rgba(255,255,255,0) 0%, rgba(255,255,255,1) 40%, rgba(244,225,232,1) 70%);
  background-image: url(../img/pastelpinkpetal02.png);
  background-size: cover;
  padding: ; -1200px 80px;
  margin: -1500px 0px 0px;
}

.sixthcolor {
  background-image: url(../img/pinkpetal02.png);
  background-color: rgba(255,226,239);
  background-size: cover;
  padding: ; 0px 80px;
  margin: -2200px 0px 0px;
}

.secondtext {
  color: #9d9756;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  line-height: 2.5;
  margin: 700px 50px 0px;
  padding: 300px 30px 0px;
}

.thirdtext {
  color: #9d9756;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  line-height: 2.5;
  margin: 0px 50px 0px;
  padding: 0px 30px 0px;
}

.thirdtext2 {
  color: #595757;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  line-height: 2.5;
  margin: 0px 50px 0px;
  padding: 0px 30px 0px;
}

.fourthtext {
  color: #FFFFFF;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  line-height: 2.5;
  margin: 0px 50px 0px;
  padding: 00px 0px 0px 500px;
}

.fifthtext {
  color: #FFFFFF;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  line-height: 2.5;
  margin: 0px 50px 0px;
  padding: 0px 30px 0px;
}

.sixthtext {
  color: #ee5697;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  line-height: 2.5;
  margin: 0px 80px 0px;
  padding: 1000px 30px 0px;
}

.sixthtext2 {
  color: #ee5697;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  line-height: 2.5;
  margin: 0px 80px 0px;
  padding: 50px 30px 0px;
}

.sixthtext3 {
  color: #ee5697;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  line-height: 2.5;
  margin: 0px 80px 0px;
  padding: 50px 30px 0px;
}

.seventhtext {
  color: #ee5697;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 25px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 10px;
  line-height: 2.5;
  margin: 0px 80px 0px;
  padding: 10px 20px;
}

.eightthtext {
  color: #ee5697;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  line-height: 2.5;
  margin: 0px 80px 0px;
  padding: 0px 30px 0px;
}

.ninethtext {
  color: #ee5697;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  line-height: 2.5;
  margin: 0px 80px 0px;
  padding: 100px 30px 0px;
}

.ninethtext2 {
  color: #2fb8d9;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  line-height: 2.5;
  margin: 00px 80px 0px;
  padding: 0px 0px 0px 700px;
}

.tenthtext {
  color: #ee5697;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  line-height: 2.5;
  margin: 0px 80px 0px;
  padding: 50px 30px 0px;
}

.eleventhtext {
  color: #ee5697;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  line-height: 2.5;
  margin: 750px 80px 0px;
  padding: 700px 30px 0px;
}

.twelvethtext {
  color: #FFFFFF;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  line-height: 2.5;
  margin: 500px 80px 0px;
  padding: 1500px 30px 0px;
}

.twelvethtext2 {
  color: #FFFFFF;
  font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif;
  font-optical-sizing: auto;
  font-size: 20px;
  font-style: normal;
  font-weight: normal;
  letter-spacing: 2px;
  line-height: 2.5;
  margin: -100px 80px 0px;
  padding: 0px 30px 100px;
}

@keyframes infinity-scroll-left {
from {
  transform: translateX(0);
}
  to {
  transform: translateX(-100%);
}
}

.scroll-infinity__wrap {
  display: flex;
  overflow: hidden;
}

.scroll-infinity__list {
  display: flex;
  list-style: none;
  padding: 0
}

.scroll-infinity__list--left {
  animation: infinity-scroll-left 80s infinite linear 0.5s both;
}

.scroll-infinity__item {
  width: calc(100vw / 3);
}

.scroll-infinity__item>img {
  width: 100%;
}

.fade01 {
  list-style: none;
  padding: 0;
}


.fade01 li {
animation-name: fadein01;
animation-duration: 1.5s;
animation-timing-function: ease;
animation-fill-mode: forwards;
opacity: 0;
}


@keyframes fadein01 {
from {
opacity: 0;
transform: translateY(-20px);
}
to {
opacity: 1;
transform: translateY(0);
}
}


/* nth-childで順番に遅延を入れる (時間差で表示) */
ul li:nth-child(1) { animation-delay: 0.2s; }
ul li:nth-child(2) { animation-delay: 0.8s; }
ul li:nth-child(3) { animation-delay: 1.5s; }
ul li:nth-child(4) { animation-delay: 1.9s; }
ul li:nth-child(5) { animation-delay: 2.3s; }
ul li:nth-child(6) { animation-delay: 2.7s; }
ul li:nth-child(7) { animation-delay: 3.1s; }
ul li:nth-child(8) { animation-delay: 3.5s; }
/* 必要な分だけ追加 */






.pc {
  display: block !important;
}

.sp {
  display: none !important;
}

.pcabsolute01 {
  display: block !important;
  position: absolute;
  transform: translate(0%, -100%);
}
.spabsolute01 {
  display: none !important;
}
.pcabsolute02 {
  display: block !important;
  position: absolute;
  transform: translate(0%, -10%);
}
.spabsolute02 {
  display: none !important;
}

.pcabsolute03 {
  display: block !important;
}
.spabsolute03 {
  display: none !important;
}

.pcflame01 {
  display: block !important;
  width: 600px;
}
.spflame01 {
  display: none !important;
}


