/*--------------intro--------------*/



#intro {
    width: 100vw;
    height: 100vh;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10000000;
    background: black;
    overflow: hidden;
}


#intro .se0_bg{
    width: 100vw;
    height: 100vh;
    position: absolute;
    left: 0;
    top: 0;
    /*left: 50%;*/
    /*top: 50%;*/
    /*margin-left: -1000px;*/
    /*margin-top: -1000px;*/
    background: white;
    z-index: 1000;
    transition: all 5s 2s cubic-bezier(0.4,-0.2, 0.1, 1.38);
    clip-path: circle(50% at 50% 50%);
}

#intro.on .se0_bg{
    clip-path: circle(0 at 50% 50%);
}

#intro .se0_bg > div{
    filter: invert(100%);
}

#intro .se0_bg .intro_title_01{
    transition: all 3s;
    position: absolute;
    left: 50%;
    top: 20%;
}

#intro.on .se0_bg .intro_title_01{
    top: -50px;
}

#intro .se0_bg .intro_title_02{
    transition: all 3s;
    position: absolute;
    left: 50%;
    bottom: 20%;
}

#intro.on .se0_bg .intro_title_02{
    bottom: -20px;
}

#intro .intro_sub_01{
    transition: all 5s;
}

#intro.on .intro_sub_01{
    opacity: 0;
}

#intro .intro_title_01 {
    width: 1131px;
    height: 207px;
    position: absolute;
    top: 40%;
    left: 50%;
    margin-left: -526px;
}

#intro .intro_title_02 {
    width: 911px;
    height: 168px;
    position: absolute;
    bottom: 40%;
    left: 50%;
    margin-left: -455px;
}

#intro .intro_sub_01 {
    width: 290px;
    height: 18px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -9px;
    margin-left: -145px;
}

#intro .intro_title_01_w {
    width: 1052px;
    height: 207px;
    position: absolute;
    top: -50px;
    left: 50%;
    margin-left: -526px;
}

#intro .intro_title_02_w {
    width: 911px;
    height: 168px;
    position: absolute;
    bottom: -20px;
    left: 50%;
    margin-left: -455px;
}

#intro .intro_sub_01_w {
    width: 290px;
    height: 18px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -9px;
    margin-left: -145px;
}








/*---------------menu--------------*/

#menu {
    width: 100vw;
    height: 100vh;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 99999;
    background: #000;
    display: none;
    overflow: hidden;
}

#menu .mu_dim {
    width: 100vw;
    height: 100vh;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
    background: #000;
    opacity: 0.75;
}




#menu .mu_img_list_01{
    width: 291px;
    height: 1239px;
    position: absolute;
    left: 40px;
    top: 0;
    overflow: hidden;
    z-index: 10;
}

#menu .mu_img_list_01 .mu_inner_01{
    animation: menu_inner01 20s linear infinite;
}

@keyframes menu_inner01 {
    100%{
        transform: translateY(-1239px);
    }
}




#menu .mu_img_list_02{
    width: 291px;
    height: 1242px;
    position: absolute;
    left: 372px;
    top: -1239px;
    z-index: 10;
}

#menu .mu_img_list_02 .mu_inner_02{
    animation: menu_inner02 20s linear infinite;
}

@keyframes menu_inner02 {
    100%{
        transform: translateY(1239px);
    }
}

#menu .mu_title_list {
    width: 663px;
    height: 571px;
    position: absolute;
    top: 50%;
    right: 287px;
    margin-top: -331px;
    z-index: 10;
}

#menu .mu_title_01 {
    width: 655px;
    height: 59px;
    position: absolute;
    right: 0;
}

#menu .mu_title_list .mu_text_box{
    width: 663px;
    height: 571px;
    position: relative;
}

#menu .mu_title_list .mu_text_box > div{
    transition: all 1s;
}

#menu .mu_title_list .mu_text_box > div.on{
    filter: brightness(300%);
}

#menu .mu_title_02 {
    width: 349px;
    height: 70px;
    position: absolute;
    top: 139px;
    right: 0;
}

#menu .mu_title_03 {
    width: 237px;
    height: 59px;
    position: absolute;
    top: 278px;
    right: 0;
}

#menu .mu_title_04 {
    width: 252px;
    height: 71px;
    position: absolute;
    top: 417px;
    right: 0;
}

#menu .mu_title_05 {
    width: 461px;
    height: 71px;
    position: absolute;
    top: 556px;
    right: 0;
}





#menu .mu_sub_list {
    width: 100px;
    height: 100px;
    position: absolute;
    top: 280px;
}

#menu .mu_sub_01 {
    width: 97px;
    height: 26px;
    position: absolute;
}

#menu .mu_sub_02 {
    width: 90px;
    height: 23px;
    position: absolute;
    top: 40px;
}

#menu .mu_sub_03 {
    width: 78px;
    height: 22px;
    position: absolute;
    top: 81px;
}






/*#section04 .se04_sub_img .sub02{*/
/*    width: 250px;*/
/*    height: 3522px;*/
/*    position: absolute;*/
/*    right: 283px;*/
/*    top: -3522px;*/
/*}*/
/*#section04 .se04_sub_img .sub02 .sub02_inner{*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    animation: sub02_inner 30s linear infinite;*/
/*}*/
/*#section04 .se04_sub_img .sub02 .sub02_inner >div{*/
/*    flex-shrink: 0;*/
/*}*/
/*@keyframes sub02_inner {*/
/*    100%{*/
/*        transform: translateY(3522px);*/
/*    }*/
/*}*/



#section04 .mu_img_list_01 {
    width: 291px;
    height: 1240px;
    position: absolute;
    left: 40px;
    top: -1240px;
}

#section04 .mu_img_01 {
    width: 291px;
    height: 1240px;
    margin-bottom: 33px;
}

#section04 .mu_img_02 {
    width: 291px;
    height: 1240px;
    margin-bottom: 33px;
}

#section04 .mu_img_list_01 .mu_inner_01 {
    display: flex;
    flex-direction: column;
    animation: mu_inner_01 30s linear infinite;
}

#section04 .mu_img_list_01 .mu_inner_01 > div{
    flex-shrink: 0;
}

@keyframes mu_inner_01 {
    100%{
        transform: translateY(1240px);
    }
}




#menu .mu_lang {
    width: 78px;
    height: 44px;
    position: absolute;
    bottom: 0;
}

#menu .mu_sub_en {
    width: 33px;
    height: 43px;
    position: absolute;
}

#menu .mu_sub_04 {
    width: 21px;
    height: 21px;
    margin: 0 auto;
}

#menu .mu_sub_line_01 {
    width: 30px;
    border: solid 2px #fff;
    position: absolute;
    bottom: 0;
}

#menu .mu_sub_kr {
    width: 33px;
    height: 43px;
    position: absolute;
    right: 0;
}

#menu .mu_sub_05 {
    width: 21px;
    height: 21px;
    margin: 0 auto;
}

#menu .mu_sub_line_02 {
    width: 30px;
    border: solid 2px #fff;
    position: absolute;
    bottom: 0;
}








/*---------------gnb--------------*/


#gnb {
    width: 100vw;
    height: 20px;
    position: absolute;
    left: 0;
    top: 50px;
    z-index: 1000;
    display: flex;
    justify-content: space-between;
}

#gnb.on {
    transform: translateY(-100px);
}

#gnb .left {
    width: 400px;
    display: flex;
    justify-content: space-between;
    margin: 0 80px;
    position: absolute;
    left: 13px;
}

#gnb .right {
    width: 400px;
    display: flex;
    justify-content: space-between;
    margin: 0 80px;
    position: absolute;
    right: 106px;
}

#btn_list {
    width: 38px;
    height: 10px;
    position: absolute;
    right: 80px;
    top: 50px;
    z-index: 999999;
    background: transparent;
}

#btn_list .btn_circle {
    width: 75px;
    height: 75px;
    border: 1px solid white;
    border-radius: 50%;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -38px;
    margin-top: -36px;
}

#btn_list .btn_01 {
    width: 38px;
    height: 1px;
    background: #fff;
    margin-bottom: 8px;
    transition: all 1s;
    transform-origin: 10px 6px;
}

#btn_list .btn_01.on {
    transform: rotate(45deg);
}

#btn_list .btn_02 {
    width: 38px;
    height: 1px;
    background: #fff;
    transition: all 1s;
}

#btn_list .btn_02.on {
    transform: rotate(-45deg);
}









/*---------------main_01--------------*/


/*trigger = 고정될때 필요한 대상*/
/*section = 구둥이 들어갈 때 필요한 대상*/


#section01{
    height: 1000vh;
}
#section01 .trigger_this_01{/*고정시킬 해당에 높이값만큼 그대로 가져오는 부모*/
    height: 100%;
}
#section01 .fix_this_1{ /*고정된 화면크기*/
    width: 100vw;
    height: 100vh;
    position: relative;
}



#section01 .se01_bg{
    width: 100vw;
    height: 100vh;
    position: relative;
}




/*---------------dim---------------*/



#section01 .se01_dim{
    width: 100vw;
    height: 100vh;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
    background: #000;
    opacity: 0.5;
}

#se01_main_01 {
    width: 100vw;
    height: 100vh;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1000;
}


#se01_main_01 .se01_title {
    width: 100vw;
    height: 153px;
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 538px;
}

#se01_main_01 .se01_txt_01 {
    opacity: 0;
    position: absolute;
    left: 0;
    top: 153px;
}

#se01_main_01 .se01_sub {
    height: 811px;
    position: absolute;
    left: 0;
    bottom: -820px;
}

#se01_main_01 .se01_circle_01 {
    height: 265px;
    position: absolute;
    left: -30px;
    top: 152px;
    animation: se01_circle_01 40s linear infinite;
}

@keyframes se01_circle_01 {
    100%{
        transform: rotate(1turn);
    }
}

.se01_sub_01 {
    height: 511px;
    position: absolute;
    left: 413px;
    top: 405px;
}

#se01_main_02 {
    width: 100vw;
    height: 100vh;
    position: absolute;
    left: 0;
    z-index: 10000;
}

#se01_main_02 .se01_txt_02 {
    position: absolute;
    left: 80px;
    top: 541px;

}

#se01_main_02 .se01_circle_02 {
    height: 265px;
    position: absolute;
    left: -30px;
    top: 152px;

}
#se01_main_02 .se01_circle_02 > div{
    animation: se01_rotate 40s linear infinite;
}

@keyframes se01_rotate {
    100%{
        transform: rotate(1turn);
    }
}





/*----------main_BG_line----------*/



#section01 .se01_line01{
    width: 1px;
    height: 100vh;
    background: #fff;
    position: absolute;
    top: 0;
    left: 80px;
}

#section01 .se01_line02{
    width: 1px;
    height: 100vh;
    background: #fff;
    position: absolute;
    top: 0;
    left: 407px;
}

#section01 .se01_line03{
    width: 1px;
    height: 100vh;
    background: #fff;
    position: absolute;
    top: 0;
    left: 1472px;
}

#section01 .se01_line04{
    width: 1px;
    height: 100vh;
    background: #fff;
    position: absolute;
    top: 0;
    left: 1844px;
}


#section01 .se01_circle_03{
    width: 1760px;
    height: 1760px;
    border: 1px solid white;
    border-radius: 50%;
    position: absolute;
    left: 50%;
    top: 226px;
    margin-left: -880px;
}





/*----------se02----------*/

#section02{
    height: 1000vh;
}

#section02 .trigger_this_02 {
    height: 100%;
}

#section02 .fix_this_2 {
    width: 100vw;
    height: 100vh;
    position: relative;
}

#section02 .se02_dim{
    width: 100vw;
    height: 100vh;
    position: absolute;
    left: 0;
    top: 0;
    background: #000;
    opacity: 0;
}

#se02_main {
    width: 1762px;
    height: 549px;
    position: absolute;
    left: 85px;
    top: 1013px;
    z-index: 10000;
}

#se02_main .se02_title {
    width: 1762px;
    height: 549px;
    position: absolute;
    left: 50%;
    margin-left: -886px;
}

#se02_main .se02_circle {
    width: 178px;
    height: 178px;
    position: absolute;
    top: 25px;
    right: 17px;
    animation: se01_circle_01 30s linear infinite;
}

@keyframes se01_circle_01 {
    100%{
        transform: rotate(1turn);
    }
}






/*-----------se03-------------*/

#section03 {
    height: 1493px;
    background: black;
    margin-top: 90px;
}

/*https://developer.mozilla.org/en-US/docs/Web/CSS/transform-origin*/

#section03 .se03_box_01 {
    width: 918px;
    height: 577px;
    overflow: hidden;
    position: absolute;
    left: 24px;
    transform: scale(0.7);
    transition: all 1s;
    transform-origin: left top;
}
#section03 .se03_box_01.on {
    transform: scale(1);
}

#section03 .se03_box_01 video{
    width: 100%;
    /*transform: scale(1.2); !*만약에 영상이 지정한 영역보다 작게 나오면 스케일로 조정*!*/
}

#section03 .se03_box_02 {
    width: 918px;
    height: 577px;
    overflow: hidden;
    position: absolute;
    right: 24px;
    transform: scale(0.7);
    transition: all 1s;
    transform-origin: left top;
}

#section03 .se03_box_02 video{
    width: 100%;
}

#section03 .se03_box_02.on {
    transform: scale(1);
}

#section03 .se03_box_03 {
    width: 1874px;
    height: 2048px;
    overflow: hidden;
    position: absolute;
    left: 50%;
    top: 608px;
    margin-left: -937px;
    transform: scale(0.7);
    transition: all 1s;
    transform-origin: left top;
}

#section03 .se03_box_03 video{
    width: 100%;
}

#section03 .se03_box_03.on {
    transform: scale(1);
}

#section03 .se03_dim{
    width: 100%;
    height: 100%;
    position: absolute;
    background: #000;
    opacity: 0.3;
    z-index: 1000;
}



/*-----------se04-------------*/


#section04{
    height: 1000vh;
}


#section04 .trigger_this_04 {
    height: 100%;
}

#section04 .fix_this_4 {
    width: 100vw;
    height: 100vh;
    position: relative;
}

#section04 .se04_dim{
    width: 100vw;
    height: 100vh;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 10;
    background: #000;
    opacity: 0.5;
}

#se04_main {
    width: 100vw;
    height: 100vh;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1000;
    overflow: hidden;
}

#se04_main .se04_title {
    width: 160px;
    height: 965px;
    position: absolute;
    right: 0;
    display: flex;
    justify-content: space-between;
}

#se04_main .se04_title_box {
    width: 160px;
    height: 850px;
    position: absolute;
    bottom: 0;
    overflow: hidden;
}


#se04_main .se04_title_02 {
    width: 77px;
    height: 404px;
    position: absolute;
    top: -780px;
    right: 80px;
    opacity: 0;
}

#se04_main .se04_title_01 {
    width: 56px;
    height: 965px;
    margin-left: 26px;
    position: absolute;
    top: 830px;
    right: 0;
    opacity: 0;
}

#se04_main .se04_top {
    position: absolute;
    bottom: 35px;
    left: 230px;
}


#se04_main .se04_circle {

    height: 836px;
    position: absolute;
    left: -50%;
    bottom: 385px;
    margin-left: -353px;
}

#se04_main .se04_arc {
    width: 837px;
    height: 837px;
    position: absolute;
    top: 50%;
    left: 50%;
}



#se04_main .se04_line_01 {
    width: 419px;
    height: 419px;
    border-radius: 50%;
    border: 1px solid #fff;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: 209px;
    margin-left: 209px;
}

#se04_main .se04_inner{
    width: 306px;
    height: 306px;
    border-radius: 50%;
    background: #fff;
    opacity: 0.5;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: 265px;
    margin-left: 265px;
}




#se04_main .se04_circle_txt {
    width: 156px;
    height: 127px;
    position: absolute;
    top: 50%;
    right: 50%;
    margin-top: 460px;
    margin-right: -789px;
}

#se04_main .se04_text_01 {
    width: 156px;
    height: 127px;
    position: absolute;
    opacity: 0;
    transform: translateY(-50px);
    transition: all 1s;
}

#se04_main .se04_text_01.on {
    opacity: 1;
    transform: translateY(0);
}

#se04_main .se04_text_02 {
    width: 156px;
    height: 127px;
    position: absolute;
    opacity: 0;
    transform: translateY(-50px);
    transition: all 1s;
}

#se04_main .se04_text_02.on {
    opacity: 1;
    transform: translateY(0);
}

#se04_main .se04_text_03 {
    width: 153px;
    height: 127px;
    position: absolute;
    opacity: 0;
    transform: translateY(-50px);
    transition: all 1s;
}

#se04_main .se04_text_03.on {
    opacity: 1;
    transform: translateY(0);
}




#se04_main .se04_sub {
    height: 432px;
    position: absolute;
    bottom: 80px;
    right: 621px;
}

#se04_main .se04_sub_01 {
    width: 282px;
    height: 432px;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transform: translateX(-50px);
    transition: all 1s;
}
#se04_main .se04_sub_01.on {
    opacity: 1;
    transform: translateX(0);
}
#se04_main .se04_sub_02 {
    width: 281px;
    height: 324px;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transform: translateX(-50px);
    transition: all 1s;
}
#se04_main .se04_sub_02.on {
    opacity: 1;
    transform: translateX(0);
}
#se04_main .se04_sub_03 {
    width: 279px;
    height: 348px;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transform: translateX(-50px);
    transition: all 1s;
}
#se04_main .se04_sub_03.on {
    opacity: 1;
    transform: translateX(0);
}






/*----------se05-----------*/

#section05 {
    width: 100vw;
    height: 2300px;
    padding-top: 259px;
}


#section05 .se05_title {
    width: 1093px;
    height: 228px;
    position: absolute;
    left: 50%;
    top: 500px;
    margin-left: -546px;
    opacity: 0;
}

#section05 .se05_title_01 {
    width: 258px;
    height: 88px;
    position: absolute;
    left: 50%;
    margin-left: -129px;
}

#section05 .se05_list {
    height: 228px;
    display: flex;
    justify-content: space-between;
    position: absolute;
    top: 230px;
}

#section05 .se05_title_02 {
    width: 57px;
    height: 21px;
    display: flex;
    margin-right: 104px;
}

#section05 .se05_title_03 {
    width: 276px;
    height: 21px;
    display: flex;
    margin-right: 104px;
}

#section05 .se05_title_04 {
    width: 260px;
    height: 21px;
    display: flex;
    margin-right: 104px;
}

#section05 .se05_title_05 {
    width: 208px;
    height: 21px;
    display: flex;
}





/*------------box------------*/

#section05 .se05_box_list {
    width: 1693px;
    height: 1775px;
    display: flex;
    justify-content: space-between;
    position: absolute;
    top: 850px;
    left: 50%;
    margin-left: -846px;
}


#section05 .se05_list_left {
    width: 531px;
    height: 1286px;
    position: absolute;
    left: 0;
    top: 300px;
    opacity: 0;
}

#section05 .se05_list_center {
    width: 531px;
    height: 1286px;
    position: absolute;
    left: 50%;
    top: 100px;
    margin-left: -265px;
    opacity: 0;
}

#section05 .se05_list_right {
    width: 531px;
    height: 1286px;
    position: absolute;
    right: 0;
    top: 300px;
    opacity: 0;
}




#section05 .se05_box_01 {
    background: #353535;
    width: 531px;
    height: 1275px;
    position: absolute;
    overflow: hidden;
}

#section05 .se05_box_01 > img {
    width: 363px;
    height: 2137px;
    position: absolute;
    top: -399px;
    left: 50%;
    margin-left: -186px;
}

#section05 .se05_box_02 {
    background: #353535;
    width: 531px;
    height: 449px;
    position: absolute;
    /*top: 1335px;*/
    top: 1635px;
    overflow: hidden;
    opacity: 0;
}

#section05 .se05_box_02 > img {
    width: 427px;
    height: 175px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -213px;
    margin-top: -87px;
}

#section05 .se05_box_03 {
    background: #353535;
    width: 531px;
    height: 590px;
    position: absolute;
    overflow: hidden;
}

#section05 .se05_box_03 > img {
    width: 439px;
    height: 431px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -219px;
    margin-top: -216px;
}

#section05 .se05_box_04 {
    background: #353535;
    width: 531px;
    height: 1139px;
    position: absolute;
    /*top: 640px;*/
    overflow: hidden;
    top: 940px;
    opacity: 0;
}

#section05 .se05_box_04 > img {
    width: 372px;
    height: 2191px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -186px;
    margin-top: -1106px;
}

#section05 .se05_box_05 {
    background: #353535;
    width: 531px;
    height: 1275px;
    position: absolute;
    overflow: hidden;
}

#section05 .se05_box_05 > img {
    width: 362px;
    height: 2131px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -181px;
    margin-top: -1034px;
}

#section05 .se05_box_06 {
    background: #353535;
    width: 531px;
    height: 449px;
    position: absolute;
    /*top: 1335px;*/
    top: 1635px;
    overflow: hidden;
    opacity: 0;
}

#section05 .se05_box_06 > img {
    width: 429px;
    height: 177px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -219px;
    margin-top: -88px;
}





/*-------------se06-------------*/

#section06 {
    height: 2000vh;
}

#section06 .trigger_this_06 {
    height: 100%;
}

#section06 .fix_this_6 {
    width: 100vw;
    height: 100vh;
    position: relative;
    display: flex;
}





/*--------page01--------*/

#section06 .page01 {
    width: 100vw;
    height: 100vh;
    flex-shrink: 0;
    background: black;
    position: relative;
    left: 200px;
    opacity: 0;
}

#section06 .pg01_bg_01 {
    width: 1181px;
    height: 716px;
    position: absolute;
    top: 101px;
    z-index: 10;
    overflow: hidden;
}

#section06 .pg01_bg_02 {
    width: 105px;
    height: 94px;
    position: absolute;
    bottom: 103px;
    left: 63px;
    opacity: 0.5;
}

#section06 .pg01_bg_03 {
    width: 105px;
    height: 94px;
    position: absolute;
    bottom: 103px;
    left: 441px;
    opacity: 0.5;
}

#section06 .pg01_bg_04 {
    width: 105px;
    height: 94px;
    position: absolute;
    top: -32px;
    left: 1000px;
    opacity: 0.5;
}


#section06 .pg01_title {
    width: 512px;
    height: 136px;
    position: absolute;
    top: 125px;
    left: 650px;
}

#section06 .pg01_title_01 {
    width: 449px;
    height: 60px;
    position: absolute;
    right: 0;
}

#section06 .pg01_title_02 {
    width: 512px;
    height: 60px;
    position: absolute;
    top: 74px;
    right: 0;
}

#section06 .pg01_txt {
    width: 1181px;
    height: 14px;
    position: absolute;
    bottom: 43px;
    display: flex;
    justify-content: space-between;
    opacity: 0.7;
}


#section06 .pg01_txt01 {
    width: 157px;
    height: 14px;
    margin-right: 140px;
    display: flex;
}

#section06 .pg01_txt02 {
    width: 194px;
    height: 14px;
    margin-right: 140px;
    display: flex;
}

#section06 .pg01_txt03 {
    width: 190px;
    height: 14px;
    margin-right: 140px;
}

#section06 .pg01_txt04 {
    width: 193px;
    height: 14px;
}



#section06 .pg01_circle_01 {
    width: 275px;
    height: 275px;
    border: 1px solid #fff;
    border-radius: 50%;
    position: absolute;
    left: -80px;
    top: 38px;
    overflow: hidden;
    z-index: 100;
    transform: rotate(-15deg);
}
/*animation: pg01_circle_01 10s linear infinite;*/
/*@keyframes pg01_circle_01 {*/
/*    100%{*/
/*        transform: rotate(1turn);*/
/*    }*/
/*}*/
#section06 .pg01_circle_txt {
    width: 102px;
    height: 113px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-top: -56px;
    margin-left: -51px;
}




/*--------page02--------*/

#section06 .page02 {
    width: 100vw;
    height: 100vh;
    flex-shrink: 0;
    background: #181818;
    position: relative;
}

#section06 .pg02_title {
    width: 150px;
    height: 617px;
    position: absolute;
    top: 90px;
    left: 188px;
    z-index: 10;
}

#section06 .pg02_title_01 {
    width: 60px;
    height: 612px;
    position: absolute;
    top: -800px;
    left: 83px;
    opacity: 0;
}

#section06 .pg02_title_02 {
    width: 60px;
    height: 394px;
    position: absolute;
    top: 800px;
    opacity: 0;
}

#section06 .pg02_bg {
    width: 1178px;
    height: 898px;
    position: absolute;
    left: 357px;
    bottom: 0;
    overflow: hidden;
}

#section06 .pg02_img {
    width: 280px;
    height: 280px;
    position: absolute;
    left: 1487px;
    top: 422px;
    background: #202020;
    border-radius: 50%;
}
#section06 .pg02_img .pg02_bg_svg{
    width: 280px;
    height: 280px;
    position: absolute;
    left: 0;
    top: -4px;
    border-radius: 50%;
    z-index: 100;
}
#section06 .pg02_img .pg02_bg_svg svg{
    width: 280px;
    height: 280px;
    transform: rotate(-90deg);
    stroke: #f9793e;
    stroke-width: 10px;
    stroke-dashoffset: 690; /* 선 그려짐*/
    stroke-dasharray: 690; /* 선 그려짐*/
    fill: transparent;
}
#section06 .pg02_img .pg02_bg_svg.on svg{
    animation: svg01 0.8s linear 1 forwards;
    margin-left: 0;
    margin-top: 0;
}

@keyframes svg01 {
    100%{
        stroke-dashoffset: 230;
    }
}

#section06 .pg02_img_01 {
    width: 240px;
    height: 241px;
    position: absolute;
    left: 50%;
    top: 50%;
    margin-left: -120px;
    margin-top: -120px;
    z-index: 10;
}

#section06 .pg02_txt_01 {
    width: 143px;
    height: 14px;
    position: absolute;
    left: 1487px;
    top: 740px;
}

#section06 .pg02_txt_02 {
    width: 340px;
    height: 149px;
    position: absolute;
    left: 1487px;
    top: 788px;
}







/*--------page03--------*/

#section06 .page03 {
    width: 2812px;
    height: 100vh;
    flex-shrink: 0;
    background: black;
    position: relative;
}

#section06 .pg03_clock {
    width: 738px;
    height: 100vh;
    margin-left: 319px;
    position: absolute;
}

#section06 .pg03_clock_ro {
    width: 465px;
    height: 465px;
    position: absolute;
    z-index: 10;
    top: 400px;
    left: 400px;
}
#section06 .pg03_sh {
    width: 369px;
    height: 369px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -320px;
    margin-top: -345px;
}

#section06 .pg03_body {
    width: 738px;
    height: 980px;
    position: absolute;
}

#section06 .pg03_bg_01 {
    width: 624px;
    height: 638px;
    position: absolute;
    left: 1800px;
    top: 300px;
    overflow: hidden;
}

#section06 .pg03_title_01 {
    width: 506px;
    height: 78px;
    position: absolute;
    left: 1256px;
    top: 101px;
    opacity: 0;
}

#section06 .pg03_title_02 {
    width: 1229px;
    height: 78px;
    position: absolute;
    left: 1528px;
    top: 211px;
    opacity: 0;
}

#section06 .pg03_title_03 {
    width: 469px;
    height: 78px;
    position: absolute;
    left: 1268px;
    top: 321px;
    opacity: 0;
}

#section06 .pg03_title_04 {
    width: 413px;
    height: 4px;
    position: absolute;
    left: 1894px;
    top: 133px;
    overflow: hidden;
}

#section06 .pg03_title_04_move {
    width: 413px;
    border: 2px solid;
    background: #fff;
    position: absolute;
    left: -600px;
    /*opacity: 0;*/
}

#section06 .pg03_sub_01 {
    width: 99px;
    height: 100px;
    position: absolute;
    left: 1345px;
    top: 834px;
}

#section06 .pg03_sub_02 {
    width: 11px;
    height: 215px;
    position: absolute;
    left: 1769px;
    top: 727px;
}





/*--------page04--------*/

#section06 .page04 {
    width: 2227px;
    height: 100vh;
    flex-shrink: 0;
    background: #181818;
    position: relative;
}

#section06 .pg04_bg_01 {
    width: 907px;
    height: 836px;
    position: absolute;
    left: 239px;
    top: 40px;
}

#section06 .pg04_txt_01 {
    width: 214px;
    height: 44px;
    position: absolute;
    left: 772px;
    top: 680px;
}

#section06 .pg04_txt_02 {
    width: 372px;
    height: 96px;
    position: absolute;
    left: 772px;
    top: 777px;
}

#section06 .watch {
    width: 740px;
    height: 100vh;
    position: absolute;
    left: 1330px;

}

#section06 .pg04_body {
    width: 280px;
    height: 448px;
    position: absolute;
    left: 50%;
    bottom: 80px;
    margin-left: -140px;
}

#section06 .pg04_face_01 {
    width: 228px;
    height: 226px;
    position: absolute;
    left: 50%;
    bottom: 113px;
    margin-left: -374px;
}

#section06 .pg04_face_02 {
    width: 228px;
    height: 226px;
    position: absolute;
    left: 50%;
    bottom: 113px;
    margin-left: -114px;
}

#section06 .pg04_face_03 {
    width: 228px;
    height: 226px;
    position: absolute;
    left: 50%;
    bottom: 113px;
    margin-left: 145px;
}

#section06 .pg04_title {
    width: 740px;
    height: 500px;
    position: absolute;
    left: 50%;
    margin-left: -370px;
    overflow: hidden;
}

#section06 .pg04_title_01 {
    width: 594px;
    height: 77px;
    position: absolute;
    top: 320px;
    left: -720px;
    opacity: 0;
}


#section06 .pg04_title_02 {
    width: 22px;
    height: 245px;
    position: absolute;
    top: -800px;
    left: 50%;
    margin-left: -11px;
    opacity: 0;
}





/*--------page05--------*/

#section06 .page05 {
    width: 3500px;
    height: 100vh;
    flex-shrink: 0;
    background: black;
    position: relative;
}

#section06 .pg05_img_01 {
    width: 452px;
    height: 691px;
    position: absolute;
    left: 268px;
    top: 244px;
    overflow: hidden;
}
#section06 .pg05_img_01 .pg05_img_01_move{
    position: absolute;
    left: 0;
    top: 0;
}

#section06 .pg05_img_02 {
    width: 1030px;
    height: 650px;
    position: absolute;
    left: 791px;
    top: 40px;
    overflow: hidden;
}

#section06 .pg05_img_03 {
    width: 946px;
    height: 980px;
    position: absolute;
    left: 2279px;
}

#section06 .pg05_title_01 {
    width: 732px;
    height: 89px;
    position: absolute;
    left: 2054px;
    top: 123px;
}

#section06 .pg05_title_02 {
    width: 555px;
    height: 68px;
    position: absolute;
    left: 2054px;
    top: 254px;
}

#section06 .pg05_title_03 {
    width: 278px;
    height: 45px;
    position: absolute;
    left: 3024px;
    top: 200px;
}

#section06 .pg05_title_04 {
    width: 210px;
    height: 37px;
    position: absolute;
    left: 3024px;
    top: 260px;
}






/*-------pg04------*/

#section06 .page06 {
    width: 1800px;
    height: 100vh;
    flex-shrink: 0;
    background: black;
    position: relative;
}

#section06 .pg06_border {
    width: 1px;
    height: 100vh;
    background: #fff;
}

#section06 .pg06_title {
    width: 600px;
    height: 299px;
    position: absolute;
    top: 100px;
    left: 125px;
}

#section06 .pg06_arrow_01 {
    width: 133px;
    height: 133px;
    position: absolute;
    top: 646px;
    left: 116px;
    rotate: -45deg;
}

#section06 .pg06_arrow_01:hover {
    filter: invert(100%);
    transition: all 1s;
}


#section06 .pg06_arrow_02 {
    width: 221px;
    height: 221px;
    position: absolute;
    bottom: 80px;
    left: 740px;
}