@charset "UTF-8";

/*ポップアップ*/
@keyframes popup{
  0% {
    transform: translateY(100%);
  }
  25% {
    transform: translateY(-20%);
  }
  50% {
   transform: translateY(0);
  }
  75% {
   transform: translateY(-5%);
  }
  100% {
    transform: translateY(0);
  }
}
.p_pop{
  position: fixed;
  bottom: 0;
  right: 0;
  transform: translateY(100%);
}
.p_pop.is_active{
  animation: popup 1s ease-out;
  animation-fill-mode: both;
}
.p_pop__img{}
.p_pop__img img{
  vertical-align: top;
}
.p_pop__toggle{
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: flex-end;
  width: 100%;
  top: 0;
  left: 0;
  border-bottom: 4px solid;
  transform: translateY(-100%);
}
.p_pop__btn{
  display: block;
  padding: 4px 4px 0;
  line-height: 1;
  text-decoration: none;
  font-size: 20px;
}
.p_pop__btn:hover{
  text-decoration: none;
}

.p_pop__btn--open{
  padding: 2px 7px 2px;
}
.p_pop__toggle--insColor{
  border-color: #c30d23;
}
.p_pop__toggle--insColor > .p_pop__btn{
  color: #fff;
  background: #c30d23;
}
.p_pop__toggle--leafColor{
  border-color: #00c77f;
}
.p_pop__toggle--leafColor > .p_pop__btn{
  color: #fff;
  background: #00c77f;
}