.js-banner {
  opacity: 0;
  transform: translateX(50px) scale(0.5);
  visibility: hidden;
}

.open-school__banner {
    position: fixed;
    top: max(30vw, 400px);;
    right: 10%;
    width: 45%;
    z-index: 100;
}
@media screen and (max-width:1025px) {
 .open-school__banner {
    top: auto;
    bottom: 0;
    left: auto;
    right: 40vw;
  }
}
@media screen and (max-width:930px) {
 .open-school__banner {
    top: auto;
    bottom: 0;
    left: auto;
    right: 50%;
  }
}
@media screen and (max-width:768px) {
 .open-school__banner {
    top: auto;
    bottom: 20vw;
    left: auto;
    right: 0;
    width: 100%;
  }
}

.banner-close {
  position: absolute;
  top: 8px;
  right: 8px;
  background: rgba(0, 0, 0, 0.6);
  color: #fff;
  border: none;
  font-size: 20px;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  cursor: pointer;
  -webkit-transition: opacity 0.2s ease;
  transition: opacity 0.2s ease;
}
@media screen and (max-width:768px) {
 .banner-close {
    top: 0;
   right: 0;
   padding: 0 5px 0;
   width: 20px;
   height: 20px;
  }
}
@media screen and (max-width:500px) {
 .banner-close {
   top: 0;
   right: 0;
   padding: 0 5px 0;
   width: 20px;
   height: 20px;
  }
}
.js-banner .banner-close:hover {
  opacity: 0.7;
}
/*　上に上がる動き　*/
.js-banner.leftMove {
  animation: leftAnime 0.5s forwards;
}

@keyframes leftAnime {
  from {
    opacity: 0;
    transform: translateX(50px) scale(0.5);
    visibility: hidden;
  }
  to {
    opacity: 1;
    transform: translateX(0) scale(1);
    visibility: visible;
  }
}
/* 中目黒校説明会バナー */
.event-info__banner {
    position: fixed;
    top: max(30vw, 400px);;
    right: 55%;
    width: 45%;
    z-index: 100;
}
@media screen and (max-width:1025px) {
 .event-info__banner {
    top: auto;
    bottom: 15vw;
    left: auto;
    right: 40vw;
  }
}
@media screen and (max-width:930px) {
 .event-info__banner {
    top: auto;
    bottom: 15vw;
    left: auto;
    right: 50%;
  }
}
@media screen and (max-width:768px) {
 .event-info__banner {
    top: auto;
    bottom: 47.8vw;
    left: auto;
    right: 0;
    width: 100%;
  }
}