@charset "utf-8";
.subMenuEffect01 li ul{ transition: all .5s ease; }
.subMenuEffect02 li ul li{ overflow: hidden;height: 0;transition: .3s; }
.subMenuEffect02 li:hover ul li{ overflow: visible;height: 34px; }
.subMenuEffect03 li ul{ opacity: 0;top: 50%;visibility: hidden;transition: .5s; }
.subMenuEffect03 li:hover ul{ top: 100%;visibility: visible;opacity: 1; }
.subMenuEffect04 li ul li{ overflow: hidden;width: 0px;height: 0;transition: .3s; }
.subMenuEffect04 li:hover ul li{ overflow: visible;width: 100%;height: 34px; }
.subMenuEffect04 li:hover ul li a{ white-space: nowrap; }
.subMenuEffect05 > li{ perspective: 400px; }
.subMenuEffect05 li ul{ visibility: hidden;transform: rotateX(-90deg);transform-origin: 50% 0;transition: .3s; }
.subMenuEffect05 li:hover ul{ visibility: visible;transform: rotateX(0); }
.subMenuEffect06 li ul { visibility: hidden;perspective: 400px; }
.subMenuEffect06 li:hover ul{ visibility: visible; }
.subMenuEffect06 ul li{ transform: rotateY(90deg);transform-origin: 50% 0;transition: .3s; }
.subMenuEffect06 li:hover li{ transform: rotateY(0); }
.subMenuEffect06 ul li:nth-child(2) { transition-delay: .1s; }
.subMenuEffect06 ul li:nth-child(3) { transition-delay: .2s; }
.subMenuEffect06 ul li:nth-child(4) { transition-delay: .3s; }
.subMenuEffect06 ul li:nth-child(5) { transition-delay: .4s; }
.subMenuEffect06 ul li:nth-child(6) { transition-delay: .5s; }
.subMenuEffect06 ul li:nth-child(7) { transition-delay: .6s; }
.subMenuEffect06 ul li:nth-child(8) { transition-delay: .7s; }
.subMenuEffect06 ul li:nth-child(9) { transition-delay: .8s; }
.subMenuEffect06 ul li:nth-child(10) { transition-delay: .9s; }
.btnEffect01 { border:solid 2px #101649;background-color: #FFF;color: #101649;background-size: 200% 100%;background-image: -webkit-linear-gradient(left, transparent 50%, rgba(16, 23, 73, 1) 50%);background-image: linear-gradient(to right, transparent 50%, rgba(16, 23, 73, 1) 50%);-webkit-transition: background-position .3s cubic-bezier(0.19, 1, 0.22, 1) .1s, color .5s ease 0s, background-color .5s ease;transition: background-position .3s cubic-bezier(0.19, 1, 0.22, 1) .1s, color .5s ease 0s, background-color .5s ease; }
.btnEffect01:hover { background-color: #101649;color: #FFF;background-position: -100% 100%; }
.btnEffect02 { position: relative;color: #fff !important; }
.btnEffect02:after { background: #fff;content: "";height: 155px;left: -71px;opacity: .2;position: absolute;top: -63px;-webkit-transform: rotate(41deg);transform: rotate(41deg);-webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);width: 50px;z-index: 1; }
.btnEffect02:hover:after { left: 120%;-webkit-transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1);transition: all 350ms cubic-bezier(0.19, 1, 0.22, 1); }
.btnEffect03:hover { animation: hoverShake 0.15s linear 3;opacity: 0.8; }
@keyframes hoverShake { 0% { transform: skew(0deg,0deg); } 25% { transform: skew(1deg, 1deg); } 75% { transform: skew(-1deg, -1deg); } 100% { transform: skew(0deg,0deg); } }
.btnEffect04{ border:none;position:relative;cursor:pointer;transition:800ms ease all;outline:none; }
.btnEffect04:hover{ background:#fff;color:#101649; }
.btnEffect04:before,.btnEffect04:after{ content:'';position:absolute;top:0;right:0;height:2px;width:0;background: #101649;transition:400ms ease all; }
.btnEffect04:after{ right:inherit;top:inherit;left:0;bottom:0; }
.btnEffect04:hover:before,.btnEffect04:hover:after{ width:100%;transition:800ms ease all; }
.effect01{ transition: all 0.3s ease 0s; }
.effect01:hover { opacity: 0.6; }
.effect02{ transition: all 0.6s ease 0s; }
.effect02:hover { transform: scale(1.1, 1.1); }
.effect03 { -webkit-transition: all 0.5s ease;transition: all 0.5s ease; }
.effect03:hover { -webkit-transform: rotate(360deg);transform: rotate(360deg);border-radius: 10%; }
.effect04 { -webkit-transition: all 1s ease;transition: all 1s ease;-webkit-filter: grayscale(100%);filter: grayscale(100%); }
.effect04:hover { -webkit-filter: grayscale(0%);filter: grayscale(0%); }
.effect05{ -webkit-transition: all 1s ease;transition: all 1s ease;-webkit-filter: blur(20px);filter: blunnnnnnnr(20px); }
.effect05:hover { -webkit-filter: blur(0px);filter: blur(0px); }
.effect06{ transform:rotate(0) scale(1);-webkit-transform:rotate(0) scale(1); }
.effect06:hover{ transition:all 0.6s ease;transform:rotate(45deg) scale(1.5);-webkit-transform:rotate(45deg) scale(1.5); }
.effect07:hover{ animation: fuwafuwa 4s infinite; }
@keyframes fuwafuwa { 0% { transform:translateY(0px);  } 50% { transform:translateY(20px);  } 100% { transform:translateY(  0px);  } }
.effect08:hover{ display: inline-block;animation: hurueru .1s  infinite; }
@keyframes hurueru { 0% { transform: translate(0px, 0px) rotateZ(0deg) } 25% { transform: translate(2px, 2px) rotateZ(1deg) } 50% { transform: translate(0px, 2px) rotateZ(0deg) } 75% { transform: translate(2px, 0px) rotateZ(-1deg) } 100% { transform: translate(0px, 0px) rotateZ(0deg) } }
.textdisplay{ position: relative;overflow: hidden; }
.hovermask{ position: absolute;top: 0;right: 0;left: 0;bottom: 0;background: rgba(0,0,0,0.5);opacity: 0;color: #fff;padding: 30px;display:-webkit-box;display:-moz-box;display:-webkit-flexbox;display:-moz-flexbox;display:-ms-flexbox;display:-webkit-flex;display:-moz-flex;display:flex;-webkit-align-items: center;-ms-flex-align: center;align-items: center;text-align: center;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;-o-box-sizing: border-box;-ms-box-sizing: border-box;box-sizing: border-box; }
.textdisplay:hover .tdeffect01{ opacity: 1; }
.textdisplay:hover .tdeffect02{ opacity: 1;transition:all 0.6s ease; } 
.tdeffect03{ padding-bottom: 0; }
.textdisplay:hover .tdeffect03{ opacity: 1;transition: all 0.6s ease;padding-bottom: 30px; } 
.tdeffect04{ left: -100%; }
.textdisplay:hover .tdeffect04{ opacity: 1;transition:all 0.6s ease;left: 0;width: 100%; } 
.tdeffect05{ transform: rotate(90deg) scale(3); }
.textdisplay:hover .tdeffect05{ opacity: 1;transition:all 0.6s ease;transform: rotate(360deg) scale(1); }