/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Nov 12 2021 | 17:54:37 */
/*　−−−　黒板　−−−　*/

.bb-wrapper{
  text-align: center;
  margin:  15px 0;
  padding: 5px;
  border-radius:2px;
  background-color: mediumaquamarine;
  border-bottom: solid 3px sandybrown;
  display: block;
  animation: bby 0.5s ease-in-out 1;
  animation-fill-mode: forwards;
}
.bbtxt{
  display:inline-block;
  text-align: left;
  color: mediumaquamarine;
  font-size: 1.3rem;
  font-weight: bold;
  letter-spacing: -2px;
  font-family: 'M PLUS 1p', sans-serif !important;
  font-weight: bold !important;
  margin: 1rem;
  padding: 0;
  padding-left: 0.3rem;
  line-height: 2rem;
}
.bbtxt h1{
    font-size: 1.3rem;
    text-align: left;
}
.bbtxt img{
  display: inline;
  margin: 0;
  padding: 0;
  text-align: left;
  line-height: 2em;
}
.bb-wrapper h1{
  margin: 0;
}
@keyframes bby{
  0% {
    transform: translateY(-180%);
  }
  55%{
    transform: translateY(0);
  }
  80%{
    transform: translateY(-15%);
  }
  100%{
    transform: translateY(0%);
  }
}
.chork-hand{
  width: 2rem;
  height: 2rem;
}
.chork-hand01{
  animation: chork01 0.7s ease-out 1;
  animation-fill-mode: forwards;
  animation-delay: 1s;
  opacity: 0;
}
.chork-hand02{
  animation: chork02 0.7s ease 1;
  animation-fill-mode: forwards;
  animation-delay: 3.04s;
}
@keyframes chork01{
  0%{
    opacity: 0;
    width: 2rem;
    margin-left: 0rem;
  }
  10%{
    opacity: 1;
  }
  25%{
    transform:  rotate(5deg);
  }
  45%{
    transform:  rotate(-5deg);
  }
  70%{
    transform:  rotate(30deg);
    margin-left: 0.5rem;
  }
  80%{
    transform:  rotate(-30deg);
  }
  95%{
    transform:  rotate(20deg);
  }
  99.8%{
    opacity: 0.8;
    width: 2rem;
    margin-left: 2rem;
  }
  100%{
    width: 0rem;
    margin: 0rem;
  }
}
@keyframes chork02{
  25%{
    transform:  rotate(5deg);
  }
  45%{
    transform:  rotate(-5deg);
  }
  70%{
    transform:  rotate(30deg);
  }
  80%{
    transform:  rotate(-30deg);
  }
  100%{
    transform:  rotate(20deg);
  }
}
/*.dsap:hover{
color: mediumaquamarine;
[ color:#73e6bf;　]
text-shadow: cadetblue 1px 2px;
cursor: crosshair;
}*/
.dsap{
  display:inline;
  color: lightcyan;
  text-shadow: cadetblue 1px 1px;
  opacity: 0;
  animation: typ 1s ease 1;
  animation-fill-mode: forwards;
}
@keyframes typ{
  0%{
    opacity:0;
  }
  80%{
    opacity:0.05;
  }
  90%{
    opacity:0.65;
  }
  99%{
    opacity:1;
  }
  100%{
    opacity:1;
  }
}
.dly01{
  animation-delay: 0.99s;
}
.dly02{
  animation-delay: 1.08s;
}
.dly03{
  animation-delay: 1.17s;
}
.dly04{
  animation-delay: 1.32s;
}
.dly05{
  animation-delay: 1.47s;
}
.dly06{
  animation-delay: 1.62s;
}
.dly07{
  animation-delay: 1.74s;
}
.dly08{
  animation-delay: 1.92s;
}
.dly09{
  animation-delay: 2.04s;
}
.dly010{
  animation-delay: 2.1s;
}
.dly011{
  animation-delay: 2.31s;
}
.dly012{
  animation-delay: 2.52s;
}