/*/////////// アニメーション ///////////*/
#main {
    animation: fadeUp 2s ease 0s 1 normal;
    -webkit-animation: fadeUp 2s ease 0s 1 normal;
}
h1 {
    animation: fadeUp 4s ease 0s 1 normal;
    -webkit-animation: fadeUp 4s ease 0s 1 normal;
}
@keyframes fadeUp {
    0% { opacity: 0; }
    25% { opacity: 0; }
    100% { opacity: 1; }
}
@-webkit-keyframes fadev {
    0% { opacity: 0; }
    25% { opacity: 0; }
    100% { opacity: 1; }
}


section #contents #result h3 span,
section #contents #point p em span {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	border-bottom: 8px solid #fddbe1;
	transition: 1.5s all;
	width: 0;
	display: block;
}
section #contents #result h3 span.on,
section #contents #point p em span.on {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	width: 100%;
}
section #contents #point > div > div {
	transition: all 1.5s cubic-bezier(.215, .61, .355, 1), 2s;
	opacity: 0;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	margin-top: 10%;
}
section #contents #point > div > div.on {
	opacity: 1;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
	margin-top: 0;
}
@media screen and (max-width: 768px) {
section #contents #point > div > div {
	margin-top: 15%;
}
}

.load {
	-webkit-animation: spin 30s linear infinite;
	-moz-animation: spin 30s linear infinite;
	-ms-animation: spin 30s linear infinite;
	-o-animation: spin 30s linear infinite;
	animation: spin 30s linear infinite;
}
@-webkit-keyframes spin {
 0% {
-webkit-transform: rotate(0deg);
}
 100% {
-webkit-transform: rotate(360deg);
}
}
@-moz-keyframes spin {
 0% {
-moz-transform: rotate(0deg);
}
 100% {
-moz-transform: rotate(360deg);
}
}
@-ms-keyframes spin {
 0% {
-ms-transform: rotate(0deg);
}
 100% {
-ms-transform: rotate(360deg);
}
}
@-o-keyframes spin {
 0% {
-o-transform: rotate(0deg);
}
 100% {
-o-transform: rotate(360deg);
}
}
@keyframes spin {
 0% {
transform: rotate(0deg);
}
 100% {
transform: rotate(360deg);
}
}