.visual {position: sticky; top: 0; width: 100%; height: 100vh; background: url(./../img/kv_bg.jpg)no-repeat 50% 50%; background-size: cover; transition: all .3s;}
.visual .kv-tit {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 100%; z-index: 10;}
.visual .kv-tit p {animation: tracking-in-contract 0.8s cubic-bezier(0.215, 0.610, 0.355, 1.000) both; font-size: 50px; font-weight: bold; line-height: 1.2; color: var(--wt); text-shadow: 0 3px 6px rgba(0, 0, 0, 0.79); text-align: center; white-space: nowrap;}
.visual .kv-tit p span {display: none;}
.visual .kv-tit p span.highlight {display: inline;}
@-webkit-keyframes tracking-in-contract {
  0% {
    letter-spacing: 1em;
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    letter-spacing: normal;
    opacity: 1;
  }
}
@keyframes tracking-in-contract {
  0% {
    letter-spacing: 1em;
    opacity: 0;
  }
  40% {
    opacity: 0.6;
  }
  100% {
    letter-spacing: normal;
    opacity: 1;
  }
}

/* intro */
/* body {overflow: hidden;}
body.on {overflow: initial;} */
.intro {animation: op_0 1s 4s linear both; position: fixed; top: 0; left: 0; width: 100%; height: 100vh; z-index: 9; overflow: hidden;}
.intro .img-box {width: 200%; height: 200%; overflow: hidden;}
@keyframes op_0 {
  0% {z-index: 9; opacity: 1;}
  80% {z-index: -1;}
  100% {z-index: -1; opacity: 0;}
}
.intro .img-box img {animation: bg_xy 4s linear alternate-reverse both; object-fit: cover;}
@keyframes bg_xy {
  0%{object-position: 0px -228px;}
  40% {object-position: -883px -515px;}
  80% {object-position: -883px -0px;}
  100% {object-position: 0px 0px;}
}

.intro .intro-logo {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 250px; height: auto;}
.intro .intro-logo img {animation: flicker-4 4s linear infinite both; width: 100%; height: auto;}
@keyframes flicker-4 {
  0%,
  100% {
    opacity: 1;
  }
  31.98% {
    opacity: 1;
  }
  32% {
    opacity: 0;
  }
  32.8% {
    opacity: 0;
  }
  32.82% {
    opacity: 1;
  }
  34.98% {
    opacity: 1;
  }
  35% {
    opacity: 0;
  }
  35.7% {
    opacity: 0;
  }
  35.72% {
    opacity: 1;
  }
  36.98% {
    opacity: 1;
  }
  37% {
    opacity: 0;
  }
  37.6% {
    opacity: 0;
  }
  37.62% {
    opacity: 1;
  }
  67.98% {
    opacity: 1;
  }
  68% {
    opacity: 0;
  }
  68.4% {
    opacity: 0;
  }
  68.42% {
    opacity: 1;
  }
  95.98% {
    opacity: 1;
  }
  96% {
    opacity: 0;
  }
  96.7% {
    opacity: 0;
  }
  96.72% {
    opacity: 1;
  }
  98.98% {
    opacity: 1;
  }
  99% {
    opacity: 0;
  }
  99.6% {
    opacity: 0;
  }
  99.62% {
    opacity: 1;
  }
}