/*アニメーションの@keyframes用のCSSコードを書く（ここに書くとAMP用で約500KBまで記入できます）*/
@keyframes loading {
 25% {
 transform: translate(0,50px) rotate(-90deg);
 }
 50% {
 transform: translate(-50px,50px) rotate(-180deg);
 }
 75% {
 transform: translate(-50px,0) rotate(-270deg);
 }
 100% {
 transform: translate(0,0) rotate(-360deg);
 }
}
/*@keyframes loaded {
 0% {
 transform: translateX(0%);
 }
 50% {
 transform: translateX(100%);
 }
 100% {
 transform: translateX(100%);
 opacity: 0;
 visibility: hidden;
 }
}*/
@keyframes loaded {
  0%   { opacity: 0.95; }
  100% { opacity: 0; }
}

@keyframes logoRising {
0% {
 transform: translateY(20px);
 opacity: 0;
 }
100% {
 transform: translateY(0px);
 opacity: 1;
 }
}
@keyframes mainNaviA {
50% {
 opacity: 0;
 }
100% {
 opacity: 1;
 }
}
@keyframes appealFalling {
0% {
 transform: translateY(-20px);
 opacity: 0;
 }
100% {
 transform: translateY(0px);
 opacity: 1;
 }
}
/*### リニューアルテスト ###*/
@keyframes appealRising {
0% {
 transform: translateY(20px);
 opacity: 0;
 }
100% {
 transform: translateY(0px);
 opacity: 1;
 }
}
@keyframes appealImageLeft {
0% {
 transform: translateX(0%) rotate(-45deg);
 opacity: 0;
 }
100% {
 transform: translateX(50%) rotate(0deg);
 opacity: 1;
 }
}
@keyframes appealImageRight {
0% {
 transform: translateX(0%);
 opacity: 0;
 }
100% {
 transform: translateX(-50%);
 opacity: 1;
 }
}
@keyframes appealImageLeft2 {
0% {
 transform: translateX(0%);
 opacity: 0;
 }
100% {
 transform: translateX(50%);
 opacity: 1;
 }
}
@keyframes appealImageRight2 {
0% {
 transform: translateX(0%);
 opacity: 0;
 }
100% {
 transform: translateX(-50%);
 opacity: 1;
 }
}
@keyframes appealNicolina {
0% {
 transform: translate(25% -20px);
 opacity: 0;
 }
100% {
 transform: translate(0% 0px);
 opacity: 1;
 }
}