@charset "utf-8";



.cursor-pointer {
  visibility: hidden;
  opacity: 0;
  position: fixed;
  z-index: 10;
  transform: scale(0);
  height: 160px;
  width: 160px;
  margin: -80px 0 0 -80px;
  transition: transform .3s,opacity .3s,visibility .3s;
  pointer-events: none;
}
.cursor-pointer.is-active {
  opacity: 1;
  visibility: visible;
  transform: scale(1);
}
.cursor-none {
  cursor: none;
}


/* テストページ用style */
.js-cursor-pointer01 {
  height: 100px;
  width: 100px;
  margin: -100px 0 0 -100px;
}
.js-cursor-pointer01 img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.js-cursor-pointer02 {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: #f1f1f1;
  box-shadow: 5px 5px 10px 0 rgba(0, 0, 0, 0.2);
}
.js-cursor-pointer02 svg {
  display: block;
  width: 60px;
}
.js-cursor-pointer03 {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background-color: #fff;
  border: 1px solid #ccc;
}
.js-cursor-elm03 {
  display: block;
}

/* body {
  margin: 0;
  padding: 50px 0;
  
}
h1 {
  margin-bottom: 80px;
  font-size: 36px;
}
img {
  height: auto;
  max-width: 100%;
  vertical-align: top;
}
ul {
  display: flex;
  justify-content: center;
  list-style: none;
  padding: 0 40px;
  margin: 0 0 100px;
}
ul + ul {
  margin-top: -50px;
}
li {
  margin: 0 50px;
}
.swiper {
  padding-bottom: 60px;
}
.swiper img {
  width: 100%;
} */

/**/


body{
  position: relative;
  cursor: none !important;  /*もともとあるカーソルは見えなくなるようにする*/
  height:100vh;
}

#cursor{
  position: fixed;

  /*丸の大きさと色の指定*/
  background: #00488B;
  border-radius:20px;
  width: 30px;
  height: 30px;
  margin: -20px 0 0 -20px;/*真ん中にくるようにマイナスマージンで調整*/

  z-index: 2;/*一番手前に来るように*/
  pointer-events: none;/*クリックできなくなるのを防ぐため。noneで対応*/
  opacity: 0;
}
/*ちょっと遅れてついてくるストーカー要素*/
#stalker{
  position: fixed;

  /*丸の大きさと色の指定*/
  background: #58a4ea70;
  width: 60px;
  height: 60px;
  border-radius:30px;
  margin: -30px 0 0 -30px;/*真ん中にくるようにマイナスマージンで調整*/
  z-index: 1;/*カーソルの後ろに来るように*/
  pointer-events: none;/*クリックできなくなるのを防ぐため。noneで対応*/
  opacity: 0;
}

#stalker.active{
  transform: scale(1.8);
}

#stalker.hidden,
#cursor.hidden {
  display: none;
}

#stalker.active::before{
  /* content: url(../images/Play.svg);
  transform: scale(0.7);
  display: inline-block;
  vertical-align: middle; */
  color: #fff;
  text-align: center;
  transition: content 0.5s 1s ease-in-out;
}


.IVArea_inner a:hover {
  cursor: none;
  z-index: 100;
}

@media screen and (max-width: 676px){
  body{
    cursor : auto !important;  /*もともとあるカーソルは見えなくなるようにする*/
  }
  #stalker, #cursor{
  display: none;
}
}
