<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">@charset "utf-8";
/* CSS Document */


@keyframes fishR {
0% {
opacity: 0;
transform: translateX(0px);
}
10% {
opacity: 1;
}
40% {
opacity: 1;
}
50% {
opacity: 0;
}
60% {
opacity: 0;
}
70% {
opacity: 1;
}
90% {
opacity: 1;
}
100% {
opacity: 0;
transform: translateX(800px);
}

}


@keyframes fishRTail {
0% {
transform: rotateY(-40deg);
}
100% {
transform: rotateY(40deg);
}
}


.fishR{
opacity: 0;
position: absolute;
padding-top: 28%;
}



.fishR .fishOpacity{
width: 100%;
height: 100%;
position: absolute;
top: 0;
}

.fishR .fishOpacity:before{
content: "";
display: block;
background: url("../images/section2/fishRH.png") center no-repeat;
background-size: 100% auto;

transform-origin: 70% 50%;
position: absolute;
width: 100%;
height: 100%;
top: 0;

-webkit-animation: fishHead 0.6s ease-in-out infinite alternate;
-moz-animation: fishHead 0.6s ease-in-out infinite alternate;
animation: fishHead 0.6s ease-in-out infinite alternate;
}

.fishR .fishOpacity:after{
content: "";
display: block;
background: url("../images/section2/fishRT.png") center no-repeat;
background-size: 100% auto;

position: absolute;
width: 100%;
height: 100%;
top: 0;
transform-origin: 30% 50%;
}


.fishR1 .fishOpacity:after,
.fishR3 .fishOpacity:after,
.fishR5 .fishOpacity:after,
.fishR7 .fishOpacity:after{

-webkit-animation: fishRTail 0.6s ease-in-out infinite alternate;
-moz-animation: fishRTail 0.6s ease-in-out infinite alternate;
animation: fishRTail 0.6s ease-in-out infinite alternate;
}

.fishR2 .fishOpacity:after,
.fishR4 .fishOpacity:after,
.fishR6 .fishOpacity:after{

-webkit-animation: fishRTail 0.5s ease-in-out infinite alternate;
-moz-animation: fishRTail 0.5s ease-in-out infinite alternate;
animation: fishRTail 0.5s ease-in-out infinite alternate;
}

.fishR1{
right: 0px;
top: 15px;
width: 70px;
-webkit-animation: fishR 16s linear infinite;
-moz-animation: fishR 16s linear infinite;
animation: fishR 16s linear infinite;
}


.fishR2{
right: 10px;
top: 40px;
width: 36px;
-webkit-animation: fishR 16s linear 0.4s infinite;
-moz-animation: fishR 16s linear 0.4s infinite;
animation: fishR 16s linear 0.4s infinite;
}

.fishR3{
right: 20px;
top: 0px;
width: 48px;
-webkit-animation: fishR 16s linear 0.8s infinite;
-moz-animation: fishR 16s linear 0.8s infinite;
animation: fishR 16s linear 0.8s infinite;
}

.fishR4{
right: 25px;
top: 30px;
width: 66px;
-webkit-animation: fishR 16s linear 0.8s infinite;
-moz-animation: fishR 16s linear 0.8s infinite;
animation: fishR 16s linear 0.8s infinite;
}

.fishR5{
right: 20px;
top: 50px;
width: 50px;
-webkit-animation: fishR 16s linear 1.2s infinite;
-moz-animation: fishR 16s linear 1.2s infinite;
animation: fishR 16s linear 1.2s infinite;
}

.fishR6{
right: 46px;
top: 15px;
width: 38px;
-webkit-animation: fishR 16s linear 1.2s infinite;
-moz-animation: fishR 16s linear 1.2s infinite;
animation: fishR 16s linear 1.2s infinite;
}

.fishR7{
right: 50px;
top: 45px;
width: 30px;
-webkit-animation: fishR 16s linear 1.6s infinite;
-moz-animation: fishR 16s linear 1.6s infinite;
animation: fishR 16s linear 1.6s infinite;
}

.fishR8{
right: 60px;
top: 25px;
width: 44px;
-webkit-animation: fishR 16s linear 1.6s infinite;
-moz-animation: fishR 16s linear 1.6s infinite;
animation: fishR 16s linear 1.6s infinite;
}

.fishR9{
right: 100px;
top: 15px;
width: 34px;
-webkit-animation: fishR 16s linear 1.6s infinite;
-moz-animation: fishR 16s linear 1.6s infinite;
animation: fishR 16s linear 1.6s infinite;
}




.fishR1 .fishOpacity{
opacity: 0.2;
}

.fishR2 .fishOpacity{
opacity: 0.4;
}

.fishR3 .fishOpacity{
opacity: 0.2;
}
.fishR4 .fishOpacity{
opacity: 0.3;
}

.fishR5 .fishOpacity{
opacity: 0.5;
}

.fishR6 .fishOpacity{
opacity: 0.35;
}

.fishR7 .fishOpacity{
opacity: 0.45;
}

.fishR8 .fishOpacity{
opacity: 0.25;
}
.fishR9 .fishOpacity{
opacity: 0.35;
}

/*.tailR,*/
/*.fishR1,*/
/*.fishR2,*/
/*.fishR3,*/
/*.fishR4,*/
/*.fishR5,*/
/*.fishR6,*/
/*.fishR7,*/
/*.fishR8,*/
/*.fishR9{*/
/*animation-play-state: paused;*/
/*}*/

/*.swiper-slide-active .tailR,*/
/*.swiper-slide-active .fishR1,*/
/*.swiper-slide-active .fishR2,*/
/*.swiper-slide-active .fishR3,*/
/*.swiper-slide-active .fishR4,*/
/*.swiper-slide-active .fishR5,*/
/*.swiper-slide-active .fishR6,*/
/*.swiper-slide-active .fishR7,*/
/*.swiper-slide-active .fishR8,*/
/*.swiper-slide-active .fishR9{*/
/*animation-play-state: running;*/
/*}*/
</pre></body></html>