@charset "utf-8";
/* animation: fadeIn 0.5s ease-in-out 0s 1 forwards running; */


header.main{ top: -100px; transition: top 1s; }
header.main.show{ top:0; }

.main .visualSec .t1{ opacity: 0; }
.main .visualSec.on .t1{  animation: fadeIn 1s ease-in-out 0s 1 forwards running; }
.main .visualSec .t2{ opacity: 0; }
.main .visualSec.on .t2{  animation: fadeIn 1s ease-in-out 0.2s 1 forwards running; }


.main .aboutSec .circle_list > li{ opacity: 0; }
.main .aboutSec.on .circle_list > li:nth-child(1){  animation: fadeInDown 0.5s ease-in-out 0s 1 forwards running; }
.main .aboutSec.on .circle_list > li:nth-child(2){  animation: fadeInDown 0.5s ease-in-out .5s 1 forwards running; }
.main .aboutSec.on .circle_list > li:nth-child(3){  animation: fadeInDown 0.5s ease-in-out 1s 1 forwards running; }

@keyframes fadeIn {
    0% {transform: translate3d(0px, 30px, 0px); }
    100% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
}
@keyframes fadeInDown {
    0% {transform: translate3d(0px, -30px, 0px); }
    100% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
}
@keyframes fadeInRight {
    0% { opacity: 0; transform: translate3d(30px, 0, 0px); }
    100% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
}
@keyframes fadeInLeft {
    0% { opacity: 0; transform: translate3d(-30px, 0, 0px); }
    100% { opacity: 1; transform: translate3d(0px, 0px, 0px); }
}

section.valueSec ul > li:nth-child(1) { opacity: 0; }
section.valueSec ul > li:nth-child(1).on {   animation: fadeIn 0.5s ease-in-out 0s 1 forwards running;   }
section.valueSec ul > li:nth-child(2) { opacity: 0; }
section.valueSec ul > li:nth-child(2).on {  animation: fadeIn 0.5s ease-in-out 0s 1 forwards running;  animation-delay: 0.2s; }
section.valueSec ul > li:nth-child(3) { opacity: 0; }
section.valueSec ul > li:nth-child(3).on {  animation: fadeIn 0.5s ease-in-out 0s 1 forwards running;  animation-delay: 0.2s; }
section.valueSec ul > li:nth-child(4) { opacity: 0; }
section.valueSec ul > li:nth-child(4).on {  animation: fadeIn 0.5s ease-in-out 0s 1 forwards running;  animation-delay: 0.2s; }

.sub04_1 .sub2_sec1 .text_div .text_1 { opacity: 0; }
.sub04_1 .sub2_sec1 .text_div.on .text_1 {   animation: fadeIn 0.5s ease-in-out 0s 1 forwards running;  animation-delay: 0.1s; }
.sub04_1 .sub2_sec1 .text_div .text_2 { opacity: 0; }
.sub04_1 .sub2_sec1 .text_div.on .text_2 {   animation: fadeIn 0.5s ease-in-out 0s 1 forwards running;  animation-delay: 0.3s; }
.sub04_1 .sub2_sec1 .text_div .text_3 { opacity: 0; }
.sub04_1 .sub2_sec1 .text_div.on .text_3 {   animation: fadeIn 0.5s ease-in-out 0s 1 forwards running;  animation-delay: 0.5s; }

.sub04_1 .sub2_sec1 ul { opacity: 0; }
.sub04_1 .sub2_sec1 ul.on {   animation: fadeIn 0.5s ease-in-out 0s 1 forwards running;  animation-delay: 0.1s; }

.sub04_1 .sub2_sec2 .text_1 { opacity: 0; }
.sub04_1 .sub2_sec2 .text_1.on {   animation: fadeIn 0.5s ease-in-out 0s 1 forwards running;  animation-delay: 0.1s; }

.sub04_1 .sub2_sec2 ul li:nth-child(1) { opacity: 0; }
.sub04_1 .sub2_sec2 ul li:nth-child(1).on { animation: fadeIn 0.5s ease-in-out 0s 1 forwards running; animation-delay: 0.1s; }
.sub04_1 .sub2_sec2 ul li:nth-child(3) { opacity: 0; }
.sub04_1 .sub2_sec2 ul li:nth-child(3).on { animation: fadeIn 0.5s ease-in-out 0s 1 forwards running; animation-delay: 0.1s; }
.sub04_1 .sub2_sec2 ul li:nth-child(5) { opacity: 0; }
.sub04_1 .sub2_sec2 ul li:nth-child(5).on { animation: fadeIn 0.5s ease-in-out 0s 1 forwards running; animation-delay: 0.1s; }
.sub04_1 .sub2_sec2 ul li:nth-child(7) { opacity: 0; }
.sub04_1 .sub2_sec2 ul li:nth-child(7).on { animation: fadeIn 0.5s ease-in-out 0s 1 forwards running; animation-delay: 0.1s; }