.top_main {
margin:0 auto;
padding:0;
width:100%;
max-width:400px;
height:auto;
overflow:hidden;
position:relative;
-webkit-box-sizing: border-box;
box-sizing: border-box;
text-align:center;
}

.text1,
.text2,
.text3 {
width:100%;
max-width:400px;
position:absolute;
left:0;
top:40px;
display:block;
 -webkit-animation-timing-function:linear;
 -webkit-animation-iteration-count: 1;
 opacity:0;
}
.text1 {
 -webkit-animation-name:korekara;
-webkit-animation-duration:8s;
 -webkit-animation-fill-mode:forwards;
}
.text2 {
 -webkit-animation-name:osoroshii;
-webkit-animation-duration:8s;
 -webkit-animation-fill-mode:forwards;
}
.text3 {
 -webkit-animation-name:seikaku;
-webkit-animation-duration:8s;
 -webkit-animation-fill-mode:forwards;
}

.main_img {
width:100%;
max-width:400px;
height:auto;
max-height:166px;
 -webkit-animation-name:main;
 -webkit-animation-duration:8s;
 -webkit-animation-iteration-count: 1;
/*-webkit-animation-fill-mode:forwards;*/
opacity:1;
vertical-align:bottom;
}


@-webkit-keyframes korekara {
 0%{ -webkit-transform: scale(0, 0); -webkit-transform-origin: middle center; opacity:0; }
 2%{ -webkit-transform: scale(0, 0); -webkit-transform-origin: middle center; opacity:1; }
 4%{ -webkit-transform: scale(1, 1); -webkit-transform-origin: middle center; opacity:1; }
 22%{ -webkit-transform: scale(1.1, 1.1); -webkit-transform-origin: middle center; opacity:0; }
 25%{ -webkit-transform: scale(1.1, 1.1); -webkit-transform-origin: middle center; opacity:0; }
 100%{ -webkit-transform: scale(20, 20); -webkit-transform-origin: middle center; opacity:0; }
}

@-webkit-keyframes osoroshii {
 0%{ -webkit-transform: scale(0, 0); -webkit-transform-origin: middle center; opacity:0; }
 28%{ -webkit-transform: scale(0, 0); -webkit-transform-origin: middle center; opacity:0; }
 29%{ -webkit-transform: scale(1, 1); -webkit-transform-origin: middle center; opacity:1; }
 46%{ -webkit-transform: scale(1.1, 1.1); -webkit-transform-origin: middle center; opacity:1; }
 49%{ -webkit-transform: scale(1.1, 1.1); -webkit-transform-origin: middle center; opacity:0; }
 100%{ -webkit-transform: scale(20, 20); -webkit-transform-origin: middle center; opacity:0; }
}

@-webkit-keyframes seikaku {
 0%{ -webkit-transform: scale(0, 0); -webkit-transform-origin: middle center; opacity:0; }
 55%{ -webkit-transform: scale(20, 20); -webkit-transform-origin: middle center; opacity:0; }
 57%{ -webkit-transform: scale(1.1, 1.1); -webkit-transform-origin: middle center; opacity:1; }
 75%{ -webkit-transform: scale(1, 1); -webkit-transform-origin: middle center; opacity:1; }
 78%{ -webkit-transform: scale(1, 1); -webkit-transform-origin: middle center; opacity:1; }
 80%{ -webkit-transform: scale(1.1, 1.1); -webkit-transform-origin: middle center; opacity:0.5; }
 100%{ -webkit-transform: scale(20, 20); -webkit-transform-origin: middle center; opacity:0; }
}

@-webkit-keyframes main {
 0%{ background-color:#FFF; -webkit-transform-origin:middle center; -webkit-transform: scale(1, 1); opacity:0;}
 85%{ background-color:#FFF; -webkit-transform-origin:middle center; -webkit-transform: scale(1, 1); opacity:0;}
 86%{ background-color:rgba(255, 255, 255, 0.9); -webkit-transform-origin:middle center; -webkit-transform: scale(1, 1); opacity:1;}
 90%{ background-color:transparent; -webkit-transform-origin:middle center; -webkit-transform: scale(1, 1); opacity:0.8;}
 100%{ background-color:transparent; -webkit-transform-origin: middle center; -webkit-transform: scale(1, 1); opacity:1;}
}

/* ■■■■ 点滅 ■■■■ */
@-webkit-keyframes pulse {
 from {
   opacity: 1.0;/*透明度100%*/
 }
 to {
   opacity: 0.6;/*透明度80%*/
 }
}
.blinking{
-webkit-animation-name: pulse;/* 実行する名前 */
-webkit-animation-duration: 0.8s;/* 0.8秒かけて実行 */
-webkit-animation-iteration-count:infinite;/* 何回実行するか。infiniteで無限 */
-webkit-animation-timing-function:ease-in-out;/* イーズインアウト */
-webkit-animation-direction: alternate;/* alternateにするとアニメーションが反復 */
-webkit-animation-delay: 0s; /* 実行までの待ち時間 */
}