@charset "utf-8";

/*==============================================================
gradation PC
================================================================*/

.gradation{
width: 100%;
height: 289px;
background: linear-gradient(-270deg, rgba(255,255,255,0.1),rgba(255,255,255,0.1),rgba(0,153,255,0.5), rgba(255,186,250,1), rgba(246,255,117,1),rgba(110,255,25,0.7));
background-size: 600% 600%;
animation: AnimationName 20s ease infinite;
z-index: 2;
}
 
@keyframes AnimationName {
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}

/*==============================================================
gradation SP
================================================================*/
@media (max-width: 640px){
.gradation{
width: 100%;
height: 387px;
background: linear-gradient(45deg, rgba(255,255,255,0.1),rgba(255,255,255,0.1),rgba(0,153,255,0.5), rgba(255,186,250,1), rgba(246,255,117,1),rgba(110,255,25,0.7));
background-size: 600% 600%;
animation: AnimationName 25s ease infinite;
z-index: 2;
}
 
@keyframes AnimationName {
0%{background-position:0% 50%}
50%{background-position:100% 50%}
100%{background-position:0% 50%}
}
}