.column_apics {
text-align: center;margin-left: 25px;
}
.button_apics {
position: relative;
display: block;
width: 150px;
height: 45px;
margin: 0 auto;
box-sizing: border-box;
}
.button_apics a {
display: flex;
justify-content: center;
position: relative;
padding: 8px 0;
width: 150px;
height: 45px;
background: linear-gradient(225deg, #00acc1 0%, #46ddef 100%);
border-radius: 3px;
font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
border: none;
z-index: 0;
overflow: hidden;
background-clip: border-box;
box-sizing: border-box;
text-decoration: none;
transition: transform .1s linear;
span.label_apics {
align-self: center;
color: white;
font-size: 22px;
font-weight: 700;
width: 106px;
flex: none;
order: 1;
flex-grow: 0;
}
&:before {
display: block;
position: absolute;
content: '';
width: 80%;
height: 100%;
top: 0;
left: 0;
background-image: linear-gradient(rgba(255, 255, 255, 0.5), rgba(255, 255, 255, 0));
background-position-x: 0%;
background-position-y: 0%;
transform: translateX(calc(-40%)) skewX(-25.8deg);
transition: transform .1s linear;
z-index: 1;
}
&:hover:before {
transform: translateX(calc(-20%)) skewX(-25.8deg);
}
}
.star_apics {
will-change: transform, opacity;
}
.button_apics.three_apics .star_apics.one_apics {
position: absolute;
top: auto;
bottom: 24%;
right: 2%;
width: 15px;
height: 15px;
}
.button_apics.three_apics .star_apics.two_apics {
position: absolute;
bottom: 8%;
right: 35%;
width: 10px;
height: 10px;
}
.button_apics.three_apics .star_apics.four_apics {
position: absolute;
bottom: 50%;
right: 87%;
width: 13px;
height: 13px;
}
.button_apics.three_apics .star_apics.three_apics {
position: absolute;
top: 7%;
right: 15.1%;
width: 10px;
height: 10px;
}
.button_apics.three_apics .star_apics.one_apics {
animation: sparkle2 1.8s ease-in-out infinite;
}
.button_apics.three_apics .star_apics.two_apics {
animation: sparkle2 1.8s ease-in-out infinite;
animation-delay: .3s;
}
.button_apics.three_apics .star_apics.three_apics {
animation: sparkle2 1.8s ease-in-out infinite;
animation-delay: .6s;
}
.button_apics.three_apics .star_apics.four_apics {
animation: sparkle2 1.8s ease-in-out infinite;
animation-delay: .9s;
}
@keyframes sparkle2 {
0%   {
opacity: 1;
transform: scale(1);
}
50%  {
opacity: 0;
transform: scale(0);
}
100% {
opacity: 1;
transform: scale(1);
}
}