@charset "UTF-8";
/* CSS Document */
@keyframes bg {
0% {
opacity: 0;
transform: scaleX(0) translateX(-5%);
}
30% {
transform: scaleX(1) translateX(0);
}
100% {
transform: scaleX(1) translateX(0);
}
30%, 100% {
opacity: 1;
}
}

@keyframes fadeIn {
0% {
opacity: 0;
}
100% {
opacity: 1;
}
}

.anim_box .bg-wrap {
position: relative;
display: inline-block;
}

.anim_box.is-animated .bg-wrap::before {
animation: bg 3s cubic-bezier(0.215, 0.61, 0.355, 1) forwards;
background:linear-gradient(to right, #0000d9 0%, #0000d9 50%, #133160 100%);
content: "";
position: absolute;
top: 0;
left: 0;
width: 103%;
height: 100%;
transform-origin: left center;
}

.anim_box.is-animated2 .bg-wrap::before {
opacity: 0;
animation: bg 4s cubic-bezier(0.215, 0.61, 0.355, 1) 0.5s forwards;
background:linear-gradient(to right, #0000d9 0%, #0000d9 50%, #133160 100%);
content: "";
position: absolute;
top: 0;
left: 0;
width: 103%;
height: 100%;
transform-origin: left center;
}

.anim_box .bg-wrap .inn {
opacity: 0;
animation: fadeIn 1s ease .5s forwards;
color: #fff;
display: inline-block;
position: relative;
z-index: 1;
}
.anim_box.is-animated2 .bg-wrap .inn {
opacity: 0;
animation: fadeIn 2s ease 2s forwards;
}