.cloud-sec {
  width: 100%;
  max-width: 500px;
  position: absolute;
  top: 20px;
  left: 50%;
  z-index: 9999;
  transform: translateX(-50%);
  display: flex; }
@media(max-width: 1069px) {
  .cloud-sec {
    max-width: 460px; } }
@media(max-width: 992px) {
  .cloud-sec {
    left: 0;
    transform: translateX(0%); } }
  .cloud-sec .cloud-1 {
    width: 100%;
    max-width: 250px;
    animation: rubberBand 7s infinite ease-in-out;
    transform-origin: center;
    margin-top: 1rem;
    position: relative;
    z-index: 99; }
@media(max-width: 1069px) {
  .cloud-sec .cloud-1 {
    max-width: 150px; } }
  .cloud-sec .cloud-2 {
    width: 100%;
    max-width: 180;
    align-self: flex-end;
    transform: translateX(-10px);
    animation: rubberBand2 7s infinite ease-in-out;
    animation-delay: 300ms; }
@media(max-width: 1069px) {
  .cloud-sec .cloud-2 {
    max-width: 130px; } }
  .cloud-sec .sun {
    width: 100%;
    max-width: 177px;
    animation: rotateAni 20s infinite linear;
    transform-origin: center; }
@media(max-width: 1069px) {
  .cloud-sec .sun {
    max-width: 130px; } }
.branch-bird {
  width: 100%;
  max-width: 350px;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 99; }
@media(max-width: 1069px) {
  .branch-bird {
    max-width: 267px; } }
@media(max-width: 768px) {
  .branch-bird {
    top: 35%; } }
  .branch-bird__wrap {
    position: relative; }
    .branch-bird__wrap .brnach {
      width: 100%;
      position: absolute;
      top: 0;
      right: 0;
      z-index: 9;
      animation: branchAni 3s infinite ease-in-out;
      transform-origin: right; }
    .branch-bird__wrap .brid {
      width: 100%;
      max-width: 162px;
      position: absolute;
      top: 33px;
      left: 0;
      z-index: 10;
      animation: birdAni 2s infinite ease-in-out;
      transform-origin: center; }
@media(max-width: 1069px) {
  .branch-bird__wrap .brid {
    max-width: 112px; } }
@keyframes rubberBand {
  0% {
    transform: translateX(1px); }
  50% {
    transform: translateX(30px); }
  100% {
    transform: translateX(1px); } }
@keyframes rubberBand2 {
  0% {
    transform: translateX(-10px); }
  50% {
    transform: translateX(30px); }
  100% {
    transform: translateX(-10px); } }
@keyframes rotateAni {
  0% {
    transform: rotate(0deg); }
  100% {
    transform: rotate(360deg); } }
@keyframes branchAni {
  0% {
    transform: rotate(0deg); }
  50% {
    transform: rotate(3deg); }
  100% {
    transform: rotate(0deg); } }
@keyframes birdAni {
  0% {
    transform: rotate(0deg); }
  50% {
    transform: rotate(5deg); }
  100% {
    transform: rotate(0deg); } }

/*# sourceMappingURL=anim.css.map */