@charset "UTF-8";
/* CSS Document */

.uLine {
    background: #ebb38d;
    background: linear-gradient(180deg, rgba(235, 179, 141, 0) 20%, rgba(235, 179, 141, 1) 20%, rgba(235, 179, 141, 0.5) 100%);
    background-repeat: no-repeat;
    background-size: 0% .5em;
    transition: all 1.5s ease 1s;
    background-position: 0 1em;
}
.active.uLine {
	background-size: 100% .5em;
}
.blink {
	animation: blink 0.5s ease-in-out infinite alternate;
	transform-origin: center bottom;
}
@keyframes blink {
  0% {
    opacity: 0;
		transform: scale(1);
  }
  50% {
     opacity: 1;
		transform: scale(1.2);
  }
  100% {
    opacity: 1;
		transform: scale(1.2);
  }
}
#sec02 {

}
.caseBox {
	transform:rotateY(90deg);
		opacity: 0;
	
}

.caseBox.active {
	animation: caseBox 1s ease-in-out 0.6s;
	animation-fill-mode: forwards;
}
@keyframes caseBox {
  0% {
    transform:rotateY(90deg);
  }

  100% {
    transform:rotateY(0deg);
		opacity: 1;
  }
}
.numDay {
	transform:rotateY(90deg);
		opacity: 0;
}
.active .numDay {
	animation: caseBox 0.5s ease-in-out 0.5s;
	animation-fill-mode: forwards;
}
.daysBox .txt {
	opacity: 0;
	transform: translateX(-30px);
}
.daysBox .active .txt {
	transition: 0.5s ease-out 1s;
	transform: translateX(0px);
	opacity: 1;
}
.daysBox .imgBox,.daysBox .junbi {
	opacity: 0;
}
.daysBox .active .imgBox,.daysBox .junbi.active {
	transition: 0.6s ease-out 1.5s;
	opacity: 1;
}