@charset "utf-8";


@import url("../font/AppleSDGothicNeoB.ttf");
@import url("../font/AppleSDGothicNeoEB.ttf");
@import url("../font/AppleSDGothicNeoM.ttf");
@import url("../font/YoonGothic760.otf");
@import url("../font/YoonGothic750.otf");

@font-face {
    font-family: "AppleSDGothicNeoB00";
    src: url("../font/AppleSDGothicNeoB.ttf");
}

@font-face {
    font-family: "AppleSDGothicNeoEB00";
    src: url("../font/AppleSDGothicNeoEB.ttf");
}
@font-face {
    font-family: "Yoon윤고딕 760";
    src: url("../font/YoonGothic760.otf");
}

@font-face {
    font-family: "Yoon윤고딕 750";
    src: url("../font/YoonGothic750.otf");
}

@font-face {
    font-family: "AppleSDGothicNeoM00";
    src: url("../font/AppleSDGothicNeoM.ttf");
}

html, body {
    height: 100%;
    overflow-y: hidden
}

body {
    position: relative;
    min-width: 1200px;
    font-family: "Dotum", "Arial", sans-serif;
    font-size: 12px;
    color: #333;
    background: white
}


.posNum {
    position: fixed;
    left: 50%;
    top: 50%;
    width: 300px;
    height: 50px;
    margin: -25px 0 0 -150px;
    background: #111;
    color: #fff;
    font-size: 20px;
    font-weight: bold;
    text-align: center;
    line-height: 50px;
    z-index: 9999
}

.scrollBox {
    min-width: 1200px;
    height: 100%;
    position: relative
}

.scrollBox .wrap {
    min-width: 1200px;
    position: relative;
    overflow: hidden
}

.scrollBox .wrap > div {
    position: relative
}

.scrollBox .wrap .objs > li {
    position: absolute;
    left: 50%
}




/*====================================씬1===============================================*/
#scene01 {
    height: 980px;
    background: #21272c;
}

#scene01 .main_bg {
    height: 846px;
    width: 933px;

    position: absolute;
    top: 80px;
    left: 124px;
    /*background: white;*/
}
#scene01 .main_bg > div {
    /*background: yellow;*/
    height: 180px;
    width: 933px;

    position: relative;
    top: 0;
    left: 0;
    margin-bottom: 40px;

    color: #21272c;
    font-size: 230px;
    font-family: "AppleSDGothicNeoEB00",sans-serif;
    font-weight: bold;

    text-shadow: 12px 10px 30px #1c2125,
    -12px -10px 30px #242b30;
}


#scene01 .main_visual > li {position: absolute; height: 980px}

#scene01 .main_visual .main_mk_sdw {
    top: 0;
    right: 0;
    width: 1147px;
}

#scene01 .main_visual .main_mk {
    top: 0;
    right: 0;
    width: 1085px;
}

#scene01 .main_visual > li > img {position: absolute;}
#scene01 .main_visual > li > img:nth-child(1){ bottom: 0; left: 0;}
#scene01 .main_visual > li > img:nth-child(2){ top: 0; right: 0;}

#scene01 .main_info {
    position: absolute;
    left: 360px;
    top: 310px;

    height: 467px;
    width: 244px;
}

#scene01 .main_info >li:nth-child(1) {margin-bottom: 26px;}
#scene01 .main_info >li:nth-child(2) {
    margin-bottom: 203px;

    height: 123px;
    width: 244px;

    font-family: "AppleSDGothicNeoB00", sans-serif;
    font-size: 69px;
    color: #f4f7f5;

    position: relative; /*글자가 조금 띄워져 있어서 div 자리 자체를 조금 조정해줌*/
    left: -5px;

}
#scene01 .main_info >li:nth-child(3) {}

/*====================================씬2===============================================*/
#scene02 {
    height: 980px;
    background: #1b2024;
}

#scene02 > ul {position: absolute;}


#scene02 .title_wrap {
    top: 205px;
    left: 287px;

    width: 1259px;
    height: 60px;
}


#scene02 .title_wrap > li {position: absolute;}

#scene02 .title_wrap > li:nth-child(1){
    width: 206px;
    height: 60px;
    top: 0;
    left: 0;

    border-radius: 30px;
    background: #1b2024;
    box-shadow: inset 7px 7px 12px #161a1e,
    inset -7px -7px 12px #20262a;

}

#scene02 .title_wrap > li:nth-child(2){
    background: #e98073;
    border-radius: 100%;
    height: 10px;
    width: 10px;

    top: 25px;
    left: 73px;
}

#scene02 .title_wrap > li:nth-child(3){
    color: #f5f5f5;
    font-family: "AppleSDGothicNeoB00",sans-serif;
    font-size: 30px;
    letter-spacing: 2px;

    line-height: 60px;
    vertical-align: center;
     left: 100px;
}
/*!!!!타이틀 이거 참고!!!!*/

#scene02 .title_wrap > li:nth-child(4){top: 0; right: 0;}



#scene02 .overview {
    top: 353px;
    left: 295px;

    width: 1330px;
    height: 458px;
    /*background: yellowgreen;*/
}

#scene02 .overview > li {
    position: relative;
    float: left;
    line-height: 458px;
    vertical-align: center;
    border-radius: 100%;
    margin-right: 43px;

    text-align: center; /*img 태그를 위한것..*/
}

#scene02 .overview .ov_circle {
    background: #1b2024;
    width: 336px;
    height: 336px;

    box-shadow: inset 12px 12px 22px #161a1e,
    inset -12px -12px 22px #20262a;
}

#scene02 .overview .ov_big {
    width: 458px;
    height: 458px;

    box-shadow: 12px 12px 22px #161a1e,
    -12px -12px 22px #20262a;
}
#scene02 .overview .ov_big > div {
    border-radius: 100%;
    width: 425px;
    height: 425px;
    background: none;
    border: 1px solid #f1769b;

    position: absolute;
    top: 17px;
    left: 17px;
    /*border-image: linear-gradient(340deg, rgba(241,118,155,1) 10%, rgba(235,129,115,1) 100%);*/
}

#scene02 .overview .ov_dot{
    width: 14px;
    height: 14px;
    background: #e98073;
    margin-top: 222px;
}
#scene02 .overview > li:nth-child(4) {background: #f1769b; }

#scene02 .overview >li:last-child {margin-right: 0;}
#scene02 .overview .ov_small {margin-top: 61px;}


#scene02 .overview >li > img {
    position: relative;
    top: 50%;
    margin-top: -40px;
}



/*====================================씬3===============================================*/

#scene03 {
    height: 1650px;
    background: #21272c;
}

#scene03 .title_wrap {
    position: absolute;
    top: 205px;
    left: 287px;

    width: 1259px;
    height: 60px;
}

#scene03 .title_wrap > li {position: absolute;}

#scene03 .title_wrap > li:nth-child(1){
    width: 206px;
    height: 60px;
    top: 0;
    left: 0;

    border-radius: 30px;
    background: #21272c;
    box-shadow: inset 7px 7px 12px #1b2024,
    inset -7px -7px 12px #272e34;
}

#scene03 .title_wrap > li:nth-child(2){
    background: #f1769b;
    border-radius: 100%;
    height: 10px;
    width: 10px;

    top: 25px;
    left: 73px;
}

#scene03 .title_wrap > li:nth-child(3){
    color: #f5f5f5;
    font-family: "AppleSDGothicNeoB00",sans-serif;
    font-size: 30px;
    letter-spacing: 2px;

    line-height: 60px;
    vertical-align: center;
    left: 100px;
}


#scene03 .sc03_typo_bg {
    font-family: "AppleSDGothicNeoEB00",sans-serif;
    font-weight: bold;
    position: absolute;

    color: #21272c;
    text-shadow: 10px 8px 30px #1a1e22,
    -10px -8px 30px #262d33;

    font-size: 200px;

    height: 150px;
    /*background: #e85f5f;*/
}

#scene03 .tbg01 {top: 300px; right: -170px;}
#scene03 .tbg02 {top: 930px; left: 90px;}





#scene03 .typo_style .Aa {
    position: absolute;
    top: 427px;
    left: 312px;

    font-size: 383px;
    font-family: "AppleSDGothicNeoB00", sans-serif;
    font-weight: bold;
}

#scene03 .typo_style .A1 {
    color: #21272c;
    text-shadow:  26px 32px 30px #1a1e22,
    -22px -28px 30px #2b3137;
}

#scene03 .typo_style .A2 {
    background: linear-gradient(328deg, rgba(241,118,155,1) 0%, rgba(235,129,115,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;

    transition: all .6s;
    opacity: 0;
}

#scene03 .typo_style .A2.on {opacity: 1;}


#scene03 .typo_style > li:nth-child(3) {
    position: absolute;
    right: 360px;
    top: 427px;

    height: 156px;
    width: 465px;
    /*background: #e85f5f;*/
}

/*#scene03 .typo_style > li:nth-child(3) > div {background: yellowgreen;}*/
#scene03 .typo_style > li:nth-child(3) > div:nth-child(1){
    height: 27px;
    margin-bottom: 39px;

    font-family: "Yoon윤고딕 760",sans-serif;
    font-size: 26px;
    color: #e98073;
}

#scene03 .typo_style > li:nth-child(3) > div:nth-child(2){
    height: 48px;
    margin-bottom: 29px;

    font-family: "AppleSDGothicNeoM00";
    font-size: 17px;
    color: #f5f5f5;
    word-spacing: 14px;
    /*line-height: 38px;*/ /*걍 br태그로 떼어줬음*/
    vertical-align: center;

}

#scene03 .typo_style > li:nth-child(3) > div:nth-child(3){
    height: 13px;

    font-family: "AppleSDGothicNeoM00";
    font-size: 17px;
    color: #f5f5f5;
    word-spacing: 14px;
}


#scene03 .typo_style >li:nth-child(4) {
    /*background: #eb3808;*/
    width: 465px;
    height: 118px;
    position: absolute;
    right: 360px;
    top: 623px;
}


#scene03 .typo_style >li:nth-child(4) > div {margin-bottom: 20px;}
#scene03 .typo_style >li:nth-child(4) > div:last-child {margin-bottom: 0;}




#scene03 .color_wrap {
    position: absolute;
    left: 345px;
    top: 857px;

    width: 1290px;
    height: 166px;
    /*background: yellowgreen;*/
}

#scene03 .color_wrap >li {
    position: relative;

    border-radius: 20px;
    width: 166px;
    height: 166px;
    /*background: #21272c;*/

     float: left;
    margin-right: 100px;

    background: linear-gradient(145deg, #1e2328, #232a2f);
    box-shadow:  16px 16px 40px #1b2024,
    -16px -16px 40px #272e34;
}

#scene03 .color_wrap >li:nth-child(2) {
    background: #21272c;
    box-shadow: inset 16px 16px 40px #1b2024,
    inset -16px -16px 40px #272e34;
}

#scene03 .color_wrap >li:last-child{margin: 0;}


#scene03 .color_wrap >li >div {
    height: 120px;
    width: 120px;
    border-radius: 20px;

    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);

    color: #f5f5f5;
    font-size: 18px;
    font-family: "AppleSDGothicNeoM00";
    line-height: 120px;
    vertical-align: center;
    text-align: center;
}
#scene03 .color_wrap >li:nth-child(1) >div {background: #e85f5f;}
#scene03 .color_wrap >li:nth-child(2) >div {background: #e98073;}
#scene03 .color_wrap >li:nth-child(3) >div {background: #f473a8;}
#scene03 .color_wrap >li:nth-child(4) >div {background: #f5f5f5; color: #21272c; font-weight: bold;}
#scene03 .color_wrap >li:nth-child(5) >div {background: #21272c;}


#scene03 .circle {
    position: absolute;
    background: #21272c;
    border-radius: 100%;

    box-shadow:  20px 20px 40px #1b2024,
    -20px -20px 40px #272e34;
}

#scene03 .big_circle{
    width: 300px;
    height: 300px;

    top: 1207px;
    right: 436px;

    transition: all .6s;
    transform: scale(.4);
    transition-delay: .1s;
    opacity: 0;
}
#scene03 .small_circle{
    width: 215px;
    height: 215px;

    top: 1250px;
    right: 160px;

    transition: all .6s;
    transform: scale(.4);
    opacity: 0;
}

#scene03 >div:last-child {
    position: absolute;
    left: 360px;
    top: 1287px;
}

#scene03 .big_circle.on {transform: scale(1);    opacity: 1;}
#scene03 .small_circle.on {transform: scale(1);     opacity: 1;}



/*====================================씬4===============================================*/

#scene04 {
    height: 1256px;
    background: #21272c;
}

#scene04 .title_wrap {
    position: absolute;
    top: 158px;
    left: 287px;

    width: 1259px;
    height: 60px;
}

#scene04 .title_wrap > li {position: absolute;}

#scene04 .title_wrap > li:nth-child(1){
    width: 206px;
    height: 60px;
    top: 0;
    left: 0;

    border-radius: 30px;
    background: #21272c;
    box-shadow: inset 7px 7px 12px #1b2024,
    inset -7px -7px 12px #272e34;
}

#scene04 .title_wrap > li:nth-child(2){
    background: #f1769b;
    border-radius: 100%;
    height: 10px;
    width: 10px;

    top: 25px;
    left: 73px;
}

#scene04 .title_wrap > li:nth-child(3){
    color: #f5f5f5;
    font-family: "AppleSDGothicNeoB00",sans-serif;
    font-size: 30px;
    letter-spacing: 2px;

    line-height: 60px;
    vertical-align: center;
    left: 100px;
}

#scene04 .elements_pic {
    position: absolute;
    left: 200px;
    top: 100px;
    background: tomato;
    height: 925px;
    width: 1520px;
}

#scene04 .elements_pic .circle {
    height: 309px;
    width: 309px;
    position: absolute;
    top: 196px;
    left: 162px;
    border-radius: 100%;
    /*background: tomato;*/
}

#scene04 .elements_pic .circle .circle_line {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    height: 282px;
    width: 282px;
}

#scene04 .elements_pic .circle .circle_line >img {
    position: absolute;
    height: 282px;
    width: 282px;
    top: 0;
    left: 0;
}

#scene04 .elements_pic .circle .circle_line >img:nth-child(1) {}
#scene04 .elements_pic .circle .circle_line >img:nth-child(2) {
    transform: rotate(-30deg);
    transition: all 1s;
}
#scene04 .elements_pic .circle .circle_line >img:nth-child(3) {
    transform: rotate(-60deg);
    transition: all 1s;
    /*transition-delay: .s;*/
}
#scene04 .elements_pic .circle .circle_line >img:nth-child(4) {
    transform: rotate(-90deg);
    transition: all 1s;
}
#scene04 .elements_pic .circle .circle_line >img:nth-child(5) {
    transform: rotate(-120deg);
    transition: all 1s;
}
#scene04 .elements_pic .circle .circle_line >img:nth-child(6) {
    transform: rotate(-150deg);
    transition: all 1s;
}
#scene04 .elements_pic .circle .circle_line >img:nth-child(7) {
    transform: rotate(-180deg);
    transition: all 1s;
}
#scene04 .elements_pic .circle .circle_line >img:nth-child(8) {
    transform: rotate(-210deg);
    transition: all 1s;
}
#scene04 .elements_pic .circle .circle_line >img:nth-child(9) {
    transform: rotate(-210deg);
    transition: all 1s;
}



#scene04 .elements_pic .circle .circle_line >img:nth-child(2).on {
    transform: rotate(0deg);
}
#scene04 .elements_pic .circle .circle_line >img:nth-child(3).on {
    transform: rotate(0deg);
}
#scene04 .elements_pic .circle .circle_line >img:nth-child(4).on {
    transform: rotate(0deg);
}
#scene04 .elements_pic .circle .circle_line >img:nth-child(5).on {
    transform: rotate(0deg);
}
#scene04 .elements_pic .circle .circle_line >img:nth-child(6).on {
    transform: rotate(0deg);
}
#scene04 .elements_pic .circle .circle_line >img:nth-child(7).on {
    transform: rotate(0deg);
}
#scene04 .elements_pic .circle .circle_line >img:nth-child(8).on {
    transform: rotate(0deg);
}
#scene04 .elements_pic .circle .circle_line >img:nth-child(9).on {
    transform: rotate(0deg);
}


#scene04 .elements_pic .sc04_bar {
    position: absolute;
    width: 20px;
    background: linear-gradient(0deg, rgba(239,112,166,1) 0%, rgba(233,128,114,1) 100%);
    border-radius: 12px;
}

#scene04 .elements_pic .b1{
    bottom: 169px;
    left: 819px;

    height: 22px;
    transition: all 1s;
}

#scene04 .elements_pic .b1.on {
    height: 140px;
}

#scene04 .elements_pic .b2{
    bottom: 169px;
    left: 948px;

    height: 22px;
    transition: all 1s;
}
#scene04 .elements_pic .b2.on {
    height: 280px;
}


 /*====================================씬5===============================================*/

#scene05 {
    height: 1350px;
    background: #21272c;
    /*position: relative;*/
}

#scene05 .sc05_bg {
    position: relative;
    width: 1920px;
    height: 783px;
    background: url("../images/sc05_bg.png") no-repeat fixed;
}


#scene05 .sc05_typo_bg {
    font-family: "AppleSDGothicNeoEB00",sans-serif;
    font-weight: bold;
    position: absolute;

    color: #21272c;
    top: 929px;
    height: 150px;
    width: 1920px;

    text-align: center;
    font-size: 200px;

    text-shadow:  10px 8px 30px #1a1e22,
    -10px -8px 30px #262d33;
}

#scene05 > ul {position: absolute;}

#scene05 .onboarding_mk {
    top: 68px;
    left: 50%;
    margin-left: -231.5px;

    height: 957px;
    width: 463px;
    /*background: tomato;*/
    border-radius: 100px;
}
#scene05 .onboarding_mk > li {position: absolute;}

#scene05 .onboarding_mk > li:first-child {
    top: 17px;
    left: 20px;

    height: 920px;
    width: 424px;

    background: yellowgreen;
    border-radius: 50px;
    /*z-index: 9999;*/
}

#scene05 .onboarding_mk > li:last-child >img {
    position: absolute;
    top: 0;
    left: 0;
}

#scene05 .title_wrap {
    top: 1170px;
    left: 287px;

    width: 1259px;
    height: 60px;
    /*background: #e85f5f;*/
}

#scene05 .title_wrap > li {position: absolute;}

#scene05 .title_wrap > li:nth-child(1){
    width: 206px;
    height: 60px;
    top: 0;
    left: 0;

    border-radius: 30px;
    background: #21272c;
    box-shadow: inset 7px 7px 12px #1b2024,
    inset -7px -7px 12px #272e34;
}

#scene05 .title_wrap > li:nth-child(2){
    background: #e98073;
    border-radius: 100%;
    height: 10px;
    width: 10px;

    top: 25px;
    left: 73px;
}

#scene05 .title_wrap > li:nth-child(3){
    color: #f5f5f5;
    font-family: "AppleSDGothicNeoB00",sans-serif;
    font-size: 30px;
    letter-spacing: 2px;

    line-height: 60px;
    vertical-align: center;
    left: 100px;
}
/*!!!!타이틀 이거 참고!!!!*/

#scene05 .title_wrap > li:nth-child(4){
    top: 6px;
    right: 0;
}

/*====================================씬6===============================================*/

#scene06 {
    height: 1780px;
    background: #21272c;
}


#scene06 >ul {position: absolute;}

#scene06 .title_wrap {
    top: 160px;
    left: 287px;

    width: 1259px;
    height: 60px;
    /*background: #e85f5f;*/
}

#scene06 .title_wrap > li {position: absolute;}

#scene06 .title_wrap > li:nth-child(1){
    width: 206px;
    height: 60px;
    top: 0;
    left: 0;

    border-radius: 30px;
    background: #21272c;
    box-shadow: inset 7px 7px 12px #1b2024,
    inset -7px -7px 12px #272e34;
}

#scene06 .title_wrap > li:nth-child(2){
    background: #e98073;
    border-radius: 100%;
    height: 10px;
    width: 10px;

    top: 25px;
    left: 73px;
}

#scene06 .title_wrap > li:nth-child(3) {height: 60px; width: 256px; left: 100px;}

#scene06 .title_wrap > li:nth-child(3) >div{
    display: inline-block;
    color: #f5f5f5;
    font-family: "AppleSDGothicNeoB00",sans-serif;
    font-size: 30px;
    letter-spacing: 2px;

    line-height: 60px;
    vertical-align: center;
    left: 100px;
}
#scene06 .title_wrap > li:nth-child(3) >div:last-child {color: #e98073;}

#scene06 .sc06_bg {
    top: 0;
    left: 0;
    height: 1780px;
    width: 1920px;
}

#scene06 .sc06_bg > li{position: absolute;}

#scene06 .sc06_bg > li:nth-child(1) {
    height: 828px;
    width: 828px;
    background: #21272c;
    border-radius: 100%;

    box-shadow: inset 10px 10px 15px #191d21,
    inset -10px -10px 15px #293137;


    top: 293px;
    left: 546px;
}

#scene06 .sc06_bg > li:nth-child(1) > div {
    height: 742px;
    width: 742px;
    background: linear-gradient(130deg, rgba(229,94,116,1) 0%, rgba(238,126,120,1) 100%);
    border-radius: 100%;

    box-shadow: inset 10px 10px 15px #b15859,
    inset -10px -10px 15px #ff9295;

    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
#scene06 .sc06_bg .text_bg {
    color:#1e2429;
    font-family:"AppleSDGothicNeoEB00",sans-serif;
    font-weight: bold;
    font-size: 200px;
}

#scene06 .sc06_bg .t1 {
    top: 293px;
    right: 136px;

    height: 150px;
    width: 450px;
    /*background: white;*/
}

#scene06 .sc06_bg .t2 {top: 1190px; left: 6px;}

#scene06 .sc06_main {
    height: 753px;
    width: 362px;

    top: 227px;
    left: 779px;
}
#scene06 .sc06_main > li {position: absolute;}

#scene06 .sc06_main >li:nth-child(2) {
    border-radius: 60px;
    height: 753px;
    width: 362px;
}
#scene06 .sc06_main >li:nth-child(2) > div {
    height: 753px;
    width: 362px;
    position: absolute;
    border-radius: 60px;
}

#scene06 .sc06_main >li:nth-child(2) .sdw{
    background: #0f1113;
    bottom: -16px;
    right: -16px;
    filter: blur(20px);
    mix-blend-mode: multiply;
    opacity: .4;
}
#scene06 .sc06_main >li:nth-child(2) .light{
    background: #262e33;
    top: -16px;
    left: -16px;
    filter: blur(20px);
    mix-blend-mode: lighten;
    opacity: 1;
}
#scene06 .sc06_main >li:nth-child(2) > div:nth-child(3){
    /*background: tan;*/
    height: 726px;
    width: 336px;
    position: relative;
    top: 14px;
    left: 14px;

}
/*프로토타입 영상 자리입니다.*/


#scene06 .sc06_main >li:nth-child(1) {
    bottom: -500px;
    left: 14px;
}

#scene06 .sc06_main >li:nth-child(1) > div { height: 544px; width: 334px; position: absolute;}
#scene06 .sc06_main >li:nth-child(1) > div:nth-child(1) {
    background: #0f1113;
    bottom: -16px;
    right: -16px;
    filter: blur(20px);
    mix-blend-mode: multiply;
    opacity: .4;
}

#scene06 .sc06_main >li:nth-child(1) > div:nth-child(2) {
    background: #262e33;
    top: -16px;
    left: -16px;
    filter: blur(20px);
    mix-blend-mode: lighten;
    opacity: 1;
}
#scene06 .sc06_main >li:nth-child(1) > div:nth-child(3) {position: relative;}

/*구동 애드클래스 원본*/
#scene06 .sc06_walk {
    top: 442px;
    left: 360px;

    transition: all .8s;
    transform: translateX(-80px);
    opacity: 0;
}


#scene06 .sc06_walk > li {position: absolute;}
#scene06 .sc06_walk > li:nth-child(1) {
    top: 0;
    left: 0;
    border-radius: 15px;
}

#scene06 .sc06_walk > li:nth-child(1) > div {height: 712px; width: 329px; position: absolute;}
#scene06 .sc06_walk > li:nth-child(1) > div:nth-child(1) {
    background: #0f1113;
    bottom: -16px;
    right: -16px;
    filter: blur(20px);
    mix-blend-mode: multiply;
    opacity: .4;
}
#scene06 .sc06_walk > li:nth-child(1) > div:nth-child(2) {
    background: #262e33;
    top: -16px;
    left: -16px;
    filter: blur(20px);
    mix-blend-mode: lighten;
    opacity: 1;
}
#scene06 .sc06_walk > li:nth-child(1) > div:nth-child(3) {position: relative;}

#scene06 .sc06_walk > li:nth-child(1) {top: 0; left: 0;}
#scene06 .sc06_walk > li:nth-child(2) {
    height: 20px;
    width: 329px;
    /*background: #e85f5f;*/
    top: -40px;
    left: 0;

    font-family: "AppleSDGothicNeoM00" ,sans-serif;
    font-size: 20px;
    color: #f5f5f5;
    line-height: 20px;
    vertical-align: center;
    text-align: center;

    margin-left: 14px;
}

#scene06 .sc06_walk > li:nth-child(2) > div {
    position: absolute;
    top: 7px;
    left: 122px;

    width: 6px;
    height: 6px;
    border-radius: 100%;
    background: #e85f5f;
}
/*구동 애드클래스 원본*/
#scene06 .sc06_walk.on {
    transform: translateX(0);
    opacity: 1;
}

/*구동 애드클래스 원본*/
#scene06 .sc06_heart {
    top: 381px;
    right: 360px;

    transition: all .8s;
    transform: translateX(80px);
    opacity: 0;
}

#scene06 .sc06_heart> li {position: absolute;}
#scene06 .sc06_heart > li:nth-child(1) {
    top: 0;
    right: 0;
    border-radius: 15px;
}
#scene06 .sc06_heart > li:nth-child(1) > div {height: 712px; width: 329px; position: absolute;}
#scene06 .sc06_heart > li:nth-child(1) > div:nth-child(1) {
    background: #0f1113;
    bottom: -16px;
    right: -16px;
    filter: blur(20px);
    mix-blend-mode: multiply;
    opacity: .4;
}
#scene06 .sc06_heart > li:nth-child(1) > div:nth-child(2) {
    background: #262e33;
    top: -16px;
    left: -16px;
    filter: blur(20px);
    mix-blend-mode: lighten;
    opacity: 1;
}
#scene06 .sc06_heart > li:nth-child(1) > div:nth-child(3) {position: relative;}

#scene06 .sc06_heart > li:nth-child(2) {
    height: 20px;
    width: 329px;
    /*background: #e85f5f;*/
    top: -40px;
    right: 0;

    font-family: "AppleSDGothicNeoM00" ,sans-serif;
    font-size: 20px;
    color: #f5f5f5;
    line-height: 20px;
    vertical-align: center;
    text-align: center;

    margin-left: 14px;
}
#scene06 .sc06_heart > li:nth-child(2) > div {
    position: absolute;
    top: 7px;
    left: 122px;

    width: 6px;
    height: 6px;
    border-radius: 100%;
    background: #e85f5f;
}

#scene06 .sc06_heart.on {
    transform: translateX(0);
    opacity: 1;
}



#scene06 .sc06_tapbar {
    top: 1341px;
    left: 360px;

    height: 73px;
    width: 329px;
}

#scene06 .sc06_tapbar >li{position: absolute;}
#scene06 .sc06_tapbar >li:nth-child(1){top: 0; left: 0; border-radius: 15px;}

#scene06 .sc06_tapbar  > li:nth-child(1) > div {height: 73px; width: 329px; position: absolute;}
#scene06 .sc06_tapbar  > li:nth-child(1) > div:nth-child(1) {
    background: #0f1113;
    bottom: -13px;
    right: -13px;
    filter: blur(20px);
    mix-blend-mode: multiply;
    opacity: .4;
}
#scene06 .sc06_tapbar  > li:nth-child(1) > div:nth-child(2) {
    background: #262e33;
    top: -13px;
    left: -13px;
    filter: blur(20px);
    mix-blend-mode: lighten;
    opacity: 1;
}
#scene06 .sc06_tapbar  > li:nth-child(1) > div:nth-child(3) {position: relative;}
#scene06 .sc06_tapbar  > li:nth-child(1) > div:nth-child(3) >img {border-radius: 15px;}



#scene06 .sc06_tapbar >li:nth-child(2) {
    height: 20px;
    width: 329px;
    /*background: #e85f5f;*/
    top: -40px;
    left: 0;

    font-family: "AppleSDGothicNeoM00" ,sans-serif;
    font-size: 20px;
    color: #f5f5f5;
    line-height: 20px;
    vertical-align: center;
    text-align: center;

    margin-left: 14px;
}
#scene06 .sc06_tapbar > li:nth-child(2) > div {
    position: absolute;
    top: 7px;
    left: 102px;

    width: 6px;
    height: 6px;
    border-radius: 100%;
    background: #e85f5f;
}
#scene06 .sc06_tapbar > li:nth-child(3) {
    left: 0;
    bottom: -37px;
}


#scene06 .sc06_info {
    position: absolute;
    right: 360px;
}
#scene06 .info01 {top: 1036px;}
#scene06 .info02 { top: 1357px;}

/*====================================씬7===============================================*/

#scene07 {
    height: 1080px;
    background: #ff7a6b;
}

#scene07 >ul {position: absolute;}
#scene07 > div {position: absolute;}
#scene07 .title_wrap {
    top: 180px;
    left: 287px;
    width: 1259px;
    height: 60px;
}

#scene07 .title_wrap > li {position: absolute;}
#scene07 .title_wrap > li:nth-child(1){
    width: 206px;
    height: 60px;
    top: 0;
    left: 0;
    border-radius: 30px;
    background: #ff7a6b;
    box-shadow: inset 7px 7px 12px #eb7062,
    inset -7px -7px 12px #ff8474;
}

#scene07 .title_wrap > li:nth-child(2){
    background: #a92c1f;
    border-radius: 100%;
    height: 10px;
    width: 10px;
    top: 25px;
    left: 73px;
}

#scene07 .title_wrap > li:nth-child(3) {height: 60px; width: 256px; left: 100px;}
#scene07 .title_wrap > li:nth-child(3) >div{
    color: #a92c1f;
    font-family: "AppleSDGothicNeoB00",sans-serif;
    font-size: 30px;
    letter-spacing: 2px;
    line-height: 60px;
    vertical-align: center;
    left: 100px;
}
#scene07 .title_wrap > li:nth-child(3) >div:first-child {font-weight: bold;}
#scene07 .title_wrap > li:nth-child(3) >div:last-child {color: #ffffff;
    height: 33px;
    line-height: 33px;
    vertical-align: center;
}


#scene07 .sc07_typo_bg {
    font-family: "AppleSDGothicNeoEB00",sans-serif;
    font-weight: bold;
    position: absolute;

    color: #ff7a6b;

    text-shadow: 10px 8px 30px #eb7062,
    -10px -8px 30px #ff8474;
    text-align: left;
    font-size: 190px;
}
#scene07 .tbg01{
    top: 350px;
    left: 6px;
    width: 1120px;
}

#scene07 .tbg02{
    top: 840px;
    right: 208px;
    width: 1170px;
    text-align: right;
}

#scene07 .scr01 {top: 272px; left: 670px; height: 586px; width: 270px;}
#scene07 .scr02 {top: 188px; left: 980px; height: 742px; width: 270px;}

#scene07 .scr {
    box-shadow:  14px 14px 25px #cc6256,
    -14px -14px 25px #ff9280;
    border-radius: 20px;
}


#scene07 .sc07_info01 {
    width: 383px;
    height: 359px;

    top: 442px;
    left: 287px;
}
#scene07 .sc07_info01 > li {position: relative; float: left; top: 0;}
#scene07 .sc07_info01 > li:nth-child(1){margin: 0 32px 36px 36px;}
#scene07 .sc07_info01 .bar {
    box-shadow:  12px 12px 20px #cc6256,
    -12px -12px 20px #ff9280;
    border-radius: 20px
}

#scene07 .sc07_info02 {
    height: 311px;
    width: 464px;
    top: 295px;
    right: 206px;
}


#scene07 .sc07_info02 > li:first-child {
    height: 44px;
    width: 236px;
    position: absolute;
    margin-left: 123px;
    top: 0;
}
#scene07 .sc07_info02 > li:first-child > div {
    float: left;
    margin-right: 20px;
    height: 44px;
    width: 44px;
    background: #21272c;

    box-shadow:  6px 6px 10px #e66e60,
    -6px -6px 10px #ff8676;
    border-radius: 10px
}
#scene07 .sc07_info02 > li:first-child > div:last-child{margin: 0;}

#scene07 .sc07_info02 > li:last-child {
    position: absolute;
    bottom: 0;
    left: 0;
}

#scene07 .sc07_info03 {
    width: 464px;
    height: 245px;
    top: 577px;
    right: 206px;
}
#scene07 .sc07_info03 > li {position: absolute;}

#scene07 .sc07_info03 .interface {
    position: relative;
    top: 97px;
    right: 0;
    float: right;
    margin-left: 20px;

    box-shadow:  12px 12px 20px #cc6256,
    -12px -12px 20px #ff9280;
    border-radius: 20px

}

#footer {
    height: 1250px;
    width: 1920px;
    background: #21272c;
    position: relative;
}

#footer .footer_wrap {
    height: 358px;
    width: 450px;

    position: absolute;
    top: 411px;
    left: 358px;
}
#footer .footer_wrap > li {position: relative;}
#footer .footer_wrap > li:nth-child(1){margin-bottom: 40px;}

#footer .footer_wrap > li:nth-child(2){
    margin-bottom: 126px;
    height: 32px;
    width: 448px;
    /*background: yellow;*/
}
#footer .footer_wrap > li:nth-child(2) > div {
    float: left;
    font-family: "AppleSDGothicNeoEB00",sans-serif;
    font-size: 38px;
    color: #f5f5f5;
    line-height: 32px;
    vertical-align: center;
    letter-spacing: 2px;
}
#footer .footer_wrap > li:nth-child(2) > div:nth-child(1) {margin-right: 14px;}
#footer .footer_wrap > li:nth-child(2) > div:nth-child(2) {color: #f88877;}


#footer .footer_wrap > li:nth-child(3){
    height: 140px;
    width: 450px;
}
#footer .footer_wrap > li:nth-child(3) > div {
    position: relative;
    left: 0;
    top: 0;
    float: left;
    margin-bottom: 20px;

    height: 60px;
    border-radius: 30px;
    background: #21272c;
    box-shadow: inset 7px 7px 12px #1b2024,
    inset -7px -7px 12px #272e34;

    font-family: "Yoon윤고딕 750",sans-serif;
    font-size: 18px;
    color: #f5f5f5;
    line-height: 60px;
    text-align: center;
    vertical-align: center;
}

#footer .footer_wrap > li:nth-child(3) > div:nth-child(1){width: 215px;  margin-right: 20px;}
#footer .footer_wrap > li:nth-child(3) > div:nth-child(2){width: 213px;}
#footer .footer_wrap > li:nth-child(3) > div:nth-child(3){
    margin: 0;
    width: 289px;
}

#footer > div {position: absolute;}
#footer .footer_mk {top:302px; right: 274px;}
#footer .footer_mk_sdw {top: 788px; right: 0; mix-blend-mode: multiply;}