.hero{
  position:relative;
  min-height:100vh;
  display:flex;
  align-items:center;
  justify-content:left;
  text-align:center;

  /* 白っぽい背景画像の上にブルー・シアンのミストを重ねる */
  background-image: url("../images/first-view-bg4.jpg");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  overflow:hidden;
  isolation:isolate; /* ブレンドをhero内に閉じ込める */
}
.enter-hero {
  background-image: url("../images/enter_bg.jpg");
}

/* ブルー・シアンのグラデーション
.hero::before {
    content:"";
    position:absolute;
    inset:0;
    mix-blend-mode:soft-light;
    background: linear-gradient(270deg, #84d6ff, #fff, #00e5ff);
    background-size: 600% 600%;

    -webkit-animation: AnimationName 8s ease infinite;
    -moz-animation: AnimationName 8s ease infinite;
    animation: AnimationName 8s ease infinite;
}*/

@-webkit-keyframes AnimationName {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@-moz-keyframes AnimationName {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}
@keyframes AnimationName {
    0%{background-position:0% 50%}
    50%{background-position:100% 50%}
    100%{background-position:0% 50%}
}