.top-visual {
  margin: 0 -15px;
  padding: 0;
}

.top-visual-sp {
  background: url(../img/top-visual/sp/top_bg_sp.png) no-repeat;
  background-size: 100%;
  display: block;
  position: relative;
}

@media (min-width: 768px) {
  .top-visual-sp {
    display: none;
  }
}

.top-visual-sp ul {
  list-style-type: none;
}

.top-visual-sp ul, .top-visual-sp li {
  margin: 0;
  padding: 0;
  width: 100%;
}

.top-visual-sp span {
  display: block;
}

.top-visual-sp img {
  width: 100%;
  height: 100%;
  border: 0;
}

.top-visual-sp a {
  border: 0;
}

.top-visual-sp .tv-char-item-beear .tv-char-image {
  position: absolute;
  left: 4.6875%;
  top: 69.40476%;
  width: 47.52604%;
  z-index: 301;
  -webkit-animation: 4s linear 0s infinite alternate shave;
  -moz-animation: 4s linear 0s infinite alternate shave;
  -o-animation: 4s linear 0s infinite alternate shave;
  animation: 4s linear 0s infinite alternate shave;
}

.top-visual-sp .tv-char-item-beear .tv-char-name {
  position: absolute;
  left: 21.875%;
  top: 94.64286%;
  width: 11.71875%;
  z-index: 401;
}

.top-visual-sp .tv-char-item-beear .tv-char-description {
  position: absolute;
  left: -3.25521%;
  top: 32.38095%;
  width: 58.07292%;
  z-index: 501;
}

.top-visual-sp .tv-char-item-beear .tv-char-description img {
  width: 0%;
}

.top-visual-sp .tv-char-item-beear .tv-char-description img.pop-up {
  width: 100%;
  -webkit-animation: 0.5s ease 0s 1 alternate pop-up;
  -moz-animation: 0.5s ease 0s 1 alternate pop-up;
  -o-animation: 0.5s ease 0s 1 alternate pop-up;
  animation: 0.5s ease 0s 1 alternate pop-up;
}

.top-visual-sp .tv-char-item-beear .tv-char-description img.pop-close {
  width: 100%;
  -webkit-animation: 0.5s ease 0s 1 alternate pop-close;
  -moz-animation: 0.5s ease 0s 1 alternate pop-close;
  -o-animation: 0.5s ease 0s 1 alternate pop-close;
  animation: 0.5s ease 0s 1 alternate pop-close;
}

.top-visual-sp .tv-char-item-taiyo .tv-char-image {
  position: absolute;
  left: 29.94792%;
  top: 0.47619%;
  width: 41.66667%;
  z-index: 302;
  -webkit-animation: 4s linear 0s infinite alternate shave;
  -moz-animation: 4s linear 0s infinite alternate shave;
  -o-animation: 4s linear 0s infinite alternate shave;
  animation: 4s linear 0s infinite alternate shave;
}

.top-visual-sp .tv-char-item-taiyo .tv-char-name {
  position: absolute;
  left: 28.64583%;
  top: 34.40476%;
  width: 16.79688%;
  z-index: 402;
}

.top-visual-sp .tv-char-item-taiyo .tv-char-description {
  position: absolute;
  left: 45.96354%;
  top: 15.2381%;
  width: 53.64583%;
  z-index: 502;
}

.top-visual-sp .tv-char-item-taiyo .tv-char-description img {
  width: 0%;
}

.top-visual-sp .tv-char-item-taiyo .tv-char-description img.pop-up {
  width: 100%;
  -webkit-animation: 0.5s ease 0s 1 alternate pop-up;
  -moz-animation: 0.5s ease 0s 1 alternate pop-up;
  -o-animation: 0.5s ease 0s 1 alternate pop-up;
  animation: 0.5s ease 0s 1 alternate pop-up;
}

.top-visual-sp .tv-char-item-taiyo .tv-char-description img.pop-close {
  width: 100%;
  -webkit-animation: 0.5s ease 0s 1 alternate pop-close;
  -moz-animation: 0.5s ease 0s 1 alternate pop-close;
  -o-animation: 0.5s ease 0s 1 alternate pop-close;
  animation: 0.5s ease 0s 1 alternate pop-close;
}

.top-visual-sp .tv-char-item-shisa .tv-char-image {
  position: absolute;
  left: 54.29688%;
  top: 67.38095%;
  width: 41.01563%;
  z-index: 303;
  -webkit-animation: 4s linear 0s infinite alternate shave;
  -moz-animation: 4s linear 0s infinite alternate shave;
  -o-animation: 4s linear 0s infinite alternate shave;
  animation: 4s linear 0s infinite alternate shave;
}

.top-visual-sp .tv-char-item-shisa .tv-char-name {
  position: absolute;
  left: 57.03125%;
  top: 94.64286%;
  width: 33.85417%;
  z-index: 403;
}

.top-visual-sp .tv-char-item-shisa .tv-char-description {
  position: absolute;
  left: 43.75%;
  top: 32.5%;
  width: 53.64583%;
  z-index: 503;
}

.top-visual-sp .tv-char-item-shisa .tv-char-description img {
  width: 0%;
}

.top-visual-sp .tv-char-item-shisa .tv-char-description img.pop-up {
  width: 100%;
  -webkit-animation: 0.5s ease 0s 1 alternate pop-up;
  -moz-animation: 0.5s ease 0s 1 alternate pop-up;
  -o-animation: 0.5s ease 0s 1 alternate pop-up;
  animation: 0.5s ease 0s 1 alternate pop-up;
}

.top-visual-sp .tv-char-item-shisa .tv-char-description img.pop-close {
  width: 100%;
  -webkit-animation: 0.5s ease 0s 1 alternate pop-close;
  -moz-animation: 0.5s ease 0s 1 alternate pop-close;
  -o-animation: 0.5s ease 0s 1 alternate pop-close;
  animation: 0.5s ease 0s 1 alternate pop-close;
}

.top-visual-pc {
  background: url(../img/top-visual/top_bg_pc.png) no-repeat;
  background-size: contain;
  position: relative;
  overflow: hidden;
  top: 0px;
  left: 0px;
  display: none;
  padding: 0;
}

@media (min-width: 768px) {
  .top-visual-pc {
    display: block;
    height: 505px;
  }
}

@media (min-width: 992px) {
  .top-visual-pc {
    height: 653.13333px;
  }
}

@media (min-width: 1200px) {
  .top-visual-pc {
    height: 787.8px;
  }
}

.top-visual-pc ul {
  list-style-type: none;
}

.top-visual-pc ul, .top-visual-pc li {
  margin: 0;
  padding: 0;
  width: 100%;
}

.top-visual-pc span {
  display: block;
}

.top-visual-pc .bg-line {
  height: 100%;
}

.top-visual-pc img {
  width: 100%;
  height: 100%;
  border: 0;
}

.top-visual-pc a {
  border: 0;
}

.top-visual-pc .tv-char-item-beear .tv-char-image {
  position: absolute;
  left: 11.33333%;
  top: 1.60891%;
  width: 27%;
  z-index: 201;
  -webkit-animation: 4s linear 0s infinite alternate shave;
  -moz-animation: 4s linear 0s infinite alternate shave;
  -o-animation: 4s linear 0s infinite alternate shave;
  animation: 4s linear 0s infinite alternate shave;
}

.top-visual-pc .tv-char-item-beear .tv-char-name {
  position: absolute;
  left: 21.83333%;
  top: 23.0198%;
  width: 7.08333%;
  z-index: 301;
}

.top-visual-pc .tv-char-item-beear .tv-char-description {
  position: absolute;
  left: 25.83333%;
  top: 11.01485%;
  width: 34.08333%;
  z-index: 401;
  display: none;
}

.top-visual-pc .tv-char-item-beear .tv-char-description img {
  width: 0%;
}

.top-visual-pc .tv-char-item-beear .tv-char-description img.pop-up {
  width: 100%;
  -webkit-animation: 0.5s ease 0s 1 alternate pop-up;
  -moz-animation: 0.5s ease 0s 1 alternate pop-up;
  -o-animation: 0.5s ease 0s 1 alternate pop-up;
  animation: 0.5s ease 0s 1 alternate pop-up;
}

.top-visual-pc .tv-char-item-taiyo .tv-char-image {
  position: absolute;
  left: 39.83333%;
  top: 1.73267%;
  width: 20.75%;
  z-index: 202;
  -webkit-animation: 4s linear 0s infinite alternate shave;
  -moz-animation: 4s linear 0s infinite alternate shave;
  -o-animation: 4s linear 0s infinite alternate shave;
  animation: 4s linear 0s infinite alternate shave;
}

.top-visual-pc .tv-char-item-taiyo .tv-char-name {
  position: absolute;
  left: 39.25%;
  top: 26.9802%;
  width: 9.25%;
  z-index: 302;
}

.top-visual-pc .tv-char-item-taiyo .tv-char-description {
  position: absolute;
  left: 52.25%;
  top: 11.26238%;
  width: 31.66667%;
  z-index: 402;
  display: none;
}

.top-visual-pc .tv-char-item-taiyo .tv-char-description img {
  width: 0%;
}

.top-visual-pc .tv-char-item-taiyo .tv-char-description img.pop-up {
  width: 100%;
  -webkit-animation: 0.5s ease 0s 1 alternate pop-up;
  -moz-animation: 0.5s ease 0s 1 alternate pop-up;
  -o-animation: 0.5s ease 0s 1 alternate pop-up;
  animation: 0.5s ease 0s 1 alternate pop-up;
}

.top-visual-pc .tv-char-item-shisa .tv-char-image {
  position: absolute;
  left: 61.58333%;
  top: 1.36139%;
  width: 22.08333%;
  z-index: 203;
  -webkit-animation: 4s linear 0s infinite alternate shave;
  -moz-animation: 4s linear 0s infinite alternate shave;
  -o-animation: 4s linear 0s infinite alternate shave;
  animation: 4s linear 0s infinite alternate shave;
}

.top-visual-pc .tv-char-item-shisa .tv-char-name {
  position: absolute;
  left: 64.66667%;
  top: 23.51485%;
  width: 16.25%;
  z-index: 303;
}

.top-visual-pc .tv-char-item-shisa .tv-char-description {
  position: absolute;
  left: 36.75%;
  top: 11.26238%;
  width: 31.66667%;
  z-index: 403;
  display: none;
}

.top-visual-pc .tv-char-item-shisa .tv-char-description img {
  width: 0%;
}

.top-visual-pc .tv-char-item-shisa .tv-char-description img.pop-up {
  width: 100%;
  -webkit-animation: 0.5s ease 0s 1 alternate pop-up;
  -moz-animation: 0.5s ease 0s 1 alternate pop-up;
  -o-animation: 0.5s ease 0s 1 alternate pop-up;
  animation: 0.5s ease 0s 1 alternate pop-up;
}

.top-visual-pc .tv-menu-access {
  position: absolute;
  left: 4.91667%;
  top: 60.89109%;
  width: 30.25%;
  z-index: 204;
  -webkit-animation: 1s linear 0s infinite alternate bump;
  -moz-animation: 1s linear 0s infinite alternate bump;
  -o-animation: 1s linear 0s infinite alternate bump;
  animation: 1s linear 0s infinite alternate bump;
}

.top-visual-pc .tv-menu-access:hover {
  -webkit-animation: 0.3s ease 0s 1 alternate shake-bump;
  -moz-animation: 0.3s ease 0s 1 alternate shake-bump;
  -o-animation: 0.3s ease 0s 1 alternate shake-bump;
  animation: 0.3s ease 0s 1 alternate shake-bump;
}

.top-visual-pc .tv-menu-information {
  position: absolute;
  left: 74.66667%;
  top: 32.5495%;
  width: 25.16667%;
  z-index: 205;
  -webkit-animation: 1s linear 0s infinite alternate bump;
  -moz-animation: 1s linear 0s infinite alternate bump;
  -o-animation: 1s linear 0s infinite alternate bump;
  animation: 1s linear 0s infinite alternate bump;
}

.top-visual-pc .tv-menu-information:hover {
  -webkit-animation: 0.3s ease 0s 1 alternate shake-bump;
  -moz-animation: 0.3s ease 0s 1 alternate shake-bump;
  -o-animation: 0.3s ease 0s 1 alternate shake-bump;
  animation: 0.3s ease 0s 1 alternate shake-bump;
}

.top-visual-pc .tv-menu-member {
  position: absolute;
  left: 15.66667%;
  top: 78.58911%;
  width: 19.33333%;
  z-index: 206;
  -webkit-animation: 1s linear 0s infinite alternate bump;
  -moz-animation: 1s linear 0s infinite alternate bump;
  -o-animation: 1s linear 0s infinite alternate bump;
  animation: 1s linear 0s infinite alternate bump;
}

.top-visual-pc .tv-menu-member:hover {
  -webkit-animation: 0.3s ease 0s 1 alternate shake-bump;
  -moz-animation: 0.3s ease 0s 1 alternate shake-bump;
  -o-animation: 0.3s ease 0s 1 alternate shake-bump;
  animation: 0.3s ease 0s 1 alternate shake-bump;
}

.top-visual-pc .tv-menu-movie {
  position: absolute;
  left: 61.91667%;
  top: 53.46535%;
  width: 38.91667%;
  z-index: 207;
  -webkit-animation: 1s linear 0s infinite alternate bump;
  -moz-animation: 1s linear 0s infinite alternate bump;
  -o-animation: 1s linear 0s infinite alternate bump;
  animation: 1s linear 0s infinite alternate bump;
}

.top-visual-pc .tv-menu-movie:hover {
  -webkit-animation: 0.3s ease 0s 1 alternate shake-bump;
  -moz-animation: 0.3s ease 0s 1 alternate shake-bump;
  -o-animation: 0.3s ease 0s 1 alternate shake-bump;
  animation: 0.3s ease 0s 1 alternate shake-bump;
}

.top-visual-pc .tv-menu-office {
  position: absolute;
  left: 66.41667%;
  top: 77.35149%;
  width: 17.08333%;
  z-index: 208;
  -webkit-animation: 1s linear 0s infinite alternate bump;
  -moz-animation: 1s linear 0s infinite alternate bump;
  -o-animation: 1s linear 0s infinite alternate bump;
  animation: 1s linear 0s infinite alternate bump;
}

.top-visual-pc .tv-menu-office:hover {
  -webkit-animation: 0.3s ease 0s 1 alternate shake-bump;
  -moz-animation: 0.3s ease 0s 1 alternate shake-bump;
  -o-animation: 0.3s ease 0s 1 alternate shake-bump;
  animation: 0.3s ease 0s 1 alternate shake-bump;
}

.top-visual-pc .tv-menu-profile {
  position: absolute;
  left: 35%;
  top: 58.5396%;
  width: 27.33333%;
  z-index: 209;
  -webkit-animation: 1s linear 0s infinite alternate bump;
  -moz-animation: 1s linear 0s infinite alternate bump;
  -o-animation: 1s linear 0s infinite alternate bump;
  animation: 1s linear 0s infinite alternate bump;
}

.top-visual-pc .tv-menu-profile:hover {
  -webkit-animation: 0.3s ease 0s 1 alternate shake-bump;
  -moz-animation: 0.3s ease 0s 1 alternate shake-bump;
  -o-animation: 0.3s ease 0s 1 alternate shake-bump;
  animation: 0.3s ease 0s 1 alternate shake-bump;
}

.top-visual-pc .tv-menu-shimbashi {
  position: absolute;
  left: 1.33333%;
  top: 34.40594%;
  width: 25.58333%;
  z-index: 210;
  -webkit-animation: 1s linear 0s infinite alternate bump;
  -moz-animation: 1s linear 0s infinite alternate bump;
  -o-animation: 1s linear 0s infinite alternate bump;
  animation: 1s linear 0s infinite alternate bump;
}

.top-visual-pc .tv-menu-shimbashi:hover {
  -webkit-animation: 0.3s ease 0s 1 alternate shake-bump;
  -moz-animation: 0.3s ease 0s 1 alternate shake-bump;
  -o-animation: 0.3s ease 0s 1 alternate shake-bump;
  animation: 0.3s ease 0s 1 alternate shake-bump;
}

.top-visual-pc .tv-facebook-tsuda {
  position: absolute;
  left: 33.83333%;
  top: 80.56931%;
  width: 6.41667%;
  z-index: 211;
  -webkit-animation: 1s linear 0s infinite alternate bump;
  -moz-animation: 1s linear 0s infinite alternate bump;
  -o-animation: 1s linear 0s infinite alternate bump;
  animation: 1s linear 0s infinite alternate bump;
}

.top-visual-pc .tv-facebook-tsuda:hover {
  -webkit-animation: 0.3s ease 0s 1 alternate shake-bump;
  -moz-animation: 0.3s ease 0s 1 alternate shake-bump;
  -o-animation: 0.3s ease 0s 1 alternate shake-bump;
  animation: 0.3s ease 0s 1 alternate shake-bump;
}

.top-visual-pc .tv-facebook-sato {
  position: absolute;
  left: 40.25%;
  top: 81.80693%;
  width: 5.75%;
  z-index: 212;
  -webkit-animation: 1s linear 0s infinite alternate bump;
  -moz-animation: 1s linear 0s infinite alternate bump;
  -o-animation: 1s linear 0s infinite alternate bump;
  animation: 1s linear 0s infinite alternate bump;
}

.top-visual-pc .tv-facebook-sato:hover {
  -webkit-animation: 0.3s ease 0s 1 alternate shake-bump;
  -moz-animation: 0.3s ease 0s 1 alternate shake-bump;
  -o-animation: 0.3s ease 0s 1 alternate shake-bump;
  animation: 0.3s ease 0s 1 alternate shake-bump;
}

.top-visual-bottom {
  width: 100%;
  min-height: 50%;
  padding: 8px;
  background-color: brown;
  color: white;
  text-align: center;
}

.shake {
  display: inline-block;
}

.shake:hover {
  -webkit-animation: 0.3s ease 0s 1 alternate shake-bump;
  -moz-animation: 0.3s ease 0s 1 alternate shake-bump;
  -o-animation: 0.3s ease 0s 1 alternate shake-bump;
  animation: 0.3s ease 0s 1 alternate shake-bump;
}

.shave {
  display: inline-block;
  margin: auto;
  -webkit-animation: 4s linear 0s infinite alternate shave;
  -moz-animation: 4s linear 0s infinite alternate shave;
  -o-animation: 4s linear 0s infinite alternate shave;
  animation: 4s linear 0s infinite alternate shave;
}

@keyframes shave {
  0% {
    transform: rotate(0deg);
  }
  25% {
    transform: rotate(-5deg);
  }
  75% {
    transform: rotate(5deg);
  }
  100% {
    transform: rotate(0deg);
  }
}

@keyframes bump {
  0% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.025);
  }
  100% {
    transform: scale(1);
  }
}

@keyframes moonsault {
  0% {
    transform: rotate(0deg);
  }
  50% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes pop-up {
  0% {
    transform: scale(0);
  }
  80% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(1);
  }
}

@keyframes pop-close {
  0% {
    transform: scale(1);
  }
  20% {
    transform: scale(1.1);
  }
  100% {
    transform: scale(0);
  }
}

@keyframes shake-bump {
  0% {
    transform: rotate(0deg);
  }
  12.5% {
    transform: rotate(-4deg);
  }
  25% {
    transform: rotate(4deg) scale(1.1);
  }
  37.5% {
    transform: rotate(-4deg);
  }
  50% {
    transform: rotate(4deg) scale(1.2);
  }
  62.5% {
    transform: rotate(-4deg);
  }
  75% {
    transform: rotate(4deg) scale(1.1);
  }
  87.5% {
    transform: rotate(-4deg);
  }
  100% {
    transform: rotate(0deg);
  }
}