rr.css
@charset "utf-8";
.RR_visi {
display: block;
}
.RR_hidd {
display: none;
}
.RR_mask_body {
overflow: hidden;
margin: 0 auto;
}
.RR_mask_main {
height: 100%;
width: 100%;
z-index: 99;
overflow: scroll;
position: fixed;
top: 0;
left: 0;
}
.RR_mask_obj {
display: block;
margin: 0 auto;
}
.RR_page_cA {
background-color: rgb(0, 222, 202);
}
.RR_toTop_visi {
position: fixed;
display: block;
animation: toTop 0.7s forwards;
-webkit-animation: toTop 0.7s forwards;
-moz-animation: toTop 0.7s forwards;
-ms-animation: toTop 0.7s forwards;
}
@keyframes toTop {
0% {
border-radius: 0;
}
25% {
border-radius: 7px;
}
50% {
border-radius: 14px;
}
75% {
border-radius: 21px;
}
100% {
border-radius: 28px;
}
}
@-webkit-keyframes toTop {
0% {
border-radius: 0;
}
25% {
border-radius: 7px;
}
50% {
border-radius: 14px;
}
75% {
border-radius: 21px;
}
100% {
border-radius: 28px;
}
}
@-moz-keyframes toTop {
0% {
border-radius: 0;
}
25% {
border-radius: 7px;
}
50% {
border-radius: 14px;
}
75% {
border-radius: 21px;
}
100% {
border-radius: 28px;
}
}
}
@-ms-keyframes toTop {
0% {
border-radius: 0;
}
25% {
border-radius: 7px;
}
50% {
border-radius: 14px;
}
75% {
border-radius: 21px;
}
100% {
border-radius: 28px;
}
}
.RR_toTop_hidd {
position: fixed;
display: none;
}
.RR_ani_10 {
animation: RR_ani_11 0.7s;
-moz-animation: RR_ani_11 0.7s;
-ms-animation: RR_ani_11 0.7s;
-webkit-animation: RR_ani_11 0.7s;
}
@keyframes RR_ani_11 {
from {
border-radius: 20px;
transform: rotateY(0deg);
}
to {
border-radius: 0px;
transform: rotateY(360deg);
}
}
@-moz-keyframes RR_ani_11 {
from {
border-radius: 20px;
-moz-transform: rotateY(0deg);
}
to {
border-radius: 0px;
-moz-transform: rotateY(360deg);
}
}
@-ms-keyframes RR_ani_11 {
from {
border-radius: 20px;
-ms-transform: rotateY(0deg);
}
to {
border-radius: 0px;
-ms-transform: rotateY(360deg);
}
}
@-webkit-keyframes RR_ani_11 {
from {
border-radius: 20px;
-webkit-transform: rotateY(0deg);
}
to {
border-radius: 0px;
-webkit-transform: rotateY(360deg);
}
}
.RR_ani_20 {
animation: RR_ani_21 0.7s;
-moz-animation: RR_ani_21 0.7s;
-ms-animation: RR_ani_21 0.7s;
-webkit-animation: RR_ani_21 0.7s;
}
@keyframes RR_ani_21 {
from {
opacity: 0.6;
border-radius: 20px;
transform: skewX(0deg);
}
to {
opacity: 1;
border-radius: 0px;
transform: skewX(180deg);
}
}
@-moz-keyframes RR_ani_21 {
from {
opacity: 0.6;
border-radius: 20px;
-moz-transform: skewX(0deg);
}
to {
opacity: 1;
border-radius: 0px;
-moz-transform: skewX(180deg);
}
}
@-ms-keyframes RR_ani_21 {
from {
opacity: 0.6;
border-radius: 20px;
-ms-transform: skewX(0deg);
}
to {
opacity: 1;
border-radius: 0px;
-ms-transform: skewX(180deg);
}
}
@-webkit-keyframes RR_ani_21 {
from {
opacity: 0.6;
border-radius: 20px;
-webkit-transform: skewX(0deg);
}
to {
opacity: 1;
border-radius: 0px;
-webkit-transform: skewX(180deg);
}
}
.RR_ani_30 {
animation: RR_ani_31 0.7s;
-moz-animation: RR_ani_31 0.7s;
-ms-animation: RR_ani_31 0.7s;
-webkit-animation: RR_ani_31 0.7s;
}
@keyframes RR_ani_31 {
0% {
width: 110%;
margin-left: 30px;
}
25% {
width: 130%;
border-radius: 5px;
}
50% {
width: 110%;
border-radius: 10px;
}
75 {
width: 90%;
margin-left: -10px;
border-radius: 5px;
}
100% {
margin-left: 0px;
width: 100%;
border-radius: 0px;
}
}
@-moz-keyframes RR_ani_31 {
0% {
width: 110%;
margin-left: 30px;
}
25% {
width: 130%;
border-radius: 5px;
}
50% {
width: 110%;
border-radius: 10px;
}
75 {
width: 90%;
margin-left: -10px;
border-radius: 5px;
}
100% {
margin-left: 0px;
width: 100%;
border-radius: 0px;
}
}
@-ms-keyframes RR_ani_31 {
0% {
width: 110%;
margin-left: 30px;
}
25% {
width: 130%;
border-radius: 5px;
}
50% {
width: 110%;
border-radius: 10px;
}
75 {
width: 90%;
margin-left: -10px;
border-radius: 5px;
}
100% {
margin-left: 0px;
width: 100%;
border-radius: 0px;
}
}
@-webkit-keyframes RR_ani_31 {
0% {
width: 110%;
margin-left: 30px;
}
25% {
width: 130%;
border-radius: 5px;
}
50% {
width: 110%;
border-radius: 10px;
}
75 {
width: 90%;
margin-left: -10px;
border-radius: 5px;
}
100% {
margin-left: 0px;
width: 100%;
border-radius: 0px;
}
}
.RR_ani_40 {
animation: RR_ani_41 0.7s;
-moz-animation: RR_ani_41 0.7s;
-ms-animation: RR_ani_41 0.7s;
-webkit-animation: RR_ani_41 0.7s;
}
@keyframes RR_ani_41 {
0% {
transform: skewX(20deg);
transform: skewY(20deg);
border-radius: 10px;
}
25% {
transform: skewX(40deg);
transform: skewY(40deg);
border-radius: 20px;
}
50% {
transform: skewX(15deg);
transform: skewY(15deg);
border-radius: 15px;
}
75% {
transform: skewX(-10deg);
transform: skewY(-10deg);
border-radius: 10px;
}
100% {
transform: skewX(0deg);
transform: skewY(0deg);
border-radius: 0px;
}
}
@-moz-keyframes RR_ani_41 {
0% {
-moz-transform: skewX(20deg);
-moz-transform: skewY(20deg);
border-radius: 10px;
}
25% {
-moz-transform: skewX(40deg);
-moz-transform: skewY(40deg);
border-radius: 20px;
}
50% {
-moz-transform: skewX(15deg);
-moz-transform: skewY(15deg);
border-radius: 15px;
}
75% {
-moz-transform: skewX(-10deg);
-moz-transform: skewY(-10deg);
border-radius: 10px;
}
100% {
-moz-transform: skewX(0deg);
-moz-transform: skewY(0deg);
border-radius: 0px;
}
}
@-ms-keyframes RR_ani_41 {
0% {
-ms-transform: skewX(20deg);
-ms-transform: skewY(20deg);
border-radius: 10px;
}
25% {
-ms-transform: skewX(40deg);
-ms-transform: skewY(40deg);
border-radius: 20px;
}
50% {
-ms-transform: skewX(15deg);
-ms-transform: skewY(15deg);
border-radius: 15px;
}
75% {
-ms-transform: skewX(-10deg);
-ms-transform: skewY(-10deg);
border-radius: 10px;
}
100% {
-ms-transform: skewX(0deg);
-ms-transform: skewY(0deg);
border-radius: 0px;
}
}
@-webkit-keyframes RR_ani_41 {
0% {
-webkit-transform: skewX(20deg);
-webkit-transform: skewY(20deg);
border-radius: 10px;
}
25% {
-webkit-transform: skewX(40deg);
-webkit-transform: skewY(40deg);
border-radius: 20px;
}
50% {
-webkit-transform: skewX(15deg);
-webkit-: skewY(15deg);
border-radius: 15px;
}
75% {
-webkit-transform: skewX(-10deg);
-webkit-transform: skewY(-10deg);
border-radius: 10px;
}
100% {
-webkit-transform: skewX(0deg);
-webkit-transform: skewY(0deg);
border-radius: 0px;
}
}
.RR_ani_50 {
animation: RR_ani_51 0.7s;
-moz-animation: RR_ani_51 0.7s;
-ms-animation: RR_ani_51 0.7s;
-webkit-animation: RR_ani_51 0.7s;
}
@keyframes RR_ani_51 {
0% {
transform: scaleY(0.1);
transform: rotateZ(40deg);
}
25% {
transform: scaleY(0.4);
transform: rotateZ(70deg);
}
50% {
transform: scaleY(0.7);
transform: rotateZ(30deg);
}
75% {
transform: scaleY(1.1);
transform: rotateZ(-10deg);
}
100% {
transform: scaleY(1);
transform: rotateZ(0deg);
}
}
@-moz-keyframes RR_ani_51 {
0% {
-moz-transform: scaleY(0.1);
-moz-transform: rotateZ(40deg);
}
25% {
-moz-transform: scaleY(0.4);
-moz-transform: rotateZ(70deg);
}
50% {
-moz-transform: scaleY(0.7);
-moz-transform: rotateZ(30deg);
}
75% {
-moz-transform: scaleY(1.1);
-moz-transform: rotateZ(-10deg);
}
100% {
-moz-transform: scaleY(1);
-moz-transform: rotateZ(0deg);
}
}
@-ms-keyframes RR_ani_51 {
0% {
-ms-transform: scaleY(0.1);
-ms-transform: rotateZ(40deg);
}
25% {
-ms-transform: scaleY(0.4);
-ms-transform: rotateZ(70deg);
}
50% {
-ms-transform: scaleY(0.7);
-ms-transform: rotateZ(30deg);
}
75% {
-ms-transform: scaleY(1.1);
-ms-transform: rotateZ(-10deg);
}
100% {
-ms-transform: scaleY(1);
-ms-transform: rotateZ(0deg);
}
}
@-webkit-keyframes RR_ani_51 {
0% {
-webkit-transform: scaleY(0.1);
-webkit-transform: rotateZ(40deg);
}
25% {
-webkit-transform: scaleY(0.4);
-webkit-transform: rotateZ(70deg);
}
50% {
-webkit-transform: scaleY(0.7);
-webkit-transform: rotateZ(30deg);
}
75% {
-webkit-transform: scaleY(1.1);
-webkit-transform: rotateZ(-10deg);
}
100% {
-webkit-transform: scaleY(1);
-webkit-transform: rotateZ(0deg);
}
}
.RR_ani_60 {
animation: RR_ani_61 0.7s;
-moz-animation: RR_ani_61 0.7s;
-ms-animation: RR_ani_61 0.7s;
-webkit-animation: RR_ani_61 0.7s;
}
@keyframes RR_ani_61 {
0% {
-webkit-filter: blur(3px);
-moz-filter: blur(3px);
-o-filter: blur(3px);
-ms-filter: blur(3px);
filter: blur(3px);
}
25% {} 50% {
-webkit-filter: blur(30px);
-moz-filter: blur(30px);
-o-filter: blur(30px);
-ms-filter: blur(30px);
filter: blur(30px);
}
75% {}100% {
-webkit-filter: blur(0px);
-moz-filter: blur(0px);
-o-filter: blur(0px);
-ms-filter: blur(0px);
filter: blur(0px);
}
}
@-moz-keyframes RR_ani_61 {
0% {
-webkit-filter: blur(3px);
-moz-filter: blur(3px);
-o-filter: blur(3px);
-ms-filter: blur(3px);
filter: blur(3px);
}
25% {} 50% {
-webkit-filter: blur(30px);
-moz-filter: blur(30px);
-o-filter: blur(30px);
-ms-filter: blur(30px);
filter: blur(30px);
}
75% {}100% {
-webkit-filter: blur(0px);
-moz-filter: blur(0px);
-o-filter: blur(0px);
-ms-filter: blur(0px);
filter: blur(0px);
}
}
@-ms-keyframes RR_ani_61 {
0% {
-webkit-filter: blur(3px);
-moz-filter: blur(3px);
-o-filter: blur(3px);
-ms-filter: blur(3px);
filter: blur(3px);
}
25% {} 50% {
-webkit-filter: blur(30px);
-moz-filter: blur(30px);
-o-filter: blur(30px);
-ms-filter: blur(30px);
filter: blur(30px);
}
75% {}100% {
-webkit-filter: blur(0px);
-moz-filter: blur(0px);
-o-filter: blur(0px);
-ms-filter: blur(0px);
filter: blur(0px);
}
}
@-webkit-keyframes RR_ani_61 {
0% {
-webkit-filter: blur(3px);
-moz-filter: blur(3px);
-o-filter: blur(3px);
-ms-filter: blur(3px);
filter: blur(3px);
}
25% {} 50% {
-webkit-filter: blur(30px);
-moz-filter: blur(30px);
-o-filter: blur(30px);
-ms-filter: blur(30px);
filter: blur(30px);
}
75% {}100% {
-webkit-filter: blur(0px);
-moz-filter: blur(0px);
-o-filter: blur(0px);
-ms-filter: blur(0px);
filter: blur(0px);
}
}
.RR_ani_70 {
animation: RR_ani_71 0.7s;
-moz-animation: RR_ani_71 0.7s;
-ms-animation: RR_ani_71 0.7s;
-webkit-animation: RR_ani_71 0.7s;
}
@keyframes RR_ani_71 {
0% {
transform: skewX(-10deg);
transform: scaleY(1.1);
border-radius: 10px;
}
25% {
transform: skewX(10deg);
transform: scaleY(1.4);
border-radius: 20px;
}
50% {
transform: skewX(30deg);
transform: scaleY(1.1);
border-radius: 15px;
}
75% {
transform: skewX(10deg);
transform: scaleY(0.9);
border-radius: 10px;
}
100% {
transform: skewX(0deg);
transform: scaleY(1);
border-radius: 0px;
}
}
@-ms-keyframes RR_ani_71 {
0% {
-ms-transform: rotateX(-10deg);
-ms-transform: scaleY(1.1);
border-radius: 10px;
}
25% {
-ms-transform: rotateX(10deg);
-ms-transform: scaleY(1.4);
border-radius: 20px;
}
50% {
-ms-transform: rotateX(30deg);
-ms-transform: scale(1.1);
border-radius: 15px;
}
75% {
-ms-transform: rotateX(10deg);
-ms-transform: scaleY(0.9);
border-radius: 10px;
}
100% {
-ms-transform: rotateX(0deg);
-ms-transform: scaleY(1);
border-radius: 0px;
}
}
@-moz-keyframes RR_ani_71 {
0% {
-moz-transform: rotateX(-10deg);
-moz-transform: scaleY(1.1);
border-radius: 10px;
}
25% {
-moz-transform: rotateX(10deg);
-moz-transform: scaleY(1.4);
border-radius: 20px;
}
50% {
-moz-transform: rotateX(30deg);
-moz-transform: scaleY(1.1);
border-radius: 15px;
}
75% {
-moz-transform: rotateX(10deg);
-moz-transform: scaleY(0.9);
border-radius: 10px;
}
100% {
-moz-transform: rotateX(0deg);
-moz-transform: scaleY(1);
border-radius: 0px;
}
}
@-webkit-keyframes RR_ani_71 {
0% {
-webkit-transform: rotateX(-10deg);
-webkit-transform: scaleY(1.1);
border-radius: 10px;
}
25% {
-webkit-transform: rotateX(10deg);
-webkit-transform: scaleY(1.4);
border-radius: 20px;
}
50% {
-webkit-transform: rotateX(30deg);
-webkit-transform: scaleY(1.1);
border-radius: 15px;
}
75% {
-webkit-transform: rotateX(10deg);
-webkit-transform: scaleY(0.9);
border-radius: 10px;
}
100% {
-webkit-transform: rotateX0deg);
-webkit-transform: scaleY(1);
border-radius: 0px;
}
}