

.startPoint{
    width: 50px;
    height: 50px;
    position: fixed;
    right: 100px;
    bottom: 100px;
    z-index: 899998989;
    background: #ffffff;
    border-radius: 30px;
    border: none;
    outline: none;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    box-shadow: 2px 2px 2px 2px #0000000c;
}


.startPoint:hover{
    background: #ebebeb;
}


#section01{
   background:url(../img2/section1/bg1.png);
   Height:3743px;
}




#section01 .s1_bg1{
    width: 200px;
    height: 200px;
    position: absolute;
}





#section01 .date{
    width: 200px;
    height: 200px;
    /*Opacity:0;*/
    position: absolute;
    left: 142px;
    top: 74px;

    /*transform:translateX(100px);
    transition: all 1s;*/
}


/*#section01 .date.on{
    transform:none;
    Opacity:1;

}*/



#section01 .foot{
    width: 200px;
    height: 200px;
    /*Opacity:0;*/
    position: absolute;
    left: 628px;
    top: -817px;
    animation: mymove0 1s linear 0s infinite alternate; margin-top: 0;
    z-index:2;

}

@keyframes mymove0 {
  0% {top: -817px;}
  100% {top: -797px;}
}


/*#section01 .foot.on{
    transform:none;
    Opacity:1;

}*/


#section01 .box{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: -124px;
    top: 180px;

    transform:translate(540px,420px);
    transition: all 0.8s;
    transition-delay: 0.3s;
}


#section01 .box.on{
    transform:none;
    Opacity:1;
    z-index:1;
}


#section01 .box0{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 1287px;
    top: -120px;
    mix-blend-mode: lighten;
    transform:translate(-70px,220px);
    transition: all 0.8s;
    transition-delay: 0.3s;
}


#section01 .box0.on{
    transform:none;
    Opacity:1;
    z-index:1;
}


#section01 .box2{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 1617px;
    top: 510px;
    mix-blend-mode: hard-light;
    transform:translate(-510px,240px);
    transition: all 0.8s;
    transition-delay: 0.3s;
}


#section01 .box2.on{
    transform:none;
    Opacity:1;
    z-index:1;
}


#section01 .title{
    width: 1124px;
    height: 785px;
    Opacity:1;
    position: absolute;
    left: 400px;
    top: 372px;
    z-index: 2;
    transform: scale(0.9,0.9);
    transition: all 0.5s;
}


#section01 .title.on{
    transform:none;
    Opacity:1;

}

#section01 .badge1{
    width: 520px;
    height: 508px;
    Opacity:0;
    position: absolute;
    left: 672px;
    top: 502px;

    transform: scale(0.1) scale(2.5);
    transition: all 0.5s;
    transition-delay: 0.8s;
}


#section01 .badge1.on{
    transform:none;
    Opacity:1;
    z-index:3;

}


#section01 .deco1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 120px;
    top: 588px;
    transform: scale(0.8);
    transition: all 0.5s;
}


/*#section01 .deco1.on{
    transform:none;
    Opacity:1;

}*/


#section01 .deco2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1520px;
    top: 856px;

    transform: scale(0.8);
    transition: all 0.5s;
}


/*#section01 .deco2.on{
    transform:none;
    Opacity:1;
}*/


#section01 .hands{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: -150px;
    top: 996px;

    transform:translateY(-100px);
    transition: all 1s;
}


#section01 .hands.on{
    transform:none;
    Opacity:1;

}


#section01 .title3{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 600px;
    top: 1220px;

    transform:translateY(-50px);
    transition: all 0.5s;
}


#section01 .title3.on{
    transform:none;
    Opacity:1;
    z-index:1;
}


#section01 .title2{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 688px;
    top: 1390px;

    transform:translateY(-50px);
    transition: all 0.5s;
}


#section01 .title2.on{
    transform:none;
    Opacity:1;
    z-index:1;
}


#section01 .ellipse2{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 1170px;
    top: 1230px;
    mix-blend-mode: darken;
    transform: scale(0.1) scale(2.5);
    transition: all 0.8s;
}


#section01 .ellipse2.on{
    transform:none;
    Opacity:1;
}


#section01 .deco3{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 630px;
    top: 1340px;

    transform: scale(0.1) scale(2.5);
    transition: all 0.8s;
}


#section01 .deco3.on{
    transform:none;
    Opacity:1;
}


#section01 .lightbg{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 294px;
    top: 1670px;
    mix-blend-mode: multiply;

    /*transform:translateX(100px);
    transition: all 1s;*/
}


/*#section01 .lightbg.on{
    transform:none;
    Opacity:1;
}*/


#section01 .light1{
    width: 382px;
    height: 137px;
    Opacity:0.2;
    position: absolute;
    left: 376px;
    top: 1670px;
    mix-blend-mode: multiply;
    /*transform: scale(0.1) scale(2.5);
    transition: all 0.5s;*/
    animation: blink-effect 1.5s step-end infinite;
}

@keyframes blink-effect {
  50% {
    opacity: 0;
  }
}



/*#section01 .light1.on{
    transform:none;
    Opacity:0.2;
    z-index:1;
}*/


#section01 .light2{
    width: 382px;
    height: 137px;
    Opacity:0;
    position: absolute;
    left: 1074px;
    top: 1855px;
    mix-blend-mode: multiply;
    /*transform: scale(0.1) scale(2.5);
    transition: all 0.5s;*/
    animation: blink-effect2 1.3s step-end infinite;
}

@keyframes blink-effect2 {
  50% {
    opacity: 0.2;
  }
}



#section01 .light3{
    width: 382px;
    height: 137px;
    Opacity:0.2;
    position: absolute;
    left: 305px;
    top: 2035px;
    mix-blend-mode: multiply;
    /*transform: scale(0.1) scale(2.5);
    transition: all 0.5s;*/
    animation: blink-effect3 1s step-end infinite;
}

@keyframes blink-effect3 {
  50% {
    opacity: 0;
  }
}



#section01 .ch2{
    width: 564px;
    height: 715px;

    position: absolute;
    left: 615px;
    top: 2070px;
    transform:translateX(100px);
    transition: all 1s;
    animation: mymove 1s linear 0s infinite alternate; margin-top: 0;
    z-index:2;
}

@keyframes mymove {
	0% {top: 2070px;}
	100% {top: 2050px;}
}


/*#section01 .ch2.on{
    transform:none;
    Opacity:1;
}*/


#section01 .deco4{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 390px;
    top: 2320px;

    transform: scale(0.1) scale(2.5);
    transition: all 0.5s;
}


#section01 .deco4.on{
    transform:none;
    Opacity:1;
    z-index:1;
}


#section01 .deco5{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 390px;
    top: 2418px;

    transform: scale(0.1) scale(2.5);
    transition: all 0.5s;
}


#section01 .deco5.on{
    transform:none;
    Opacity:1;
    z-index:1;
}


#section01 .deco6{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 390px;
    top: 2517px;

    transform: scale(0.1) scale(2.5);
    transition: all 0.5s;
}


#section01 .deco6.on{
    transform:none;
    Opacity:1;
    z-index:1;
}


#section01 .balloon1{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: -140px;
    top: 1347px;
    mix-blend-mode: luminosity;
    transform:translateY(200px);
    transition: all 0.7s;
}


#section01 .balloon1.on{
    transform:none;
    Opacity:1;
    z-index:1;
}


#section01 .balloon2{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 60px;
    top: 1565px;

    transform:translateY(100px);
    transition: all 0.7s;
}


#section01 .balloon2.on{
    transform:none;
    Opacity:1;
}


#section01 .bubble{
    width: 2034px;
    height: 1005px;
    Opacity:0;
    position: absolute;
    left: -270px;
    top: 1375px;

    transform: scale(0.8);
    transition: all 1s;
}


#section01 .bubble.on{
    transform:none;
    Opacity:0.8;
}


#section01 .cloud{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: -70px;
    top: 2195px;

    transform:translateX(100px);
    transition: all 1s;
}


#section01 .cloud.on{
    transform:none;
    Opacity:1;
}


#section01 .cloud2{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: -280px;
    top: 2298px;

    transform:translateX(100px);
    transition: all 1s;
}


#section01 .cloud2.on{
    transform:none;
    Opacity:1;
    z-index:3;
}


#section01 .bg1{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 0px;
    top: 2726px;

    transform:translateX(100px);
    transition: all 1s;
}


#section01 .bg1.on{
    transform:none;
    Opacity:1;
    z-index:1;
}


#section01 .txt1{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 205px;
    top: 3078px;

    transform:translateX(100px);
    transition: all 1s;
}


#section01 .txt1.on{
    transform:none;
    Opacity:1;
    z-index:1;
}



#section01 .txt2{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 202px;
    top: 3172px;

    transform:translateX(100px);
    transition: all 1s;
}


#section01 .txt2.on{
    transform:none;
    Opacity:1;
    z-index:1;
}


#section01 .subject{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 148px;
    top: 2882px;

    transform: scale(0.1) scale(2);
    transition: all 0.5s;
}


#section01 .subject.on{
    transform:none;
    Opacity:1;
    z-index:3;
}


#section01 .badge2{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 1428px;
    top: 2612px;

    transform: scale(1.2);
    transition: all 1s;
}


#section01 .badge2.on{
    transform:none;
    Opacity:1;
    z-index:1;
}


#section01 .sidetxt{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 1790px;
    top: 2182px;

    transform:translateX(100px);
    transition: all 1s;
}


#section01 .sidetxt.on{
    transform:none;
    Opacity:1;
    z-index:3;
}


#section01 .deco7{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 1310px;
    top: 2352px;

    transform: scale(0.1) scale(2.5);
    transition: all 0.5s;
}


#section01 .deco7.on{
    transform:none;
    Opacity:1;
}


#section01 .deco8{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1424px;
    top: 2192px;

    transform:translateX(100px);
    transition: all 1s;
}


/*#section01 .deco8.on{
    transform:none;
    Opacity:1;
}*/


#section01 .bar{
    width: 200px;
    height: 200px;
    Opacity:0;
    position: absolute;
    left: 669px;
    top: 1488px;

    transform:translateX(100px);
    transition: all 1s;
}


#section01 .bar.on{
    transform:none;
    Opacity:1;
}





#section02{
   background:url(../img2/section2/section2.png);
   Height:2300px;
}




#section02 .s2_title1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 148px;
    top: 140px;

    transform: scale(0.1) scale(2);
    transition: all 0.5s;
}


#section02 .s2_title1.on{
    transform:none;

}


#section02 .s2_subtitle1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 212px;
    top: 312px;
    opacity: 0;

    transform:translateY(-10px);
    transition: all 0.5s;
}


#section02 .s2_subtitle1.on{
    transform:none;
    opacity: 1;

}


#section02 .research1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 159px;
    top: 414px;
    opacity: 0;

    transform:translateY(-20px);
    transition: all 0.5s;
}


#section02 .research1.on{
    transform:none;
    opacity: 1;

}




#section02 .research2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 704px;
    top: 414px;
    opacity: 0;

    transform:translateY(-20px);
    transition: all 0.5s;
}


#section02 .research2.on{
    transform:none;
    opacity: 1;

}



#section02 .research3{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1249px;
    top: 414px;
    opacity: 0;

    transform:translateY(-20px);
    transition: all 0.5s;
}


#section02 .research3.on{
    transform:none;
    opacity: 1;

}


#section02 .s2_popup1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 433px;
    top: 442px;
    opacity: 0;

    transform: scale(0.1) scale(2.5);
    transition: all 0.3s;
}


#section02 .s2_popup1.on{
    transform:none;
    opacity: 1;

}


#section02 .s2_popup2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 977px;
    top: 442px;
    opacity: 0;

    transform: scale(0.1) scale(2.5);
    transition: all 0.3s;
}


#section02 .s2_popup2.on{
    transform:none;
    opacity: 1;

}




#section02 .s2_popup3{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1524px;
    top: 442px;
    opacity: 0;

    transform: scale(0.1) scale(2.5);
    transition: all 0.3s;
}


#section02 .s2_popup3.on{
    transform:none;
    opacity: 1;

}



#section02 .s2_arrow{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 936px;
    top: 1105px;
    opacity: 0;

    transform: translateY(-30px);
    transition: all 0.5s;
}


#section02 .s2_arrow.on{
    transform:none;
    opacity: 1;

}



#section02 .s2_triangle{
    width: 87px;
    height: 58px;
    position: absolute;
    left: 917px;
    top: 1193px;
    opacity: 0;

    transform: scale(0.1) scale(2.5);
    transition: all 0.3s;
}


#section02 .s2_triangle.on{
    transform:none;
    opacity: 1;

}


#section02 .s2_txt1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 431px;
    top: 1280px;
    opacity: 0;

    transform: translateY(-30px);
    transition: all 0.3s;
}


#section02 .s2_txt1.on{
    transform:none;
    opacity: 1;

}



#section02 .god1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1560px;
    top: 1190px;
    mix-blend-mode: luminosity;

    transform: translateX(100px);
    transition: all 2s;
    transition-timing-function: ease;
}


#section02 .god1.on{
    transform:none;

}


#section02 .god2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -30px;
    top: 1480px;
    mix-blend-mode: luminosity;

    transform: translateX(-100px);
    transition: all 2s;
    transition-timing-function: ease;
}


#section02 .god2.on{
    transform:none;

}


#section02 .s2_bubble1{
    width: 819px;
    height: 331px;
    position: absolute;
    left: 520px;
    top: 1648px;
    opacity: 0;

    transform: scale(0.1) scale(2.5);
    transition: all 1s;
    z-index: 1;
}


#section02 .s2_bubble1.on{
    transform:none;
    opacity: 1;
}


#section02 .s2_bubble2{
    width: 1490px;
    height: 611px;
    position: absolute;
    left: 220px;
    top: 1528px;
    opacity: 0;

    transform: scale(0.1) scale(2.5);
    transition: all 0.5s;
    z-index: 2;
}


#section02 .s2_bubble2.on{
    transform:none;
    opacity: 1;
}





#section03{
   background:url(../img2/section3/bg.png);
   Height:4300px;
}


#section03 .s3_balloon1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 60px;
    top: -120px;
    opacity: 0;
    transform: scale(0.1) scale(2.5);
    transition: all 0.5s;
    z-index: 1;
    transition-timing-function: ease;
}


#section03 .s3_balloon1.on{
    transform:none;
    opacity: 1;

}



#section03 .s3_title1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 144px;
    top: 136px;
    opacity: 0;
    transform: scale(0.1) scale(2);
    transition: all 0.5s;
}


#section03 .s3_title1.on{
    transform:none;
    opacity: 1;

}


#section03 .s3_subtitle1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 213px;
    top: 317px;
    opacity: 0;
    transform:translateY(-10px);
    transition: all 0.5s;
}


#section03 .s3_subtitle1.on{
    transform:none;
    opacity: 1;

}


#section03 .s3_box{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 123px;
    top: 237px;
    opacity: 0;
    transform:translateX(500px);
    transition: all 0.5s;
}


#section03 .s3_box.on{
    transform:none;
    opacity: 1;

}


#section03 .kim{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 292px;
    top: 467px;
    opacity: 0;
    transform:translateX(500px);
    transition: all 0.5s;
}


#section03 .kim.on{
    transform:none;
    opacity: 1;

}




#section03 .kim2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 315px;
    top: 737px;
    opacity: 0;
    transform:translateX(500px);
    transition: all 0.5s;
}


#section03 .kim2.on{
    transform:none;
    opacity: 1;

}




#section03 .s3_popup1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1036px;
    top: 474px;
    opacity: 0;
    transform:scale(0.1) scale(2.5);
    transition: all 0.5s;
    transition-delay: 0.3s;
}


#section03 .s3_popup1.on{
    transform:none;
    opacity: 1;

}


#section03 .s3_popup2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1326px;
    top: 674px;
    opacity: 0;
    transform:scale(0.1) scale(2.5);
    transition: all 0.5s;
    transition-delay: 0.5s;
}


#section03 .s3_popup2.on{
    transform:none;
    opacity: 1;

}


#section03 .s3_popup3{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 850px;
    top: 830px;
    opacity: 0;
    transform:scale(0.1) scale(2.5);
    transition: all 0.5s;
    transition-delay: 0.7s;
}


#section03 .s3_popup3.on{
    transform:none;
    opacity: 1;

}



#section03 .s3_popup4{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1230px;
    top: 995px;
    opacity: 0;
    transform:scale(0.1) scale(2.5);
    transition: all 0.5s;
    transition-delay: 0.9s;
}


#section03 .s3_popup4.on{
    transform:none;
    opacity: 1;

}


#section03 .s3_title2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 144px;
    top: 1310px;
    opacity: 0;
    transform:scale(0.1) scale(2.5);
    transition: all 0.5s;
}


#section03 .s3_title2.on{
    transform:none;
    opacity: 1;

}


#section03 .s3_subtitle2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 213px;
    top: 1491px;
    opacity: 0;
    transform:translateX(-10px);
    transition: all 0.5s;
}


#section03 .s3_subtitle2.on{
    transform:none;
    opacity: 1;

}


#section03 .map{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 113px;
    top: 1671px;
}



#section03 .mapbg{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1493px;
    top: 1671px;
    transform:translateX(-1380px);
    transition: all 2s;
}

#section03 .mapbg.on{
    transform:none;

}


#section03 .s3_ch1{
    width: 490px;
    height: 418px;
    position: absolute;
    left: 1453px;
    top: 1354px;
    transition: all 0.8s;
    animation: s3_ch1 1s linear 0s infinite alternate; margin-top: 0;
}


@keyframes s3_ch1 {
  0% {top: 1354px;}
  100% {top: 1374px;}
}



#section03 .s3_title3{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 144px;
    top: 2521px;
    transform:scale(0.1) scale(2.5);
    transition: all 0.5s;
    opacity: 0;
}

#section03 .s3_title3.on{
    transform:none;
    opacity: 1;
}


#section03 .s3_subtitle3{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 213px;
    top: 2702px;
    transform:translateY(-10px);
    transition: all 0.5s;
    opacity: 0;
}

#section03 .s3_subtitle3.on{
    transform:none;
    opacity: 1;
}


#section03 .painpoint{
    width: 1623px;
    height: 497px;
    position: absolute;
    left: 170px;
    top: 2808px;
    transform:translateY(-30px);
    transition: all 0.5s;
    opacity: 0;
}

#section03 .painpoint.on{
    transform:none;
    opacity: 1;
}



#section03 .s3_title4{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 144px;
    top: 3400px;
    transform:scale(0.1) scale(2.5);
    transition: all 0.5s;
    opacity: 0;
}

#section03 .s3_title4.on{
    transform:none;
    opacity: 1;
}



#section03 .mission{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 200px;
    top: 3630px;
    transform:translateX(-30px);
    transition: all 0.5s;
    opacity: 0;
    transition-delay: 0.5s;
}

#section03 .mission.on{
    transform:none;
    opacity: 1;

}


#section03 .s3_ch2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1240px;
    top: 3728px;
    transform:translateX(530px);
    transition: all 0.5s;
}

#section03 .s3_ch2.on{
    transform:none;


}



#section03 .s3_check1{
    width: 38px;
    height: 38px;
    position: absolute;
    left: 1126px;
    top: 3712px;
    transform:scale(0.1) scale(3);
    transition: all 0.5s;
    transition-delay: 0.8s;
    opacity: 0;
}

#section03 .s3_check1.on{
    transform:none;
    opacity: 1;
}



#section03 .s3_check2{
    width: 38px;
    height: 38px;
    position: absolute;
    left: 1144px;
    top: 3826px;
    transform:scale(0.1) scale(3);
    transition: all 0.5s;
    transition-delay: 0.8s;
    opacity: 0;
}

#section03 .s3_check2.on{
    transform:none;
    opacity: 1;
}



#section03 .s3_deco1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1654px;
    top: 2606px;
    z-index: -1;

}

/*section4*/


#section04{
   background:url(../img2/section4/bg.png);
   Height:2855px;
   top:-600px;
   z-index: -1;
}


#section04 .s4_title{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 144px;
    top: 630px;
    transform:scale(0.1) scale(2.5);
    transition: all 0.5s;
    opacity: 0;
}

#section04 .s4_title.on{
    transform:none;
    opacity: 1;
}


#section04 .s4_subtitle{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 213px;
    top: 800px;
    transform:translateY(-10px);
    transition: all 0.5s;
    opacity: 0;
    transition-delay: 0.3s;
}

#section04 .s4_subtitle.on{
    transform:none;
    opacity: 1;
}


#section04 .thumb{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1583px;
    top: 840px;
    transform:translateX(1000px);
    transition: all 0.8s;
    mix-blend-mode: lighten;

}

#section04 .thumb.on{
    transform:none;
}


#section04 .canvas{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 146px;
    top: 876px;
    transform:translateY(-100px);
    transition: all 0.5s;
    opacity: 0;

}

#section04 .canvas.on{
    transform:none;
    opacity: 1;
}


#section05 .s4_ch1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 24px;
    top: -851px;
    transition: all 0.5s;
    animation: s4_ch1 1s linear 0s infinite alternate; margin-top: 0;
    z-index: 100;

}

@keyframes s4_ch1 {
  0% {top: -851px;}
  100% {top: -831px;}
}




#section05{
   background:url(../img2/section5/bg.png);
   Height:4080px;
   margin-top: -1000px;
}



#section05 .s5_arrow1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 937px;
    top: 150px;
    transform:translateY(-50px);
    transition: all 1s;
    opacity: 0;
}

#section05 .s5_arrow1.on{
    transform:none;
    opacity: 1;
}


#section05 .s5_title1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 144px;
    top: 264px;
    transform:scale(0.1) scale(2.5);
    transition: all 0.5s;
    opacity: 0;
}

#section05 .s5_title1.on{
    transform:none;
    opacity: 1;
}


#section05 .s5_subtitle1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 212px;
    top: 446px;
    transform:translateY(-10px);
    transition: all 0.5s;
    opacity: 0;
}

#section05 .s5_subtitle1.on{
    transform:none;
    opacity: 1;
}


#section05 .interview{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 150px;
    top: 626px;
    transform:translateX(-30px);
    transition: all 0.5s;
    opacity: 0;
    transition-timing-function: ease;
}

#section05 .interview.on{
    transform:none;
    opacity: 1;
}


#section05 .s5_user1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1084px;
    top: 404px;
    transform:scale(0.1) scale(2.5);
    transition: all 0.5s;
    opacity: 0;
}

#section05 .s5_user1.on{
    transform:none;
    opacity: 1;
}


#section05 .s5_user2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1178px;
    top: 635px;
    transform:scale(0.1) scale(2.5);
    transition: all 0.5s;
    opacity: 0;
}

#section05 .s5_user2.on{
    transform:none;
    opacity: 1;
}



#section05 .s5_user3{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1084px;
    top: 866px;
    transform:scale(0.1) scale(2.5);
    transition: all 0.5s;
    opacity: 0;
}

#section05 .s5_user3.on{
    transform:none;
    opacity: 1;
}


#section05 .s5_user4{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1070px;
    top: 1144px;
    transform:scale(0.1) scale(2.5);
    transition: all 0.5s;
    opacity: 0;
}

#section05 .s5_user4.on{
    transform:none;
    opacity: 1;
}



#section05 .s5_arrow2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 937px;
    top: 1460px;
    transform:translateY(-50px);
    transition: all 1s;
    opacity: 0;
}

#section05 .s5_arrow2.on{
    transform:none;
    opacity: 1;
}


#section05 .s5_contents{
    width: 1520px;
    height: 493px;
    position: absolute;
    left: 208px;
    top: 1590px;
    transform:scale(0.1) scale(2.5);
    transition: all 0.8s;
    opacity: 0;
}

#section05 .s5_contents.on{
    transform:none;
    opacity: 1;
}


#section05 .s5_deco1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 114px;
    top: 2240px;
    animation: s5_deco1 0.8s linear 0s infinite alternate; margin-top: 0;
}

@keyframes s5_deco1 {
  0% {top: 2240px;}
  100% {top: 2260px;}
}



#section05 .s5_title2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 144px;
    top: 2738px;
    transform:scale(0.1) scale(2.5);
    transition: all 0.5s;
    opacity: 0;
}

#section05 .s5_title2.on{
    transform:none;
    opacity: 1;
}


#section05 .s5_subtitle2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 212px;
    top: 2890px;
    transform:translateY(-10px);
    transition: all 0.5s;
    opacity: 0;
}

#section05 .s5_subtitle2.on{
    transform:none;
    opacity: 1;
}


#section05 .positioning{
    width: 1100px;
    height: 854px;
    position: absolute;
    left: 160px;
    top: 3010px;
    transform:scale(1.1);
    transition: all 0.5s;
    z-index: 1;
}

#section05 .positioning.on{
    transform:none;
}



#section05 .s5_deco2{
    width: 124px;
    height: 124px;
    position: absolute;
    left: 970px;
    top: 2950px;
    transform: translateX(-100px) translateY(50px) rotate(-60deg);
    transition: all 0.8s;
    z-index: 2;
    transition-delay: 0.3s;
    transition-timing-function: ease-out;
}

#section05 .s5_deco2.on{
    transform:none;
}



#section05 .s5_deco3{
    width: 177px;
    height: 177px;
    position: absolute;
    left: 80px;
    top: 3590px;
    transform: translateX(50px) translateY(-20px) rotate(50deg);
    transition: all 0.8s;
    z-index: 2;
    transition-delay: 0.3s;
    transition-timing-function: ease-out;
}

#section05 .s5_deco3.on{
    transform:none;
}



#section05 .s5_deco4{
    width: 121px;
    height: 121px;
    position: absolute;
    left: 1170px;
    top: 3640px;
    transform: translateX(-100px) translateY(-50px) rotate(-80deg);
    transition: all 0.8s;
    z-index: 2;
    transition-delay: 0.3s;
    transition-timing-function: ease-out;
}

#section05 .s5_deco4.on{
    transform:none;
}


#section05 .s5_case{
    width: 250px;
    height: 195px;
    position: absolute;
    left: 920px;
    top: 3092px;
    transform: scale(0.1) scale(2.5);
    transition: all 0.8s;
    z-index: 3;
    opacity: 0;
}

#section05 .s5_case.on{
    transform:none;
    opacity: 1;
}


#section05 .s5_decotxt{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1070px;
    top: 3030px;
    transform:translateX(300px);
    transition: all 1s;
}

#section05 .s5_decotxt.on{
    transform:none;
}


#section05 .s5_decohand{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1320px;
    top: 3353px;
    transform:translateY(200px);
    transition: all 1s;
    z-index: 1;
}

#section05 .s5_decohand.on{
    transform:none;
}


#section05 .s5_decoball{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1682px;
    top: 3150px;
    animation: s5_decoball 0.8s linear 0s infinite alternate; margin-top: 0;
}

@keyframes s5_decoball {
  0% {top: 3150px;}
  100% {top: 3192px;}
}



#section06{
   background:url(../img2/section6/bg.png);
   Height:5571px;
}


#section06 .s6_main{
    width: 334px;
    height: 219px;
    position: absolute;
    left: 804px;
    top: 265px;
    transform:scale(0.8);
    transition: all 1s;
    mix-blend-mode: hard-light;
    transition-timing-function: ease;
}

#section06 .s6_main.on{
    transform:none;
    z-index: 1;
}



#section06 .s6_minimain{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 839px;
    top: 200px;
    transform:translateY(-10px);
    transition: all 0.5s;
    opacity: 0;
}

#section06 .s6_minimain.on{
    transform:none;
    opacity: 1;
}


#section06 .s6_badge{
    width: 257px;
    height: 252px;
    position: absolute;
    left: 1072px;
    top: 147px;
    transform:scale(0.1) scale(2.5);
    transition: all 0.5s;
}

#section06 .s6_badge.on{
    transform:none;
    z-index: 2;
}


#section06 .s6_maindeco{
    width: 518px;
    height: 100px;
    position: absolute;
    left: 712px;
    top: 355px;
    transform:scale(0.8);
    transition: all 0.8s;
    mix-blend-mode: multiply;
    transition-timing-function: ease;
}

#section06 .s6_maindeco.on{
    transform:none;
}



#section06 .s6_submain{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 766px;
    top: 552px;
    transform:translateY(-10px);
    transition: all 0.5s;
    opacity: 0;
}

#section06 .s6_submain.on{
    transform:none;
    opacity: 1;
}



#section06 .s6_box1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -44px;
    top: 60px;
    transition: all 0.8s;
    transform: translate(-400px, -210px);
    opacity: 0;
    z-index: 1;
}


#section06 .s6_box1.on{
    transform:none;
    Opacity:1;
}


#section06 .s6_box2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1650px;
    top: 450px;
    transition: all 0.8s;
    transform: translate(420px, -120px);
    opacity: 0;
    z-index: 1;
}


#section06 .s6_box2.on{
    transform:none;
    Opacity:1;
}


#section06 .s6_box3{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 100px;
    top: 880px;
    transition: all 0.8s;
    transform: translate(-160px, 140px);
    opacity: 0;
    z-index: 1;
}


#section06 .s6_box3.on{
    transform:none;
    Opacity:1;
}


#section06 .s6_smile{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1310px;
    top: 680px;
    transition: all 0.5s;
    transform: translateY(100px);
    opacity: 0;
    mix-blend-mode: luminosity;
}


#section06 .s6_smile.on{
    transform:none;
    Opacity:1;
}


#section06 .s6_mockup1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -190px;
    top: 690px;
    transition: all 0.5s;
    transform: translateY(-300px);
    opacity: 0;
    transition-timing-function: ease;
}


#section06 .s6_mockup1.on{
    transform:none;
    Opacity:1;
    z-index: 1;
}


#section06 .s6_mockup1_sd{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -190px;
    top: 690px;
    transition: all 0.5s;
    transform: translateY(-300px);
    opacity: 0;
    transition-timing-function: ease;
    mix-blend-mode: multiply;
}


#section06 .s6_mockup1_sd.on{
    transform:none;
    Opacity:1;
}







#section06 .s6_mockup2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 360px;
    top: 1230px;
    transition: all 0.5s;
    transform: translate(350px, -160px);
    opacity: 0;
    transition-timing-function: ease;
}


#section06 .s6_mockup2.on{
    transform:none;
    Opacity:1;
}


#section06 .s6_mockup2_sd{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 360px;
    top: 1230px;
    transition: all 0.5s;
    transform: translate(350px, -160px);
    opacity: 0;
    transition-timing-function: ease;
    mix-blend-mode: multiply;
}


#section06 .s6_mockup2_sd.on{
    transform:none;
    Opacity:1;
}





#section06 .s6_mockup3{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 390px;
    top: 1761px;
    transition: all 0.5s;
    transform: translate(-380px, 180px);
    opacity: 0;
    transition-timing-function: ease;
}


#section06 .s6_mockup3.on{
    transform:none;
    Opacity:1;
}


#section06 .s6_mockup3_sd{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 390px;
    top: 1761px;
    transition: all 0.5s;
    transform: translate(-380px, 180px);
    opacity: 0;
    transition-timing-function: ease;
    mix-blend-mode: multiply;
}


#section06 .s6_mockup3_sd.on{
    transform:none;
    Opacity:1;
}




#section06 .s6_mockup4{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 120px;
    top: 670px;
    transition: all 0.5s;
    transform: translate(-290px, -140px);
    opacity: 0;
    transition-timing-function: ease;
}


#section06 .s6_mockup4.on{
    transform:none;
    Opacity:1;
}


#section06 .s6_mockup4_sd{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 120px;
    top: 670px;
    transition: all 0.5s;
    transform: translate(-290px, -140px);
    opacity: 0;
    transition-timing-function: ease;
    mix-blend-mode: multiply;
}


#section06 .s6_mockup4_sd.on{
    transform:none;
    Opacity:1;
}



#section06 .s6_plot{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 140px;
    top: 1651px;
    transition: all 0.8s;
    transform: translate(-180px, 80px);
    opacity: 0;
    transition-timing-function: ease-in-out;

}


#section06 .s6_plot.on{
    transform:none;
    Opacity:1;
    z-index: 1;
}


#section06 .s6_title1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 750px;
    top: 2646px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}


#section06 .s6_title1.on{
    transform:none;
    Opacity:1;
}


#section06 .s6_subtitle1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 721px;
    top: 2784px;
    transition: all 0.5s;
    transform: translateY(-10px);
    opacity: 0;

}


#section06 .s6_subtitle1.on{
    transform:none;
    Opacity:1;
}


#section06 .s6_subsubtitle1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 706px;
    top: 2890px;
    transition: all 0.5s;
    transform: translateY(-10px);
    opacity: 0;

}


#section06 .s6_subsubtitle1.on{
    transform:none;
    Opacity:1;
}



#section06 .s6_at{
    width: 86px;
    height: 58px;
    position: absolute;
    left: 634px;
    top: 2730px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}


#section06 .s6_at.on{
    transform:none;
    Opacity:1;
}



#section06 .s6_wave1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1784px;
    top: 2940px;
    transition: all 0.5s;
    transform: translateX(50px);

}


#section06 .s6_wave1.on{
    transform:none;
}



#section06 .s6_wave2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -56px;
    top: 3060px;
    transition: all 0.5s;
    transform: translateX(-50px);

}


#section06 .s6_wave2.on{
    transform:none;
}


#section06 .s6_iphone1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 70px;
    top: 2960px;
    z-index: 1;
}

/*video*/

#section06 .s6_iphone_video{
  position: absolute;
  width: 344px;
  height: 830px;
  top: 2985px;
  left: 235px;
}


#section06 .s6_iphone_video video{
  width: 344px;
  height: 830px;

}

/*video*/



#section06 .s6_screen1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 595px;
    top: 3110px;
    transition: all 0.5s;
    transform: translateY(-150px);
    transition-timing-function: ease;
    opacity: 0;
}


#section06 .s6_screen1.on{
    transform:none;
    z-index: 1;
    opacity: 1;
}



#section06 .s6_screen1_sd{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 595px;
    top: 3110px;
    transition: all 0.5s;
    transform: translateY(-150px);
    transition-timing-function: ease;
    opacity: 0;
}


#section06 .s6_screen1_sd.on{
    transform:none;
    opacity: 1;
}


#section06 .s6_title2{
    width: 354px;
    height: 111px;
    position: absolute;
    left: 782px;
    top: 4077px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;
}


#section06 .s6_title2.on{
    transform:none;
    opacity: 1;
}


#section06 .s6_subtitle2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 692px;
    top: 4217px;
    transition: all 0.5s;
    transform: translateY(-10px);
    opacity: 0;
}


#section06 .s6_subtitle2.on{
    transform:none;
    opacity: 1;
}





#section06 .s6_blink1{
    width: 382px;
    height: 137px;
    Opacity:1;
    position: absolute;
    left: 346px;
    top: 3968px;
    animation: s6_blink-effect1 1s step-end infinite;
}

@keyframes s6_blink-effect1 {
  50% {
    opacity: 0;
  }
}


#section06 .s6_blink2{
    width: 382px;
    height: 137px;
    Opacity:0;
    position: absolute;
    left: 246px;
    top: 4060px;
    animation: s6_blink-effect2 0.5s step-end infinite;
}

@keyframes s6_blink-effect2 {
  50% {
    opacity: 1;
  }
}


#section06 .s6_blink3{
    width: 382px;
    height: 137px;
    Opacity:1;
    position: absolute;
    left: 506px;
    top: 3960px;
    animation: s6_blink-effect3 0.7s step-end infinite;
}

@keyframes s6_blink-effect3 {
  50% {
    opacity: 0;
  }
}


.s6_iphone_video2 {
  width: 360px;
  height: 739px;
  position: absolute;
  overflow: hidden;
  border-radius: 36px 36px 36px 36px;
  top:4770px;
  left:168px;
}

#section06 .s6_iphone_video2 video{
  margin-top: -2px;
  width: 362px;
  height: auto;
}



.s6_iphone_video3 {
  width: 360px;
  height: 739px;
  position: absolute;
  overflow: hidden;
  border-radius: 36px 36px 36px 36px;
  top:4610px;
  left:1390px;
}

#section06 .s6_iphone_video3 video{
  margin-top: -2px;
  width: 362px;
  height: auto;
}


#section06 .s6_iphone2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 472px;
    top: 4500px;
    transition: all 1s;
    transform: translateY(400px);
    transition-timing-function: ease;
}


#section06 .s6_iphone2.on{
    transform:none;
}


#section06 .s6_line{
    width: 950px;
    height: 740px;
    position: absolute;
    left: 514px;
    top: 4762px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
}


#section06 .s6_line.on{
    transform:none;
}


#section06 .s6_elipse2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 218px;
    top: 4462px;
}


#section06 .s6_multiply{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 0;
    top: 5469px;
    mix-blend-mode: multiply;
}



#section07{
   background:url(../img2/section7/bg.png);
   Height:5445px;
}


#section07 .s7_title1{
    width: 520px;
    height: 167px;
    position: absolute;
    left: 378px;
    top: 180px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
}


#section07 .s7_title1.on{
    transform:none;
}


#section07 .s7_txt1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 380px;
    top: 362px;
    transition: all 0.8s;
    transform: translateY(-20px);
    opacity: 0;
}


#section07 .s7_txt1.on{
    transform:none;
    opacity: 1;
}


#s7video1{
  position: absolute;
  left: -5px;
  top: -2px;
  z-index: 1;

}


#section07 .s7_iphone1_frame{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 376px;
    top: 548px;
    z-index: 2;
}


#section07 .s7_iphone1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 222px;
    top: 470px;
    mix-blend-mode: multiply;
}


.s7_iphone1_video {
  width: 415px;
  height: 879px;
  position: absolute;
  overflow: hidden;
  border-radius: 44px 44px 44px 44px;
  top:566px;
  left:392px;
}

#section07 .s7_iphone1_video video{
  width: 418px;
  height: auto;
}


/*videoset*/

#s7video2 {
  position: absolute;
  left: 705px;
  top: 519px;
  z-index: 1;
}

#section07 .s7_iphone2_frame{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 376px;
    top: 548px;
    z-index: 2;
}


#section07 .s7_iphone2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 222px;
    top: 470px;
    mix-blend-mode: multiply;
}


.s7_iphone2_video {
  width: 415px;
  height: 879px;
  position: absolute;
  overflow: hidden;
  border-radius: 44px 44px 44px 44px;
  top:566px;
  left:392px;
}

#section07 .s7_iphone2_video video{
  width: 418px;
  height: auto;
}
/*videoset*/


#section07 .gage_before{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1628px;
    top: 1056px;
}


#section07 .gage_after{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1634px;
    top: 1313px;
    transition: all 0.5s;
    transform: translateY(200px);
    transition-timing-function: ease;
}


#section07 .gage_after.on{
    transform:none;
}


#section07 .s7_decoball{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 122px;
    top: 803px;
    transition: all 0.5s;
    transform: translate(-150px, 150px);
    z-index: 2;
    opacity: 0;
}


#section07 .s7_decoball.on{
    transform:none;
    opacity: 1;
}


#section07 .s7_decoch{
    width: 479px;
    height: 220px;
    position: absolute;
    left: 230px;
    top: 1693px;
    transition: all 0.8s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;
}


#section07 .s7_decoch.on{
    transform:none;
    opacity: 1;
}


#section07 .s7_decoch2{
    width: 367px;
    height: 56px;
    position: absolute;
    left: 310px;
    top: 1927px;
    transition: all 0.8s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;
}


#section07 .s7_decoch2.on{
    transform:none;
    opacity: 1;
}


#section07 .s7_finger{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1290px;
    top: 1867px;
    animation: s7_finger 0.8s linear 0s infinite alternate; margin-top: 0;
    z-index: 2;
}

@keyframes s7_finger {
0% {top: 1855px;}
100% {top: 1867px;}
}


#section07 .s7_explain1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 820px;
    top: 638px;
    transition: all 0.5s;
    transform: translateX(-20px);
    opacity: 0;
}


#section07 .s7_explain1.on{
    transform:none;
    opacity: 1;
}

#section07 .s7_explain2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 820px;
    top: 746px;
    transition: all 0.5s;
    transform: translateX(-20px);
    opacity: 0;
    transition-delay: 0.2s;
}


#section07 .s7_explain2.on{
    transform:none;
    opacity: 1;
}



#section07 .s7_cloud{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 970px;
    top: 26px;
    transition: all 0.5s;
    transform: translateY(-30px);
}


#section07 .s7_cloud.on{
    transform:none;
}


#section07 .s7_balloon{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1500px;
    top: 156px;
    transition: all 0.3s;
    transform: translateY(50px);
    opacity: 0;
    z-index: 1;
}


#section07 .s7_balloon.on{
    transform:none;
    opacity: 1;
}

#section07 .s7_topch{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -124px;
    top: -87px;
    transition: all 1s;
    transform: translate(-150px, 150px);
    z-index: 2;
    transition-timing-function: ease;
}


#section07 .s7_topch.on{
    transform:none;
}


#section07 .s7_iphone3_frame1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1287px;
    top: 2490px;
}



#s7video3_2 {
  position: absolute;
  left: 372px;
  top: 2431px;
  z-index: 1;
}

#section07 .s7_iphone3_frame2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 382px;
    top: 541px;
    z-index: 2;
}


.s7_iphone3_video2 {
  width: 415px;
  height: 900px;
  position: absolute;
  overflow: hidden;
  border-radius: 44px 44px 44px 44px;
  top:548px;
  left:392px;
}

#section07 .s7_iphone3_video2 video{
  width: 426px;
  height: 900px;
  margin-left: -6px;
}


#s7video3_4 {
  position: absolute;
  left: 372px;
  top: 3746px;
  z-index: 1;
}

#section07 .s7_iphone3_frame4{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 382px;
    top: 541px;
    z-index: 2;
}


.s7_iphone3_video4 {
  width: 415px;
  height: 900px;
  position: absolute;
  overflow: hidden;
  border-radius: 44px 44px 44px 44px;
  top:548px;
  left:392px;
}

#section07 .s7_iphone3_video4 video{
  width: 426px;
  height: 900px;
  margin-left: -6px;
}


#s7video3_5 {
  position: absolute;
  left: 950px;
  top: 3268px;
  z-index: 1;
}

#section07 .s7_iphone3_frame5{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 382px;
    top: 541px;
    z-index: 2;
}


.s7_iphone3_video5 {
  width: 415px;
  height: 900px;
  position: absolute;
  overflow: hidden;
  border-radius: 44px 44px 44px 44px;
  top:548px;
  left:392px;
}

#section07 .s7_iphone3_video5 video{
  width: 426px;
  height: 900px;
  margin-left: -6px;
}


#section07 .s7_chbottom{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1410px;
    top: 4694px;
    transition: all 0.5s;
    transform: translateY(350px);
    transition-timing-function: ease;
    z-index: 1;
}


#section07 .s7_chbottom.on{
    transform:none;
}


#section07 .s7_routine1_deco1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1250px;
    top: 2620px;
    transition: all 0.5s;
    transform: translateX(50px);
    z-index: 2;
    opacity: 0;
}


#section07 .s7_routine1_deco1.on{
    transform:none;
    opacity: 1;
}

#section07 .s7_routine1_deco2{
    width: 68px;
    height: 65px;
    position: absolute;
    left: 1588px;
    top: 3284px;
    transition: all 0.5s;
    transform: scale(0.1) scale(3);
    z-index: 2;
    opacity: 0;
}


#section07 .s7_routine1_deco2.on{
    transform:none;
    opacity: 1;
}


#section07 .s7_routine3_deco{
    width: 68px;
    height: 65px;
    position: absolute;
    left: 598px;
    top: 4544px;
    transition: all 0.5s;
    transform: scale(0.1) scale(3);
    z-index: 2;
    opacity: 0;
}


#section07 .s7_routine3_deco.on{
    transform:none;
    opacity: 1;
}


#section07 .s7_routine5_deco{
    width: 635px;
    height: 611px;
    position: absolute;
    left: 1238px;
    top: 3654px;
    transition: all 0.5s;
    transform: scale(0.1) scale(3);
    z-index: 2;
    opacity: 0;
}


#section07 .s7_routine5_deco.on{
    transform:none;
    opacity: 1;
}


#section07 .s7_title2{
    width: 292px;
    height: 90px;
    position: absolute;
    left: 226px;
    top: 2444px;
    transition: all 0.5s;
    transform: scale(0.1) scale(3);
    z-index: 2;
    opacity: 0;
}


#section07 .s7_title2.on{
    transform:none;
    opacity: 1;
}


#section07 .s7_subtitle2{
    width: 292px;
    height: 90px;
    position: absolute;
    left: 174px;
    top: 2472px;
    transition: all 0.5s;
    transform: translateY(-30px);
    z-index: 2;
    opacity: 0;
}


#section07 .s7_subtitle2.on{
    transform:none;
    opacity: 1;
}


#section07 .s7_txt2{
    width: 292px;
    height: 90px;
    position: absolute;
    left: 238px;
    top: 2708px;
    transition: all 0.5s;
    transform: translateY(-10px);
    z-index: 2;
    opacity: 0;
    transition-delay: 0.2s;
}


#section07 .s7_txt2.on{
    transform:none;
    opacity: 1;
}



#section07 .s7_routine1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1445px;
    top: 2448px;
    transition: all 0.5s;
    transform: translateY(-10px);
    z-index: 2;
    opacity: 0;
}


#section07 .s7_routine1.on{
    transform:none;
    opacity: 1;
}


#section07 .s7_routine2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 866px;
    top: 2912px;
    transition: all 0.5s;
    transform: translateY(-10px);
    z-index: 2;
    opacity: 0;
}


#section07 .s7_routine2.on{
    transform:none;
    opacity: 1;
}



#section07 .s7_routine3{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 270px;
    top: 3532px;
    transition: all 0.5s;
    transform: translateY(-10px);
    z-index: 2;
    opacity: 0;
}


#section07 .s7_routine3.on{
    transform:none;
    opacity: 1;
}


#section07 .s7_routine4{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 830px;
    top: 4220px;
    transition: all 0.5s;
    transform: translateY(-10px);
    z-index: 2;
    opacity: 0;
}


#section07 .s7_routine4.on{
    transform:none;
    opacity: 1;
}


#section07 .s7_routine5{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1454px;
    top: 3750px;
    transition: all 0.5s;
    transform: translateY(-10px);
    z-index: 2;
    opacity: 0;
}


#section07 .s7_routine5.on{
    transform:none;
    opacity: 1;
}


#section07 .s7_explain3{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 740px;
    top: 3974px;
    transition: all 0.5s;
    transform: translateX(-20px);
    z-index: 2;
    opacity: 0;
}


#section07 .s7_explain3.on{
    transform:none;
    opacity: 1;
}


#section07 .s7_elipsebg{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -582px;
    top: 3150px;
}

/*section8*/


#section08{
   background:url(../img2/section8/bg.png);
   Height:846px;
   z-index: -1;
}


#section08 .s8_make{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 198px;
    top: 190px;
    transition: all 0.5s;
    transform: translateX(-50px);
    z-index: 1;
}

#section08 .s8_make.on{
    transform:none;
}


#section08 .s8_float{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 198px;
    top: 450px;
    transition: all 0.3s;
    transform: translateX(60px);
}

#section08 .s8_float.on{
    transform:none;
}


#section08 .s8_arrow{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1278px;
    top: 540px;
    transition: all 0.3s;
    transform: translateX(80px) translateY(70px);
}

#section08 .s8_arrow.on{
    transform:none;
}


#section08 .s8_heart{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1648px;
    top: 260px;
    transition: all 0.5s;
    transform: translateX(-180px) translateY(70px);
}

#section08 .s8_heart.on{
    transform:none;
}


#section08 .s8_hi{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -62px;
    top: 390px;
    transition: all 0.3s;
    transform: translateX(30px);
    animation: s8_hi 1s linear 0s infinite alternate; margin-top: 0;
}



@keyframes s8_hi {
0% {top: 390px;}
100% {top: 380px;}
}



#section08 .s8_message{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -162px;
    top: 510px;
    transition: all 1s;
    transform: translateX(80px) translateY(70px);
}

#section08 .s8_message.on{
    transform:none;
}


#section08 .s8_plus{
    width: 379px;
    height: 371px;
    position: absolute;
    left: 1118px;
    top: 20px;
    transition: all 0.5s;
    transform: translateX(100px) translateY(-70px);

}

#section08 .s8_plus.on{
    transform:none;
}


/*section9*/


#section09{
   background:url(../img2/section9/bg.png);
   Height:4927px;
   z-index: -2;
}


#section09 .s9_main1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 248px;
    top: 228px;

}


#section09 .s9_mainmove{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 658px;
    top: 228px;
    transition: all 0.5s;
    transform: translateX(-100px);

}

#section09 .s9_mainmove.on{
    transform:none;
}


#section09 .s9_mainpop1{
    width: 78px;
    height: 88px;
    position: absolute;
    left: 562px;
    top: 228px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    transition-delay: 0.3s;
    opacity: 0;

}

#section09 .s9_mainpop1.on{
    transform:none;
    opacity: 1;
}


#section09 .s9_mainpop2{
    width: 79px;
    height: 69px;
    position: absolute;
    left: 562px;
    top: 378px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    transition-delay: 0.3s;
    opacity: 0;

}

#section09 .s9_mainpop2.on{
    transform:none;
    opacity: 1;
}


#section09 .s9_ch1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 992px;
    top: 0px;
    transition: all 0.5s;
    transform: translateY(-900px);
    transition-timing-function: ease;

}

#section09 .s9_ch1.on{
    transform:none;
}


#section09 .s9_title1{
    width: 449px;
    height: 137px;
    position: absolute;
    left: 258px;
    top: 720px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    transition-delay: 0.5s;
    opacity: 0;

}

#section09 .s9_title1.on{
    transform:none;
    opacity: 1;
}


#section09 .s9_subtitle1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 261px;
    top: 903px;
    transition: all 0.5s;
    transform: translateY(-20px);
    opacity: 0;

}

#section09 .s9_subtitle1.on{
    transform:none;
    opacity: 1;
}


#section09 .s9_iphone1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 288px;
    top: 780px;
    animation: s9iphone1 1s linear 0s infinite alternate; margin-top: 0;

}


@keyframes s9iphone1 {
  0% {top: 780px;}
  100% {top: 765px;}
}


#section09 .s9_iphone2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 217px;
    top: 1143px;
    transition: all 0.5s;
    transform: translateX(-150px);
    z-index: 1;

}

#section09 .s9_iphone2.on{
    transform:none;
}


#section09 .s9_click1{
    width: 107px;
    height: 114px;
    position: absolute;
    left: 660px;
    top: 1275px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;
    transition-delay: 0.3s;
    z-index: 1;

}

#section09 .s9_click1.on{
    transform:none;
    opacity: 1;
}


#section09 .s9_arrow{
    width: 107px;
    height: 114px;
    position: absolute;
    left: 714px;
    top: 1050px;
    transition: all 0.3s;
    transform: translateX(-20px);
    opacity: 0;
    transition-delay: 0.6s;
    z-index: 1;

}

#section09 .s9_arrow.on{
    transform:none;
    opacity: 1;
}


#section09 .s9_iphone2down{
    width: 107px;
    height: 114px;
    position: absolute;
    left: 259px;
    top: 2208px;
    transition: all 0.5s;
    transform: translateY(-300px);

}

#section09 .s9_iphone2down.on{
    transform:none;
}


#section09 .s9_explain{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 649px;
    top: 2185px;
    transition: all 0.5s;
    transform: translateX(-50px);
    opacity: 0;
    z-index: -1;

}

#section09 .s9_explain.on{
    transform:none;
    opacity: 1;
}


#section09 .s9_iphone3{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 882px;
    top: 2610px;

}


#section09 .s9_iphone3pop{
    width: 438px;
    height: 438px;
    position: absolute;
    left: 1409px;
    top: 2879px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}

#section09 .s9_iphone3pop.on{
    transform:none;
    opacity: 1;
}


#section09 .s9_title2{
    width: 293px;
    height: 90px;
    position: absolute;
    left: 216px;
    top: 3712px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}

#section09 .s9_title2.on{
    transform:none;
    opacity: 1;
}


#section09 .s9_subtitle2{
    width: 293px;
    height: 90px;
    position: absolute;
    left: 166px;
    top: 3744px;
    transition: all 0.5s;
    transform: translateY(-30px);
    opacity: 0;

}

#section09 .s9_subtitle2.on{
    transform:none;
    opacity: 1;
}


#section09 .s9_subsubtitle2{
    width: 293px;
    height: 90px;
    position: absolute;
    left: 168px;
    top: 4138px;
    transition: all 0.5s;
    transform: translateY(-30px);
    opacity: 0;

}

#section09 .s9_subsubtitle2.on{
    transform:none;
    opacity: 1;
}


#section09 .s9_decopush{
    width: 293px;
    height: 90px;
    position: absolute;
    left: 908px;
    top: 3728px;
    transition: all 0.3s;
    transform: translate(60px, -30px);
    opacity: 0;

}

#section09 .s9_decopush.on{
    transform:none;
    opacity: 1;
}



#section09 .s9_ch2{
    width: 293px;
    height: 90px;
    position: absolute;
    left: 968px;
    top: 3978px;
    transition: all 0.3s;
    transform: translateY(200px);
    transition-delay: 0.3s;

}

#section09 .s9_ch2.on{
    transform:none;
}



#s9video {
  position: absolute;
  left: 566px;
  top: 3638px;
  z-index: 1;
}


#section09 .s9_iphone4{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 172px;
    top: 465px;
    z-index: 2;
}

.s9_iphone4_video {
  width: 434px;
  height: 939px;
  position: absolute;
  overflow: hidden;
  border-radius: 44px 44px 44px 44px;
  top:564px;
  left:390px;
}

#section09 .s9_iphone4_video video{
  width: 434px;
  height: auto;
}


#section09 .s9_app{
    width: 293px;
    height: 90px;
    position: absolute;
    left: 1478px;
    top: 4268px;

}

#section09 .s9_app2{
    width: 54px;
    height: 54px;
    position: absolute;
    left: 1628px;
    top: 4254px;
    transition: all 0.3s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;
    transition-delay: 0.3s;

}

#section09 .s9_app2.on{
    transform:none;
    opacity: 1;
}


#section09 .s9_push{
    width: 855px;
    height: 401px;
    position: absolute;
    left: 212px;
    top: 4404px;
    transition: all 0.3s;
    transform: translateY(50px);
    opacity: 0;
    z-index: 1;
    transition-delay: 0.9s;

}

#section09 .s9_push.on{
    transform:none;
    opacity: 1;
}


/*section10*/

#section10{
   background:url(../img2/section10/bg.png);
   Height:6415px;
}

#section10 .s10_ch1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 0px;
    top: 2240px;
    transition: all 0.5s;
    transform: translateY(600px);

}

#section10 .s10_ch1.on{
    transform:none;
}


#section10 .s10_graybg{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 0px;
    top: 4526px;

}


#section10 .s10_title1{
    width: 387px;
    height: 134px;
    position: absolute;
    left: 1272px;
    top: 330px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}

#section10 .s10_title1.on{
    transform:none;
    opacity: 1;
}

#section10 .s10_subtitle1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1280px;
    top: 514px;
    transition: all 0.5s;
    transform: translateY(-20px);
    opacity: 0;

}

#section10 .s10_subtitle1.on{
    transform:none;
    opacity: 1;
}




#section10 .s10_title2{
    width: 387px;
    height: 134px;
    position: absolute;
    left: 1276px;
    top: 810px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}

#section10 .s10_title2.on{
    transform:none;
    opacity: 1;
}

#section10 .s10_subtitle2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1228px;
    top: 862px;
    transition: all 0.5s;
    transform: translateY(-20px);
    opacity: 0;

}

#section10 .s10_subtitle2.on{
    transform:none;
    opacity: 1;
}


#section10 .s10_iphone1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 52px;
    top: 242px;

}


#s10video1 {
  position: absolute;
  left: 642px;
  top: 742px;
}

.s10_iphone2_video {
  width: 468px;
  height: 979px;
  position: absolute;
  overflow: hidden;
  border-radius: 44px 44px 44px 44px;
  top:0px;
  left:0px;
  box-shadow: -9.259px 14.257px 21px 0px rgba(69, 67, 83, 0.11);
}

#section10 .s10_iphone2_video video{
  width: 470px;
  height: auto;
  margin-top: -5px;
}


#section10 .s10_deco1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -400px;
    top: 1398px;
    transition: all 0.5s;
    transform: translateX(-100px);
    opacity: 0;

}

#section10 .s10_deco1.on{
    transform:none;
    opacity: 1;
}


#section10 .s10_deco2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1520px;
    top: 1698px;
    transition: all 0.5s;
    transform: translateY(100px);
    opacity: 0;

}

#section10 .s10_deco2.on{
    transform:none;
    opacity: 1;
}



#s10video2 {
  position: absolute;
  left: 662px;
  top: 2172px;
}


#section10 .s10_iphone3{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
}

.s10_iphone3_video {
  width: 428px;
  height: 947px;
  position: absolute;
  overflow: hidden;
  border-radius: 44px 44px 44px 44px;
  top:20px;
  left:30px;
}

#section10 .s10_iphone3_video video{
  width: 428px;
  height: auto;
}


#section10 .s10_iphone4{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1040px;
    top: 1932px;
    transition: all 0.5s;
    transform: translateY(-100px);
    opacity: 0;
    z-index: 1;

}

#section10 .s10_iphone4.on{
    transform:none;
    opacity: 1;
}


#section10 .s10_deco3{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1116px;
    top: 3032px;
    transition: all 0.5s;
    transform: translateY(-30px);
    opacity: 0;

}

#section10 .s10_deco3.on{
    transform:none;
    opacity: 1;
}


#section10 .s10_explain{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 246px;
    top: 2914px;
    transition: all 0.5s;
    transform: translateX(30px);
    opacity: 0;

}

#section10 .s10_explain.on{
    transform:none;
    opacity: 1;
}


#section10 .s10_title3{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -314px;
    top: 3364px;
    transition: all 0.5s;
    transform: translateX(-50px);
    opacity: 0;

}

#section10 .s10_title3.on{
    transform:none;
    opacity: 1;
}



#s10video3 {
  position: absolute;
  left: 194px;
  top: 3662px;
}

.s10_iphone5_video {
  width: 468px;
  height: 979px;
  position: absolute;
  overflow: hidden;
  border-radius: 44px 44px 44px 44px;
  top:0px;
  left:0px;
  box-shadow: -9.259px 14.257px 21px 0px rgba(69, 67, 83, 0.11);
}

#section10 .s10_iphone5_video video{
  width: 470px;
  height: auto;
  margin-top: -5px;
}



#section10 .s10_ch2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 548px;
    top: 3722px;
    animation: s10ch2 1s linear 0s infinite alternate; margin-top: 0;

}


@keyframes s10ch2 {
  0% {top: 3722px;}
  100% {top: 3700px;}
}



#section10 .s10_title4{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1246px;
    top: 4316px;
    transition: all 0.5s;
    transform: translateY(-20px);
    opacity: 0;

}

#section10 .s10_title4.on{
    transform:none;
    opacity: 1;
}


#section10 .s10_subtitle4{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1246px;
    top: 4453px;
    transition: all 0.5s;
    transform: translateY(-20px);
    opacity: 0;

}

#section10 .s10_subtitle4.on{
    transform:none;
    opacity: 1;
}



#section10 .s10_title4pop{
    width: 101px;
    height: 67px;
    position: absolute;
    left: 1150px;
    top: 4240px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}

#section10 .s10_title4pop.on{
    transform:none;
    opacity: 1;
}


#section10 .s10_hi{
    width: 384px;
    height: 380px;
    position: absolute;
    left: 1228px;
    top: 3850px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}

#section10 .s10_hi.on{
    transform:none;
    opacity: 1;
}


#section10 .s10_lumideco{
    width: 384px;
    height: 380px;
    position: absolute;
    left: 1538px;
    top: 3520px;
    mix-blend-mode: luminosity;

}


#section10 .s10_iphone6{
    width: 384px;
    height: 380px;
    position: absolute;
    left: 458px;
    top: 4610px;
    transition: all 0.5s;
    transform: translateX(300px);

}

#section10 .s10_iphone6.on{
    transform:none;
}


#section10 .s10_watch1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 838px;
    top: 4940px;
    animation: s10watch1 1s linear 0s infinite alternate; margin-top: 0;

}


@keyframes s10watch1 {
  0% {top: 4940px;}
  100% {top: 4900px;}
}



#section10 .s10_title5{
    width: 278px;
    height: 89px;
    position: absolute;
    left: 202px;
    top: 4902px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    transition-delay: 0.5s;
    opacity: 0;

}

#section10 .s10_title5.on{
    transform:none;
    opacity: 1;
}



#section10 .s10_subtitle5{
    width: 278px;
    height: 89px;
    position: absolute;
    left: 214px;
    top: 5034px;
    transition: all 0.5s;
    transform: translateY(-20px);
    transition-delay: 0.8s;
    opacity: 0;

}

#section10 .s10_subtitle5.on{
    transform:none;
    opacity: 1;
}


#section10 .s10_deco4{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 94px;
    top: 5372px;

}


#s10_box{
  z-index: 3;
}


#section10 .s10_watchbox{
    width: 1761px;
    height: 760px;
    position: absolute;
    left: 84px;
    top: 5990px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}

#section10 .s10_watchbox.on{
    transform:none;
    opacity: 1;
}


#section10 .s10_watch2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -736px;
    top: 5716px;
    transition: all 0.5s;
    transform: translateY(-40px);
    transition-delay: 0.5s;
    opacity: 0;

}

#section10 .s10_watch2.on{
    transform:none;
    opacity: 1;
}


#section10 .s10_watch3{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 454px;
    top: 6030px;
    transition: all 0.5s;
    transform: translateY(-40px);
    transition-delay: 0.5s;
    opacity: 0;

}

#section10 .s10_watch3.on{
    transform:none;
    opacity: 1;
}



#section10 .s10_bomb{
    width: 263px;
    height: 295px;
    position: absolute;
    left: 330px;
    top: 5704px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    transition-delay: 1s;
    opacity: 0;

}

#section10 .s10_bomb.on{
    transform:none;
    opacity: 1;
}


#section10 .s10_iphone3_pop1{
    width: 211px;
    height: 62px;
    position: absolute;
    left: 1270px;
    top: 2382px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    transition-delay: 0.3s;
    opacity: 0;
    z-index: 2;

}

#section10 .s10_iphone3_pop1.on{
    transform:none;
    opacity: 1;
}



#section10 .s10_iphone3_pop2{
    width: 211px;
    height: 62px;
    position: absolute;
    left: 1450px;
    top: 2466px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    transition-delay: 0.3s;
    opacity: 0;
    z-index: 2;

}

#section10 .s10_iphone3_pop2.on{
    transform:none;
    opacity: 1;
}



#section11{
   background:url(../img2/section11/bg.png);
   Height:6138px;
   z-index: -1;
}

#section11 .styleguide{
    width: 385px;
    height: 111px;
    position: absolute;
    left: 768px;
    top: 574px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}

#section11 .styleguide.on{
    transform:none;
    opacity: 1;
}


#section11 .s11_icon{
    width: 155px;
    height: 155px;
    position: absolute;
    left: 886px;
    top: 470px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;
    transition-delay: 0.3s;

}

#section11 .s11_icon.on{
    transform:none;
    opacity: 1;
}


#section11 .paper{
    width: 1063px;
    height: 4999px;
    position: absolute;
    left: 429px;
    top: 790px;
    transition: all 0.5s;
    transform: scale(0.8);

}

#section11 .paper.on{
    transform:none;
}


#section11 .s11_ch1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 538px;
    top: 730px;
    transition: all 1s;
    transform: translateX(200px);
    opacity: 0;
    transition-delay: 0.5s;

}

#section11 .s11_ch1.on{
    transform:none;
    opacity: 1;
}


#section11 .s11_logo{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 805px;
    top: 1044px;
    animation: s11logo 1s linear 0s infinite alternate; margin-top: 0;

}


@keyframes s11logo {
  0% {top: 1044px;}
  100% {top: 1034px;}
}



#section11 .s11_logotxt{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 702px;
    top: 1298px;
    transition: all 0.5s;
    transform: translateY(-20px);
    opacity: 0;

}

#section11 .s11_logotxt.on{
    transform:none;
    opacity: 1;
}


#section11 .s11_content1{
    width: 860px;
    height: 458px;
    position: absolute;
    left: 530px;
    top: 1542px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}

#section11 .s11_content1.on{
    transform:none;
    opacity: 1;
}


#section11 .s11_title1{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 536px;
    top: 1492px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;
    transition-delay: 0.3s;

}

#section11 .s11_title1.on{
    transform:none;
    opacity: 1;
}



#section11 .s11_content2{
    width: 860px;
    height: 458px;
    position: absolute;
    left: 550px;
    top: 2210px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}

#section11 .s11_content2.on{
    transform:none;
    opacity: 1;
}


#section11 .s11_title2{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 536px;
    top: 2068px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;
    transition-delay: 0.3s;

}

#section11 .s11_title2.on{
    transform:none;
    opacity: 1;
}



#section11 .s11_content2txt{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 604px;
    top: 2486px;
    transition: all 0.5s;
    transform: translateY(-20px);
    opacity: 0;

}

#section11 .s11_content2txt.on{
    transform:none;
    opacity: 1;
}


#section11 .s11_content3{
    width: 860px;
    height: 458px;
    position: absolute;
    left: 542px;
    top: 2726px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}

#section11 .s11_content3.on{
    transform:none;
    opacity: 1;
}


#section11 .s11_title3{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 543px;
    top: 2670px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;
    transition-delay: 0.3s;

}

#section11 .s11_title3.on{
    transform:none;
    opacity: 1;
}



#section11 .s11_content3txt{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 594px;
    top: 3846px;
    transition: all 0.5s;
    transform: translateY(20px);
    opacity: 0;
    mix-blend-mode: multiply;

}

#section11 .s11_content3txt.on{
    transform:none;
    opacity: 1;
}



#section11 .s11_content3ch{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 766px;
    top: 3500px;
    animation: content3ch 1s linear 0s infinite alternate; margin-top: 0;

}


@keyframes content3ch {
  0% {top: 3500px;}
  100% {top: 3480px;}
}


#section11 .s11_content4{
    width: 823px;
    height: 613px;
    position: absolute;
    left: 548px;
    top: 4110px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}

#section11 .s11_content4.on{
    transform:none;
    opacity: 1;
}


#section11 .s11_title4{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 553px;
    top: 4050px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;
    transition-delay: 0.3s;

}

#section11 .s11_title4.on{
    transform:none;
    opacity: 1;
}




#section11 .s11_content5{
    width: 829px;
    height: 796px;
    position: absolute;
    left: 548px;
    top: 4864px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}

#section11 .s11_content5.on{
    transform:none;
    opacity: 1;
}


#section11 .s11_title5{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 553px;
    top: 4806px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;
    transition-delay: 0.3s;

}

#section11 .s11_title5.on{
    transform:none;
    opacity: 1;
}


#section11 .s11_ch2{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 761px;
    top: 5614px;
    transition: all 0.5s;
    transform: translateY(100px);

}

#section11 .s11_ch2.on{
    transform:none;
}



#section11 .s11_wave{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -124px;
    top: 5829px;
    animation: s11wave 0.7s linear 0s infinite alternate; margin-top: 0;

}


@keyframes s11wave {
  0% {top: 5829px;}
  100% {top: 5823px;}
}



#section11 .s11_bubble{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 216px;
    top: 5754px;
    transition: all 0.5s;
    transform: translateY(200px);
    opacity: 0;

}

#section11 .s11_bubble.on{
    transform:none;
    opacity: 1;
}



#section11 .s11_deco1{
    width: 230px;
    height: 92px;
    position: absolute;
    left: -154px;
    top: 660px;
    transition: all 0.8s;
    transform: translate(600px, 300px);

    transition-delay: 0.2s;

}

#section11 .s11_deco1.on{
    transform:none;
}


#section11 .s11_lumi1{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 1412px;
    top: 930px;
    transition: all 0.8s;
    transform: translate(-100px, 300px);
    transition-delay: 0.5s;
    mix-blend-mode: luminosity;

}

#section11 .s11_lumi1.on{
    transform:none;
}


#section11 .s11_lumi2{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 436px;
    top: 1350px;
    transition: all 0.8s;
    transform: translate(100px, 100px);
    transition-delay: 0.5s;
    mix-blend-mode: luminosity;

}

#section11 .s11_lumi2.on{
    transform:none;
}


#section11 .s11_deco2{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 1652px;
    top: 1190px;
    transition: all 0.5s;
    transform: translate(-500px, 600px);
    transition-delay: 0.2s;

}

#section11 .s11_deco2.on{
    transform:none;
}


#section11 .s11_lumi3{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 206px;
    top: 1621px;
    transition: all 0.8s;
    transform: translate(300px, 100px);
    transition-delay: 0.5s;
    mix-blend-mode: luminosity;

}

#section11 .s11_lumi3.on{
    transform:none;
}


#section11 .s11_lumi4{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 1512px;
    top: 1880px;
    transition: all 0.5s;
    transform: translate(-400px, 300px);
    transition-delay: 0.8s;
    mix-blend-mode: luminosity;

}

#section11 .s11_lumi4.on{
    transform:none;
}


#section11 .s11_deco3{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 262px;
    top: 1869px;
    transition: all 0.8s;
    transform: translate(300px, 100px);
    transition-delay: 0.5s;

}

#section11 .s11_deco3.on{
    transform:none;
}


#section11 .s11_deco4{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 1332px;
    top: 2360px;
    transition: all 0.5s;
    transform: translate(-400px, 300px);
    transition-delay: 0.5s;

}

#section11 .s11_deco4.on{
    transform:none;
}


#section11 .s11_bottle{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 132px;
    top: 3834px;
    animation: s11bottle 0.7s linear 0s infinite alternate; margin-top: 0;

}


@keyframes s11bottle {
  0% {top: 3820px;}
  100% {top: 3834px;}
}



#section11 .s11_float1{
    width: 230px;
    height: 92px;
    position: absolute;
    left: -60px;
    top: 4300px;
    transition: all 1s;
    transform: translate(-100px, 50px);

}

#section11 .s11_float1.on{
    transform:none;
}


#section11 .s11_softlight1{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 160px;
    top: 4710px;
    transition: all 1s;
    transform: translate(-30px, -50px);
    mix-blend-mode: soft-light;

}

#section11 .s11_softlight1.on{
    transform:none;
}



#section11 .s11_float2{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 1480px;
    top: 4880px;
    transition: all 1s;
    transform: translate(100px, 50px);

}

#section11 .s11_float2.on{
    transform:none;
}


#section11 .s11_softlight2{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 1710px;
    top: 5480px;
    transition: all 1s;
    transform: translate(-30px, 50px);
    mix-blend-mode: soft-light;

}

#section11 .s11_softlight2.on{
    transform:none;
}


#section11 .s11_float3{
    width: 230px;
    height: 92px;
    position: absolute;
    left: 390px;
    top: 4810px;

}


#section12{
   background:url(../img2/section12/bg.png);
   Height:7455px;
}


#section12 .s12_title1{
    width: 393px;
    height: 239px;
    position: absolute;
    left: 282px;
    top: 138px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}

#section12 .s12_title1.on{
    transform:none;
    opacity: 1;
}


#s12video1 {
  position: absolute;
  left: 266px;
  top: 500px;
}


#section12 .s12_iphone1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
}

.s12_iphone1_video {
  width: 428px;
  height: 947px;
  position: absolute;
  overflow: hidden;
  border-radius: 44px 44px 44px 44px;
  top:20px;
  left:30px;
}

#section12 .s12_iphone1_video video{
  width: 428px;
  height: auto;
}


#s12video2 {
  position: absolute;
  left: 1230px;
  top: 1260px;
}


#section12 .s12_iphone2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 0px;
    top: 0px;
    z-index: 1;
}

.s12_iphone2_video {
  width: 428px;
  height: 947px;
  position: absolute;
  overflow: hidden;
  border-radius: 44px 44px 44px 44px;
  top:20px;
  left:30px;
}

#section12 .s12_iphone2_video video{
  width: 428px;
  height: auto;
}



#section12 .exclusion1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -68px;
    top: 56px;
    transition: all 0.5s;
    transform: translateX(-100px);
    mix-blend-mode: exclusion;

}

#section12 .exclusion1.on{
    transform:none;
}


#section12 .s12_decotxt{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 916px;
    top: 96px;
    transition: all 0.8s;
    transform: translateX(1000px);
    transition-delay: 0.3s;

}

#section12 .s12_decotxt.on{
    transform:none;
}



#section12 .s12_airplain{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 684px;
    top: 198px;

}


#section12 .s12_subtitle1{
    width: 393px;
    height: 239px;
    position: absolute;
    left: 902px;
    top: 438px;
    transition: all 0.5s;
    transform: translateY(-30px);
    opacity: 0;

}

#section12 .s12_subtitle1.on{
    transform:none;
    opacity: 1;
}



#section12 .exclusion2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1750px;
    top: 606px;
    transition: all 0.5s;
    transform: translateX(100px);
    mix-blend-mode: exclusion;
    transition-delay: 0.3s;

}

#section12 .exclusion2.on{
    transform:none;
}



#section12 .exclusion3{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -16px;
    top: 1016px;
    transition: all 0.5s;
    transform: translateX(-100px);
    mix-blend-mode: exclusion;
    transition-delay: 0.3s;

}

#section12 .exclusion3.on{
    transform:none;
}



#section12 .lumibottle{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1550px;
    top: 702px;
    mix-blend-mode: luminosity;
    animation: lumibottle 0.7s linear 0s infinite alternate; margin-top: 0;

}

@keyframes lumibottle {
0% {top: 702px;}
100% {top: 682px;}
}


#section12 .s12_new{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -20px;
    top: 1542px;
    transition: all 0.5s;
    transform: translateX(-500px);
    transition-delay: 0.3s;

}

#section12 .s12_new.on{
    transform:none;
}



#section12 .s12_ch1{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 90px;
    top: 2055px;
    animation: s12_ch1 0.7s linear 0s infinite alternate; margin-top: 0;

}

@keyframes s12_ch1 {
0% {top: 2055px;}
100% {top: 2045px;}
}


#section12 .s12_ch1_2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 200px;
    top: 2390px;

}


#section12 .exclusion4{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1750px;
    top: 2360px;
    transition: all 0.5s;
    transform: translateX(100px);
    mix-blend-mode: exclusion;
    transition-delay: 0.3s;

}

#section12 .exclusion4.on{
    transform:none;
}


#section12 .s12_float{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 1190px;
    top: 2490px;
    transition: all 0.5s;
    transform: translateX(300px);
    transition-delay: 0.3s;
    opacity: 0;

}

#section12 .s12_float.on{
    transform:none;
    opacity: 1;
}



#section12 .s12_plot{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -60px;
    top: 2760px;
    transition: all 0.5s;
    transform: translateX(-300px);
    transition-delay: 0.8s;
    opacity: 0;

}

#section12 .s12_plot.on{
    transform:none;
    opacity: 1;
}


#section12 .s12_mockup{
    width: 200px;
    height: 200px;
    position: absolute;
    left: -720px;
    top: 3030px;
    transition: all 0.5s;
    transform: translateY(100px);
    transition-delay: 0.5s;
    opacity: 0;

}

#section12 .s12_mockup.on{
    transform:none;
    opacity: 1;
}



#section12 .s12_title2{
    width: 456px;
    height: 102px;
    position: absolute;
    left: 294px;
    top: 1714px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    opacity: 0;

}

#section12 .s12_title2.on{
    transform:none;
    opacity: 1;
}


#section12 .s12_subtitle2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 303px;
    top: 1852px;
    transition: all 0.5s;
    transform: translateY(-30px);
    transition-delay: 0.5s;
    opacity: 0;

}

#section12 .s12_subtitle2.on{
    transform:none;
    opacity: 1;
}


#section12 .s12_blink1{
    width: 382px;
    height: 137px;
    Opacity:1;
    position: absolute;
    left: -64px;
    top: 6100px;
    mix-blend-mode: luminosity;
    animation: s12_blink1 1s step-end infinite;
}

@keyframes s12_blink1 {
  50% {
    opacity: 0.5;
  }
}


#section12 .s12_blink2{
    width: 382px;
    height: 137px;
    Opacity:1;
    position: absolute;
    left: 240px;
    top: 6242px;
    animation: s12_blink2 0.5s step-end infinite;
}

@keyframes s12_blink2 {
  50% {
    opacity: 0.5;
  }
}



#section12 .s12_blink3{
    width: 382px;
    height: 137px;
    Opacity:0.5;
    position: absolute;
    left: 180px;
    top: 6402px;
    animation: s12_blink3 0.5s step-end infinite;
}

@keyframes s12_blink3 {
  50% {
    opacity:1;
  }
}


#section12 .s12_blink4{
    width: 382px;
    height: 137px;
    Opacity:0.5;
    position: absolute;
    left: 846px;
    top: 6250px;
    mix-blend-mode: luminosity;
    animation: s12_blink4 1s step-end infinite;
}

@keyframes s12_blink4 {
  50% {
    opacity: 1;
  }
}


#section12 .s12_thanks{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 207px;
    top: 6583px;

}


#section12 .s12_thanks2{
    width: 200px;
    height: 200px;
    position: absolute;
    left: 223px;
    top: 6738px;
    mix-blend-mode: overlay;

}


#section12 .s12_thanks3{
    width: 257px;
    height: 252px;
    position: absolute;
    left: 680px;
    top: 6470px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    transition-delay: 0.5s;
    opacity: 0;

}

#section12 .s12_thanks3.on{
    transform:none;
    opacity: 1;
}


#section12 .s12_thanks4{
    width: 257px;
    height: 252px;
    position: absolute;
    left: 200px;
    top: 7060px;
    transition: all 0.5s;
    transform: translateY(-10px);
    transition-delay: 0.5s;
    opacity: 0;

}

#section12 .s12_thanks4.on{
    transform:none;
    opacity: 1;
}



#section12 .s12_thanksch{
    width: 257px;
    height: 252px;
    position: absolute;
    left: 870px;
    top: 6640px;
    transition: all 0.8s;
    transform: translateX(1200px);
    transition-delay: 0.2s;

}

#section12 .s12_thanksch.on{
    transform:none;
}


#section12 .s12_thankslumi{
    width: 286px;
    height: 81px;
    position: absolute;
    left: 684px;
    top: 7280px;
    transition: all 0.5s;
    transform: scale(0.1) scale(2.5);
    transition-delay: 0.5s;
    opacity: 0;
    mix-blend-mode: luminosity;

}

#section12 .s12_thankslumi.on{
    transform:none;
    opacity: 1;
}













//
