html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-size: 62.5%;
  vertical-align: baseline;
  background: transparent;
}
* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
html {
  box-sizing: border-box;
}
*,
*:before,
*:after {
  box-sizing: inherit;
}
body {
  line-height: 1;
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
  display: block;
}
nav ul {
  list-style: none;
}
blockquote,
q {
  quotes: none;
}
blockquote:before,
blockquote:after,
q:before,
q:after {
  content: "";
  content: none;
}
a {
  margin: 0;
  padding: 0;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
  text-decoration: none;
  outline: none;
}
ins {
  background-color: #ff9;
  color: #000;
  text-decoration: none;
}
mark {
  background-color: #ff9;
  color: #000;
  font-style: italic;
  font-weight: bold;
}
del {
  text-decoration: line-through;
}
abbr[title],
dfn[title] {
  border-bottom: 1px dotted;
  cursor: help;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}
hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #cccccc;
  margin: 1em 0;
  padding: 0;
}
input,
select {
  vertical-align: middle;
}
ul,
li {
  list-style: none;
}
body {
  -webkit-text-size-adjust: 100%;
}
input[type="text"],
input[type="button"],
input[type="submit"] {
  -webkit-appearance: none;
  border: none;
  box-sizing: border-box;
}
select {
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
  border-radius: 0;
  border: 0;
  margin: 0;
  padding: 0;
  background: none transparent;
  vertical-align: middle;
  font-size: inherit;
  color: inherit;
  box-sizing: content-box;
}
input[type="text"]:placeholder-shown,
input[type="email"]:placeholder-shown,
textarea:placeholder-shown {
  color: #bcbcbc;
}
input[type="text"]::-webkit-input-placeholder,
input[type="email"]::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
  color: #bcbcbc;
}
input[type="text"]:-moz-placeholder,
input[type="email"]:-moz-placeholder,
textarea:-moz-placeholder {
  color: #bcbcbc;
}
input[type="text"]::-moz-placeholder,
input[type="email"]::-moz-placeholder,
textarea::-moz-placeholder {
  color: #bcbcbc;
}
input[type="text"]:-ms-input-placeholder,
input[type="email"]:-ms-input-placeholder,
textarea:-ms-input-placeholder {
  color: #bcbcbc;
}
button {
  outline: none;
}
a {
  -webkit-tap-highlight-color: transparent;
  color: #212121;
}
@media screen and (min-width: 769px) {
  a {
    transition: 0.3s;
  }
  a:hover {
    transition: 0.3s;
    cursor: pointer;
    opacity: 0.7;
  }
}
table {
  border-collapse: collapse;
  border: none;
  border-spacing: 0;
}
th,
td {
  vertical-align: top;
  border: solid 1px #000;
  font-weight: normal;
  text-align: left;
}
caption {
  text-align: left;
}
body,
html {
  width: 100%;
  height: 100%;
  font-size: 62.5%;
  color: #313131;
  font-family: "NotoSansCJKjp regular";
  letter-spacing: 0.05em;
}
img {
  max-width: 100%;
  height: auto;
  vertical-align: bottom;
}
a.more img {
  vertical-align: baseline;
}
.sp {
  display: none;
}
@media screen and (max-width: 768px) {
  .pc {
    display: none;
  }
  .sp {
    display: inline-block;
  }
}
.borderYellow {
  position: relative;
}
.borderYellow .text {
  position: relative;
  z-index: 2;
}
.borderYellow:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 10px;
  background-color: #feef35;
  z-index: 1;
}
#stage {
  overflow: hidden;
  background: url(../img/common/bg_all.png) center 0 no-repeat;
  background-size: cover;
  background-attachment: fixed;
}
@media screen and (max-width: 768px) {
  #stage {
    background: none;
    position: relative;
  }
  #stage:before {
    content: "";
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    background: url(../img/common/sp_bg_all.png) center repeat-y;
    background-size: 100%;
    z-index: -1;
  }
}
#header {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 99988;
}
@media screen and (max-width: 768px) {
  #header {
    background: url(../img/common/sp_bg_header.png) center 0 no-repeat;
    background-size: 100%;
    display: flex;
  }
}
#header #logo {
  width: 519px;
}
@media screen and (max-width: 768px) {
  #header #logo {
    width: 64.7%;
  }
}
#header .menu {
  position: absolute;
  top: 20px;
  left: 350px;
}
@media screen and (max-width: 768px) {
  #header .menu {
    position: static;
    width: 35.3%;
  }
}
#nav {
  position: fixed;
  top: 0;
  left: -980px;
  max-width: 967px;
  width: 100%;
  background: url(../img/common/bg_navarea.png) right 0 no-repeat;
  z-index: 100000;
  transition: 0.5s;
  opacity: 0;
}
@media screen and (max-width: 768px) {
  #nav {
    max-width: inherit;
    width: 100%;
    height: 100%;
    top: -150%;
    left: 0;
    background: url(../img/common/sp_bg_navarea.png) center 0 no-repeat;
    background-size: 100%;
    padding: 20px 0 50px;
    overflow: auto;
  }
}
#nav.on {
  opacity: 1;
  left: 362px;
}
@media screen and (max-width: 768px) {
  #nav.on {
    top: 0;
    left: 0;
  }
}
@media screen and (max-width: 768px) {
  #nav .header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 30px;
    padding: 0 8%;
  }
  #nav .header .logo {
    width: 47.4%;
  }
  #nav .header .menuClose {
    width: 7.3%;
  }
}
@media screen and (max-width: 768px) {
  #nav .entryBnr {
    padding: 0 7%;
  }
}
#nav ul {
  display: flex;
}
@media screen and (max-width: 768px) {
  #nav ul {
    display: block;
    width: 100%;
    padding: 0 8%;
  }
}
#nav li {
  line-height: 78px;
  margin: 0 20px;
}
@media screen and (max-width: 768px) {
  #nav li {
    line-height: 1;
    margin: 15px 0;
    width: 92%;
  }
}
@media screen and (min-width: 769px) {
  #nav li a:hover {
    opacity: 1;
  }
}
@media screen and (max-width: 768px) {
  #nav li a {
    background: url(../img/common/sp_menu_arrow.png) 0 center no-repeat;
    background-size: 54px;
    padding-left: 60px;
    display: block;
  }
}
#nav li img {
  vertical-align: middle;
}
@media screen and (max-width: 768px) {
  #nav li img {
    width: 80%;
  }
}
@media screen and (max-width: 768px) {
  #footer {
    padding-bottom: 90px;
  }
}
#footer .footer--inner {
  max-width: 1400px;
  width: 100%;
  margin: auto;
  padding: 20px 50px;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media screen and (max-width: 768px) {
  #footer .footer--inner {
    flex-direction: column;
    padding: 20px 0;
  }
}
#footer .logo {
  width: 138px;
}
@media screen and (max-width: 768px) {
  #footer .logo {
    width: 164px;
  }
}
#footer .copyright {
  font-family: Helvetica, "Helvetica Neue", sans-serif;
  padding-left: 20px;
}
@media screen and (max-width: 768px) {
  #footer .copyright {
    margin-top: 16px;
  }
}
#footer .copyright small {
  color: #fff;
  font-size: 1rem;
}
@font-face {
  font-family: "NotoSansCJKjp regular";
  font-style: normal;
  src: url(../font/sub-NotoSansCJKjp-Regular.otf) format("opentype");
  font-display: swap;
}
@font-face {
  font-family: "NotoSansCJKjp DemiLight";
  font-style: normal;
  src: url(../font/sub-NotoSansCJKjp-DemiLight.otf) format("opentype");
  font-display: swap;
}
@font-face {
  font-family: "NotoSansCJKjp Medium";
  font-style: normal;
  src: url(../font/sub-NotoSansCJKjp-Medium.otf) format("opentype");
  font-display: swap;
}
@font-face {
  font-family: "NotoSansCJKjp bold";
  font-style: normal;
  src: url(../font/sub-NotoSansCJKjp-Bold.otf) format("opentype");
  font-display: swap;
}
@font-face {
  font-family: "NotoSansCJKjp black";
  font-style: normal;
  src: url(../font/sub-NotoSansCJKjp-Black.otf) format("opentype");
  font-display: swap;
}
@font-face {
  font-family: "Makinas-Scrap-5";
  font-style: normal;
  src: url(../font/Makinas-Scrap-5.otf) format("opentype");
  font-display: swap;
}
@font-face {
  font-family: "DIN_Condensed";
  font-style: normal;
  src: url(../font/DIN_Condensed_Bold.ttf);
  font-display: swap;
}
.heading--small {
  font-family: 游ゴシック体, "Yu Gothic", YuGothic, "ヒラギノ角ゴシック Pro",
    "Hiragino Kaku Gothic Pro", メイリオ, Meiryo, Osaka, "ＭＳ Ｐゴシック",
    "MS PGothic", sans-serif;
}
.top #loading {
  position: fixed;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
  z-index: 100000;
  background: transparent;
  display: flex;
  align-items: center;
  justify-content: center;
}
.top #loading .loadCircle {
  animation: load 1.5s linear infinite forwards;
}
@keyframes load {
  0% {
    transform: rotateY(0);
  }
  25% {
    transform: rotateY(90deg);
  }
  50% {
    transform: rotateY(180deg);
  }
  75% {
    transform: rotateY(270deg);
  }
  100% {
    transform: rotateY(360deg);
  }
}
@media screen and (max-width: 768px) {
  .top #loading .loadCircle {
    width: 225px;
    height: 225px;
  }
}
.top #stage.off {
  display: none;
}
.top #header {
  top: -200px;
  transition: 0.5s;
}
.top #header.on {
  top: 0;
}
.top .canvasBg {
  position: relative;
  overflow: hidden;
}
.top .canvasBg #q {
  position: fixed;
  top: 0;
  left: 0;
  width: 220%;
  z-index: 1;
}
@media screen and (max-width: 768px) {
  .top .canvasBg #q {
    width: 100%;
  }
}
.top .canvasBg #q.on {
  position: absolute;
  top: auto;
  bottom: 0;
}
.top .firstview {
  width: 100%;
  height: 100vh;
  position: relative;
  z-index: 2;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  --color-text: #fff;
  --color-bg: #000;
  --color-link: #f9d77e;
  --color-link-hover: #fff;
  --color-info: #efc453;
  --glitch-width: 590px;
  --glitch-height: 146px;
  --gap-horizontal: 10px;
  --gap-vertical: 5px;
  --time-anim: 4s;
  --delay-anim: 2s;
  --blend-mode-1: none;
  --blend-mode-2: none;
  --blend-mode-3: none;
  --blend-mode-4: none;
  --blend-mode-5: overlay;
  --blend-color-1: transparent;
  --blend-color-2: transparent;
  --blend-color-3: transparent;
  --blend-color-4: #fb909a;
  --blend-color-5: transparent;
}
@media screen and (max-width: 768px) {
  .top .firstview {
    --glitch-width: 100%;
    --glitch-height: 80px;
  }
}
.top .firstview .textarea {
  text-align: center;
  position: relative;
  margin-top: 120px;
}
.top .firstview .textarea.on:before {
  opacity: 1;
}
@media screen and (max-width: 768px) {
  .top .firstview .textarea {
    margin-top: 20px;
  }
}
.top .firstview .textarea:before {
  content: "";
  position: absolute;
  top: -155px;
  left: 50%;
  width: 450px;
  height: 450px;
  margin-left: -225px;
  background: url(../img/top/main_phrase_circle.png) 0 0 no-repeat;
  opacity: 0;
  transition: 0.25s;
}
@media screen and (max-width: 768px) {
  .top .firstview .textarea:before {
    top: -95px;
    width: 285px;
    height: 285px;
    margin-left: -143px;
    background: url(../img/top/main_phrase_circle.png) 0 0 no-repeat;
    background-size: 100%;
  }
}
.top .firstview .textarea h2 {
  position: relative;
}
@media screen and (max-width: 768px) {
  .top .firstview .textarea h2 {
    width: 76%;
    margin: auto;
  }
}
.top .firstview .textarea h2 strong {
  position: relative;
  z-index: 2;
  display: block;
  margin: auto;
  opacity: 0;
  transform: scale(100);
  transition: 0.25s;
}
.top .firstview .textarea h2 strong.on {
  transform: scale(1);
  opacity: 1;
}
.top .firstview .textarea h2 .glitch {
  width: var(--glitch-width);
  height: var(--glitch-height);
  overflow: hidden;
}
.top .firstview .textarea h2 .glitch__img {
  position: absolute;
  top: calc(-1 * var(--gap-vertical));
  left: calc(-1 * var(--gap-horizontal));
  width: calc(100% + var(--gap-horizontal) * 2);
  height: calc(100% + var(--gap-vertical) * 2);
  background: url(../img/top/main_phrase.png) no-repeat 50%;
  background-color: var(--blend-color-1);
  transform: translate3d(0, 0, 0);
  background-blend-mode: var(--blend-mode-1);
}
@media screen and (max-width: 768px) {
  .top .firstview .textarea h2 .glitch__img {
    background: url(../img/top/main_phrase.png) no-repeat 50%;
    background-size: 92%;
  }
}
.top .firstview .textarea h2 .glitch__img:nth-child(n + 2) {
  opacity: 0;
}
.top .firstview .textarea h2 .glitch__img:nth-child(n + 2) {
  animation-duration: var(--time-anim);
  animation-delay: var(--delay-anim);
  animation-timing-function: linear;
  animation-iteration-count: infinite;
}
.top .firstview .textarea h2 .glitch__img:nth-child(2) {
  background-color: var(--blend-color-2);
  background-blend-mode: var(--blend-mode-2);
  animation-name: glitch-anim-1;
}
.top .firstview .textarea h2 .glitch__img:nth-child(3) {
  background-color: var(--blend-color-3);
  background-blend-mode: var(--blend-mode-3);
  animation-name: glitch-anim-2;
}
.top .firstview .textarea h2 .glitch__img:nth-child(4) {
  background-color: var(--blend-color-4);
  background-blend-mode: var(--blend-mode-4);
  animation-name: glitch-anim-3;
}
.top .firstview .textarea h2 .glitch__img:nth-child(5) {
  background-color: var(--blend-color-5);
  background-blend-mode: var(--blend-mode-5);
  animation-name: glitch-anim-flash;
}
@keyframes glitch-anim-1 {
  0% {
    opacity: 1;
    transform: translate3d(var(--gap-horizontal), 0, 0);
    -webkit-clip-path: polygon(0 2%, 100% 2%, 100% 5%, 0 5%);
    clip-path: polygon(0 2%, 100% 2%, 100% 5%, 0 5%);
  }
  2% {
    -webkit-clip-path: polygon(0 15%, 100% 15%, 100% 15%, 0 15%);
    clip-path: polygon(0 15%, 100% 15%, 100% 15%, 0 15%);
  }
  4% {
    -webkit-clip-path: polygon(0 10%, 100% 10%, 100% 20%, 0 20%);
    clip-path: polygon(0 10%, 100% 10%, 100% 20%, 0 20%);
  }
  6% {
    -webkit-clip-path: polygon(0 1%, 100% 1%, 100% 2%, 0 2%);
    clip-path: polygon(0 1%, 100% 1%, 100% 2%, 0 2%);
  }
  8% {
    -webkit-clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%);
    clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%);
  }
  10% {
    -webkit-clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%);
    clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%);
  }
  12% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%);
    clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%);
  }
  14% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
    clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
  }
  16% {
    -webkit-clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
    clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
  }
  18% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
    clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
  }
  20% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%);
    clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%);
  }
  21.9% {
    opacity: 1;
    transform: translate3d(var(--gap-horizontal), 0, 0);
  }
  22%,
  100% {
    opacity: 0;
    transform: translate3d(0, 0, 0);
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
  }
}
@keyframes glitch-anim-2 {
  0% {
    opacity: 1;
    transform: translate3d(calc(-1 * var(--gap-horizontal)), 0, 0);
    -webkit-clip-path: polygon(0 25%, 100% 25%, 100% 30%, 0 30%);
    clip-path: polygon(0 25%, 100% 25%, 100% 30%, 0 30%);
  }
  3% {
    -webkit-clip-path: polygon(0 3%, 100% 3%, 100% 3%, 0 3%);
    clip-path: polygon(0 3%, 100% 3%, 100% 3%, 0 3%);
  }
  5% {
    -webkit-clip-path: polygon(0 5%, 100% 5%, 100% 20%, 0 20%);
    clip-path: polygon(0 5%, 100% 5%, 100% 20%, 0 20%);
  }
  7% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
    clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
  }
  9% {
    -webkit-clip-path: polygon(0 40%, 100% 40%, 100% 40%, 0 40%);
    clip-path: polygon(0 40%, 100% 40%, 100% 40%, 0 40%);
  }
  11% {
    -webkit-clip-path: polygon(0 52%, 100% 52%, 100% 59%, 0 59%);
    clip-path: polygon(0 52%, 100% 52%, 100% 59%, 0 59%);
  }
  13% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
    clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
  }
  15% {
    -webkit-clip-path: polygon(0 75%, 100% 75%, 100% 75%, 0 75%);
    clip-path: polygon(0 75%, 100% 75%, 100% 75%, 0 75%);
  }
  17% {
    -webkit-clip-path: polygon(0 65%, 100% 65%, 100% 40%, 0 40%);
    clip-path: polygon(0 65%, 100% 65%, 100% 40%, 0 40%);
  }
  19% {
    -webkit-clip-path: polygon(0 45%, 100% 45%, 100% 50%, 0 50%);
    clip-path: polygon(0 45%, 100% 45%, 100% 50%, 0 50%);
  }
  20% {
    -webkit-clip-path: polygon(0 14%, 100% 14%, 100% 33%, 0 33%);
    clip-path: polygon(0 14%, 100% 14%, 100% 33%, 0 33%);
  }
  21.9% {
    opacity: 1;
    transform: translate3d(calc(-1 * var(--gap-horizontal)), 0, 0);
  }
  22%,
  100% {
    opacity: 0;
    transform: translate3d(0, 0, 0);
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
  }
}
@keyframes glitch-anim-3 {
  0% {
    opacity: 1;
    transform: translate3d(0, calc(-1 * var(--gap-vertical)), 0)
      scale3d(-1, -1, 1);
    -webkit-clip-path: polygon(0 1%, 100% 1%, 100% 3%, 0 3%);
    clip-path: polygon(0 1%, 100% 1%, 100% 3%, 0 3%);
  }
  1.5% {
    -webkit-clip-path: polygon(0 10%, 100% 10%, 100% 9%, 0 9%);
    clip-path: polygon(0 10%, 100% 10%, 100% 9%, 0 9%);
  }
  2% {
    -webkit-clip-path: polygon(0 5%, 100% 5%, 100% 6%, 0 6%);
    clip-path: polygon(0 5%, 100% 5%, 100% 6%, 0 6%);
  }
  2.5% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
    clip-path: polygon(0 20%, 100% 20%, 100% 20%, 0 20%);
  }
  3% {
    -webkit-clip-path: polygon(0 10%, 100% 10%, 100% 10%, 0 10%);
    clip-path: polygon(0 10%, 100% 10%, 100% 10%, 0 10%);
  }
  5% {
    -webkit-clip-path: polygon(0 30%, 100% 30%, 100% 25%, 0 25%);
    clip-path: polygon(0 30%, 100% 30%, 100% 25%, 0 25%);
  }
  5.5% {
    -webkit-clip-path: polygon(0 15%, 100% 15%, 100% 16%, 0 16%);
    clip-path: polygon(0 15%, 100% 15%, 100% 16%, 0 16%);
  }
  7% {
    -webkit-clip-path: polygon(0 40%, 100% 40%, 100% 39%, 0 39%);
    clip-path: polygon(0 40%, 100% 40%, 100% 39%, 0 39%);
  }
  8% {
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%);
    clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%);
  }
  9% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 55%, 0 55%);
    clip-path: polygon(0 60%, 100% 60%, 100% 55%, 0 55%);
  }
  10.5% {
    -webkit-clip-path: polygon(0 30%, 100% 30%, 100% 31%, 0 31%);
    clip-path: polygon(0 30%, 100% 30%, 100% 31%, 0 31%);
  }
  11% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 69%, 0 69%);
    clip-path: polygon(0 70%, 100% 70%, 100% 69%, 0 69%);
  }
  13% {
    -webkit-clip-path: polygon(0 40%, 100% 40%, 100% 41%, 0 41%);
    clip-path: polygon(0 40%, 100% 40%, 100% 41%, 0 41%);
  }
  14% {
    -webkit-clip-path: polygon(0 80%, 100% 80%, 100% 75%, 0 75%);
    clip-path: polygon(0 80%, 100% 80%, 100% 75%, 0 75%);
  }
  14.5% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 51%, 0 51%);
    clip-path: polygon(0 50%, 100% 50%, 100% 51%, 0 51%);
  }
  15% {
    -webkit-clip-path: polygon(0 90%, 100% 90%, 100% 90%, 0 90%);
    clip-path: polygon(0 90%, 100% 90%, 100% 90%, 0 90%);
  }
  16% {
    -webkit-clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
    clip-path: polygon(0 60%, 100% 60%, 100% 60%, 0 60%);
  }
  18% {
    -webkit-clip-path: polygon(0 100%, 100% 100%, 100% 99%, 0 99%);
    clip-path: polygon(0 100%, 100% 100%, 100% 99%, 0 99%);
  }
  20% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 71%, 0 71%);
    clip-path: polygon(0 70%, 100% 70%, 100% 71%, 0 71%);
  }
  21.9% {
    opacity: 1;
    transform: translate3d(0, calc(-1 * var(--gap-vertical)), 0)
      scale3d(-1, -1, 1);
  }
  22%,
  100% {
    opacity: 0;
    transform: translate3d(0, 0, 0);
    -webkit-clip-path: polygon(0 0, 0 0, 0 0, 0 0);
    clip-path: polygon(0 0, 0 0, 0 0, 0 0);
  }
}
@keyframes glitch-anim-text {
  0% {
    transform: translate3d(calc(-1 * var(--gap-horizontal)), 0, 0)
      scale3d(-1, -1, 1);
    -webkit-clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%);
    clip-path: polygon(0 20%, 100% 20%, 100% 21%, 0 21%);
  }
  2% {
    -webkit-clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%);
    clip-path: polygon(0 33%, 100% 33%, 100% 33%, 0 33%);
  }
  4% {
    -webkit-clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%);
    clip-path: polygon(0 44%, 100% 44%, 100% 44%, 0 44%);
  }
  5% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%);
    clip-path: polygon(0 50%, 100% 50%, 100% 20%, 0 20%);
  }
  6% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
    clip-path: polygon(0 70%, 100% 70%, 100% 70%, 0 70%);
  }
  7% {
    -webkit-clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
    clip-path: polygon(0 80%, 100% 80%, 100% 80%, 0 80%);
  }
  8% {
    -webkit-clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
    clip-path: polygon(0 50%, 100% 50%, 100% 55%, 0 55%);
  }
  9% {
    -webkit-clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%);
    clip-path: polygon(0 70%, 100% 70%, 100% 80%, 0 80%);
  }
  9.9% {
    transform: translate3d(calc(-1 * var(--gap-horizontal)), 0, 0)
      scale3d(-1, -1, 1);
  }
  10%,
  100% {
    transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
    -webkit-clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0% 100%);
  }
}
@keyframes glitch-anim-flash {
  0%,
  5% {
    opacity: 0.2;
    transform: translate3d(var(--gap-horizontal), var(--gap-vertical), 0);
  }
  5.5%,
  100% {
    opacity: 0;
    transform: translate3d(0, 0, 0);
  }
}
.top .firstview .textarea h3 {
  position: relative;
  z-index: 2;
  margin-top: 100px;
  transform: rotateY(270deg);
  opacity: 0;
  transition: 0.2s;
}
@media screen and (max-width: 768px) {
  .top .firstview .textarea h3 {
    margin-top: 50px;
    padding: 0 8%;
  }
}
.top .firstview .textarea h3.on {
  transform: rotateY(0);
  opacity: 1;
}
.top .firstview .scroll {
  position: absolute;
  bottom: 30px;
  left: 50%;
  margin-left: -26px;
  opacity: 0;
}
.top .firstview .scroll.on {
  bottom: 10px;
  animation: scroll 2s linear infinite forwards;
}
@keyframes scroll {
  0% {
    opacity: 0.3;
  }
  25% {
    opacity: 1;
  }
  50% {
    opacity: 0.3;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 0.3;
  }
}
.top .next--schedule {
  position: fixed;
  bottom: -200px;
  right: -260px;
  z-index: 999;
  max-width: 616px;
  opacity: 0;
  transition: 0.5s;
}
.top .next--schedule:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  z-index: 999;
  width: 180px;
  height: 66px;
  background: url(../img/common/entry_fukidashi.png) 0 0 no-repeat;
  opacity: 0;
  transition: 0.25s;
}
.top .next--schedule .btn {
  position: absolute;
  top: 13px;
  right: 30px;
}
.top .next--schedule.on {
  opacity: 1;
  bottom: 0;
}
@media screen and (min-width: 769px) {
  .top .next--schedule:hover {
    right: 0;
  }
  .top .next--schedule:hover:before {
    top: -60px;
    right: 50px;
    opacity: 1;
  }
}
@media screen and (max-width: 768px) {
  .top .next--schedule {
    width: 100%;
    bottom: -100px;
    right: 0;
  }
  .top .next--schedule.on {
    bottom: 0;
  }
}
.top .message {
  background: url(../img/top/message_bg.png) center 0 no-repeat;
  background-size: cover;
  padding: 150px 0 100px;
  position: relative;
  z-index: 2;
  display: flex;
  flex-direction: column;
}
.top .message--inner {
  max-width: 800px;
  width: 100%;
  margin: auto;
  padding: 80px 50px 50px 65px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .top .message--inner {
    padding: 0 5%;
    text-align: left;
  }
}
.top .message h3 {
  margin-bottom: 35px;
  opacity: 0;
}
@media screen and (max-width: 768px) {
  .top .message h3 {
    width: 26.4%;
    margin: 0 auto 40px;
  }
}
.top .message h3.on {
  animation: meshead 1s linear forwards;
}
@keyframes meshead {
  0% {
    opacity: 0.3;
  }
  20% {
    opacity: 1;
  }
  40% {
    opacity: 0.3;
  }
  60% {
    opacity: 1;
  }
  80% {
    opacity: 0.3;
  }
  100% {
    opacity: 1;
  }
}
.top .message h4 {
  margin-bottom: 50px;
  position: relative;
  top: -50px;
  opacity: 0;
  transition: 0.5s;
  transition-delay: 0.25s;
}
@media screen and (max-width: 768px) {
  .top .message h4 {
    margin-bottom: 32px;
  }
}
.top .message h4.on {
  top: 0;
  opacity: 1;
}
.top .message p {
  font-size: 1.8rem;
  font-family: "NotoSansCJKjp Medium";
  color: #fff;
  line-height: 2.444;
  text-align: center;
  text-shadow: 2px 3px 2px #0d2557;
  position: relative;
  top: -50px;
  opacity: 0;
  transition: 0.25s;
  transition-delay: 1s;
}
.top .message p.on {
  top: 0;
  opacity: 1;
}
@media screen and (max-width: 768px) {
  .top .message p {
    font-size: 1.4rem;
    line-height: 1.928;
    text-align: justify;
  }
}
.top .trialmission {
  background: url(../img/top/trialmission_bg.png) center 0 no-repeat;
  margin-top: 130px;
  padding-top: 85px;
}
@media screen and (max-width: 768px) {
  .top .trialmission {
    padding: 30px 5% 0;
    margin-top: 60px;
    background: url(../img/top/trialmission_bg.png) center 0 no-repeat;
    background-size: 100%;
  }
}
.top .trialmission h3 {
  margin-bottom: 60px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .top .trialmission h3 {
    margin-bottom: 30px;
  }
}
.top .trialmission--block {
  max-width: 1000px;
  width: 100%;
  margin: auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .top .trialmission--block {
    flex-direction: column-reverse;
  }
}
.top .trialmission--block .textarea {
  max-width: 460px;
  position: relative;
  left: -50px;
  opacity: 0;
  transition: 0.25s;
}
.top .trialmission--block .textarea.on {
  opacity: 1;
  left: 0;
}
.top .trialmission--block .textarea p {
  font-size: 1.6rem;
  font-family: "NotoSansCJKjp DemiLight";
  line-height: 2;
  color: #fff;
  text-align: justify;
  letter-spacing: 0;
  margin-top: 42px;
}
@media screen and (max-width: 768px) {
  .top .trialmission--block .textarea p {
    font-size: 1.4rem;
    line-height: 1.928;
    margin-top: 24px;
  }
}
.top .trialmission--block .thumb {
  max-width: 480px;
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  position: relative;
  right: -50px;
  opacity: 0;
  transition: 0.25s;
}
@media screen and (max-width: 768px) {
  .top .trialmission--block .thumb {
    margin-bottom: 30px;
  }
}
.top .trialmission--block .thumb.on {
  right: 0;
  opacity: 1;
}
.top .trialmission--block .thumb .item:first-child {
  margin-bottom: 20px;
}
@media screen and (max-width: 768px) {
  .top .trialmission--block .thumb .item:nth-child(n + 2) {
    width: 30%;
  }
}
.top .trialmission--feature {
  max-width: 1000px;
  margin: 70px auto 0;
  background: url(../img/top/bg_special.png);
  border: 1px solid #00ffce;
  padding: 50px 0 50px 60px;
}
@media screen and (max-width: 768px) {
  .top .trialmission--feature {
    padding: 30px 10%;
  }
}
.top .trialmission--feature ul {
  margin-top: 24px;
}
.top .trialmission--feature li {
  font-size: 2.4rem;
  font-weight: 900;
  font-family: "Hiragino Kaku Gothic Pro";
  line-height: 2.5;
  text-shadow: 2px 4px 4px #27447e;
  letter-spacing: 0.02em;
  color: #fff;
  padding-left: 50px;
  line-height: 60px;
  opacity: 0;
  transition: 0.25s;
}
@media screen and (max-width: 768px) {
  .top .trialmission--feature li {
    font-size: 1.6rem;
    line-height: 1.5625;
    padding: 20px 0 0 12%;
    margin-bottom: 20px;
  }
}
.top .trialmission--feature li.on {
  opacity: 1;
}
.top .trialmission--feature li:first-child {
  background: url(../img/top/trialmission_feature_lbl01.png) 0 center no-repeat;
}
.top .trialmission--feature li:nth-child(2) {
  background: url(../img/top/trialmission_feature_lbl02.png) 0 center no-repeat;
  transition-delay: 0.1s;
}
.top .trialmission--feature li:last-child {
  background: url(../img/top/trialmission_feature_lbl03.png) 0 center no-repeat;
  transition-delay: 0.2s;
}
@media screen and (max-width: 768px) {
  .top .trialmission--feature li:first-child {
    background: url(../img/top/trialmission_feature_lbl01.png) 0 0 no-repeat;
  }
  .top .trialmission--feature li:nth-child(2) {
    background: url(../img/top/trialmission_feature_lbl02.png) 0 0 no-repeat;
  }
  .top .trialmission--feature li:last-child {
    background: url(../img/top/trialmission_feature_lbl03.png) 0 0 no-repeat;
  }
}
.top .trialmission--feature li .yellow {
  font-size: 2.4rem;
  font-weight: 900;
  font-family: "Hiragino Kaku Gothic Pro";
  text-shadow: 2px 3px 2px #27447e;
  color: #fff100;
}
@media screen and (max-width: 768px) {
  .top .trialmission--feature li .yellow {
    font-size: 1.6rem;
  }
}
.top .trialmission--feature li .notes {
  font-size: 1.6rem;
}
.top .schedule {
  padding: 140px 0;
  margin-top: 100px;
}
@media screen and (max-width: 768px) {
  .top .schedule {
    padding: 70px 0;
    margin-top: 10px;
  }
}
.top .schedule--day {
  max-width: 1000px;
  height: 651px;
  margin: 0 auto 200px;
  background: url(../img/top/schedule_bg.png) center 60px no-repeat;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .top .schedule--day {
    height: auto;
    margin: 0 auto 80px;
    background: url(../img/top/sp_schedule_bg.png) center 60px no-repeat;
    background-size: 100%;
  }
}
.top .schedule--day h2 {
  margin-top: -50px;
}
@media screen and (max-width: 768px) {
  .top .schedule--day h2 {
    margin-top: 0;
    padding: 0 6%;
  }
}
.top .schedule--day .timeline {
  position: relative;
  max-width: 800px;
  margin: 70px auto 0;
}
@media screen and (max-width: 768px) {
  .top .schedule--day .timeline {
    margin: 20px auto 0;
    padding: 0 6%;
  }
}
.top .schedule--day .timeline .pointer {
  position: relative;
  top: 0;
  left: 0;
  display: inline-block;
  margin-right: 16px;
  transition: 0.25s;
  opacity: 0;
}
@media screen and (max-width: 768px) {
  .top .schedule--day .timeline .pointer {
    top: -20px;
    margin-right: 0;
    margin-bottom: 12px;
  }
}
/* .top .schedule--day .timeline .pointer:before {
  content: "";
  position: absolute;
  top: -70px;
  left: 3px;
  width: 83px;
  height: 56px;
  opacity: 0;
  transition: 0.25s;
} */
@media screen and (max-width: 768px) {
  .top .schedule--day .timeline .pointer:before {
    display: none;
  }
}
.top .schedule--day .timeline .pointer.on {
  opacity: 1;
  left: 30px;
}
@media screen and (max-width: 768px) {
  .top .schedule--day .timeline .pointer.on {
    top: 0;
    left: 0;
  }
}
.top .schedule--day .timeline .pointer.on:before {
  opacity: 1;
  top: -50px;
}
.top .schedule--day .timeline .time10:before {
  background: url(../img/top/schedule_day_time1000.png) 0 0 no-repeat;
  transition-delay: 0.5s;
}
.top .schedule--day .timeline .time12 {
  transition-delay: 0.25s;
}
.top .schedule--day .timeline .time12:before {
  background: url(../img/top/schedule_day_time1200.png) 0 0 no-repeat;
  transition-delay: 0.75s;
}
.top .schedule--day .timeline .time13 {
  transition-delay: 0.5s;
}
.top .schedule--day .timeline .time13:before {
  background: url(../img/top/schedule_day_time1300.png) 0 0 no-repeat;
  transition-delay: 1s;
}
.top .schedule--day .timeline .time14 {
  transition-delay: 0.75s;
}
.top .schedule--day .timeline .time14:before {
  background: url(../img/top/schedule_day_time1400.png) 0 0 no-repeat;
  transition-delay: 1.25s;
}
.top .schedule--day .timeline .time16 {
  transition-delay: 1s;
}
.top .schedule--day .timeline .time16:before {
  background: url(../img/top/schedule_day_time1630.png) 0 0 no-repeat;
  transition-delay: 1.5s;
}
.top .schedule--day .timeline .time17 {
  transition-delay: 1.25s;
}
.top .schedule--day .timeline .time17:before {
  background: url(../img/top/schedule_day_time1730.png) 0 0 no-repeat;
  transition-delay: 1.75s;
}
.top .schedule--timetable {
  position: relative;
}
.top .schedule--timetable:before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  margin-left: -588px;
  background: url(../img/top/schedule_timetable_line.png) 0 0 repeat-y;
  width: 9px;
  height: 100%;
  z-index: 99;
}
@media screen and (max-width: 768px) {
  .top .schedule--timetable:before {
    background: url(../img/top/schedule_timetable_line.png) 0 0 repeat-y;
    background-size: 5px;
    width: 5px;
    left: 5%;
    margin-left: 0;
  }
}
.top .schedule--item {
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  max-width: 1000px;
  width: 100%;
  margin: 0 auto 180px;
}
@media screen and (max-width: 768px) {
  .top .schedule--item {
    display: block;
    margin-bottom: 100px;
  }
}
.top .schedule--item#schedule02,
.top .schedule--item#schedule04 {
  flex-direction: row-reverse;
}
.top .schedule--item:before {
  content: "";
  position: absolute;
  top: -80px;
  left: 50%;
  transform: translate(-50%, 0);
  width: 328px;
  height: 108px;
  animation: light 3s linear infinite forwards;
}
@keyframes light {
  0% {
    opacity: 0;
  }
  25% {
    opacity: 1;
  }
  50% {
    opacity: 0;
  }
  75% {
    opacity: 1;
  }
  100% {
    opacity: 0;
  }
}
@media screen and (max-width: 768px) {
  .top .schedule--item:before {
    left: auto;
    top: -40px;
    right: 5%;
    width: 164px;
    height: 58px;
    transform: translate(0, 0);
  }
}
.top .schedule--item:after {
  content: "";
  position: absolute;
}
.top .schedule--item#schedule01 {
  padding-top: 60px;
}
@media screen and (max-width: 768px) {
  .top .schedule--item#schedule01 {
    padding-top: 30px;
  }
}
.top .schedule--item#schedule01:before {
  top: -60px;
  background: url(../img/top/time1000.png) 0 0 no-repeat;
}
@media screen and (max-width: 768px) {
  .top .schedule--item#schedule01:before {
    top: -30px;
    background-size: contain;
  }
}
.top .schedule--item#schedule02:before {
  background: url(../img/top/time1300.png) 0 0 no-repeat;
}
@media screen and (max-width: 768px) {
  .top .schedule--item#schedule02:before {
    background-size: contain;
  }
}
.top .schedule--item#schedule02:after {
  content: "";
  position: absolute;
  top: 250px;
  left: 50%;
  transform: translate(-150%, 0);
  background: url(../img/top/fig_data.png) 0 0 no-repeat;
  background-size: 100%;
  width: 607px;
  height: 329px;
}
@media screen and (max-width: 768px) {
  .top .schedule--item#schedule02:after {
    top: 100px;
    left: auto;
    right: -24%;
    transform: translate(0, 0);
    width: 302px;
    height: 165px;
  }
}
.top .schedule--item#schedule02 .thumb {
  margin-right: -55px;
}
@media screen and (max-width: 768px) {
  .top .schedule--item#schedule02 .thumb {
    margin-right: 0;
    margin-left: -5%;
    width: 78%;
  }
}
.top .schedule--item#schedule03 .thumb {
  max-width: 796px;
  width: 100%;
  margin-left: -150px;
}

@media screen and (max-width: 768px) {
  .top .schedule--item#schedule03 .thumb {
    padding: 0;
    margin-left: 0;
  }
}
.top .schedule--item#schedule03 .textarea {
  width: 100%;
}
.top .schedule--item#schedule03:before {
  background: url(../img/top/time1400.png) 0 0 no-repeat;
}
@media screen and (max-width: 768px) {
  .top .schedule--item#schedule03:before {
    background-size: contain;
  }
}
.top .schedule--item#schedule04:before {
  background: url(../img/top/time1630.png) 0 0 no-repeat;
}
@media screen and (max-width: 768px) {
  .top .schedule--item#schedule04:before {
    background-size: contain;
  }
}
@media screen and (max-width: 768px) {
  .top .schedule--item#schedule04 .thumb {
    margin-left: -3%;
    width: 90%;
  }
}
.top .schedule--item#schedule04 .thumb:after {
  top: -20px;
  right: -30px;
}
.top .schedule--item#schedule05 {
  margin-bottom: 0;
  padding-bottom: 180px;
}
@media screen and (max-width: 768px) {
  .top .schedule--item#schedule05 {
    padding-bottom: 60px;
    margin-bottom: 0;
  }
}
@media screen and (max-width: 768px) {
  .top .schedule--item#schedule05 .thumb {
    width: 70%;
  }
}
.top .schedule--item#schedule05:before {
  background: url(../img/top/time1700.png) 0 0 no-repeat;
}
@media screen and (max-width: 768px) {
  .top .schedule--item#schedule05:before {
    background-size: contain;
  }
}
.top .schedule--item#schedule01 .thumb:after,
.top .schedule--item#schedule04 .thumb:after,
.top .schedule--item#schedule05 .thumb:after {
  content: "";
  position: absolute;
  background: url(../img/top/schedule_anime.gif) 0 0 no-repeat;
  width: 168px;
  height: 168px;
  opacity: 0.7;
}
.top .schedule--item#schedule01 .thumb:after,
.top .schedule--item#schedule05 .thumb:after {
  bottom: -20px;
  left: -20px;
}
.top .schedule--item#schedule01 .header,
.top .schedule--item#schedule01 h4,
.top .schedule--item#schedule01 p,
.top .schedule--item#schedule03 .header,
.top .schedule--item#schedule03 h4,
.top .schedule--item#schedule03 p,
.top .schedule--item#schedule05 .header,
.top .schedule--item#schedule05 h4,
.top .schedule--item#schedule05 p {
  left: 50px;
}
.top .schedule--item#schedule01 .header.on,
.top .schedule--item#schedule01 h4.on,
.top .schedule--item#schedule01 p.on,
.top .schedule--item#schedule03 .header.on,
.top .schedule--item#schedule03 h4.on,
.top .schedule--item#schedule03 p.on,
.top .schedule--item#schedule05 .header.on,
.top .schedule--item#schedule05 h4.on,
.top .schedule--item#schedule05 p.on {
  left: 0;
}
.top .schedule--item#schedule02 .header,
.top .schedule--item#schedule02 h4,
.top .schedule--item#schedule02 p,
.top .schedule--item#schedule04 .header,
.top .schedule--item#schedule04 h4,
.top .schedule--item#schedule04 p {
  right: 50px;
}
.top .schedule--item#schedule02 .header.on,
.top .schedule--item#schedule02 h4.on,
.top .schedule--item#schedule02 p.on,
.top .schedule--item#schedule04 .header.on,
.top .schedule--item#schedule04 h4.on,
.top .schedule--item#schedule04 p.on {
  right: 0;
}
.top .schedule--item#schedule06 {
  margin-bottom: 0;
}
.top .schedule--item .timer {
  position: absolute;
  top: -20px;
  left: -60px;
  z-index: 100;
}
@media screen and (max-width: 768px) {
  .top .schedule--item .timer {
    width: 32%;
    top: -10px;
    left: 14.5%;
  }
}
.top .schedule--item .timer:before {
  content: "";
  position: absolute;
  top: 50%;
  left: -40px;
  background: url(../img/top/schedule_timetable_mark.png) 0 0 no-repeat;
  width: 23px;
  height: 23px;
  transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
  .top .schedule--item .timer:before {
    background: url(../img/top/schedule_timetable_mark.png) 0 0 no-repeat;
    background-size: 100%;
    width: 12px;
    height: 12px;
  }
}
.top .schedule--item .timer.time1400 {
  top: -50px;
}
@media screen and (max-width: 768px) {
  .top .schedule--item .timer.time1400 {
    top: -30px;
  }
}
.top .schedule--item .timer.time1730 {
  top: -80px;
}
@media screen and (max-width: 768px) {
  .top .schedule--item .timer.time1730 {
    top: -40px;
  }
}
.top .schedule--item .thumb {
  position: relative;
  z-index: 2;
  transform: scale(0.3);
  opacity: 0;
  transition: 0.25s;
}
.top .schedule--item .thumb.on {
  transform: scale(1);
  opacity: 1;
}
@media screen and (max-width: 768px) {
  .top .schedule--item .thumb {
    padding: 0 5% 0 12%;
    margin-bottom: 10px;
  }
}
@media screen and (max-width: 768px) {
  .top .schedule--item .textarea {
    padding: 0 5% 0 12%;
  }
}
.top .schedule--item .textarea.w420 {
  max-width: 420px;
}
.top .schedule--item .textarea.w490 {
  max-width: 554px;
}
.top .schedule--item .textarea.w570 {
  max-width: 570px;
}
.top .schedule--item .textarea .header {
  display: flex;
  align-items: center;
  margin-bottom: 50px;
  position: relative;
  top: 50px;
  opacity: 0;
  transition: 0.2s;
  transition-delay: 0.2s;
}
.top .schedule--item .textarea .header.on {
  top: 0;
  opacity: 1;
}
@media screen and (max-width: 768px) {
  .top .schedule--item .textarea .header {
    margin-bottom: 25px;
  }
}
@media screen and (max-width: 768px) {
  .top .schedule--item .textarea .header .num {
    width: 52px;
  }
}
@media screen and (max-width: 768px) {
  .top .schedule--item .textarea .header h3 {
    width: 73.8%;
    margin-left: 3%;
  }
}
.top .schedule--item .textarea h4 {
  font-size: 2.6rem;
  font-family: "NotoSansCJKjp bold";
  line-height: 1.3846;
  color: #52d4cc;
  margin-bottom: 28px;
  position: relative;
  top: 50px;
  opacity: 0;
  transition: 0.2s;
  transition-delay: 0.4s;
}
.top .schedule--item .textarea h4.on {
  top: 0;
  opacity: 1;
}
@media screen and (max-width: 768px) {
  .top .schedule--item .textarea h4 {
    font-size: 1.9rem;
    line-height: 1.57;
    margin-bottom: 14px;
  }
}
.top .schedule--item .textarea p {
  font-size: 1.6rem;
  font-family: "NotoSansCJKjp DemiLight";
  line-height: 1.875;
  color: #fff;
  position: relative;
  top: 50px;
  opacity: 0;
  transition: 0.2s;
  transition-delay: 0.6s;
}
.top .schedule--item .textarea p.on {
  top: 0;
  opacity: 1;
}
@media screen and (max-width: 768px) {
  .top .schedule--item .textarea p {
    font-size: 1.4rem;
  }
}
.top .company {
  position: relative;
  z-index: 2;
  background: url(../img/top/comapny_bg.png) center 0 no-repeat;
  background-size: cover;
  padding: 100px 0;
}
@media screen and (max-width: 768px) {
  .top .company {
    padding: 60px 0 40px;
  }
}
.top .company h3 {
  text-align: center;
  margin-bottom: 64px;
}
@media screen and (max-width: 768px) {
  .top .company h3 {
    width: 42.3%;
    margin: 0 auto 32px;
  }
}
.top .company--block {
  max-width: 800px;
  width: 100%;
  margin: auto;
}
.top .company .thumb {
  margin-bottom: 50px;
}
.top .company .textarea.second {
  margin-top: 50px;
}
@media screen and (max-width: 768px) {
  .top .company .textarea {
    padding: 0 5%;
  }
  .top .company .textarea.second {
    margin-top: 40px;
  }
}
.top .company h4 {
  margin-bottom: 40px;
}
@media screen and (max-width: 768px) {
  .top .company h4 {
    margin-bottom: 24px;
  }
}
.top .company h4.subheading {
  width: 455px;
}
@media screen and (max-width: 768px) {
  .top .company h4.subheading {
    width: 100%;
  }
}
.top .company p {
  font-size: 1.6rem;
  font-family: "NotoSansCJKjp DemiLight";
  color: #fff;
  line-height: 2.444;
  text-align: justify;
  text-shadow: 2px 3px 2px #0d2557;
  letter-spacing: 0;
}
.top .company p strong {
  font-size: 1.8rem;
  font-family: "NotoSansCJKjp DemiLight";
  letter-spacing: 0.1em;
}
@media screen and (max-width: 768px) {
  .top .company p {
    font-size: 1.4rem;
    line-height: 1.928;
  }
}
.top .company .bnrarea {
  margin-top: 28px;
}
@media screen and (max-width: 768px) {
  .top .company .bnrarea {
    padding: 0 5%;
  }
}
.top .company .bnrarea ul {
  display: flex;
  justify-content: space-between;
}
@media screen and (max-width: 768px) {
  .top .company .bnrarea li {
    width: 31.3%;
  }
}
.top .company .bnrarea .corpratesite {
  display: block;
  width: 100%;
  border: 1px solid #52d4cc;
  margin-top: 46px;
  padding: 20px 0;
  font-size: 2rem;
  font-family: "NotoSansCJKjp bold";
  color: #52d4cc;
  text-align: center;
  background: url(../img/common/icon_outlink.png) 99% 88% no-repeat;
  position: relative;
}
@media screen and (max-width: 768px) {
  .top .company .bnrarea .corpratesite {
    font-size: 1.4rem;
    padding: 16px 0;
    margin-top: 24px;
  }
}
.top .company .bnrarea .corpratesite:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: 196px;
  margin-top: -10px;
  background: url(../img/common/arrow_link.png) 0 0 no-repeat;
  width: 12px;
  height: 19px;
}
@media screen and (max-width: 768px) {
  .top .company .bnrarea .corpratesite:before {
    background: url(../img/common/arrow_link.png) 0 0 no-repeat;
    background-size: 100%;
    left: auto;
    right: 6%;
    width: 6px;
    height: 10px;
    margin-left: 0;
    margin-top: -4px;
  }
}
.top .member {
  width: 100vw;
  position: relative;
}
.top .member .movie {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  overflow: hidden;
}
.top .member .movie.fix {
  position: fixed;
}
.top .member .movie.over {
  top: auto;
  bottom: 0;
}
.top .member #video {
  position: absolute;
  right: 0;
  bottom: 0;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
}
.top .member h3 {
  position: relative;
  padding-top: 100px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .top .member h3 {
    padding-top: 40px;
    width: 68.5%;
    margin: auto;
  }
}
.top .member--textarea {
  max-width: 800px;
  margin: auto;
  padding: 80px 0;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 768px) {
  .top .member--textarea {
    padding: 40px 0;
  }
}
.top .member--textarea .heading {
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  .top .member--textarea .textarea {
    padding: 0 5%;
  }
}
.top .member--textarea p {
  font-size: 2rem;
  font-family: "NotoSansCJKjp Medium";
  color: #fff;
  letter-spacing: 0.1em;
  line-height: 2.2;
  text-align: center;
  text-shadow: 1px 2px 2px #27447e;
}
.top .member--textarea p span {
  font-size: 2rem;
  display: inline-block;
  position: relative;
}
.top .member--textarea p span:before {
  content: "";
  position: absolute;
  bottom: 5px;
  left: 0;
  background-color: #52d4cc;
  width: 100%;
  height: 15px;
  z-index: -1;
}
@media screen and (max-width: 768px) {
  .top .member--textarea p {
    font-size: 1.4rem;
    line-height: 2.2;
  }
  .top .member--textarea p span {
    font-size: 1.4rem;
  }
  .top .member--textarea p span:before {
    bottom: 2px;
    height: 10px;
    z-index: -1;
  }
}
.top .member--slide {
  position: relative;
  z-index: 10;
  width: 100vw;
  padding: 0 0 80px;
}
@media screen and (max-width: 768px) {
  .top .member--slide {
    padding: 0 0 40px;
  }
}
.top .member--slide--block {
  position: relative;
}
.top .member--slide--block .slick-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-70%);
  width: 81px;
  height: 154px;
  z-index: 99;
  text-indent: -9999px;
  background: transparent;
  border: 0;
}
@media screen and (max-width: 768px) {
  .top .member--slide--block .slick-arrow {
    width: 40px;
    height: 77px;
  }
}
.top .member--slide--block .slick-arrow:hover {
  cursor: pointer;
}
.top .member--slide--block .slick-arrow:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 81px;
  height: 154px;
  z-index: 99;
}
@media screen and (max-width: 768px) {
  .top .member--slide--block .slick-arrow:before {
    width: 40px;
    height: 77px;
  }
}
.top .member--slide--block .slick-prev {
  left: 50%;
  margin-left: -400px;
}
@media screen and (max-width: 768px) {
  .top .member--slide--block .slick-prev {
    left: 5%;
    margin-left: 0;
  }
}
.top .member--slide--block .slick-prev:before {
  background: url(../img/common/prev_arrow.png) 0 0 no-repeat;
}
@media screen and (max-width: 768px) {
  .top .member--slide--block .slick-prev:before {
    background: url(../img/common/prev_arrow.png) 0 0 no-repeat;
    background-size: 100%;
  }
}
.top .member--slide--block .slick-next {
  right: 50%;
  margin-right: -400px;
}
@media screen and (max-width: 768px) {
  .top .member--slide--block .slick-next {
    right: 5%;
    margin-right: 0;
  }
}
.top .member--slide--block .slick-next:before {
  background: url(../img/common/next_arrow.png) 0 0 no-repeat;
}
@media screen and (max-width: 768px) {
  .top .member--slide--block .slick-next:before {
    background: url(../img/common/next_arrow.png) 0 0 no-repeat;
    background-size: 100%;
  }
}
.top .member--slide--block .slick-dots {
  position: absolute;
  left: 0;
  bottom: 0;
}
.top .member--slide--block .slick-dots li {
  width: 280px;
  height: 96px;
}
.top .member--slide--block .slick-dots li button {
  width: 280px;
  height: 96px;
  position: relative;
}
.top .member--slide--block .slick-dots li button:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 280px;
  height: 96px;
}
.top .member--slide--block .slick-dots li:first-child button:before {
  background: url(../img/top/member01_off.png) 0 0 no-repeat;
}
.top .member--slide--block .slick-dots li:nth-child(2) button:before {
  background: url(../img/top/member02_off.png) 0 0 no-repeat;
}
.top .member--slide--block .slick-dots li:nth-child(3) button:before {
  background: url(../img/top/member03_off.png) 0 0 no-repeat;
}
.top .member--slide--block .slick-dots li:nth-child(4) button:before {
  background: url(../img/top/member04_off.png) 0 0 no-repeat;
}
.top .member--slide--block .slick-dots li:nth-child(5) button:before {
  background: url(../img/top/member05_off.png) 0 0 no-repeat;
}
.top .member--slide--block .slick-dots li:last-child button:before {
  background: url(../img/top/member06_off.png) 0 0 no-repeat;
}
.top
  .member--slide--block
  .slick-dots
  li.slick-active:first-child
  button:before {
  background: url(../img/top/member01_on.png) 0 0 no-repeat;
}
.top
  .member--slide--block
  .slick-dots
  li.slick-active:nth-child(2)
  button:before {
  background: url(../img/top/member02_on.png) 0 0 no-repeat;
}
.top
  .member--slide--block
  .slick-dots
  li.slick-active:nth-child(3)
  button:before {
  background: url(../img/top/member03_on.png) 0 0 no-repeat;
}
.top
  .member--slide--block
  .slick-dots
  li.slick-active:nth-child(4)
  button:before {
  background: url(../img/top/member04_on.png) 0 0 no-repeat;
}
.top
  .member--slide--block
  .slick-dots
  li.slick-active:nth-child(5)
  button:before {
  background: url(../img/top/member05_on.png) 0 0 no-repeat;
}
.top
  .member--slide--block
  .slick-dots
  li.slick-active:last-child
  button:before {
  background: url(../img/top/member06_on.png) 0 0 no-repeat;
}
.top .member--slide--item {
  position: relative;
  opacity: 0.6;
}
.top .member--slide--item.slick-active {
  z-index: 999;
}
.top .member--slide--item.slick-current {
  opacity: 1;
  z-index: 9999;
}
.top .member--slide--item.slick-current .person:before,
.top .member--slide--item.slick-current .person:after {
  transform: scale(1);
  opacity: 1;
}
.top .member--slide--item.slick-current .person .readmore img {
  opacity: 1;
}
.top .member--slide--item.slick-current .memberdata {
  animation: box 300ms ease 800ms;
  animation-fill-mode: forwards;
}
.top .member--slide--item.slick-current .memberdata .shuffle {
  opacity: 1;
}
@keyframes box {
  0% {
    opacity: 0;
    transform: scale(1, 0);
  }
  100% {
    opacity: 1;
    transform: scale(1);
  }
}
.top .member--slide--item .person {
  position: relative;
}
.top .member--slide--item .person:after {
  content: "";
  position: absolute;
  bottom: 50px;
  right: 0;
  width: 136px;
  height: 494px;
  transform: scale(100);
  opacity: 0;
  transition-delay: 0.5s;
  transition: 0.25s;
}
@media screen and (max-width: 768px) {
  .top .member--slide--item .person:after {
    width: 68px;
    height: 247px;
    background-size: 100%;
    bottom: 180px;
  }
}
.top .member--slide--item .person.member01:after {
  background: url(../img/top/name_member01.png) 0 0 no-repeat;
}
@media screen and (max-width: 768px) {
  .top .member--slide--item .person.member01:after {
    background: url(../img/top/name_member01.png) 0 0 no-repeat;
    background-size: 100%;
  }
}
.top .member--slide--item .person.member02:after {
  background: url(../img/top/name_member02.png) 0 0 no-repeat;
}
@media screen and (max-width: 768px) {
  .top .member--slide--item .person.member02:after {
    background: url(../img/top/name_member02.png) 0 0 no-repeat;
    background-size: 100%;
  }
}
.top .member--slide--item .person.member03:after {
  background: url(../img/top/name_member03.png) 0 0 no-repeat;
}
@media screen and (max-width: 768px) {
  .top .member--slide--item .person.member03:after {
    background: url(../img/top/name_member03.png) 0 0 no-repeat;
    background-size: 100%;
  }
}
.top .member--slide--item .person.member04:after {
  background: url(../img/top/name_member04.png) 0 0 no-repeat;
}
@media screen and (max-width: 768px) {
  .top .member--slide--item .person.member04:after {
    background: url(../img/top/name_member04.png) 0 0 no-repeat;
    background-size: 100%;
  }
}
.top .member--slide--item .person.member05:after {
  background: url(../img/top/name_member05.png) 0 0 no-repeat;
}
@media screen and (max-width: 768px) {
  .top .member--slide--item .person.member05:after {
    background: url(../img/top/name_member05.png) 0 0 no-repeat;
    background-size: 100%;
  }
}
.top .member--slide--item .person.member06:after {
  background: url(../img/top/name_member06.png) 0 0 no-repeat;
}
@media screen and (max-width: 768px) {
  .top .member--slide--item .person.member06:after {
    background: url(../img/top/name_member06.png) 0 0 no-repeat;
    background-size: 100%;
  }
}
.top .member--slide--item .person img {
  margin: auto;
}
.top .member--slide--item .person img.sp {
  display: none;
}
@media screen and (max-width: 768px) {
  .top .member--slide--item .person img {
    width: 90%;
  }
  .top .member--slide--item .person img.sp {
    display: block;
  }
  .top .member--slide--item .person img.pc {
    display: none;
  }
}
.top .member--slide--item .person .readmore {
  position: absolute;
  width: 630px;
  bottom: 0;
  left: -70px;
}
@media screen and (max-width: 768px) {
  .top .member--slide--item .person .readmore {
    position: static;
  }
}
.top .member--slide--item .person .readmore img {
  opacity: 0;
}
.top .member--slide--item .memberdata {
  position: absolute;
  bottom: 70px;
  left: 0;
  width: 242px;
  padding: 20px 0;
  background: url(../img/top/bg_member.png) center 0 repeat-x;
  opacity: 0;
  transform: scale(1, 0);
}
@media screen and (max-width: 768px) {
  .top .member--slide--item .memberdata {
    display: none;
  }
}
.top .member--slide--item .memberdata .shuffle {
  opacity: 0;
  transition: 0.2s;
  transition-delay: 1s;
}
.top .member--slide--item .memberdata:before,
.top .member--slide--item .memberdata:after {
  content: "";
  position: absolute;
  left: 0;
  width: 100%;
  height: 6px;
  z-index: 99;
}
.top .member--slide--item .memberdata:before {
  background: url(../img/top/member_top_line.png) center 0 repeat-x;
  top: 0;
}
.top .member--slide--item .memberdata:after {
  background: url(../img/top/member_under_line.png) center 0 repeat-x;
  bottom: 0;
}
.top .member--slide--item .memberdata dt,
.top .member--slide--item .memberdata dd {
  font-family: "Makinas-Scrap-5";
  color: #52d4cc;
  font-size: 1.4rem;
  padding: 8px 0;
}
.top .member--slide--item .memberdata dt {
  position: relative;
  float: left;
  padding-left: 15px;
}
.top .member--slide--item .memberdata dt:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 10px;
  height: 1px;
  margin-top: -1px;
  background-color: #52d4cc;
}
.top .member--slide--item .memberdata dd {
  padding-left: 76px;
}
.top .member--slide--item .memberdata dd span {
  display: block;
  font-family: "Makinas-Scrap-5";
  color: #52d4cc;
  font-size: 1.4rem;
}
.top .member--list ul {
  display: flex;
  flex-wrap: wrap;
}
@media screen and (max-width: 768px) {
  .top .member--list ul {
    border-top: 1px solid #52d4cc;
  }
}
.top .member--list li {
  width: 50%;
  border: 1px solid #52d4cc;
}
.top .special {
  background: url(../img/top/bg_special.png);
  padding: 120px 0;
  border-top: 4px solid #12e8db;
  position: relative;
}
.top .special.bonus:before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.7);
  z-index: 8;
}
@media screen and (max-width: 768px) {
  .top .special {
    padding: 60px 5%;
  }
}
.top .special--inner {
  max-width: 1000px;
  margin: auto;
}
.top .special h2 {
  text-align: center;
  margin-bottom: 56px;
}
.top .special--item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 40px 55px 40px 40px;
  background-color: rgba(18, 232, 219, 0.4);
  position: relative;
  margin-top: 30px;
}
@media screen and (max-width: 768px) {
  .top .special--item {
    display: block;
    padding: 26px 5%;
    margin-top: 20px;
  }
}
.top .special--item:before,
.top .special--item:after {
  content: "";
  position: absolute;
  top: -2px;
  width: 22px;
  height: 285px;
}
.top .special--item:before {
  left: -2px;
  background: url(../img/top/marks_left.png) 0 0 no-repeat;
  background-size: 100%;
}
@media screen and (max-width: 768px) {
  .top .special--item:before {
    background: url(../img/top/sp_marks_left.png) 0 0 no-repeat;
    background-size: 100%;
  }
}
.top .special--item:after {
  right: -2px;
  background: url(../img/top/marks_right.png) 0 0 no-repeat;
  background-size: 100%;
}
@media screen and (max-width: 768px) {
  .top .special--item:after {
    background: url(../img/top/sp_marks_right.png) 0 0 no-repeat;
    background-size: 100%;
  }
}
@media screen and (min-width: 769px) {
  .top .special--item:hover {
    opacity: 1;
    background-color: rgba(0, 0, 0, 0.4);
  }
  .top .special--item:hover:before {
    background: url(../img/top/marks_left_yellow.png) 0 0 no-repeat;
    background-size: 100%;
  }
  .top .special--item:hover:after {
    background: url(../img/top/marks_right_yellow.png) 0 0 no-repeat;
    background-size: 100%;
  }
  .top .special--item:hover:before,
  .top .special--item:hover:after {
    animation: hoverIcon 0.2s linear forwards;
  }
  @keyframes hoverIcon {
    0% {
      transform: scale(1.5);
    }
    100% {
      transform: scale(1);
    }
  }
}
.top .special--item.completion {
  background-color: rgba(0, 0, 0, 0.4);
}
.top .special--item.completion:before {
  background: url(../img/top/marks_left_yellow.png) 0 0 no-repeat;
  background-size: 100%;
}
@media screen and (max-width: 768px) {
  .top .special--item.completion:before {
    background: url(../img/top/sp_marks_left_yellow.png) 0 0 no-repeat;
    background-size: 100%;
  }
}
.top .special--item.completion:after {
  background: url(../img/top/marks_right_yellow.png) 0 0 no-repeat;
  background-size: 100%;
}
@media screen and (max-width: 768px) {
  .top .special--item.completion:after {
    background: url(../img/top/sp_marks_right_yellow.png) 0 0 no-repeat;
    background-size: 100%;
  }
}
.top .special--item.completion .thumb img.not {
  display: none;
}
.top .special--item.completion .thumb img.complete {
  display: block;
}
.top .special--item .thumb {
  max-width: 390px;
  width: 100%;
}
.top .special--item .thumb img.complete {
  display: none;
}
.top .special--item .textarea {
  max-width: 470px;
}
@media screen and (max-width: 768px) {
  .top .special--item .textarea {
    margin-top: 20px;
  }
}
.top .special--item .textarea .heading--small {
  color: #fff;
  font-weight: 900;
  font-size: 2.6rem;
  margin-bottom: 16px;
}
@media screen and (max-width: 768px) {
  .top .special--item .textarea .heading--small {
    font-size: 2rem;
    line-height: 1.75;
  }
}
.top .special--item .textarea .heading--small span {
  font-size: 2.6rem;
  color: #fff100;
}
@media screen and (max-width: 768px) {
  .top .special--item .textarea .heading--small span {
    font-size: 2rem;
  }
}
.top .special--item .textarea p {
  font-size: 1.4rem;
  font-family: "NotoSansCJKjp Medium";
  line-height: 1.714;
  color: #fff;
}
.top .special .allcomplete {
  max-width: 870px;
  width: 100%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 10;
  background: url(../img/top/all_mission_complete_bg.png) center 0 no-repeat;
  background-size: 100%;
  padding-top: 100px;
}
.top .special .allcomplete.off {
  display: none;
}
@media screen and (max-width: 768px) {
  .top .special .allcomplete {
    padding: 80px 5% 0;
    background: url(../img/top/all_mission_complete_bg.png) center 0 no-repeat;
    background-size: cover;
    width: 92%;
  }
}
.top .special .allcomplete .arrow {
  max-width: 643px;
  width: 100%;
  position: absolute;
  top: -50px;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (max-width: 768px) {
  .top .special .allcomplete .arrow {
    top: -35px;
  }
}
.top .special .allcomplete h2 {
  max-width: 555px;
  width: 100%;
  margin: 0 auto 50px;
  position: relative;
}
@media screen and (max-width: 768px) {
  .top .special .allcomplete h2 {
    margin: 0 auto 25px;
  }
}
.top .special .allcomplete .leadtxt {
  font-size: 2.8rem;
  font-family: "hiragino_gsW8";
  font-weight: 800;
  line-height: 1.64;
  color: #fff;
  text-shadow: 2px 3px 2px #0d2557;
  text-align: center;
  position: relative;
  margin-bottom: 50px;
}
@media screen and (max-width: 768px) {
  .top .special .allcomplete .leadtxt {
    font-size: 1.8rem;
    margin-bottom: 30px;
  }
}
.top .special .allcomplete .leadtxt strong {
  position: relative;
}
.top .special .allcomplete .leadtxt strong:after {
  content: "";
  position: absolute;
  bottom: -6px;
  left: 0;
  width: 100%;
  height: 14px;
  background-color: #3ae5c4;
}
@media screen and (max-width: 768px) {
  .top .special .allcomplete .leadtxt strong:after {
    bottom: -4px;
    height: 8px;
  }
}
.top .special .allcomplete .leadtxt strong span {
  font-size: 2.8rem;
  font-family: "hiragino_gsW8";
  font-weight: 800;
  position: relative;
  z-index: 2;
}
@media screen and (max-width: 768px) {
  .top .special .allcomplete .leadtxt strong span {
    font-size: 2rem;
  }
}
.top .special .allcomplete .keyword {
  padding: 0 0 70px;
  text-align: center;
  position: relative;
  color: #fff;
}
@media screen and (max-width: 768px) {
  .top .special .allcomplete .keyword {
    padding: 0 0 38px;
  }
}
.top .special .allcomplete .keyword--id {
  max-width: 794px;
  width: 100%;
  margin: 0 auto 40px;
}
@media screen and (max-width: 768px) {
  .top .special .allcomplete .keyword--id {
    margin: 0 auto 20px;
  }
}
.top .special .allcomplete .keyword p {
  font-size: 2.2rem;
  font-family: "hiragino_gsW8";
  line-height: 1.7;
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  .top .special .allcomplete .keyword p {
    font-size: 1.5rem;
    margin-bottom: 6px;
  }
}
.top .special .allcomplete .keyword .notes {
  font-size: 1.4rem;
  font-family: "NotoSansCJKjp DemiLight";
}
@media screen and (max-width: 768px) {
  .top .special .allcomplete .keyword .notes {
    font-size: 1.2rem;
    line-height: 1.45;
  }
}
.top .entry {
  padding: 100px 0;
}
.top .entry h2 {
  text-align: center;
  margin-bottom: 84px;
}
@media screen and (max-width: 768px) {
  .top .entry h2 {
    width: 26.4%;
    margin: 0 auto 42px;
  }
}
.top .entry--inner {
  max-width: 1000px;
  margin: auto;
  background-color: #fff;
  padding-bottom: 90px;
}
@media screen and (max-width: 768px) {
  .top .entry--inner {
    width: 90%;
    padding-bottom: 40px;
  }
}
.top .entry h3 {
  background-color: #444683;
  text-align: center;
  font-size: 2.8rem;
  font-weight: 600;
  font-family: "Hiragino Kaku Gothic Pro";
  color: #fff;
  padding: 10px 0;
  letter-spacing: 0.2em;
}
.top .entry h3.subheading {
  letter-spacing: 0.6em;
}
@media screen and (max-width: 768px) {
  .top .entry h3 {
    font-size: 1.8rem;
    padding: 17px 0;
  }
  .top .entry h3.subheading {
    letter-spacing: 0.2em;
  }
}
.top .entry .nextdate {
  text-align: center;
  margin: 60px 0;
}
@media screen and (max-width: 768px) {
  .top .entry .nextdate {
    margin: 40px 0 30px;
    padding: 0 5%;
  }
}
.top .entry ul {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-bottom: 72px;
}
@media screen and (max-width: 768px) {
  .top .entry ul {
    flex-direction: column;
    margin-bottom: 42px;
    padding: 0 5%;
  }
}
.top .entry ul li {
  margin: 0 10px;
}
@media screen and (max-width: 768px) {
  .top .entry ul li {
    margin: 5px 0;
  }
}
.top .entry .outline {
  padding: 20px 100px;
  margin-bottom: 80px;
}
@media screen and (max-width: 768px) {
  .top .entry .outline {
    padding: 20px 5%;
    margin-bottom: 40px;
  }
}
.top .entry .outline th,
.top .entry .outline td {
  border: 1px dotted #000;
  border-width: 0 0 1px;
  font-size: 1.4rem;
  font-family: "Hiragino Kaku Gothic Pro";
  padding: 20px 0;
  line-height: 1.714;
}
@media screen and (max-width: 768px) {
  .top .entry .outline th,
  .top .entry .outline td {
    display: block;
    padding: 0 0 20px;
    font-size: 1.2rem;
  }
}
.top .entry .outline th {
  font-weight: 900;
  width: 220px;
  padding: 20px 25px;
}
@media screen and (max-width: 768px) {
  .top .entry .outline th {
    width: 100%;
    padding: 20px 0 6px;
    border-width: 0;
  }
}
.top .entry .outline td a {
  text-decoration: underline;
  color: #6ab9e3;
}
.top .entry .outline td span {
  font-size: 1.4rem;
}
.top .entry--maintxt {
  margin-bottom: 40px;
  text-align: center;
}
@media screen and (max-width: 768px) {
  .top .entry--maintxt {
    padding: 0 5%;
    margin-bottom: 30px;
  }
}
.top .entry--btnarea {
  display: flex;
  justify-content: center;
  margin-bottom: 30px;
}
@media screen and (max-width: 768px) {
  .top .entry--btnarea {
    flex-direction: column;
    padding: 0 5%;
    margin-bottom: 0;
  }
}
.top .entry--btnarea .btn {
  margin: 0 17px;
}
@media screen and (max-width: 768px) {
  .top .entry--btnarea .btn {
    margin: 0 0 12px;
  }
}
.top .keyword {
  padding: 0 0 70px;
  text-align: center;
  position: relative;
  color: #222;
}
.top .keyword.off {
  display: none;
}
@media screen and (max-width: 768px) {
  .top .keyword {
    padding: 0 0 38px;
  }
}
.top .keyword--id {
  max-width: 794px;
  width: 100%;
  margin: 0 auto 40px;
}
@media screen and (max-width: 768px) {
  .top .keyword--id {
    width: 90%;
    margin: 0 auto 20px;
  }
}
.top .keyword p {
  font-size: 2.2rem;
  font-family: "hiragino_gsW8";
  font-weight: 800;
  line-height: 1.7;
  margin-bottom: 10px;
}
@media screen and (max-width: 768px) {
  .top .keyword p {
    font-size: 1.5rem;
    margin-bottom: 6px;
  }
}
.top .keyword .notes {
  font-size: 1.4rem;
  font-family: "NotoSansCJKjp DemiLight";
}
@media screen and (max-width: 768px) {
  .top .keyword .notes {
    font-size: 1.2rem;
    line-height: 1.45;
  }
}

@media screen and (min-width: 769px) {
  #nav {
    z-index: 100100;
  }
  .top .next--schedule {
    max-width: 350px;
    bottom: 0;
  }
  .navi_list_fix {
    position: fixed;
    top: 30px;
    right: 30px;
    display: flex;
    z-index: 99989;
    transition: 0.3s;
    transform: translateY(-200%);
  }
  .navi_list_fix.on {
    transform: translateY(0);
  }
  .navi_list_fix li {
    width: 200px;
  }
  .navi_list_fix li a {
    display: block;
    width: 100%;
    height: 100%;
  }
  .navi_list_fix li:nth-of-type(2) {
    margin-left: 10px;
  }
}
@media screen and (max-width: 768px) {
  .top .next--schedule a {
    display: block;
    width: 102%;
    margin-left: -1%;
  }
  .top .next--schedule .navi_list {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 5% 10px;
    background: url(../img/common/sp-pattern.png) repeat;
    background-size: 2px;
  }
  .top .next--schedule .navi_list li {
    width: 48%;
  }
}
.top .next--schedule::before {
  content: none;
}
.top .next--schedule.on {
  right: 0;
}

.top .next--schedule .btn {
  position: static;
}