@charset "UTF-8";
:root{
  --mainColor:#6298c1;
  --subColor:;
  --shadow:0 4px 8px 0 rgba(74,85,99,.2);
  --GRY:#757575;
  --GRN:#00892E;
  --RED:#D8000C;
  --BLU:#1077CF;
  --mainAnime:all .3s ease;
}
@font-face {font-family:'icomoon';src:url('../fonts/icomoon.eot?9nl3w');src:url('../fonts/icomoon.eot?9nl3w#iefix') format('embedded-opentype'),url('../fonts/icomoon.ttf?9nl3w') format('truetype'),url('../fonts/icomoon.woff?9nl3w') format('woff'),url('../fonts/icomoon.svg?9nl3w#icomoon') format('svg');font-weight:normal;font-style:normal;font-display:block}

[class^="icon-"]::after,[class*=" icon-"]::after,
[class^="icon-"]::before,[class*=" icon-"]::before{
  font-family:'icomoon' !important;speak:never;font-style:normal;font-weight:normal;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
.icon-mail::after{content:"\e900"}
.icon-plus::after{content:"\e901"}
.icon-minus::after{content:"\e911"}
.icon-search-l::after{content:"\e902"}
.icon-blank::after{content:"\e903"}
.icon-arrow-t::after{content:"\e908"}
.icon-arrow-b::after{content:"\e909"}
.icon-arrow-l::after{content:"\e90a"}
.icon-arrow-r::after{content:"\e90b"}
.icon-pdf::after{content:"\e90c"}
.icon-img::after{content:"\e90d"}
.icon-text::after{content:"\e90e"}
.icon-excel::after{content:"\e90f"}
.icon-word::after{content:"\e910"}
.icon-x::after{content:"\e912"}
.icon-fb::after{content:"\e904"}
.icon-instagram::after{content:"\ea92"}

img{border-style:none;border:0;vertical-align:middle;max-width:100%;height:auto}
.fontS{font-size:.87em !important}
.fontM{font-size:1.25em !important}
.fontL{font-size:1.5em !important}
.fontLL{font-size:2em !important}
.txtL{text-align:left}
.txtR{text-align:right}
.txtC{text-align:center}
.txt-muted{color:#b5b5b5}
.txt-success{color:#4F8A10}
.txt-error,.txt-imp{color:#D8000C}
.txt-point{color:#028425}
.skip, a.skip{text-align:center;background-color:#FFF}
.skip{width:1px;color:#000;font-size:.1%;line-height:.1;position:absolute;left:-3000px;z-index:700}
a.skip{padding:2px 0;top:auto}
a.skip:active, a.skip:focus{position:relative;display:block;width:99.99%;left:auto;background:#333;opacity:1;color:#FFF;font-size:100%;line-height:1.6;}
table ul,table ol,dl ul,dl ol{margin-bottom:0}
ul ul,ul ol,ol ul,ol ol{padding-left:20px;margin-bottom:0}
ul.kome{list-style:none;padding-left:1em;font-size:.87em}
p + ul.kome{margin-top:-1em}
table + ul.kome{margin-top:-.5em}
ul.kome li::before{display:inline-block;width:1.5em;content:'※';margin-left:-1.5em;text-align:center}
table{margin:0 0 1em;border-spacing:0;border-collapse:collapse;}
th{min-width:20%;border-bottom:1px solid rgba(255,255,255,.5);;padding:.3em .5em}
td{border-bottom:1px solid rgba(255,255,255,.5);;padding:.3em .5em}
p{margin-bottom:1em}
body a{color:#FF766C;text-decoration:underline;}
body a:hover{color:var(--mainColor);text-decoration:none;}
a:hover img{opacity:.6;}
strong{font-weight:900!important;}
.fLeft{float:left}
.fRight{float:right}
.pt0{padding-top:0 !important}
.pt5{padding-top:5px !important}
.pt10{padding-top:10px !important}
.pt1em{padding-top:1em !important}
.pb0{padding-bottom:0 !important}
.pb5{padding-bottom:5px !important}
.pb10{padding-bottom:10px !important}
.pb1em{padding-bottom:1em !important}
.pr0{padding-right:0 !important}
.pr5{padding-right:5px !important}
.pr10{padding-right:10px !important}
.pr1em{padding-right:1em !important}
.pl0{padding-left:0 !important}
.pl5{padding-left:5px !important}
.pl10{padding-left:10px !important}
.pl1em{padding-left:1em !important}
.mb0{margin-bottom:0 !important}
.mb5{margin-bottom:5px !important}
.mb10{margin-bottom:10px !important}
.mb1em{margin-bottom:1em !important}
.mb2em{margin-bottom:2em !important}
.mt0{margin-top:0 !important}
.mt5{margin-top:5px !important}
.mt10{margin-top:10px !important}
.mt1em{margin-top:1em !important}
.mt2em{margin-top:2em !important}
.ml0{margin-left:0 !important}
.ml5{margin-left:5px !important}
.ml10{margin-left:10px !important}
.ml1em{margin-left:1em !important}
.ml2em{margin-left:2em !important}
.ml-0_5em{margin-left:-.5em !important}
.ml-1em{margin-left:-1em !important}
.ml-2em{margin-left:-2em !important}
.mr0{margin-right:0 !important}
.mr5{margin-right:5px !important}
.mr10{margin-right:10px !important}
.mr1em{margin-right:1em !important}
.mr2em{margin-right:2em !important}
.mr-1em{margin-right:-1em !important}
.mr-2em{margin-right:-2em !important}
.width1em{display:inline-block;width:1em}
.width2em{display:inline-block;width:2em}
.width3em{display:inline-block;width:3em}
.width4em{display:inline-block;width:4em}
.width5em{display:inline-block;width:5em}
.width6em{display:inline-block;width:6em}
.width7em{display:inline-block;width:7em}
.width8em{display:inline-block;width:8em}
.width9em{display:inline-block;width:9em}
.width10em{display:inline-block;width:10em}
.colGroup{
	position:relative;
	display:flex;
	flex-wrap:wrap;
  margin-right:-5px;
  margin-left:-5px;
}
ul.colGroup,ol.colGroup{
  padding-left:0
}
[class^="col-"]{
	position:relative;
	min-height:1px;
	overflow:hidden;
  padding-right:5px;
  padding-left:5px
}
.col-sp1{width:8.33333%}
.col-sp2{width:16.66667%}
.col-sp3{width:25%}
.col-sp4{width:33.33333%}
.col-sp5{width:41.66667%}
.col-sp6{width:50%}
.col-sp7{width:58.33333%}
.col-sp8{width:66.66667%}
.col-sp9{width:75%}
.col-sp10{width:83.33333%}
.col-sp11{width:91.66667%}
.col-sp12{width:100%}
.btn{
  margin:0 auto 1em;
  text-align:center
}
.btn a{
  position:relative;
  display:inline-block;
  width:80%;
  max-width:20em;
  padding:8px 1em;
  border-radius:4px;
  background:#FFFF00;
  box-shadow:0 6px #b1cc60;
  transition:none;
  text-decoration:none;
  color:var(--mainColor);
  font-weight:bold;
}
.btn a:hover{
  top:6px;
  box-shadow:0 0 #b1cc60;
  color:var(--mainColor);
}
@media screen and (max-width:767px){
  .hiddenSP,.forTB,.forPC{display:none}
	.tableBlock{
		border-top:1px #FFF solid;
		border-bottom:none
	}
	.tableBlock th,.tableBlock td{
		display:block;
		width:100%;
		border:none;
	}
	.tableBlock th{
    border-bottom:1px dotted rgba(255,255,255,.5);
		text-align:left;
	}
  .tableBlock td{
    border-bottom:1px solid #FFF;
  }
	.tableScroll{
		overflow:auto;
		margin-bottom:1em;
	}
	.tableScroll table{
		width:auto;
		min-width:500px;
		margin-bottom:10px;
		white-space:nowrap;
	}
	.tableScroll::-webkit-scrollbar{
		-webkit-appearance:none;
		width:5px;
	}
	.tableScroll::-webkit-scrollbar-thumb{
		border-radius:4px;
		background-color:rgba(0,0,0,.3);
		box-shadow:0 0 1px rgba(255,255,255,.5);
	}
}
@media screen and (min-width:768px) and (max-width:1159px){
  .hiddenTB,.forPC,.forSP{display:none}
}
@media screen and (min-width:768px){
	td, th{padding:.5em 1em;}
  .colGroup{margin-right:-8px;margin-left:-8px}
  [class^="col-"]{padding-right:8px;padding-left:8px}
  .col-tb1{width:8.33333%}
  .col-tb2{width:16.66667%}
  .col-tb3{width:25%}
  .col-tb4{width:33.33333%}
  .col-tb5{width:41.66667%}
  .col-tb6{width:50%}
  .col-tb7{width:58.33333%}
  .col-tb8{width:66.66667%}
  .col-tb9{width:75%}
  .col-tb10{width:83.33333%}
  .col-tb11{width:91.66667%}
  .col-tb12{width:100%}
}
@media screen and (min-width:1160px){
  .hiddenPC,.forTB,.forSP{display:none}
  .colGroup{margin-right:-20px;margin-left:-20px}
  [class^="col-"]{padding-right:20px;padding-left:20px}
  .col-pc1{width:8.33333%}
  .col-pc2{width:16.66667%}
  .col-pc3{width:25%}
  .col-pc4{width:33.33333%}
  .col-pc5{width:41.66667%}
  .col-pc6{width:50%}
  .col-pc7{width:58.33333%}
  .col-pc8{width:66.66667%}
  .col-pc9{width:75%}
  .col-pc10{width:83.33333%}
  .col-pc11{width:91.66667%}
  .col-pc12{width:100%}
}

/*________________________________________*/
#imaid * {
  font-family:inherit;
  font-weight:500;
  font-style:normal;
}
#imaid{
  background-color:var(--mainColor);
  font-size:16px;
  line-height:1.6;
  font-family:'Hiragino Kaku Gothic Pro','ヒラギノ角ゴ Pro W3','メイリオ',Meiryo,sans-serif;
  color:#FFF;
}
#load{
  position:fixed;
  top:0;bottom:0;right:0;left:0;
  z-index:9999;
  width:100%;
  height:100%;
  background-color:var(--mainColor);
  text-align:center;
}
#load_logo {
  position:absolute;
  top:50%;left:50%;
  transform:translate(-50%, -50%);
  width:80%;
}
#load_logo #svgmask{
  max-width:580px;
}
#imaid #wrap{
  overflow:hidden;
}
#imaid header{
  position:relative;
  z-index:2;
}
.headLogo{
  position:relative;
  max-width:500px;
  margin:0 auto;
}
.headMV{
  position:relative;
  height:calc(100vh - ((100vw * 270) / 680));
}
.headMV h1{
  width:100%;
  height:100%;
}
.headMV h1 img{
  width:100%;
  height:100%;
  object-fit: cover;
  object-position:70% 100%
}
#onair{
  position:absolute;
  bottom:-1vw;right:-10px;
  z-index:2;
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:center;
  width:45vw;
  max-width:220px;
  height:38.78vw;
  max-height:164px;
  background:#FFF;
  animation:fluidrotate 30s ease 0s infinite;
  padding:16px;
}
.headBnr{
  position:relative;
  z-index:5;
}
/* #areaIG{
  padding:0 5vw 5vw;
  margin-top:-4vw;
  width:100%;
  background:#FF766C;
} */
nav li{
  text-align:center;
  font-family:"Hina Mincho", serif !important;
  color:#FFF
}
nav li a{
  position:relative;
  display:inline-block;
  padding:.3em .5em;
  color:#FFF;
  text-decoration:none;
}
.block .inner{
  width:90%;
  max-width:650px;
  margin:0 auto;
  padding:8vw 0;
}
.block h2{
  margin-bottom:18px;
  font-family:"Hina Mincho", serif !important;
  font-size:min(9vw,2.2em);
  text-align:center;
  letter-spacing:3px;
}
.block h3{
  margin-bottom:.2em;
  line-height:1.5;
  font-size:min(5vw,1.2em);
  font-family:"Hina Mincho", serif !important;
  font-weight:900!important;
  font-style:normal!important;
}
.block.bg01 h3{
  color:var(--mainColor);
}
.block.bg02 h3{
  color:#FFF;
}
.bg01{
  position:relative;
  background-color:#F4F8FB;
  color:var(--mainColor);
}
.bg01::after{
  content:"";
  display:block;
  position:absolute;
  top:-7px;left:0;
  width:100%;
  height:7px;
  background:url(../img/borderWHT.png) repeat-x 50% 50%;
}
.bg02{
  position:relative;
  background-color:var(--mainColor);
}
.bg02::after{
  content:"";
  display:block;
  position:absolute;
  top:-7px;left:0;
  width:100%;
  height:7px;
  background:url(../img/borderBLU.png) repeat-x 50% 50%;
}
#about{
  position:relative;
  overflow:hidden;
  padding-top:5vw;
  font-size:min(3.9vw,1em);
  text-align:center;
}
.aboutBgWrap{
  position:absolute;
  z-index:-1;
  top:-20px;right:-20px;left:-20px;bottom:-20px;
  overflow:hidden;
}
.aboutBg{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translateX(-50%) translateY(-50%);
  min-width: 100%;
  min-height: 100%;
  filter:blur(3px);
  opacity:.8;
}
#about .inner{
  position:relative;
  z-index:1;
}
#story{
  margin:8vw 0 3vw;
  background-color:#F4F8FB;
  border-radius:16px;
  /* border-radius:24px; */
  overflow:hidden;
  color:var(--mainColor);
}
.storyArea{
  position:relative;
  width:100%;
  overflow:hidden;
}
.storyBox{
  position:absolute;
  top:0;left:0;
  z-index:-1;
  opacity:0;
  width:100%;
}
.storyBox:first-child{
  position:relative;
}
.storyBox.tabActive{
  z-index:1;
  animation:fadeInAnime 2s forwards;
}
.stoImg.slick-dotted.slick-slider{
  margin-bottom:0;
}
.stoTxt{
  padding:5vw 5vw calc(5vw - 16px);
  text-align:left;
}
.stoTxt h3{
  font-family:"Hina Mincho", serif !important;
  font-weight:900!important;
  font-size:1.4em;
  color:var(--mainColor);
}
.storyTab{
  border-top:1px dashed var(--mainColor);
  display:flex;
  cursor: pointer;
  padding:2vw 0;
  margin:0 5vw;
}
.storyTab li{
  width:25%;
}
.storyTab li span{
  display:block;
  width:6em;
  margin:0 auto;
  padding:.8em .5em;
  text-align:center;
}
.storyTab li.tabActive span{
  background-color:var(--mainColor);
  color:#FFF;
  animation:fluidrotate 10s ease 0s infinite;
}
.castList{
  margin-bottom:24px;
  text-align:center;
  line-height:2;
}
.castBox{
  margin-bottom:24px;
  border-bottom:1px dashed var(--mainColor);
}
.castBox dt{
  width:100%;
  text-align:center;
}
.castBox dt img{
  width:60vw;
  max-width:180px;
  object-fit:cover;
  animation:squarerotate 30s ease 0s infinite;
}
.castBox.cast10 dt img{
  width:100vw;
  max-width:280px;
}
.castBox dd{
  max-width:18em;
  margin:0 auto;
}
.castBox dd h3{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:center;
  min-height:50px;
  padding:.5rem 16px;
  margin:-3rem auto 10px;
  background:var(--mainColor);
  font-size:1.6em;
  text-align:center;
  font-weight:500 !important;
  color:#FFF !important;
}
.castBox.cast10 h3:not(:first-child){
  margin-top:0;
}
.castBox dd h3 span{
  font-size:.7em;
}
.castBox dd h3:before,.castBox dd h3:after {
  content:'';
  position:absolute;
  top:0;
  width:0;
  height:0;
  z-index:1;
}
.castBox dd h3:before {
  left:0;
  border-width:25px 0px 25px 15px;
  border-color:transparent transparent transparent #F4F8FB;
  border-style:solid;
}
.castBox dd h3:after {
  right:0;
  border-width:25px 15px 25px 0px;
  border-color:transparent #F4F8FB transparent transparent;
  border-style:solid;
}
#event h3 {
  position:relative;
  text-align:center;
  width:90%;
  max-width:36em;
  margin:0 auto 1.5em;
  font-size:1em;
}
#event h3::before,#event h3::after{
  content:'';
  position:absolute;
  width:0;
  bottom:-10px;
  border:25px solid #e0ea27;
}
#event h3:before {
  left:-30px;
  border-left-color:transparent;
}
#event h3:after {
  right:-30px;
  border-right-color:transparent;
}
#event h3 span {
  display:block;
  position:relative;
  z-index:2;
  margin:0;
  padding:.3em 1em;
  background:#FFFF00;
  color:var(--mainColor);
  font-weight:bold;
}
#event h3 span:before,#event h3 span:after{
  position:absolute;
  content:'';
  top:100%;
  border:none;
  border-bottom:solid 10px transparent;
}
#event h3 span:before {
  left:0;
  border-right:solid 20px #c0d64d;
}
#event h3 span:after {
  right:0;
  border-left:solid 20px #c0d64d;
}
#event .txt-imp{color:#FFFF00;}

.movieBox{
  position: relative;
  width:100%;
  padding-top: 56.25%;
  margin-bottom:16px;
}
.movieBox iframe{
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
  border:1px solid #ccc
}
#movie .tver{
  margin:4vw auto 0;
  padding:6vw 6vw calc(6vw - 16px);
  background-color:rgba(98,152,193,.18);
  text-align:center;
  animation: squarerotateBig 30s ease 0s infinite;
}
#movie .tver h3{
  margin:16px 0 .5em;
}
#movie .tver h3 span{
  display:inline-block;
  padding:0 .5em;
  background:linear-gradient(transparent 50%, #FFFF4D 50%);
  font-family:"Hina Mincho", serif !important;
  font-weight:900!important;
}
#imaid footer{
  background:#FFF;
  height:auto;
  padding:4vw 5vw;
  margin:0 auto;
  text-align:center;
}
.footLogo{
  display:flex;
  flex-wrap:wrap;
  justify-content:center;
  align-items:center;
  margin:0 -5vw 4vw;
  padding:0;
  color:var(--mainColor);
  font-size:.75em;
}
.footLogo li{
  width:50%;
  padding:0 5vw;
  text-align:center;
}
#imaid .copyright{
  margin:0;
  padding:0;
  color:var(--mainColor);
  font-size:min(3.4vw,.75em);
}
#imaid footer::after{
  display:none;
}

/*SP only*/
@media screen and (max-width:767px){
  body.activeNav{
    overflow:hidden;
  }
  #gNav{
    display:none;
  }
  #spNav{
    position:relative;
  }
  .activeNav #spNav{
    display:block;
    position:fixed;
    top:0;bottom:0;left:0;right:0;
    z-index:99999;
    width:100%;
    background-color:var(--mainColor);
    opacity:1;
    animation:fadeInAnime 1s forwards;
    transition:all .4s;
  }
  #navToggle{
    position:fixed;
    top:10px;right:10px;
    z-index:999;
    display:block;
    width:44px;
    height:44px;
    padding:0 7px;
  }
  #navToggle span{
    display:inline-block;
    position:absolute;
    left:7;
    width:calc(100% - 14px);
    height:4px;
    border-radius:4px;
    background-color:#FFF;
    transition:all .4s;
  }
  #navToggle span:nth-of-type(1){
    top:10px;
  }
  #navToggle span:nth-of-type(2){
    top:20px;
  }
  #navToggle span:nth-of-type(3){
    bottom:10px;
  }
  .activeNav #navToggle span:nth-of-type(1){
    transform:translateY(20px) rotate(-45deg);
    top:0;
  }
  .activeNav #navToggle span:nth-of-type(2){
    opacity:0;
  }
  .activeNav #navToggle span:nth-of-type(3){
    transform:translateY(-20px) rotate(45deg);
    bottom:0;
  }
  #spNav ul{
    display:none;
    opacity:0;
    animation:fadeInAnime 1s forwards .6s;
  }
  .activeNav #spNav ul{
    display:flex;
    flex-wrap:wrap;
    align-content:center;
    justify-content:center;
    width:100%;
    height:100%;
  }
  #spNav li{
    width:100%;
    margin:5px auto;
  }
  #spNav li a{
    display:inline-block;
    padding:.3em .5em;
    color:#FFF;
    text-decoration:none;
  }
  .activeNav #spNav li a{
    font-size:1.5em;
  }
}
/*TB over*/
@media screen and (min-width:768px/*1056px*/){
  #imaid header{
    display:flex;
    flex-wrap:wrap;
    align-items:center;
    justify-content:center;
  }
  .headLogo{
    width:500px;
  }
  .headMV{
    height:calc(100vh - ((500px * 270) / 680));
  }
  #spNav{
    display:none;
  }
  #onair{
    bottom:-5px;right:-24px;
  }
  /* #areaIG{
    display:flex;
    flex-wrap:wrap;
    justify-content:center;
    align-items:center;
    padding:0 16px 16px;
    margin-top:-16px;
  } */
  #gNav{
    width:calc(100% - 500px);
  }
  #gNav li a{
    font-size:1.3em;
    text-shadow:0 0 10px var(--mainColor),0 0 8px var(--mainColor),0 0 6px var(--mainColor),0 0 2px var(--mainColor);
  }
  #gNav li a::before {
    content:'';
    position:absolute;
    left:0;bottom:0;
    width:100%;
    height:2px;
    background:rgba(255,255,255,.5);
    margin:auto;
    transform-origin:right top;
    transform:scale(0, 1);
    transition:transform .3s;
  }
  #gNav li a:hover::before {
    transform-origin:left top;
    transform:scale(1, 1);
  }
  .block .inner{
    padding:48px 0 56px;
  }
  .movieBox{
    margin-bottom:24px;
  }
  #about{
    padding-top:32px;
  }
  #story{
    margin:40px 0 0;
  }
  .stoTxt{
    padding:24px 24px 8px;
  }
  .storyTab{
    padding:8px 0;
    margin:0 24px;
  }
  .castList{
    margin-bottom:48px;
  }
  .castBox{
    display:flex;
    flex-wrap:wrap;
    max-width:650px;
    margin:0 auto 24px;
  }
  .castBox dt{
    width:calc(180px + 40px);
    margin-bottom:24px;
  }
  .castBox.cast10 dt{
    width:calc(260px + 40px);
    text-align:left;
  }
  .castBox dd h3{
    margin-top:0;
  }
  .castBox dt img{
  }
  .castBox dd{
    width:calc(100% - 180px - 40px);
    max-width:23em
  }
  .castBox.cast10 dd{
    width:calc(100% - 260px - 40px);
  }
  #event{
    text-align:center;
  }
  #event table{
    margin:0 auto 1em;
    text-align:left;
  }
  #movie .tver{
    margin-top:56px;
    padding:32px 32px 16px;
  }
  #movie .tver h3 span{
    font-size:110%;
  }
  #imaid footer{
    padding:16px 24px;
  }
  .footLogo{
    padding:0;
    margin:0 -10px 10px;
  }
  .footLogo li{
    width:33.333333%;
    max-width:208px;
    padding:0 10px;
  }
  #imaid .copyright{
    margin:0 10px 5px;
  }
}
@media screen and (min-width:1160px){
  .headLogo{
    position:fixed;
    top:0;left:0;right:0;bottom:0;
    margin:0;
  }
  #gNav{
    position:fixed;
    top:24px;right:24px;
    z-index:999;
    text-align:right;
  }
  #gNav li{
    display:inline-block;
  }
  #gNav li a{
    font-size:1.6rem;
  }
  main{
    width:calc(100% - 500px);
    margin-left:500px;
    /* width:calc(100% - ((100vh * 1280) / 1778));
    margin-left:calc((100vh * 1280) / 1778); */
  }
  .bg01 .inner,.bg02 .inner{
    padding:56px 0;
  }
  #imaid footer{
    width:calc(100% - 500px);
    margin-left:500px;
  }
  .castBox dd h3{
    font-size:min(2vw,1.6em);
  }
}
#attention{
  position:relative;
  z-index:9999;
}
#attention .inner{
  padding:4vw 0 calc(4vw - .9em);
}
#attention.block h3{
  margin-bottom:3vw;
  font-size: min(4.9vw, 1.2em);
}
/*TB over*/
@media screen and (min-width:768px/*1056px*/){
  #attention .inner{
    padding:24px 0 16px;
    text-align:center;
  }
  #attention.block h3{
    margin-bottom:16px;
  }
}
@keyframes fadeInAnime{
  0%{opacity:0;}
  100%{opacity:1;}
}
@keyframes fluidrotate{
  0%, 100%{border-radius:63% 37% 54% 46%/55% 48% 52% 45%;}
  14%{border-radius:40% 60% 54% 46%/49% 60% 40% 51%;}
  28%{border-radius:54% 46% 38% 62%/49% 70% 30% 51%;}
  42%{border-radius:61% 39% 55% 45%/61% 38% 62% 39%;}
  56%{border-radius:61% 39% 67% 33%/70% 50% 50% 30%;}
  70%{border-radius:50% 50% 34% 66%/56% 68% 32% 44%;}
  84%{border-radius:46% 54% 50% 50%/35% 61% 39% 65%;}
}

@keyframes squarerotate{
  0%,100%{border-radius:39% 14% / 16% 31%;}
  14%{border-radius:18% 32% / 35% 16%}
  28%{border-radius:32% 10% / 12% 32%}
  42%{border-radius:16% 32% / 42% 12%}
  56%{border-radius:33% 13% / 15% 41%}
  70%{border-radius:12% 37% / 38% 14%}
  84%{border-radius:30% 14% / 13% 34%}
}

@keyframes squarerotateBig{
  0%,100%{border-radius:9% 14% / 16% 1%;}
  14%{border-radius:18% 2% / 5% 16%}
  28%{border-radius:2% 10% / 12% 3%}
  42%{border-radius:16% 2% / 12% 12%}
  56%{border-radius:3% 13% / 15% 11%}
  70%{border-radius:12% 7% / 8% 14%}
  84%{border-radius:1% 14% / 13% 4%}
}