@media screen and (max-width: 768px){.pc_ver{display:none}}@media screen and (min-width: 769px){.sp_ver{display:none}}#animationArea{width:100%;height:calc(100vh - 106px);margin:0;position:relative;overflow:hidden;border-top:solid 8px #02b1dc}#animationArea #mainTitle{position:absolute;top:73px;left:50%;transform:translateX(-50%);z-index:50;opacity:0}@media screen and (max-width: 768px){#animationArea #mainTitle{width:80%}}#animationArea #mainTitle.active{opacity:1;transition:opacity 1s ease 1s}#animationArea #phoneimg{position:absolute;bottom:0px;z-index:49;opacity:0}@media screen and (min-width: 769px){#animationArea #phoneimg{left:71%}}@media screen and (max-width: 768px){#animationArea #phoneimg{left:50%;transform:translateX(-50%)}}#animationArea #phoneimg.active{opacity:1;transition:opacity 1s ease 1.5s}#animationArea #balloon1{position:absolute;top:107px;z-index:48;opacity:0}@media screen and (min-width: 769px){#animationArea #balloon1{left:50%;transform:translateX(308px)}}@media screen and (max-width: 768px){#animationArea #balloon1{right:5%}}#animationArea #balloon1.active{opacity:1;transition:opacity 1s ease 2s}#animationArea #balloon2{position:absolute;top:253px;z-index:47;opacity:0}@media screen and (min-width: 769px){#animationArea #balloon2{left:50%;transform:translateX(-368px)}}@media screen and (max-width: 768px){#animationArea #balloon2{left:5%}}#animationArea #balloon2.active{opacity:1;transition:opacity 1s ease 2s}#animationArea #bgArea{position:absolute;top:0px;left:0px;z-index:1}@media screen and (max-width: 768px){#animationArea #bgArea{width:50%;height:50%}}#animationArea canvas{height:100%;width:100%;position:absolute;top:0;left:0;z-index:2}.fuwafuwa{animation:fuwafuwa 3s infinite linear alternate}@keyframes fuwafuwa{0%{transform:translate(0, 0) rotate(-8deg)}50%{transform:translate(0, -8px) rotate(0deg)}100%{transform:translate(0, 0) rotate(8deg)}}.photo{position:absolute;top:100%;left:0;height:100%;width:100%}.photo img{position:absolute;top:0;left:0;opacity:0;filter:drop-shadow(10px 10px 10px rgba(0,0,0,0.4))}.photo.moving img{opacity:1;transition:opacity 1s ease 0s}@media screen and (min-width: 769px){.scale1{transform:scale(0.8)}}@media screen and (max-width: 768px){.scale1{transform:scale(0.6)}}@media screen and (min-width: 769px){.scale2{transform:scale(0.7)}}@media screen and (max-width: 768px){.scale2{transform:scale(0.5)}}@media screen and (min-width: 769px){.scale3{transform:scale(0.6)}}@media screen and (max-width: 768px){.scale3{transform:scale(0.4)}}@media screen and (min-width: 769px){.scale4{transform:scale(0.3)}}@media screen and (max-width: 768px){.scale4{transform:scale(0.3)}}@media screen and (min-width: 769px){.scale5{transform:scale(0.4)}}@media screen and (max-width: 768px){.scale5{transform:scale(0.2)}}.photo.moving.g1{animation:loop 30s 15s linear , loop2 30s 15s linear infinite}.photo.moving.g2{animation:loop 30s -23s linear , loop2 30s 7s linear infinite}.photo.moving.g3{animation:loop 30s -3s linear , loop2 30s 27s linear infinite}.photo.moving.g4{animation:loop 30s -25s linear , loop2 30s 5s linear infinite}.photo.moving.g5{animation:loop 30s -6s linear , loop2 30s 24s linear infinite}.photo.moving.g6{animation:loop 30s linear infinite}.photo.moving.g7{animation:loop 30s -24s linear , loop2 30s 6s linear infinite}.photo.moving.g8{animation:loop 30s -9s linear , loop2 30s 21s linear infinite}.photo.moving.g9{animation:loop 30s -27s linear , loop2 30s 3s linear infinite}.photo.moving.g10{animation:loop 30s -12s linear , loop2 30s 18s linear infinite}.photo.moving.g11{animation:loop 30s -18s linear , loop2 30s 12s linear infinite}.photo.moving.g12{animation:loop 30s -29s linear , loop2 30s 1s linear infinite}@keyframes loop{0%{transform:translate(0%, 0%)}100%{transform:translate(100%, -180%)}}@keyframes loop2{0%{transform:translate(0%, 0%)}100%{transform:translate(100%, -180%)}}
