@font-face {
    font-family: 'GothamPro';
    src: url('fonts/GothamPro.otf');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'GothamProBold';
    src: url('fonts/GothamPro-Bold.otf');
    font-weight: normal;
    font-style: normal;
}

body {
    min-width: 1200px;
    background: #fff;
}


.b-case-onlime {
    position: relative;
    z-index: 0;
    overflow: hidden;
    font-family: 'GothamPro';
    color: #39434d;
    background: #fff;
}

.b-case-onlime .b-screen {
    position: relative;
    width: 1400px;
    margin: 0 auto;
}

.b-case-onlime .b-screen * {
    background: no-repeat 50% 50%;
    position: absolute;
    transition-duration: 0.5s;   
}


.b-case-onlime B {
    font-family: 'GothamProBold';
    font-weight: normal;
    letter-spacing: 0.1em;
}

.b-case-onlime .e-txt * {
    position: relative;
    left: auto;
}

.b-case-onlime .e-txt {
    opacity: 0;
}

.b-case-onlime .e-txt.m-white {
    color:#fff;
}

.b-case-onlime H2 B {
    font-weight: normal;
    color: #a7f212;
    letter-spacing: 0em;
}

.b-case-onlime H2 {
    font-family: 'GothamProBold';
    font-size: 64px;
    font-weight: normal;
    line-height: 1em;
    margin-left: -0.07em;
}

.b-case-onlime H5 {
    font-family: 'GothamProBold';
    letter-spacing: 4px;
    font-size: 16px;
    font-weight: normal;
    line-height: 1em;
    margin-bottom: 20px;
    text-transform: uppercase;
}

.b-case-onlime .e-data * {
    position: relative;
} 

.b-case-onlime .e-txt P {
    font-size: 17px;
    line-height: 1.8em; 
}

.b-case-onlime .e-down {
    padding-left: 40px;
    background: url('shared/arrow.png') 0% 10px no-repeat; 
}

.b-case-onlime  A.e-btn {
    display: inline-block;
    padding: 0 40px;
    line-height: 60px;
    color: #fff;
    font-size: 16px;
    font-family: 'GothamProBold';
    background: #8ed935;
    border-radius: 60px;
    letter-spacing: 1px;    
}

A {
    font-size: 18px;
    color: #fff; 
}


/**/


/* .b-screen.n1 ***********************************************************************************************************************************************/
.b-case-onlime .b-screen.n1 {
    height: 801px;
    background: url('screen-1/bg.gif') 50% 0% no-repeat; 
}

.b-case-onlime .b-screen.n1 .e-txt {
    top:440px;
}

.b-case-onlime .b-screen.n1 .e-txt.active {
    opacity: 1;
    top:340px;
    left:100px;
}

.b-case-onlime .b-screen.n1 .e-txt H2 {
    font-size: 72px;
}

.b-case-onlime .b-screen.n1 .e-txt H5 {
    transition-duration: 2s;
    width: 0%;
    overflow: hidden;
    white-space: nowrap;
    margin-bottom: 40px;
}

.b-case-onlime .b-screen.n1 .e-txt H5.active {
    margin-bottom: 40px;
    width: 100%;
}

.b-case-onlime .b-screen.n1 .e-txt.active {

}


/* .b-screen.n2 ***********************************************************************************************************************************************/
.b-case-onlime .b-screen.n2 {
    height: 800px;
}

.b-case-onlime .b-screen.n2 .e-txt.n1 {
    top:300px;
}

.b-case-onlime .b-screen.n2 .e-txt.n1.active {
    top:200px;
    left:780px;
    opacity: 1;
}

.b-case-onlime .b-screen.n2 .e-txt H5 {
    transition-duration: 1s;
    width: 0%;
    overflow: hidden;
    white-space: nowrap;
}

.b-case-onlime .b-screen.n2 .e-txt H5.active {
    width: 100%;
}

.b-case-onlime .b-screen.n2 .e-txt.n2 {
    top:500px;
}

.b-case-onlime .b-screen.n2 .e-txt.n2.active {
    top:400px;
    left:780px;
    opacity: 1;
}

.b-case-onlime .b-screen.n2 .e-txt P {
    width: 540px;
    color:#859293;
    margin-bottom: 50px;
}

.b-case-onlime .b-screen.n2 .e-btn {
    opacity: 0;
    top:100px;
}

.b-case-onlime .b-screen.n2 .e-btn.active {
    opacity: 1;
    top:0px;
}

.b-case-onlime .b-screen.n2 .e-round {
    display: inline-block;
    height: 60px;
    width: 60px;
    border-radius: 60px;
    background: #f7f8f8;
    left: 400px;
    top: 410px;
}

.b-case-onlime .b-screen.n2 .e-round.active {
    display: inline-block;
    height: 600px;
    width: 600px;
    border-radius: 600px;
    background: #f7f8f8;
    left: 100px;
    top: 110px;
    
}

.b-case-onlime .b-screen.n2 .e-clip {
    display: block;
    height: 700px;
    width: 600px;
    top:-100px;
    border-radius: 600px;
    overflow: hidden;
}

.b-case-onlime .b-screen.n2 .e-tablet {
    top:600px;
    transition: all 0.8s cubic-bezier(0.215, 0.61, 0.355, 1);
}

.b-case-onlime .b-screen.n2 .e-tablet.active {
    display: inline-block;
    height: 749px;
    width: 545px;
    background: url('screen-2/ipad.png') 50% 50% no-repeat;
    left: 30px;
    top: 140px;
}


/* .b-screen.n3 ***********************************************************************************************************************************************/
.b-case-onlime .b-screen.n3 {
    height: 800px;
    background: url('screen-3/bg.jpg') 50% 50% no-repeat;
    perspective: 1500px;
    z-index: 1;
}

.b-case-onlime .b-screen.n3 .e-txt.n1 {
    top:290px;
}

.b-case-onlime .b-screen.n3 .e-txt.n1.active {
    top:190px;
    left:100px;
    opacity: 1;
}

.b-case-onlime .b-screen.n3 .e-txt H5 {
    transition-duration: 1s;
    width: 0%;
    overflow: hidden;
    white-space: nowrap;
}

.b-case-onlime .b-screen.n3 .e-txt H5.active {
    width: 100%;
}

.b-case-onlime .b-screen.n3 .e-txt.n2 {
    top:690px;
}

.b-case-onlime .b-screen.n3 .e-txt.n2.active {
    top:590px;
    left:100px;
    opacity: 1;
}

.b-case-onlime .b-screen.n3 .e-screenshot-1 {
    width: 439px;
    height: 273px;
    top:770px;
    left:70px;
    background: url('screen-3/screen_1.png') 50% 50% no-repeat;
    transform: rotateX(109deg);
    visibility: hidden;
}

.b-case-onlime .b-screen.n3 .e-screenshot-2 {
    width: 439px;
    height: 273px;
    top:770px;
    left:490px;
    background: url('screen-3/screen_2.png') 50% 50% no-repeat;
    transform: rotateX(109deg);
    visibility: hidden;
}

.b-case-onlime .b-screen.n3 .e-screenshot-3 {
    width: 439px;
    height: 273px;
    top:770px;
    left:910px;
    background: url('screen-3/screen_3.png') 50% 50% no-repeat;
    transform: rotateX(109deg);
    visibility: hidden;
}

.b-case-onlime .b-screen.n3 .e-screenshot-1.active {
    top:670px;
    transform: rotateX(0deg);
    visibility: visible;
}

.b-case-onlime .b-screen.n3 .e-screenshot-2.active {
    top:670px;
    transform: rotateX(0deg);
    visibility: visible;
}

.b-case-onlime .b-screen.n3 .e-screenshot-3.active {
    top:670px;
    transform: rotateX(0deg);
    visibility: visible;
}


/* .b-screen.n4 ***********************************************************************************************************************************************/
.b-case-onlime .b-screen.n4 {
    height: 1890px;
    background: url('screen-4/bg.jpg') 50% 0% no-repeat;
}

.b-case-onlime .b-screen.n4 .e-txt.n1 {
    top:325px;
}

.b-case-onlime .b-screen.n4 .e-txt.n1.active {
    top:225px;
    left:100px;
    opacity: 1;
}

.b-case-onlime .b-screen.n4 .e-txt H5 {
    transition-duration: 1s;
    width: 0%;
    overflow: hidden;
    white-space: nowrap;
}

.b-case-onlime .b-screen.n4 .e-txt H5.active {
    width: 100%;
}

.b-case-onlime .b-screen.n4 .e-txt.n2 {
    top:465px;
}

.b-case-onlime .b-screen.n4 .e-txt.n2.active {
    top:365px;
    left:100px;
    width: 340px;
    opacity: 1;
}

.b-case-onlime .b-screen.n4 .e-screenshot-1 {
    width: 849px;
    height: 1601px;
    top:208px;
    left:500px;
    background: url('screen-4/screen_1.png') 50% 50% no-repeat;
    z-index: 3;
}

.b-case-onlime .b-screen.n4 .e-screenshot-2 {
    opacity: 0;
    width: 849px;
    height: 1571px;
    top:220px;
    left:500px;
    background: url('screen-4/screen_2.png') 50% 50% no-repeat;
    z-index: 2;
}

.b-case-onlime .b-screen.n4 .e-screenshot-3 {
    opacity: 0;
    width: 849px;
    height: 1541px;
    top:230px;
    left:500px;
    background: url('screen-4/screen_3.png') 50% 50% no-repeat;
    z-index: 1;
}

.b-case-onlime .b-screen.n4 .e-screenshot-2.active {
    opacity: 1;
    left:490px;
}

.b-case-onlime .b-screen.n4 .e-screenshot-3.active {
    opacity: 1;
    left:480px;
}

.b-case-onlime .b-screen.n4 .e-number.n1 {
    opacity: 1;
    width: 332px;
    top:695px;
    left:100px;
}

.b-case-onlime .b-screen.n4 .e-number.n2 {
    opacity: 1;
    width: 332px;
    top:1220px;
    left:100px;
}

.b-case-onlime .b-screen.n4 .e-number.n3 {
    opacity: 1;
    width: 332px;
    top:1570px;
    left:100px;
}

.b-case-onlime .b-screen.n4 .e-num {
    display: inline-block;
    height: 47px;
    line-height: 47px;
    width: 100%;
    overflow: hidden;
}

.b-case-onlime .b-screen.n4 .e-num B {
    transition: top 0.75s ease 0.25s;
    font-size: 100px;
    color: #8ed935;
    font-family: 'GothamProBold';
    font-weight: normal;
    top:100px;
}

.b-case-onlime .b-screen.n4 .e-num.active B {
    top:21px;
}

.b-case-onlime .b-screen.n4 .e-line {
    display: inline-block;
    width: 100%;
    height: 7px;
    text-align: right;
    top:60px;
}

.b-case-onlime .b-screen.n4 .e-line I {
    transition-duration: 1s;
    position: relative;
    display: inline-block;
    width: 0%;
    height: 7px;
    background: url('screen-4/green_line.png') 0% 0% no-repeat;
}

.b-case-onlime .b-screen.n4 .e-line.active I {
    width: 100%;
}

.b-case-onlime .b-screen.n4 .e-num-txt * {
    position: relative;
    transition: opacity 0.5s ease 0.5s;    
    opacity: 0;
}

.b-case-onlime .b-screen.n4 .e-num-txt.active * {   
    opacity: 1;
}

.b-case-onlime .b-screen.n4 .e-num-txt {
    transition-duration: 1s;
    top:110px;
    width:332px;
    left:100%;
}

.b-case-onlime .b-screen.n4 .e-num-txt.active {
    left:0%;
}

.b-case-onlime .b-screen.n4 .e-num-txt H4 {
    font-family: 'GothamProBold';
    font-size: 16px;
    font-weight: normal;
    line-height: 1em;
    margin-bottom: 15px;
    text-transform: uppercase;
}

.b-case-onlime .b-screen.n4 .e-num-txt P {
    font-size: 15px;
    line-height: 1.8em; 
    color: #859293;
}


/* .b-screen.n5 ***********************************************************************************************************************************************/
.b-case-onlime .b-screen.n5 {
    height: 1255px;
    background: url('screen-5/bg.jpg') 50% 0% no-repeat;
    overflow: hidden;
}

.b-case-onlime .b-screen.n5 .e-txt {
    top:235px;
    left:405px;
    transform: rotateX(57deg) rotateY(-5deg) rotateZ(-42deg);
}

.b-case-onlime .b-screen.n5 .e-txt.active {
    opacity: 1;
    top:135px;
    left:205px;
}

.b-case-onlime .b-screen.n5 .e-txt H5 {
    transition-duration: 2s;
    font-size: 30px;
    width: 0%;
    overflow: hidden;
    white-space: nowrap;
}

.b-case-onlime .b-screen.n5 .e-txt H5.active {
    width: 100%;
}

.b-case-onlime .b-screen.n5 .e-txt H2 {
    font-size: 130px;
    color: #8ed935;
}

.b-case-onlime .b-screen.n5 .e-phone {
    width: 1162px;
    height: 719px;
    top:440px;
    left:-270px;
    background: url('screen-5/iphone.png') 50% 50% no-repeat;
}

.b-case-onlime .b-screen.n5 .e-screenshot-1 {
    transform: rotateX(55deg) rotateY(-5deg) rotateZ(-12deg);
    opacity: 0;
    width: 785px;
    height: 467px;
    top:310px;
    left:825px;
    background: url('screen-5/screen_1.png') 50% 50% no-repeat;
    z-index: 3;
}

.b-case-onlime .b-screen.n5 .e-screenshot-2 {
    transform: rotateX(55deg) rotateY(-5deg) rotateZ(-12deg);
    opacity: 0;
    width: 785px;
    height: 467px;
    top: 370px;
    left: 930px;
    background: url('screen-5/screen_2.png') 50% 50% no-repeat;
    z-index: 2;
}

.b-case-onlime .b-screen.n5 .e-screenshot-3 {
    transform: rotateX(55deg) rotateY(-5deg) rotateZ(-12deg);
    opacity: 0;
    width: 887px;
    height: 559px;
    top: 412px;
    left: 1030px;
    background: url('screen-5/screen_3.png') 50% 50% no-repeat;
    z-index: 1;
}

.b-case-onlime .b-screen.n5 .e-screenshot-1.active {
    transform: rotate(0deg);
    opacity: 1;
    top:210px;
    left:625px;
}

.b-case-onlime .b-screen.n5 .e-screenshot-2.active {
    transform: rotate(0deg);
    opacity: 1;
    top: 270px;
    left: 730px;
}

.b-case-onlime .b-screen.n5 .e-screenshot-3.active {
    transform: rotate(0deg);
    opacity: 1;
    top: 312px;
    left: 830px;
}


/* .b-screen.n6 ***********************************************************************************************************************************************/
.b-case-onlime .b-screen.n6 {
    height: 1685px;
    background:#f4f5f5 url('screen-6/bg.jpg') 50% 0% no-repeat;
}

.b-case-onlime .b-screen.n6 .e-txt.n1 {
    top:290px;
}

.b-case-onlime .b-screen.n6 .e-txt.n1.active {
    opacity: 1;
    top:190px;
    left:100px;
}

.b-case-onlime .b-screen.n6 .e-txt H5 {
    transition-duration: 2s;
    width: 0%;
    overflow: hidden;
    white-space: nowrap;
}

.b-case-onlime .b-screen.n6 .e-txt H5.active {
    width: 100%;
}

.b-case-onlime .b-screen.n6 .e-txt.n2 {
    top:605px;
}

.b-case-onlime .b-screen.n6 .e-txt.n2.active {
    opacity: 1;
    top:505px;
    left:100px;
}

.b-case-onlime .b-screen.n6 .e-screenshot-1 {
    width: 1251px;
    height: 1018px;
    top:605px;
    left:100px;
    background: url('screen-6/screen_1.png') 50% 50% no-repeat;
    z-index: 3;
}

.b-case-onlime .b-screen.n6 .e-screenshot-2 {
    width: 1220px;
    height: 1027px;
    top: 613px;
    left: 114px;
    background: url('screen-6/screen_2.png') 50% 50% no-repeat;
    z-index: 2;
}

.b-case-onlime .b-screen.n6 .e-screenshot-3 {
    width: 1180px;
    height: 1027px;
    top: 625px;
    left: 130px;
    background: url('screen-6/screen_3.png') 50% 50% no-repeat;
    z-index: 1;
}

/* .b-screen.n7 ***********************************************************************************************************************************************/
.b-case-onlime .b-screen.n7{
    height: 655px;
}

.b-case-onlime .b-screen.n7 .e-bg {
    width: 100%;
    height: 100%;
    background: url('screen-7/bg.png') 50% 0% no-repeat;
}

.b-case-onlime .b-screen.n7 .e-collage {
    width: 745px;
    height: 335px;
    top: 123px;
    left: 655px;
    overflow: hidden;
}

.b-case-onlime .b-screen.n7 .e-collage I {
    transition-duration: 0s;
    top:110px;
    width: 1150px;
    height: 699px;
    left:-300px;
    background: url('screen-7/collage.jpg') 0% 0% no-repeat;
}

.b-case-onlime .b-screen.n7 .e-txt.n1 {
    top:150px;
    left:100px;
}

.b-case-onlime .b-screen.n7 .e-txt H5 {
    transition-duration: 1s;
    width: 0%;
    overflow: hidden;
    white-space: nowrap;
}

.b-case-onlime .b-screen.n7 .e-txt H5.active {
    width: 100%;
}

.b-case-onlime .b-screen.n7 .e-txt.n1.active {
    opacity: 1;
    top:50px;
}

.b-case-onlime .b-screen.n7 .e-txt.n2 {
    width: 470px;
    top:360px;
    left:100px;
}

.b-case-onlime .b-screen.n7 .e-txt.n2.active {
    opacity: 1;
    top:260px;
}

.b-case-onlime .b-screen.n7 .e-txt.n2 P {
    color:#859293;
    margin-bottom: 50px;
}


/* .b-screen.n8 ***********************************************************************************************************************************************/
.b-case-onlime .b-screen.n8{
    height: 1271px;
    background: url('screen-8/bg.jpg') 50% 0% no-repeat;
}

.b-case-onlime .b-screen.n8 .e-txt {
    top:290px;
    left:650px;
    text-align: center;
}

.b-case-onlime .b-screen.n8 .e-txt.active {
    opacity: 1;
    top:190px;
}

.b-case-onlime .b-screen.n8 .e-txt H5 {
    transition-duration: 1s;
    width: 0%;
    margin:0 auto;
    overflow: hidden;
    white-space: nowrap;
}

.b-case-onlime .b-screen.n8 .e-txt H5.active {
    width: 100%;
}

.b-case-onlime .b-screen.n8 .e-txt H2 {
    font-size: 48px;
    margin-top: 45px;
}

.b-case-onlime .b-screen.n8 .e-txt H2 BIG {
    line-height: 150px;
    font-size: 100px;
    color:#a7f212;
}

.b-case-onlime .b-screen.n8 .e-screenshot-1 {
    width: 379px;
    height: 553px;
    top:165px;
    left:220px;
    background: url('screen-8/screen_1.png') 50% 50% no-repeat;
    z-index: 3;
}

.b-case-onlime .b-screen.n8 .e-screenshot-2 {
    width: 339px;
    height: 503px;
    top:185px;
    left:250px;
    background: url('screen-8/screen_2.png') 50% 50% no-repeat;
    z-index: 2;
}

.b-case-onlime .b-screen.n8 .e-screenshot-3 {
    width: 299px;
    height: 463px;
    top:200px;
    left:300px;
    background: url('screen-8/screen_3.png') 50% 50% no-repeat;
    z-index: 1;
}

.b-case-onlime .b-screen.n8 .e-screenshot-2.active {
    left:270px;
}

.b-case-onlime .b-screen.n8 .e-screenshot-3.active {
    left:320px;
}

.b-case-onlime .b-screen.n8 .e-chart {
    width: 1400px;
    height: 546px;
    top:700px;
    left:0px;
    background: url('screen-8/chart.gif') 50% 50% no-repeat;
}


/* .b-screen.n9 ***********************************************************************************************************************************************/
.b-case-onlime .b-screen.n9{
    background: url('screen-9/bg.jpg') 50% 0% no-repeat;
    height: 1288px;
}

.b-case-onlime .b-screen.n9 .e-txt.n1 {
    z-index: 2;
    top:120px;
    left:430px;
    transform: rotateX(57deg) rotateY(-5deg) rotateZ(-42deg);
}

.b-case-onlime .b-screen.n9 .e-txt.n2 {
    transition-delay: 0.25s;
    transition-duration: 1s;
    width: 230px;
    z-index: 2;
    top: 375px;
    left: 790px;
    transform: scale(0.1) rotateX(57deg) rotateY(-5deg) rotateZ(-42deg);
}

.b-case-onlime .b-screen.n9 .e-txt.n2.active {
    transform: scale(1) rotateX(57deg) rotateY(-5deg) rotateZ(-42deg);
    opacity: 1;
}

.b-case-onlime .b-screen.n9 .e-txt.n2 H3 {
    color: #a7f212;
    font-family: 'GothamProBold';
    font-size: 36px;
}

.b-case-onlime .b-screen.n9 .e-txt.n2 P {
    text-transform: uppercase;
    font-family: 'GothamProBold';
    font-size: 21px;
    letter-spacing: 3px;
    margin: 5px 0 20px;
}

.b-case-onlime .b-screen.n9 .e-txt.n1.active {
    opacity: 1;
    top:-10px;
    left:230px;
}

.b-case-onlime .b-screen.n9 .e-txt.n1 H5 {
    transition-duration: 2s;
    font-size: 36px;
    width: 0%;
    overflow: hidden;
    white-space: nowrap;
}

.b-case-onlime .b-screen.n9 .e-txt.n1 H5.active {
    width: 100%;
}

.b-case-onlime .b-screen.n9 .e-txt.n1 H2 {
    font-size: 160px;
    letter-spacing: -6px;
}

.b-case-onlime .b-screen.n9 .e-phone {
    z-index: 2;
    width: 1162px;
    height: 719px;
    top:420px;
    left:-230px;
    background: url('screen-9/iphone.png') 50% 50% no-repeat;
}

.b-case-onlime .b-screen.n9 .e-circle {
    width: 1400px;
    height: 320px;
    top: 365px;
    left:0px;
}

.b-case-onlime .b-screen.n9 .e-circle.active {
    background: url('screen-9/circle.gif') 50% 50% no-repeat;  
}


/* .b-screen.n10 ***********************************************************************************************************************************************/
.b-case-onlime .b-screen.n10{
    height: 1895px;
    background: #f7f8f8 url('screen-10/bg.jpg') 50% 0% no-repeat;
}

.b-case-onlime .b-screen.n10 .e-txt {
    top:100px;
    left:995px;
}

.b-case-onlime .b-screen.n10 .e-txt H5 {
    transition-duration: 0.8s;
    width: 0%;
    overflow: hidden;
    white-space: nowrap;
}

.b-case-onlime .b-screen.n10 .e-txt H5.active {
    width: 100%;
}

.b-case-onlime .b-screen.n10 .e-txt.active {
    opacity: 1;
    top:0px;
}

.b-case-onlime .b-screen.n10 .e-arrow {
    opacity: 0;
    width: 0px;
    height: 0px;
    overflow: hidden;
    border-radius: 100%;
    top:275px;
    left:1025px;
    background: url('screen-10/arrow.png') 50% 50% no-repeat;
}

.b-case-onlime .b-screen.n10 .e-arrow.active {
    opacity: 1;
    width: 60px;
    height: 60px;
    top:245px;
    left:995px;
}

.b-case-onlime .b-screen.n10 .e-screenshot-1 {
    width: 849px;
    height: 1831px;
    top:-18px;
    left:70px;
    background: url('screen-10/screen_1.png') 50% 50% no-repeat;
    z-index: 3;
}

.b-case-onlime .b-screen.n10 .e-screenshot-2 {
    width: 849px;
    height: 1791px;
    top:0px;
    left:70px;
    background: url('screen-10/screen_2.png') 50% 50% no-repeat;
    z-index: 2;
}

.b-case-onlime .b-screen.n10 .e-screenshot-3 {
    width: 849px;
    height: 1751px;
    top:15px;
    left:70px;
    background: url('screen-10/screen_3.png') 50% 50% no-repeat;
    z-index: 1;
}

.b-case-onlime .b-screen.n10 .e-screenshot-2.active {
    left:80px;
}

.b-case-onlime .b-screen.n10 .e-screenshot-3.active {
    left:90px;
}

.b-case-onlime .b-screen.n10 .e-screenshot-4 {
    transform: scale(0.1);
    opacity: 0;
    width: 304px;
    height: 343px;
    top:490px;
    left:995px;
    background: url('screen-10/screen_4.png') 50% 50% no-repeat;
    z-index: 3;
}

.b-case-onlime .b-screen.n10 .e-screenshot-5 {
    transform: scale(0.1);
    opacity: 0;
    width: 363px;
    height: 418px;
    top:870px;
    left:965px;
    background: url('screen-10/screen_5.png') 50% 50% no-repeat;
    z-index: 2;
}

.b-case-onlime .b-screen.n10 .e-screenshot-6 {
    transform: scale(0.1);
    opacity: 0;
    width: 304px;
    height: 343px;
    top:1310px;
    left:995px;
    background: url('screen-10/screen_6.png') 50% 50% no-repeat;
    z-index: 1;
}


.b-case-onlime .b-screen.n10 .e-screenshot-4.active,
.b-case-onlime .b-screen.n10 .e-screenshot-5.active,
.b-case-onlime .b-screen.n10 .e-screenshot-6.active {
    transform: scale(1);
    opacity: 1;
}


/* .b-screen.n11 ***********************************************************************************************************************************************/
.b-case-onlime .b-screen.n11{
    height: 2200px;
    background: #f7f8f8 url('screen-11/bg.jpg') 50% 0% no-repeat;
}

.b-case-onlime .b-screen.n11 .e-txt.n1 {
    top:190px;
    left:100px;
}

.b-case-onlime .b-screen.n11 .e-txt.n1.active {
    opacity: 1;
    top:90px;
}

.b-case-onlime .b-screen.n11 .e-txt H5 {
    transition-duration: 2s;
    width: 0%;
    overflow: hidden;
    white-space: nowrap;
}

.b-case-onlime .b-screen.n11 .e-txt H5.active {
    width: 100%;
}

.b-case-onlime .b-screen.n11 .e-txt.n2 {
    top:610px;
    left:100px;
}

.b-case-onlime .b-screen.n11 .e-txt.n2.active {
    opacity: 1;
    top:510px;
}

.b-case-onlime .b-screen.n11 .e-screenshot-1 {
    width: 1260px;
    height: 1506px;
    top:588px;
    left:70px;
    background: url('screen-11/screen_1.png') 50% 50% no-repeat;
    z-index: 3;
}

.b-case-onlime .b-screen.n11 .e-screenshot-2 {
    width: 1260px;
    height: 1506px;
    top:598px;
    left:70px;
    background: url('screen-11/screen_2.png') 50% 50% no-repeat;
    z-index: 2;
}

.b-case-onlime .b-screen.n11 .e-screenshot-3 {
    width: 1260px;
    height: 1506px;
    top:608px;
    left:70px;
    background: url('screen-11/screen_3.png') 50% 50% no-repeat;
    z-index: 1;
}

/* .b-screen.n12 ***********************************************************************************************************************************************/
.b-case-onlime .b-screen.n12{
    height: 3866px;
    background: #f7f8f8 url('screen-12/bg.jpg') 50% 0% no-repeat;
}

.b-case-onlime .b-screen.n12 .e-txt {
    top:170px;
    left:100px;
}

.b-case-onlime .b-screen.n12 .e-txt.active {
    opacity: 1;
    top:70px;
}

.b-case-onlime .b-screen.n12 .e-txt H5 {
    transition-duration: 1s;
    width: 0%;
    overflow: hidden;
    white-space: nowrap;
}

.b-case-onlime .b-screen.n12 .e-txt H5.active {
    width: 100%;
}

.b-case-onlime .b-screen.n12 .e-txt.n2 {
    top:385px;
    left:100px;
}

.b-case-onlime .b-screen.n12 .e-txt.n2.active {
    top:285px;
}

.b-case-onlime .b-screen.n12 .e-txt.n2 P {
    color: #859293;
    width: 450px;
}

.b-case-onlime .b-screen.n12 .e-arrow {
    opacity: 0;
    width: 0px;
    height: 0px;
    overflow: hidden;
    border-radius: 100%;
    top:475px;
    left:130px;
    background: url('screen-10/arrow.png') 50% 50% no-repeat;
}

.b-case-onlime .b-screen.n12 .e-arrow.active {
    opacity: 1;
    width: 60px;
    height: 60px;
    top:445px;
    left:100px;
}


/* .b-screen.n13 ***********************************************************************************************************************************************/
.b-case-onlime .b-screen.n13{
    height: 2140px;
    background: #f7f8f8;
}

.b-case-onlime .b-screen.n13 .e-txt.n1 {
    top:-300px;
    left:100px;
}

.b-case-onlime .b-screen.n13 .e-txt.n1.active {
    opacity: 1;
    top:-400px;
}

.b-case-onlime .b-screen.n13 .e-txt H5 {
    transition-duration: 1s;
    width: 0%;
    overflow: hidden;
    white-space: nowrap;
}

.b-case-onlime .b-screen.n13 .e-txt H5.active {
    width: 100%;
}

.b-case-onlime .b-screen.n13 .e-txt.n2 {
    top:-200px;
    left:100px;
}

.b-case-onlime .b-screen.n13 .e-txt.n2.active {
    opacity: 1;
    top:-300px;
}

.b-case-onlime .b-screen.n13 .e-txt P {
    color: #859293;
    width: 450px;
    margin-top: 30px;
}

.b-case-onlime .b-screen.n13 .e-arrow {
    opacity: 0;
    width: 0px;
    height: 0px;
    overflow: hidden;
    border-radius: 100%;
    top:-130px;
    left:130px;
    background: url('screen-10/arrow.png') 50% 50% no-repeat;
}

.b-case-onlime .b-screen.n13 .e-arrow.active {
    opacity: 1;
    width: 60px;
    height: 60px;
    top:-100px;
    left:100px;
}

.b-case-onlime .b-screen.n13 .e-screenshot-1 {
    opacity: 0;
    width: 1198px;
    height: 359px;
    top:115px;
    left:100px;
    background: url('screen-13/screen_1.png') 50% 50% no-repeat;
    z-index: 4;
}

.b-case-onlime .b-screen.n13 .e-screenshot-2 {
    opacity: 0;
    width: 1120px;
    height: 429px;
    top:545px;
    left:100px;
    background: url('screen-13/screen_2.png') 50% 50% no-repeat;
    z-index: 3;
}

.b-case-onlime .b-screen.n13 .e-screenshot-3 {
    opacity: 0;
    width: 987px;
    height: 393px;
    top:1061px;
    left:100px;
    background: url('screen-13/screen_3.png') 50% 50% no-repeat;
    z-index: 2;
}

.b-case-onlime .b-screen.n13 .e-screenshot-1.active {
    opacity: 1;
    top:15px;
}

.b-case-onlime .b-screen.n13 .e-screenshot-2.active {
    opacity: 1;
    top:445px;
}

.b-case-onlime .b-screen.n13 .e-screenshot-3.active {
    opacity: 1;
    top:961px;
}

.b-case-onlime .b-screen.n13 .e-screenshot-4 {
    width: 1400px;
    height: 683px;
    top:1370px;
    left:0px;
    background: url('screen-13/screen_4.gif') 50% 50% no-repeat;
    z-index: 1;
}

/* .b-screen.n14 ***********************************************************************************************************************************************/
.b-case-onlime .b-screen.n14{
    height: 835px;
    background:#f7f8f8 url('screen-14/bg.png') 50% 50% no-repeat;
}

.b-case-onlime .b-screen.n14 .e-txt {
    width: 100%;
    top:375px;
    text-align: center;
}

.b-case-onlime .b-screen.n14 .e-txt.active {
    opacity: 1;
}