body {
    text-align: center;
    background-color: #78be9b;
    font-family: Arial, sans-serif;
    background-size: auto;
    background-position: center;
}

header {
    background-color: #D0A900;

    padding: 20px;
    margin-bottom: 20px;
    opacity:0.9;
    
}

.poyopoyo {
    animation: poyopoyo 2s ease-out infinite;
    opacity: 1;
  }
  @keyframes poyopoyo {
    0%, 40%, 60%, 80% {
      transform: scale(1.0);
    }
    50%, 70% {
      transform: scale(0.95);
    }
  }

  .worm { 
    text-align: right;
    margin-right: 100px;
    margin-top: -235px;
}


#wrap{
    overflow:hidden;
}

section p {
    color: #745007; 
    text-align: center;
}

section {
    color:#333333;  
}

img{
    max-width:100%;
    height:auto;
    text-align: justify;   /*スクロール部分の画像をベストサイズに*/
}

.contentsBox{
    width:40%;
    float:left;
}
.center-scroll{
    background-color:#fbf9d1;
    border-radius: 10px;
    padding: 0px;
    box-shadow:0 4px 8px rgba(0,0,0,0.1 );/*背景の影の部分*/
    height: 102vh;
    overflow-y: scroll;/*垂直方向のスクロールできる*/
    overflow-x: hidden;/*水平方向のスクロールを非表示にし、横方向にはスクロールできない*/
    text-align:center;
}


.right-box{
    float:right;
    width:30%;
    height:auto;
}


.top-box img{
    width:60%;
    margin-top:40px;
}

.bottom-box img{
    width:50px;
}

.cricketimg{
    width: 300px!important;
    margin-top:30px;
    float: left;
}



.left-box{
    width:30%;
    height:auto;
    float: left;
}

.contents{padding: 50px 0;}


.Fly {
border-radius: 50%;
width: 200px;
height: 200px;
margin-top: 15px;

/*animationプロパティここから*/
animation-name: bounce;
animation-duration: 1.2s;
animation-iteration-count: infinite;
animation-timing-function: linear;
transform-origin: center bottom;
}
@keyframes bounce {
0%   { transform: scale(1.0, 1.0) translate(0%, 0%); } /* 初期状態 */
30%  { transform: scale(1.5, 0.5) translate(0%, 0%); } /* 地面に着地し、その変動で潰れだす */
40%  { transform: scale(1.0, 1.0) translate(0%, 0%); } /* 潰れた反動で一瞬元に戻る */
50%  { transform: scale(0.8, 1.3) translate(0%, -20%); } /* 潰れた反動で縦に伸び、その勢いでバウンド開始 */
60%  { transform: scale(1.0, 1.0) translate(0%, -50%); } /* 潰れた反動が終り、空中で元に戻る */
100% { transform: scale(1.0, 1.0) translate(0%, 0%); } /* 初期状態に戻る */
}
  

footer {
    clear:both;
    background-color: #e9d9acfa;
    padding: 10px;
    margin-bottom: 20px;
    opacity:0.8;
}