/*ローディング*/
.loadingAnim {
    width: 100%;
    height: 100%;
    background-color: rgba(255,255,255,1.00);
    position: fixed;
    top: 0;
    left: 0;
    z-index: 20000;
	}

/*SVGアニメーション*/
@media only screen and (max-width: 768px){
#group {
	width: 230px;
	}
}

@media only screen and (min-width: 769px){
#group {
	width: 300px;
	}
}

#group {
	display: block;
	height: auto;
	position: absolute;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%); /*上下左右中央寄せ*/
	z-index: 20000;
	}


.item01 {
	opacity: 1;
	fill: #007BA1;
	}

.item02,.item03,.item04,.item05,.item06,.item07,.item08,.item09,.item10,.item11 {
	opacity: 1;
	fill: #0062B1;
	}


.item01 {
  animation: japan 5s ease-in 0s forwards;
	}

.item02 {
  animation: japan 5s ease-in 0.2s forwards;

}

.item03 {
  animation: japan 5s ease-in 0.4s forwards;

}

.item04 {
  animation: japan 5s ease-in 0.6s forwards;

}

.item05 {
  animation: japan 5s ease-in 0.8s forwards;

}

.item06 {
  animation: japan 5s ease-in 1.0s forwards;

}

.item07 {
  animation: japan 5s ease-in 1.2s forwards;

}

.item08 {
  animation: japan 5s ease-in 1.4s forwards;

}

.item09 {
  animation: japan 5s ease-in 1.6s forwards;

}

.item10 {
  animation: japan 5s ease-in 1.8s forwards;

}

.item11 {
  animation: japan 5s ease-in 2.0s forwards;

}



@keyframes japan {
  0% {
    stroke-dashoffset: 2572;
    fill: transparent;
    opacity: 1;
  }
  40% {
    stroke-dashoffset: 0;
    fill: transparent;
    opacity: 1;
  }
  50% {
    stroke-dashoffset: 0;

    opacity: 1;
  }
  80% {
    stroke-dashoffset: 0;
 
    opacity: 1;
  }
  95% {
    stroke-dashoffset: 0;

    opacity: 0;
  }
  100% {
    stroke-dashoffset: 0;

    opacity: 0;
  }
}


