#animWrapper{
  padding: 0px 0 0;
  background: #000;
}
#anim{
  background: #FFF;
  width: 100%;
  max-width: 1600px;
  margin: 0 auto;
  height:500px;
  overflow: hidden;
  position: relative;
}
#anim:after{
    content:'';
}

#anim p{
    position:absolute;
    opacity: 0;
}

#anim #anim_bg_1{
    top: -100px;
    left:0;
}
#anim #anim_bg_2{
    top: -100px;
    right:0;
}
#anim #anim_bg_3{
    top: 0px;
    width: 100%;
    height: 100%;
}
#anim #anim_bg_3 img{
  position: absolute;
  left: 50%;
  margin: 0 0 0 -900px;
}
#anim #anim_bg_4{
    top: 0px;
    width: 100%;
    height: 100%;
}
#anim #anim_bg_4 img{
  position: absolute;
  left: 50%;
  margin: 0 0 0 -900px;
}
/* cssアニメーション */
/*アニメーションの名前を"flashIn"で時間を"2.0秒"で回数を1回で動きを"ease"に設定。*/
.flashIn{
  animation:flashIn 3.0s 1 ease;
  -webkit-animation:flashIn 3.0s 1 ease;/*-webkit-用*/
  -moz-animation:flashIn 3.0s 1 ease;/*-moz-用*/
  -o-animation:flashIn 3.0s 1 ease;/*-o-用*/
  -ms-animation:flashIn 3.0s 1 ease;/*-ms-用*/
}
@keyframes flashIn{
  0%{filter: brightness(2.0);}
  100%{filter: brightness(1.0);}
}
@-webkit-keyframes flashIn{
  0%{-webkit-filter: brightness(2.0);}
  100%{-webkit-filter: brightness(1.0);}
}
@-moz-keyframes flashIn {
  0%{-moz-filter: brightness(2.0);}
  100%{-moz-filter: brightness(1.0);}
}
@-o-keyframes flashIn{
  0%{-o-filter: brightness(2.0);}
  100%{-o-filter: brightness(1.0);}
}
@-ms-keyframes flashIn {
  0%{-o-filter: brightness(2.0);}
  100%{-o-filter: brightness(1.0);}
}


/*アニメーションの名前を"scaleIn"で時間を"6秒"で回数を1回で動きを"ease"に設定。*/
.scaleIn {
  animation: scaleIn 6s 1 ease ;
  -webkit-animation: scaleIn 6s 1 ease;/*-webkit-用*/
  -moz-animation: scaleIn 6s 1 ease;/*-moz-用*/
  -o-animation: scaleIn 6s 1 ease;/*-o-用*/
  -ms-animation: scaleIn s 1 ease;/*-ms-用*/
}
@keyframes scaleIn{
  0%{transform:scale(1.4,1.4); filter: brightness(.0);}
  100%{transform:scale(1.0,1.0); filter: brightness(1.0);}
}
@-webkit-keyframes scaleIn{
  0%{-webkit-transform:scale(1.4,1.4); -webkit-filter: brightness(.0);}
  100%{-webkit-transform:scale(1.0,1.0); -webkit-filter: brightness(1.0);}
}
@-moz-keyframes scaleIn {
  0%{-moz-transform:scale(1.4,1.4); -moz-filter: brightness(.0);}
  100%{-moz-transform:scale(1.0,1.0); -moz-filter: brightness(1.0);}
}
@-o-keyframes scaleIn{
  0%{-o-transform:scale(1.4,1.4); -o-filter: brightness(.0);}
  100%{-o-transform:scale(1.0,1.0); -o-filter: brightness(1.0);}
}
@-ms-keyframes scaleIn {
  0%{-ms-transform:scale(1.4,1.4); -ms-filter: brightness(.0);}
  100%{-ms-transform:scale(1.0,1.0); -ms-filter: brightness(1.0);}
}


#anim #anim_logo_1{
  top: 50%;
  left: 50%;
  margin: -160px 0 0 -107px;
  z-index: 100;
}
#anim #anim_catchcopy_1{
  top: 50%;
  left: 50%;
  margin: 30px 0 0 -215px;
  z-index: 100;
}

#anim p#anim_text_1{
  color: #FFF;
	font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
	font-size: 32px;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
  left: 50%;
  margin: 0 0 0 -460px;
  z-index: 100;
}
#anim p#anim_text_2{
  color: #FFF;
	font-size: 16px;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
  left: 50%;
  margin: 0 0 0 -460px;
  z-index: 100;
}

#anim p#anim_text_3{
  color: #FFF;
	font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
	font-size: 32px;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
  left: 50%;
  margin: 0 0 0 -50px;
  z-index: 100;
}
#anim p#anim_text_4{
  color: #FFF;
	font-size: 16px;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
  left: 50%;
  margin: 0 0 0 -50px;
  z-index: 100;
}
#anim #anim_catchcopy_2{
  top: 50%;
  left: 50%;
  margin: -130px 0 0 -211px;
  z-index: 100;
}
#anim p#anim_text_5{
  color: #FFF;
	font-size: 18px;
  line-height: 1.6em;
	text-shadow: 1px 1px 1px rgba(0,0,0,0.5);
  text-align: center;
  top: 190px;
  left: 0;
  right: 0;
  z-index: 100;
}
#anim #anim_logo_2{
  top: 50%;
  left: 50%;
  margin: 50px 0 0 -151px;
  z-index: 100;
}

/* cssアニメーション */
/*アニメーションの名前を"blurIn"で時間を"0.5秒"で回数を1回で動きを"ease"に設定。*/
.blurIn{
  animation:blurIn 0.5s 1 ease;
  -webkit-animation:blurIn 0.5s 1 ease;/*-webkit-用*/
  -moz-animation:blurIn 0.5s 1 ease;/*-moz-用*/
  -o-animation:blurIn 0.5s 1 ease;/*-o-用*/
  -ms-animation:blur 0.5s 1 ease;/*-ms-用*/
}
@keyframes blurIn{
  0%{filter: blur(10px);}
  100%{filter: blur(0px);}
}
@-webkit-keyframes blurIn{
  0%{-webkit-filter: blur(10px);}
  100%{-webkit-filter: blur(0px);}
}
@-moz-keyframes blurIn {
  0%{-moz-filter: blur(10px);}
  100%{-moz-filter: blur(0px);}
}
@-o-keyframes blurIn{
  0%{-o-filter: blur(10px);}
  100%{-o-filter: blur(0px);}
}
@-ms-keyframes blurIn {
  0%{-ms-filter: blur(10px);}
  100%{-ms-filter: blur(0px);}
}

/*アニメーションの名前を"blurOut"で時間を"0.5秒"で回数を1回で動きを"ease"に設定。*/
.blurOut{
  animation:blurOut 0.5s 1 ease;
  -webkit-animation:blurOut 0.5s 1 ease;/*-webkit-用*/
  -moz-animation:blurOut 0.5s 1 ease;/*-moz-用*/
  -o-animation:blurOut 0.5s 1 ease;/*-o-用*/
  -ms-animation:blurOut 0.5s 1 ease;/*-ms-用*/
}
@keyframes blurOut{
  0%{filter: blur(0px);}
  100%{filter: blur(20px);}
}
@-webkit-keyframes blurOut{
  0%{-webkit-filter: blur(0px);}
  100%{-webkit-filter: blur(20px);}
}
@-moz-keyframes blurOut {
  0%{-moz-filter: blur(0px);}
  100%{-moz-filter: blur(20px);}
}
@-o-keyframes blurOut{
  0%{-o-filter: blur(0px);}
  100%{-o-filter: blur(20px);}
}
@-ms-keyframes blurOut {
  0%{-ms-filter: blur(0px);}
  100%{-ms-filter: blur(20px);}
}
