
.contentIni h1.logo{
    opacity: 0;
    margin-top: 100px;
    animation: iniH1An 1s ease-out forwards;
}
@keyframes iniH1An{
    0% {
        opacity: 0;
        margin-top: 100px;
    }
    100% {
        opacity: 1;
        margin-top: 0;
    }
}

.contentIni .cntDsc{
    opacity: 0;
    filter: blur(100px);
    animation: iniDsAn 1s ease-out forwards;
    animation-delay: 0.5s;
}
@keyframes iniDsAn{
    0% {
        opacity: 0;
        filter: blur(100px);
    }
    100% {
        opacity: 1;
        filter: blur(0);
    }
}



.cntInt h1{
    opacity: 0;
    transform: translatey(200px);
    filter: blur(100px);
    scale: 2.0;
    margin: 200px auto 0 auto;
    animation: intH1An 1.2s ease-out forwards;
}
@keyframes intH1An{
    0% {
        opacity: 0;
        transform: translatey(150px);
        filter: blur(100px);
        scale: 2.0;
        margin: 200px auto 0 auto;
    }
    100% {
        opacity: 1;
        transform: translatey(0);
        filter: blur(0);
        scale: 1.0;
        margin: 330px auto 0 auto;
    }
}


.contentMmd .bxCnt{
    transform: translateY(200px);
    opacity: 0;
    transition: transform 1.7s ease 0.3s;
}
.contentMmd .anBC{
    transform: translateY(0);
    opacity: 1;
    transition: transform 1.7s ease forwards;
}

.contentMmd .anBC b{
    animation: mmdBAn 0.8s ease-out forwards;
    animation-delay: 1.0s;
}
@keyframes mmdBAn{
    0% {
        opacity: 0;
        transform: translateX(100px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

.contentMmd b{
    opacity: 0;
    transform: translateX(100px);
}
.contentMmd .anBC b{
    animation: mmdBAn 0.8s ease-out forwards;
    animation-delay: 1.0s;
}
@keyframes mmdBAn{
    0% {
        opacity: 0;
        transform: translateX(100px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

.contentMmd .bxDs h2{
    opacity: 0;
    transform: translateX(100px);
}
.contentMmd .anBC h2{
    animation: mmdH2An 0.8s ease-out forwards;
    animation-delay: 1.5s;
}
@keyframes mmdH2An{
    0% {
        opacity: 0;
        transform: translateX(100px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

.contentMmd .bxDs p{
    opacity: 0;
    transform: translateX(100px);
}
.contentMmd .anBC p{
    animation: mmdPAn 0.8s ease-out forwards;
    animation-delay: 2.0s;
}
@keyframes mmdPAn{
    0% {
        opacity: 0;
        transform: translateX(100px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

.contentMmd .bxDs a{
    opacity: 0;
    transform: translateX(100px);
}
.contentMmd .anBC .bxDs a{
    animation: mmdAAn 0.8s ease-out forwards;
    animation-delay: 2.5s;
}
@keyframes mmdAAn{
    0% {
        opacity: 0;
        transform: translateX(100px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}



.contentLst h2{
    opacity: 0;
    transform: translateX(-150px);
}
.contentLst.anLst h2{
    animation: intH2An 0.8s ease-out forwards;
    animation-delay: 0.5s;
}
@keyframes intH2An{
    0% {
        opacity: 0;
        transform: translateX(-150px);
    }
    100% {
        opacity: 1;
        transform: translateX(0);
    }
}

.contentLst ul li{
    opacity: 0;
    transform: translatey(100px);
}
.contentLst.anLst ul li{
    animation: epAn 0.8s ease-out forwards;
}
.contentLst.anLst ul li:nth-child(1){
    animation-delay: 1s;
}
.contentLst.anLst ul li:nth-child(2){
    animation-delay: 1.5s;
}
.contentLst.anLst ul li:nth-child(3){
    animation-delay: 2s;
}

@keyframes epAn{
    0% {
        opacity: 0;
        transform: translatey(100px);
    }
    100% {
        opacity: 1;
        transform: translatey(0);
    }
}




.contentYtb h2.titAn{
    opacity: 1;
    transform: translateY(0);
    transition: transform 1.2s ease;
}


ul.liCrdA li{
    opacity: 0;
    transform: translatey(100px);
}

ul.liCrdA.anCA li{
    animation: crd1An 0.8s ease-out forwards;
}
ul.liCrdA.anCA li:nth-child(1){
    animation-delay: 1s;
}
ul.liCrdA.anCA li:nth-child(2){
    animation-delay: 1.5s;
}
ul.liCrdA.anCA li:nth-child(3){
    animation-delay: 2s;
}
ul.liCrdA.anCA li:nth-child(4){
    animation-delay: 2.5s;
}
ul.liCrdA.anCA li:nth-child(5){
    animation-delay: 3s;
}
ul.liCrdA.anCA li:nth-child(6){
    animation-delay: 3.5s;
}
ul.liCrdA.anCA li:nth-child(7){
    animation-delay: 4s;
}

@keyframes crd1An{
    0% {
        opacity: 0;
        transform: translatey(100px);
    }
    100% {
        opacity: 1;
        transform: translatey(0);
    }
}





ul.liCrdB li{
    opacity: 0;
    transform: translatey(100px);
}

ul.liCrdB.anCB li{
    animation: crd2An 0.8s ease-out forwards;
}
ul.liCrdB.anCB li:nth-child(1){
    animation-delay: 1s;
}
ul.liCrdB.anCB li:nth-child(2){
    animation-delay: 1.5s;
}
ul.liCrdB.anCB li:nth-child(3){
    animation-delay: 2s;
}
ul.liCrdB.anCB li:nth-child(4){
    animation-delay: 2.5s;
}
ul.liCrdB.anCB li:nth-child(5){
    animation-delay: 3s;
}
ul.liCrdB.anCB li:nth-child(6){
    animation-delay: 3.5s;
}
ul.liCrdB.anCB li:nth-child(7){
    animation-delay: 4s;
}
ul.liCrdB.anCB li:nth-child(8){
    animation-delay: 4.5s;
}
ul.liCrdB.anCB li:nth-child(9){
    animation-delay: 5s;
}
ul.liCrdB.anCB li:nth-child(10){
    animation-delay: 5.5s;
}
ul.liCrdB.anCB li:nth-child(11){
    animation-delay: 6s;
}
ul.liCrdB.anCB li:nth-child(12){
    animation-delay: 6.5s;
}
ul.liCrdB.anCB li:nth-child(13){
    animation-delay: 7s;
}
ul.liCrdB.anCB li:nth-child(14){
    animation-delay: 7.5s;
}
ul.liCrdB.anCB li:nth-child(15){
    animation-delay: 8s;
}
ul.liCrdB.anCB li:nth-child(16){
    animation-delay: 8.5s;
}
ul.liCrdB.anCB li:nth-child(17){
    animation-delay: 9s;
}

@keyframes crd2An{
    0% {
        opacity: 0;
        transform: translatey(100px);
    }
    100% {
        opacity: 1;
        transform: translatey(0);
    }
}







