@keyframes img-wrap {
  0% {
    clip-path: circle(0 at 50% 50%);
    -webkit-clip-path: circle(0 at 50% 50%);
	transform:scale(0.8);
  }

  50% {
    clip-path: circle(50% at 50% 50%);
    -webkit-clip-path: circle(50% at 50% 50%);
	transform:scale(1.3);
  }
	
70% {
    clip-path: circle(70% at 50% 50%);
    -webkit-clip-path: circle(70% at 50% 50%);
	transform:scale(1.1);
  }
	
  100% {
    clip-path: circle(100% at 50% 50%);
    -webkit-clip-path: circle(100% at 50% 50%);
	transform:scale(1);
  }
}

@keyframes rotateR {
    from {
        transform: rotate(-360deg);
    }
    to {
        transform: rotate(0deg);
    }
}

.set{
	opacity: 1;
	animation: img-wrap 2s;
}

.hana{
	position: absolute;
	z-index: 0;
}

.hana  img{
	width: 100%;
}

/*------------------------------------------
トップ：ロゴ脇
/------------------------------------------*/
#logoBox .hana1{
	left: 5%;
	top: 5%;
	width: 8%;
	animation: img-wrap 2s forwards;
	/*animation: img-wrap 2s cubic-bezier(0.4, 0, 0.2, 1), rotationR 5s linear infinite;*/
}

#logoBox .hana2{
	left: -10%;
	top: 10%;
	width: 10%;
	animation: img-wrap 2s forwards;
}

#logoBox .hana3{
	left: -1.5%;
	top: 20%;
	width: 2.5%;
	animation: img-wrap 2s forwards;
}

#logoBox .hana4{
	left: -5%;
	top: 38%;
	width: 3%;
	animation: img-wrap 2s forwards;
}

#logoBox .hana5{
	left: -12%;
	top: 5%;
	width: 5%;
	animation: img-wrap 2s forwards;
}

/*--*/

#logoBox .hana6{
	right: 5%;
	bottom: 0;
	width: 7%;
	animation: img-wrap 2s forwards;
}

#logoBox .hana7{
	right: -7%;
	bottom: 20%;
	width: 10%;
	animation: img-wrap 2s forwards;
}

#logoBox .hana8{
	right: 0;
	bottom: 20%;
	width: 2.5%;
	animation: img-wrap 2s forwards;
}

#logoBox .hana9{
	right: -1%;
	bottom: 45%;
	width: 3%;
	animation: img-wrap 2s forwards;
}

#logoBox .hana10{
	right: -9%;
	bottom: 27%;
	width: 4%;
	animation: img-wrap 2s forwards;
}


/*------------------------------------------
トップ：動画
/------------------------------------------*/
.movie .hana14{
	left: -5%;
	top: -5%;
	width: 12%;
}

.movie .hana15{
	left: 8%;
	top: -5%;
	width: 6%;
}

.movie .hana16{
	left: 0%;
	top: -20%;
	width: 15%;
}

.movie .hana18{
	right: -5%;
	bottom: -5%;
	width: 12%;
}

.movie .hana19{
	right: 8%;
	bottom: -5%;
	width: 6%;
}

.movie .hana17{
	right: -8%;
	bottom: 8%;
	width: 15%;
}


/*------------------------------------------
トップ：キャスト横
/------------------------------------------*/
.yellow .hana11{
	right: 1%;
	top: -3%;
	width: 25%;
}

.yellow .hana12{
	left: -10%;
	top: 35%;
	width: 22%;
}

.orange .hana13{
	left:2%;
	top: -26%;
	width: 25%;
}



/*//////////////////////////////////////////////////////////////////////*/
@media screen and (max-width: 800px) {
/*//////////////////////////////////////////////////////////////////////*/
/*------------------------------------------
トップ：ロゴ脇
/------------------------------------------*/
#logoBox .hana1{
	left: 10%;
	width: 10%;
}

#logoBox .hana2{
	left: 0%;
	width: 12%;
}

#logoBox .hana3{
	left: 5%;
	width: 4%;
	top: 27%;
}

#logoBox .hana4{
	left: 0%;
	width: 5%;
}

#logoBox .hana5{
	left: 0%;
	width: 5%;
}
	
/*--*/

#logoBox .hana6{
	right: 10%;
	bottom: 5%;
	width: 10%;
	animation: img-wrap 2s forwards;
}

#logoBox .hana7{
	right: 0%;
	bottom: 20%;
	width: 12%;
	animation: img-wrap 2s forwards;
}

#logoBox .hana8{
	right: 2%;
	bottom: 18%;
	width: 4%;
	animation: img-wrap 2s forwards;
}

#logoBox .hana9{
	right: 0;
	bottom: 45%;
	width: 5%;
	animation: img-wrap 2s forwards;
}

#logoBox .hana10{
	right: -2%;
	bottom: 27%;
	width: 5%;
	animation: img-wrap 2s forwards;
}

	
/*//////////////////////////////////////////////////////////////////////*/
}